/* ──────────────────────────────────────────────────────────────
   Accessibility fixes (WCAG 2.1/2.2 AA)
   - Touch targets, contrast, readable minimum font sizes
   - Profile cabinet sidebar, large-display scaling
   Kept in a dedicated file so it survives CSS bundle regeneration.
   ────────────────────────────────────────────────────────────── */

/* ── Skip link (WCAG 2.4.1) ── */
.skip-link {
    position: absolute;
    top: -100%;
    left: 0.75rem;
    z-index: 100000;
    padding: 0.65rem 1rem;
    background: #047a7c;
    color: #ffffff !important;
    font-weight: 600;
    font-size: 0.875rem;
    text-decoration: none;
    border-radius: 0 0 0.35rem 0.35rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
}

.skip-link:focus,
.skip-link:focus-visible {
    top: 0;
    outline: 3px solid #ffffff;
    outline-offset: 2px;
}

/* ── Keyboard focus ring (WCAG 2.4.7) — beats outline:none in style.css ── */
:focus {
    outline: none;
}

:focus-visible {
    outline: 3px solid #047a7c !important;
    outline-offset: 2px !important;
}

a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
    outline: 3px solid #047a7c !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 1px #ffffff;
}

.card-carousel__btn:focus-visible,
.listing-favorite-btn:focus-visible,
.mobile-menu-toggle:focus-visible {
    outline: 3px solid #047a7c !important;
    outline-offset: 2px !important;
}

/* ── Minimum readable UI chrome (badges, lang switcher, counters) ── */
.lang-btn,
.lang-btn span,
.country-dropdown-btn,
.country-name,
.notif-badge,
.notif-tab,
.zbids-count {
    font-size: max(0.75rem, 12px) !important;
}

.notif-badge {
    min-width: 20px;
    min-height: 20px;
}

/* Z-Bids count — strict circle (1–2 digits), not oval pill */
.zbids-count,
.nav-link--requests .zbids-count,
.nav-menu .nav-link.nav-link--requests .zbids-count {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    min-height: 20px !important;
    max-width: 20px !important;
    max-height: 20px !important;
    padding: 0 !important;
    font-size: max(0.75rem, 12px) !important;
    line-height: 1 !important;
    border-radius: 50% !important;
    aspect-ratio: 1 / 1 !important;
    flex-shrink: 0 !important;
}

/* ── Touch targets (Lighthouse tap-targets / WCAG 2.5.8) ── */
/* Lang switcher: keep compact pill from style.css — do NOT force 44×44 on
   .lang-btn / .lang-expand-btn (breaks the island + dropdown layout). */
.svc-card-cta {
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center;
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
}

/* Card hearts: compact visual size per thumbnail context + invisible 44px tap area */
:root {
    --z-fav-btn-size: 24px;
    --z-fav-icon-size: 12px;
}

.hero-search-card-wrap,
.hero-search-card__media {
    --z-fav-btn-size: 20px;
    --z-fav-icon-size: 10px;
}

.listing-favorite-btn--sr,
.sr-card-wrapper > .listing-favorite-btn,
.sr-card-wrapper > a.listing-favorite-btn {
    --z-fav-btn-size: 22px;
    --z-fav-icon-size: 11px;
}

.listing-favorite-btn--svc,
.listing-favorite-btn--featured,
.listing-favorite-btn--nearby,
.rv-nearby-card-wrap {
  --z-fav-btn-size: 26px;
  --z-fav-icon-size: 13px;
}

.listing-favorite-btn--detail {
    --z-fav-btn-size: 28px;
    --z-fav-icon-size: 14px;
}

.compass-card-wrap,
.compass-main-card-wrap,
.compass-side-card-wrap,
.listing-favorite-btn--compass,
.listing-favorite-btn--home-news,
.listing-favorite-btn--news-detail,
.listing-favorite-btn--promo-lux,
.news-favorite-btn {
    --z-fav-btn-size: 24px;
    --z-fav-icon-size: 12px;
}

@media (max-width: 768px) {
    .listing-favorite-btn--detail {
        --z-fav-btn-size: 24px;
        --z-fav-icon-size: 12px;
    }
}

.listing-favorite-btn,
a.listing-favorite-btn,
button.listing-favorite-btn,
.news-favorite-btn {
    width: var(--z-fav-btn-size, 24px) !important;
    height: var(--z-fav-btn-size, 24px) !important;
    min-width: var(--z-fav-btn-size, 24px) !important;
    min-height: var(--z-fav-btn-size, 24px) !important;
    max-width: var(--z-fav-btn-size, 24px) !important;
    max-height: var(--z-fav-btn-size, 24px) !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

.listing-favorite-btn .listing-favorite-btn__icon,
a.listing-favorite-btn .listing-favorite-btn__icon,
.news-favorite-btn .listing-favorite-btn__icon {
    width: var(--z-fav-icon-size, 12px) !important;
    height: var(--z-fav-icon-size, 12px) !important;
    max-width: var(--z-fav-icon-size, 12px) !important;
    max-height: var(--z-fav-icon-size, 12px) !important;
}

.listing-favorite-btn::before,
a.listing-favorite-btn::before,
button.listing-favorite-btn::before,
.news-favorite-btn::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 44px;
    height: 44px;
    transform: translate(-50%, -50%);
}

