/**
 * Company Hub — Frontend Shortcode Styles
 *
 * Lightweight, mobile-first, no hardcoded fonts.
 * All sizes use rem/em. Colors use CSS custom properties with safe fallbacks.
 */

/* ── Contact Card ── */
.wch-contact {
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-size: 0.9375rem;
    line-height: 1.5;
}

.wch-contact--horizontal {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 16px;
}

.wch-contact__item {
    display: flex;
    align-items: center;
    gap: 8px;
}

.wch-contact__icon {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    font-size: 20px;
    line-height: 1;
    opacity: 0.65;
}

.wch-contact a {
    color: inherit;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

.wch-contact a:hover {
    text-decoration-thickness: 2px;
}

/* ── Hours Display ── */
.wch-hours {
    font-size: 0.9375rem;
    line-height: 1.5;
}

.wch-hours__status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8125rem;
    font-weight: 600;
    margin-bottom: 10px;
    padding: 4px 10px;
    border-radius: 20px;
}

.wch-hours__status--open {
    background: rgba(0, 163, 42, 0.1);
    color: #00a32a;
}

.wch-hours__status--closed {
    background: rgba(214, 54, 56, 0.1);
    color: #d63638;
}

.wch-hours__dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: currentColor;
    display: inline-block;
}

.wch-hours__status--open .wch-hours__dot {
    animation: wchPulse 2s infinite;
}

@keyframes wchPulse {
    0%, 100% { opacity: 1; }
    50%      { opacity: 0.4; }
}

.wch-hours__list {
    display: flex;
    flex-direction: column;
}

.wch-hours__row {
    display: flex;
    justify-content: space-between;
    padding: 6px 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.wch-hours__row:last-child {
    border-bottom: none;
}

.wch-hours__row--today {
    font-weight: 600;
    background: rgba(0, 163, 42, 0.04);
    margin: 0 -8px;
    padding: 6px 8px;
    border-radius: 4px;
}

.wch-hours__day {
    min-width: 100px;
}

.wch-hours__time {
    text-align: right;
}

/* Compact layout */
.wch-hours--compact .wch-hours__row {
    padding: 3px 0;
    font-size: 0.8125rem;
}

/* ── Social Icons ── */
.wch-social {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.wch-social__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: inherit;
    transition: opacity 0.2s, transform 0.2s;
    border-radius: 4px;
}

.wch-social__link:hover {
    opacity: 0.75;
    transform: translateY(-1px);
}

/* Style: icons-only */
.wch-social--icons .wch-social__name {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
}

.wch-social--icons .wch-social__link {
    width: 36px;
    height: 36px;
    background: rgba(0, 0, 0, 0.06);
    border-radius: 50%;
    font-size: 0;
}

/* Style: text */
.wch-social--text .wch-social__link {
    padding: 4px 12px;
    font-size: 0.8125rem;
}

/* Style: buttons */
.wch-social--buttons .wch-social__link {
    padding: 6px 14px;
    background: rgba(0, 0, 0, 0.06);
    border-radius: 20px;
    font-size: 0.8125rem;
}

/* Size variants */
.wch-social--small .wch-social__link { font-size: 0.75rem; }
.wch-social--small.wch-social--icons .wch-social__link { width: 28px; height: 28px; }

.wch-social--large .wch-social__link { font-size: 1rem; }
.wch-social--large.wch-social--icons .wch-social__link { width: 44px; height: 44px; }

/* Network colors (hover) */
.wch-social__link--facebook:hover  { color: #1877f2; }
.wch-social__link--instagram:hover { color: #e4405f; }
.wch-social__link--twitter:hover   { color: #1da1f2; }
.wch-social__link--linkedin:hover  { color: #0a66c2; }
.wch-social__link--youtube:hover   { color: #ff0000; }
.wch-social__link--tiktok:hover    { color: #010101; }
.wch-social__link--whatsapp:hover  { color: #25d366; }
.wch-social__link--telegram:hover  { color: #0088cc; }
.wch-social__link--google:hover    { color: #4285f4; }

/* ── Legal Links ── */
.wch-legal {
    font-size: 0.8125rem;
    line-height: 1.5;
}

.wch-legal__link {
    color: inherit;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

.wch-legal__link:hover {
    text-decoration-thickness: 2px;
}

/* ── Footer Notice ── */
.wch-footer-notice {
    display: inline;
    font-size: 0.8125rem;
    line-height: 1.6;
}

.wch-footer-notice__sep {
    margin: 0 0.15em;
    opacity: 0.5;
}

.wch-footer-notice__link {
    color: inherit;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

.wch-footer-notice__link:hover {
    text-decoration-thickness: 2px;
}

/* ── Address Block ── */
.wch-address {
    font-style: normal;
    font-size: 0.9375rem;
    line-height: 1.6;
}

.wch-address--inline {
    display: inline;
}

.wch-address__map-link {
    display: inline-block;
    margin-top: 4px;
    font-size: 0.8125rem;
    color: inherit;
    text-decoration: underline;
}

/* ── Impressum Block ── */
.wch-impressum {
    font-size: 0.9375rem;
    line-height: 1.6;
}

.wch-impressum__section {
    margin-bottom: 24px;
}

.wch-impressum__section:last-child {
    margin-bottom: 0;
}

.wch-impressum__section h3 {
    font-size: 1.125rem;
    font-weight: 600;
    margin: 0 0 8px;
}

.wch-impressum__section p {
    margin: 0 0 4px;
}

.wch-impressum__section a {
    color: inherit;
    text-decoration: underline;
}

/* ── Responsive ── */
@media (max-width: 480px) {
    .wch-contact--horizontal {
        flex-direction: column;
    }

    .wch-hours__day {
        min-width: 80px;
    }

    .wch-social--icons .wch-social__link {
        width: 44px;
        height: 44px;
    }
}
