/*
 * ╔════════════════════════════════════════════════════════════════╗
 * ║   PREFIX THEME                                                 ║
 * ║   Slug: default-1778983179-1779181703-1780087863  |  ID: 7     ║
 * ║                                                                ║
 * ║   Beautiful, Corporate, Simple and Modern redesign.            ║
 * ║   Clean blues, slate backgrounds, refined borders.             ║
 * ╚════════════════════════════════════════════════════════════════╝
 */

:root {
    /* Sleek Professional Blues & Slate */
    --ft-cyan:        var(--primary-blue, #2563eb);          /* Royal Blue */
    --ft-cyan-soft:   var(--primary-blue, #3b82f6);
    --ft-violet:      var(--primary-orange, #1d4ed8);
    --ft-violet-soft: var(--primary-orange, #2563eb);
    --ft-pink:        var(--buy-button, #10b981);            /* Success Green */
    --ft-green:       #10b981;
    --ft-amber:       #f59e0b;

    /* Corporate Space Grays -> Pure Black & Dark Grays */
    --ft-void:        #000000;
    --ft-space:       #000000;          /* Pitch black background */
    --ft-ink:         #0a0a0a;          /* Very dark gray card background */
    --ft-steel:       #171717;          /* Slightly lighter gray hover surface */
    --ft-line:        rgba(255, 255, 255, 0.08);

    /* Metin — professional high contrast */
    --ft-text:        #f8fafc;          /* Slate 50 */
    --ft-text-dim:    #cbd5e1;          /* Slate 300 */
    --ft-text-faint:  #94a3b8;          /* Slate 400 */

    --card-bg:        var(--ft-ink) !important;
    --bg-color:       var(--ft-space) !important;
    --border-color:   var(--ft-line) !important;
    --text-color:     var(--ft-text) !important;
    --text-muted:     var(--ft-text-dim) !important;
    --header-bg:      rgba(15, 23, 42, 0.9) !important;
    --input-bg:       #0f172a !important;
    --glass-bg:       rgba(255, 255, 255, 0.02) !important;
    --glass-border:   rgba(255, 255, 255, 0.08) !important;
    --card-radius:    12px !important;
    --theme-font:     'Outfit', 'Inter', sans-serif !important;
}

[data-theme="light"] {
    --ft-bg-light:     #f8fafc;        /* Slate 50 */
    --ft-surface-1:    #ffffff;        /* White card */
    --ft-surface-2:    #f1f5f9;        /* Slate 100 */
    --ft-surface-3:    #e2e8f0;        /* Slate 200 */
    --ft-glass:        rgba(255, 255, 255, 0.85);

    --ft-ink-1:        #0f172a;        /* Slate 900 */
    --ft-ink-2:        #334155;        /* Slate 700 */
    --ft-ink-3:        #64748b;        /* Slate 500 */
    --ft-ink-4:        #94a3b8;        /* Slate 400 */

    --ft-cyan-l:       var(--primary-blue, #2563eb);
    --ft-cyan-l-soft:  var(--primary-blue, #3b82f6);
    --ft-violet-l:     var(--primary-orange, #1d4ed8);
    --ft-violet-l-soft:var(--primary-orange, #2563eb);
    --ft-pink-l:       var(--buy-button, #059669);
    --ft-green-l:      #059669;

    --ft-border-l:     rgba(0, 0, 0, 0.06);
    --ft-border-l-2:   rgba(0, 0, 0, 0.08);

    --ft-shadow-sm:    0 1px 2px rgba(0, 0, 0, 0.02), 0 2px 6px rgba(0, 0, 0, 0.04);
    --ft-shadow-md:    0 4px 12px rgba(0, 0, 0, 0.04), 0 8px 24px rgba(0, 0, 0, 0.06);
    --ft-shadow-lg:    0 8px 24px rgba(0, 0, 0, 0.05), 0 20px 48px rgba(0, 0, 0, 0.08);
    --ft-shadow-cyan:  0 4px 12px rgba(37, 99, 235, 0.06);

    --bg-color:        var(--ft-bg-light) !important;
    --card-bg:         var(--ft-surface-1) !important;
    --border-color:    var(--ft-border-l) !important;
    --text-color:      var(--ft-ink-1) !important;
    --text-muted:      var(--ft-ink-3) !important;
    --header-bg:       rgba(255, 255, 255, 0.9) !important;
    --input-bg:        #ffffff !important;
    --glass-bg:        var(--ft-glass) !important;
    --glass-border:    var(--ft-border-l) !important;
}

/* ════════════════════════════════════════════════════════
   1 · TYPOGRAPHY — Outfit (UI) + Inter (başlıklar)
   ═══════════════════════════════════════════════════════════ */
*:not(i):not([class*="fa-"]):not([class*="ti-"]):not(.fa):not(.fas):not(.far):not(.fab):not(.fal):not(.fad):not(.ti):not(.material-icons):not(.material-symbols-outlined),
*::before,
*::after {
    font-family: 'Outfit', 'Inter', sans-serif !important;
    -webkit-font-smoothing: antialiased;
}
.fa::before, .fas::before, .far::before, .fab::before,
.fal::before, .fad::before,
[class*="fa-"]::before,
.ti::before, [class*="ti-"]::before,
.material-icons, .material-symbols-outlined {
    font-family: revert !important;
}

h1, h2, h3, h4,
.section-title,
.logo-text-blue,
.logo-text-orange,
.btn-categories,
.cat-tab-btn.active,
.current-price-v2,
.discount-badge-v2,
.cat-section-header h2,
.categories-header h1 {
    font-family: 'Outfit', 'Inter', sans-serif !important;
    letter-spacing: normal !important;
}

code, pre, kbd, .mono { font-family: monospace !important; }

/* ════════════════════════════════════════════════════════
   2 · BODY — Minimal slate background
   ═══════════════════════════════════════════════════════════ */
html, body {
    background-color: var(--bg-color) !important;
    color: var(--text-color) !important;
}
body {
    background-image: none !important;
    background-size: unset !important;
    background-attachment: scroll !important;
    position: relative !important;
}
body::before {
    content: '' !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: -1 !important;
    pointer-events: none !important;
    background-image: none !important;
}

.container { max-width: 1600px !important; }

/* ════════════════════════════════════════════════════════
   3 · ANNOUNCEMENT
   ═══════════════════════════════════════════════════════════ */
.top-announcement {
    background: var(--ft-violet) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
    padding: 8px 0 !important;
    position: relative !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    min-height: 38px !important;
    animation: none !important;
}

/* ════════════════════════════════════════════════════════
   4 · HEADER — corporate simple header
   ═══════════════════════════════════════════════════════════ */
.main-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 200 !important;
    background: var(--header-bg) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-bottom: 1px solid var(--border-color) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04) !important;
    transform: translateZ(0);
    will-change: transform;
}
[data-theme="light"] .main-header {
    background: rgba(11, 16, 36, 0.85) !important;
}

/* Üst animasyonlu neon çizgi */
.main-header::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important; left: 0 !important; right: 0 !important;
    height: 2px !important;
    background: linear-gradient(90deg,
        transparent 0%, var(--ft-violet) 18%, var(--ft-cyan) 50%,
        var(--ft-pink) 82%, transparent 100%) !important;
    background-size: 200% 100% !important;
    animation: ft-headerline 5s linear infinite !important;
    box-shadow: 0 0 12px rgba(0, 240, 255, 0.6) !important;
    z-index: 5 !important;
    pointer-events: none !important;
}
@keyframes ft-headerline {
    0%   { background-position: 100% 0; }
    100% { background-position: -100% 0; }
}
/* Alt soft glow ayırıcı */
.main-header::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important; left: 0 !important; right: 0 !important;
    height: 1px !important;
    background: linear-gradient(90deg,
        transparent, rgba(0, 240, 255, 0.4) 35%, rgba(176, 38, 255, 0.3) 65%, transparent) !important;
    z-index: 5 !important;
    pointer-events: none !important;
}

.header-top { padding: 16px 0 12px !important; gap: 20px !important; }
.header-nav {
    border-top: 1px solid rgba(0, 240, 255, 0.08) !important;
    padding: 10px 0 !important;
}
.nav-links { gap: 4px !important; }
.actions   { gap: 8px !important; align-items: center !important; }

/* ════════════════════════════════════════════════════════
   5 · LOGO — neon hayalet metin
═══════════════════════════════════════════════════════════ */
.logo, .mobile-logo {
    filter: drop-shadow(0 0 12px rgba(0, 240, 255, 0.5)) !important;
    transition: filter .22s !important;
}
.logo:hover, .mobile-logo:hover {
    filter: drop-shadow(0 0 22px rgba(0, 240, 255, 0.85)) !important;
}
.logo-text-blue {
    color: var(--ft-cyan) !important;
    text-shadow:
        0 0 8px rgba(0, 240, 255, 0.7),
        0 0 24px rgba(0, 240, 255, 0.45) !important;
}
.logo-text-orange {
    color: var(--ft-violet) !important;
    text-shadow:
        0 0 8px rgba(176, 38, 255, 0.7),
        0 0 24px rgba(176, 38, 255, 0.45) !important;
}

/* ════════════════════════════════════════════════════════
   6 · SEARCH BOX — pill, focus = neon trace
═══════════════════════════════════════════════════════════ */
.search-container {
    border-radius: 999px !important;
    border: 1.5px solid rgba(0, 240, 255, 0.25) !important;
    background: rgba(255, 255, 255, 0.03) !important;
    transition: all .22s !important;
}
.search-input {
    background: transparent !important;
    color: var(--ft-text) !important;
    font-family: 'Share Tech Mono', monospace !important;
    letter-spacing: 0.02em !important;
}
.search-input::placeholder {
    color: rgba(154, 163, 191, 0.55) !important;
    font-family: 'Share Tech Mono', monospace !important;
}
.search-btn { color: var(--ft-cyan) !important; }
.search-container:focus-within {
    border-color: var(--ft-cyan) !important;
    background: rgba(0, 240, 255, 0.06) !important;
    box-shadow:
        0 0 0 3px rgba(0, 240, 255, 0.15),
        0 0 32px rgba(0, 240, 255, 0.35) !important;
}

/* ════════════════════════════════════════════════════════
   7 · ICON / ACTION BUTTONS — glassmorphism, neon hover
═══════════════════════════════════════════════════════════ */
.icon-btn {
    color: rgba(0, 240, 255, 0.75) !important;
    background: rgba(0, 240, 255, 0.05) !important;
    border: 1px solid rgba(0, 240, 255, 0.18) !important;
    border-radius: 10px !important;
    transition: all .2s !important;
}
.icon-btn:hover {
    color: var(--ft-cyan) !important;
    background: rgba(0, 240, 255, 0.12) !important;
    border-color: rgba(0, 240, 255, 0.5) !important;
    box-shadow:
        0 0 0 3px rgba(0, 240, 255, 0.1),
        0 0 18px rgba(0, 240, 255, 0.35) !important;
}

/* Auth & top action buttons */
.btn-login,
.btn-register-desktop {
    border-radius: 8px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    font-size: 12px !important;
    padding: 8px 18px !important;
    transition: all 0.2s ease !important;
}
.btn-register-desktop {
    background: transparent !important;
    border: 1.5px solid rgba(var(--primary-blue-rgb), 0.4) !important;
    color: var(--ft-cyan) !important;
}
.btn-register-desktop:hover {
    background: rgba(var(--primary-blue-rgb), 0.08) !important;
    border-color: var(--ft-cyan) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(var(--primary-blue-rgb), 0.2) !important;
    transform: translateY(-1.5px) !important;
}
.btn-login {
    background: linear-gradient(135deg, var(--ft-cyan) 0%, var(--ft-violet) 100%) !important;
    border: none !important;
    color: #03040c !important;
    box-shadow: 0 4px 14px rgba(var(--primary-blue-rgb), 0.25) !important;
}
.btn-login:hover {
    box-shadow: 0 6px 20px rgba(var(--primary-blue-rgb), 0.4) !important;
    transform: translateY(-1.5px) !important;
}

/* ════════════════════════════════════════════════════════
   8 · NAV — "Tüm Kategoriler" + nav links
═══════════════════════════════════════════════════════════ */
.btn-categories {
    background: transparent !important;
    color: var(--text-color) !important;
    border: 1.5px solid rgba(var(--primary-blue-rgb), 0.35) !important;
    border-radius: 10px !important;
    padding: 8px 16px !important;
    font-weight: 600 !important;
    text-transform: none !important;
    letter-spacing: 0.01em !important;
    font-size: 13px !important;
    box-shadow: none !important;
    transition: border-color .2s, background .2s, color .2s !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
}
.btn-categories:hover {
    background: rgba(var(--primary-blue-rgb), 0.08) !important;
    border-color: rgba(var(--primary-blue-rgb), 0.65) !important;
    color: var(--primary-blue) !important;
    transform: none !important;
    box-shadow: none !important;
}
[data-theme="light"] .btn-categories {
    color: #1e293b !important;
    border-color: rgba(var(--primary-blue-rgb), 0.30) !important;
}
[data-theme="light"] .btn-categories:hover {
    color: var(--primary-blue) !important;
    background: rgba(var(--primary-blue-rgb), 0.06) !important;
    border-color: var(--primary-blue) !important;
}

.nav-item-modern {
    color: var(--nav-item-color, rgba(154, 163, 191, 0.85)) !important;
    background: var(--card-bg) !important;
    border: 1px solid var(--nav-item-color, rgba(154, 163, 191, 0.2)) !important;
    border-radius: 8px !important;
    padding: 8px 16px !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em !important;
    position: relative !important;
    transition: all .3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04) !important;
}
.nav-item-modern::after {
    display: none !important;
}
/* Nav linkleri arasına minimum boşluk */
.nav-links { gap: 12px !important; }
.nav-item-modern:hover,
.nav-item-modern.active {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08) !important;
    border-width: 1px !important;
    filter: brightness(1.1) !important;
}
.nav-icon-modern {
    width: 18px !important;
    height: 18px !important;
    opacity: 1 !important;
    filter: none !important;
    object-fit: contain !important;
}
.nav-item-modern:hover .nav-icon-modern { opacity: 1 !important; }

/* ════════════════════════════════════════════════════════
   9 · SECTION TITLES — Orbitron, gradient text
═══════════════════════════════════════════════════════════ */
.section-title {
    font-size: 22px !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    background: linear-gradient(120deg,
        var(--ft-cyan) 0%, var(--ft-violet) 50%, var(--ft-pink) 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}
.section-title::before {
    background: linear-gradient(180deg, var(--ft-cyan), var(--ft-violet)) !important;
    width: 4px !important;
    border-radius: 6px !important;
    box-shadow: 0 0 8px rgba(0, 240, 255, 0.6) !important;
    -webkit-text-fill-color: initial !important;
}

.view-all-link {
    background: rgba(0, 240, 255, 0.05) !important;
    border: 1px solid rgba(0, 240, 255, 0.28) !important;
    color: var(--ft-cyan) !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    font-size: 12px !important;
}
.view-all-link:hover {
    background: linear-gradient(135deg, var(--ft-cyan), var(--ft-violet)) !important;
    border-color: transparent !important;
    color: #03040c !important;
    box-shadow: 0 0 20px rgba(0, 240, 255, 0.55) !important;
}
.btn-text {
    color: var(--ft-cyan) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
}
.btn-text:hover {
    background: linear-gradient(135deg, var(--ft-cyan), var(--ft-violet)) !important;
    color: #03040c !important;
    box-shadow: 0 0 16px rgba(0, 240, 255, 0.4) !important;
}

/* ════════════════════════════════════════════════════════
   10 · BUTTONS — slider, primary, generic
═══════════════════════════════════════════════════════════ */
.slider-action-btn,
.btn-primary {
    background: linear-gradient(135deg, var(--ft-cyan) 0%, var(--ft-violet) 100%) !important;
    color: #03040c !important;
    border: none !important;
    border-radius: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    box-shadow:
        0 0 24px rgba(0, 240, 255, 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
    transition: all .22s !important;
}
.slider-action-btn:hover,
.btn-primary:hover {
    transform: translateY(-2px) !important;
    box-shadow:
        0 0 32px rgba(0, 240, 255, 0.75),
        0 0 64px rgba(176, 38, 255, 0.4) !important;
}

/* ════════════════════════════════════════════════════════
   11 · PRODUCT CARDS — solid card, neon edge
   PERF: backdrop-filter kaldırıldı (her kart için ayrı GPU katmanı)
═══════════════════════════════════════════════════════════ */
.product-card-modern {
    background: #0b0f24 !important;
    border: 1px solid rgba(0, 240, 255, 0.16) !important;
    border-radius: 12px !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.04),
        0 1px 0 rgba(0, 0, 0, 0.4) !important;
    transition: transform .25s ease, border-color .25s, box-shadow .25s !important;
    position: relative !important;
    overflow: hidden !important;
    transform: translateZ(0) !important;
}
/* Üst kart highlight çizgisi */
.product-card-modern::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important; left: 0 !important; right: 0 !important;
    height: 1px !important;
    background: linear-gradient(90deg,
        transparent, rgba(0, 240, 255, 0.5), transparent) !important;
    opacity: 0 !important;
    transition: opacity .25s !important;
    z-index: 2 !important;
}
.product-card-modern:hover {
    transform: translateY(-6px) !important;
    border-color: var(--ft-cyan) !important;
    box-shadow:
        0 0 0 1px rgba(0, 240, 255, 0.4),
        0 0 32px rgba(0, 240, 255, 0.35),
        0 24px 60px rgba(0, 0, 0, 0.65) !important;
}
.product-card-modern:hover::before { opacity: 1 !important; }

.product-image-area {
    background: linear-gradient(155deg, #0a0e22 0%, #11163a 100%) !important;
}
.product-info-area {
    background: rgba(7, 10, 24, 0.7) !important;
    border-top: 1px solid rgba(0, 240, 255, 0.1) !important;
}

/* ════════════════════════════════════════════════════════
   12 · PRICE — gradient terminal-style numerals
═══════════════════════════════════════════════════════════ */
.current-price-v2,
.currency-v2 {
    background: linear-gradient(135deg, var(--ft-cyan) 0%, var(--ft-violet) 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    font-weight: 800 !important;
    font-family: 'Orbitron', sans-serif !important;
    letter-spacing: 0.02em !important;
}
.discount-badge-v2 {
    background: linear-gradient(135deg, var(--ft-pink) 0%, var(--ft-violet) 100%) !important;
    color: var(--buy-text) !important;
    border-radius: 6px !important;
    font-family: 'Orbitron', sans-serif !important;
    font-weight: 700 !important;
    box-shadow: 0 0 14px rgba(var(--buy-button-rgb), 0.5) !important;
}

/* "Satın Al" buton */
.btn-buy-modern,
.btn-login-mobile {
    background: linear-gradient(135deg, var(--ft-cyan) 0%, var(--ft-violet) 100%) !important;
    color: #03040c !important;
    border: none !important;
    border-radius: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    font-size: 13px !important;
    box-shadow:
        0 0 18px rgba(0, 240, 255, 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
}
.btn-buy-modern:hover {
    transform: translateY(-2px) !important;
    box-shadow:
        0 0 28px rgba(0, 240, 255, 0.7),
        0 0 56px rgba(176, 38, 255, 0.4) !important;
}

/* ════════════════════════════════════════════════════════
   13 · CATEGORY / TAB / SHOWCASE
   (Neon stiller devre dışı — kurumsal stil dosya sonunda)
═══════════════════════════════════════════════════════════ */
.cat-tab-btn {
    background: rgba(0, 240, 255, 0.04) !important;
    border: 1px solid rgba(0, 240, 255, 0.2) !important;
    color: var(--ft-text-dim) !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    transition: all .2s !important;
}
.cat-tab-btn:hover {
    color: var(--ft-cyan) !important;
    border-color: rgba(0, 240, 255, 0.5) !important;
    background: rgba(0, 240, 255, 0.08) !important;
    box-shadow: 0 0 14px rgba(0, 240, 255, 0.25) !important;
}
.cat-tab-btn.active {
    background: linear-gradient(135deg, var(--ft-cyan), var(--ft-violet)) !important;
    border-color: transparent !important;
    color: var(--primary-text) !important;
    box-shadow: 0 0 20px rgba(0, 240, 255, 0.5) !important;
}

.category-item-card {
    /* PERF: backdrop-filter kaldırıldı */
    background: #0b0f24 !important;
    border: 1px solid rgba(0, 240, 255, 0.15) !important;
    border-radius: 12px !important;
    transition: transform .25s, border-color .25s, box-shadow .25s !important;
}
.category-item-card:hover {
    border-color: var(--ft-cyan) !important;
    transform: translateY(-4px) !important;
    box-shadow:
        0 0 0 1px rgba(0, 240, 255, 0.4),
        0 0 28px rgba(0, 240, 255, 0.3),
        0 16px 48px rgba(0, 0, 0, 0.5) !important;
}
.item-card-footer {
    background: rgba(7, 10, 24, 0.85) !important;
    border-top: 1px solid rgba(0, 240, 255, 0.1) !important;
}
.item-card-title {
    color: var(--ft-text) !important;
    font-family: 'Rajdhani', sans-serif !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em !important;
}

/* Vitrin kategorileri — grid kart görünümü */
.showcase-cards-row {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)) !important;
    gap: 12px !important;
    flex-direction: unset !important;
}

.showcase-pill-card {
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 20px 14px !important;
    gap: 10px !important;
    background: var(--card-bg) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 16px !important;
    color: var(--ft-text) !important;
    transform: none !important;
    transition: transform .18s, box-shadow .18s, border-color .18s !important;
}
.showcase-pill-card:hover {
    border-color: rgba(var(--primary-blue-rgb), 0.45) !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.15) !important;
    transform: translateY(-3px) !important;
}
.showcase-pill-card::before {
    display: none !important;
}

.showcase-pill-icon {
    width: 52px !important;
    height: 52px !important;
    border-radius: 14px !important;
    flex-shrink: 0 !important;
}
.showcase-pill-info {
    flex-direction: column !important;
    align-items: center !important;
    gap: 6px !important;
}
.showcase-pill-name {
    color: var(--text-color) !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    white-space: normal !important;
    text-align: center !important;
}
.showcase-pill-meta {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 4px !important;
}
.showcase-pill-arrow {
    display: none !important;
}
.showcase-pill-count {
    font-size: 11px !important;
    opacity: 0.6 !important;
}

/* Light mode */
[data-theme="light"] .showcase-pill-card {
    background: #ffffff !important;
    border-color: rgba(0,0,0,0.08) !important;
}
[data-theme="light"] .showcase-pill-card:hover {
    border-color: rgba(var(--primary-blue-rgb), 0.35) !important;
    box-shadow: 0 4px 16px rgba(0,0,0,0.08) !important;
}

/* Mobil */
@media (max-width: 600px) {
    .showcase-cards-row {
        grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)) !important;
        gap: 8px !important;
    }
    .showcase-pill-card {
        padding: 14px 10px !important;
    }
    .showcase-pill-icon {
        width: 40px !important;
        height: 40px !important;
    }
    .showcase-pill-name {
        font-size: 11px !important;
    }
}

/* ════════════════════════════════════════════════════════
   14 · INPUTS & FORMS — minimal neon line
═══════════════════════════════════════════════════════════ */
input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not(.search-input):not(.cat-tab-btn),
textarea,
select {
    background: rgba(7, 10, 24, 0.6) !important;
    border: 1px solid rgba(0, 240, 255, 0.18) !important;
    color: var(--ft-text) !important;
    border-radius: 8px !important;
    transition: border-color .2s, box-shadow .2s, background .2s !important;
}
input:focus,
textarea:focus,
select:focus {
    outline: none !important;
    border-color: var(--ft-cyan) !important;
    background: rgba(0, 240, 255, 0.04) !important;
    box-shadow:
        0 0 0 3px rgba(0, 240, 255, 0.15),
        0 0 20px rgba(0, 240, 255, 0.25) !important;
}
label {
    color: var(--ft-text-dim) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    font-size: 11px !important;
    font-weight: 600 !important;
}

/* ════════════════════════════════════════════════════════
   15 · TRUST BADGES
═══════════════════════════════════════════════════════════ */
.trust-badge-item {
    background: rgba(0, 240, 255, 0.04) !important;
    border: 1px solid rgba(0, 240, 255, 0.16) !important;
    border-radius: 10px !important;
    transition: all .2s !important;
}
.trust-badge-item:hover {
    border-color: var(--ft-cyan) !important;
    box-shadow: 0 0 18px rgba(0, 240, 255, 0.25) !important;
}
.trust-badge-item i,
.trust-badge-item svg {
    color: var(--ft-cyan) !important;
    filter: drop-shadow(0 0 6px rgba(0, 240, 255, 0.5)) !important;
}

/* ════════════════════════════════════════════════════════
   16 · FOOTER — derin uzay siyahı + neon halo
═══════════════════════════════════════════════════════════ */
.main-footer {
    position: relative !important;
    overflow: hidden !important;
    background: #020308 !important;
    color: var(--ft-text-dim) !important;
}
.main-footer::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important; left: 0 !important; right: 0 !important;
    height: 2px !important;
    background: linear-gradient(90deg,
        transparent, var(--ft-violet) 25%, var(--ft-cyan) 50%,
        var(--ft-pink) 75%, transparent) !important;
    background-size: 200% 100% !important;
    animation: ft-headerline 7s linear infinite !important;
    box-shadow: 0 0 12px rgba(0, 240, 255, 0.5) !important;
}
.main-footer::after {
    content: '' !important;
    position: absolute !important;
    top: -120px !important; left: 50% !important;
    transform: translateX(-50%) !important;
    width: 900px !important; height: 320px !important;
    background: radial-gradient(ellipse, rgba(0, 240, 255, 0.12) 0%, transparent 65%) !important;
    pointer-events: none !important;
    z-index: 0 !important;
}
.main-footer,
.main-footer p,
.main-footer a,
.main-footer span,
.main-footer li,
.footer-tagline,
.footer-links li a {
    color: rgba(154, 163, 191, 0.7) !important;
}
.main-footer a:hover,
.footer-links li a:hover {
    color: var(--ft-cyan) !important;
    text-shadow: 0 0 8px rgba(0, 240, 255, 0.5) !important;
}
.footer-title {
    color: var(--ft-text) !important;
    font-family: 'Orbitron', sans-serif !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    font-size: 13px !important;
}
.footer-title::before {
    background: linear-gradient(180deg, var(--ft-cyan), var(--ft-violet)) !important;
    box-shadow: 0 0 8px rgba(0, 240, 255, 0.6) !important;
}
.footer-social-minimal a {
    background: rgba(0, 240, 255, 0.05) !important;
    border: 1px solid rgba(0, 240, 255, 0.22) !important;
    color: var(--ft-cyan) !important;
    transition: all .22s !important;
}
.footer-social-minimal a:hover {
    background: linear-gradient(135deg, var(--ft-cyan), var(--ft-violet)) !important;
    border-color: transparent !important;
    color: #03040c !important;
    box-shadow: 0 0 22px rgba(0, 240, 255, 0.55) !important;
    transform: translateY(-3px) !important;
}
.footer-bottom {
    border-top: 1px solid rgba(0, 240, 255, 0.1) !important;
    color: rgba(154, 163, 191, 0.5) !important;
}

/* ════════════════════════════════════════════════════════
   17 · SCROLLBAR — neon
═══════════════════════════════════════════════════════════ */
::-webkit-scrollbar { width: 10px !important; height: 10px !important; }
::-webkit-scrollbar-track { background: var(--ft-void) !important; }
::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--ft-cyan), var(--ft-violet)) !important;
    border-radius: 99px !important;
    box-shadow: 0 0 8px rgba(0, 240, 255, 0.4) !important;
}
::-webkit-scrollbar-thumb:hover {
    box-shadow: 0 0 14px rgba(0, 240, 255, 0.7) !important;
}
* { scrollbar-color: var(--ft-cyan) transparent !important; }

/* ════════════════════════════════════════════════════════
   18 · BADGES & MISC
═══════════════════════════════════════════════════════════ */
/* Sadece metin boyutu — konteyner default haliyle kalsın (26px height) */
.badge-fixed-text,
.badge-item {
    font-size: 12px !important;
    letter-spacing: 0.05em !important;
}

/* Subtle text selection */
::selection {
    background: rgba(0, 240, 255, 0.3) !important;
    color: #fff !important;
}

/* ════════════════════════════════════════════════════════
   19 · TRANSITIONS — global akıcı geçiş
═══════════════════════════════════════════════════════════ */
a, button {
    transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* ════════════════════════════════════════════════════════
   20 · PERFORMANCE OPTIMIZATIONS
═══════════════════════════════════════════════════════════ */
/* GPU katmanı — hover'da transform kullanan elementler */
.product-card-modern,
.category-item-card,
.btn-buy-modern,
.btn-primary,
.slider-action-btn,
.btn-categories,
.showcase-pill-card {
    will-change: transform;
    transform: translateZ(0);
    backface-visibility: hidden;
}

/* Animasyonları yavaşlatarak CPU yükünü düşür */
.top-announcement {
    animation: none !important;
}
.main-header::before,
.main-footer::before {
    animation-duration: 12s !important;       /* 5-7s → 12s */
}

/* prefers-reduced-motion — kullanıcı animasyon istemiyorsa tümünü kapat */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    body::before,
    .main-header::before,
    .main-footer::before,
    .top-announcement {
        animation: none !important;
        background-size: 100% 100% !important;
    }
}

/* Off-screen kartları render etme — scroll perf büyük artış (Chromium/Safari 16+) */
@supports (content-visibility: auto) {
    .product-card-modern,
    .category-item-card,
    .review-item-card {
        content-visibility: auto;
        contain-intrinsic-size: 1px 280px;
    }
}


/* ╔══════════════════════════════════════════════════════════════╗
   ║                                                              ║
   ║   ░▒▓█  LIGHT MODE OVERRIDES — HIGH-TECH LAB  █▓▒░           ║
   ║                                                              ║
   ║   Dark mode kuralları yukarıda — buradan itibaren            ║
   ║   tüm kurallar [data-theme="light"] ile kapsamlıdır.         ║
   ║   Karanlık moda dokunulmaz.                                  ║
   ║                                                              ║
   ╚══════════════════════════════════════════════════════════════╝ */

/* ────────────────────────────────────────────────────────
   L1 · BODY — açık platinum + ince ızgara
   PERF: Halolar body::before pseudo'da, attachment scroll
──────────────────────────────────────────────────────── */
[data-theme="light"] html,
[data-theme="light"] body {
    background-color: var(--ft-bg-light) !important;
    color: var(--ft-ink-1) !important;
}
[data-theme="light"] body {
    /* Sade beyaz — grid çizgileri ve halo efektleri kaldırıldı */
    background-image: none !important;
    background-size: unset !important;
    background-attachment: scroll !important;
}
[data-theme="light"] body::before {
    background-image: none !important;
}

/* ────────────────────────────────────────────────────────
   L2 · ANNOUNCEMENT — canlı neon gradient, parlak beyaz metin
──────────────────────────────────────────────────────── */
[data-theme="light"] .top-announcement {
    background: var(--primary-blue) !important;
    border-bottom: 1.5px solid rgba(0, 0, 0, 0.05) !important;
    animation: none !important;
}
[data-theme="light"] .top-announcement::before {
    background: #f1f5f9 !important;
    border-right: 2.5px solid var(--primary-orange) !important;
    color: #0f172a !important;
    box-shadow: 4px 0 10px rgba(0, 0, 0, 0.04) !important;
}
[data-theme="light"] .top-announcement::after {
    background-color: var(--primary-orange) !important;
    box-shadow: 0 0 8px var(--primary-orange) !important;
    animation: announcement-dot-pulse-light 1.8s ease-in-out infinite !important;
}
[data-theme="light"] .announcement-marquee span,
[data-theme="light"] .announcement-text {
    color: inherit !important;
    text-shadow: none !important;
}

/* ────────────────────────────────────────────────────────
   L3 · HEADER — beyaz frosted glass, soft mavi gölge
──────────────────────────────────────────────────────── */
[data-theme="light"] .main-header {
    /* PERF: blur 28→14, saturate kaldırıldı, opaklık arttı */
    background: rgba(255, 255, 255, 0.88) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    box-shadow:
        0 1px 0 rgba(15, 35, 95, 0.06),
        0 8px 24px rgba(15, 35, 95, 0.05) !important;
}
[data-theme="light"] .main-header::before {
    background: linear-gradient(90deg,
        transparent 0%, var(--ft-violet-l) 18%, var(--ft-cyan-l) 50%,
        var(--ft-pink-l) 82%, transparent 100%) !important;
    background-size: 200% 100% !important;
    box-shadow: 0 0 8px rgba(2, 132, 196, 0.3) !important;
}
[data-theme="light"] .main-header::after {
    background: linear-gradient(90deg,
        transparent, rgba(2, 132, 196, 0.22) 35%,
        rgba(109, 40, 217, 0.18) 65%, transparent) !important;
}
[data-theme="light"] .header-nav {
    border-top: 1px solid rgba(15, 35, 95, 0.08) !important;
}

/* ────────────────────────────────────────────────────────
   L4 · LOGO — neon parıltı yerine doygun renk + soft glow
──────────────────────────────────────────────────────── */
[data-theme="light"] .logo,
[data-theme="light"] .mobile-logo {
    filter: drop-shadow(0 2px 8px rgba(2, 132, 196, 0.25)) !important;
}
[data-theme="light"] .logo:hover,
[data-theme="light"] .mobile-logo:hover {
    filter: drop-shadow(0 4px 16px rgba(2, 132, 196, 0.4)) !important;
}
[data-theme="light"] .logo img,
[data-theme="light"] .logo-img,
[data-theme="light"] .mobile-logo img {
    filter: brightness(0.15) sepia(1) hue-rotate(220deg) saturate(6) !important;
    transition: filter 0.3s ease !important;
}
[data-theme="light"] .logo img:hover,
[data-theme="light"] .logo-img:hover,
[data-theme="light"] .mobile-logo img:hover {
    filter: brightness(0.25) sepia(1) hue-rotate(220deg) saturate(7) !important;
}
[data-theme="light"] .logo-text-blue {
    color: var(--ft-cyan-l) !important;
    text-shadow: 0 0 12px rgba(2, 132, 196, 0.25) !important;
}
[data-theme="light"] .logo-text-orange {
    color: var(--ft-violet-l) !important;
    text-shadow: 0 0 12px rgba(109, 40, 217, 0.25) !important;
}

/* ────────────────────────────────────────────────────────
   L5 · SEARCH BOX — frosted beyaz, focus = soft mavi ring
──────────────────────────────────────────────────────── */
[data-theme="light"] .search-container {
    background: rgba(255, 255, 255, 0.85) !important;
    border: 1.5px solid var(--ft-border-l-2) !important;
    box-shadow: var(--ft-shadow-sm) !important;
}
[data-theme="light"] .search-input { color: var(--ft-ink-1) !important; }
[data-theme="light"] .search-input::placeholder {
    color: var(--ft-ink-4) !important;
}
[data-theme="light"] .search-btn { color: var(--ft-cyan-l) !important; }
[data-theme="light"] .search-container:focus-within {
    border-color: var(--ft-cyan-l) !important;
    background: #ffffff !important;
    box-shadow:
        0 0 0 4px rgba(2, 132, 196, 0.12),
        0 4px 16px rgba(2, 132, 196, 0.18) !important;
}

/* ────────────────────────────────────────────────────────
   L6 · ICON BUTTONS — açık frosted, hover'da soft cyan
──────────────────────────────────────────────────────── */
[data-theme="light"] .icon-btn {
    color: var(--ft-cyan-l) !important;
    background: rgba(255, 255, 255, 0.7) !important;
    border: 1px solid var(--ft-border-l-2) !important;
    box-shadow: var(--ft-shadow-sm) !important;
}
[data-theme="light"] .icon-btn:hover {
    color: var(--ft-cyan-l) !important;
    background: #ffffff !important;
    border-color: var(--ft-cyan-l) !important;
    box-shadow:
        0 0 0 3px rgba(2, 132, 196, 0.10),
        0 6px 16px rgba(2, 132, 196, 0.18) !important;
}

/* ────────────────────────────────────────────────────────
   L7 · AUTH BUTTONS
──────────────────────────────────────────────────────── */
[data-theme="light"] .btn-register-desktop {
    background: rgba(255, 255, 255, 0.85) !important;
    border: 1px solid var(--ft-cyan-l) !important;
    color: var(--ft-cyan-l) !important;
    box-shadow: var(--ft-shadow-sm) !important;
}
[data-theme="light"] .btn-register-desktop:hover {
    background: var(--ft-cyan-l) !important;
    color: #ffffff !important;
    box-shadow: var(--ft-shadow-cyan) !important;
}
[data-theme="light"] .btn-login {
    background: linear-gradient(135deg, var(--ft-cyan-l) 0%, var(--ft-violet-l) 100%) !important;
    color: #ffffff !important;
    box-shadow: var(--ft-shadow-cyan) !important;
}
[data-theme="light"] .btn-login:hover {
    box-shadow:
        0 6px 20px rgba(2, 132, 196, 0.32),
        0 16px 40px rgba(109, 40, 217, 0.22) !important;
    transform: translateY(-1px) !important;
}