.footer-about-blurb,
.footer-bottom p,
.footer-regulatory__intro,
.footer-regulatory__summary,
.footer-regulatory__expand-label,
.footer-regulatory__chev,
.footer-regulatory__more {
    color: #ffffff !important;
    opacity: 1 !important;
}

.footer-links li {
    margin: 0 !important;
}

@media (max-width: 768px) {
    .footer-links a,
    .footer-link-btn {
        min-height: 44px !important;
        display: inline-flex !important;
        align-items: center;
        padding-top: 0.35rem !important;
        padding-bottom: 0.35rem !important;
        color: #ffffff !important;
        opacity: 1 !important;
        font-weight: var(--site-footer-link-weight, 400) !important;
    }
}

/* Desktop nav rail — beat client-display-pc min-height:0 !important */
@media (min-width: 768px) {
    .header .nav-container:has(> .nav-menu.nav-main-rail) .nav-menu.nav-main-rail > li.nav-main-rail__item > .nav-link,
    .nav-menu.nav-main-rail > li.nav-main-rail__item > .nav-link {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-height: 44px !important;
        height: auto !important;
        padding-top: 0.55rem !important;
        padding-bottom: 0.55rem !important;
        box-sizing: border-box !important;
    }
}

/* Hero search field — keep the whole pill comfortably tappable */
.search-box .search-input,
#heroSearchInput {
    min-height: 44px;
}

#profileMapSearchBtn {
    min-width: 44px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}

/* ── Lang switcher: WCAG contrast only — layout stays in style.css / client-display-pc ── */
.language-switcher .lang-btn.active,
.nav-container .language-switcher .lang-btn.active,
.nav-actions .language-switcher .lang-btn.active,
.language-switcher a.lang-btn.active {
    background: #047a7c !important;
    background-color: #047a7c !important;
    color: #ffffff !important;
}

.language-switcher .lang-btn.active span,
.language-switcher a.lang-btn.active span {
    color: #ffffff !important;
}

/* Dropdown rows — comfortable tap; pill + expand tab unchanged */
.lang-dropdown-menu .lang-option {
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
}

.home-ai-promo-section .home-ai-promo-actions .btn-secondary {
    color: #046868 !important;
}

.home-ai-promo-section .home-ai-promo-actions .btn-secondary:hover {
    color: #034f4f !important;
}

.seo-about__badge {
    color: #046868 !important;
    border-color: rgba(4, 104, 104, 0.32) !important;
}

.footer-official-guide__btn {
    color: #046868 !important;
}

/* ── Contrast: teal text/links on white (WCAG AA ≥ 4.5:1) ── */
.category-count span:first-child,
.homepage-categories-section .category-grid .category-count span:first-child,
.category-count span:last-child,
.svc-card-cta,
a.svc-card-cta,
.services-body .svc-card-cta,
.homepage-featured-grid .svc-card-cta {
    color: #046868 !important;
}

.svc-card-cta:hover,
a.svc-card-cta:hover {
    color: #034f4f !important;
}

body.profile-cabinet-page .pp-info-value--success,
.profile-container .pp-info-value--success,
.pp-status--success {
    color: #0d5c40 !important;
}

body.profile-cabinet-page .pp-btn-secondary,
.profile-container .pp-btn-secondary {
    color: #046868 !important;
    border-color: #046868 !important;
}

/* Footer section titles switched from <h4> to <h2.footer-heading> for correct
   heading order — neutralise default <h2> UA sizing/margins so the visual
   design is unchanged (font-size/color come from .footer-section rules). */
.footer-section .footer-heading {
    margin-top: 0;
}

/* ── Profile cabinet: avatar text on teal/ocean header ── */
body.profile-cabinet-page .profile-avatar h3,
body.profile-cabinet-page .profile-avatar p,
body.profile-cabinet-page .profile-avatar .u-inline-8e378478,
body.profile-cabinet-page .profile-avatar .u-inline-90da3716 {
    color: #ffffff !important;
}

body.profile-cabinet-page .profile-avatar p,
body.profile-cabinet-page .profile-avatar .u-inline-90da3716 {
    opacity: 0.92;
}

/* Sidebar active nav — darker text for 4.5:1 on soft ocean background */
body.profile-cabinet-page .profile-nav-item.active,
body.profile-cabinet-page .profile-nav-group.is-active .profile-nav-group__label {
    color: #0a4f4f !important;
    font-weight: 700;
}

