/* 🧱 STANDALONE GRID & FLEXBOX UTILITIES */
.container {
    max-width: 1240px !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    box-sizing: border-box !important;
}

.row {
    display: flex !important;
    flex-wrap: wrap !important;
    margin-left: -12px !important;
    margin-right: -12px !important;
}

.row > [class*="col-"] {
    padding-left: 12px !important;
    padding-right: 12px !important;
    box-sizing: border-box !important;
}

.col-12 { width: 100% !important; flex: 0 0 100% !important; }
.col-11 { width: 91.666667% !important; flex: 0 0 91.666667% !important; }
.col-10 { width: 83.333333% !important; flex: 0 0 83.333333% !important; }
.col-9  { width: 75% !important; flex: 0 0 75% !important; }
.col-8  { width: 66.666667% !important; flex: 0 0 66.666667% !important; }
.col-7  { width: 58.333333% !important; flex: 0 0 58.333333% !important; }
.col-6  { width: 50% !important; flex: 0 0 50% !important; }
.col-5  { width: 41.666667% !important; flex: 0 0 41.666667% !important; }
.col-4  { width: 33.333333% !important; flex: 0 0 33.333333% !important; }
.col-3  { width: 25% !important; flex: 0 0 25% !important; }
.col-2  { width: 16.666667% !important; flex: 0 0 16.666667% !important; }
.col-1  { width: 8.333333% !important; flex: 0 0 8.333333% !important; }

/* Display Breakpoint Utilities */
.d-none { display: none !important; }
.d-block { display: block !important; }
.d-flex { display: flex !important; }

@media (min-width: 992px) {
    .d-lg-none { display: none !important; }
    .d-lg-block { display: block !important; }
    .d-lg-flex { display: flex !important; }
}

@media (max-width: 991px) {
    .d-lg-none { display: block !important; }
    .d-lg-block { display: none !important; }
}

/* ==========================================================================
   ⚡ SAVDO.TJ 2026 PURE CLEAN CORE DESIGN SYSTEM (STANDALONE)
   ========================================================================== */

/* 1. HIDE ALL MOBILE-ONLY CONTAINERS ON DESKTOP (>= 992px) */
@media (min-width: 992px) {
    #header-container-mobile,
    #bottom-container-mobile,
    .header-container-block-mobile,
    .pnl-btn-mobile {
        display: none !important;
    }
}

/* HIDE DEPRECATED DUPLICATE SEARCH ROW */
#city_text_main_search {
    display: none !important;
}

#top-main-category-markad {
    display: block !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
}

#top-main-category-markad > .container {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* 2. GLOBAL DESKTOP CONTAINER (1240px UNIFIED GRID FOR ALL BLOCKS) */
@media (min-width: 1200px) {
    .container,
    .wrap,
    .savdo-ad-wrapper,
    .container-content,
    .header-container-block,
    #header-container,
    #header,
    .main-content,
    .header-widget,
    .container-recommended,
    .recommended-ads .container {
        max-width: 1240px !important;
        width: 1240px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
        box-sizing: border-box !important;
        float: none !important;
    }
}

/* 3. HEADER BUTTONS & SEARCH BAR ALIGNMENT */
.header-container-block {
    background: #ffffff !important;
    border-bottom: 1px solid #e2e8f0 !important;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.03) !important;
    padding: 6px 0 !important;
}

#header_city_select {
    display: flex !important;
    align-items: center !important;
    background: #f1f5f9 !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 10px !important;
    padding: 6px 12px !important;
    height: 42px !important;
    box-sizing: border-box !important;
}

#header_city_select select {
    border: none !important;
    background: transparent !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    width: 100% !important;
    outline: none !important;
}

#header_search_input {
    display: flex !important;
    align-items: center !important;
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 10px !important;
    padding: 2px 2px 2px 12px !important;
    height: 42px !important;
    box-sizing: border-box !important;
}

#header_search_input input {
    border: none !important;
    background: transparent !important;
    font-size: 14px !important;
    color: #0f172a !important;
    width: 100% !important;
    outline: none !important;
    padding-left: 8px !important;
}

#header_search_input button {
    background: #16a34a !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 6px 18px !important;
    font-weight: 700 !important;
    font-size: 13.5px !important;
    cursor: pointer !important;
    height: 36px !important;
}

.header-widget {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 12px !important;
    white-space: nowrap !important;
}

.add-head-btn {
    background-color: #16a34a !important;
    color: #ffffff !important;
    border-radius: 10px !important;
    padding: 8px 18px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    text-decoration: none !important;
    box-shadow: 0 4px 12px rgba(22, 163, 74, 0.25) !important;
}

