/* WallCity - סגנון ראשי */

:root {
    --wc-primary:   #0091d1;   /* תכלת עשיר - בולט על לבן (משפחת הלוגו, מעט עמוק יותר) */
    --wc-primary-d: #0073a8;   /* תכלת כהה - לינקים/hover, ניגודיות טובה על לבן */
    --wc-primary-l: #38bdf8;
    --wc-primary-50:#e6f4fb;
    --wc-primary-100:#cfe8f8;
    --wc-accent:    #00aeef;
    --wc-accent-d:  #008bc2;
    --wc-success:   #16a34a;
    --wc-danger:    #dc2626;
    --wc-bg:        #f6f7fb;
    --wc-card-bg:   #ffffff;
    --wc-border:    #e6e8ee;
    --wc-border-2:  #eef0f4;
    --wc-text:      #0f172a;
    --wc-text-2:    #1e293b;
    --wc-muted:     #64748b;
    --wc-muted-2:   #94a3b8;

    --wc-radius-sm: 8px;
    --wc-radius:    12px;
    --wc-radius-lg: 18px;

    --wc-shadow-xs: 0 1px 2px rgba(15, 23, 42, .04);
    --wc-shadow:    0 1px 2px rgba(15, 23, 42, .04), 0 4px 14px rgba(15, 23, 42, .06);
    --wc-shadow-h:  0 4px 16px rgba(15, 23, 42, .08), 0 14px 38px rgba(15, 23, 42, .08);
    --wc-shadow-lg: 0 24px 60px -12px rgba(15, 23, 42, .25);
}

* { box-sizing: border-box; }

html, body {
    font-family: 'Rubik', system-ui, -apple-system, sans-serif;
    background: var(--wc-bg);
    color: var(--wc-text);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    letter-spacing: -.01em;
}

html { scroll-behavior: smooth; }
body { text-rendering: optimizeLegibility; }

h1, h2, h3, h4, h5, h6 { color: var(--wc-text); letter-spacing: -.02em; }
/* כותרות ראשיות - משקל כבד אמיתי (Rubik 800) לגימור פרימיום, לא bold מסונתז */
h1, .h1 { font-weight: 800; }
h2, .h2 { font-weight: 700; }

a { color: var(--wc-primary-d); text-decoration: none; transition: color .15s ease; }
a:hover { color: var(--wc-primary); }

::selection { background: var(--wc-primary-50); color: var(--wc-primary-d); }

/* ===== גימור פרימיום גלובלי ===== */
/* טבעת פוקוס נגישה ועקבית - מחליפה את ה-outline הכחול הגנרי של הדפדפן */
:where(a, button, .btn, input, select, textarea, [tabindex]):focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(0, 145, 209, .35);
}
/* פס גלילה עדין ומותג */
* { scrollbar-width: thin; scrollbar-color: var(--wc-muted-2) transparent; }
::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-thumb {
    background: #c5cbd6;
    border-radius: 999px;
    border: 3px solid var(--wc-bg);
}
::-webkit-scrollbar-thumb:hover { background: var(--wc-muted-2); }
::-webkit-scrollbar-track { background: transparent; }
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    * { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}

/* ===== Theme bridges (Bootstrap overrides) ===== */
.bg-primary       { background-color: var(--wc-primary) !important; }
.text-primary     { color: var(--wc-primary) !important; }
.text-muted-2     { color: var(--wc-muted) !important; }
.text-danger      { color: var(--wc-danger) !important; }

/* ===== Buttons ===== */
.btn {
    font-weight: 500;
    border-radius: 10px;
    padding: .55rem 1.1rem;
    transition: transform .12s ease, box-shadow .15s ease, background-color .15s ease, border-color .15s ease, color .15s ease;
}
.btn:active { transform: translateY(1px); }
.btn-lg { padding: .75rem 1.5rem; font-size: 1rem; }
.btn-sm { padding: .35rem .8rem; font-size: .8rem; }

.btn-primary {
    background-color: var(--wc-primary);
    border-color: var(--wc-primary);
    box-shadow: 0 1px 0 rgba(255,255,255,.15) inset, 0 2px 8px rgba(0,145,209,.30);
}
.btn-primary:hover, .btn-primary:focus {
    background-color: var(--wc-primary-d);
    border-color: var(--wc-primary-d);
    box-shadow: 0 4px 14px rgba(0,145,209,.40);
}

.btn-warning {
    background-color: var(--wc-accent);
    border-color: var(--wc-accent);
    color: #fff;
    box-shadow: 0 2px 8px rgba(0,174,239,.3);
}
.btn-warning:hover, .btn-warning:focus {
    background-color: var(--wc-accent-d);
    border-color: var(--wc-accent-d);
    color: #fff;
    box-shadow: 0 4px 14px rgba(0,174,239,.4);
}

/* ===== כפתור "פרסם מודעה" - פרימיום בצבעי הלוגו ===== */
.btn-publish {
    --pub-shadow: 0 6px 18px rgba(0,145,209,.34);
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .5rem 1.25rem;
    border: 0;
    color: #fff;
    letter-spacing: -.01em;
    background: linear-gradient(135deg, var(--wc-primary-l) 0%, var(--wc-primary) 52%, var(--wc-primary-d) 100%);
    box-shadow: var(--pub-shadow), inset 0 1px 0 rgba(255,255,255,.28);
    overflow: hidden;
    isolation: isolate;
}
/* ניצוץ עדין שעובר על הכפתור ב-hover - גימור פרימיום */
.btn-publish::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg, transparent 25%, rgba(255,255,255,.35) 50%, transparent 75%);
    transform: translateX(-130%);
    transition: transform .6s ease;
    z-index: -1;
}
.btn-publish:hover, .btn-publish:focus {
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 10px 26px rgba(0,145,209,.46), inset 0 1px 0 rgba(255,255,255,.32);
}
.btn-publish:hover::before { transform: translateX(130%); }
.btn-publish:active { transform: translateY(0); box-shadow: 0 4px 12px rgba(0,145,209,.32); }
/* Plus icon without a separate background. */
.btn-publish-plus {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    background: transparent;
    font-size: .78em;
}

.btn-outline-secondary {
    color: var(--wc-text-2);
    border-color: var(--wc-border);
    background: #fff;
}
.btn-outline-secondary:hover {
    background: #f3f4f7;
    color: var(--wc-text);
    border-color: #d1d5db;
}

.btn-light {
    background: #fff;
    border-color: var(--wc-border);
    color: var(--wc-text);
}
.btn-light:hover { background: #f3f4f7; }

.rounded-pill { border-radius: 50px !important; }

/* ===== Desktop navbar: דחיפת פריטי המשתמש לקצה הנגדי של הלוגו ===== */
@media (min-width: 992px) {
    .navbar .navbar-collapse {
        flex: 1 1 auto;
    }
    .navbar .navbar-collapse > .navbar-nav {
        margin-inline-start: auto !important;
    }
}

/* ===== Mobile navbar ===== */
@media (max-width: 991.98px) {
    /* ההמבורגר בצד ימין (start ב-RTL), הלוגו ממורכז */
    .navbar.bg-primary > .container { position: relative; }
    /* הסרת הקו המפריד בין הנאבבר לרצועת הקטגוריות - הכחול האחיד נמשך ללא חיתוך */
    .navbar.bg-primary { border-bottom: 0; }
    .navbar > .container > .navbar-brand {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        margin: 0;
        pointer-events: auto;
    }
    /* אורח: אין המבורגר שיאזן את הלוגו הממורכז, ולכן הוא מתנגש בכפתורי
       "פרסם"/"התחברות" במסכים צרים. במצב זה מחזירים את הלוגו לזרימה רגילה
       (צמוד לקצה ההתחלה) והפעולות נדחפות לקצה הנגדי - בלי חפיפה. */
    .navbar > .container:has(.nav-auth-mobile) > .navbar-brand {
        position: static;
        transform: none;
        margin: 0;
        flex-shrink: 0;
    }
    .navbar .navbar-collapse {
        background: var(--wc-primary);
        margin: 0;
        padding: 12px 16px 16px;
        border-radius: 0 0 16px 16px;
        box-shadow: 0 14px 30px rgba(0,0,0,.18);
    }
    .navbar .navbar-collapse .navbar-nav { gap: 2px; }
    .navbar .navbar-collapse .nav-link {
        padding: 10px 12px;
        border-radius: 8px;
        color: rgba(255,255,255,.92);
        font-weight: 500;
    }
    .navbar .navbar-collapse .nav-link:hover {
        background: rgba(255,255,255,.1);
        color: #fff;
    }
    .navbar .navbar-collapse .nav-link .fa-fw { color: rgba(255,255,255,.7); }
    .navbar .navbar-collapse hr {
        border-color: rgba(255,255,255,.15);
        opacity: 1;
    }
}

/* ===== Logo ===== */
.site-logo {
    height: 56px;
    width: auto;
    display: block;
    transition: transform .15s ease;
}
.navbar-brand:hover .site-logo { transform: scale(1.04); }

.footer-logo {
    height: 56px;
    width: auto;
    display: block;
}

.admin-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 18px 14px;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: -.01em;
    border-bottom: 1px solid rgba(255,255,255,.06);
    margin-bottom: 8px;
}
.admin-logo {
    height: 38px;
    width: auto;
}

/* ===== Navbar ===== */
.navbar.sticky-top { z-index: 1040; }
.navbar .dropdown-menu { z-index: 1050; }
.navbar.bg-primary {
    background: var(--wc-primary) !important;
    border-bottom: 1px solid rgba(255,255,255,.06);
    padding-top: .35rem;
    padding-bottom: .35rem;
    height: 64px;
    min-height: 64px;
}
.navbar.bg-primary .container {
    align-items: center;
    height: 100%;
}
/* במובייל: התפריט הקופץ של ההמבורגר נשלף מחוץ ל-navbar כך שהוא לא משנה את גובהו */
@media (max-width: 991.98px) {
    /* padding אנכי 0 כדי שה-container ימלא את כל גובה הנאבבר (68px) -
       אחרת התפריט (top:100%) נפתח בתוך הנאבבר ועולה על הלוגו */
    .navbar.bg-primary { overflow: visible; padding-top: 0; padding-bottom: 0; }
    .navbar.bg-primary .navbar-collapse {
        position: absolute;
        top: 100%;
        right: 0;
        left: 0;
        z-index: 1041;
        /* התפריט עלול להיות גבוה מהמסך (חשבון עסקי/אדמין) - מגבילים לגובה החלון
           ומאפשרים גלילה פנימית כדי שהפריטים התחתונים לא ייחתכו */
        max-height: calc(100vh - 64px);
        max-height: calc(100dvh - 64px);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
    }
}
/* מונע layout-shift כשמופיע scrollbar */
html { scrollbar-gutter: stable; }

.dropdown-menu {
    border: 1px solid var(--wc-border);
    border-radius: var(--wc-radius-sm);
    box-shadow: var(--wc-shadow-h);
    padding: .35rem;
    min-width: 200px;
}
.dropdown-menu .dropdown-item {
    border-radius: 6px;
    padding: .5rem .75rem;
    font-size: 14px;
    font-weight: 500;
    color: var(--wc-text-2);
    transition: background-color .12s ease, color .12s ease;
}
.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus {
    background: var(--wc-primary-50);
    color: var(--wc-primary-d);
}
.dropdown-menu .dropdown-item.text-danger:hover { background: #fef2f2; color: var(--wc-danger); }
.dropdown-menu .dropdown-divider { border-color: var(--wc-border-2); margin: .35rem 0; }
.navbar .navbar-brand {
    font-weight: 700;
    letter-spacing: -.02em;
}
.navbar .nav-link { font-weight: 500; }
.navbar .btn-warning { box-shadow: 0 2px 12px rgba(0,174,239,.45); }

/* ===== כפתורי פעולה בנאבבר (צ'אט + התראות) במובייל - בצד הנגדי להמבורגר ===== */
.nav-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-inline-start: auto; /* דוחף לצד הנגדי של ההמבורגר */
    flex-shrink: 0;
}

/* ===== כניסה/הרשמה ליד הלוגו (מובייל, אורח) ===== */
.nav-auth-mobile { gap: 8px; }
.nav-auth-link {
    color: #fff;
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
    padding: 6px 6px;
    white-space: nowrap;
    transition: opacity .15s ease;
}
.nav-auth-link:hover,
.nav-auth-link:focus { color: #fff; opacity: .85; }
.nav-auth-pill {
    color: var(--wc-primary);
    background: #fff;
    font-weight: 700;
    font-size: 14px;
    line-height: 1;
    padding: 8px 14px;
    border-radius: 999px;
    text-decoration: none;
    white-space: nowrap;
    transition: transform .12s ease, background-color .15s ease;
}
.nav-auth-pill:hover,
.nav-auth-pill:focus { color: var(--wc-primary-d); background: #fff; }
.nav-auth-pill:active { transform: scale(.96); }
/* מסך זעיר: לצמצם ריווח כדי לא להתנגש בלוגו הממורכז */
@media (max-width: 360px) {
    .nav-auth-mobile { gap: 5px; }
    .nav-auth-link { font-size: 13px; padding: 6px 3px; }
    .nav-auth-pill { font-size: 13px; padding: 7px 11px; }
    /* במצב אורח הלוגו בזרימה - מקטינים מעט כדי שיישאר מקום לכפתורים */
    .navbar > .container:has(.nav-auth-mobile) .site-logo { height: 46px; }
}

.nav-chat-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 11px;
    background: rgba(255,255,255,.10);
    color: #fff;
    text-decoration: none;
    flex-shrink: 0;
    transition: background-color .15s ease, transform .12s ease;
}
.nav-chat-btn:hover,
.nav-chat-btn:active { background: rgba(255,255,255,.18); color: #fff; }
.nav-chat-btn:active { transform: scale(.96); }
.nav-chat-btn:focus  { outline: 2px solid rgba(255,255,255,.4); outline-offset: 2px; }
.nav-chat-btn i { font-size: 18px; line-height: 1; }
.nav-chat-btn .nav-chat-badge {
    position: absolute;
    top: -4px;
    inset-inline-start: -4px;
    font-size: 10px;
    font-weight: 700;
    min-width: 18px;
    padding: 2px 6px;
    line-height: 1.2;
    border: 2px solid var(--wc-primary);
}

/* ===== Custom navbar toggler - מחליף את ברירת המחדל של Bootstrap עם 3 פסים נקיים ===== */
/* רק במובייל - בדסקטופ Bootstrap מסתיר את הכפתור ב-display:none, ואין צורך להתערב. */
@media (max-width: 991.98px) {
    .navbar-dark .navbar-toggler {
        border: 0;
        padding: 0;
        width: 42px;
        height: 42px;
        background: rgba(255,255,255,.10);
        border-radius: 11px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        transition: background-color .15s ease, transform .12s ease;
    }
    .navbar-dark .navbar-toggler:hover  { background: rgba(255,255,255,.18); }
    .navbar-dark .navbar-toggler:active { transform: scale(.96); }
    .navbar-dark .navbar-toggler:focus  { box-shadow: none; outline: 2px solid rgba(255,255,255,.4); outline-offset: 2px; }
    .navbar-dark .navbar-toggler[aria-expanded="true"] { background: rgba(255,255,255,.22); }
    .navbar-dark .navbar-toggler-icon {
        width: 18px;
        height: 14px;
        background-image: none;
        background-color: transparent;
        border-top: 2px solid #fff;
        border-bottom: 2px solid #fff;
        position: relative;
        border-radius: 1px;
    }
    .navbar-dark .navbar-toggler-icon::before {
        content: "";
        position: absolute;
        inset-inline: 0;
        top: 50%;
        height: 2px;
        background: #fff;
        transform: translateY(-50%);
        border-radius: 1px;
    }
}

/* ===== Modern navbar search ===== */
.nav-search {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    background: rgba(255,255,255,.13);
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 14px;
    padding: 5px 5px 5px 14px;
    transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
    backdrop-filter: blur(8px);
}

/* ===== Autocomplete dropdown ===== */
.nav-suggest-dropdown {
    position: absolute;
    top: calc(100% + 6px);
    inset-inline: 0;
    z-index: 1050;
    background: #fff;
    color: var(--wc-text);
    border: 1px solid var(--wc-border);
    border-radius: 14px;
    box-shadow: 0 24px 60px rgba(2,6,23,.22);
    max-height: 70vh;
    overflow-y: auto;
    padding: 6px;
}
.nav-suggest-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 10px;
    border-radius: 10px;
    text-decoration: none;
    color: var(--wc-text);
    transition: background-color .12s ease;
}
.nav-suggest-item:hover,
.nav-suggest-item.is-active {
    background: var(--wc-primary-50, #e6f4fb);
    color: var(--wc-text);
}
.nav-suggest-item .ns-icon {
    flex: 0 0 40px;
    width: 40px; height: 40px;
    border-radius: 8px;
    background: #f3f4f6;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    color: var(--wc-primary-d, #0073a8);
}
.nav-suggest-item .ns-icon img {
    width: 100%; height: 100%; object-fit: cover;
}
.nav-suggest-item .ns-text { flex: 1; min-width: 0; }
.nav-suggest-item .ns-label {
    font-weight: 600;
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.nav-suggest-item .ns-meta {
    font-size: 12px;
    color: var(--wc-muted, #6b7280);
    margin-top: 2px;
}
.nav-suggest-empty {
    padding: 14px;
    text-align: center;
    color: var(--wc-muted, #6b7280);
    font-size: 13px;
}
.nav-suggest-all {
    display: block;
    padding: 10px 12px;
    margin-top: 4px;
    border-top: 1px solid var(--wc-border);
    text-align: center;
    font-weight: 600;
    color: var(--wc-primary, #0091d1);
    text-decoration: none;
}
.nav-suggest-all:hover { background: var(--wc-primary-50, #e6f4fb); }
.nav-search:hover {
    background: rgba(255,255,255,.18);
    border-color: rgba(255,255,255,.28);
}
.nav-search:focus-within {
    background: #fff;
    border-color: #fff;
    box-shadow: 0 0 0 4px rgba(255,255,255,.2), 0 10px 30px rgba(15,23,42,.18);
}
.nav-search:focus-within .nav-search-icon { color: var(--wc-muted); }
.nav-search:focus-within .nav-search-input { color: var(--wc-text); }
.nav-search:focus-within .nav-search-input::placeholder { color: var(--wc-muted-2); }

.nav-search-icon {
    color: rgba(255,255,255,.75);
    font-size: 15px;
    margin-inline-end: 10px;
    transition: color .15s ease;
    flex-shrink: 0;
}

.nav-search-input {
    flex: 1;
    border: 0;
    outline: 0;
    background: transparent;
    color: #fff;
    font-size: 14.5px;
    font-weight: 500;
    padding: 8px 0;
    min-width: 0;
    font-family: inherit;
}
.nav-search-input::placeholder {
    color: rgba(255,255,255,.65);
    font-weight: 400;
}
.nav-search-input::-webkit-search-cancel-button { display: none; }

.nav-search-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--wc-accent);
    color: #fff;
    border: 0;
    border-radius: 10px;
    padding: 7px 16px;
    font-weight: 600;
    font-size: 13.5px;
    cursor: pointer;
    transition: background-color .15s ease, transform .12s ease;
    flex-shrink: 0;
}
.nav-search-btn:hover {
    background: var(--wc-accent-d);
}
.nav-search-btn:active { transform: translateY(1px); }

.nav-search-kbd {
    background: rgba(255,255,255,.22);
    border-radius: 6px;
    padding: 1px 6px;
    font-size: 11px;
    font-family: inherit;
    font-weight: 600;
    color: #fff;
}
.nav-search:focus-within .nav-search-btn { background: var(--wc-primary); }
.nav-search:focus-within .nav-search-btn:hover { background: var(--wc-primary-d); }

/* Category strip - sticky צמוד ל-navbar */
.category-strip {
    position: sticky;
    top: 64px; /* גובה ה-navbar בדיוק */
    z-index: 1030;
    background: #fff !important;
    min-height: 40px;
}
.category-strip .container { min-height: 28px; }

/* ===== Mobile: שורת חיפוש - באזור התוכן הלבן, לא דביקה לנאבבר ===== */
.mobile-search-bar {
    position: relative;
    background: transparent;
    padding: 14px 14px 6px;
    box-sizing: border-box;
    flex-shrink: 0;
    display: block;
}
.mobile-search-bar > form { width: 100%; }
.nav-search-mobile {
    padding: 5px 5px 5px 14px;
    background: var(--wc-card-bg);
    border: 1px solid var(--wc-border);
    border-radius: 14px;
    box-shadow: 0 2px 10px rgba(15,23,42,.05);
    transition: border-color .15s ease, box-shadow .15s ease;
    backdrop-filter: none;
}
.nav-search-mobile:focus-within {
    border-color: var(--wc-primary);
    box-shadow: 0 0 0 4px rgba(0, 145, 209,.10), 0 4px 14px rgba(15,23,42,.06);
}
.nav-search-mobile .nav-search-icon {
    color: var(--wc-muted);
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    height: 100%;
    margin-inline-end: 6px;
}
.nav-search-mobile .nav-search-input {
    color: var(--wc-text);
    font-size: 14.5px;
    line-height: 1.2;
    padding: 8px 0;
    background: transparent;
}
.nav-search-mobile .nav-search-input::placeholder {
    color: var(--wc-muted-2);
    font-weight: 400;
}
.nav-search-mobile .nav-search-btn {
    padding: 8px 14px;
    min-width: 40px;
    justify-content: center;
    background: var(--wc-primary);
    color: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 12px rgba(0, 145, 209,.28);
}
.nav-search-mobile .nav-search-btn:hover,
.nav-search-mobile .nav-search-btn:active { background: var(--wc-primary-d); color: #fff; }
.nav-search-mobile:focus-within .nav-search-btn { background: var(--wc-primary-d); }

.mobile-cats-strip {
    position: sticky;
    top: 124px; /* navbar 64 + mobile-search 60 - נדרס ל-64px כשאין שורת חיפוש (ראו כלל ה-+) */
    z-index: 1032;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 10px 14px;
    background: var(--wc-primary);
    border-bottom: 0;
    box-shadow: none;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
    height: 106px;
    min-height: 106px;
    padding: 0 12px;
    gap: 4px;
    align-items: center;
    box-sizing: border-box;
    flex-shrink: 0;
}
.mobile-cats-strip::-webkit-scrollbar { display: none; }

/* הסתרה חכמה בגלילה: בגלילה למטה הרצועה נתחבת מאחורי הנאבבר ומשחררת מקום למודעות,
   בגלילה למעלה היא חוזרת. נשלט ע"י main.js (.is-tucked). */
.mobile-cats-strip { transition: transform .26s ease; }
.mobile-cats-strip.is-tucked { transform: translateY(-100%); box-shadow: none; pointer-events: none; }

/* כשאין שורת חיפוש בין הנאבבר לרצועה (למשל בדף מודעה / דף הבית), היא נדבקת ישר מתחת לנאבבר. */
.navbar + .mobile-cats-strip { top: 64px; }

/* בדף הבית: ה-hero נדבק לנאבבר בלי הפסקה.
   <main> מקבל py-3 גלובלי - מבטלים את ה-padding העליון רק בדף הבית כדי שה-hero יהיה צמוד. */
body.page-home main { padding-top: 0; }
body.page-home .hero { padding-top: 0; margin-top: -1px; }
body.page-home .hero > .container { padding-top: 56px; }
@media (max-width: 991.98px) {
    body.page-home .hero > .container { padding-top: 32px; }
}

/* עיגולי קטגוריה במובייל - עיגול לבן עם אייקון/תמונה ושם מתחת, על רקע כחול */
.mobile-cat-circle {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    width: 72px;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
}
.mobile-cat-circle .mcc-img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    box-shadow: 0 4px 10px rgba(2,6,23,.18);
    transition: transform .14s ease, box-shadow .14s ease;
}
.mobile-cat-circle .mcc-img i {
    font-size: 26px;
    color: var(--mcc, var(--wc-primary));
    line-height: 1;
}
.mobile-cat-circle .mcc-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.mobile-cat-circle .mcc-label {
    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.15;
    color: #fff;
    text-align: center;
    max-width: 70px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.mobile-cat-circle:active .mcc-img { transform: scale(.93); }
.mobile-cat-circle:hover .mcc-img { box-shadow: 0 6px 16px rgba(2,6,23,.26); }

.cat-link {
    color: var(--wc-text-2);
    font-weight: 500;
    padding: 4px 6px;
    border-radius: 8px;
    transition: color .12s ease, background-color .12s ease;
}
.cat-link i { color: var(--wc-muted); transition: color .12s ease; }
.cat-link:hover { color: var(--wc-primary); background: var(--wc-primary-50); }
.cat-link:hover i { color: var(--wc-primary); }

/* ===== Hero ===== */
.hero {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(1200px 400px at 80% -20%, rgba(255,255,255,.18), transparent 60%),
        radial-gradient(800px 300px at 10% 110%, rgba(0,174,239,.18), transparent 60%),
        linear-gradient(135deg, var(--wc-primary-d) 0%, var(--wc-primary) 60%, #38bdf8 100%);
    color: #fff;
    padding: 72px 0 88px;
    border-radius: 0 0 28px 28px;
}
.hero::after {
    content: "";
    position: absolute; inset: 0;
    background-image:
        linear-gradient(to right, rgba(255,255,255,.04) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(255,255,255,.04) 1px, transparent 1px);
    background-size: 36px 36px;
    pointer-events: none;
    opacity: .4;
}
.hero > .container { position: relative; z-index: 1; }
.hero h1 { font-weight: 700; font-size: clamp(2rem, 4.5vw, 3.2rem); letter-spacing: -.03em; color: #fff; }
.hero .lead { opacity: .92; font-size: 1.05rem; }
.hero .search-box {
    background: #fff;
    padding: 7px;
    border-radius: 50px;
    box-shadow: 0 14px 40px rgba(2, 6, 23, .25);
}
.hero .search-box input.form-control {
    border: 0; box-shadow: none; padding-right: 1.2rem;
    background: transparent;
}
.hero .search-box .btn-primary {
    box-shadow: 0 4px 14px rgba(0, 145, 209,.35);
}

/* ===== Hero: split layout - copy + search + stats ===== */
.hero { padding: 88px 0 96px; }

.hero-grid {
    display: grid;
    grid-template-columns: 1.55fr 1fr;
    gap: 56px;
    align-items: center;
}

.hero-copy { text-align: start; }
.hero h1 {
    font-weight: 800;
    font-size: clamp(2rem, 4.2vw, 3.4rem);
    line-height: 1.15;
    letter-spacing: -.025em;
    margin-bottom: 18px;
    color: #fff;
}
.hero-h1-accent {
    color: var(--wc-accent);
    font-weight: 700;
}
.hero-slogan {
    font-weight: 700;
    font-size: clamp(1.15rem, 2.4vw, 1.6rem);
    line-height: 1.4;
    color: #fff;
    margin-bottom: 16px;
}
.hero .lead {
    max-width: 660px;
    margin: 0;
    font-size: 1.08rem;
    line-height: 1.65;
    color: rgba(255,255,255,.86);
}

/* Search-bar in hero */
.hero-search {
    position: relative;
    display: flex;
    align-items: center;
    margin-top: 28px;
    background: #fff;
    border-radius: 50px;
    padding: 6px 6px 6px 22px;
    box-shadow: 0 18px 50px rgba(2, 6, 23, .22);
    max-width: 660px;
}
.hero-search-icon {
    color: var(--wc-muted);
    font-size: 1rem;
    margin-inline-end: 10px;
}
.hero-search input[type="search"] {
    flex: 1;
    border: 0;
    outline: 0;
    background: transparent;
    font-size: 15px;
    padding: 12px 4px;
    color: var(--wc-text);
    min-width: 0;
}
.hero-search input::placeholder { color: #94a3b8; }
.hero-search .btn-primary {
    padding: .65rem 1.6rem;
    font-weight: 600;
    box-shadow: 0 6px 18px rgba(0, 145, 209,.35);
}

.hero-cta {
    display: flex;
    align-items: center;
    gap: 22px;
    flex-wrap: wrap;
    margin-top: 24px;
}
.hero-cta .btn-warning {
    padding: .85rem 1.8rem;
    font-size: 1rem;
    box-shadow: 0 10px 30px rgba(0,174,239,.45);
}
.hero-cta-link {
    color: rgba(255,255,255,.92);
    font-weight: 500;
    text-decoration: none;
    font-size: 14.5px;
    transition: color .15s ease;
}
.hero-cta-link i { font-size: 12px; margin-inline-start: 4px; transition: transform .15s ease; }
.hero-cta-link:hover { color: #fff; }
.hero-cta-link:hover i { transform: translateX(-3px); }

/* Stats panel - אופקי תמיד, מתחת ל-hero grid */
/* ===== Hero visual - בועות קטגוריות מרחפות סביב סמל מרכזי ===== */
/* התמונה מעוגנת לקצה הימני של ה-container (1320px max) במקום של ה-viewport.
   בלי זה - במסכים אולטרא-רחבים (28"+) התמונה "בורחת" שמאלה מהטקסט,
   כי `clamp(20px, 8vw, ...)` מודד מקצה ה-viewport ולא מהתוכן המרכזי. */
.hero-visual {
    position: absolute;
    bottom: 0;
    /* max(20px, (viewport-1280px)/2) = רוחב ה-gutter מצד ה-container, מינימום 20px קצוות. */
    inset-inline-end: max(20px, calc((100vw - 1280px) / 2));
    width: clamp(320px, 32vw, 480px);
    height: 92%;
    z-index: 1;
    pointer-events: none;
}
.hv-center {
    position: absolute;
    bottom: 0;
    inset-inline-start: 0;
    width: 100%;
    z-index: 3;
}
.hv-center-img {
    width: 100%;
    height: auto;
    display: block;
    filter: drop-shadow(0 16px 28px rgba(15, 23, 42, .32));
}
.hv-think {
    position: absolute;
    top: -12px;
    inset-inline-end: -10px;
    width: 40px; height: 40px;
    background: #fff;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--wc-primary, #0091d1);
    font-size: 16px;
    box-shadow: 0 8px 20px rgba(2,6,23,.28), 0 0 0 3px rgba(255,255,255,.25);
    z-index: 5;
    animation: hv-think 2.4s ease-in-out infinite;
}
@keyframes hv-think {
    0%, 100% { transform: translateY(0) scale(1);     opacity: .95; }
    50%      { transform: translateY(-5px) scale(1.1); opacity: 1;   }
}
.hv-ring {
    position: absolute;
    top: 50%; left: 50%;
    width: 156px; height: 156px;
    border-radius: 28px;
    border: 2px solid rgba(255,255,255,.45);
    z-index: 2;
    transform: translate(-50%, -50%);
    opacity: 0;
    animation: hv-ripple 3.6s ease-out infinite;
}
.hv-ring-1 { animation-delay: 0s; }
.hv-ring-2 { animation-delay: -1.2s; }
.hv-ring-3 { animation-delay: -2.4s; }
.hv-card {
    --r: 0deg;
    position: absolute;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, .05);
    border-radius: 999px;
    padding: 7px 16px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .14), 0 2px 6px rgba(15, 23, 42, .05);
    color: var(--wc-text, #0f172a);
    font-weight: 600;
    font-size: 14px;
    white-space: nowrap;
    z-index: 4;
    transform: translate3d(0, 0, 0) rotate(var(--r));
    animation: hv-float 7s ease-in-out infinite;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-font-smoothing: antialiased;
    text-rendering: geometricPrecision;
}
.hv-card i {
    color: var(--wc-primary, #0091d1);
    font-size: 14px;
    width: 30px;
    height: 30px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--wc-primary-50, #e6f4fb);
    border-radius: 9px;
}
.hv-card-1 { top: 2%;   right: 26%; --r: -4deg; animation-delay: 0s;    animation-duration: 6.5s; }
.hv-card-2 { top: 8%;   left: 22%;  --r: 3deg;  animation-delay: -1.4s; animation-duration: 7.2s; }
.hv-card-3 { top: 30%;  right: -6%; --r: -2deg; animation-delay: -3s;   animation-duration: 6.8s; }
.hv-card-6 { top: 26%;  left: -6%;  --r: 3deg;  animation-delay: -2.6s; animation-duration: 7s;   }
.hv-card-5 { top: 54%;  left: 0;    --r: -3deg; animation-delay: -4s;   animation-duration: 6.3s; }
.hv-card-4 { top: 56%;  right: 2%;  --r: 4deg;  animation-delay: -2s;   animation-duration: 7.5s; }

@keyframes hv-bob {
    0%, 100% { transform: translate(-50%, -50%) scale(1); }
    50%      { transform: translate(-50%, -50%) scale(1.06); }
}
@keyframes hv-ripple {
    0%   { transform: translate(-50%, -50%) scale(1);   opacity: .55; }
    80%  { opacity: 0; }
    100% { transform: translate(-50%, -50%) scale(2.4); opacity: 0; }
}
@keyframes hv-float {
    0%, 100% { transform: translate3d(0, 0,      0) rotate(var(--r)); }
    50%      { transform: translate3d(0, -10px,  0) rotate(calc(var(--r) + 1.5deg)); }
}

@media (prefers-reduced-motion: reduce) {
    .hv-center { animation: none; }
    .hv-card   { animation: none; }
    .hv-ring   { display: none; }
}

/* Features section - לבן, מתחת ל-hero */
.features-section {
    margin-top: 56px;
    margin-bottom: 56px;
}
.feature-card {
    background: #fff;
    border: 1px solid var(--wc-border);
    border-radius: var(--wc-radius-lg);
    padding: 28px 24px;
    height: 100%;
    box-shadow: var(--wc-shadow);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.feature-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--wc-shadow-h);
    border-color: rgba(0, 145, 209,.2);
}
.feature-icon {
    width: 56px; height: 56px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    margin-bottom: 18px;
}
.feature-icon-blue  { background: #e0f4fc; color: #0090c8; }
.feature-icon-green { background: #dcfce7; color: #15803d; }
.feature-icon-amber { background: #e9f8ff; color: #075b7c; }
.feature-card h3 {
    font-size: 19px;
    font-weight: 700;
    margin: 0 0 8px;
    color: var(--wc-text);
    letter-spacing: -.01em;
}
.feature-card p {
    color: var(--wc-muted);
    font-size: 14px;
    line-height: 1.65;
    margin: 0;
}

@media (max-width: 991.98px) {
    .hero { padding: 56px 0 64px; }
    .hero-grid { grid-template-columns: 1fr; gap: 36px; }
    .hero-copy { text-align: center; }
    .hero .lead { margin-inline: auto; }
    .hero-search { margin-inline: auto; }
    .hero-cta { justify-content: center; }
    .hero-visual { display: none; }
    .features-section { margin-top: 36px; margin-bottom: 36px; }
    .feature-card { padding: 22px 20px; }
}
@media (max-width: 575.98px) {
    .hero { padding: 44px 0 52px; }
    .hero-search { padding: 5px 5px 5px 16px; }
    .hero-search .btn-primary { padding: .55rem 1.1rem; font-size: .9rem; }
    .hero-cta { gap: 10px; }
    .hero-cta .btn-warning { padding: .65rem 1.3rem; font-size: .95rem; }
    .hero-stats { padding: 12px 6px; }
    .hero-stat-icon { display: none; }
    .hero-stat-num { font-size: 1.3rem; }
    .hero-stat-label { font-size: 11.5px; }
}

/* ===== Cards ===== */
.card {
    border: 1px solid var(--wc-border);
    border-radius: var(--wc-radius);
    box-shadow: var(--wc-shadow);
    background: var(--wc-card-bg);
}

/* קטגוריה */
.cat-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: var(--wc-card-bg);
    border: 1px solid var(--wc-border);
    border-radius: var(--wc-radius);
    padding: 22px 12px;
    text-decoration: none;
    color: var(--wc-text);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    height: 100%;
}
.cat-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--wc-shadow-h);
    border-color: rgba(0, 145, 209,.35);
    color: var(--wc-primary);
}
.cat-card .icon {
    width: 56px; height: 56px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 14px;
    background: linear-gradient(135deg, #d6edfa, #b3e0f5);
    color: var(--wc-primary);
    font-size: 22px;
    margin-bottom: 10px;
    transition: transform .18s ease, box-shadow .18s ease;
}
.cat-card:hover .icon {
    transform: scale(1.06);
    box-shadow: 0 6px 16px rgba(0, 145, 209,.25);
}
.cat-card .name { font-weight: 500; font-size: 14px; text-align: center; }

/* כרטיס מודעה */
.listing-card {
    background: transparent;
    border: 0;
    border-radius: var(--wc-radius);
    overflow: visible;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    height: 100%;
    display: flex; flex-direction: column;
    color: inherit;
}
.listing-card:hover {
    transform: translateY(-3px);
    box-shadow: none;
}
.listing-card .img-wrap {
    position: relative;
    aspect-ratio: 4/3;
    background: #eef2f7;
    overflow: hidden;
}
.listing-card .img-wrap::after {
    content: "";
    position: absolute; inset: auto 0 0 0; height: 38%;
    background: linear-gradient(to top, rgba(0,0,0,.12), transparent);
    opacity: 0;
    transition: opacity .18s ease;
    pointer-events: none;
}
.listing-card:hover .img-wrap::after { opacity: 1; }
.listing-card .img-wrap img {
    width: 100%; height: 100%; object-fit: cover;
    transition: transform .4s ease;
}
.listing-card:hover .img-wrap img { transform: scale(1.05); }
/* תצוגת רשת ללא מסגרת - התמונה מעוגלת לבדה (סגנון KEYZ) */
.listing-card:not(.is-list) .img-wrap {
    border-radius: var(--wc-radius-lg);
    box-shadow: 0 1px 3px rgba(15, 23, 42, .08);
    transition: box-shadow .18s ease;
}
.listing-card:not(.is-list):hover .img-wrap {
    box-shadow: 0 10px 26px -8px rgba(15, 23, 42, .22);
}
/* כרטיסים קומפקטיים יותר בסגנון KEYZ - 5 בשורה במסכים רחבים + טיפוגרפיה צפופה */
@media (min-width: 1200px) {
    .row > .listing-col-5 { width: 20%; }
}
.listing-card:not(.is-list) .title { font-size: 13px; }
.listing-card:not(.is-list) .price { font-size: 14.5px; }
.listing-card:not(.is-list) .meta  { font-size: 11px; }
.listing-card .badge-featured {
    position: absolute; top: 8px; left: 8px;
    width: 28px; height: 28px;
    display: inline-flex; align-items: center; justify-content: center;
    padding: 0;
    border: 1px solid rgba(15, 51, 64, .12);
    border-radius: 50%;
    background: rgba(255,255,255,.92);
    color: var(--wc-primary-d);
    font-size: 11px;
    font-weight: 600;
    backdrop-filter: blur(5px);
    box-shadow: 0 2px 7px rgba(15,23,42,.12);
}
.listing-card .badge-sponsored {
    position: absolute;
    inset-inline-start: 8px;
    bottom: 8px;
    z-index: 2;
    padding: 3px 7px;
    border: 1px solid rgba(255,255,255,.45);
    border-radius: 999px;
    background: rgba(15,23,42,.64);
    color: #fff;
    font-size: 10px;
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: .01em;
    backdrop-filter: blur(5px);
    pointer-events: none;
}
.listing-card .fav-btn {
    position: absolute; top: 8px; right: 8px;
    width: 30px; height: 30px;
    background: rgba(255,255,255,.96); border: 0; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    color: #94a3b8; cursor: pointer;
    backdrop-filter: blur(4px);
    box-shadow: 0 2px 6px rgba(15,23,42,.1);
    font-size: 12px;
    transition: color .15s ease, transform .15s ease, background-color .15s ease;
}
.listing-card .fav-btn.active { color: var(--wc-danger); }
.listing-card .fav-btn:hover { color: var(--wc-danger); transform: scale(1.08); }

/* בתצוגת רשת - listing-card הוא flex-column: img למעלה, body באמצע, price למטה */
.listing-card:not(.is-list) {
    display: flex;
    flex-direction: column;
}
.listing-card:not(.is-list) .body { flex: 1; padding: 10px 3px 4px; }
.listing-card:not(.is-list) .price { padding: 0 3px 4px; }

.listing-card .body { padding: 10px 12px 8px; display: flex; flex-direction: column; }
.listing-card .title {
    font-weight: 600;
    font-size: 13.5px;
    margin-bottom: 4px;
    color: var(--wc-text);
    text-decoration: none;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.3;
    min-height: calc(1.3em * 2);
}
.listing-card .price {
    font-weight: 700;
    color: var(--wc-primary);
    font-size: 15.5px;
    letter-spacing: -.01em;
}
.listing-card .meta {
    font-size: 11px;
    color: var(--wc-muted);
    display: flex; gap: 8px; flex-wrap: wrap;
}
.listing-card .meta i { color: var(--wc-muted-2); }
/* מפרט מודעה (KEYZ-style): "דירה · 4 חדרים · 105 מ"ר" עם נקודות מפרידות */
.listing-card .meta.specs { gap: 0; flex-wrap: nowrap; overflow: hidden; }
.listing-card .meta.specs span { white-space: nowrap; font-weight: 500; }
.listing-card .meta.specs span:not(:last-child)::after {
    content: "·"; margin: 0 6px; color: var(--wc-muted-2); font-weight: 400;
}

/* ===== List view variant - שורה פרימיום ללא מסגרת (KEYZ-style) ===== */
/* מבנה: [תמונה ימין] [גוף - title+specs, מרכזי אנכית] [מחיר שמאל].
   ללא border - כרטיס לבן עם צל רך ומרחף; מאוזן ונקי. */
.listing-card.is-list {
    display: flex;
    flex-direction: row;             /* RTL: img-wrap (1st) בימין, price (3rd) בשמאל */
    align-items: center;             /* מאזן אנכית - לוק פרימיום */
    gap: 16px;
    padding: 12px;
    min-height: 136px;
    border-radius: 16px;
    border: 0;
    background: #fff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 6px 20px -10px rgba(15, 23, 42, .12);
    overflow: hidden;
    transition: transform .18s ease, box-shadow .18s ease;
}
.listing-card.is-list:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(15, 23, 42, .06), 0 16px 38px -12px rgba(15, 23, 42, .20);
}

/* תמונה - גובה מלא של הכרטיס, רוחב קבוע */
.listing-card.is-list .img-wrap {
    flex: 0 0 168px;
    width: 168px;
    aspect-ratio: auto;              /* גובה קבוע, לא תלוי ביחס התמונה */
    height: 112px;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
}
.listing-card.is-list .img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
}
.listing-card.is-list .img-wrap::after { display: none; }
.listing-card.is-list .badge-featured { top: 6px; right: auto; left: 6px; width: 26px; height: 26px; font-size: 10px; }
/* כפתור לב - בפינה הימנית-עליונה של התמונה (קצה הקלף), הפוך מסימון ההמלצה שבפינה השמאלית */
.listing-card.is-list .fav-btn { top: 6px; right: 6px; left: auto; width: 28px; height: 28px; font-size: 12px; }

/* גוף - title + meta, יישור לימין (RTL), מרכזי אנכית */
.listing-card.is-list .body {
    flex: 1;
    padding: 4px 6px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    text-align: start;
}
.listing-card.is-list .title {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.35;
    -webkit-line-clamp: 2;
    min-height: 0;
    margin-bottom: 0;
    color: var(--wc-text);
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}
.listing-card.is-list .meta {
    font-size: 13px;
    gap: 14px;
    margin: 0;
    color: var(--wc-muted, #6b7280);
    flex-wrap: nowrap;
    overflow: hidden;
}
.listing-card.is-list .meta i { color: var(--wc-muted-2, #94a3b8); margin-inline-end: 3px; }
.listing-card.is-list .meta span { white-space: nowrap; }

/* מחיר - עמודה שמאלית, מרכזית אנכית, גדול ומודגש (ללא קו מפריד) */
.listing-card.is-list .price {
    flex: 0 0 auto;
    align-self: center;
    padding: 0 20px 0 8px;
    font-size: 21px;
    font-weight: 800;
    color: var(--wc-text);
    letter-spacing: -.02em;
    direction: ltr;
    white-space: nowrap;
    text-align: start;
    min-width: 120px;
}

/* === מובייל: CSS Grid - תמונה ימין בגובה מלא, body למעלה-שמאל, price למטה-שמאל === */
@media (max-width: 575.98px) {
    .listing-card.is-list {
        display: grid;
        /* ב-RTL הקולונה הראשונה (start) נמצאת בימין. רוצים image בימין → image ראשון. */
        grid-template-columns: 120px 1fr;       /* image | body */
        /* גובה קבוע לשורות - body יקבל מקום בדיוק ל-2 שורות כותרת + מטא,
           price יקבל מקום קבוע. בלי קשר לאורך הכותרת, הכרטיס באותו גובה. */
        grid-template-rows: 1fr 36px;
        grid-template-areas:
            "image body"
            "image price";
        height: 130px;
        min-height: 130px;
        padding: 10px;
        gap: 4px 12px;
        border-radius: 12px;
    }
    .listing-card.is-list .img-wrap {
        grid-area: image;
        width: 120px;
        height: 110px;                          /* גובה תמונה קבוע: 130 - 2×10 padding */
        flex: none;
        border-radius: 10px;
    }
    .listing-card.is-list .body {
        grid-area: body;
        padding: 0;
        gap: 4px;
        justify-content: flex-start;
        min-width: 0;
        overflow: hidden;                       /* מבטיח שתוכן שלא נכנס נחתך, לא נמתח */
    }
    .listing-card.is-list .title {
        font-size: 14.5px;
        line-height: 1.3;
        -webkit-line-clamp: 2;
        font-weight: 700;
        /* גובה מובטח של 2 שורות - גם אם הכותרת בשורה אחת, השטח שמור */
        min-height: calc(1.3em * 2);
    }
    .listing-card.is-list .meta {
        font-size: 11.5px;
        gap: 8px;
        flex-wrap: nowrap;
        overflow: hidden;
    }
    .listing-card.is-list .meta i { font-size: 10px; }
    .listing-card.is-list .price {
        grid-area: price;
        font-size: 17px;
        font-weight: 800;
        padding: 6px 2px 0;
        min-width: 0;
        border-inline-start: 0;
        border-top: 1px solid var(--wc-border-2, #f1f5f9);
        margin-top: 0;
        text-align: start;
        line-height: 1;
    }
}

/* ===== Toggle buttons - תצוגה רשת/רשימה ===== */
.view-toggle {
    display: inline-flex;
    gap: 0;
    border: 1px solid var(--wc-border, #e5e7eb);
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
}
.view-toggle a {
    padding: 7px 14px;
    color: var(--wc-muted, #6b7280);
    font-size: 13.5px;
    font-weight: 600;
    text-decoration: none;
    background: transparent;
    transition: background .15s ease, color .15s ease;
    display: inline-flex; align-items: center; gap: 6px;
}
.view-toggle a:hover { background: #f3f4f6; color: var(--wc-text); }
.view-toggle a.active {
    background: var(--wc-primary, #0091d1);
    color: #fff;
}

/* ===== Forms ===== */
.form-label { font-weight: 500; color: var(--wc-text-2); margin-bottom: .35rem; }
.form-control, .form-select {
    border-radius: 10px;
    padding: .6rem .9rem;
    border-color: var(--wc-border);
    background-color: #fff;
    color: var(--wc-text);
    transition: border-color .15s ease, box-shadow .15s ease;
}
.form-control::placeholder { color: var(--wc-muted-2); }
.form-control:focus, .form-select:focus {
    border-color: var(--wc-primary);
    box-shadow: 0 0 0 4px rgba(0, 145, 209, .12);
}

/* OTP */
.otp-input {
    width: 48px; height: 56px;
    text-align: center; font-size: 22px;
    border: 2px solid var(--wc-border); border-radius: 12px;
    margin: 0 4px;
    font-weight: 600;
    background: #fff;
    transition: border-color .15s ease, box-shadow .15s ease, transform .12s ease;
}
.otp-input:focus { outline: none; border-color: var(--wc-primary); box-shadow: 0 0 0 4px rgba(0, 145, 209,.15); transform: translateY(-1px); }

/* ===== Password strength meter ===== */
.pw-strength { margin-top: 6px; }
.pw-strength-bar {
    height: 6px;
    background: var(--wc-border);
    border-radius: 3px;
    overflow: hidden;
}
.pw-strength-bar span {
    display: block;
    height: 100%;
    width: 0;
    transition: width .2s ease, background-color .2s ease;
    background: #dc3545;
}
.pw-strength[data-level="2"] .pw-strength-bar span { background: #00aeef; }
.pw-strength[data-level="3"] .pw-strength-bar span { background: #37c8ff; }
.pw-strength[data-level="4"] .pw-strength-bar span { background: #198754; }
.pw-strength-label { margin-top: 2px; }

/* ===== wcConfirm modal (replaces native confirm()) ===== */
.wc-confirm-backdrop {
    position: fixed; inset: 0; z-index: 2000;
    background: rgba(15, 23, 42, .55);
    display: flex; align-items: center; justify-content: center;
    padding: 20px;
    opacity: 0;
    transition: opacity .18s ease;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}
.wc-confirm-backdrop.open { opacity: 1; }
.wc-confirm-modal {
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 25px 60px -15px rgba(0,0,0,.35), 0 0 0 1px rgba(0,0,0,.05);
    width: 100%; max-width: 440px;
    padding: 28px 24px 22px;
    text-align: center;
    transform: scale(.96) translateY(8px);
    transition: transform .2s cubic-bezier(.16,1,.3,1);
}
.wc-confirm-backdrop.open .wc-confirm-modal { transform: scale(1) translateY(0); }

.wc-confirm-icon {
    width: 64px; height: 64px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 28px;
    margin: 0 auto 16px;
}
.wc-confirm-danger  .wc-confirm-icon { background: #fee2e2; color: #b91c1c; }
.wc-confirm-warning .wc-confirm-icon { background: #e9f8ff; color: #075b7c; }
.wc-confirm-success .wc-confirm-icon { background: #dcfce7; color: #15803d; }
.wc-confirm-primary .wc-confirm-icon { background: #d6edfa; color: #0073a8; }

.wc-confirm-title {
    font-size: 19px; font-weight: 700;
    color: var(--wc-text, #0f172a);
    margin: 0 0 8px;
}
.wc-confirm-message {
    font-size: 14.5px; line-height: 1.6;
    color: var(--wc-muted, #475569);
    margin: 0 0 22px;
    white-space: pre-wrap;
}
.wc-confirm-actions {
    display: flex; gap: 10px; justify-content: center; flex-wrap: wrap;
}
.wc-confirm-actions .btn {
    min-width: 110px;
    padding: 9px 18px;
    border-radius: 10px;
}
.wc-confirm-cancel { background: #f1f5f9; border-color: #e2e8f0; color: #334155; }
.wc-confirm-cancel:hover { background: #e2e8f0; color: #1e293b; }

@media (max-width: 480px) {
    .wc-confirm-modal { padding: 22px 18px 18px; max-width: 95vw; }
    .wc-confirm-icon { width: 56px; height: 56px; font-size: 24px; }
    .wc-confirm-title { font-size: 17px; }
    .wc-confirm-actions .btn { flex: 1; min-width: 0; }
}

/* ===== HTML legend for Chart.js (admin dashboard) ===== */
.chart-html-legend {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 18px;
    font-size: 13px;
    color: var(--wc-muted, #64748b);
}
.chl-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.chl-dot {
    display: inline-block;
    width: 12px; height: 12px;
    border-radius: 3px;
}
.chl-dot-outline {
    background: transparent !important;
    border: 2px solid;
}

/* ===== FAQ accordion (promote-listing) ===== */
.faq-section {
    max-width: 820px;
    margin-inline: auto;
}
.faq-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.faq-item {
    background: #fff;
    border: 1px solid var(--wc-border, #e5e7eb);
    border-radius: 14px;
    overflow: hidden;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.faq-item:hover {
    border-color: #cbd5e1;
    box-shadow: 0 4px 14px -8px rgba(0,0,0,.08);
}
.faq-item[open] {
    border-color: var(--wc-primary, #0091d1);
    box-shadow: 0 6px 20px -10px rgba(0, 145, 209,.25);
}
.faq-item > summary {
    list-style: none;
    cursor: pointer;
    padding: 16px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    font-weight: 600;
    color: var(--wc-text, #0f172a);
    user-select: none;
    transition: background .12s ease;
}
.faq-item > summary::-webkit-details-marker { display: none; }
.faq-item > summary::marker { content: ''; }
.faq-item > summary:hover {
    background: #f8fafc;
}
.faq-q {
    flex: 1;
    min-width: 0;
    font-size: 15.5px;
    line-height: 1.4;
}
.faq-icon {
    color: var(--wc-muted, #94a3b8);
    font-size: 14px;
    transition: transform .25s cubic-bezier(.16,1,.3,1), color .15s ease;
    flex-shrink: 0;
}
.faq-item[open] .faq-icon {
    transform: rotate(180deg);
    color: var(--wc-primary, #0091d1);
}
.faq-a {
    padding: 0 20px 18px;
    color: var(--wc-muted, #475569);
    font-size: 14.5px;
    line-height: 1.7;
    border-top: 1px dashed var(--wc-border, #e5e7eb);
    padding-top: 14px;
    margin-top: 0;
}
.faq-a p {
    margin-bottom: 10px;
}
.faq-a p:last-child { margin-bottom: 0; }
.faq-a strong {
    color: var(--wc-text, #0f172a);
    font-weight: 700;
}

@media (max-width: 576px) {
    .faq-item > summary { padding: 14px 16px; }
    .faq-q { font-size: 14.5px; }
    .faq-a { padding: 12px 16px 16px; font-size: 14px; }
}

/* ===== Promotion credits banner (my-listings) ===== */
.credits-banner {
    background: linear-gradient(135deg, #f0fdf4 0%, #ffffff 60%);
    border: 1px solid #bbf7d0;
}
.credits-list { display: flex; flex-direction: column; gap: 10px; }

/* כרטיס קבוצה - אחד לכל סוג חבילה */
.credit-group {
    border: 1px solid var(--wc-border, #e5e7eb);
    border-radius: 12px;
    padding: 12px 14px;
    background: #fff;
    display: flex; flex-direction: column; gap: 8px;
}
.credit-group-header {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.credit-pkg-dot {
    display: inline-block; width: 12px; height: 12px; border-radius: 50%;
    flex-shrink: 0;
}
.credit-pkg-name { font-weight: 700; color: var(--wc-text); font-size: 15px; }
.credit-count-badge {
    background: #0073a8;
    color: #fff;
    font-size: 12.5px; font-weight: 700;
    padding: 2px 9px;
    border-radius: 999px;
    line-height: 1.4;
}

.credit-totals {
    font-size: 13.5px;
    color: var(--wc-text, #0f172a);
    background: #f8fafc;
    border-radius: 8px;
    padding: 7px 10px;
}
.credit-totals-label {
    font-weight: 600; color: var(--wc-muted, #475569);
    margin-inline-end: 4px;
}
.credit-totals strong { font-weight: 700; }

.credit-stats {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: center;
    font-size: 13px; color: var(--wc-muted, #4b5563);
}
.credit-stats-label {
    font-size: 12.5px; color: var(--wc-muted, #6b7280);
    margin-inline-end: 4px;
}
.credit-stat i {
    color: var(--wc-primary, #0091d1);
    margin-inline-end: 4px;
}
.credit-stat strong {
    color: var(--wc-text); font-weight: 700;
}

.credit-breakdown {
    border-top: 1px dashed var(--wc-border, #e5e7eb);
    padding-top: 6px;
    font-size: 13px;
}
.credit-breakdown summary {
    cursor: pointer; color: var(--wc-primary, #0091d1);
    font-weight: 600; padding: 4px 2px;
    list-style: revert;
}
.credit-breakdown summary:hover { text-decoration: underline; }
.credit-breakdown-list {
    list-style: none; padding: 6px 0 2px; margin: 0;
    display: flex; flex-direction: column; gap: 4px;
}
.credit-breakdown-list li {
    display: flex; gap: 8px; flex-wrap: wrap; align-items: center;
    padding: 4px 6px; border-radius: 6px; background: #fafbff;
    font-size: 12.5px; color: var(--wc-muted, #475569);
}
.credit-breakdown-list .cb-date { font-weight: 600; color: var(--wc-text); }
.credit-breakdown-list .cb-source { font-style: italic; }
.credit-breakdown-list .cb-next {
    margin-inline-start: auto;
    font-size: 11.5px; font-weight: 700;
    color: #15803d; background: #dcfce7;
    padding: 1px 8px; border-radius: 999px;
}

.credit-apply-form {
    display: flex; gap: 8px; align-items: center;
    border-top: 1px solid var(--wc-border, #e5e7eb);
    padding-top: 10px; margin-top: 2px;
}
.credit-apply-form select { flex: 1; min-width: 0; }

/* ===== Sidebar (filters) ===== */
.filter-sidebar {
    background: var(--wc-card-bg);
    border: 1px solid var(--wc-border);
    border-radius: var(--wc-radius);
    padding: 20px;
    box-shadow: var(--wc-shadow-xs);
}

/* ===== Active-filter chips ===== */
.active-filters { padding: 4px 0; }
.active-filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--wc-primary-50, #e6f4fb);
    color: var(--wc-primary-d, #0073a8);
    font-size: 12.5px;
    font-weight: 600;
    text-decoration: none;
    border: 1px solid var(--wc-primary-100, #d6edfa);
    transition: background-color .12s ease, color .12s ease;
}
.active-filter-chip:hover {
    background: #fee2e2;
    color: #b91c1c;
    border-color: #fecaca;
}
.active-filter-chip i { font-size: 10px; opacity: .8; }

/* ===== City autocomplete dropdown (filter sidebar) ===== */
.city-suggest-dropdown {
    position: absolute;
    inset-inline: 0;
    left: 0;
    right: 0;
    top: calc(100% + 2px);
    z-index: 1100;
    background: #fff;
    border: 1px solid var(--wc-border);
    border-radius: 10px;
    box-shadow: 0 12px 30px rgba(2,6,23,.18);
    max-height: 240px;
    overflow-y: auto;
    padding: 4px;
}
.city-suggest-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 6px 10px;
    border: 0;
    background: transparent;
    border-radius: 6px;
    text-align: start;
    font-size: 13px;
    cursor: pointer;
}
.city-suggest-item:hover { background: var(--wc-primary-50, #e6f4fb); }

/* ===== Filter sheet header (title + close) ===== */
.filter-sheet-head { display: flex; align-items: center; justify-content: space-between; }
.filter-sheet-head h6 { margin: 0; }
.filter-sheet-close {
    border: none; background: var(--wc-bg); color: var(--wc-muted);
    width: 34px; height: 34px; border-radius: 50%; font-size: 22px; line-height: 1;
    cursor: pointer; display: flex; align-items: center; justify-content: center;
    flex-shrink: 0; transition: background-color .15s, color .15s;
}
.filter-sheet-close:hover { background: var(--wc-primary-50); color: var(--wc-primary-d); }

/* Desktop: filters stick alongside results */
@media (min-width: 992px) {
    .filter-sidebar { position: sticky; top: 80px; }
}

/* ===== Mobile: סינון כחלון קופץ (bottom sheet) ===== */
@media (max-width: 991.98px) {
    #filterSidebar { display: none; }
    #filterSidebar.is-open {
        display: block; position: fixed; inset: 0; z-index: 1090; margin: 0;
        background: rgba(15, 23, 42, .5);
        animation: wcFilterFade .2s ease;
    }
    #filterSidebar.is-open .filter-sidebar {
        position: absolute; inset-inline: 0; left: 0; right: 0; bottom: 0; top: auto;
        max-height: 88vh; overflow-y: auto; -webkit-overflow-scrolling: touch;
        border: none; border-radius: 20px 20px 0 0; padding: 0 18px 24px;
        box-shadow: 0 -10px 44px rgba(15, 23, 42, .28);
        animation: wcFilterUp .3s cubic-bezier(.16, 1, .3, 1);
    }
    #filterSidebar.is-open .filter-sidebar::before {
        content: ""; display: block; width: 42px; height: 4px; border-radius: 999px;
        background: var(--wc-border-2); margin: 10px auto 4px;
    }
    #filterSidebar.is-open .filter-sheet-head {
        position: sticky; top: 0; background: #fff; z-index: 2;
        padding: 8px 0 12px; margin-bottom: 6px; border-bottom: 1px solid var(--wc-border-2);
    }
    body.filter-sheet-lock { overflow: hidden; }
}
@keyframes wcFilterFade { from { opacity: 0 } to { opacity: 1 } }
@keyframes wcFilterUp { from { transform: translateY(100%) } to { transform: translateY(0) } }

/* ===== Listing single (gallery) ===== */
.gallery-main {
    position: relative;
    background: #f1f5f9;
    border: 1px solid var(--wc-border, #e5e7eb);
    border-radius: var(--wc-radius-lg);
    overflow: hidden;
    aspect-ratio: 4/3;
    max-height: 480px;
    box-shadow: var(--wc-shadow);
    isolation: isolate;
}
@media (max-width: 575.98px) {
    .gallery-main { aspect-ratio: 4/3; max-height: none; }
}

/* ===== Search results - עסקים תואמים ===== */
.biz-results {
    margin-bottom: 26px;
}
.biz-results-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--wc-text);
    margin: 0 0 12px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.biz-results-title i { color: var(--wc-primary, #0091d1); font-size: 14px; }
.biz-results-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 10px;
}
.biz-result-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: #fff;
    border: 1px solid var(--wc-border, #e5e7eb);
    border-radius: 12px;
    text-decoration: none;
    color: inherit;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.biz-result-card:hover {
    border-color: var(--wc-primary, #0091d1);
    box-shadow: 0 6px 16px rgba(0, 145, 209, .12);
    transform: translateY(-1px);
}
.brc-logo {
    flex: 0 0 48px;
    width: 48px; height: 48px;
    border-radius: 12px;
    object-fit: cover;
    background: #f3f4f6;
}
.brc-logo-initials {
    background: linear-gradient(135deg, var(--wc-primary, #0091d1), var(--wc-primary-d, #0073a8));
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 700;
}
.brc-body { flex: 1; min-width: 0; }
.brc-name {
    font-weight: 700;
    color: var(--wc-text);
    font-size: 14.5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.brc-sub {
    font-size: 12px;
    color: var(--wc-muted, #6b7280);
    margin-top: 3px;
}
.brc-sub i { font-size: 10px; margin-inline-end: 3px; }
.brc-arrow {
    color: var(--wc-muted-2, #94a3b8);
    font-size: 13px;
    transition: transform .15s ease, color .15s ease;
}
.biz-result-card:hover .brc-arrow {
    color: var(--wc-primary, #0091d1);
    transform: translateX(-3px);
}

/* ===== Share card - שיתוף מודעה ===== */
.share-card {
    padding: 18px 20px;
    border: 1px solid var(--wc-border, #e5e7eb);
    border-radius: 14px;
}
.share-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    font-size: 14px;
    font-weight: 700;
    color: var(--wc-text, #0f172a);
}
.share-header i {
    color: var(--wc-primary, #0091d1);
    font-size: 14px;
}
.share-buttons {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.share-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 14px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    border: 1px solid transparent;
    background: #fff;
    color: var(--wc-text);
    cursor: pointer;
    transition: transform .15s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
    line-height: 1;
}
.share-btn i {
    font-size: 15px;
    width: 16px;
    text-align: center;
}
.share-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(2,6,23,.15);
}
.share-btn:active { transform: translateY(0); }

.share-whatsapp { background: #25d366; color: #fff; }
.share-whatsapp:hover { background: #1ebe5d; color: #fff; }

.share-facebook { background: #1877f2; color: #fff; }
.share-facebook:hover { background: #166fe0; color: #fff; }

.share-x { background: #0f0f0f; color: #fff; }
.share-x:hover { background: #000; color: #fff; }

.share-telegram { background: #229ed9; color: #fff; }
.share-telegram:hover { background: #1d8cc4; color: #fff; }

.share-copy {
    background: #fff;
    color: var(--wc-muted, #6b7280);
    border-color: #d1d5db;
}
.share-copy:hover {
    background: #f3f4f6;
    color: var(--wc-text);
    border-color: #9ca3af;
}
.share-copy.is-copied {
    background: #d1fae5;
    color: #065f46;
    border-color: #6ee7b7;
}

@media (max-width: 575.98px) {
    .share-card { padding: 14px 12px; }
    .share-buttons { gap: 6px; }
    .share-btn { padding: 8px 12px; font-size: 12.5px; }
}

/* ===== Listing specs grid - פרטי המודעה (שטוח, בלי מסגרות) ===== */
.listing-specs {
    margin: 18px 0 22px;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
}
.listing-specs-title {
    font-size: 15px;
    font-weight: 800;
    color: var(--wc-text, #0f172a);
    margin: 0 0 10px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.listing-specs-title i {
    color: var(--wc-primary, #0091d1);
    font-size: 13px;
}
.listing-specs-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0;
    border-top: 1px solid var(--wc-border-2);
}
.spec-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 4px;
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--wc-border-2);
    min-width: 0;
}
/* קו אנכי דק בין שתי העמודות (בצד ההתחלה של העמודה השמאלית) */
.spec-item:nth-child(even) {
    border-inline-start: 1px solid var(--wc-border-2);
    padding-inline-start: 14px;
}
.spec-item:nth-child(odd) {
    padding-inline-end: 14px;
}
/* השורה האחרונה - בלי קו תחתון, סיום נקי */
.spec-item:last-child { border-bottom: 0; }
.spec-item:nth-last-child(2):nth-child(odd) { border-bottom: 0; }
/* אייקון: רק האייקון בעצמו, בלי בועה צבעונית */
.spec-icon {
    flex: 0 0 auto;
    width: auto; height: auto;
    border-radius: 0;
    background: transparent;
    color: var(--wc-muted, #94a3b8);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
}
.spec-body { min-width: 0; flex: 1; }
.spec-label {
    font-size: 12px;
    color: var(--wc-muted, #6b7280);
    font-weight: 500;
    line-height: 1.2;
    margin-bottom: 3px;
}
.spec-value {
    font-size: 14.5px;
    color: var(--wc-text, #0f172a);
    font-weight: 700;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 360px) {
    .listing-specs-grid { grid-template-columns: 1fr; }
    .spec-item:nth-child(even) { border-inline-start: 0; padding-inline-start: 4px; }
    .spec-item:nth-child(odd)  { padding-inline-end: 4px; }
}

/* ===== Seller card (listing sidebar) ===== */
.seller-card {
    padding: 22px;
    border: 1px solid var(--wc-border, #e5e7eb);
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .06);
    /* Sticky עם המשתמש בדסקטופ - מתכווץ עם scroll פנימי אם תוכן ארוך מהמסך */
    position: -webkit-sticky;
    position: sticky;
    top: 136px;  /* navbar 64px + שורת חיפוש ~60px + רווח */
    z-index: 10;
    max-height: calc(100vh - 156px);
    overflow-y: auto;
    /* scrollbar עדין */
    scrollbar-width: thin;
}
.seller-card::-webkit-scrollbar { width: 6px; }
.seller-card::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 999px;
}

@media (max-width: 991.98px) {
    .seller-card {
        position: static;
        top: auto;
        max-height: none;
        overflow: visible;
    }
}
.seller-head {
    display: flex;
    align-items: center;
    gap: 14px;
}
.seller-avatar {
    position: relative;
    flex-shrink: 0;
    width: 56px; height: 56px;
    border-radius: 50%;
    overflow: visible;
}
.seller-avatar > img {
    width: 56px; height: 56px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #fff;
    box-shadow: 0 2px 8px rgba(15,23,42,.10);
    display: block;
}
.seller-avatar-initials {
    background: linear-gradient(135deg, var(--wc-primary, #0091d1), var(--wc-primary-d, #0073a8));
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 700;
    border: 2px solid #fff;
    box-shadow: 0 2px 8px rgba(0, 145, 209,.30);
}
.seller-presence {
    position: absolute;
    bottom: 2px;
    inset-inline-end: 2px;
    width: 14px; height: 14px;
    border-radius: 50%;
    background: #16a34a;
    border: 2.5px solid #fff;
    box-shadow: 0 0 0 0 rgba(22,163,74,.6);
    animation: seller-pulse 1.8s ease-out infinite;
}
@keyframes seller-pulse {
    0%   { box-shadow: 0 0 0 0   rgba(22,163,74,.6); }
    70%  { box-shadow: 0 0 0 8px rgba(22,163,74,0);  }
    100% { box-shadow: 0 0 0 0   rgba(22,163,74,0);  }
}
.seller-info { flex: 1; min-width: 0; }
.seller-name {
    font-weight: 700;
    color: var(--wc-text);
    font-size: 16px;
    line-height: 1.25;
    margin-bottom: 4px;
}
.seller-name a { color: inherit; text-decoration: none; }
.seller-name a:hover { color: var(--wc-primary, #0091d1); }
.seller-publisher {
    font-size: 13px;
    color: var(--wc-muted, #6b7280);
    margin: 2px 0 4px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.seller-publisher i { color: var(--wc-muted-2, #94a3b8); font-size: 11px; }
.seller-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 999px;
    background: #e6f4fb;
    color: #0073a8;
    margin-inline-start: 6px;
    vertical-align: middle;
}
.seller-meta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    font-size: 12.5px;
    color: var(--wc-muted, #6b7280);
}
.seller-meta i { font-size: 10px; }
.seller-dot { color: #cbd5e1; }
.seller-online {
    color: #16a34a;
    font-weight: 600;
}
.seller-online i { color: #16a34a; font-size: 8px; }
.seller-offline {
    color: var(--wc-muted, #6b7280);
}
.seller-offline i { color: #cbd5e1; font-size: 8px; }
.seller-bizlink {
    display: inline-block;
    margin-top: 6px;
    font-size: 12.5px;
    color: var(--wc-primary, #0091d1);
    text-decoration: none;
    font-weight: 600;
}
.seller-bizlink:hover { text-decoration: underline; }
.seller-bizlink i { font-size: 10px; margin-inline-start: 2px; }
.seller-divider {
    margin: 16px -6px;
    border: 0;
    border-top: 1px solid var(--wc-border, #e5e7eb);
    opacity: 1;
}

/* ===== כפתור "חזור" במובייל בכותרת - לא בשימוש יותר, נשאר כדי לא לשבור קבצים שייתכן ועדיין מפנים אליו ===== */
.nav-back-btn {
    display: none;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    padding: 0;
    background: #fff;
    color: var(--wc-primary-d, #0073a8);
    border: 0;
    font-size: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 3px rgba(0,0,0,.18);
    margin-inline-end: 8px;
    transition: transform .12s ease, box-shadow .12s ease;
}
.nav-back-btn:hover, .nav-back-btn:focus {
    background: #fff;
    color: var(--wc-primary, #0091d1);
    box-shadow: 0 2px 8px rgba(0,0,0,.25);
}
.nav-back-btn:active { transform: translateX(2px); }
/* RTL: החץ צריך להצביע ימינה (חזרה) - כבר כך עם fa-arrow-right ב-RTL */

/* ===== Widget עסקאות נדל"ן ===== */
.nadlan-widget {
    background: #fff;
    border: 1px solid var(--wc-border, #e5e7eb);
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,.04);
}
.nadlan-head {
    padding: 18px 20px 14px;
    background: linear-gradient(180deg, #fff7ed, #ffffff);
    border-bottom: 1px solid #fed7aa;
}
.nadlan-title {
    margin: 0 0 4px;
    font-size: 18px;
    font-weight: 700;
    color: #075b7c;
    display: flex;
    align-items: center;
    gap: 10px;
}
.nadlan-title > i { color: #00aeef; }
.nadlan-sub { font-size: 13.5px; color: var(--wc-text); font-weight: 500; }
.nadlan-empty {
    text-align: center;
    padding: 36px 20px;
    color: var(--wc-muted, #6b7280);
}
.nadlan-empty > i { color: #cbd5e1; }
.nadlan-table {
    margin: 0;
    font-size: 14px;
}
.nadlan-table thead th {
    background: #f8fafc;
    color: var(--wc-muted, #6b7280);
    font-weight: 600;
    font-size: 12.5px;
    text-transform: none;
    border-bottom: 1px solid var(--wc-border, #e5e7eb);
    padding: 10px 12px;
}
.nadlan-table tbody td {
    padding: 12px;
    border-bottom: 1px solid var(--wc-border-2, #f1f5f9);
    color: var(--wc-text);
}
.nadlan-table tbody tr:last-child td { border-bottom: 0; }
.nadlan-table tbody tr:hover { background: #e9f8ff; }
.nadlan-footer-note {
    padding: 12px 20px;
    background: #f8fafc;
    border-top: 1px solid var(--wc-border-2, #f1f5f9);
    font-size: 12.5px;
    color: var(--wc-muted, #6b7280);
    text-align: center;
}
@media (max-width: 575.98px) {
    .nadlan-table { font-size: 12.5px; }
    .nadlan-table thead th, .nadlan-table tbody td { padding: 8px 6px; }
}

/* Badge רישיון מתווך - חובה לפי חוק המתווכים במקרקעין (עיצוב עדין, "מאומת" בלי לצרוח) */
.realtor-license-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
    padding: 7px 12px;
    background: var(--wc-card-bg);
    border: 1px solid var(--wc-border);
    border-radius: 999px;
    font-size: 12.5px;
    color: var(--wc-text);
    box-shadow: none;
}
.realtor-license-badge > i {
    color: var(--wc-accent);
    font-size: 13px;
}
.realtor-license-badge span {
    font-weight: 600;
    color: var(--wc-text-2);
    letter-spacing: 0;
}
.realtor-license-badge code {
    background: var(--wc-bg);
    padding: 2px 8px;
    border-radius: 6px;
    font-weight: 700;
    font-size: 12px;
    color: var(--wc-text);
    border: 0;
    font-variant-numeric: tabular-nums;
    margin-inline-start: 2px;
    letter-spacing: .4px;
}

/* מצב "ללא תמונות" - קומפקטי וברנדד, מחליף את הריבוע השחור הגדול */
.gallery-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 38px 20px;
    background: linear-gradient(180deg, #f8fafc, #f1f5f9);
    border: 1.5px dashed #cbd5e1;
    border-radius: var(--wc-radius-lg);
    color: var(--wc-muted, #6b7280);
    text-align: center;
    min-height: 180px;
}
.gallery-empty .ge-icon {
    width: 64px; height: 64px;
    border-radius: 50%;
    background: #fff;
    color: var(--wc-primary, #0091d1);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    box-shadow: 0 6px 16px rgba(15,23,42,.08);
    border: 1px solid #e2e8f0;
}
.gallery-empty .ge-text {
    font-size: 14px;
    font-weight: 500;
    color: var(--wc-text, #0f172a);
}
/* רקע מטושטש בוטל - הוחלף במילוי נקי */
.gallery-bg {
    display: none;
}
.gallery-fg {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    cursor: zoom-in;
    transition: opacity .2s ease;
    user-select: none;
}

/* Prev/Next nav buttons */
.gallery-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    width: 44px; height: 44px;
    border-radius: 50%;
    border: 0;
    background: rgba(15, 23, 42, .55);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    opacity: 0;
    transition: opacity .2s ease, background-color .15s ease, transform .15s ease;
    backdrop-filter: blur(6px);
}
.gallery-main:hover .gallery-nav,
.gallery-nav:focus-visible { opacity: 1; }
.gallery-nav:hover {
    background: rgba(15, 23, 42, .8);
    transform: translateY(-50%) scale(1.06);
}
.gallery-prev { inset-inline-start: 12px; }   /* בצד ההתחלה (ימין ב-RTL) */
.gallery-next { inset-inline-end:   12px; }   /* בצד הסיום (שמאל ב-RTL) */

/* Counter "5 / 10" */
.gallery-counter {
    position: absolute;
    bottom: 12px;
    inset-inline-start: 12px;
    z-index: 2;
    background: rgba(15, 23, 42, .65);
    color: #fff;
    font-size: 12.5px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 999px;
    backdrop-filter: blur(6px);
    pointer-events: none;
    font-variant-numeric: tabular-nums;
    direction: ltr;
}

/* Thumbnails - שורה אופקית עם scroll, ללא wrap */
.gallery-thumbs {
    display: flex;
    gap: 8px;
    margin-top: 12px;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 6px;
    scroll-behavior: smooth;
    scrollbar-width: thin;
    scrollbar-color: var(--wc-border) transparent;
}
.gallery-thumbs::-webkit-scrollbar { height: 6px; }
.gallery-thumbs::-webkit-scrollbar-track { background: transparent; }
.gallery-thumbs::-webkit-scrollbar-thumb { background: var(--wc-border); border-radius: 3px; }

.gallery-thumbs img {
    width: 96px; height: 72px;
    flex: 0 0 96px;
    object-fit: cover;
    border-radius: 10px;
    cursor: pointer;
    border: 2px solid transparent;
    opacity: .7;
    transition: border-color .15s ease, opacity .15s ease, transform .15s ease;
    user-select: none;
}
.gallery-thumbs img:hover { opacity: 1; transform: translateY(-2px); }
.gallery-thumbs img.active {
    border-color: var(--wc-primary);
    opacity: 1;
    box-shadow: 0 4px 14px rgba(0, 145, 209, .25);
}

@media (max-width: 575.98px) {
    .gallery-main { aspect-ratio: 4/3; }
    .gallery-nav { width: 38px; height: 38px; font-size: 15px; opacity: .9; }
    .gallery-thumbs img { width: 78px; height: 60px; flex-basis: 78px; }
}

/* ===== User account pages - בלי מסגרת חיצונית במובייל ===== */
@media (max-width: 767.98px) {
    body.page-profile               .container > .row > [class*="col-"] > .card.p-4,
    body.page-favorites             .container > .row > [class*="col-"] > .card.p-4,
    body.page-notification-settings .container > .row > [class*="col-"] > .card.p-4,
    body.page-sessions              .container > .row > [class*="col-"] > .card.p-4,
    body.page-tickets               .container > .row > [class*="col-"] > .card.p-4,
    body.page-login                 .container > .row > [class*="col-"] > .card.p-4,
    body.page-register              .container > .row > [class*="col-"] > .card.p-4 {
        background: transparent;
        border: 0;
        box-shadow: none;
        border-radius: 0;
        padding: 14px 4px !important;
    }

    /* תמיכה - הפוטר רק מסיח דעת בעמוד שירות. מסתירים במובייל. */
    body.page-tickets .site-footer { display: none; }
}

/* ===== Notifications page - עיצוב נקי ===== */
.notif-shell { padding: 22px 26px; }
.notif-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--wc-border-2);
}
.notif-title {
    font-size: 20px;
    font-weight: 800;
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--wc-text);
    letter-spacing: -.01em;
}
.notif-title i { color: var(--wc-primary); font-size: 18px; }
.notif-count { font-size: 14px; font-weight: 500; color: var(--wc-muted); }
.notif-markall-btn { font-weight: 600; }

.notif-empty {
    text-align: center;
    padding: 48px 24px 32px;
    color: var(--wc-muted);
}
.notif-empty-art {
    width: 88px; height: 88px;
    margin: 0 auto 18px;
    border-radius: 50%;
    background: var(--wc-bg);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--wc-muted-2);
    font-size: 34px;
}
.notif-empty-title {
    font-size: 17px;
    font-weight: 800;
    color: var(--wc-text);
    margin: 0 0 6px;
}
.notif-empty-text {
    font-size: 14px;
    color: var(--wc-muted);
    line-height: 1.55;
}

.notif-list { list-style: none; padding: 0; margin: 0; }
.notif-item {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    padding: 16px 4px;
    border-bottom: 1px solid var(--wc-border-2);
    transition: background-color .12s ease;
}
.notif-item:last-child { border-bottom: 0; }
.notif-item.is-unread { background: linear-gradient(90deg, var(--wc-primary-50) 0%, transparent 60%); }
.notif-item:not(.is-unread) .notif-item-title { font-weight: 600; }

.notif-icon {
    flex: 0 0 40px;
    width: 40px; height: 40px;
    border-radius: 12px;
    background: var(--wc-primary-50);
    color: var(--wc-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
}
.notif-icon.text-success { background: #dcfce7; color: #15803d; }
.notif-icon.text-danger  { background: #fee2e2; color: #b91c1c; }
.notif-icon.text-primary { background: var(--wc-primary-50); color: var(--wc-primary-d); }
.notif-icon.text-muted-2 { background: #f1f5f9; color: var(--wc-muted); }

.notif-body { flex: 1; min-width: 0; }
.notif-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
}
.notif-item-title {
    font-weight: 800;
    font-size: 15px;
    color: var(--wc-text);
    line-height: 1.4;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.notif-new-dot {
    display: inline-block;
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--wc-primary);
    box-shadow: 0 0 0 3px rgba(0, 145, 209,.18);
}
.notif-time {
    font-size: 12.5px;
    color: var(--wc-muted);
    white-space: nowrap;
    flex-shrink: 0;
}
.notif-message {
    color: var(--wc-muted);
    font-size: 13.5px;
    line-height: 1.55;
    margin-top: 4px;
    white-space: pre-line;
}
.notif-markone { margin: 0; }
.notif-markone .btn-link {
    padding: 0;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}
.notif-markone .btn-link:hover { text-decoration: underline; }

/* ===== התראות הניתנות ללחיצה ===== */
/* כותרת לחיצה */
.notif-title-link {
    color: inherit;
    text-decoration: none;
    transition: color .12s ease;
}
.notif-title-link:hover { color: var(--wc-primary-d); text-decoration: underline; }
/* שורת פעולות: CTA + "סמן כנקרא" */
.notif-actions {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 8px;
    flex-wrap: wrap;
}
.notif-cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 700;
    color: var(--wc-primary-d);
    text-decoration: none;
    transition: gap .14s ease, color .12s ease;
}
.notif-cta i { font-size: 11px; }
.notif-cta:hover { color: var(--wc-primary); gap: 9px; }
/* רמז ויזואלי שהפריט לחיץ */
.notif-item.has-link { cursor: pointer; }
.notif-item.has-link:hover { background: var(--wc-primary-50); }

.notif-footer-note {
    font-size: 12px;
    color: var(--wc-muted-2);
    text-align: center;
    margin-top: 18px;
    opacity: .8;
}

/* מובייל - בלי מסגרת חיצונית, edge-to-edge בתוך הקונטיינר */
@media (max-width: 767.98px) {
    body.page-notifications .notif-shell {
        background: transparent;
        border: 0;
        box-shadow: none;
        border-radius: 0;
        padding: 14px 4px 22px !important;
    }
    body.page-notifications .notif-head {
        padding: 0 8px 12px;
    }
    body.page-notifications .notif-title { font-size: 18px; }
    body.page-notifications .notif-markall-btn {
        font-size: 12.5px;
        padding: 6px 10px;
    }
    body.page-notifications .notif-list { padding: 0 8px; }
    body.page-notifications .notif-item { padding: 14px 0; gap: 12px; }
    body.page-notifications .notif-icon { flex-basis: 36px; width: 36px; height: 36px; font-size: 15px; border-radius: 10px; }
    body.page-notifications .notif-item-title { font-size: 14.5px; }
    body.page-notifications .notif-message { font-size: 13px; }
}

/* ===== Listing page - מובייל ===== */
@media (max-width: 991.98px) {
    /* מקום לסרגל ה-CTA הדביק בתחתית - רק כשהוא קיים (לא בעלי מודעה / מודעות לא-פעילות) */
    body.page-listing:has(.listing-sticky-cta) { padding-bottom: 122px; }
    body.page-listing main { padding-bottom: 12px; }

    /* הסתרת כרטיס המוכר במלואו במובייל - פרטי המפרסם כבר מופיעים בסרגל הדביק */
    body.page-listing:has(.listing-sticky-cta) .seller-card { display: none; }

    /* פרטי המוכר בסרגל הדביק - לחיצים רק אם זה עסק עם פרופיל עסקי */
    body.page-listing:has(.listing-sticky-cta) .lsc-seller:not(.lsc-seller-link) {
        pointer-events: none;
        cursor: default;
    }
    body.page-listing:has(.listing-sticky-cta) .lsc-seller:not(.lsc-seller-link) .lsc-seller-chev {
        display: none;
    }

    /* breadcrumb לא מוסיף ערך במובייל - אזור עליון יקר */
    body.page-listing > main > .container > nav.small { display: none; }
    body.page-listing > main > .container { padding-top: 0; padding-bottom: 16px; }

    /* גלריה edge-to-edge - שובר את ה-container, בלי מסגרת כרטיס */
    body.page-listing .col-lg-8 > .card:first-of-type {
        width: 100vw;
        margin-inline-start: calc(50% - 50vw);
        margin-top: 0;
        margin-bottom: 14px;
        padding: 0 !important;
        background: transparent;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }
    body.page-listing .gallery-main {
        border-radius: 0;
        aspect-ratio: 4/3;
        max-height: 62vh;
        box-shadow: none;
    }
    body.page-listing .gallery-thumbs { display: none; }
    body.page-listing .gallery-counter {
        bottom: 14px;
        inset-inline-start: 14px;
        background: rgba(15,23,42,.72);
        font-size: 12px;
        padding: 5px 11px;
    }
    body.page-listing .gallery-nav { opacity: 1; background: rgba(15,23,42,.5); }

    /* כרטיסי תוכן - מסגרת מוסרת, תצוגה שטוחה ישירות על הרקע */
    body.page-listing .col-lg-8 > .card.p-4,
    body.page-listing .col-lg-8 > .card.share-card {
        background: transparent;
        border: 0;
        box-shadow: none;
        border-radius: 0;
        padding: 4px 4px !important;
        margin-bottom: 6px;
    }
    body.page-listing .container .card .h3 { font-size: 1.3rem; }
    body.page-listing .container .card .text-primary { font-size: 1.7rem; }
}

/* ===== כפתורים צפים על גלריה (שיתוף + מועדפים) - מובייל בלבד ===== */
.gallery-floating-actions {
    position: absolute;
    top: 12px;
    inset-inline-start: 12px;
    z-index: 4;
    display: flex;
    flex-direction: column;
    gap: 10px;
    pointer-events: auto;
}
.gfa-btn {
    width: 40px; height: 40px;
    border-radius: 50%;
    background: rgba(255,255,255,.95);
    color: var(--wc-text);
    border: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    box-shadow: 0 6px 18px rgba(15,23,42,.28);
    backdrop-filter: blur(6px);
    cursor: pointer;
    transition: transform .12s ease, background-color .15s ease;
}
.gfa-btn:hover  { background: #fff; }
.gfa-btn:active { transform: scale(.94); }
.gfa-fav.is-active i { color: var(--wc-danger); }
.gfa-fav.is-active   { background: #fff; }

/* ===== Blocked users page - מבנה דומה לצ'אט (header + רשימה) ===== */
.bu-shell {
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
}
.bu-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--wc-border-2);
    background: var(--wc-card-bg);
    flex-shrink: 0;
}
.bu-title {
    flex: 1;
    margin: 0;
    font-size: 16px;
    font-weight: 800;
    color: var(--wc-text);
    display: flex;
    align-items: center;
    gap: 8px;
    letter-spacing: -.01em;
}
.bu-title i { font-size: 14px; }
.bu-back-desktop { flex-shrink: 0; }

.bu-intro {
    padding: 14px 18px 6px;
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--wc-muted);
    flex-shrink: 0;
}

.blocked-users-list {
    list-style: none;
    padding: 0 16px;
    margin: 0;
    overflow-y: auto;
    flex: 1;
    min-height: 0;
}
.blocked-user-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 0;
    border-bottom: 1px solid var(--wc-border-2);
}
.blocked-user-item:last-child { border-bottom: 0; }
.bu-avatar {
    width: 48px; height: 48px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid var(--wc-border);
    flex-shrink: 0;
}
.bu-info { flex: 1; min-width: 0; }
.bu-name {
    font-weight: 700;
    font-size: 15px;
    color: var(--wc-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bu-meta {
    font-size: 12.5px;
    color: var(--wc-muted);
    margin-top: 2px;
}
.bu-unblock { flex-shrink: 0; font-weight: 600; }
.bu-unblock.is-loading { opacity: .6; pointer-events: none; }

/* Empty state - דומה ל-chat-threads-empty */
.bu-empty {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 24px;
    text-align: center;
    color: var(--wc-muted);
}
.bu-empty-art {
    width: 96px; height: 96px;
    margin: 0 auto 20px;
    border-radius: 50%;
    background: linear-gradient(135deg, #ecfdf5, #d1fae5);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--wc-success);
    font-size: 38px;
    box-shadow: 0 12px 32px rgba(22,163,74,.18);
}
.bu-empty-title {
    font-size: 17px;
    font-weight: 800;
    color: var(--wc-text);
    margin: 0 0 6px;
}
.bu-empty-text {
    font-size: 13.5px;
    color: var(--wc-muted);
    line-height: 1.55;
    max-width: 280px;
    margin: 0 auto;
}

/* בדסקטופ - כרטיס רגיל עם מסגרת, padding נוח */
@media (min-width: 992px) {
    .bu-shell {
        border: 1px solid var(--wc-border);
        border-radius: var(--wc-radius-lg);
        background: var(--wc-card-bg);
        box-shadow: var(--wc-shadow);
        overflow: hidden;
    }
    .bu-head .chat-exit { display: none; }
}

/* ===== קישור דיווח דיסקרטי במובייל (חלופה לכפתור שהיה בכרטיס המוכר) ===== */
.listing-report-mobile {
    text-align: center;
    padding: 10px 0 4px;
    font-size: 13px;
}
.listing-report-mobile a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--wc-muted);
    text-decoration: none;
    padding: 8px 14px;
    border-radius: 999px;
    transition: color .15s ease, background-color .15s ease;
}
.listing-report-mobile a:hover,
.listing-report-mobile a:focus { color: var(--wc-danger); background: #fef2f2; }
.listing-report-mobile a i { font-size: 11px; }

/* ===== Sticky bottom CTA bar - 2 שורות: מוכר + פעולות ===== */
.listing-sticky-cta {
    position: fixed;
    inset-inline: 0;
    bottom: 0;
    z-index: 1040;
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 0;
    background: rgba(255,255,255,.98);
    border-top: 1px solid var(--wc-border);
    box-shadow: 0 -10px 28px rgba(15,23,42,.12);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

/* שורה 1 - קישור לכרטיס המוכר המלא */
.lsc-seller {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 14px;
    color: var(--wc-text);
    text-decoration: none;
    border-bottom: 1px solid var(--wc-border-2);
    transition: background-color .15s ease;
    min-height: 50px;
}
.lsc-seller:hover, .lsc-seller:active { background: var(--wc-primary-50); color: var(--wc-text); }

.lsc-seller-avatar {
    flex: 0 0 36px;
    width: 36px; height: 36px;
    border-radius: 50%;
    overflow: hidden;
    background: var(--wc-primary-50);
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.lsc-seller-avatar img {
    width: 100%; height: 100%;
    object-fit: cover;
    border-radius: 50%;
}
.lsc-seller-avatar-initials {
    background: linear-gradient(135deg, var(--wc-primary), var(--wc-primary-d));
    color: #fff;
    font-weight: 700;
    font-size: 14px;
}
.lsc-seller-presence {
    position: absolute;
    bottom: -1px;
    inset-inline-end: -1px;
    width: 10px; height: 10px;
    border-radius: 50%;
    background: var(--wc-success);
    border: 2px solid #fff;
}

.lsc-seller-info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}
.lsc-seller-name {
    font-size: 13.5px;
    font-weight: 700;
    color: var(--wc-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.lsc-seller-biz {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px; height: 18px;
    background: var(--wc-primary-50);
    color: var(--wc-primary-d);
    border-radius: 5px;
    font-size: 9px;
    flex-shrink: 0;
}
.lsc-seller-meta {
    font-size: 11.5px;
    color: var(--wc-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.lsc-seller-online {
    color: var(--wc-success);
    font-weight: 600;
}
.lsc-seller-online i {
    font-size: 7px;
    margin-inline-end: 3px;
    vertical-align: middle;
}
.lsc-seller-chev {
    color: var(--wc-muted-2);
    font-size: 11px;
    flex-shrink: 0;
}

/* גרסה לחיצה (עסקים) - רמז ויזואלי שיש פרופיל ללחוץ עליו */
.lsc-seller-link { cursor: pointer; }
.lsc-seller-link .lsc-seller-chev {
    color: var(--wc-primary);
    font-size: 12px;
    transition: transform .15s ease;
}
.lsc-seller-link:hover .lsc-seller-chev,
.lsc-seller-link:active .lsc-seller-chev {
    transform: translateX(-3px); /* RTL: התקדמות שמאלה */
}
.lsc-seller-link .lsc-seller-link-hint {
    color: var(--wc-primary-d);
    font-weight: 600;
}

/* שורה 2 - כפתורי פעולה */
.lsc-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
}
.lsc-btn {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 44px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    border: 1px solid transparent;
    cursor: pointer;
    transition: background-color .15s ease, transform .1s ease, border-color .15s ease;
    line-height: 1;
    padding: 0 12px;
    white-space: nowrap;
}
.lsc-btn:active { transform: scale(.98); }
.lsc-btn i { font-size: 15px; }

/* כפתור מועדפים - אייקון בלבד, מעוצב פחות בולט */
.lsc-fav {
    flex: 0 0 44px;
    width: 44px;
    background: #fff;
    color: var(--wc-text);
    border-color: var(--wc-border);
    padding: 0;
}
.lsc-fav.is-active { color: var(--wc-danger); border-color: var(--wc-danger); background: #fef2f2; }

/* הודעה - משני */
.lsc-message {
    background: var(--wc-primary-50);
    color: var(--wc-primary-d);
    border-color: var(--wc-primary-50);
}
.lsc-message:hover { background: #e0eaff; color: var(--wc-primary-d); }

/* טלפון - ראשי, ירוק (פעולה הכי "המרה") */
.lsc-phone {
    background: var(--wc-success);
    color: #fff;
    flex: 1.7;
}
.lsc-phone:hover { background: #15803d; color: #fff; }
.lsc-phone.is-disabled,
.lsc-phone[disabled] {
    background: #e2e8f0;
    color: var(--wc-muted);
    cursor: not-allowed;
}

/* ===== PDF Viewer (privacy/terms) ===== */
.pdf-viewer-wrap {
    background: #f3f4f6;
    border: 1px solid var(--wc-border, #e5e7eb);
    border-radius: 10px;
    overflow: hidden;
}
.pdf-viewer {
    display: block;
    width: 100%;
    height: 80vh;
    min-height: 480px;
    border: 0;
}
@media (max-width: 575.98px) {
    .pdf-viewer { height: 75vh; min-height: 400px; }
}

/* ===== Gallery Lightbox (fullscreen) ===== */
.lightbox {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, .94);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 60px 70px;
    animation: lightbox-fade .18s ease-out;
    touch-action: pan-y;
}
@keyframes lightbox-fade { from { opacity: 0; } to { opacity: 1; } }

.lightbox-img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: 8px;
    user-select: none;
    cursor: default;
    animation: lightbox-img-in .2s ease-out;
}
@keyframes lightbox-img-in {
    from { opacity: 0; transform: scale(.96); }
    to   { opacity: 1; transform: scale(1); }
}

.lightbox-close,
.lightbox-nav {
    position: absolute;
    background: rgba(255, 255, 255, .12);
    color: #fff;
    border: 0;
    cursor: pointer;
    backdrop-filter: blur(8px);
    transition: background-color .15s ease, transform .15s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.lightbox-close:hover,
.lightbox-nav:hover { background: rgba(255, 255, 255, .22); transform: scale(1.06); }

.lightbox-close {
    top: 16px;
    inset-inline-end: 16px;
    width: 44px; height: 44px;
    border-radius: 50%;
    font-size: 20px;
}
.lightbox-nav {
    top: 50%;
    transform: translateY(-50%);
    width: 52px; height: 52px;
    border-radius: 50%;
    font-size: 22px;
}
.lightbox-nav:hover { transform: translateY(-50%) scale(1.08); }
.lightbox-prev { inset-inline-start: 20px; }
.lightbox-next { inset-inline-end:   20px; }

.lightbox-counter {
    position: absolute;
    top: 20px;
    inset-inline-start: 50%;
    transform: translateX(50%);
    background: rgba(0, 0, 0, .5);
    color: #fff;
    font-size: 13.5px;
    font-weight: 600;
    padding: 6px 14px;
    border-radius: 999px;
    backdrop-filter: blur(6px);
    font-variant-numeric: tabular-nums;
    direction: ltr;
}

@media (max-width: 575.98px) {
    .lightbox { padding: 50px 12px; }
    .lightbox-nav { width: 42px; height: 42px; font-size: 18px; }
    .lightbox-prev { inset-inline-start: 8px; }
    .lightbox-next { inset-inline-end:   8px; }
    .lightbox-close { width: 40px; height: 40px; font-size: 18px; top: 12px; inset-inline-end: 12px; }
    .lightbox-counter { top: 14px; font-size: 12px; padding: 4px 10px; }
}

/* ===== Avatars ===== */
.avatar-sm { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; border: 1px solid var(--wc-border); }
.avatar-md { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; border: 2px solid var(--wc-border); box-shadow: var(--wc-shadow-xs); }

/* אווטר עם ראשי תיבות - כשלמשתמש אין תמונת פרופיל */
.avatar-initials {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--wc-primary), var(--wc-primary-d));
    color: #fff;
    font-weight: 700;
    text-transform: uppercase;
    border: 0;
    flex-shrink: 0;
    box-shadow: 0 2px 6px rgba(0, 145, 209,.25);
    line-height: 1;
}
.avatar-sm.avatar-initials { font-size: 16px; }
.avatar-md.avatar-initials { font-size: 26px; }

/* ===== Avatar upload (profile) ===== */
.avatar-upload {
    position: relative;
    display: inline-block;
    width: 96px;
    height: 96px;
    cursor: pointer;
    flex-shrink: 0;
}
.avatar-upload img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid #fff;
    box-shadow: 0 4px 14px rgba(15,23,42,.12);
    transition: transform .15s ease, filter .15s ease;
}
.avatar-upload:hover img { filter: brightness(.92); transform: scale(1.02); }
/* ראשי-תיבות כברירת מחדל בעמוד הפרופיל (במקום no-image.svg המכוער).
   ממוקד ל-.avatar-upload בלבד כדי לא לדרוס את .avatar-initials הכללי (צ'אט/תפריט). */
.avatar-upload .avatar-initials {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    display: flex;
    font-size: 42px;
    border: 3px solid #fff;
    box-shadow: 0 4px 14px rgba(15,23,42,.12);
    user-select: none;
}
.avatar-upload:hover .avatar-initials { filter: brightness(.95); }
.avatar-upload-overlay {
    position: absolute;
    bottom: 0;
    inset-inline-end: 0;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--wc-primary);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    border: 3px solid #fff;
    box-shadow: 0 2px 8px rgba(0, 145, 209,.35);
    transition: background-color .15s ease, transform .15s ease;
}
.avatar-upload:hover .avatar-upload-overlay {
    background: var(--wc-primary-d);
    transform: scale(1.06);
}

/* ===== Premium profile ===== */
body.page-profile .profile-card {
    padding: 0;
    overflow: hidden;
    border-radius: var(--wc-radius-lg);
    box-shadow: var(--wc-shadow-h);
}

/* hero - cover מדורג + אווטר חופף */
.profile-hero { position: relative; padding: 0 26px 18px; }
.profile-hero-cover {
    position: relative;
    height: 110px;
    margin: 0 -26px;
    background:
        radial-gradient(130% 150% at 100% 0%, rgba(255,255,255,.22), transparent 55%),
        linear-gradient(120deg, var(--wc-primary) 0%, var(--wc-primary-d) 100%);
}
/* טקסטורת נקודות עדינה - גימור פרימיום */
.profile-hero-cover::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(255,255,255,.16) 1px, transparent 1.4px);
    background-size: 16px 16px;
    opacity: .55;
}
.profile-hero-inner {
    position: relative;
    display: flex;
    align-items: flex-end;
    gap: 18px;
}
.profile-hero-avatar { width: 104px; height: 104px; margin-top: -46px; flex-shrink: 0; }
.profile-hero-avatar img,
.profile-hero-avatar .avatar-initials { border: 4px solid #fff; box-shadow: 0 10px 28px rgba(15,23,42,.18); }
.profile-hero-avatar .avatar-initials { font-size: 46px; }
.profile-hero-avatar .avatar-upload-overlay { width: 34px; height: 34px; }
.profile-hero-meta { min-width: 0; padding-bottom: 4px; }
.profile-hero-name {
    font-size: 1.5rem;
    font-weight: 800;
    margin: 0 0 6px;
    line-height: 1.15;
    letter-spacing: -.02em;
}
.profile-hero-sub {
    display: flex; flex-wrap: wrap; align-items: center;
    gap: 8px 12px;
    color: var(--wc-muted);
    font-size: .9rem;
}
.profile-hero-sub > span[dir="ltr"] i { color: var(--wc-primary); margin-inline-end: 2px; }
.account-badge {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 3px 11px;
    border-radius: 999px;
    font-size: .78rem; font-weight: 700;
    background: var(--wc-primary-50);
    color: var(--wc-primary-d);
}
.profile-hero-actions {
    margin-inline-start: auto;
    padding-bottom: 4px;
    text-align: start;
    flex-shrink: 0;
}
.profile-hero-actions .form-text { margin-top: 5px; font-size: .76rem; }
.profile-hero-photo-btn {
    border: 1px solid var(--wc-border);
    background: #fff;
    color: var(--wc-text-2);
    font-weight: 600;
    box-shadow: var(--wc-shadow-xs);
}
.profile-hero-photo-btn:hover {
    border-color: var(--wc-primary);
    color: var(--wc-primary-d);
    background: var(--wc-primary-50);
}

/* גוף - מקובץ לסקשנים עם כותרת-אייקון */
.profile-body { padding: 6px 26px 26px; }
.profile-section { padding: 20px 0; border-top: 1px solid var(--wc-border-2); }
.profile-section:first-of-type { border-top: 0; padding-top: 10px; }
.profile-section-title {
    display: flex; align-items: center; gap: 10px;
    font-size: 1.02rem; font-weight: 700;
    margin: 0 0 16px;
}
.profile-section-title i {
    flex-shrink: 0;
    width: 32px; height: 32px;
    border-radius: 10px;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--wc-primary-50);
    color: var(--wc-primary-d);
    font-size: .92rem;
}
.profile-actions {
    padding-top: 22px;
    border-top: 1px solid var(--wc-border-2);
    display: flex;
}
.profile-actions .btn { min-width: 180px; font-weight: 700; }

@media (max-width: 575.98px) {
    body.page-profile .profile-hero { padding: 0 16px 16px; }
    .profile-hero-cover { margin: 0 -16px; height: 96px; }
    .profile-hero-inner {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 8px;
    }
    .profile-hero-avatar { margin-top: -52px; }
    .profile-hero-meta { padding-bottom: 0; }
    .profile-hero-sub { justify-content: center; }
    .profile-hero-actions { margin-inline-start: 0; padding-bottom: 0; text-align: center; }
    .profile-body { padding: 4px 16px 20px; }
    .profile-actions .btn { width: 100%; }
}

/* ===== Account sidebar (פרימיום) ===== */
.user-nav-card {
    padding: 0;
    overflow: hidden;
    border-radius: var(--wc-radius-lg);
    position: sticky;
    top: 88px;
}
.user-nav-head {
    position: relative;
    padding: 0 18px 16px;
    text-align: center;
}
.user-nav-cover {
    height: 64px;
    margin: 0 -18px 0;
    background:
        radial-gradient(120% 160% at 100% 0%, rgba(255,255,255,.18), transparent 55%),
        linear-gradient(120deg, var(--wc-primary) 0%, var(--wc-primary-d) 100%);
}
.user-nav-avatar {
    width: 76px; height: 76px;
    border-radius: 50%;
    object-fit: cover;
    border: 4px solid #fff;
    box-shadow: 0 8px 22px rgba(15,23,42,.16);
    margin-top: -38px;
    background: #fff;
}
/* ראשי-תיבות כברירת מחדל לאווטר תפריט הצד (במקום no-image.svg) */
.user-nav-avatar-initials {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-inline: auto;   /* מרכוז: אלמנט block לא מתמרכז ע"י text-align כמו ה-img */
    background: linear-gradient(135deg, var(--wc-primary, #0091d1), var(--wc-primary-d, #0073a8));
    color: #fff;
    font-weight: 800;
    font-size: 32px;
    line-height: 1;
    text-transform: uppercase;
    user-select: none;
}
.user-nav-name {
    font-weight: 700;
    font-size: 1.08rem;
    margin-top: 10px;
    line-height: 1.25;
    letter-spacing: -.01em;
    color: var(--wc-text);
}
.user-nav-phone {
    font-size: .85rem;
    color: var(--wc-muted);
    margin-top: 3px;
    letter-spacing: .02em;
}
.user-nav-list { padding: 6px 10px 12px; }
.user-nav-item {
    display: flex; align-items: center; gap: 11px;
    padding: 10px 12px;
    border-radius: 11px;
    color: var(--wc-text-2);
    font-weight: 500;
    text-decoration: none;
    transition: background-color .15s ease, color .15s ease, transform .12s ease;
}
.user-nav-item i {
    width: 20px; text-align: center;
    color: var(--wc-muted);
    font-size: .98rem;
    transition: color .15s ease;
}
.user-nav-item:hover {
    background: var(--wc-primary-50);
    color: var(--wc-primary-d);
}
.user-nav-item:hover i { color: var(--wc-primary-d); }
.user-nav-item.is-active {
    background: linear-gradient(120deg, var(--wc-primary), var(--wc-primary-d));
    color: #fff;
    box-shadow: 0 6px 16px rgba(0,145,209,.30);
}
.user-nav-item.is-active i { color: #fff; }
.user-nav-sep { height: 1px; background: var(--wc-border-2); margin: 8px 6px; }
.user-nav-logout { color: var(--wc-danger); }
.user-nav-logout i { color: var(--wc-danger); }
.user-nav-logout:hover { background: #fef2f2; color: var(--wc-danger); }
.user-nav-logout:hover i { color: var(--wc-danger); }

/* ===== כותרת עמוד אחידה (פרימיום) - עמודי אזור אישי ===== */
.page-head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 20px;
}
.page-head-ico {
    flex-shrink: 0;
    width: 46px; height: 46px;
    border-radius: 13px;
    display: inline-flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, var(--wc-primary-50), var(--wc-primary-100));
    color: var(--wc-primary-d);
    font-size: 1.15rem;
}
.page-head-text { min-width: 0; }
.page-head-text h1 {
    font-size: 1.4rem;
    font-weight: 800;
    margin: 0;
    line-height: 1.2;
}
.page-head-text p {
    margin: 3px 0 0;
    color: var(--wc-muted);
    font-size: .88rem;
}
.page-head-actions { margin-inline-start: auto; flex-shrink: 0; }
@media (max-width: 575.98px) {
    .page-head { gap: 11px; margin-bottom: 16px; }
    .page-head-ico { width: 40px; height: 40px; font-size: 1rem; border-radius: 11px; }
    .page-head-text h1 { font-size: 1.2rem; }
}

/* ===== nav-pills מותגים (פילטרים) ===== */
.nav-pills .nav-link {
    color: var(--wc-text-2);
    font-weight: 600;
    font-size: .9rem;
    border-radius: 999px;
    padding: .4rem 1rem;
    border: 1px solid var(--wc-border);
    background: #fff;
    transition: all .15s ease;
}
.nav-pills .nav-link:hover { border-color: var(--wc-primary); color: var(--wc-primary-d); }
.nav-pills .nav-link.active {
    background: var(--wc-primary);
    border-color: var(--wc-primary);
    color: #fff;
    box-shadow: 0 4px 12px rgba(0,145,209,.28);
}
.nav-pills { gap: 8px; }

/* ===== Checkboxes / switches / radios - בצבע המותג (לא כחול בוטסטרפ) ===== */
.form-check-input:checked {
    background-color: var(--wc-primary);
    border-color: var(--wc-primary);
}
.form-check-input:focus {
    border-color: var(--wc-primary);
    box-shadow: 0 0 0 .2rem rgba(0, 145, 209, .25);
}
.form-switch .form-check-input { width: 2.4em; height: 1.3em; cursor: pointer; }

/* ===== טבלת העדפות התראות ===== */
.prefs-table { border-color: var(--wc-border); margin-bottom: 0; }
.prefs-table thead th {
    background: var(--wc-primary-50);
    color: var(--wc-text-2);
    font-weight: 700;
    font-size: .85rem;
    border-color: var(--wc-border);
    white-space: nowrap;
}
.prefs-table td, .prefs-table th { border-color: var(--wc-border-2); vertical-align: middle; }
.prefs-table tbody tr { transition: background-color .12s ease; }
.prefs-table tbody tr:hover { background: #fafbfd; }

/* ===== Drag & drop ===== */
.dropzone {
    border: 2px dashed var(--wc-border);
    border-radius: var(--wc-radius);
    padding: 36px 20px;
    text-align: center;
    color: var(--wc-muted);
    cursor: pointer;
    background: #fcfcfd;
    transition: border-color .15s ease, background-color .15s ease, color .15s ease;
}
.dropzone:hover, .dropzone.drag {
    border-color: var(--wc-primary);
    background: var(--wc-primary-50);
    color: var(--wc-primary);
}

/* ===== Brand picker (יצרני רכב) ===== */
.brand-picker { margin-top: 6px; }
.brand-search {
    position: relative;
    margin-bottom: 10px;
}
.brand-search i {
    position: absolute;
    inset-inline-start: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--wc-muted, #6b7280);
    font-size: 14px;
    pointer-events: none;
}
.brand-search-input {
    min-height: 46px;
    padding-inline-start: 40px;
    border-radius: 10px;
    border-color: var(--wc-border, #e5e7eb);
    background: #fff;
}
.brand-search-input:focus {
    border-color: var(--wc-primary, #0091d1);
    box-shadow: 0 0 0 .2rem rgba(0, 145, 209,.12);
}
.brand-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(106px, 1fr));
    gap: 10px;
}
.brand-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 6px 10px;
    background: #fff;
    border: 2px solid var(--wc-border, #e5e7eb);
    border-radius: 12px;
    cursor: pointer;
    transition: all .15s ease;
    min-height: 92px;
}
.brand-card:hover {
    border-color: var(--wc-primary, #0091d1);
    box-shadow: 0 4px 14px rgba(0, 145, 209,.12);
    transform: translateY(-1px);
}
.brand-card.is-active {
    border-color: var(--wc-primary, #0091d1);
    background: var(--wc-primary-50, #e6f4fb);
    box-shadow: 0 4px 14px rgba(0, 145, 209,.18);
}
.brand-logo {
    width: 40px; height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #111827;
    position: relative;
}
.brand-logo img {
    max-width: 100%; max-height: 100%;
    object-fit: contain;
    filter: grayscale(.1);
    transition: filter .15s ease;
}
.brand-card:hover .brand-logo img,
.brand-card.is-active .brand-logo img { filter: grayscale(0); }
.brand-logo i { font-size: 18px; color: var(--wc-muted, #6b7280); }

/* Fallback letter badge - מוצג רק כשאין img או שה-img נכשל */
.brand-logo-text {
    display: none;
    width: 40px; height: 40px;
    border-radius: 10px;
    background: linear-gradient(135deg, #0091d1, #0073a8);
    color: #fff;
    font-weight: 800;
    font-size: 15px;
    letter-spacing: -.02em;
    align-items: center;
    justify-content: center;
    direction: ltr;
}
/* אין img → תמיד מציגים את ה-text */
.brand-logo.has-no-img .brand-logo-text { display: inline-flex; }
/* יש img שנכשל → מסתיר את ה-img ומציג את ה-text */
.brand-logo img[data-failed] { display: none; }
.brand-logo img[data-failed] ~ .brand-logo-text { display: inline-flex; }
.brand-card:hover .brand-logo-text,
.brand-card.is-active .brand-logo-text {
    box-shadow: 0 4px 10px rgba(0, 145, 209,.35);
}
.brand-name {
    font-size: 12.5px;
    font-weight: 600;
    color: var(--wc-text);
    text-align: center;
    line-height: 1.2;
}
.brand-no-results {
    margin-top: 10px;
    padding: 10px 12px;
    border: 1px dashed var(--wc-border, #e5e7eb);
    border-radius: 10px;
    color: var(--wc-muted, #6b7280);
    background: #f9fafb;
    font-size: 13px;
}
.brand-other { background: linear-gradient(180deg, #fff, #f9fafb); }
.brand-other-input { margin-top: 10px; }

@media (max-width: 575.98px) {
    .brand-search-input { min-height: 42px; }
    .brand-grid { grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: 8px; }
    .brand-card { padding: 10px 4px 8px; min-height: 80px; }
    .brand-logo { width: 32px; height: 32px; }
    .brand-logo-text { width: 32px; height: 32px; font-size: 13px; border-radius: 8px; }
    .brand-name { font-size: 11px; }
}

/* ===== Wizard - Create listing (professional layout) ===== */
.wizard-card {
    background: #fff;
    border: 1px solid var(--wc-border);
    border-radius: var(--wc-radius-lg);
    box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 10px 40px -10px rgba(15, 23, 42, .08);
    overflow: hidden;
}
.wizard-head {
    padding: 30px 36px 24px;
    background:
        radial-gradient(120% 150% at 100% 0%, rgba(0, 145, 209, .10), transparent 55%),
        linear-gradient(180deg, #ffffff, #fafbff);
    border-bottom: 1px solid var(--wc-border-2, #f1f5f9);
}
.wizard-head h1 {
    display: flex; align-items: center; gap: 13px;
    letter-spacing: -.01em; font-size: 26px;
}
.wizard-head h1 i {
    flex: 0 0 auto;
    width: 46px; height: 46px; border-radius: 14px;
    display: inline-flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, var(--wc-primary, #0091d1), var(--wc-primary-l, #38bdf8));
    color: #fff !important; font-size: 20px; margin: 0;
    box-shadow: 0 10px 20px -6px rgba(0, 145, 209, .5);
}
.wizard-head p { font-size: 15px; margin-top: 8px; }
.wizard-body {
    padding: 32px 36px 36px;
}

/* ===== Mobile-first progress indicator (פס התקדמות פשוט) ===== */
.wizard-progress-mobile {
    display: none;
    padding: 14px 18px 16px;
    background: #fafbff;
    border-bottom: 1px solid var(--wc-border-2, #f1f5f9);
}
.wizard-progress-mobile .wpm-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 8px;
    font-size: 15px;
}
.wizard-progress-mobile .wpm-step { font-weight: 700; color: var(--wc-primary-d, #0073a8); }
.wizard-progress-mobile .wpm-name { font-weight: 600; color: var(--wc-text); }
.wizard-progress-mobile .wpm-bar {
    height: 8px;
    background: #e5e7eb;
    border-radius: 999px;
    overflow: hidden;
}
.wizard-progress-mobile .wpm-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--wc-primary, #0091d1), #38bdf8);
    border-radius: 999px;
    transition: width .25s ease;
}
@media (max-width: 767.98px) {
    .wizard-progress-mobile { display: block; }
}

/* ===== Stepper ===== */
.wizard-stepper {
    list-style: none;
    margin: 0;
    padding: 22px 32px 20px;
    background: #fafbff;
    border-bottom: 1px solid var(--wc-border-2, #f1f5f9);
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    position: relative;
}
.ws-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    position: relative;
    text-align: center;
    cursor: default;
    color: var(--wc-muted, #6b7280);
    font-size: 14px;
    line-height: 1.25;
    padding: 4px 8px;
}
.ws-step + .ws-step::before {
    content: '';
    position: absolute;
    top: 18px;
    height: 2px;
    background: var(--wc-border, #e5e7eb);
    inset-inline-end: 50%;
    inset-inline-start: -50%;
    z-index: 0;
}
.ws-circle {
    position: relative;
    z-index: 1;
    width: 44px; height: 44px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid var(--wc-border, #e5e7eb);
    color: var(--wc-muted, #6b7280);
    font-weight: 700;
    font-size: 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .06);
    transition: all .2s cubic-bezier(.16, 1, .3, 1);
}
.ws-label { font-weight: 600; color: var(--wc-text); font-size: 14px; }
.ws-label small {
    display: block; font-weight: 500; font-size: 11.5px;
    color: var(--wc-muted-2, #94a3b8); margin-top: 3px;
}

.ws-step.is-completed { cursor: pointer; }
.ws-step.is-completed .ws-circle {
    background: linear-gradient(135deg, var(--wc-success, #16a34a), #22c55e);
    border-color: transparent;
    color: transparent;
    font-size: 0;
    box-shadow: 0 6px 14px -5px rgba(22, 163, 74, .5);
}
.ws-step.is-completed .ws-circle::before {
    content: "\f00c";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 16px;
    color: #fff;
}
.ws-step.is-completed .ws-circle > * { display: none; }
.ws-step.is-completed + .ws-step::before { background: var(--wc-success, #16a34a); }

.ws-step.is-current .ws-circle {
    background: linear-gradient(135deg, var(--wc-primary, #0091d1), var(--wc-primary-l, #38bdf8));
    border-color: transparent;
    color: #fff;
    box-shadow: 0 0 0 5px rgba(0, 145, 209, .16), 0 10px 18px -6px rgba(0, 145, 209, .5);
    transform: scale(1.08);
}
.ws-step.is-current .ws-label { color: var(--wc-primary-d, #0073a8); font-weight: 700; }
.ws-step + .ws-step::before { top: 22px; }

@media (max-width: 767.98px) {
    /* בנייד מסתירים את ה-stepper המלא - מציגים בפס התקדמות פשוט מעליו */
    .wizard-stepper { display: none; }
}

/* ===== Step header ===== */
.step-header {
    margin-bottom: 26px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--wc-border-2, #f1f5f9);
}
.step-header h2 { letter-spacing: -.01em; color: var(--wc-text); font-size: 22px; }
.step-header p { color: var(--wc-muted, #6b7280); font-size: 14.5px; margin-bottom: 0; }

/* מעבר חלק בין שלבי האשף - תחושת פרימיום וכיף */
@keyframes wizStepIn {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: none; }
}
.wizard-body [data-step].step-in { animation: wizStepIn .3s cubic-bezier(.16, 1, .3, 1); }
@media (prefers-reduced-motion: reduce) {
    .wizard-body [data-step].step-in { animation: none; }
}

/* ===== Category picker (כרטיסים + drill-down) ===== */
.cat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
    gap: 12px;
}
.cat-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 11px;
    min-height: 118px;
    padding: 20px 12px;
    background: #fff;
    border: 1px solid var(--wc-border, #e5e7eb);
    border-radius: 16px;
    cursor: pointer;
    text-align: center;
    transition: border-color .15s ease, box-shadow .2s ease, transform .15s cubic-bezier(.16, 1, .3, 1);
}
.cat-card:hover {
    border-color: var(--wc-primary, #0091d1);
    box-shadow: 0 14px 30px -10px rgba(0, 145, 209, .25);
    transform: translateY(-3px);
}
.cat-card:active { transform: translateY(-1px) scale(.99); }
.cat-card-ico {
    width: 54px; height: 54px;
    border-radius: 14px;
    background: var(--wc-primary-50, #e6f4fb);
    color: var(--wc-primary, #0091d1);
    display: flex; align-items: center; justify-content: center;
    font-size: 24px;
    transition: background .15s ease, color .15s ease;
}
.cat-card:hover .cat-card-ico { background: var(--wc-primary, #0091d1); color: #fff; }
/* וריאנט תמונה: תמונת קטגוריה מקצועית במקום אייקון */
.cat-card-ico--img {
    width: 66px; height: 66px;
    border-radius: 16px;
    background: var(--wc-primary-50, #e6f4fb);
    overflow: hidden;
    padding: 0;
    box-shadow: 0 6px 14px -6px rgba(15, 23, 42, .28);
}
.cat-card-ico--img img {
    width: 100%; height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .25s ease;
}
.cat-card:hover .cat-card-ico--img { background: var(--wc-primary-50, #e6f4fb); }
.cat-card:hover .cat-card-ico--img img { transform: scale(1.06); }
.cat-card-name { font-weight: 600; font-size: 14px; color: var(--wc-text); line-height: 1.25; }

/* ===== כרטיסי-על גדולים + פילי גישה מהירה (בורר קטגוריה בפרסום, סגנון יד2) ===== */
.cat-grid-super { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 14px; }
.cat-card-super { min-height: 152px; padding: 22px 16px; gap: 13px; }
.cat-card-body { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.cat-card-super .cat-card-name { font-size: 16px; font-weight: 700; }
.cat-card-sub { font-size: 12px; color: var(--wc-muted); line-height: 1.35; }

.cat-quick { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 18px; }
.cat-quick-label { font-size: 13px; color: var(--wc-muted); font-weight: 600; margin-inline-end: 2px; }
.cat-quick-pill {
    display: inline-flex; align-items: center; gap: 7px;
    padding: 7px 14px; border: 1px solid var(--wc-border); border-radius: 999px;
    background: #fff; color: var(--wc-text-2); font-size: 13.5px; font-weight: 600; cursor: pointer;
    transition: border-color .12s ease, background .12s ease, color .12s ease, transform .12s ease;
}
.cat-quick-pill i { color: var(--wc-primary); font-size: 13px; }
.cat-quick-pill:hover { border-color: var(--wc-primary); background: var(--wc-primary-50); color: var(--wc-primary-d); transform: translateY(-1px); }
.cat-back {
    display: inline-flex; align-items: center; gap: 6px;
    background: none; border: 0; padding: 4px 0; margin-bottom: 14px;
    color: var(--wc-primary, #0091d1); font-weight: 600; font-size: 14px; cursor: pointer;
}
.cat-back:hover { color: var(--wc-primary-d, #0073a8); }
.cat-sub-title { font-weight: 700; font-size: 17px; color: var(--wc-text); margin-bottom: 14px; }
.cat-selected {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    padding: 14px 16px;
    background: var(--wc-primary-50, #e6f4fb);
    border: 1px solid var(--wc-primary-100, #cfe8f8);
    border-radius: 12px;
}
.cat-selected-label { color: var(--wc-muted, #64748b); font-size: 14px; }
.cat-selected-name { font-weight: 700; color: var(--wc-primary-d, #0073a8); font-size: 15px; }
.cat-change { margin-inline-start: auto; padding: 0; font-weight: 600; }
/* ===== Mobile create-listing wizard - edge-to-edge, חוויה רגועה ונעימה ===== */
@media (max-width: 991.98px) {
    /* בעת פרסום במובייל - הפוטר רק מסיח דעת. מסתירים אותו עד שמסיימים. */
    body.page-create-listing .site-footer { display: none; }
}
@media (max-width: 767.98px) {
    /* בלי מסגרת כרטיס חיצונית - הכל יושב על רקע הדף, בלי שכבה מיותרת */
    .wizard-card {
        border: 0;
        border-radius: 0;
        box-shadow: none;
        background: transparent;
    }
    .wizard-head {
        padding: 18px 16px 10px;
        background: transparent;
        border-bottom: 0;
        text-align: center;
    }
    .wizard-head h1 { font-size: 20px; margin-bottom: 4px; }
    .wizard-head p   { font-size: 13.5px; margin-top: 0; }

    .wizard-progress-mobile {
        padding: 6px 16px 14px;
        background: transparent;
        border-bottom: 0;
    }
    .wizard-progress-mobile .wpm-row { font-size: 12.5px; margin-bottom: 6px; }
    .wizard-progress-mobile .wpm-bar { height: 6px; }

    .wizard-body { padding: 4px 16px 22px; }

    /* כותרת השלב - ממורכזת, בלי קו תחתון, נראית כמו שאלה ידידותית */
    .step-header {
        text-align: center;
        margin-bottom: 22px;
        padding-bottom: 0;
        border-bottom: 0;
    }
    .step-header h2 { font-size: 19px; margin-bottom: 6px; }
    .step-header p  { font-size: 13.5px; }

    /* כרטיסי קטגוריה - גדולים, מרווחים, עם נשימה */
    .cat-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
    .cat-card {
        min-height: 138px;
        padding: 22px 14px 18px;
        border-radius: 16px;
        box-shadow: 0 1px 3px rgba(15, 23, 42, .06), 0 2px 8px rgba(15, 23, 42, .04);
        gap: 12px;
    }
    .cat-card:hover,
    .cat-card:active {
        box-shadow: 0 6px 18px rgba(0, 145, 209,.18);
    }
    .cat-card-ico {
        width: 64px; height: 64px;
        font-size: 28px;
        border-radius: 16px;
    }
    .cat-card-ico--img { width: 72px; height: 72px; }
    .cat-card-name { font-size: 15px; font-weight: 700; }

    /* כפתור חזרה לקטגוריות - קצת יותר נעים */
    .cat-back {
        font-size: 13.5px;
        margin-bottom: 16px;
    }
    .cat-sub-title { font-size: 16px; margin-bottom: 16px; text-align: center; }

    /* כרטיס הקטגוריה הנבחרת - מותאם לפלאט */
    .cat-selected {
        padding: 12px 14px;
        border-radius: 12px;
    }
}

/* מסכים זעירים (פחות מ-360px) - וריאנט קומפקטי בעיקר לאייקון */
@media (max-width: 359.98px) {
    .cat-card { min-height: 120px; padding: 18px 10px 14px; }
    .cat-card-ico { width: 54px; height: 54px; font-size: 24px; }
    .cat-card-name { font-size: 14px; }
}

/* ===== Form fields inside wizard - מותאם לאנשים מבוגרים ===== */
.wizard-body .form-label.fw-semibold {
    color: var(--wc-text);
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 10px;
}
.wizard-body .form-control,
.wizard-body .form-select {
    border-color: var(--wc-border, #e5e7eb);
    transition: border-color .15s ease, box-shadow .15s ease;
}
.wizard-body .form-control:hover,
.wizard-body .form-select:hover { border-color: #cbd5e1; }
.wizard-body .form-control:focus,
.wizard-body .form-select:focus {
    border-color: var(--wc-primary, #0091d1);
    box-shadow: 0 0 0 4px rgba(0, 145, 209, .12);
}
.wizard-body .form-control-lg,
.wizard-body .form-select-lg {
    font-size: 16.5px;
    padding: .8rem 1.1rem;
    border-radius: 10px;
}
.wizard-body .form-control,
.wizard-body .form-select {
    font-size: 16px;
}
.wizard-body .form-text {
    margin-top: 8px;
    color: var(--wc-muted, #6b7280);
    font-size: 13.5px;
}
.counter-text {
    direction: ltr;
    unicode-bidi: isolate;
    font-variant-numeric: tabular-nums;
    color: var(--wc-muted-2, #94a3b8);
    font-weight: 500;
}

/* ===== Tip box ===== */
.step-tip {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    background: #f3fbff;
    border: 1px solid #c8f0ff;
    border-inline-start: 3px solid #00aeef;
    border-radius: 10px;
    padding: 11px 14px;
    margin-top: 14px;
    font-size: 13px;
    color: #064d70;
    line-height: 1.55;
}
.step-tip > i { color: #008bc2; font-size: 16px; margin-top: 2px; flex-shrink: 0; }
.step-tip strong { color: #064d70; }

/* ===== Empty attrs state ===== */
.empty-attrs {
    text-align: center;
    padding: 32px 16px;
    border: 1px dashed var(--wc-border, #e5e7eb);
    border-radius: 12px;
    background: #f9fafb;
    color: var(--wc-muted, #6b7280);
}

/* ===== Price input + presets ===== */
.price-input-wrap { position: relative; }
.price-input-wrap .price-currency {
    position: absolute;
    inset-inline-end: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--wc-muted, #6b7280);
    font-weight: 600;
    pointer-events: none;
}
.price-input-wrap input { padding-inline-end: 36px; }

.price-presets { display: flex; flex-wrap: wrap; gap: 6px; }
.price-preset {
    background: #f3f4f6;
    border: 1px solid var(--wc-border, #e5e7eb);
    border-radius: 999px;
    padding: 5px 12px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--wc-text);
    cursor: pointer;
    transition: all .15s ease;
}
.price-preset:hover {
    background: var(--wc-primary-50, #e6f4fb);
    border-color: var(--wc-primary, #0091d1);
    color: var(--wc-primary-d, #0073a8);
}

/* ===== Price-type / Condition pill grid - מותאם לאנשים מבוגרים ===== */
.price-type-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
}
.price-type-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px 14px;
    min-height: 60px;
    border-radius: 14px;
    border: 2px solid var(--wc-border, #e5e7eb);
    background: #fff;
    color: var(--wc-text);
    cursor: pointer;
    font-weight: 600;
    font-size: 15.5px;
    text-align: center;
    transition: all .15s ease;
}
.price-type-pill i { color: var(--wc-muted, #6b7280); font-size: 18px; }
.btn-check:checked + .price-type-pill {
    background: var(--wc-primary-50, #e6f4fb);
    border-color: var(--wc-primary, #0091d1);
    color: var(--wc-primary-d, #0073a8);
    box-shadow: 0 0 0 3px rgba(0, 145, 209, .12);
}
.btn-check:checked + .price-type-pill i { color: var(--wc-primary-d, #0073a8); }

/* ===== Review card ===== */
.review-card {
    background: linear-gradient(180deg, #f0f9ff, #ffffff);
    border: 1px solid #bae6fd;
    border-radius: 14px;
    padding: 20px 22px;
    margin-top: 16px;
}
.review-head {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #075985;
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 16px;
}
.review-head i { color: #0284c7; }
.review-list {
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 22px;
    font-size: 15px;
}
.review-list > div { min-width: 0; }
.review-list dt {
    font-weight: 500;
    color: var(--wc-muted, #6b7280);
    font-size: 13px;
    margin-bottom: 3px;
}
.review-list dd {
    margin: 0;
    color: var(--wc-text);
    font-weight: 600;
    word-break: break-word;
}
.text-truncate-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
@media (max-width: 575.98px) {
    .review-list { grid-template-columns: 1fr; }
    .wizard-head, .wizard-body { padding-inline: 18px; }
    .wizard-body { padding-block: 22px; }
}

/* ===== Wizard navigation buttons - בולטים יותר ===== */
.wizard-body [data-step] > .d-flex:last-child {
    margin-top: 32px;
    padding-top: 22px;
    border-top: 1px solid var(--wc-border-2, #f1f5f9);
}
.wizard-body .btn-lg {
    padding: .85rem 1.8rem;
    font-size: 16.5px;
    font-weight: 700;
    border-radius: 12px;
    min-height: 52px;
}
.wizard-body [data-next],
.wizard-body button[type="submit"] {
    min-width: 160px;
    box-shadow: 0 2px 8px rgba(0, 145, 209, .25);
}
.wizard-body button[type="submit"] {
    box-shadow: 0 2px 8px rgba(22, 163, 74, .25);
}
.wizard-body [data-prev] {
    color: var(--wc-muted, #6b7280);
}
.wizard-body .btn-primary,
.wizard-body .btn-success {
    box-shadow: 0 2px 6px rgba(0, 145, 209, .18);
}
.wizard-body .btn-success { box-shadow: 0 2px 6px rgba(22, 163, 74, .2); }
.wizard-body .btn-outline-secondary { color: var(--wc-muted, #6b7280); border-color: var(--wc-border, #e5e7eb); }
.wizard-body .btn-outline-secondary:hover { background: #f9fafb; color: var(--wc-text); border-color: #cbd5e1; }
.image-preview { position: relative; }
.listing-image-primary {
    display: block;
    width: 100%;
    min-height: 36px;
    margin-top: 6px;
    padding: 6px 3px;
    border: 1px solid #d3dce1;
    border-radius: 7px;
    background: #fff;
    color: #514a5d;
    font: inherit;
    font-size: 12px;
    line-height: 1.4;
    cursor: pointer;
}
.listing-image-primary:hover,
.listing-image-primary[aria-pressed="true"] {
    color: #087da8;
    background: #effbff;
    border-color: #8fcfe7;
}
.listing-image-primary[aria-pressed="true"] { font-weight: 600; }
.listing-image-primary:focus-visible { outline: 3px solid #00aeef55; outline-offset: 2px; }
.listing-image-rotate {
    display: block;
    width: 100%;
    min-height: 38px;
    margin-top: 8px;
    padding: 6px 4px;
    border: 1px solid #d3e5ec;
    border-radius: 8px;
    background: #fff;
    color: #087da8;
    font: inherit;
    font-size: 13px;
    cursor: pointer;
}
.listing-image-rotate:hover { background: #effbff; border-color: #8fcfe7; }
.listing-image-rotate:focus-visible { outline: 3px solid #00aeef55; outline-offset: 2px; }
.image-preview img { border-radius: var(--wc-radius-sm); border: 1px solid var(--wc-border); }
.image-preview .remove {
    position: absolute; top: -8px; left: -8px;
    background: var(--wc-danger); color: #fff; border: 0; border-radius: 50%;
    width: 24px; height: 24px; line-height: 1; cursor: pointer;
    box-shadow: 0 2px 6px rgba(220,38,38,.4);
}

/* ===== Alerts ===== */
.alert {
    border-radius: var(--wc-radius);
    border: 1px solid transparent;
    padding: .9rem 1.1rem;
}
.alert-success { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.alert-danger  { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.alert-warning { background: #f3fbff; border-color: #c8f0ff; color: #075b7c; }
.alert-info    { background: #e6f4fb; border-color: #b3e0f5; color: #0b5e88; }

.payment-redirect-card {
    max-width: 460px;
    padding: 38px 30px;
    border: 1px solid var(--wc-border);
    border-radius: 8px;
    background: #fff;
    box-shadow: 6px 8px 0 rgba(23, 53, 62, .08);
}
.payment-redirect-icon {
    width: 64px;
    height: 64px;
    display: inline-grid;
    place-items: center;
    margin-bottom: 18px;
    border-radius: 50%;
    background: #e6f4fb;
    color: var(--wc-primary);
    font-size: 28px;
}

/* ===== Badges ===== */
.badge { font-weight: 600; padding: .35em .6em; border-radius: 6px; }

/* ===== Skeleton ===== */
.skeleton {
    background: linear-gradient(90deg, #eef0f4 25%, #f7f8fb 50%, #eef0f4 75%);
    background-size: 200% 100%;
    animation: skl 1.4s infinite;
    border-radius: 8px;
}
@keyframes skl { 0%{background-position:200% 0;} 100%{background-position:-200% 0;} }

/* ===== Admin ===== */
.admin-wrap { min-height: 100vh; background: #f3f4f7; }

/* Mobile topbar */
.admin-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    background: linear-gradient(180deg, #0f172a, #1e293b);
    color: #fff;
    position: sticky;
    top: 0;
    z-index: 1030;
    box-shadow: 0 2px 8px rgba(0,0,0,.15);
}
.admin-topbar-brand {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
    font-size: 16px;
}
.admin-topbar-brand img { height: 28px; }
.admin-topbar .btn-outline-light { border-color: rgba(255,255,255,.3); color: #fff; }

.admin-sidebar {
    background: linear-gradient(180deg, #0f172a, #1e293b);
    color: #cbd5e1;
    padding: 14px 0;
    border-left: 1px solid #0b1220;
}
/* גלילה עצמאית במחשב בלבד (≥ 992px). במובייל Bootstrap.offcanvas-lg מנהל
   position:fixed לבדו - אסור לדרוס. */
@media (min-width: 992px) {
    .admin-sidebar {
        position: sticky;
        top: 0;
        height: 100vh;
        overflow-y: auto;
        scrollbar-width: thin;
        scrollbar-color: rgba(255,255,255,.15) transparent;
    }
    .admin-sidebar::-webkit-scrollbar { width: 6px; }
    .admin-sidebar::-webkit-scrollbar-track { background: transparent; }
    .admin-sidebar::-webkit-scrollbar-thumb {
        background: rgba(255,255,255,.12);
        border-radius: 3px;
    }
    .admin-sidebar::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.25); }
}

/* Offcanvas overrides for mobile sidebar */
.admin-sidebar.offcanvas-lg {
    background: linear-gradient(180deg, #0f172a, #1e293b);
    color: #cbd5e1;
}
@media (max-width: 991.98px) {
    .admin-sidebar.offcanvas-lg { width: 280px; padding: 0; }
    .admin-sidebar .offcanvas-header { padding: 14px; border-bottom: 1px solid rgba(255,255,255,.06); }
}
.admin-sidebar h6 {
    color: #fff;
    padding: 14px 20px 8px;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -.01em;
}

/* ===== כותרת קבוצה בתפריט הניהול ===== */
.admin-menu-group {
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    padding: 14px 20px 4px;
    margin-top: 4px;
    border-top: 1px solid rgba(255,255,255,.05);
}
.admin-menu-group:first-of-type {
    border-top: 0;
    margin-top: 0;
}

/* ===== Admin menu search ===== */
.admin-search {
    position: relative;
    margin: 6px 14px 10px;
}
.admin-search-icon {
    position: absolute;
    top: 50%;
    inset-inline-start: 12px;
    transform: translateY(-50%);
    color: #64748b;
    font-size: 13px;
    pointer-events: none;
}
.admin-search-input {
    width: 100%;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.1);
    color: #fff;
    border-radius: 10px;
    padding: 8px 12px 8px 34px;
    font-size: 13.5px;
    font-family: inherit;
    transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.admin-search-input::placeholder { color: #64748b; }
.admin-search-input:focus {
    outline: 0;
    background: rgba(255,255,255,.1);
    border-color: var(--wc-accent);
    box-shadow: 0 0 0 3px rgba(0,174,239,.18);
}
.admin-search-input::-webkit-search-cancel-button {
    -webkit-appearance: none;
    appearance: none;
    width: 14px; height: 14px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2394a3b8'%3E%3Cpath d='M4 4l8 8M12 4l-8 8' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center;
    cursor: pointer;
}
.admin-menu-empty {
    padding: 14px 18px;
    color: #94a3b8;
    text-align: center;
    font-size: 13px;
}
.admin-menu-empty i { font-size: 22px; margin-bottom: 6px; display: block; }
.admin-sidebar a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 18px;
    color: #cbd5e1;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    border-right: 3px solid transparent;
    transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.admin-sidebar a i { width: 18px; text-align: center; color: #94a3b8; transition: color .15s ease; }
.admin-sidebar a:hover {
    background: rgba(255,255,255,.04);
    color: #fff;
}
.admin-sidebar a:hover i { color: #fff; }
.admin-sidebar a.active {
    background: rgba(0,174,239,.08);
    color: #fff;
    border-right-color: var(--wc-accent);
}
.admin-sidebar a.active i { color: var(--wc-accent); }

.admin-content { padding: 28px; }
.admin-content h1, .admin-content h2 { letter-spacing: -.02em; }

/* ===== Admin header (desktop topbar עם משתמש מחובר) ===== */
.admin-header {
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    background: #fff;
    border: 1px solid var(--wc-border);
    border-radius: var(--wc-radius);
    padding: 12px 18px;
    margin-bottom: 20px;
    box-shadow: var(--wc-shadow-xs);
}
.admin-header-greet { line-height: 1.2; }
.admin-header-hello {
    font-size: 12.5px;
    color: var(--wc-muted);
    font-weight: 500;
}
.admin-header-name {
    font-size: 17px;
    font-weight: 700;
    color: var(--wc-text);
    letter-spacing: -.01em;
    margin-top: 2px;
}
.admin-header-user {
    display: flex;
    align-items: center;
    gap: 10px;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 50px;
    padding: 4px 12px 4px 4px;
    cursor: pointer;
    transition: background-color .12s ease, border-color .12s ease;
}
.admin-header-user:hover {
    background: #f3f5fa;
    border-color: var(--wc-border-2);
}
.admin-header-user[aria-expanded="true"] {
    background: var(--wc-primary-50);
    border-color: rgba(0, 145, 209,.2);
}
.admin-header-avatar {
    width: 38px; height: 38px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--wc-border-2);
}
.admin-header-info { text-align: end; line-height: 1.2; }
.admin-header-info-name {
    font-weight: 600;
    font-size: 14px;
    color: var(--wc-text);
}
.admin-header-info-role {
    font-size: 11.5px;
    color: var(--wc-muted);
    margin-top: 2px;
}
.admin-header-user i { color: var(--wc-muted); transition: transform .15s ease; }
.admin-header-user[aria-expanded="true"] i { transform: rotate(180deg); color: var(--wc-primary); }

/* ===== Dashboard range selector ===== */
.dashboard-range {
    display: inline-flex;
    gap: 2px;
    background: #fff;
    border: 1px solid var(--wc-border);
    border-radius: 50px;
    padding: 4px;
    box-shadow: var(--wc-shadow-xs);
}
.dashboard-range a {
    padding: 6px 14px;
    font-size: 13px;
    font-weight: 600;
    color: var(--wc-muted);
    border-radius: 50px;
    text-decoration: none;
    transition: background-color .12s ease, color .12s ease;
}
.dashboard-range a:hover { color: var(--wc-text); }
.dashboard-range a.active {
    background: var(--wc-primary);
    color: #fff;
    box-shadow: 0 2px 8px rgba(0, 145, 209,.3);
}

.stat-card {
    background: #fff;
    border-radius: var(--wc-radius);
    padding: 20px;
    box-shadow: var(--wc-shadow);
    border: 1px solid var(--wc-border-2);
    position: relative;
    overflow: hidden;
}
.stat-card::before {
    content: "";
    position: absolute; inset: 0 auto auto 0;
    width: 4px; height: 100%;
    background: linear-gradient(180deg, var(--wc-primary), var(--wc-primary-l));
}
.stat-card .value {
    font-size: 30px;
    font-weight: 700;
    color: var(--wc-text);
    letter-spacing: -.02em;
    line-height: 1;
    margin-bottom: 6px;
}
.stat-card .label { color: var(--wc-muted); font-size: 13px; font-weight: 500; }
.stat-card .icon-wrap {
    position: absolute;
    top: 14px; left: 14px;
    width: 38px; height: 38px;
    border-radius: 10px;
    background: var(--wc-primary-50);
    color: var(--wc-primary);
    display: flex; align-items: center; justify-content: center;
    font-size: 16px;
}

/* טבלאות אדמין */
.table {
    --bs-table-bg: #fff;
    border-collapse: separate;
    border-spacing: 0;
}
.table > :not(caption) > * > * { padding: .85rem 1rem; vertical-align: middle; }
.table > thead {
    background: #f8fafc;
    color: var(--wc-muted);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .05em;
}
.table > thead th { font-weight: 600; border-bottom: 1px solid var(--wc-border); }
.table > tbody > tr { border-bottom: 1px solid var(--wc-border-2); }
.table > tbody > tr:hover { background: #fafbfd; }

/* ===== Footer ===== */
.site-footer {
    background:
        radial-gradient(900px 280px at 80% -10%, rgba(0, 145, 209,.18), transparent 60%),
        radial-gradient(700px 220px at 10% 110%, rgba(0,174,239,.10), transparent 60%),
        linear-gradient(180deg, #0b1220 0%, #0f172a 100%);
    color: #cbd5e1;
    padding: 56px 0 0;
    margin-top: 80px;
    border-top: 1px solid rgba(255,255,255,.05);
}

.site-footer .footer-logo {
    height: 56px;
    width: auto;
    filter: drop-shadow(0 4px 10px rgba(0,0,0,.3));
}

/* ===== SEO intro text ===== */
.site-footer .footer-seo {
    margin-bottom: 40px;
    padding-bottom: 32px;
    border-bottom: 1px solid rgba(255,255,255,.07);
}
.site-footer .footer-seo-title {
    color: #fff;
    font-weight: 700;
    font-size: 17px;
    margin-bottom: 12px;
}
.site-footer .footer-seo-text {
    color: #94a3b8;
    font-size: 13.5px;
    line-height: 1.9;
    margin: 0;
    max-width: 1000px;
}
@media (max-width: 575.98px) {
    .site-footer .footer-seo { margin-bottom: 28px; padding-bottom: 24px; }
    .site-footer .footer-seo-title { font-size: 15.5px; }
    .site-footer .footer-seo-text { font-size: 13px; line-height: 1.8; }
}

.site-footer .footer-tagline {
    color: #94a3b8;
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 18px;
    max-width: 320px;
}

.site-footer .footer-title {
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    letter-spacing: .04em;
    text-transform: uppercase;
    margin-bottom: 14px;
    position: relative;
    padding-bottom: 8px;
}
.site-footer .footer-title::after {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    bottom: 0;
    width: 28px; height: 2px;
    border-radius: 2px;
    background: var(--wc-primary-l);
}

.site-footer .footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}
.site-footer .footer-links li { margin-bottom: 8px; }
.site-footer .footer-links a {
    color: #94a3b8;
    text-decoration: none;
    font-size: 14px;
    transition: color .15s ease, transform .15s ease, padding .15s ease;
    display: inline-block;
}
.site-footer .footer-links a:hover {
    color: #fff;
    padding-inline-start: 4px;
}

.site-footer .footer-contact {
    list-style: none;
    padding: 0;
    margin: 0;
}
.site-footer .footer-contact li {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    font-size: 13.5px;
}
.site-footer .footer-contact i {
    width: 32px; height: 32px;
    border-radius: 8px;
    background: rgba(255,255,255,.06);
    color: var(--wc-primary-l);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    font-size: 13px;
}
.site-footer .footer-contact a {
    color: #cbd5e1;
    text-decoration: none;
    word-break: break-all;
}
.site-footer .footer-contact a:hover { color: #fff; }

.site-footer .footer-social {
    display: flex;
    gap: 10px;
    margin-top: 6px;
}
.site-footer .footer-social a {
    width: 40px; height: 40px;
    border-radius: 50%;
    background: rgba(255,255,255,.06);
    color: #cbd5e1;
    display: flex; align-items: center; justify-content: center;
    text-decoration: none;
    transition: background-color .15s ease, color .15s ease, transform .15s ease;
}
.site-footer .footer-social a:hover {
    background: var(--wc-primary);
    color: #fff;
    transform: translateY(-2px);
}

.site-footer .footer-bottom {
    margin-top: 40px;
    padding: 20px 0 24px;
    border-top: 1px solid rgba(255,255,255,.07);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 13px;
    color: #64748b;
}
.site-footer .footer-bottom-links {
    display: flex;
    gap: 10px;
    align-items: center;
}
.site-footer .footer-bottom-links a {
    color: #94a3b8;
    text-decoration: none;
    transition: color .15s ease;
}
.site-footer .footer-bottom-links a:hover { color: #fff; }
.site-footer .footer-bottom-links span { color: #475569; }

@media (max-width: 575.98px) {
    .site-footer { padding: 40px 0 0; margin-top: 48px; }
    .site-footer .footer-bottom { text-align: center; justify-content: center; }
}

/* ===== About page (אודות) ===== */
.page-about main { padding-top: 0 !important; }

.about-hero {
    position: relative;
    background:
        radial-gradient(1100px 420px at 85% -20%, rgba(255,255,255,.20), transparent 60%),
        radial-gradient(720px 320px at 0% 118%, rgba(0,174,239,.16), transparent 60%),
        linear-gradient(135deg, var(--wc-primary-d) 0%, var(--wc-primary) 58%, var(--wc-primary-l) 100%);
    color: #fff;
    padding: 56px 0 92px;
    text-align: center;
    overflow: hidden;
    border-radius: 0 0 28px 28px;
}
/* טקסטורת רשת עדינה - עקבי עם הדף הראשי */
.about-hero::before {
    content: ""; position: absolute; inset: 0;
    background-image:
        linear-gradient(to right, rgba(255,255,255,.05) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(255,255,255,.05) 1px, transparent 1px);
    background-size: 38px 38px;
    -webkit-mask-image: radial-gradient(130% 100% at 50% 0%, #000 35%, transparent 78%);
            mask-image: radial-gradient(130% 100% at 50% 0%, #000 35%, transparent 78%);
    pointer-events: none;
}
.about-hero .container { position: relative; z-index: 1; }
.about-breadcrumb {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    font-size: 13px; color: rgba(255,255,255,.72); margin-bottom: 28px;
}
.about-breadcrumb a { color: rgba(255,255,255,.72); transition: color .15s ease; }
.about-breadcrumb a:hover { color: #fff; }
.about-breadcrumb i { font-size: 11px; }
.about-hero-badge {
    width: 72px; height: 72px; margin: 0 auto 22px;
    border-radius: 20px; background: #fff;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 16px 36px -12px rgba(2, 31, 51,.5), inset 0 0 0 1px rgba(255,255,255,.6);
}
.about-hero-badge img { width: 46px; height: 46px; object-fit: contain; }
.about-hero-title {
    font-size: clamp(2.1rem, 5vw, 3.15rem);
    font-weight: 800; color: #fff; margin-bottom: 14px; letter-spacing: -.03em;
    line-height: 1.1;
}
.about-hero-lead {
    font-size: clamp(1.1rem, 2.4vw, 1.45rem);
    font-weight: 600; margin-bottom: 18px; color: #fff;
}
.about-hero-sub {
    max-width: 720px; margin: 0 auto 30px; color: rgba(255,255,255,.92);
    font-size: 16px; line-height: 1.9;
}
.about-hero-actions {
    display: flex; flex-wrap: wrap; gap: 12px; justify-content: center;
}
.about-hero-trust {
    display: flex; flex-wrap: wrap; gap: 10px 26px; justify-content: center;
    margin-top: 26px; font-size: 14px; font-weight: 500; color: rgba(255,255,255,.92);
}
.about-hero-trust span { display: inline-flex; align-items: center; gap: 8px; }
.about-hero-trust i { color: #bbf7d0; font-size: 13px; }

.about-stats {
    margin-top: -52px; margin-bottom: 8px; position: relative; z-index: 2;
}
.about-stat-card {
    position: relative; background: #fff; border: 1px solid var(--wc-border-2, #eef2f7);
    border-radius: 20px;
    padding: 28px 18px; text-align: center; height: 100%;
    box-shadow: 0 1px 2px rgba(15,23,42,.04), 0 18px 40px -18px rgba(15,23,42,.22);
    transition: transform .2s ease, box-shadow .2s ease;
}
.about-stat-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 1px 2px rgba(15,23,42,.04), 0 26px 50px -20px rgba(0,145,209,.30);
}
.about-stat-icon {
    font-size: 24px; color: var(--wc-primary);
    background: linear-gradient(135deg, var(--wc-primary-50), #f4fbff);
    border: 1px solid var(--wc-primary-100, #cfe8f8);
    width: 58px; height: 58px;
    border-radius: 16px; display: inline-flex; align-items: center; justify-content: center;
    margin-bottom: 14px;
}
.about-stat-num {
    font-size: clamp(1.8rem, 4vw, 2.4rem); font-weight: 800; line-height: 1;
    background: linear-gradient(135deg, var(--wc-primary-d, #0073a8), var(--wc-primary-l, #38bdf8));
    -webkit-background-clip: text; background-clip: text; color: transparent;
    letter-spacing: -.02em;
}
.about-stat-label { color: var(--wc-muted, #64748b); font-size: 14px; margin-top: 8px; font-weight: 500; }

.about-section { padding: 68px 0; }
.about-section-alt { background: #f8fafc; }
.about-eyebrow {
    display: inline-flex; align-items: center; gap: 9px;
    font-size: 14px; font-weight: 700;
    color: var(--wc-primary-d, #0073a8); margin-bottom: 14px;
    background: var(--wc-primary-50, #e6f4fb);
    border: 1px solid var(--wc-primary-100, #cfe8f8);
    padding: 6px 14px; border-radius: 999px;
}
.about-eyebrow::before {
    content: ""; width: 7px; height: 7px; border-radius: 50%;
    background: var(--wc-primary, #0091d1);
    box-shadow: 0 0 0 3px rgba(0,145,209,.16);
}
.text-center .about-eyebrow { justify-content: center; }
.about-h2 {
    font-size: clamp(1.55rem, 3.4vw, 2.15rem); font-weight: 800;
    color: #0f172a; margin-bottom: 14px; letter-spacing: -.03em; line-height: 1.18;
}
.about-p { color: #475569; font-size: 15.5px; line-height: 1.9; margin-bottom: 16px; }

.about-mission-card {
    background: #fff; border: 1px solid var(--wc-border-2, #eef2f7); border-radius: 22px;
    padding: 12px 30px; box-shadow: 0 1px 2px rgba(15,23,42,.04), 0 20px 44px -22px rgba(15,23,42,.20);
    display: flex; flex-direction: column;
}
.about-mission-item {
    display: flex; gap: 16px; align-items: flex-start;
    padding: 22px 0; border-bottom: 1px solid var(--wc-border-2, #f1f5f9);
}
.about-mission-item:last-child { border-bottom: 0; }
.about-mission-item i {
    flex-shrink: 0; width: 50px; height: 50px; border-radius: 14px;
    background: var(--wc-primary-50, #e6f4fb);
    border: 1px solid var(--wc-primary-100, #cfe8f8);
    color: var(--wc-primary-d, #0073a8);
    display: flex; align-items: center; justify-content: center; font-size: 20px;
}
.about-mission-item h3 { font-size: 17px; font-weight: 700; color: #0f172a; margin-bottom: 4px; }
.about-mission-item p { font-size: 14.5px; color: #64748b; margin: 0; line-height: 1.7; }

.about-feature-card {
    position: relative; overflow: hidden;
    background: #fff; border: 1px solid var(--wc-border-2, #eef2f7); border-radius: 20px;
    padding: 30px 26px; height: 100%;
    box-shadow: 0 1px 2px rgba(15,23,42,.04);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.about-feature-card::before {
    content: ""; position: absolute; inset-inline: 0; top: 0; height: 3px;
    background: linear-gradient(90deg, var(--wc-primary), var(--wc-primary-l));
    transform: scaleX(0); transform-origin: right;
    transition: transform .28s cubic-bezier(.16,1,.3,1);
}
.about-feature-card:hover {
    transform: translateY(-5px); border-color: transparent;
    box-shadow: 0 22px 46px -16px rgba(0, 145, 209,.28);
}
.about-feature-card:hover::before { transform: scaleX(1); }
.about-feature-icon {
    width: 56px; height: 56px; border-radius: 15px;
    background: var(--wc-primary-50, #e6f4fb);
    border: 1px solid var(--wc-primary-100, #cfe8f8);
    color: var(--wc-primary-d, #0073a8); display: flex; align-items: center; justify-content: center;
    font-size: 23px; margin-bottom: 18px;
    transition: transform .25s cubic-bezier(.16,1,.3,1), background-color .2s ease, color .2s ease;
}
.about-feature-card:hover .about-feature-icon {
    transform: translateY(-2px);
    background: linear-gradient(135deg, var(--wc-primary), var(--wc-primary-l));
    color: #fff; border-color: transparent;
}
.about-feature-title { font-size: 18px; font-weight: 700; color: #0f172a; margin-bottom: 8px; }
.about-feature-text { font-size: 14.5px; color: #64748b; line-height: 1.75; margin: 0; }

.about-cat-chip {
    display: flex; align-items: center; gap: 10px; justify-content: center;
    background: #fff; border: 1px solid var(--wc-border-2, #eef2f7); border-radius: 14px;
    padding: 16px 14px; height: 100%; color: #0f172a; font-weight: 600;
    transition: transform .15s ease, box-shadow .15s ease, color .15s ease, border-color .15s ease;
}
.about-cat-chip:hover {
    transform: translateY(-3px); color: var(--wc-primary-d, #0073a8);
    border-color: var(--wc-primary, #0091d1); box-shadow: 0 12px 26px -10px rgba(0, 145, 209,.22);
}
.about-cat-chip i { color: var(--wc-primary); font-size: 18px; }

.about-step {
    text-align: center; padding: 12px 16px; position: relative;
}
/* קו מקשר מנוקד בין השלבים (דסקטופ) - תחושת "מסע" */
@media (min-width: 768px) {
    .about-step::before {
        content: ""; position: absolute; top: 40px; z-index: 0;
        inset-inline-start: -50%; width: 100%; height: 2px;
        background: repeating-linear-gradient(90deg, var(--wc-primary-100, #cfe8f8) 0 7px, transparent 7px 14px);
    }
    .row > [class*="col-"]:first-child .about-step::before { display: none; }
}
.about-step-num {
    position: relative; z-index: 1;
    width: 60px; height: 60px; border-radius: 50%;
    background: linear-gradient(135deg, var(--wc-primary), var(--wc-primary-l));
    color: #fff; font-size: 23px; font-weight: 800;
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto 18px;
    box-shadow: 0 10px 24px -6px rgba(0, 145, 209,.45), 0 0 0 6px rgba(0,145,209,.08);
}
.about-step h3 { font-size: 18px; font-weight: 700; color: #0f172a; margin-bottom: 8px; }
.about-step p { font-size: 14.5px; color: #64748b; line-height: 1.75; margin: 0; }

.about-cta { padding: 20px 0 72px; }
.about-cta-card {
    position: relative; overflow: hidden;
    background:
        radial-gradient(700px 320px at 85% -20%, rgba(0,174,239,.20), transparent 60%),
        radial-gradient(600px 300px at 0% 120%, rgba(255,255,255,.12), transparent 60%),
        linear-gradient(135deg, var(--wc-primary-d), var(--wc-primary));
    color: #fff; border-radius: 28px; padding: 56px 32px; text-align: center;
    box-shadow: 0 30px 60px -20px rgba(0, 145, 209,.45);
}
.about-cta-card::before {
    content: ""; position: absolute; inset: 0;
    background-image: radial-gradient(rgba(255,255,255,.08) 1px, transparent 1.4px);
    background-size: 26px 26px; opacity: .6; pointer-events: none;
}
.about-cta-card > * { position: relative; z-index: 1; }
.about-cta-title { font-size: clamp(1.7rem, 3.6vw, 2.3rem); font-weight: 800; margin-bottom: 12px; letter-spacing: -.02em; }
.about-cta-text {
    max-width: 620px; margin: 0 auto 28px; font-size: 16px;
    line-height: 1.8; color: rgba(255,255,255,.94);
}
.about-cta-actions {
    display: flex; flex-wrap: wrap; gap: 12px; justify-content: center;
}
.about-cta-contact {
    display: flex; flex-wrap: wrap; gap: 22px; justify-content: center;
    margin-top: 28px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.20);
}
.about-cta-contact a { color: #fff; font-weight: 600; transition: color .15s ease; }
.about-cta-contact a:hover { color: var(--wc-accent); }

@media (max-width: 575.98px) {
    .about-hero { padding: 40px 0 56px; }
    .about-section { padding: 46px 0; }
    .about-cta-card { padding: 40px 22px; }
}

/* ===== App page (אפליקציה) ===== */
.page-app main { padding-top: 0 !important; }
.page-app .site-footer { margin-top: 0; }
.app-product-page { overflow: hidden; background: #fff; color: #102331; }
.app-product-page button,
.app-product-page a { -webkit-tap-highlight-color: transparent; }

.app-product-hero {
    position: relative;
    padding: 24px 0 86px;
    background: #f6fafc;
    border-bottom: 1px solid #e2edf2;
}
.app-product-hero::before {
    content: "";
    position: absolute;
    width: 480px;
    height: 480px;
    inset-inline-start: -230px;
    top: -220px;
    border: 78px solid rgba(0, 145, 209, .055);
    border-radius: 50%;
    pointer-events: none;
}
.app-breadcrumb {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 42px;
    font-size: 13px;
    color: #718492;
}
.app-breadcrumb a { color: #526a79; text-decoration: none; }
.app-breadcrumb a:hover { color: var(--wc-primary-d, #0073a8); }
.app-breadcrumb i { font-size: 10px; color: #a4b5bf; }

.app-product-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, .92fr) minmax(420px, 1.08fr);
    align-items: center;
    gap: clamp(44px, 8vw, 110px);
}
.app-product-copy { max-width: 610px; }
.app-kicker {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 22px;
    color: #3f5867;
    font-size: 14px;
    font-weight: 650;
}
.app-kicker img {
    width: 32px;
    height: 32px;
    border-radius: 9px;
    box-shadow: 0 6px 14px rgba(29, 113, 184, .16);
}
.app-product-copy h1 {
    margin: 0 0 24px;
    color: #102331;
    font-size: clamp(3rem, 6.2vw, 5.25rem);
    font-weight: 850;
    line-height: .99;
    letter-spacing: -.055em;
}
.app-product-copy h1 span { color: var(--wc-primary-d, #0073a8); }
.app-product-lead {
    max-width: 590px;
    margin: 0 0 30px;
    color: #526a79;
    font-size: clamp(1.03rem, 1.8vw, 1.22rem);
    line-height: 1.85;
}
.app-product-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px 22px;
}
.app-primary-action,
.app-install-side-button {
    border: 0;
    border-radius: 13px;
    background: var(--wc-primary-d, #0073a8);
    color: #fff;
    font: inherit;
    font-size: 16px;
    font-weight: 750;
    cursor: pointer;
    transition: background-color .18s ease, box-shadow .18s ease;
}
.app-primary-action {
    min-height: 54px;
    padding: 0 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    box-shadow: 0 11px 24px rgba(0, 115, 168, .20);
}
.app-primary-action:hover,
.app-install-side-button:hover {
    background: #005f8d;
    color: #fff;
}
.app-primary-action:focus-visible,
.app-install-side-button:focus-visible,
.app-device-tabs button:focus-visible,
.app-faq-item summary:focus-visible {
    outline: 3px solid rgba(0, 174, 239, .55);
    outline-offset: 3px;
}
.app-secondary-action {
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #173849;
    font-weight: 700;
    text-decoration: none;
}
.app-secondary-action i { color: var(--wc-primary, #0091d1); transition: transform .18s ease; }
.app-secondary-action:hover { color: var(--wc-primary-d, #0073a8); }
.app-secondary-action:hover i { transform: translateX(-3px); }
.app-installed-note {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 20px;
    padding: 10px 13px;
    border: 1px solid #b9e8ce;
    border-radius: 10px;
    background: #effaf4;
    color: #187345;
    font-size: 14px;
    font-weight: 650;
}
.app-installed-note i { color: #22a060; }

.app-proof-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 22px;
    list-style: none;
    padding: 0;
    margin: 28px 0 0;
    color: #607684;
    font-size: 13.5px;
}
.app-proof-list li { display: inline-flex; align-items: center; gap: 7px; }
.app-proof-list i { color: #1f9d60; font-size: 11px; }

.app-phone-stage {
    position: relative;
    min-height: 620px;
    display: flex;
    align-items: center;
    justify-content: center;
    isolation: isolate;
}
.app-phone-stage::before {
    content: "";
    position: absolute;
    width: 475px;
    height: 475px;
    border-radius: 48% 52% 55% 45%;
    background: #e1f2f9;
    transform: rotate(-8deg);
    z-index: -2;
}
.app-phone-stage::after {
    content: "";
    position: absolute;
    width: 332px;
    height: 332px;
    border-radius: 50%;
    border: 1px solid rgba(0, 145, 209, .22);
    box-shadow: 0 0 0 34px rgba(255, 255, 255, .32), 0 0 0 35px rgba(0, 145, 209, .09);
    z-index: -1;
}
.app-phone {
    position: relative;
    width: 304px;
    height: 590px;
    padding: 10px;
    border: 2px solid #26343d;
    border-radius: 43px;
    background: #111b22;
    box-shadow: 0 38px 70px -28px rgba(15, 35, 48, .45);
}
.app-phone-speaker {
    position: absolute;
    z-index: 4;
    top: 18px;
    left: 50%;
    width: 78px;
    height: 22px;
    border-radius: 999px;
    background: #111b22;
    transform: translateX(-50%);
}
.app-phone-screen {
    position: relative;
    height: 100%;
    overflow: hidden;
    border-radius: 33px;
    background: #f5f8fa;
}
.app-phone-status {
    height: 41px;
    padding: 10px 17px 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    color: #20343f;
    font-size: 10px;
    font-weight: 750;
}
.app-phone-status span:last-child { display: flex; gap: 5px; font-size: 9px; }
.app-phone-logo {
    width: 58%;
    height: calc(100% - 41px);
    margin-inline: auto;
    display: block;
    object-fit: contain;
    object-position: center;
}
.app-mini-header {
    height: 48px;
    padding: 0 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #fff;
    border-bottom: 1px solid #e6edf1;
    color: #263d49;
}
.app-mini-brand { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.app-mini-brand img { width: 25px; height: 25px; border-radius: 7px; }
.app-mini-header > i { font-size: 15px; }
.app-mini-content { padding: 20px 16px 74px; }
.app-mini-hello { margin: 0 0 12px; color: #172e3a; font-size: 19px; font-weight: 800; }
.app-mini-search {
    height: 42px;
    padding: 0 13px;
    display: flex;
    align-items: center;
    gap: 9px;
    border: 1px solid #d9e4e9;
    border-radius: 11px;
    background: #fff;
    color: #8799a4;
    font-size: 11px;
}
.app-mini-search i { color: var(--wc-primary, #0091d1); }
.app-mini-tabs { display: flex; gap: 7px; margin: 15px 0; }
.app-mini-tabs span {
    padding: 6px 11px;
    border: 1px solid #dce6eb;
    border-radius: 999px;
    background: #fff;
    color: #70838e;
    font-size: 9.5px;
}
.app-mini-tabs .is-active { border-color: #b8deef; background: #eaf7fc; color: #0073a8; font-weight: 700; }
.app-mini-listing {
    display: grid;
    grid-template-columns: 48px 1fr auto;
    align-items: center;
    gap: 10px;
    margin-bottom: 9px;
    padding: 10px;
    border: 1px solid #e2e9ed;
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 5px 13px rgba(24, 55, 71, .035);
}
.app-mini-listing-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    font-size: 19px;
}
.app-mini-listing-icon.is-car { background: #e8f8ff; color: #075b7c; }
.app-mini-listing-icon.is-home { background: #e7f5fb; color: #007bad; }
.app-mini-listing-icon.is-hand { background: #fff3e8; color: #8a4a12; }
.app-mini-listing span:nth-child(2) { display: flex; flex-direction: column; gap: 3px; }
.app-mini-listing strong { color: #203946; font-size: 11px; }
.app-mini-listing small { color: #91a0a8; font-size: 8.5px; }
.app-mini-listing > i { color: #a5b3bb; font-size: 9px; }
.app-mini-nav {
    position: absolute;
    inset-inline: 0;
    bottom: 0;
    height: 64px;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    align-items: center;
    background: #fff;
    border-top: 1px solid #e3eaee;
}
.app-mini-nav span {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    color: #7d909b;
    font-size: 12px;
}
.app-mini-nav small { font-size: 7.5px; }
.app-mini-nav .is-active { color: var(--wc-primary-d, #0073a8); }
.app-mini-nav .app-mini-add {
    width: 41px;
    height: 41px;
    margin: -24px auto 0;
    justify-content: center;
    border: 4px solid #fff;
    border-radius: 50%;
    background: var(--wc-primary, #0091d1);
    color: #fff;
    box-shadow: 0 6px 14px rgba(0, 145, 209, .24);
}
.app-phone-note {
    position: absolute;
    z-index: 5;
    min-width: 215px;
    padding: 11px 13px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid rgba(208, 223, 231, .9);
    border-radius: 14px;
    background: rgba(255, 255, 255, .96);
    color: #5d737f;
    box-shadow: 0 18px 38px -18px rgba(18, 51, 68, .35);
    font-size: 10px;
    line-height: 1.45;
}
.app-phone-note span:nth-child(2) { display: flex; flex-direction: column; }
.app-phone-note strong { color: #17313e; font-size: 11px; }
.app-phone-note-icon {
    width: 35px;
    height: 35px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #e9f7fc;
    color: var(--wc-primary-d, #0073a8);
    font-size: 14px;
}
.app-phone-note-message { top: 108px; right: -128px; inset-inline-start: auto; }
.app-phone-note-home { right: 6px; bottom: 78px; }

.app-value-section,
.app-faq-section { padding: 92px 0; }
.app-section-heading { max-width: 610px; margin-bottom: 46px; }
.app-section-heading > span {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 13px;
    color: var(--wc-primary-d, #0073a8);
    font-size: 13px;
    font-weight: 750;
}
.app-section-heading > span::before {
    content: "";
    width: 28px;
    height: 2px;
    background: #00aeef;
}
.app-section-heading h2 {
    margin: 0 0 14px;
    color: #102331;
    font-size: clamp(2rem, 4vw, 3.15rem);
    font-weight: 820;
    line-height: 1.12;
    letter-spacing: -.04em;
}
.app-section-heading p { margin: 0; color: #627783; font-size: 16px; line-height: 1.8; }
.app-value-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid #dfe8ed;
    border-bottom: 1px solid #dfe8ed;
}
.app-value-item {
    position: relative;
    min-height: 210px;
    padding: 38px 34px 34px;
    border-inline-start: 1px solid #dfe8ed;
}
.app-value-item:first-child { border-inline-start: 0; }
.app-value-number {
    display: block;
    margin-bottom: 16px;
    color: #c6d4dc;
    font-size: 12px;
    font-weight: 750;
    letter-spacing: .08em;
}
.app-value-item h3 { margin: 0 0 11px; color: #16313f; font-size: 20px; font-weight: 760; }
.app-value-item p { margin: 0; color: #667b87; font-size: 14.5px; line-height: 1.8; }

.app-install-section {
    padding: 92px 0 96px;
    background: #102a39;
    color: #fff;
}
.app-section-heading-light h2 { color: #fff; }
.app-section-heading-light p { color: #b8c8d0; }
.app-section-heading-light > span { color: #8dd6f0; }
.app-device-tabs {
    width: fit-content;
    max-width: 100%;
    display: flex;
    gap: 5px;
    margin-bottom: 20px;
    padding: 5px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 13px;
    background: rgba(255, 255, 255, .055);
}
.app-device-tabs button {
    min-height: 43px;
    padding: 0 17px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: #bdcbd2;
    font: inherit;
    font-size: 14px;
    font-weight: 650;
    cursor: pointer;
}
.app-device-tabs button i { margin-inline-end: 6px; }
.app-device-tabs button[aria-selected="true"] {
    background: #fff;
    color: #143140;
    box-shadow: 0 7px 18px rgba(0, 0, 0, .16);
}
.app-install-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 310px;
    overflow: hidden;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 24px 55px rgba(0, 0, 0, .18);
}
.app-install-panels { min-width: 0; }
.app-device-panel { min-height: 450px; padding: 42px 48px; color: #18323f; }
.app-device-panel[hidden] { display: none; }
.app-device-panel-head {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 30px;
    padding-bottom: 24px;
    border-bottom: 1px solid #e6edf1;
}
.app-device-panel-head > i {
    width: 48px;
    height: 48px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: #e9f7fc;
    color: var(--wc-primary-d, #0073a8);
    font-size: 22px;
}
.app-device-panel-head h3 { margin: 0 0 3px; color: #142f3d; font-size: 22px; font-weight: 780; }
.app-device-panel-head p { margin: 0; color: #7b8e98; font-size: 13px; }
.app-install-steps { list-style: none; padding: 0; margin: 0; }
.app-install-steps li {
    display: grid;
    grid-template-columns: 34px 1fr;
    gap: 15px;
    padding: 0 0 24px;
}
.app-install-steps li:last-child { padding-bottom: 0; }
.app-install-steps li > span {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #b9dcea;
    border-radius: 50%;
    color: var(--wc-primary-d, #0073a8);
    font-size: 12px;
    font-weight: 800;
}
.app-install-steps strong { display: block; margin-bottom: 5px; color: #17313e; font-size: 16px; }
.app-install-steps p { margin: 0; color: #687d88; font-size: 14px; line-height: 1.7; }
.app-install-aside {
    padding: 42px 30px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    background: #e9f6fb;
    color: #18323f;
    border-inline-start: 1px solid #d6eaf2;
}
.app-install-aside img { width: 64px; height: 64px; margin-bottom: 24px; border-radius: 17px; }
.app-install-aside h3 { margin: 0 0 9px; color: #13303e; font-size: 21px; font-weight: 780; }
.app-install-aside p { margin: 0 0 22px; color: #5c7380; font-size: 14px; line-height: 1.75; }
.app-install-side-button {
    width: 100%;
    min-height: 49px;
    padding: 0 17px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.app-install-aside small {
    margin-top: 14px;
    display: flex;
    gap: 7px;
    color: #68808c;
    font-size: 11.5px;
    line-height: 1.5;
}
.app-install-aside small i { margin-top: 2px; color: #26845b; }

.app-faq-layout {
    display: grid;
    grid-template-columns: minmax(260px, 360px) minmax(0, 1fr);
    gap: clamp(50px, 8vw, 110px);
    align-items: start;
}
.app-faq-layout .app-section-heading { position: sticky; top: 100px; margin-bottom: 0; }
.app-faq-layout .app-section-heading a {
    margin-top: 25px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--wc-primary-d, #0073a8);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}
.app-faq-list { border-top: 1px solid #dce6eb; }
.app-faq-item { border-bottom: 1px solid #dce6eb; }
.app-faq-item summary {
    min-height: 78px;
    padding: 20px 2px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    cursor: pointer;
    color: #18323f;
    font-size: 16px;
    font-weight: 720;
    list-style: none;
}
.app-faq-item summary::-webkit-details-marker { display: none; }
.app-faq-item summary i {
    color: var(--wc-primary-d, #0073a8);
    font-size: 12px;
    transition: transform .18s ease;
}
.app-faq-item[open] summary i { transform: rotate(45deg); }
.app-faq-item > div { padding: 0 2px 24px; }
.app-faq-item p { max-width: 760px; margin: 0; color: #657a86; font-size: 14.5px; line-height: 1.85; }

@media (max-width: 991.98px) {
    .app-product-hero { padding-bottom: 70px; }
    .app-product-grid { grid-template-columns: 1fr; gap: 32px; }
    .app-product-copy { max-width: 680px; }
    .app-phone-stage { min-height: 610px; }
    .app-phone-note-message { inset-inline-start: calc(50% - 260px); }
    .app-phone-note-home { right: calc(50% - 270px); }
    .app-value-grid { grid-template-columns: 1fr; }
    .app-value-item { min-height: 0; padding: 30px 20px; border-inline-start: 0; border-bottom: 1px solid #dfe8ed; }
    .app-value-item:last-child { border-bottom: 0; }
    .app-install-shell { grid-template-columns: 1fr; }
    .app-install-aside { border-inline-start: 0; border-top: 1px solid #d6eaf2; }
    .app-faq-layout { grid-template-columns: 1fr; gap: 36px; }
    .app-faq-layout .app-section-heading { position: static; }
}

@media (max-width: 575.98px) {
    .app-product-hero { padding: 18px 0 54px; }
    .app-breadcrumb { margin-bottom: 32px; }
    .app-product-copy h1 { font-size: clamp(2.55rem, 13vw, 3.45rem); }
    .app-product-lead { font-size: 16px; line-height: 1.75; }
    .app-product-actions { align-items: stretch; flex-direction: column; }
    .app-primary-action { width: 100%; }
    .app-secondary-action { justify-content: center; }
    .app-proof-list { gap: 9px 15px; }
    .app-phone-stage { min-height: 535px; margin-inline: -12px; }
    .app-phone-stage::before { width: 350px; height: 350px; }
    .app-phone-stage::after { width: 255px; height: 255px; }
    .app-phone { width: 266px; height: 515px; border-radius: 38px; }
    .app-phone-screen { border-radius: 29px; }
    .app-phone-note { min-width: 190px; }
    .app-phone-note-message { top: 80px; inset-inline-start: 0; }
    .app-phone-note-home { display: none; }
    .app-mini-content { padding-top: 17px; }
    .app-mini-listing { grid-template-columns: 42px 1fr auto; }
    .app-mini-listing-icon { width: 42px; height: 42px; }
    .app-value-section,
    .app-faq-section { padding: 64px 0; }
    .app-section-heading { margin-bottom: 34px; }
    .app-section-heading h2 { font-size: 2rem; }
    .app-value-item { padding-inline: 2px; }
    .app-value-number { display: none; }
    .app-install-section { padding: 66px 0 70px; }
    .app-device-tabs { width: 100%; overflow-x: auto; }
    .app-device-tabs button { flex: 1 0 auto; padding-inline: 13px; font-size: 13px; }
    .app-device-panel { min-height: 0; padding: 30px 22px; }
    .app-device-panel-head { align-items: flex-start; }
    .app-device-panel-head h3 { font-size: 19px; }
    .app-install-steps li { grid-template-columns: 30px 1fr; gap: 11px; }
    .app-install-aside { padding: 32px 22px; }
    .app-faq-item summary { min-height: 70px; font-size: 15px; }
}

@media (prefers-reduced-motion: reduce) {
    .app-product-page *,
    .app-product-page *::before,
    .app-product-page *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}

/* ===== Error page (404) ===== */
.error-page {
    padding: 60px 20px;
}
.error-code {
    font-size: clamp(7rem, 18vw, 12rem);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.05em;
    background: linear-gradient(135deg, var(--wc-primary), var(--wc-primary-l) 70%, #67e8f9);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    margin-bottom: 1rem;
    text-shadow: 0 8px 30px rgba(0, 145, 209,.15);
}

/* ===== Chat / Messages ===== */
.chat-shell {
    display: grid;
    grid-template-columns: 320px 1fr;
    height: clamp(540px, 75vh, 760px);
    overflow: hidden;
    border-radius: var(--wc-radius);
}
.chat-shell > * { min-width: 0; min-height: 0; }

.chat-threads {
    display: flex;
    flex-direction: column;
    border-left: 1px solid var(--wc-border-2);
    background: #fafbfd;
    overflow: hidden;
}
.chat-threads-head {
    padding: 14px 16px;
    border-bottom: 1px solid var(--wc-border-2);
    background: #fff;
    flex-shrink: 0;
}
.chat-threads-list { flex: 1; overflow-y: auto; min-height: 0; }

.chat-thread-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    text-decoration: none;
    color: var(--wc-text);
    border-bottom: 1px solid var(--wc-border-2);
    transition: background-color .12s ease;
}
.chat-thread-item:hover { background: #f3f5fa; color: var(--wc-text); }
.chat-thread-item.is-active { background: #fff; border-right: 3px solid var(--wc-primary); }
.chat-thread-item .min-w-0 { min-width: 0; }

.chat-pane {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    background: #fff;
    overflow: hidden;
}

.chat-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--wc-border-2);
    background: #fff;
    flex-shrink: 0;
}
.chat-back {
    width: 36px; height: 36px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: #f3f5fa;
    color: var(--wc-text-2);
    text-decoration: none;
    flex-shrink: 0;
}
.chat-back:hover { background: var(--wc-primary-50); color: var(--wc-primary); }

/* תפריט פעולות בהדר השיחה (קבאב) */
.chat-head-menu { flex-shrink: 0; }
.chat-head-menu .chm-btn {
    width: 36px; height: 36px;
    border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    background: transparent;
    color: var(--wc-muted);
    border: 0;
    cursor: pointer;
    transition: background-color .12s ease, color .12s ease;
}
.chat-head-menu .chm-btn:hover,
.chat-head-menu .chm-btn[aria-expanded="true"] {
    background: var(--wc-primary-50);
    color: var(--wc-primary);
}
.chat-head-menu .dropdown-item i {
    margin-inline-end: 8px;
    width: 16px;
    text-align: center;
}

/* ===== כרטיס הקשר השיחה - מודעה/החלפה ===== */
.chat-context {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    background: var(--wc-card-bg);
    border-bottom: 1px solid var(--wc-border-2);
    text-decoration: none;
    color: inherit;
    flex-shrink: 0;
    transition: background-color .12s ease;
}
.chat-context:hover,
.chat-context:active {
    background: var(--wc-primary-50);
    color: inherit;
}
.cc-thumb {
    flex: 0 0 52px;
    width: 52px; height: 52px;
    border-radius: 10px;
    overflow: hidden;
    background: var(--wc-bg);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--wc-border);
}
.cc-thumb img {
    width: 100%; height: 100%;
    object-fit: cover;
    display: block;
}
.cc-thumb-empty {
    color: var(--wc-muted-2);
    font-size: 20px;
}
.cc-info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.cc-title {
    font-weight: 700;
    font-size: 14px;
    color: var(--wc-text);
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cc-city {
    font-weight: 500;
    color: var(--wc-muted);
}
.cc-price {
    font-size: 14.5px;
    font-weight: 800;
    color: var(--wc-primary-d);
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}
.cc-cta {
    flex-shrink: 0;
    background: transparent;
    border: 1px solid var(--wc-border);
    color: var(--wc-text-2);
    border-radius: 999px;
    padding: 6px 14px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.1;
    transition: background-color .12s ease, border-color .12s ease, color .12s ease;
}
.chat-context:hover .cc-cta,
.chat-context:active .cc-cta {
    background: var(--wc-primary);
    border-color: var(--wc-primary);
    color: #fff;
}

/* באנר חסימה - מעל אזור ההודעות כשהמשתמש חסם את הצד השני */
.chat-blocked-banner {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    background: #e9f8ff;
    color: #075b7c;
    border-bottom: 1px solid #c8f0ff;
    font-size: 13px;
    font-weight: 500;
    flex-shrink: 0;
}
.chat-blocked-banner i { color: #008bc2; flex-shrink: 0; }

.chat-body {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
    padding: 18px;
    background: linear-gradient(180deg, #fafbfd 0%, #f4f6fb 100%);
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.chat-empty {
    text-align: center;
    color: var(--wc-muted);
    padding: 60px 20px;
    margin: auto 0;
}
/* מצב ריק "עשיר" בסגנון נקי - לפאנל השיחה הראשי */
.chat-empty-hero { max-width: 430px; margin-inline: auto; padding: 48px 28px; }
.chat-empty-art {
    width: 96px; height: 96px;
    margin: 0 auto 22px;
    border-radius: 50%;
    background: var(--wc-primary-50);
    display: flex; align-items: center; justify-content: center;
    color: var(--wc-primary);
    font-size: 40px;
}
.chat-empty-title { font-size: 19px; font-weight: 700; color: var(--wc-text); margin: 0 0 8px; }
.chat-empty-text { font-size: 14px; line-height: 1.65; color: var(--wc-muted); margin: 0; }
/* מצב ריק לרשימת השיחות (סיידבר) */
.chat-threads-empty { padding: 44px 22px; text-align: center; color: var(--wc-muted); }
.chat-threads-empty > i {
    display: block;
    font-size: 30px;
    color: var(--wc-muted-2);
    margin-bottom: 12px;
}
.chat-threads-empty .fw-semibold { color: var(--wc-text); margin-bottom: 4px; }

.chat-msg { display: flex; }
.chat-msg.is-me   { justify-content: flex-end; }
.chat-msg.is-them { justify-content: flex-start; }

.chat-bubble {
    max-width: 78%;
    padding: 8px 12px 6px;
    border-radius: 16px;
    line-height: 1.45;
    font-size: 14.5px;
    box-shadow: 0 1px 2px rgba(15,23,42,.06);
    word-break: break-word;
}
.is-me  .chat-bubble {
    background: var(--wc-primary);
    color: #fff;
    border-bottom-right-radius: 6px;
}
.is-them .chat-bubble {
    background: #fff;
    color: var(--wc-text);
    border: 1px solid var(--wc-border-2);
    border-bottom-left-radius: 6px;
}
.chat-text { white-space: pre-wrap; }
.chat-time {
    font-size: 10.5px;
    margin-top: 3px;
    opacity: .75;
    text-align: end;
}
.is-me .chat-time { color: rgba(255,255,255,.85); }
.is-them .chat-time { color: var(--wc-muted); }

/* ===== Presence (online/offline) ===== */
.avatar-with-status {
    position: relative;
    flex-shrink: 0;
}
.presence-dot {
    position: absolute;
    bottom: 0;
    inset-inline-end: 0;
    width: 12px; height: 12px;
    border-radius: 50%;
    border: 2px solid #fff;
    box-shadow: 0 0 0 1px rgba(0,0,0,.08);
    transition: background-color .2s ease;
}
.presence-dot.is-online  { background: #22c55e; box-shadow: 0 0 0 1px rgba(34,197,94,.3), 0 0 8px rgba(34,197,94,.4); }
.presence-dot.is-offline { background: #ef4444; box-shadow: 0 0 0 1px rgba(239,68,68,.3), 0 0 6px rgba(239,68,68,.35); }

.presence-label {
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 50px;
    margin-inline-start: 6px;
    vertical-align: middle;
}
.presence-label.is-online  { background: #dcfce7; color: #15803d; }
.presence-label.is-offline { background: #f1f5f9; color: #64748b; }

/* שורת נראה-לאחרונה מתחת לשם המוכר */
.chat-presence-line {
    font-size: 12.5px;
    font-weight: 500;
    line-height: 1.3;
    margin-top: 2px;
    color: var(--wc-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.chat-presence-line.is-online {
    color: var(--wc-success);
    font-weight: 600;
}

.chat-typing-indicator {
    display: none;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
    color: var(--wc-primary);
    font-weight: 500;
}
.chat-typing-indicator.is-visible { display: inline-flex; }
.typing-dots {
    display: inline-flex;
    gap: 3px;
}
.typing-dots span {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--wc-primary);
    opacity: .35;
    animation: typing-bounce 1.2s infinite ease-in-out;
}
.typing-dots span:nth-child(2) { animation-delay: .2s; }
.typing-dots span:nth-child(3) { animation-delay: .4s; }
@keyframes typing-bounce {
    0%, 60%, 100% { transform: translateY(0); opacity: .35; }
    30%           { transform: translateY(-4px); opacity: 1; }
}

.chat-input {
    display: flex;
    gap: 8px;
    padding: 12px;
    border-top: 1px solid var(--wc-border-2);
    background: #fff;
    flex-shrink: 0;
}
.chat-input .form-control {
    border-radius: 22px;
    border-color: var(--wc-border);
    background: #f7f8fb;
}
.chat-input .form-control:focus {
    background: #fff;
}
.chat-input .btn-send {
    width: 44px; height: 44px;
    border-radius: 50%;
    flex-shrink: 0;
    padding: 0;
    display: flex; align-items: center; justify-content: center;
}

/* Responsive: כאשר נבחרה שיחה, הרשימה מתחבאת במובייל */
@media (max-width: 991.98px) {
    .chat-shell {
        grid-template-columns: 1fr;
        height: calc(100vh - 220px);
        min-height: 480px;
    }
    .chat-threads { border-left: 0; border-bottom: 1px solid var(--wc-border-2); }
    .chat-threads.is-collapsed-mobile { display: none; }
    .chat-pane.is-empty-mobile { display: none; }
}
@media (min-width: 992px) {
    .chat-back { display: none !important; }
}

/* ===== Mobile chat / blocked-users - מסך מלא, חוויית app-like ===== */
@media (max-width: 991.98px) {
    :root {
        --wc-chat-viewport-h: 100svh;
        --wc-chat-head-safe-top: env(safe-area-inset-top, 0px);
        --wc-chat-input-safe-bottom: env(safe-area-inset-bottom, 0px);
    }

    /* מסתיר את הנאבבר, רצועת הקטגוריות והפוטר - אזור הצ'אט תופס את כל המסך */
    body.page-messages .navbar,
    body.page-messages .mobile-cats-strip,
    body.page-messages .site-footer,
    body.page-blocked-users .navbar,
    body.page-blocked-users .mobile-cats-strip,
    body.page-blocked-users .site-footer { display: none; }

    /* שרשרת flex מלאה מ-body עד chat-shell - בלי calc, בלי הסתמכות על Bootstrap padding/gutters */
    /* משתמשים ב-100svh (small viewport) כדי להבטיח שתיבת הקלט תמיד נראית, גם כשסרגל הכתובת של הדפדפן מוצג. */
    body.page-messages,
    body.page-blocked-users {
        overflow: hidden;
        height: 100vh;
        height: 100svh;
        height: var(--wc-chat-viewport-h, 100svh);
        max-height: var(--wc-chat-viewport-h, 100svh);
    }
    body.page-messages > main,
    body.page-blocked-users > main {
        height: 100vh;
        height: 100svh;
        height: var(--wc-chat-viewport-h, 100svh);
        max-height: var(--wc-chat-viewport-h, 100svh);
        padding: 0 !important;
        display: flex;
        flex-direction: column;
    }
    body.page-messages > main > .container,
    body.page-blocked-users > main > .container {
        flex: 1 1 0;
        min-height: 0;
        padding: 0 !important;
        max-width: 100%;
        display: flex;
        flex-direction: column;
    }
    body.page-messages > main > .container > .row,
    body.page-blocked-users > main > .container > .row {
        flex: 1 1 0;
        min-height: 0;
        margin: 0 !important;
        --bs-gutter-x: 0;
        --bs-gutter-y: 0;
        display: flex;
        flex-direction: column;
    }
    body.page-messages > main > .container > .row > [class*="col-"],
    body.page-blocked-users > main > .container > .row > [class*="col-"] {
        flex: 1 1 0;
        min-height: 0;
        padding: 0 !important;
        display: flex;
        flex-direction: column;
    }
    body.page-messages .chat-shell,
    body.page-blocked-users .bu-shell {
        flex: 1 1 0;
        min-height: 0;
        height: auto;
        max-height: 100%;
        border-radius: 0;
        border: 0;
        box-shadow: none;
        background: var(--wc-card-bg);
    }
    body.wc-theme.wc-route-messages.page-messages .chat-shell {
        height: 100%;
        min-height: 0;
        max-height: 100%;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }
    body.page-messages .chat-threads { background: var(--wc-card-bg); }

    /* בר עליון דק עם הלוגו - שומר על נוכחות המותג */
    .chat-topbar {
        flex-shrink: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        background: var(--wc-primary);
        height: calc(52px + env(safe-area-inset-top));
        padding-top: env(safe-area-inset-top);
    }
    .chat-topbar-logo {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    .chat-topbar-logo img {
        height: 36px;
        width: auto;
        display: block;
        filter: drop-shadow(0 1px 2px rgba(0,0,0,.18));
        transition: transform .15s ease;
    }
    .chat-topbar-logo:hover img { transform: scale(1.04); }

    /* כפתור יציאה מהצ'אט (חזרה לדף הקודם / לבית) */
    .chat-exit {
        width: 36px; height: 36px;
        border-radius: 50%;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: var(--wc-bg);
        color: var(--wc-text-2);
        text-decoration: none;
        flex-shrink: 0;
        transition: background-color .12s ease, color .12s ease;
    }
    .chat-exit:hover,
    .chat-exit:active { background: var(--wc-primary-50); color: var(--wc-primary); }

    /* כותרת השיחות - בולטת ונקייה */
    body.page-messages .chat-threads-head {
        min-height: calc(62px + var(--wc-chat-head-safe-top));
        padding: calc(14px + var(--wc-chat-head-safe-top)) 18px 14px;
        background: var(--wc-card-bg);
        border-bottom: 1px solid var(--wc-border-2);
    }
    body.page-messages .chat-threads-head h5 {
        font-size: 18px;
        letter-spacing: -.01em;
    }
    body.page-messages .chat-threads-head h5 > i {
        color: var(--wc-primary);
        margin-inline-end: 4px;
    }
    body.page-messages .chat-threads-head .btn {
        font-size: 13px;
        padding: 7px 14px;
        font-weight: 700;
    }

    /* פריטי שיחה - touch-friendly עם ריווח נוח */
    body.page-messages .chat-thread-item {
        padding: 14px 18px;
        gap: 14px;
        border-bottom: 1px solid var(--wc-border-2);
        align-items: center;
    }
    body.page-messages .chat-thread-item img.avatar-sm {
        width: 48px;
        height: 48px;
    }
    body.page-messages .chat-thread-item .fw-bold {
        font-size: 15px;
        margin-bottom: 2px;
    }
    body.page-messages .chat-thread-item .small {
        font-size: 13px;
        color: var(--wc-muted);
    }
    body.page-messages .chat-thread-item.is-active {
        background: var(--wc-primary-50);
        border-right: 3px solid var(--wc-primary);
    }
    body.page-messages .chat-thread-item .badge {
        min-width: 22px;
        height: 22px;
        font-size: 11px;
        padding: 0 7px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-weight: 700;
    }

    /* כותרת השיחה הפעילה - חזקה יותר */
    body.page-messages .chat-pane {
        flex: 1 1 0;
        min-height: 0;
        height: 100%;
        max-height: 100%;
    }
    body.page-messages .chat-head {
        min-height: calc(62px + var(--wc-chat-head-safe-top));
        padding: calc(10px + var(--wc-chat-head-safe-top)) 14px 10px;
        background: var(--wc-card-bg);
    }
    body.page-messages .chat-back {
        width: 42px;
        height: 42px;
    }
    body.page-messages .chat-head .avatar-sm {
        width: 42px;
        height: 42px;
    }
    body.page-messages .chat-context {
        min-height: 78px;
        padding: 9px 12px;
    }
    body.page-messages .cc-thumb {
        flex-basis: 48px;
        width: 48px;
        height: 48px;
    }
    body.page-messages .cc-title {
        font-size: 13.5px;
    }
    body.page-messages .cc-price {
        font-size: 14px;
    }
    body.page-messages .cc-cta {
        padding-inline: 12px;
        font-size: 12.5px;
    }

    /* גוף השיחה - רקע יותר נקי */
    body.page-messages .chat-body {
        flex: 1 1 0;
        min-height: 0;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        background: var(--wc-bg);
        padding: 16px 14px;
    }

    /* קלט הודעה - דביק לתחתית עם safe-area */
    body.page-messages .chat-input {
        padding: 12px 12px calc(12px + var(--wc-chat-input-safe-bottom));
        position: relative;
        z-index: 2;
    }
    body.page-messages .chat-input .form-control {
        min-height: 44px;
        font-size: 16px;
    }

    body.page-messages.is-chat-keyboard-open .chat-body {
        padding-bottom: 10px;
    }
}

/* ===== Empty state מורחב לרשימת השיחות - סגנון "היי, הכרת את הצ'אט" ===== */
.chat-threads-empty {
    padding: 56px 24px 40px;
    text-align: center;
    color: var(--wc-muted);
}
.chat-threads-empty .cte-art {
    width: 96px; height: 96px;
    margin: 0 auto 20px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--wc-primary-50), #e0eaff);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--wc-primary);
    font-size: 38px;
    box-shadow: 0 12px 32px rgba(0, 145, 209,.18);
}
.chat-threads-empty .cte-title {
    font-size: 19px;
    font-weight: 800;
    color: var(--wc-text);
    margin: 0 0 8px;
    letter-spacing: -.01em;
}
.chat-threads-empty .cte-text {
    font-size: 14px;
    line-height: 1.65;
    color: var(--wc-muted);
    margin: 0 0 22px;
    max-width: 320px;
    margin-inline: auto;
}
.chat-threads-empty .cte-cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--wc-primary);
    color: #fff;
    text-decoration: none;
    font-weight: 700;
    font-size: 14px;
    padding: 10px 22px;
    border-radius: 999px;
    box-shadow: 0 6px 18px rgba(0, 145, 209,.28);
    transition: background-color .15s ease, transform .12s ease;
}
.chat-threads-empty .cte-cta:hover { background: var(--wc-primary-d); color: #fff; transform: translateY(-1px); }
.chat-threads-empty .cte-cta:active { transform: translateY(0); }
.chat-threads-empty .cte-cta i { font-size: 12.5px; }

/* ===== Tickets thread ===== */
.ticket-thread {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-height: 65vh;
    min-height: 200px;
    overflow-y: auto;
    padding: 6px;
    border: 1px solid var(--wc-border-2);
    border-radius: var(--wc-radius);
    background: #fcfcfd;
    scroll-behavior: smooth;
}
.ticket-thread::-webkit-scrollbar { width: 8px; }
.ticket-thread::-webkit-scrollbar-track { background: transparent; }
.ticket-thread::-webkit-scrollbar-thumb { background: var(--wc-border); border-radius: 8px; }
.ticket-thread::-webkit-scrollbar-thumb:hover { background: var(--wc-muted-2); }
.ticket-msg {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}
.ticket-msg-avatar {
    width: 42px; height: 42px;
    border-radius: 50%;
    background: var(--wc-primary-50);
    color: var(--wc-primary);
    display: flex; align-items: center; justify-content: center;
    font-size: 18px;
    flex-shrink: 0;
    overflow: hidden;
    border: 1px solid var(--wc-border);
}
.ticket-msg-avatar img { width: 100%; height: 100%; object-fit: cover; }
.ticket-msg.is-admin .ticket-msg-avatar {
    background: linear-gradient(135deg, var(--wc-primary), var(--wc-primary-l));
    color: #fff;
    border-color: transparent;
}
.ticket-msg-body {
    flex-grow: 1;
    background: #fafbfd;
    border: 1px solid var(--wc-border-2);
    border-radius: 12px;
    padding: 12px 14px;
}
.ticket-msg.is-admin .ticket-msg-body {
    background: var(--wc-primary-50);
    border-color: rgba(0, 145, 209,.15);
}
.ticket-msg-meta {
    display: flex; align-items: center; gap: 6px;
    margin-bottom: 6px;
    font-size: 13px;
    color: var(--wc-text-2);
}
.ticket-msg-text {
    color: var(--wc-text);
    font-size: 14.5px;
    line-height: 1.7;
    word-break: break-word;
}

/* ===== Promotion packages ===== */
.package-card {
    --pkg-color: var(--wc-primary);
    position: relative;
    background: #fff;
    border: 1px solid var(--wc-border);
    border-radius: var(--wc-radius-lg);
    overflow: hidden;
    box-shadow: var(--wc-shadow);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.package-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--wc-shadow-h);
}
.package-card.is-recommended {
    border-color: var(--pkg-color);
    box-shadow: 0 0 0 2px var(--pkg-color), var(--wc-shadow);
}
.package-ribbon {
    position: absolute;
    top: 14px; inset-inline-end: 14px;
    background: #fff;
    color: var(--pkg-color);
    padding: 4px 12px;
    border-radius: 50px;
    font-size: 12px;
    font-weight: 700;
    z-index: 2;
    box-shadow: 0 2px 6px rgba(0,0,0,.08);
}
.package-head {
    background: var(--pkg-color);
    padding: 22px 22px 18px;
    color: #fff;
}
.package-name {
    margin: 0;
    font-size: 22px;
    font-weight: 700;
    color: #fff;
    letter-spacing: -.02em;
}
.package-body {
    padding: 24px 22px 22px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}
.package-price {
    text-align: end;
    margin-bottom: 14px;
    color: var(--wc-text);
}
.package-price .price-amount {
    font-size: 36px;
    font-weight: 800;
    letter-spacing: -.03em;
    color: var(--wc-text);
}
.package-price .price-currency {
    font-size: 20px;
    color: var(--wc-text-2);
    margin-inline-start: 2px;
}
.package-desc {
    color: var(--wc-muted);
    font-size: 14px;
    margin-bottom: 14px;
}
.package-features {
    list-style: none;
    padding: 0;
    margin: 0 0 6px;
}
.package-features li {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 0;
    font-size: 14px;
    color: var(--wc-text-2);
    border-bottom: 1px dashed var(--wc-border-2);
}
.package-features li:last-child { border-bottom: 0; }
.package-features i {
    color: var(--pkg-color);
    font-size: 14px;
}
.package-card .btn-primary {
    background-color: var(--pkg-color);
    border-color: var(--pkg-color);
    font-weight: 600;
}
.package-card .btn-primary:hover {
    filter: brightness(.92);
}

/* ===== Category sections on homepage ===== */
.category-section h2 {
    display: flex;
    align-items: center;
    gap: 10px;
    letter-spacing: -.02em;
}
.category-section-icon {
    width: 38px; height: 38px;
    border-radius: 10px;
    background: var(--wc-primary-50);
    color: var(--wc-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
}
.category-section + .category-section {
    border-top: 1px dashed var(--wc-border-2);
    padding-top: 28px;
}

/* ===== Articles ===== */
.article-card {
    display: flex;
    flex-direction: column;
    background: var(--wc-card-bg);
    border: 1px solid var(--wc-border);
    border-radius: var(--wc-radius);
    overflow: hidden;
    text-decoration: none;
    color: var(--wc-text);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    height: 100%;
}
.article-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--wc-shadow-h);
    border-color: rgba(0, 145, 209,.25);
    color: var(--wc-text);
}
.article-thumb {
    aspect-ratio: 16/9;
    background: linear-gradient(135deg, #d6edfa, #b3e0f5);
    display: flex; align-items: center; justify-content: center;
    overflow: hidden;
    color: var(--wc-primary);
    font-size: 48px;
}
.article-thumb img {
    width: 100%; height: 100%; object-fit: cover;
    transition: transform .3s ease;
}
.article-card:hover .article-thumb img { transform: scale(1.04); }
.article-body { padding: 18px 18px 16px; display: flex; flex-direction: column; flex-grow: 1; }
.article-meta {
    font-size: 12px;
    color: var(--wc-muted);
    margin-bottom: 8px;
}
.article-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: -.01em;
    margin: 0 0 8px;
    color: var(--wc-text);
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden;
}
.article-excerpt {
    font-size: 14px;
    color: var(--wc-muted);
    margin-bottom: 12px;
    line-height: 1.55;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
    overflow: hidden;
}
.article-link {
    color: var(--wc-primary);
    font-weight: 600;
    font-size: 13px;
    margin-top: auto;
}

/* ===== Contact page ===== */
.contact-icon {
    width: 42px; height: 42px;
    border-radius: 12px;
    background: var(--wc-primary-50);
    color: var(--wc-primary);
    display: flex; align-items: center; justify-content: center;
    font-size: 17px;
    flex-shrink: 0;
}

/* ===== Content pages (privacy / terms) ===== */
.content-page h1, .content-page h2, .content-page h3, .content-page h4 {
    font-weight: 700; letter-spacing: -.02em;
    margin-top: 1.8rem; margin-bottom: .8rem;
    color: var(--wc-text);
}
.content-page h2 { font-size: 1.5rem; }
.content-page h3 { font-size: 1.2rem; }
.content-page p { margin-bottom: 1rem; color: var(--wc-text-2); }
.content-page ul, .content-page ol { padding-right: 1.5rem; margin-bottom: 1rem; }
.content-page li { margin-bottom: .4rem; color: var(--wc-text-2); }
.content-page a { text-decoration: underline; }
.content-page strong { color: var(--wc-text); }
.content-page hr { border-color: var(--wc-border-2); margin: 1.6rem 0; }

/* ===== Misc ===== */
.min-vh-50 { min-height: 50vh; }
.fz-13 { font-size: 13px; }
.shadow-sm-soft { box-shadow: var(--wc-shadow-xs); }

/* Section headings */
section > .container > h2,
section > .container > .d-flex > h2 { font-weight: 700; letter-spacing: -.02em; }

/* ===== Wizard (create-listing dots) ===== */
[data-dot] { transition: background-color .2s ease; }
[data-dot].bg-primary { background-color: var(--wc-primary) !important; }

/* ===== Responsive ===== */
@media (max-width: 991.98px) {
    .admin-content { padding: 16px 14px; }
    .admin-content h1.h3 { font-size: 1.35rem; }
    .stat-card { padding: 16px; }
    .stat-card .value { font-size: 24px; }
    .card.p-4 { padding: 1.1rem !important; }
    .card.p-2 { padding: .5rem !important; }
    .admin-content .nav-pills { flex-wrap: wrap; gap: 4px; }
    .admin-content .nav-pills .nav-link { padding: .35rem .7rem; font-size: 13px; }
}

/* ===== Media library cards ===== */
.media-card {
    background: #fff;
    border: 1px solid var(--wc-border);
    border-radius: var(--wc-radius);
    overflow: hidden;
    box-shadow: var(--wc-shadow-xs);
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.media-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--wc-shadow);
    border-color: rgba(0, 145, 209,.25);
}
.media-thumb {
    aspect-ratio: 1/1;
    background: #f3f5fa;
    display: flex; align-items: center; justify-content: center;
    overflow: hidden;
    color: var(--wc-muted-2);
    font-size: 36px;
}
.media-thumb img {
    width: 100%; height: 100%;
    object-fit: cover;
}
.media-info { padding: 10px 12px 6px; flex-grow: 1; }
.media-name {
    font-size: 12px;
    font-weight: 500;
    color: var(--wc-text-2);
    word-break: break-all;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.media-meta {
    font-size: 11px;
    color: var(--wc-muted-2);
    display: flex; gap: 4px;
    margin-top: 2px;
}
.media-actions {
    display: flex;
    gap: 4px;
    padding: 8px 10px 10px;
    border-top: 1px solid var(--wc-border-2);
}
.media-actions .btn { padding: .25rem .5rem; font-size: 12px; flex: 1; }

/* ===== Stacked tables on mobile =====
   הוסיפי class="table-stack" וה-td יצטרכו data-label="…" */
@media (max-width: 767.98px) {
    .table-stack { width: 100%; }
    .table-stack thead { display: none; }
    .table-stack, .table-stack tbody, .table-stack tr, .table-stack td { display: block; width: 100%; }
    .table-stack tbody tr {
        border: 1px solid var(--wc-border);
        border-radius: var(--wc-radius);
        padding: 12px 14px;
        margin-bottom: 10px;
        background: #fff;
        box-shadow: var(--wc-shadow-xs);
    }
    .table-stack td {
        padding: 6px 0 !important;
        border: 0 !important;
        text-align: right;
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 10px;
        flex-wrap: wrap;
    }
    .table-stack td::before {
        content: attr(data-label);
        font-weight: 600;
        color: var(--wc-muted);
        font-size: 12px;
        text-transform: uppercase;
        letter-spacing: .05em;
        min-width: 90px;
    }
    .table-stack td[data-label=""]::before { display: none; }
    .table-stack td.actions {
        justify-content: flex-end;
        border-top: 1px dashed var(--wc-border-2) !important;
        margin-top: 6px;
        padding-top: 10px !important;
    }
    .table-stack td.actions::before { display: none; }
}
@media (max-width: 575.98px) {
    .hero { padding: 44px 0 56px; border-radius: 0 0 20px 20px; }
    .otp-input { width: 40px; height: 48px; font-size: 18px; }
    .listing-card .body { padding: 12px 14px 14px; }
    .listing-card .price { font-size: 16px; }
}

/* ===== Cookie consent banner ===== */
.cookie-banner[hidden],
.cookie-banner:not(.is-ready) {
    display: none !important;
}
.cookie-banner {
    position: fixed;
    bottom: 22px;
    inset-inline-start: 22px;
    inset-inline-end: 22px;
    max-width: 780px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 22px 26px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    box-shadow:
        0 30px 70px -12px rgba(15, 23, 42, .40),
        0 0 0 1px rgba(15, 23, 42, .04);
    z-index: 1080;
    transform: translateY(140%);
    opacity: 0;
    transition: transform .42s cubic-bezier(.34, 1.32, .64, 1), opacity .25s ease;
}
.cookie-banner.is-visible {
    transform: translateY(0);
    opacity: 1;
}
.cookie-banner .cb-icon {
    flex: 0 0 56px;
    width: 56px; height: 56px;
    border-radius: 16px;
    background: linear-gradient(135deg, #c8f0ff, #00aeef);
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    box-shadow: 0 8px 18px rgba(0, 174, 239, .35);
}
.cookie-banner .cb-body { flex: 1; min-width: 0; }
.cookie-banner .cb-title {
    font-weight: 700;
    font-size: 17px;
    color: #0f172a;
    margin-bottom: 5px;
    letter-spacing: -.01em;
    line-height: 1.3;
}
.cookie-banner .cb-text {
    font-size: 14.5px;
    color: #334155;
    line-height: 1.6;
}
.cookie-banner .cb-text a {
    color: var(--wc-primary, #0091d1);
    text-decoration: underline;
    text-decoration-thickness: 1.5px;
    text-underline-offset: 3px;
    font-weight: 600;
    white-space: nowrap;
}
.cookie-banner .cb-text a:hover { color: var(--wc-primary-d, #0073a8); }
.cookie-banner .cb-actions {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}
.cookie-banner .cb-accept,
.cookie-banner .cb-essential {
    padding: .65rem 1.5rem;
    font-weight: 600;
    font-size: 14px;
    border-radius: 999px;
    white-space: nowrap;
}
.cookie-banner .cb-accept {
    box-shadow: 0 8px 20px rgba(0, 145, 209, .32);
}
.cookie-banner .cb-essential {
    color: #475569;
    border-color: #cbd5e1;
    background: #fff;
}
.cookie-banner .cb-essential:hover {
    background: #f1f5f9;
    color: #1e293b;
    border-color: #94a3b8;
}

@media (max-width: 575.98px) {
    .cookie-banner {
        flex-wrap: wrap;
        bottom: 12px;
        inset-inline-start: 12px;
        inset-inline-end: 12px;
        padding: 14px 16px;
        gap: 12px;
    }
    .cookie-banner .cb-icon { flex: 0 0 40px; width: 40px; height: 40px; font-size: 18px; }
    .cookie-banner .cb-body { flex: 1 1 calc(100% - 60px); }
    .cookie-banner .cb-actions {
        width: 100%;
        justify-content: space-between;
        padding-top: 4px;
        border-top: 1px solid #f1f5f9;
    }
    .cookie-banner .cb-accept,
    .cookie-banner .cb-essential { flex: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .cookie-banner { transition: opacity .2s ease; transform: none; }
}

/* ===== Live traffic widget - אדמין דשבורד ===== */
.live-traffic {
    display: flex;
    align-items: center;
    gap: 28px;
    padding: 20px 24px;
    background: linear-gradient(135deg, #ecfdf5 0%, #ffffff 100%);
    border: 1px solid #a7f3d0;
    border-radius: 14px;
    box-shadow: 0 4px 14px rgba(16,185,129,.08);
}
.live-traffic .lt-left {
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 1;
    min-width: 0;
}
.live-traffic .lt-label {
    font-weight: 700;
    font-size: 15px;
    color: #065f46;
}
.live-traffic .lt-sub {
    font-size: 12px;
    color: #6b7280;
    margin-top: 2px;
}
.live-traffic .lt-center {
    text-align: center;
    padding: 0 16px;
    border-inline-start: 1px solid #d1fae5;
    border-inline-end:   1px solid #d1fae5;
}
.live-traffic .lt-number {
    font-size: 32px;
    font-weight: 800;
    color: #047857;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
.live-traffic .lt-unit {
    font-size: 12px;
    color: #6b7280;
    margin-top: 4px;
}
.live-traffic .lt-right {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
    min-width: 0;
}
.live-traffic .lt-row {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13.5px;
}
.live-traffic .lt-row i { width: 16px; text-align: center; }

/* נקודה פועמת */
.lt-pulse {
    position: relative;
    display: inline-block;
    width: 14px; height: 14px;
    flex-shrink: 0;
}
.lt-pulse > span {
    position: absolute;
    inset: 0;
    background: #10b981;
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(16,185,129,.18);
}
.lt-pulse::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: #10b981;
    opacity: .55;
    animation: lt-ripple 1.6s ease-out infinite;
}
@keyframes lt-ripple {
    0%   { transform: scale(1);   opacity: .55; }
    100% { transform: scale(2.6); opacity: 0;   }
}
@media (max-width: 767.98px) {
    .live-traffic { flex-wrap: wrap; gap: 14px; padding: 14px 16px; }
    .live-traffic .lt-center {
        border: 0;
        padding: 0;
        text-align: start;
        flex: 1;
    }
    .live-traffic .lt-right { width: 100%; flex: 0 0 100%; padding-top: 10px; border-top: 1px solid #d1fae5; }
    .live-traffic .lt-number { font-size: 24px; }
}

/* ===== Admin action buttons - אייקון + טקסט בדסקטופ, אייקון בלבד במובייל ===== */
.adm-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}
.adm-btn .adm-btn-text {
    font-size: 12.5px;
    font-weight: 500;
}
@media (max-width: 991.98px) {
    .adm-btn .adm-btn-text { display: none; }
    .adm-btn { gap: 0; }
}

/* ===== My-Listings - תצוגת כרטיסים רספונסיבית ===== */
.ml-list { display: flex; flex-direction: column; gap: 12px; }
.ml-card {
    position: relative;
    display: flex;
    gap: 14px;
    padding: 14px;
    border: 1px solid var(--wc-border, #e5e7eb);
    border-radius: 12px;
    background: #fff;
    transition: box-shadow .15s ease, transform .15s ease;
}
/* כפתור מחיקה צף בפינה התחתונה (bottom-start = ימין ב-RTL) */
.ml-card-del {
    position: absolute;
    bottom: 10px;
    inset-inline-start: 10px;
    z-index: 2;
    margin: 0;
}
.ml-card-del .btn {
    width: 34px; height: 34px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(4px);
    border-color: rgba(220, 53, 69, .35);
}
.ml-card-del .btn:hover {
    background: #dc3545;
    color: #fff;
}
.ml-card:hover {
    box-shadow: 0 8px 22px rgba(2,6,23,.08);
    transform: translateY(-1px);
}
.ml-card-img {
    flex: 0 0 110px;
    display: block;
    text-decoration: none;
}
.ml-card-img img {
    width: 110px; height: 88px;
    object-fit: cover;
    border-radius: 10px;
    background: #f3f4f6;
}
.ml-card-body { flex: 1; min-width: 0; }
.ml-card-head {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 10px;
    margin-bottom: 6px;
}
.ml-card-title {
    font-weight: 700;
    color: var(--wc-text);
    text-decoration: none;
    font-size: 15.5px;
    line-height: 1.35;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.ml-card-title:hover { color: var(--wc-primary, #0091d1); }
.ml-card-meta {
    color: var(--wc-muted, #6b7280);
    font-size: 13px;
    display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
}
.ml-card-price { color: var(--wc-text); font-weight: 700; }
.ml-card-dot { color: #cbd5e1; }
.ml-card-promo {
    margin-top: 10px;
    padding: 8px 12px;
    background: linear-gradient(135deg, #e9f8ff, #c8f0ff);
    border: 1px solid #8be2ff;
    border-radius: 10px;
    color: #075b7c;
    font-size: 12.5px;
    font-weight: 500;
    display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
}
.ml-card-promo i { color: #008bc2; }
.ml-card-promo strong { color: #064d70; }
.ml-card-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 0 0 140px;
    align-items: stretch;
    align-self: center;
}
.ml-card-actions > .btn,
.ml-card-actions > form { width: 100%; display: block; margin: 0; }
.ml-card-actions > form .btn { width: 100%; }
.ml-btn-label { display: inline; }

@media (max-width: 767.98px) {
    .ml-card {
        flex-direction: column;
        gap: 10px;
        padding: 12px;
    }
    .ml-card-img { flex: 0 0 auto; width: 100%; }
    .ml-card-img img { width: 100%; height: 180px; border-radius: 10px; }
    /* במובייל - כפתור מחיקה חוזר לפינה העליונה (מעל התמונה) */
    .ml-card-del {
        top: 10px;
        bottom: auto;
        inset-inline-start: 10px;
        inset-inline-end: auto;
    }
    .ml-card-actions {
        flex-direction: row;
        flex: 0 0 auto;
        width: 100%;
        justify-content: stretch;
        gap: 8px;
    }
    .ml-card-actions > .btn,
    .ml-card-actions > form { flex: 1 1 0; }
    .ml-card-actions > form .btn { width: 100%; white-space: nowrap; }
}
@media (max-width: 380px) {
    .ml-btn-label { display: none; }
}

/* ============================================================
   Auth pages - login, register, forgot/create password
   Split layout: brand panel + form panel
   ============================================================ */
.auth-page {
    min-height: calc(100vh - 60px);
    background: linear-gradient(135deg, #f6f7fb 0%, #eef2ff 50%, #f0f9ff 100%);
    padding: 24px 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.auth-container {
    width: 100%;
    max-width: 980px;
    background: #fff;
    border-radius: 24px;
    box-shadow: 0 4px 12px rgba(15, 23, 42, .04), 0 24px 80px -16px rgba(15, 23, 42, .15);
    overflow: hidden;
    display: grid;
    grid-template-columns: 1fr;
    border: 1px solid rgba(255, 255, 255, .6);
}
@media (min-width: 992px) {
    .auth-container { grid-template-columns: 5fr 4fr; }
}
.auth-container.is-wide { max-width: 1100px; }
.auth-container.is-wide @media (min-width: 992px) { grid-template-columns: 6fr 5fr; }

/* === Brand panel (left in RTL → right side) === */
.auth-brand {
    position: relative;
    background:
        radial-gradient(circle at 80% 20%, rgba(255,255,255,.18) 0, transparent 50%),
        radial-gradient(circle at 20% 80%, rgba(255,255,255,.12) 0, transparent 45%),
        linear-gradient(135deg, #0091d1 0%, #0b5e88 55%, #014a70 100%);
    color: #fff;
    padding: 48px 40px;
    display: none;
    overflow: hidden;
}
@media (min-width: 992px) {
    .auth-brand { display: flex; flex-direction: column; }
}
.auth-brand::before {
    content: '';
    position: absolute;
    top: -120px;
    inset-inline-end: -120px;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255,255,255,.15) 0%, transparent 70%);
    pointer-events: none;
}
.auth-brand::after {
    content: '';
    position: absolute;
    bottom: -160px;
    inset-inline-start: -100px;
    width: 360px;
    height: 360px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255,255,255,.08) 0%, transparent 70%);
    pointer-events: none;
}
.auth-brand-content {
    position: relative;
    z-index: 1;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.auth-brand-logo {
    height: 48px;
    width: auto;
    margin-bottom: 32px;
    background: #fff;
    padding: 8px 14px;
    border-radius: 12px;
    align-self: flex-start;
    box-shadow: 0 4px 12px rgba(0,0,0,.12);
}
.auth-brand-title {
    font-size: 30px;
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: 10px;
    letter-spacing: -.01em;
}
.auth-brand-subtitle {
    font-size: 15px;
    opacity: .85;
    line-height: 1.55;
    margin-bottom: 28px;
    max-width: 380px;
}
.auth-features {
    list-style: none;
    padding: 0;
    margin: 0 0 auto;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.auth-features li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 14px;
    line-height: 1.5;
}
.auth-features li i {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    background: rgba(255, 255, 255, .14);
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #fff;
}
.auth-features li strong { font-weight: 600; }
.auth-features li span { display: block; opacity: .8; font-size: 12.5px; margin-top: 1px; }
.auth-brand-footer {
    margin-top: 36px;
    padding-top: 24px;
    border-top: 1px solid rgba(255,255,255,.15);
    font-size: 12.5px;
    opacity: .7;
    line-height: 1.55;
}

/* === Form panel === */
.auth-form-wrap {
    padding: 40px 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}
@media (min-width: 768px) {
    .auth-form-wrap { padding: 56px 48px; }
}
.auth-form-inner {
    width: 100%;
    max-width: 420px;
}
.auth-container.is-wide .auth-form-inner { max-width: 520px; }
.auth-header {
    margin-bottom: 28px;
}
.auth-icon-circle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    background: var(--wc-primary-50, #e6f4fb);
    color: var(--wc-primary, #0091d1);
    border-radius: 16px;
    font-size: 22px;
    margin-bottom: 14px;
}
.auth-title {
    font-size: 26px;
    font-weight: 800;
    color: var(--wc-text, #0f172a);
    margin: 0 0 6px;
    letter-spacing: -.01em;
}
.auth-subtitle {
    color: var(--wc-muted, #64748b);
    font-size: 14.5px;
    margin: 0;
    line-height: 1.55;
}

/* === Field with icon prefix === */
.auth-field { margin-bottom: 16px; }
.auth-field-row { display: grid; gap: 12px; }
@media (min-width: 576px) {
    .auth-field-row.cols-2 { grid-template-columns: 1fr 1fr; }
}
.auth-label {
    display: block;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--wc-text, #0f172a);
    margin-bottom: 6px;
}
.auth-label .req { color: var(--wc-danger, #dc2626); }
.auth-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
}
.auth-input-wrap > i:first-child {
    position: absolute;
    inset-inline-start: 14px;
    color: var(--wc-muted-2, #94a3b8);
    pointer-events: none;
    z-index: 1;
    font-size: 14px;
    transition: color .15s ease;
}
.auth-input {
    width: 100%;
    padding: 13px 14px 13px 42px;
    font-size: 14.5px;
    background: #f8fafc;
    border: 1.5px solid transparent;
    border-radius: 12px;
    color: var(--wc-text, #0f172a);
    transition: all .15s ease;
}
.auth-input:hover {
    background: #f1f5f9;
}
.auth-input:focus {
    outline: none;
    background: #fff;
    border-color: var(--wc-primary, #0091d1);
    box-shadow: 0 0 0 4px rgba(0, 145, 209, .1);
}
.auth-input-wrap:focus-within > i:first-child {
    color: var(--wc-primary, #0091d1);
}
.auth-input::placeholder { color: #cbd5e1; }
.auth-input[dir="ltr"] { padding-inline-start: 42px; padding-inline-end: 14px; }

/* ===== PWA: floating push + install prompts + toast ===== */
#wc-push-prompt,
#wc-install-prompt {
    position: fixed;
    z-index: 1080;
    inset-inline-end: 16px;
    bottom: 20px;
    width: min(360px, calc(100vw - 32px));
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    box-shadow: 0 12px 40px rgba(15, 23, 42, .18);
    padding: 16px 18px 14px;
    display: grid;
    grid-template-columns: 44px 1fr;
    gap: 12px;
    align-items: start;
    transform: translateY(120%);
    opacity: 0;
    transition: transform .35s cubic-bezier(.22,1,.36,1), opacity .25s ease;
    font-family: inherit;
}
/* If both prompts are visible at once - stack the push one above the install one. */
#wc-install-prompt.is-visible ~ #wc-push-prompt,
body:has(#wc-install-prompt.is-visible) #wc-push-prompt {
    bottom: calc(20px + 170px);
}
#wc-push-prompt.is-visible,
#wc-install-prompt.is-visible { transform: translateY(0); opacity: 1; }
#wc-push-prompt.is-loading,
#wc-install-prompt.is-loading  { pointer-events: none; opacity: .7; }
#wc-push-prompt .wc-pp-icon,
#wc-install-prompt .wc-pp-icon {
    width: 44px; height: 44px;
    border-radius: 12px;
    background: linear-gradient(135deg, #d6edfa, #b3e0f5);
    color: var(--wc-primary, #0091d1);
    display: flex; align-items: center; justify-content: center;
    font-size: 20px;
}
/* Install prompt - slightly different accent so users distinguish from notifications. */
#wc-install-prompt .wc-pp-icon {
    background: linear-gradient(135deg, #e9f8ff, #c8f0ff);
    color: #008bc2;
}
#wc-push-prompt .wc-pp-body,
#wc-install-prompt .wc-pp-body { min-width: 0; }
#wc-push-prompt .wc-pp-title,
#wc-install-prompt .wc-pp-title { font-weight: 700; color: #0f172a; margin-bottom: 2px; }
#wc-push-prompt .wc-pp-text,
#wc-install-prompt .wc-pp-text  { font-size: 13.5px; color: #475569; line-height: 1.45; }
#wc-push-prompt .wc-pp-actions,
#wc-install-prompt .wc-pp-actions { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
#wc-push-prompt .wc-pp-btn-primary,
#wc-push-prompt .wc-pp-btn-secondary,
#wc-install-prompt .wc-pp-btn-primary,
#wc-install-prompt .wc-pp-btn-secondary {
    border: 0; border-radius: 999px; padding: 7px 14px; font-size: 13.5px; font-weight: 600;
    cursor: pointer; transition: background-color .15s ease, color .15s ease;
}
#wc-push-prompt .wc-pp-btn-primary,
#wc-install-prompt .wc-pp-btn-primary {
    background: var(--wc-primary, #0091d1); color: #fff;
}
#wc-push-prompt .wc-pp-btn-primary:hover,
#wc-install-prompt .wc-pp-btn-primary:hover { background: var(--wc-primary-d, #0073a8); }
#wc-push-prompt .wc-pp-btn-secondary,
#wc-install-prompt .wc-pp-btn-secondary {
    background: #f1f5f9; color: #475569;
}
#wc-push-prompt .wc-pp-btn-secondary:hover,
#wc-install-prompt .wc-pp-btn-secondary:hover { background: #e2e8f0; }
#wc-push-prompt .wc-pp-close,
#wc-install-prompt .wc-pp-close {
    position: absolute;
    inset-inline-start: 10px;
    top: 8px;
    background: transparent; border: 0;
    font-size: 22px; line-height: 1; color: #94a3b8; cursor: pointer; padding: 4px 8px;
}
#wc-push-prompt .wc-pp-close:hover,
#wc-install-prompt .wc-pp-close:hover { color: #0f172a; }

.wc-toast {
    position: fixed;
    z-index: 1100;
    inset-inline-end: 16px;
    bottom: 20px;
    background: #0f172a;
    color: #fff;
    padding: 12px 18px;
    border-radius: 10px;
    box-shadow: 0 12px 32px rgba(15, 23, 42, .25);
    font-size: 14px;
    font-weight: 500;
    transform: translateY(80%);
    opacity: 0;
    transition: transform .3s cubic-bezier(.22,1,.36,1), opacity .25s ease;
    max-width: calc(100vw - 32px);
}
.wc-toast.is-visible { transform: translateY(0); opacity: 1; }
.wc-toast.is-error   { background: #b91c1c; }
.wc-toast.is-success { background: #15803d; }
.wc-toast.is-info    { background: var(--wc-primary-d); }

/* ===== Connected Devices page ===== */
.device-list { display: flex; flex-direction: column; gap: 12px; }
.device-card {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    padding: 14px 16px;
    background: #fff;
    border: 1px solid var(--wc-border-2, #e2e8f0);
    border-radius: 14px;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.device-card:hover { border-color: #cbd5e1; box-shadow: 0 4px 12px rgba(15, 23, 42, .04); }
.device-card.is-current {
    background: linear-gradient(180deg, #ecfdf5 0%, #ffffff 100%);
    border-color: #6ee7b7;
}
.device-card .device-icon {
    flex-shrink: 0;
    width: 48px; height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, #d6edfa, #b3e0f5);
    color: var(--wc-primary, #0091d1);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}
.device-card.is-current .device-icon {
    background: linear-gradient(135deg, #d1fae5, #a7f3d0);
    color: #047857;
}
.device-card .device-body { flex: 1; min-width: 0; }
.device-card .device-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 4px;
}
.device-card .device-title { font-weight: 700; color: #0f172a; font-size: 14.5px; }
.device-card .device-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
    font-size: 12.5px;
    color: #64748b;
}
.device-card .device-meta i { margin-inline-end: 4px; color: #94a3b8; }

@media (max-width: 480px) {
    .device-card { padding: 12px; }
    .device-card .device-icon { width: 42px; height: 42px; font-size: 18px; }
    .device-card .device-title { font-size: 14px; }
    .device-card .device-meta { font-size: 12px; gap: 4px 12px; }
}

/* ===== PWA welcome modal - מוצג בהפעלה ראשונה כאפליקציה ===== */
html.wpw-open { overflow: hidden; }

#wc-pwa-welcome {
    position: fixed;
    inset: 0;
    z-index: 1098;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    opacity: 0;
    transition: opacity .3s ease;
    font-family: inherit;
}
#wc-pwa-welcome.is-visible { opacity: 1; }
#wc-pwa-welcome .wpw-backdrop {
    position: absolute; inset: 0;
    background: rgba(15, 23, 42, .6);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}
#wc-pwa-welcome .wpw-card {
    position: relative;
    width: 100%;
    max-width: 440px;
    max-height: calc(100vh - 32px);
    overflow-y: auto;
    background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
    border-radius: 24px;
    box-shadow: 0 30px 80px -16px rgba(15, 23, 42, .55);
    padding: 36px 26px 22px;
    text-align: center;
    transform: translateY(60px) scale(.93);
    transition: transform .42s cubic-bezier(.22,1.05,.36,1);
}
#wc-pwa-welcome.is-visible .wpw-card { transform: translateY(0) scale(1); }

#wc-pwa-welcome .wpw-close {
    position: absolute;
    inset-inline-start: 14px;
    top: 14px;
    width: 34px; height: 34px;
    background: transparent;
    border: 0;
    border-radius: 50%;
    font-size: 22px;
    line-height: 1;
    color: #94a3b8;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color .15s ease, color .15s ease;
}
#wc-pwa-welcome .wpw-close:hover { background: #f1f5f9; color: #0f172a; }

/* === Hero: bell with concentric ringing rings === */
#wc-pwa-welcome .wpw-hero {
    position: relative;
    width: 130px;
    height: 130px;
    margin: 0 auto 18px;
}
#wc-pwa-welcome .wpw-bell {
    position: absolute;
    inset: 0;
    margin: auto;
    width: 76px; height: 76px;
    border-radius: 50%;
    background: linear-gradient(135deg, #c8f0ff, #00aeef);
    color: #064d70;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px;
    box-shadow:
        0 14px 32px -6px rgba(0, 174, 239, .55),
        inset 0 2px 0 rgba(255, 255, 255, .55);
    animation: wpwShake 2.6s ease-in-out infinite;
    transform-origin: 50% 15%;
    z-index: 2;
}
@keyframes wpwShake {
    0%, 92%, 100% { transform: rotate(0); }
    93%           { transform: rotate(-10deg); }
    95%           { transform: rotate(8deg); }
    97%           { transform: rotate(-6deg); }
    99%           { transform: rotate(3deg); }
}
#wc-pwa-welcome .wpw-ring {
    position: absolute;
    inset: 0;
    border: 2px solid rgba(0, 174, 239, .6);
    border-radius: 50%;
    opacity: 0;
    animation: wpwRing 2.6s ease-out infinite;
}
#wc-pwa-welcome .wpw-ring-1 { animation-delay: 0s; }
#wc-pwa-welcome .wpw-ring-2 { animation-delay: .85s; }
#wc-pwa-welcome .wpw-ring-3 { animation-delay: 1.7s; }
@keyframes wpwRing {
    0%   { transform: scale(.55); opacity: .7; }
    100% { transform: scale(1.15); opacity: 0; }
}

#wc-pwa-welcome .wpw-title {
    font-size: 22px;
    font-weight: 800;
    color: #0f172a;
    margin: 0 0 8px;
    line-height: 1.25;
}
#wc-pwa-welcome .wpw-sub {
    font-size: 14.5px;
    color: #64748b;
    line-height: 1.55;
    margin: 0 0 22px;
}

#wc-pwa-welcome .wpw-benefits {
    list-style: none;
    padding: 14px;
    margin: 0 0 22px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    text-align: start;
    display: flex;
    flex-direction: column;
    gap: 12px;
    box-shadow: 0 8px 24px -8px rgba(15, 23, 42, .08);
}
#wc-pwa-welcome .wpw-benefits li {
    display: flex;
    align-items: center;
    gap: 12px;
}
#wc-pwa-welcome .wpw-bullet {
    flex-shrink: 0;
    width: 38px; height: 38px;
    border-radius: 12px;
    background: linear-gradient(135deg, #d6edfa, #b3e0f5);
    color: var(--wc-primary, #0091d1);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
}
#wc-pwa-welcome .wpw-benefits li > div { display: flex; flex-direction: column; min-width: 0; }
#wc-pwa-welcome .wpw-benefits strong {
    font-size: 13.5px;
    font-weight: 700;
    color: #0f172a;
}
#wc-pwa-welcome .wpw-benefits span {
    font-size: 12.5px;
    color: #64748b;
    line-height: 1.4;
}

#wc-pwa-welcome .wpw-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
#wc-pwa-welcome .wpw-btn-primary,
#wc-pwa-welcome .wpw-btn-secondary {
    width: 100%;
    border: 0;
    border-radius: 14px;
    padding: 13px 16px;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
    transition: background-color .15s ease, transform .1s ease, box-shadow .2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
#wc-pwa-welcome .wpw-btn-primary {
    background: linear-gradient(135deg, #0091d1, #0073a8);
    color: #fff;
    box-shadow: 0 10px 22px -6px rgba(0, 145, 209, .55);
}
#wc-pwa-welcome .wpw-btn-primary:hover { transform: translateY(-1px); box-shadow: 0 14px 28px -6px rgba(0, 145, 209, .6); }
#wc-pwa-welcome .wpw-btn-primary:active { transform: translateY(0); }
#wc-pwa-welcome .wpw-btn-primary:disabled,
#wc-pwa-welcome .wpw-btn-primary.is-loading { opacity: .8; cursor: wait; }
#wc-pwa-welcome .wpw-btn-primary.is-loading i { animation: wpwSpin 1s linear infinite; }
@keyframes wpwSpin { to { transform: rotate(360deg); } }
#wc-pwa-welcome .wpw-btn-secondary {
    background: transparent;
    color: #64748b;
    font-weight: 600;
}
#wc-pwa-welcome .wpw-btn-secondary:hover { background: #f1f5f9; color: #0f172a; }

@media (max-width: 480px) {
    #wc-pwa-welcome { padding: 0; align-items: flex-end; }
    #wc-pwa-welcome .wpw-card {
        max-width: 100%;
        max-height: 92vh;
        border-radius: 24px 24px 0 0;
        padding: 30px 20px 18px;
        transform: translateY(100%);
    }
    #wc-pwa-welcome.is-visible .wpw-card { transform: translateY(0); }
    #wc-pwa-welcome .wpw-hero { width: 110px; height: 110px; }
    #wc-pwa-welcome .wpw-bell { width: 66px; height: 66px; font-size: 28px; }
    #wc-pwa-welcome .wpw-title { font-size: 20px; }
}

@media (prefers-reduced-motion: reduce) {
    #wc-pwa-welcome .wpw-bell { animation: none; }
    #wc-pwa-welcome .wpw-ring { animation: none; opacity: 0; }
}

/* ===== Install walkthrough modal - הסברי התקנה מפורטים ===== */
html.wim-open { overflow: hidden; }

#wc-install-modal {
    position: fixed;
    inset: 0;
    z-index: 1095;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    opacity: 0;
    transition: opacity .25s ease;
    font-family: inherit;
}
#wc-install-modal.is-visible { opacity: 1; }
#wc-install-modal .wim-backdrop {
    position: absolute; inset: 0;
    background: rgba(15, 23, 42, .55);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}
#wc-install-modal .wim-card {
    position: relative;
    width: 100%;
    max-width: 480px;
    max-height: calc(100vh - 32px);
    overflow-y: auto;
    background: #fff;
    border-radius: 22px;
    box-shadow: 0 30px 80px -20px rgba(15, 23, 42, .55);
    padding: 28px 24px 22px;
    transform: translateY(40px) scale(.97);
    transition: transform .35s cubic-bezier(.22,1,.36,1);
}
#wc-install-modal.is-visible .wim-card { transform: translateY(0) scale(1); }

#wc-install-modal .wim-close {
    position: absolute;
    inset-inline-start: 14px;
    top: 12px;
    width: 36px; height: 36px;
    background: #f1f5f9;
    border: 0;
    border-radius: 50%;
    font-size: 22px;
    line-height: 1;
    color: #475569;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color .15s ease, color .15s ease;
}
#wc-install-modal .wim-close:hover { background: #e2e8f0; color: #0f172a; }

#wc-install-modal .wim-head {
    text-align: center;
    margin-bottom: 22px;
}
#wc-install-modal .wim-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px; height: 64px;
    border-radius: 18px;
    background: linear-gradient(135deg, #d6edfa, #b3e0f5);
    color: var(--wc-primary, #0091d1);
    font-size: 28px;
    margin-bottom: 12px;
    box-shadow: 0 8px 24px rgba(0, 145, 209, .18);
}
#wc-install-modal .wim-title {
    font-size: 22px;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 6px;
    line-height: 1.25;
}
#wc-install-modal .wim-sub {
    font-size: 14px;
    color: #64748b;
    line-height: 1.5;
    margin: 0;
}

#wc-install-modal .wim-steps {
    list-style: none;
    padding: 0;
    margin: 0 0 22px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}
#wc-install-modal .wim-step {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    padding: 14px 14px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    position: relative;
}
#wc-install-modal .wim-step-num {
    flex-shrink: 0;
    width: 30px; height: 30px;
    border-radius: 50%;
    background: var(--wc-primary, #0091d1);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 14px;
    box-shadow: 0 4px 10px rgba(0, 145, 209, .25);
}
#wc-install-modal .wim-step-body { min-width: 0; flex: 1; }
#wc-install-modal .wim-step-title {
    font-weight: 700;
    color: #0f172a;
    font-size: 14.5px;
    margin-bottom: 3px;
}
#wc-install-modal .wim-step-text {
    font-size: 13px;
    color: #475569;
    line-height: 1.5;
}

#wc-install-modal .wim-step-visual {
    margin-top: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
}
#wc-install-modal .wim-vis {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    background: #fff;
    border: 1px dashed #cbd5e1;
    border-radius: 10px;
    font-size: 13px;
    color: #1e293b;
}
#wc-install-modal .wim-vis i { color: var(--wc-primary, #0091d1); font-size: 16px; }
#wc-install-modal .wim-vis-label { font-weight: 600; }
#wc-install-modal .wim-vis-dots i { font-size: 18px; color: #64748b; }
#wc-install-modal .wim-vis-ios-row i { color: var(--wc-primary, #0091d1); font-size: 18px; }
#wc-install-modal .wim-vis-ios-share { background: #f0f9ff; border-color: #bae6fd; border-style: solid; }

#wc-install-modal .wim-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
#wc-install-modal .wim-btn-primary,
#wc-install-modal .wim-btn-secondary {
    width: 100%;
    border: 0;
    border-radius: 12px;
    padding: 12px 16px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color .15s ease, transform .1s ease, box-shadow .2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
#wc-install-modal .wim-btn-primary {
    background: var(--wc-primary, #0091d1);
    color: #fff;
    box-shadow: 0 8px 18px rgba(0, 145, 209, .25);
}
#wc-install-modal .wim-btn-primary:hover { background: var(--wc-primary-d, #0073a8); transform: translateY(-1px); box-shadow: 0 10px 24px rgba(0, 145, 209, .32); }
#wc-install-modal .wim-btn-primary:active { transform: translateY(0); }
#wc-install-modal .wim-btn-primary:disabled { opacity: .65; cursor: wait; }
#wc-install-modal .wim-btn-secondary {
    background: #f1f5f9;
    color: #475569;
}
#wc-install-modal .wim-btn-secondary:hover { background: #e2e8f0; color: #0f172a; }

#wc-install-modal .wim-footer {
    margin-top: 14px;
    padding: 10px 12px;
    background: #e9f8ff;
    border: 1px solid #c8f0ff;
    border-radius: 10px;
    color: #075b7c;
    font-size: 12px;
    line-height: 1.45;
}
#wc-install-modal .wim-footer i { margin-inline-end: 6px; }

@media (max-width: 480px) {
    #wc-install-modal { padding: 0; align-items: flex-end; }
    #wc-install-modal .wim-card {
        max-width: 100%;
        max-height: 90vh;
        border-radius: 22px 22px 0 0;
        padding: 24px 18px 18px;
        transform: translateY(100%);
    }
    #wc-install-modal.is-visible .wim-card { transform: translateY(0); }
    #wc-install-modal .wim-icon { width: 56px; height: 56px; font-size: 24px; }
    #wc-install-modal .wim-title { font-size: 19px; }
}

/* ===== Network status banner - מוצג כשאין חיבור או כשחזר ===== */
.wc-net-banner {
    position: fixed;
    top: 0;
    inset-inline-start: 0;
    inset-inline-end: 0;
    z-index: 1090;
    background: linear-gradient(135deg, #b91c1c 0%, #991b1b 100%);
    color: #fff;
    box-shadow: 0 6px 20px rgba(127, 29, 29, .35);
    transform: translateY(-100%);
    transition: transform .35s cubic-bezier(.22,1,.36,1), background-color .4s ease, box-shadow .4s ease;
    font-family: inherit;
}
.wc-net-banner.is-visible { transform: translateY(0); }
.wc-net-banner.is-online {
    background: linear-gradient(135deg, #15803d 0%, #166534 100%);
    box-shadow: 0 6px 20px rgba(21, 128, 61, .35);
}
.wc-net-banner.is-pulsing { animation: wcNetPulse .6s ease; }
@keyframes wcNetPulse {
    0%, 100% { transform: translateY(0) scale(1); }
    50%      { transform: translateY(0) scale(1.005); filter: brightness(1.15); }
}
.wc-net-inner {
    max-width: 980px;
    margin: 0 auto;
    padding: 10px 16px;
    display: flex;
    align-items: center;
    gap: 14px;
}
.wc-net-icon {
    position: relative;
    width: 38px; height: 38px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .14);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    font-size: 16px;
}
/* Diagonal slash for WiFi-off look - hidden when banner is in "online" state. */
.wc-net-slash {
    position: absolute;
    inset: 0;
    pointer-events: none;
}
.wc-net-slash::before {
    content: '';
    position: absolute;
    top: 50%; left: 8%;
    width: 84%; height: 2.5px;
    background: #fff;
    box-shadow: 0 0 0 2px rgba(185, 28, 28, .9);
    transform: rotate(-45deg);
    transform-origin: center;
    border-radius: 2px;
}
.wc-net-banner.is-online .wc-net-slash { display: none; }
.wc-net-banner.is-online .wc-net-icon i::before { content: "\f164"; } /* fa-thumbs-up state visual */
.wc-net-msg {
    flex: 1;
    min-width: 0;
    line-height: 1.3;
}
.wc-net-title {
    display: block;
    font-size: 14px;
    font-weight: 700;
}
.wc-net-text {
    display: block;
    font-size: 12.5px;
    opacity: .92;
    margin-top: 1px;
}
.wc-net-retry {
    background: rgba(255, 255, 255, .14);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 999px;
    padding: 6px 14px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: background-color .15s ease, transform .1s ease;
    flex-shrink: 0;
}
.wc-net-retry:hover { background: rgba(255, 255, 255, .22); }
.wc-net-retry:active { transform: scale(.97); }
.wc-net-banner.is-online .wc-net-retry { display: none; }

@media (max-width: 480px) {
    .wc-net-inner { padding: 8px 12px; gap: 10px; }
    .wc-net-icon  { width: 34px; height: 34px; font-size: 14px; }
    .wc-net-title { font-size: 13px; }
    .wc-net-text  { font-size: 11.5px; }
    .wc-net-retry span { display: none; }
    .wc-net-retry { padding: 6px 10px; }
}

/* כשהאתר במצב offline - מנע scroll פיגומי בכותרת */
html.wc-is-offline body { padding-top: 0; }

/* ===== Offline page - מוצג כשניווט נכשל ה-SW נופל ל-/offline ===== */
.offline-page main { padding-block: 24px; }
.offline-wrap {
    min-height: calc(100vh - 240px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 16px;
}
.offline-card {
    width: 100%;
    max-width: 480px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    box-shadow: 0 20px 60px -20px rgba(15, 23, 42, .15);
    padding: 36px 28px 28px;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.offline-card::before {
    content: '';
    position: absolute;
    inset: 0 0 auto 0;
    height: 5px;
    background: linear-gradient(90deg, #ef4444 0%, #00aeef 50%, #ef4444 100%);
    background-size: 200% 100%;
    animation: offlineStripe 3s linear infinite;
}
@keyframes offlineStripe {
    0%   { background-position: 0% 0%; }
    100% { background-position: 200% 0%; }
}

/* Illustration - כדור הארץ עם גלים נופלים ו-X */
.offline-illu {
    position: relative;
    width: 140px;
    height: 140px;
    margin: 0 auto 24px;
}
.offline-globe {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 70px;
    color: #94a3b8;
    filter: grayscale(.4);
}
.offline-waves {
    position: absolute;
    inset: 0;
    pointer-events: none;
}
.offline-waves span {
    position: absolute;
    inset: 0;
    border: 2.5px solid #cbd5e1;
    border-radius: 50%;
    opacity: 0;
    transform: scale(.3);
    animation: offlineWave 2.4s ease-out infinite;
}
.offline-waves span:nth-child(2) { animation-delay: .8s; }
.offline-waves span:nth-child(3) { animation-delay: 1.6s; }
@keyframes offlineWave {
    0%   { transform: scale(.3); opacity: .8; border-color: #ef4444; }
    100% { transform: scale(1.2); opacity: 0;  border-color: #ef4444; }
}
.offline-x {
    position: absolute;
    top: -6px;
    inset-inline-end: -6px;
    width: 44px; height: 44px;
    background: #ef4444;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    box-shadow: 0 6px 18px rgba(239, 68, 68, .45);
    animation: offlinePop .5s cubic-bezier(.18,1.4,.7,1.2) .2s both;
}
@keyframes offlinePop {
    0%   { transform: scale(0) rotate(-90deg); }
    100% { transform: scale(1) rotate(0); }
}

.offline-title {
    font-size: 26px;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 8px;
}
.offline-sub {
    color: #64748b;
    font-size: 15px;
    line-height: 1.55;
    margin: 0 0 22px;
}

.offline-tips {
    list-style: none;
    margin: 0 0 24px;
    padding: 16px 18px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    text-align: start;
    font-size: 13.5px;
}
.offline-tips li {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #475569;
    padding: 6px 0;
}
.offline-tips li + li { border-top: 1px solid #e2e8f0; }
.offline-tips li i {
    width: 28px; height: 28px;
    border-radius: 8px;
    background: #fff;
    color: #0091d1;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    font-size: 12px;
    border: 1px solid #e2e8f0;
}

.offline-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    margin-bottom: 18px;
}
.offline-retry {
    min-width: 200px;
    border-radius: 999px !important;
    font-weight: 600;
    box-shadow: 0 8px 22px rgba(0, 145, 209, .25);
    transition: transform .15s ease, box-shadow .2s ease;
}
.offline-retry:hover { transform: translateY(-1px); box-shadow: 0 10px 28px rgba(0, 145, 209, .32); }
.offline-retry:active { transform: translateY(0); }
.offline-retry.is-shaking { animation: offlineShake .4s ease; }
@keyframes offlineShake {
    0%, 100% { transform: translateX(0); }
    25%      { transform: translateX(-6px); }
    75%      { transform: translateX(6px); }
}

.offline-status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #64748b;
    padding: 5px 12px;
    border-radius: 999px;
    background: #f1f5f9;
}
.offline-status.is-online {
    background: #dcfce7;
    color: #166534;
}
.offline-dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: #94a3b8;
    box-shadow: 0 0 0 4px rgba(148, 163, 184, .25);
    animation: offlineDotPulse 1.4s ease-in-out infinite;
}
.offline-status.is-online .offline-dot {
    background: #22c55e;
    box-shadow: 0 0 0 4px rgba(34, 197, 94, .25);
}
@keyframes offlineDotPulse {
    0%, 100% { opacity: 1;   transform: scale(1); }
    50%      { opacity: .55; transform: scale(.85); }
}

.offline-footer {
    margin-top: 6px;
    padding: 12px 14px;
    background: #e6f4fb;
    border: 1px solid #d6edfa;
    border-radius: 12px;
    color: #0b5e88;
    font-size: 12.5px;
    line-height: 1.5;
}
.offline-footer i { margin-inline-end: 6px; }

@media (max-width: 480px) {
    .offline-card  { padding: 28px 20px 22px; border-radius: 16px; }
    .offline-illu  { width: 110px; height: 110px; margin-bottom: 18px; }
    .offline-globe { font-size: 56px; }
    .offline-x     { width: 36px; height: 36px; font-size: 18px; }
    .offline-title { font-size: 22px; }
    .offline-sub   { font-size: 14px; }
}

/* Password toggle button */
.auth-pw-toggle {
    position: absolute;
    inset-inline-end: 10px;
    background: transparent;
    border: 0;
    color: var(--wc-muted-2, #94a3b8);
    padding: 6px 8px;
    border-radius: 6px;
    cursor: pointer;
    z-index: 2;
    transition: all .15s ease;
}
.auth-pw-toggle:hover {
    color: var(--wc-primary, #0091d1);
    background: var(--wc-primary-50, #e6f4fb);
}
.auth-input.has-toggle { padding-inline-end: 44px; }

.auth-hint {
    margin-top: 6px;
    font-size: 12px;
    color: var(--wc-muted, #64748b);
    line-height: 1.5;
}

/* Account type toggle (private/business) */
.auth-account-types {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 4px;
    background: #f1f5f9;
    border-radius: 12px;
    margin-bottom: 20px;
}
.auth-account-types input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}
.auth-account-types label {
    text-align: center;
    padding: 10px 12px;
    font-size: 14px;
    font-weight: 600;
    color: var(--wc-muted, #64748b);
    border-radius: 8px;
    cursor: pointer;
    transition: all .15s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.auth-account-types input[type="radio"]:checked + label {
    background: #fff;
    color: var(--wc-primary-d, #0073a8);
    box-shadow: 0 1px 3px rgba(15, 23, 42, .08), 0 2px 8px rgba(15, 23, 42, .04);
}

/* Submit button */
.auth-submit {
    width: 100%;
    padding: 13px;
    font-size: 15px;
    font-weight: 700;
    background: var(--wc-primary, #0091d1);
    color: #fff;
    border: 0;
    border-radius: 12px;
    cursor: pointer;
    transition: all .15s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    box-shadow: 0 4px 12px -2px rgba(0, 145, 209, .35);
    margin-top: 4px;
}
.auth-submit:hover:not(:disabled) {
    background: var(--wc-primary-d, #0073a8);
    transform: translateY(-1px);
    box-shadow: 0 6px 18px -2px rgba(0, 145, 209, .4);
}
.auth-submit:active { transform: translateY(0); }
.auth-submit:disabled { opacity: .65; cursor: wait; }

/* Footer links */
.auth-forgot {
    display: block;
    text-align: center;
    font-size: 13px;
    color: var(--wc-muted, #64748b);
    text-decoration: none;
    margin-top: 14px;
    padding: 4px;
}
.auth-forgot:hover { color: var(--wc-primary, #0091d1); }

.auth-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 24px 0 20px;
    font-size: 12.5px;
    color: var(--wc-muted-2, #94a3b8);
    font-weight: 500;
}
.auth-divider::before,
.auth-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--wc-border, #e6e8ee);
}

.auth-alt {
    text-align: center;
    font-size: 14px;
    color: var(--wc-muted, #64748b);
    margin-top: 4px;
}
.auth-alt a {
    color: var(--wc-primary, #0091d1);
    font-weight: 600;
    text-decoration: none;
}
.auth-alt a:hover { text-decoration: underline; }

/* Terms checkbox */
.auth-terms {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 4px 0 18px;
    font-size: 13px;
    color: var(--wc-muted, #64748b);
    line-height: 1.5;
}
.auth-terms input[type="checkbox"] {
    margin-top: 3px;
    width: 16px;
    height: 16px;
    accent-color: var(--wc-primary, #0091d1);
    flex-shrink: 0;
}
.auth-terms a { color: var(--wc-primary, #0091d1); text-decoration: none; font-weight: 600; }
.auth-terms a:hover { text-decoration: underline; }

/* Error/info alerts on auth pages */
.auth-alert {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 12px 14px;
    border-radius: 10px;
    margin-bottom: 18px;
    font-size: 13.5px;
    line-height: 1.5;
}
.auth-alert i { margin-top: 2px; flex-shrink: 0; }
.auth-alert.is-error {
    background: #fef2f2;
    color: #991b1b;
    border-inline-start: 3px solid #dc2626;
}
.auth-alert.is-info {
    background: #e6f4fb;
    color: #0b5e88;
    border-inline-start: 3px solid #38bdf8;
}
.auth-alert.is-success {
    background: #ecfdf5;
    color: #065f46;
    border-inline-start: 3px solid #16a34a;
}
.auth-alert a { color: inherit; font-weight: 600; text-decoration: underline; }

/* Footer step indicator below auth submit (for 2-step register) */
.auth-step-hint {
    text-align: center;
    margin-top: 12px;
    font-size: 12.5px;
    color: var(--wc-muted, #64748b);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
.auth-step-hint i { color: var(--wc-muted-2, #94a3b8); }

/* Mobile compact */
@media (max-width: 575.98px) {
    .auth-page { padding: 12px 8px; }
    .auth-container { border-radius: 18px; }
    .auth-form-wrap { padding: 28px 20px; }
    .auth-title { font-size: 22px; }
    .auth-icon-circle { width: 48px; height: 48px; font-size: 18px; }
}

/* ===== תיבת מילוי פרטי רכב לפי מספר רישוי ===== */
.vehicle-plate-box {
    border: 1px solid #d6edfa;
    background: linear-gradient(135deg, #e6f4fb 0%, #f8fafc 100%);
    border-radius: 14px;
    padding: 16px 18px;
    margin-bottom: 22px;
}
.vpb-mode {
    display: inline-flex;
    gap: 4px;
    background: #e2e8f0;
    border-radius: 10px;
    padding: 4px;
    margin-bottom: 14px;
}
.vpb-mode-btn {
    border: none;
    background: transparent;
    color: #475569;
    font-weight: 600;
    font-size: 0.88rem;
    padding: 7px 16px;
    border-radius: 8px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: all .15s;
}
.vpb-mode-btn.is-active {
    background: #fff;
    color: #0091d1;
    box-shadow: 0 1px 3px rgba(15,23,42,.12);
}
.vpb-input-row {
    display: flex;
    gap: 10px;
    align-items: stretch;
}
.vpb-plate-input {
    flex: 1 1 auto;
    font-weight: 700;
    letter-spacing: 1px;
    text-align: center;
    max-width: 260px;
}
.vpb-fetch-btn { white-space: nowrap; flex-shrink: 0; }

.vpb-status {
    margin-top: 12px;
    padding: 10px 14px;
    border-radius: 9px;
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    gap: 8px;
}
.vpb-status--loading { background: #e6f4fb; color: #0073a8; }
.vpb-status--success { background: #ecfdf5; color: #047857; }
.vpb-status--warn    { background: #f3fbff; color: #075b7c; }
.vpb-status--error   { background: #fef2f2; color: #b91c1c; }

.vpb-attrs-hint {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: -6px 0 16px;
    padding: 12px 14px;
    border: 1px solid #dbeafe;
    border-radius: 12px;
    background: #f8fbff;
    color: #334155;
    font-size: 0.92rem;
}
.vpb-attrs-hint[hidden] {
    display: none !important;
}
.vpb-attrs-hint i {
    margin-top: 3px;
    color: #0091d1;
}
.vpb-attrs-hint strong {
    color: #0f172a;
}
.vpb-attrs-hint--success {
    border-color: #bbf7d0;
    background: #f0fdf4;
}
.vpb-attrs-hint--success i {
    color: #047857;
}
.vpb-attrs-hint--warn {
    border-color: #bae6fd;
    background: #f0f9ff;
}

/* קופסת הפרטים הרשמיים (אמון) */
.vpb-official {
    margin-top: 14px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 11px;
    padding: 14px 16px;
}
.vpb-official-head {
    font-weight: 800;
    font-size: 0.92rem;
    color: #047857;
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 10px;
}
.vpb-official-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px 18px;
    margin: 0;
}
.vpb-official-list > div {
    display: flex;
    flex-direction: column;
    gap: 1px;
    border-bottom: 1px solid #f1f5f9;
    padding-bottom: 6px;
}
.vpb-official-list dt {
    font-size: 0.72rem;
    color: #94a3b8;
    font-weight: 600;
}
.vpb-official-list dd {
    margin: 0;
    font-size: 0.88rem;
    font-weight: 600;
    color: #0f172a;
}

/* הדגשה עדינה לשדה שמולא אוטומטית */
.vpb-filled,
.brand-picker.vpb-filled {
    animation: vpb-flash 1.2s ease;
}
@keyframes vpb-flash {
    0%   { box-shadow: 0 0 0 0 rgba(0, 145, 209,.35); }
    100% { box-shadow: 0 0 0 6px rgba(0, 145, 209,0); }
}

@media (max-width: 575.98px) {
    .vpb-input-row { flex-direction: column; }
    .vpb-plate-input { max-width: none; }
    .vpb-fetch-btn { width: 100%; justify-content: center; }
    .vpb-official-list { grid-template-columns: 1fr; }
}

/* ============================================================
   ===============  WHITE THEME (משטחים לבנים)  ===============
   הופך את ה-navbar, רצועת הקטגוריות במובייל וה-hero מרקע כחול
   מלא (טקסט לבן) לרקע לבן נקי עם טקסט כהה ומבטא תכלת בלבד -
   בהשראת keyz. כל הכללים מרוכזים כאן בלבד; להחזרה אחורה - למחוק
   את הבלוק כולו והעיצוב הכחול חוזר.
   ============================================================ */

/* ---------- Navbar: רקע לבן + טקסט כהה ---------- */
.navbar.bg-primary {
    background: #fff !important;
    border-bottom: 1px solid var(--wc-border);
    box-shadow: 0 1px 2px rgba(15,23,42,.05);
    /* משתני ה-navbar של Bootstrap - מצביעים את כל הלינקים/המותג לכהה.
       text-warning וכד' נשארים (utilities הם !important). */
    --bs-navbar-color: var(--wc-text-2);
    --bs-navbar-hover-color: var(--wc-primary-d);
    --bs-navbar-active-color: var(--wc-primary-d);
    --bs-navbar-brand-color: var(--wc-text);
    --bs-navbar-brand-hover-color: var(--wc-text);
    --bs-navbar-disabled-color: var(--wc-muted-2);
}
.navbar.bg-primary .navbar-brand { color: var(--wc-text); }

/* תפריט נפתח במובייל - פאנל לבן מופרד מתחת ל-navbar */
@media (max-width: 991.98px) {
    .navbar.bg-primary .navbar-collapse {
        background: #fff;
        border-bottom: 1px solid var(--wc-border);
        box-shadow: 0 18px 34px rgba(15,23,42,.10);
        padding: 8px 16px 14px;
        border-radius: 0 0 16px 16px;
    }
    /* פריטי תפריט המובייל - כהים על רקע לבן (במקום הלבן של העיצוב הישן) */
    .navbar.bg-primary .navbar-collapse .nav-link { color: var(--wc-text-2); }
    .navbar.bg-primary .navbar-collapse .nav-link:hover {
        background: var(--wc-primary-50);
        color: var(--wc-primary-d);
    }
    .navbar.bg-primary .navbar-collapse .nav-link .fa-fw { color: var(--wc-muted); }
    .navbar.bg-primary .navbar-collapse .nav-link:hover .fa-fw { color: var(--wc-primary-d); }
    .navbar.bg-primary .navbar-collapse hr { border-color: var(--wc-border); }
    /* הקישורים המודגשים (פאנל ניהול/עסקים/התנתק) - להשאיר ברורים אך בכהה/תכלת במקום כתום זועק */
    .navbar.bg-primary .navbar-collapse .nav-link.text-warning { color: var(--wc-text-2) !important; }
    .navbar.bg-primary .navbar-collapse .nav-link.text-warning .fa-fw { color: var(--wc-muted); }
}

/* חיפוש דסקטופ בתוך ה-navbar - משטח אפור בהיר במקום זכוכית שקופה */
.navbar.bg-primary .nav-search {
    background: #f1f5f9;
    border: 1px solid var(--wc-border);
    backdrop-filter: none;
}
.navbar.bg-primary .nav-search:hover {
    background: #eef2f7;
    border-color: var(--wc-border);
}
.navbar.bg-primary .nav-search:focus-within {
    background: #fff;
    border-color: var(--wc-primary);
    box-shadow: 0 0 0 4px rgba(0,145,209,.14), 0 8px 22px rgba(15,23,42,.08);
}
.navbar.bg-primary .nav-search-icon { color: var(--wc-muted); }
.navbar.bg-primary .nav-search-input { color: var(--wc-text); }
.navbar.bg-primary .nav-search-input::placeholder { color: var(--wc-muted-2); }
/* כפתור "חפש" - תכלת (במקום כתום) כדי שהכתום היחיד יהיה ה-CTA "פרסם מודעה" */
.nav-search-btn { background: var(--wc-primary); }
.nav-search-btn:hover { background: var(--wc-primary-d); }

/* כפתורי צ'אט/פעמון/המבורגר במובייל - ריבועים מעוגלים נקיים עם מסגרת וצל עדין */
.nav-chat-btn {
    width: 44px;
    height: 44px;
    border-radius: 13px;
    background: #fff;
    border: 1px solid var(--wc-border);
    box-shadow: 0 1px 2px rgba(15,23,42,.05);
    color: var(--wc-text-2);
}
.nav-chat-btn:hover,
.nav-chat-btn:active {
    background: var(--wc-primary-50);
    border-color: var(--wc-primary);
    color: var(--wc-primary-d);
}
.nav-chat-btn:focus { outline-color: rgba(0,145,209,.35); }
.nav-chat-btn .nav-chat-badge { border-color: #fff; }

@media (max-width: 991.98px) {
    .navbar-dark .navbar-toggler {
        width: 44px;
        height: 44px;
        border-radius: 13px;
        background: #fff;
        border: 1px solid var(--wc-border);
        box-shadow: 0 1px 2px rgba(15,23,42,.05);
    }
    .navbar-dark .navbar-toggler:hover { background: var(--wc-primary-50); border-color: var(--wc-primary); }
    .navbar-dark .navbar-toggler:active { background: #e0e7ee; }
    .navbar-dark .navbar-toggler[aria-expanded="true"] { background: var(--wc-primary-50); border-color: var(--wc-primary); }
    .navbar-dark .navbar-toggler:focus { outline-color: rgba(0,145,209,.35); }
    .navbar-dark .navbar-toggler-icon {
        border-top-color: var(--wc-text-2);
        border-bottom-color: var(--wc-text-2);
    }
    .navbar-dark .navbar-toggler:hover .navbar-toggler-icon,
    .navbar-dark .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
        border-top-color: var(--wc-primary-d);
        border-bottom-color: var(--wc-primary-d);
    }
    .navbar-dark .navbar-toggler-icon::before { background: var(--wc-text-2); }
    .navbar-dark .navbar-toggler:hover .navbar-toggler-icon::before,
    .navbar-dark .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::before { background: var(--wc-primary-d); }
}

/* כניסה/הרשמה ליד הלוגו (מובייל, אורח) */
.nav-auth-link { color: var(--wc-text-2); }
.nav-auth-link:hover,
.nav-auth-link:focus { color: var(--wc-primary-d); opacity: 1; }
.nav-auth-pill { background: var(--wc-primary); color: #fff; }
.nav-auth-pill:hover,
.nav-auth-pill:focus { background: var(--wc-primary-d); color: #fff; }

/* ---------- רצועת קטגוריות במובייל: לבן ---------- */
.mobile-cats-strip {
    background: #fff;
    border-bottom: 1px solid var(--wc-border);
}
.mobile-cat-circle .mcc-img {
    background: #fff;
    border: 1px solid var(--wc-border);
    box-shadow: 0 3px 8px rgba(15,23,42,.08);
}
.mobile-cat-circle:hover .mcc-img { box-shadow: 0 6px 16px rgba(15,23,42,.14); }
.mobile-cat-circle .mcc-label { color: var(--wc-text-2); }

/* ---------- Hero: רקע לבן רך עם הילות תכלת/כתום עדינות ---------- */
.hero {
    background:
        radial-gradient(1100px 440px at 85% -12%, rgba(0,174,239,.10), transparent 60%),
        radial-gradient(760px 320px at 4% 112%, rgba(0,174,239,.07), transparent 60%),
        linear-gradient(180deg, #ffffff 0%, #f3f9fe 100%);
    color: var(--wc-text);
    border-bottom: 1px solid var(--wc-border-2);
}
.hero::after {
    background-image:
        linear-gradient(to right, rgba(15,23,42,.025) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(15,23,42,.025) 1px, transparent 1px);
    opacity: .6;
}
.hero h1 { color: var(--wc-text); }
.hero-h1-accent { color: var(--wc-text); }   /* כל הכותרת כהה - כמו keyz, בלי "כחול שנשאר" */
.hero-slogan { color: var(--wc-text); }
.hero .lead { color: var(--wc-muted); }
.hero-search {
    border: 1px solid var(--wc-border);
    box-shadow: 0 14px 38px rgba(15,23,42,.10);
}
.hero-cta-link { color: var(--wc-primary-d); }
.hero-cta-link:hover { color: var(--wc-primary); }
.hv-ring { border-color: rgba(0,145,209,.30); }
/* בועות הקטגוריה המרחפות - מסגרת מעט מודגשת יותר על רקע לבן */
.hv-card { border-color: rgba(15,23,42,.07); }

/* ============================================================
   ===============  HERO REDESIGN (ממורכז, נקי)  ==============
   Hero ממורכז בסגנון מודרני/יוקרתי: כותרת כהה גדולה, כותרת
   משנה רכה, קפסולת חיפוש עם כפתור עגול, ושורת הצעות עם חצים.
   בלי בועות מרחפות - הרבה white-space.
   ============================================================ */
.hero {
    position: relative;
    padding: 0;
    border-radius: 0;
    border-bottom: 1px solid var(--wc-border-2);
    background:
        radial-gradient(680px 340px at 50% 2%,  rgba(0,145,209,.13), transparent 72%),
        radial-gradient(620px 360px at 88% 98%, rgba(0,174,239,.06), transparent 70%),
        radial-gradient(560px 320px at 10% 98%, rgba(0,145,209,.05), transparent 70%),
        linear-gradient(180deg, #fbfdff 0%, #f1f6fc 100%);
}
.hero::after { display: none; }
/* טקסטורת נקודות עדינה שמתפוגגת בקצוות - עומק "פרימיום" (Linear/Stripe), לא רקע שטוח */
.hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(15,23,42,.05) 1px, transparent 1px);
    background-size: 24px 24px;
    -webkit-mask-image: radial-gradient(ellipse 74% 64% at 50% 30%, #000 26%, transparent 76%);
    mask-image: radial-gradient(ellipse 74% 64% at 50% 30%, #000 26%, transparent 76%);
    pointer-events: none;
    z-index: 0;
}
body.page-home .hero > .container { padding-top: 0; }

.hero-inner {
    position: relative;
    z-index: 1;
    max-width: 760px;
    margin: 0 auto;
    text-align: center;
    padding: clamp(18px, 3vw, 34px) 0 clamp(32px, 4.5vw, 54px);
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* תווית-מותג קטנה מעל הכותרת */
.hero-kicker {
    display: inline-block;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .1em;
    color: var(--wc-primary-d);
    background: var(--wc-primary-50);
    padding: 6px 16px;
    border-radius: 999px;
    margin-bottom: 24px;
}

/* כותרת ראשית (H1) - נשמרת לקריאה ע"י גוגל (SEO) אך מעוצבת קטנה, נקייה וצנועה:
   החיפוש הוא הכוכב של העמוד, לא הכותרת. */
.hero .hero-title {
    font-weight: 600;
    font-size: clamp(1.15rem, 2.1vw, 1.5rem);
    line-height: 1.4;
    letter-spacing: -.005em;
    color: var(--wc-text-2);
    margin: 0 0 22px;
    text-wrap: balance;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
/* שם המותג - מבטא קל בתכלת כהה, בלי אפקטים */
.hero .hero-title .hero-title-brand { color: var(--wc-primary-d); font-weight: 700; }
.hero .hero-title .hero-title-sep   { color: var(--wc-muted-2); font-weight: 400; margin: 0 .12em; }
.hero .hero-title .hero-title-tag   { color: var(--wc-text-2); }

/* כותרת משנה - קטנה, line-height נדיב, אפור רך */
.hero .hero-sub {
    font-size: clamp(1.02rem, 1.5vw, 1.18rem);
    line-height: 1.65;
    font-weight: 400;
    color: var(--wc-muted);
    max-width: 560px;
    margin: 0 0 30px;
}

/* ---- קפסולת חיפוש רחבה ---- */
.hs-bar {
    width: 100%;
    max-width: 680px;
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid var(--wc-border);
    border-radius: 999px;
    padding: 8px;
    padding-inline-start: 24px;
    box-shadow: 0 12px 38px rgba(15,23,42,.08), 0 2px 8px rgba(15,23,42,.04);
    transition: box-shadow .2s ease, border-color .2s ease;
}
.hs-bar:focus-within {
    border-color: var(--wc-primary);
    box-shadow: 0 16px 46px rgba(0,145,209,.16), 0 2px 10px rgba(15,23,42,.05);
}
.hs-icon {
    color: var(--wc-muted-2);
    font-size: 17px;
    flex-shrink: 0;
}
.hs-input {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    font-family: inherit;
    font-size: 16px;
    font-weight: 500;
    color: var(--wc-text);
    padding: 15px 6px;
}
.hs-input::placeholder { color: var(--wc-muted-2); font-weight: 400; }
.hs-input::-webkit-search-cancel-button { display: none; }
.hs-btn {
    flex-shrink: 0;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    border: 0;
    background: var(--wc-primary);
    color: #fff;
    font-size: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 8px 20px rgba(0,145,209,.35);
    transition: background-color .15s ease, transform .12s ease, box-shadow .15s ease;
}
.hs-btn:hover { background: var(--wc-primary-d); transform: scale(1.05); box-shadow: 0 10px 26px rgba(0,145,209,.45); }
.hs-btn:active { transform: scale(.97); }

/* ---- הצעות חיפוש מבוססות-טקסט ---- */
.hero-suggests {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px 24px;
    margin-top: 28px;
}
.hero-suggests-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--wc-muted-2);
}
.hero-suggest {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 14.5px;
    font-weight: 500;
    color: var(--wc-text-2);
    text-decoration: none;
    transition: color .15s ease;
}
.hero-suggest i { font-size: 11px; color: var(--wc-muted-2); transition: transform .15s ease, color .15s ease; }
.hero-suggest:hover { color: var(--wc-primary-d); }
.hero-suggest:hover i { color: var(--wc-primary-d); transform: translateX(-3px); }

/* ---- פס אמון/נתונים - מבסס אמון ומוסיף חומר (לא תיבת חיפוש בלבד) ---- */
.hero-trust {
    display: flex;
    align-items: stretch;
    justify-content: center;
    flex-wrap: wrap;
    gap: 14px 26px;
    margin-top: 34px;
    padding-top: 26px;
    border-top: 1px solid var(--wc-border-2);
    width: 100%;
    max-width: 720px;
}
.hero-trust .ht-item {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--wc-text-2);
    white-space: nowrap;
}
.hero-trust .ht-item i {
    font-size: 18px;
    color: var(--wc-primary);
    flex-shrink: 0;
}
.hero-trust .ht-text {
    display: flex;
    flex-direction: column;
    line-height: 1.25;
    text-align: start;
}
.hero-trust .ht-title {
    font-size: 14px;
    font-weight: 800;
    color: var(--wc-text);
}
.hero-trust .ht-sub {
    font-size: 11.5px;
    font-weight: 500;
    color: var(--wc-muted);
}

@media (max-width: 575.98px) {
    .hs-bar { padding: 6px; padding-inline-start: 18px; }
    .hs-btn { width: 46px; height: 46px; font-size: 16px; }
    .hs-input { font-size: 15px; padding: 12px 4px; }
    .hero-suggests { gap: 8px 16px; }
    .hero-suggests-label { width: 100%; }
    .hero-trust { gap: 12px 18px; margin-top: 26px; padding-top: 20px; }
    .hero-trust .ht-item i { font-size: 16px; }
    .hero-trust .ht-title { font-size: 13px; }
    .hero-trust .ht-sub { font-size: 11px; }
}

/* ---- רצועת קטגוריות-על: נקייה, שורה אחת ---- */
.category-strip { padding-top: 4px; padding-bottom: 4px; }
.megacats {
    display: flex;
    flex-wrap: nowrap;          /* שורה אחת בלבד */
    align-items: center;
    gap: 2px;
    overflow: visible;
}
.megacat { position: relative; }
.megacat::after {
    content: "";
    position: absolute;
    top: 100%;
    inset-inline: 0;
    height: 12px;
    display: none;
}
.megacat:hover::after,
.megacat:focus-within::after { display: block; }
/* קישור/כפתור קטגוריית-על - טקסט נקי, ללא אייקון צבעוני, מראה מינימליסטי */
.megacat-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 8px 12px;
    border: 0;
    background: transparent;
    color: var(--wc-text-2);
    font-size: 14.5px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: -.01em;
    white-space: nowrap;
    border-radius: 8px;
    cursor: pointer;
    text-decoration: none;
    transition: color .12s ease, background-color .12s ease;
}
.megacat-link:hover,
.megacat-link:focus-visible { color: var(--wc-primary-d); background: var(--wc-primary-50); }
.megacat-caret {
    font-size: 11px;
    color: var(--wc-muted);
    transition: transform .15s ease, color .12s ease;
}
.megacat:hover .megacat-caret,
.megacat:focus-within .megacat-caret { transform: rotate(180deg); color: var(--wc-primary-d); }

/* תפריט נפתח - נשלט ב-CSS בלבד (hover / מיקוד), ללא תלות ב-JS */
.megacat-menu {
    position: absolute;
    top: calc(100% + 6px);
    inset-inline-start: 0;
    display: none;
    margin: 0;
    min-width: 230px;
}
.megacat:hover > .megacat-menu,
.megacat:focus-within > .megacat-menu { display: block; }
/* גשר שקוף שמונע סגירת התפריט בזמן מעבר העכבר מהכפתור אל הרשימה */
.megacat-menu::before {
    content: "";
    position: absolute;
    top: -6px; left: 0; right: 0;
    height: 6px;
}
.megacat-mi {
    width: 18px;
    margin-inline-end: 8px;
    color: var(--wc-muted);
    font-size: 13px;
    text-align: center;
}
.dropdown-item:hover .megacat-mi { color: var(--wc-primary-d); }
/* כותרות קבוצה בתפריט הנדל"ן (למכירה / להשכרה) */
.megacat-menu .megacat-group {
    font-size: 11.5px; font-weight: 800; color: var(--wc-primary-d);
    padding: 7px 16px 3px; margin: 0; letter-spacing: .01em;
}
.megacat-menu .dropdown-divider { margin: 4px 0; }

/* ---- שורת חיפוש דסקטופ (מתחת לתפריט הראשי) ---- */
.search-strip { padding-top: 9px; padding-bottom: 9px; min-height: 0; }
.search-strip > .container > form { width: 100%; }
.search-strip .nav-search {
    background: #f1f5f9;
    border: 1px solid var(--wc-border);
    backdrop-filter: none;
    border-radius: 12px;
    width: 100%;
    max-width: 760px;
    margin-inline: auto;   /* ממורכז כמו סרגל חיפוש בלוחות מודעות */
}
.search-strip .nav-search:hover { background: #eef2f7; border-color: var(--wc-border); }
.search-strip .nav-search:focus-within {
    background: #fff;
    border-color: var(--wc-primary);
    box-shadow: 0 0 0 4px rgba(0,145,209,.14), 0 8px 22px rgba(15,23,42,.08);
}
.search-strip .nav-search-icon { color: var(--wc-muted); }
.search-strip .nav-search-input { color: var(--wc-text); }
.search-strip .nav-search-input::placeholder { color: var(--wc-muted-2); }
/* קטגוריות-על בתוך הנאבבר הלבן - להבטיח שהן לא נדחסות מדי */
.navbar .megacats { gap: 0; }
.navbar .megacat-link { padding: 8px 10px; }

/* ===== עמודי נחיתה אזוריים לנדל"ן ===== */
.region-breadcrumb { font-size: 13px; color: var(--wc-muted); margin-bottom: 14px; }
.region-breadcrumb a { color: var(--wc-primary-d); text-decoration: none; }
.region-breadcrumb a:hover { text-decoration: underline; }
.region-breadcrumb span { margin: 0 4px; }
.region-head { margin-bottom: 22px; }
.region-head h1 { font-weight: 800; font-size: clamp(1.5rem, 3.4vw, 2.2rem); letter-spacing: -.01em; margin: 0 0 8px; }
.region-head p { color: var(--wc-muted); max-width: 760px; line-height: 1.6; margin: 0; }

.region-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 14px;
}
.region-card {
    display: flex; align-items: center; gap: 14px;
    background: #fff; border: 1px solid var(--wc-border); border-radius: 14px;
    padding: 16px 18px; text-decoration: none; color: var(--wc-text);
    box-shadow: 0 1px 2px rgba(15,23,42,.04);
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.region-card:hover { transform: translateY(-2px); border-color: var(--wc-primary); box-shadow: 0 12px 28px rgba(15,23,42,.10); color: var(--wc-text); }
.region-card-ico {
    flex-shrink: 0; width: 46px; height: 46px; border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    background: var(--wc-primary-50); color: var(--wc-primary-d); font-size: 19px;
}
.region-card-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }

/* ===== סינון רכב בסגנון יד2: chips, דגימי צבע, מחווני טווח ===== */

/* chips לבחירה-מרובה (יד, תיבת הילוכים, סוג דלק, יצרן). */
.wc-chips { display: flex; flex-wrap: wrap; gap: 7px; }
.wc-chip {
    position: relative; margin: 0; cursor: pointer; user-select: none;
}
.wc-chip input { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; }
.wc-chip span {
    display: inline-flex; align-items: center; justify-content: center;
    padding: 6px 13px; font-size: 13px; font-weight: 500; line-height: 1.2;
    border: 1px solid var(--wc-border); border-radius: 999px;
    background: #fff; color: var(--wc-text-2);
    transition: border-color .12s ease, background .12s ease, color .12s ease, box-shadow .12s ease;
}
.wc-chip:hover span { border-color: var(--wc-primary-l); }
.wc-chip input:checked + span {
    background: var(--wc-primary-50); border-color: var(--wc-primary);
    color: var(--wc-primary-d); font-weight: 600;
    box-shadow: inset 0 0 0 1px var(--wc-primary);
}
.wc-chip input:focus-visible + span { outline: 2px solid var(--wc-primary); outline-offset: 2px; }

/* דגימי צבע - עיגול צבע + תווית. */
.wc-swatches { display: flex; flex-wrap: wrap; gap: 9px 12px; }
.wc-swatch { position: relative; margin: 0; cursor: pointer; display: inline-flex; flex-direction: column; align-items: center; gap: 3px; width: 52px; }
.wc-swatch input { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; }
.wc-swatch-dot {
    width: 30px; height: 30px; border-radius: 50%;
    border: 1px solid rgba(15,23,42,.18);
    box-shadow: 0 1px 2px rgba(15,23,42,.08);
    transition: transform .12s ease, box-shadow .12s ease;
}
.wc-swatch-label { font-size: 11px; color: var(--wc-muted); text-align: center; line-height: 1.1; }
.wc-swatch:hover .wc-swatch-dot { transform: scale(1.08); }
.wc-swatch input:checked + .wc-swatch-dot {
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wc-primary);
}
.wc-swatch input:checked ~ .wc-swatch-label { color: var(--wc-primary-d); font-weight: 600; }
.wc-swatch input:focus-visible + .wc-swatch-dot { outline: 2px solid var(--wc-primary); outline-offset: 3px; }

/* מחוון-טווח כפול (מחיר/שנה/ק"מ/נפח). שני input[type=range] חופפים מעל פס. */
.wc-range { position: relative; height: 30px; }
.wc-range-track {
    position: absolute; top: 50%; right: 0; left: 0; transform: translateY(-50%);
    height: 4px; border-radius: 999px; background: var(--wc-border);
}
.wc-range-fill {
    position: absolute; top: 0; bottom: 0; border-radius: 999px;
    background: var(--wc-primary);
}
.wc-range input[type=range] {
    position: absolute; top: 0; right: 0; left: 0; width: 100%;
    margin: 0; height: 30px; background: none; pointer-events: none;
    -webkit-appearance: none; appearance: none;
}
.wc-range .wc-range-lo { z-index: 3; }
.wc-range .wc-range-hi { z-index: 4; }
.wc-range-fill { z-index: 2; }
.wc-range input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none; appearance: none; pointer-events: auto;
    width: 18px; height: 18px; border-radius: 50%; cursor: pointer;
    background: #fff; border: 2px solid var(--wc-primary);
    box-shadow: 0 1px 3px rgba(15,23,42,.2);
}
.wc-range input[type=range]::-moz-range-thumb {
    pointer-events: auto; width: 18px; height: 18px; border-radius: 50%; cursor: pointer;
    background: #fff; border: 2px solid var(--wc-primary);
    box-shadow: 0 1px 3px rgba(15,23,42,.2);
}
.wc-range input[type=range]::-moz-range-track { background: none; }

/* ===== סרגל רכב עליון (טאבים + כפילי סינון מהיר) בסגנון יד2 ===== */
.veh-bar {
    background: var(--wc-card-bg); border: 1px solid var(--wc-border);
    border-radius: var(--wc-radius-lg); box-shadow: var(--wc-shadow);
    padding: 10px 14px;
}

/* טאבים אופקיים גלילים */
.veh-tabs {
    display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none;
    border-bottom: 1px solid var(--wc-border-2); padding-bottom: 8px; margin-bottom: 10px;
}
.veh-tabs::-webkit-scrollbar { display: none; }
.veh-tab {
    flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px;
    padding: 7px 13px; border-radius: 10px; font-size: 14px; font-weight: 600;
    color: var(--wc-muted); white-space: nowrap; border: 1px solid transparent;
    transition: background .12s ease, color .12s ease;
}
.veh-tab i { font-size: 14px; }
.veh-tab:hover { background: var(--wc-bg); color: var(--wc-primary-d); }
.veh-tab.is-active {
    background: var(--wc-primary-50); color: var(--wc-primary-d);
    border-color: var(--wc-primary-100);
}

/* שורת כפילי סינון מהיר */
.veh-qf { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.veh-qf-item { position: relative; }
.veh-qf-btn {
    display: inline-flex; align-items: center; gap: 7px; cursor: pointer;
    padding: 7px 14px; font-size: 13.5px; font-weight: 600; line-height: 1.2;
    color: var(--wc-text-2); background: #fff;
    border: 1px solid var(--wc-border); border-radius: 999px;
    list-style: none; user-select: none;
    transition: border-color .12s ease, box-shadow .12s ease, background .12s ease;
}
.veh-qf-btn::-webkit-details-marker { display: none; }
.veh-qf-btn:hover { border-color: var(--wc-primary-l); }
.veh-qf-btn .fa-chevron-down { font-size: 11px; color: var(--wc-muted-2); transition: transform .15s ease; }
.veh-qf-item[open] > .veh-qf-btn { border-color: var(--wc-primary); box-shadow: inset 0 0 0 1px var(--wc-primary); }
.veh-qf-item[open] > .veh-qf-btn .fa-chevron-down { transform: rotate(180deg); }
.veh-qf-btn.is-active {
    background: var(--wc-primary-50); border-color: var(--wc-primary); color: var(--wc-primary-d);
}
.veh-qf-badge {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px;
    background: var(--wc-primary); color: #fff; font-size: 11px; font-weight: 700;
}
.veh-qf-badge .fa-check { font-size: 9px; }

/* פאנל קופץ של כפיל */
.veh-qf-pop {
    position: absolute; top: calc(100% + 6px); right: 0; z-index: 40;
    width: 280px; max-width: 86vw; padding: 14px;
    background: #fff; border: 1px solid var(--wc-border);
    border-radius: var(--wc-radius); box-shadow: var(--wc-shadow-h);
}
.veh-qf-pop .wc-chips { max-height: 230px; overflow-y: auto; }

@media (max-width: 575.98px) {
    .veh-qf-pop { position: fixed; top: auto; bottom: 0; right: 0; left: 0; width: auto; max-width: none;
        border-radius: var(--wc-radius-lg) var(--wc-radius-lg) 0 0; }
}
.region-card-name { font-weight: 700; font-size: 1.02rem; }
.region-card-count { font-size: .85rem; color: var(--wc-muted); margin-top: 2px; }
.region-card-arrow { color: var(--wc-muted-2); font-size: 13px; transition: transform .15s ease; }
.region-card:hover .region-card-arrow { transform: translateX(-4px); color: var(--wc-primary-d); }

.region-empty { text-align: center; padding: 48px 16px; color: var(--wc-muted); }
.region-empty i { font-size: 40px; color: var(--wc-muted-2); margin-bottom: 12px; display: block; }
.region-empty p { margin-bottom: 16px; }

.region-links { margin-top: 40px; padding-top: 26px; border-top: 1px solid var(--wc-border); }
.region-links h2 { font-size: 1.2rem; font-weight: 800; margin-bottom: 16px; letter-spacing: -.01em; }
.region-links-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.region-links-grid a {
    display: flex; align-items: center; gap: 11px;
    padding: 12px 14px;
    background: #fff;
    border: 1px solid var(--wc-border);
    border-radius: 12px;
    color: var(--wc-text-2);
    text-decoration: none;
    font-size: .96rem; font-weight: 600;
    box-shadow: 0 1px 2px rgba(15,23,42,.04);
    transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease, color .14s ease;
}
.region-links-grid a > i {
    flex-shrink: 0;
    width: 32px; height: 32px;
    display: flex; align-items: center; justify-content: center;
    background: var(--wc-primary-50);
    color: var(--wc-primary-d);
    border-radius: 9px;
    font-size: 14px;
    transition: background-color .14s ease, color .14s ease;
}
.region-links-grid .rl-name { min-width: 0; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.region-links-grid .rl-count {
    flex-shrink: 0;
    background: var(--wc-primary-50);
    color: var(--wc-primary-d);
    font-size: .78rem; font-weight: 800;
    padding: 3px 10px; border-radius: 999px;
}
.region-links-grid a:hover {
    transform: translateY(-2px);
    border-color: var(--wc-primary);
    box-shadow: 0 10px 24px rgba(15,23,42,.09);
    color: var(--wc-primary-d);
}
.region-links-grid a:hover > i { background: var(--wc-primary); color: #fff; }

/* ===== שאלות נפוצות (FAQ) - עמוד הבית ===== */
.faq-section { max-width: 820px; }
.faq-title {
    font-weight: 800;
    font-size: clamp(1.4rem, 3vw, 1.9rem);
    text-align: center;
    margin-bottom: 22px;
    letter-spacing: -.01em;
    color: var(--wc-text);
}
.faq-list { display: flex; flex-direction: column; gap: 12px; }
.faq-item {
    background: #fff;
    border: 1px solid var(--wc-border);
    border-radius: 14px;
    padding: 0 18px;
    box-shadow: 0 1px 2px rgba(15,23,42,.04);
    transition: border-color .15s ease, box-shadow .15s ease;
}
.faq-item[open] { border-color: var(--wc-primary); box-shadow: 0 8px 22px rgba(15,23,42,.07); }
.faq-q {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 0;
    font-weight: 700;
    font-size: 1.04rem;
    color: var(--wc-text);
    cursor: pointer;
    list-style: none;
}
.faq-q::-webkit-details-marker { display: none; }   /* הסתרת החץ המובנה של details */
.faq-chevron {
    flex-shrink: 0;
    font-size: 13px;
    color: var(--wc-primary);
    transition: transform .2s ease;
}
.faq-item[open] .faq-chevron { transform: rotate(180deg); }
.faq-a {
    padding: 0 0 18px;
    color: var(--wc-muted);
    line-height: 1.7;
    font-size: .98rem;
}

/* ===== הגדרות התראות: טבלת ההעדפות הופכת לכרטיסים מוערמים במובייל ===== */
@media (max-width: 767.98px) {
    .prefs-table thead { display: none; }
    .prefs-table, .prefs-table tbody { display: block; width: 100%; }
    .prefs-table tr {
        display: block;
        border: 1px solid var(--wc-border);
        border-radius: 12px;
        padding: 12px 14px;
        margin-bottom: 12px;
        background: #fff;
    }
    .prefs-table td { display: block; border: 0 !important; padding: 0; text-align: right; }
    /* שורת סוג ההתראה (כותרת + תיאור) */
    .prefs-table td:first-child { margin-bottom: 4px; }
    /* שורות הטוגלים - תווית בצד אחד, מתג בצד השני */
    .prefs-table td.text-center {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 9px 0 0;
        margin-top: 9px;
        border-top: 1px solid var(--wc-border-2) !important;
    }
    .prefs-table td.text-center::before {
        content: attr(data-label);
        font-weight: 600;
        color: var(--wc-text-2);
    }
    .prefs-table td.text-center .form-check { margin: 0; min-height: 0; }
}

/* ============================================================
   ===========  CATEGORY PAGE - צ'יפים וניקיון  =============
   ============================================================ */
/* צ'יפי תת-קטגוריה - ניטרליים ונקיים (במקום מסגרות כחולות עמוסות) */
.subcat-chips {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.subcat-chip {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 15px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid var(--wc-border);
    color: var(--wc-text-2);
    font-size: 13.5px;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.subcat-chip i { color: var(--wc-muted-2); font-size: 12.5px; transition: color .15s ease; }
.subcat-chip:hover {
    border-color: var(--wc-primary);
    color: var(--wc-primary-d);
    background: var(--wc-primary-50);
}
.subcat-chip:hover i { color: var(--wc-primary-d); }
/* מובייל: שורה אחת נגללת בעדינות במקום עשרות צ'יפים שנשברים */
@media (max-width: 767.98px) {
    .subcat-chips {
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
        margin-inline: -16px;
        padding-inline: 16px;
        padding-bottom: 2px;
    }
    .subcat-chips::-webkit-scrollbar { display: none; }
}

/* פירורי לחם - עדינים ונקיים */
.breadcrumb { margin-bottom: 0; font-size: 13px; }
.breadcrumb-item a { color: var(--wc-muted); text-decoration: none; }
.breadcrumb-item a:hover { color: var(--wc-primary-d); }
.breadcrumb-item.active { color: var(--wc-text-2); font-weight: 500; }

/* כפתור "סינון" במובייל + בורר המיון - ניטרליים ומלוטשים */
#toggleFilters.btn-outline-primary {
    border-color: var(--wc-border);
    color: var(--wc-text-2);
    background: #fff;
    border-radius: 999px;
    font-weight: 500;
}
#toggleFilters.btn-outline-primary:hover {
    border-color: var(--wc-primary);
    color: var(--wc-primary-d);
    background: var(--wc-primary-50);
}
#toggleFilters > .fa-sliders {
    margin-inline-end: 6px;
}
.d-flex > form[data-clean-empty] .form-select-sm {
    border-radius: 999px;
    font-weight: 500;
    padding-block: .4rem;
}

/* ============================================================
   ===========  LOGIN / AUTH - עיצוב נקי ואלגנטי  ============
   סטיילינג בלבד - לוגיקת ה-auth לא נגעה.
   ============================================================ */
/* חלק - בלי מסגרת כרטיס: רקע לבן רציף, הטופס יושב ישירות עליו */
body.page-login,
body.page-register { background: #fff; }
.page-login .card.login-card,
.page-register .card.login-card {
    border: 0;
    border-radius: 0;
    padding: 0;
    background: transparent;
    box-shadow: none;
}
.login-title {
    font-size: 1.7rem;
    font-weight: 800;
    letter-spacing: -.02em;
    margin: 16px 0 6px;
    color: var(--wc-text);
}
.login-sub {
    color: var(--wc-muted);
    font-size: .98rem;
    line-height: 1.6;
    margin: 0;
}
.page-login .form-label,
.page-register .form-label {
    font-weight: 600;
    color: var(--wc-text-2);
    margin-bottom: .4rem;
}
.page-login .form-control-lg,
.page-register .form-control-lg {
    border-radius: 14px;
    padding: .9rem 1rem;
    font-size: 1rem;
    background: #f6f8fb;
    border: 1px solid var(--wc-border);
}
.page-login .form-control-lg:focus,
.page-register .form-control-lg:focus {
    background: #fff;
    border-color: var(--wc-primary);
    box-shadow: 0 0 0 4px rgba(0,145,209,.12);
}
/* כפתור ראשי גדול ומלא - radius מרובע מעוגל (לא pill) בסגנון מודרני */
.page-login .btn-lg.rounded-pill,
.page-register .btn-lg.rounded-pill {
    border-radius: 14px !important;
    padding: .9rem 1rem;
    font-weight: 700;
    font-size: 1.02rem;
}

/* ============================================================
   ====  LISTING PAGE - תוכן לבן + קופסת איש קשר אפורה  ====
   היפוך ההיררכיה: אזור המודעה לבן נקי, וקופסת איש הקשר
   (כרטיס המוכר / סרגל ה-CTA) באפור פרימיום שמובלט ומבודל.
   ============================================================ */
body.page-listing { background: #fff; }

/* כרטיסי התוכן (גלריה / פרטים / תיאור) - לבן נקי, בלי מסגרת, צל רך בלבד */
.page-listing .col-lg-8 > .card {
    background: #fff;
    border: 0;
    box-shadow: 0 6px 24px rgba(15,23,42,.05);
}

/* ===== כרטיס איש הקשר - לבן ובלי מסגרת, צל רך בלבד ===== */
.page-listing .seller-card {
    background: #fff;
    border: 0;
    border-radius: 18px;
    box-shadow: 0 10px 30px rgba(15,23,42,.07);
}
.page-listing .seller-divider { border-color: var(--wc-border-2); opacity: 1; }
/* כפתורי הפעולה - מעוגלים ובולטים */
.page-listing .seller-card .btn-lg {
    border-radius: 13px;
    font-weight: 700;
    padding: .8rem 1rem;
}
.page-listing .seller-card .btn-success {
    color: #fff !important;
    box-shadow: 0 8px 20px rgba(22,163,74,.28);
}
.page-listing .seller-card .btn-success:hover,
.page-listing .seller-card .btn-success:focus,
.page-listing .seller-card .btn-success:active,
.page-listing .seller-card .btn-success:visited,
.page-listing .seller-card .btn-success i,
.page-listing .seller-card .btn-success span {
    color: #fff !important;
}
.page-listing .seller-card .btn-primary {
    border-radius: 13px;
    font-weight: 600;
}
.page-listing .seller-card .fav-btn {
    border-radius: 13px;
}

/* ===== סרגל CTA דביק (מובייל) - גוון אפור עדין = "אזור איש קשר" ===== */
@media (max-width: 991.98px) {
    .listing-sticky-cta {
        background: rgba(243,246,250,.98);
        -webkit-backdrop-filter: blur(12px);
        backdrop-filter: blur(12px);
    }
    .listing-sticky-cta .lsc-seller { border-bottom-color: #dfe5ee; }
}

/* ============================================================
   ===========  PAGINATION - עימוד פרימיום (פלטת התכלת)  =====
   ============================================================ */
.wc-pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 0;
    margin-block: 28px;
}
.wc-pagination .page-item { margin: 0; }
.wc-pagination .page-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    border: 1px solid var(--wc-border);
    border-radius: 11px;
    background: #fff;
    color: var(--wc-text-2);
    font-size: 14px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    box-shadow: 0 1px 2px rgba(15,23,42,.04);
    transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease, color .14s ease, background-color .14s ease;
}
.wc-pagination .page-link:hover {
    border-color: var(--wc-primary);
    color: var(--wc-primary-d);
    background: var(--wc-primary-50);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0,145,209,.14);
}
.wc-pagination .page-link:focus {
    outline: none;
    box-shadow: 0 0 0 4px rgba(0,145,209,.16);
    border-color: var(--wc-primary);
}
.wc-pagination .page-item.active .page-link {
    background: linear-gradient(135deg, var(--wc-primary-l) 0%, var(--wc-primary) 60%, var(--wc-primary-d) 100%);
    border-color: var(--wc-primary);
    color: #fff;
    box-shadow: 0 8px 20px rgba(0,145,209,.30);
    transform: none;
}
.wc-pagination .page-item.disabled .page-link {
    background: #fff;
    color: var(--wc-muted-2);
    border-color: var(--wc-border-2);
    opacity: .65;
    box-shadow: none;
    transform: none;
    cursor: default;
}
/* "…" - ללא מסגרת/רקע, רק מפריד עדין */
.wc-pagination .wc-page-gap .page-link {
    border-color: transparent;
    background: transparent;
    box-shadow: none;
    min-width: 24px;
    padding: 0 2px;
    color: var(--wc-muted-2);
}
.wc-pagination .page-link i { font-size: 12px; }

@media (max-width: 575.98px) {
    .wc-pagination { gap: 5px; }
    .wc-pagination .page-link { min-width: 36px; height: 36px; padding: 0 9px; font-size: 13.5px; }
}

/* ============================================================
   MOBILE APP SHELL
   מעטפת מובייל אחידה: סרגל עליון קומפקטי, תוכן ממוקד וניווט
   תחתון קבוע. כללי הדסקטופ נשארים ללא שינוי.
   ============================================================ */
.mobile-app-nav { display: none; }

@media (max-width: 991.98px) {
    :root { --wc-mobile-nav-h: 68px; }

    html,
    body {
        width: 100%;
        max-width: 100%;
        overflow-x: clip;
    }

    body {
        background: #f4f7f9;
        padding-bottom: calc(var(--wc-mobile-nav-h) + env(safe-area-inset-bottom));
    }
    body.page-messages,
    body.page-blocked-users,
    body.page-create-listing,
    body.page-login,
    body.page-register,
    body.offline-page {
        padding-bottom: 0;
    }

    .site-footer { display: none; }

    /* App bar */
    .navbar.bg-primary {
        height: calc(58px + env(safe-area-inset-top));
        min-height: calc(58px + env(safe-area-inset-top));
        padding-top: env(safe-area-inset-top);
        border-bottom: 1px solid #e5edf1;
        background: rgba(255,255,255,.96) !important;
        box-shadow: 0 1px 10px rgba(15,23,42,.06) !important;
        -webkit-backdrop-filter: blur(14px);
        backdrop-filter: blur(14px);
    }
    .navbar.bg-primary > .container {
        min-height: 58px;
        padding-inline: 12px;
    }
    .navbar .site-logo { height: 49px; }
    .navbar > .container:has(.nav-auth-mobile) > .navbar-brand {
        position: absolute;
        left: 50%;
        top: calc(50% + (env(safe-area-inset-top) / 2));
        transform: translate(-50%, -50%);
        margin: 0;
    }
    .nav-auth-mobile { margin-inline-start: auto; }
    .nav-auth-link {
        width: 40px;
        height: 40px;
        padding: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 0;
        border-radius: 12px;
        background: #f1f5f7;
        color: #314a58;
        font-size: 17px;
    }
    .nav-auth-link span { display: none; }
    .nav-auth-link:hover,
    .nav-auth-link:focus { background: #e7f5fb; color: var(--wc-primary-d); }

    .navbar-dark .navbar-toggler,
    .nav-chat-btn {
        width: 40px;
        height: 40px;
        border: 0;
        border-radius: 12px;
        background: #f1f5f7;
        box-shadow: none;
    }
    .navbar.bg-primary .navbar-collapse {
        top: 100%;
        max-height: calc(100dvh - 58px - env(safe-area-inset-top));
        border-radius: 0 0 20px 20px;
        box-shadow: 0 18px 36px rgba(15,23,42,.14);
    }

    /* פס הקטגוריות שייך למסך הבית בלבד ואינו נצמד בזמן גלילה */
    body:not(.page-home) .mobile-cats-strip { display: none !important; }
    body.page-home .mobile-cats-strip {
        position: relative;
        top: auto;
        height: 82px;
        min-height: 82px;
        padding: 8px 10px 7px;
        gap: 3px;
        background: #fff;
        border-bottom: 1px solid #e6edf1;
        transform: none !important;
        pointer-events: auto !important;
        z-index: 2;
    }
    body.page-home .mobile-cat-circle { width: 58px; gap: 4px; }
    body.page-home .mobile-cat-circle .mcc-img {
        width: 45px;
        height: 45px;
        border-radius: 14px;
        border: 1px solid #e1e9ed;
        box-shadow: 0 3px 8px rgba(15,23,42,.06);
    }
    body.page-home .mobile-cat-circle .mcc-img i { font-size: 20px; }
    body.page-home .mobile-cat-circle .mcc-label {
        max-width: 58px;
        color: #536975;
        font-size: 9.5px;
        font-weight: 650;
        line-height: 1.1;
        -webkit-line-clamp: 1;
    }

    /* חיפוש גלובלי במסכים פנימיים */
    .mobile-search-bar {
        padding: 10px 12px;
        background: #f4f7f9;
    }
    .nav-search-mobile {
        min-height: 48px;
        padding: 4px 5px 4px 13px;
        border: 0;
        border-radius: 14px;
        background: #fff;
        box-shadow: 0 1px 2px rgba(15,23,42,.05), 0 6px 18px rgba(15,23,42,.04);
    }
    .nav-search-mobile .nav-search-btn {
        width: 40px;
        min-width: 40px;
        height: 40px;
        padding: 0;
        border-radius: 11px;
        box-shadow: none;
    }

    /* מסך הבית: החיפוש הוא הפעולה הראשית, בלי Hero שיווקי גדול */
    body.page-home .hero {
        background: #fff;
        border-bottom: 1px solid #e3ebef;
    }
    body.page-home .hero > .container { padding: 0 14px; }
    body.page-home .hero-inner {
        align-items: stretch;
        padding: 20px 0 24px;
        text-align: start;
    }
    body.page-home .hero .hero-title {
        margin: 0 0 7px;
        font-size: 18px;
        line-height: 1.45;
        text-align: start;
    }
    body.page-home .hero .hero-sub {
        max-width: none;
        margin: 0 0 17px;
        font-size: 13.5px;
        line-height: 1.65;
        text-align: start;
    }
    body.page-home .hs-bar {
        min-height: 52px;
        padding: 4px 14px 4px 5px;
        border: 1px solid #dfe8ed;
        border-radius: 15px;
        box-shadow: 0 5px 16px rgba(15,23,42,.06);
    }
    body.page-home .hs-input { padding: 9px 3px; font-size: 14px; }
    body.page-home .hs-btn {
        width: 42px;
        height: 42px;
        border-radius: 12px;
        box-shadow: none;
        font-size: 14px;
    }
    body.page-home .hero-suggests {
        width: calc(100% + 28px);
        margin: 15px -14px 0;
        padding: 0 14px 2px;
        flex-wrap: nowrap;
        justify-content: flex-start;
        gap: 7px;
        overflow-x: auto;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }
    body.page-home .hero-suggests::-webkit-scrollbar { display: none; }
    body.page-home .hero-suggests-label { display: none; }
    body.page-home .hero-suggest {
        flex: 0 0 auto;
        gap: 5px;
        padding: 7px 11px;
        border-radius: 999px;
        background: #f0f5f7;
        color: #455d6a;
        font-size: 12px;
        font-weight: 650;
    }
    body.page-home .hero-suggest i { font-size: 9px; }

    /* תוכן וכרטיסי מודעות - משטחי אפליקציה ומטרות מגע ברורות */
    main { min-width: 0; }
    main > .container { --bs-gutter-x: 1.5rem; }
    .listing-card.is-list {
        border: 1px solid #edf1f3;
        border-radius: 16px;
        background: #fff;
        box-shadow: 0 3px 12px rgba(15,23,42,.045);
    }
    .listing-card.is-list:active { transform: scale(.992); }
    .listing-card .fav-btn { width: 36px; height: 36px; font-size: 14px; }
    .subcat-chips { padding-bottom: 5px; }
    #toggleFilters.btn-outline-primary,
    .d-flex > form[data-clean-empty] .form-select-sm {
        min-height: 42px;
        border-radius: 12px;
    }

    /* ניווט תחתון כמו באפליקציה */
    .mobile-app-nav {
        position: fixed;
        inset-inline: 0;
        bottom: 0;
        z-index: 1070;
        height: calc(var(--wc-mobile-nav-h) + env(safe-area-inset-bottom));
        padding: 7px 8px env(safe-area-inset-bottom);
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        align-items: end;
        background: rgba(255,255,255,.97);
        border-top: 1px solid #dfe7eb;
        box-shadow: 0 -7px 24px rgba(15,23,42,.09);
        -webkit-backdrop-filter: blur(16px);
        backdrop-filter: blur(16px);
    }
    .mobile-app-nav > a {
        position: relative;
        min-width: 0;
        min-height: 51px;
        padding: 5px 2px 3px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4px;
        border-radius: 12px;
        color: #748691;
        text-decoration: none;
        font-size: 10.5px;
        font-weight: 650;
        -webkit-tap-highlight-color: transparent;
    }
    .mobile-app-nav > a > i { font-size: 19px; }
    .mobile-app-nav > a.is-active { color: var(--wc-primary-d, #0073a8); }
    .mobile-app-nav > a.is-active:not(.mobile-app-nav-post)::before {
        content: "";
        position: absolute;
        top: -7px;
        width: 24px;
        height: 3px;
        border-radius: 0 0 3px 3px;
        background: var(--wc-primary, #0091d1);
    }
    .mobile-app-nav-post { margin-top: -25px; color: #4f6571 !important; }
    .mobile-app-nav-plus {
        width: 51px;
        height: 51px;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 5px solid #fff;
        border-radius: 18px;
        background: var(--wc-primary, #0091d1);
        color: #fff;
        box-shadow: 0 8px 19px rgba(0,145,209,.28);
        font-size: 19px;
    }
    .mobile-app-nav-post.is-active .mobile-app-nav-plus { background: var(--wc-primary-d, #0073a8); }
    .mobile-app-nav-badged .badge {
        position: absolute;
        top: 1px;
        inset-inline-start: calc(50% - 21px);
        min-width: 17px;
        height: 17px;
        padding: 2px 5px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 2px solid #fff;
        font-size: 8px;
        line-height: 1;
    }

    /* במסכים עם פעולה תחתונה ייעודית לא מציגים שני סרגלים */
    body.page-listing:has(.listing-sticky-cta) .mobile-app-nav,
    body.page-messages .mobile-app-nav,
    body.page-blocked-users .mobile-app-nav,
    body.page-create-listing .mobile-app-nav,
    body.page-login .mobile-app-nav,
    body.page-register .mobile-app-nav,
    body.offline-page .mobile-app-nav {
        display: none !important;
    }

    /* שכבות צפות יושבות מעל הניווט התחתון ולא עליו */
    .cookie-banner {
        bottom: calc(var(--wc-mobile-nav-h) + 9px + env(safe-area-inset-bottom));
    }
    #wc-install-prompt {
        bottom: calc(var(--wc-mobile-nav-h) + 12px + env(safe-area-inset-bottom)) !important;
    }
    body.page-listing:has(.listing-sticky-cta) .cookie-banner { bottom: 132px; }
    body.page-messages .cookie-banner,
    body.page-blocked-users .cookie-banner,
    body.page-create-listing .cookie-banner,
    body.page-login .cookie-banner,
    body.page-register .cookie-banner { bottom: 12px; }
}

@media (max-width: 575.98px) {
    .cookie-banner {
        inset-inline: 9px;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 8px 10px;
        padding: 12px 13px;
        border-radius: 16px;
        box-shadow: 0 18px 48px rgba(15,23,42,.25);
    }
    .cookie-banner .cb-icon { display: none; }
    .cookie-banner .cb-body { min-width: 0; }
    .cookie-banner .cb-title { margin-bottom: 2px; font-size: 13.5px; }
    .cookie-banner .cb-text { font-size: 11.5px; line-height: 1.45; }
    .cookie-banner .cb-actions {
        width: auto;
        padding: 0;
        border: 0;
    }
    .cookie-banner .cb-accept {
        min-width: 76px;
        min-height: 40px;
        padding: 8px 12px;
        border-radius: 12px;
        font-size: 12px;
        box-shadow: none;
    }
}

@media (display-mode: standalone) and (max-width: 991.98px) {
    .navbar.bg-primary {
        box-shadow: 0 1px 5px rgba(15,23,42,.05) !important;
    }
    .mobile-app-nav { background: rgba(255,255,255,.99); }
}

@media (max-width: 991.98px) {
    html.wc-android-app {
        --wc-android-safe-top: 0px;
        --wc-android-appbar-content-h: 88px;
        --wc-android-appbar-h: var(--wc-android-appbar-content-h);
    }

    html.wc-android-app .navbar.bg-primary.wc-desktop-header {
        height: var(--wc-android-appbar-h);
        min-height: var(--wc-android-appbar-h);
        padding-top: var(--wc-android-safe-top);
    }

    html.wc-android-app .navbar.bg-primary.wc-desktop-header > .container {
        min-height: var(--wc-android-appbar-content-h);
        height: var(--wc-android-appbar-content-h);
        padding-inline: 14px;
        display: grid;
        grid-template-columns: minmax(88px, 1fr) auto minmax(88px, 1fr);
        grid-template-rows: var(--wc-android-appbar-content-h);
        align-items: center;
        gap: 8px;
        direction: ltr;
    }

    html.wc-android-app .navbar.bg-primary.wc-desktop-header > .container > .navbar-brand,
    html.wc-android-app .navbar.bg-primary.wc-desktop-header > .container:has(.nav-auth-mobile) > .navbar-brand {
        position: static;
        grid-column: 2;
        grid-row: 1;
        align-self: center;
        justify-self: center;
        margin: 0;
        padding: 0;
        transform: none;
    }

    html.wc-android-app .wc-desktop-header .site-logo {
        height: 49px;
    }

    html.wc-android-app .wc-desktop-header .navbar-toggler {
        grid-column: 3;
        grid-row: 1;
        align-self: center;
        justify-self: end;
        margin: 0;
    }

    html.wc-android-app .wc-desktop-header .nav-actions {
        grid-column: 1;
        grid-row: 1;
        align-self: center;
        justify-self: start;
        margin: 0;
        display: inline-flex;
        gap: 8px;
        direction: rtl;
    }

    html.wc-android-app .wc-desktop-header .nav-chat-btn,
    html.wc-android-app .wc-desktop-header .nav-auth-link,
    html.wc-android-app .wc-desktop-header .navbar-toggler {
        width: 44px;
        height: 44px;
        border-radius: 13px;
    }

    html.wc-android-app .wc-desktop-header .navbar-collapse {
        grid-column: 1 / -1;
        direction: rtl;
        top: 100%;
        max-height: calc(100dvh - var(--wc-android-appbar-h) - var(--wc-mobile-menu-bottom-reserve, 0px));
    }

    html.wc-android-app body.page-home .mobile-cats-strip {
        height: 82px;
        min-height: 82px;
        padding-top: 8px;
        padding-bottom: 7px;
        align-items: center;
    }
}

/* ===== Mobile menu: keep the final actions above the device edge ===== */
@media (max-width: 991.98px) {
    body {
        --wc-mobile-menu-bottom-reserve: calc(var(--wc-mobile-nav-h) + env(safe-area-inset-bottom));
    }

    body.page-listing:has(.listing-sticky-cta),
    body.page-messages,
    body.page-blocked-users,
    body.page-create-listing,
    body.page-login,
    body.page-register,
    body.offline-page {
        --wc-mobile-menu-bottom-reserve: 0px;
    }

    .navbar.bg-primary .navbar-collapse {
        z-index: 1085;
        max-height: calc(100vh - 58px - var(--wc-mobile-menu-bottom-reserve));
        max-height: calc(100dvh - 58px - env(safe-area-inset-top) - var(--wc-mobile-menu-bottom-reserve));
        padding-bottom: calc(18px + env(safe-area-inset-bottom));
    }
}

/* ===== Create listing: dedicated mobile app flow ===== */
.create-mobile-appbar { display: none; }

@media (max-width: 767.98px) {
    body.page-create-listing {
        min-height: 100dvh;
        padding-bottom: calc(88px + env(safe-area-inset-bottom));
        background: #f4f7f9;
    }
    body.page-create-listing > .navbar {
        display: none !important;
    }
    .create-mobile-appbar {
        position: sticky;
        top: 0;
        z-index: 1060;
        min-height: calc(62px + env(safe-area-inset-top));
        padding: calc(7px + env(safe-area-inset-top)) 12px 7px;
        display: grid;
        grid-template-columns: 42px minmax(0, 1fr) auto;
        align-items: center;
        gap: 10px;
        background: rgba(255,255,255,.97);
        border-bottom: 1px solid #e1e9ed;
        box-shadow: 0 2px 12px rgba(15,23,42,.055);
        -webkit-backdrop-filter: blur(16px);
        backdrop-filter: blur(16px);
    }
    .create-mobile-back {
        width: 42px;
        height: 42px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 1px solid #e3eaee;
        border-radius: 13px;
        background: #f7f9fa;
        color: #314a58;
        text-decoration: none;
        font-size: 17px;
    }
    .create-mobile-back:active { transform: scale(.96); }
    .create-mobile-title {
        min-width: 0;
        display: flex;
        flex-direction: column;
        line-height: 1.2;
    }
    .create-mobile-title strong {
        color: #162f3c;
        font-size: 16px;
        font-weight: 800;
        letter-spacing: -.01em;
    }
    .create-mobile-title span {
        margin-top: 3px;
        overflow: hidden;
        color: #71838c;
        font-size: 10.5px;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
    .create-mobile-free {
        min-height: 32px;
        padding: 6px 9px;
        display: inline-flex;
        align-items: center;
        gap: 5px;
        border-radius: 10px;
        background: #eaf8ef;
        color: #16763b;
        font-size: 11px;
        font-weight: 750;
        white-space: nowrap;
    }

    .page-create-listing .create-listing-shell {
        max-width: none;
        padding: 0 !important;
    }
    .page-create-listing .create-listing-shell > .row {
        --bs-gutter-x: 0;
        margin: 0;
    }
    .page-create-listing .create-listing-shell .col-lg-10 { padding: 0; }
    .page-create-listing .wizard-card {
        width: 100%;
        border: 0;
        border-radius: 0;
        background: #fff;
        box-shadow: none;
        overflow: visible;
    }
    .page-create-listing .wizard-head { display: none; }
    .page-create-listing .wizard-progress-mobile {
        position: sticky;
        top: calc(62px + env(safe-area-inset-top));
        z-index: 1050;
        padding: 9px 16px 11px;
        background: rgba(255,255,255,.97);
        border-bottom: 1px solid #e9eef1;
        box-shadow: 0 3px 10px rgba(15,23,42,.035);
        -webkit-backdrop-filter: blur(14px);
        backdrop-filter: blur(14px);
    }
    .page-create-listing .wizard-progress-mobile .wpm-row {
        margin-bottom: 7px;
        font-size: 11.5px;
    }
    .page-create-listing .wizard-progress-mobile .wpm-step {
        color: #536a76;
        font-weight: 650;
    }
    .page-create-listing .wizard-progress-mobile .wpm-name {
        color: var(--wc-primary-d, #0073a8);
        font-size: 12.5px;
        font-weight: 800;
    }
    .page-create-listing .wizard-progress-mobile .wpm-bar {
        height: 5px;
        background: #e7edf0;
    }
    .page-create-listing .wizard-progress-mobile .wpm-fill {
        background: linear-gradient(90deg, #00a4df, #007db5);
    }

    .page-create-listing .wizard-body {
        padding: 20px 15px calc(112px + env(safe-area-inset-bottom));
        background: #fff;
    }
    .page-create-listing .step-header {
        margin-bottom: 20px;
        padding: 0;
        text-align: start;
        border: 0;
    }
    .page-create-listing .step-header h2 {
        margin-bottom: 5px !important;
        color: #17303d;
        font-size: 21px;
        line-height: 1.35;
        letter-spacing: -.02em;
    }
    .page-create-listing .step-header p {
        color: #72838c;
        font-size: 13px;
        line-height: 1.55;
    }

    .page-create-listing .cat-quick {
        width: calc(100% + 30px);
        margin: 0 -15px 16px;
        padding: 0 15px 3px;
        flex-wrap: nowrap;
        gap: 7px;
        overflow-x: auto;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }
    .page-create-listing .cat-quick::-webkit-scrollbar { display: none; }
    .page-create-listing .cat-quick-label { display: none; }
    .page-create-listing .cat-quick-pill {
        min-height: 37px;
        padding: 7px 12px;
        flex: 0 0 auto;
        border-color: #e1e8ec;
        background: #f5f8f9;
        font-size: 12px;
    }
    .page-create-listing .cat-grid,
    .page-create-listing .cat-grid-super {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }
    .page-create-listing .cat-card,
    .page-create-listing .cat-card-super {
        min-height: 112px;
        padding: 13px 9px 12px;
        gap: 8px;
        border: 1px solid #e5ecef;
        border-radius: 17px;
        background: #fff;
        box-shadow: 0 3px 12px rgba(15,23,42,.055);
    }
    .page-create-listing .cat-card:active {
        border-color: #8fd3ef;
        background: #f3fbfe;
        box-shadow: 0 2px 8px rgba(0,145,209,.12);
        transform: scale(.98);
    }
    .page-create-listing .cat-card-ico,
    .page-create-listing .cat-card-ico--img {
        width: 53px;
        height: 53px;
        border-radius: 15px;
        font-size: 22px;
    }
    .page-create-listing .cat-card-body { gap: 2px; }
    .page-create-listing .cat-card-name,
    .page-create-listing .cat-card-super .cat-card-name {
        font-size: 13.5px;
        line-height: 1.25;
    }
    .page-create-listing .cat-card-sub {
        max-width: 100%;
        overflow: hidden;
        font-size: 10px;
        line-height: 1.25;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
    .page-create-listing .cat-sub-title {
        margin-bottom: 13px;
        text-align: start;
        font-size: 16px;
    }
    .page-create-listing .cat-selected {
        padding: 12px 13px;
        border-color: #bde4f5;
        border-radius: 14px;
        background: #f0faff;
    }

    .page-create-listing .wizard-body .form-label.fw-semibold {
        margin-bottom: 7px;
        color: #263f4b;
        font-size: 14px;
        font-weight: 700;
    }
    .page-create-listing .wizard-body .form-control,
    .page-create-listing .wizard-body .form-select,
    .page-create-listing .wizard-body .form-control-lg,
    .page-create-listing .wizard-body .form-select-lg {
        min-height: 52px;
        padding: 12px 13px;
        border: 1px solid #dfe7eb;
        border-radius: 14px;
        background-color: #f8fafb;
        font-size: 16px;
        box-shadow: none;
    }
    .page-create-listing .wizard-body textarea.form-control {
        min-height: 126px;
        line-height: 1.55;
    }
    .page-create-listing .wizard-body .form-control:focus,
    .page-create-listing .wizard-body .form-select:focus {
        border-color: #61bfe5;
        background: #fff;
        box-shadow: 0 0 0 3px rgba(0,145,209,.11);
    }
    .page-create-listing .wizard-body .form-text {
        margin-top: 6px;
        color: #7c8c94;
        font-size: 11.5px;
        line-height: 1.45;
    }
    .page-create-listing .dropzone {
        min-height: 142px;
        padding: 24px 14px;
        border: 1.5px dashed #9dcfe3;
        border-radius: 17px;
        background: #f5fbfe;
        color: #25677f;
    }
    .page-create-listing .dropzone > i {
        width: 48px;
        height: 48px;
        margin-bottom: 9px !important;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 15px;
        background: #dff3fb;
        color: var(--wc-primary-d, #0073a8);
        font-size: 21px;
    }
    .page-create-listing .price-type-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 9px;
    }
    .page-create-listing .price-type-pill {
        min-height: 54px;
        padding: 11px 8px;
        gap: 7px;
        border-width: 1px;
        border-radius: 14px;
        font-size: 13px;
    }
    .page-create-listing .price-type-pill i { font-size: 15px; }
    .page-create-listing .price-presets {
        flex-wrap: nowrap;
        margin-inline: -15px;
        padding-inline: 15px;
        overflow-x: auto;
        scrollbar-width: none;
    }
    .page-create-listing .price-presets::-webkit-scrollbar { display: none; }
    .page-create-listing .price-preset {
        min-height: 36px;
        flex: 0 0 auto;
        padding: 7px 12px;
    }
    .page-create-listing .step-tip,
    .page-create-listing .review-card,
    .page-create-listing .alert {
        border-radius: 15px;
    }
    .page-create-listing .review-card {
        padding: 16px;
        background: #f5fbfe;
    }

    .page-create-listing .wizard-body [data-step] > .d-flex:last-child,
    .page-create-listing .wizard-body #catStepRest > .d-flex:last-child {
        position: fixed;
        inset-inline: 0;
        bottom: 0;
        z-index: 1075;
        min-height: calc(76px + env(safe-area-inset-bottom));
        margin: 0 !important;
        padding: 11px 14px calc(11px + env(safe-area-inset-bottom));
        display: grid !important;
        grid-template-columns: minmax(92px, .62fr) minmax(0, 1.38fr);
        align-items: center;
        gap: 9px;
        border-top: 1px solid #dfe7eb;
        background: rgba(255,255,255,.97);
        box-shadow: 0 -8px 24px rgba(15,23,42,.09);
        -webkit-backdrop-filter: blur(16px);
        backdrop-filter: blur(16px);
    }
    .page-create-listing .wizard-body #catStepRest > .d-flex:last-child {
        grid-template-columns: 1fr;
    }
    .page-create-listing .wizard-body [data-step] > .d-flex:last-child .btn,
    .page-create-listing .wizard-body #catStepRest > .d-flex:last-child .btn {
        width: 100%;
        min-width: 0;
        min-height: 52px;
        padding: 10px 13px;
        border-radius: 14px;
        font-size: 15px;
        font-weight: 750;
        box-shadow: none;
    }
    .page-create-listing .wizard-body [data-step] > .d-flex:last-child .btn-primary,
    .page-create-listing .wizard-body #catStepRest > .d-flex:last-child .btn-primary {
        border-color: var(--wc-primary, #0091d1);
        background: linear-gradient(135deg, #009fe0, #007eb7);
        box-shadow: 0 7px 17px rgba(0,145,209,.22);
    }
    .page-create-listing .wizard-body [data-step] > .d-flex:last-child .btn-success,
    .page-create-listing .wizard-body #catStepRest > .d-flex:last-child .btn-success {
        border-color: #16934b;
        background: linear-gradient(135deg, #20a85b, #148442);
        box-shadow: 0 7px 17px rgba(22,147,75,.22);
    }
    .page-create-listing .wizard-body [data-step] > .d-flex:last-child .btn-outline-secondary,
    .page-create-listing .wizard-body #catStepRest > .d-flex:last-child .btn-outline-secondary {
        border-color: #dde5e9;
        background: #f5f8f9;
        color: #526873;
    }
    .page-create-listing .cookie-banner {
        bottom: calc(84px + env(safe-area-inset-bottom));
    }
}

@media (max-width: 359.98px) {
    .create-mobile-title span { display: none; }
    .page-create-listing .cat-card,
    .page-create-listing .cat-card-super { min-height: 104px; }
}

/* ============================================================
   LISTING DETAIL — product page layout
   ============================================================ */
body.page-listing { background: #f3f6f8; }

.page-listing > main > .container {
    max-width: 1320px;
}
.page-listing > main > .container > nav.small {
    margin-bottom: 15px !important;
    color: #8a9aa3;
    font-size: 12.5px;
}
.page-listing > main > .container > nav.small a {
    color: #617781;
    text-decoration: none;
}
.page-listing > main > .container > nav.small a:hover { color: var(--wc-primary-d); }

.listing-layout {
    display: grid;
    align-items: start;
    gap: 18px;
}
.listing-main,
.listing-sidebar { display: contents; }

.listing-gallery-card,
.listing-summary-card,
.listing-details-card,
.page-listing .seller-card,
.listing-extras > .card {
    margin: 0;
    border: 1px solid #e4eaee;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 8px 28px rgba(15,23,42,.055);
}

.listing-gallery-card {
    padding: 0 !important;
    overflow: hidden;
}
.listing-gallery-card .gallery-main {
    max-height: none;
    aspect-ratio: 10 / 7;
    border: 0;
    border-radius: 0;
    background: #e8edf0;
    box-shadow: none;
}
.listing-gallery-card .gallery-thumbs {
    margin: 0;
    padding: 12px 14px 14px;
    gap: 9px;
    background: #fff;
}
.listing-gallery-card .gallery-thumbs img {
    width: 78px;
    height: 60px;
    flex-basis: 78px;
    border: 2px solid transparent;
    border-radius: 12px;
    background: #eef2f4;
}
.listing-gallery-card .gallery-thumbs img.active {
    border-color: var(--wc-primary);
    box-shadow: 0 0 0 2px rgba(0,145,209,.12);
}

.listing-summary-card {
    padding: 23px;
    overflow: hidden;
}
.listing-summary-kicker {
    margin-bottom: 13px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: #8a9aa3;
    font-size: 11.5px;
}
.listing-summary-kicker a {
    min-width: 0;
    padding: 6px 9px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    overflow: hidden;
    border-radius: 9px;
    background: #eef8fc;
    color: var(--wc-primary-d, #0073a8);
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.listing-summary-kicker a i { font-size: 10px; }
.listing-summary-kicker > span {
    flex: 0 0 auto;
    direction: rtl;
}
.listing-title {
    margin: 0;
    color: #152f3c;
    font-size: clamp(21px, 2vw, 27px);
    font-weight: 820;
    line-height: 1.42;
    letter-spacing: -.025em;
}
.listing-price {
    margin-top: 15px;
    color: var(--wc-primary-d, #0073a8);
    font-size: clamp(28px, 2.3vw, 34px);
    font-weight: 850;
    line-height: 1.1;
    letter-spacing: -.025em;
}
.listing-meta-chips {
    margin-top: 17px;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}
.listing-meta-chips > span {
    min-height: 32px;
    padding: 7px 10px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #e3e9ed;
    border-radius: 10px;
    background: #f8fafb;
    color: #546b76;
    font-size: 12px;
    font-weight: 650;
}
.listing-meta-chips > span i {
    color: #8ba0aa;
    font-size: 11px;
}
.listing-trust-note {
    margin-top: 17px;
    padding: 11px 12px;
    display: flex;
    align-items: flex-start;
    gap: 9px;
    border: 1px solid #d9ece2;
    border-radius: 12px;
    background: #f1faf5;
    color: #38634a;
    font-size: 11.5px;
    line-height: 1.5;
}
.listing-trust-note i {
    margin-top: 2px;
    color: #199055;
    font-size: 13px;
}

.listing-details-card { padding: 25px; }
.listing-section-title {
    margin: 0 0 14px;
    display: flex;
    align-items: center;
    gap: 9px;
    color: #1c3541;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: -.015em;
}
.listing-section-title i {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #e9f6fb;
    color: var(--wc-primary-d, #0073a8);
    font-size: 13px;
}
.listing-details-card .listing-specs {
    margin: 0;
    padding: 0;
}
.listing-details-card .listing-specs-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    border: 0;
}
.listing-details-card .spec-item,
.listing-details-card .spec-item:nth-child(even),
.listing-details-card .spec-item:nth-child(odd) {
    min-height: 66px;
    padding: 10px 11px;
    gap: 9px;
    border: 1px solid #e8edf0;
    border-radius: 13px;
    background: #f8fafb;
}
.listing-details-card .spec-icon {
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: #eaf5f9;
    color: #397c97;
    font-size: 13px;
}
.listing-details-card .spec-label {
    margin-bottom: 3px;
    color: #7b8d96;
    font-size: 10.5px;
}
.listing-details-card .spec-value {
    color: #233e4a;
    font-size: 13.5px;
}
.listing-description-section {
    margin-top: 24px;
    padding-top: 22px;
    border-top: 1px solid #e7ecef;
}
.listing-description-text {
    margin: 0;
    color: #405965;
    font-size: 14.5px;
    line-height: 1.9;
    white-space: pre-line;
    overflow-wrap: anywhere;
}

.listing-extras {
    display: grid;
    gap: 16px;
}
.listing-extras .share-card {
    padding: 17px 18px;
}

.gallery-back-action {
    position: absolute;
    top: 12px;
    inset-inline-start: 12px;
    z-index: 6;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255,255,255,.5);
    border-radius: 13px;
    background: rgba(255,255,255,.94);
    color: #27424f;
    text-decoration: none;
    box-shadow: 0 6px 18px rgba(15,23,42,.2);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}
.gallery-back-action:active { transform: scale(.95); }

@media (min-width: 992px) {
    .listing-layout {
        grid-template-columns: minmax(0, 1.92fr) minmax(330px, .88fr);
        gap: 20px;
    }
    .listing-main {
        grid-column: 1;
        min-width: 0;
        display: grid;
        align-content: start;
        gap: 18px;
    }
    .listing-sidebar {
        grid-column: 2;
        min-width: 0;
        display: grid;
        align-content: start;
        gap: 18px;
    }
    .listing-sidebar .seller-card {
        align-self: start;
    }
    .page-listing .seller-card {
        padding: 20px;
        border: 1px solid #e4eaee;
        border-radius: 20px;
        box-shadow: 0 8px 28px rgba(15,23,42,.055);
    }
}

@media (max-width: 991.98px) {
    html {
        scrollbar-gutter: auto;
        scrollbar-width: none;
    }
    html::-webkit-scrollbar {
        width: 0;
        height: 0;
        display: none;
    }

    body.page-listing {
        padding-bottom: calc(120px + env(safe-area-inset-bottom));
        background: #f3f6f8;
    }
    .page-listing > main > .container {
        width: 100%;
        max-width: none;
        padding: 0 0 18px !important;
    }
    .listing-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }
    .listing-main,
    .listing-sidebar { display: contents; }
    .listing-gallery-card { order: 1; }
    .listing-summary-card { order: 2; }
    .listing-details-card { order: 3; }
    .listing-sidebar .seller-card { order: 4; }
    .listing-extras { order: 5; }

    .listing-gallery-card,
    .listing-summary-card,
    .listing-details-card,
    .listing-extras > .card {
        width: 100%;
        border-inline: 0;
        border-radius: 0;
        box-shadow: none;
    }
    .listing-gallery-card {
        margin: 0;
        background: #dfe6e9;
    }
    .listing-gallery-card .gallery-main {
        max-height: 58vh;
        aspect-ratio: 4 / 3;
    }
    .listing-gallery-card .gallery-thumbs { display: none; }
    .listing-gallery-card .gallery-counter {
        bottom: 12px;
        inset-inline-start: 50%;
        transform: translateX(50%);
        padding: 5px 10px;
        border: 1px solid rgba(255,255,255,.18);
        background: rgba(15,23,42,.68);
        font-size: 11px;
    }
    .listing-gallery-card .gallery-nav {
        width: 36px;
        height: 36px;
        opacity: .9;
        background: rgba(15,23,42,.42);
        font-size: 13px;
    }
    .gallery-floating-actions {
        top: 12px;
        inset-inline-start: auto;
        inset-inline-end: 12px;
        flex-direction: row;
        gap: 8px;
    }
    .gfa-btn,
    .gallery-back-action {
        width: 40px;
        height: 40px;
        border-radius: 13px;
        box-shadow: 0 5px 16px rgba(15,23,42,.18);
    }

    .listing-summary-card {
        padding: 18px 15px 17px;
    }
    .listing-summary-kicker { margin-bottom: 11px; }
    .listing-title {
        font-size: 20px;
        line-height: 1.45;
    }
    .listing-price {
        margin-top: 11px;
        font-size: 28px;
    }
    .listing-meta-chips { margin-top: 14px; }
    .listing-meta-chips > span {
        min-height: 31px;
        padding: 6px 9px;
        font-size: 11.5px;
    }
    .listing-trust-note {
        margin-top: 14px;
        padding: 10px 11px;
    }

    .listing-details-card { padding: 19px 15px 21px; }
    .listing-section-title {
        margin-bottom: 12px;
        font-size: 16px;
    }
    .listing-section-title i {
        width: 30px;
        height: 30px;
        font-size: 12px;
    }
    .listing-details-card .listing-specs-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }
    .listing-details-card .spec-item,
    .listing-details-card .spec-item:nth-child(even),
    .listing-details-card .spec-item:nth-child(odd) {
        min-height: 62px;
        padding: 9px;
        gap: 8px;
        border-radius: 12px;
    }
    .listing-details-card .spec-icon {
        flex-basis: 31px;
        width: 31px;
        height: 31px;
        border-radius: 9px;
        font-size: 12px;
    }
    .listing-details-card .spec-label { font-size: 10px; }
    .listing-details-card .spec-value { font-size: 12.5px; }
    .listing-description-section {
        margin-top: 20px;
        padding-top: 19px;
    }
    .listing-description-text {
        font-size: 14px;
        line-height: 1.85;
    }

    .listing-extras { gap: 10px; }
    .listing-extras .share-card { display: none; }
    .listing-report-mobile { padding: 6px 0 2px; }

    .listing-sticky-cta {
        z-index: 1080;
        inset-inline: auto;
        left: var(--listing-visual-left, 0px);
        width: var(--listing-visual-width, 100%);
        bottom: var(--listing-visual-bottom, 0px);
        background: rgba(255,255,255,.98);
        border-top-color: #dce5e9;
        box-shadow: 0 -8px 26px rgba(15,23,42,.13);
        -webkit-backdrop-filter: blur(16px);
        backdrop-filter: blur(16px);
    }
    .listing-sticky-cta .lsc-seller {
        min-height: 44px;
        padding: 6px 12px;
        border-bottom-color: #e8edf0;
    }
    .listing-sticky-cta .lsc-seller-avatar {
        flex-basis: 32px;
        width: 32px;
        height: 32px;
    }
    .listing-sticky-cta .lsc-seller-name { font-size: 12.5px; }
    .listing-sticky-cta .lsc-seller-meta { font-size: 10.5px; }
    .listing-sticky-cta .lsc-actions {
        gap: 7px;
        padding: 8px 10px calc(8px + env(safe-area-inset-bottom));
    }
    .listing-sticky-cta .lsc-btn {
        height: 46px;
        border-radius: 13px;
        font-size: 13px;
    }
    .listing-sticky-cta .lsc-fav {
        flex-basis: 46px;
        width: 46px;
    }
    .listing-sticky-cta .lsc-phone {
        color: #fff !important;
        background: linear-gradient(135deg, #1ca65a, #148443);
        box-shadow: 0 6px 15px rgba(20,132,67,.22);
    }
    .listing-sticky-cta .lsc-phone:hover,
    .listing-sticky-cta .lsc-phone:focus,
    .listing-sticky-cta .lsc-phone:active,
    .listing-sticky-cta .lsc-phone:visited,
    .listing-sticky-cta .lsc-phone i,
    .listing-sticky-cta .lsc-phone span {
        color: #fff !important;
    }
    .listing-sticky-cta .lsc-message {
        border-color: #cce8f4;
        background: #edf8fc;
    }
}

@media (max-width: 359.98px) {
    .listing-details-card .listing-specs-grid { grid-template-columns: 1fr; }
    .listing-summary-kicker > span { display: none; }
}

/* ============================================================
   DESKTOP EXPERIENCE REFRESH
   מעטפת רחבה, היררכיה ברורה וכרטיסים שמתאימים למסך מחשב.
   כל השינויים תחומים לדסקטופ כדי לשמור על חוויית האפליקציה במובייל.
   ============================================================ */
@media (min-width: 992px) {
    :root {
        --wc-desktop-container: 1380px;
        --wc-desktop-surface: #ffffff;
        --wc-desktop-bg: #f4f7f9;
        --wc-desktop-line: #e3e9ed;
        --wc-desktop-shadow: 0 16px 42px rgba(15, 23, 42, .075);
    }

    html,
    body {
        background: var(--wc-desktop-bg);
    }

    body > main {
        min-height: 60vh;
    }

    body > main > .container,
    .page-home .hero > .container,
    .page-home .desktop-category-discovery > .container,
    .site-footer > .container {
        width: min(100% - 48px, var(--wc-desktop-container));
        max-width: var(--wc-desktop-container);
    }

    /* ----- Header ----- */
    .navbar.bg-primary.wc-desktop-header {
        height: auto;
        min-height: 76px;
        padding: 0;
        background: rgba(255, 255, 255, .96) !important;
        border-bottom: 1px solid rgba(218, 226, 231, .9);
        box-shadow: 0 5px 22px rgba(15, 23, 42, .055) !important;
        -webkit-backdrop-filter: blur(16px);
        backdrop-filter: blur(16px);
    }
    .wc-desktop-header .wc-desktop-header-inner {
        width: min(100% - 40px, 1440px);
        max-width: 1440px;
        gap: 18px;
        padding: 0;
    }
    .wc-desktop-header .navbar-brand {
        flex: 0 0 auto;
        margin: 0;
        padding: 0;
    }
    .wc-desktop-header .site-logo {
        height: 62px;
    }
    .wc-desktop-header .navbar-collapse {
        min-width: 0;
        gap: 14px;
    }
    .wc-desktop-header .megacats {
        min-width: 0;
        /* Keep categories inside their available space beside the account actions. */
        flex-wrap: wrap;
        margin: 0 !important;
        gap: 2px;
    }
    .wc-desktop-header .megacats > * {
        flex: 0 0 auto;
    }
    .wc-desktop-header .megacat-link {
        min-height: 42px;
        padding: 0 10px;
        border-radius: 12px;
        color: #344854;
        font-size: 13.5px;
        font-weight: 650;
    }
    .wc-desktop-header .megacat-link:hover,
    .wc-desktop-header .megacat-link:focus-visible {
        color: var(--wc-primary-d);
        background: #edf7fb;
    }
    .wc-desktop-header .megacat-menu {
        top: calc(100% + 10px);
        min-width: 250px;
        padding: 8px;
        border-radius: 16px;
        border-color: #dde5e9;
        box-shadow: 0 22px 55px rgba(15, 23, 42, .16);
    }
    .wc-desktop-header .megacat-menu::before {
        top: -10px;
        height: 10px;
    }
    .wc-desktop-header .megacat-menu .dropdown-item {
        min-height: 40px;
        display: flex;
        align-items: center;
        border-radius: 10px;
    }
    .wc-desktop-header .navbar-nav {
        flex: 0 0 auto;
        gap: 3px;
    }
    .wc-desktop-header .navbar-nav > .nav-item > .nav-link {
        min-height: 42px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        padding: 0 12px !important;
        border-radius: 12px;
        color: #344854;
    }
    .wc-desktop-header .navbar-nav > .nav-item > .nav-link:hover {
        color: var(--wc-primary-d);
        background: #f0f6f8;
    }
    .wc-desktop-header .btn-publish {
        min-height: 46px;
        padding: 0 18px;
        border-radius: 14px;
        box-shadow: 0 9px 22px rgba(0, 145, 209, .25), inset 0 1px 0 rgba(255,255,255,.28);
    }
    .wc-desktop-header .dropdown-menu:not(.megacat-menu) {
        margin-top: 9px;
        padding: 8px;
        border-radius: 16px;
        min-width: 230px;
    }

    .search-strip {
        padding: 12px 0;
        background: rgba(255,255,255,.94) !important;
        border-color: var(--wc-desktop-line) !important;
        box-shadow: 0 5px 18px rgba(15,23,42,.035) !important;
    }
    .search-strip .nav-search {
        max-width: 860px;
        min-height: 50px;
        padding: 4px 5px 4px 18px;
        border-radius: 15px;
        background: #f3f6f8;
    }
    .search-strip .nav-search-btn {
        min-height: 40px;
        padding-inline: 22px;
        border-radius: 11px;
    }

    /* ----- Home hero ----- */
    .page-home .hero {
        overflow: hidden;
        border-bottom: 0;
        background:
            radial-gradient(760px 420px at 52% -5%, rgba(0,145,209,.15), transparent 70%),
            radial-gradient(520px 300px at 92% 88%, rgba(56,189,248,.10), transparent 72%),
            radial-gradient(480px 280px at 8% 96%, rgba(0,174,239,.07), transparent 72%),
            linear-gradient(180deg, #ffffff 0%, #f3f8fb 100%);
    }
    .page-home .hero::before {
        display: block;
        background-size: 28px 28px;
        opacity: .72;
    }
    .page-home .hero-inner {
        max-width: 940px;
        padding: 64px 0 58px;
    }
    .page-home .hero-kicker {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        margin-bottom: 18px;
        padding: 8px 15px;
        border: 1px solid #cee7f2;
        background: rgba(255,255,255,.78);
        box-shadow: 0 6px 18px rgba(15,23,42,.045);
        font-size: 12px;
        letter-spacing: 0;
    }
    .page-home .hero-kicker i {
        color: var(--wc-primary);
    }
    .page-home .hero .hero-title {
        max-width: 880px;
        margin-bottom: 14px;
        font-size: clamp(2.15rem, 3.25vw, 3.15rem);
        line-height: 1.14;
        font-weight: 800;
        letter-spacing: -.045em;
        color: #10232d;
    }
    .page-home .hero .hero-title .hero-title-brand {
        font-weight: 850;
        color: var(--wc-primary-d);
    }
    .page-home .hero .hero-title .hero-title-sep {
        margin-inline: .18em;
    }
    .page-home .hero .hero-sub {
        max-width: 720px;
        margin-bottom: 28px;
        font-size: 18px;
        line-height: 1.7;
        color: #617581;
    }
    .page-home .hs-bar {
        max-width: 790px;
        min-height: 76px;
        padding: 9px;
        padding-inline-start: 27px;
        border-radius: 22px;
        border-color: #dbe5ea;
        box-shadow: 0 20px 48px rgba(23, 48, 60, .12), 0 3px 10px rgba(15,23,42,.04);
    }
    .page-home .hs-input {
        font-size: 17px;
    }
    .page-home .hs-btn {
        width: 58px;
        height: 58px;
        border-radius: 17px;
    }
    .page-home .hero-suggests {
        margin-top: 21px;
        gap: 9px;
    }
    .page-home .hero-suggests-label {
        margin-inline-end: 5px;
    }
    .page-home .hero-suggest {
        min-height: 34px;
        padding: 0 12px;
        gap: 6px;
        border: 1px solid #dce6eb;
        border-radius: 999px;
        background: rgba(255,255,255,.72);
        font-size: 13px;
    }
    .page-home .hero-suggest:hover {
        border-color: #b9dcea;
        background: #fff;
    }
    .page-home .hero-trust {
        max-width: 790px;
        margin-top: 30px;
        padding: 0;
        border: 1px solid rgba(213,225,231,.95);
        border-radius: 20px;
        background: rgba(255,255,255,.72);
        box-shadow: 0 10px 30px rgba(15,23,42,.045);
        overflow: hidden;
    }
    .page-home .hero-trust .ht-item {
        flex: 1 1 0;
        justify-content: center;
        gap: 12px;
        min-height: 78px;
        padding: 13px 22px;
    }
    .page-home .hero-trust .ht-item + .ht-item {
        border-inline-start: 1px solid #e4ebee;
    }
    .page-home .hero-trust .ht-icon {
        width: 38px;
        height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 12px;
        background: #eaf6fb;
    }
    .page-home .hero-trust .ht-item i {
        font-size: 15px;
    }
    .page-home .hero-trust .ht-title {
        font-size: 13px;
    }
    .page-home .hero-trust .ht-sub {
        margin-top: 3px;
        font-size: 11px;
    }

    /* ----- Home navigation and sections ----- */
    .desktop-category-discovery {
        padding: 32px 0 34px;
        background: #fff;
        border-top: 1px solid #edf1f3;
        border-bottom: 1px solid var(--wc-desktop-line);
    }
    .desktop-category-discovery-head,
    .home-section-head {
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        gap: 20px;
        margin-bottom: 20px;
    }
    .desktop-category-discovery-head h2,
    .home-section-head h2 {
        margin: 4px 0 0;
        font-size: 25px;
        line-height: 1.25;
        font-weight: 800;
        letter-spacing: -.035em;
        color: #132a35;
    }
    .home-section-eyebrow {
        display: block;
        color: var(--wc-primary-d);
        font-size: 11px;
        line-height: 1;
        font-weight: 800;
        letter-spacing: .08em;
        text-transform: uppercase;
    }
    .home-section-link {
        min-height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 0 14px;
        border: 1px solid #dce5e9;
        border-radius: 11px;
        background: #fff;
        color: #405966;
        font-size: 13px;
        font-weight: 700;
        text-decoration: none;
        transition: transform .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
    }
    .home-section-link i {
        font-size: 11px;
        color: var(--wc-primary);
        transition: transform .15s ease;
    }
    .home-section-link:hover {
        transform: translateY(-1px);
        border-color: #acd5e6;
        color: var(--wc-primary-d);
        box-shadow: 0 8px 20px rgba(15,23,42,.07);
    }
    .home-section-link:hover i {
        transform: translateX(-3px);
    }
    .desktop-category-grid {
        display: grid;
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: 12px;
    }
    .desktop-category-card {
        min-width: 0;
        min-height: 94px;
        display: flex;
        align-items: center;
        gap: 11px;
        padding: 14px;
        border: 1px solid #e1e8ec;
        border-radius: 17px;
        background: #fbfcfd;
        color: var(--wc-text);
        text-decoration: none;
        transition: transform .18s ease, border-color .18s ease, background-color .18s ease, box-shadow .18s ease;
    }
    .desktop-category-card:hover {
        transform: translateY(-3px);
        border-color: #b9dce9;
        background: #fff;
        color: var(--wc-text);
        box-shadow: 0 13px 28px rgba(15,23,42,.09);
    }
    .desktop-category-icon {
        flex: 0 0 45px;
        width: 45px;
        height: 45px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 14px;
        background: linear-gradient(145deg, #e9f7fc, #dceff7);
        color: var(--wc-primary-d);
        font-size: 18px;
    }
    .desktop-category-copy {
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 4px;
    }
    .desktop-category-copy strong {
        overflow: hidden;
        color: #243b46;
        font-size: 13px;
        line-height: 1.3;
        font-weight: 750;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .desktop-category-copy small {
        color: #81919a;
        font-size: 10.5px;
        white-space: nowrap;
    }
    .desktop-category-arrow {
        margin-inline-start: auto;
        color: #b0bec5;
        font-size: 10px;
    }
    .desktop-category-card:hover .desktop-category-arrow {
        color: var(--wc-primary);
    }

    .page-home .home-price-tools {
        margin-top: 34px !important;
        margin-bottom: 54px !important;
    }
    .page-home .price-banners-row {
        gap: 22px;
    }
    .page-home .car-prices-banner {
        min-height: 138px;
        padding: 25px;
        border-radius: 22px;
        border-color: #dfe7eb;
        box-shadow: 0 9px 28px rgba(15,23,42,.06);
    }
    .page-home .car-prices-banner::before {
        inset-inline: 24px;
        width: auto;
        height: 4px;
        border-radius: 0 0 8px 8px;
    }
    .page-home .cpb-icon {
        width: 64px;
        height: 64px;
        border-radius: 18px;
    }
    .page-home .cpb-title {
        font-size: 20px;
    }
    .page-home .cpb-sub {
        max-width: 460px;
        margin-top: 7px;
        font-size: 13.5px;
    }
    .page-home .cpb-action {
        padding: 11px 16px;
        font-size: 12.5px;
    }

    .page-home .home-listings-section {
        margin-top: 62px !important;
        margin-bottom: 62px !important;
    }
    .page-home .home-featured-section {
        padding: 28px;
        border: 1px solid #e2e9ed;
        border-radius: 26px;
        background:
            radial-gradient(520px 180px at 98% 0%, rgba(0,174,239,.07), transparent 68%),
            #fff;
        box-shadow: 0 13px 36px rgba(15,23,42,.055);
    }
    .page-home .home-featured-section .home-section-head {
        margin-bottom: 24px;
    }
    .page-home .category-section + .category-section {
        padding-top: 46px;
        border-top: 1px solid #dfe7eb;
    }
    .page-home .category-section-icon {
        width: 40px;
        height: 40px;
        margin-inline-end: 8px;
        border-radius: 13px;
        vertical-align: middle;
    }

    /* ----- Listing cards ----- */
    .row > .listing-col-5 {
        width: 25%;
    }
    .listing-card:not(.is-list) {
        padding: 8px;
        overflow: hidden;
        border: 1px solid #e1e8ec;
        border-radius: 21px;
        background: #fff;
        box-shadow: 0 7px 22px rgba(15,23,42,.055);
        transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
    }
    .listing-card:not(.is-list):hover {
        transform: translateY(-5px);
        border-color: #b8d9e6;
        box-shadow: 0 20px 42px rgba(15,23,42,.12);
    }
    .listing-card:not(.is-list) .img-wrap {
        border-radius: 15px;
        box-shadow: none;
    }
    .listing-card:not(.is-list):hover .img-wrap {
        box-shadow: none;
    }
    .listing-card:not(.is-list) .body {
        padding: 14px 8px 7px;
    }
    .listing-card:not(.is-list) .title {
        min-height: calc(1.4em * 2);
        margin-bottom: 7px;
        color: #172f3a;
        font-size: 15px;
        line-height: 1.4;
        font-weight: 700;
    }
    .listing-card:not(.is-list) .meta {
        color: #748790;
        font-size: 12px;
    }
    .listing-card:not(.is-list) .price {
        padding: 2px 8px 11px;
        color: #132a35;
        font-size: 18px;
        font-weight: 800;
    }
    .listing-card .fav-btn {
        top: 14px;
        right: 14px;
        width: 36px;
        height: 36px;
        font-size: 14px;
        box-shadow: 0 5px 14px rgba(15,23,42,.16);
    }
    .listing-card .badge-featured {
        top: 14px;
        left: 14px;
        width: 32px;
        height: 32px;
        font-size: 12px;
    }
    .listing-card.is-list {
        min-height: 150px;
        padding: 13px;
        border: 1px solid #e1e8ec;
        border-radius: 19px;
        box-shadow: 0 7px 22px rgba(15,23,42,.045);
    }
    .listing-card.is-list:hover {
        border-color: #bddce8;
        box-shadow: 0 17px 36px rgba(15,23,42,.105);
    }
    .listing-card.is-list .img-wrap {
        flex-basis: 184px;
        width: 184px;
        height: 124px;
        border-radius: 14px;
    }
    .listing-card.is-list .title {
        font-size: 17px;
    }
    .listing-card.is-list .price {
        font-size: 22px;
    }

    /* ----- Search and category pages ----- */
    .page-search > main > .container,
    .page-category > main > .container {
        padding-top: 34px !important;
        padding-bottom: 56px !important;
    }
    .page-search > main > .container > .d-flex:first-child,
    .page-category > main > .container > .d-flex:nth-of-type(1) {
        min-height: 78px;
        margin-bottom: 22px !important;
        padding: 17px 21px;
        border: 1px solid #e1e8ec;
        border-radius: 20px;
        background: #fff;
        box-shadow: 0 8px 24px rgba(15,23,42,.045);
    }
    .page-search > main h1,
    .page-category > main h1 {
        color: #17313d;
        font-size: 25px !important;
        letter-spacing: -.035em;
    }
    .page-category .breadcrumb {
        margin-bottom: 0;
        color: #7c8e97;
    }
    .page-search .filter-sidebar,
    .page-category .filter-sidebar {
        position: sticky;
        top: 96px;
        max-height: calc(100vh - 116px);
        overflow-y: auto;
        padding: 22px;
        border-color: #dee7eb;
        border-radius: 20px;
        box-shadow: 0 10px 28px rgba(15,23,42,.055);
    }
    .page-search .filter-sheet-head,
    .page-category .filter-sheet-head {
        margin-bottom: 18px !important;
        padding-bottom: 14px;
        border-bottom: 1px solid #e7edef;
    }
    .page-search .filter-sheet-head h6,
    .page-category .filter-sheet-head h6 {
        margin: 0;
        font-size: 16px;
    }
    .page-search .filter-sidebar .form-control,
    .page-search .filter-sidebar .form-select,
    .page-category .filter-sidebar .form-control,
    .page-category .filter-sidebar .form-select {
        min-height: 40px;
        border-color: #dbe4e8;
        background-color: #fbfcfd;
    }
    .page-search .filter-sidebar .btn-primary,
    .page-category .filter-sidebar .btn-primary {
        min-height: 42px;
        border-radius: 12px;
    }
    .page-category .veh-bar {
        padding: 14px 17px;
        border-color: #dfe7eb;
        border-radius: 20px;
        box-shadow: 0 9px 26px rgba(15,23,42,.05);
    }
    .page-category .veh-tabs {
        gap: 7px;
        padding-bottom: 11px;
        margin-bottom: 12px;
    }
    .page-category .veh-tab {
        min-height: 38px;
        padding-inline: 15px;
        border-radius: 11px;
    }
    .page-category .veh-qf {
        gap: 9px;
    }
    .page-category .veh-qf-btn {
        min-height: 38px;
        padding-inline: 15px;
        background: #fbfcfd;
    }
    .view-toggle {
        padding: 3px;
        border-radius: 12px;
        background: #fff;
    }
    .view-toggle a {
        border-radius: 9px;
    }

    /* ----- Sell CTA and footer ----- */
    .home-sell-cta {
        position: relative;
        min-height: 190px;
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto;
        align-items: center;
        gap: 27px;
        overflow: hidden;
        padding: 34px 42px;
        border: 1px solid rgba(255,255,255,.14);
        border-radius: 28px;
        background:
            radial-gradient(420px 190px at 92% 10%, rgba(56,189,248,.28), transparent 68%),
            radial-gradient(360px 170px at 8% 105%, rgba(0,174,239,.18), transparent 70%),
            linear-gradient(135deg, #102b3a 0%, #064d70 55%, #0079ad 100%);
        color: #fff;
        box-shadow: 0 22px 52px rgba(7, 46, 68, .22);
    }
    .home-sell-cta::after {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background-image: radial-gradient(rgba(255,255,255,.14) 1px, transparent 1px);
        background-size: 22px 22px;
        -webkit-mask-image: linear-gradient(90deg, transparent, #000 28%, #000 72%, transparent);
        mask-image: linear-gradient(90deg, transparent, #000 28%, #000 72%, transparent);
    }
    .home-sell-cta-icon,
    .home-sell-cta-copy,
    .home-sell-cta-action {
        position: relative;
        z-index: 1;
    }
    .home-sell-cta-icon {
        width: 78px;
        height: 78px;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid rgba(255,255,255,.22);
        border-radius: 23px;
        background: rgba(255,255,255,.12);
        color: #fff;
        font-size: 30px;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.18);
    }
    .home-sell-cta-copy > span {
        display: block;
        margin-bottom: 7px;
        color: #aee4f8;
        font-size: 12px;
        font-weight: 700;
    }
    .home-sell-cta h2 {
        margin: 0;
        color: #fff;
        font-size: 30px;
        font-weight: 800;
    }
    .home-sell-cta p {
        margin: 8px 0 0;
        color: rgba(255,255,255,.78);
        font-size: 15px;
    }
    .home-sell-cta .btn {
        min-height: 52px;
        padding-inline: 24px;
        border: 0;
        color: #064d70;
        box-shadow: 0 12px 26px rgba(0,0,0,.18);
    }
    .home-sell-cta .btn:hover {
        transform: translateY(-2px);
        background: #fff;
        color: var(--wc-primary-d);
    }

    .page-home .faq-section {
        max-width: 960px;
        margin-top: 76px !important;
    }
    .page-home .faq-title {
        margin-bottom: 28px;
        font-size: 28px;
    }
    .page-home .faq-list {
        gap: 14px;
    }
    .page-home .faq-item {
        padding-inline: 22px;
        border-radius: 17px;
    }

    .site-footer {
        margin-top: 96px;
        padding-top: 64px;
    }
    .site-footer .footer-seo {
        display: grid;
        grid-template-columns: minmax(220px, .34fr) minmax(0, 1fr);
        align-items: start;
        gap: 36px;
        margin-bottom: 46px;
        padding: 25px 28px;
        border: 1px solid rgba(255,255,255,.075);
        border-radius: 20px;
        background: rgba(255,255,255,.035);
    }
    .site-footer .footer-seo-title {
        margin: 0;
        font-size: 18px;
        line-height: 1.5;
    }
    .site-footer .footer-seo-text {
        max-width: none;
        font-size: 13px;
        line-height: 1.85;
    }
    .site-footer .row {
        --bs-gutter-x: 2.5rem;
    }
    .site-footer .footer-title {
        margin-bottom: 18px;
    }
    .site-footer .footer-bottom {
        margin-top: 48px;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .wc-desktop-header .wc-desktop-header-inner {
        width: min(100% - 24px, 1140px);
        gap: 8px;
    }
    .wc-desktop-header .site-logo {
        height: 54px;
    }
    .wc-desktop-header .megacat-link {
        padding-inline: 7px;
        font-size: 12.5px;
    }
    .wc-desktop-header .btn-publish {
        padding-inline: 12px;
        font-size: 13px;
    }
    .desktop-category-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .row > .listing-col-5 {
        width: 33.333333%;
    }
}

/* ============================================================
   UNIFIED CATEGORY EXPERIENCE
   תבנית אחת לכל עץ הקטגוריות, עם צבע זיהוי עדין לפי התחום.
   ============================================================ */
.category-page-shell {
    --category-accent: #087ea4;
    --category-soft: #e8f6fa;
}

.category-breadcrumb {
    margin-bottom: 14px;
    color: #82939c;
    font-size: 12.5px;
}
.category-breadcrumb .breadcrumb {
    align-items: center;
}
.category-breadcrumb .breadcrumb-item + .breadcrumb-item::before {
    color: #b2bec4;
}
.category-breadcrumb .breadcrumb-item.active {
    color: #536975;
}

.category-hero {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    overflow: hidden;
    margin-bottom: 22px;
    padding: 27px 29px;
    border: 1px solid color-mix(in srgb, var(--category-accent) 18%, #e1e8ec);
    border-radius: 24px;
    background:
        radial-gradient(480px 220px at 100% 0%, color-mix(in srgb, var(--category-accent) 12%, transparent), transparent 72%),
        linear-gradient(135deg, #fff 0%, var(--category-soft) 140%);
    box-shadow: 0 12px 34px rgba(15,23,42,.055);
}
.category-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: radial-gradient(color-mix(in srgb, var(--category-accent) 15%, transparent) 1px, transparent 1px);
    background-size: 22px 22px;
    -webkit-mask-image: linear-gradient(90deg, #000, transparent 47%);
    mask-image: linear-gradient(90deg, #000, transparent 47%);
    opacity: .55;
}
.category-hero-main,
.category-hero-actions {
    position: relative;
    z-index: 1;
}
.category-hero-main {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 18px;
}
.category-hero-icon {
    flex: 0 0 72px;
    width: 72px;
    height: 72px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid color-mix(in srgb, var(--category-accent) 18%, transparent);
    border-radius: 21px;
    background: rgba(255,255,255,.78);
    color: var(--category-accent);
    font-size: 27px;
    box-shadow: 0 9px 24px color-mix(in srgb, var(--category-accent) 14%, transparent);
}
.category-hero-copy {
    min-width: 0;
}
.category-hero-kicker {
    display: block;
    margin-bottom: 5px;
    color: var(--category-accent);
    font-size: 11px;
    line-height: 1;
    font-weight: 800;
    letter-spacing: .06em;
}
.category-hero h1 {
    margin: 0;
    color: #142e3a;
    font-size: clamp(26px, 2.4vw, 36px);
    line-height: 1.2;
    font-weight: 850;
    letter-spacing: -.045em;
}
.category-hero-copy > p {
    max-width: 660px;
    margin: 8px 0 0;
    color: #617682;
    font-size: 14px;
    line-height: 1.65;
}
.category-hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 13px;
}
.category-hero-meta > span {
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0 10px;
    border: 1px solid rgba(255,255,255,.9);
    border-radius: 999px;
    background: rgba(255,255,255,.66);
    color: #536975;
    font-size: 11.5px;
    font-weight: 650;
}
.category-hero-meta i {
    color: var(--category-accent);
    font-size: 10.5px;
}
.category-hero-actions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 9px;
}
.category-sort-form {
    min-height: 54px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 11px 7px 7px;
    border: 1px solid #dce5e9;
    border-radius: 16px;
    background: rgba(255,255,255,.9);
    box-shadow: 0 8px 20px rgba(15,23,42,.055);
}
.category-sort-form label {
    min-width: 44px;
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0 9px;
    border-radius: 11px;
    color: var(--category-accent, #087ea4);
    background: color-mix(in srgb, var(--category-soft, #e8f6fa) 72%, #fff);
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}
.category-sort-form .form-select {
    width: 220px;
    max-width: 42vw;
    min-height: 38px;
    padding-inline-start: 34px;
    padding-inline-end: 11px;
    border: 0;
    border-radius: 11px !important;
    background-color: transparent;
    box-shadow: none;
    color: #17353e;
    font-size: 13px;
    font-weight: 800;
    text-overflow: ellipsis;
}
.category-publish-action {
    min-height: 44px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 16px;
    border: 1px solid var(--category-accent);
    border-radius: 13px;
    background: var(--category-accent);
    color: #fff;
    font-size: 13px;
    font-weight: 750;
    text-decoration: none;
    box-shadow: 0 8px 19px color-mix(in srgb, var(--category-accent) 25%, transparent);
    transition: transform .15s ease, filter .15s ease, box-shadow .15s ease;
}
.category-publish-action:hover {
    transform: translateY(-2px);
    filter: brightness(.94);
    color: #fff;
    box-shadow: 0 12px 25px color-mix(in srgb, var(--category-accent) 30%, transparent);
}

.category-rich-navigation {
    overflow: visible;
    border-color: color-mix(in srgb, var(--category-accent) 16%, #dfe7eb);
}
.category-rich-navigation .veh-tab.is-active,
.category-rich-navigation .veh-qf-btn.is-active {
    border-color: color-mix(in srgb, var(--category-accent) 28%, transparent);
    background: var(--category-soft);
    color: var(--category-accent);
}
.category-rich-navigation .veh-tab i,
.category-rich-navigation .veh-qf-badge {
    color: var(--category-accent);
}

.category-subcats-panel {
    padding: 20px;
    border: 1px solid #e0e8ec;
    border-radius: 21px;
    background: #fff;
    box-shadow: 0 8px 26px rgba(15,23,42,.045);
}
.category-subcats-title {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 14px;
}
.category-subcats-title > span {
    color: #1e3844;
    font-size: 16px;
    font-weight: 800;
}
.category-subcats-title > small {
    color: #84949c;
    font-size: 11.5px;
}
.category-subcats-panel .subcat-chips {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 9px;
}
.category-subcats-panel .subcat-chip {
    min-width: 0;
    min-height: 54px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-color: #e2e9ec;
    border-radius: 14px;
    background: #fafcfd;
    color: #314b57;
    font-size: 12.5px;
    font-weight: 700;
}
.subcat-chip-icon {
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: transparent;
    color: var(--category-accent);
}
.category-subcats-panel .subcat-chip .subcat-chip-icon i {
    color: inherit;
    font-size: 13px;
}
.subcat-chip-arrow {
    margin-inline-start: auto;
    color: #b4c0c6 !important;
    font-size: 9px !important;
    transition: transform .15s ease, color .15s ease;
}
.category-subcats-panel .subcat-chip:hover {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--category-accent) 38%, #e2e9ec);
    background: #fff;
    color: var(--category-accent);
    box-shadow: 0 9px 20px rgba(15,23,42,.07);
}
.category-subcats-panel .subcat-chip:hover .subcat-chip-arrow {
    transform: translateX(-3px);
    color: var(--category-accent) !important;
}

.category-results-area {
    min-width: 0;
}
.category-results-toolbar {
    min-height: 54px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 15px;
    padding: 7px 8px 7px 15px;
    border: 1px solid #e1e8ec;
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 5px 17px rgba(15,23,42,.035);
}
.category-results-summary {
    min-width: 0;
    display: flex;
    align-items: baseline;
    gap: 9px;
}
.category-results-summary strong {
    color: #1d3743;
    font-size: 14px;
    font-weight: 800;
    white-space: nowrap;
}
.category-results-summary span {
    overflow: hidden;
    color: #82929a;
    font-size: 11.5px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.category-results-toolbar .view-toggle {
    flex: 0 0 auto;
    border: 0;
    background: #f1f5f7;
    box-shadow: none;
}
.category-results-toolbar .view-toggle a.active {
    background: var(--category-accent);
}

.category-empty-state {
    min-height: 390px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 50px 24px;
    border: 0;
    border-radius: 22px;
    background:
        radial-gradient(280px 140px at 50% 0%, var(--category-soft), transparent 76%),
        #fff;
    text-align: center;
}
.category-empty-icon {
    width: 72px;
    height: 72px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
    border-radius: 21px;
    background: var(--category-soft);
    color: var(--category-accent);
    font-size: 28px;
}
.category-empty-state h2 {
    margin: 0;
    color: #203b47;
    font-size: 21px;
    font-weight: 800;
}
.category-empty-state p {
    max-width: 460px;
    margin: 9px auto 20px;
    color: #758791;
    font-size: 13.5px;
    line-height: 1.65;
}
.category-empty-actions {
    display: flex;
    justify-content: center;
    gap: 9px;
}
.category-empty-actions .btn {
    min-height: 43px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border-radius: 12px;
}

.category-seo-text {
    display: flex;
    align-items: flex-start;
    gap: 17px;
    margin-top: 54px;
    padding: 24px 26px;
    border: 1px solid #e1e8ec;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(15,23,42,.04);
}
.category-seo-icon {
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 13px;
    background: var(--category-soft);
    color: var(--category-accent);
}
.category-seo-text h2 {
    margin: 0 0 9px;
    color: #253e49;
    font-size: 17px;
    font-weight: 800;
}
.category-seo-copy {
    max-width: 1040px;
    color: #667a85;
    font-size: 13px;
    line-height: 1.8;
}
.category-seo-copy p:last-child {
    margin-bottom: 0;
}
.category-seo-copy a {
    color: var(--category-accent);
    font-weight: 650;
}

@media (min-width: 992px) {
    .page-category .category-page-shell {
        padding-top: 28px !important;
    }
    .page-category .category-results-layout > aside {
        width: 24%;
    }
    .page-category .category-results-area {
        width: 76%;
    }
    .page-category .filter-sidebar {
        border-top: 4px solid var(--category-accent);
    }
    .page-category .filter-sidebar .form-label {
        color: #536974;
        font-weight: 650;
    }
    .page-category .filter-sidebar .btn-primary {
        border-color: var(--category-accent);
        background: var(--category-accent);
        box-shadow: 0 7px 17px color-mix(in srgb, var(--category-accent) 22%, transparent);
    }
    .page-category .filter-sidebar .btn-primary:hover {
        filter: brightness(.93);
    }
    .page-category .wc-chip input:checked + span {
        border-color: var(--category-accent);
        background: var(--category-soft);
        color: var(--category-accent);
        box-shadow: inset 0 0 0 1px var(--category-accent);
    }
    .page-category .wc-range-fill {
        background: var(--category-accent);
    }
    .page-category .wc-range input[type=range]::-webkit-slider-thumb {
        border-color: var(--category-accent);
    }
    .page-category .wc-range input[type=range]::-moz-range-thumb {
        border-color: var(--category-accent);
    }
}

@media (max-width: 991.98px) {
    .page-category > main {
        padding-top: 0 !important;
    }
    .page-category .category-page-shell {
        width: 100%;
        max-width: none;
        padding: 10px 12px 28px !important;
    }
    .category-breadcrumb {
        margin: 0 3px 10px;
        font-size: 11px;
    }
    .category-breadcrumb .breadcrumb {
        flex-wrap: nowrap;
        overflow: hidden;
        white-space: nowrap;
    }
    .category-breadcrumb .breadcrumb-item {
        overflow: hidden;
        max-width: 42vw;
        text-overflow: ellipsis;
    }
    .category-hero {
        display: block;
        margin-bottom: 12px;
        padding: 17px;
        border-radius: 19px;
        box-shadow: 0 7px 22px rgba(15,23,42,.05);
    }
    .category-hero::after {
        opacity: .38;
    }
    .category-hero-main {
        align-items: flex-start;
        gap: 12px;
    }
    .category-hero-icon {
        flex-basis: 50px;
        width: 50px;
        height: 50px;
        border-radius: 15px;
        font-size: 20px;
    }
    .category-hero-kicker {
        font-size: 9.5px;
    }
    .category-hero h1 {
        font-size: 22px;
        line-height: 1.27;
    }
    .category-hero-copy > p {
        margin-top: 5px;
        font-size: 12px;
        line-height: 1.55;
    }
    .category-hero-meta {
        gap: 6px;
        margin-top: 9px;
    }
    .category-hero-meta > span {
        min-height: 25px;
        padding-inline: 8px;
        font-size: 10px;
    }
    .category-hero-actions {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        gap: 8px;
        margin-top: 14px;
        padding-top: 13px;
        border-top: 1px solid color-mix(in srgb, var(--category-accent) 13%, #dfe7eb);
    }
    .category-hero-actions #toggleFilters {
        min-height: 43px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        padding-inline: 13px;
        border-color: color-mix(in srgb, var(--category-accent) 30%, #d6e1e6);
        border-radius: 12px;
        color: var(--category-accent);
        font-weight: 700;
    }
    .category-sort-form {
        min-width: 0;
        min-height: 44px;
        gap: 7px;
        padding: 4px 8px 4px 4px;
        border-radius: 13px;
        box-shadow: 0 5px 14px rgba(15,23,42,.045);
    }
    .category-sort-form label {
        min-width: 36px;
        min-height: 34px;
        padding: 0 7px;
        border-radius: 9px;
        font-size: 11px;
    }
    .category-sort-form .form-select {
        width: 100%;
        min-width: 0;
        max-width: none;
        height: 34px;
        padding-block: 0;
        padding-inline-start: 30px;
        padding-inline-end: 7px;
        font-size: 12.5px;
    }

    .page-category .category-rich-navigation {
        margin-bottom: 12px !important;
        padding: 9px 10px;
        border-radius: 16px;
    }
    .page-category .category-rich-navigation .veh-tabs {
        margin-inline: -2px;
    }
    .page-category .category-rich-navigation .veh-tab,
    .page-category .category-rich-navigation .veh-qf-btn {
        font-size: 11.5px;
    }

    .category-subcats-panel {
        margin-bottom: 12px !important;
        padding: 14px 0 12px;
        border-inline: 0;
        border-radius: 16px;
        box-shadow: none;
    }
    .category-subcats-title {
        display: block;
        margin: 0 13px 11px;
    }
    .category-subcats-title > span {
        font-size: 14px;
    }
    .category-subcats-title > small {
        display: block;
        margin-top: 3px;
        font-size: 10.5px;
    }
    .category-subcats-panel .subcat-chips {
        display: flex;
        grid-template-columns: none;
        flex-wrap: nowrap;
        gap: 8px;
        overflow-x: auto;
        margin: 0;
        padding: 0 13px 3px;
        scrollbar-width: none;
        scroll-snap-type: x proximity;
    }
    .category-subcats-panel .subcat-chips::-webkit-scrollbar {
        display: none;
    }
    .category-subcats-panel .subcat-chip {
        flex: 0 0 auto;
        min-height: 44px;
        padding: 5px 9px;
        border-radius: 12px;
        scroll-snap-align: start;
    }
    .subcat-chip-icon {
        flex-basis: 30px;
        width: 30px;
        height: 30px;
        border-radius: 9px;
    }
    .subcat-chip-arrow {
        display: none;
    }

    .category-results-layout {
        --bs-gutter-y: 0;
    }
    .category-results-area {
        padding-inline: 0;
    }
    .category-results-toolbar {
        min-height: 49px;
        margin-bottom: 10px;
        padding: 5px 6px 5px 12px;
        border-radius: 14px;
    }
    .category-results-summary strong {
        font-size: 12.5px;
    }
    .category-results-summary span {
        display: none;
    }
    .category-results-toolbar .view-toggle {
        padding: 2px;
    }
    .category-results-toolbar .view-toggle a {
        min-height: 34px;
        padding: 0 10px;
        font-size: 11.5px;
    }
    .category-listings-grid {
        --bs-gutter-x: 10px;
        --bs-gutter-y: 10px;
    }
    .category-empty-state {
        min-height: 310px;
        padding: 36px 18px;
        border-radius: 18px;
    }
    .category-empty-icon {
        width: 60px;
        height: 60px;
        margin-bottom: 14px;
        border-radius: 18px;
        font-size: 23px;
    }
    .category-empty-state h2 {
        font-size: 18px;
    }
    .category-empty-state p {
        font-size: 12.5px;
    }
    .category-empty-actions {
        width: 100%;
    }
    .category-empty-actions .btn {
        flex: 1 1 0;
        padding-inline: 10px;
        font-size: 12px;
    }
    .category-seo-text {
        gap: 12px;
        margin-top: 30px;
        padding: 17px;
        border-radius: 17px;
    }
    .category-seo-icon {
        flex-basis: 34px;
        width: 34px;
        height: 34px;
        border-radius: 11px;
        font-size: 13px;
    }
    .category-seo-text h2 {
        font-size: 14px;
    }
    .category-seo-copy {
        font-size: 11.5px;
        line-height: 1.75;
    }

    #filterSidebar.is-open .filter-sidebar {
        padding-bottom: calc(24px + env(safe-area-inset-bottom));
        border-top: 4px solid var(--category-accent);
    }
    #filterSidebar.is-open .filter-sheet-head h6 i {
        color: var(--category-accent);
    }
    #filterSidebar.is-open .btn-primary {
        border-color: var(--category-accent);
        background: var(--category-accent);
    }
}

@media (max-width: 359.98px) {
    .category-hero {
        padding: 14px;
    }
    .category-hero-icon {
        flex-basis: 44px;
        width: 44px;
        height: 44px;
    }
    .category-hero h1 {
        font-size: 19px;
    }
    .category-hero-meta > span:nth-child(2) {
        display: none;
    }
}

/* ============================================================
   BRAND POLISH — מראה ישיר, מקומי ואמין
   פחות אפקטים דקורטיביים; יותר מבנה, תוכן וצבע מותג עקבי.
   ============================================================ */
.btn-publish {
    background: var(--wc-primary);
    box-shadow: 0 5px 14px rgba(0,145,209,.24);
}
.btn-publish::before {
    display: none;
}
.btn-publish:hover,
.btn-publish:focus {
    background: var(--wc-primary-d);
    box-shadow: 0 7px 18px rgba(0,115,168,.28);
}
.btn-primary {
    background: var(--wc-primary);
    box-shadow: 0 3px 10px rgba(0,145,209,.20);
}
.btn-primary:hover,
.btn-primary:focus {
    background: var(--wc-primary-d);
    box-shadow: 0 5px 14px rgba(0,115,168,.24);
}

.site-footer {
    background: #102832;
}

.page-home .hero,
.page-home .home-featured-section,
.category-hero,
.category-empty-state {
    background-image: none;
}
.page-home .hero::before,
.category-hero::after,
.home-sell-cta::after,
.car-prices-banner::after {
    display: none;
}

.page-home .hero {
    background: #f7fafb;
    border-bottom: 1px solid #e1e8ec;
}
.page-home .hero-kicker {
    background: #fff;
    box-shadow: none;
}
.page-home .hs-bar {
    border-radius: 16px;
    box-shadow: 0 10px 28px rgba(15,23,42,.09);
}
.page-home .hs-btn {
    border-radius: 12px;
    box-shadow: none;
}
.page-home .hero-suggest {
    background: #fff;
}
.page-home .hero-trust {
    background: #fff;
    box-shadow: none;
}
.page-home .home-featured-section {
    background: #fff;
    box-shadow: 0 8px 24px rgba(15,23,42,.045);
}
.page-home .car-prices-banner {
    box-shadow: 0 6px 20px rgba(15,23,42,.045);
}
.page-home .cpb-icon,
.page-home .cpb-action {
    background: var(--accent);
}
.home-sell-cta {
    background: #075b7c;
}

.category-hero {
    border-top: 4px solid var(--category-accent);
    background: #fff;
}
.category-hero-icon,
.category-hero-meta > span {
    background: var(--category-soft);
}
.category-hero-icon {
    box-shadow: none;
}
.category-publish-action,
.page-category .filter-sidebar .btn-primary {
    box-shadow: none;
}
.category-empty-state {
    background: #fff;
}

.listing-card:not(.is-list),
.listing-card.is-list,
.category-subcats-panel,
.category-results-toolbar,
.category-seo-text {
    box-shadow: 0 4px 15px rgba(15,23,42,.04);
}
.listing-card:not(.is-list):hover,
.listing-card.is-list:hover {
    box-shadow: 0 12px 28px rgba(15,23,42,.09);
}

.page-search .alert-info {
    border: 1px solid #cfe3ec;
    border-inline-start: 4px solid var(--wc-primary);
    border-radius: 12px;
    background: #f3f9fc;
    color: #35515e;
}

@media (max-width: 991.98px) {
    .page-home .hero {
        background: #fff;
    }
    .category-hero {
        border-top-width: 3px;
    }
    .home-sell-cta {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 13px;
        padding: 23px 20px;
        border-radius: 20px;
        background: #075b7c;
        color: #fff;
        box-shadow: 0 10px 26px rgba(7,91,124,.18);
    }
    .home-sell-cta-icon {
        width: 48px;
        height: 48px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 14px;
        background: rgba(255,255,255,.14);
        color: #fff;
        font-size: 20px;
    }
    .home-sell-cta-copy > span {
        display: block;
        margin-bottom: 5px;
        color: #bfe7f5;
        font-size: 10.5px;
        font-weight: 700;
    }
    .home-sell-cta h2 {
        margin: 0;
        color: #fff;
        font-size: 22px;
        font-weight: 800;
    }
    .home-sell-cta p {
        margin: 6px 0 0;
        color: rgba(255,255,255,.78);
        font-size: 13px;
        line-height: 1.6;
    }
    .home-sell-cta-action {
        width: 100%;
    }
    .home-sell-cta .btn {
        width: 100%;
        min-height: 46px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        border: 0;
        color: #075b7c;
        font-size: 13px;
    }
}

.skip-to-content {
    position: fixed;
    z-index: 2000;
    top: 10px;
    inset-inline-start: 12px;
    transform: translateY(-160%);
    padding: .65rem 1rem;
    border-radius: 10px;
    background: #102832;
    color: #fff;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 8px 24px rgba(16, 40, 50, .2);
    transition: transform .15s ease;
}

.skip-to-content:focus {
    transform: translateY(0);
    color: #fff;
}

@supports (display: wallcity-disabled) {
/* ============================================================
   SITE-WIDE DESIGN SYSTEM 2026
   One visual language for public, account and administration pages.
   ============================================================ */
:root {
    --wc-primary: #0787b4;
    --wc-primary-d: #056b8f;
    --wc-primary-l: #32a9d0;
    --wc-primary-50: #eaf6fa;
    --wc-primary-100: #d3eaf2;
    --wc-accent: #00aeef;
    --wc-accent-d: #008bc2;
    --wc-bg: #f4f7f8;
    --wc-card-bg: #ffffff;
    --wc-border: #dce5e9;
    --wc-border-2: #e9eef1;
    --wc-text: #17313b;
    --wc-text-2: #344f5a;
    --wc-muted: #6c818a;
    --wc-muted-2: #94a5ac;
    --wc-brand-ink: #123a47;
    --wc-brand-deep: #102f39;
    --wc-warm: #fff7eb;
    --wc-radius-sm: 9px;
    --wc-radius: 14px;
    --wc-radius-lg: 20px;
    --wc-shadow-xs: 0 1px 2px rgba(18, 49, 59, .035);
    --wc-shadow: 0 8px 24px rgba(18, 49, 59, .055);
    --wc-shadow-h: 0 14px 34px rgba(18, 49, 59, .10);
}

html {
    background: var(--wc-bg);
}

.site-body {
    background: var(--wc-bg);
    color: var(--wc-text);
    line-height: 1.6;
}

.site-body .site-main {
    position: relative;
    overflow: clip;
    background: var(--wc-bg);
}

.site-body .site-main img {
    max-width: 100%;
}

.site-body .site-main > .container {
    position: relative;
}

.site-body h1,
.site-body h2,
.site-body h3,
.admin-body h1,
.admin-body h2,
.admin-body h3 {
    color: var(--wc-text);
    text-wrap: balance;
}

.site-body p,
.site-body li {
    text-wrap: pretty;
}

/* Shared surfaces */
.site-body .card:not(.listing-card),
.admin-body .card {
    border: 1px solid var(--wc-border);
    border-radius: var(--wc-radius-lg);
    background: #fff;
    box-shadow: var(--wc-shadow);
}

.site-body .card:not(.listing-card) > .card-header,
.admin-body .card > .card-header {
    padding: 16px 20px;
    border-bottom: 1px solid var(--wc-border-2);
    border-radius: calc(var(--wc-radius-lg) - 1px) calc(var(--wc-radius-lg) - 1px) 0 0;
    background: #fbfcfc;
}

.site-body .card:not(.listing-card) > .card-footer,
.admin-body .card > .card-footer {
    padding: 14px 20px;
    border-top: 1px solid var(--wc-border-2);
    border-radius: 0 0 calc(var(--wc-radius-lg) - 1px) calc(var(--wc-radius-lg) - 1px);
    background: #fbfcfc;
}

.site-body .list-group,
.admin-body .list-group {
    overflow: hidden;
    border: 1px solid var(--wc-border);
    border-radius: var(--wc-radius);
}

.site-body .list-group-item,
.admin-body .list-group-item {
    padding: 14px 16px;
    border-color: var(--wc-border-2);
    background: #fff;
}

.site-body .list-group-item-action:hover,
.admin-body .list-group-item-action:hover {
    background: #f5fafc;
}

/* Forms */
.site-body :where(.form-control, .form-select),
.admin-body :where(.form-control, .form-select) {
    min-height: 44px;
    border-color: #d6e0e4;
    border-radius: 11px;
    background-color: #fff;
    color: var(--wc-text);
    box-shadow: 0 1px 2px rgba(18, 49, 59, .02);
}

.site-body :where(.form-control, .form-select):hover,
.admin-body :where(.form-control, .form-select):hover {
    border-color: #bdcbd1;
}

.site-body :where(.form-control, .form-select):focus,
.admin-body :where(.form-control, .form-select):focus {
    border-color: var(--wc-primary);
    box-shadow: 0 0 0 3px rgba(7, 135, 180, .13);
}

.site-body textarea.form-control,
.admin-body textarea.form-control {
    min-height: 118px;
    line-height: 1.65;
    resize: vertical;
}

.site-body .form-label,
.admin-body .form-label {
    margin-bottom: 6px;
    color: #36505b;
    font-size: 13px;
    font-weight: 700;
}

.site-body .form-text,
.admin-body .form-text {
    color: #7b8e96;
    font-size: 11.5px;
    line-height: 1.55;
}

.site-body .input-group-text,
.admin-body .input-group-text {
    border-color: #d6e0e4;
    background: #f4f7f8;
    color: #657b84;
}

.site-body .form-check-input,
.admin-body .form-check-input {
    border-color: #b8c7cd;
}

.site-body .form-check-input:checked,
.admin-body .form-check-input:checked {
    border-color: var(--wc-primary);
    background-color: var(--wc-primary);
}

/* Buttons and compact controls */
.site-body .btn,
.admin-body .btn {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border-radius: 11px;
    font-weight: 700;
    line-height: 1.15;
}

.site-body .btn-sm,
.admin-body .btn-sm {
    min-height: 34px;
    border-radius: 9px;
}

.site-body .btn-lg,
.admin-body .btn-lg {
    min-height: 48px;
    border-radius: 13px;
}

.site-body .btn.rounded-pill,
.admin-body .btn.rounded-pill {
    border-radius: 12px !important;
}

.site-body .btn-primary,
.admin-body .btn-primary {
    border-color: var(--wc-primary);
    background: var(--wc-primary);
    box-shadow: 0 4px 12px rgba(7, 135, 180, .18);
}

.site-body .btn-primary:hover,
.site-body .btn-primary:focus,
.admin-body .btn-primary:hover,
.admin-body .btn-primary:focus {
    border-color: var(--wc-primary-d);
    background: var(--wc-primary-d);
    box-shadow: 0 6px 16px rgba(5, 107, 143, .22);
}

.site-body .btn-outline-primary,
.admin-body .btn-outline-primary {
    border-color: #9bc9da;
    background: #fff;
    color: var(--wc-primary-d);
}

.site-body .btn-outline-primary:hover,
.admin-body .btn-outline-primary:hover {
    border-color: var(--wc-primary);
    background: var(--wc-primary-50);
    color: var(--wc-primary-d);
}

.site-body .btn-warning,
.admin-body .btn-warning {
    border-color: var(--wc-accent);
    background: var(--wc-accent);
    color: #fff;
    box-shadow: none;
}

.site-body .btn-warning:hover,
.admin-body .btn-warning:hover {
    border-color: var(--wc-accent-d);
    background: var(--wc-accent-d);
    color: #fff;
}

.site-body .badge,
.admin-body .badge {
    border-radius: 7px;
    padding: .42em .62em;
    font-weight: 700;
}

/* Feedback, menus and overlays */
.site-body .alert,
.admin-body .alert {
    padding: 13px 15px;
    border-width: 1px;
    border-inline-start-width: 4px;
    border-radius: 12px;
    box-shadow: none;
}

.site-body .dropdown-menu,
.admin-body .dropdown-menu {
    padding: 7px;
    border: 1px solid var(--wc-border);
    border-radius: 14px;
    box-shadow: 0 18px 45px rgba(18, 49, 59, .15);
}

.site-body .dropdown-item,
.admin-body .dropdown-item {
    min-height: 38px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 9px;
    font-size: 13.5px;
}

.site-body .modal-content,
.admin-body .modal-content,
.site-body .offcanvas,
.admin-body .offcanvas {
    border: 1px solid var(--wc-border);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 26px 70px rgba(18, 49, 59, .20);
}

.site-body .modal-header,
.site-body .modal-footer,
.admin-body .modal-header,
.admin-body .modal-footer {
    border-color: var(--wc-border-2);
}

.site-body .breadcrumb,
.admin-body .breadcrumb {
    --bs-breadcrumb-divider-color: #a0afb5;
    margin-bottom: 16px;
    color: var(--wc-muted);
    font-size: 12px;
}

.site-body .pagination,
.admin-body .pagination {
    gap: 5px;
}

.site-body .page-link,
.admin-body .page-link {
    min-width: 38px;
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-color: var(--wc-border);
    border-radius: 9px !important;
    color: var(--wc-text-2);
}

.site-body .page-item.active .page-link,
.admin-body .page-item.active .page-link {
    border-color: var(--wc-primary);
    background: var(--wc-primary);
}

.site-body .nav-tabs,
.admin-body .nav-tabs {
    gap: 5px;
    border-bottom-color: var(--wc-border);
}

.site-body .nav-tabs .nav-link,
.admin-body .nav-tabs .nav-link {
    min-height: 41px;
    border: 0;
    border-bottom: 3px solid transparent;
    border-radius: 9px 9px 0 0;
    color: var(--wc-muted);
    font-weight: 700;
}

.site-body .nav-tabs .nav-link:hover,
.admin-body .nav-tabs .nav-link:hover {
    background: #f2f7f9;
    color: var(--wc-text);
}

.site-body .nav-tabs .nav-link.active,
.admin-body .nav-tabs .nav-link.active {
    border-bottom-color: var(--wc-primary);
    background: transparent;
    color: var(--wc-primary-d);
}

.site-body .accordion-item {
    overflow: hidden;
    border: 1px solid var(--wc-border);
    border-radius: 14px !important;
    background: #fff;
}

.site-body .accordion-button {
    min-height: 56px;
    background: #fff;
    color: var(--wc-text);
    font-weight: 700;
}

.site-body .accordion-button:not(.collapsed) {
    background: #f3f9fb;
    color: var(--wc-primary-d);
    box-shadow: inset 0 -1px var(--wc-border-2);
}

/* Consistent public page headers */
.site-body .site-main > .container > .text-center:first-child {
    max-width: 820px;
    margin-inline: auto;
    padding: 18px 20px 22px;
}

.site-body .site-main > .container > .text-center:first-child h1 {
    margin-bottom: 8px !important;
    color: var(--wc-brand-ink);
    font-size: clamp(1.65rem, 3vw, 2.25rem);
    letter-spacing: -.035em;
}

.site-body .site-main > .container > .text-center:first-child h1 > i:first-child {
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-inline-end: 7px;
    border: 1px solid #cce4ed;
    border-radius: 13px;
    background: var(--wc-primary-50);
    color: var(--wc-primary-d) !important;
    font-size: .58em;
    vertical-align: middle;
}

.site-body .site-main > .container > .text-center:first-child p {
    color: var(--wc-muted) !important;
    line-height: 1.7;
}

/* Authentication and verification */
.site-body:is(
    .site-route-login,
    .site-route-register,
    .site-route-forgot-password,
    .site-route-create-password,
    .site-route-verify,
    .site-route-verify-email,
    .site-route-google-complete
) .site-main {
    min-height: calc(100dvh - 150px);
    background: #eef5f7;
}

.site-body:is(
    .site-route-login,
    .site-route-register,
    .site-route-forgot-password,
    .site-route-create-password,
    .site-route-verify,
    .site-route-verify-email,
    .site-route-google-complete
) .site-main > .container > .row > [class*="col-"] {
    width: min(100%, 650px);
}

.site-route-login .login-card,
.site-route-register .login-card,
.site-route-forgot-password .site-main .card,
.site-route-create-password .site-main .card,
.site-route-verify .site-main .card,
.site-route-verify-email .site-main .card,
.site-route-google-complete .site-main .card {
    position: relative;
    overflow: hidden;
    padding: 32px;
    border-top: 4px solid var(--wc-primary) !important;
    box-shadow: 0 18px 48px rgba(18, 49, 59, .11) !important;
}

.site-route-login .login-title,
.site-route-register .login-title {
    color: var(--wc-brand-ink);
    font-size: clamp(1.55rem, 3vw, 2rem);
}

.site-route-login .login-sub,
.site-route-register .login-sub {
    max-width: 480px;
    margin-inline: auto;
    color: var(--wc-muted);
    line-height: 1.65;
}

.site-route-register .btn-group {
    gap: 8px;
    padding: 5px;
    border: 1px solid var(--wc-border);
    border-radius: 13px;
    background: #f5f8f9;
}

.site-route-register .btn-group .btn {
    border: 0;
    background: transparent;
    box-shadow: none;
}

.site-route-register .btn-check:checked + .btn {
    background: #fff;
    color: var(--wc-primary-d);
    box-shadow: 0 3px 10px rgba(18, 49, 59, .09);
}

/* Reading, legal and editorial pages */
.site-body:is(
    .site-route-terms,
    .site-route-privacy,
    .site-route-article
) .site-main > .container {
    max-width: 1160px;
}

.site-route-article article.card,
.site-body:is(.site-route-terms, .site-route-privacy) .site-main .card {
    border-top: 4px solid var(--wc-primary) !important;
}

.site-route-article article.card > h1,
.site-body:is(.site-route-terms, .site-route-privacy) .site-main .card h1 {
    color: var(--wc-brand-ink);
    line-height: 1.25;
}

.site-body .content-page {
    color: var(--wc-text-2);
    font-size: 16px;
    line-height: 1.85;
}

.site-body .content-page h2,
.site-body .content-page h3 {
    position: relative;
    padding-inline-start: 15px;
    color: var(--wc-brand-ink);
}

.site-body .content-page h2::before,
.site-body .content-page h3::before {
    content: "";
    position: absolute;
    top: .22em;
    bottom: .18em;
    inset-inline-start: 0;
    width: 4px;
    border-radius: 4px;
    background: var(--wc-primary);
}

.site-body .content-page blockquote {
    margin: 24px 0;
    padding: 16px 20px;
    border-inline-start: 4px solid var(--wc-accent);
    border-radius: 10px;
    background: var(--wc-warm);
    color: #075b7c;
}

/* Contact, packages, articles and event indexes */
.site-route-contact .site-main > .container,
.site-route-packages .site-main > .container,
.site-route-articles .site-main > .container {
    padding-top: clamp(28px, 4vw, 54px) !important;
}

.site-route-contact .contact-icon {
    border: 1px solid #cee5ed;
    border-radius: 13px;
    background: var(--wc-primary-50);
    color: var(--wc-primary-d);
}

.site-route-contact .card h5 {
    color: var(--wc-brand-ink);
    font-size: 17px;
}

.site-route-packages .package-card {
    border-radius: 18px;
    box-shadow: var(--wc-shadow);
}

.site-route-packages .package-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--wc-shadow-h);
}

.site-route-packages .package-head {
    border-bottom: 1px solid rgba(255,255,255,.16);
}

.site-route-packages .package-ribbon {
    border: 1px solid currentColor;
    border-radius: 8px;
    box-shadow: none;
}

.site-route-articles .article-card {
    border-radius: 17px;
    box-shadow: var(--wc-shadow);
}

.site-route-articles .article-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--wc-shadow-h);
}

.site-route-articles .article-thumb {
    background: #e7f2f6;
}

/* About page: distinctive, restrained and brand-led */
.page-about .about-hero {
    border-radius: 0 0 24px 24px;
    background: var(--wc-brand-deep);
    box-shadow: none;
}

.page-about .about-hero::before,
.page-about .about-cta-card::before {
    display: none;
}

.page-about .about-hero-badge {
    border-radius: 16px;
    box-shadow: none;
}

.page-about .about-stat-card,
.page-about .about-mission-card,
.page-about .about-feature-card {
    border-color: var(--wc-border);
    border-radius: 18px;
    box-shadow: var(--wc-shadow);
}

.page-about .about-stat-card:hover,
.page-about .about-feature-card:hover {
    transform: translateY(-2px);
    border-color: #b9d8e3;
    box-shadow: var(--wc-shadow-h);
}

.page-about .about-stat-icon,
.page-about .about-feature-icon,
.page-about .about-mission-item i {
    background: var(--wc-primary-50);
    box-shadow: none;
}

.page-about .about-stat-num {
    background: none;
    color: var(--wc-primary-d);
    -webkit-text-fill-color: currentColor;
}

.page-about .about-feature-card::before {
    background: var(--wc-primary);
}

.page-about .about-feature-card:hover .about-feature-icon {
    background: var(--wc-primary);
}

.page-about .about-step-num {
    background: var(--wc-primary);
    box-shadow: 0 0 0 6px var(--wc-primary-50);
}

.page-about .about-cta-card {
    border-radius: 22px;
    background: #075b76;
    box-shadow: 0 16px 38px rgba(7, 91, 118, .18);
}

/* Search, category and listing stay product-specific but share depth */
.page-search .filter-sidebar,
.page-category .filter-sidebar,
.page-listing .listing-details-card,
.page-listing .seller-card {
    border-color: var(--wc-border);
    border-radius: 18px;
    box-shadow: var(--wc-shadow);
}

.page-search .search-results-header,
.page-category .category-results-toolbar {
    border-color: var(--wc-border);
    box-shadow: var(--wc-shadow-xs);
}

/* Account, support and settings */
.site-body:is(
    .site-route-account-delete,
    .site-route-account-export,
    .site-route-blocked-users,
    .site-route-favorites,
    .site-route-my-listings,
    .site-route-notification-settings,
    .site-route-notifications,
    .site-route-sessions,
    .site-route-ticket,
    .site-route-tickets,
    .site-route-profile,
    .site-route-promote-listing,
    .site-route-report
) .site-main > .container {
    padding-top: clamp(22px, 3vw, 42px) !important;
}

.site-route-account-delete .card.border-danger {
    border-color: #edb5b5 !important;
    border-top: 4px solid var(--wc-danger) !important;
}

.site-route-favorites .listing-card,
.site-route-my-listings .listing-card {
    border-color: var(--wc-border);
}

.site-route-notifications .notif-shell,
.site-route-tickets .card,
.site-route-ticket .card,
.site-route-sessions .card,
.site-route-blocked-users .card {
    border-radius: 18px;
    box-shadow: var(--wc-shadow);
}

/* Empty and error states */
.site-body .error-page,
.offline-page .offline-card,
.site-body .empty-state,
.admin-body .empty-state {
    border: 1px solid var(--wc-border);
    border-radius: 20px;
    background: #fff;
    box-shadow: var(--wc-shadow);
}

.site-body .error-page {
    padding: clamp(36px, 7vw, 76px) 24px;
}

.site-body .error-code {
    color: var(--wc-primary-d);
    letter-spacing: -.08em;
}

/* Desktop public navigation */
@media (min-width: 992px) {
    .site-body .wc-desktop-header {
        border-bottom: 1px solid #dce5e8;
        background: rgba(255,255,255,.98) !important;
        box-shadow: 0 5px 18px rgba(18,49,59,.05) !important;
    }

    .site-body .wc-desktop-header::after {
        content: "";
        position: absolute;
        inset-inline-start: max(20px, calc((100vw - 1380px) / 2));
        bottom: -1px;
        width: 76px;
        height: 3px;
        border-radius: 3px 3px 0 0;
        background: var(--wc-primary);
    }

    .site-body .wc-desktop-header .megacat-link,
    .site-body .wc-desktop-header .navbar-nav > .nav-item > .nav-link {
        color: #36505a;
    }

    .site-body .search-strip {
        border-bottom-color: var(--wc-border) !important;
        background: #fff !important;
        box-shadow: 0 3px 12px rgba(18,49,59,.025) !important;
    }

    .site-body .search-strip .nav-search {
        border: 1px solid var(--wc-border);
        background: #f4f7f8;
        box-shadow: none;
    }

    .site-body .site-main > .container {
        width: min(100% - 48px, 1320px);
        max-width: 1320px;
    }
}

/* Administration shell */
.admin-body {
    background: #f2f5f6;
    color: var(--wc-text);
}

.admin-body .admin-wrap {
    min-height: 100dvh;
    background: #f2f5f6;
}

.admin-body .admin-sidebar,
.admin-body .admin-sidebar.offcanvas-lg,
.admin-body .admin-topbar {
    background: var(--wc-brand-deep);
}

.admin-body .admin-sidebar {
    border-inline-start: 0;
    border-inline-end: 1px solid rgba(255,255,255,.06);
}

.admin-body .admin-brand {
    padding-block: 16px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.admin-body .admin-menu-group {
    border-top-color: rgba(255,255,255,.055);
    color: #76909a;
    letter-spacing: .03em;
}

.admin-body .admin-sidebar a {
    min-height: 40px;
    margin: 1px 9px;
    padding: 9px 11px;
    border: 0;
    border-radius: 9px;
    color: #cad7dc;
    font-size: 13px;
}

.admin-body .admin-sidebar a:hover {
    background: rgba(255,255,255,.07);
}

.admin-body .admin-sidebar a.active {
    border: 0;
    background: #fff;
    color: var(--wc-brand-ink);
}

.admin-body .admin-sidebar a.active i {
    color: var(--wc-primary-d);
}

.admin-body .admin-search-input {
    min-height: 40px;
    border-color: rgba(255,255,255,.12);
    border-radius: 10px;
    background: rgba(255,255,255,.075);
}

.admin-body .admin-content {
    min-width: 0;
    padding: 24px clamp(18px, 2.6vw, 38px) 44px;
}

.admin-body .admin-header {
    margin-bottom: 24px;
    padding: 12px 16px;
    border-radius: 16px;
    box-shadow: var(--wc-shadow-xs);
}

.admin-body .admin-header-user {
    border-radius: 11px;
}

.admin-body .admin-content > h1,
.admin-body .admin-content > .d-flex:first-of-type h1,
.admin-body .admin-content > .d-flex:first-of-type .h3 {
    color: var(--wc-brand-ink);
    font-weight: 800;
    letter-spacing: -.035em;
}

.admin-body .admin-content > .d-flex:first-of-type {
    gap: 14px;
    margin-bottom: 20px !important;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--wc-border);
}

.admin-body .table-responsive {
    overflow: auto;
    border: 1px solid var(--wc-border);
    border-radius: 14px;
    background: #fff;
}

.admin-body .table {
    margin-bottom: 0;
}

.admin-body .table > thead {
    background: #f5f8f9;
    color: #637983;
    font-size: 11px;
    letter-spacing: .03em;
}

.admin-body .table > tbody > tr:hover {
    background: #f6fafb;
}

.admin-body .stat-card {
    border: 1px solid var(--wc-border);
    border-radius: 16px;
    box-shadow: var(--wc-shadow);
}

.admin-body .stat-card::before {
    width: 4px;
    background: var(--wc-primary);
}

.admin-body .dashboard-range {
    border-radius: 11px;
}

.admin-body .dashboard-range a {
    border-radius: 8px;
}

@media (min-width: 992px) {
    .admin-body .admin-wrap > .row {
        min-height: 100dvh;
    }

    .admin-body .admin-sidebar {
        position: sticky;
        top: 0;
        height: 100dvh;
        overflow: hidden;
        padding: 0;
    }

    .admin-body .admin-sidebar > .offcanvas-body {
        min-height: 0;
        height: 100%;
        overflow-y: auto;
        overscroll-behavior: contain;
        padding-bottom: 28px !important;
        scrollbar-gutter: stable;
    }
}

/* Mobile consistency */
@media (max-width: 991.98px) {
    .site-body .site-main {
        overflow: hidden;
    }

    .site-body .site-main > .container {
        max-width: 100%;
        padding-inline: 13px;
    }

    .site-body .card:not(.listing-card),
    .admin-body .card {
        border-radius: 16px;
        box-shadow: 0 5px 16px rgba(18, 49, 59, .045);
    }

    .site-body .site-main > .container > .text-center:first-child {
        padding: 12px 8px 17px;
    }

    .site-body .site-main > .container > .text-center:first-child h1 {
        font-size: 1.55rem;
    }

    .site-body .site-main > .container > .text-center:first-child h1 > i:first-child {
        width: 38px;
        height: 38px;
        border-radius: 11px;
    }

    .site-route-login .login-card,
    .site-route-register .login-card,
    .site-route-forgot-password .site-main .card,
    .site-route-create-password .site-main .card,
    .site-route-verify .site-main .card,
    .site-route-verify-email .site-main .card,
    .site-route-google-complete .site-main .card {
        padding: 22px 17px;
        border-top-width: 3px !important;
        box-shadow: 0 8px 24px rgba(18, 49, 59, .07) !important;
    }

    .site-route-register .row.g-2 > .col-6 {
        width: 100%;
    }

    .site-body .content-page {
        font-size: 14.5px;
        line-height: 1.8;
    }

    .site-body .content-page h2 {
        font-size: 1.28rem;
    }

    .page-about .about-hero {
        border-radius: 0 0 19px 19px;
    }

    .page-about .about-stat-card,
    .page-about .about-mission-card,
    .page-about .about-feature-card,
    .page-about .about-cta-card {
        border-radius: 16px;
    }

    .admin-body .admin-topbar {
        min-height: 58px;
        padding: 9px 12px;
        box-shadow: 0 4px 16px rgba(18,49,59,.18);
    }

    .admin-body .admin-content {
        padding: 16px 12px 34px;
    }

    .admin-body .admin-content > .d-flex:first-of-type {
        align-items: flex-start !important;
        flex-direction: column;
        padding-bottom: 13px;
    }

    .admin-body .admin-content > .d-flex:first-of-type > :last-child {
        width: 100%;
    }

    .admin-body .admin-sidebar.offcanvas-lg {
        width: min(88vw, 310px);
        border-radius: 0;
    }

    .admin-body .admin-sidebar .offcanvas-body {
        min-height: 0;
        overflow-y: auto;
        padding-bottom: calc(28px + env(safe-area-inset-bottom)) !important;
    }
}

@media (max-width: 575.98px) {
    .site-body .btn-lg,
    .admin-body .btn-lg {
        min-height: 46px;
    }

    .site-body .modal-dialog {
        margin: 8px;
    }

    .site-body .modal-content {
        border-radius: 16px;
    }

    .site-route-contact .site-main .card,
    .site-route-packages .package-card {
        border-radius: 15px;
    }
}
}
/* Real estate map view */
.category-results-layout.is-realestate-map-mode > #filterSidebar {
    display: none;
}
.page-re-map-mode .category-page-shell {
    max-width: none;
    width: 100%;
    padding-inline: clamp(10px, 1.4vw, 22px);
}
.page-re-map-mode .category-breadcrumb,
.page-re-map-mode .category-hero {
    display: none;
}
.page-re-map-mode .category-rich-navigation {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px !important;
    padding: 8px 10px;
    border-radius: 14px;
    overflow: visible;
}
.page-re-map-mode .category-rich-navigation .veh-tabs {
    flex: 1 1 auto;
    min-width: 0;
    max-width: none;
    margin: 0;
    padding: 0 2px 2px;
    border-bottom: 0;
    scroll-padding-inline: 12px;
}
.page-re-map-mode .category-rich-navigation .veh-qf {
    flex: 0 0 auto;
    max-width: min(42vw, 520px);
    flex-wrap: nowrap;
    justify-content: flex-start;
    overflow-x: auto;
    scrollbar-width: none;
    padding-bottom: 2px;
}
.page-re-map-mode .category-rich-navigation .veh-qf::-webkit-scrollbar {
    display: none;
}
.page-re-map-mode .category-rich-navigation .veh-tab,
.page-re-map-mode .category-rich-navigation .veh-qf-btn {
    min-height: 36px;
    padding: 7px 12px;
    font-size: 12.5px;
}
.page-re-map-mode .category-results-toolbar {
    min-height: 44px;
    margin-bottom: 12px;
    padding: 5px 8px 5px 12px;
    border-radius: 13px;
}
.page-re-map-mode .category-results-summary span {
    display: none;
}
.page-re-map-mode .category-results-toolbar .view-toggle a {
    min-height: 32px;
    padding: 0 10px;
    font-size: 12px;
}
.category-results-layout.is-realestate-map-mode > .category-results-area {
    flex: 0 0 100%;
    width: 100%;
    max-width: 100%;
}
.realestate-map-layout {
    direction: ltr;
    display: grid;
    grid-template-columns: minmax(460px, 50vw) minmax(0, 1fr);
    gap: 20px;
    align-items: start;
}
.realestate-map-panel,
.realestate-map-results {
    direction: rtl;
    min-width: 0;
}
.realestate-map-panel {
    position: sticky;
    top: 84px;
}
.realestate-map-strip,
.realestate-results-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
    padding: 10px 12px;
    border: 1px solid #dfe8ec;
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .05);
}
.realestate-map-strip strong,
.realestate-results-head strong {
    display: block;
    color: #102a33;
    font-weight: 900;
    line-height: 1.25;
}
.realestate-map-strip span,
.realestate-results-head span {
    display: block;
    margin-top: 2px;
    color: #647987;
    font-size: 12px;
    font-weight: 650;
}
.realestate-area-reset {
    min-height: 34px;
    flex: 0 0 auto;
    padding: 0 12px;
    border: 1px solid #008bc2;
    border-radius: 999px;
    color: #007da9;
    background: #f0fbff;
    font-size: 12px;
    font-weight: 850;
}
.realestate-map {
    direction: ltr;
    position: relative;
    height: calc(100vh - 154px);
    min-height: 660px;
    max-height: 820px;
    overflow: hidden;
    border: 1px solid var(--wc-border, #e5e7eb);
    border-radius: 16px;
    background: #edf5f7;
    box-shadow: 0 12px 34px rgba(15, 23, 42, .08);
}
.realestate-map.leaflet-container {
    font-family: inherit;
    touch-action: pan-x pan-y;
}
.realestate-map .leaflet-pane,
.realestate-map .leaflet-map-pane,
.realestate-map .leaflet-tile,
.realestate-map .leaflet-marker-icon,
.realestate-map .leaflet-marker-shadow,
.realestate-map .leaflet-tile-container,
.realestate-map .leaflet-pane > svg,
.realestate-map .leaflet-pane > canvas,
.realestate-map .leaflet-zoom-box,
.realestate-map .leaflet-image-layer,
.realestate-map .leaflet-layer {
    position: absolute;
    left: 0;
    top: 0;
}
.realestate-map .leaflet-pane,
.realestate-map .leaflet-layer,
.realestate-map .leaflet-tile-container,
.realestate-map .leaflet-marker-pane,
.realestate-map .leaflet-shadow-pane,
.realestate-map .leaflet-overlay-pane,
.realestate-map .leaflet-tooltip-pane,
.realestate-map .leaflet-popup-pane {
    direction: ltr;
}
.realestate-map .leaflet-container {
    overflow: hidden;
}
.realestate-map .leaflet-map-pane {
    z-index: 400;
}
.realestate-map .leaflet-tile-pane {
    z-index: 200;
}
.realestate-map .leaflet-overlay-pane {
    z-index: 400;
}
.realestate-map .leaflet-shadow-pane {
    z-index: 500;
}
.realestate-map .leaflet-marker-pane {
    z-index: 600;
}
.realestate-map .leaflet-tooltip-pane {
    z-index: 650;
}
.realestate-map .leaflet-popup-pane {
    z-index: 700;
}
.realestate-map .leaflet-tile {
    width: 256px;
    height: 256px;
    max-width: none !important;
    user-select: none;
    -webkit-user-drag: none;
}
.realestate-map .leaflet-marker-icon,
.realestate-map .leaflet-marker-shadow {
    display: block;
}
.realestate-map .leaflet-control-container .leaflet-top,
.realestate-map .leaflet-control-container .leaflet-bottom {
    position: absolute;
    z-index: 1000;
    pointer-events: none;
}
.realestate-map .leaflet-control-container .leaflet-top {
    top: 10px;
}
.realestate-map .leaflet-control-container .leaflet-bottom {
    bottom: 10px;
}
.realestate-map .leaflet-control-container .leaflet-left {
    left: 10px;
}
.realestate-map .leaflet-control-container .leaflet-right {
    right: 10px;
}
.realestate-map .leaflet-control {
    position: relative;
    z-index: 1000;
    pointer-events: auto;
    clear: both;
}
.realestate-map .leaflet-left .leaflet-control {
    float: left;
}
.realestate-map .leaflet-right .leaflet-control {
    float: right;
}
.realestate-map .leaflet-control-zoom {
    display: grid;
    gap: 6px;
    border: 0;
    border-radius: 0;
    overflow: hidden;
    background: transparent;
    box-shadow: none;
}
.realestate-map .leaflet-control-zoom a {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border: 1px solid rgba(15, 23, 42, .12);
    border-radius: 11px;
    background: rgba(255, 255, 255, .94);
    color: #12313c;
    font-size: 17px;
    font-weight: 900;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    box-shadow: 0 8px 22px rgba(15, 23, 42, .14);
    backdrop-filter: blur(8px);
    transition: transform .14s ease, background-color .14s ease, color .14s ease;
}
.realestate-map .leaflet-control-zoom a:hover {
    transform: translateY(-1px);
    background: #12313c;
    color: #fff;
}
.realestate-map .leaflet-control-zoom a + a {
    border-top: 1px solid rgba(15, 23, 42, .12);
}
.realestate-map .leaflet-control-attribution {
    margin: 0 !important;
    padding: 3px 7px;
    border-radius: 10px;
    background: rgba(255, 255, 255, .82);
    color: rgba(15, 23, 42, .68);
    font-size: 10.5px;
    box-shadow: 0 5px 16px rgba(15, 23, 42, .1);
    backdrop-filter: blur(8px);
}
.realestate-map .leaflet-popup {
    position: absolute;
    margin-bottom: 20px;
}
.realestate-map .leaflet-popup-content-wrapper {
    overflow: hidden;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .2);
}
.realestate-map .leaflet-popup-content {
    margin: 0;
}
.realestate-map .leaflet-popup-tip-container,
.realestate-map .leaflet-popup-close-button {
    display: none;
}
.realestate-map-caption {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-top: 8px;
    padding-inline: 4px;
    color: var(--wc-muted, #64748b);
    font-size: 12px;
}
.realestate-map-caption i {
    color: var(--category-accent, var(--wc-primary, #087ea4));
}
.realestate-map-empty {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    color: var(--wc-muted, #64748b);
    text-align: center;
    font-weight: 700;
}
.realestate-price-marker {
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: auto;
}
.realestate-price-marker span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 74px;
    min-height: 26px;
    padding: 0 8px;
    border: 1px solid rgba(15, 23, 42, .12);
    border-radius: 999px;
    background: rgba(255, 255, 255, .96);
    color: #0f2530;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .16);
    font-size: 11.5px;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transform: translateY(0);
    backdrop-filter: blur(8px);
    transition: opacity .16s ease, transform .16s ease, border-color .15s ease, background-color .15s ease, color .15s ease;
}
.realestate-price-marker.is-hovered span,
.realestate-price-marker:hover span {
    transform: translateY(-3px) scale(1.04);
    border-color: var(--category-accent, #087ea4);
    background: var(--category-accent, #087ea4);
    color: #fff;
}
.realestate-price-marker.is-muted span {
    opacity: 0;
    transform: translateY(6px) scale(.82);
    pointer-events: none;
}
.realestate-map.is-zoomed-out .realestate-price-marker:not(.is-selected-area),
.realestate-map.is-zoomed-mid .realestate-price-marker:not(.is-hovered):not(.is-selected-area) {
    pointer-events: none;
}
.realestate-map.is-zoomed-out .realestate-price-marker:not(.is-selected-area) span {
    opacity: 0;
    transform: translateY(6px) scale(.76);
}
.realestate-map.is-zoomed-mid .realestate-price-marker:not(.is-hovered):not(.is-selected-area) span {
    opacity: .62;
    transform: scale(.88);
}
.realestate-area-shape {
    cursor: pointer;
    stroke-linejoin: round;
    transition: fill-opacity .16s ease, opacity .16s ease, stroke-width .16s ease;
}
.realestate-area-shape:hover {
    fill-opacity: .2;
}
.realestate-map.is-zoomed-out .realestate-area-shape.is-low-area-shape {
    opacity: 0;
    pointer-events: none;
}
.realestate-area-hover {
    border: 0;
    border-radius: 10px;
    padding: 6px 9px;
    color: #fff;
    background: #12313c;
    box-shadow: 0 10px 26px rgba(15, 23, 42, .22);
    direction: rtl;
    font-family: inherit;
    font-size: 12px;
    font-weight: 850;
}
.realestate-area-hover::before {
    display: none;
}
.realestate-map-results [data-listing-card][hidden] {
    display: none !important;
}
.map-popup-card {
    display: block;
    width: 230px;
    color: inherit;
    text-decoration: none;
    direction: rtl;
}
.map-popup-image {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: #eef2f7;
}
.map-popup-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.map-popup-body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding: 10px 12px 12px;
}
.map-popup-card.is-no-image .map-popup-body {
    padding-top: 12px;
}
.map-popup-body strong {
    color: var(--wc-primary, #087ea4);
    font-size: 15px;
    line-height: 1.2;
}
.map-popup-body em {
    margin-top: 4px;
    color: var(--wc-text, #111827);
    font-style: normal;
    font-weight: 700;
    line-height: 1.3;
}
.map-popup-specs {
    margin-top: 4px;
    color: var(--wc-muted, #64748b);
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.realestate-map-results .category-listings-grid {
    --bs-gutter-x: 14px;
}
.realestate-map-results .listing-col-5 {
    width: 50%;
}
[data-listing-card].is-map-active .listing-card {
    outline: 2px solid var(--category-accent, #087ea4);
    outline-offset: 3px;
    border-radius: 16px;
}

@media (min-width: 1400px) {
    .realestate-map-layout {
        grid-template-columns: minmax(540px, 50vw) minmax(0, 1fr);
    }
}

@media (max-width: 1199.98px) {
    .page-re-map-mode .category-page-shell {
        max-width: 960px;
        padding-inline: var(--bs-gutter-x, .75rem);
    }
    .page-re-map-mode .category-hero {
        display: block;
    }
    .page-re-map-mode .category-rich-navigation {
        display: block;
        padding: 9px 10px;
    }
    .page-re-map-mode .category-rich-navigation .veh-tabs {
        max-width: none;
        margin-inline: -2px;
        padding-bottom: 8px;
        margin-bottom: 10px;
        border-bottom: 1px solid var(--wc-border-2);
    }
    .page-re-map-mode .category-rich-navigation .veh-qf {
        flex-wrap: wrap;
        justify-content: flex-start;
        overflow: visible;
    }
    .realestate-map-layout {
        grid-template-columns: 1fr;
    }
    .realestate-map-panel {
        position: relative;
        top: auto;
    }
    .realestate-map {
        height: 420px;
        min-height: 360px;
    }
}

@media (max-width: 575.98px) {
    .realestate-map-layout {
        gap: 12px;
    }
    .realestate-map {
        height: 340px;
        min-height: 300px;
        border-radius: 14px;
    }
    .realestate-map-caption {
        font-size: 11px;
    }
    .realestate-map-results .listing-col-5 {
        width: 100%;
    }
    .category-results-toolbar .view-toggle a {
        padding-inline: 8px;
    }
}

@media (max-width: 767.98px) {
    .category-results-toolbar .realestate-map-toggle,
    .realestate-map-panel {
        display: none !important;
    }
    .realestate-map-layout {
        direction: rtl;
        display: block;
    }
    .realestate-map-results {
        direction: rtl;
        width: 100%;
    }

    .page-category-realestate .listing-card:not(.is-list) .meta.specs {
        flex-wrap: wrap;
        row-gap: 3px;
        overflow: visible;
    }
}

/* ===== Category filters and result layout hardening ===== */
.page-category .category-active-filters {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: -4px 0 16px;
    padding: 10px 12px;
    border: 1px solid #dfe8ec;
    border-radius: 16px;
    background: rgba(255, 255, 255, .86);
    box-shadow: 0 6px 18px rgba(15, 23, 42, .04);
}
.page-category .category-active-filters-label {
    flex: 0 0 auto;
    color: #526a75;
    font-size: 12px;
    font-weight: 800;
}
.page-category .category-active-filter-list {
    min-width: 0;
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    gap: 7px;
}
.page-category .active-filter-chip {
    min-height: 31px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    max-width: min(100%, 280px);
    padding: 0 11px;
    border: 1px solid color-mix(in srgb, var(--category-accent, #087ea4) 24%, #dbe6eb);
    border-radius: 999px;
    background: color-mix(in srgb, var(--category-soft, #e8f6fa) 68%, #fff);
    color: var(--category-accent, #087ea4);
    font-size: 12px;
    font-weight: 750;
    text-decoration: none;
}
.page-category .active-filter-chip span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.page-category .active-filter-chip i {
    flex: 0 0 auto;
    font-size: 10px;
}
.page-category .category-clear-filters {
    flex: 0 0 auto;
    min-height: 31px;
    display: inline-flex;
    align-items: center;
    padding: 0 11px;
    border-radius: 999px;
    color: #6b7f89;
    font-size: 12px;
    font-weight: 750;
    text-decoration: none;
}
.page-category .category-clear-filters:hover {
    background: #f1f5f7;
    color: var(--category-accent, #087ea4);
}
.page-category .filter-sidebar {
    border: 1px solid #dfe8ec;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 9px 25px rgba(15, 23, 42, .055);
}
.page-category .filter-sidebar hr {
    margin: 18px 0;
    border-color: #dfe8ec;
    opacity: 1;
}
.page-category .category-filter-group {
    position: relative;
    margin: 0 0 14px;
    padding: 13px;
    border: 1px solid #e3eaee;
    border-radius: 16px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.96), rgba(249,252,253,.96));
}
.page-category .category-filter-group:last-of-type {
    margin-bottom: 16px;
}
.page-category .category-filter-group-compact {
    padding-bottom: 10px;
}
.page-category .category-filter-group-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 12px;
    color: #19323e;
    font-size: 13px;
    font-weight: 900;
}
.page-category .category-filter-group-title i {
    width: 27px;
    height: 27px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    color: var(--category-accent, #087ea4);
    background: color-mix(in srgb, var(--category-soft, #e8f6fa) 76%, #fff);
}
.page-category .category-filter-group .mb-3:last-child,
.page-category .category-filter-group .form-check:last-child {
    margin-bottom: 0 !important;
}
.page-category .filter-sidebar .mb-3 {
    margin-bottom: 15px !important;
}
.page-category .filter-sidebar .form-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 7px;
    color: #536974;
    font-size: 12px;
    font-weight: 800;
}
.page-category .filter-sidebar .form-control,
.page-category .filter-sidebar .form-select {
    min-height: 40px;
    border-color: #d7e2e7;
    border-radius: 12px;
    color: #19323e;
    font-size: 13px;
    box-shadow: none;
}
.page-category .filter-sidebar .form-control:focus,
.page-category .filter-sidebar .form-select:focus {
    border-color: var(--category-accent, #087ea4);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--category-accent, #087ea4) 16%, transparent);
}
.page-category .filter-sidebar .form-check {
    min-height: 34px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.page-category .filter-sidebar .form-check-input {
    float: none;
    margin: 0;
}
.page-category .filter-sidebar .btn-primary {
    min-height: 42px;
    border-radius: 12px;
    font-weight: 800;
}
.page-category .filter-sidebar .btn-link {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #6f828b;
    font-weight: 750;
    text-decoration: none;
}
.page-category .wc-range {
    height: 34px;
}
.page-category .category-range-field {
    padding: 2px 0 0;
}
.page-category .wc-range-track {
    top: 15px;
    height: 5px;
    border-radius: 999px;
    background: #dde7eb;
}
.page-category .wc-range-fill {
    background: var(--category-accent, #087ea4);
}
.page-category .wc-range input[type=range]::-webkit-slider-thumb {
    border-color: var(--category-accent, #087ea4);
    box-shadow: 0 2px 6px rgba(15, 23, 42, .18);
}
.page-category .wc-range input[type=range]::-moz-range-thumb {
    border-color: var(--category-accent, #087ea4);
    box-shadow: 0 2px 6px rgba(15, 23, 42, .18);
}
.page-category .category-range-field .d-flex,
.page-category .category-range-pair {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 8px;
}
.page-category .category-range-field .form-control,
.page-category .category-range-pair .form-control {
    text-align: center;
    font-weight: 750;
}
.page-category .wc-chips {
    gap: 7px;
}
.page-category .wc-chip span,
.page-category .wc-swatch {
    border-radius: 999px;
    font-weight: 750;
}
.page-category .category-results-toolbar,
.page-category .category-rich-navigation,
.page-category .category-subcats-panel {
    max-width: 100%;
}
.page-category .category-listings-grid {
    align-items: stretch;
}
.page-category .category-listings-grid > [class*="col-"] {
    min-width: 0;
}

@media (min-width: 768px) {
    .page-category .category-listings-grid > .listing-col-5 {
        width: 33.333333%;
    }
}

@media (min-width: 1200px) {
    .page-category .category-listings-grid > .listing-col-5 {
        width: 25%;
    }
    .page-category-realestate .realestate-map-results .listing-col-5 {
        width: 50%;
    }
}

@media (min-width: 1500px) {
    .page-category .category-listings-grid > .listing-col-5 {
        width: 20%;
    }
    .page-category-realestate .realestate-map-results .listing-col-5 {
        width: 50%;
    }
}

/* Compact cards only inside the real-estate map results pane. */
@media (min-width: 768px) {
    .page-re-map-mode .realestate-map-results .category-listings-grid {
        --bs-gutter-x: 10px;
        --bs-gutter-y: 12px;
    }
    .page-re-map-mode .realestate-map-results .listing-card:not(.is-list) .img-wrap {
        aspect-ratio: 16 / 10;
        min-height: 0;
    }
    .page-re-map-mode .realestate-map-results .listing-card:not(.is-list) .body {
        padding: 7px 8px 2px;
        gap: 2px;
    }
    .page-re-map-mode .realestate-map-results .listing-card:not(.is-list) .title {
        min-height: 0;
        margin-bottom: 4px;
        font-size: 12px;
        line-height: 1.28;
        -webkit-line-clamp: 1;
    }
    .page-re-map-mode .realestate-map-results .listing-card:not(.is-list) .meta {
        font-size: 10.5px;
        line-height: 1.35;
    }
    .page-re-map-mode .realestate-map-results .listing-card:not(.is-list) .meta.specs span:not(:last-child)::after {
        margin-inline: 4px;
    }
    .page-re-map-mode .realestate-map-results .listing-card:not(.is-list) .price {
        padding: 0 8px 8px;
        font-size: 14px;
        line-height: 1.18;
    }
}

@media (min-width: 1200px) {
    .page-re-map-mode .realestate-map-results .category-listings-grid > .listing-col-5 {
        width: 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }
}

@media (max-width: 991.98px) {
    .page-category .category-active-filters {
        align-items: flex-start;
        gap: 8px;
        margin: 0 0 10px;
        padding: 9px;
        border-radius: 14px;
    }
    .page-category .category-active-filters-label {
        padding-top: 7px;
        font-size: 11px;
    }
    .page-category .category-active-filter-list {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 2px;
        scrollbar-width: none;
    }
    .page-category .category-active-filter-list::-webkit-scrollbar {
        display: none;
    }
    .page-category .active-filter-chip {
        flex: 0 0 auto;
        max-width: 230px;
    }
    .page-category .category-clear-filters {
        padding-inline: 8px;
        font-size: 11px;
    }
    #filterSidebar.is-open {
        display: block !important;
        position: fixed;
        inset: 0;
        z-index: 2050;
        padding: 0;
        background: rgba(15, 23, 42, .42);
    }
    #filterSidebar.is-open .filter-sidebar {
        inset: auto 0 0 0;
        width: 100%;
        max-height: min(86vh, 720px);
        padding: 18px 16px calc(18px + env(safe-area-inset-bottom));
        border: 0;
        border-radius: 22px 22px 0 0;
        overflow-y: auto;
        box-shadow: 0 -18px 45px rgba(15, 23, 42, .24);
    }
    #filterSidebar.is-open .filter-sheet-head {
        position: sticky;
        top: -18px;
        z-index: 3;
        margin: -18px -16px 14px !important;
        padding: 15px 16px 12px;
        border-bottom: 1px solid #e1e8ec;
        background: rgba(255,255,255,.97);
    }
    .page-category .category-filter-group {
        margin-bottom: 12px;
        padding: 12px;
        border-radius: 15px;
    }
    .page-category .category-filter-group-title {
        margin-bottom: 10px;
        font-size: 12.5px;
    }
    .page-category .category-filter-group-title i {
        width: 25px;
        height: 25px;
        border-radius: 8px;
    }
    .page-category .filter-sidebar .form-control,
    .page-category .filter-sidebar .form-select {
        min-height: 43px;
        font-size: 14px;
    }
    .page-category .filter-sidebar .btn-primary {
        min-height: 46px;
        font-size: 14px;
    }
    .page-category .veh-qf-pop {
        z-index: 2060;
    }
}

@media (max-width: 767.98px) {
    .page-category .category-listings-grid > .listing-col-5 {
        width: 50% !important;
        flex: 0 0 50%;
        max-width: 50%;
    }
    .page-category .category-listings-grid > .col-12 {
        width: 100% !important;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .page-category .listing-card:not(.is-list) {
        min-width: 0;
    }
    .page-category .listing-card:not(.is-list) .title,
    .page-category .listing-card:not(.is-list) .price,
    .page-category .listing-card:not(.is-list) .meta {
        min-width: 0;
        overflow-wrap: anywhere;
    }
    .page-category .listing-card:not(.is-list) .price {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .page-category.page-category-realestate .category-listings-grid > .listing-col-5,
    .page-category.page-category-realestate .realestate-map-results .listing-col-5 {
        width: 50% !important;
        flex: 0 0 50%;
        max-width: 50%;
    }
}

/* Real-estate needs a denser mobile browsing surface: filters stay horizontal,
   map-only helper chrome is hidden, and cards clear the fixed app navigation. */
@media (max-width: 767.98px) {
    body.page-category-realestate {
        padding-bottom: calc(var(--wc-mobile-nav-h) + 24px + env(safe-area-inset-bottom));
    }

    .page-category-realestate .category-page-shell {
        padding-inline: 10px !important;
        padding-bottom: calc(var(--wc-mobile-nav-h) + 42px + env(safe-area-inset-bottom)) !important;
    }

    .page-category-realestate .category-breadcrumb {
        display: none;
    }

    .page-category-realestate .category-hero {
        display: none;
    }

    .page-category-realestate .category-rich-navigation {
        margin-bottom: 10px !important;
        padding: 9px 10px 10px !important;
        border-radius: 15px;
        overflow: hidden;
    }

    .page-category-realestate .category-rich-navigation .veh-tabs {
        margin: 0;
        padding: 0 0 9px;
        gap: 5px;
        border-bottom: 1px solid #e5edf1;
        scroll-padding-inline: 10px;
        -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 18px, #000 calc(100% - 26px), transparent 100%);
        mask-image: linear-gradient(90deg, transparent 0, #000 18px, #000 calc(100% - 26px), transparent 100%);
    }

    .page-category-realestate .category-rich-navigation .veh-qf {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        justify-content: stretch;
        max-width: 100%;
        overflow: visible;
        gap: 7px;
        padding: 9px 0 0;
    }

    .page-category-realestate .category-rich-navigation .veh-qf::-webkit-scrollbar {
        display: none;
    }

    .page-category-realestate .category-rich-navigation .veh-qf-item,
    .page-category-realestate .category-rich-navigation .veh-qf-more,
    .page-category-realestate .category-rich-navigation .category-sort-form-quick {
        min-width: 0;
    }

    .page-category-realestate .category-rich-navigation .veh-tab {
        flex: 0 0 auto;
        width: auto;
        min-height: 32px;
        max-width: 128px;
        justify-content: center;
        padding: 5px 9px;
        font-size: 11px;
        white-space: nowrap;
    }

    .page-category-realestate .category-rich-navigation .veh-tab i {
        flex: 0 0 auto;
        font-size: 12px;
    }

    .page-category-realestate .category-rich-navigation .veh-qf-btn {
        width: 100%;
        min-height: 35px;
        justify-content: center;
        padding: 6px 8px;
        font-size: 11.5px;
        white-space: nowrap;
    }

    .page-category-realestate .category-rich-navigation .veh-qf-btn i {
        flex: 0 0 auto;
    }

    .page-category-realestate .category-rich-navigation .veh-qf-btn .veh-qf-badge {
        flex: 0 0 auto;
    }

    .page-category-realestate .category-rich-navigation .category-sort-form-quick {
        position: relative;
        width: 100%;
        min-height: 35px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        padding: 6px 8px;
        border: 1px solid var(--wc-border, #d7e2e7);
        border-radius: 10px;
        background: #fff;
        box-shadow: none;
        overflow: hidden;
    }

    .page-category-realestate .category-rich-navigation .category-sort-form-quick label {
        min-width: 0;
        min-height: 0;
        padding: 0;
        border-radius: 0;
        background: transparent;
        color: var(--wc-text-2, #334155);
        font-size: 11.5px;
        font-weight: 800;
        pointer-events: none;
    }

    .page-category-realestate .category-rich-navigation .category-sort-form-quick::after {
        content: "";
        width: 7px;
        height: 7px;
        flex: 0 0 auto;
        border-inline-end: 1.5px solid #78909c;
        border-bottom: 1.5px solid #78909c;
        transform: rotate(45deg) translateY(-1px);
        pointer-events: none;
    }

    .page-category-realestate .category-rich-navigation .category-sort-form-quick .form-select {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        cursor: pointer;
    }

    .page-category-realestate .realestate-results-head {
        display: none;
    }

    .page-category-realestate .category-results-toolbar {
        position: relative;
        z-index: 2;
        margin-bottom: 10px;
    }

    .page-category-realestate .category-listings-grid {
        margin-inline: 0;
    }

    .page-category-realestate .wc-pagination {
        margin-bottom: calc(var(--wc-mobile-nav-h) + 24px + env(safe-area-inset-bottom));
    }
}