/* ========== VARIABLES ========== */
:root {
    --primary: #e84393;
    --primary-dark: #d63384;
    --primary-light: #f8d7e8;
    --secondary: #6c5ce7;
    --dark: #2d3436;
    --gray-900: #2d3436;
    --gray-700: #636e72;
    --gray-500: #b2bec3;
    --gray-300: #dfe6e9;
    --gray-100: #f5f6fa;
    --white: #ffffff;
    --success: #00b894;
    --warning: #fdcb6e;
    --danger: #d63031;
    --radius: 12px;
    --radius-sm: 8px;
    --shadow: 0 2px 8px rgba(0,0,0,0.08);
    --shadow-lg: 0 8px 30px rgba(0,0,0,0.12);
    --transition: all 0.2s ease;
}

/* ========== UTILITIES ========== */
.show-mobile { display: none; }
@media (max-width: 768px) {
    .hide-mobile { display: none !important; }
    .show-mobile { display: inline !important; }
}

/* ========== RESET ========== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    color: var(--dark);
    background: var(--gray-100);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}
a { text-decoration: none; color: inherit; }
ul, ol { list-style: none; }
img { max-width: 100%; height: auto; display: block; }
button, input, select, textarea {
    font-family: inherit;
    font-size: inherit;
    border: none;
    outline: none;
}
button { cursor: pointer; }

/* ========== LAYOUT ========== */
.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ========== HEADER ========== */
.header {
    background: var(--white);
    border-bottom: 1px solid var(--gray-300);
    position: sticky;
    top: 0;
    z-index: 100;
}
.header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 64px;
    direction: ltr;
    gap: 12px;
    max-width: 100%;
    padding: 0 24px;
}

/* Main navigation menu */
.header__menu {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-inline-start: 12px;
    margin-inline-end: auto;
}
.header__menu-item {
    position: relative;
}
.header__menu-link {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 8px 14px;
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--gray-700);
    border-radius: var(--radius-sm);
    transition: var(--transition);
    white-space: nowrap;
}
.header__menu-link:hover { color: var(--primary); background: var(--gray-100); }
.header__menu-link--standalone { }
.mobile-cta { display: none; }
.header__menu-arrow { font-size: 0.55rem; opacity: 0.5; transition: transform 0.2s; }
.header__menu-item:hover .header__menu-arrow { transform: rotate(180deg); opacity: 1; }

/* Dropdown submenu */
.header__submenu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 220px;
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow-lg);
    border: 1px solid var(--gray-200);
    padding: 6px 0;
    z-index: 200;
}
.header__menu-item:hover .header__submenu { display: block; }
.header__submenu-link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    font-size: 0.88rem;
    color: var(--gray-700);
    transition: var(--transition);
}
.header__submenu-link:hover { background: var(--gray-100); color: var(--primary); }
.header__submenu-link i { width: 16px; text-align: center; color: var(--gray-500); font-size: 0.82rem; }
.header__submenu-link:hover i { color: var(--primary); }

.header__logo {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}
.header__logo-img {
    height: 48px;
    width: auto;
    display: block;
}
.header__nav {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 1;
    min-width: 0;
}
.header__link {
    color: var(--gray-700);
    font-weight: 500;
    font-size: 0.85rem;
    transition: var(--transition);
    white-space: nowrap;
}
.header__link:hover { color: var(--primary); }
.header__btn {
    background: var(--primary);
    color: var(--white);
    padding: 7px 14px;
    border-radius: var(--radius-sm);
    font-weight: 600;
    font-size: 0.82rem;
    transition: var(--transition);
    display: inline-flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}
.header__btn:hover { background: var(--primary-dark); }

/* Notification bell */
.header__notif {
    position: relative;
    color: var(--gray-700);
    font-size: 1.1rem;
    transition: color 0.2s;
}
.header__notif:hover { color: var(--primary); }
.header__notif-badge {
    position: absolute;
    top: -6px;
    right: -8px;
    background: var(--danger);
    color: white;
    font-size: 0.6rem;
    font-weight: 700;
    min-width: 16px;
    height: 16px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    line-height: 1;
}

/* Notifications header */
.notif-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    gap: 12px;
}
@media (max-width: 768px) {
    .notif-header {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }
    .notif-header .admin-btn {
        width: 100%;
        justify-content: center;
    }
}

/* Notifications list */
.notifications-list { display: flex; flex-direction: column; gap: 8px; }
.notification-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 18px;
    background: var(--white);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow);
    text-decoration: none;
    color: var(--dark);
    transition: background 0.15s;
}
.notification-item:hover { background: var(--gray-100); }
.notification-item--unread { background: var(--primary-light); }
.notification-item--unread:hover { background: #e8d5f5; }
.notification-item__icon {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--gray-100);
    color: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
    flex-shrink: 0;
}
.notification-item--unread .notification-item__icon { background: var(--primary); color: white; }
.notification-item__body { flex: 1; min-width: 0; }
.notification-item__message { font-size: 0.9rem; line-height: 1.4; }
.notification-item__date { font-size: 0.75rem; color: var(--gray-500); margin-top: 2px; }
.notification-item__dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--primary);
    flex-shrink: 0;
}

/* Language switcher */
.lang-switcher { display: flex; gap: 4px; }
.lang-switcher__btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 12px;
    border: 2px solid var(--gray-300);
    border-radius: var(--radius-sm);
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--gray-700);
    transition: var(--transition);
}
.lang-switcher__btn:hover { border-color: var(--primary); color: var(--primary); }

/* Burger button (mobile only) */
.burger {
    display: none;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    font-size: 1.3rem;
    color: var(--gray-700);
    cursor: pointer;
    padding: 4px;
    position: relative;
}
.burger__badge {
    position: absolute;
    top: -4px;
    inset-inline-end: -6px;
    background: var(--danger);
    color: white;
    font-size: 0.6rem;
    font-weight: 700;
    min-width: 16px;
    height: 16px;
    line-height: 16px;
    text-align: center;
    border-radius: 10px;
    padding: 0 4px;
}

/* Message badge on user dropdown */
.header__msg-badge {
    background: var(--danger);
    color: white;
    font-size: 0.6rem;
    font-weight: 700;
    min-width: 16px;
    height: 16px;
    line-height: 16px;
    text-align: center;
    border-radius: 10px;
    padding: 0 4px;
    margin-inline-start: 4px;
}

/* Mobile menu */
.mobile-menu { display: none; }
.mobile-menu.open { display: block; }
.mobile-menu__overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.4);
    z-index: 9998;
}
.mobile-menu__panel {
    position: fixed;
    top: 0;
    inset-inline-start: 0;
    width: 280px;
    max-width: 85vw;
    height: 100%;
    background: var(--white);
    z-index: 9999;
    box-shadow: 4px 0 20px rgba(0,0,0,0.15);
    display: flex;
    flex-direction: column;
    animation: slideIn 0.2s ease-out;
}
@keyframes slideIn {
    from { transform: translateX(-100%); }
    to { transform: translateX(0); }
}
.rtl .mobile-menu__panel {
    box-shadow: -4px 0 20px rgba(0,0,0,0.15);
}
@keyframes slideInRtl {
    from { transform: translateX(100%); }
    to { transform: translateX(0); }
}
.rtl .mobile-menu__panel { animation-name: slideInRtl; }
.mobile-menu__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--gray-200);
}
.mobile-menu__user {
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--gray-800);
    display: flex;
    align-items: center;
    gap: 8px;
}
.mobile-menu__user i { color: var(--primary); font-size: 1.2rem; }
.mobile-menu__close {
    background: none;
    border: none;
    font-size: 1.2rem;
    color: var(--gray-500);
    cursor: pointer;
    padding: 4px;
}
.mobile-menu__close:hover { color: var(--gray-800); }
.mobile-menu__body {
    flex: 1;
    overflow-y: auto;
    padding: 8px 0;
}
.mobile-menu__item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 20px;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--gray-700);
    transition: var(--transition);
}
.mobile-menu__item:hover { background: var(--gray-100); color: var(--primary); }
.mobile-menu__item i { width: 18px; text-align: center; color: var(--gray-500); }
.mobile-menu__item:hover i { color: var(--primary); }
.mobile-menu__item--danger { color: var(--danger); }
.mobile-menu__item--danger i { color: var(--danger); }
.mobile-menu__item--danger:hover { background: #fde8e8; }
.mobile-menu__badge {
    margin-inline-start: auto;
    background: var(--danger);
    color: white;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 10px;
}
.mobile-menu__divider {
    height: 1px;
    background: var(--gray-200);
    margin: 4px 0;
}

/* Mobile menu accordion (Mon compte) */
.mobile-menu__accordion { }
.mobile-menu__accordion summary { list-style: none; }
.mobile-menu__accordion summary::-webkit-details-marker { display: none; }
.mobile-menu__accordion-arrow {
    font-size: 0.6rem;
    margin-inline-start: auto;
    transition: transform 0.2s;
    color: var(--gray-500);
}
.mobile-menu__accordion[open] .mobile-menu__accordion-arrow { transform: rotate(180deg); }
.mobile-menu__sub {
    padding: 2px 0 2px 20px;
}
.mobile-menu__subitem {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 20px;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--gray-600);
    transition: var(--transition);
}
.mobile-menu__subitem:hover { background: var(--gray-100); color: var(--primary); }
.mobile-menu__subitem i { width: 16px; text-align: center; color: var(--gray-400); font-size: 0.8rem; }
.mobile-menu__subitem:hover i { color: var(--primary); }

/* Header dropdown */
.header__dropdown {
    position: relative;
}
.header__dropdown-toggle {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--gray-700);
    font-weight: 500;
    font-size: 0.85rem;
    background: none;
    padding: 5px 10px;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    white-space: nowrap;
}
.header__dropdown-toggle:hover { color: var(--primary); background: var(--gray-100); }
.header__dropdown-toggle .fa-user-circle { font-size: 1.3rem; }
.header__dropdown-arrow { font-size: 0.65rem; transition: transform 0.2s; }
.header__dropdown-menu.open + .header__dropdown-toggle .header__dropdown-arrow,
.header__dropdown-toggle:has(+ .header__dropdown-menu.open) .header__dropdown-arrow {
    transform: rotate(180deg);
}
.header__dropdown-menu {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow-lg);
    border: 1px solid var(--gray-300);
    min-width: 220px;
    padding: 8px 0;
    z-index: 200;
}
.header__dropdown-menu.open { display: block; }
.header__dropdown-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 18px;
    font-size: 0.9rem;
    color: var(--dark);
    transition: var(--transition);
}
.header__dropdown-item:hover { background: var(--gray-100); color: var(--primary); }
.header__dropdown-item i { width: 16px; text-align: center; color: var(--gray-500); font-size: 0.85rem; }
.header__dropdown-item:hover i { color: var(--primary); }
.header__dropdown-item--danger { color: var(--danger); }
.header__dropdown-item--danger i { color: var(--danger); }
.header__dropdown-item--danger:hover { background: #fde8e8; }
.header__dropdown-divider {
    height: 1px;
    background: var(--gray-300);
    margin: 6px 0;
}

/* ========== ACCOUNT PAGE ========== */
.account-page {
    padding: 40px 0 60px;
}
.account-page__title {
    font-size: 1.6rem;
    font-weight: 700;
    margin-bottom: 30px;
}
.account-grid {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 30px;
    align-items: start;
}
.account-card {
    background: var(--white);
    border-radius: var(--radius);
    padding: 30px;
    text-align: center;
    box-shadow: var(--shadow);
}
.account-card__avatar {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: var(--primary-light);
    color: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    margin: 0 auto 16px;
}
.account-card__name {
    font-size: 1.2rem;
    font-weight: 700;
    margin-bottom: 8px;
}
.account-info {
    min-width: 0;
}
.account-edit-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
    max-width: 600px;
}

/* ========== MY ADS PAGE ========== */
.my-ads-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 24px;
    gap: 16px;
    flex-wrap: wrap;
}
.my-ads-header__quota {
    color: var(--gray-700);
    font-size: 0.9rem;
    margin-top: 4px;
}
.my-ads-tabs {
    display: flex;
    gap: 0;
    border-bottom: 2px solid var(--gray-300);
    margin-bottom: 24px;
}
.my-ads-tab {
    padding: 10px 20px;
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--gray-700);
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    transition: var(--transition);
    display: flex;
    align-items: center;
    gap: 4px;
}
.my-ads-tab:hover { color: var(--primary); }
.my-ads-tab.active { color: var(--primary); border-bottom-color: var(--primary); }
.my-ads-tab__count {
    background: var(--gray-100);
    color: var(--gray-700);
    font-size: 0.72rem;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 10px;
}
.my-ads-tab.active .my-ads-tab__count {
    background: var(--primary-light);
    color: var(--primary);
}