.sign-in-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 8px 18px !important;
    border: 1px solid #CBD5E1 !important;
    border-radius: 10px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #1E293B !important;
    background: #FFFFFF !important;
    text-decoration: none !important;
}

/* 4. 2-ROW COMPACT CATEGORY GRID WITH RICH ICONS */
.savdo-cat-showcase-wrapper {
    width: 100% !important;
    margin-top: 16px !important;
    margin-bottom: 24px !important;
    display: block !important;
}

.savdo-cat-grid {
    display: grid !important;
    grid-template-columns: repeat(9, 1fr) !important;
    gap: 12px !important;
    width: 100% !important;
}

.savdo-cat-card {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    height: 106px !important;
    background: #f1f5f9 !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    padding: 12px 14px !important;
    position: relative !important;
    overflow: hidden !important;
    text-decoration: none !important;
    color: inherit !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.02) !important;
}

.savdo-cat-card:hover {
    background: #ffffff !important;
    transform: translateY(-3px) !important;
    border-color: #16a34a !important;
    box-shadow: 0 10px 24px rgba(22, 163, 74, 0.14) !important;
}

.savdo-cat-title {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    line-height: 1.3 !important;
    text-align: left !important;
    width: 100% !important;
    max-width: 80% !important;
    z-index: 2 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

.savdo-cat-icon {
    width: 56px !important;
    height: 56px !important;
    position: absolute !important;
    right: 6px !important;
    bottom: 4px !important;
    z-index: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    pointer-events: none !important;
}

.savdo-cat-icon img {
    width: 100% !important;
    height: 100% !important;
    max-width: 56px !important;
    max-height: 56px !important;
    object-fit: contain !important;
    transition: transform 0.25s ease !important;
}

.savdo-cat-card:hover .savdo-cat-icon img {
    transform: scale(1.12) !important;
}

@media (max-width: 1199px) {
    .savdo-cat-grid {
        grid-template-columns: repeat(6, 1fr) !important;
    }
}

@media (max-width: 991px) {
    .savdo-cat-grid {
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 10px !important;
    }
    .savdo-cat-card {
        height: 98px !important;
        padding: 10px 12px !important;
    }
    .savdo-cat-icon {
        width: 46px !important;
        height: 46px !important;
    }
}

@media (max-width: 575px) {
    .savdo-cat-grid {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 8px !important;
    }
    .savdo-cat-card {
        height: 90px !important;
        padding: 8px 10px !important;
        border-radius: 12px !important;
    }
    .savdo-cat-title {
        font-size: 11.5px !important;
    }
    .savdo-cat-icon {
        width: 38px !important;
        height: 38px !important;
        right: 4px !important;
        bottom: 4px !important;
    }
}

/* 5. STORIES CAROUSEL TRACK & AVATAR CIRCLES */
.savdo-stories-wrapper {
    width: 100% !important;
    margin-top: 16px !important;
    margin-bottom: 24px !important;
    padding: 0 !important;
}

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

.savdo-stories-track-scroll {
    display: flex !important;
    flex-direction: row !important;
    gap: 16px !important;
    overflow-x: auto !important;
    scroll-behavior: smooth !important;
    padding: 8px 4px 16px 4px !important;
    -webkit-overflow-scrolling: touch !important;
}

.savdo-stories-track-scroll::-webkit-scrollbar {
    height: 4px !important;
}

.savdo-stories-track-scroll::-webkit-scrollbar-thumb {
    background: #cbd5e1 !important;
    border-radius: 4px !important;
}

.savdo-story-card-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-shrink: 0 !important;
    width: 92px !important;
    cursor: pointer !important;
    user-select: none !important;
    transition: transform 0.2s ease !important;
}

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