/* ────────────────────────────────────────────────────────
   L8 · NAV — "Tüm Kategoriler" + nav linkleri
──────────────────────────────────────────────────────── */
/* btn-categories light overrides — aşağıdaki blokta tanımlı */

[data-theme="light"] .nav-item-modern {
    color: var(--ft-ink-3) !important;
}
[data-theme="light"] .nav-item-modern::after {
    background: linear-gradient(90deg, var(--ft-cyan-l), var(--ft-violet-l)) !important;
    box-shadow: 0 0 4px rgba(2, 132, 196, 0.25) !important;
}
[data-theme="light"] .nav-item-modern:hover,
[data-theme="light"] .nav-item-modern.active {
    color: var(--ft-cyan-l) !important;
    background: rgba(2, 132, 196, 0.07) !important;
}
[data-theme="light"] .nav-icon-modern {
    filter: drop-shadow(0 1px 3px rgba(2, 132, 196, 0.25)) !important;
    opacity: 0.9 !important;
}

/* ────────────────────────────────────────────────────────
   L9 · SECTION TITLES — doygun gradient, okunabilir
──────────────────────────────────────────────────────── */
[data-theme="light"] .section-title {
    background: linear-gradient(120deg,
        var(--ft-cyan-l) 0%, var(--ft-violet-l) 55%, var(--ft-pink-l) 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}
[data-theme="light"] .section-title::before {
    background: linear-gradient(180deg, var(--ft-cyan-l), var(--ft-violet-l)) !important;
    box-shadow: 0 0 6px rgba(2, 132, 196, 0.35) !important;
}
[data-theme="light"] .categories-header h1,
[data-theme="light"] .cat-section-header h2 {
    color: var(--ft-ink-1) !important;
}

[data-theme="light"] .view-all-link {
    background: rgba(255, 255, 255, 0.8) !important;
    border: 1px solid var(--ft-border-l-2) !important;
    color: var(--ft-cyan-l) !important;
    box-shadow: var(--ft-shadow-sm) !important;
}
[data-theme="light"] .view-all-link:hover {
    background: linear-gradient(135deg, var(--ft-cyan-l), var(--ft-violet-l)) !important;
    color: #ffffff !important;
    border-color: transparent !important;
    box-shadow: var(--ft-shadow-cyan) !important;
}
[data-theme="light"] .btn-text { color: var(--ft-cyan-l) !important; }
[data-theme="light"] .btn-text:hover {
    background: linear-gradient(135deg, var(--ft-cyan-l), var(--ft-violet-l)) !important;
    color: #ffffff !important;
    box-shadow: var(--ft-shadow-cyan) !important;
}

/* ────────────────────────────────────────────────────────
   L10 · PRIMARY / SLIDER BUTONLAR
──────────────────────────────────────────────────────── */
[data-theme="light"] .slider-action-btn,
[data-theme="light"] .btn-primary {
    background: linear-gradient(135deg, var(--ft-cyan-l) 0%, var(--ft-violet-l) 100%) !important;
    color: #ffffff !important;
    box-shadow:
        0 8px 22px rgba(var(--primary-blue-rgb), 0.30),
        inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
}
[data-theme="light"] .slider-action-btn:hover,
[data-theme="light"] .btn-primary:hover {
    transform: translateY(-2px) !important;
    box-shadow:
        0 12px 32px rgba(var(--primary-blue-rgb), 0.40),
        0 18px 48px rgba(var(--primary-orange-rgb), 0.22) !important;
}

/* ────────────────────────────────────────────────────────
   L11 · PRODUCT CARDS — frosted beyaz cam
──────────────────────────────────────────────────────── */
[data-theme="light"] .product-card-modern {
    /* PERF: opak beyaz, backdrop-filter kaldırıldı */
    background: #ffffff !important;
    border: 1px solid var(--ft-border-l) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.6),
        var(--ft-shadow-sm) !important;
}
[data-theme="light"] .product-card-modern::before {
    background: linear-gradient(90deg,
        transparent, rgba(0, 240, 255, 0.5), transparent) !important;
}
[data-theme="light"] .product-card-modern:hover {
    transform: translateY(-6px) !important;
    border-color: var(--ft-cyan) !important;
    box-shadow:
        0 0 0 1px rgba(0, 240, 255, 0.4),
        0 0 32px rgba(0, 240, 255, 0.35),
        0 24px 60px rgba(15, 35, 95, 0.25) !important;
}
[data-theme="light"] .product-image-area {
    background: linear-gradient(155deg, #f6f9fd 0%, #e7edf5 100%) !important;
}
[data-theme="light"] .product-info-area {
    background: rgba(255, 255, 255, 0.85) !important;
    border-top: 1px solid var(--ft-border-l) !important;
}

/* ────────────────────────────────────────────────────────
   L12 · PRICE & DISCOUNT
──────────────────────────────────────────────────────── */
[data-theme="light"] .current-price-v2,
[data-theme="light"] .currency-v2 {
    background: linear-gradient(135deg, var(--ft-cyan-l) 0%, var(--ft-violet-l) 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}
[data-theme="light"] .discount-badge-v2 {
    background: linear-gradient(135deg, var(--ft-pink-l) 0%, var(--ft-violet-l) 100%) !important;
    color: var(--buy-text) !important;
    box-shadow: 0 4px 12px rgba(var(--buy-button-rgb), 0.25) !important;
}

/* "Satın Al" buton */
[data-theme="light"] .btn-buy-modern,
[data-theme="light"] .btn-login-mobile {
    background: linear-gradient(135deg, var(--ft-cyan-l) 0%, var(--ft-violet-l) 100%) !important;
    color: var(--primary-text) !important;
    box-shadow:
        0 6px 16px rgba(var(--primary-blue-rgb), 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
}
[data-theme="light"] .btn-buy-modern:hover {
    transform: translateY(-2px) !important;
    box-shadow:
        0 10px 24px rgba(2, 132, 196, 0.4),
        0 18px 44px rgba(109, 40, 217, 0.22) !important;
}

/* ────────────────────────────────────────────────────────
   L13 · CATEGORY / TAB / SHOWCASE
   (showcase-tab neon stiller devre dışı — kurumsal stil dosya sonunda)
──────────────────────────────────────────────────────── */
[data-theme="light"] .cat-tab-btn {
    background: rgba(255, 255, 255, 0.7) !important;
    border: 1px solid var(--ft-border-l-2) !important;
    color: var(--ft-ink-3) !important;
    box-shadow: var(--ft-shadow-sm) !important;
}
[data-theme="light"] .cat-tab-btn:hover {
    color: var(--ft-cyan-l) !important;
    border-color: var(--ft-cyan-l) !important;
    background: #ffffff !important;
    box-shadow:
        0 0 0 3px rgba(var(--primary-blue-rgb), 0.08),
        var(--ft-shadow-sm) !important;
}
[data-theme="light"] .cat-tab-btn.active {
    background: linear-gradient(135deg, var(--ft-cyan-l), var(--ft-violet-l)) !important;
    border-color: transparent !important;
    color: var(--primary-text) !important;
    box-shadow: var(--ft-shadow-cyan) !important;
}

[data-theme="light"] .category-item-card {
    background: #ffffff !important;          /* tam opak — görseller net çıksın */
    backdrop-filter: none !important;        /* blur kaldırıldı */
    -webkit-backdrop-filter: none !important;
    border: 1px solid var(--ft-border-l) !important;
    box-shadow: var(--ft-shadow-sm) !important;
    overflow: hidden !important;
}
[data-theme="light"] .category-item-card:hover {
    border-color: var(--ft-cyan-l) !important;
    transform: translateY(-4px) !important;
    box-shadow:
        0 0 0 1px rgba(2, 132, 196, 0.18),
        0 10px 24px rgba(2, 132, 196, 0.14),
        0 22px 48px rgba(15, 35, 95, 0.10) !important;
}
/* Görsel alanı — beyaz zemin, sıfır müdahale, %100 net render */
html[data-theme="light"] .category-item-card .item-card-image-area,
html[data-theme="light"] .item-card-image-area {
    background: #ffffff !important;
    background-image: none !important;     /* default radial-gradient'i sil */
}
html[data-theme="light"] .item-card-char-img,
html[data-theme="light"] .category-item-card .item-card-char-img,
html[data-theme="light"] .item-card-image-area img {
    opacity: 1 !important;
    filter: none !important;
    mix-blend-mode: normal !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}
html[data-theme="light"] .category-item-card:hover .item-card-char-img,
html[data-theme="light"] .category-item-card:hover .item-card-image-area img {
    transform: scale(1.04) !important;
    transition: transform .35s cubic-bezier(.16,1,.3,1) !important;
}
[data-theme="light"] .item-card-footer {
    background: #ffffff !important;
    border-top: 1px solid var(--ft-border-l) !important;
}
[data-theme="light"] .item-card-title {
    color: var(--ft-ink-1) !important;
}

[data-theme="light"] .showcase-pill-card {
    background: #ffffff !important;
    border: 1px solid var(--ft-border-l-2) !important;
    color: var(--ft-ink-1) !important;
    box-shadow: var(--ft-shadow-sm) !important;
}
[data-theme="light"] .showcase-pill-card:hover {
    border-color: var(--ft-cyan-l) !important;
    box-shadow:
        0 6px 18px rgba(2, 132, 196, 0.18),
        var(--ft-shadow-md) !important;
}
[data-theme="light"] .showcase-pill-name {
    color: var(--ft-ink-1) !important;
}
[data-theme="light"] .showcase-section-label,
[data-theme="light"] .showcase-pill-count {
    color: var(--ft-ink-3) !important;
}

/* ────────────────────────────────────────────────────────
   L14 · INPUTS / FORMS
──────────────────────────────────────────────────────── */
[data-theme="light"] input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not(.search-input):not(.cat-tab-btn),
[data-theme="light"] textarea,
[data-theme="light"] select {
    background: #ffffff !important;
    border: 1px solid var(--ft-border-l-2) !important;
    color: var(--ft-ink-1) !important;
    box-shadow: var(--ft-shadow-sm) !important;
}
[data-theme="light"] input:focus,
[data-theme="light"] textarea:focus,
[data-theme="light"] select:focus {
    border-color: var(--ft-cyan-l) !important;
    background: #ffffff !important;
    box-shadow:
        0 0 0 4px rgba(2, 132, 196, 0.12),
        0 2px 10px rgba(2, 132, 196, 0.12) !important;
}
[data-theme="light"] label { color: var(--ft-ink-3) !important; }

/* ────────────────────────────────────────────────────────
   L15 · TRUST BADGES
──────────────────────────────────────────────────────── */
[data-theme="light"] .trust-badge-item {
    background: rgba(255, 255, 255, 0.78) !important;
    border: 1px solid var(--ft-border-l-2) !important;
    box-shadow: var(--ft-shadow-sm) !important;
    color: var(--ft-ink-2) !important;
}
[data-theme="light"] .trust-badge-item:hover {
    border-color: var(--ft-cyan-l) !important;
    box-shadow:
        0 0 0 3px rgba(2, 132, 196, 0.08),
        var(--ft-shadow-md) !important;
}
[data-theme="light"] .trust-badge-item i,
[data-theme="light"] .trust-badge-item svg {
    color: var(--ft-cyan-l) !important;
    filter: drop-shadow(0 1px 3px rgba(2, 132, 196, 0.3)) !important;
}

/* ────────────────────────────────────────────────────────
   L16 · FOOTER — koyu kalır (kontrast için "bilim üssü altı")
──────────────────────────────────────────────────────── */
/* Footer'ı bilinçli olarak koyu bırakıyoruz — sayfa zemini açıkken
   alt kısımda derin teknolojik bir taban hissi verir. Bu, Apple/SpaceX
   stilinde light header → dark footer pattern'ine uyar. */
[data-theme="light"] .main-footer {
    background: #0b1226 !important;
    color: rgba(230, 237, 255, 0.7) !important;
}
[data-theme="light"] .main-footer::before {
    background: linear-gradient(90deg,
        transparent, var(--ft-violet-l) 25%, var(--ft-cyan-l) 50%,
        var(--ft-pink-l) 75%, transparent) !important;
    box-shadow: 0 0 12px rgba(2, 132, 196, 0.4) !important;
}
[data-theme="light"] .main-footer::after {
    background: radial-gradient(ellipse,
        rgba(2, 132, 196, 0.18) 0%, transparent 65%) !important;
}
[data-theme="light"] .main-footer,
[data-theme="light"] .main-footer p,
[data-theme="light"] .main-footer a,
[data-theme="light"] .main-footer span,
[data-theme="light"] .main-footer li,
[data-theme="light"] .footer-tagline,
[data-theme="light"] .footer-links li a {
    color: rgba(230, 237, 255, 0.7) !important;
}
[data-theme="light"] .main-footer a:hover,
[data-theme="light"] .footer-links li a:hover {
    color: var(--ft-cyan-l-soft) !important;
}
[data-theme="light"] .footer-title { color: #ffffff !important; }
[data-theme="light"] .footer-social-minimal a {
    background: rgba(2, 132, 196, 0.10) !important;
    border-color: rgba(2, 132, 196, 0.35) !important;
    color: var(--ft-cyan-l-soft) !important;
}
[data-theme="light"] .footer-social-minimal a:hover {
    background: linear-gradient(135deg, var(--ft-cyan-l), var(--ft-violet-l)) !important;
    color: var(--primary-text) !important;
    border-color: transparent !important;
}
[data-theme="light"] .footer-bottom {
    border-top: 1px solid rgba(2, 132, 196, 0.15) !important;
    color: rgba(154, 163, 191, 0.6) !important;
}

/* ────────────────────────────────────────────────────────
   L17 · SCROLLBAR — soft mavi
──────────────────────────────────────────────────────── */
[data-theme="light"] ::-webkit-scrollbar-track {
    background: #e7ecf3 !important;
}
[data-theme="light"] ::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--ft-cyan-l), var(--ft-violet-l)) !important;
    box-shadow: 0 2px 6px rgba(2, 132, 196, 0.25) !important;
}
[data-theme="light"] ::-webkit-scrollbar-thumb:hover {
    box-shadow: 0 4px 12px rgba(2, 132, 196, 0.4) !important;
}
[data-theme="light"] * {
    scrollbar-color: var(--ft-cyan-l) transparent !important;
}

/* ────────────────────────────────────────────────────────
   L17b · CATEGORY HERO SIDEBAR — koyu overlay temizliği
   (kategori detay sayfasındaki sol büyük kart)
──────────────────────────────────────────────────────── */
html[data-theme="light"] .category-sidebar-card {
    background: #ffffff !important;
    border: 1px solid var(--ft-border-l) !important;
    box-shadow: var(--ft-shadow-md) !important;
    overflow: hidden !important;
}
html[data-theme="light"] .category-card-image-wrap {
    background: #ffffff !important;
}
html[data-theme="light"] .category-card-image-wrap img,
html[data-theme="dark"] .category-card-image-wrap img,
.category-card-image-wrap img {
    opacity: 1 !important;
    filter: none !important;
    -webkit-filter: none !important;
    mix-blend-mode: normal !important;
}
/* TÜM modlarda görseldeki overlay tamamen kaldırıldı */
.category-card-overlay,
html[data-theme="dark"] .category-card-overlay,
html[data-theme="light"] .category-card-overlay {
    background: transparent !important;
}
.category-card-title {
    text-shadow:
        0 1px 3px rgba(0,0,0,0.7),
        0 1px 1px rgba(0,0,0,0.6) !important;
}
html[data-theme="light"] .category-card-title {
    color: #ffffff !important;
    text-shadow:
        0 2px 4px rgba(0, 0, 0, 0.55),
        0 1px 2px rgba(0, 0, 0, 0.4) !important;
    font-family: 'Orbitron', sans-serif !important;
    font-weight: 800 !important;
    letter-spacing: 0.03em !important;
}
html[data-theme="light"] .category-card-info {
    background: #ffffff !important;
    color: var(--ft-ink-2) !important;
    border-top: 1px solid var(--ft-border-l) !important;
}
html[data-theme="light"] .category-card-info * {
    color: var(--ft-ink-2) !important;
}

/* ────────────────────────────────────────────────────────
   L17c · ÜRÜN DETAY SAYFASI — info kutuları görünür olsun
   (default CSS rgba(255,255,255,0.03) kullanıyor — light'ta görünmez)
──────────────────────────────────────────────────────── */
html[data-theme="light"] .m-service-item {
    background: #ffffff !important;
    border: 1px solid var(--ft-border-l-2) !important;
    box-shadow: var(--ft-shadow-sm) !important;
}
html[data-theme="light"] .m-service-item:hover {
    background: #ffffff !important;
    border-color: var(--ft-cyan-l) !important;
    box-shadow:
        0 0 0 3px rgba(2, 132, 196, 0.08),
        var(--ft-shadow-md) !important;
    transform: translateY(-3px) !important;
}
html[data-theme="light"] .m-service-icon {
    background: rgba(2, 132, 196, 0.08) !important;
    border: 1px solid rgba(2, 132, 196, 0.18) !important;
    color: var(--ft-cyan-l) !important;
}
html[data-theme="light"] .m-service-item:hover .m-service-icon {
    background: linear-gradient(135deg, var(--ft-cyan-l), var(--ft-violet-l)) !important;
    border-color: transparent !important;
    color: #ffffff !important;
}
html[data-theme="light"] .m-service-info span {
    color: var(--ft-ink-3) !important;
    opacity: 1 !important;
}
html[data-theme="light"] .m-service-info h6 {
    color: var(--ft-ink-1) !important;
}

/* "18 kişi bu ürünü inceliyor" bandı */
html[data-theme="light"] .live-watching-pill,
html[data-theme="light"] .live-viewers,
html[data-theme="light"] .product-info-header .badge-info {
    background: #ffffff !important;
    border: 1px solid var(--ft-border-l-2) !important;
    color: var(--ft-ink-2) !important;
    box-shadow: var(--ft-shadow-sm) !important;
}

/* Ürün başlığı */
html[data-theme="light"] .product-info-header h1 {
    color: var(--ft-ink-1) !important;
    font-family: 'Orbitron', sans-serif !important;
}

/* Fiyat / satın alma çubuğu */
html[data-theme="light"] .horizontal-action-bar,
html[data-theme="light"] .purchase-bar,
html[data-theme="light"] .product-bottom-bar,
html[data-theme="light"] .product-buy-bar {
    background: #ffffff !important;
    border: 1px solid var(--ft-border-l-2) !important;
    box-shadow: var(--ft-shadow-md) !important;
}

/* Tab başlıkları + içerikler */
html[data-theme="light"] .product-detail-tabs,
html[data-theme="light"] .detail-tab-content,
html[data-theme="light"] .product-detail-main,
html[data-theme="light"] .view-right-info {
    color: var(--ft-ink-1) !important;
}

/* Generic — herhangi bir koyu temalı içerik kart light'a düşmesin */
html[data-theme="light"] .similar-info,
html[data-theme="light"] .rev-user-details,
html[data-theme="light"] .review-user-info {
    color: var(--ft-ink-1) !important;
}

/* ────────────────────────────────────────────────────────
   L17d · YORUM / REVIEW ALANI
   (hem kategori hem ürün sayfası)
──────────────────────────────────────────────────────── */
/* Dış konteyner — kategori sayfası "Yorumlar" kartı */
html[data-theme="light"] .category-comments-section {
    background: #ffffff !important;
    border: 1px solid var(--ft-border-l-2) !important;
    box-shadow: var(--ft-shadow-md) !important;
    border-radius: 16px !important;
}
html[data-theme="light"] .comments-title {
    color: var(--ft-ink-1) !important;
    font-family: 'Orbitron', sans-serif !important;
    font-weight: 700 !important;
    border-bottom: 1px solid var(--ft-border-l) !important;
    padding-bottom: 14px !important;
}
html[data-theme="light"] .comments-title i {
    color: var(--ft-cyan-l) !important;
}
html[data-theme="light"] .comment-empty-msg {
    color: var(--ft-ink-3) !important;
}

/* Tabs (Ürün Hakkında / Yorumlar) */
html[data-theme="light"] .product-detail-tabs {
    background: #ffffff !important;
    border: 1px solid var(--ft-border-l-2) !important;
    border-radius: 16px !important;
    box-shadow: var(--ft-shadow-md) !important;
    overflow: hidden !important;
}
html[data-theme="light"] .tabs-header {
    background: #f6f9fd !important;
    border-bottom: 1px solid var(--ft-border-l) !important;
}
html[data-theme="light"] .tab-btn {
    background: transparent !important;
    color: var(--ft-ink-3) !important;
    border: none !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    font-size: 13px !important;
    padding: 14px 22px !important;
    position: relative !important;
    transition: color .2s !important;
}
html[data-theme="light"] .tab-btn:hover {
    color: var(--ft-cyan-l) !important;
}
html[data-theme="light"] .tab-btn.active {
    color: var(--ft-cyan-l) !important;
    background: #ffffff !important;
}
html[data-theme="light"] .tab-btn.active::after {
    content: '' !important;
    position: absolute !important;
    left: 14px !important;
    right: 14px !important;
    bottom: 0 !important;
    height: 2px !important;
    background: linear-gradient(90deg, var(--ft-cyan-l), var(--ft-violet-l)) !important;
    border-radius: 2px !important;
    box-shadow: 0 0 8px rgba(2, 132, 196, 0.4) !important;
}
html[data-theme="light"] .tabs-content,
html[data-theme="light"] .tab-pane {
    background: #ffffff !important;
    color: var(--ft-ink-1) !important;
    padding: 24px !important;
}
html[data-theme="light"] .rich-content,
html[data-theme="light"] .rich-content p,
html[data-theme="light"] .rich-content li {
    color: var(--ft-ink-2) !important;
}
html[data-theme="light"] .rich-content b,
html[data-theme="light"] .rich-content strong {
    color: var(--ft-ink-1) !important;
}

/* Yorum kartları */
html[data-theme="light"] .reviews-list-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
}
html[data-theme="light"] .review-item-card {
    background: #f6f9fd !important;
    border: 1px solid var(--ft-border-l-2) !important;
    border-radius: 12px !important;
    padding: 16px 18px !important;
    box-shadow: var(--ft-shadow-sm) !important;
}
html[data-theme="light"] .review-item-card:hover {
    border-color: var(--ft-cyan-l) !important;
    box-shadow:
        0 0 0 2px rgba(2, 132, 196, 0.08),
        var(--ft-shadow-md) !important;
}
html[data-theme="light"] .review-item-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 10px !important;
    padding-bottom: 10px !important;
    border-bottom: 1px solid var(--ft-border-l) !important;
}
html[data-theme="light"] .review-user-info {
    display: flex !important;
    gap: 12px !important;
    align-items: center !important;
}
html[data-theme="light"] .rev-user-avatar {
    background: linear-gradient(135deg, var(--ft-cyan-l), var(--ft-violet-l)) !important;
    color: #ffffff !important;
    border-radius: 50% !important;
    width: 40px !important;
    height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 700 !important;
    font-family: 'Orbitron', sans-serif !important;
    box-shadow: 0 4px 12px rgba(var(--primary-blue-rgb), 0.25) !important;
}
html[data-theme="light"] .rev-user-details strong {
    color: var(--ft-ink-1) !important;
    display: block !important;
    font-weight: 700 !important;
}
html[data-theme="light"] .rev-user-details span {
    color: var(--ft-ink-3) !important;
    font-size: 12px !important;
}
html[data-theme="light"] .review-item-rating i {
    color: #f59e0b !important;          /* altın yıldız */
}
html[data-theme="light"] .review-item-rating i.far {
    color: rgba(15, 35, 95, 0.18) !important;
}
html[data-theme="light"] .review-item-body p {
    color: var(--ft-ink-2) !important;
    line-height: 1.7 !important;
    margin: 0 !important;
}

/* Boş yorum durumu */
html[data-theme="light"] .comments-placeholder {
    background: #f6f9fd !important;
    border: 1px dashed var(--ft-border-l-2) !important;
    border-radius: 12px !important;
    color: var(--ft-ink-3) !important;
    padding: 50px 30px !important;
}
html[data-theme="light"] .comments-placeholder i {
    color: var(--ft-cyan-l) !important;
    opacity: 0.4 !important;
}
html[data-theme="light"] .comments-placeholder p {
    color: var(--ft-ink-3) !important;
    margin-top: 12px !important;
}

/* Yorum yazma formu (varsa) */
html[data-theme="light"] .feedback-field {
    background: #ffffff !important;
    border: 1px solid var(--ft-border-l-2) !important;
    color: var(--ft-ink-1) !important;
    border-radius: 10px !important;
}
html[data-theme="light"] .feedback-field:focus {
    border-color: var(--ft-cyan-l) !important;
    box-shadow:
        0 0 0 3px rgba(2, 132, 196, 0.10),
        var(--ft-shadow-sm) !important;
    outline: none !important;
}

/* ────────────────────────────────────────────────────────
   L18 · MISC — badge, selection
──────────────────────────────────────────────────────── */
/* Light mode'da da background ezilmesin — sadece gölgesi yumuşatılır */
[data-theme="light"] .fixed-badge {
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
}
[data-theme="light"] .product-badge {
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
}
[data-theme="light"] ::selection {
    background: rgba(2, 132, 196, 0.22) !important;
    color: var(--ft-ink-1) !important;
}

/* ────────────────────────────────────────────────────────
   L19 · GLOBAL METİN RENGİ FAILSAFE
   (Açık zeminde koyu metin garantisi)
──────────────────────────────────────────────────────── */
[data-theme="light"] body,
[data-theme="light"] p,
[data-theme="light"] li,
[data-theme="light"] h1, [data-theme="light"] h2, [data-theme="light"] h3,
[data-theme="light"] h4, [data-theme="light"] h5, [data-theme="light"] h6 {
    color: var(--ft-ink-1);
}

/* Failsafe sadece açık zeminli alanlarda geçerli — koyu öğeleri (announcement,
   footer, gradient butonlar, badge'ler) hariç tut */
[data-theme="light"] span:not(.logo-text-blue):not(.logo-text-orange):not(.discount-badge-v2):not(.fixed-badge):not(.badge) {
    color: inherit;
}

/* ════════════════════════════════════════════════════════
   V2 PREMIUM UPGRADE — THE FUTURE IS NOW
   Cyberpunk / Sci-Fi HUD Interface Enhancements
═══════════════════════════════════════════════════════════ */

/* 2. Micro-Animations & Glow Bounce on Buttons & Cards */
.btn-primary, .btn-categories, .btn-login, .btn-buy-modern, .btn-register-desktop {
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
    position: relative;
    overflow: hidden;
    clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px) !important;
    border-radius: 0 !important;
}

.btn-primary:hover, .btn-categories:hover, .btn-login:hover, .btn-buy-modern:hover {
    transform: translateY(-3px) scale(1.05) !important;
    box-shadow: 0 10px 30px rgba(var(--primary-blue-rgb), 0.6), 0 0 15px rgba(var(--primary-orange-rgb), 0.5) !important;
}

/* Cyber Loading Line on Hover (Buttons) */
.btn-primary::before, .btn-categories::before, .btn-buy-modern::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: -100%;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.8), transparent);
    transition: left 0.5s ease-in-out;
}

.btn-primary:hover::before, .btn-categories:hover::before, .btn-buy-modern:hover::before {
    left: 100%;
}

/* 3. Deep Glassmorphism for Product Cards */
.product-card-modern {
    background: rgba(11, 15, 36, 0.6) !important;
    backdrop-filter: blur(16px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(180%) !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.15) !important;
    border-radius: 14px !important;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.product-card-modern:hover {
    transform: translateY(-8px) scale(1.02) !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.5) !important;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4), 0 0 20px rgba(var(--primary-blue-rgb), 0.3) !important;
}

/* Light Mode Glassmorphism */
[data-theme="light"] .product-card-modern {
    background: rgba(255, 255, 255, 0.6) !important;
    backdrop-filter: blur(20px) saturate(150%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(150%) !important;
    border: 1px solid rgba(255, 255, 255, 0.8) !important;
    box-shadow: 0 8px 32px rgba(15, 35, 95, 0.08) !important;
}

[data-theme="light"] .product-card-modern:hover {
    border: 1px solid rgba(var(--primary-blue-rgb), 0.4) !important;
    box-shadow: 0 15px 40px rgba(var(--primary-blue-rgb), 0.15), 0 0 20px rgba(var(--primary-orange-rgb), 0.1) !important;
}

/* 4. Form Inputs: Cyber Focus Line */
.search-input, input[type="text"], input[type="password"], input[type="email"], input[type="number"], select, textarea {
    background: rgba(10, 14, 34, 0.6) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.2) !important;
    border-radius: 0 !important;
    clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px) !important;
    transition: all 0.3s ease !important;
    position: relative;
}

.search-input:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, input[type="number"]:focus, select:focus, textarea:focus {
    background: rgba(0, 0, 0, 0.4) !important;
    border-color: var(--primary-blue) !important;
    box-shadow: 0 0 0 2px rgba(var(--primary-blue-rgb), 0.2), inset 0 0 10px rgba(var(--primary-blue-rgb), 0.1) !important;
}

/* Light Mode Inputs */
[data-theme="light"] .search-input, [data-theme="light"] input[type="text"], [data-theme="light"] input[type="password"], [data-theme="light"] input[type="email"], [data-theme="light"] input[type="number"], [data-theme="light"] select, [data-theme="light"] textarea {
    background: rgba(255, 255, 255, 0.7) !important;
    border: 1px solid rgba(15, 35, 95, 0.15) !important;
}

[data-theme="light"] .search-input:focus, [data-theme="light"] input:focus {
    background: #ffffff !important;
    box-shadow: 0 4px 15px rgba(var(--primary-blue-rgb), 0.15), inset 0 2px 4px rgba(0,0,0,0.02) !important;
}

/* 5. HUD Typography Enhancements */
h1, h2, h3, .section-title {
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
}

.product-price, .balance-amount, .user-balance-label strong, .price-badge, .old-price {
    font-family: 'Share Tech Mono', 'Orbitron', monospace !important;
    letter-spacing: 0.05em !important;
}

/* 6. Futuristic Modals / Wrappers (Clip Path) */
.auth-modal-content, .cart-drawer, .search-popup, .notif-dropdown {
    background: rgba(11, 15, 36, 0.85) !important;
    backdrop-filter: blur(24px) saturate(200%) !important;
    -webkit-backdrop-filter: blur(24px) saturate(200%) !important;
    clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 20px 100%, 0 calc(100% - 20px)) !important;
    border-radius: 0 !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.2) !important;
}

[data-theme="light"] .auth-modal-content, [data-theme="light"] .cart-drawer, [data-theme="light"] .search-popup, [data-theme="light"] .notif-dropdown {
    background: rgba(255, 255, 255, 0.85) !important;
    border: 1px solid rgba(255, 255, 255, 0.9) !important;
    box-shadow: 0 20px 50px rgba(15, 35, 95, 0.15) !important;
}

/* Header Glassmorphism Depth */
.main-header {
    background: rgba(7, 10, 24, 0.55) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-bottom: 1px solid rgba(var(--primary-blue-rgb), 0.15) !important;
}

[data-theme="light"] .main-header {
    background: rgba(255, 255, 255, 0.8) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-bottom: 1px solid rgba(15, 35, 95, 0.05) !important;
    box-shadow: 0 10px 30px rgba(15, 35, 95, 0.03) !important;
}

/* Nav Link Hover Glow */
.nav-item-modern {
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.nav-item-modern:hover {
    color: var(--primary-blue) !important;
    text-shadow: 0 0 12px rgba(var(--primary-blue-rgb), 0.6) !important;
    transform: translateY(-2px) !important;
}

/* =========================================================================
   ANNOUNCEMENT BAR — Premium Minimal layout (Predunya Theme)
   Tasarım kararı: Sol tarafta sabit bir DUYURU badge'i ve pulsing nokta,
   sağda ise sade ama dikkat çekici akan veya statik metinler.
   ========================================================================= */
.top-announcement::before {
    content: "DUYURU" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 95px !important;
    padding-left: 18px !important;
    background: #0b0f24 !important;
    border-right: 2px solid var(--primary-orange) !important;
    color: #ffffff !important;
    font-family: 'Orbitron', sans-serif !important;
    font-weight: 700 !important;
    font-size: 10px !important;
    letter-spacing: 1px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 10 !important;
    box-shadow: 4px 0 10px rgba(0, 0, 0, 0.4) !important;
    background-image: none !important;
    animation: none !important;
}

.top-announcement::after {
    content: "" !important;
    position: absolute !important;
    left: 14px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 5px !important;
    height: 5px !important;
    background-color: var(--primary-orange) !important;
    border-radius: 50% !important;
    z-index: 11 !important;
    box-shadow: 0 0 6px var(--primary-orange) !important;
    animation: announcement-dot-pulse 1.8s ease-in-out infinite !important;
}

.announcement-marquee span,
.announcement-text {
    font-family: 'Rajdhani', sans-serif !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    letter-spacing: 0.8px !important;
    color: inherit !important;
    text-shadow: none !important;
    position: relative !important;
    z-index: 3 !important;
}

@keyframes announcement-dot-pulse {
    0% {
        transform: translateY(-50%) scale(0.85);
        opacity: 0.6;
        box-shadow: 0 0 4px var(--primary-orange);
    }
    50% {
        transform: translateY(-50%) scale(1.2);
        opacity: 1;
        box-shadow: 0 0 12px var(--primary-orange), 0 0 20px rgba(var(--primary-orange-rgb), 0.5);
    }
    100% {
        transform: translateY(-50%) scale(0.85);
        opacity: 0.6;
        box-shadow: 0 0 4px var(--primary-orange);
    }
}

@keyframes announcement-dot-pulse-light {
    0% {
        transform: translateY(-50%) scale(0.85);
        opacity: 0.6;
        box-shadow: 0 0 4px var(--primary-blue);
    }
    50% {
        transform: translateY(-50%) scale(1.2);
        opacity: 1;
        box-shadow: 0 0 10px var(--primary-blue), 0 0 16px rgba(var(--primary-blue-rgb), 0.4);
    }
    100% {
        transform: translateY(-50%) scale(0.85);
        opacity: 0.6;
        box-shadow: 0 0 4px var(--primary-blue);
    }
}

/* Mobile responsive fixes for the compact DUYURU badge */
@media (max-width: 768px) {
    .top-announcement {
        padding-left: 85px !important;
    }
    .top-announcement::before {
        width: 75px !important;
        font-size: 9px !important;
        letter-spacing: 0.5px !important;
        padding-left: 12px !important;
    }
    .top-announcement::after {
        left: 10px !important;
        width: 4px !important;
        height: 4px !important;
    }
    .mobile-action-btn {
        border-radius: 8px !important;
        height: 42px !important;
        font-weight: 700 !important;
        font-size: 12px !important;
        letter-spacing: 0.5px !important;
        text-transform: uppercase !important;
    }
    .mobile-header-row-2 .btn-register {
        background: transparent !important;
        border: 1.5px solid rgba(var(--primary-blue-rgb), 0.4) !important;
        color: var(--ft-cyan) !important;
        box-shadow: none !important;
    }
    .mobile-header-row-2 .btn-login-mobile {
        background: linear-gradient(135deg, var(--ft-cyan) 0%, var(--ft-violet) 100%) !important;
        border: none !important;
        color: #03040c !important;
        box-shadow: 0 4px 14px rgba(var(--primary-blue-rgb), 0.25) !important;
    }
    .mobile-header-row-2 .btn-balance {
        background: linear-gradient(135deg, var(--ft-cyan) 0%, var(--ft-violet) 100%) !important;
        color: #03040c !important;
        border: none !important;
        box-shadow: 0 4px 14px rgba(var(--primary-blue-rgb), 0.25) !important;
    }
    .mobile-header-row-2 .btn-account {
        background: rgba(255, 255, 255, 0.04) !important;
        color: #ffffff !important;
        border: 1.5px solid rgba(255, 255, 255, 0.08) !important;
        box-shadow: none !important;
    }
    [data-theme="light"] .mobile-header-row-2 .btn-register {
        border: 1.5px solid var(--primary-blue) !important;
        color: var(--primary-blue) !important;
        -webkit-text-fill-color: var(--primary-blue) !important;
        background: transparent !important;
    }
    [data-theme="light"] .mobile-header-row-2 .btn-login-mobile {
        background: linear-gradient(135deg, var(--ft-cyan-l) 0%, var(--ft-violet-l) 100%) !important;
        color: #ffffff !important;
        box-shadow: 0 4px 14px rgba(var(--primary-blue-rgb), 0.25) !important;
    }
    [data-theme="light"] .mobile-header-row-2 .btn-balance {
        background: linear-gradient(135deg, var(--ft-cyan-l) 0%, var(--ft-violet-l) 100%) !important;
        color: #ffffff !important;
    }
    [data-theme="light"] .mobile-header-row-2 .btn-account {
        background: rgba(0, 0, 0, 0.02) !important;
        color: var(--ft-ink-2) !important;
        border: 1.5px solid rgba(0, 0, 0, 0.08) !important;
    }
}

/* =========================================================================
   HEADER v2 — HUD / Web3 Terminal Aesthetic (Future theme only)
   Daha cesur, daha özgün: clip-path notch'lar, HUD köşe braketleri,
   devre izi animasyonu, terminal caret, blink dot.
   ========================================================================= */

/* -------- 0. HEADER ALT KATMANI: animasyonlu nokta grid + tarayıcı çizgi -- */
.main-header {
    position: relative !important;
    isolation: isolate !important;
    background: linear-gradient(180deg, rgba(10, 11, 18, 0.95) 0%, rgba(6, 7, 12, 0.98) 100%) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04) !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4) !important;
}
.main-header::before {
    content: none !important;
    display: none !important;
}
.main-header::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 5% !important;
    right: 5% !important;
    height: 1.5px !important;
    background: linear-gradient(90deg, transparent 0%, rgba(var(--primary-blue-rgb), 0.6) 20%, rgba(var(--primary-orange-rgb), 0.6) 80%, transparent 100%) !important;
    z-index: 10 !important;
    pointer-events: none !important;
    display: block !important;
}