.my-ads-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.my-ad-card {
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    display: flex;
    overflow: hidden;
    transition: var(--transition);
}
.my-ad-card:hover { box-shadow: var(--shadow-lg); }
.my-ad-card__image {
    width: 200px;
    min-height: 150px;
    flex-shrink: 0;
    background: var(--gray-300);
}
.my-ad-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.my-ad-card__body {
    flex: 1;
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}
.my-ad-card__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 10px;
}
.my-ad-card__title {
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--dark);
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.my-ad-card__title:hover { color: var(--primary); }
.my-ad-card__location {
    font-size: 0.85rem;
    color: var(--gray-700);
    margin-top: 2px;
    display: flex;
    align-items: center;
    gap: 4px;
}
.my-ad-card__price {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--primary);
    white-space: nowrap;
}
.my-ad-card__meta {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.my-ad-card__detail {
    font-size: 0.8rem;
    color: var(--gray-700);
    display: flex;
    align-items: center;
    gap: 4px;
}
.my-ad-card__detail i { color: var(--gray-500); font-size: 0.75rem; }
.my-ad-card__date {
    font-size: 0.8rem;
    color: var(--gray-500);
    display: flex;
    align-items: center;
    gap: 4px;
    margin-left: auto;
}
.my-ad-card__actions {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    padding: 16px;
    border-left: 1px solid var(--gray-100);
}
/* Share buttons in my-ads */
.share-btn--fb { background: #1877F2; color: var(--white); border: none; }
.share-btn--fb:hover { background: #1466d8; color: var(--white); }
.share-btn--marketplace { background: #E8F0FE; color: #1877F2; border: 1px solid #1877F2; }
.share-btn--marketplace:hover { background: #1877F2; color: var(--white); }
/* Marketplace modal steps */
.marketplace-steps { display: flex; flex-direction: column; gap: 16px; }
.marketplace-step { display: flex; gap: 12px; }
.marketplace-step__num {
    width: 28px; height: 28px; border-radius: 50%; background: var(--primary);
    color: var(--white); font-weight: 700; font-size: 0.85rem;
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.marketplace-step__content { flex: 1; }
.marketplace-step__content strong { display: block; margin-bottom: 6px; font-size: 0.9rem; }
.marketplace-step__text {
    background: var(--gray-100); padding: 12px; border-radius: var(--radius-sm);
    font-size: 0.8rem; white-space: pre-wrap; word-break: break-word;
    max-height: 150px; overflow-y: auto; margin-bottom: 8px; font-family: inherit;
}
/* Share footer in ad card */
.my-ad-card__share {
    display: flex;
    gap: 6px;
    margin-top: 8px;
    margin-inline-start: auto;
}
.my-ad-card__share-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    font-size: 0.72rem;
    font-weight: 600;
    border-radius: var(--radius-sm);
    border: none;
    cursor: pointer;
    transition: var(--transition);
}
.my-ad-card__share-btn.share-btn--fb { background: #E8F0FE; color: #1877F2; }
.my-ad-card__share-btn.share-btn--fb:hover { background: #1877F2; color: var(--white); }
.my-ad-card__share-btn.share-btn--marketplace { background: #E8F0FE; color: #1877F2; }
.my-ad-card__share-btn.share-btn--marketplace:hover { background: #1877F2; color: var(--white); }

.my-ad-card--inactive { opacity: 0.6; }
.my-ad-card--inactive:hover { opacity: 1; }

/* Empty state */
.my-ads-empty {
    text-align: center;
    padding: 60px 20px;
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}
.my-ads-empty__icon { font-size: 3rem; color: var(--gray-500); margin-bottom: 16px; }
.my-ads-empty h3 { font-size: 1.2rem; margin-bottom: 8px; }
.my-ads-empty p { color: var(--gray-700); font-size: 0.95rem; }

/* ========== FAVORITE BUTTON ========== */
.favorite-btn {
    position: absolute;
    bottom: 12px;
    right: 12px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--white);
    color: var(--gray-500);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
    transition: var(--transition);
    border: none;
    cursor: pointer;
    z-index: 5;
}
.favorite-btn:hover { color: var(--primary); transform: scale(1.1); }
.favorite-btn--active { color: var(--primary); }
.favorite-btn--active:hover { color: var(--gray-500); }

.detail-card__favorite {
    width: 100%;
    padding: 12px;
    background: var(--gray-100);
    color: var(--gray-700);
    border-radius: var(--radius-sm);
    font-weight: 600;
    font-size: 0.9rem;
    text-align: center;
    transition: var(--transition);
    margin-top: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    border: 2px solid transparent;
}
.detail-card__favorite:hover { border-color: var(--primary); color: var(--primary); }
.detail-card__favorite--active { background: var(--primary-light); color: var(--primary); border-color: var(--primary); }
.detail-card__edit {
    display: block;
    width: 100%;
    padding: 12px;
    margin-top: 10px;
    background: var(--white);
    color: var(--primary);
    border: 2px solid var(--primary);
    border-radius: var(--radius-sm);
    font-weight: 600;
    font-size: 0.9rem;
    text-align: center;
    text-decoration: none;
    transition: var(--transition);
}
.detail-card__edit:hover { background: var(--primary); color: var(--white); }
/* ========== SHARE BUTTONS ========== */
.share-buttons {
    margin-top: 16px;
    padding: 14px 16px;
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    text-align: center;
}
.share-buttons__label {
    display: block;
    font-size: 0.8rem;
    color: var(--gray-500);
    margin-bottom: 10px;
    font-weight: 600;
}
.share-buttons__list {
    display: flex;
    justify-content: center;
    gap: 10px;
}
.share-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    font-size: 1rem;
    color: var(--white);
    transition: transform 0.2s, box-shadow 0.2s;
    text-decoration: none;
}
.share-btn:hover {
    transform: scale(1.1);
    box-shadow: 0 3px 8px rgba(0,0,0,0.2);
}
.share-btn--email { background: var(--primary); }
.share-btn--whatsapp { background: #25D366; }
.share-btn--facebook { background: #1877F2; }
.share-btn--copy { background: var(--gray-600); }
.share-btn--mobile-only { display: none; }
.share-buttons__list--mobile { display: none; justify-content: center; gap: 10px; }

@media (max-width: 768px) {
    .share-btn--mobile-only { display: inline-flex; }
    .share-buttons__list--mobile { display: flex; }
}

.detail-card__report {
    display: block;
    width: 100%;
    margin-top: 16px;
    padding: 8px;
    background: none;
    border: none;
    color: var(--gray-500);
    font-size: 0.8rem;
    cursor: pointer;
    text-align: center;
    transition: color 0.2s;
}
.detail-card__report:hover { color: var(--danger); }

/* Owner card */
.owner-card__header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}
.owner-card__avatar {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: var(--primary-light);
    color: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    flex-shrink: 0;
}
.owner-card__name { font-weight: 600; font-size: 1rem; }
.owner-card__type { font-size: 0.8rem; color: var(--gray-700); }
.owner-card__phone {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px;
    background: var(--gray-100);
    border-radius: var(--radius-sm);
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--dark);
    transition: var(--transition);
}
.owner-card__phone:hover { background: var(--primary-light); color: var(--primary); }
.owner-card__link {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px;
    margin-top: 8px;
    background: var(--primary);
    color: var(--white);
    border-radius: var(--radius-sm);
    font-weight: 600;
    font-size: 0.85rem;
    transition: var(--transition);
}
.owner-card__link:hover { background: var(--primary-dark); }

/* ========== CONTACT STEP ========== */
.contact-step__preview-block {
    background: var(--gray-100);
    border-radius: var(--radius);
    padding: 20px;
    margin: 24px 0;
}
.contact-step__preview-label {
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--gray-500);
    margin-bottom: 12px;
}
.contact-step__preview-card {
    background: #fff;
    border: 2px solid var(--gray-300);
    border-radius: var(--radius-sm);
    padding: 16px;
    margin-bottom: 16px;
}
.contact-step__toggles {
    display: flex; flex-direction: column; gap: 14px;
    padding-top: 16px;
    border-top: 1px solid var(--gray-300);
}

/* Toggle switch */
.toggle-switch {
    display: flex; align-items: center; gap: 12px; cursor: pointer;
    -webkit-user-select: none; user-select: none;
}
.toggle-switch input { display: none; }
.toggle-switch__slider {
    width: 44px; height: 24px;
    background: var(--gray-300);
    border: 2px solid var(--gray-400);
    border-radius: 12px;
    position: relative;
    transition: background 0.2s, border-color 0.2s;
    flex-shrink: 0;
}
.toggle-switch__slider::after {
    content: "";
    position: absolute;
    top: 1px; left: 1px;
    width: 18px; height: 18px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    transition: transform 0.2s;
}
.toggle-switch input:checked + .toggle-switch__slider { background: var(--primary); border-color: var(--primary); }
.toggle-switch input:checked + .toggle-switch__slider::after { transform: translateX(20px); }
[dir="rtl"] .toggle-switch input:checked + .toggle-switch__slider::after { transform: translateX(-20px); }
.toggle-switch__label { font-size: 0.9rem; font-weight: 500; color: var(--dark); }
.toggle-switch input:not(:checked) ~ .toggle-switch__label { color: var(--gray-500); }

/* ========== AGENCY PAGE HEADER ========== */
.agency-header {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 24px;
    padding: 24px;
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}
.agency-header__avatar {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background: var(--primary-light);
    color: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    flex-shrink: 0;
}
.agency-header__name {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 6px;
}
.agency-header__meta {
    display: flex;
    gap: 16px;
    color: var(--gray-700);
    font-size: 0.9rem;
    flex-wrap: wrap;
}
.agency-header__meta i { color: var(--gray-500); margin-right: 4px; }
.owner-card__phone i { color: var(--success); }

/* ========== MODAL ========== */
.modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1000;
    align-items: center;
    justify-content: center;
}
.modal--open { display: flex; }
.modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(3px);
}
.modal__content {
    position: relative;
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow-lg);
    width: 100%;
    max-width: 560px;
    max-height: 90vh;
    overflow-y: auto;
    margin: 20px;
}
.modal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid var(--gray-300);
}
.modal__title { font-size: 1.15rem; font-weight: 700; }
.modal__close {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--gray-700);
    background: none;
    transition: var(--transition);
}
.modal__close:hover { background: var(--gray-100); color: var(--dark); }
.modal__body { padding: 24px; }
.modal__subtitle { font-size: 0.9rem; color: var(--gray-700); margin-bottom: 20px; }
.modal__footer {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--gray-300);
}
.modal__success {
    text-align: center;
    padding: 20px 0;
}
.modal__success-icon {
    font-size: 3rem;
    color: var(--success);
    margin-bottom: 12px;
}
.modal__success h4 { font-size: 1.2rem; margin-bottom: 8px; }
.modal__success p { color: var(--gray-700); font-size: 0.9rem; }

/* ========== SAVE SEARCH BUTTON ========== */
.save-search-btn {
    padding: 8px 16px;
    background: var(--white);
    color: var(--gray-700);
    border: 2px solid var(--gray-300);
    border-radius: var(--radius-sm);
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition);
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 6px;
}
.save-search-btn:hover { border-color: var(--primary); color: var(--primary); }
.save-search-btn--saved {
    background: var(--success);
    color: var(--white);
    border-color: var(--success);
    cursor: default;
}

/* ========== SAVED SEARCHES LIST ========== */
.saved-searches-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.saved-search-card {
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    display: flex;
    align-items: center;
    padding: 20px 24px;
    gap: 20px;
    transition: var(--transition);
}
.saved-search-card:hover { box-shadow: var(--shadow-lg); }
.saved-search-card__body { flex: 1; min-width: 0; }
.saved-search-card__header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
}
.saved-search-card__name { font-size: 1rem; font-weight: 600; }
.saved-search-card__summary {
    font-size: 0.9rem;
    color: var(--gray-700);
    margin-bottom: 8px;
}
.saved-search-card__meta {
    display: flex;
    gap: 16px;
    font-size: 0.8rem;
    color: var(--gray-500);
}
.saved-search-card__meta i { margin-right: 4px; }
.saved-search-card__actions {
    display: flex;
    gap: 6px;
    flex-shrink: 0;
}

@media (max-width: 768px) {
    .saved-search-card { flex-direction: column; align-items: stretch; }
    .saved-search-card__actions { justify-content: flex-end; }
    .filters-bar .search-tabs .save-search-btn { display: none; }
    .save-search-mobile-wrap {
        display: flex !important;
        justify-content: flex-end;
        margin-bottom: 2px;
    }
    .save-search-link {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        background: none;
        border: none;
        color: var(--primary);
        font-size: 0.78rem;
        font-weight: 500;
        cursor: pointer;
        padding: 0;
    }
    .save-search-link:hover { color: var(--primary-dark); text-decoration: underline; }
    .save-search-link i { font-size: 0.7rem; }
    .filters-bar .search-tabs { border-bottom: 2px solid var(--gray-300); }
    .filters-bar .search-tab { flex: 1; text-align: center; padding: 10px 0; font-size: 0.9rem; }
    .search-results-bar { flex-wrap: wrap; gap: 4px; padding: 8px 0; }
    .search-results-bar__info { width: 100%; }
    .search-results-bar__right { width: 100%; justify-content: space-between; flex-wrap: nowrap; overflow: hidden; }
    .search-sort { margin-inline-start: auto; flex-shrink: 1; min-width: 0; }
    .search-sort select { max-width: 120px; }
    h1.search-results-bar__info { font-size: 0.95rem; }
    .search-sort select { font-size: 0.75rem; padding: 4px 6px; }
    .search-sort__label { font-size: 0.75rem; }

}

@media (max-width: 768px) {
    .my-ad-card { flex-direction: column; }
    .my-ad-card__image { width: 100%; height: 180px; }
    .my-ad-card__top { flex-direction: column; gap: 4px; }
    .my-ad-card__actions { flex-direction: row; border-left: none; border-top: 1px solid var(--gray-100); flex-wrap: wrap; }

    /* Account page on mobile */
    .account-page { overflow-x: hidden; }
    .account-page .filters-bar { padding: 0; box-shadow: none; border: none; background: transparent; margin-bottom: 12px; }
    .account-page .filters-bar__main { flex-direction: column; }
    .account-page .filters-bar__field { min-width: 100%; }
    .my-ad-card__actions { flex-wrap: wrap; justify-content: center; }
    .my-ads-tabs { margin-bottom: 16px; }
    .my-ads-tab { padding: 8px 12px; font-size: 0.82rem; }
    .my-ads-tab:first-child { padding-inline-start: 0; }
}

@media (max-width: 768px) {
    .account-grid { grid-template-columns: 1fr; }
}

/* ========== FLASH ========== */
.flash {
    padding: 14px 0;
    font-weight: 500;
    font-size: 0.95rem;
}
.flash--success { background: #d5f5e3; color: #1e8449; }
.flash i { margin-right: 8px; }

/* ========== HERO ========== */
.hero {
    background: linear-gradient(135deg, var(--secondary) 0%, var(--primary) 100%);
    padding: 60px 0 80px;
    position: relative;
    overflow: hidden;
}
.hero::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -20%;
    width: 600px;
    height: 600px;
    background: rgba(255,255,255,0.05);
    border-radius: 50%;
}
.hero__title {
    color: var(--white);
    font-size: 2.4rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 8px;
}
.hero__subtitle {
    color: rgba(255,255,255,0.85);
    text-align: center;
    font-size: 1.1rem;
    margin-bottom: 40px;
}

/* ========== SEARCH BOX ========== */
.search-box {
    background: var(--white);
    border-radius: var(--radius);
    padding: 28px 32px;
    box-shadow: var(--shadow-lg);
    max-width: 1100px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}
.search-tabs {
    display: flex;
    gap: 0;
    margin-bottom: 24px;
    border-bottom: 2px solid var(--gray-300);
}
@media (max-width: 768px) {
    .search-box .search-tabs .search-tab { flex: 1; padding: 10px 4px; font-size: 0.8rem; flex-direction: column; gap: 2px; }
    .search-box .search-tabs .search-tab i { font-size: 1.1rem; }
    .filters-bar .search-tabs .search-tab { font-size: 0.85rem; }
}
.search-tab {
    padding: 12px 28px;
    font-weight: 600;
    font-size: 1rem;
    color: var(--gray-700);
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    cursor: pointer;
    transition: var(--transition);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    justify-content: center;
}
.search-tab:hover { color: var(--primary); }
.search-tab.active {
    color: var(--primary);
    border-bottom-color: var(--primary);
}
.search-form {
    display: flex;
    gap: 12px;
    align-items: flex-end;
}
.search-field {
    flex: 1;
}
.search-field label {
    display: block;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--gray-700);
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.search-field select,
.search-field input {
    width: 100%;
    padding: 12px 14px;
    border: 2px solid var(--gray-300);
    border-radius: var(--radius-sm);
    font-size: 0.95rem;
    color: var(--dark);
    background: var(--white);
    transition: var(--transition);
    appearance: none;
    -webkit-appearance: none;
}
.search-field select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23636e72' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 36px;
}
.search-field select:focus,
.search-field input:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--primary-light);
}
.search-btn {
    background: var(--primary);
    color: var(--white);
    padding: 12px 32px;
    border-radius: var(--radius-sm);
    font-weight: 600;
    font-size: 1rem;
    transition: var(--transition);
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 8px;
    height: 48px;
}
.search-btn:hover { background: var(--primary-dark); }

/* ========== SECTION ========== */
.section {
    padding: 50px 0;
}
.section__title {
    font-size: 1.6rem;
    font-weight: 700;
    margin-bottom: 30px;
    color: var(--dark);
}
.section__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30px;
    gap: 12px;
}
.section__link {
    color: var(--primary);
    font-weight: 600;
    font-size: 0.95rem;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    text-decoration: none;
    padding: 6px 14px;
    border-radius: 8px;
    transition: background .15s, color .15s;
}
.section__link:hover {
    background: var(--primary);
    color: #fff;
    text-decoration: none;
}

