/* 🎯 SAVDO DYNAMIC ADAPTIVE 3-ROW CATEGORY SHOWCASE (18 CARDS - PERFECT 6 CARDS PER ROW) */
.savdo-cat-wrapper {
    width: 100% !important;
    max-width: 1240px !important;
    margin: 16px auto 20px auto !important;
    padding: 0 15px !important;
    box-sizing: border-box !important;
    clear: both !important;
    position: relative !important;
    z-index: 5 !important;
}

.savdo-cat-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    justify-content: space-between !important;
    align-items: stretch !important;
    width: 100% !important;
}

.savdo-cat-card {
    position: relative !important;
    background: #f1f5f9 !important;
    border-radius: 14px !important;
    padding: 10px 46px 10px 12px !important;
    margin: 0 !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    height: 75px !important;
    min-height: 75px !important;
    max-height: 75px !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    border: 1px solid #e2e8f0 !important;
}

.savdo-cat-card:hover {
    background: #ffffff !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08) !important;
    border-color: #cbd5e1 !important;
    transform: translateY(-2px) !important;
}

.savdo-cat-title {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #0f172a !important;
    line-height: 1.25 !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    z-index: 2 !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    word-wrap: normal !important;
    hyphens: none !important;
}

/* 🖼️ LARGE ENLARGED CATEGORY ICON AT BOTTOM RIGHT CORNER */
.savdo-cat-icon {
    position: absolute !important;
    right: -2px !important;
    bottom: -2px !important;
    height: 82px !important;
    width: 82px !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-end !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

.savdo-cat-icon img {
    width: 100% !important;
    height: 100% !important;
    max-width: 82px !important;
    max-height: 82px !important;
    object-fit: contain !important;
    object-position: right bottom !important;
    transform: scale(1.45) !important;
    transform-origin: right bottom !important;
}

/* 🎯 ROW 1 (6 CARDS - 16.66% EACH) */
.savdo-cat-card[data-title*="От застройщика"], a[href*="new-buildings"] { flex: 1 1 calc(16.66% - 8px) !important; min-width: 140px !important; }
.savdo-cat-card[data-title*="Недвижимость"], a[href*="nedvizhimost"]   { flex: 1 1 calc(16.66% - 8px) !important; min-width: 140px !important; }
.savdo-cat-card[data-title*="Транспорт"], a[href*="transport"]         { flex: 1 1 calc(16.66% - 8px) !important; min-width: 130px !important; }
.savdo-cat-card[data-title*="Телефоны"], a[href*="telefony_i_gadzhety"]{ flex: 1 1 calc(16.66% - 8px) !important; min-width: 140px !important; }
.savdo-cat-card[data-title*="Детские"], a[href*="detskie_tovary"]      { flex: 1 1 calc(16.66% - 8px) !important; min-width: 130px !important; }
.savdo-cat-card[data-title*="Авиабилеты"], a[href*="aviabileti_i_turi"]{ flex: 1 1 calc(16.66% - 8px) !important; min-width: 140px !important; }

/* 🎯 ROW 2 (6 CARDS - 16.66% EACH) */
.savdo-cat-card[data-title*="Вакансия"], a[href*="vakasiya"]          { flex: 1 1 calc(16.66% - 8px) !important; min-width: 120px !important; }
.savdo-cat-card[data-title*="Бытовая"], a[href*="elektronika_i_bytovaya_tehnika"] { flex: 1 1 calc(16.66% - 8px) !important; min-width: 150px !important; }
.savdo-cat-card[data-title*="Компьютеры"], a[href*="kompyutery_i_orgtehnika"]    { flex: 1 1 calc(16.66% - 8px) !important; min-width: 150px !important; }
.savdo-cat-card[data-title*="Все для дома"], a[href*="vse_dlya_doma"]           { flex: 1 1 calc(16.66% - 8px) !important; min-width: 130px !important; }
.savdo-cat-card[data-title*="Одежда"], a[href*="odezhda_i_lichnye_veshchi"]      { flex: 1 1 calc(16.66% - 8px) !important; min-width: 140px !important; }
.savdo-cat-card[data-title*="Услуги"], a[href*="uslugi"]                         { flex: 1 1 calc(16.66% - 8px) !important; min-width: 120px !important; }

/* 🎯 ROW 3 (6 CARDS - 16.66% EACH INCLUDING VIDEO REELS) */
.savdo-cat-card[data-title*="Оптовики"], a[href*="optoviki"]                     { flex: 1 1 calc(16.66% - 8px) !important; min-width: 130px !important; }
.savdo-cat-card[data-title*="Строительство"], a[href*="stroitelstvo_i_remont"]   { flex: 1 1 calc(16.66% - 8px) !important; min-width: 160px !important; }
.savdo-cat-card[data-title*="Все для бизнеса"], a[href*="vse_dlya_biznesa"]      { flex: 1 1 calc(16.66% - 8px) !important; min-width: 160px !important; }
.savdo-cat-card[data-title*="Спорт"], a[href*="sport_i_razvlechenie"]           { flex: 1 1 calc(16.66% - 8px) !important; min-width: 150px !important; }
.savdo-cat-card[data-title*="Животные"], a[href*="zhivotnye_i_rasteniya"]        { flex: 1 1 calc(16.66% - 8px) !important; min-width: 150px !important; }
.savdo-cat-card[data-title*="Видео-рилсы"], a.savdo-cat-reels-card               { flex: 1 1 calc(16.66% - 8px) !important; min-width: 140px !important; }

/* 🚗📱💻✈️🏗️🎬 CUSTOM ENLARGED SCALES FOR SPECIFIC ICONS */
.savdo-cat-card[data-title*="Транспорт"] .savdo-cat-icon img, a[href*="transport"] .savdo-cat-icon img { transform: scale(1.85) !important; transform-origin: right bottom !important; }
.savdo-cat-card[data-title*="Телефоны"] .savdo-cat-icon img, a[href*="telefony_i_gadzhety"] .savdo-cat-icon img { transform: scale(1.85) !important; transform-origin: right bottom !important; }
.savdo-cat-card[data-title*="Компьютеры"] .savdo-cat-icon img, a[href*="kompyutery_i_orgtehnika"] .savdo-cat-icon img { transform: scale(1.85) !important; transform-origin: right bottom !important; }
.savdo-cat-card[data-title*="Авиабилеты"] .savdo-cat-icon img, a[href*="aviabileti_i_turi"] .savdo-cat-icon img { transform: scale(1.85) !important; transform-origin: right bottom !important; }
.savdo-cat-card[data-title*="Строительство"] .savdo-cat-icon img, a[href*="stroitelstvo_i_remont"] .savdo-cat-icon img { transform: scale(1.85) !important; transform-origin: right bottom !important; }
/* Reels icon now uses circular Play icon */

/* 📱 SAVDO STORIES & PROMOTIONS SHOWCASE (BULLETPROOF DIMENSIONS) */
.savdo-stories-wrapper {
    width: 100% !important;
    max-width: 1240px !important;
    margin: 20px auto 30px auto !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    clear: both !important;
}

.savdo-stories-track-outer {
    position: relative !important;
    width: 100% !important;
    overflow: hidden !important;
}

.savdo-stories-track-outer::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 48px !important;
    background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1)) !important;
    pointer-events: none !important;
    z-index: 3 !important;
}

.savdo-stories-track {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    overflow-x: auto !important;
    scroll-behavior: smooth !important;
    padding: 8px 4px 12px 4px !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
}

.savdo-stories-track::-webkit-scrollbar {
    display: none !important;
}

.savdo-story-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    cursor: pointer !important;
    flex: 0 0 auto !important;
    width: 104px !important;
    user-select: none !important;
    transition: transform 0.2s ease !important;
}

.savdo-story-item:hover {
    transform: translateY(-2px) !important;
}

.savdo-story-ring {
    position: relative !important;
    width: 95px !important;
    height: 95px !important;
    min-width: 95px !important;
    min-height: 95px !important;
    max-width: 95px !important;
    max-height: 95px !important;
    border-radius: 50% !important;
    background: linear-gradient(135deg, #10b981, #3b82f6) !important;
    padding: 1.8px !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 3px 8px rgba(16, 185, 129, 0.2) !important;
    transition: all 0.2s ease !important;
}

.savdo-story-ring.viewed {
    background: #cbd5e1 !important;
    box-shadow: none !important;
    opacity: 0.8 !important;
}

.savdo-story-ring img {
    display: block !important;
    width: 91.4px !important;
    height: 91.4px !important;
    min-width: 91.4px !important;
    min-height: 91.4px !important;
    max-width: 91.4px !important;
    max-height: 91.4px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    background: #f1f5f9 !important;
    border: 0.8px solid #ffffff !important;
    box-sizing: border-box !important;
}

.savdo-story-label {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    margin-top: 6px !important;
    text-align: center !important;
    width: 104px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}
/* 🛍️ SAVDO RECOMMENDED PRODUCTS GRID (1240PX CONTAINER MATCH) */
.savdo-products-wrapper {
    width: 100% !important;
    max-width: 1240px !important;
    margin: 30px auto 50px auto !important;
    padding: 0 15px !important;
    box-sizing: border-box !important;
}

.savdo-products-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 16px !important;
    width: 100% !important;
    max-width: 1240px !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
}

@media (max-width: 992px) {
    .savdo-products-grid {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}

@media (max-width: 768px) {
    .savdo-products-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
    }
}


/* 🎯 PIXEL-PERFECT ALIGNMENT OVERRIDE FOR CONTAINER & ALL 3 SECTIONS */
.savdo-cat-wrapper,
.savdo-stories-wrapper,
.savdo-products-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}

.savdo-cat-grid,
.savdo-stories-track-outer,
.savdo-products-grid {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}


/* 🛍️ MODERN FRAMELESS PRODUCT CARD DESIGN (ROUNDED PHOTO, ZERO BORDERS/SHADOWS, TIGHT SPACING) */
.savdo-card {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    overflow: visible !important;
    display: flex !important;
    flex-direction: column !important;
    transition: transform 0.2s ease !important;
    cursor: pointer !important;
}