/* -------- 1. LOGO: yörünge halkası + scan parıltısı -------- */
.logo {
    position: relative !important;
    padding: 6px 10px !important;
}
.logo::before {
    content: none !important;
    display: none !important;
}
.logo::after {
    content: none !important;
    display: none !important;
}
.logo .logo-text-blue {
    color: var(--primary-blue, #2563eb) !important;
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    -webkit-text-fill-color: initial !important;
    filter: none !important;
    letter-spacing: 0.5px !important;
    font-weight: 800 !important;
}

/* -------- 2. SEARCH BAR: HUD köşe braketleri + blink caret -------- */
.search-container {
    position: relative !important;
    border-radius: 12px !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    background: rgba(255, 255, 255, 0.02) !important;
    box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.05) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.search-container::before {
    content: none !important;
    display: none !important;
}
.search-container::after {
    content: none !important;
    display: none !important;
}
.search-container:hover {
    border-color: rgba(var(--primary-blue-rgb), 0.3) !important;
    background: rgba(255, 255, 255, 0.04) !important;
}
.search-container:focus-within {
    border-color: var(--primary-blue) !important;
    background: rgba(0, 0, 0, 0.2) !important;
    box-shadow: 
        0 0 0 4px rgba(var(--primary-blue-rgb), 0.15),
        inset 0 2px 4px rgba(0, 0, 0, 0.3) !important;
}
.search-container .search-input,
.search-input {
    caret-color: var(--ft-cyan) !important;
    font-family: var(--theme-font), sans-serif !important;
    letter-spacing: 0.3px !important;
}
.search-container .search-input::placeholder,
.search-input::placeholder {
    letter-spacing: 0.5px !important;
    text-transform: none !important;
    opacity: 0.55 !important;
}
.search-container .search-btn,
.search-btn {
    transition: transform 0.2s ease, color 0.2s ease !important;
}
.search-container:focus-within .search-btn {
    color: var(--ft-cyan) !important;
    transform: scale(1.05) !important;
}

/* -------- 3. ICON BUTTONS: hexagonal-notched chip + status dot -------- */
.actions .icon-btn,
.icon-btn {
    position: relative !important;
    border-radius: 8px !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    background: rgba(255, 255, 255, 0.02) !important;
    backdrop-filter: blur(8px) saturate(140%) !important;
    -webkit-backdrop-filter: blur(8px) saturate(140%) !important;
    clip-path: none !important;
    box-shadow: none !important;
    transition: all 0.2s ease !important;
}
[data-theme="light"] .actions .icon-btn,
[data-theme="light"] .icon-btn {
    background: rgba(0, 0, 0, 0.02) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
}
.actions .icon-btn::after,
.icon-btn::after {
    content: none !important;
    display: none !important;
}
.actions .icon-btn:hover,
.icon-btn:hover {
    transform: translateY(-1.5px) !important;
    border-color: rgba(var(--primary-blue-rgb), 0.4) !important;
    background: rgba(var(--primary-blue-rgb), 0.08) !important;
    color: var(--ft-cyan) !important;
    box-shadow: 0 4px 12px rgba(var(--primary-blue-rgb), 0.15) !important;
}
.icon-btn.cart-btn:hover svg {
    transform: scale(1.05) !important;
}
/* notification badge zaten kırmızı; durum noktasını gizle */
.notification-wrapper .icon-btn::after,
.notification-mobile-wrapper .icon-btn::after { display: none !important; }

/* -------- 4. NOTIF BADGE: pulsing HUD halo -------- */
.notif-badge,
.notif-badge-mobile {
    box-shadow: 0 0 10px rgba(255, 60, 90, 0.6) !important;
    font-weight: 700 !important;
}

/* -------- 5. ADMIN / USER PILL (.btn-login): notched cyber tag + scan -------- */
.btn.btn-login {
    position: relative !important;
    overflow: hidden !important;
    isolation: isolate !important;
    border-radius: 8px !important;
    clip-path: none !important;
    letter-spacing: 0.8px !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
}
.btn.btn-login::before {
    content: none !important;
    display: none !important;
}
.btn.btn-login > * { position: relative !important; z-index: 2 !important; }
.btn.btn-login:hover {
    transform: translateY(-1.5px) !important;
    box-shadow: 0 6px 20px rgba(var(--primary-blue-rgb), 0.4) !important;
}

/* -------- 6. "TÜM KATEGORİLER" pill: notched + sürekli akan iz -------- */
.btn-categories {
    position: relative !important;
    overflow: hidden !important;
    border-radius: 8px !important;
    clip-path: none !important;
    border: 1.5px solid rgba(var(--primary-orange-rgb), 0.4) !important;
    background: transparent !important;
    color: var(--ft-violet) !important;
    letter-spacing: 0.8px !important;
    text-transform: uppercase !important;
    box-shadow: none !important;
    transition: all 0.2s ease !important;
}
.btn-categories::after {
    content: none !important;
    display: none !important;
}
.btn-categories:hover {
    transform: translateY(-1.5px) !important;
    background: rgba(var(--primary-orange-rgb), 0.08) !important;
    border-color: var(--ft-violet) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(var(--primary-orange-rgb), 0.25) !important;
    letter-spacing: 0.8px !important;
}

/* -------- 7. NAV TABS: hover'da köşe braketleri + üst sinyal noktası -------- */
.nav-item-modern {
    position: relative !important;
    padding: 8px 16px !important;
    border-radius: 6px !important;
    color: var(--ft-text-dim) !important;
    transition: all 0.2s ease !important;
}
.nav-item-modern::before,
.nav-item-modern::after {
    content: none !important;
    display: none !important;
}
.nav-item-modern:hover,
.nav-item-modern.active {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.04) !important;
    transform: translateY(-1px) !important;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .main-header::before,
    .main-header::after,
    .logo::before,
    .logo::after,
    .icon-btn::after,
    .notif-badge,
    .notif-badge-mobile,
    .btn-categories::after,
    .btn.btn-login::before {
        animation: none !important;
    }
}
/* End header HUD v2 */

/* =========================================================================
   HERO SLIDER & EDITOR'S CHOICE — Future Theme HUD design
   Admin'in seçtiği renkler/arka planlar korunur, sadece overlay efektleri.
   ========================================================================= */

/* ============================ HERO SECTION ============================ */
.hero-section .hero-grid {
    gap: 16px !important;
}

/* --- ANA SLIDER KARTI: HUD braketler + scan + holografik kenar --- */
/* .main-slide'a position dokunma! Absolute layout slider'ın çalışma şartı. */
.hero-card {
    border-radius: 6px !important;
    overflow: hidden !important;
    transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                box-shadow 0.5s ease !important;
}
.hero-card.side-card {
    position: relative !important;
    isolation: isolate !important;
}

/* Dış neon halka + iç vinyet */
.hero-card.main-slide::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    z-index: 4 !important;
    border: 1.5px solid var(--primary-blue) !important;
    border-radius: 8px !important;
    box-shadow:
        inset 0 0 0 1px rgba(var(--primary-blue-rgb), 0.25),
        inset 0 0 24px rgba(var(--primary-blue-rgb), 0.18) !important;
}

/* HUD köşe braketleri (4 köşe) — büyük slider için */
.hero-card.main-slide::after {
    content: "" !important;
    position: absolute !important;
    inset: 10px !important;
    pointer-events: none !important;
    z-index: 5 !important;
    background:
        /* sol-üst */
        linear-gradient(#00d2ff,#00d2ff) top    left  / 24px 2px no-repeat,
        linear-gradient(#00d2ff,#00d2ff) top    left  / 2px 24px no-repeat,
        /* sağ-üst */
        linear-gradient(#00d2ff,#00d2ff) top    right / 24px 2px no-repeat,
        linear-gradient(#00d2ff,#00d2ff) top    right / 2px 24px no-repeat,
        /* sol-alt */
        linear-gradient(#00d2ff,#00d2ff) bottom left  / 24px 2px no-repeat,
        linear-gradient(#00d2ff,#00d2ff) bottom left  / 2px 24px no-repeat,
        /* sağ-alt */
        linear-gradient(#00d2ff,#00d2ff) bottom right / 24px 2px no-repeat,
        linear-gradient(#00d2ff,#00d2ff) bottom right / 2px 24px no-repeat !important;
    filter: drop-shadow(0 0 4px rgba(0, 210, 255, 0.8)) !important;
    opacity: 0.85 !important;
}

.hero-card.main-slide:hover {
    transform: translateY(-3px) !important;
    box-shadow:
        0 20px 60px rgba(0, 0, 0, 0.4),
        0 0 50px rgba(0, 210, 255, 0.35),
        inset 0 0 40px rgba(0, 210, 255, 0.18) !important;
}

/* --- SLIDER İÇERİK KATMANI: z-index katmanlama (position absolute kalsın!) --- */
.hero-card .card-overlay {
    z-index: 2 !important;
}
.hero-card .card-content {
    position: relative !important;
    z-index: 3 !important;
}

/* Slider arka plan üzerinde sürekli akan ışık dalgası */
.hero-card.main-slide .card-overlay::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background: linear-gradient(115deg,
        transparent 30%,
        rgba(255, 255, 255, 0.10) 50%,
        transparent 70%) !important;
    background-size: 250% 100% !important;
    background-position: -120% 0 !important;
    animation: hero-shimmer 7s linear infinite !important;
    mix-blend-mode: overlay !important;
}
@keyframes hero-shimmer {
    0%   { background-position: -120% 0; }
    100% { background-position:  220% 0; }
}

/* --- SLIDER BADGE (subtitle pill — "SADAS" gibi): notched cyber chip --- */
.slider-badge {
    position: relative !important;
    display: inline-block !important;
    padding: 6px 14px !important;
    border-radius: 0 !important;
    clip-path: polygon(
        8px 0, 100% 0,
        100% calc(100% - 8px), calc(100% - 8px) 100%,
        0 100%, 0 8px
    ) !important;
    background: rgba(0, 210, 255, 0.12) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    font-size: 11px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    text-shadow: 0 0 6px rgba(255, 255, 255, 0.5) !important;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.25),
        0 0 14px rgba(0, 210, 255, 0.35) !important;
}
.slider-badge::before {
    content: "▸ " !important;
    color: #00d2ff !important;
    text-shadow: 0 0 6px #00d2ff !important;
    margin-right: 4px !important;
}

/* --- SLIDER TITLE: holografik gradient text --- */
.hero-card .card-title {
    background: linear-gradient(135deg,
        #ffffff 0%,
        #cfefff 35%,
        #ffffff 55%,
        #b46bff 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    filter: drop-shadow(0 2px 12px rgba(0, 0, 0, 0.35))
            drop-shadow(0 0 14px rgba(0, 210, 255, 0.18)) !important;
    letter-spacing: 1px !important;
}
.hero-card .card-desc {
    color: rgba(255, 255, 255, 0.85) !important;
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.5) !important;
    letter-spacing: 0.5px !important;
}

/* --- HEMEN İNCELE BUTONU: notched + scan sweep --- */
.slider-action-btn {
    position: relative !important;
    overflow: hidden !important;
    isolation: isolate !important;
    border-radius: 6px !important;
    clip-path: polygon(
        10px 0, 100% 0,
        100% calc(100% - 10px), calc(100% - 10px) 100%,
        0 100%, 0 10px
    ) !important;
    background: linear-gradient(135deg,
        rgba(255, 255, 255, 0.95) 0%,
        rgba(207, 239, 255, 0.95) 100%) !important;
    color: #04101f !important;
    font-weight: 800 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    border: 1px solid rgba(255, 255, 255, 0.6) !important;
    box-shadow:
        0 0 0 1px rgba(0, 210, 255, 0.25) inset,
        0 6px 22px rgba(0, 0, 0, 0.3),
        0 0 18px rgba(0, 210, 255, 0.4) !important;
    transition: transform 0.25s ease, box-shadow 0.3s ease, letter-spacing 0.3s ease !important;
}
.slider-action-btn::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background: linear-gradient(115deg,
        transparent 35%,
        rgba(0, 210, 255, 0.35) 50%,
        transparent 65%) !important;
    background-size: 220% 100% !important;
    background-position: -120% 0 !important;
    transition: background-position 0.7s ease !important;
    z-index: 1 !important;
}
.slider-action-btn:hover { 
    transform: translateY(-2px) !important;
    letter-spacing: 3px !important;
    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.4),
        0 0 28px rgba(0, 210, 255, 0.7) !important;
}
.slider-action-btn:hover::before { background-position: 220% 0 !important; }

/* --- CIRCULAR PROGRESS: neon ring --- */
.hero-card .progress-circle {
    filter: drop-shadow(0 0 8px rgba(0, 210, 255, 0.5)) !important;
}

.hero-card .circular-chart .circle-bg {
    stroke: rgba(255, 255, 255, 0.15) !important;
    stroke-width: 2 !important;
}
.hero-card .circular-chart .circle-progress {
    stroke: #00d2ff !important;
    stroke-width: 2.5 !important;
    filter: drop-shadow(0 0 4px #00d2ff) !important;
}
.hero-card .progress-text {
    color: #ffffff !important;
    text-shadow: 0 0 8px rgba(0, 210, 255, 0.8) !important;
    font-family: 'Share Tech Mono', ui-monospace, monospace, var(--theme-font) !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
}

/* --- SIDE CARDS (sağdaki dikey banner'lar) --- */
.hero-card.side-card {
    position: relative !important;
    border-radius: 6px !important;
    overflow: hidden !important;
    transition: transform 0.4s ease, box-shadow 0.4s ease !important;
}
.hero-card.side-card::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 3 !important;
    pointer-events: none !important;
    border: 1.5px solid var(--primary-blue) !important;
    border-radius: 8px !important;
    box-shadow:
        inset 0 0 0 1px rgba(var(--primary-blue-rgb), 0.20),
        inset 0 -60px 80px rgba(0, 0, 0, 0.5) !important;
}
.hero-card.side-card::after {
    content: "" !important;
    position: absolute !important;
    inset: 8px !important;
    z-index: 4 !important;
    pointer-events: none !important;
    background:
        linear-gradient(#00d2ff,#00d2ff) top    left  / 18px 2px no-repeat,
        linear-gradient(#00d2ff,#00d2ff) top    left  / 2px 18px no-repeat,
        linear-gradient(#00d2ff,#00d2ff) bottom right / 18px 2px no-repeat,
        linear-gradient(#00d2ff,#00d2ff) bottom right / 2px 18px no-repeat !important;
    filter: drop-shadow(0 0 4px rgba(0, 210, 255, 0.7)) !important;
    opacity: 0.8 !important;
}
.hero-card.side-card:hover {
    transform: translateY(-3px) scale(1.01) !important;
    box-shadow:
        0 12px 36px rgba(0, 0, 0, 0.4),
        0 0 30px rgba(0, 210, 255, 0.35) !important;
}

/* ====================== EDITOR'S CHOICE / FEATURED CARDS ====================== */
/* Sadece kartın dış çerçevesinde admin tema renginde ince neon şerit. Hover'da büyüme/glow değişikliği yok. */
.featured-card,
.featured-card:hover {
    position: relative !important;
    border-radius: 10px !important;
    border: 1.5px solid var(--primary-blue) !important;
    box-shadow: inset 0 0 0 1px rgba(var(--primary-blue-rgb), 0.25) !important;
    transform: none !important;
    transition: none !important;
}
.featured-card::before,
.featured-card::after { content: none !important; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .hero-card.main-slide .card-overlay::before { animation: none !important; }
}
/* End hero & featured */

/* =========================================================================
   HERO SLIDER — Content alignment: sol-alt + tipografi optimizasyonu
   ========================================================================= */
/* İçerik sol-orta; .slider-progress-wrapper zaten absolute bottom:40 left:40 → sol-altta kalır */
.hero-main .card-overlay,
.hero-card.main-slide .card-overlay {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;
    padding: 40px 60px !important;
}

.hero-main .card-content {
    max-width: 560px !important;
    text-align: left !important;
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    padding: 0 !important;
}

.hero-main .slider-badge {
    margin-bottom: 14px !important;
    padding: 5px 12px !important;
    font-size: 10px !important;
}

.hero-main .card-title {
    font-size: 38px !important;
    line-height: 1.05 !important;
    margin-bottom: 10px !important;
    letter-spacing: 0.5px !important;
}

.hero-main .card-desc {
    font-size: 14px !important;
    line-height: 1.55 !important;
    margin-bottom: 18px !important;
    max-width: 440px !important;
}

.hero-main .slider-action-btn {
    padding: 11px 28px !important;
    font-size: 12px !important;
    letter-spacing: 1.5px !important;
}

/* Responsive — mobil/tablet'te de sol-orta korunsun */
@media (max-width: 1024px) {
    .hero-main .card-overlay,
    .hero-card.main-slide .card-overlay {
        padding: 30px 36px !important;
    }
    .hero-main .card-title {
        font-size: 30px !important;
    }
    .hero-main .card-desc {
        font-size: 13px !important;
        margin-bottom: 14px !important;
    }
}
@media (max-width: 600px) {
    .hero-main .card-overlay,
    .hero-card.main-slide .card-overlay {
        padding: 22px 22px !important;
    }
    .hero-main .card-title {
        font-size: 24px !important;
    }
    .hero-main .card-desc {
        font-size: 12px !important;
        margin-bottom: 12px !important;
    }
    .hero-main .slider-action-btn {
        padding: 6px 14px !important;
        font-size: 8.5px !important;
        letter-spacing: 0.6px !important;
    }
}
/* End hero alignment */

/* =========================================================================
   SECTION HEADER — Future Theme | Editorial Premium
   Linear/Vercel ruhunda incelikli; tek bir parlak detayla karakterli.
   ========================================================================= */

.showcase-header {
    position: relative !important;
    padding: 2px 16px !important;
    margin-bottom: 22px !important;
    border-radius: 10px !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.30) !important;
    background: linear-gradient(180deg,
        rgba(var(--primary-blue-rgb), 0.03) 0%,
        rgba(var(--primary-blue-rgb), 0.00) 100%) !important;
    box-shadow:
        inset 0 0 0 1px rgba(var(--primary-blue-rgb), 0.06),
        0 0 8px rgba(var(--primary-blue-rgb), 0.15) !important;
    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
}

/* Çerçevenin alt kenarında ince, statik parlama hattı (nefes animasyonu kaldırıldı) */
.showcase-header::after {
    content: "" !important;
    position: absolute !important;
    left: 22px !important;
    right: 22px !important;
    bottom: -1px !important;
    height: 1px !important;
    pointer-events: none !important;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(var(--primary-blue-rgb), 0.55) 50%,
        transparent 100%) !important;
    box-shadow: 0 0 4px rgba(var(--primary-blue-rgb), 0.40) !important;
}
.showcase-header::before {
    content: none !important;
}

/* --- Title wrapper --- */
.showcase-title-wrapper {
    gap: 16px !important;
    align-items: center !important;
}

/* --- İkon kutusu: dual-layer gradient border + soft glass --- */
.showcase-title-icon {
    width: 30px !important;
    height: 30px !important;
    border-radius: 8px !important;
    border: none !important;
    padding: 1px !important; /* gradient border ring */
    background:
        linear-gradient(180deg,
            rgba(var(--primary-blue-rgb), 0.06) 0%,
            rgba(var(--primary-blue-rgb), 0.02) 100%)
        padding-box,
        linear-gradient(135deg,
            rgba(var(--primary-blue-rgb), 0.55) 0%,
            rgba(var(--primary-blue-rgb), 0.10) 50%,
            rgba(var(--primary-blue-rgb), 0.45) 100%)
        border-box !important;
    background-origin: border-box !important;
    box-shadow:
        0 10px 24px rgba(var(--primary-blue-rgb), 0.14),
        0 0 0 4px rgba(var(--primary-blue-rgb), 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.10) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1),
                box-shadow 0.4s ease !important;
}
.showcase-title-icon::after {
    /* eski dikey çubuk yerine: incelikli, kısa, çift uçta soluklaşan accent */
    left: -14px !important;
    top: 16% !important;
    height: 68% !important;
    width: 2px !important;
    border-radius: 6px !important;
    background: linear-gradient(180deg,
        rgba(var(--primary-blue-rgb), 0) 0%,
        var(--primary-blue) 35%,
        var(--primary-blue) 65%,
        rgba(var(--primary-blue-rgb), 0) 100%) !important;
    box-shadow: 0 0 10px rgba(var(--primary-blue-rgb), 0.55) !important;
    animation: none !important;
    opacity: 0.95 !important;
}
.showcase-title-icon:hover {
    transform: translateY(-2px) rotate(-2deg) !important;
    box-shadow:
        0 16px 36px rgba(var(--primary-blue-rgb), 0.22),
        0 0 0 6px rgba(var(--primary-blue-rgb), 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
}
.showcase-custom-icon {
    filter: drop-shadow(0 3px 8px rgba(0, 0, 0, 0.12))
            drop-shadow(0 0 8px rgba(var(--primary-blue-rgb), 0.30)) !important;
    transition: transform 0.45s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}
.showcase-title-icon:hover .showcase-custom-icon {
    transform: scale(1.08) rotate(2deg) !important;
}

/* --- Başlık: kibar gradient + sola küçük "live" pulse noktası --- */
.showcase-title {
    position: relative !important;
    padding-left: 14px !important;
    background: linear-gradient(135deg,
        var(--text-color) 0%,
        var(--text-color) 60%,
        var(--primary-blue) 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    letter-spacing: -0.4px !important;
    font-weight: 700 !important;
}
.showcase-title::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    width: 6px !important;
    height: 6px !important;
    margin-top: -3px !important;
    border-radius: 50% !important;
    background: var(--primary-blue) !important;
    box-shadow:
        0 0 0 3px rgba(var(--primary-blue-rgb), 0.18),
        0 0 10px rgba(var(--primary-blue-rgb), 0.7) !important;
    animation: showcase-live-pulse 2.2s ease-in-out infinite !important;
}
@keyframes showcase-live-pulse {
    0%, 100% {
        box-shadow: 0 0 0 3px rgba(var(--primary-blue-rgb), 0.15),
                    0 0 8px  rgba(var(--primary-blue-rgb), 0.55);
    }
    50% {
        box-shadow: 0 0 0 6px rgba(var(--primary-blue-rgb), 0.04),
                    0 0 14px rgba(var(--primary-blue-rgb), 0.85);
    }
}

/* --- TÜM İLANLAR: Sade ve temiz --- */
.view-all-link {
    position: relative !important;
    border-radius: 6px !important;
    padding: 6px 12px !important;
    border: 1px solid var(--border-color) !important;
    background: transparent !important;
    color: var(--text-color) !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    box-shadow: none !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

.view-all-link i,
.view-all-link .fas {
    font-size: 10px !important;
    color: var(--text-muted, #888) !important;
    transition: transform 0.2s ease, color 0.2s ease !important;
    background: transparent !important;
    box-shadow: none !important;
    width: auto !important;
    height: auto !important;
    border-radius: 0 !important;
}

.view-all-link:hover {
    border-color: var(--primary-blue) !important;
    color: var(--primary-blue) !important;
    background: rgba(var(--primary-blue-rgb), 0.04) !important;
}
.view-all-link:hover i,
.view-all-link:hover .fas {
    color: var(--primary-blue) !important;
    transform: translateX(3px) !important;
}
.view-all-link::before { content: none !important; display: none !important; }

/* --- Showcase Tabs: Neon stiller devre dışı — kurumsal stil dosya sonunda --- */

@media (max-width: 768px) {
    .showcase-header::after { width: 52px !important; bottom: -7px !important; }
    .view-all-link { padding: 4px 8px !important; font-size: 10px !important; gap: 4px !important; border-radius: 4px !important; }
    .view-all-link i, .view-all-link .fas { font-size: 8px !important; }
    .showcase-title { padding-left: 8px !important; font-size: 12px !important; }
    .showcase-title::before { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
    .showcase-header::after,
    .showcase-title::before { animation: none !important; }
}
/* End editorial premium section header */

/* =========================================================================
   BLOG SECTION — Future Theme | Editorial Premium
   "BLOG" başlığı + 3 kart; admin tema rengine bağlı, kibar modern.
   ========================================================================= */

/* --- BLOG bölümü section-header: showcase-header'a benzer neon mini şerit --- */
.blog-section .section-header {
    position: relative !important;
    padding: 2px 16px !important;
    margin: 0 auto 26px !important;
    border-radius: 10px !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.55) !important;
    background: linear-gradient(180deg,
        rgba(var(--primary-blue-rgb), 0.06) 0%,
        rgba(var(--primary-blue-rgb), 0.00) 100%) !important;
    box-shadow:
        inset 0 0 0 1px rgba(var(--primary-blue-rgb), 0.12),
        0 0 14px rgba(var(--primary-blue-rgb), 0.30),
        0 0 28px rgba(var(--primary-blue-rgb), 0.12) !important;
    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
}
.blog-section .section-header::before,
.blog-section .section-header::after {
    content: "" !important;
    position: absolute !important;
    left: 22px !important;
    right: 22px !important;
    height: 1px !important;
    pointer-events: none !important;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(var(--primary-blue-rgb), 0.85) 50%,
        transparent 100%) !important;
}
.blog-section .section-header::before {
    top: -1px !important;
    box-shadow: 0 0 8px rgba(var(--primary-blue-rgb), 0.55) !important;
}
.blog-section .section-header::after {
    bottom: -1px !important;
    height: 2px !important;
    border-radius: 2px !important;
    box-shadow: 0 0 10px rgba(var(--primary-blue-rgb), 0.75) !important;
    animation: blog-accent-breath 4.5s ease-in-out infinite !important;
}
@keyframes blog-accent-breath {
    0%, 100% { opacity: 0.55; }
    50%      { opacity: 1; }
}
.blog-section .section-title {
    font-size: 18px !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    background: linear-gradient(135deg,
        var(--text-color) 0%,
        var(--primary-blue) 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
.blog-section .section-title::before {
    width: 3px !important;
    height: 16px !important;
    border-radius: 3px !important;
    background: linear-gradient(180deg,
        rgba(var(--primary-blue-rgb), 0) 0%,
        var(--primary-blue) 50%,
        rgba(var(--primary-blue-rgb), 0) 100%) !important;
    box-shadow: 0 0 8px rgba(var(--primary-blue-rgb), 0.6) !important;
}

/* "Tüm Yazılar" butonu: pill ghost + ok chip */
.blog-section .btn-text {
    position: relative !important;
    overflow: hidden !important;
    border-radius: 999px !important;
    padding: 5px 6px 5px 14px !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.22) !important;
    background: linear-gradient(180deg,
        rgba(var(--primary-blue-rgb), 0.05) 0%,
        rgba(var(--primary-blue-rgb), 0.00) 100%) !important;
    color: var(--text-color) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    transition: border-color 0.3s ease, background 0.3s ease,
                color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease !important;
}
.blog-section .btn-text i,
.blog-section .btn-text .fas {
    width: 20px !important;
    height: 20px !important;
    border-radius: 50% !important;
    background: rgba(var(--primary-blue-rgb), 0.12) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 10px !important;
    color: var(--primary-blue) !important;
    transition: transform 0.35s cubic-bezier(0.65, 0, 0.35, 1),
                background 0.3s ease, color 0.3s ease !important;
}
.blog-section .btn-text:hover {
    border-color: rgba(var(--primary-blue-rgb), 0.55) !important;
    background: linear-gradient(180deg,
        rgba(var(--primary-blue-rgb), 0.10) 0%,
        rgba(var(--primary-blue-rgb), 0.02) 100%) !important;
    color: var(--primary-blue) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 16px rgba(var(--primary-blue-rgb), 0.18) !important;
}
.blog-section .btn-text:hover i,
.blog-section .btn-text:hover .fas {
    background: var(--primary-blue) !important;
    color: #ffffff !important;
    transform: translateX(3px) !important;
}

/* --- BLOG KARTLARI --- */
.blog-section .blog-grid { gap: 22px !important; }

.blog-card {
    position: relative !important;
    border-radius: 16px !important;
    height: 260px !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.22) !important;
    box-shadow:
        0 8px 24px rgba(0, 0, 0, 0.18),
        0 0 0 1px rgba(255, 255, 255, 0.04) inset !important;
    transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.4s ease,
                border-color 0.4s ease !important;
}

/* Alt karartma gradient — başlığı her zaman okunur yap */
.blog-card::after {
    background: linear-gradient(180deg,
        rgba(0, 0, 0, 0.0) 0%,
        rgba(0, 0, 0, 0.45) 55%,
        rgba(0, 0, 0, 0.92) 100%) !important;
}

/* Sol-üstte minik HUD köşe aksanı */
.blog-card::before {
    content: "" !important;
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    width: 14px !important;
    height: 14px !important;
    border-left: 1.5px solid var(--primary-blue) !important;
    border-top: 1.5px solid var(--primary-blue) !important;
    border-radius: 2px !important;
    filter: drop-shadow(0 0 4px rgba(var(--primary-blue-rgb), 0.7)) !important;
    z-index: 3 !important;
    background: transparent !important;
    transform: none !important;
    transition: opacity 0.4s ease, transform 0.4s ease !important;
    opacity: 0.85 !important;
}
.blog-card:hover::before {
    opacity: 1 !important;
    transform: translate(-2px, -2px) !important;
}

.blog-card:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(var(--primary-blue-rgb), 0.65) !important;
    box-shadow:
        0 16px 40px rgba(0, 0, 0, 0.30),
        0 0 24px rgba(var(--primary-blue-rgb), 0.30),
        0 0 0 1px rgba(255, 255, 255, 0.06) inset !important;
}

/* Tarih kapsülü: sol-üst HUD köşesinin yanına yerleştir, neon pill */
.blog-card .blog-date {
    top: 12px !important;
    left: 32px !important;
    right: auto !important;
    transform: none !important;
    padding: 5px 12px !important;
    border-radius: 999px !important;
    background: rgba(0, 0, 0, 0.45) !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.55) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    box-shadow: 0 0 12px rgba(var(--primary-blue-rgb), 0.35) !important;
    transition: background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease !important;
}
.blog-card:hover .blog-date {
    background: rgba(var(--primary-blue-rgb), 0.20) !important;
    border-color: rgba(var(--primary-blue-rgb), 0.9) !important;
    box-shadow: 0 0 18px rgba(var(--primary-blue-rgb), 0.55) !important;
    transform: none !important;
}
.blog-card .blog-date span:first-child {
    font-size: 14px !important;
    color: #ffffff !important;
    text-shadow: 0 0 6px rgba(var(--primary-blue-rgb), 0.6) !important;
}
.blog-card .blog-date span:last-child {
    font-size: 10px !important;
    color: rgba(255, 255, 255, 0.65) !important;
    letter-spacing: 1px !important;
}
.blog-card:hover .blog-date span,
.blog-card:hover .blog-date span:first-child,
.blog-card:hover .blog-date span:last-child {
    color: #ffffff !important;
}

/* Başlık + read-more her zaman görünür, sol-alta hizalı */
.blog-card .blog-overlay {
    text-align: left !important;
    padding: 18px 20px !important;
    transform: none !important;
}
.blog-card .blog-title {
    color: #ffffff !important;
    font-size: 16px !important;
    margin-bottom: 10px !important;
    letter-spacing: 0.2px !important;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.6),
                 0 0 12px rgba(0, 0, 0, 0.4) !important;
    -webkit-line-clamp: 2 !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}

/* Read-more her zaman görünür, hover'da tema rengine döner */
.blog-card .read-more {
    opacity: 1 !important;
    transform: none !important;
    background: transparent !important;
    color: rgba(255, 255, 255, 0.85) !important;
    padding: 0 !important;
    font-size: 11px !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    border-radius: 0 !important;
    transition: color 0.3s ease, letter-spacing 0.3s ease !important;
}
.blog-card .read-more i,
.blog-card .read-more .fas {
    transition: transform 0.3s ease, color 0.3s ease !important;
    font-size: 10px !important;
}
.blog-card:hover .read-more {
    color: var(--primary-blue) !important;
    letter-spacing: 1px !important;
    text-shadow: 0 0 8px rgba(var(--primary-blue-rgb), 0.55) !important;
}
.blog-card:hover .read-more i,
.blog-card:hover .read-more .fas {
    transform: translateX(5px) !important;
}

/* Arkaplan zoom-out hafif yap (mevcut scale 1.1'i frenle) */
.blog-card:hover::before { /* HUD aksanı yukarıda zaten */ }

@media (max-width: 768px) {
    .blog-card { height: 220px !important; }
    .blog-card .blog-title { font-size: 14px !important; }
    .blog-section .section-title { font-size: 16px !important; }
    .blog-section .btn-text { padding: 4px 5px 4px 12px !important; font-size: 11px !important; }
    .blog-section .btn-text i, .blog-section .btn-text .fas { width: 18px !important; height: 18px !important; font-size: 9px !important; }
}

@media (prefers-reduced-motion: reduce) {
    .blog-section .section-header::after { animation: none !important; }
}
/* End blog section premium */

/* =========================================================================
   TRUST FEATURES — Future Theme | HUD Data Nodes
   "GÜVENLİ ÖDEME / HIZLI TESLİMAT" gibi 4'lü özellik alanı.
   Admin tema rengine bağlı, kibar fütüristik dokunuş.
   ========================================================================= */

.trust-section {
    position: relative !important;
    padding: 40px 0 70px 0 !important;
}

/* Bölümün ortasında, kartları birbirine bağlayan ince devre izi (sadece desktop) */
.trust-section::before {
    content: "" !important;
    position: absolute !important;
    left: 10% !important;
    right: 10% !important;
    top: 50% !important;
    height: 1px !important;
    pointer-events: none !important;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(var(--primary-blue-rgb), 0.18) 12%,
        rgba(var(--primary-blue-rgb), 0.18) 88%,
        transparent 100%) !important;
    z-index: 0 !important;
}

.trust-section .trust-grid {
    gap: 18px !important;
    position: relative !important;
    z-index: 1 !important;
}

/* --- Her bir trust item: HUD data node --- */
.trust-item {
    position: relative !important;
    padding: 28px 22px !important;
    border-radius: 16px !important;
    text-align: center !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.18) !important;
    background: linear-gradient(180deg,
        rgba(var(--primary-blue-rgb), 0.04) 0%,
        rgba(var(--primary-blue-rgb), 0.00) 100%) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.04),
        0 6px 20px rgba(var(--primary-blue-rgb), 0.06) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1),
                border-color 0.4s ease,
                box-shadow 0.4s ease,
                background 0.4s ease !important;
    overflow: hidden !important;
    isolation: isolate !important;
}

/* Sol-üst köşede HUD braket */
.trust-item::before {
    content: "" !important;
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    width: 12px !important;
    height: 12px !important;
    border-left: 1.5px solid rgba(var(--primary-blue-rgb), 0.70) !important;
    border-top: 1.5px solid rgba(var(--primary-blue-rgb), 0.70) !important;
    border-radius: 2px !important;
    filter: drop-shadow(0 0 3px rgba(var(--primary-blue-rgb), 0.5)) !important;
    pointer-events: none !important;
    opacity: 0.7 !important;
    transition: opacity 0.4s ease, transform 0.4s ease !important;
    z-index: 2 !important;
}
/* Sağ-üstte canlı sinyal noktası */
.trust-item::after {
    content: "" !important;
    position: absolute !important;
    top: 14px !important;
    right: 14px !important;
    width: 5px !important;
    height: 5px !important;
    border-radius: 50% !important;
    background: var(--primary-blue) !important;
    box-shadow:
        0 0 0 2px rgba(var(--primary-blue-rgb), 0.18),
        0 0 6px rgba(var(--primary-blue-rgb), 0.7) !important;
    animation: trust-blink 2.4s ease-in-out infinite !important;
    z-index: 2 !important;
}
@keyframes trust-blink {
    0%, 60%, 100% { opacity: 1; }
    65%, 75%     { opacity: 0.2; }
}

.trust-item:hover {
    transform: translateY(-5px) !important;
    background: linear-gradient(180deg,
        rgba(var(--primary-blue-rgb), 0.10) 0%,
        rgba(var(--primary-blue-rgb), 0.02) 100%) !important;
    border-color: rgba(var(--primary-blue-rgb), 0.50) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 16px 36px rgba(var(--primary-blue-rgb), 0.18) !important;
}
.trust-item:hover::before {
    opacity: 1 !important;
    transform: translate(-2px, -2px) !important;
}