@media (max-width: 768px) {
    .section__header {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        margin-bottom: 20px;
    }
    .section__title {
        font-size: 1.2rem;
        margin-bottom: 0;
    }
    .section__link {
        justify-content: center;
        padding: 10px 16px;
        background: var(--primary);
        color: #fff;
        border-radius: 10px;
        font-size: 0.9rem;
    }
    .section__link:hover {
        background: var(--primary-dark, #5a3d8a);
    }
}

/* ========== PROPERTY CARDS ========== */
.properties-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: 24px;
}
.property-card {
    background: var(--white);
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow);
    transition: var(--transition);
    display: flex;
    flex-direction: column;
}
.property-card:hover {
    box-shadow: var(--shadow-lg);
    transform: translateY(-4px);
}
.property-card__image {
    position: relative;
    height: 200px;
    background: var(--gray-300);
    overflow: hidden;
}
.property-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* Card carousel */
.card-carousel__track {
    display: flex;
    height: 100%;
    transition: transform 0.3s ease;
}
.card-carousel__slide {
    min-width: 100%;
    height: 100%;
    display: block;
}
.card-carousel__btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: rgba(255,255,255,0.85);
    color: var(--gray-800);
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.65rem;
    z-index: 3;
    opacity: 0;
    transition: opacity 0.2s;
}
.property-card__image:hover .card-carousel__btn { opacity: 1; }
.card-carousel__btn:hover { background: white; }
.card-carousel__btn--prev { left: 8px; }
.card-carousel__btn--next { right: 8px; }
.card-carousel__dots {
    position: absolute;
    bottom: 8px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 5px;
    z-index: 3;
}
.card-carousel__dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(255,255,255,0.5);
    transition: background 0.2s;
}
.card-carousel__dot.active { background: white; }
.property-card__placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--gray-300) 0%, var(--gray-100) 100%);
    color: var(--gray-500);
    font-size: 3rem;
}
.property-card__badge {
    position: absolute;
    top: 12px;
    left: 12px;
    background: var(--primary);
    color: var(--white);
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
}
.property-card__badge--sale { background: var(--secondary); }
.property-card__type {
    position: absolute;
    top: 12px;
    right: 12px;
    background: rgba(0,0,0,0.6);
    color: var(--white);
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 500;
}
.property-card__body {
    padding: 16px 20px 20px;
    flex: 1;
    display: flex;
    flex-direction: column;
}
.property-card__price {
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 4px;
}
.property-card__title {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 8px;
    color: var(--dark);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.property-card__location {
    font-size: 0.85rem;
    color: var(--gray-700);
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 4px;
}
.property-card__features {
    display: flex;
    gap: 16px;
    padding-top: 12px;
    border-top: 1px solid var(--gray-300);
    margin-top: auto;
    flex-wrap: wrap;
}
.property-card__feature {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.85rem;
    color: var(--gray-700);
    white-space: nowrap;
    flex-shrink: 0;
}
.property-card__feature i { color: var(--gray-500); font-size: 0.8rem; flex-shrink: 0; }
@media (max-width: 600px) {
    .property-card__features { gap: 10px; }
    .property-card__feature { font-size: 0.78rem; gap: 4px; }
    .property-card__feature i { font-size: 0.72rem; }
}

/* ========== SEARCH PAGE ========== */
.search-page {
    padding: 24px 0 60px;
}
.filters-bar .search-tabs {
    align-items: center;
    border-bottom: none;
}
.filters-bar .search-tab {
    border-bottom-color: var(--gray-300);
}
.filters-bar .search-tab.active {
    border-bottom-color: var(--primary);
}
.filters-bar .search-tabs .save-search-btn {
    margin-inline-start: auto;
    margin-bottom: -2px;
}
.save-search-btn--mobile { display: none; }
.save-search-mobile-wrap { display: none; }
/* Active filter tags */
.active-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 6px;
}
/* Collapsible active filters: hidden on desktop, shown on mobile */
@media (min-width: 769px) {
    .active-filters-collapse { display: none; }
}
@media (max-width: 768px) {
    .active-filters--desktop { display: none; }
    .active-filters-collapse { display: block; margin-bottom: 6px; }
    .active-filters-collapse__toggle {
        display: flex; align-items: center; gap: 6px;
        font-size: 0.82rem; font-weight: 600; color: var(--gray-700);
        cursor: pointer; padding: 6px 0; list-style: none;
    }
    .active-filters-collapse__toggle::-webkit-details-marker { display: none; }
    .active-filters-collapse__arrow { font-size: 0.6rem; margin-inline-start: auto; transition: transform 0.2s; }
    .active-filters-collapse[open] .active-filters-collapse__arrow { transform: rotate(180deg); }
}
.active-filter-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: var(--gray-100);
    color: var(--gray-600);
    border: 1px solid var(--gray-200);
    border-radius: 20px;
    font-size: 0.78rem;
    text-decoration: none;
    transition: var(--transition);
}
.active-filter-tag:hover {
    background: var(--gray-200);
    color: var(--danger);
    border-color: var(--gray-300);
}
.active-filter-tag i { font-size: 0.65rem; opacity: 0.5; }
.active-filter-tag:hover i { opacity: 1; }

.search-results-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    padding: 12px 0;
}
h1.search-results-bar__info {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--dark);
    margin: 0;
}
h1.search-results-bar__info strong { color: var(--primary); font-weight: 700; font-size: 1.2rem; }
.search-results-bar__right {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-inline-start: auto;
}
.search-sort {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}
.search-sort__label {
    font-size: 0.82rem;
    color: var(--gray-500);
    white-space: nowrap;
}
.search-sort select {
    padding: 6px 10px;
    border: 1px solid var(--gray-300);
    border-radius: var(--radius-sm);
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--dark);
    background: var(--white);
    cursor: pointer;
}
.search-sort select:focus { border-color: var(--primary); outline: none; }

/* Filters bar */
.filters-bar {
    background: var(--white);
    border-radius: var(--radius);
    padding: 20px;
    margin-bottom: 24px;
    box-shadow: var(--shadow);
}
.filters-bar__main {
    display: flex;
    gap: 12px;
    align-items: flex-end;
    flex-wrap: wrap;
}
.filters-bar__field {
    flex: 1;
    min-width: 160px;
}
.filters-bar__field label {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--gray-700);
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.filters-bar__field select,
.filters-bar__field input {
    width: 100%;
    padding: 10px 12px;
    border: 2px solid var(--gray-300);
    border-radius: var(--radius-sm);
    font-size: 0.9rem;
    color: var(--dark);
    background: var(--white);
    transition: var(--transition);
    appearance: none;
    -webkit-appearance: none;
}
.filters-bar__field select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23636e72' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    padding-right: 32px;
}
.filters-bar__field select:focus,
.filters-bar__field input:focus {
    border-color: var(--primary);
}
.ref-search {
    display: flex;
    position: relative;
}
.ref-search__input {
    font-family: monospace;
    padding-right: 38px !important;
}
.ref-search__btn {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 36px;
    background: none;
    border: none;
    color: var(--gray-500);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
}
.ref-search__btn:hover {
    color: var(--primary);
}
.filters-bar__actions {
    display: flex;
    gap: 8px;
    align-items: flex-end;
}
.filters-bar__btn {
    padding: 10px 20px;
    border-radius: var(--radius-sm);
    font-weight: 600;
    font-size: 0.9rem;
    transition: var(--transition);
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 6px;
    height: 42px;
}
.filters-bar__btn--primary {
    background: var(--primary);
    color: var(--white);
}
.filters-bar__btn--primary:hover { background: var(--primary-dark); }
.filters-bar__btn--outline {
    background: var(--white);
    color: var(--gray-700);
    border: 2px solid var(--gray-300);
}
.filters-bar__btn--outline:hover {
    border-color: var(--primary);
    color: var(--primary);
}
.filters-bar__btn--icon {
    padding: 0;
    width: 42px;
    height: 42px;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
}
.filters-bar__btn--icon i { margin: 0; }

/* Advanced filters */
.filters-bar__field--mobile-only { display: none; }

/* Location picker & modal: hidden on desktop */
.location-picker { display: none; }
.location-modal { display: none; }

/* ========== DATE RANGE PICKER ========== */
.date-range__button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 12px 14px;
    background: var(--white);
    border: 2px solid var(--gray-300);
    border-radius: var(--radius-sm);
    font-size: 0.95rem;
    color: var(--dark);
    cursor: pointer;
    transition: var(--transition);
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
}
.date-range__button > span { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.date-range__button i { color: var(--primary); }
.date-range__button:hover { border-color: var(--primary); }
.date-range__modal { display: none; position: fixed; inset: 0; z-index: 1100; }
.date-range__modal.is-open { display: block; }
body.date-range-open .mobile-cta { display: none !important; }
.date-range__backdrop { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.55); }
.date-range__content {
    position: relative;
    max-width: 720px;
    margin: 5vh auto;
    background: var(--white);
    border-radius: var(--radius);
    box-shadow: var(--shadow-lg, 0 10px 40px rgba(0,0,0,0.25));
    display: flex;
    flex-direction: column;
    max-height: 90vh;
    overflow: hidden;
}
.date-range__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 20px;
    border-bottom: 1px solid var(--gray-200);
    flex-shrink: 0;
}
.date-range__header h3 { margin: 0; font-size: 1.05rem; font-weight: 700; }
.date-range__close { background: none; border: none; font-size: 1.1rem; color: var(--gray-700); cursor: pointer; padding: 6px; }
.date-range__calendars { padding: 14px 18px; flex: 1; overflow-y: auto; }
.date-range__nav { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.date-range__nav-btn {
    width: 36px; height: 36px;
    background: var(--gray-100);
    border: 1px solid var(--gray-200);
    border-radius: 50%;
    cursor: pointer;
    color: var(--dark);
}
.date-range__nav-btn:hover { background: var(--primary-light); color: var(--primary); }
.date-range__nav-spacer { flex: 1; }
.date-range__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.date-range__month-title { font-weight: 700; text-align: center; margin-bottom: 8px; font-size: 0.9rem; }
.date-range__weekdays { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; margin-bottom: 2px; }
.date-range__weekdays span { text-align: center; font-size: 0.7rem; color: var(--gray-700); font-weight: 600; padding: 2px 0; }
.date-range__days { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.date-range__day {
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.78rem;
    background: transparent;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    color: var(--dark);
    min-height: 0;
    padding: 0;
}
.date-range__day:not(.date-range__day--past):not(.date-range__day--empty):hover { background: var(--primary-light); }
.date-range__day--empty { cursor: default; }
.date-range__day--past { color: var(--gray-500); cursor: not-allowed; text-decoration: line-through; }
.date-range__day--in { background: var(--primary-light); color: var(--primary); border-radius: 0; }
.date-range__day--start, .date-range__day--end { background: var(--primary); color: var(--white); font-weight: 700; }
.date-range__day--start { border-radius: 6px 0 0 6px; }
.date-range__day--end { border-radius: 0 6px 6px 0; }
.rtl .date-range__day--start { border-radius: 0 6px 6px 0; }
.rtl .date-range__day--end { border-radius: 6px 0 0 6px; }
.date-range__flex {
    padding: 10px 20px 14px;
    border-top: 1px solid var(--gray-200);
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex-shrink: 0;
    background: var(--white);
}
.date-range__flex-label {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--gray-700);
    text-transform: uppercase;
    letter-spacing: 0.3px;
}
.date-range__flex-pills {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}
.date-range__flex-pill {
    padding: 6px 12px;
    background: var(--white);
    border: 1.5px solid var(--gray-300);
    border-radius: 999px;
    font-size: 0.82rem;
    color: var(--gray-700);
    cursor: pointer;
    transition: var(--transition);
    white-space: nowrap;
}
.date-range__flex-pill:hover { border-color: var(--primary-light); color: var(--primary); }
.date-range__flex-pill.is-active {
    background: var(--primary);
    border-color: var(--primary);
    color: var(--white);
    font-weight: 600;
}
.date-range__footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 12px 20px;
    border-top: 1px solid var(--gray-200);
    flex-shrink: 0;
    background: var(--white);
}
@media (max-width: 600px) {
    .date-range__content {
        margin: 0;
        height: 100vh;
        height: 100dvh;
        max-height: 100vh;
        max-height: 100dvh;
        border-radius: 0;
        max-width: 100%;
    }
    .date-range__calendars { padding: 10px 12px; }
    .date-range__grid { grid-template-columns: 1fr; gap: 14px; }
    .date-range__nav-btn { width: 32px; height: 32px; }
    .date-range__month-title { font-size: 0.82rem; margin-bottom: 4px; }
    .date-range__weekdays span { font-size: 0.65rem; }
    .date-range__day { font-size: 0.72rem; border-radius: 4px; }
    .date-range__footer { padding: 10px 14px; }
    .date-range__footer .filters-bar__btn { flex: 1; justify-content: center; font-size: 0.85rem; }
}
.filters-advanced {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1000;
    background: rgba(0, 0, 0, 0.5);
    overflow-y: auto;
    padding: 40px 20px;
}
.filters-advanced.open {
    display: flex;
    align-items: flex-start;
    justify-content: center;
}
.filters-advanced__content {
    background: var(--white);
    border-radius: var(--radius);
    max-width: 720px;
    width: 100%;
    margin: auto;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 80px);
}
.filters-advanced__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--gray-200);
    flex-shrink: 0;
}
.filters-advanced__header h3 { font-size: 1.1rem; font-weight: 700; margin: 0; }
.filters-advanced__close {
    background: none; border: none; font-size: 1.1rem;
    color: var(--gray-700); cursor: pointer; padding: 6px;
    border-radius: 6px;
}
.filters-advanced__close:hover { background: var(--gray-100); }
.filters-advanced__body { flex: 1; overflow-y: auto; padding: 20px; }
.filters-advanced__footer {
    display: flex;
    gap: 12px;
    padding: 14px 20px;
    border-top: 1px solid var(--gray-200);
    flex-shrink: 0;
}
.filters-advanced__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 12px;
}
.filters-advanced__section { margin-bottom: 24px; }
.filters-advanced__section:last-child { margin-bottom: 0; }
.filters-advanced__section-title {
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--gray-700);
    margin: 0 0 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--gray-200);
}
.filters-check-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    gap: 8px;
}
.filters-check {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border: 2px solid var(--gray-200);
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition);
    font-size: 0.9rem;
    background: var(--white);
}
.filters-check:hover { border-color: var(--primary-light); background: var(--gray-100); }
.filters-check input[type="checkbox"] { width: 18px; height: 18px; cursor: pointer; accent-color: var(--primary); margin: 0; }
.filters-check span { display: inline-flex; align-items: center; gap: 8px; color: var(--dark); }
.filters-check span i { color: var(--primary); width: 16px; text-align: center; }
.filters-check input:checked + span { font-weight: 600; }
.filters-check:has(input:checked) { border-color: var(--primary); background: var(--primary-light); }

/* Loading spinner */
.loading-spinner {
    display: flex;
    justify-content: center;
    padding: 40px;
}
.loading-spinner::after {
    content: '';
    width: 40px;
    height: 40px;
    border: 3px solid var(--gray-300);
    border-top-color: var(--primary);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ========== PROPERTY DETAIL ========== */
.property-detail {
    padding: 30px 0 60px;
}
.property-detail__back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--gray-700);
    font-size: 0.9rem;
    margin-bottom: 20px;
    transition: var(--transition);
}
.property-detail__back:hover { color: var(--primary); }
.property-detail__grid {
    display: grid;
    grid-template-columns: 1fr 350px;
    gap: 30px;
    align-items: start;
}
.property-detail__main {
    min-width: 0;
}
/* Carousel */
.property-carousel {
    border-radius: var(--radius);
    overflow: hidden;
    position: relative;
}
.property-carousel__viewport {
    position: relative;
    overflow: hidden;
    height: 500px;
    border-radius: var(--radius);
    touch-action: pan-y;
}
.property-carousel__track {
    display: flex;
    height: 100%;
    transition: transform 0.35s ease;
}
.property-carousel__slide {
    min-width: 100%;
    height: 100%;
}
.property-carousel__slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-user-drag: none;
    user-select: none;
}
/* Fullscreen close button + counter — only visible in fullscreen */
.property-carousel__close,
.property-carousel__counter { display: none; }

/* Fullscreen mode (activated on mobile tap) */
.property-carousel.is-fullscreen {
    position: fixed;
    inset: 0;
    z-index: 1200;
    background: #000;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.property-carousel.is-fullscreen .property-carousel__viewport {
    width: 100vw;
    height: 100vh;
    height: 100dvh;
    border-radius: 0;
}
.property-carousel.is-fullscreen .property-carousel__slide img {
    object-fit: contain;
    background: #000;
}
.property-carousel.is-fullscreen .property-carousel__close {
    display: flex;
    position: absolute;
    top: 12px;
    inset-inline-end: 12px;
    z-index: 3;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    border: none;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
}
.property-carousel.is-fullscreen .property-carousel__counter {
    display: block;
    position: absolute;
    top: 16px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
    color: #fff;
    font-size: 0.9rem;
    font-weight: 600;
    background: rgba(0, 0, 0, 0.45);
    padding: 4px 12px;
    border-radius: 999px;
}
.property-carousel__btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(0,0,0,0.5);
    color: white;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    transition: background 0.2s;
    z-index: 2;
}
.property-carousel__btn:hover { background: rgba(0,0,0,0.75); }
.property-carousel__btn--prev { left: 12px; }
.property-carousel__btn--next { right: 12px; }
.property-carousel__dots {
    position: absolute;
    bottom: 14px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 8px;
    z-index: 2;
}
.property-carousel__dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: none;
    background: rgba(255,255,255,0.5);
    cursor: pointer;
    padding: 0;
    transition: background 0.2s, transform 0.2s;
}
.property-carousel__dot.active {
    background: white;
    transform: scale(1.25);
}
.property-carousel__dot:hover {
    background: rgba(255,255,255,0.85);
}