.savdo-card:hover {
    transform: translateY(-3px) !important;
    box-shadow: none !important;
    border-color: transparent !important;
}

.savdo-card-img-box {
    width: 100% !important;
    height: 220px !important;
    position: relative !important;
    background: #f1f5f9 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}

.savdo-card-img-box img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 12px !important;
    transition: transform 0.3s ease !important;
}

.savdo-card:hover .savdo-card-img-box img {
    transform: scale(1.04) !important;
}

.savdo-card-content {
    padding: 8px 0 0 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    flex-grow: 1 !important;
}

.savdo-card-price {
    font-size: 17.5px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin: 0 0 2px 0 !important;
    line-height: 1.2 !important;
}

.savdo-card-title {
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #0f172a !important;
    line-height: 1.3 !important;
    margin: 0 0 4px 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

.savdo-card-meta {
    font-size: 11.5px !important;
    color: #64748b !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-top: 2px !important;
}


/* 🎬 FULLSCREEN INTERACTIVE STORY VIEWER MODAL (ADAPTIVE ROUNDED IMAGE) */
.savdo-story-modal-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: rgba(15, 23, 42, 0.92) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    z-index: 99999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity 0.25s ease !important;
}

.savdo-story-modal-overlay.active {
    opacity: 1 !important;
    pointer-events: auto !important;
}

.savdo-story-modal-box {
    position: relative !important;
    width: 100% !important;
    max-width: 420px !important;
    height: 88vh !important;
    max-height: 720px !important;
    background: #0f172a !important;
    border-radius: 24px !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.6) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.savdo-story-progress-bar {
    width: 100% !important;
    height: 4px !important;
    background: rgba(255, 255, 255, 0.2) !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    z-index: 10 !important;
}

.savdo-story-progress-fill {
    width: 0% !important;
    height: 100% !important;
    background: #10b981 !important;
    transition: width 5s linear !important;
}

.savdo-story-modal-header {
    position: absolute !important;
    top: 14px !important;
    left: 14px !important;
    right: 14px !important;
    z-index: 10 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

.savdo-story-author {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.savdo-story-author-img {
    width: 42px !important;
    height: 42px !important;
    border-radius: 50% !important;
    border: 2px solid #ffffff !important;
    object-fit: cover !important;
}

.savdo-story-author-info {
    display: flex !important;
    flex-direction: column !important;
}

.savdo-story-author-name {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    text-shadow: 0 1px 4px rgba(0,0,0,0.8) !important;
}

.savdo-story-author-views {
    font-size: 11px !important;
    color: #10b981 !important;
    font-weight: 600 !important;
}

.savdo-story-close-btn {
    background: rgba(255, 255, 255, 0.2) !important;
    border: none !important;
    color: #ffffff !important;
    font-size: 24px !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: background 0.2s ease !important;
}

.savdo-story-close-btn:hover {
    background: rgba(255, 255, 255, 0.4) !important;
}

.savdo-story-media-container {
    position: relative !important;
    flex-grow: 1 !important;
    width: 100% !important;
    height: 100% !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 60px 16px 80px 16px !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
}

.savdo-story-media-bg-blur {
    position: absolute !important;
    top: -30px !important;
    left: -30px !important;
    right: -30px !important;
    bottom: -30px !important;
    background-size: cover !important;
    background-position: center !important;
    filter: blur(30px) brightness(0.5) !important;
    z-index: 1 !important;
}

.savdo-story-img-main {
    position: relative !important;
    z-index: 2 !important;
    max-width: 92% !important;
    max-height: 60vh !important;
    object-fit: contain !important;
    border-radius: 16px !important;
    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.6) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
}

.savdo-story-footer-cta {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 10 !important;
    padding: 18px !important;
    background: linear-gradient(to top, rgba(15, 23, 42, 0.98), rgba(15, 23, 42, 0)) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

.savdo-story-info-box {
    display: flex !important;
    flex-direction: column !important;
}

.savdo-story-info-title {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    line-height: 1.3 !important;
    margin-bottom: 2px !important;
}

.savdo-story-info-price {
    font-size: 18px !important;
    font-weight: 800 !important;
    color: #10b981 !important;
}

.savdo-story-cta-btn {
    background: linear-gradient(135deg, #ff6600, #f97316) !important;
    color: #ffffff !important;
    text-align: center !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    padding: 13px 22px !important;
    border-radius: 14px !important;
    text-decoration: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    box-shadow: 0 4px 16px rgba(249, 115, 22, 0.4) !important;
    transition: all 0.2s ease !important;
}

.savdo-story-cta-btn:hover {
    background: linear-gradient(135deg, #ea580c, #c2410c) !important;
    color: #ffffff !important;
    text-decoration: none !important;
    box-shadow: 0 6px 20px rgba(249, 115, 22, 0.6) !important;
    transform: translateY(-1px) !important;
}





/* 🎬 SAVDO VIDEO REELS & INSTAGRAM MODAL STYLES */
.savdo-reels-wrapper {
    width: 100% !important;
    margin: 12px 0 20px 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    border: none !important;
    box-sizing: border-box !important;
}

.savdo-reels-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-bottom: 10px !important;
}

.savdo-reels-title-box {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.savdo-reels-title-box i {
    color: #ef4444 !important;
    font-size: 18px !important;
}

.savdo-reels-title {
    font-size: 17px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin: 0 !important;
}

.savdo-reels-track-outer {
    width: 100% !important;
    overflow-x: auto !important;
    scroll-behavior: smooth !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
}

.savdo-reels-track-outer::-webkit-scrollbar {
    display: none !important;
}

.savdo-reels-track {
    display: flex !important;
    gap: 12px !important;
    padding: 4px 2px 8px 2px !important;
}

.savdo-reel-card {
    flex: 0 0 auto !important;
    width: 124px !important;
    height: 205px !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    position: relative !important;
    cursor: pointer !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
    user-select: none !important;
}

.savdo-reel-card:hover {
    transform: translateY(-4px) scale(1.02) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2) !important;
}

.savdo-reel-thumb-box {
    width: 100% !important;
    height: 100% !important;
    position: relative !important;
}

.savdo-reel-thumb {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

.savdo-reel-play-btn {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 38px !important;
    height: 38px !important;
    background: rgba(15, 23, 42, 0.65) !important;
    backdrop-filter: blur(8px) !important;
    border: 1.5px solid rgba(255, 255, 255, 0.7) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #ffffff !important;
    font-size: 14px !important;
    padding-left: 2px !important;
    transition: all 0.2s ease !important;
}

.savdo-reel-card:hover .savdo-reel-play-btn {
    background: #ef4444 !important;
    border-color: #ef4444 !important;
    transform: translate(-50%, -50%) scale(1.1) !important;
}

.savdo-reel-gradient-overlay {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 75% !important;
    background: linear-gradient(to top, rgba(15, 23, 42, 0.9) 0%, rgba(15, 23, 42, 0) 100%) !important;
    pointer-events: none !important;
}

.savdo-reel-info-badge {
    position: absolute !important;
    bottom: 10px !important;
    left: 8px !important;
    right: 8px !important;
    z-index: 2 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}

.savdo-reel-card-title {
    color: #ffffff !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8) !important;
}

.savdo-reel-card-views {
    color: #cbd5e1 !important;
    font-size: 10.5px !important;
    font-weight: 600 !important;
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
}

/* 🎬 INSTAGRAM / STORIES STYLE REEL MODAL VIEWER */
/* 🎬 FLOATING UP / DOWN ARROWS FOR DESKTOP REELS NAVIGATION */
.savdo-reel-nav-arrows {
    position: absolute !important;
    right: max(20px, calc(50% - 280px)) !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    z-index: 1000000 !important;
}

.savdo-reel-nav-arrow {
    width: 48px !important;
    height: 48px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.2) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    color: #ffffff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3) !important;
}

.savdo-reel-nav-arrow:hover {
    background: rgba(255, 255, 255, 0.4) !important;
    transform: scale(1.1) !important;
}

.savdo-reel-nav-arrow:active {
    transform: scale(0.95) !important;
}

@media (max-width: 768px) {
    .savdo-reel-nav-arrows {
        display: none !important;
    }
}

/* 🎬 HIGH PERFORMANCE 60FPS REELS FLY-IN/FLY-OUT SLIDE ANIMATIONS */
@keyframes savdoReelFlyUpOut {
    0% { transform: translateY(0) scale(1); opacity: 1; filter: blur(0px); }
    100% { transform: translateY(-60px) scale(0.92); opacity: 0; filter: blur(2px); }
}

@keyframes savdoReelFlyUpIn {
    0% { transform: translateY(70px) scale(0.92); opacity: 0; filter: blur(2px); }
    100% { transform: translateY(0) scale(1); opacity: 1; filter: blur(0px); }
}

@keyframes savdoReelFlyDownOut {
    0% { transform: translateY(0) scale(1); opacity: 1; filter: blur(0px); }
    100% { transform: translateY(60px) scale(0.92); opacity: 0; filter: blur(2px); }
}

@keyframes savdoReelFlyDownIn {
    0% { transform: translateY(-70px) scale(0.92); opacity: 0; filter: blur(2px); }
    100% { transform: translateY(0) scale(1); opacity: 1; filter: blur(0px); }
}

.savdo-reel-fly-up-out {
    animation: savdoReelFlyUpOut 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards !important;
}

.savdo-reel-fly-up-in {
    animation: savdoReelFlyUpIn 0.28s cubic-bezier(0.16, 1, 0.3, 1) forwards !important;
}

.savdo-reel-fly-down-out {
    animation: savdoReelFlyDownOut 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards !important;
}

.savdo-reel-fly-down-in {
    animation: savdoReelFlyDownIn 0.28s cubic-bezier(0.16, 1, 0.3, 1) forwards !important;
}

.savdo-reel-modal-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: rgba(15, 23, 42, 0.92) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    z-index: 999999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.savdo-reel-modal-box {
    position: relative !important;
    width: 100% !important;
    max-width: 420px !important;
    height: 88vh !important;
    max-height: 740px !important;
    background: #000000 !important;
    border-radius: 24px !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.7) !important;
}

.savdo-reel-modal-header {
    position: absolute !important;
    top: 14px !important;
    left: 14px !important;
    right: 14px !important;
    z-index: 20 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    pointer-events: auto !important;
}

.savdo-reel-author-box {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    border: none !important;
    box-shadow: none !important;
    margin-bottom: 4px !important;
}

.savdo-reel-author-img {
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
}

.savdo-reel-author-info {
    display: flex !important;
    flex-direction: column !important;
}

.savdo-reel-author-name {
    color: #ffffff !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
}

.savdo-reel-views-tag {
    color: #cbd5e1 !important;
    font-size: 10px !important;
}

.savdo-reel-counter-badge {
    background: rgba(15, 23, 42, 0.6) !important;
    backdrop-filter: blur(8px) !important;
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    padding: 4px 10px !important;
    border-radius: 20px !important;
}

.savdo-reel-close-btn {
    background: rgba(15, 23, 42, 0.6) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    color: #ffffff !important;
    font-size: 22px !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.2s ease !important;
}

.savdo-reel-close-btn:hover {
    background: rgba(239, 68, 68, 0.8) !important;
    border-color: #ef4444 !important;
}

/* 🎬 REEL SCRUBBABLE TIMELINE STYLES */
.savdo-reel-timeline-box {
    position: absolute !important;
    top: 56px !important;
    left: 14px !important;
    right: 14px !important;
    z-index: 25 !important;
    height: 12px !important;
    display: flex !important;
    align-items: center !important;
    cursor: pointer !important;
    padding: 4px 0 !important;
}

.savdo-reel-timeline-track {
    width: 100% !important;
    height: 4px !important;
    background: rgba(255, 255, 255, 0.35) !important;
    border-radius: 4px !important;
    position: relative !important;
    overflow: visible !important;
    transition: height 0.15s ease !important;
}

.savdo-reel-timeline-box:hover .savdo-reel-timeline-track {
    height: 6px !important;
}

.savdo-reel-timeline-fill {
    width: 0% !important;
    height: 100% !important;
    background: linear-gradient(90deg, #ff6600, #f97316) !important;
    border-radius: 4px !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
}

.savdo-reel-timeline-handle {
    position: absolute !important;
    top: 50% !important;
    left: 0% !important;
    transform: translate(-50%, -50%) scale(0) !important;
    width: 12px !important;
    height: 12px !important;
    background: #ffffff !important;
    border-radius: 50% !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4) !important;
    transition: transform 0.15s ease !important;
}

.savdo-reel-timeline-box:hover .savdo-reel-timeline-handle {
    transform: translate(-50%, -50%) scale(1) !important;
}

.savdo-reel-media-container {
    width: 100% !important;
    height: 100% !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #000000 !important;
    flex: 1 !important;
    overflow: hidden !important;
    cursor: pointer !important;
}

.savdo-reel-video-element {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
}

.savdo-reel-play-pause-icon {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 64px !important;
    height: 64px !important;
    background: rgba(15, 23, 42, 0.7) !important;
    backdrop-filter: blur(10px) !important;
    border: 2px solid rgba(255, 255, 255, 0.8) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #ffffff !important;
    font-size: 24px !important;
    padding-left: 4px !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity 0.25s ease, transform 0.25s ease !important;
    z-index: 10 !important;
}

.savdo-reel-play-pause-icon.visible {
    opacity: 1 !important;
    transform: translate(-50%, -50%) scale(1.1) !important;
}

/* Right-side Instagram Action Column */
.savdo-reel-right-actions {
    position: absolute !important;
    right: 14px !important;
    bottom: 110px !important;
    z-index: 20 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 16px !important;
}

.savdo-reel-side-btn {
    background: transparent !important;
    border: none !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 4px !important;
    color: #ffffff !important;
    cursor: pointer !important;
    outline: none !important;
    transition: transform 0.2s ease !important;
    padding: 0 !important;
}

.savdo-reel-side-btn:hover {
    transform: scale(1.1) !important;
}

.savdo-reel-side-icon {
    width: 44px !important;
    height: 44px !important;
    background: rgba(15, 23, 42, 0.55) !important;
    backdrop-filter: blur(8px) !important;
    border: 1.5px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px !important;
    color: #ffffff !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3) !important;
}

.savdo-reel-side-btn.liked .savdo-reel-side-icon {
    background: rgba(239, 68, 68, 0.25) !important;
    border-color: #ef4444 !important;
    color: #ef4444 !important;
    animation: heartPulse 0.35s ease-in-out !important;
}

@keyframes heartPulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.35); }
    100% { transform: scale(1); }
}