/* Premium / status badges on avatar — keep legible on colored header */
body.profile-cabinet-page .premium-avatar-badge {
    color: #ffffff !important;
}

/* ── Large displays (4K TV, projectors, ultra-wide) ──
   Complements large-screens.css; scales rem-based UI for distance viewing. */
@media (min-width: 2500px) {
    html {
        font-size: 120%;
    }
}

@media (min-width: 3800px) {
    html {
        font-size: 125%;
    }
}

/* ── Footer tablet/desktop: ровные отступы между строками (Terms, Privacy и др.) ── */
@media (min-width: 769px) {
    .footer-links {
        gap: var(--site-footer-link-gap, 0.5rem) !important;
    }

    .footer-links li {
        margin: 0 !important;
        line-height: var(--site-footer-link-line-height, 1.45) !important;
    }

    .footer-links a,
    .footer-link-btn {
        min-height: 0 !important;
        height: auto !important;
        padding: 0 !important;
        display: inline !important;
        line-height: var(--site-footer-link-line-height, 1.45) !important;
        font-weight: var(--site-footer-link-weight, 400) !important;
    }

    .footer-content,
    .footer-bottom,
    .footer-regulatory,
    .footer-official-guide {
        padding-left: var(--catalog-rail-px, 12px) !important;
        padding-right: var(--catalog-rail-px, 12px) !important;
    }
}

/* ── Z-Bids badge: inline после текста — 2px зазор справа от последней буквы ── */
.nav-link.nav-link--requests,
.nav-link--requests {
    position: relative !important;
    overflow: visible !important;
    padding-right: 0.55rem !important;
}

.nav-link--requests .zbids-count,
.nav-menu .nav-link.nav-link--requests .zbids-count,
.zbids-count {
    position: relative !important;
    top: -0.68em !important;
    left: auto !important;
    right: auto !important;
    margin-left: 2px !important;
    vertical-align: baseline !important;
    transform: none !important;
    transform-origin: center center !important;
    animation: zbids-count-pulse-inline 2s ease-in-out infinite !important;
}

@keyframes zbids-count-pulse-inline {
    0%,
    100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
}

@media (prefers-reduced-motion: reduce) {
    .nav-link--requests .zbids-count,
    .nav-menu .nav-link.nav-link--requests .zbids-count,
    .zbids-count {
        animation: none !important;
    }
}

/* Mobile slide-out menu: крупнее шрифт — те же 2px от конца текста */
@media (max-width: 768px) {
    .nav-menu .nav-link.nav-link--requests .zbids-count {
        top: -0.62em !important;
        margin-left: 2px !important;
    }

    .notif-badge,
    .notif-badge.notif-badge--visible,
    .notif-badge-mobile {
        top: -0.62em !important;
    }
}

/* Уведомления: иконка + 20×20 кругляш в одну линию (как Z-Bids после текста).
   Важно: .header-icon-btn фиксирует 28×28 — без width:auto бейдж сжимает SVG в 0. */
.notif-bell-btn.header-icon-btn,
.mobile-notif-btn.mobile-icon-btn,
.notif-bell-btn,
.mobile-notif-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;
    gap: 0 !important;
    overflow: visible !important;
    width: auto !important;
    min-width: 28px !important;
    height: 28px !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
    box-sizing: border-box !important;
    color: var(--z-gray-950, #0f172a) !important;
}

.notif-bell-btn svg,
.mobile-notif-btn svg {
    flex-shrink: 0 !important;
    width: 18px !important;
    height: 18px !important;
    display: block !important;
}

.notif-badge,
.notif-badge.notif-badge--visible,
.notif-badge-mobile {
    /* Тот же вертикальный nudge, что у .zbids-count — одна горизонталь в шапке */
    position: relative !important;
    top: -0.68em !important;
    right: auto !important;
    left: auto !important;
    transform: none !important;
    transform-origin: center center !important;
    display: none;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    min-height: 20px !important;
    max-width: 20px !important;
    max-height: 20px !important;
    padding: 0 !important;
    margin: 0 0 0 2px !important;
    font-size: max(0.75rem, 12px) !important;
    line-height: 1 !important;
    border-radius: 50% !important;
    aspect-ratio: 1 / 1 !important;
    flex-shrink: 0 !important;
    vertical-align: baseline !important;
    align-self: center !important;
}

.notif-badge.notif-badge--visible,
.notif-badge-mobile.notif-badge--visible {
    display: inline-flex !important;
}

@keyframes notif-pulse {
    0%,
    100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
}

/* Soft geo refresh: dim main while listings/banners re-fetch */
#main-content.geo-content-loading {
    opacity: 0.55;
    pointer-events: none;
    transition: opacity 0.2s ease;
}