/* Gallery (fallback no photos) */
.property-detail__gallery {
    background: var(--gray-300);
    border-radius: var(--radius);
    overflow: hidden;
    height: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.property-detail__gallery img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.property-detail__gallery-placeholder {
    color: var(--gray-500);
    font-size: 5rem;
}
.property-detail__sidebar {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.detail-card {
    background: var(--white);
    border-radius: var(--radius);
    padding: 24px;
    box-shadow: var(--shadow);
}
.detail-card__price {
    font-size: 2rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 4px;
}
.detail-card__label {
    font-size: 0.85rem;
    color: var(--gray-700);
    margin-bottom: 16px;
}
.detail-card__place {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid var(--gray-200);
    font-size: 0.95rem;
    color: var(--dark);
}
.detail-card__place i { color: var(--primary); }
.detail-card__contact {
    width: 100%;
    padding: 14px;
    background: var(--primary);
    color: var(--white);
    border-radius: var(--radius-sm);
    font-weight: 600;
    font-size: 1rem;
    text-align: center;
    transition: var(--transition);
    display: block;
}
.detail-card__contact:hover { background: var(--primary-dark); }
.property-detail__mobile-price {
    display: none;
}
.property-detail__content {
    margin-top: 24px;
}
.property-detail__title {
    font-size: 1.8rem;
    font-weight: 700;
    margin-bottom: 8px;
}
.property-detail__ref {
    display: inline-block;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--primary);
    background: var(--primary-light, #e8f0fe);
    padding: 4px 12px;
    border-radius: 4px;
    margin-bottom: 10px;
    font-family: monospace;
    letter-spacing: 0.5px;
}
.property-detail__location {
    font-size: 1rem;
    color: var(--gray-700);
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.property-detail__features {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 30px;
}
.detail-feature {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: var(--gray-100);
    border-radius: var(--radius-sm);
}
.detail-feature__icon {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-light);
    color: var(--primary);
    border-radius: 8px;
    font-size: 0.9rem;
}
.detail-feature__text { font-size: 0.9rem; }
.detail-feature__text strong {
    display: block;
    font-size: 0.8rem;
    color: var(--gray-700);
    font-weight: 500;
}
.property-detail__description h3 {
    font-size: 1.2rem;
    margin-bottom: 12px;
}
.property-detail__description p {
    color: var(--gray-700);
    line-height: 1.8;
}

/* ========== DETAIL SECTIONS (unified card style) ========== */
.detail-section {
    margin-top: 28px;
    padding: 24px;
    background: var(--white);
    border: 1px solid var(--gray-200);
    border-radius: var(--radius);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
}
.detail-section__title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--gray-900);
    margin: 0 0 18px;
    padding-bottom: 14px;
    border-bottom: 2px solid var(--gray-100);
}
.detail-section__title i {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-light);
    color: var(--primary);
    border-radius: 8px;
    font-size: 0.95rem;
}
.detail-section__text {
    color: var(--gray-700);
    line-height: 1.8;
    font-size: 0.95rem;
    white-space: pre-wrap;
    margin: 0;
}

/* Tags (extras + equipments) */
.extras-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.extras-tag {
    padding: 8px 14px;
    background: var(--gray-100);
    border: 1px solid var(--gray-200);
    border-radius: 999px;
    font-size: 0.88rem;
    font-weight: 500;
    color: var(--dark);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: var(--transition);
}
.extras-tag:hover { background: var(--white); border-color: var(--primary-light); transform: translateY(-1px); }
.extras-tag i { color: var(--success); font-size: 0.85rem; }
.extras-tag--eq i { color: var(--primary); }

/* Period cards (pricing + availability) */
.detail-periods { display: flex; flex-direction: column; gap: 10px; }
.detail-period {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 14px 16px;
    background: var(--gray-100);
    border-radius: var(--radius-sm);
    border: 1px solid var(--gray-200);
    flex-wrap: wrap;
    transition: var(--transition);
}
.detail-period:hover { background: var(--white); border-color: var(--primary-light); }
.detail-period__range { display: flex; align-items: center; gap: 12px; min-width: 0; }
.detail-period__badge {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-light);
    color: var(--primary);
    border-radius: 8px;
    font-size: 0.9rem;
}
.detail-period__badge--avail { background: rgba(0, 184, 148, 0.12); color: var(--success); }
.detail-period__text {
    display: flex;
    align-items: baseline;
    gap: 8px;
    color: var(--dark);
    font-weight: 600;
    font-size: 0.95rem;
}
.detail-period__arrow { color: var(--gray-500); font-weight: 400; }
.detail-period__price {
    display: flex;
    align-items: baseline;
    gap: 4px;
    white-space: nowrap;
}
.detail-period__amount {
    font-weight: 800;
    color: var(--primary);
    font-size: 1.05rem;
}
.detail-period__unit { color: var(--gray-700); font-size: 0.85rem; }
.detail-period__duration {
    padding: 4px 10px;
    background: rgba(0, 184, 148, 0.1);
    color: var(--success);
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
}

@media (max-width: 600px) {
    .detail-section { padding: 18px; margin-top: 18px; }
    .detail-period { padding: 10px 12px; gap: 8px; flex-wrap: nowrap; }
    .detail-period__badge { width: 32px; height: 32px; font-size: 0.85rem; }
    .detail-period__range { gap: 6px; min-width: 0; flex: 1; }
    .detail-period__text { font-size: 0.8rem; flex-wrap: nowrap; gap: 4px; white-space: nowrap; }

    .detail-period--price .detail-period__range,
    .detail-period--avail .detail-period__range { flex: 1; min-width: 0; }
    .detail-period--price .detail-period__badge,
    .detail-period--avail .detail-period__badge { display: none; }
    .detail-period--price .detail-period__amount { font-size: 0.85rem; }
    .detail-period--price .detail-period__unit { font-size: 0.72rem; }
    .detail-period--avail .detail-period__duration { font-size: 0.72rem; padding: 3px 8px; }
}

@media (max-width: 380px) {
    .detail-period__text { font-size: 0.72rem; }
    .detail-period--price .detail-period__amount { font-size: 0.78rem; }
    .detail-period--price .detail-period__unit { font-size: 0.68rem; }
}

/* ========== MULTI-STEP FORM ========== */
.annonce-page {
    padding: 40px 0 60px;
}
.annonce-page__title {
    font-size: 1.8rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 8px;
}
.annonce-page__subtitle {
    text-align: center;
    color: var(--gray-700);
    margin-bottom: 40px;
}
@media (max-width: 768px) {
    .annonce-page { padding: 16px 0 40px; }
    .annonce-page__title { font-size: 1.3rem; margin-bottom: 4px; }
    .annonce-page__subtitle { font-size: 0.85rem; margin-bottom: 16px; }
}
.annonce-reset-btn {
    background: none;
    border: none;
    color: var(--gray-500);
    font-size: 0.82rem;
    cursor: pointer;
    padding: 6px 10px;
    border-radius: var(--radius-sm);
    transition: color 0.2s, background 0.2s;
}
.annonce-reset-btn:hover {
    color: var(--danger);
    background: var(--gray-100);
}

/* Progress bar */
.steps-progress {
    display: flex;
    justify-content: center;
    gap: 0;
    margin-bottom: 40px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}
.step-indicator {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 1;
    position: relative;
}
.step-indicator::before {
    content: '';
    position: absolute;
    top: 16px;
    left: calc(-50% + 16px);
    right: calc(50% + 16px);
    height: 2px;
    background: var(--gray-300);
}
.step-indicator:first-child::before { display: none; }
.step-indicator.active::before,
.step-indicator.completed::before { background: var(--primary); }
.step-number {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 0.85rem;
    background: var(--gray-300);
    color: var(--gray-700);
    margin-bottom: 6px;
    position: relative;
    z-index: 1;
}
.step-indicator.active .step-number {
    background: var(--primary);
    color: var(--white);
}
.step-indicator.completed .step-number {
    background: var(--success);
    color: var(--white);
}
.step-label {
    font-size: 0.7rem;
    font-weight: 500;
    color: var(--gray-500);
    text-align: center;
}
.step-indicator.active .step-label { color: var(--primary); font-weight: 600; }
.step-indicator.completed .step-label { color: var(--success); }
.step-indicator.completed:hover .step-number {
    background: var(--primary);
    transform: scale(1.1);
    transition: transform 0.15s, background 0.15s;
}

/* Step panels */
.step-panel {
    display: none;
    max-width: 700px;
    margin: 0 auto;
}
.step-panel.active { display: block; }
.step-panel__title {
    font-size: 1.3rem;
    font-weight: 700;
    margin-bottom: 24px;
    text-align: center;
}
.step-section {
    background: var(--white);
    border: 1px solid var(--gray-200);
    border-radius: var(--radius);
    padding: 22px 24px;
    margin-bottom: 18px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
}
.step-section__title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 1.02rem;
    font-weight: 700;
    color: var(--gray-900);
    margin: 0 0 16px;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--gray-100);
}
.step-section__title i {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-light);
    color: var(--primary);
    border-radius: 8px;
    font-size: 0.85rem;
}
.step-section .form-grid + .form-grid { margin-top: 12px; }
@media (max-width: 600px) {
    .step-section { padding: 16px; margin-bottom: 12px; }
    .step-section__title { font-size: 0.95rem; }
}

/* Choice cards */
.choice-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}
.choice-grid--3 {
    grid-template-columns: repeat(3, 1fr);
}
.choice-grid--types {
    grid-template-columns: repeat(3, 1fr);
    max-width: 500px;
    margin: 0 auto;
}
@media (max-width: 768px) {
    .choice-grid--types { grid-template-columns: repeat(2, 1fr); max-width: none; }
}
.choice-card {
    background: var(--white);
    border: 2px solid var(--gray-300);
    border-radius: var(--radius);
    padding: 24px;
    text-align: center;
    cursor: pointer;
    transition: var(--transition);
}
.choice-card:hover {
    border-color: var(--primary);
    background: var(--primary-light);
}
.choice-card.selected,
.choice-card:has(input:checked) {
    border-color: var(--primary);
    background: var(--primary-light);
    box-shadow: 0 0 0 3px rgba(232, 67, 147, 0.2);
}
.choice-card__icon { font-size: 2rem; margin-bottom: 8px; }
.choice-card__label { font-weight: 600; font-size: 0.95rem; }

/* Form fields in steps */
.form-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px 16px;
}
.form-group { margin-bottom: 16px; }
.form-grid .form-group { margin-bottom: 0; }
.form-group--full { grid-column: 1 / -1; }
.form-group label {
    display: block;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--dark);
    margin-bottom: 6px;
}
.form-group input,
.form-group select,
.form-group textarea {
    width: 100%;
    padding: 12px 14px;
    border: 2px solid var(--gray-300);
    border-radius: var(--radius-sm);
    font-size: 0.95rem;
    color: var(--dark);
    background: var(--white);
    transition: var(--transition);
}
.form-group select {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23636e72' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 36px;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--primary-light);
}
.form-group textarea { min-height: 120px; resize: vertical; }

/* Password toggle */
.password-wrapper { position: relative; }
.password-wrapper input { padding-inline-end: 40px; }
.password-toggle {
    position: absolute;
    top: 50%;
    inset-inline-end: 12px;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: var(--primary);
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    padding: 4px;
}
.password-toggle:hover { text-decoration: underline; }

/* Checkbox group */
.checkbox-group {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.checkbox-label {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: var(--gray-100);
    border-radius: var(--radius-sm);
    cursor: pointer;
    font-size: 0.9rem;
    transition: var(--transition);
    border: 2px solid transparent;
}
.checkbox-label:hover { background: var(--primary-light); }
.checkbox-label input { display: none; }
.checkbox-label:has(input:checked) {
    border-color: var(--primary);
    background: var(--primary-light);
}

/* Toggle cards (extras) */
.toggle-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
    gap: 10px;
}
.toggle-card {
    cursor: pointer;
    display: block;
}
.toggle-card input { display: none; }
.toggle-card__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 16px 12px;
    background: var(--gray-100);
    border: 2px solid var(--gray-200);
    border-radius: var(--radius);
    text-align: center;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--gray-700);
    transition: border-color 0.2s, background 0.2s, color 0.2s;
}
.toggle-card__inner i {
    font-size: 1.3rem;
    color: var(--gray-500);
    transition: color 0.2s;
}
.toggle-card:hover .toggle-card__inner {
    border-color: var(--primary);
    background: var(--white);
}
.toggle-card input:checked + .toggle-card__inner {
    border-color: var(--primary);
    background: var(--primary-light);
    color: var(--primary);
}
.toggle-card input:checked + .toggle-card__inner i {
    color: var(--primary);
}

/* Photo upload */
.photo-upload {
    border: 2px dashed var(--gray-300);
    border-radius: var(--radius);
    padding: 40px;
    text-align: center;
    cursor: pointer;
    transition: var(--transition);
}
.photo-upload:hover { border-color: var(--primary); background: var(--primary-light); }
.photo-upload__icon { font-size: 2.5rem; color: var(--gray-500); margin-bottom: 12px; }
.photo-upload__text { color: var(--gray-700); font-size: 0.95rem; }
.photo-upload__hint { color: var(--gray-500); font-size: 0.8rem; margin-top: 4px; }
.photo-preview {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 16px;
}
.photo-preview__item {
    width: 100px;
    height: 100px;
    border-radius: var(--radius-sm);
    overflow: hidden;
    position: relative;
}
.photo-preview__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.photo-preview__remove {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 22px;
    height: 22px;
    background: rgba(0,0,0,0.6);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    cursor: pointer;
}