.savdo-reel-side-count {
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9) !important;
}

.savdo-reel-modal-footer {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    padding: 24px 16px 18px 16px !important;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 0.7) 65%, rgba(0, 0, 0, 0) 100%) !important;
    z-index: 15 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    pointer-events: auto !important;
}

.savdo-reel-modal-title {
    color: #ffffff !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9) !important;
}

.savdo-reel-actions-row {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
    width: 100% !important;
}

.savdo-reel-act-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 10px 6px !important;
    border-radius: 12px !important;
    color: #ffffff !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.4) !important;
    cursor: pointer !important;
}

.savdo-reel-act-btn:hover {
    transform: translateY(-2px) scale(1.02) !important;
    color: #ffffff !important;
}

.savdo-act-call {
    background: linear-gradient(135deg, #10b981, #059669) !important;
}

.savdo-act-chat {
    background: linear-gradient(135deg, #6366f1, #4f46e5) !important;
}

.savdo-act-whatsapp {
    background: linear-gradient(135deg, #25D366, #128C7E) !important;
}

.savdo-reel-toast {
    position: fixed !important;
    top: 24px !important;
    left: 50% !important;
    transform: translateX(-50%) translateY(-20px) !important;
    background: #0f172a !important;
    color: #ffffff !important;
    padding: 10px 20px !important;
    border-radius: 30px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    z-index: 1000000 !important;
    opacity: 0 !important;
    transition: all 0.3s ease !important;
    pointer-events: none !important;
}

.savdo-reel-toast.visible {
    opacity: 1 !important;
    transform: translateX(-50%) translateY(0) !important;
}

/* 🎬 INSTAGRAM REEL LAYOUT: AUTHOR AT BOTTOM, TIMELINE AT BOTTOM */
.savdo-reel-modal-header {
    position: absolute !important;
    top: 14px !important;
    left: 14px !important;
    right: 14px !important;
    z-index: 25 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    pointer-events: auto !important;
}

.savdo-reel-counter-badge {
    background: rgba(15, 23, 42, 0.6) !important;
    backdrop-filter: blur(8px) !important;
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    padding: 5px 12px !important;
    border-radius: 20px !important;
}

.savdo-reel-modal-footer {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    padding: 24px 16px 10px 16px !important;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 0.7) 70%, rgba(0, 0, 0, 0) 100%) !important;
    z-index: 20 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    pointer-events: auto !important;
}

.savdo-reel-author-box {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    border: none !important;
    box-shadow: none !important;
    margin-bottom: 4px !important;
}

.savdo-reel-author-img {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    border: 1.5px solid #ffffff !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important;
}

.savdo-reel-author-info {
    display: flex !important;
    flex-direction: column !important;
}

.savdo-reel-author-name {
    color: #ffffff !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9) !important;
}

.savdo-reel-views-tag {
    color: #cbd5e1 !important;
    font-size: 10.5px !important;
    font-weight: 600 !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9) !important;
}

/* 🎬 TIMELINE PROGRESS BAR MOVED TO VERY BOTTOM */
.savdo-reel-timeline-box {
    width: 100% !important;
    height: 14px !important;
    display: flex !important;
    align-items: center !important;
    cursor: pointer !important;
    padding: 3px 0 !important;
    margin-top: 6px !important;
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
}

.savdo-reel-timeline-track {
    width: 100% !important;
    height: 4px !important;
    background: rgba(255, 255, 255, 0.35) !important;
    border-radius: 4px !important;
    position: relative !important;
    overflow: visible !important;
    transition: height 0.15s ease !important;
}

.savdo-reel-timeline-box:hover .savdo-reel-timeline-track {
    height: 6px !important;
}

.savdo-reel-timeline-fill {
    width: 0% !important;
    height: 100% !important;
    background: linear-gradient(90deg, #ff6600, #f97316) !important;
    border-radius: 4px !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
}

.savdo-reel-timeline-handle {
    position: absolute !important;
    top: 50% !important;
    left: 0% !important;
    transform: translate(-50%, -50%) scale(0) !important;
    width: 12px !important;
    height: 12px !important;
    background: #ffffff !important;
    border-radius: 50% !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4) !important;
    transition: transform 0.15s ease !important;
}

.savdo-reel-timeline-box:hover .savdo-reel-timeline-handle {
    transform: translate(-50%, -50%) scale(1) !important;
}
/* 🎬 RIGHT SIDE INSTAGRAM ACTION COLUMN (LIFTED UP & SHIFTED RIGHT) */
.savdo-reel-right-actions {
    position: absolute !important;
    right: 8px !important;
    bottom: 170px !important;
    z-index: 30 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 16px !important;
    pointer-events: auto !important;
}

.savdo-reel-side-btn {
    background: transparent !important;
    border: none !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 4px !important;
    color: #ffffff !important;
    cursor: pointer !important;
    outline: none !important;
    transition: transform 0.2s ease !important;
    padding: 0 !important;
    pointer-events: auto !important;
}

.savdo-reel-side-btn:hover {
    transform: scale(1.1) !important;
}

.savdo-reel-side-icon {
    width: 44px !important;
    height: 44px !important;
    background: rgba(15, 23, 42, 0.65) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border: 1.5px solid rgba(255, 255, 255, 0.4) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px !important;
    color: #ffffff !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.4) !important;
    pointer-events: auto !important;
}

.savdo-reel-side-btn.liked .savdo-reel-side-icon {
    background: rgba(239, 68, 68, 0.25) !important;
    border-color: #ef4444 !important;
    color: #ef4444 !important;
    animation: heartPulse 0.35s ease-in-out !important;
}