.savdo-story-ring {
    width: 80px !important;
    height: 80px !important;
    border-radius: 50% !important;
    padding: 3px !important;
    background: linear-gradient(135deg, #16a34a, #eab308, #22c55e) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 4px 14px rgba(22, 163, 74, 0.2) !important;
    transition: all 0.2s ease !important;
}

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

.savdo-story-ring.viewed .savdo-story-img {
    opacity: 0.85 !important;
}

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

.savdo-story-label {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    margin-top: 8px !important;
    text-align: center !important;
    width: 100% !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* 6. STORIES MODAL PLAYER OVERLAY */
.savdo-story-modal-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background: rgba(5, 8, 15, 0.94) !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;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: opacity 0.25s ease, visibility 0.25s ease !important;
}

.savdo-story-modal-overlay.active {
    opacity: 1 !important;
    visibility: visible !important;
}

.savdo-story-modal-box {
    position: relative !important;
    width: 100% !important;
    max-width: 430px !important;
    height: 90vh !important;
    max-height: 780px !important;
    background: #05070a !important;
    border-radius: 24px !important;
    overflow: hidden !important;
    box-shadow: 0 30px 60px -12px rgba(0, 0, 0, 0.85), 0 0 0 1px rgba(255, 255, 255, 0.1) !important;
    display: flex !important;
    flex-direction: column !important;
}

@media screen and (max-width: 480px) {
    .savdo-story-modal-box {
        height: 100vh !important;
        max-height: 100vh !important;
        border-radius: 0 !important;
    }
}

.savdo-story-progress-bar {
    position: absolute !important;
    top: 12px !important;
    left: 12px !important;
    right: 12px !important;
    height: 3.5px !important;
    background: rgba(255, 255, 255, 0.25) !important;
    border-radius: 4px !important;
    z-index: 20 !important;
    overflow: hidden !important;
}

.savdo-story-progress-fill {
    height: 100% !important;
    width: 0% !important;
    background: #ffffff !important;
    border-radius: 4px !important;
    box-shadow: 0 0 8px rgba(255, 255, 255, 0.8) !important;
}

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

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

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

.savdo-story-author-info {
    color: #ffffff !important;
    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;
    line-height: 1.2 !important;
}

.savdo-story-author-views {
    font-size: 11.5px !important;
    color: rgba(255, 255, 255, 0.85) !important;
    text-shadow: 0 1px 3px rgba(0,0,0,0.8) !important;
    margin-top: 2px !important;
}

.savdo-story-close-btn {
    background: rgba(0, 0, 0, 0.45) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !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;
    z-index: 22 !important;
    pointer-events: auto !important;
    transition: background 0.2s ease, transform 0.2s ease !important;
}

.savdo-story-close-btn:hover {
    background: rgba(255, 255, 255, 0.25) !important;
    transform: scale(1.05) !important;
}

.savdo-story-nav-zones {
    position: absolute !important;
    top: 70px !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 140px !important;
    display: flex !important;
    z-index: 15 !important;
}

.savdo-story-nav-prev {
    width: 35% !important;
    height: 100% !important;
    cursor: pointer !important;
}

.savdo-story-nav-next {
    width: 65% !important;
    height: 100% !important;
    cursor: pointer !important;
}

.savdo-story-media-container {
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    background: #000000 !important;
    overflow: hidden !important;
    padding: 70px 14px 140px 14px !important;
    box-sizing: border-box !important;
}

.savdo-story-media-bg-blur {
    position: absolute !important;
    top: -10% !important;
    left: -10% !important;
    width: 120% !important;
    height: 120% !important;
    background-size: cover !important;
    background-position: center !important;
    filter: blur(40px) brightness(0.35) !important;
    opacity: 0.85 !important;
    transform: scale(1.15) !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

.savdo-story-media-container img.savdo-story-img-main {
    position: relative !important;
    z-index: 2 !important;
    max-width: 100% !important;
    max-height: 100% !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    border-radius: 18px !important;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.75), 0 0 0 1px rgba(255, 255, 255, 0.12) !important;
    transition: transform 0.25s ease !important;
}

.savdo-story-footer-cta {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 20 !important;
    padding: 30px 18px 24px 18px !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;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    pointer-events: auto !important;
}

.savdo-story-info-box {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    color: #ffffff !important;
    text-align: left !important;
}

.savdo-story-info-title {
    font-size: 14.5px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    line-height: 1.3 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-shadow: 0 1px 4px rgba(0,0,0,0.9) !important;
}

.savdo-story-info-price {
    font-size: 18px !important;
    font-weight: 800 !important;
    color: #22c55e !important;
    text-shadow: 0 2px 8px rgba(34, 197, 94, 0.3) !important;
    letter-spacing: 0.3px !important;
}

.savdo-story-cta-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    padding: 14px 20px !important;
    background: #16a34a !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    border-radius: 14px !important;
    text-decoration: none !important;
    box-shadow: 0 8px 25px rgba(22, 163, 74, 0.45) !important;
    transition: transform 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease !important;
    box-sizing: border-box !important;
}

.savdo-story-cta-btn:hover {
    background: #15803d !important;
    color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 12px 30px rgba(22, 163, 74, 0.6) !important;
}

/* 7. 🛍️ PERFECT 4-COLUMN PRODUCT GRID & CARDS */
.recommended-ads-list {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 16px !important;
    width: 100% !important;
    margin-top: 16px !important;
}

@media (max-width: 991px) {
    .recommended-ads-list {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 12px !important;
    }
}

@media (max-width: 575px) {
    .recommended-ads-list {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
    }
}