/* Step navigation */
.step-nav {
    display: flex;
    justify-content: space-between;
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid var(--gray-300);
}
.step-nav__btn {
    padding: 12px 28px;
    border-radius: var(--radius-sm);
    font-weight: 600;
    font-size: 0.95rem;
    transition: var(--transition);
    display: flex;
    align-items: center;
    gap: 8px;
}
.step-nav__btn--prev {
    background: var(--white);
    color: var(--gray-700);
    border: 2px solid var(--gray-300);
}
.step-nav__btn--prev:hover { border-color: var(--primary); color: var(--primary); }
.step-nav__btn--next {
    background: var(--primary);
    color: var(--white);
    margin-left: auto;
}
.step-nav__btn--next:hover { background: var(--primary-dark); }
.step-nav__btn--submit {
    background: var(--success);
    color: var(--white);
    margin-left: auto;
}
.step-nav__btn--submit:hover { background: #00a884; }

@media (max-width: 768px) {
    .step-nav {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 50;
        background: var(--white);
        border-top: 1px solid var(--gray-200);
        box-shadow: 0 -2px 8px rgba(0,0,0,0.08);
        margin: 0;
        padding: 10px 16px;
        gap: 10px;
        flex-direction: row;
    }
    .step-panel { padding-bottom: 80px; }
    .step-nav__btn {
        padding: 10px 16px;
        font-size: 0.85rem;
        justify-content: center;
        flex: 1;
    }
    .step-nav__btn--next,
    .step-nav__btn--submit {
        margin-left: 0;
        order: 1;
    }
    .step-nav__btn--prev {
        order: 0;
    }
}

/* ========== AVAILABILITY CALENDAR ========== */
.av-cal { max-width: 420px; margin: 0 auto; }
.av-cal__nav { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.av-cal__month { font-size: 1.05rem; font-weight: 700; color: var(--dark); text-transform: capitalize; }
.av-cal__nav-btn { background: none; border: 2px solid var(--gray-300); border-radius: var(--radius-sm); width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; cursor: pointer; color: var(--gray-700); transition: var(--transition); }
.av-cal__nav-btn:hover:not(:disabled) { border-color: var(--primary); color: var(--primary); }
.av-cal__nav-btn:disabled { opacity: 0.3; cursor: default; }
.av-cal__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.av-cal__day-name { text-align: center; font-size: 0.75rem; font-weight: 600; color: var(--gray-500); padding: 4px 0; text-transform: capitalize; }
.av-cal__cell { text-align: center; padding: 8px 0; font-size: 0.9rem; border-radius: 6px; cursor: default; color: var(--gray-400); user-select: none; }
.av-cal__cell--empty { visibility: hidden; }
.av-cal__cell--active { color: var(--dark); cursor: pointer; transition: var(--transition); }
.av-cal__cell--active:hover { background: var(--primary-light); color: var(--primary); }
.av-cal__cell--disabled { color: var(--gray-300); cursor: default; }
.av-cal__cell--selecting { background: var(--primary); color: #fff; border-radius: 6px; font-weight: 700; }
.av-cal__cell--range-start { background: var(--success); color: #fff; border-radius: 6px 0 0 6px; font-weight: 600; }
.av-cal__cell--range-end { background: var(--success); color: #fff; border-radius: 0 6px 6px 0; font-weight: 600; }
.av-cal__cell--range-start.av-cal__cell--range-end { border-radius: 6px; }
.av-cal__cell--range-mid { background: #d4edda; color: #155724; }
.av-cal__ranges { margin-top: 16px; }
.av-cal__range { display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; background: #d4edda; border-radius: var(--radius-sm); margin-bottom: 6px; font-size: 0.9rem; color: #155724; }
.av-cal__range-dates { font-weight: 600; }
.av-cal__range-remove { background: none; border: none; color: var(--danger); cursor: pointer; font-size: 1rem; padding: 2px 6px; border-radius: 4px; transition: var(--transition); }
.av-cal__range-remove:hover { background: rgba(214, 48, 49, 0.1); }
.av-cal__empty { color: var(--gray-500); font-size: 0.85rem; text-align: center; padding: 8px 0; }
.av-cal__hint { color: var(--gray-600); font-size: 0.85rem; margin-bottom: 12px; }
@media (max-width: 768px) {
    .av-cal { max-width: 100%; }
    .av-cal__cell { padding: 6px 0; font-size: 0.8rem; }
}
.rtl .av-cal__cell--range-start { border-radius: 0 6px 6px 0; }
.rtl .av-cal__cell--range-end { border-radius: 6px 0 0 6px; }

/* ========== VACATION PRICING ========== */
.vp-row { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 6px; flex-wrap: nowrap; }
.vp-row .form-group { margin-bottom: 0; }
.vp-row .form-group label { margin-bottom: 2px; font-size: 0.85rem; }
.vp-row__fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); gap: 10px; flex: 1; min-width: 0; padding: 10px 12px; background: var(--gray-100); border-radius: var(--radius-sm); border: 2px solid var(--gray-200); }
.vp-row .form-group input { width: 100%; min-width: 0; }
.vp-row__remove { background: none; border: none; color: var(--danger); cursor: pointer; font-size: 1.1rem; padding: 6px; margin-top: 20px; border-radius: 6px; transition: var(--transition); flex-shrink: 0; }
.vp-row__remove:hover { background: rgba(214, 48, 49, 0.1); }
.vp-add { margin-top: 8px; }
@media (max-width: 768px) {
    .vp-row { gap: 4px; align-items: flex-end; }
    .vp-row__fields { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; padding: 10px; }
    .vp-row__fields .form-group:last-child { grid-column: auto; }
    .vp-row__fields input { width: 100%; min-width: 0; }
    .vp-row__remove { padding: 6px 4px; margin-top: 0; margin-bottom: 14px; }
}

/* ========== EDIT FORM ========== */
.edit-form__tabs {
    display: flex;
    gap: 4px;
    margin-bottom: 16px;
    background: var(--gray-100);
    padding: 4px;
    border-radius: var(--radius);
    position: sticky;
    top: 0;
    z-index: 10;
}
.edit-form__tab {
    flex: 1;
    padding: 10px 14px;
    background: transparent;
    border: none;
    border-radius: calc(var(--radius) - 4px);
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--gray-700);
    cursor: pointer;
    transition: var(--transition);
}
.edit-form__tab:hover { color: var(--gray-900); }
.edit-form__tab.is-active {
    background: var(--white);
    color: var(--primary);
    box-shadow: var(--shadow);
}
@media (max-width: 600px) {
    .edit-form__tab { font-size: 0.85rem; padding: 8px 6px; }
}
.edit-form__section {
    background: var(--white);
    border-radius: var(--radius);
    padding: 24px;
    margin-bottom: 24px;
    box-shadow: var(--shadow);
}
.edit-form__section-title {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--gray-900);
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--gray-200);
}
.edit-form__actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-top: 8px;
    padding: 24px 0;
}
.edit-form__delete-btn {
    background: transparent;
    border: 2px solid var(--danger);
    color: var(--danger);
}
.edit-form__delete-btn:hover {
    background: var(--danger);
    color: var(--white);
}
@media (max-width: 600px) {
    .edit-form__actions { flex-direction: column; align-items: stretch; gap: 10px; }
    .edit-form__delete-btn { order: 3; }
}
.edit-photos-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 12px;
}
.edit-photo-item {
    position: relative;
    border-radius: var(--radius-sm);
    overflow: hidden;
    border: 2px solid var(--gray-200);
}
.edit-photo-item img {
    width: 100%;
    height: 120px;
    object-fit: cover;
    display: block;
}
.edit-photo-item__delete {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 6px 8px;
    font-size: 0.8rem;
    color: var(--danger);
    cursor: pointer;
    background: var(--gray-100);
}
.edit-photo-item__delete input[type="checkbox"] { accent-color: var(--danger); }

/* ========== SUBSCRIPTION PAGE ========== */
.subscription-status__banner {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px;
    border-radius: var(--radius);
    font-size: 0.95rem;
}
.subscription-status__banner--active {
    background: #d5f5e3;
    color: #1e8449;
}
.subscription-status__banner--active i { font-size: 1.2rem; }
.subscription-status__banner--free {
    background: var(--gray-100);
    color: var(--gray-700);
}
.subscription-status__banner--pending {
    background: #fef9e7;
    color: #9a7d0a;
}
.subscription-status__banner--info {
    background: #eaf2fd;
    color: #2471a3;
}
.pricing-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
}
.pricing-card {
    cursor: pointer;
    display: block;
}
.pricing-card__radio { display: none; }
.pricing-card__inner {
    background: var(--white);
    border: 2px solid var(--gray-300);
    border-radius: var(--radius);
    padding: 24px 16px;
    text-align: center;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.pricing-card:hover .pricing-card__inner {
    border-color: var(--primary);
}
.pricing-card__radio:checked + .pricing-card__inner {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.15);
    background: var(--primary-light);
}
.pricing-card__duration {
    font-size: 1rem;
    font-weight: 600;
    color: var(--gray-700);
    margin-bottom: 8px;
}
.pricing-card__price {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--dark);
}
.pricing-card__price span { font-size: 0.9rem; font-weight: 500; }
.pricing-card__permonth {
    font-size: 0.8rem;
    color: var(--gray-600);
    margin-top: 4px;
}
.pricing-card__feature {
    margin-top: 12px;
    font-size: 0.85rem;
    color: var(--success);
    font-weight: 500;
}
.bank-info h3 {
    font-size: 1rem;
    margin-bottom: 8px;
}
.bank-info__ref {
    background: var(--primary-light);
    border: 2px dashed var(--primary);
    border-radius: var(--radius);
    padding: 16px 20px;
    text-align: center;
    margin-bottom: 16px;
}
.bank-info__ref-label {
    font-size: 0.8rem;
    color: var(--gray-600);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 6px;
}
.bank-info__ref-value {
    font-size: 1.4rem;
    font-weight: 700;
    font-family: monospace;
    color: var(--primary);
    letter-spacing: 2px;
}
.bank-info__details {
    background: var(--gray-100);
    border-radius: var(--radius);
    padding: 16px 20px;
}
.bank-info__row {
    display: flex;
    justify-content: space-between;
    padding: 8px 0;
    border-bottom: 1px solid var(--gray-200);
}
.bank-info__row:last-child { border-bottom: none; }
.bank-info__label {
    font-size: 0.85rem;
    color: var(--gray-600);
    font-weight: 500;
}
.bank-info__value {
    font-weight: 600;
    color: var(--dark);
}
.proof-upload h3 {
    font-size: 1rem;
    margin-bottom: 8px;
}

/* Favorite remove */
.favorite-card-wrapper {
    position: relative;
    background: var(--white);
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow);
}
.favorite-card-wrapper .property-card {
    box-shadow: none;
    border-radius: 0;
}
.favorite-remove-form { margin: 0; }
.favorite-remove-btn {
    width: 100%;
    padding: 10px;
    background: none;
    border: none;
    border-top: 1px solid var(--gray-200);
    color: var(--gray-500);
    font-size: 0.78rem;
    cursor: pointer;
    transition: color 0.15s, background 0.15s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}
.favorite-remove-btn:hover { color: var(--danger); background: var(--gray-100); }
.favorite-remove-btn i { font-size: 0.7rem; }

/* Bank credit card */
.bank-credit-card {
    display: block;
    cursor: pointer;
}
.bank-credit-card__inner {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 20px;
    background: var(--gray-100);
    border: 2px solid var(--gray-300);
    border-radius: var(--radius);
    transition: border-color 0.2s, background 0.2s;
}
.bank-credit-card:hover .bank-credit-card__inner {
    border-color: var(--primary);
    background: var(--white);
}
.bank-credit-card__icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--primary-light);
    color: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
}
.bank-credit-card__text {
    flex: 1;
}
.bank-credit-card__text strong {
    display: block;
    font-size: 0.95rem;
    color: var(--dark);
}
.bank-credit-card__text span {
    display: block;
    font-size: 0.8rem;
    color: var(--gray-600);
    margin-top: 2px;
}
.bank-credit-card__check {
    font-size: 1.3rem;
    color: var(--gray-300);
    transition: color 0.2s;
}
.bank-credit-card:has(input:checked) .bank-credit-card__inner {
    border-color: var(--success);
    background: #d5f5e3;
}
.bank-credit-card:has(input:checked) .bank-credit-card__check {
    color: var(--success);
}
.bank-credit-card:has(input:checked) .bank-credit-card__icon {
    background: var(--success);
    color: white;
}

/* Payment detail */
.payment-detail-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    max-width: 800px;
}
.payment-detail-messages {
    max-width: 800px;
    margin-top: 24px;
}
@media (max-width: 768px) {
    .payment-detail-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .payment-detail-grid .detail-card { padding: 14px; }
    .payment-detail-grid .breakdown-row { flex-direction: column; gap: 2px; padding: 8px 0; }
    .payment-detail-grid .breakdown-row__label { font-size: 0.75rem; }
    .payment-detail-grid .breakdown-row__value { font-size: 0.9rem; }
    .payment-detail-messages { margin-top: 16px; padding: 14px; }
    .payment-detail-messages h3 { font-size: 0.95rem; }
    .payment-message { padding: 10px 12px; font-size: 0.85rem; }
    .payment-message__header { flex-direction: column; gap: 2px; font-size: 0.72rem; }
    .payment-message__content { font-size: 0.85rem; }
}

/* Payment history mobile */
.payment-history-mobile { display: none; }
@media (max-width: 768px) {
    .payment-history-desktop { display: none !important; }
    .payment-history-mobile { display: flex; flex-direction: column; gap: 10px; }
}
.payment-card {
    display: block;
    background: var(--white);
    border-radius: var(--radius);
    padding: 14px 16px;
    box-shadow: var(--shadow);
    text-decoration: none;
    color: var(--dark);
    transition: box-shadow 0.15s;
}
.payment-card:hover { box-shadow: var(--shadow-lg); }
.payment-card__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}
.payment-card__date { font-size: 0.75rem; color: var(--gray-500); }
.payment-card__amount { font-size: 1.2rem; font-weight: 700; color: var(--primary); margin-bottom: 4px; }
.payment-card__info {
    display: flex;
    justify-content: space-between;
    font-size: 0.82rem;
    color: var(--gray-600);
}

/* Payment messages */
.payment-messages { display: flex; flex-direction: column; gap: 12px; }
.payment-message {
    padding: 12px 16px;
    border-radius: var(--radius-sm);
    font-size: 0.9rem;
}
.payment-message--admin { background: var(--primary-light); border-left: 3px solid var(--primary); }
.payment-message--user { background: var(--gray-100); border-left: 3px solid var(--gray-400); }
.payment-message__header {
    display: flex;
    justify-content: space-between;
    font-size: 0.8rem;
    color: var(--gray-600);
    margin-bottom: 6px;
}
.payment-message__content { color: var(--dark); line-height: 1.5; }

@keyframes shake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-6px); }
    75% { transform: translateX(6px); }
}