/* 🎬 SCRUBBABLE TIMELINE PROGRESS BAR (HIGH Z-INDEX & PERFECT SCRUBBING) */
.savdo-reel-timeline-box {
    width: 100% !important;
    height: 16px !important;
    display: flex !important;
    align-items: center !important;
    cursor: pointer !important;
    padding: 4px 0 !important;
    margin-top: 6px !important;
    position: relative !important;
    z-index: 35 !important;
    pointer-events: auto !important;
}

.savdo-reel-timeline-track {
    width: 100% !important;
    height: 5px !important;
    background: rgba(255, 255, 255, 0.4) !important;
    border-radius: 4px !important;
    position: relative !important;
    overflow: visible !important;
    transition: height 0.15s ease !important;
    pointer-events: auto !important;
}

.savdo-reel-timeline-box:hover .savdo-reel-timeline-track {
    height: 7px !important;
}

.savdo-reel-timeline-fill {
    width: 0% !important;
    height: 100% !important;
    background: linear-gradient(90deg, #ff6600, #f97316) !important;
    border-radius: 4px !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    pointer-events: none !important;
}

.savdo-reel-timeline-handle {
    position: absolute !important;
    top: 50% !important;
    left: 0% !important;
    transform: translate(-50%, -50%) scale(0) !important;
    width: 12px !important;
    height: 12px !important;
    background: #ffffff !important;
    border-radius: 50% !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4) !important;
    transition: transform 0.15s ease !important;
    pointer-events: none !important;
}

.savdo-reel-timeline-box:hover .savdo-reel-timeline-handle {
    transform: translate(-50%, -50%) scale(1) !important;
}
/* 🚗📱 SPECIFICALLY ENLARGED ICONS FOR "ТРАНСПОРТ" AND "ТЕЛЕФОНЫ" (1.95X SCALE) */
.savdo-cat-card[data-title*="Транспорт"] .savdo-cat-icon img, 
a[href*="transport"] .savdo-cat-icon img {
    transform: scale(1.95) !important;
    transform-origin: right bottom !important;
}

.savdo-cat-card[data-title*="Телефоны"] .savdo-cat-icon img, 
a[href*="telefony_i_gadzhety"] .savdo-cat-icon img {
    transform: scale(1.95) !important;
    transform-origin: right bottom !important;
}
/* 💻✈️🏗️ SPECIFICALLY ENLARGED ICONS FOR "КОМПЬЮТЕРЫ", "АВИАБИЛЕТЫ" AND "СТРОИТЕЛЬСТВО" (1.85X SCALE) */
.savdo-cat-card[data-title*="Компьютеры"] .savdo-cat-icon img, 
a[href*="kompyutery_i_orgtehnika"] .savdo-cat-icon img {
    transform: scale(1.85) !important;
    transform-origin: right bottom !important;
}

.savdo-cat-card[data-title*="Авиабилеты"] .savdo-cat-icon img, 
a[href*="aviabileti_i_turi"] .savdo-cat-icon img {
    transform: scale(1.85) !important;
    transform-origin: right bottom !important;
}

.savdo-cat-card[data-title*="Строительство"] .savdo-cat-icon img, 
a[href*="stroitelstvo_i_remont"] .savdo-cat-icon img {
    transform: scale(1.85) !important;
    transform-origin: right bottom !important;
}
/* ⚡ SAVDO HEADER CONTAINER (1240PX MAX-WIDTH ALIGNED WITH MAIN GRID) */
.savdo-header-wrapper {
    width: 100% !important;
    background: #ffffff !important;
    border-bottom: 1px solid #e2e8f0 !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 10000 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
}

.savdo-header-container {
    max-width: 1240px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    height: 64px !important;
}

/* ⚡ IDENTICAL 44PX HEIGHT & 10PX RADIUS ACROSS ALL HEADER ELEMENTS */
.savdo-search-bar {
    flex: 1 1 auto !important;
    width: 100% !important;
    max-width: none !important;
    display: flex !important;
    align-items: center !important;
    background: #f8fafc !important;
    border: 1.5px solid #cbd5e1 !important;
    border-radius: 10px !important;
    padding: 4px 6px 4px 16px !important;
    transition: all 0.2s ease !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    box-sizing: border-box !important;
}

.savdo-search-bar button {
    background: #1e3a8a !important; /* 💙 Dark Blue (Navy) */
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 8px 20px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    height: 34px !important;
    transition: background 0.2s ease !important;
}

.savdo-search-bar button:hover {
    background: #172554 !important; /* 💙 Deep Dark Navy */
}

.savdo-city-pill {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    background: #f8fafc !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 10px !important;
    padding: 0 10px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #0f172a !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
    transition: all 0.2s ease !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
    max-width: 130px !important;
}

.savdo-city-pill:hover {
    background: #ffffff !important;
    border-color: #94a3b8 !important;
    color: #0f172a !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
}

.savdo-city-pill select {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background: transparent !important;
    border: none !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #0f172a !important;
    outline: none !important;
    cursor: pointer !important;
    padding: 0 !important;
    margin: 0 !important;
    height: 100% !important;
    max-width: 90px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    overflow: hidden !important;
}

.savdo-nav-item {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    background: #f8fafc !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 10px !important;
    padding: 0 14px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #0f172a !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
    transition: all 0.2s ease !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
}

.savdo-nav-item:hover {
    background: #ffffff !important;
    border-color: #94a3b8 !important;
    color: #0f172a !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
}

.savdo-post-ad-btn {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    background: #ff7700 !important; /* 🧡 Orange */
    color: #ffffff !important;
    border: none !important;
    border-radius: 10px !important;
    padding: 0 18px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    box-sizing: border-box !important;
    transition: all 0.2s ease !important;
    flex-shrink: 0 !important;
}

.savdo-post-ad-btn:hover {
    background: #ea580c !important; /* 🧡 Darker Orange */
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(255, 119, 0, 0.35) !important;
}
.savdo-nav-icon-btn {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    max-width: 44px !important;
    max-height: 44px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 10px !important;
    background: #f8fafc !important;
    border: 1px solid #cbd5e1 !important;
    color: #475569 !important;
    font-size: 18px !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
    flex-shrink: 0 !important;
}

.savdo-nav-icon-btn:hover {
    background: #ffffff !important;
    border-color: #94a3b8 !important;
    color: #ff5252 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
}
/* 🎯 SAVDO MASTER CATEGORY LISTING ENGINE (1240PX GRID & MODERN CARDS) */
body.category-page, .category-page {
    background-color: #f8fafc !important;
}

.category-page .container,
#ListingForm > .container,
#main.category-page .container {
    max-width: 1240px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
    box-sizing: border-box !important;
}

#custom-category-info {
    background: #ffffff !important;
    border-radius: 12px !important;
    padding: 20px !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04) !important;
    margin-top: 16px !important;
    margin-bottom: 24px !important;
}

#custom-category-info .filter-block {
    margin-bottom: 12px !important;
}

#custom-category-info .form-control {
    border-radius: 8px !important;
    border: 1px solid #cbd5e1 !important;
    height: 38px !important;
    font-size: 13.5px !important;
    padding: 0 12px !important;
    background: #f8fafc !important;
    color: #0f172a !important;
}

#button-search-main {
    border-radius: 8px !important;
    height: 38px !important;
    font-weight: 600 !important;
    background: #0088cc !important;
    border: none !important;
}

#button-search-clear {
    border-radius: 8px !important;
    height: 38px !important;
    font-weight: 600 !important;
    background: #e2e8f0 !important;
    color: #475569 !important;
    border: none !important;
}

/* Sub-categories Pills */
#sub-categories {
    margin-bottom: 20px !important;
}

.sub-category-container, .sub-category-container-all {
    margin-bottom: 8px !important;
}



.sub-category:hover {
    background: #f1f5f9 !important;
    border-color: #94a3b8 !important;
}

.sub-category a {
    color: #0f172a !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

.sub-category .count {
    background: #f1f5f9 !important;
    color: #64748b !important;
    padding: 2px 8px !important;
    border-radius: 12px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
}

/* Product Listing Grid */
.all-list, .gird-layout {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 16px !important;
    margin: 16px 0 !important;
    width: 100% !important;
}

@media (max-width: 1200px) {
    .all-list, .gird-layout {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}

@media (max-width: 768px) {
    .all-list, .gird-layout {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
    }
}

.all-list > div, .gird-layout > div {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
}

.js-list-card, .ad-item, .item-col-grid, .item-col-list {
    background: #ffffff !important;
    border-radius: 12px !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
    overflow: hidden !important;
    transition: all 0.2s ease !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    position: relative !important;
}

.js-list-card:hover, .ad-item:hover, .item-col-grid:hover, .item-col-list:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
    border-color: #cbd5e1 !important;
}

.js-list-card .item-image-box, .ad-item .item-image-box {
    height: 200px !important;
    width: 100% !important;
    overflow: hidden !important;
    position: relative !important;
    background: #f1f5f9 !important;
}

.js-list-card .item-image-box img, .ad-item .item-image-box img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 0 !important;
}
/* 🎯 SAVDO SAVDO.TJ REAL ESTATE & TRANSPORT CATEGORY ENGINE */
body.category-page, .category-page {
    background-color: #f8fafc !important;
}

/* Hide raw sidepanel container on category page unless explicitly opened */
#mySidepanel:not(.open) {
    display: none !important;
}

.category-page .container,
#ListingForm > .container,
#main.category-page .container {
    max-width: 1240px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
    box-sizing: border-box !important;
}

/* Category H1 & Subcategory Links */
.category-page h1 {
    font-size: 26px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    letter-spacing: -0.4px !important;
    margin-bottom: 14px !important;
}

/* Sub-categories Horizontal Flex Grid (Savdo.tj Style) */
#sub-categories {
    margin-bottom: 20px !important;
    width: 100% !important;
}

#sub-categories #subcats-popular,
#subcats-popular {
    display: flex !important;
    flex-wrap: wrap !important;
    row-gap: 10px !important;
    column-gap: 24px !important;
    width: 100% !important;
}

#subcats-all {
    display: none !important;
}

#sub-categories .sub-category-container,
#sub-categories .sub-category-container-all {
    width: auto !important;
    padding: 0 !important;
    flex: none !important;
    float: none !important;
}