.recommended-ads-list > div {
    width: 100% !important;
    float: none !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin-bottom: 0 !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.03) !important;
    display: flex !important;
    flex-direction: column !important;
}

.recommended-ads-list > div:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.1) !important;
    border-color: #cbd5e1 !important;
}

.recommended-ads-list .card {
    border: none !important;
    border-radius: 0 !important;
    margin: 0 !important;
    background: transparent !important;
}

.recommended-ads-list .item-image-box {
    width: 100% !important;
    height: 180px !important;
    position: relative !important;
    overflow: hidden !important;
    background: #f8fafc !important;
}

.recommended-ads-list .item-image img {
    width: 100% !important;
    height: 180px !important;
    object-fit: cover !important;
    border-top-left-radius: 14px !important;
    border-top-right-radius: 14px !important;
}

.recommended-ads-list .item-info {
    padding: 12px 14px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    flex-grow: 1 !important;
}

.recommended-ads-list .item-title h4 {
    font-size: 17px !important;
    font-weight: 800 !important;
    color: #16a34a !important;
    margin: 0 0 4px 0 !important;
}

.recommended-ads-list .item-title a {
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    text-decoration: none !important;
    line-height: 1.35 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

.recommended-ads-list .item-title a:hover {
    color: #16a34a !important;
}

.recommended-ads-list .item-meta {
    font-size: 11.5px !important;
    color: #64748b !important;
    margin-top: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}


/* 🔝 BACK TO TOP FLOATING BUTTON (#myBtn) */
#myBtn {
    position: fixed !important;
    bottom: 30px !important;
    right: 30px !important;
    width: 46px !important;
    height: 46px !important;
    background: #16a34a !important;
    color: #ffffff !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px !important;
    cursor: pointer !important;
    z-index: 99999 !important;
    box-shadow: 0 4px 16px rgba(22, 163, 74, 0.4) !important;
    opacity: 0 !important;
    transition: opacity 0.3s ease, transform 0.2s ease !important;
}

#myBtn:hover {
    transform: translateY(-3px) !important;
    background: #15803d !important;
}


/* ⚡ SAVDO 2026 PURE FLEXBOX HEADER BAR */
.header-container-block {
    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 2px 12px rgba(15, 23, 42, 0.04) !important;
    padding: 0 !important;
    margin: 0 !important;
}

.savdo-header-bar {
    width: 100% !important;
    height: 72px !important;
    display: flex !important;
    align-items: center !important;
}

.savdo-header-inner {
    max-width: 1240px !important;
    width: 1240px !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
    box-sizing: border-box !important;
}

.savdo-header-form {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
    width: 100% !important;
    margin: 0 !important;
}

.savdo-header-logo {
    display: flex !important;
    align-items: center !important;
    flex-shrink: 0 !important;
    text-decoration: none !important;
}

.savdo-header-logo img {
    height: 42px !important;
    width: auto !important;
    object-fit: contain !important;
}

.savdo-header-city {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: #f8fafc !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 12px !important;
    padding: 0 14px !important;
    height: 44px !important;
    width: 165px !important;
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
    transition: border-color 0.2s ease !important;
}

.savdo-header-city:focus-within {
    border-color: #16a34a !important;
}

.savdo-header-city select {
    border: none !important;
    background: transparent !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    width: 100% !important;
    outline: none !important;
    cursor: pointer !important;
}

.savdo-header-search {
    display: flex !important;
    align-items: center !important;
    flex-grow: 1 !important;
    background: #f8fafc !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 12px !important;
    padding: 3px 3px 3px 14px !important;
    height: 44px !important;
    box-sizing: border-box !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

.savdo-header-search:focus-within {
    border-color: #16a34a !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.12) !important;
}

.savdo-header-search input {
    border: none !important;
    background: transparent !important;
    font-size: 14px !important;
    color: #0f172a !important;
    width: 100% !important;
    outline: none !important;
    padding-left: 8px !important;
}

.savdo-header-search button {
    background: #16a34a !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 9px !important;
    padding: 0 20px !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    cursor: pointer !important;
    height: 38px !important;
    flex-shrink: 0 !important;
    transition: background-color 0.2s ease !important;
}

.savdo-header-search button:hover {
    background: #15803d !important;
}

.savdo-header-actions {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    flex-shrink: 0 !important;
    white-space: nowrap !important;
}

.user-profile-link {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    text-decoration: none !important;
    padding: 4px 10px !important;
    border-radius: 10px !important;
    transition: background 0.2s ease !important;
}

.user-profile-link:hover {
    background: #f1f5f9 !important;
}

.user-avatar {
    width: 34px !important;
    height: 34px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    border: 1px solid #cbd5e1 !important;
}

.user-name {
    font-size: 13.5px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
}