/* ========== AUTH PAGES ========== */
.auth-page {
    min-height: calc(100vh - 64px - 200px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
}
.auth-card {
    background: var(--white);
    border-radius: var(--radius);
    padding: 40px;
    box-shadow: var(--shadow-lg);
    width: 100%;
    max-width: 440px;
}
.auth-card--wide { max-width: 580px; }
.auth-card__title {
    font-size: 1.6rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 4px;
}
.auth-card__subtitle {
    text-align: center;
    color: var(--gray-700);
    font-size: 0.95rem;
    margin-bottom: 28px;
}
.auth-error {
    background: #fde8e8;
    color: var(--danger);
    padding: 12px 16px;
    border-radius: var(--radius-sm);
    font-size: 0.9rem;
    margin-bottom: 20px;
}
.auth-error i { margin-right: 6px; }
.auth-error a { color: var(--danger); font-weight: 600; text-decoration: underline; }
.auth-error a:hover { color: var(--dark); }
.auth-success {
    background: #d5f5e3;
    color: #1e8449;
    padding: 12px 16px;
    border-radius: var(--radius-sm);
    font-size: 0.9rem;
    margin-bottom: 20px;
}
.auth-success i { margin-right: 6px; }
.auth-btn {
    width: 100%;
    padding: 14px;
    background: var(--primary);
    color: var(--white);
    border-radius: var(--radius-sm);
    font-weight: 600;
    font-size: 1rem;
    text-align: center;
    transition: var(--transition);
    margin-top: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.auth-btn:hover { background: var(--primary-dark); }
.auth-card__footer {
    text-align: center;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--gray-300);
    font-size: 0.9rem;
    color: var(--gray-700);
}
.auth-card__footer a {
    color: var(--primary);
    font-weight: 600;
}
.auth-card__footer a:hover { text-decoration: underline; }

/* Quota warning */
.quota-warning {
    background: #fef3cd;
    border: 1px solid #ffc107;
    border-radius: var(--radius-sm);
    padding: 16px 20px;
    margin-bottom: 24px;
    text-align: center;
}
.quota-warning__icon { font-size: 1.5rem; margin-bottom: 8px; color: #e67e22; }
.quota-warning__title { font-weight: 600; margin-bottom: 4px; }
.quota-warning__text { font-size: 0.9rem; color: var(--gray-700); }

/* ========== FOOTER ========== */
.footer {
    background: var(--gray-900);
    color: rgba(255,255,255,0.7);
    padding: 50px 0 0;
}
.footer__inner {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 40px;
    padding-bottom: 40px;
}
.footer__brand .logo-text { color: var(--white); font-size: 1.3rem; }
.footer__brand p { margin-top: 12px; font-size: 0.9rem; }
.footer__links h4 {
    color: var(--white);
    margin-bottom: 16px;
    font-size: 0.95rem;
}
.footer__links a {
    display: block;
    padding: 4px 0;
    font-size: 0.9rem;
    transition: var(--transition);
}
.footer__links a:hover { color: var(--white); }
.footer__bottom {
    border-top: 1px solid rgba(255,255,255,0.1);
    padding: 20px 0;
    font-size: 0.85rem;
    text-align: center;
}
.footer__legal {
    display: flex;
    justify-content: center;
    gap: 16px;
    margin-top: 8px;
    font-size: 0.8rem;
}
.footer__legal a { color: rgba(255,255,255,0.5); }
.footer__legal a:hover { color: var(--white); }

/* Legal pages */
.legal-page { padding: 40px 0 60px; }
.legal-page h1 { font-size: 1.6rem; font-weight: 700; margin-bottom: 24px; }
.legal-page__content h2 { font-size: 1.1rem; font-weight: 600; margin-top: 24px; margin-bottom: 8px; color: var(--dark); }
.legal-page__content p { font-size: 0.92rem; line-height: 1.7; color: var(--gray-700); margin-bottom: 12px; }
.legal-page__content a { color: var(--primary); font-weight: 500; text-decoration: underline; }
.legal-page__content a:hover { color: var(--primary-dark); }

/* ========== ADMIN LAYOUT ========== */
.admin-body {
    display: flex;
    min-height: 100vh;
    background: var(--gray-100);
}
.admin-sidebar {
    width: 260px;
    background: var(--gray-900);
    color: rgba(255,255,255,0.7);
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 50;
}
.admin-sidebar__header {
    padding: 20px 24px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.admin-sidebar__logo {
    color: var(--white);
    font-size: 1.2rem;
    display: flex;
    align-items: center;
    gap: 8px;
}
.admin-sidebar__logo strong { color: var(--primary); }
.admin-sidebar__badge {
    background: var(--primary);
    color: white;
    font-size: 0.65rem;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: 10px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.admin-sidebar__nav {
    flex: 1;
    padding: 16px 12px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.admin-nav-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    border-radius: var(--radius-sm);
    font-size: 0.9rem;
    color: rgba(255,255,255,0.6);
    transition: var(--transition);
}
.admin-nav-item:hover { background: rgba(255,255,255,0.08); color: var(--white); }
.admin-nav-item.active { background: var(--primary); color: var(--white); }
.admin-nav-item i { width: 18px; text-align: center; font-size: 0.85rem; }
.admin-sidebar__footer {
    padding: 12px;
    border-top: 1px solid rgba(255,255,255,0.08);
}

/* Sidebar overlay + close btn (mobile only) */
.admin-sidebar-overlay { display: none; }
.admin-sidebar__close { display: none; }
.admin-topbar__burger { display: none; }

.admin-main {
    flex: 1;
    margin-left: 260px;
    display: flex;
    flex-direction: column;
}
.admin-topbar {
    background: var(--white);
    padding: 16px 30px;
    border-bottom: 1px solid var(--gray-300);
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: sticky;
    top: 0;
    z-index: 40;
}
.admin-topbar__title { font-size: 1.3rem; font-weight: 700; }
.admin-topbar__user { font-size: 0.9rem; color: var(--gray-700); display: flex; align-items: center; gap: 8px; }
.admin-content { padding: 24px 30px; flex: 1; }

/* Flash */
.admin-flash {
    padding: 12px 30px;
    font-size: 0.9rem;
    font-weight: 500;
}
.admin-flash--success { background: #d5f5e3; color: #1e8449; }
.admin-flash--error { background: #fde8e8; color: var(--danger); }
.admin-flash i { margin-right: 8px; }

/* Stats */
.admin-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-bottom: 24px;
}
.stat-card {
    background: var(--white);
    border-radius: var(--radius);
    padding: 20px 24px;
    display: flex;
    align-items: center;
    gap: 16px;
    box-shadow: var(--shadow);
}
.stat-card__icon {
    width: 50px;
    height: 50px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
}
.stat-card--primary .stat-card__icon { background: var(--primary-light); color: var(--primary); }
.stat-card--secondary .stat-card__icon { background: #e8e0fd; color: var(--secondary); }
.stat-card--success .stat-card__icon { background: #d5f5e3; color: var(--success); }
.stat-card--warning .stat-card__icon { background: #fef3cd; color: #e67e22; }
.stat-card--info .stat-card__icon { background: #e0f0ff; color: #1877F2; }
.stat-card--promo .stat-card__icon { background: #e0fde8; color: #00b894; }
.stat-card--views .stat-card__icon { background: #fff3e0; color: #e67e22; }
.stat-card__value { font-size: 1.8rem; font-weight: 700; }
.stat-card__label { font-size: 0.8rem; color: var(--gray-700); }

/* Grid */
.admin-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 24px;
}
.admin-grid--2 { grid-template-columns: repeat(2, 1fr); }

/* Panel */
.admin-panel {
    background: var(--white);
    border-radius: var(--radius);
    padding: 20px 24px;
    box-shadow: var(--shadow);
    margin-bottom: 20px;
}
.admin-panel__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}
.admin-panel__title { font-size: 1rem; font-weight: 600; margin-bottom: 16px; }
.admin-panel--collapsible { padding: 0; }
.admin-panel--collapsible > .admin-panel__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 24px;
    cursor: pointer;
    list-style: none;
    user-select: none;
}
.admin-panel--collapsible > .admin-panel__header::-webkit-details-marker { display: none; }
.admin-panel--collapsible > .admin-panel__header .admin-panel__title { margin-bottom: 0; }
.admin-panel__chevron {
    font-size: 0.75rem;
    color: var(--gray-500);
    transition: transform 0.2s;
}
.admin-panel--collapsible[open] > .admin-panel__header .admin-panel__chevron {
    transform: rotate(180deg);
}
.admin-panel__body {
    padding: 0 24px 24px;
}
.settings-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 800px;
}
.admin-panel__link { color: var(--primary); font-size: 0.85rem; font-weight: 600; }
.admin-panel__link:hover { text-decoration: underline; }

/* Breakdown rows */
.breakdown-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid var(--gray-100);
}
.breakdown-row:last-child { border-bottom: none; }
.breakdown-row__label { font-size: 0.9rem; color: var(--gray-700); display: flex; align-items: center; gap: 8px; }
.breakdown-row__label i { width: 16px; text-align: center; color: var(--gray-500); }
.breakdown-row__value { font-weight: 700; font-size: 1.1rem; }

/* Table */
.admin-table {
    width: 100%;
    border-collapse: collapse;
}
.admin-table th {
    text-align: left;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--gray-700);
    padding: 10px 12px;
    border-bottom: 2px solid var(--gray-300);
}
.admin-table td {
    padding: 12px;
    border-bottom: 1px solid var(--gray-100);
    font-size: 0.9rem;
    vertical-align: middle;
}
.admin-table tbody tr:hover { background: var(--gray-100); }
.admin-table a { color: var(--primary); font-weight: 500; }
.admin-table a:hover { text-decoration: underline; }

/* Badges */
.admin-badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
}
.admin-badge--success { background: #d5f5e3; color: #1e8449; }
.admin-badge--danger { background: #fde8e8; color: var(--danger); }
.admin-badge--warning { background: #fef3cd; color: #9a7d0a; }
.admin-badge--info { background: #e8e0fd; color: var(--secondary); }
.admin-badge--secondary { background: #f0e6ff; color: #6c5ce7; }
.admin-badge--default { background: var(--gray-100); color: var(--gray-700); }

/* Buttons */
.admin-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: var(--radius-sm);
    font-size: 0.85rem;
    font-weight: 600;
    transition: var(--transition);
    border: none;
    cursor: pointer;
}
.admin-btn--sm { padding: 6px 10px; font-size: 0.8rem; }
.admin-btn--primary { background: var(--primary); color: var(--white); }
.admin-btn--primary:hover { background: var(--primary-dark); }
.admin-btn--outline { background: var(--white); color: var(--gray-700); border: 1px solid var(--gray-300); }
.admin-btn--outline:hover { border-color: var(--primary); color: var(--primary); }
.admin-btn--danger { background: #fde8e8; color: var(--danger); border: none; }
.admin-btn--danger:hover { background: var(--danger); color: var(--white); }
.admin-actions { display: flex; gap: 6px; }
.admin-bulk-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    margin-bottom: 12px;
    background: #fde8e8;
    border-radius: var(--radius-sm);
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--danger);
}

/* Toolbar & Search */
.admin-toolbar {
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.admin-search {
    display: flex;
    gap: 8px;
    flex: 1;
    max-width: 500px;
}
.admin-search__input {
    flex: 1;
    padding: 10px 14px;
    border: 2px solid var(--gray-300);
    border-radius: var(--radius-sm);
    background: var(--white);
    font-size: 0.9rem;
}
.admin-search__input:focus { border-color: var(--primary); }
.admin-search__select {
    padding: 10px 12px;
    border: 2px solid var(--gray-300);
    border-radius: var(--radius-sm);
    background: var(--white);
    font-size: 0.9rem;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23636e72' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    padding-right: 30px;
}
.admin-search__btn {
    padding: 10px 16px;
    background: var(--primary);
    color: var(--white);
    border-radius: var(--radius-sm);
    transition: var(--transition);
}
.admin-search__btn:hover { background: var(--primary-dark); }

/* Message filters */
.msg-filters__row {
    display: flex;
    gap: 8px;
    align-items: center;
}
.msg-filters__search {
    position: relative;
    flex: 1;
    min-width: 0;
}
.msg-filters__search .admin-search__input { width: 100%; padding-inline-end: 32px; }
.msg-filters__clear {
    position: absolute;
    top: 50%;
    inset-inline-end: 10px;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: var(--gray-400);
    cursor: pointer;
}
.msg-filters__clear:hover { color: var(--gray-700); }
.msg-filters__reset {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    flex-shrink: 0;
    border: 2px solid var(--gray-300);
    border-radius: var(--radius-sm);
    color: var(--gray-500);
    font-size: 0.85rem;
    transition: var(--transition);
}
.msg-filters__reset:hover { border-color: var(--danger); color: var(--danger); }

@media (max-width: 768px) {
    .msg-filters__row {
        flex-wrap: wrap;
    }
    .msg-filters__search {
        width: 100%;
        flex: none;
    }
    .msg-filters__row .admin-search__select {
        flex: 1;
        min-width: 0;
    }
    .msg-filters__reset {
        width: 42px;
    }
}

/* Message autocomplete suggestions */
.msg-suggestions {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 100;
    background: var(--white);
    border: 2px solid var(--gray-300);
    border-top: none;
    border-radius: 0 0 var(--radius-sm) var(--radius-sm);
    max-height: 220px;
    overflow-y: auto;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.msg-suggest__item {
    padding: 10px 14px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.85rem;
    border-bottom: 1px solid var(--gray-100);
    transition: background 0.15s;
}
.msg-suggest__item:hover { background: var(--gray-50); }
.msg-suggest__item:last-child { border-bottom: none; }
.msg-suggest__title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
}
.msg-suggest__count {
    background: var(--gray-200);
    color: var(--gray-600);
    font-size: 0.7rem;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 10px;
    margin-inline-start: 10px;
    flex-shrink: 0;
}
.msg-suggest__empty {
    padding: 10px 14px;
    color: var(--gray-500);
    font-size: 0.85rem;
}

/* Pagination */
.admin-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 20px 0;
}
.admin-pagination__btn {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-sm);
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--gray-700);
    background: var(--white);
    border: 1px solid var(--gray-300);
    transition: var(--transition);
}
.admin-pagination__btn:hover { border-color: var(--primary); color: var(--primary); }
.admin-pagination__btn.active { background: var(--primary); color: var(--white); border-color: var(--primary); }
.admin-pagination__info { margin-left: 12px; font-size: 0.85rem; color: var(--gray-700); }

/* Setting toggle row */
.setting-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 0;
    border-bottom: 1px solid var(--gray-100);
}
.setting-toggle:last-of-type { border-bottom: none; }
.setting-toggle__label { font-weight: 600; font-size: 0.95rem; display: flex; align-items: center; gap: 8px; }
.setting-toggle__label i { color: var(--gray-500); }
.setting-toggle__desc { font-size: 0.8rem; color: var(--gray-700); margin-top: 2px; }

/* Toggle switch */
.switch {
    position: relative;
    display: inline-block;
    width: 48px;
    height: 26px;
    flex-shrink: 0;
}
.switch input { opacity: 0; width: 0; height: 0; }
.switch__slider {
    position: absolute;
    inset: 0;
    background: var(--gray-300);
    border-radius: 26px;
    cursor: pointer;
    transition: var(--transition);
}
.switch__slider::before {
    content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    left: 3px;
    bottom: 3px;
    background: var(--white);
    border-radius: 50%;
    transition: var(--transition);
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}
.switch input:checked + .switch__slider { background: var(--success); }
.switch input:checked + .switch__slider::before { transform: translateX(22px); }

/* ========== RESPONSIVE ========== */
@media (max-width: 1024px) {
    .header__logo-img { height: 42px; }
    .header__nav { gap: 8px; }
    .header__dropdown-toggle span { display: none; }
    .admin-sidebar { width: 200px; }
    .admin-main { margin-left: 200px; }
    .admin-stats { grid-template-columns: repeat(2, 1fr); }
    .admin-grid { grid-template-columns: 1fr; }
    .admin-grid--2 { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
    .hero { padding: 24px 0 40px; }
    .hero__title { font-size: 1.4rem; margin-bottom: 4px; }
    .hero__subtitle { font-size: 0.95rem; margin-bottom: 20px; }
    .search-form { flex-direction: column; }
    .search-field { width: 100%; }
    .properties-grid { grid-template-columns: 1fr; }
    .property-detail { padding: 16px 0 40px; }
    .property-detail__grid { grid-template-columns: 1fr; gap: 16px; }
    .property-detail__back { font-size: 0.82rem; margin-bottom: 12px; }
    .property-carousel__viewport { height: 240px; }
    .property-carousel__btn { width: 32px; height: 32px; font-size: 0.8rem; }
    .property-carousel__btn--prev { left: 6px; }
    .property-carousel__btn--next { right: 6px; }
    .property-detail__content { margin-top: 16px; }
    .property-detail__title { font-size: 1.3rem; margin-bottom: 4px; }
    .property-detail__location { font-size: 0.85rem; margin-bottom: 16px; }
    .property-detail__features { grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 20px; }
    .detail-feature { padding: 10px 12px; gap: 8px; }
    .detail-feature__icon { width: 30px; height: 30px; font-size: 0.75rem; }
    .detail-feature__text { font-size: 0.82rem; }
    .detail-feature__text strong { font-size: 0.72rem; }
    .property-detail__extras { margin-top: 16px; }
    .property-detail__extras h3 { font-size: 1rem; }
    .extras-tag { font-size: 0.8rem; padding: 6px 10px; }
    .property-detail__description h3 { font-size: 1rem; }
    .property-detail__description p { font-size: 0.9rem; }
    .property-detail__mobile-price {
        display: block;
        background: var(--white);
        border-radius: var(--radius);
        padding: 14px 16px;
        box-shadow: var(--shadow);
        margin-bottom: 16px;
    }
    .property-detail__mobile-price .detail-card__price { font-size: 1.5rem; margin-bottom: 2px; }
    .property-detail__mobile-price .detail-card__label { margin-bottom: 0; }
    .detail-card { padding: 16px; }
    .detail-card__price { font-size: 1.5rem; }
    .detail-card__label { font-size: 0.8rem; margin-bottom: 12px; }
    .detail-card__contact { padding: 12px; font-size: 0.9rem; }
    .detail-card__favorite { padding: 10px; font-size: 0.82rem; }
    .detail-card__edit { padding: 10px; font-size: 0.82rem; }
    .owner-card__avatar { width: 38px; height: 38px; font-size: 1rem; }
    .owner-card__name { font-size: 0.9rem; }
    .modal__content { margin: 16px; max-height: calc(100vh - 32px); overflow-y: auto; }
    .modal__body { padding: 16px; }
    .modal__header { padding: 16px; }
    .modal__footer { flex-direction: column; gap: 8px; }
    .modal__footer .admin-btn { width: 100%; justify-content: center; }
    .footer { padding: 30px 0 0; }
    .footer__inner { grid-template-columns: 1fr 1fr; gap: 20px; padding-bottom: 24px; }
    .footer__brand { grid-column: 1 / -1; text-align: center; }
    .footer__brand img { margin: 0 auto; }
    .footer__brand p { font-size: 0.82rem; }
    .footer__links h4 { font-size: 0.85rem; margin-bottom: 10px; }
    .footer__links a { font-size: 0.82rem; padding: 3px 0; }
    .footer__bottom { padding: 14px 0; font-size: 0.78rem; }
    .agency-header { flex-direction: column; text-align: center; padding: 16px; gap: 12px; }
    .agency-header__avatar { width: 56px; height: 56px; font-size: 1.4rem; }
    .agency-header__name { font-size: 1.1rem; word-break: break-word; }
    .agency-header__meta { justify-content: center; font-size: 0.82rem; gap: 12px; }
    .filters-bar { padding: 0; box-shadow: none; border: none; background: transparent; margin-bottom: 12px; }
    .filters-bar__main { flex-direction: row; flex-wrap: wrap; gap: 8px; align-items: center; }
    .filters-bar__field { min-width: 100%; }
    .filters-bar__field--extra { display: none !important; }
    .filters-bar__field--mobile-only { display: block; }
    .filters-bar__btn--desktop-only { display: none !important; }

    /* Vacation: line 2 = dates (full width); line 3 = sleeps + filters button */
    .filters-bar__field--date {
        display: block;
        min-width: 0;
        flex: 1 1 100%;
        margin: 0;
        order: 1;
    }
    .filters-bar__field--date label { display: none; }
    .filters-bar__field--date .date-range__button { padding: 10px 12px; font-size: 0.85rem; }
    .filters-bar__field--sleeps {
        display: block;
        min-width: 0;
        flex: 1 1 auto;
        margin: 0;
        order: 2;
    }
    .filters-bar__field--sleeps label { display: none; }
    .filters-bar__field--sleeps select {
        width: 100%;
        padding: 10px 28px 10px 10px;
        font-size: 0.82rem;
    }
    .filters-bar__actions { order: 3; }

    /* Location picker (mobile) — full width on its own line */
    .location-picker {
        display: flex;
        align-items: center;
        gap: 8px;
        flex: 1 1 100%;
        min-width: 0;
        padding: 10px 12px;
        background: var(--white);
        border: 2px solid var(--gray-300);
        border-radius: var(--radius-sm);
        font-size: 0.85rem;
        color: var(--gray-700);
        cursor: pointer;
        white-space: nowrap;
        overflow: hidden;
    }
    .location-picker i:first-child { color: var(--primary); flex-shrink: 0; }
    .location-picker span { overflow: hidden; text-overflow: ellipsis; flex: 1; text-align: left; }
    .location-picker__arrow { font-size: 0.6rem; color: var(--gray-500); flex-shrink: 0; }

    /* Location modal (mobile fullscreen) */
    .location-modal { display: none; }
    .location-modal.open {
        display: flex;
        flex-direction: column;
        position: fixed;
        inset: 0;
        z-index: 1001;
        background: var(--white);
    }
    .location-modal__header {
        display: flex; align-items: center; justify-content: space-between;
        padding: 14px 16px; border-bottom: 1px solid var(--gray-300); flex-shrink: 0;
    }
    .location-modal__header h3 {
        font-size: 1.05rem; font-weight: 700; margin: 0;
        display: flex; align-items: center; gap: 8px;
    }
    .location-modal__header h3 i { color: var(--primary); }
    .location-modal__close {
        background: none; border: none; font-size: 1.2rem;
        color: var(--gray-600); cursor: pointer; padding: 4px;
    }
    .location-modal__body { overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 12px; }
    .location-modal__body .filters-bar__field { min-width: 100%; }
    .location-modal__footer {
        flex-shrink: 0; padding: 12px 16px;
        border-top: 1px solid var(--gray-300);
    }
    .location-modal__footer .filters-bar__btn { width: 100%; justify-content: center; }

    /* Filters actions on same line as location picker */
    .filters-bar__actions {
        display: flex;
        gap: 8px;
        flex-shrink: 0;
    }
    .filters-bar__actions .filters-bar__btn {
        justify-content: center;
        font-size: 0.85rem;
        padding: 10px 12px;
    }

    /* Fullscreen filter modal on mobile */
    .filters-advanced {
        padding: 0;
        background: var(--white);
        overflow: hidden;
    }
    .filters-advanced__content {
        max-width: 100%;
        max-height: 100vh;
        max-height: 100dvh;
        height: 100vh;
        height: 100dvh;
        margin: 0;
        border-radius: 0;
        box-shadow: none;
    }
    .filters-advanced__footer { position: sticky; bottom: 0; background: var(--white); }
    .filters-advanced__footer .filters-bar__btn { flex: 1; justify-content: center; }
    .form-grid { grid-template-columns: 1fr; }
    .choice-grid { grid-template-columns: 1fr; }
    /* Operation type cards: keep 3 columns on mobile so rent/sale/vacation all fit above the fold */
    .choice-grid--3 { grid-template-columns: repeat(3, 1fr); gap: 8px; }
    .choice-grid--3 .choice-card { padding: 12px 8px; }
    .choice-grid--3 .choice-card__icon { font-size: 1.4rem; margin-bottom: 4px; }
    .choice-grid--3 .choice-card__label { font-size: 0.78rem; }
    /* Tighter spacing above the step panel */
    .steps-progress { margin-bottom: 18px; }
    .step-panel__title { font-size: 1.1rem; margin-bottom: 14px; }
    .annonce-page__title { font-size: 1.3rem; margin-bottom: 4px; }
    .annonce-page__subtitle { font-size: 0.9rem; margin-bottom: 14px; }
    .header { overflow-x: clip; }
    .header__inner { gap: 6px; height: 56px; padding: 0 10px; }
    .header__menu { display: none; }
    .header__logo-img { height: 32px; }
    .header__nav { gap: 4px; }
    .header__link { display: none; }
    .header__link--search { display: inline-flex; font-size: 1.1rem; margin-inline-end: 6px; }
    .header__link--search span { display: none; }
    .header__link--login {
        display: inline-flex !important;
        align-items: center;
        gap: 4px;
        padding: 5px 12px;
        background: var(--primary);
        color: var(--white) !important;
        border-radius: var(--radius-sm);
        font-size: 0.75rem;
        font-weight: 600;
        white-space: nowrap;
    }
    .header__link--login:hover { background: var(--primary-dark); color: var(--white) !important; }
    .header__link--login i { font-size: 0.7rem; }
    .header__link--login span { display: inline !important; }
    .header__btn { display: none; }
    .header__desktop-only { display: none !important; }
    .header__dropdown { display: flex !important; }
    .header__dropdown-toggle span.header__desktop-only { display: none !important; }
    .header__dropdown-arrow.header__desktop-only { display: none !important; }
    .lang-switcher__btn { padding: 4px 6px; font-size: 0.7rem; border-width: 1.5px; margin-inline-end: 8px; }
    .burger { display: flex; }

    /* Mobile fixed CTA */
    .mobile-cta {
        display: flex;
        position: fixed;
        bottom: 12px;
        left: 50%;
        transform: translateX(-50%);
        z-index: 90;
        padding: 10px 18px;
        background: var(--primary);
        color: var(--white);
        border-radius: 50px;
        font-size: 0.82rem;
        font-weight: 600;
        gap: 6px;
        align-items: center;
        justify-content: center;
        box-shadow: 0 4px 16px rgba(232, 93, 138, 0.4);
        white-space: nowrap;
        transition: width 0.25s ease, padding 0.25s ease, left 0.25s ease, transform 0.25s ease, border-radius 0.25s ease;
    }
    .mobile-cta:hover { background: var(--primary-dark); color: var(--white); }
    .mobile-cta--hidden { display: none !important; }

    /* Compact mode: round "+" button pinned to the left when the user scrolls */
    .mobile-cta--compact {
        width: 40px;
        height: 40px;
        padding: 0;
        border-radius: 50%;
        left: 16px;
        transform: none;
        font-size: 1rem;
        gap: 0;
    }
    .mobile-cta--compact .mobile-cta__label { display: none; }
    .rtl .mobile-cta--compact { left: auto; right: 16px; }
    .step-label { display: none; }

    /* Admin sidebar: slide-in on mobile */
    .admin-sidebar {
        transform: translateX(-100%);
        transition: transform 0.25s ease;
        z-index: 1000;
        width: 260px;
    }
    .admin-sidebar.open { transform: translateX(0); }
    .admin-sidebar__nav { flex: 1; overflow-y: auto; }
    .admin-sidebar__footer { flex-shrink: 0; }
    .admin-sidebar-overlay {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.4);
        z-index: 999;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.25s ease;
    }
    .admin-sidebar-overlay.open { opacity: 1; pointer-events: auto; }
    .admin-sidebar__close {
        display: flex;
        align-items: center;
        justify-content: center;
        background: none;
        border: none;
        color: rgba(255,255,255,0.6);
        font-size: 1.1rem;
        cursor: pointer;
        padding: 4px;
    }
    .admin-sidebar__close:hover { color: var(--white); }
    .admin-topbar__burger {
        display: flex;
        align-items: center;
        justify-content: center;
        background: none;
        border: none;
        font-size: 1.2rem;
        color: var(--gray-700);
        cursor: pointer;
        padding: 4px;
        margin-right: 8px;
    }
    .admin-main { margin-left: 0; overflow-x: hidden; }
    .admin-topbar { padding: 12px 16px; }
    .admin-topbar__title { font-size: 1.05rem; }
    .admin-topbar__user span { display: none; }
    .admin-content { padding: 12px 10px; }
    .admin-flash { padding: 10px 12px; font-size: 0.85rem; }

    /* Stats: 2 columns on mobile */
    .admin-stats { grid-template-columns: repeat(2, 1fr); gap: 10px; margin-bottom: 16px; }
    .stat-card { padding: 12px 14px; gap: 10px; }
    .stat-card__icon { width: 38px; height: 38px; font-size: 1rem; border-radius: 10px; }
    .stat-card__value { font-size: 1.3rem; }
    .stat-card__label { font-size: 0.7rem; }

    /* Grids: single column */
    .admin-grid { grid-template-columns: 1fr; gap: 12px; }
    .admin-grid--2 { grid-template-columns: 1fr; gap: 12px; }

    /* Panels */
    .admin-panel { padding: 14px 12px; margin-bottom: 12px; }
    .admin-panel__title { font-size: 0.9rem; }
    .admin-panel__header { flex-wrap: wrap; gap: 8px; }

    /* Tables: scrollable horizontally */
    .admin-table { font-size: 0.75rem; }
    .admin-table th { padding: 8px 6px; font-size: 0.65rem; }
    .admin-table td { padding: 8px 6px; }
    .admin-panel:has(.admin-table) { overflow-x: auto; }

    /* Actions: wrap */
    .admin-actions { flex-wrap: wrap; gap: 4px; }
    .admin-btn--sm { padding: 5px 8px; font-size: 0.75rem; }

    /* Toolbar */
    .admin-toolbar { flex-direction: column; gap: 8px; }
    .admin-search { max-width: 100%; }
    .admin-search__input { font-size: 0.85rem; }

    /* Settings */
    .settings-list .form-grid { grid-template-columns: 1fr; }
    .setting-toggle { flex-wrap: wrap; gap: 8px; }

    /* Pagination */
    .admin-pagination { flex-wrap: wrap; justify-content: center; gap: 4px; }

    /* User show page grid */
    div[style*="grid-template-columns: 1fr 1fr"] { grid-template-columns: 1fr !important; }

    /* Admin filters bar */
    .admin-content .filters-bar { padding: 12px; }
    .admin-content .filters-bar__main { flex-direction: column; gap: 8px; }
    .admin-content .filters-bar__field { min-width: 100%; }
    .admin-content .filters-bar__field select,
    .admin-content .filters-bar__field input { font-size: 0.85rem; padding: 8px 10px; }

    /* Admin table: hide less important columns */
    .admin-table .hide-mobile { display: none; }

    /* Results info bar */
    .admin-content > div[style*="display: flex; justify-content: space-between"] {
        flex-direction: column !important;
        gap: 6px !important;
    }
}

/* ========== RTL SUPPORT (Arabic) ========== */
html:has(body.rtl),
body.rtl {
    overflow-x: hidden;
}
body.rtl {
    font-family: 'Noto Sans Arabic', 'Inter', -apple-system, sans-serif;
    direction: rtl;
    text-align: right;
}
.rtl input[type="number"],
.rtl input[type="tel"],
.rtl input[type="email"],
.rtl input[type="date"] {
    direction: ltr;
    text-align: right;
}
/* Force LTR for prices and numbers */
.rtl .property-card__price,
.rtl .detail-card__price,
.rtl .my-ad-card__price,
.rtl .stat-card__value,
.rtl .breakdown-row__value,
.rtl .pricing-card__price,
.rtl .pricing-card__permonth,
.rtl .admin-badge,
.rtl .my-ads-tab__count,
.rtl .my-ads-header__quota,
.rtl .admin-table td,
.rtl .bank-info__ref-value,
.rtl .bank-info__value {
    direction: ltr;
    text-align: right;
    unicode-bidi: isolate;
}

.rtl .header__nav { direction: ltr; }
.rtl .header__menu { direction: rtl; }
.rtl .header__submenu { left: auto; right: 0; }
.rtl .header__dropdown-menu { right: 0; left: auto; }
.rtl .search-form { flex-direction: row-reverse; }
.rtl .search-field select,
.rtl .filters-bar__field select,
.rtl .form-group select {
    background-position: left 12px center;
    padding-left: 36px;
    padding-right: 14px;
}
.rtl .property-card__badge { left: auto; right: 12px; }
.rtl .property-card__type { right: auto; left: 12px; }
.rtl .favorite-btn { right: auto; left: 12px; }
.rtl .property-card__features { flex-direction: row-reverse; }
.rtl .property-card__feature { direction: ltr; unicode-bidi: isolate; }
.rtl .property-card__location { flex-direction: row-reverse; }
@media (min-width: 769px) {
    .rtl .section__header { flex-direction: row-reverse; }
}
.rtl .section__link { flex-direction: row-reverse; }
.rtl .detail-feature { direction: ltr; unicode-bidi: isolate; }
.rtl .owner-card__phone { direction: ltr; unicode-bidi: isolate; }
.rtl .my-ad-card__detail { direction: ltr; unicode-bidi: isolate; }
.rtl .extras-tag { flex-direction: row-reverse; }
.rtl .property-detail__grid { direction: rtl; }
.rtl .property-detail__location { flex-direction: row-reverse; }
.rtl .property-detail__back { flex-direction: row-reverse; }
.rtl .flash i { margin-right: 0; margin-left: 8px; }
.rtl .footer__inner { direction: rtl; }
.rtl .step-nav { direction: ltr; }
.rtl .filters-bar__main { flex-direction: row-reverse; }
.rtl .filters-bar__btn { flex-direction: row-reverse; }
.rtl .filters-bar .search-tabs { flex-direction: row-reverse; }
.rtl .admin-pagination__info { margin-left: 0; margin-right: 12px; }
.rtl .owner-card__header { flex-direction: row-reverse; }
.rtl .owner-card__phone { flex-direction: row-reverse; }
.rtl .breakdown-row { flex-direction: row-reverse; }
.rtl .breakdown-row__label { flex-direction: row-reverse; }
.rtl .my-ad-card { flex-direction: row-reverse; }
.rtl .my-ad-card__top { flex-direction: row-reverse; }
.rtl .my-ad-card__meta { flex-direction: row-reverse; }
.rtl .my-ad-card__actions { border-left: none; border-right: 1px solid var(--gray-100); }
.rtl .my-ad-card__date { margin-left: 0; margin-right: auto; }
.rtl .saved-search-card { flex-direction: row-reverse; }
.rtl .saved-search-card__header { flex-direction: row-reverse; }
.rtl .saved-search-card__meta { flex-direction: row-reverse; }
.rtl .modal__header { flex-direction: row-reverse; }
.rtl .modal__footer { flex-direction: row-reverse; }
.rtl .header__dropdown-item { flex-direction: row-reverse; }
.rtl .header__dropdown-item i { text-align: center; }
.rtl .account-grid { direction: rtl; }
.rtl .form-grid { direction: rtl; }
.rtl .choice-grid { direction: rtl; }
.rtl .admin-sidebar { left: auto; right: 0; }
.rtl .admin-main { margin-left: 0; margin-right: 260px; }
.rtl .admin-nav-item { flex-direction: row-reverse; }
.rtl .admin-topbar { flex-direction: row-reverse; }
.rtl .admin-actions { flex-direction: row-reverse; }

@media (max-width: 768px) {
    .rtl .search-form { flex-direction: column; }
    .rtl .filters-bar__main { flex-direction: row-reverse; flex-wrap: nowrap; }
    .rtl .my-ad-card { flex-direction: column-reverse; }
    .rtl .my-ad-card__actions { flex-direction: row-reverse; border-right: none; }
    .rtl .admin-main { margin-right: 0; }
}

/* ===== Pricing page ===== */

.pricing-page { padding: 40px 0 60px; }
.pricing-hero {
    text-align: center;
    margin-bottom: 40px;
}
.pricing-hero__title {
    font-size: 2rem;
    font-weight: 800;
    color: var(--dark);
    margin-bottom: 8px;
}
.pricing-hero__subtitle {
    font-size: 1.1rem;
    color: var(--gray-500);
    max-width: 600px;
    margin: 0 auto;
}

.pricing-comparison {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    max-width: 800px;
    margin: 0 auto 48px;
}
.pricing-comparison__card {
    background: #fff;
    border-radius: 16px;
    padding: 32px 28px;
    box-shadow: 0 2px 12px rgba(0,0,0,.06);
    position: relative;
    border: 2px solid var(--gray-100);
}
.pricing-comparison__card--premium {
    border-color: var(--primary);
    box-shadow: 0 4px 24px rgba(0,0,0,.1);
}
.pricing-comparison__popular {
    position: absolute;
    top: -14px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--primary);
    color: #fff;
    padding: 4px 16px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
}
.pricing-comparison__badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--gray-600);
    margin-bottom: 12px;
}
.pricing-comparison__badge--premium {
    color: var(--primary);
}
.pricing-comparison__price {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--dark);
    margin-bottom: 20px;
}
.pricing-comparison__features {
    list-style: none;
    padding: 0;
    margin: 0;
}
.pricing-comparison__features li {
    padding: 8px 0;
    font-size: 0.9rem;
    color: var(--gray-700);
    display: flex;
    align-items: flex-start;
    gap: 10px;
}
.pricing-comparison__features li i.fa-check {
    color: #43a047;
    margin-top: 3px;
    flex-shrink: 0;
}
.pricing-comparison__features li i.fa-times {
    color: var(--gray-400);
    margin-top: 3px;
    flex-shrink: 0;
}
.pricing-comparison__feature--muted {
    color: var(--gray-400) !important;
}