.sub-category:hover {
    background: #f1f5f9 !important;
    border-color: #cbd5e1 !important;
    transform: translateY(-1px) !important;
}

.sub-category a {
    color: #0284c7 !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

.sub-category .count {
    color: #94a3b8 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
}

/* Top Blue Filter Banner (Savdo.tj Style) */
#custom-category-info {
    background: linear-gradient(135deg, #0099ff 0%, #0088cc 100%) !important;
    border-radius: 12px !important;
    padding: 20px 24px !important;
    border: none !important;
    box-shadow: 0 4px 16px rgba(0, 136, 204, 0.2) !important;
    margin-top: 16px !important;
    margin-bottom: 24px !important;
    color: #ffffff !important;
}

#custom-category-info label, 
#custom-category-info h5, 
#custom-category-info span {
    color: #ffffff !important;
    font-weight: 600 !important;
}

#custom-category-info .filter-block {
    margin-bottom: 10px !important;
}

#custom-category-info .form-control,
#custom-category-info select,
#custom-category-info input {
    border-radius: 10px !important;
    border: 1px solid rgba(255, 255, 255, 0.4) !important;
    height: 42px !important;
    font-size: 14px !important;
    padding: 0 14px !important;
    background: #ffffff !important;
    color: #0f172a !important;
    font-weight: 500 !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
}

#custom-category-info .form-control:focus {
    border-color: #ffb700 !important;
    box-shadow: 0 0 0 3px rgba(255, 183, 0, 0.3) !important;
}

#button-search-main {
    border-radius: 10px !important;
    height: 42px !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    background: #ffb700 !important;
    color: #0f172a !important;
    border: none !important;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15) !important;
    transition: all 0.2s ease !important;
}

#button-search-main:hover {
    background: #ffa700 !important;
    transform: translateY(-1px) !important;
}

#button-search-clear {
    border-radius: 10px !important;
    height: 42px !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    background: rgba(255, 255, 255, 0.2) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.4) !important;
    transition: all 0.2s ease !important;
}

#button-search-clear:hover {
    background: rgba(255, 255, 255, 0.3) !important;
}

/* 🏆 SAVDO-STYLE LIST VIEW CARDS (.searchresult.list .all-list .js-list-card) */
.searchresult.list .all-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    margin: 16px 0 !important;
    width: 100% !important;
}

.searchresult.list .js-list-card {
    background: #ffffff !important;
    border-radius: 12px !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
    overflow: hidden !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    display: flex !important;
    flex-direction: row !important;
    height: 220px !important;
    width: 100% !important;
    position: relative !important;
}

.searchresult.list .js-list-card:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.08) !important;
    border-color: #cbd5e1 !important;
}

/* Left Image Box */
.searchresult.list .js-list-card .item-image-box {
    flex: 0 0 320px !important;
    width: 320px !important;
    height: 100% !important;
    position: relative !important;
    overflow: hidden !important;
    background: #f1f5f9 !important;
}

.searchresult.list .js-list-card .item-image-box img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.35s ease !important;
}

.searchresult.list .js-list-card:hover .item-image-box img {
    transform: scale(1.05) !important;
}

/* Badges on Photo */
.searchresult.list .js-list-card .item-badges {
    position: absolute !important;
    top: 12px !important;
    left: 12px !important;
    z-index: 10 !important;
    display: flex !important;
    gap: 6px !important;
}



/* Right Content Info Panel */
.searchresult.list .js-list-card .item-info {
    flex: 1 !important;
    padding: 20px 24px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    position: relative !important;
    box-sizing: border-box !important;
}

.searchresult.list .js-list-card .ad-info {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
}

/* Savdo Price Formatting */
.searchresult.list .js-list-card h4:first-child {
    font-size: 23px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin: 0 0 6px 0 !important;
    letter-spacing: -0.4px !important;
}

/* Savdo Title Formatting */
.searchresult.list .js-list-card .item-title {
    margin: 0 !important;
    line-height: 1.4 !important;
    max-width: 85% !important;
}

.searchresult.list .js-list-card .item-title a {
    color: #1e293b !important;
    font-weight: 600 !important;
    font-size: 17.5px !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.searchresult.list .js-list-card .item-title a:hover {
    color: #0088cc !important;
}

/* Savdo Bottom Meta Bar */
.searchresult.list .js-list-card .ad-info > div:last-child {
    margin-top: auto !important;
    font-size: 13.5px !important;
    color: #64748b !important;
    font-weight: 500 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding-top: 10px !important;
}

/* Heart Favorite Button */
.searchresult.list .js-list-card .favorite-icon a {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 16px !important;
    color: #94a3b8 !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

.searchresult.list .js-list-card .favorite-icon a:hover {
    background: #fef2f2 !important;
    border-color: #fca5a5 !important;
    color: #ef4444 !important;
    transform: scale(1.1) !important;
}

/* 🏆 SAVDO-STYLE GRID VIEW CARDS (.searchresult.grid #searchlist-all-grid) */
.searchresult.grid #searchlist-all-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 16px !important;
    margin: 16px 0 !important;
    width: 100% !important;
}

@media (max-width: 1200px) {
    .searchresult.grid #searchlist-all-grid {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}

@media (max-width: 768px) {
    .searchresult.grid #searchlist-all-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
    }
}

.searchresult.grid #searchlist-all-grid > div {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    padding: 0 !important;
    margin-bottom: 0 !important;
}

.searchresult.grid .js-item-listing,
.searchresult.grid .savdo-card,
.searchresult.grid .card {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    overflow: visible !important;
    transition: transform 0.2s ease !important;
    display: flex !important;
    flex-direction: column !important;
}

.searchresult.grid .js-item-listing:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
    border-color: #cbd5e1 !important;
}

.searchresult.grid .item-image-box {
    height: 200px !important;
    width: 100% !important;
    position: relative !important;
    overflow: hidden !important;
    background: #f1f5f9 !important;
}

.searchresult.grid .item-image-box img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.35s ease !important;
}

.searchresult.grid .js-item-listing:hover .item-image-box img {
    transform: scale(1.05) !important;
}

.searchresult.grid .item-info {
    padding: 14px 16px !important;
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
}
/* 🎯 SAVDO-STYLE SORTING DROPDOWN */
.section.allAd .featured-top {
    margin-bottom: 16px !important;
    border-bottom: none !important;
}

#sort-dropdown {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
    padding: 6px 14px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #334155 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    text-decoration: none !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
}

#sort-dropdown:hover {
    background: #f8fafc !important;
    border-color: #94a3b8 !important;
}

.category-dropdown .dropdown-menu {
    border-radius: 10px !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.1) !important;
    padding: 6px 0 !important;
    margin-top: 4px !important;
}

.category-dropdown .dropdown-menu li a {
    padding: 8px 16px !important;
    font-size: 13.5px !important;
    color: #1e293b !important;
    font-weight: 500 !important;
}

.category-dropdown .dropdown-menu li a:hover {
    background: #f1f5f9 !important;
    color: #0088cc !important;
}
/* 🎯 SAVDO-STYLE SORTING LIST CLEANUP */
.category-dropdown ul, 
.category-dropdown .dropdown-menu,
#listing-filter ul {
    list-style: none !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
}

.category-dropdown li,
#listing-filter li {
    list-style: none !important;
}
/* 🎯 SAVDO PROFESSIONAL MODERN FILTER GRID ENGINE */
#custom-category-info {
    background: linear-gradient(135deg, #0088cc 0%, #0066b3 100%) !important;
    border-radius: 16px !important;
    padding: 24px !important;
    border: none !important;
    box-shadow: 0 8px 24px rgba(0, 136, 204, 0.22) !important;
    margin-top: 16px !important;
    margin-bottom: 24px !important;
}

/* Custom Inputs & Dropdowns Styling */
#ResponseCustomFields .form-control,
#ResponseCustomFields select,
#ResponseCustomFields input[type="text"],
#ResponseCustomFields input[type="number"] {
    border-radius: 10px !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    height: 44px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    padding: 0 36px 0 14px !important;
    background: #ffffff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") no-repeat right 12px center !important;
    background-size: 16px !important;
    color: #0f172a !important;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.06) !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    transition: all 0.2s ease !important;
}

#ResponseCustomFields input[type="text"],
#ResponseCustomFields input[type="number"] {
    background-image: none !important;
    padding-right: 14px !important;
}

#ResponseCustomFields .form-control:focus,
#ResponseCustomFields select:focus,
#ResponseCustomFields input:focus {
    outline: none !important;
    border-color: #ffb700 !important;
    box-shadow: 0 0 0 3px rgba(255, 183, 0, 0.35) !important;
}

/* Action Buttons Bar (.COLBTSSEARCH) */
.COLBTSSEARCH {
    grid-column: span 1 !important;
    display: flex !important;
    gap: 8px !important;
    align-items: center !important;
}

#button-search-main {
    flex: 1 !important;
    border-radius: 10px !important;
    height: 44px !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    background: #ffb700 !important;
    color: #0f172a !important;
    border: none !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
    transition: all 0.2s ease !important;
}

#button-search-main:hover {
    background: #ffa700 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2) !important;
}

#button-search-clear {
    flex: 1 !important;
    border-radius: 10px !important;
    height: 44px !important;
    font-weight: 600 !important;
    font-size: 13.5px !important;
    background: rgba(255, 255, 255, 0.18) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.35) !important;
    backdrop-filter: blur(4px) !important;
    transition: all 0.2s ease !important;
}

#button-search-clear:hover {
    background: rgba(255, 255, 255, 0.3) !important;
    border-color: #ffffff !important;
}
/* 🎯 CLEAN DESKTOP FILTER HEADER */
@media (min-width: 769px) {
    #custom-category-info .filter-header,
    #custom-category-info .filter-cross,
    #close-x-categories,
    .filter-title {
        display: none !important;
    }
}
/* 🎯 EXACT SAVDO.TJ BLUE FILTER BANNER ENGINE */
.savdo-blue-filter-banner {
    background: #0099ff !important;
    border-radius: 12px !important;
    padding: 16px 20px 10px 20px !important;
    margin-top: 16px !important;
    margin-bottom: 24px !important;
    box-shadow: 0 4px 16px rgba(0, 153, 255, 0.25) !important;
}