/* --- İkon konteyneri: gradient border ring + radial glow halo --- */
.trust-item .trust-icon {
    position: relative !important;
    width: 64px !important;
    height: 64px !important;
    border: none !important;
    border-radius: 16px !important;
    padding: 1px !important;
    margin: 8px auto 18px !important;
    background:
        radial-gradient(circle at 30% 25%,
            rgba(var(--primary-blue-rgb), 0.18) 0%,
            rgba(var(--primary-blue-rgb), 0.04) 70%)
        padding-box,
        linear-gradient(135deg,
            rgba(var(--primary-blue-rgb), 0.65) 0%,
            rgba(var(--primary-blue-rgb), 0.10) 50%,
            rgba(var(--primary-blue-rgb), 0.55) 100%)
        border-box !important;
    background-origin: border-box !important;
    box-shadow:
        0 0 0 4px rgba(var(--primary-blue-rgb), 0.05),
        0 0 20px rgba(var(--primary-blue-rgb), 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.10) !important;
    color: var(--primary-blue) !important;
    transition: transform 0.45s cubic-bezier(0.34, 1.56, 0.64, 1),
                box-shadow 0.4s ease !important;
    overflow: hidden !important;
}

/* İkonun arkasında nefes alan radial pulse */
.trust-item .trust-icon::before {
    content: "" !important;
    position: absolute !important;
    inset: -8px !important;
    border-radius: 50% !important;
    background: radial-gradient(circle,
        rgba(var(--primary-blue-rgb), 0.25) 0%,
        rgba(var(--primary-blue-rgb), 0.0) 60%) !important;
    pointer-events: none !important;
    animation: trust-pulse 3s ease-in-out infinite !important;
    z-index: 0 !important;
}
@keyframes trust-pulse {
    0%, 100% { transform: scale(0.85); opacity: 0.6; }
    50%      { transform: scale(1.05); opacity: 1; }
}

/* SVG / icon font drop-shadow */
.trust-item .trust-icon i,
.trust-item .trust-icon .fas,
.trust-item .trust-icon svg {
    position: relative !important;
    z-index: 1 !important;
    filter: drop-shadow(0 0 6px rgba(var(--primary-blue-rgb), 0.50))
            drop-shadow(0 2px 4px rgba(0, 0, 0, 0.25)) !important;
    transition: transform 0.4s ease, filter 0.4s ease !important;
}

/* Hover: ikon zıplar, dolu tema rengine döner */
.trust-item:hover .trust-icon {
    transform: scale(1.08) translateY(-2px) !important;
    background:
        radial-gradient(circle at 30% 25%,
            rgba(var(--primary-blue-rgb), 0.95) 0%,
            rgba(var(--primary-blue-rgb), 0.75) 100%)
        padding-box,
        linear-gradient(135deg,
            rgba(var(--primary-blue-rgb), 1.0) 0%,
            rgba(var(--primary-blue-rgb), 0.50) 50%,
            rgba(var(--primary-blue-rgb), 1.0) 100%)
        border-box !important;
    box-shadow:
        0 0 0 6px rgba(var(--primary-blue-rgb), 0.10),
        0 12px 28px rgba(var(--primary-blue-rgb), 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.20) !important;
    color: #ffffff !important;
}
.trust-item:hover .trust-icon i,
.trust-item:hover .trust-icon .fas,
.trust-item:hover .trust-icon svg {
    transform: scale(1.05) !important;
    filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.55))
            drop-shadow(0 2px 6px rgba(0, 0, 0, 0.35)) !important;
}

/* --- Başlık: Düz renk --- */
.trust-item .trust-info h4 {
    position: relative !important;
    color: var(--text-color) !important;
    letter-spacing: 1.5px !important;
    font-weight: 800 !important;
    padding-bottom: 10px !important;
    margin-bottom: 12px !important;
}
.trust-item .trust-info h4::after {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    bottom: 0 !important;
    width: 28px !important;
    height: 2px !important;
    margin-left: -14px !important;
    border-radius: 2px !important;
    background: linear-gradient(90deg,
        rgba(var(--primary-blue-rgb), 0) 0%,
        var(--primary-blue) 50%,
        rgba(var(--primary-blue-rgb), 0) 100%) !important;
    box-shadow: 0 0 8px rgba(var(--primary-blue-rgb), 0.55) !important;
    transition: width 0.4s ease, margin-left 0.4s ease !important;
}
.trust-item:hover .trust-info h4::after {
    width: 48px !important;
    margin-left: -24px !important;
}

.trust-item .trust-info p {
    color: var(--text-muted) !important;
    font-size: 12.5px !important;
    line-height: 1.65 !important;
    letter-spacing: 0.2px !important;
    font-family: 'Share Tech Mono', ui-monospace, monospace, var(--theme-font) !important;
}

@media (max-width: 992px) {
    .trust-section::before { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
    .trust-item::after,
    .trust-item .trust-icon::before { animation: none !important; }
}
/* End trust features HUD data nodes */

/* =========================================================================
   SATIN AL BUTTON — Future Theme | Sade Cyber Tag
   Kompakt, kibar, admin tema rengine bağlı.
   ========================================================================= */
.product-card-modern .btn-buy-modern,
.btn-buy-modern {
    position: relative !important;
    overflow: hidden !important;
    isolation: isolate !important;
    border: none !important;
    border-radius: 6px !important;
    /* sağ-üst köşesi ince kesilmiş tek-yön notch */
    clip-path: polygon(
        0 0,
        calc(100% - 9px) 0,
        100% 9px,
        100% 100%,
        0 100%
    ) !important;
    padding: 8px 14px !important;
    background: linear-gradient(135deg,
        var(--primary-blue) 0%,
        color-mix(in srgb, var(--primary-blue) 75%, #7b2cff 25%) 100%) !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    font-size: 11px !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.20),
        0 3px 10px rgba(var(--primary-blue-rgb), 0.25) !important;
    transition: transform 0.25s ease, box-shadow 0.3s ease !important;
}

/* Hover'da diyagonal ışık dalgası */
.btn-buy-modern::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background: linear-gradient(115deg,
        transparent 35%,
        rgba(255, 255, 255, 0.30) 50%,
        transparent 65%) !important;
    background-size: 220% 100% !important;
    background-position: -120% 0 !important;
    transition: background-position 0.7s ease !important;
    z-index: 1 !important;
}
.btn-buy-modern > *,
.btn-buy-modern i,
.btn-buy-modern .fas,
.btn-buy-modern svg,
.btn-buy-modern span {
    position: relative !important;
    z-index: 2 !important;
}
.btn-buy-modern i,
.btn-buy-modern .fas,
.btn-buy-modern svg {
    transition: transform 0.3s cubic-bezier(0.65, 0, 0.35, 1) !important;
    font-size: 11px !important;
}

.btn-buy-modern:hover {
    transform: translateY(-1px) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.28),
        0 6px 16px rgba(var(--primary-blue-rgb), 0.40),
        0 0 20px rgba(var(--primary-blue-rgb), 0.25) !important;
}
.btn-buy-modern:hover::after { background-position: 220% 0 !important; }
.btn-buy-modern:hover i,
.btn-buy-modern:hover .fas,
.btn-buy-modern:hover svg {
    transform: translateX(3px) !important;
}
.btn-buy-modern:active {
    transform: translateY(0) !important;
    box-shadow:
        inset 0 2px 4px rgba(0, 0, 0, 0.20),
        0 2px 6px rgba(var(--primary-blue-rgb), 0.25) !important;
}
/* End sade satın al */

/* =========================================================================
   HEADER NEON STRIP — Light mode: belirgin tema rengi
   ========================================================================= */
[data-theme="light"] .main-header::after {
    background: linear-gradient(90deg, transparent 0%, rgba(var(--primary-blue-rgb), 0.4) 20%, rgba(var(--primary-orange-rgb), 0.4) 80%, transparent 100%) !important;
    box-shadow: none !important;
    height: 1.5px !important;
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 5% !important;
    right: 5% !important;
    z-index: 10 !important;
    pointer-events: none !important;
    display: block !important;
}
/* End header neon strip light override */

/* =========================================================================
   FRESH PASS — Future Theme Softener
   Tüm efektleri tek noktada hafifletir / kapatır.
   Geri almak için: 'FRESH PASS' bloğunu tamamen sil.
   ========================================================================= */

/* 1) Header arka plan nokta-grid drift'i: sönükleşir, animasyonsuz */
.main-header::before {
    opacity: 0.18 !important;
    animation: none !important;
}

/* 2) Logo etrafındaki dönen yörünge + dönen nokta tamamen gizle */
.logo::before,
.logo::after {
    display: none !important;
}

/* 3) Arama kutusu HUD köşe braketlerini gizle (parıltıyı koru) */
.search-container::before,
.search-container::after {
    display: none !important;
}

/* 4) Header icon button'larındaki yeşil "live" sinyal noktası — gizle */
.actions .icon-btn::after,
.icon-btn::after {
    display: none !important;
}

/* 5) Notification badge pulse animasyonu — yumuşat ve durdur */
.notif-badge,
.notif-badge-mobile {
    animation: none !important;
    box-shadow: 0 0 0 2px rgba(255, 60, 90, 0.20),
                0 0 8px rgba(255, 60, 90, 0.45) !important;
    transform: none !important;
}

/* 6) Showcase TAB — kurumsal stil dosya sonunda yönetiliyor */

/* 7) Trust kartlarındaki sinyal noktası + radial pulse + HUD braket */
.trust-item::before,
.trust-item::after {
    display: none !important;
}
.trust-item .trust-icon::before {
    animation: none !important;
    opacity: 0.35 !important;
    transform: scale(0.95) !important;
}

/* 8) Hero ana slider HUD köşe braketleri (4 köşe) — gizle */
.hero-card.main-slide::after {
    display: none !important;
}
/* Hero yan banner HUD köşe braketleri — gizle */
.hero-card.side-card::after {
    display: none !important;
}

/* 9) Hero slider üzerinden akan shimmer overlay — kapat */
.hero-card.main-slide .card-overlay::before {
    animation: none !important;
    display: none !important;
}

/* 10) Blog kartı sol-üst HUD braketini daha sade yap */
.blog-card::before {
    width: 10px !important;
    height: 10px !important;
    opacity: 0.55 !important;
    filter: none !important;
}
.blog-card:hover::before {
    transform: none !important;
    opacity: 0.85 !important;
}

/* 11) Featured/section header alt nefes hattını sabit ve incelt */
.showcase-header::after {
    animation: none !important;
    opacity: 0.85 !important;
}

/* 12) Header alt neon şerit nefes animasyonu — kapat (parlaklık sabit) */
.main-header::after {
    animation: none !important;
    opacity: 0.9 !important;
}
/* End FRESH PASS softener */

/* =========================================================================
   HEADER-NAV ÜST AYIRICI — Hard çizgi yerine fade hairline
   ========================================================================= */
.header-nav {
    border-top: none !important;
    position: relative !important;
    padding: 10px 0 !important;
}
.header-nav::before {
    content: none !important;
    display: none !important;
}

[data-theme="light"] .header-nav {
    border-top: none !important;
}
[data-theme="light"] .header-nav::before {
    content: none !important;
    display: none !important;
}
/* End header-nav fade hairline */

/* =========================================================================
   ICON BUTTONS — Admin tema rengiyle uyumla (dark + light)
   ========================================================================= */
.actions .icon-btn,
.icon-btn {
    color: var(--primary-blue) !important;
    background: rgba(var(--primary-blue-rgb), 0.06) !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.20) !important;
}
.actions .icon-btn:hover,
.icon-btn:hover {
    color: var(--primary-blue) !important;
    background: rgba(var(--primary-blue-rgb), 0.12) !important;
    border-color: rgba(var(--primary-blue-rgb), 0.55) !important;
    box-shadow:
        0 0 0 3px rgba(var(--primary-blue-rgb), 0.10),
        0 0 18px rgba(var(--primary-blue-rgb), 0.35) !important;
}

[data-theme="light"] .actions .icon-btn,
[data-theme="light"] .icon-btn {
    color: var(--primary-blue) !important;
    background: rgba(255, 255, 255, 0.85) !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.22) !important;
    box-shadow: 0 1px 3px rgba(15, 35, 95, 0.04) !important;
}
[data-theme="light"] .actions .icon-btn:hover,
[data-theme="light"] .icon-btn:hover {
    color: var(--primary-blue) !important;
    background: #ffffff !important;
    border-color: var(--primary-blue) !important;
    box-shadow:
        0 0 0 3px rgba(var(--primary-blue-rgb), 0.12),
        0 6px 16px rgba(var(--primary-blue-rgb), 0.20) !important;
}
/* End icon buttons theme color */

/* =========================================================================
   HEADER REFINEMENT — Future Theme | Daha Sade
   Header'daki notched şekilleri ve animasyonları kibar pill'lere indirger.
   Geri almak için: 'HEADER REFINEMENT' bloğunu sil.
   ========================================================================= */

/* 1) ADMIN / Login butonu: notched → pill */
.btn.btn-login {
    clip-path: none !important;
    border-radius: 10px !important;
    padding: 8px 16px !important;
    letter-spacing: 0.5px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    font-size: 12px !important;
}
.btn.btn-login::before {
    display: none !important;
}

/* 2) TÜM KATEGORİLER: notched → pill, premium transition */
.btn-categories {
    clip-path: none !important;
    border-radius: 12px !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    background: linear-gradient(135deg, var(--primary-blue) 0%, var(--primary-orange) 100%) !important;
    border: none !important;
    color: #ffffff !important;
    padding: 8px 18px !important;
    font-weight: 700 !important;
    box-shadow: 0 4px 15px rgba(var(--primary-blue-rgb), 0.20) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.btn-categories::after {
    display: none !important;
}
.btn-categories:hover {
    transform: translateY(-1.5px) !important;
    box-shadow: 0 6px 20px rgba(var(--primary-blue-rgb), 0.30) !important;
    color: #ffffff !important;
    filter: brightness(1.08) !important;
}
[data-theme="light"] .btn-categories {
    background: linear-gradient(135deg, var(--primary-blue) 0%, var(--primary-orange) 100%) !important;
    box-shadow: 0 4px 15px rgba(var(--primary-blue-rgb), 0.15) !important;
}
[data-theme="light"] .btn-categories:hover {
    box-shadow: 0 6px 20px rgba(var(--primary-blue-rgb), 0.25) !important;
}

/* 3) İkon butonlar: 12px rounded, premium tactile styles */
.actions .icon-btn,
.icon-btn {
    border-radius: 12px !important;
    clip-path: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    background: rgba(255, 255, 255, 0.03) !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.actions .icon-btn:hover,
.icon-btn:hover {
    border-color: rgba(var(--primary-blue-rgb), 0.35) !important;
    background: rgba(255, 255, 255, 0.06) !important;
    color: var(--primary-blue) !important;
    transform: translateY(-2px) scale(1.05) !important;
    box-shadow: 0 4px 12px rgba(var(--primary-blue-rgb), 0.15) !important;
}
[data-theme="light"] .actions .icon-btn,
[data-theme="light"] .icon-btn {
    border: 1px solid rgba(15, 35, 95, 0.08) !important;
    background: rgba(255, 255, 255, 0.5) !important;
    box-shadow: 0 1px 3px rgba(15, 35, 95, 0.02) !important;
}
[data-theme="light"] .actions .icon-btn:hover,
[data-theme="light"] .icon-btn:hover {
    border-color: var(--primary-blue) !important;
    background: #ffffff !important;
    color: var(--primary-blue) !important;
    transform: translateY(-2px) scale(1.05) !important;
    box-shadow: 
        0 4px 12px rgba(var(--primary-blue-rgb), 0.1),
        0 2px 6px rgba(15, 35, 95, 0.03) !important;
}

/* 4) Cart wiggle animasyonu kapat */
.icon-btn.cart-btn:hover svg {
    animation: none !important;
}

/* 5) Arama kutusu: ince border + radius */
.search-container {
    border-radius: 12px !important;
}
[data-theme="light"] .search-container {
    border-width: 1px !important;
}
/* End HEADER REFINEMENT */

/* =========================================================================
   NAV ITEM EFFECTS — kaldır (HUD braket + hover bg)
   ========================================================================= */
.nav-item-modern {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-radius: 12px !important;
    padding: 6px 14px !important;
    margin: 0 4px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: rgba(255, 255, 255, 0.6) !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    transform: none !important;
}
.nav-item-modern::before,
.nav-item-modern::after {
    content: none !important;
    display: none !important;
}
.nav-item-modern:hover,
.nav-item-modern.active {
    background: rgba(var(--primary-blue-rgb), 0.1) !important;
    border-color: rgba(var(--primary-blue-rgb), 0.35) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(var(--primary-blue-rgb), 0.1) !important;
}
[data-theme="light"] .nav-item-modern {
    background: rgba(0, 0, 0, 0.02) !important;
    border: 1px solid rgba(0, 0, 0, 0.04) !important;
    color: #475569 !important;
}
[data-theme="light"] .nav-item-modern:hover,
[data-theme="light"] .nav-item-modern.active {
    background: rgba(var(--primary-blue-rgb), 0.06) !important;
    border-color: rgba(var(--primary-blue-rgb), 0.25) !important;
    color: var(--primary-blue) !important;
    box-shadow: 0 4px 12px rgba(var(--primary-blue-rgb), 0.06) !important;
    transform: translateY(-1px) !important;
}
.nav-item-modern img {
    width: 18px !important;
    height: 18px !important;
    object-fit: contain !important;
    border-radius: 4px !important;
    transition: transform 0.2s ease !important;
}
.nav-item-modern:hover img {
    transform: scale(1.1) !important;
}
/* End nav item effects removal */

/* =========================================================================
   TRUST FEATURES — Daha sade, dikdörtgen, minimal
   ========================================================================= */
.trust-item {
    border-radius: 6px !important;
    padding: 24px 20px !important;
    background: rgba(var(--primary-blue-rgb), 0.03) !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.15) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
.trust-item:hover {
    transform: none !important;
    border-color: rgba(var(--primary-blue-rgb), 0.30) !important;
    background: rgba(var(--primary-blue-rgb), 0.05) !important;
    box-shadow: none !important;
}

/* İkon: minimal dikdörtgen, fancy gradient ring kaldır */
.trust-item .trust-icon {
    width: 56px !important;
    height: 56px !important;
    border-radius: 6px !important;
    padding: 0 !important;
    background: rgba(var(--primary-blue-rgb), 0.08) !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.20) !important;
    box-shadow: none !important;
    margin: 0 auto 18px !important;
}
.trust-item .trust-icon::before { display: none !important; }
.trust-item:hover .trust-icon {
    transform: none !important;
    background: rgba(var(--primary-blue-rgb), 0.14) !important;
    border-color: rgba(var(--primary-blue-rgb), 0.40) !important;
    box-shadow: none !important;
    color: var(--primary-blue) !important;
}
.trust-item .trust-icon i,
.trust-item .trust-icon .fas,
.trust-item .trust-icon svg {
    filter: none !important;
    color: var(--primary-blue) !important;
}
.trust-item:hover .trust-icon i,
.trust-item:hover .trust-icon .fas,
.trust-item:hover .trust-icon svg {
    transform: none !important;
    filter: none !important;
    color: var(--primary-blue) !important;
}

/* Başlık altındaki gradient pill aksanı kaldır */
.trust-item .trust-info h4 {
    padding-bottom: 0 !important;
    margin-bottom: 10px !important;
    letter-spacing: 1px !important;
    font-weight: 700 !important;
}
.trust-item .trust-info h4::after { display: none !important; }

/* Açıklama: standart font, monospace değil */
.trust-item .trust-info p {
    font-family: inherit !important;
    letter-spacing: 0 !important;
}

/* Bölüm orta bağlantı izini de kaldır (sade görünüm için) */
.trust-section::before { display: none !important; }
/* End trust sade pass */

/* =========================================================================
   HERO SLIDER — Modern Corporate Layout Pass
   Sol hizalı, dikey ortalı, premium tipografi & boşluklar.
   Geri almak için: 'HERO SLIDER — Modern Corporate Layout Pass' bloğunu sil.
   ========================================================================= */

/* Overlay: sol dikey orta, generous padding */
.hero-main .card-overlay,
.hero-card.main-slide .card-overlay {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;
    padding: 56px 64px !important;
    gap: 0 !important;
}

/* Content: tight column */
.hero-main .card-content {
    max-width: 600px !important;
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    text-align: left !important;
    padding: 0 !important;
    gap: 0 !important;
}

/* 1) BADGE / Eyebrow — minimal pill */
.hero-main .slider-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 5px 12px !important;
    margin-bottom: 18px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(255, 255, 255, 0.35) !important;
    background: rgba(255, 255, 255, 0.10) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    color: #ffffff !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    letter-spacing: 1.8px !important;
    text-transform: uppercase !important;
    text-shadow: none !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.20) !important;
    clip-path: none !important;
}
.hero-main .slider-badge::before {
    content: "" !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background: var(--primary-blue) !important;
    box-shadow: 0 0 6px var(--primary-blue) !important;
    margin: 0 !important;
    display: inline-block !important;
}

/* 2) TITLE — kurumsal, sıkı tipografi */
.hero-main .card-title {
    font-size: 44px !important;
    line-height: 1.05 !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
    margin: 0 0 14px 0 !important;
    color: #ffffff !important;
    background: none !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: 0 4px 24px rgba(0, 0, 0, 0.45),
                 0 1px 2px rgba(0, 0, 0, 0.35) !important;
    filter: none !important;
    text-transform: none !important;
}

/* 3) DESCRIPTION — okunaklı, kompakt */
.hero-main .card-desc {
    font-size: 15px !important;
    line-height: 1.55 !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    max-width: 460px !important;
    margin: 0 0 26px 0 !important;
    color: rgba(255, 255, 255, 0.88) !important;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.45) !important;
}

/* 4) CTA BUTTON — pill, dolu tema rengi, premium */
.hero-main .slider-action-btn,
.slider-action-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 12px 28px !important;
    border-radius: 999px !important;
    clip-path: none !important;
    background: var(--primary-blue) !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    box-shadow:
        0 8px 22px rgba(var(--primary-blue-rgb), 0.40),
        inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
    transition: transform 0.25s ease, box-shadow 0.3s ease, background 0.3s ease !important;
}
.hero-main .slider-action-btn::before,
.slider-action-btn::before {
    display: none !important;
}
.hero-main .slider-action-btn:hover,
.slider-action-btn:hover {
    transform: translateY(-2px) !important;
    letter-spacing: 0.5px !important;
    background: color-mix(in srgb, var(--primary-blue) 88%, #ffffff 12%) !important;
    box-shadow:
        0 12px 30px rgba(var(--primary-blue-rgb), 0.55),
        inset 0 1px 0 rgba(255, 255, 255, 0.35) !important;
}

/* 5) Progress circle bottom-left konumu zaten absolute — refine */
.hero-main .slider-progress-wrapper {
    left: 28px !important;
    bottom: 28px !important;
}
.hero-main .progress-circle {
    width: 44px !important;
    height: 44px !important;
}
.hero-main .progress-text {
    font-size: 11px !important;
    font-family: 'Inter', system-ui, sans-serif, var(--theme-font) !important;
}

/* ─── TABLET (≤1024px) ─── */
@media (max-width: 1024px) {
    .hero-main .card-overlay,
    .hero-card.main-slide .card-overlay {
        padding: 36px 40px !important;
    }
    .hero-main .card-title { font-size: 34px !important; }
    .hero-main .card-desc  { font-size: 14px !important; margin-bottom: 22px !important; }
    .hero-main .slider-badge { font-size: 10px !important; margin-bottom: 14px !important; }
    .hero-main .slider-action-btn { padding: 6px 14px !important; font-size: 9px !important; }
    .hero-main .slider-progress-wrapper { left: 20px !important; bottom: 20px !important; }
}

/* ─── MOBILE (≤600px) ─── */
@media (max-width: 600px) {
    .hero-main .card-overlay,
    .hero-card.main-slide .card-overlay {
        padding: 22px 22px !important;
    }
    .hero-main .card-content { max-width: 100% !important; position: static !important; }
    .hero-main .slider-badge {
        padding: 4px 10px !important;
        font-size: 9px !important;
        letter-spacing: 1.5px !important;
        margin-bottom: 10px !important;
    }
    .hero-main .slider-badge::before {
        width: 5px !important;
        height: 5px !important;
    }
    .hero-main .card-title {
        font-size: 22px !important;
        line-height: 1.1 !important;
        letter-spacing: -0.5px !important;
        margin-bottom: 8px !important;
    }
    .hero-main .card-desc {
        font-size: 12px !important;
        line-height: 1.45 !important;
        max-width: 100% !important;
        margin-bottom: 14px !important;
    }
    .hero-main .slider-action-btn {
        padding: 5px 12px !important;
        font-size: 8px !important;
        letter-spacing: 0.3px !important;
        gap: 5px !important;
        position: absolute !important;
        left: 14px !important;
        bottom: 14px !important;
        z-index: 10 !important;
    }
    .hero-main .slider-progress-wrapper {
        left: auto !important;
        right: 14px !important;
        bottom: 14px !important;
        z-index: 10 !important;
    }
    .hero-main .progress-circle { width: 32px !important; height: 32px !important; }
    .hero-main .progress-text   { font-size: 9px !important; }
}
/* End HERO SLIDER — Modern Corporate Layout Pass */

/* =========================================================================
   HERO SLIDER — Future Signature Pass
   Modern corporate layout üstüne Future imzası: aksan çizgisi, sweep, neon ring.
   Geri almak için: 'HERO SLIDER — Future Signature Pass' bloğunu sil.
   ========================================================================= */

/* Slider içerik bloğuna ince sol-aksan vertical bar */
.hero-main .card-content {
    position: relative !important;
    padding-left: 16px !important;
}
.hero-main .card-content::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 18% !important;
    bottom: 18% !important;
    width: 2px !important;
    border-radius: 2px !important;
    background: linear-gradient(180deg,
        rgba(var(--primary-blue-rgb), 0) 0%,
        var(--primary-blue) 30%,
        var(--primary-blue) 70%,
        rgba(var(--primary-blue-rgb), 0) 100%) !important;
    box-shadow: 0 0 10px rgba(var(--primary-blue-rgb), 0.55) !important;
    pointer-events: none !important;
}

/* Badge: soft tema rengi halo */
.hero-main .slider-badge {
    box-shadow:
        0 2px 8px rgba(0, 0, 0, 0.20),
        0 0 14px rgba(var(--primary-blue-rgb), 0.18) !important;
}

/* Başlık altına kısa gradient aksan pili */
.hero-main .card-title {
    position: relative !important;
    padding-bottom: 14px !important;
}
.hero-main .card-title::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    bottom: 0 !important;
    width: 60px !important;
    height: 3px !important;
    border-radius: 3px !important;
    background: linear-gradient(90deg,
        var(--primary-blue) 0%,
        rgba(var(--primary-blue-rgb), 0) 100%) !important;
    box-shadow: 0 0 10px rgba(var(--primary-blue-rgb), 0.6) !important;
}

/* CTA: hover'da diyagonal ışık dalgası sweep */
.hero-main .slider-action-btn,
.slider-action-btn {
    position: relative !important;
    overflow: hidden !important;
    isolation: isolate !important;
}
.hero-main .slider-action-btn::after,
.slider-action-btn::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background: linear-gradient(115deg,
        transparent 35%,
        rgba(255, 255, 255, 0.35) 50%,
        transparent 65%) !important;
    background-size: 220% 100% !important;
    background-position: -120% 0 !important;
    transition: background-position 0.75s ease !important;
    z-index: 1 !important;
    border-radius: inherit !important;
}
.hero-main .slider-action-btn > *,
.slider-action-btn > * {
    position: relative !important;
    z-index: 2 !important;
}
.hero-main .slider-action-btn:hover::after,
.slider-action-btn:hover::after {
    background-position: 220% 0 !important;
}

/* Progress ring: neon tema rengi stroke */
.hero-main .circular-chart .circle-bg {
    stroke: rgba(255, 255, 255, 0.15) !important;
    stroke-width: 2 !important;
}
.hero-main .circular-chart .circle-progress {
    stroke: var(--primary-blue) !important;
    stroke-width: 2.5 !important;
    filter: drop-shadow(0 0 4px var(--primary-blue))
            drop-shadow(0 0 8px rgba(var(--primary-blue-rgb), 0.45)) !important;
}
.hero-main .progress-circle {
    filter: drop-shadow(0 0 6px rgba(var(--primary-blue-rgb), 0.30)) !important;
}
.hero-main .progress-text {
    color: #ffffff !important;
    text-shadow: 0 0 8px rgba(var(--primary-blue-rgb), 0.6) !important;
}

/* Responsive: sol-aksan & başlık altı pill mobilde küçülsün */
@media (max-width: 600px) {
    .hero-main .card-content { padding-left: 12px !important; }
    .hero-main .card-title { padding-bottom: 10px !important; }
    .hero-main .card-title::after { width: 40px !important; height: 2px !important; }
}
/* End HERO SLIDER — Future Signature Pass */

/* =========================================================================
   SATIN AL — Daha sade pass
   ========================================================================= */