.pricing-section-title {
    text-align: center;
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--dark);
    margin: 0 0 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}
.pricing-section-title i { color: var(--primary); }

.pricing-tables {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    max-width: 800px;
    margin: 0 auto 48px;
}
.pricing-table {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
.pricing-table__header {
    padding: 20px 24px;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 10px;
}
.pricing-table__header h3 {
    margin: 0;
    font-size: 1.1rem;
}
.pricing-table__subtitle {
    margin: 4px 0 0;
    font-size: 0.78rem;
    font-weight: 400;
    opacity: 0.85;
}
.pricing-table__icon {
    font-size: 1.3rem;
    opacity: 0.8;
}
.pricing-table__header--particular {
    background: linear-gradient(135deg, #667eea, #764ba2);
}
.pricing-table__header--agency {
    background: linear-gradient(135deg, #f093fb, #f5576c);
}
.pricing-table__body { padding: 8px 0; }
.pricing-table__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 24px;
    border-bottom: 1px solid var(--gray-50);
}
.pricing-table__row:last-child { border-bottom: none; }
.pricing-table__row--highlight {
    background: #fffbeb;
}
.pricing-table__duration {
    font-weight: 600;
    color: var(--dark);
    display: flex;
    align-items: center;
    gap: 8px;
}
.pricing-table__best {
    background: #f59e0b;
    color: #fff;
    font-size: 0.7rem;
    padding: 2px 8px;
    border-radius: 10px;
    font-weight: 600;
}
.pricing-table__price-info {
    text-align: right;
}
.pricing-table__total {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--dark);
    display: block;
}
.pricing-table__permonth {
    font-size: 0.8rem;
    color: var(--gray-500);
}

.pricing-advantages {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    max-width: 900px;
    margin: 0 auto 48px;
}
.pricing-advantage {
    text-align: center;
    padding: 24px 16px;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
.pricing-advantage__icon {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 14px;
    font-size: 1.3rem;
}
.pricing-advantage__icon--boost {
    background: #e8f5e9; color: #43a047;
}
.pricing-advantage__icon--photos {
    background: var(--primary-light, #eef2ff); color: var(--primary);
}
.pricing-advantage__icon--ads {
    background: #fff3e0; color: #f57c00;
}
.pricing-advantage__icon--support {
    background: #ffeef1; color: #e85d8a;
}
.pricing-advantage h4 {
    font-size: 0.95rem;
    margin: 0 0 6px;
    color: var(--dark);
}
.pricing-advantage p {
    font-size: 0.8rem;
    color: var(--gray-500);
    margin: 0;
    line-height: 1.5;
}

.pricing-cta {
    text-align: center;
    padding: 40px 20px;
    background: linear-gradient(135deg, var(--primary), #764ba2);
    border-radius: 20px;
    margin-bottom: 20px;
}
.pricing-cta__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 36px;
    background: #fff;
    color: var(--primary);
    font-weight: 700;
    font-size: 1.05rem;
    border-radius: 12px;
    text-decoration: none;
    transition: transform .15s, box-shadow .15s;
}
.pricing-cta__btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0,0,0,.15);
}
.pricing-cta__hint {
    color: rgba(255,255,255,.8);
    font-size: 0.85rem;
    margin: 12px 0 0;
}

@media (max-width: 768px) {
    .pricing-hero__title { font-size: 1.5rem; }
    .pricing-hero__subtitle { font-size: 0.95rem; }
    .pricing-comparison {
        grid-template-columns: 1fr;
        max-width: 400px;
    }
    .pricing-comparison__card { padding: 24px 20px; }
    .pricing-tables {
        grid-template-columns: 1fr;
        max-width: 400px;
    }
    .pricing-advantages {
        grid-template-columns: 1fr 1fr;
        gap: 12px;
    }
    .pricing-advantage { padding: 18px 12px; }
    .pricing-cta { padding: 28px 16px; border-radius: 14px; }
    .pricing-cta__btn { padding: 12px 24px; font-size: 0.95rem; }
}
@media (max-width: 480px) {
    .pricing-advantages { grid-template-columns: 1fr; }
}

/* RTL pricing */
[dir="rtl"] .pricing-table__price-info { text-align: left; }

/* ===== Statistics page ===== */

.stats-summary {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 24px;
}
.stats-summary__card {
    display: flex;
    align-items: center;
    gap: 16px;
    background: #fff;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 1px 4px rgba(0,0,0,.06);
    border-left: 4px solid transparent;
}
.stats-summary__card--views { border-left-color: var(--primary); }
.stats-summary__card--favorites { border-left-color: #e85d8a; }
.stats-summary__card--ads { border-left-color: #43a047; }
.stats-summary__icon {
    width: 48px; height: 48px;
    border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.2rem;
    flex-shrink: 0;
}
.stats-summary__card--views .stats-summary__icon {
    background: var(--primary-light, #eef2ff); color: var(--primary);
}
.stats-summary__card--favorites .stats-summary__icon {
    background: #ffeef1; color: #e85d8a;
}
.stats-summary__card--ads .stats-summary__icon {
    background: #e8f5e9; color: #43a047;
}
.stats-summary__value {
    font-size: 1.5rem; font-weight: 700; color: var(--dark); line-height: 1.2;
}
.stats-summary__label {
    font-size: 0.85rem; color: var(--gray-500); margin-top: 2px;
}

.stats-filters {
    background: #fff;
    border-radius: 12px;
    padding: 16px 20px;
    margin-bottom: 20px;
    box-shadow: 0 1px 4px rgba(0,0,0,.06);
}
.stats-filters__form {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}
.stats-filters__group {
    display: flex; gap: 10px; flex-wrap: wrap;
}
.stats-filters__select {
    padding: 8px 12px;
    border: 1px solid var(--gray-200);
    border-radius: 8px;
    font-size: 0.85rem;
    background: var(--gray-50);
    cursor: pointer;
    min-width: 140px;
}
.stats-filters__sort {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.stats-filters__sort-label {
    font-size: 0.8rem; color: var(--gray-500); white-space: nowrap;
}
.stats-filters__sort-btn {
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 0.8rem;
    color: var(--gray-600);
    background: var(--gray-50);
    text-decoration: none;
    transition: all .15s;
    white-space: nowrap;
}
.stats-filters__sort-btn:hover { background: var(--gray-100); }
.stats-filters__sort-btn.active {
    background: var(--primary);
    color: #fff;
}

/* Stats cards grid */
.stats-cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: 14px;
}

.stats-card-mobile {
    background: #fff;
    border-radius: 12px;
    padding: 14px;
    margin-bottom: 12px;
    box-shadow: 0 1px 4px rgba(0,0,0,.06);
}
.stats-card-mobile__top {
    display: flex; gap: 12px; align-items: flex-start;
}
.stats-card-mobile__img {
    width: 64px; height: 50px;
    object-fit: cover;
    border-radius: 8px;
    flex-shrink: 0;
}
.stats-card-mobile__img--empty {
    background: var(--gray-100);
    display: flex; align-items: center; justify-content: center;
    color: var(--gray-400);
}
.stats-card-mobile__info { flex: 1; min-width: 0; }
.stats-card-mobile__title {
    font-weight: 600; font-size: 0.9rem; color: var(--dark);
    text-decoration: none;
    display: block;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.stats-card-mobile__meta {
    font-size: 0.8rem; color: var(--gray-500);
    margin-top: 4px;
    display: flex; align-items: center; gap: 8px;
}
.stats-card-mobile__counters {
    display: flex;
    gap: 4px;
    margin-top: 12px;
    border-top: 1px solid var(--gray-100);
    padding-top: 10px;
}
.stats-card-mobile__counter {
    flex: 1;
    display: flex; flex-direction: column; align-items: center;
    font-size: 0.8rem; color: var(--gray-600); gap: 2px;
}
.stats-card-mobile__counter i { font-size: 0.9rem; }
.stats-card-mobile__counter span { font-weight: 600; font-size: 0.95rem; }
.stats-card-mobile__counter small { font-size: 0.7rem; color: var(--gray-400); }
.stats-card-mobile__counter--fav { color: #e85d8a; }
.stats-card-mobile__counter--fav span { color: #e85d8a; }

@media (max-width: 768px) {
    .stats-summary {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .stats-summary__card {
        padding: 14px 16px;
    }
    .stats-summary__value { font-size: 1.25rem; }
    .stats-filters__form {
        flex-direction: column;
        align-items: stretch;
    }
    .stats-filters__group { flex-direction: column; }
    .stats-filters__select { min-width: 0; width: 100%; }
    .stats-filters__sort {
        justify-content: center;
    }
    .stats-cards-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }
}
@media (min-width: 769px) and (max-width: 1024px) {
    .stats-summary {
        grid-template-columns: repeat(3, 1fr);
        gap: 12px;
    }
}

/* RTL stats */
[dir="rtl"] .stats-summary__card {
    border-left: none;
    border-right: 4px solid transparent;
}
[dir="rtl"] .stats-summary__card--views { border-right-color: var(--primary); }
[dir="rtl"] .stats-summary__card--favorites { border-right-color: #e85d8a; }
[dir="rtl"] .stats-summary__card--ads { border-right-color: #43a047; }

/* ========== AGENCIES LISTING ========== */
.agencies-page { padding: 32px 0 60px; }
.agencies-header { text-align: center; margin-bottom: 28px; }
.agencies-header__title {
    font-size: 1.8rem;
    font-weight: 800;
    color: var(--gray-900);
    margin: 0 0 6px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
.agencies-header__title i { color: var(--primary); }
.agencies-header__subtitle { color: var(--gray-700); font-size: 0.95rem; margin: 0; }

.agencies-filter {
    display: flex;
    gap: 12px;
    align-items: flex-end;
    background: var(--white);
    padding: 18px 20px;
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    margin-bottom: 24px;
    flex-wrap: wrap;
}
.agencies-filter__field { flex: 1; min-width: 180px; }
.agencies-filter__field label {
    display: block;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--gray-700);
    margin-bottom: 6px;
}
.agencies-filter__field select {
    width: 100%;
    padding: 10px 12px;
    border: 2px solid var(--gray-300);
    border-radius: var(--radius-sm);
    font-size: 0.95rem;
    background: var(--white);
}
.agencies-filter__actions { display: flex; gap: 8px; }

.agencies-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
    gap: 16px;
    margin-bottom: 32px;
}
.agency-card {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px;
    background: var(--white);
    border: 1px solid var(--gray-200);
    border-radius: var(--radius);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
    text-decoration: none;
    color: var(--dark);
    transition: var(--transition);
}
.agency-card:hover {
    transform: translateY(-2px);
    border-color: var(--primary-light);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
}
.agency-card__avatar {
    flex-shrink: 0;
    width: 56px; height: 56px;
    border-radius: 50%;
    background: var(--primary-light);
    color: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
}
.agency-card__body { flex: 1; min-width: 0; }
.agency-card__name {
    font-size: 1rem;
    font-weight: 700;
    color: var(--gray-900);
    margin: 0 0 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.agency-card__location,
.agency-card__address,
.agency-card__phone,
.agency-card__count {
    font-size: 0.85rem;
    color: var(--gray-700);
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 2px;
}
.agency-card__location i,
.agency-card__address i,
.agency-card__phone i,
.agency-card__count i { color: var(--primary); width: 14px; flex-shrink: 0; }
.agency-card__cta {
    flex-shrink: 0;
    color: var(--gray-500);
    transition: var(--transition);
}
.agency-card:hover .agency-card__cta { color: var(--primary); transform: translateX(4px); }

.agencies-empty {
    text-align: center;
    padding: 60px 20px;
    color: var(--gray-700);
}
.agencies-empty i { font-size: 2.5rem; color: var(--gray-400); margin-bottom: 12px; }
.agencies-empty h3 { font-size: 1.2rem; margin: 0 0 6px; }

.pagination {
    display: flex;
    justify-content: center;
    gap: 4px;
    margin: 24px 0;
    flex-wrap: wrap;
}
.pagination__item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    height: 38px;
    padding: 0 10px;
    border: 1px solid var(--gray-200);
    background: var(--white);
    color: var(--dark);
    font-weight: 600;
    font-size: 0.9rem;
    border-radius: 8px;
    text-decoration: none;
    transition: var(--transition);
}
.pagination__item:hover { background: var(--primary-light); color: var(--primary); border-color: var(--primary-light); }
.pagination__item--active { background: var(--primary); color: var(--white); border-color: var(--primary); }
.pagination__item--active:hover { background: var(--primary-dark); color: var(--white); }
.pagination__ellipsis {
    display: inline-flex;
    align-items: center;
    min-width: 20px;
    color: var(--gray-500);
    padding: 0 4px;
}

@media (max-width: 600px) {
    .agencies-header__title { font-size: 1.4rem; }
    .agencies-filter { padding: 14px; gap: 10px; }
    .agencies-filter__field { min-width: 100%; }
    .agencies-filter__actions { width: 100%; }
    .agencies-filter__actions .filters-bar__btn { flex: 1; justify-content: center; }
}