/* Row 1: Top Inputs */
.savdo-filter-top-row {
    display: flex !important;
    gap: 12px !important;
    margin-bottom: 12px !important;
    align-items: center !important;
}

.savdo-input-search {
    flex: 2 !important;
}

.savdo-input-city {
    flex: 1.2 !important;
}

.savdo-input-category {
    flex: 1.5 !important;
}

.savdo-blue-filter-banner .form-control,
.savdo-blue-filter-banner select,
.savdo-blue-filter-banner input {
    border-radius: 6px !important;
    border: 1px solid #cbd5e1 !important;
    height: 38px !important;
    font-size: 13.5px !important;
    padding: 0 32px 0 12px !important;
    background: #ffffff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") no-repeat right 10px center !important;
    color: #0f172a !important;
    font-weight: 500 !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
}

.savdo-blue-filter-banner input[type="text"] {
    background-image: none !important;
    padding-right: 12px !important;
}

/* Row 2: Grid of Filter Pairs + Yellow Search Button */
.savdo-filter-fields-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    align-items: center !important;
    margin-bottom: 10px !important;
}

.savdo-filter-fields-grid .filter-block {
    flex: 1 1 calc(16.66% - 10px) !important;
    min-width: 140px !important;
    margin-bottom: 0 !important;
}

.savdo-filter-submit-block {
    flex: 0 0 auto !important;
}

/* Yellow Square Search Button (Savdo.tj 🔍 Icon) */
.savdo-yellow-search-btn {
    width: 44px !important;
    height: 38px !important;
    background: #ffcc00 !important;
    border: 1px solid #e6b800 !important;
    border-radius: 6px !important;
    color: #0f172a !important;
    font-size: 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
}

.savdo-yellow-search-btn:hover {
    background: #ffb700 !important;
    transform: scale(1.05) !important;
}

/* Row 3: Bottom Navigation Tabs (Список | Карта | Новые ▾) */
.savdo-filter-bottom-tabs {
    border-top: 1px solid rgba(255, 255, 255, 0.2) !important;
    padding-top: 10px !important;
    margin-top: 8px !important;
}

.savdo-tabs-group {
    display: flex !important;
    gap: 6px !important;
    align-items: center !important;
}

.savdo-tab-pill {
    background: rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
    padding: 6px 16px !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.savdo-tab-pill:hover {
    background: rgba(255, 255, 255, 0.4) !important;
    color: #ffffff !important;
}

.savdo-tab-pill.active {
    background: #ffcc00 !important;
    color: #0f172a !important;
}
/* 🎯 1-TO-1 PIXEL EXACT SAVDO.TJ BLUE FILTER BANNER */
.savdo-blue-filter-banner {
    background: #0099ff !important;
    border-radius: 0 0 8px 8px !important;
    border-radius: 8px !important;
    padding: 14px 16px 8px 16px !important;
    margin-top: 12px !important;
    margin-bottom: 20px !important;
    box-shadow: 0 4px 12px rgba(0, 153, 255, 0.2) !important;
}

/* Row 1: Search (21 705 объявлений рядом), City (Весь Таджикистан), Category (🏠 Продажа квартир) */
.savdo-filter-top-row {
    display: flex !important;
    gap: 8px !important;
    margin-bottom: 8px !important;
    align-items: center !important;
}

.savdo-input-search {
    flex: 2 !important;
}

.savdo-input-city {
    flex: 1.2 !important;
}

.savdo-input-category {
    flex: 1.5 !important;
}

.savdo-blue-filter-banner .form-control,
.savdo-blue-filter-banner select,
.savdo-blue-filter-banner input {
    border-radius: 4px !important;
    border: 1px solid #cbd5e1 !important;
    height: 36px !important;
    font-size: 13px !important;
    padding: 0 28px 0 10px !important;
    background: #ffffff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") no-repeat right 8px center !important;
    color: #0f172a !important;
    font-weight: 500 !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05) !important;
}

.savdo-blue-filter-banner input[type="text"] {
    background-image: none !important;
    padding-right: 10px !important;
}

/* Row 2: Grid of Filter Inputs + Yellow Search Button */
.savdo-filter-fields-grid {
    display: grid !important;
    grid-template-columns: repeat(6, 1fr) 42px !important;
    gap: 6px 8px !important;
    align-items: center !important;
    margin-bottom: 8px !important;
}

@media (max-width: 1100px) {
    .savdo-filter-fields-grid {
        grid-template-columns: repeat(3, 1fr) 42px !important;
    }
}

@media (max-width: 768px) {
    .savdo-filter-fields-grid {
        grid-template-columns: repeat(2, 1fr) 42px !important;
    }
}

.savdo-filter-fields-grid .filter-block {
    margin-bottom: 0 !important;
    width: 100% !important;
}

/* Yellow Square Search Button (Savdo.tj 🔍 Icon) */
.savdo-yellow-search-btn {
    width: 42px !important;
    height: 36px !important;
    background: #ffcc00 !important;
    border: 1px solid #e6b800 !important;
    border-radius: 4px !important;
    color: #0f172a !important;
    font-size: 15px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}

.savdo-yellow-search-btn:hover {
    background: #ffb700 !important;
}

/* Row 3: Bottom Navigation Tabs (Список | Карта | Новые ▾) */
.savdo-filter-bottom-tabs {
    border-top: 1px solid rgba(255, 255, 255, 0.2) !important;
    padding-top: 8px !important;
    margin-top: 6px !important;
}

.savdo-tabs-group {
    display: flex !important;
    gap: 4px !important;
    align-items: center !important;
}

.savdo-tab-pill {
    background: rgba(255, 255, 255, 0.22) !important;
    color: #ffffff !important;
    padding: 5px 14px !important;
    border-radius: 4px !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
}

.savdo-tab-pill:hover {
    background: rgba(255, 255, 255, 0.35) !important;
    color: #ffffff !important;
}

.savdo-tab-pill.active {
    background: #ffcc00 !important;
    color: #0f172a !important;
    font-weight: 700 !important;
}
/* 🎯 CLEAN DROPDOWN MENU DISPLAY */
.category-dropdown .dropdown-menu,
.category-change {
    display: none !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    z-index: 1000 !important;
    background: #ffffff !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.15) !important;
    border-radius: 8px !important;
    min-width: 180px !important;
}

.category-dropdown.open .dropdown-menu,
.category-dropdown.show .dropdown-menu,
.category-dropdown:hover .dropdown-menu {
    display: block !important;
}
/* 🎯 AUTHENTIC BOOTSTRAP SAVDO.TJ FILTER SYSTEM */
.savdo-blue-filter-banner {
    background: #0088cc !important;
    border-radius: 8px !important;
    padding: 16px 20px 12px 20px !important;
    margin-top: 14px !important;
    margin-bottom: 20px !important;
    box-shadow: 0 4px 12px rgba(0, 136, 204, 0.25) !important;
}

#ResponseCustomFields {
    margin-left: -6px !important;
    margin-right: -6px !important;
}

#ResponseCustomFields .filter-block {
    padding-left: 6px !important;
    padding-right: 6px !important;
    margin-bottom: 10px !important;
}

/* All Form Controls Inside Blue Banner */
.savdo-blue-filter-banner select,
.savdo-blue-filter-banner input[type="text"],
.savdo-blue-filter-banner input[type="number"],
.savdo-blue-filter-banner .form-control {
    height: 36px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 4px !important;
    font-size: 13.5px !important;
    color: #0f172a !important;
    font-weight: 500 !important;
    padding: 0 24px 0 10px !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background: #ffffff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") no-repeat right 8px center !important;
    box-sizing: border-box !important;
}

.savdo-blue-filter-banner input[type="text"] {
    background-image: none !important;
    padding-right: 10px !important;
}

/* Buttons Col */
.savdo-buttons-col {
    display: flex !important;
    gap: 8px !important;
    align-items: center !important;
    justify-content: flex-end !important;
}

.savdo-yellow-apply-btn {
    height: 36px !important;
    padding: 0 16px !important;
    background: #ffcc00 !important;
    border: 1px solid #e6b800 !important;
    border-radius: 4px !important;
    color: #0f172a !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    cursor: pointer !important;
}

.savdo-yellow-apply-btn:hover {
    background: #ffb700 !important;
}

.savdo-clear-filters-btn {
    height: 36px !important;
    padding: 0 14px !important;
    background: rgba(255, 255, 255, 0.2) !important;
    border: 1px solid rgba(255, 255, 255, 0.4) !important;
    border-radius: 4px !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    cursor: pointer !important;
}

.savdo-clear-filters-btn:hover {
    background: rgba(255, 255, 255, 0.35) !important;
}

/* 🌟 100% FULL-WIDTH EDGE-TO-EDGE FILTER BACKGROUND SYSTEM 2026 */
.savdo-fullwidth-filter-wrapper {
    width: 100% !important;
    background: #ffffff !important;
    border-bottom: 1px solid #e2e8f0 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03) !important;
    padding: 14px 0 !important;
    margin-top: 0 !important;
    margin-bottom: 16px !important;
}

.savdo-fullwidth-filter-wrapper .container {
    max-width: 1240px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    box-sizing: border-box !important;
}

.savdo-glass-filter-banner,
.savdo-blue-filter-banner,
#custom-category-info {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

#custom-field-block {
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
}

/* 🎯 GRID LAYOUT: STRETCH ALL COLUMNS EQUALLY ACROSS THE 1240PX CONTAINER */
#ResponseCustomFields {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px 12px !important;
    align-items: stretch !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Column Container: Expand proportionally across full 1240px width */
#ResponseCustomFields .filter-col:not(.savdo-filter-action-bar) {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    flex: 1 1 145px !important;
    min-width: 125px !important;
    max-width: none !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    align-self: stretch !important;
}

#ResponseCustomFields .filter-field-slot {
    width: 100% !important;
}

/* DISABLE PSEUDO ELEMENTS ON INNER FIELD WRAPPERS */
#ResponseCustomFields .savdo-field-wrap::before,
#ResponseCustomFields .savdo-field-wrap::after,
#ResponseCustomFields .savdo-field-wrap.col-range-filter::before,
#ResponseCustomFields .savdo-field-wrap.col-range-filter::after {
    display: none !important;
    content: none !important;
}