.product-card-modern .btn-buy-modern,
.btn-buy-modern {
    clip-path: none !important;
    border-radius: 8px !important;
    background: var(--primary-blue) !important;
    box-shadow: 0 2px 8px rgba(var(--primary-blue-rgb), 0.25) !important;
}
.btn-buy-modern::before,
.btn-buy-modern::after {
    display: none !important;
}
.btn-buy-modern:hover {
    background: color-mix(in srgb, var(--primary-blue) 90%, #ffffff 10%) !important;
    box-shadow: 0 4px 12px rgba(var(--primary-blue-rgb), 0.35) !important;
    transform: translateY(-1px) !important;
}
/* End SATIN AL sade pass */

/* =========================================================================
   SEARCH BAR — Daha sade pass
   ========================================================================= */
.search-container {
    clip-path: none !important;
    border-radius: 12px !important;
}
.search-container::before,
.search-container::after { display: none !important; }
.search-container .search-input,
.search-input,
.search-container .search-input:focus,
.search-input:focus {
    font-family: inherit !important;
    letter-spacing: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    outline: none !important;
    background: transparent !important;
    box-shadow: none !important;
    clip-path: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
.search-container .search-input::placeholder,
.search-input::placeholder {
    letter-spacing: 0 !important;
}

[data-theme="light"] .search-container {
    background: rgba(0, 0, 0, 0.02) !important;
    border: 1px solid rgba(15, 35, 95, 0.08) !important;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.02) !important;
    border-radius: 12px !important;
}
[data-theme="light"] .search-container:hover {
    border-color: rgba(var(--primary-blue-rgb), 0.25) !important;
    background: rgba(0, 0, 0, 0.03) !important;
}
[data-theme="light"] .search-container:focus-within {
    border-color: var(--primary-blue) !important;
    background: #ffffff !important;
    box-shadow: 
        0 0 0 4px rgba(var(--primary-blue-rgb), 0.12),
        0 4px 16px rgba(var(--primary-blue-rgb), 0.06) !important;
}
/* End SEARCH BAR sade */

/* =========================================================================
   VITRIN PAGE — Future Theme Premium Pass
   Geri almak için: 'VITRIN PAGE — Future Theme Premium Pass' bloğunu sil.
   ========================================================================= */

/* ─── HERO ─── */
.vt-hero {
    background:
        radial-gradient(ellipse 100% 60% at 50% 0%,
            rgba(var(--primary-blue-rgb), 0.20) 0%,
            transparent 60%),
        linear-gradient(180deg, #03060f 0%, #060b1c 100%) !important;
    padding: 80px 24px 64px !important;
    border-bottom: 1px solid rgba(var(--primary-blue-rgb), 0.15) !important;
    box-shadow: 0 1px 0 rgba(var(--primary-blue-rgb), 0.10),
                0 0 80px rgba(var(--primary-blue-rgb), 0.08) inset !important;
}
/* Orb'ları sönükleştir */
.vt-orb { opacity: 0.7 !important; animation-duration: 14s !important; }
.vt-orb-2 {
    background: radial-gradient(circle,
        rgba(var(--primary-blue-rgb), 0.14) 0%, transparent 70%) !important;
}

/* Grid bg: tema rengiyle uyumlu hafif çizgi */
.vt-grid-bg {
    background-image:
        linear-gradient(rgba(var(--primary-blue-rgb), 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(var(--primary-blue-rgb), 0.05) 1px, transparent 1px) !important;
}

/* Badge pill */
.vt-badge-pill {
    padding: 6px 18px !important;
    font-size: 11px !important;
    letter-spacing: 1.8px !important;
    text-transform: uppercase !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    box-shadow:
        0 4px 18px rgba(0, 0, 0, 0.30),
        0 0 0 4px rgba(255, 255, 255, 0.04) !important;
}
.vt-badge-pill::before {
    content: "" !important;
    width: 6px !important; height: 6px !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    box-shadow: 0 0 6px rgba(255, 255, 255, 0.7) !important;
    margin-right: 2px !important;
    display: inline-block !important;
}

/* Title: gradient text */
.vt-hero h1 {
    background: linear-gradient(135deg,
        #ffffff 0%,
        #cfefff 60%,
        var(--primary-blue) 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    text-shadow: none !important;
    filter: drop-shadow(0 6px 30px rgba(var(--primary-blue-rgb), 0.35)) !important;
    letter-spacing: -2px !important;
}
.vt-hero-desc {
    color: rgba(207, 232, 255, 0.7) !important;
    font-size: 15px !important;
}

/* Stats: premium glass kartı */
.vt-hero-stats {
    background: linear-gradient(180deg,
        rgba(255, 255, 255, 0.06) 0%,
        rgba(255, 255, 255, 0.02) 100%) !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.25) !important;
    border-radius: 14px !important;
    padding: 14px 30px !important;
    box-shadow:
        0 8px 30px rgba(0, 0, 0, 0.30),
        0 0 0 4px rgba(var(--primary-blue-rgb), 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}
.vt-stat-val {
    background: linear-gradient(135deg, #ffffff 0%, var(--primary-blue) 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
.vt-stat-lbl {
    letter-spacing: 1.5px !important;
    font-weight: 700 !important;
}

/* ─── SECTION HEADER ─── */
.vt-section-head {
    position: relative !important;
    padding: 2px 16px !important;
    border-radius: 10px !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.30) !important;
    background: linear-gradient(180deg,
        rgba(var(--primary-blue-rgb), 0.03) 0%,
        rgba(var(--primary-blue-rgb), 0.00) 100%) !important;
    box-shadow:
        inset 0 0 0 1px rgba(var(--primary-blue-rgb), 0.06),
        0 0 8px rgba(var(--primary-blue-rgb), 0.15) !important;
    backdrop-filter: blur(6px) !important;
}
.vt-section-head::after {
    content: "" !important;
    position: absolute !important;
    left: 22px !important;
    right: 22px !important;
    bottom: -1px !important;
    height: 1px !important;
    pointer-events: none !important;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(var(--primary-blue-rgb), 0.55) 50%,
        transparent 100%) !important;
    box-shadow: 0 0 4px rgba(var(--primary-blue-rgb), 0.40) !important;
}

.vt-section-title {
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    background: linear-gradient(135deg,
        var(--text-color) 0%,
        var(--primary-blue) 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
.vt-section-title::before {
    width: 3px !important;
    height: 16px !important;
    border-radius: 3px !important;
    background: linear-gradient(180deg,
        rgba(var(--primary-blue-rgb), 0) 0%,
        var(--primary-blue) 50%,
        rgba(var(--primary-blue-rgb), 0) 100%) !important;
    box-shadow: 0 0 8px rgba(var(--primary-blue-rgb), 0.6) !important;
}
.vt-count-badge {
    border-radius: 999px !important;
    font-weight: 700 !important;
    letter-spacing: 0.3px !important;
}

/* ─── PRODUCT CARDS — Future neon frame ─── */
.vt-products { gap: 22px !important; }
.vt-products .product-card-modern {
    border-radius: 12px !important;
    border: 1.5px solid var(--primary-blue) !important;
    box-shadow: inset 0 0 0 1px rgba(var(--primary-blue-rgb), 0.25) !important;
    background: linear-gradient(180deg,
        rgba(var(--primary-blue-rgb), 0.04) 0%,
        rgba(var(--primary-blue-rgb), 0.00) 60%) !important;
    overflow: hidden !important;
    transition: transform 0.3s ease, box-shadow 0.35s ease !important;
}
.vt-products .product-card-modern:hover {
    transform: translateY(-3px) !important;
    box-shadow:
        inset 0 0 0 1px rgba(var(--primary-blue-rgb), 0.35),
        0 8px 20px rgba(0, 0, 0, 0.20) !important;
}

/* "ÇOK SATAN" marquee'yi sadeleştir — daha ince */
.vt-products .product-badge {
    height: 22px !important;
    background: linear-gradient(90deg,
        rgba(0, 0, 0, 0.55),
        rgba(0, 0, 0, 0.30)) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}
.vt-products .product-badge .badge-item {
    font-size: 10px !important;
    letter-spacing: 1.5px !important;
    font-weight: 700 !important;
}

/* Discount mini badge: pill */
.vt-products .bogo-badge {
    border-radius: 999px !important;
    padding: 3px 9px !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 0.5px !important;
    box-shadow: 0 2px 8px rgba(239, 68, 68, 0.35) !important;
}

/* Ürün image-area: tema renginde subtle vinyet */
.vt-products .product-image-area {
    background:
        radial-gradient(ellipse at center,
            rgba(var(--primary-blue-rgb), 0.06) 0%,
            #050c1e 70%) !important;
}

/* Product info area: padding refine */
.vt-products .product-info-area {
    padding: 14px !important;
    background: rgba(255, 255, 255, 0.02) !important;
}
.vt-products .product-name-small {
    font-size: 11px !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    margin-bottom: 10px !important;
}

/* HEMEN AL butonu: tema rengiyle uyumlu sade pill */
.vt-buy-btn {
    background: var(--primary-blue) !important;
    border-radius: 8px !important;
    padding: 10px !important;
    font-size: 12px !important;
    letter-spacing: 0.5px !important;
    box-shadow: 0 2px 8px rgba(var(--primary-blue-rgb), 0.25) !important;
    transition: transform 0.25s ease, box-shadow 0.3s ease, background 0.3s ease !important;
}
.vt-buy-btn:hover {
    opacity: 1 !important;
    background: color-mix(in srgb, var(--primary-blue) 90%, #ffffff 10%) !important;
    box-shadow: 0 6px 16px rgba(var(--primary-blue-rgb), 0.40) !important;
}

/* Light mode hero için ayarlamalar */
[data-theme="light"] .vt-hero {
    background:
        radial-gradient(ellipse 100% 60% at 50% 0%,
            rgba(var(--primary-blue-rgb), 0.10) 0%,
            transparent 60%),
        linear-gradient(180deg, #ffffff 0%, #f1f6ff 100%) !important;
    border-bottom: 1px solid rgba(var(--primary-blue-rgb), 0.15) !important;
}
[data-theme="light"] .vt-hero h1 {
    background: linear-gradient(135deg,
        var(--text-color, #0f1729) 0%,
        var(--primary-blue) 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
[data-theme="light"] .vt-hero-desc { color: #475569 !important; }
[data-theme="light"] .vt-hero-stats {
    background: rgba(255, 255, 255, 0.85) !important;
    box-shadow:
        0 6px 20px rgba(15, 35, 95, 0.06),
        0 0 0 4px rgba(var(--primary-blue-rgb), 0.04) !important;
}
[data-theme="light"] .vt-stat-val {
    background: linear-gradient(135deg, var(--text-color, #0f1729) 0%, var(--primary-blue) 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
[data-theme="light"] .vt-stat-lbl { color: #64748b !important; }
[data-theme="light"] .vt-stat-sep { background: rgba(15, 35, 95, 0.10) !important; }

[data-theme="light"] .vt-products .product-card-modern {
    background: #ffffff !important;
}
[data-theme="light"] .vt-products .product-image-area {
    background:
        radial-gradient(ellipse at center,
            rgba(var(--primary-blue-rgb), 0.05) 0%,
            #f6faff 70%) !important;
}
[data-theme="light"] .vt-products .product-info-area {
    background: #ffffff !important;
}

/* End VITRIN PAGE — Future Theme Premium Pass */

/* =========================================================================
   VITRIN HERO — Tema renginde arka plan + içerik refresh
   ========================================================================= */

/* Hero: tema renginde gradient wash (her iki mode için) */
.vt-hero {
    background: linear-gradient(135deg,
        rgba(var(--primary-blue-rgb), 1) 0%,
        color-mix(in srgb, var(--primary-blue) 78%, #7b2cff 22%) 100%) !important;
    border-bottom: none !important;
    box-shadow: inset 0 -40px 60px rgba(0, 0, 0, 0.15) !important;
    color: #ffffff !important;
    padding: 70px 24px 64px !important;
}

/* Grid bg üstüne beyaz subtle dots */
.vt-hero .vt-grid-bg {
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.06) 1px, transparent 1px) !important;
    background-size: 38px 38px !important;
}

/* Orb'lar: beyaz halo'lar */
.vt-orb-1 {
    background: radial-gradient(circle,
        rgba(255, 255, 255, 0.18) 0%, transparent 70%) !important;
}
.vt-orb-2 {
    background: radial-gradient(circle,
        rgba(255, 255, 255, 0.12) 0%, transparent 70%) !important;
}
.vt-orb-3 {
    background: radial-gradient(circle,
        rgba(255, 255, 255, 0.08) 0%, transparent 70%) !important;
}

/* Badge pill: beyaz cam + tema rengi text */
.vt-badge-pill {
    background: rgba(255, 255, 255, 0.95) !important;
    color: var(--primary-blue) !important;
    border: 1px solid rgba(255, 255, 255, 0.6) !important;
    box-shadow:
        0 4px 18px rgba(0, 0, 0, 0.18),
        0 0 0 4px rgba(255, 255, 255, 0.10) !important;
}
.vt-badge-pill::before {
    background: var(--primary-blue) !important;
    box-shadow: 0 0 6px rgba(var(--primary-blue-rgb), 0.7) !important;
}

/* Başlık: temiz beyaz, gradient kaldır */
.vt-hero h1 {
    background: none !important;
    -webkit-text-fill-color: #ffffff !important;
    color: #ffffff !important;
    filter: drop-shadow(0 4px 24px rgba(0, 0, 0, 0.30)) !important;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.20) !important;
    letter-spacing: -2px !important;
    font-weight: 900 !important;
}

/* Description: yumuşak beyaz */
.vt-hero-desc {
    color: rgba(255, 255, 255, 0.88) !important;
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.20) !important;
}

/* Stats kartı: beyaz cam panel */
.vt-hero-stats {
    background: rgba(255, 255, 255, 0.95) !important;
    border: 1px solid rgba(255, 255, 255, 0.6) !important;
    border-radius: 16px !important;
    padding: 16px 32px !important;
    box-shadow:
        0 12px 32px rgba(0, 0, 0, 0.20),
        0 0 0 6px rgba(255, 255, 255, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 1) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
}
.vt-stat-val {
    background: linear-gradient(135deg,
        var(--text-color, #0f1729) 0%,
        var(--primary-blue) 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    font-size: 24px !important;
}
.vt-stat-lbl {
    color: #64748b !important;
    letter-spacing: 1.5px !important;
}
.vt-stat-sep { background: rgba(15, 35, 95, 0.10) !important; }

/* Light mode için aynı tema renkli hero — override (önceki light kuralı ezilsin) */
[data-theme="light"] .vt-hero {
    background: linear-gradient(135deg,
        rgba(var(--primary-blue-rgb), 1) 0%,
        color-mix(in srgb, var(--primary-blue) 78%, #7b2cff 22%) 100%) !important;
    border-bottom: none !important;
    color: #ffffff !important;
}
[data-theme="light"] .vt-hero h1 {
    background: none !important;
    -webkit-text-fill-color: #ffffff !important;
    color: #ffffff !important;
}
[data-theme="light"] .vt-hero-desc { color: rgba(255, 255, 255, 0.88) !important; }
[data-theme="light"] .vt-hero-stats {
    background: rgba(255, 255, 255, 0.95) !important;
}
/* End VITRIN HERO theme color */

/* =========================================================================
   VITRIN ÜRÜN KARTLARI — Kare görsel + çerçeve uyumu
   ========================================================================= */

/* Kart kendi overflow hidden olmalı ki badge bar köşeyi taşmasın */
.vt-products .product-card-modern {
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
}

/* "ÇOK SATAN" üst marquee: kartın rounded köşelerine uy */
.vt-products .product-badge {
    border-top-left-radius: 10px !important;
    border-top-right-radius: 10px !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    position: relative !important;
    flex-shrink: 0 !important;
}

/* Görsel alanı: 1:1 kare (1000x1000 oran) */
.vt-products .product-image-area {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}
.vt-products .product-char-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
}

/* Indirim badge: sağ-üstte, görsel üzerinde sabit */
.vt-products .bogo-badge {
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    z-index: 4 !important;
}

/* Info area: kalan alanı doldur (kart yüksekliği uyumlu) */
.vt-products .product-info-area {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding: 14px !important;
}

/* Hemen Al butonu en alta dayalı kalsın */
.vt-products .vt-buy-btn {
    margin-top: auto !important;
}

/* Grid: kare ile uyumlu kart genişliği */
.vt-products {
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important;
    gap: 22px !important;
}

@media (max-width: 768px) {
    .vt-products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px !important;
    }
}
@media (max-width: 400px) {
    .vt-products { gap: 10px !important; }
}
/* End vitrin kart kare görsel */

/* =========================================================================
   VITRIN GRID — Maks 6 sütun, responsive ölçek
   ========================================================================= */
.vt-products {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 16px !important;
}

/* Kart bilgi alanını kompakt yap (6 sütuna sığsın) */
.vt-products .product-info-area {
    padding: 10px !important;
    gap: 6px !important;
}
.vt-products .product-name-small {
    font-size: 10px !important;
    letter-spacing: 0.5px !important;
    margin-bottom: 6px !important;
}
.vt-products .product-badge {
    height: 18px !important;
}
.vt-products .product-badge .badge-item {
    font-size: 9px !important;
    letter-spacing: 1px !important;
}
.vt-products .vt-buy-btn {
    padding: 8px !important;
    font-size: 11px !important;
    letter-spacing: 0.3px !important;
    gap: 5px !important;
}
.vt-products .bogo-badge {
    padding: 2px 7px !important;
    font-size: 9px !important;
}

/* Fiyat alanı kompakt */
.vt-products .current-price-v2 {
    font-size: 15px !important;
}
.vt-products .currency-v2 {
    font-size: 11px !important;
}
.vt-products .old-price-v2 {
    font-size: 11px !important;
}
.vt-products .discount-badge-v2 {
    font-size: 9px !important;
    padding: 2px 6px !important;
}
.vt-products .rating-badge-v2 {
    font-size: 10px !important;
    padding: 2px 7px !important;
}

/* Responsive: küçük ekranlarda kademeli azalt */
@media (max-width: 1200px) {
    .vt-products { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
}
@media (max-width: 1000px) {
    .vt-products { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}
@media (max-width: 768px) {
    .vt-products { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 10px !important; }
}
@media (max-width: 520px) {
    .vt-products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; }
    .vt-products .product-name-small { font-size: 9px !important; }
    .vt-products .vt-buy-btn { padding: 7px !important; font-size: 10px !important; }
}
/* End vitrin grid 6 col */

/* =========================================================================
   VITRIN FILTER BAR — Future Theme
   ========================================================================= */
.vt-filter-bar {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
    padding: 12px 16px !important;
    margin: 0 0 20px 0 !important;
    border-radius: 12px !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.18) !important;
    background: linear-gradient(180deg,
        rgba(var(--primary-blue-rgb), 0.04) 0%,
        rgba(var(--primary-blue-rgb), 0.00) 100%) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

/* Search */
.vt-filter-search {
    position: relative !important;
    flex: 1 1 240px !important;
    min-width: 220px !important;
    display: flex !important;
    align-items: center !important;
}
.vt-filter-search i {
    position: absolute !important;
    left: 12px !important;
    color: var(--primary-blue) !important;
    font-size: 12px !important;
    pointer-events: none !important;
}
.vt-filter-search input {
    width: 100% !important;
    padding: 9px 12px 9px 32px !important;
    border-radius: 8px !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.20) !important;
    background: rgba(255, 255, 255, 0.04) !important;
    color: var(--text-color) !important;
    font-size: 13px !important;
    outline: none !important;
    transition: border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease !important;
}
.vt-filter-search input::placeholder { opacity: 0.6 !important; }
.vt-filter-search input:focus {
    border-color: var(--primary-blue) !important;
    background: rgba(255, 255, 255, 0.06) !important;
    box-shadow: 0 0 0 3px rgba(var(--primary-blue-rgb), 0.12) !important;
}

/* Chips */
.vt-filter-chips {
    display: flex !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
}
.vt-chip {
    appearance: none !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.22) !important;
    background: transparent !important;
    color: var(--text-color) !important;
    padding: 8px 14px !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    transition: border-color 0.25s ease, background 0.25s ease,
                color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease !important;
}
.vt-chip i { font-size: 10px !important; opacity: 0.75 !important; }
.vt-chip:hover {
    border-color: rgba(var(--primary-blue-rgb), 0.55) !important;
    color: var(--primary-blue) !important;
    background: rgba(var(--primary-blue-rgb), 0.05) !important;
}
.vt-chip.active {
    background: var(--primary-blue) !important;
    border-color: var(--primary-blue) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(var(--primary-blue-rgb), 0.30) !important;
}
.vt-chip.active i { opacity: 1 !important; }

/* Sort dropdown */
.vt-filter-sort {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-left: auto !important;
}
.vt-filter-sort i {
    color: var(--primary-blue) !important;
    font-size: 12px !important;
}
.vt-filter-sort select {
    appearance: none !important;
    -webkit-appearance: none !important;
    padding: 9px 30px 9px 12px !important;
    border-radius: 8px !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.22) !important;
    background-color: rgba(255, 255, 255, 0.04) !important;
    background-image: linear-gradient(45deg, transparent 50%, var(--primary-blue) 50%),
                      linear-gradient(135deg, var(--primary-blue) 50%, transparent 50%) !important;
    background-position: calc(100% - 16px) 50%, calc(100% - 11px) 50% !important;
    background-size: 5px 5px, 5px 5px !important;
    background-repeat: no-repeat !important;
    color: var(--text-color) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    outline: none !important;
    transition: border-color 0.25s ease !important;
}
.vt-filter-sort select:focus,
.vt-filter-sort select:hover {
    border-color: var(--primary-blue) !important;
}

/* Light mode */
[data-theme="light"] .vt-filter-bar {
    background: #ffffff !important;
    border: 1px solid rgba(15, 35, 95, 0.10) !important;
    box-shadow: 0 1px 3px rgba(15, 35, 95, 0.05) !important;
}
[data-theme="light"] .vt-filter-search input,
[data-theme="light"] .vt-filter-sort select {
    background-color: #f8fbff !important;
    border-color: rgba(15, 35, 95, 0.10) !important;
}

/* Empty results */
.vt-no-results {
    grid-column: 1 / -1 !important;
    text-align: center !important;
    padding: 60px 20px !important;
    color: var(--text-muted, #94a3b8) !important;
}
.vt-no-results i {
    font-size: 36px !important;
    opacity: 0.3 !important;
    margin-bottom: 14px !important;
    display: block !important;
}
.vt-no-results p {
    font-size: 14px !important;
    margin: 0 !important;
}

@media (max-width: 768px) {
    .vt-filter-bar { padding: 10px 12px !important; gap: 8px !important; }
    .vt-filter-search { flex-basis: 100% !important; min-width: 0 !important; }
    .vt-filter-sort { margin-left: 0 !important; flex: 1 1 auto !important; }
    .vt-filter-sort select { width: 100% !important; }
}
/* End VITRIN FILTER BAR */

/* Vitrin filter — gizleme kuralı (display:flex !important'ı yener) */
.vt-products .product-card-modern.vt-hidden,
.vt-card.vt-hidden { display: none !important; }

/* =========================================================================
   VITRIN — Üst marquee'yi temiz hale getir
   ========================================================================= */
.vt-products .product-card-modern {
    position: relative !important;
}
/* Marquee artık görsel ÜZERİNDE absolute olarak otursun, neon border ezilmesin */
.vt-products .product-badge {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    height: 22px !important;
    z-index: 3 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg,
        rgba(0, 0, 0, 0.55) 0%,
        rgba(0, 0, 0, 0.35) 100%) !important;
    backdrop-filter: blur(4px) !important;
    -webkit-backdrop-filter: blur(4px) !important;
    border-bottom: 1px solid rgba(var(--primary-blue-rgb), 0.25) !important;
    overflow: hidden !important;
    -webkit-mask-image: linear-gradient(90deg,
        transparent 0%, #000 8%, #000 92%, transparent 100%) !important;
    mask-image: linear-gradient(90deg,
        transparent 0%, #000 8%, #000 92%, transparent 100%) !important;
}
.vt-products .product-badge .badge-item {
    font-size: 9px !important;
    letter-spacing: 1.2px !important;
    color: rgba(255, 255, 255, 0.85) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) !important;
}
/* Görsel alanı marquee yüksekliği kadar üstten boşluk alsın (üst üste binmesin) */
.vt-products .product-image-area {
    padding-top: 22px !important;
}
/* End vitrin badge temiz */

/* Section header ↔ tabs arası boşluğu azalt */
.showcase-header { margin-bottom: 8px !important; }
.showcase-tabs   { margin: 6px 0 14px 0 !important; }

/* =========================================================================
   MOBILE FIXES — Section header + product cards
   ========================================================================= */
@media (max-width: 768px) {
    /* Section header'da köşe çentiği/glitch sorunu — rounded korunsun */
    .showcase-header {
        padding: 4px 12px !important;
        margin: 0 8px 8px 8px !important;
        border-radius: 10px !important;
    }
    .showcase-header::before,
    .showcase-header::after {
        left: 12px !important;
        right: 12px !important;
    }
    .showcase-title-wrapper { gap: 8px !important; }
    .showcase-title-icon { width: 26px !important; height: 26px !important; }
    .showcase-title { font-size: 13px !important; letter-spacing: 0.3px !important; }
    .view-all-link {
        padding: 5px 4px 5px 10px !important;
        font-size: 10px !important;
        letter-spacing: 0.2px !important;
    }
    .view-all-link i,
    .view-all-link .fas {
        width: 18px !important;
        height: 18px !important;
        font-size: 9px !important;
    }

    /* Product cards: gereksiz dikey boşluğu kaldır, kompakt yap */
    .product-card-modern .product-info-area {
        padding: 10px !important;
        gap: 6px !important;
    }
    .product-card-modern .product-name-small {
        font-size: 11px !important;
        margin-bottom: 4px !important;
        -webkit-line-clamp: 2 !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }
    .product-card-modern .product-info-row-v2 {
        margin-bottom: 0 !important;
    }
    .product-card-modern .current-price-v2 { font-size: 14px !important; }
    .product-card-modern .currency-v2 { font-size: 10px !important; }
    .product-card-modern .old-price-v2 { font-size: 10px !important; }
    .product-card-modern .discount-badge-v2 {
        font-size: 9px !important;
        padding: 1px 5px !important;
    }
    .product-card-modern .rating-badge-v2 {
        font-size: 10px !important;
        padding: 1px 6px !important;
    }
    .product-card-modern .btn-buy-modern {
        padding: 7px 10px !important;
        font-size: 10px !important;
        letter-spacing: 0.3px !important;
        margin-top: 4px !important;
    }

    /* "ÇOK SATAN" marquee mobilde daha ince */
    .product-card-modern .product-badge {
        height: 18px !important;
    }
    .product-card-modern .product-badge .badge-item {
        font-size: 8px !important;
        letter-spacing: 0.8px !important;
    }

    /* 1 ALANA 1 BEDAVA badge daha kompakt */
    .product-card-modern .bogo-badge {
        font-size: 8px !important;
        padding: 2px 6px !important;
        top: 6px !important;
        right: 6px !important;
    }
}
/* End mobile fixes */

/* Ürün kartları: daha keskin köşeler */
.product-card-modern,
.vt-products .product-card-modern { border-radius: 6px !important; }
.product-card-modern .product-image-area { border-radius: 0 !important; }
.product-card-modern .product-badge {
    border-top-left-radius: 6px !important;
    border-top-right-radius: 6px !important;
}

/* Mobil: SATIN AL butonları tüm kartlarda aynı hizada */
@media (max-width: 768px) {
    .product-card-modern {
        display: flex !important;
        flex-direction: column !important;
    }
    .product-card-modern .product-info-area {
        display: flex !important;
        flex-direction: column !important;
        padding: 8px 10px !important;
        flex: 1 1 auto !important;
        gap: 4px !important;
    }
    /* Ürün adı: tam 2 satır yüksekliğinde sabitle */
    .product-card-modern .product-name-small {
        min-height: 2.6em !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;
    }
    .product-card-modern .product-info-row-v2 {
        margin-bottom: 0 !important;
        min-height: unset !important;
    }
    /* Buton: flex sonunda, tam genişlik */
    .product-card-modern .btn-buy-modern {
        display: flex !important;
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 9px 10px !important;
        margin: auto 0 0 0 !important;
        gap: 6px !important;
        align-items: center !important;
        justify-content: center !important;
        clip-path: none !important;
        font-size: 11px !important;
    }
}

/* ════════════════════════════════════════════════════════
   PREDUNYA — ÖZEL KART LAYOUT
   Başlık → Fiyat (sol) + SATIN AL (sağ) + indirim sağ üst
═══════════════════════════════════════════════════════════ */

.product-card-modern { position: relative !important; }

.product-card-modern .product-info-area {
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
    padding: 14px !important;
    min-height: 100px !important;
    text-align: left !important;
    overflow: hidden !important;
}

.product-card-modern .product-name-small {
    margin: 0 0 12px 0 !important;
    padding-right: 0 !important;
    text-align: left !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.product-card-modern .product-info-row-v2 {
    display: block !important;
    margin: auto 0 0 0 !important;
    min-height: unset !important;
    width: 100% !important;
    padding: 0 !important;
    padding-right: 125px !important;
    box-sizing: border-box !important;
}

.product-card-modern .price-side-v2 {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 2px !important;
    flex: 1 1 0 !important;
    min-width: 0 !important;
    text-align: left !important;
    overflow: hidden !important;
}

.product-card-modern .current-price-row-v2 {
    display: flex !important;
    align-items: baseline !important;
    gap: 4px !important;
    white-space: nowrap !important;
    min-width: 0 !important;
    width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.product-card-modern .current-price-v2 {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    min-width: 0 !important;
}

.product-card-modern .btn-buy-modern {
    position: absolute !important;
    bottom: 12px !important;
    right: 12px !important;
    margin: 0 !important;
    width: auto !important;
    flex: 0 0 auto !important;
    z-index: 5 !important;
    border-radius: 5px !important;
}

.product-card-modern .product-name-small {
    grid-area: title !important;
    margin: 0 !important;
    text-align: left !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    min-height: 38px !important;
    white-space: normal !important;
}

.product-card-modern .product-info-row-v2 {
    grid-area: price !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    margin: 0 !important;
    min-height: unset !important;
    width: 100% !important;
    gap: 2px !important;
}

.product-card-modern .price-side-v2 {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 2px !important;
}

.product-card-modern .rating-side-v2 { display: none !important; }

.product-card-modern .old-price-v2 {
    color: #f5a623 !important;
    -webkit-text-fill-color: #f5a623 !important;
    opacity: 0.85 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    margin: 0 !important;
    text-decoration: line-through !important;
    white-space: nowrap !important;
}

.product-card-modern .current-price-row-v2 {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    white-space: nowrap !important;
}

.product-card-modern .current-price-v2,
.product-card-modern .currency-v2 {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background: none !important;
    -webkit-background-clip: unset !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

.product-card-modern .discount-badge-v2 {
    display: none !important;
}

.product-card-modern .btn-buy-modern {
    grid-area: button !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 7px 12px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    align-self: end !important;
    border-radius: 8px !important;
}

@media (max-width: 768px) {
    .product-card-modern .btn-buy-modern {
        padding: 6px 9px !important;
        font-size: 8.5px !important;
        letter-spacing: 0 !important;
        border-radius: 6px !important;
        gap: 4px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}

@media (max-width: 480px) {
    .product-card-modern .btn-buy-modern {
        padding: 5px 7px !important;
        font-size: 8px !important;
        border-radius: 5px !important;
    }
}

/* listing-product-card aynı yapı */
.listing-product-card { position: relative !important; }

.listing-card-info {
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
    padding: 14px !important;
    min-height: 100px !important;
    text-align: left !important;
    overflow: hidden !important;
}

.listing-product-title {
    margin: 0 0 12px 0 !important;
    text-align: left !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.listing-card-info .product-info-row-v2 {
    display: block !important;
    margin: auto 0 0 0 !important;
    min-height: unset !important;
    width: 100% !important;
    padding: 0 !important;
    padding-right: 125px !important;
    box-sizing: border-box !important;
}

.listing-card-info .price-side-v2 {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    overflow: hidden !important;
}

.listing-card-info .current-price-row-v2 {
    min-width: 0 !important;
    width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.listing-card-info .current-price-v2 {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    min-width: 0 !important;
}

.listing-card-info .price-side-v2 {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 2px !important;
    width: auto !important;
    text-align: left !important;
}

.listing-card-info .current-price-row-v2 {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    white-space: nowrap !important;
}

.listing-buy-btn {
    position: absolute !important;
    bottom: 10px !important;
    right: 10px !important;
    margin: 0 !important;
    width: auto !important;
    z-index: 5 !important;
    border-radius: 5px !important;
}

.listing-product-title {
    grid-area: title !important;
    margin: 0 !important;
    text-align: left !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    text-transform: none !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    min-height: 38px !important;
}

.listing-card-info .product-info-row-v2 {
    grid-area: price !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    margin: 0 !important;
    min-height: unset !important;
    width: 100% !important;
    gap: 2px !important;
}

.listing-card-info .price-side-v2 {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 2px !important;
}

.listing-card-info .rating-side-v2 { display: none !important; }

.listing-card-info .old-price-v2,
.listing-old-price {
    color: #f5a623 !important;
    -webkit-text-fill-color: #f5a623 !important;
    opacity: 0.85 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    margin: 0 !important;
    text-decoration: line-through !important;
    white-space: nowrap !important;
}

.listing-card-info .current-price-row-v2 {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    white-space: nowrap !important;
}

.listing-card-info .current-price-v2,
.listing-card-info .currency-v2,
.listing-new-price {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background: none !important;
    -webkit-background-clip: unset !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

.listing-card-info .discount-badge-v2 {
    display: none !important;
}

.listing-buy-btn {
    grid-area: button !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 7px 12px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    align-self: end !important;
    border-radius: 8px !important;
}

.vt-products .product-card-modern .vt-buy-btn {
    grid-area: button !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 9px 14px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    align-self: end !important;
    border-radius: 10px !important;
}

/* Mobil/Tablet — fiyat ve buton yan yana, taşmayı önleyici güvenlikler */
@media (max-width: 1024px) {
    .product-card-modern .product-info-row-v2,
    .listing-card-info .product-info-row-v2 {
        min-width: 0 !important;
        overflow: hidden !important;
    }
    .product-card-modern .price-side-v2,
    .listing-card-info .price-side-v2 {
        min-width: 0 !important;
        overflow: hidden !important;
    }
    .product-card-modern .current-price-row-v2,
    .listing-card-info .current-price-row-v2 {
        min-width: 0 !important;
    }
}

@media (max-width: 768px) {
    .product-card-modern .product-info-area,
    .listing-card-info {
        padding: 12px 95px 12px 12px !important;
        min-height: 80px !important;
    }
    .product-card-modern .product-name-small,
    .listing-product-title {
        font-size: 12px !important;
        min-height: 0 !important;
        margin-bottom: 10px !important;
    }
    .product-card-modern .current-price-v2,
    .product-card-modern .currency-v2,
    .listing-card-info .current-price-v2,
    .listing-card-info .currency-v2,
    .listing-new-price {
        font-size: 14px !important;
    }
    .product-card-modern .old-price-v2,
    .listing-card-info .old-price-v2,
    .listing-old-price {
        font-size: 10px !important;
    }
    /* Mobil buton — boyut korunur, ikon + küçük yazı */
    .product-card-modern .btn-buy-modern i,
    .listing-buy-btn i,
    .vt-products .product-card-modern .vt-buy-btn i,
    .product-card-modern .btn-buy-modern .fas,
    .listing-buy-btn .fas {
        display: inline-block !important;
        font-size: 10px !important;
        flex-shrink: 0 !important;
    }
    .product-card-modern .btn-buy-modern,
    .listing-buy-btn,
    .vt-products .product-card-modern .vt-buy-btn {
        padding: 6px 10px !important;
        font-size: 8.5px !important;
        letter-spacing: 0 !important;
        gap: 5px !important;
        bottom: 12px !important;
        right: 10px !important;
        white-space: nowrap !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}

/* Çok dar ekranlarda */
@media (max-width: 480px) {
    .product-card-modern .product-info-area,
    .listing-card-info {
        padding: 10px 80px 10px 10px !important;
        min-height: 75px !important;
    }
    .product-card-modern .product-name-small,
    .listing-product-title {
        font-size: 11px !important;
        margin-bottom: 8px !important;
    }
    .product-card-modern .current-price-v2,
    .product-card-modern .currency-v2,
    .listing-card-info .current-price-v2,
    .listing-card-info .currency-v2,
    .listing-new-price {
        font-size: 13px !important;
    }
    .product-card-modern .old-price-v2,
    .listing-card-info .old-price-v2,
    .listing-old-price {
        font-size: 9px !important;
    }
    .product-card-modern .btn-buy-modern i,
    .listing-buy-btn i,
    .product-card-modern .btn-buy-modern .fas,
    .listing-buy-btn .fas {
        display: inline-block !important;
        font-size: 9px !important;
        flex-shrink: 0 !important;
    }
    .product-card-modern .btn-buy-modern,
    .listing-buy-btn,
    .vt-products .product-card-modern .vt-buy-btn {
        padding: 5px 8px !important;
        font-size: 8px !important;
        letter-spacing: 0 !important;
        gap: 4px !important;
        bottom: 10px !important;
        right: 8px !important;
        white-space: nowrap !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}

/* ════════════════════════════════════════════════════════
   FINAL OVERRIDE — Predunya kart layout (tüm önceki duplicate'leri ezer)
═══════════════════════════════════════════════════════════ */

.product-card-modern .product-info-area,
.listing-card-info {
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
    padding: 14px !important;
    min-height: 110px !important;
    text-align: left !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

.product-card-modern .product-name-small,
.listing-product-title {
    margin: 0 0 10px 0 !important;
    text-align: left !important;
    width: 100% !important;
    box-sizing: border-box !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
}

.product-card-modern .product-info-row-v2,
.listing-card-info .product-info-row-v2 {
    display: block !important;
    margin: auto 0 0 0 !important;
    min-height: unset !important;
    width: 100% !important;
    padding: 0 !important;
    padding-right: 90px !important; /* Prevent overlap with the absolute purchase button */
    grid-area: unset !important;
    box-sizing: border-box !important;
}

.product-card-modern .price-side-v2,
.listing-card-info .price-side-v2 {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 2px !important;
    width: 100% !important;
    text-align: left !important;
    overflow: hidden !important;
}

.product-card-modern .rating-side-v2,
.listing-card-info .rating-side-v2 {
    display: none !important;
}

.product-card-modern .old-price-v2,
.listing-card-info .old-price-v2,
.listing-old-price {
    color: #f5a623 !important;
    -webkit-text-fill-color: #f5a623 !important;
    opacity: 0.85 !important;
    font-size: clamp(8px, 0.7vw, 11px) !important;
    font-weight: 500 !important;
    margin: 0 !important;
    text-decoration: line-through !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 100% !important;
}

.product-card-modern .current-price-row-v2,
.listing-card-info .current-price-row-v2 {
    display: flex !important;
    align-items: baseline !important;
    gap: 3px !important;
    white-space: nowrap !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.product-card-modern .current-price-v2,
.product-card-modern .currency-v2,
.listing-card-info .current-price-v2,
.listing-card-info .currency-v2,
.listing-new-price {
    color: var(--text-color, #ffffff) !important;
    -webkit-text-fill-color: var(--text-color, #ffffff) !important;
    background: none !important;
    -webkit-background-clip: unset !important;
    font-size: clamp(10px, 0.95vw, 14px) !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 100% !important;
}

/* Light theme — yeni fiyat koyu renkte */
[data-theme="light"] .product-card-modern .current-price-v2,
[data-theme="light"] .product-card-modern .currency-v2,
[data-theme="light"] .listing-card-info .current-price-v2,
[data-theme="light"] .listing-card-info .currency-v2,
[data-theme="light"] .listing-new-price {
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
}

.product-card-modern .btn-buy-modern,
.listing-buy-btn {
    position: absolute !important;
    bottom: 12px !important;
    right: 12px !important;
    margin: 0 !important;
    width: auto !important;
    grid-area: unset !important;
    z-index: 5 !important;
    border-radius: 5px !important;
}

.product-card-modern .discount-badge-v2,
.listing-card-info .discount-badge-v2 {
    display: none !important;
}

/* MOBİL ≤768px */
@media (max-width: 768px) {
    .showcase-section {
        margin-bottom: 10px !important;
    }
    .showcase-slider-mobile {
        align-items: flex-start !important;
        padding-bottom: 5px !important;
    }
    .tab-pane-modern {
        margin-bottom: 0px !important;
    }
    .showcase-slider-mobile .product-card-modern,
    .product-grid-modern .product-card-modern {
        height: fit-content !important;
    }
    .product-card-modern .product-info-area,
    .listing-card-info {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        align-content: flex-start !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 10px !important;
        min-height: unset !important;
        box-sizing: border-box !important;
    }
    .product-card-modern .product-name-small,
    .listing-product-title {
        font-size: 12px !important;
        margin: 0 0 8px 0 !important;
        width: 100% !important;
        min-height: unset !important;
        height: auto !important;
        line-height: 1.3 !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }
    .product-card-modern .product-info-row-v2,
    .listing-card-info .product-info-row-v2 {
        flex: 1 !important;
        margin: 0 !important;
        padding-right: 5px !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
    }
    .product-card-modern .current-price-v2,
    .product-card-modern .currency-v2,
    .listing-card-info .current-price-v2,
    .listing-card-info .currency-v2,
    .listing-new-price {
        font-size: 13px !important;
    }
    .product-card-modern .old-price-v2,
    .listing-card-info .old-price-v2,
    .listing-old-price {
        font-size: 10px !important;
    }
    .product-card-modern .btn-buy-modern i,
    .listing-buy-btn i,
    .product-card-modern .btn-buy-modern .fas,
    .listing-buy-btn .fas {
        display: inline-block !important;
        font-size: 10px !important;
        flex-shrink: 0 !important;
    }
    .product-card-modern .btn-buy-modern,
    .listing-buy-btn {
        flex: 0 0 auto !important;
        position: static !important;
        margin: 0 !important;
        width: auto !important;
        padding: 6px 10px !important;
        font-size: 8.5px !important;
        gap: 5px !important;
        white-space: nowrap !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        height: fit-content !important;
    }
}

/* MOBİL ≤480px */
@media (max-width: 480px) {
    .product-card-modern .product-info-area,
    .listing-card-info {
        padding: 8px !important;
        gap: 4px 6px !important;
    }
    .product-card-modern .product-name-small,
    .listing-product-title {
        font-size: 11px !important;
    }
    .product-card-modern .btn-buy-modern,
    .listing-buy-btn {
        padding: 4px 8px !important;
        font-size: 8px !important;
    }
    .product-card-modern .current-price-v2,
    .product-card-modern .currency-v2,
    .listing-card-info .current-price-v2,
    .listing-card-info .currency-v2,
    .listing-new-price {
        font-size: 12px !important;
    }
}

/* ════════════════════════════════════════════════════════
   FLAT MODE — Predunya sade görünüm
   Tüm neon glow, gradient, text-shadow ve dekoratif pseudo'ları kaldırır
═══════════════════════════════════════════════════════════ */

/* Tüm box-shadow ve text-shadow'ları kaldır */
body, body *,
body *::before, body *::after {
    text-shadow: none !important;
    filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* Kart, header, footer ve diğer container'larda neon shadow yok */
body .product-card-modern,
body .listing-product-card,
body .vt-card,
body .category-item-card,
body .blog-card,
body .hero-card,
body .product-card,
body .main-header,
body .main-footer,
body .modal-content,
body .auth-modal,
body .p-modal-content {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.20) !important;
}

body .product-card-modern:hover,
body .listing-product-card:hover,
body .vt-card:hover,
body .category-item-card:hover {
    box-shadow:
        0 0 0 1px rgba(var(--buy-button-rgb), 0.35),
        0 0 20px rgba(var(--buy-button-rgb), 0.25),
        0 12px 40px rgba(0, 0, 0, 0.50) !important;
    transform: translateY(-4px) !important;
}

/* Gradient text'leri düz beyaz yap */
body .current-price-v2,
body .currency-v2,
body .discount-badge-v2,
body .badge-fixed-text,
body .vt-stat-val,
body h1, body h2, body h3, body h4, body h5, body h6,
body .section-title,
body .vt-hero h1,
body .vt-hero-title {
    background: none !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
    -webkit-text-fill-color: unset !important;
}

/* Tüm dekoratif ::before ve ::after pseudo'larını kaldır
   (HUD köşeleri, neon çizgiler, glow halkaları) */
body .product-card-modern::before,
body .product-card-modern::after,
body .listing-product-card::before,
body .listing-product-card::after,
body .main-header::before,
body .main-header::after,
body .main-footer::before,
body .main-footer::after,
body .nav-item-modern::after,
body .section-title::before,
body .vt-section-title::before,
body .footer-title::before,
body body::before,
body .featured-card::before,
body .featured-card::after,
body .category-item-card::before,
body .category-item-card::after,
body .hero-card::before,
body .hero-card::after {
    display: none !important;
    content: none !important;
    background: none !important;
}

/* Body arka planında neon orb / grid / blur efektlerini kaldır */
body::before, body::after {
    display: none !important;
    content: none !important;
}

body .vt-orb,
body .vt-grid-bg {
    display: none !important;
}

/* Animasyonları kaldır — marquee/ticker'lar HARİÇ */
body *:not(.badge-marquee):not(.announcement-marquee):not(.announcement-marquee *):not(.top-announcement):not(.top-announcement *):not([class*="marquee"]):not([class*="marquee"] *) {
    animation: none !important;
}

/* Font'u standart sans-serif yap — ikon font'larını HARİÇ tut */
body,
body *:not(i):not(.fa):not(.fas):not(.far):not(.fab):not(.fal):not(.fad):not([class*="fa-"]):not(.ti):not([class*="ti-"]):not(.material-icons):not(svg):not(svg *) {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

/* Cyberpunk fontları (Orbitron, Rajdhani, Share Tech Mono) ezilsin */
body .current-price-v2,
body .currency-v2,
body .discount-badge-v2,
body .vt-stat-val,
body h1, body h2, body h3 {
    font-family: 'Inter', sans-serif !important;
}

/* Buton sade düz outline (glow yok) */
html body .product-card-modern .btn-buy-modern,
html body .listing-product-card .listing-buy-btn,
html body .vt-products .product-card-modern .vt-buy-btn,
html body .btn-buy-modern,
html body .listing-buy-btn,
html body .vt-buy-btn {
    background: transparent !important;
    background-image: none !important;
    border: 1.5px solid var(--buy-button) !important;
    border-radius: 5px !important;
    color: var(--buy-button) !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

html body .product-card-modern .btn-buy-modern:hover,
html body .listing-product-card .listing-buy-btn:hover,
html body .vt-products .product-card-modern .vt-buy-btn:hover,
html body .btn-buy-modern:hover,
html body .listing-buy-btn:hover,
html body .vt-buy-btn:hover {
    background: rgba(var(--buy-button-rgb), 0.10) !important;
    box-shadow: none !important;
    transform: none !important;
}

/* Glassmorphism arka planları düz yap */
body .glass-card,
body .glass-bg,
body [class*="glass"] {
    background: var(--card-bg, #1a1d28) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* Gradient background'lar düz renk */
body .vt-hero,
body .main-hero,
body .hero-section {
    background: var(--bg-color, #0b0f1a) !important;
}

/* ════════════════════════════════════════════════════════
   LIGHT THEME OPTİMİZASYONU
═══════════════════════════════════════════════════════════ */

/* Kart arka planı ve kenarlık — light */
[data-theme="light"] .product-card-modern,
[data-theme="light"] .listing-product-card,
[data-theme="light"] .vt-card {
    background: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important;
}

[data-theme="light"] .product-card-modern:hover,
[data-theme="light"] .listing-product-card:hover,
[data-theme="light"] .vt-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12) !important;
    border-color: rgba(0, 0, 0, 0.12) !important;
}

/* Info area arka planı */
[data-theme="light"] .product-card-modern .product-info-area,
[data-theme="light"] .listing-card-info {
    background: #ffffff !important;
}

/* Title koyu renk */
[data-theme="light"] .product-card-modern .product-name-small,
[data-theme="light"] .listing-product-title {
    color: #0f172a !important;
}

/* Eski fiyat — light'ta daha okunaklı (turuncu/amber) */
[data-theme="light"] .product-card-modern .old-price-v2,
[data-theme="light"] .listing-card-info .old-price-v2,
[data-theme="light"] .listing-old-price {
    color: #d97706 !important;
    -webkit-text-fill-color: #d97706 !important;
    opacity: 1 !important;
}

/* Buton — light'ta */
[data-theme="light"] html body .product-card-modern .btn-buy-modern,
[data-theme="light"] html body .listing-product-card .listing-buy-btn,
[data-theme="light"] html body .vt-products .product-card-modern .vt-buy-btn,
[data-theme="light"] html body .btn-buy-modern,
[data-theme="light"] html body .listing-buy-btn,
[data-theme="light"] html body .vt-buy-btn {
    background: transparent !important;
    border: 1.5px solid var(--buy-button) !important;
    color: var(--buy-button) !important;
    box-shadow: none !important;
}

[data-theme="light"] html body .product-card-modern .btn-buy-modern:hover,
[data-theme="light"] html body .listing-product-card .listing-buy-btn:hover,
[data-theme="light"] html body .vt-products .product-card-modern .vt-buy-btn:hover,
[data-theme="light"] html body .btn-buy-modern:hover,
[data-theme="light"] html body .listing-buy-btn:hover,
[data-theme="light"] html body .vt-buy-btn:hover {
    background: rgba(var(--buy-button-rgb), 0.08) !important;
}

/* Buton ikonu light'ta da admin renginde */
[data-theme="light"] html body .btn-buy-modern i,
[data-theme="light"] html body .listing-buy-btn i,
[data-theme="light"] html body .vt-buy-btn i,
[data-theme="light"] html body .btn-buy-modern .fas,
[data-theme="light"] html body .listing-buy-btn .fas {
    color: var(--buy-button) !important;
    -webkit-text-fill-color: var(--buy-button) !important;
}

/* ════════════════════════════════════════════════════════
   VİTRİN SAYFASI — Predunya sade override
═══════════════════════════════════════════════════════════ */

/* Vitrin'deki frame_color border'larını sade yap */
html body .vt-products .product-card-modern,
html body .vt-products .product-card-modern.vt-card,
html body .vt-section .vt-products .product-card-modern,
html body[data-theme="light"] .vt-products .product-card-modern,
html body[data-theme="dark"] .vt-products .product-card-modern,
html[data-theme] body .vt-section .vt-products .product-card-modern,
html[data-theme] body .vt-section .vt-products .product-card-modern.vt-card {
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.20) !important;
    background-clip: padding-box !important;
}

html body[data-theme="light"] .vt-products .product-card-modern {
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important;
}

/* Hover'da sade gölge */
html body .vt-products .product-card-modern:hover,
html body .vt-section .vt-products .product-card-modern:hover,
html[data-theme] body .vt-section .vt-products .product-card-modern:hover {
    border-color: rgba(255, 255, 255, 0.15) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.30) !important;
    transform: none !important;
}

html body[data-theme="light"] .vt-products .product-card-modern:hover {
    border-color: rgba(0, 0, 0, 0.15) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12) !important;
}

/* Vitrin kart köşe HUD çizgilerini kaldır */
html body .vt-products .product-card-modern::before,
html body .vt-products .product-card-modern::after,
html body .vt-section .vt-products .product-card-modern::before,
html body .vt-section .vt-products .product-card-modern::after {
    display: none !important;
    content: none !important;
    background: none !important;
    border: none !important;
}

/* Marquee/ticker badge background sade */
html body .vt-products .product-badge,
html body[data-theme="light"] .vt-products .product-badge,
html body[data-theme="dark"] .vt-products .product-badge {
    background: rgba(239, 68, 68, 0.85) !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.15) !important;
}

/* Vitrin "Hemen Al" butonu — admin renkli outline */
html body .vt-products .vt-buy-btn {
    background: transparent !important;
    background-image: none !important;
    border: 1.5px solid var(--buy-button) !important;
    border-radius: 5px !important;
    color: var(--buy-button) !important;
    box-shadow: none !important;
    text-shadow: none !important;
    padding: 5px 10px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.4px !important;
}

html body .vt-products .vt-buy-btn:hover {
    background: rgba(var(--buy-button-rgb), 0.10) !important;
    box-shadow: none !important;
    color: var(--buy-button) !important;
    transform: none !important;
}

html body .vt-products .vt-buy-btn i,
html body .vt-products .vt-buy-btn .fas {
    color: var(--buy-button) !important;
    -webkit-text-fill-color: var(--buy-button) !important;
}

/* Vitrin fiyat ve indirim badge — admin renkleri */
html body .vt-products .current-price-v2,
html body .vt-products .discount-badge-v2 {
    color: var(--text-color, #ffffff) !important;
    -webkit-text-fill-color: var(--text-color, #ffffff) !important;
}

html body[data-theme="light"] .vt-products .current-price-v2 {
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
}

html body .vt-products .discount-badge-v2 {
    display: none !important;
}

/* Vitrin sayfa başlığı pill - sade */
html body .vt-section-title::before {
    background: var(--primary-blue) !important;
    box-shadow: none !important;
}

html body .vt-count-badge {
    background: rgba(var(--primary-blue-rgb), 0.10) !important;
    box-shadow: none !important;
}

/* Vitrin hero orb/grid arka planlar gizle */
html body .vt-hero .vt-orb,
html body .vt-hero .vt-grid-bg {
    display: none !important;
}

html body .vt-hero {
    background: var(--bg-color, #0b0f1a) !important;
}

html body[data-theme="light"] .vt-hero {
    background: var(--bg-color, #f8fafc) !important;
}

html body .vt-hero h1 {
    text-shadow: none !important;
}

/* ════════════════════════════════════════════════════════
   PREDUNYA — FİYAT HANE SAYISINA GÖRE OTOMATİK BOYUT
   (PHP helper pd_price_len_class ile atanan class'lar)
═══════════════════════════════════════════════════════════ */
.current-price-v2.price-len-md,
.current-price-v2.price-len-md .currency-v2 { font-size: 13px !important; }
.current-price-v2.price-len-sm,
.current-price-v2.price-len-sm .currency-v2 { font-size: 11px !important; }
.current-price-v2.price-len-xs,
.current-price-v2.price-len-xs .currency-v2 { font-size: 9px !important; }

/* Tüm fiyatlarda son hane/TL kesilmemesi için overflow ve genişlik serbest */
.product-card-modern .current-price-v2,
.product-card-modern .current-price-row-v2,
.product-card-modern .price-side-v2,
.listing-card-info .current-price-v2,
.listing-card-info .current-price-row-v2,
.listing-card-info .price-side-v2 {
    overflow: visible !important;
    text-overflow: clip !important;
    max-width: none !important;
    white-space: nowrap !important;
}

/* Eski fiyat (üstü çizili) — kardeş current-price uzunsa küçült */
.price-side-v2:has(.current-price-v2.price-len-md) .old-price-v2,
.list-card-price:has(.current-price-v2.price-len-md) .old-price-v2 { font-size: 11px !important; }
.price-side-v2:has(.current-price-v2.price-len-sm) .old-price-v2,
.list-card-price:has(.current-price-v2.price-len-sm) .old-price-v2 { font-size: 10px !important; }
.price-side-v2:has(.current-price-v2.price-len-xs) .old-price-v2,
.list-card-price:has(.current-price-v2.price-len-xs) .old-price-v2 { font-size: 9px !important; }

/* Desktop'ta dar kartlar için baseline boyutları küçült */
@media (min-width: 769px) {
    .product-card-modern .current-price-v2,
    .product-card-modern .current-price-v2 .currency-v2 { font-size: 14px !important; }
    .product-card-modern .current-price-v2.price-len-md,
    .product-card-modern .current-price-v2.price-len-md .currency-v2 { font-size: 12px !important; }
    .product-card-modern .current-price-v2.price-len-sm,
    .product-card-modern .current-price-v2.price-len-sm .currency-v2 { font-size: 10px !important; }
    .product-card-modern .current-price-v2.price-len-xs,
    .product-card-modern .current-price-v2.price-len-xs .currency-v2 { font-size: 9px !important; }

    .product-card-modern .btn-buy-modern {
        padding: 7px 12px !important;
        font-size: 11px !important;
    }
    .product-card-modern:has(.current-price-v2.price-len-md) .product-info-row-v2 { padding-right: 0 !important; }
    .product-card-modern:has(.current-price-v2.price-len-sm) .product-info-row-v2 { padding-right: 0 !important; }
    .product-card-modern:has(.current-price-v2.price-len-xs) .product-info-row-v2 { padding-right: 0 !important; }
}

@media (max-width: 768px) {
    .current-price-v2.price-len-lg,
    .current-price-v2.price-len-lg .currency-v2 { font-size: 13px !important; }
    
    .current-price-v2.price-len-md,
    .current-price-v2.price-len-md .currency-v2 { font-size: 10.4px !important; letter-spacing: -0.2px !important; }
    
    .current-price-v2.price-len-sm,
    .current-price-v2.price-len-sm .currency-v2 { font-size: 8.4px !important; letter-spacing: -0.2px !important; }
    
    .current-price-v2.price-len-xs,
    .current-price-v2.price-len-xs .currency-v2 { font-size: 7.4px !important; letter-spacing: -0.2px !important; }

    .price-side-v2:has(.current-price-v2.price-len-md) .old-price-v2,
    .list-card-price:has(.current-price-v2.price-len-md) .old-price-v2 { font-size: 8.4px !important; letter-spacing: -0.2px !important; margin-bottom: 0px !important; }
    
    .price-side-v2:has(.current-price-v2.price-len-sm) .old-price-v2,
    .list-card-price:has(.current-price-v2.price-len-sm) .old-price-v2 { font-size: 7.4px !important; letter-spacing: -0.2px !important; margin-bottom: 0px !important; }
    
    .price-side-v2:has(.current-price-v2.price-len-xs) .old-price-v2,
    .list-card-price:has(.current-price-v2.price-len-xs) .old-price-v2 { font-size: 6.4px !important; letter-spacing: -0.2px !important; margin-bottom: 0px !important; }

    /* Shrink the buy button slightly if the price is long so they don't overlap */
    .product-card-modern:has(.current-price-v2.price-len-md) .btn-buy-modern {
        padding: 4px 7px !important;
        font-size: 9.4px !important;
        gap: 3px !important;
    }
    .product-card-modern:has(.current-price-v2.price-len-md) .btn-buy-modern i,
    .product-card-modern:has(.current-price-v2.price-len-md) .btn-buy-modern .fas {
        font-size: 9.4px !important;
    }
    
    .product-card-modern:has(.current-price-v2.price-len-sm) .btn-buy-modern,
    .product-card-modern:has(.current-price-v2.price-len-xs) .btn-buy-modern {
        padding: 3px 5px !important;
        font-size: 8.2px !important;
        gap: 2px !important;
    }
    .product-card-modern:has(.current-price-v2.price-len-sm) .btn-buy-modern i,
    .product-card-modern:has(.current-price-v2.price-len-xs) .btn-buy-modern i,
    .product-card-modern:has(.current-price-v2.price-len-sm) .btn-buy-modern .fas,
    .product-card-modern:has(.current-price-v2.price-len-xs) .btn-buy-modern .fas {
        font-size: 8.2px !important;
    }
}

/* ════════════════════════════════════════════════════════
   PREDUNYA MODERN CORPORATE HEADER REDESIGN (SADE & DİKKAT ÇEKİCİ)
   ========================================================= */

/* 1. ANNOUNCEMENT BAR (Duyuru Çubuğu) */
body .top-announcement {
    height: 38px !important;
    line-height: 38px !important;
    position: relative !important;
    overflow: hidden !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: 0.3px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    background: linear-gradient(90deg, var(--primary-blue) 0%, rgba(var(--primary-blue-rgb), 0.8) 100%) !important;
    color: #ffffff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    padding: 0 0 0 115px !important;
}

[data-theme="light"] body .top-announcement {
    background: linear-gradient(90deg, var(--primary-blue) 0%, rgba(var(--primary-blue-rgb), 0.9) 100%) !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
}

/* DUYURU Bubble Badge */
body .top-announcement::before {
    content: "DUYURU" !important;
    position: absolute !important;
    left: 10px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    height: 22px !important;
    width: auto !important;
    min-width: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 10px 0 20px !important; /* space on the left for the pulsing dot */
    background: rgba(10, 11, 18, 0.85) !important;
    border: 1px solid rgba(var(--primary-orange-rgb), 0.4) !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 700 !important;
    font-size: 9px !important;
    letter-spacing: 1px !important;
    z-index: 10 !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3) !important;
    background-image: none !important;
    animation: none !important;
}

[data-theme="light"] body .top-announcement::before {
    background: rgba(255, 255, 255, 0.95) !important;
    color: var(--primary-blue) !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.4) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
}

/* Pulsing dot inside the bubble */
body .top-announcement::after {
    content: "" !important;
    position: absolute !important;
    left: 17px !important; /* positioned inside the bubble's padded left area */
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 6px !important;
    height: 6px !important;
    background-color: var(--primary-orange) !important;
    border-radius: 50% !important;
    z-index: 11 !important;
    box-shadow: 0 0 6px var(--primary-orange) !important;
    animation: announcement-dot-pulse 1.8s ease-in-out infinite !important;
    display: block !important;
}

[data-theme="light"] body .top-announcement::after {
    background-color: var(--primary-blue) !important;
    box-shadow: 0 0 6px var(--primary-blue) !important;
}


.announcement-marquee span,
.announcement-text {
    font-family: 'Inter', sans-serif !important;
    font-weight: 500 !important;
    font-size: 13px !important;
    letter-spacing: 0.2px !important;
    color: inherit !important;
    text-shadow: none !important;
}


/* 2. MAIN HEADER LAYOUT */
body .main-header {
    position: relative !important;
    background: rgba(10, 11, 18, 0.8) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.15) !important;
    transition: all 0.3s ease !important;
    padding: 15px 0 !important;
}

[data-theme="light"] body .main-header {
    background: rgba(255, 255, 255, 0.85) !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.03) !important;
}

/* Remove all legacy grid/dot decorations, restore modern floating neon gradient hairline */
body .main-header::before {
    content: none !important;
    display: none !important;
}

body .main-header::after {
    content: none !important;
    display: none !important;
}

[data-theme="light"] body .main-header::after {
    content: none !important;
    display: none !important;
}





/* 2. HEADER TOP LAYOUT & BUTTON WRAPPING PREVENTION */
.header-top {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 20px !important;
}

.btn-register-desktop,
.btn-login,
.btn-account,
.actions {
    white-space: nowrap !important;
    flex-wrap: nowrap !important;
}

/* 3. LOGO */
.logo {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    position: relative !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    clip-path: none !important;
    transform: none !important;
}
.logo::before,
.logo::after {
    content: none !important;
    display: none !important;
}
.logo-img {
    height: 38px !important;
    object-fit: contain !important;
    transition: transform 0.3s ease !important;
}
.logo:hover .logo-img {
    transform: scale(1.03) !important;
}

/* 4. SEARCH CONTAINER */
.search-container {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    border-radius: 10px !important;
    padding: 2px 6px 2px 14px !important;
    display: flex !important;
    align-items: center !important;
    width: 420px !important;
    max-width: 100% !important;
    flex: none !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    clip-path: none !important;
}

[data-theme="light"] .search-container {
    background: rgba(0, 0, 0, 0.02) !important;
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
}

.search-container:focus-within {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(var(--primary-blue-rgb), 0.4) !important;
    box-shadow: 0 0 0 3px rgba(var(--primary-blue-rgb), 0.15) !important;
}

[data-theme="light"] .search-container:focus-within {
    background: #ffffff !important;
    border-color: var(--primary-blue) !important;
    box-shadow: 0 0 0 3px rgba(var(--primary-blue-rgb), 0.1) !important;
}

.search-input {
    background: transparent !important;
    border: none !important;
    outline: none !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    width: 100% !important;
    height: 38px !important;
    padding: 0 !important;
}

[data-theme="light"] .search-input {
    color: #1e293b !important;
}

.search-input::placeholder {
    color: rgba(255, 255, 255, 0.25) !important;
}

[data-theme="light"] .search-input::placeholder {
    color: rgba(0, 0, 0, 0.4) !important;
}

.search-btn {
    background: transparent !important;
    border: none !important;
    color: rgba(255, 255, 255, 0.4) !important;
    cursor: pointer !important;
    padding: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: color 0.2s ease, transform 0.2s ease !important;
}

[data-theme="light"] .search-btn {
    color: rgba(0, 0, 0, 0.4) !important;
}

.search-container:focus-within .search-btn {
    color: var(--primary-blue) !important;
    transform: scale(1.05) !important;
}

/* 5. ICON BUTTONS (THEME, NOTIFICATION, CART) */
.actions {
    display: flex !important;
    gap: 10px !important;
    align-items: center !important;
}

.actions .icon-btn,
.icon-btn {
    width: 38px !important;
    height: 38px !important;
    border-radius: 10px !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    background: rgba(255, 255, 255, 0.03) !important;
    color: rgba(255, 255, 255, 0.7) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    clip-path: none !important;
    box-shadow: none !important;
}

[data-theme="light"] .actions .icon-btn,
[data-theme="light"] .icon-btn {
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    background: rgba(0, 0, 0, 0.02) !important;
    color: rgba(0, 0, 0, 0.6) !important;
}

.actions .icon-btn:hover,
.icon-btn:hover {
    background: rgba(var(--primary-blue-rgb), 0.08) !important;
    border-color: rgba(var(--primary-blue-rgb), 0.3) !important;
    color: var(--primary-blue) !important;
    transform: translateY(-1.5px) !important;
}

[data-theme="light"] .actions .icon-btn:hover,
[data-theme="light"] .icon-btn:hover {
    background: rgba(var(--primary-blue-rgb), 0.05) !important;
    border-color: var(--primary-blue) !important;
    color: var(--primary-blue) !important;
}

.actions .icon-btn svg,
.icon-btn svg {
    width: 18px !important;
    height: 18px !important;
    transition: transform 0.2s ease !important;
}

.actions .icon-btn:hover svg,
.icon-btn:hover svg {
    transform: scale(1.05) !important;
}

/* 6. AUTHENTICATION BUTTONS (KAYIT OL & GİRİŞ YAP) */
.btn-register-desktop {
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    color: #ffffff !important;
    border-radius: 10px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px !important;
    text-transform: uppercase !important;
    padding: 8px 18px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    height: 38px !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    clip-path: none !important;
    box-shadow: none !important;
}

[data-theme="light"] .btn-register-desktop {
    border: 1.5px solid var(--primary-blue) !important;
    color: var(--primary-blue) !important;
}

.btn-register-desktop:hover {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(var(--primary-blue-rgb), 0.3) !important;
    color: var(--primary-blue) !important;
    transform: translateY(-1.5px) !important;
}

[data-theme="light"] .btn-register-desktop:hover {
    background: rgba(0, 0, 0, 0.03) !important;
    border-color: var(--primary-blue) !important;
    color: var(--primary-blue) !important;
}

.btn.btn-login {
    background: linear-gradient(135deg, var(--primary-blue) 0%, var(--primary-orange) 100%) !important;
    border: none !important;
    color: #ffffff !important;
    border-radius: 10px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px !important;
    text-transform: uppercase !important;
    padding: 8px 18px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    height: 38px !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    clip-path: none !important;
    box-shadow: 0 4px 15px rgba(var(--primary-blue-rgb), 0.2) !important;
}

.btn.btn-login:hover {
    transform: translateY(-1.5px) !important;
    box-shadow: 0 6px 20px rgba(var(--primary-blue-rgb), 0.3) !important;
    filter: brightness(1.08) !important;
}

.btn.btn-login::before {
    content: none !important;
    display: none !important;
}

/* 7. NAVIGATION SECTION & CATEGORIES BAR */
.header-nav {
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    position: relative !important;
    margin-top: 18px !important;
    display: flex !important;
    align-items: center !important;
    background: rgba(255, 255, 255, 0.02) !important;
    border-radius: 0 !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    
    /* Full-screen width breakout trick */
    margin-left: calc(-50vw + 50%) !important;
    margin-right: calc(-50vw + 50%) !important;
    width: 100vw !important;
    padding: 16px calc(50vw - 50% + 20px) !important;
    box-sizing: border-box !important;
}

[data-theme="light"] .header-nav {
    background: rgba(0, 0, 0, 0.03) !important;
}

/* Upper neon gradient separator */
body .header-nav::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 1.5px !important;
    background: linear-gradient(90deg, transparent 0%, rgba(var(--primary-blue-rgb), 0.8) 15%, rgba(var(--primary-orange-rgb), 0.8) 85%, transparent 100%) !important;
    display: block !important;
    z-index: 10 !important;
    pointer-events: none !important;
    box-shadow: 0 1px 8px rgba(var(--primary-blue-rgb), 0.35) !important;
}

[data-theme="light"] .header-nav::before,
[data-theme="light"] body .header-nav::before {
    content: "" !important;
    display: block !important;
    background: linear-gradient(90deg, transparent 0%, rgba(var(--primary-blue-rgb), 0.5) 15%, rgba(var(--primary-orange-rgb), 0.5) 85%, transparent 100%) !important;
    box-shadow: 0 1px 5px rgba(var(--primary-blue-rgb), 0.15) !important;
}

/* Lower neon gradient separator */
body .header-nav::after {
    content: "" !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 1.5px !important;
    background: linear-gradient(90deg, transparent 0%, rgba(var(--primary-blue-rgb), 0.8) 15%, rgba(var(--primary-orange-rgb), 0.8) 85%, transparent 100%) !important;
    display: block !important;
    z-index: 10 !important;
    pointer-events: none !important;
    box-shadow: 0 1px 8px rgba(var(--primary-blue-rgb), 0.35) !important;
}

[data-theme="light"] .header-nav::after,
[data-theme="light"] body .header-nav::after {
    content: "" !important;
    display: block !important;
    background: linear-gradient(90deg, transparent 0%, rgba(var(--primary-blue-rgb), 0.5) 15%, rgba(var(--primary-orange-rgb), 0.5) 85%, transparent 100%) !important;
    box-shadow: 0 1px 5px rgba(var(--primary-blue-rgb), 0.15) !important;
}




.nav-links {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

body .btn-categories {
    clip-path: none !important;
    border-radius: 10px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.3px !important;
    text-transform: uppercase !important;
    background: rgba(var(--primary-blue-rgb), 0.1) !important;
    border: 1px solid rgba(var(--primary-blue-rgb), 0.25) !important;
    color: var(--primary-blue) !important;
    padding: 9px 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    transition: none !important;
    box-shadow: none !important;
    width: auto !important;
    min-width: auto !important;
    transform: none !important;
}

body .btn-categories:hover {
    background: rgba(var(--primary-blue-rgb), 0.1) !important;
    color: var(--primary-blue) !important;
    border-color: rgba(var(--primary-blue-rgb), 0.25) !important;
    transform: none !important;
    box-shadow: none !important;
    filter: none !important;
    letter-spacing: 0.3px !important;
    font-size: 13px !important;
    padding: 9px 12px !important;
    gap: 6px !important;
}



.btn-categories::after {
    display: none !important;
}

.nav-item-modern {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-radius: 10px !important;
    padding: 9px 18px !important;
    margin: 0 !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    color: rgba(255, 255, 255, 0.65) !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    transform: none !important;
    text-decoration: none !important;
}


.nav-item-modern::before,
.nav-item-modern::after {
    content: none !important;
    display: none !important;
}

.nav-item-modern:hover,
.nav-item-modern.active {
    background: rgba(var(--primary-blue-rgb), 0.08) !important;
    border-color: rgba(var(--primary-blue-rgb), 0.3) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
}

[data-theme="light"] .nav-item-modern {
    background: rgba(0, 0, 0, 0.02) !important;
    border: 1px solid rgba(0, 0, 0, 0.04) !important;
    color: #475569 !important;
}

[data-theme="light"] .nav-item-modern:hover,
[data-theme="light"] .nav-item-modern.active {
    background: rgba(var(--primary-blue-rgb), 0.05) !important;
    border-color: rgba(var(--primary-blue-rgb), 0.25) !important;
    color: var(--primary-blue) !important;
    transform: translateY(-1px) !important;
}

.nav-item-modern img {
    width: 22px !important;
    height: 22px !important;
    object-fit: contain !important;
    border-radius: 4px !important;
    transition: transform 0.2s ease !important;
}

.nav-item-modern:hover img {
    transform: scale(1.1) !important;
}

.btn-categories svg {
    width: 20px !important;
    height: 20px !important;
}


/* 8. MOBILE ACTIONS & BUTTONS OVERRIDES */
.mobile-action-btn {
    border-radius: 10px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px !important;
    text-transform: uppercase !important;
    height: 40px !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.mobile-header-row-2 .btn-register {
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    color: #ffffff !important;
}

.mobile-header-row-2 .btn-login-mobile {
    background: linear-gradient(135deg, var(--primary-blue) 0%, var(--primary-orange) 100%) !important;
    border: none !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(var(--primary-blue-rgb), 0.2) !important;
}

.mobile-header-row-2 .btn-balance {
    background: linear-gradient(135deg, var(--primary-blue) 0%, var(--primary-orange) 100%) !important;
    border: none !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(var(--primary-blue-rgb), 0.2) !important;
}

.mobile-header-row-2 .btn-account {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    color: #ffffff !important;
}

[data-theme="light"] .mobile-header-row-2 .btn-register {
    border: 1.5px solid var(--primary-blue) !important;
    color: var(--primary-blue) !important;
    -webkit-text-fill-color: var(--primary-blue) !important;
    background: transparent !important;
}

[data-theme="light"] .mobile-header-row-2 .btn-login-mobile {
    background: linear-gradient(135deg, var(--primary-blue) 0%, var(--primary-orange) 100%) !important;
    border: none !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(var(--primary-blue-rgb), 0.15) !important;
}

[data-theme="light"] .mobile-header-row-2 .btn-balance {
    background: linear-gradient(135deg, var(--primary-blue) 0%, var(--primary-orange) 100%) !important;
    border: none !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(var(--primary-blue-rgb), 0.15) !important;
}

[data-theme="light"] .mobile-header-row-2 .btn-account {
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    background: rgba(0, 0, 0, 0.02) !important;
    color: #475569 !important;
}

/* Light theme contrast & readability optimization */
[data-theme="light"] body .top-announcement::before {
    background: #ffffff !important;
    color: #0f172a !important; /* Deep dark slate text for maximum readability */
    border: 1px solid rgba(0, 0, 0, 0.12) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
}

[data-theme="light"] body .top-announcement::after {
    background-color: var(--primary-orange) !important; /* Stand out beautifully as vibrant orange */
    box-shadow: 0 0 6px var(--primary-orange) !important;
}

[data-theme="light"] .header-nav {
    background: rgba(0, 0, 0, 0.03) !important;
    border: none !important;
    box-shadow: none !important;
}


/* Mobile responsive adjustments for the new floating bubble design */
@media (max-width: 768px) {
    body .top-announcement {
        padding: 0 0 0 95px !important;
    }
    body .top-announcement::before {
        left: 8px !important;
        height: 20px !important;
        padding: 0 8px 0 16px !important;
        font-size: 8px !important;
        letter-spacing: 0.5px !important;
        width: auto !important;
        min-width: auto !important;
    }
    body .top-announcement::after {
        left: 13px !important;
        width: 4px !important;
        height: 4px !important;
    }
}

/* ════════════════════════════════════════════════════════
   MOBİL HEADER — PC ile aynı neon çizgi efektleri
═══════════════════════════════════════════════════════════ */
.mobile-header {
    position: relative !important;
    isolation: isolate !important;
    padding: 0 !important;
    /* Container padding'ini ezerek tam genişliğe taş */
    margin-left: -15px !important;
    margin-right: -15px !important;
    width: calc(100% + 30px) !important;
    box-sizing: border-box !important;
    background: linear-gradient(180deg, rgba(10, 11, 18, 0.97) 0%, rgba(6, 7, 12, 0.99) 100%) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    box-shadow:
        0 1px 0 rgba(0, 240, 255, 0.25),
        0 8px 30px rgba(0, 0, 0, 0.40) !important;
}

.mobile-header-row-1,
.mobile-header-row-2 {
    padding-left: 16px !important;
    padding-right: 16px !important;
}

/* Üst animasyonlu neon çizgi */
.mobile-header::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 2px !important;
    background: linear-gradient(90deg,
        transparent 0%, var(--primary-blue) 20%,
        var(--primary-orange) 50%, var(--primary-blue) 80%,
        transparent 100%) !important;
    background-size: 200% 100% !important;
    animation: mobile-headerline 5s linear infinite !important;
    box-shadow: 0 0 10px rgba(var(--primary-blue-rgb), 0.6) !important;
    z-index: 10 !important;
    pointer-events: none !important;
    display: block !important;
}

/* Alt soft glow ayırıcı çizgi */
.mobile-header::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 5% !important;
    right: 5% !important;
    height: 1px !important;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(var(--primary-blue-rgb), 0.55) 30%,
        rgba(var(--primary-orange-rgb), 0.45) 70%,
        transparent 100%) !important;
    z-index: 10 !important;
    pointer-events: none !important;
    display: block !important;
    opacity: 0.85 !important;
}

@keyframes mobile-headerline {
    0%   { background-position: 100% 0; }
    100% { background-position: -100% 0; }
}

/* Light modda mobil header */
[data-theme="light"] .mobile-header {
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(16px) !important;
    box-shadow:
        0 1px 0 rgba(var(--primary-blue-rgb), 0.3),
        0 4px 20px rgba(0, 0, 0, 0.08) !important;
}
[data-theme="light"] .mobile-header::before {
    box-shadow: 0 0 8px rgba(var(--primary-blue-rgb), 0.4) !important;
}
[data-theme="light"] .mobile-header::after {
    opacity: 0.6 !important;
}

/* ════════════════════════════════════════════════════════
   AUTH MODAL — Mobilde kaydırılabilir kayıt formu
═══════════════════════════════════════════════════════════ */

/* Overlay: flex-start + scroll — içerik alta taşmasın */
body .auth-modal-overlay {
    align-items: flex-start !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 20px 15px !important;
}

/* Container: max-height kaldır, tam genişlik ve scroll */
body .auth-modal-container {
    max-height: none !important;
    overflow: visible !important;
    margin: auto !important;
    flex-shrink: 0 !important;
}

@media (max-width: 600px) {
    body .auth-modal-overlay {
        padding: 12px 10px !important;
        align-items: flex-start !important;
    }
    body .auth-modal-container {
        width: 100% !important;
        max-width: 100% !important;
        border-radius: 24px !important;
        margin: 0 auto !important;
    }
}

/* ════════════════════════════════════════════════════════
   SLIDER — Sade Predunya detayları (flat mode override)
═══════════════════════════════════════════════════════════ */

/* Tüm hero kartlarda ince mavi border */
body .hero-card.main-slide,
body .hero-card.side-card {
    box-shadow:
        0 0 0 1px rgba(var(--primary-blue-rgb), 0.35),
        0 8px 32px rgba(0, 0, 0, 0.35) !important;
}

/* Hover'da hafif parlaklık */
body .hero-card.main-slide:hover,
body .hero-card.side-card:hover {
    transform: translateY(-3px) !important;
    box-shadow:
        0 0 0 1px rgba(var(--primary-blue-rgb), 0.55),
        0 0 24px rgba(var(--primary-blue-rgb), 0.20),
        0 16px 40px rgba(0, 0, 0, 0.45) !important;
}

/* Slider başlık metni: yumuşak açık ton */
body .hero-card .card-title {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.45) !important;
}

/* Açıklama metni */
body .hero-card .card-desc {
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) !important;
}

/* Slider aksiyon butonu: temiz, hafif glow */
body .slider-action-btn {
    box-shadow:
        0 4px 14px rgba(0, 0, 0, 0.25),
        0 0 10px rgba(var(--primary-blue-rgb), 0.20) !important;
}
body .slider-action-btn:hover {
    transform: translateY(-2px) !important;
    box-shadow:
        0 8px 22px rgba(0, 0, 0, 0.35),
        0 0 18px rgba(var(--primary-blue-rgb), 0.35) !important;
}

/* Progress circle: mavi çizgi */
body .hero-card .circular-chart .circle-progress {
    stroke: var(--primary-blue) !important;
}


/* ════════════════════════════════════════════════════════
   ÖNE ÇIKAN KATEGORİLER (popular-cats) — Predunya Özel
   Diğer vitrin bölümleriyle uyumlu entegre tasarım.
═══════════════════════════════════════════════════════════ */

/* Ana section: margin ayarı */
body .popular-cats-section {
    margin-top: 10px !important;
    margin-bottom: 25px !important;
}

.product-card-modern .product-badge,
.listing-product-card .product-badge,
.vt-products .product-card-modern .product-badge {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    border-bottom: 1px solid var(--border-color) !important;
    border-top: none !important;
}

/* ── Slider Arrows (Header İçinde) ── */
body .popular-slider-arrows {
    display: flex !important;
    gap: 0 !important;
    border: 1px solid #2a2e3d !important;
    border-radius: 8px !important;
    overflow: hidden !important;
}

body .slider-arrow {
    background: #181b27 !important;
    border: none !important;
    border-radius: 0 !important;
    color: #9ca3b4 !important;
    width: 36px !important;
    height: 36px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: background 0.15s ease, color 0.15s ease !important;
    font-size: 14px !important;
    padding: 0 !important;
    box-shadow: none !important;
    transform: none !important;
}

body .slider-arrow.prev {
    border-right: 1px solid #2a2e3d !important;
}

body .slider-arrow:hover {
    background: #1f2438 !important;
    color: #3b82f6 !important;
}

body .slider-arrow:active {
    background: #252b42 !important;
}

/* ── Slider Track ── */
body .popular-cats-track {
    display: flex !important;
    gap: 12px !important;
    overflow-x: auto !important;
    scroll-behavior: smooth !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    padding: 5px 20px 10px 20px !important;
    margin: 0 -20px !important;
    scroll-snap-type: none !important; /* KILLS THE BROWSER AUTO-SCROLL BUG! */
    justify-content: flex-start !important; /* Forces left alignment */
}

body .popular-cats-track::-webkit-scrollbar {
    display: none !important;
}

/* ── Kategori Kartı ── */
body .popular-cat-card {
    flex: 0 0 auto !important;
    width: 152px !important;
    height: 215px !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    display: block !important;
    border: none !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
    position: relative !important;
    background: #1a1d2c !important;
    text-decoration: none !important;
}

/* Hafif alt gradient — karartma */
body .popular-cat-card::after {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(
        to top,
        rgba(0, 0, 0, 0.3) 0%,
        transparent 40%
    ) !important;
    border-radius: 10px !important;
    pointer-events: none !important;
    opacity: 1 !important;
    z-index: 1 !important;
}

/* Görsel */
body .popular-cat-card img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.28s ease !important;
    display: block !important;
    position: relative !important;
    z-index: 0 !important;
}

/* Hover: hafif kalkış */
body .popular-cat-card:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.55) !important;
}

body .popular-cat-card:hover img {
    transform: scale(1.05) !important;
}

/* ── Responsive ── */
@media (max-width: 768px) {
    body .popular-cat-card {
        width: 120px !important;
        height: 170px !important;
        border-radius: 8px !important;
    }
    body .slider-arrow {
        width: 32px !important;
        height: 32px !important;
    }
}

@media (max-width: 480px) {
    body .popular-cat-card {
        width: 105px !important;
        height: 150px !important;
    }
    body .popular-cats-track {
        gap: 9px !important;
    }
}

/* ════ MOBİL BUTON — Son override, tüm kuralları ezer ════ */
@media (max-width: 768px) {
    html body .product-card-modern .btn-buy-modern,
    html body .listing-card-info .listing-buy-btn,
    html body .listing-buy-btn,
    html body .btn-buy-modern,
    html body .vt-buy-btn {
        padding: 5px 7px !important;
        font-size: 9px !important;
        letter-spacing: 0 !important;
        gap: 4px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        white-space: nowrap !important;
        border-radius: 6px !important;
        min-width: unset !important;
        width: auto !important;
        height: auto !important;
        line-height: 1 !important;
    }
    html body .product-card-modern .btn-buy-modern i,
    html body .listing-buy-btn i,
    html body .btn-buy-modern i,
    html body .btn-buy-modern .fas,
    html body .listing-buy-btn .fas {
        display: inline-block !important;
        font-size: 9px !important;
        flex-shrink: 0 !important;
    }
}

@media (max-width: 480px) {
    .product-card-modern .btn-buy-modern,
    .listing-card-info .listing-buy-btn,
    .listing-buy-btn,
    .vt-products .product-card-modern .vt-buy-btn {
        padding: 4px 7px !important;
        font-size: 8px !important;
    }
}

/* ── FULL WIDTH NAVIGATION BAR (DUYURU GİBİ BOYUNCA UZANMA) ── */
.header-nav {
    display: flex !important;
    align-items: center !important;
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    left: 0 !important;
    right: 0 !important;
    padding: 16px 0 !important;
    box-sizing: border-box !important;
    border-radius: 0 !important;
    border-left: none !important;
    border-right: none !important;
    background: rgba(255, 255, 255, 0.02) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    margin-top: 18px !important;
}

[data-theme="light"] .header-nav {
    background: rgba(0, 0, 0, 0.03) !important;
    border-left: none !important;
    border-right: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Neon separator lines going full-screen width */
body .header-nav::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 1.5px !important;
    background: linear-gradient(90deg, transparent 0%, rgba(var(--primary-blue-rgb), 0.8) 15%, rgba(var(--primary-orange-rgb), 0.8) 85%, transparent 100%) !important;
    display: block !important;
    z-index: 10 !important;
    pointer-events: none !important;
    box-shadow: 0 1px 8px rgba(var(--primary-blue-rgb), 0.35) !important;
}

body .header-nav::after {
    content: "" !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 1.5px !important;
    background: linear-gradient(90deg, transparent 0%, rgba(var(--primary-blue-rgb), 0.8) 15%, rgba(var(--primary-orange-rgb), 0.8) 85%, transparent 100%) !important;
    display: block !important;
    z-index: 10 !important;
    pointer-events: none !important;
    box-shadow: 0 1px 8px rgba(var(--primary-blue-rgb), 0.35) !important;
}

[data-theme="light"] .header-nav::before,
[data-theme="light"] body .header-nav::before {
    background: linear-gradient(90deg, transparent 0%, rgba(var(--primary-blue-rgb), 0.5) 15%, rgba(var(--primary-orange-rgb), 0.5) 85%, transparent 100%) !important;
    box-shadow: 0 1px 5px rgba(var(--primary-blue-rgb), 0.15) !important;
}

[data-theme="light"] .header-nav::after,
[data-theme="light"] body .header-nav::after {
    background: linear-gradient(90deg, transparent 0%, rgba(var(--primary-blue-rgb), 0.5) 15%, rgba(var(--primary-orange-rgb), 0.5) 85%, transparent 100%) !important;
    box-shadow: 0 1px 5px rgba(var(--primary-blue-rgb), 0.15) !important;
}


/* ════════════════════════════════════════════════════════
   FINAL CORPORATE & MODERN REDESIGN OVERRIDES (CLEAN & TRUSTWORTHY)
   Stripping all remaining cyberpunk neon lines, text shadows,
   Orbitron/Rajdhani fonts, and siberian glow shadows.
   ========================================================= */

/* 1. Global Typography Reset */
*:not(i):not([class*="fa-"]):not([class*="ti-"]):not(.fa):not(.fas):not(.far):not(.fab):not(.fal):not(.fad):not(.ti):not(.material-icons):not(.material-symbols-outlined) {
    font-family: 'Inter', 'Outfit', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

h1, h2, h3, h4, h5, h6,
.logo-text-blue,
.logo-text-orange,
.section-title,
.btn-categories,
.cat-tab-btn,
.showcase-tab,
.current-price-v2,
.discount-badge-v2,
.vt-stat-val,
.vt-section-title {
    font-family: 'Outfit', 'Inter', sans-serif !important;
    letter-spacing: -0.01em !important;
    text-shadow: none !important;
}

/* 2. Logo Area Refinement */
.logo-text-blue,
[data-theme="light"] .logo-text-blue {
    color: var(--primary-blue, #2563eb) !important;
    background: none !important;
    -webkit-text-fill-color: initial !important;
    text-shadow: none !important;
}
.logo-text-orange,
[data-theme="light"] .logo-text-orange {
    color: var(--primary-orange, #f97316) !important;
    background: none !important;
    -webkit-text-fill-color: initial !important;
    text-shadow: none !important;
}
.logo, .mobile-logo {
    filter: none !important;
}
.logo:hover, .mobile-logo:hover {
    filter: none !important;
}

/* 3. Strip all Neon/Siber lines & highlights from Header & Footer */
.main-header::before,
.main-header::after,
.mobile-header::before,
.mobile-header::after,
.main-footer::before,
.main-footer::after {
    display: none !important;
    content: none !important;
    background: none !important;
    box-shadow: none !important;
}

.main-header,
[data-theme="light"] .main-header {
    border-bottom: 1px solid var(--border-color) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03) !important;
}

/* 2. Başlık Yazısı - Net ve Kurumsal (Gradient İptal) */
body .showcase-title {
    margin: 0 !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em !important;
    text-transform: none !important;
    color: var(--text-color) !important;
    background: none !important;
    -webkit-background-clip: unset !important;
    -webkit-text-fill-color: unset !important;
    text-shadow: none !important;
}
.mobile-header,
[data-theme="light"] .mobile-header {
    border-bottom: 1px solid var(--border-color) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04) !important;
}

/* 4. Sleek Search Container */
.search-container {
    border: 1px solid var(--border-color) !important;
    background: rgba(255, 255, 255, 0.02) !important;
    box-shadow: none !important;
}
[data-theme="light"] .search-container {
    background: #ffffff !important;
    border: 1.5px solid #e2e8f0 !important;
}
.search-container:focus-within {
    border-color: var(--primary-blue) !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1) !important;
}
[data-theme="light"] .search-container:focus-within {
    border-color: var(--primary-blue) !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1) !important;
}
.search-input {
    font-family: 'Inter', sans-serif !important;
}

/* 5. Modern Button States (Remove Neons & Gradients) */
.icon-btn {
    border: 1px solid var(--border-color) !important;
    background: rgba(255, 255, 255, 0.02) !important;
    color: var(--text-color) !important;
    box-shadow: none !important;
}
.icon-btn:hover {
    background: var(--ft-steel) !important;
    color: var(--primary-blue) !important;
    border-color: rgba(37, 99, 235, 0.3) !important;
    box-shadow: none !important;
}
[data-theme="light"] .icon-btn {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
}
[data-theme="light"] .icon-btn:hover {
    background: #f1f5f9 !important;
    border-color: var(--primary-blue) !important;
}

.btn-login,
.btn-login-mobile {
    background: var(--primary-blue) !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.2) !important;
}
.btn-login:hover,
.btn-login-mobile:hover {
    background: var(--primary-blue-deep, #1d4ed8) !important;
    box-shadow: 0 6px 16px rgba(37, 99, 235, 0.3) !important;
    transform: translateY(-1px) !important;
}
.btn-register-desktop {
    background: transparent !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-color) !important;
    box-shadow: none !important;
}
.btn-register-desktop:hover {
    background: rgba(255, 255, 255, 0.04) !important;
    border-color: var(--primary-blue) !important;
    color: var(--primary-blue) !important;
    transform: translateY(-1px) !important;
}
[data-theme="light"] .btn-register-desktop {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    color: #0f172a !important;
}
[data-theme="light"] .btn-register-desktop:hover {
    background: #f8fafc !important;
    border-color: var(--primary-blue) !important;
    color: var(--primary-blue) !important;
}

/* 6. Section Titles */
.section-title {
    background: none !important;
    -webkit-background-clip: initial !important;
    -webkit-text-fill-color: initial !important;
    background-clip: initial !important;
    color: var(--text-color) !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    text-transform: none !important;
}
.section-title::before {
    background: var(--primary-blue) !important;
    box-shadow: none !important;
}

/* 7. Sleek Product Cards */
.product-card-modern,
.listing-product-card,
.vt-products .product-card-modern {
    background: var(--card-bg) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
    border-radius: 4px !important; /* Sharp corners / Sert köşeli */
    overflow: hidden !important; /* Prevents badges/images overflowing top corners */
}
.product-card-modern::before,
.product-card-modern::after,
.listing-product-card::before,
.listing-product-card::after {
    display: none !important;
    content: none !important;
}
.product-card-modern:hover,
.listing-product-card:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(37, 99, 235, 0.3) !important;
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3) !important;
}
[data-theme="light"] .product-card-modern:hover,
[data-theme="light"] .listing-product-card:hover {
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.08) !important;
}
.product-image-area,
.vt-products .product-image-area {
    aspect-ratio: 1 / 1 !important;
    width: 100% !important;
    height: auto !important;
    overflow: hidden !important;
    transform: translateZ(0) !important; /* Forces clip on hover scale */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #0b0f19 !important; /* Premium slate dark background */
    border-radius: 0 !important; /* Card overflow hidden handles rounded corners */
}
[data-theme="light"] .product-image-area,
[data-theme="light"] .vt-products .product-image-area {
    background: #f8fafc !important; /* Pristine light mode background */
}
.product-char-img,
.vt-products .product-char-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important; /* Renders the entire 1000x1000 image clearly without cropping */
    object-position: center !important;
    display: block !important;
}
.product-info-area {
    background: transparent !important;
    border-top: 1px solid var(--border-color) !important;
    border-radius: 0 0 4px 4px !important;
}
.product-card-modern .product-badge,
.listing-product-card .product-badge,
.vt-products .product-card-modern .product-badge {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    border-bottom: 1px solid var(--border-color) !important;
    border-top: none !important;
}
.btn-buy-modern,
.listing-buy-btn,
.vt-buy-btn {
    border-radius: 4px !important; /* Matching sharp corners for CTA button */
}

/* 8. Pricing & Badges Reset */
.current-price-v2,
.currency-v2 {
    background: none !important;
    -webkit-background-clip: initial !important;
    -webkit-text-fill-color: initial !important;
    background-clip: initial !important;
    color: var(--text-color) !important;
    font-weight: 700 !important;
    letter-spacing: -0.02em !important;
}
[data-theme="light"] .current-price-v2,
[data-theme="light"] .currency-v2 {
    color: #0f172a !important;
}
.discount-badge-v2 {
    background: #ef4444 !important;
    color: #ffffff !important;
    box-shadow: none !important;
    font-weight: 600 !important;
}

/* 9. Category & Tab Buttons */
/* (.showcase-tab kurumsal stil dosya sonunda yönetiliyor) */
.cat-tab-btn {
    background: rgba(255, 255, 255, 0.02) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-muted) !important;
    font-weight: 600 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
}
.cat-tab-btn:hover {
    color: var(--primary-blue) !important;
    border-color: rgba(37, 99, 235, 0.4) !important;
    background: rgba(37, 99, 235, 0.05) !important;
    box-shadow: none !important;
}
.cat-tab-btn.active {
    background: var(--primary-blue) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.2) !important;
}

/* 10. Clean Scrollbar */
::-webkit-scrollbar {
    width: 8px !important;
    height: 8px !important;
}
::-webkit-scrollbar-track {
    background: var(--bg-color) !important;
}
::-webkit-scrollbar-thumb {
    background: var(--border-color) !important;
    border-radius: 99px !important;
    box-shadow: none !important;
}
::-webkit-scrollbar-thumb:hover {
    background: var(--ft-steel) !important;
    box-shadow: none !important;
}
[data-theme="light"] ::-webkit-scrollbar-thumb {
    background: #cbd5e1 !important;
}
[data-theme="light"] ::-webkit-scrollbar-thumb:hover {
    background: #94a3b8 !important;
}

/* 11. Footer Final Clean up */
.main-footer {
    background: #090d16 !important;
    border-top: 1px solid var(--border-color) !important;
}
[data-theme="light"] .main-footer {
    background: #0f172a !important;
}
.footer-title {
    font-family: 'Outfit', sans-serif !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
}
.footer-title::before {
    display: none !important;
}
.footer-social-minimal a {
    background: rgba(255, 255, 255, 0.02) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-muted) !important;
    box-shadow: none !important;
}
.footer-social-minimal a:hover {
    background: var(--primary-blue) !important;
    color: #ffffff !important;
    border-color: transparent !important;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.2) !important;
    transform: translateY(-2px) !important;
}
.footer-bottom {
    border-top: 1px solid var(--border-color) !important;
}

/* 12. Siparislerim / Destek Bilgilendirme Kutuları */
.order-info-box-yellow {
    background: rgba(245, 158, 11, 0.05) !important;
    border: 1px solid rgba(245, 158, 11, 0.2) !important;
    color: #f59e0b !important;
    border-radius: 8px !important;
}
.order-info-box-green {
    background: rgba(16, 185, 129, 0.05) !important;
    border: 1px solid rgba(16, 185, 129, 0.2) !important;
    color: #10b981 !important;
    border-radius: 8px !important;
}


/* ════════════════════════════════════════════════════════
   13. EQUAL HEIGHT & SYMMETRICAL LAYOUT FOR PRODUCT LISTINGS
   Guarantees all product cards inside sliders, grids, and rows
   occupy exactly the same height and align symmetrically.
   ========================================================= */
.swiper-slide,
.slick-slide,
.vt-products .slick-slide,
.card-slider-wrapper {
    display: flex !important;
    height: auto !important; /* Force slider slides to stretch equally */
    align-items: stretch !important;
}

.product-card-modern,
.listing-product-card,
.vt-products .product-card-modern {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    overflow: hidden !important;
}

.product-info-area,
.vt-products .product-card-modern .product-info-area {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    justify-content: space-between !important; /* Vertically align top title & bottom price/button */
}

/* Ensure the title has a consistent box layout so spacing matches */
.product-card-modern .product-name-small,
.listing-product-card .product-name-small,
.vt-products .product-card-modern .product-name-small {
    min-height: 2.6em !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    margin-bottom: 8px !important;
}

/* Force bottom price/button row to the absolute bottom of the info area */
.product-info-row-v2,
.vt-products .product-card-modern .product-info-row-v2 {
    margin-top: auto !important; /* Pushes the price and button to the absolute bottom line */
}


/* ════════════════════════════════════════════════════════
   14. TOP UTILITY BAR ADAPTIVE DAY/NIGHT COMPATIBILITY
   Fixes the core layout bug where the top utility bar stays light
   with a white background in dark mode, making it perfectly cohesive
   with both light and dark corporate modes of the prefix theme.
   ========================================================= */
body .top-utility-bar {
    background: #090d16 !important; /* Premium dark slate background for dark mode */
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    color: #94a3b8 !important;
}

body .tub-item {
    color: #cbd5e1 !important;
    transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

body .tub-item:hover {
    background: rgba(255, 255, 255, 0.04) !important;
    color: #ffffff !important;
}

body .tub-badge {
    color: #cbd5e1 !important;
}

body .tub-badge i {
    color: #22c55e !important; /* Vibrant green shield for dark mode */
}

/* Light Mode Overrides for Top Utility Bar */
[data-theme="light"] body .top-utility-bar {
    background: #f8fafc !important; /* Clean platin grey/white background */
    border-bottom: 1px solid #e2e8f0 !important;
    color: #475569 !important;
}

[data-theme="light"] body .tub-item {
    color: #475569 !important;
}

[data-theme="light"] body .tub-item:hover {
    background: rgba(0, 0, 0, 0.04) !important;
    color: #0f172a !important;
}

[data-theme="light"] body .tub-badge {
    color: #475569 !important;
}

[data-theme="light"] body .tub-badge i {
    color: #10b981 !important; /* Standard green shield for light mode */
}


/* --- FIX BTN-CATEGORIES TEXT COLOR IN LIGHT MODE --- */
[data-theme="light"] body .btn-categories,
[data-theme="light"] body .header-nav .btn-categories,
[data-theme="light"] body .btn-text,
[data-theme="light"] body .view-all-link {
    color: #ffffff !important;
    border-color: var(--primary-blue) !important;
    background: var(--primary-blue) !important;
}
[data-theme="light"] body .btn-categories:hover,
[data-theme="light"] body .header-nav .btn-categories:hover,
[data-theme="light"] body .btn-text:hover,
[data-theme="light"] body .view-all-link:hover {
    color: #ffffff !important;
    border-color: var(--primary-blue) !important;
    background: var(--primary-blue) !important;
    box-shadow: none !important;
    transform: none !important;
}

/* --- HERO SECTION SERT KÖŞE (PREFIX THEME) --- */
body .hero-card,
body .hero-card.main-slide,
body .hero-card.side-card,
body .side-banner-wrap,
body .side-banner-wrap .side-banner-img,
body .sc-center,
body .sc-tl,
body .sc-bl,
body .sc-tr,
body .sc-br,
body .sc-side {
    border-radius: 4px !important;
    overflow: hidden !important;
}

/* --- BLOG BÖLÜMÜ: EFEKTLERİ KALDIR (PREFIX THEME) --- */
body .blog-section {
    padding-top: 10px !important; /* Üstteki çok boşluğu azaltmak için */
}
body .blog-section .section-header {
    background: var(--card-bg) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    padding: 12px 20px !important;
    border-radius: 4px !important;
    margin-bottom: 24px !important;
}
body .blog-section .section-header::before,
body .blog-section .section-header::after {
    display: none !important;
    content: none !important;
    animation: none !important;
}
/* --- KURUMSAL BLOG KARTI --- */
body .blog-card {
    border-radius: 4px !important;
    box-shadow: none !important;
    border: 1px solid var(--border-color) !important;
    overflow: hidden !important;
}
body .blog-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.05) !important;
    transform: translateY(-2px) !important;
}
body .blog-card::before,
body .blog-card::after {
    display: none !important;
    content: none !important;
}
body .blog-card .blog-overlay {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    background: var(--card-bg, #ffffff) !important;
    padding: 16px !important;
    border-top: 1px solid var(--border-color) !important;
}
body .blog-card .blog-title {
    color: var(--text-color) !important;
    text-shadow: none !important;
    margin-bottom: 12px !important;
    font-size: 15px !important;
}
body .blog-card .read-more {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(37, 99, 235, 0.08) !important;
    color: var(--primary-blue) !important;
    border: 1px solid rgba(37, 99, 235, 0.15) !important;
    padding: 10px 16px !important;
    border-radius: 4px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-shadow: none !important;
    transition: all 0.2s ease !important;
    letter-spacing: 0 !important;
}
body .blog-card:hover .read-more {
    background: var(--primary-blue) !important;
    color: #ffffff !important;
    letter-spacing: 0 !important;
    border-color: var(--primary-blue) !important;
}
body .blog-card:hover .read-more i {
    transform: none !important;
}
body .blog-card .blog-date {
    border-radius: 4px !important;
    background: var(--card-bg, #ffffff) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    padding: 6px 10px !important;
    top: 10px !important;
    left: 10px !important;
}
body .blog-card .blog-date span,
body .blog-card .blog-date span:first-child,
body .blog-card .blog-date span:last-child {
    color: var(--text-color) !important;
    text-shadow: none !important;
}
body .blog-card:hover .blog-date {
    background: var(--card-bg, #ffffff) !important;
    border-color: var(--border-color) !important;
    box-shadow: none !important;
}
body .blog-card:hover .blog-date span,
body .blog-card:hover .blog-date span:first-child,
body .blog-card:hover .blog-date span:last-child {
    color: var(--text-color) !important;
    text-shadow: none !important;
}

/* --- GENEL NEON EFEKT TEMİZLİĞİ (PREFIX THEME) --- */
body .showcase-header {
    background: var(--card-bg, #ffffff) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    padding: 20px 24px !important; /* Artırılmış yükseklik/genişlik (%30+) */
    border-radius: 6px !important;
    margin-bottom: 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

body .cat-section-header {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    padding: 0 0 16px 0 !important;
    border-radius: 0 !important;
    border-bottom: 1px solid var(--border-color) !important;
    display: block !important;
}
body .cat-section-header::before, body .cat-section-header::after,
body .showcase-header::before, body .showcase-header::after,
body .firsatlar-header::before, body .firsatlar-header::after {
    display: none !important;
    content: none !important;
}
html body .btn-text,
html body .btn-categories,
html body .view-all-link,
html body .blog-section .btn-text {
    box-shadow: none !important;
    text-shadow: none !important;
    background: var(--primary-blue) !important;
    color: #ffffff !important;
    border: 1px solid var(--primary-blue) !important;
    transform: none !important;
}
html body .btn-text:hover,
html body .btn-categories:hover,
html body .view-all-link:hover,
html body .blog-section .btn-text:hover {
    box-shadow: none !important;
    transform: none !important;
    background: var(--primary-blue) !important;
    color: #ffffff !important;
    border-color: var(--primary-blue) !important;
}
body .btn-text i, 
body .btn-text .fas,
html body .blog-section .btn-text i,
html body .blog-section .btn-text .fas {
    background: transparent !important;
    box-shadow: none !important;
    color: #ffffff !important;
    transform: none !important;
}

/* Başlık Metinlerindeki Gradient Efektini Kaldır */
body .section-title,
body .section-header h2,
body .cat-section-header h2,
body .showcase-header h2 {
    background: none !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
    -webkit-text-fill-color: var(--text-main) !important;
    color: var(--text-main) !important;
    text-shadow: none !important;
}

/* ════════════════════════════════════════════════════════
   SADE, KURUMSAL VE DİKKAT ÇEKİCİ TASARIM (NEONSUZ)
   Tüm gradient, neon, blur ve ışıklı efektler kaldırılarak
   yerine net, profesyonel, modern ve kurumsal bir kart 
   (Apple/Stripe tarzı) tasarımı getirildi.
   ========================================================= */
/* Sadece parlama / neon çizgileri kapatıyoruz (tasarımı / kutuları bozmuyoruz) */
body .showcase-header::before,
body .showcase-header::after,
body .showcase-title-wrapper::before,
body .showcase-title-wrapper::after,
body .showcase-title-icon::before,
body .showcase-title-icon::after,
body .showcase-tab.active::before,
body .showcase-tab.active::after {
    display: none !important;
    content: none !important;
    background: none !important;
    box-shadow: none !important;
    animation: none !important;
}

body .showcase-title {
    text-shadow: none !important;
}



/* ════════════════════════════════════════════════════════
   16. VIEW ALL BUTTON KEYBOARD FOCUS & TAB COMPATIBILITY
   Enables perfect keyboard accessibility and tab-key compatibility
   for the "Tüm İlanlar" (.view-all-link) pill buttons across the site,
   lighting up with elegant, non-neon corporate focus rings and shifting icons.
   ========================================================= */
body .view-all-link:focus,
body .view-all-link:focus-visible {
    outline: none !important;
    border-color: rgba(var(--primary-blue-rgb), 0.6) !important;
    background: linear-gradient(180deg,
        rgba(var(--primary-blue-rgb), 0.10) 0%,
        rgba(var(--primary-blue-rgb), 0.02) 100%) !important;
    color: var(--primary-blue) !important;
    transform: translateY(-1px) !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.06) inset,
        0 0 0 3px rgba(var(--primary-blue-rgb), 0.35), /* Premium blue corporate focus ring */
        0 10px 26px rgba(var(--primary-blue-rgb), 0.20) !important;
}

[data-theme="light"] body .view-all-link:focus,
[data-theme="light"] body .view-all-link:focus-visible {
    border-color: var(--primary-blue) !important;
    color: var(--primary-blue) !important;
    box-shadow:
        0 1px 0 rgba(0, 0, 0, 0.02) inset,
        0 0 0 3px rgba(var(--primary-blue-rgb), 0.25), /* Clean blue focus ring */
        0 10px 26px rgba(var(--primary-blue-rgb), 0.10) !important;
}

body .view-all-link:focus i,
body .view-all-link:focus-visible i,
body .view-all-link:focus .fas,
body .view-all-link:focus-visible .fas {
    background: var(--primary-blue) !important;
    color: #ffffff !important;
    transform: translateX(3px) !important;
    box-shadow: inset 0 0 0 1px var(--primary-blue) !important;
}


/* ════════════════════════════════════════════════════════
   17. PC SHOWCASE SLIDER ALIGNMENT, SYMMETRY & UX OPTIMIZATIONS
   Fixes layout distortion and alignment discrepancies in PC view:
   - Aligns showcase horizontal tracks perfectly with showcase headers and tabs.
   - Symmetrically grows slider cards when fewer cards are displayed to fill the container width.
   - Keeps horizontal scrolls perfectly fluid and bounds-aligned.
   - Introduces premium, extremely thin bottom scrollbars for PC users to navigate sliders gracefully.
   - Enhances old/crossed-out price contrast using corporate slate-gray tones instead of bright orange.
   ========================================================= */

/* Aligns the slider track bounds exactly with the showcase header container borders on PC,
   while providing a 16px horizontal shadow padding and negative margin to guarantee 
   absolutely zero clipping/slicing on the first and last cards! */
/* Ensure parent containers do not clip horizontal negative margin overflows, 
   guaranteeing 100% visible card shadows and border-radius rendering on slider edges. */
body .tab-content,
body .tab-pane-modern,
body .showcase-content,
body .showcase-section,
body .popular-cats-section,
body .popular-cats-track-wrapper,
#main-wrapper {
    overflow: visible !important;
}

body .showcase-slider-pc {
    padding: 8px 20px 16px 20px !important; /* Safe padding for shadows */
    margin: 0 -20px !important; /* Negative margin allows cards to bleed smoothly */
    scroll-snap-type: none !important; /* KILLS THE BROWSER AUTO-SCROLL BUG! */
    justify-content: flex-start !important; /* Absolutely forces cards to start at X=0 */
    overflow-x: auto !important;
    overflow-y: visible !important;
}

/* Tüm İlanlar Butonunun Tablarla Uyumlu Hale Getirilmesi (Flat/Sade görünüm) */
body .showcase-header .view-all-link {
    background: transparent !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-color) !important;
    padding: 6px 12px !important;
    border-radius: 4px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.4px !important;
    box-shadow: none !important;
    opacity: 0.8 !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    text-decoration: none !important;
    transition: opacity 0.3s ease, background 0.3s ease !important;
}
body .showcase-header .view-all-link:hover {
    opacity: 1 !important;
    background: rgba(var(--primary-blue-rgb), 0.04) !important;
    border-color: var(--primary-blue) !important;
    color: var(--primary-blue) !important;
}

body .showcase-header .view-all-link i,
body .showcase-header .view-all-link .fas {
    width: auto !important;
    height: auto !important;
    background: transparent !important;
    border-radius: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: inherit !important;
    color: inherit !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translateY(1px); /* Optik hizalama */
}

@media (max-width: 768px) {
    body .showcase-header .view-all-link {
        padding: 6px 10px !important;
        font-size: 10px !important;
        border-radius: 4px !important;
        gap: 5px !important;
    }
}

/* Premium micro-scrollbar for PC slider tracks to allow easy navigation without arrow buttons */
body .showcase-slider-pc {
    scrollbar-width: thin !important; /* Elegant Firefox scrollbar */
    scrollbar-color: rgba(var(--primary-blue-rgb), 0.25) transparent !important;
}
body .showcase-slider-pc::-webkit-scrollbar {
    display: block !important;
    height: 6px !important; /* Thin, elegant slider track indicator */
}
body .showcase-slider-pc::-webkit-scrollbar-track {
    background: transparent !important;
}
body .showcase-slider-pc::-webkit-scrollbar-thumb {
    background: rgba(var(--primary-blue-rgb), 0.15) !important;
    border-radius: 99px !important;
    transition: background 0.2s ease !important;
}
body .showcase-slider-pc::-webkit-scrollbar-thumb:hover {
    background: rgba(var(--primary-blue-rgb), 0.35) !important;
}

/* Dynamically grows slider cards when there is empty space on large screens,
   ensuring they align perfectly on both left and right edges. Caps card width
   at the standard 6-column grid dimension to prevent cards from becoming too wide. */
@media (min-width: 769px) {
    body .showcase-slider-pc .product-card-modern {
        flex: 1 0 210px !important;
        max-width: calc((100% - 75px) / 6) !important; /* Perfect 6-column limit symmetry */
        scroll-snap-align: start;
    }
}

/* ════════════════════════════════════════════════════════
   18. PROFESSIONAL SLATE-GRAY CONTRAST RESET FOR CROSSED-OUT PRICES
   Replaces the bright/yellow-orange neon crossed-out price colors with
   highly legible and professional cool-slate corporate tones.
   ========================================================= */

/* Dark Mode old price */
body .product-card-modern .old-price-v2,
body .listing-card-info .old-price-v2,
body .listing-old-price {
    color: #94a3b8 !important; /* Slate-400 */
    -webkit-text-fill-color: #94a3b8 !important;
    opacity: 0.8 !important;
}

/* Light Mode old price */
[data-theme="light"] body .product-card-modern .old-price-v2,
[data-theme="light"] body .listing-card-info .old-price-v2,
[data-theme="light"] body .listing-old-price {
    color: #475569 !important; /* Slate-600 */
    -webkit-text-fill-color: #475569 !important;
    opacity: 0.9 !important;
}

/* --- MOBILE OPTIMIZATION FOR SHOWCASE HEADER --- */
@media (max-width: 768px) {
    body .showcase-header {
        padding: 8px 12px !important;
        margin: 0 0 10px 0 !important;
        border-radius: 4px !important;
    }
    body .showcase-title {
        font-size: 15px !important;
        letter-spacing: 0 !important;
    }
    body .showcase-title-icon {
        width: 32px !important;
        height: 32px !important;
    }
    body .showcase-title-icon .fas,
    body .showcase-title-icon i {
        font-size: 14px !important;
    }
}

/* --- NAV ITEM MODERN OVERRIDES (PRESERVE CUSTOM COLORS AND MAKE EFFECTS STATIC) --- */
body .nav-item-modern,
body .nav-item-modern:hover,
body .nav-item-modern.active,
body .nav-item-modern:focus,
[data-theme="light"] body .nav-item-modern,
[data-theme="light"] body .nav-item-modern:hover,
[data-theme="light"] body .nav-item-modern.active,
[data-theme="light"] body .nav-item-modern:focus {
    border-color: color-mix(in srgb, var(--nav-item-color, var(--primary-blue)) 45%, transparent) !important;
    border-width: 1px !important;
    background: var(--card-bg) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
    transform: none !important; /* Statik kalması için hareket iptal edildi */
    transition: none !important; /* Hover geçişini tamamen iptal et */
}

/* Sadece ikonların rengi kategoriye özel olsun */
body .nav-item-modern i,
body .nav-item-modern img,
body .nav-item-modern svg {
    color: var(--nav-item-color, var(--primary-blue)) !important;
}

/* Yazılara renk efekti uygulanmasın, standart metin renginde okunabilir kalsın */
body .nav-item-modern .nav-text-modern,
body .nav-item-modern span {
    color: var(--text-color) !important;
    text-shadow: none !important;
}

/* --- HEADER NAV BACKGROUND FIX (Remove gray background effect in light mode) --- */
[data-theme="light"] .header-nav,
[data-theme="light"] body .header-nav {
    background: transparent !important;
}

/* --- FIX BTN-CATEGORIES TEXT COLOR IN LIGHT MODE --- */
[data-theme="light"] .btn-categories,
[data-theme="light"] body .btn-categories,
[data-theme="light"] .header-nav .btn-categories {
    color: var(--text-main) !important;
}

/* --- HERO SECTION SERT KÖŞE (PREFIX THEME) --- */
body .hero-card,
body .hero-card.main-slide,
body .hero-card.side-card,
body .hero-main,
body .hero-main .swiper-container,
body .hero-main .swiper-wrapper,
body .hero-main .swiper-slide,
body .slide-bg-img,
body .side-banner-wrap,
body .side-banner-wrap .side-banner-img,
body .sc-center,
body .sc-tl,
body .sc-bl,
body .sc-tr,
body .sc-br,
body .sc-side {
    border-radius: 4px !important;
    overflow: hidden !important;
}

/* --- BLOG BÖLÜMÜ: EFEKTLERİ KALDIR (PREFIX THEME) --- */
body .blog-section .section-header {
    background: var(--card-bg) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    padding: 12px 20px !important;
    border-radius: 4px !important;
    margin-bottom: 24px !important;
}
body .blog-section .section-header::before,
body .blog-section .section-header::after {
    display: none !important;
    content: none !important;
    animation: none !important;
}
/* --- KURUMSAL BLOG KARTI --- */
body .blog-card {
    border-radius: 4px !important;
    box-shadow: none !important;
    border: 1px solid var(--border-color) !important;
    overflow: hidden !important;
}
body .blog-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.05) !important;
    transform: translateY(-2px) !important;
}
body .blog-card::before,
body .blog-card::after {
    display: none !important;
    content: none !important;
}
body .blog-card .blog-overlay {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    background: var(--card-bg, #ffffff) !important;
    padding: 16px !important;
    border-top: 1px solid var(--border-color) !important;
}
body .blog-card .blog-title {
    color: var(--text-color) !important;
    text-shadow: none !important;
    margin-bottom: 12px !important;
    font-size: 15px !important;
}
body .blog-card .read-more {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(37, 99, 235, 0.08) !important;
    color: var(--primary-blue) !important;
    border: 1px solid rgba(37, 99, 235, 0.15) !important;
    padding: 10px 16px !important;
    border-radius: 4px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-shadow: none !important;
    transition: all 0.2s ease !important;
    letter-spacing: 0 !important;
}
body .blog-card:hover .read-more {
    background: var(--primary-blue) !important;
    color: #ffffff !important;
    letter-spacing: 0 !important;
    border-color: var(--primary-blue) !important;
}
body .blog-card:hover .read-more i {
    transform: none !important;
}
body .blog-card .blog-date {
    border-radius: 4px !important;
    background: var(--card-bg, #ffffff) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    padding: 6px 10px !important;
    top: 10px !important;
    left: 10px !important;
}
body .blog-card .blog-date span,
body .blog-card .blog-date span:first-child,
body .blog-card .blog-date span:last-child {
    color: var(--text-color) !important;
    text-shadow: none !important;
}
body .blog-card:hover .blog-date {
    background: var(--card-bg, #ffffff) !important;
    border-color: var(--border-color) !important;
    box-shadow: none !important;
}
body .blog-card:hover .blog-date span,
body .blog-card:hover .blog-date span:first-child,
body .blog-card:hover .blog-date span:last-child {
    color: var(--text-color) !important;
    text-shadow: none !important;
}

/* --- GENEL NEON EFEKT TEMİZLİĞİ (PREFIX THEME) --- */
body .showcase-header {
    background: var(--card-bg, #ffffff) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    padding: 20px 24px !important; /* Artırılmış yükseklik/genişlik (%30+) */
    border-radius: 6px !important;
    margin-bottom: 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

body .cat-section-header {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    padding: 0 0 16px 0 !important;
    border-radius: 0 !important;
    border-bottom: 1px solid var(--border-color) !important;
    display: block !important;
}
body .cat-section-header::before, body .cat-section-header::after,
body .showcase-header::before, body .showcase-header::after,
body .firsatlar-header::before, body .firsatlar-header::after {
    display: none !important;
    content: none !important;
}
body .btn-text,
body .btn-categories,
body .view-all-link {
    box-shadow: none !important;
    border: 1px solid var(--border-color) !important;
    background: transparent !important;
    text-shadow: none !important;
    color: var(--text-main) !important; /* Garantili okunaklı metin */
}
body .btn-text:hover,
body .btn-categories:hover,
body .view-all-link:hover {
    box-shadow: none !important;
    transform: none !important;
    background: var(--hover-bg, rgba(128, 128, 128, 0.1)) !important;
    color: var(--text-main) !important;
    border-color: var(--border-color) !important;
}
body .btn-text i, body .btn-text .fas {
    background: transparent !important;
    box-shadow: none !important;
}

/* Başlık Metinlerindeki Gradient Efektini Kaldır */
body .section-title,
body .section-header h2,
body .cat-section-header h2,
body .showcase-header h2 {
    background: none !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
    -webkit-text-fill-color: var(--text-main) !important;
    color: var(--text-main) !important;
    text-shadow: none !important;
}

/* --- TRUST ITEMS: EFEKTLERİ KALDIR (PREFIX THEME) --- */
body .trust-item {
    background: var(--card-bg) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: none !important;
    transform: none !important;
    padding: 16px 16px !important; /* Daha ince yükseklik için padding azaltıldı */
}
body .trust-item:hover {
    background: var(--card-bg) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: none !important;
    transform: none !important;
}

body .trust-item .trust-icon {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
    height: auto !important; /* Kutu yüksekliğini kaldırdık */
    margin: 0 auto 10px !important; /* Altındaki başlık ile boşluğu azalttık */
}
body .trust-item:hover .trust-icon {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
    color: var(--primary-blue) !important;
}
body .trust-item::before,
body .trust-item::after,
body .trust-item .trust-icon::before,
body .trust-item .trust-icon::after {
    display: none !important;
    content: none !important;
}

/* Alt Bilgi Copyright Firma İsmi Görünürlüğü */
body .footer-bottom p strong,
body .footer-bottom strong {
    color: inherit !important;
    background: transparent !important;
    font-weight: 700 !important;
    opacity: 0.9 !important;
}

/* --- VİTRİN / SHOWCASE BAŞLIKLARINDAN TÜM NEON, NOKTA VE ÇİZGİ EFEKTLERİNİ TEMİZLE (SADE HALE GETİR) --- */
body .showcase-title::before,
body .showcase-title::after,
body .showcase-header::before,
body .showcase-header::after,
body .showcase-title-wrapper::before,
body .showcase-title-wrapper::after,
body .showcase-title-icon::before,
body .showcase-title-icon::after,
body .cat-section-header::before,
body .cat-section-header::after,
body .firsatlar-header::before,
body .firsatlar-header::after {
    display: none !important;
    content: none !important;
    background: none !important;
    box-shadow: none !important;
    border: none !important;
    animation: none !important;
}

body .showcase-title {
    padding-left: 0 !important; /* Mavi noktanın boşluğunu sıfırla */
    text-shadow: none !important;
    background: none !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
    -webkit-text-fill-color: var(--text-color) !important;
    color: var(--text-color) !important;
}

/* İkon kutusunun etrafındaki neon parıltıları ve gölgeleri kaldır, temiz ve flat bir görünüm ver */
body .showcase-title-icon {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    padding: 0 !important;
    width: auto !important;
    height: auto !important;
}

body .showcase-title-icon i,
body .showcase-title-icon svg,
body .showcase-title-icon img,
body .showcase-custom-icon {
    color: var(--primary-blue) !important;
    filter: none !important;
    text-shadow: none !important;
}

/* --- VİTRİN KATEGORİ SEKME ALANLARI (SHOWCASE TABS) --- */
html body .showcase-tabs {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    margin: 12px 0 18px 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

html body .showcase-tab {
    background: rgba(255, 255, 255, 0.02) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-muted) !important;
    padding: 10px 18px !important; /* Artırılmış yükseklik (%30+) */
    border-radius: 8px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    transition: all 0.2s ease !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    cursor: pointer !important;
}

html body .showcase-tab:hover {
    color: var(--primary-blue) !important;
    border-color: rgba(37, 99, 235, 0.4) !important;
    background: rgba(37, 99, 235, 0.05) !important;
    box-shadow: none !important;
    transform: none !important;
}

html[data-theme="light"] body .showcase-tab {
    background: #ffffff !important;
}
/* --- MOBİL HEADER İNCE AYARI (GEREKSİZ BOŞLUKLARI AZALTMA) --- */
@media (max-width: 768px) {
    body .top-announcement {
        padding-top: 6px !important;
        padding-bottom: 6px !important;
    }
    body .mobile-header-row-1 {
        padding-top: 5px !important;
        padding-bottom: 5px !important;
    }
    body .mobile-logo img {
        height: 32px !important;
    }
    body .mobile-header-row-2 {
        padding-top: 10px !important;
        padding-bottom: 6px !important;
        gap: 8px !important;
    }
    body .mobile-action-btn {
        height: 40px !important;
        font-size: 13px !important;
    }
    body .top-utility-bar .tub-wrapper {
        min-height: 28px !important;
        padding-top: 2px !important;
        padding-bottom: 2px !important;
    }
    body .tub-item {
        padding: 4px 6px !important;
    }
    body .mobile-cart-btn, 
    body .mobile-menu-btn, 
    body .mobile-noti-btn {
        height: 36px !important;
        width: 36px !important;
    }
    body .notif-badge-mobile {
        top: -2px !important;
        right: -2px !important;
    }

/* --- MOBİL SİDEBAR (MENÜ) MODERN AKORDİYON TASARIMI --- */
body .mobile-sidebar {
    width: 310px !important;
    display: flex !important;
    flex-direction: column !important;
    box-shadow: -10px 0 30px rgba(0,0,0,0.2) !important;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

body .sidebar-header {
    padding: 16px 20px !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

body .sidebar-title-text {
    font-size: 18px;
    font-weight: 800;
}

body .sidebar-header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

body .sidebar-content {
    padding: 16px 20px 80px 20px !important;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

/* Auth Section */
body .sidebar-auth-section {
    margin-top: 10px !important;
    margin-bottom: 20px !important;
}

body .guest-btns-container {
    display: flex;
    gap: 10px;
    width: 100%;
}

body .sidebar-guest-btn {
    flex: 1;
    height: 42px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13.5px;
    font-weight: 700;
    text-decoration: none;
    transition: transform 0.15s ease, opacity 0.15s ease;
}

body .sidebar-guest-btn:active {
    transform: scale(0.97);
    opacity: 0.9;
}

body .sidebar-guest-btn.login-btn {
    background: #1a6edb !important;
    color: #ffffff !important;
}

body .sidebar-guest-btn.register-btn {
    background: #0ea569 !important;
    color: #ffffff !important;
}

/* User Logged In Styles */
body .user-info-sidebar {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

body .user-avatar i {
    font-size: 38px;
    color: var(--primary-blue) !important;
}

body .user-details {
    display: flex;
    flex-direction: column;
}

body .user-name-label {
    display: block !important;
    font-weight: 800 !important;
    font-size: 15px !important;
    color: var(--text-color) !important;
    margin-bottom: 3px !important;
}

body .user-balance-label {
    display: block !important;
    font-size: 12px !important;
    color: var(--text-muted) !important;
}

body .user-balance-label strong {
    color: #10b981 !important;
}

body .sidebar-user-actions {
    display: flex;
    gap: 8px;
    width: 100%;
}

body .sidebar-balance-btn,
body .sidebar-profile-btn {
    flex: 1;
    height: 38px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12.5px;
    font-weight: 700;
    text-decoration: none;
    gap: 6px;
    transition: transform 0.15s ease;
}

body .sidebar-balance-btn:active,
body .sidebar-profile-btn:active {
    transform: scale(0.97);
}

body .sidebar-balance-btn {
    background: var(--primary-blue) !important;
    color: white !important;
}

/* Navigation Links & Accordion */
body .sidebar-nav-container {
    display: flex;
    flex-direction: column;
}

body .sidebar-nav-item,
body .accordion-header-link {
    display: flex;
    align-items: center;
    justify-content: flex-start !important;
    gap: 12px !important;
    padding: 13px 16px;
    text-decoration: none;
    font-size: 14.5px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s ease;
}

body .accordion-header {
    display: flex;
    align-items: center;
    justify-content: space-between !important;
    padding: 13px 16px;
    text-decoration: none;
    font-size: 14.5px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s ease;
}

body .accordion-header-left {
    display: flex;
    align-items: center;
    gap: 12px;
}

body .category-icon {
    width: 24px;
    height: 24px;
    border-radius: 6px;
    object-fit: cover;
}

body .category-icon-placeholder {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
}

body .accordion-chevron {
    font-size: 11px;
    transition: transform 0.25s ease, opacity 0.2s ease;
}

body .accordion-collapse {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

body .accordion-body {
    padding: 4px 0;
    display: flex;
    flex-direction: column;
}

body .subcategory-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 16px 11px 36px;
    text-decoration: none;
    font-size: 13.5px;
    font-weight: 600;
    transition: background 0.2s ease, color 0.2s ease;
}

body .subcategory-icon {
    width: 20px;
    height: 20px;
    border-radius: 4px;
    object-fit: cover;
}

body .subcategory-bullet {
    font-size: 6px;
    width: 20px;
    text-align: center;
}

/* ==========================================
   DARK THEME SPECIFIC STYLES (Default / Active)
   ========================================== */
html[data-theme="dark"] body .mobile-sidebar,
html:not([data-theme="light"]) body .mobile-sidebar {
    background: #0d0d0f !important;
    border-left: 1px solid rgba(255,255,255,0.06) !important;
}

html[data-theme="dark"] body .sidebar-header,
html:not([data-theme="light"]) body .sidebar-header {
    border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}

html[data-theme="dark"] body .sidebar-title-text,
html:not([data-theme="light"]) body .sidebar-title-text {
    color: #ffffff !important;
}

html[data-theme="dark"] body .sidebar-profile-btn,
html:not([data-theme="light"]) body .sidebar-profile-btn {
    background: rgba(255,255,255,0.05) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
}

html[data-theme="dark"] body .sidebar-nav-item,
html[data-theme="dark"] body .accordion-header,
html[data-theme="dark"] body .accordion-header-link,
html:not([data-theme="light"]) body .sidebar-nav-item,
html:not([data-theme="light"]) body .accordion-header,
html:not([data-theme="light"]) body .accordion-header-link {
    color: #eeeeee !important;
    border-bottom: 1px solid rgba(255,255,255,0.04) !important;
}

html[data-theme="dark"] body .sidebar-nav-item:hover,
html[data-theme="dark"] body .accordion-header:hover,
html[data-theme="dark"] body .accordion-header-link:hover,
html:not([data-theme="light"]) body .sidebar-nav-item:hover,
html:not([data-theme="light"]) body .accordion-header:hover,
html:not([data-theme="light"]) body .accordion-header-link:hover {
    background: rgba(255,255,255,0.02) !important;
}

html[data-theme="dark"] body .sidebar-nav-item .menu-icon,
html:not([data-theme="light"]) body .sidebar-nav-item .menu-icon {
    color: #ffffff !important;
    opacity: 0.8;
}

html[data-theme="dark"] body .sidebar-divider,
html:not([data-theme="light"]) body .sidebar-divider {
    background: rgba(255,255,255,0.06) !important;
}

html[data-theme="dark"] body .sidebar-section-title,
html:not([data-theme="light"]) body .sidebar-section-title {
    color: #718096 !important;
    opacity: 0.8 !important;
}

html[data-theme="dark"] body .accordion-chevron,
html:not([data-theme="light"]) body .accordion-chevron {
    color: #ffffff !important;
    opacity: 0.4;
}

html[data-theme="dark"] body .accordion-collapse,
html:not([data-theme="light"]) body .accordion-collapse {
    background: rgba(0, 0, 0, 0.2) !important;
}

html[data-theme="dark"] body .subcategory-item,
html:not([data-theme="light"]) body .subcategory-item {
    color: #cbd5e0 !important;
    border-bottom: 1px dashed rgba(255,255,255,0.02) !important;
}

html[data-theme="dark"] body .subcategory-item:hover,
html:not([data-theme="light"]) body .subcategory-item:hover {
    background: rgba(255,255,255,0.02) !important;
    color: #ffffff !important;
}

html[data-theme="dark"] body .subcategory-bullet,
html:not([data-theme="light"]) body .subcategory-bullet {
    color: #ffffff !important;
    opacity: 0.3;
}

html[data-theme="dark"] body .category-icon-placeholder,
html:not([data-theme="light"]) body .category-icon-placeholder {
    color: #ffffff !important;
}


/* ==========================================
   LIGHT THEME SPECIFIC STYLES
   ========================================== */
html[data-theme="light"] body .mobile-sidebar {
    background: #ffffff !important;
    border-left: 1px solid rgba(0,0,0,0.08) !important;
}

html[data-theme="light"] body .sidebar-header {
    border-bottom: 1px solid rgba(0,0,0,0.08) !important;
}

html[data-theme="light"] body .sidebar-title-text {
    color: #121212 !important;
}

html[data-theme="light"] body .sidebar-profile-btn {
    background: rgba(0,0,0,0.04) !important;
    color: #121212 !important;
    border: 1px solid rgba(0,0,0,0.06) !important;
}

html[data-theme="light"] body .sidebar-nav-item,
html[data-theme="light"] body .accordion-header,
html[data-theme="light"] body .accordion-header-link {
    color: #1a202c !important;
    border-bottom: 1px solid rgba(0,0,0,0.06) !important;
}

html[data-theme="light"] body .sidebar-nav-item:hover,
html[data-theme="light"] body .accordion-header:hover,
html[data-theme="light"] body .accordion-header-link:hover {
    background: rgba(0,0,0,0.02) !important;
}

html[data-theme="light"] body .sidebar-nav-item .menu-icon {
    color: #1a202c !important;
    opacity: 0.8;
}

html[data-theme="light"] body .sidebar-divider {
    background: rgba(0,0,0,0.08) !important;
}

html[data-theme="light"] body .sidebar-section-title {
    color: #4a5568 !important;
    opacity: 0.8 !important;
}

html[data-theme="light"] body .accordion-chevron {
    color: #1a202c !important;
    opacity: 0.5;
}

html[data-theme="light"] body .accordion-collapse {
    background: rgba(0, 0, 0, 0.03) !important;
}

html[data-theme="light"] body .subcategory-item {
    color: #4a5568 !important;
    border-bottom: 1px dashed rgba(0,0,0,0.04) !important;
}

html[data-theme="light"] body .subcategory-item:hover {
    background: rgba(0,0,0,0.02) !important;
    color: #1a202c !important;
}

html[data-theme="light"] body .subcategory-bullet {
    color: #1a202c !important;
    opacity: 0.4;
}

html[data-theme="light"] body .category-icon-placeholder {
    color: #1a202c !important;
}
}

/* =========================================================================
   20. STOREFRONT PREMIUM SHOWCASE HEADER (IMAGE MATCH UPGRADE)
   Redesigns the category showcase headers (.showcase-header) inside
   the homepage showcase sections to exactly match the uploaded reference 
   image, with dark slate premium cards, bold white titles, and outline buttons.
   Specifically excludes "Popüler Kategoriler" using :not(.popular-cats-section).
   ========================================================================= */

/* Dark Theme (Default) Card Styling */
body .showcase-section:not(.popular-cats-section) .showcase-header {
    background: #0b0b0c !important; /* Premium charcoal/black card background */
    border: 1px solid rgba(255, 255, 255, 0.04) !important; /* Elegant subtle outline */
    border-radius: 12px !important; /* Perfect rounded corners */
    padding: 16px 24px !important; /* Premium spacious layout */
    margin-bottom: 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25) !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Strip any background animations, accent bars, pseudo borders or dots */
body .showcase-section:not(.popular-cats-section) .showcase-header::before,
body .showcase-section:not(.popular-cats-section) .showcase-header::after {
    display: none !important;
    content: none !important;
}

/* Left side alignment: Icon and Title */
body .showcase-section:not(.popular-cats-section) .showcase-header .showcase-title-wrapper {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important; /* Balanced gap between icon and category name */
}

body .showcase-section:not(.popular-cats-section) .showcase-header .showcase-title-wrapper::before,
body .showcase-section:not(.popular-cats-section) .showcase-header .showcase-title-wrapper::after {
    display: none !important;
    content: none !important;
}

/* Icon Box Align */
body .showcase-section:not(.popular-cats-section) .showcase-header .showcase-title-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 28px !important;
    height: 28px !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Keep the colored category logo exactly as intended without filters */
body .showcase-section:not(.popular-cats-section) .showcase-header .showcase-custom-icon,
body .showcase-section:not(.popular-cats-section) .showcase-header .showcase-title-icon img {
    width: 26px !important;
    height: 26px !important;
    object-fit: contain !important;
    filter: none !important;
}

body .showcase-section:not(.popular-cats-section) .showcase-header .showcase-title-icon i,
body .showcase-section:not(.popular-cats-section) .showcase-header .showcase-title-icon svg {
    font-size: 20px !important;
    color: var(--primary-blue, #0433ff) !important;
}

/* Title Font & Color style */
body .showcase-section:not(.popular-cats-section) .showcase-header .showcase-title {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #ffffff !important; /* Crisp bold white */
    margin: 0 !important;
    padding: 0 !important;
    letter-spacing: -0.3px !important;
    text-transform: none !important;
}

body .showcase-section:not(.popular-cats-section) .showcase-header .showcase-title::before,
body .showcase-section:not(.popular-cats-section) .showcase-header .showcase-title::after {
    display: none !important;
    content: none !important;
}

/* Right side Button: "TÜM İLANLAR >" Outlined Pill */
body .showcase-section:not(.popular-cats-section) .showcase-header .view-all-link {
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important; /* Thin outline */
    color: rgba(255, 255, 255, 0.8) !important;
    padding: 8px 16px !important;
    border-radius: 8px !important;
    font-size: 11px !important;
    font-weight: 700 !important; /* Ultra-bold */
    text-transform: uppercase !important; /* Automatically capitalized: TÜM İLANLAR */
    letter-spacing: 0.8px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    text-decoration: none !important;
    transition: all 0.25s ease !important;
    box-shadow: none !important;
    opacity: 1 !important;
}

body .showcase-section:not(.popular-cats-section) .showcase-header .view-all-link:hover {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
    color: #ffffff !important;
}

/* Perfect optical alignment for chevron symbol */
body .showcase-section:not(.popular-cats-section) .showcase-header .view-all-link i,
body .showcase-section:not(.popular-cats-section) .showcase-header .view-all-link .fas {
    font-size: 10px !important;
    font-weight: 900 !important;
    color: inherit !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    transition: transform 0.25s ease !important;
}

body .showcase-section:not(.popular-cats-section) .showcase-header .view-all-link:hover i,
body .showcase-section:not(.popular-cats-section) .showcase-header .view-all-link:hover .fas {
    transform: translateX(2px) !important; /* Premium micro-interactive motion */
}

/* Light Theme Fallback support */
html[data-theme="light"] body .showcase-section:not(.popular-cats-section) .showcase-header {
    background: #f7f7f9 !important;
    border: 1px solid rgba(0, 0, 0, 0.05) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important;
}

html[data-theme="light"] body .showcase-section:not(.popular-cats-section) .showcase-header .showcase-title {
    color: #121214 !important;
}

html[data-theme="light"] body .showcase-section:not(.popular-cats-section) .showcase-header .view-all-link {
    border: 1px solid rgba(0, 0, 0, 0.12) !important;
    color: rgba(0, 0, 0, 0.7) !important;
}

html[data-theme="light"] body .showcase-section:not(.popular-cats-section) .showcase-header .view-all-link:hover {
    background: rgba(0, 0, 0, 0.04) !important;
    border-color: rgba(0, 0, 0, 0.25) !important;
    color: #000000 !important;
}

/* Responsive Styles for Mobile screens */
@media (max-width: 768px) {
    body .showcase-section:not(.popular-cats-section) .showcase-header {
        padding: 12px 16px !important;
        border-radius: 10px !important;
        margin-bottom: 18px !important;
    }
    body .showcase-section:not(.popular-cats-section) .showcase-header .showcase-title {
        font-size: 16px !important;
    }
    body .showcase-section:not(.popular-cats-section) .showcase-header .view-all-link {
        padding: 6px 12px !important;
        font-size: 10px !important;
        border-radius: 6px !important;
    }
}

/* Center simple tabs inside category page (kategori.php) matching reference screenshot */
body .tab-view-simple.category-page-tabs {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 24px !important;
    padding: 0 0 12px 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    margin-bottom: 24px !important;
}

body .category-page-tabs .showcase-tab {
    background: transparent !important;
    border: none !important;
    border-bottom: 2px solid transparent !important;
    color: var(--text-muted) !important;
    padding: 0 4px 10px 4px !important;
    border-radius: 0 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    cursor: pointer !important;
    margin-bottom: -13px !important;
    transition: all 0.2s ease !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

body .category-page-tabs .showcase-tab:hover {
    color: #ffffff !important;
    background: transparent !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}

body .category-page-tabs .showcase-tab.active {
    border-bottom: 2px solid var(--primary-blue) !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

html[data-theme="light"] body .tab-view-simple.category-page-tabs {
    border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
}

html[data-theme="light"] body .category-page-tabs .showcase-tab {
    color: #64748b !important;
}

html[data-theme="light"] body .category-page-tabs .showcase-tab:hover {
    color: #0f172a !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
}

html[data-theme="light"] body .category-page-tabs .showcase-tab.active {
    border-bottom: 2px solid var(--primary-blue) !important;
    color: var(--primary-blue) !important;
}



html[data-theme="light"] body .showcase-tab {
    background: #ffffff !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-muted) !important;
}

html[data-theme="light"] body .showcase-tab:hover {
    color: var(--primary-blue) !important;
    border-color: rgba(37, 99, 235, 0.4) !important;
    background: rgba(37, 99, 235, 0.05) !important;
}

html body .showcase-tab.active {
    background: var(--primary-blue) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.2) !important;
}

html[data-theme="light"] body .showcase-tab.active {
    background: var(--primary-blue) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.2) !important;
}

/* --- BASİT SEKME GÖRÜNÜMÜ (SIMPLE TAB VIEW) --- */
html body .showcase-tabs.tab-view-simple,
html body .firsatlar-tabs.tab-view-simple {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 20px !important;
    padding: 0 0 10px 0 !important;
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 0 !important;
    margin: 12px 0 18px 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

html body .showcase-tabs.tab-view-simple .showcase-tab,
html body .firsatlar-tabs.tab-view-simple .firsatlar-tab {
    background: transparent !important;
    border: none !important;
    border-bottom: 2px solid transparent !important;
    color: var(--text-muted) !important;
    padding: 0 2px 10px 2px !important;
    border-radius: 0 !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    transition: all 0.2s ease !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    cursor: pointer !important;
    margin-bottom: -11px !important;
}

html body .showcase-tabs.tab-view-simple .showcase-tab img,
html body .firsatlar-tabs.tab-view-simple .firsatlar-tab img {
    display: none !important; /* Basit görünümde ikonları gösterme */
}

html body .showcase-tabs.tab-view-simple .showcase-tab:hover,
html body .firsatlar-tabs.tab-view-simple .firsatlar-tab:hover {
    color: #ffffff !important;
    background: transparent !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
    transform: none !important;
    box-shadow: none !important;
}

html body .showcase-tabs.tab-view-simple .showcase-tab.active,
html body .firsatlar-tabs.tab-view-simple .firsatlar-tab.active {
    background: transparent !important;
    border-bottom: 2px solid var(--primary-blue) !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

/* Light Mode Support for Simple Tabs */
html[data-theme="light"] body .showcase-tabs.tab-view-simple,
html[data-theme="light"] body .firsatlar-tabs.tab-view-simple {
    border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
}

html[data-theme="light"] body .tab-view-simple .showcase-tab,
html[data-theme="light"] body .tab-view-simple .firsatlar-tab {
    color: #64748b !important;
}

html[data-theme="light"] body .tab-view-simple .showcase-tab:hover,
html[data-theme="light"] body .tab-view-simple .firsatlar-tab:hover {
    color: #0f172a !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
}

html[data-theme="light"] body .tab-view-simple .showcase-tab.active,
html[data-theme="light"] body .tab-view-simple .firsatlar-tab.active {
    border-bottom: 2px solid var(--primary-blue) !important;
    color: var(--primary-blue) !important;
}


html body .tab-view-simple .showcase-tab.active::before,
html body .tab-view-simple .showcase-tab.active::after,
html body .tab-view-simple .firsatlar-tab.active::before,
html body .tab-view-simple .firsatlar-tab.active::after {
    display: none !important;
    content: none !important;
    animation: none !important;
}

/* Failsafe for list-card-row */
html body .listing-list-card .list-card-row {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    height: auto !important;
}

/* =========================================================================
   PREFIX THEME — Per-category showcase styling (predunya-style)
   Showcase header/title/tabs/button her kategorinin theme_color'ını kullanır
   ========================================================================= */
body .showcase-section[class*="cat-"] {
    --sc-color: var(--item-glow, var(--primary-blue));
    --sc-rgb:   var(--item-glow-rgb, var(--primary-blue-rgb));
}

/* Header kutusu — kurumsal sade görünüm, hafif tema-renkli ipucu */
html body .showcase-section[class*="cat-"] .showcase-header {
    background: var(--card-bg) !important;
    border: 1px solid rgba(var(--sc-rgb), 0.18) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    position: relative !important;
    margin-bottom: 8px !important;
}
/* Alt parlama hattı kaldırıldı (varsayılan modda kurumsal görünüm) */
html body .showcase-section[class*="cat-"] .showcase-header::after {
    display: none !important;
    content: none !important;
}

/* İkon kutusu — sade, hafif tema-renkli border */
html body .showcase-section[class*="cat-"] .showcase-title-icon {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    box-shadow: none !important;
}

/* Başlık metni — sade beyaz/tema rengi yerine düz text */
html body .showcase-section[class*="cat-"] .showcase-title {
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    -webkit-text-fill-color: initial !important;
    color: var(--text-color) !important;
}
html body .showcase-section[class*="cat-"] .showcase-title::before {
    display: none !important;
    content: none !important;
}

/* Tüm İlanlar butonu — kompakt, sade outline (tema renginde) */
html body .showcase-section[class*="cat-"] .view-all-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    height: 32px !important;
    padding: 0 12px !important;
    background: transparent !important;
    border: 1px solid rgba(var(--sc-rgb), 0.40) !important;
    border-radius: 8px !important;
    color: var(--text-color) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.4px !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    box-shadow: none !important;
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease !important;
}
html body .showcase-section[class*="cat-"] .view-all-link i,
html body .showcase-section[class*="cat-"] .view-all-link .fas {
    font-size: 10px !important;
    line-height: 1 !important;
    margin: 0 !important;
    background: transparent !important;
    width: auto !important;
    height: auto !important;
    border: none !important;
    color: inherit !important;
    transition: transform 0.18s ease !important;
}
html body .showcase-section[class*="cat-"] .view-all-link:hover {
    background: var(--sc-color) !important;
    border-color: var(--sc-color) !important;
    color: #ffffff !important;
    box-shadow: 0 2px 10px rgba(var(--sc-rgb), 0.30) !important;
    transform: translateY(-1px) !important;
    filter: none !important;
}
html body .showcase-section[class*="cat-"] .view-all-link:hover i,
html body .showcase-section[class*="cat-"] .view-all-link:hover .fas {
    transform: translateX(2px) !important;
}

/* Mobile: daha kompakt */
@media (max-width: 768px) {
    html body .showcase-section[class*="cat-"] .view-all-link {
        height: 28px !important;
        padding: 0 9px !important;
        font-size: 10px !important;
        letter-spacing: 0.2px !important;
        border-radius: 6px !important;
    }
    html body .showcase-section[class*="cat-"] .view-all-link i,
    html body .showcase-section[class*="cat-"] .view-all-link .fas {
        font-size: 9px !important;
    }
}

/* Sekmeler — pill container (default + simple view ortak) */
/* Sekmeler — pill container (sadece varsayılan görünümde) */
html body .showcase-section[class*="cat-"] .showcase-tabs:not(.tab-view-simple) {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    padding: 6px !important;
    background: rgba(var(--sc-rgb), 0.05) !important;
    border: 1px solid rgba(var(--sc-rgb), 0.30) !important;
    border-bottom: 1px solid rgba(var(--sc-rgb), 0.30) !important;
    border-radius: 14px !important;
    box-shadow: inset 0 0 0 1px rgba(var(--sc-rgb), 0.05) !important;
    margin: 0 0 14px 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: thin !important;
    scrollbar-color: rgba(var(--sc-rgb), 0.45) transparent !important;
    -webkit-overflow-scrolling: touch !important;
    width: 100% !important;
    max-width: 100% !important;
}
html body .showcase-section[class*="cat-"] .showcase-tabs:not(.tab-view-simple)::-webkit-scrollbar {
    height: 6px !important;
}
html body .showcase-section[class*="cat-"] .showcase-tabs:not(.tab-view-simple)::-webkit-scrollbar-track {
    background: transparent !important;
}
html body .showcase-section[class*="cat-"] .showcase-tabs:not(.tab-view-simple)::-webkit-scrollbar-thumb {
    background: rgba(var(--sc-rgb), 0.45) !important;
    border-radius: 3px !important;
}
html body .showcase-section[class*="cat-"] .showcase-tabs:not(.tab-view-simple) .showcase-tab {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
}

/* Sabit layout (admin'den tabs_layout=fixed): yatay scroll yerine wrap */
html body .showcase-section[class*="cat-"] .showcase-tabs.tabs-layout-fixed:not(.tab-view-simple) {
    flex-wrap: wrap !important;
    overflow: visible !important;
    -webkit-mask-image: none !important;
    mask-image: none !important;
}
html body .showcase-section[class*="cat-"] .showcase-tabs.tabs-layout-fixed:not(.tab-view-simple)::after {
    display: none !important;
    content: none !important;
}

/* Yatay scroll ipucu — sağ kenarda fade + sticky chevron (sadece slider modunda) */
html body .showcase-section[class*="cat-"] .showcase-tabs.tabs-layout-slider:not(.tab-view-simple),
html body .showcase-section[class*="cat-"] .showcase-tabs:not(.tab-view-simple):not(.tabs-layout-fixed) {
    -webkit-mask-image: linear-gradient(to right, #000 0, #000 calc(100% - 28px), rgba(0,0,0,0.35) 100%);
    mask-image: linear-gradient(to right, #000 0, #000 calc(100% - 28px), rgba(0,0,0,0.35) 100%);
}
html body .showcase-section[class*="cat-"] .showcase-tabs:not(.tab-view-simple)::after {
    content: "\f054"; /* fa-chevron-right */
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome";
    font-weight: 900;
    color: var(--sc-color);
    font-size: 13px;
    flex: 0 0 auto;
    align-self: center;
    margin-left: -22px;
    position: sticky;
    right: 8px;
    pointer-events: none;
    opacity: 0.9;
    animation: sc-scroll-hint 1.3s ease-in-out infinite;
    z-index: 2;
}
@keyframes sc-scroll-hint {
    0%, 100% { transform: translateX(0); opacity: 0.55; }
    50%      { transform: translateX(5px); opacity: 1; }
}
html body .showcase-section[class*="cat-"] .showcase-tabs:not(.tab-view-simple) .showcase-tab {
    background: transparent !important;
    border: none !important;
    border-bottom: none !important;
    border-radius: 10px !important;
    color: var(--text-muted) !important;
    padding: 10px 22px !important;
    margin: 0 !important;
    font-weight: 700 !important;
    letter-spacing: 0.3px !important;
    text-transform: uppercase !important;
    box-shadow: none !important;
    transition: background 0.2s ease, color 0.2s ease !important;
}
html body .showcase-section[class*="cat-"] .showcase-tabs:not(.tab-view-simple) .showcase-tab:hover {
    background: rgba(var(--sc-rgb), 0.10) !important;
    border: none !important;
    border-bottom: none !important;
    color: var(--text-color) !important;
}
html body .showcase-section[class*="cat-"] .showcase-tabs:not(.tab-view-simple) .showcase-tab.active,
html[data-theme="light"] body .showcase-section[class*="cat-"] .showcase-tabs:not(.tab-view-simple) .showcase-tab.active {
    background: var(--sc-color) !important;
    border: none !important;
    border-bottom: none !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(var(--sc-rgb), 0.35) !important;
}

/* Sekmeler — Basit Görünüm (Özel Tasarım) */
html body .showcase-section[class*="cat-"] .showcase-tabs.tab-view-simple {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    gap: 24px !important;
    padding: 0 0 12px 0 !important;
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 0 !important;
    margin: 12px 0 24px 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    width: 100% !important;
}
html body .showcase-section[class*="cat-"] .showcase-tabs.tab-view-simple .showcase-tab {
    background: transparent !important;
    border: none !important;
    border-bottom: 2px solid transparent !important;
    border-radius: 0 !important;
    color: var(--text-muted) !important;
    padding: 0 4px 10px 4px !important;
    margin: 0 !important;
    margin-bottom: -13px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
html body .showcase-section[class*="cat-"] .showcase-tabs.tab-view-simple .showcase-tab:hover {
    color: #ffffff !important;
    background: transparent !important;
    border-bottom: 2px solid rgba(var(--sc-rgb), 0.4) !important;
}
html body .showcase-section[class*="cat-"] .showcase-tabs.tab-view-simple .showcase-tab.active {
    background: transparent !important;
    border: none !important;
    border-bottom: 2px solid var(--sc-color) !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

/* Basit Görünüm Aydınlık Mod Desteği */
html[data-theme="light"] body .showcase-section[class*="cat-"] .showcase-tabs.tab-view-simple {
    border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
}
html[data-theme="light"] body .showcase-section[class*="cat-"] .showcase-tabs.tab-view-simple .showcase-tab {
    color: #64748b !important;
}
html[data-theme="light"] body .showcase-section[class*="cat-"] .showcase-tabs.tab-view-simple .showcase-tab:hover {
    color: #0f172a !important;
    border-bottom: 2px solid rgba(var(--sc-rgb), 0.3) !important;
}
html[data-theme="light"] body .showcase-section[class*="cat-"] .showcase-tabs.tab-view-simple .showcase-tab.active {
    background: transparent !important;
    border-bottom: 2px solid var(--sc-color) !important;
    color: var(--sc-color) !important;
    box-shadow: none !important;
}

/* Ana Sayfa Vitrin Başlıkları - Basit Görünüm Stili */
html body .showcase-section.tab-view-simple[class*="cat-"] .showcase-header {
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid var(--sc-color) !important;
    border-radius: 0 !important;
    padding: 0 0 14px 0 !important;
    margin-bottom: 18px !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important; /* Center the title! */
    position: relative !important;
}

/* Basit Görünüm Alt Çizgi Efekti */
html body .showcase-section.tab-view-simple[class*="cat-"] .showcase-header::after {
    display: none !important;
    content: none !important;
}

/* Başlık alanı yerleşimi — alt çizgi header'ın kendisinde */
html body .showcase-section.tab-view-simple[class*="cat-"] .showcase-header .showcase-title-wrapper {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    border-bottom: none !important;
    padding: 0 !important;
    margin-bottom: 0 !important;
}

/* Basit görünümde ikonları ve nokta/parlama efektlerini temizle */
html body .showcase-section.tab-view-simple[class*="cat-"] .showcase-header .showcase-title-icon {
    display: none !important; /* İkonu gizle */
}
html body .showcase-section.tab-view-simple[class*="cat-"] .showcase-header .showcase-title::before {
    display: none !important;
    content: none !important;
}

/* Başlık Yazısı */
html body .showcase-section.tab-view-simple[class*="cat-"] .showcase-header .showcase-title {
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    -webkit-text-fill-color: initial !important;
    color: #ffffff !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* "Tüm İlanlar" Linkini Sağ Tarafa Sabitle */
html body .showcase-section.tab-view-simple[class*="cat-"] .showcase-header .view-all-link {
    position: absolute !important;
    right: 0 !important;
    bottom: 8px !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: var(--text-muted) !important;
    box-shadow: none !important;
}
html body .showcase-section.tab-view-simple[class*="cat-"] .showcase-header .view-all-link:hover {
    color: #ffffff !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Basit Görünüm Başlık - Aydınlık Mod Desteği */
html[data-theme="light"] body .showcase-section.tab-view-simple[class*="cat-"] .showcase-header {
    border-bottom: 1px solid var(--sc-color) !important;
}
html[data-theme="light"] body .showcase-section.tab-view-simple[class*="cat-"] .showcase-header .showcase-title {
    color: #0f172a !important;
}
html[data-theme="light"] body .showcase-section.tab-view-simple[class*="cat-"] .showcase-header .view-all-link {
    color: #64748b !important;
}
html[data-theme="light"] body .showcase-section.tab-view-simple[class*="cat-"] .showcase-header .view-all-link:hover {
    color: #0f172a !important;
}

/* Basit Görünüm — Mobile: başlık merkezde, "Tüm İlanlar" küçük şekilde sağda */
@media (max-width: 768px) {
    html body .showcase-section.tab-view-simple[class*="cat-"] .showcase-header {
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 0 !important;
        padding: 0 8px 12px 8px !important;
    }
    html body .showcase-section.tab-view-simple[class*="cat-"] .showcase-header .view-all-link {
        position: absolute !important;
        right: 8px !important;
        bottom: 10px !important;
        font-size: 9px !important;
        letter-spacing: 0.2px !important;
        opacity: 0.7 !important;
        padding: 0 !important;
    }
    html body .showcase-section.tab-view-simple[class*="cat-"] .showcase-header .view-all-link i,
    html body .showcase-section.tab-view-simple[class*="cat-"] .showcase-header .view-all-link .fas {
        font-size: 8px !important;
        margin-left: 2px !important;
    }
    html body .showcase-section.tab-view-simple[class*="cat-"] .showcase-header .showcase-title {
        font-size: 13px !important;
        text-align: center !important;
    }
}