/* 🔗 RANGE FILTER CONNECTOR BRACKET (СКРЕПКА НА ЛЕВОМ ВНЕШНЕМ КРАЮ С ВЫСОКОЙ СПЕЦИФИЧНОСТЬЮ) */
#ResponseCustomFields .filter-col.col-range-filter,
#ResponseCustomFields div.filter-col.col-range-filter,
#ResponseCustomFields div.col-range-filter {
    position: relative !important;
    padding-left: 20px !important; /* High specificity 20px left padding zone */
    padding-right: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    white-space: normal !important;
    align-self: stretch !important;
    height: auto !important;
    box-sizing: border-box !important;
}

/* The bracket connector line (скрепка) sitting cleanly on the outer left edge with 10px clear gap from input box */
#ResponseCustomFields .filter-col.col-range-filter::before,
#ResponseCustomFields div.filter-col.col-range-filter::before,
#ResponseCustomFields div.col-range-filter::before {
    content: "" !important;
    position: absolute !important;
    left: 4px !important; /* 4px from outer edge, leaving 10px clear gap before input box border at 20px */
    top: 6px !important;
    bottom: 6px !important;
    width: 6px !important;
    border-left: 2px solid #94a3b8 !important;
    border-top: 2px solid #94a3b8 !important;
    border-bottom: 2px solid #94a3b8 !important;
    border-top-left-radius: 4px !important;
    border-bottom-left-radius: 4px !important;
    z-index: 10 !important;
    pointer-events: none !important;
}

/* Input & Select Controls Styling */
#ResponseCustomFields select,
#ResponseCustomFields input[type="text"],
#ResponseCustomFields input[type="number"],
#ResponseCustomFields .form-control {
    height: 36px !important;
    background: #f8fafc !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    color: #0f172a !important;
    font-weight: 500 !important;
    padding: 0 20px 0 8px !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background: #f8fafc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") no-repeat right 6px center !important;
    width: 100% !important;
    margin: 0 !important;
    display: block !important;
    transition: all 0.15s ease !important;
}

#ResponseCustomFields input[type="text"],
#ResponseCustomFields input[type="number"] {
    background-image: none !important;
    padding-right: 8px !important;
}

/* Clear Cross (✕) Styling */
.savdo-field-wrap {
    position: relative !important;
    width: 100% !important;
    display: block !important;
}

.savdo-field-clear {
    position: absolute !important;
    right: 6px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 16px !important;
    height: 16px !important;
    border-radius: 50% !important;
    background: #cbd5e1 !important;
    color: #475569 !important;
    font-size: 12px !important;
    font-weight: bold !important;
    line-height: 16px !important;
    text-align: center !important;
    cursor: pointer !important;
    display: none !important;
    z-index: 12 !important;
}

.savdo-field-clear:hover {
    background: #ff5252 !important;
    color: #ffffff !important;
}

.savdo-field-wrap.has-value .savdo-field-clear {
    display: block !important;
}

.savdo-field-wrap.has-value select,
.savdo-field-wrap.has-value input {
    padding-right: 24px !important;
}

/* Focus state */
#ResponseCustomFields select:focus,
#ResponseCustomFields input:focus {
    background: #ffffff !important;
    outline: none !important;
    border-color: #ff5252 !important;
    box-shadow: 0 0 0 3px rgba(255, 82, 82, 0.2) !important;
}

/* Action Bar below filter fields */
.savdo-filter-action-bar {
    display: flex !important;
    gap: 12px !important;
    align-items: center !important;
    margin-top: 12px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.savdo-main-search-btn {
    flex: 1 !important;
    height: 38px !important;
    background: #0f172a !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 6px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    cursor: pointer !important;
}

.savdo-main-reset-btn {
    flex: 1 !important;
    height: 38px !important;
    background: #e2e8f0 !important;
    color: #475569 !important;
    border: none !important;
    border-radius: 6px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    cursor: pointer !important;
}
/* 🌟 SUBCATEGORIES CHIPS (NATURAL WIDTH, CLOSE COUNTS) */
#sub-categories #subcats-popular,
#subcats-popular {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px 24px !important;
    width: 100% !important;
    margin-bottom: 16px !important;
}

#subcats-popular .sub-category-item {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    width: auto !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    justify-content: flex-start !important;
}

#subcats-popular .sub-category-item a {
    color: #0284c7 !important;
    font-size: 14.5px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-block !important;
    float: none !important;
}

#subcats-popular .sub-category-item .count {
    color: #94a3b8 !important;
    font-size: 13.5px !important;
    font-weight: 400 !important;
    margin: 0 !important;
    margin-left: 0 !important;
    padding: 0 !important;
    display: inline-block !important;
    float: none !important;
}
/* 🌟 SUBCATEGORIES 3-COLUMN SAVDO GRID & TOGGLE LINE SYSTEM 2026 */
#sub-categories .sub-cat-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px 24px !important;
    width: 100% !important;
}

@media (max-width: 768px) {
    #sub-categories .sub-cat-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 480px) {
    #sub-categories .sub-cat-grid {
        grid-template-columns: 1fr !important;
    }
}

.sub-category-item {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.sub-category-item a {
    color: #0284c7 !important;
    font-size: 14.5px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: color 0.15s ease !important;
}

.sub-category-item a:hover {
    color: #0369a1 !important;
    text-decoration: underline !important;
}

.sub-category-item .count {
    color: #94a3b8 !important;
    font-size: 13.5px !important;
    font-weight: 400 !important;
    margin-left: 0 !important;
    float: none !important;
}

.subcats-toggle-line {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin-top: 14px !important;
    width: 100% !important;
}

.subcats-toggle-btn {
    color: #0284c7 !important;
    font-size: 14.5px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
    user-select: none !important;
}

.subcats-toggle-btn:hover {
    color: #0369a1 !important;
}

.subcats-toggle-btn .arrow {
    font-size: 10px !important;
    color: #94a3b8 !important;
    display: inline-block !important;
    transition: transform 0.2s ease !important;
}

.subcats-toggle-divider {
    flex: 1 !important;
    height: 1px !important;
    background-color: #e2e8f0 !important;
}
/* 🌟 SAVDO VIEW SWITCHER TOOLBAR STYLES 2026 */
.savdo-view-switcher .view-btn {
    background: transparent !important;
    color: #64748b !important;
    border: none !important;
    box-shadow: none !important;
}

.savdo-view-switcher .view-btn.active,
.savdo-view-switcher .view-btn:hover {
    background: #ffffff !important;
    color: #0f172a !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}
/* 🖼️ PERFECT CENTERED LIST VIEW IMAGES ENGINE 2026 */
.searchresult.list .js-list-card .item-image-box,
.searchresult.list .js-list-card .item-image,
.searchresult.list .js-list-card .item-image a {
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    overflow: hidden !important;
}

.searchresult.list .js-list-card .item-image-box img,
.searchresult.list .js-list-card .item-image img,
.searchresult.list .js-list-card .item-image a img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    transition: transform 0.35s ease !important;
}
.savdo-listing-layout-container {
    display: flex !important;
    gap: 24px !important;
    width: 100% !important;
    align-items: flex-start !important;
    position: relative !important;
    overflow: visible !important;
    margin-top: 10px !important;
}

.savdo-main-listing-col {
    flex: 1 !important;
    min-width: 0 !important;
}

.savdo-sidebar-ads-col {
    width: 310px !important;
    flex: 0 0 310px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 20px !important;
    z-index: 50 !important;
    align-self: flex-start !important;
}

@media (max-width: 992px) {
    .savdo-listing-layout-container {
        flex-direction: column !important;
    }
    .savdo-sidebar-ads-col {
        width: 100% !important;
        flex: none !important;
        position: static !important;
    }
}

/* Adjust Grid View for 3 columns when sidebar is present */
.searchresult.grid #searchlist-all-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px !important;
    margin: 16px 0 !important;
}

@media (max-width: 768px) {
    .searchresult.grid #searchlist-all-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 480px) {
    .searchresult.grid #searchlist-all-grid {
        grid-template-columns: 1fr !important;
    }
}
.savdo-listing-layout-container {
    display: flex !important;
    gap: 24px !important;
    width: 100% !important;
    align-items: flex-start !important;
    position: relative !important;
    overflow: visible !important;
    margin-top: 14px !important;
}

.savdo-main-listing-col {
    flex: 1 !important;
    min-width: 0 !important;
}

.savdo-sidebar-ads-col {
    width: 310px !important;
    flex: 0 0 310px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 20px !important;
    z-index: 50 !important;
    align-self: flex-start !important;
}

@media (max-width: 992px) {
    .savdo-listing-layout-container {
        flex-direction: column !important;
    }
    .savdo-sidebar-ads-col {
        width: 100% !important;
        flex: none !important;
        position: static !important;
    }
}

/* List Card Sizing inside 886px Left Column */
.searchresult.list .js-list-card {
    height: 200px !important;
    width: 100% !important;
}

.searchresult.list .js-list-card .item-image-box {
    flex: 0 0 280px !important;
    width: 280px !important;
    height: 100% !important;
}

/* Adjust Grid View for 3 columns when sidebar is present */
.searchresult.grid #searchlist-all-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px !important;
    margin: 16px 0 !important;
}

@media (max-width: 768px) {
    .searchresult.grid #searchlist-all-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 480px) {
    .searchresult.grid #searchlist-all-grid {
        grid-template-columns: 1fr !important;
    }
}
/* 🌟 SAVDO 2-COLUMN LAYOUT SYSTEM (FULL-WIDTH HEAD + 2-COL ADS) 2026 */
.container, .recommended-ads, .section-allAd, .allAd, .section {
    overflow: visible !important;
}

.savdo-listing-layout-container {
    display: flex !important;
    gap: 24px !important;
    width: 100% !important;
    align-items: flex-start !important;
    position: relative !important;
    overflow: visible !important;
    margin-top: 14px !important;
}

.savdo-main-listing-col {
    flex: 1 !important;
    min-width: 0 !important;
}

.savdo-sidebar-ads-col {
    width: 310px !important;
    flex: 0 0 310px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 20px !important;
    z-index: 50 !important;
    align-self: flex-start !important;
}

@media (max-width: 992px) {
    .savdo-listing-layout-container {
        flex-direction: column !important;
    }
    .savdo-sidebar-ads-col {
        width: 100% !important;
        flex: none !important;
        position: static !important;
    }
}

/* List Card Sizing inside 886px Left Column */
.searchresult.list .js-list-card {
    height: 200px !important;
    width: 100% !important;
}

.searchresult.list .js-list-card .item-image-box {
    flex: 0 0 280px !important;
    width: 280px !important;
    height: 100% !important;
}

/* Adjust Grid View for 3 columns when sidebar is present */
.searchresult.grid #searchlist-all-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px !important;
    margin: 16px 0 !important;
}

@media (max-width: 768px) {
    .searchresult.grid #searchlist-all-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 480px) {
    .searchresult.grid #searchlist-all-grid {
        grid-template-columns: 1fr !important;
    }
}
/* 🌟 SAVDO PAGINATION & LOAD MORE STYLES */
.savdo-page-link:hover {
    background: #ff5252 !important;
    color: #ffffff !important;
    border-color: #ff5252 !important;
    box-shadow: 0 2px 6px rgba(255,82,82,0.25) !important;
}

#savdo-load-more-btn:hover {
    background: #ff5252 !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(255,82,82,0.25) !important;
}
/* 🌟 SAVDO GRID VIEW: TRANSPARENT CARDS (NO CARD BG) & TIGHT SPACING 2026 */
.searchresult.grid #searchlist-all-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 12px 14px !important; /* 12px vertical gap, 14px horizontal gap */
    margin: 12px 0 !important;
}

.searchresult.grid .col-sm-6,
.searchresult.grid .col-md-4,
.searchresult.grid .col-lg-4,
.searchresult.grid .js-item-listing {
    margin-bottom: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}

.searchresult.grid .card,
.searchresult.grid .item-info {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 6px 2px 0 2px !important;
}

.searchresult.grid .item-image-box {
    height: 180px !important;
    width: 100% !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background: #f1f5f9 !important;
}

.searchresult.grid .item-image-box img {
    border-radius: 12px !important;
    object-fit: cover !important;
    object-position: center center !important;
}

@media (max-width: 768px) {
    .searchresult.grid #searchlist-all-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px 10px !important;
    }
}

@media (max-width: 480px) {
    .searchresult.grid #searchlist-all-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
}
/* 🌟 SAVDO CATEGORY LISTING GRID VIEW (HOMEPAGE 1-TO-1 MATCH & PERFECT FLUSH ALIGNMENT) */
.searchresult.grid #searchlist-all-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px 16px !important;
    margin: 12px 0 !important;
    padding: 0 !important;
    width: 100% !important;
}

.searchresult.grid .savdo-card {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    overflow: visible !important;
    display: flex !important;
    flex-direction: column !important;
    cursor: pointer !important;
}

@media (max-width: 768px) {
    .searchresult.grid #searchlist-all-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px 10px !important;
    }
}

@media (max-width: 480px) {
    .searchresult.grid #searchlist-all-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
}
/* 🌟 100% PURGE OF ALL CARD BACKGROUND LAYERS, BORDERS & SHADOWS IN GRID VIEW */
.searchresult.grid,
.searchresult.grid #searchlist-all-grid,
.searchresult.grid .js-item-listing,
.searchresult.grid .savdo-card,
.searchresult.grid .card,
.searchresult.grid .item-info,
.searchresult.grid .ad-info,
.searchresult.grid > div {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
/* 🌟 SAVDO REGULAR WEIGHT (400) & LARGER AD TITLES FOR LIST & GRID VIEWS */
.searchresult.list .js-list-card .item-title,
.searchresult.list .js-list-card .item-title a,
.searchresult.list .item-title a {
    font-weight: 400 !important;
    font-size: 19.5px !important;
    line-height: 1.4 !important;
    color: #1e293b !important;
}

.searchresult.grid .savdo-card-title,
.searchresult.grid .item-title,
.searchresult.grid .item-title a {
    font-weight: 400 !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    color: #1e293b !important;
}
/* 🏆 SAVDO TALL PROMINENT LIST VIEW CARDS (60% PHOTO / 40% CONTENT WIDTH, 340PX HEIGHT) */
.searchresult.list .js-list-card {
    height: 340px !important;
    width: 100% !important;
    margin-bottom: 16px !important;
    background: #ffffff !important;
    border-radius: 16px !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04) !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: row !important;
    transition: all 0.25s ease !important;
}

.searchresult.list .js-list-card .item-image-box {
    flex: 0 0 60% !important;
    width: 60% !important;
    height: 100% !important;
    position: relative !important;
    overflow: hidden !important;
    background: #f1f5f9 !important;
}

.searchresult.list .js-list-card .item-image-box img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
}

.searchresult.list .js-list-card .item-info {
    flex: 0 0 40% !important;
    width: 40% !important;
    padding: 24px 28px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    box-sizing: border-box !important;
}

.searchresult.list .js-list-card h4:first-child {
    font-size: 26px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin: 0 0 8px 0 !important;
}

.searchresult.list .js-list-card .item-title a {
    font-size: 20px !important;
    font-weight: 400 !important;
    line-height: 1.45 !important;
    color: #1e293b !important;
}

@media (max-width: 768px) {
    .searchresult.list .js-list-card {
        flex-direction: column !important;
        height: auto !important;
        margin-bottom: 16px !important;
    }
    .searchresult.list .js-list-card .item-image-box {
        flex: none !important;
        width: 100% !important;
        height: 240px !important;
    }
    .searchresult.list .js-list-card .item-info {
        flex: none !important;
        width: 100% !important;
        padding: 18px !important;
    }
}
/* 🌟 REMOVE CARD ZOOM HOVER ANIMATIONS (KEEP CARDS STEADY) */
.searchresult.list .js-list-card:hover,
.searchresult.grid .js-item-listing:hover,
.searchresult.grid .savdo-card:hover,
.savdo-card:hover {
    transform: none !important;
    box-shadow: none !important;
}

.searchresult.list .js-list-card:hover .item-image-box img,
.searchresult.grid .item-image-box img,
.savdo-card-img-box img {
    transform: none !important;
}

/* 🌟 HOVER GALLERY DOTS (BOTTOM RIGHT CORNER, 15% BOTTOM, 10PX RIGHT) */
.savdo-gallery-dots {
    position: absolute !important;
    bottom: 15% !important;
    right: 10px !important;
    z-index: 25 !important;
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    pointer-events: none !important;
    background: rgba(0, 0, 0, 0.25) !important;
    padding: 3px 6px !important;
    border-radius: 10px !important;
    backdrop-filter: blur(2px) !important;
}

.savdo-gallery-dot {
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.45) !important;
    transition: all 0.15s ease !important;
}

.savdo-gallery-dot.active {
    background: #ffffff !important;
    width: 8px !important;
    height: 8px !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4) !important;
}
/* 🌟 GRID VIEW: DOTS INDICATOR IN BOTTOM-RIGHT (MAX 5 DOTS, LOWER POSITION 10PX) */
.savdo-gallery-dots {
    position: absolute !important;
    bottom: 10px !important;
    right: 12px !important;
    z-index: 25 !important;
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    pointer-events: none !important;
    background: rgba(15, 23, 42, 0.4) !important;
    padding: 3px 6px !important;
    border-radius: 10px !important;
    backdrop-filter: blur(4px) !important;
}

.savdo-gallery-dot {
    width: 5px !important;
    height: 5px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.4) !important;
    transition: all 0.15s ease !important;
}

.savdo-gallery-dot.active {
    background: #ffffff !important;
    width: 7px !important;
    height: 7px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5) !important;
}

/* 🌟 LIST VIEW: MIDDLE NAVIGATION ARROWS (LEFT & RIGHT) */
.savdo-photo-arrow {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 32px !important;
    height: 32px !important;
    background: rgba(255, 255, 255, 0.85) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #0f172a !important;
    font-size: 16px !important;
    font-weight: bold !important;
    z-index: 30 !important;
    cursor: pointer !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18) !important;
    transition: all 0.2s ease !important;
    opacity: 0;
}

.savdo-list-arrow-box:hover .savdo-photo-arrow {
    opacity: 1 !important;
}

.savdo-photo-arrow:hover {
    background: #ffffff !important;
    transform: translateY(-50%) scale(1.1) !important;
    color: #ff5252 !important;
}

.savdo-photo-arrow-left {
    left: 12px !important;
}

.savdo-photo-arrow-right {
    right: 12px !important;
}
/* 🌟 LIST VIEW: CLEAN STYLISH ARROWS (STAY DARK #0F172A ON HOVER) */
.savdo-photo-arrow {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 36px !important;
    height: 36px !important;
    background: #ffffff !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #0f172a !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    z-index: 99 !important;
    cursor: pointer !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.18) !important;
    transition: all 0.2s ease !important;
    opacity: 0;
    pointer-events: auto !important;
}

.savdo-list-arrow-box:hover .savdo-photo-arrow,
.js-list-card:hover .savdo-photo-arrow {
    opacity: 1 !important;
}

.savdo-photo-arrow-left {
    left: 14px !important;
}

.savdo-photo-arrow-right {
    right: 14px !important;
}

.savdo-photo-arrow:hover {
    background: #ffffff !important;
    color: #0f172a !important;
    border-color: #94a3b8 !important;
    transform: translateY(-50%) scale(1.1) !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25) !important;
}

.savdo-photo-count-badge,
.savdo-count-text {
    font-weight: 400 !important;
}
/* 🌟 SAVDO COMBINED TOP-RIGHT BADGE & VIDEO ICON RULES */
.savdo-photo-count-badge[data-has-video="1"] .savdo-video-icon {
    display: inline-block !important;
}

.savdo-photo-count-badge[data-total="0"],
.savdo-photo-count-badge[data-total=""] {
    display: none !important;
}

.savdo-photo-count-badge,
.savdo-count-text {
    font-weight: 400 !important;
}
