/* ============================================================
 * Header Components
 * Storefront Default Theme
 * Ownership:
 * - topbar header section (logo, search, actions)
 * - side menu styles
 * - category toolbar
 * ============================================================ */

        .sf-brand {
            display: flex;
            align-items: center;
            gap: 10px;
        }

        .sf-menu-toggle {
            width: 34px;
            height: 34px;
            border-radius: 6px;
            justify-content: center;
            padding: 0;
        }

        .sf-topbar .sf-btn.sf-menu-toggle,
        .sf-topbar .sf-btn.sf-menu-toggle:hover,
        .sf-topbar .sf-btn.sf-menu-toggle:focus {
            border: none;
            background: transparent;
            box-shadow: none;
            border-radius: 8px;
            font-size: 22px;
            transform: none;
            color: #0f172a;
        }

        .sf-topbar .sf-btn.sf-menu-toggle:hover {
            background: rgb(15, 23, 42, .06);
        }

        .sf-logo {
            width: 180px;
            height: 64px;
            border-radius: 12px;
            overflow: hidden;
            background: rgb(255, 255, 255, .08);
            border: var(--sf-border);
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 4px;
        }

        @media (max-width: 480px) {
            .sf-logo {
                width: 130px;
                height: 40px;
                border-radius: 10px;
                padding: 3px;
            }
        }

        .sf-logo img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            display: block;
        }

        .sf-logo picture {
            display: block;
            width: 100%;
            height: 100%;
            max-width: 100%;
            max-height: 100%;
        }

        .sf-topbar .sf-logo {
            flex: 0 0 auto;
            max-width: min(180px, 42vw);
            max-height: 64px;
        }

        .sf-search {
            flex: 1;
            display: flex;
            align-items: center;
            background: rgb(0 0 0 / 15%);
            border: var(--sf-border);
            border-radius: 999px;
            padding: 2px 8px;
            gap: 12px;
        }

        .sf-search i {
            color: var(--sf-muted);
        }

        .sf-search input {
            border: 0;
            outline: 0;
            background: transparent;
            color: var(--sf-text);
            width: 100%;
        }

        .sf-search input::placeholder {
            color: rgb(241, 245, 249, .55);
        }

        .sf-actions {
            display: flex;
            gap: 6px;
            align-items: center;
        }

        .sf-top-action {
            padding: 7px 10px;
            font-size: 12px;
            font-weight: 800;
            line-height: 1;
            gap: 6px;
        }

        .sf-top-action i {
            font-size: 15px;
        }

        .sf-top-action .label {
            font-size: 11px;
            letter-spacing: .1px;
        }

        .sf-page-icon {
            font-size: 13px;
            min-width: 14px;
            text-align: center;
            line-height: 1;
        }

        .sf-menu-link-label {
            display: inline-flex;
            align-items: center;
            gap: 8px;
        }

        .sf-menu-has-children {
            position: relative;
        }

        .sf-menu-parent {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
        }

        .sf-menu-parent .sf-menu-caret {
            font-size: 11px;
            opacity: .65;
        }

        .sf-menu-submenu {
            display: none;
            position: absolute;
            top: 0;
            left: calc(100% - 4px);
            min-width: 220px;
            margin: 0;
            padding: 6px 0;
            border-radius: 10px;
            border: 1px solid rgb(15, 23, 42, .14);
            background: #fff;
            box-shadow: 0 14px 30px rgb(15, 23, 42, .18);
            z-index: 1065;
        }

        .sf-menu-has-children:hover>.sf-menu-submenu,
        .sf-menu-has-children.sf-open>.sf-menu-submenu {
            display: block;
        }

        @media (max-width: 1199px) {
            .sf-menu-submenu {
                left: auto;
                right: 0;
                top: calc(100% + 2px);
            }
        }

        .sf-cp-main-nav-row {
            border-top: 1px solid rgba(15, 23, 42, .06);
            border-bottom: 1px solid rgba(15, 23, 42, .06);
            background: #fff;
        }

        .sf-cp-main-nav-row .sf-topbar-inner {
            min-height: 44px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 18px;
        }

        .sf-cp-main-nav {
            display: flex;
            align-items: center;
            gap: 18px;
            min-width: 0;
            overflow-x: auto;
            scrollbar-width: none;
        }

        .sf-cp-main-nav::-webkit-scrollbar {
            display: none;
        }

        .sf-cp-main-nav-item {
            position: relative;
            display: inline-flex;
            align-items: center;
        }

        .sf-cp-main-nav-link {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            white-space: nowrap;
        }

        /* Bazı global stiller span’ı sıkıştırıyor; menü yazısı her zaman görünsün */
        .sf-cp-main-nav-link > span {
            display: inline;
            flex-shrink: 0;
            max-width: none;
            overflow: visible;
        }

        .sf-cp-main-nav-link .sf-page-icon {
            font-size: 12px;
            min-width: 12px;
        }

        .sf-cp-main-nav-dropdown {
            display: none;
            position: absolute;
            top: calc(100% + 8px);
            left: 0;
            min-width: 300px;
            padding: 0;
            border-radius: 6px;
            border: 1px solid #dbe3ee;
            background: #fff;
            box-shadow: 0 16px 26px rgba(15, 23, 42, .14);
            overflow: hidden;
            z-index: 1060;
        }

        .sf-cp-main-nav-dropdown a {
            display: flex;
            align-items: center;
            gap: 11px;
            min-height: 44px;
            padding: 0 14px;
            border-radius: 0;
            border-bottom: 1px solid #eef2f7;
            background: #fff;
            color: #1f2937;
            font-size: 14px;
            font-weight: 500;
            line-height: 1.2;
        }

        .sf-cp-main-nav-dropdown a:last-child {
            border-bottom: 0;
        }

        .sf-cp-main-nav-dropdown a > i,
        .sf-cp-main-nav-dropdown a > svg {
            width: 18px;
            min-width: 18px;
            color: #64748b;
            font-size: 15px;
            font-weight: 400;
            line-height: 1;
        }

        .sf-cp-main-nav-dropdown a:hover {
            background: #fff;
            color: #066fd1;
        }

        .sf-cp-main-nav-dropdown a:hover > i,
        .sf-cp-main-nav-dropdown a:hover > svg {
            color: #066fd1;
        }

        .sf-cp-main-nav-item:hover>.sf-cp-main-nav-dropdown,
        .sf-cp-main-nav-item.sf-open>.sf-cp-main-nav-dropdown {
            display: block;
        }

        @media (max-width: 992px) {
            body.sf-mobile-dock-on .sf-topbar .sf-menu-toggle {
                display: inline-flex;
                order: -1;
            }
        }

/* ============================================================
 * Side Menu, Category Toolbar, Section Heads
 * (Hero kuralları hero-layout.css'e taşındı — bkz. o dosyanın başlığı)
 * ============================================================ */

        .sf-side-menu .offcanvas-header {
            min-height: 64px;
            padding: 18px 16px;
            border-bottom: 1px solid #eef2f7;
        }

        .sf-side-menu .offcanvas-body {
            padding: 10px 0 18px;
            overflow-x: hidden;
        }

        .sf-side-menu.offcanvas {
            width: min(360px, 92vw);
            background: #fff;
            color: #111827;
            border-right: 1px solid #dbe3ee;
            box-shadow: 0 18px 40px rgba(15, 23, 42, .18);
        }

        .sf-side-menu .menu-title {
            font-size: 11px;
            font-weight: 700;
            color: #64748b;
            margin: 14px 16px 8px;
            letter-spacing: .02em;
            text-transform: uppercase;
        }

        .sf-side-cat-group {
            margin: 0;
            border-bottom: 1px solid #eef2f7;
        }

        .sf-side-cat-group:last-child {
            border-bottom: 0;
        }

        .sf-side-cat {
            display: flex;
            align-items: center;
            gap: 10px;
            min-height: 52px;
            border: 0;
            border-radius: 0;
            background: #fff;
            padding: 8px 16px;
            margin-bottom: 0;
            color: #1f2937;
            font-size: 13.5px;
            font-weight: 500;
            line-height: 1.25;
            transform: none;
            transition: background-color .12s ease, color .12s ease;
        }

        .sf-side-cat:hover {
            background: #fff;
            color: #066fd1;
            transform: none;
        }

        .sf-side-cat .thumb {
            width: 34px;
            height: 34px;
            min-width: 34px;
            border-radius: 999px;
            background: #fff;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
            border: 1px solid #e5e7eb;
        }

        .sf-side-cat .thumb img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .sf-side-cat .thumb i,
        .sf-side-cat > i,
        .sf-side-cat svg {
            color: #64748b;
            font-size: 15px;
            font-weight: 400;
        }

        .sf-side-cat .sf-toggle-arrow {
            margin-left: auto;
            color: #94a3b8;
            font-size: 14px;
            font-weight: 400;
        }

        .sf-side-menu .sf-side-subcat {
            min-height: 40px;
            padding: 0 10px;
            margin: 0;
            border: 0;
            border-bottom: 1px solid #eef2f7;
            border-radius: 0;
            background: transparent;
            color: #334155;
            font-size: 13px;
            font-weight: 500;
        }

        .sf-side-menu .sf-side-subcat .thumb {
            display: none;
        }

        .sf-side-subcat > span:not(.thumb) {
            flex: 1;
        }

        .sf-side-menu .sf-side-subcat:hover {
            background: rgba(6, 111, 209, .06);
            border-color: #eef2f7;
            color: #066fd1;
        }

        .sf-side-cat-group .sf-side-subs {
            display: none;
            margin: 0 0 0 50px;
            padding: 0 0 0 10px;
            border-left: 1px solid #e5e7eb;
            background: #fff;
        }

        .sf-side-cat-group.open .sf-side-subs {
            display: block;
        }

        .sf-side-cat-group > .sf-side-cat .sf-toggle-arrow {
            transition: transform .2s ease;
        }

        .sf-side-cat-group.open > .sf-side-cat .sf-toggle-arrow {
            transform: rotate(90deg);
        }

        .sf-section {
            margin-top: 5px !important;
            padding: 10px;
        }

        .sf-category-toolbar {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            margin-top: 12px;
            padding: 10px 12px;
            border-radius: 14px;
            border: var(--sf-border);
            background: rgb(255, 255, 255, .06);
        }

        .sf-breadcrumb {
            display: flex;
            align-items: center;
            gap: 8px;
            font-size: 13px;
            font-weight: 700;
            color: var(--sf-muted);
        }

        .sf-breadcrumb .active {
            color: var(--sf-text);
        }

        .sf-cat-select {
            border: var(--sf-border);
            background: rgb(255, 255, 255, .09);
            color: var(--sf-text);
            border-radius: 999px;
            padding: 8px 12px;
            min-width: 210px;
            font-weight: 700;
        }

        .sf-cat-select option {
            color: #111827;
        }

        @media (max-width: 768px) {
            .sf-category-toolbar {
                flex-direction: column;
                align-items: stretch;
                gap: 8px;
            }

            .sf-cat-select {
                width: 100%;
                min-width: 0;
            }
        }

        .sf-section-title {
            display: flex;
            align-items: baseline;
            justify-content: space-between;
            gap: 10px;
            margin-bottom: 10px;
        }

        .sf-back-btn {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            background: #0a2573;
            color: #fff;
            padding: 8px 16px;
            border-radius: 10px;
            font-size: 13px;
            font-weight: 500;
            line-height: 1;
            text-decoration: none;
            transition: background .15s ease, opacity .15s ease;
        }

        .sf-back-btn:hover,
        .sf-back-btn:focus {
            background: #0a2573;
            color: #fff;
            opacity: .9;
        }

        .sf-section-title h2 {
            margin: 0;
            font-size: 26px;
            font-weight: 700;
            font-family: var(--sf-font, 'Poppins', Inter, system-ui, sans-serif);
            letter-spacing: -0.3px;
        }

        .sf-section-title .hint {
            color: var(--sf-muted);
            font-size: 12px;
        }

        /* Ortak başlık: ortada başlık, sağ/sol kırmızı çizgi (Vitrin, Mağaza Ürünleri, Markalarımız) */
        .sf-section-head {
            margin: 40px 0 5px;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 45px;
        }

        .sf-section-head-line {
            height: 2px;
            flex: 1 1 160px;
            max-width: 520px;
            background: #5eab5a;
            border-radius: 999px;
        }

        .sf-section-head h2 {
            margin: 0;
            font-size: 30px;
            line-height: 1.1;
            font-weight: 900;
            color: #111827;
        }

        .sf-section-head + .hint,
        .sf-section-head + .sf-featured-sub {
            margin: 6px;
            color: #64748b;
            font-size: 16px;
            text-align: center;
        }

        .sf-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 12px;
        }

        @media (min-width: 768px) {
            .sf-grid {
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }
        }

        @media (min-width: 1200px) {
            .sf-grid {
                grid-template-columns: repeat(4, minmax(0, 1fr));
            }
        }

/* PWA header states */
.sf-pwa-install-overlay[data-hidden="1"]{ display:none !important; }

            @keyframes sf-pwa-pop {
                from { opacity:0; transform:translateY(-20px) scale(0.94); }
                to { opacity:1; transform:translateY(0) scale(1); }
            }
            .sf-pwa-btn:hover { opacity:.9; }
            .sf-pwa-btn:active { transform:scale(0.98); }
            .sf-pwa-push-btn.sf-pwa-push-btn--active { background:#ecfdf5 !important; border-color:#10b981 !important; color:#059669 !important; cursor:default; }
            .sf-pwa-push-btn.sf-pwa-push-btn--active .sf-pwa-push-label { font-weight:700; }

/* Persistent floating install pill — visible on all platforms until dismissed */
.sf-pwa-install-pill { transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease; animation: sf-pwa-pill-in .35s ease-out; }
.sf-pwa-install-pill:hover { transform: translateY(-1px); box-shadow:0 14px 28px rgb(0,0,0,.26), 0 0 0 1px rgb(255,255,255,.18) inset; }
.sf-pwa-install-pill:active { transform: scale(.98); }
.sf-pwa-install-pill__close { transition: background .15s ease; }
.sf-pwa-install-pill__close:hover { background: rgb(255,255,255,.32) !important; }

@media (min-width: 992px) {
    .sf-pwa-install-pill { right: 18px; bottom: 18px; padding: 11px 18px 11px 14px; font-size: 14px; }
}

@media (max-width: 991.98px) {
    /* Sit just above the mobile dock to stay reachable with thumbs */
    .sf-pwa-install-pill { right: 12px; bottom: calc(86px + env(safe-area-inset-bottom, 0px)); }
}
body.sf-native-app .sf-pwa-install-pill { display: none !important; }

@keyframes sf-pwa-pill-in {
    from { opacity: 0; transform: translateY(14px) scale(.96); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

/* Step-by-step install guide inside the overlay */
.sf-pwa-guide .sf-pwa-guide-title { margin: 0 0 8px; font-size: 13px; font-weight: 700; color: #0f172a; letter-spacing: -0.01em; }
.sf-pwa-guide .sf-pwa-guide-list { margin: 0 0 6px; padding-left: 22px; font-size: 13px; line-height: 1.65; color: #1f2937; }
.sf-pwa-guide .sf-pwa-guide-list li { margin: 0 0 4px; }
.sf-pwa-guide .sf-pwa-guide-list strong { color: #0f172a; }
.sf-pwa-guide .sf-pwa-guide-note { margin: 6px 0 0; font-size: 12px; color: #64748b; line-height: 1.5; }
.sf-pwa-guide-block { padding: 12px 14px; background: #fff; border: 1px solid #eef2f7; border-radius: 12px; }

.sf-pwa-splash{ font-family: var(--sf-font, Inter, system-ui, sans-serif); display:none; }
            .sf-pwa-splash[data-pwa-splash="1"] { display:flex; }
            .sf-pwa-splash-sub{ margin:10px 0 0; font-size:0.85rem; color:rgb(255,255,255,.92); position:relative; z-index:2; }
            .sf-pwa-splash-ring-wrap{ position:relative; width:160px; height:120px; margin-bottom:28px; }
            .sf-pwa-splash-ring{ position:absolute; border:3px solid transparent; border-radius:50%; border-top-color:#fff; animation:sf-pwa-splash-spin 1.15s linear infinite; }
            .sf-pwa-splash-oval{ width:100%; height:100%; left:0; top:0; border-right-color:rgb(255,255,255,.5); border-bottom-color:rgb(255,255,255,.25); border-left-color:rgb(255,255,255,.5); }
            .sf-pwa-splash-ring--inner{ width:76%; height:76%; left:12%; top:12%; border-width:2px; animation-duration:0.85s; animation-direction:reverse; opacity:.9; }
            .sf-pwa-splash-ring--glow{ width:118%; height:118%; left:-9%; top:-9%; border-width:2px; border-top-color:rgb(255,255,255,.9); border-right-color:rgb(255,255,255,.2); animation-duration:1.6s; opacity:.6; }

            @keyframes sf-pwa-splash-spin{ to{ transform:rotate(360deg); } }
            .sf-pwa-splash.sf-pwa-splash--out{ opacity:0; transition:opacity 0.4s ease-out; pointer-events:none; }

/* Ürün kartı garanti satırı (yıldız yeşil) */
.sf-pblock-vat .sf-pblock-vat-star {
    color: #16a34a;
}

.sf-section {
    margin-top: 15px !important;
    padding: 1px;
}

@media (max-width: 576px) {
    .col,
    [class*="col-"] {
        padding-left: 1px !important;
        padding-right: 1px !important;
    }
}

/* ============================================================
 * Commerce Plus / Nova Header & Utilities (nova.css'ten taşındı)
 * ============================================================ */

        .sf-cp-locale-switch {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            margin-left: 10px;
            flex-wrap: wrap;
        }

        .sf-cp-locale-chip {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 24px;
            height: 24px;
            min-width: 24px;
            padding: 0;
            border-radius: 6px;
            border: 1px solid rgb(255, 255, 255, .72);
            background: #fff;
            color: #0f172a;
            font-size: 10px;
            font-weight: 900;
            text-decoration: none;
            transition: .18s ease;
            overflow: hidden;
            box-shadow: 0 1px 2px rgb(15, 23, 42, .1);
        }

        .sf-cp-locale-flag {
            width: 22px;
            height: 22px;
            display: block;
            border-radius: 5px;
            object-fit: cover;
            transform: none;
        }

        .sf-cp-locale-chip:hover {
            text-decoration: none;
            transform: translateY(-1px);
            filter: saturate(1.05);
        }

        .sf-cp-locale-chip.active {
            border-color: #fff;
            box-shadow: 0 0 0 2px rgb(15, 23, 42, .20), 0 2px 7px rgb(15, 23, 42, .16);
        }

        /* === CS-Cart Nova Theme Header Replica v2 === */

        /* CS-Cart Nova palette */
        body.sf.sf-mobile-dock-on {
            --cs-font: #23252b;
            --cs-secondary-text: #686e7f;
            --cs-base: #e1e5ec;
            --cs-btn-background: #f5f5f5;
            --cs-btn-color: #23252b;
            --cs-btn-color-highlight: #3a3d47;
            --cs-links: #1693e9;
            --cs-links-hover: #1276ba;
            --cs-primary-button: #23252b;
            --cs-primary-button-hover: #3a3d47;
            --cs-base-radius: 12px;
            --cs-small-radius: 8px;
            --cs-muted-bg: #d5dae4;
        }

        /* Row 1: Utility (tygh-top-panel equivalent) */
        body.sf.sf-mobile-dock-on .sf-cp-utility {
            background: #fff;
            border-bottom: 1px solid var(--cs-base);
            font-family: var(--sf-font, Inter, 'Helvetica Neue', -apple-system, sans-serif);
            font-size: 14px;
            color: var(--cs-font);
        }

        body.sf.sf-mobile-dock-on .sf-cp-utility .sf-topbar-inner {
            max-width: var(--sf-layout-max-width);
            padding: 4px 16px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 20px;
        }

        body.sf.sf-mobile-dock-on .sf-cp-utility-left,
        body.sf.sf-mobile-dock-on .sf-cp-utility-right {
            display: flex;
            align-items: center;
            gap: 18px;
        }

        body.sf.sf-mobile-dock-on .sf-cp-utility a {
            color: var(--cs-font);
            text-decoration: none;
            font-weight: 400;
            font-size: 14px;
            line-height: 1.14;
            display: inline-flex;
            align-items: center;
            gap: 6px;
            padding: 2px 0;
            transition: color .15s ease;
        }

        body.sf.sf-mobile-dock-on .sf-cp-utility a:hover {
            color: var(--cs-links-hover);
        }

        body.sf.sf-mobile-dock-on .sf-cp-utility .sf-page-icon {
            font-size: 15px;
            opacity: .85;
        }

        body.sf.sf-mobile-dock-on .sf-cp-utility .sf-topbar-inner {
            position: relative;
        }

        body.sf.sf-mobile-dock-on .sf-default-social {
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 12px;
            z-index: 2;
            white-space: nowrap;
        }

        body.sf.sf-mobile-dock-on .sf-default-social a {
            width: 28px;
            height: 28px;
            min-width: 28px;
            border-radius: 999px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: transparent;
            font-size: 17px;
            line-height: 1;
            padding: 0;
            text-decoration: none;
            transition: transform .15s ease, opacity .15s ease;
        }

        body.sf.sf-mobile-dock-on .sf-default-social a:hover {
            transform: translateY(-1px);
            opacity: .86;
        }

        body.sf.sf-mobile-dock-on .sf-default-social-facebook { color: #1877f2; }
        body.sf.sf-mobile-dock-on .sf-default-social-instagram { color: #e4405f; }
        body.sf.sf-mobile-dock-on .sf-default-social-linkedin { color: #0a66c2; }
        body.sf.sf-mobile-dock-on .sf-default-social-x { color: #111111; }
        body.sf.sf-mobile-dock-on .sf-default-social-youtube { color: #ff0000; }
        body.sf.sf-mobile-dock-on .sf-default-social-tiktok { color: #111111; }
        body.sf.sf-mobile-dock-on .sf-default-social-svg { width: 18px; height: 18px; display: block; }

        body.sf.sf-mobile-dock-on .sf-cp-locale-switch {
            display: inline-flex;
            gap: 6px;
            align-items: center;
            margin-left: 10px;
        }

        body.sf.sf-mobile-dock-on .sf-cp-locale-chip {
            width: 24px;
            min-width: 24px;
            height: 24px;
            padding: 0;
            border-radius: 6px;
            border-width: 1px;
            border-style: solid;
            font-size: 10px;
            font-weight: 900;
            color: #0f172a;
            background:#fff;
            text-decoration: none;
            transition: all .15s ease;
            line-height: 1;
            overflow: hidden;
        }

        body.sf.sf-mobile-dock-on .sf-cp-locale-flag {
            width: 22px;
            height: 22px;
            border-radius: 5px;
            transform: none;
        }

        body.sf.sf-mobile-dock-on .sf-cp-locale-chip:hover {
            transform: translateY(-1px);
            filter: saturate(1.05);
        }

        body.sf.sf-mobile-dock-on .sf-cp-locale-chip.active {
            color: #0f172a;
            border-color:#fff;
            box-shadow: 0 0 0 2px rgb(15, 23, 42, .20), 0 2px 7px rgb(15, 23, 42, .16);
        }

        /* Promo bar stays distinct (optional marquee bar) */
        body.sf.sf-mobile-dock-on .sf-cp-promo-top {
            font-size: 13px;
            font-weight: 500;
            font-family: var(--sf-font, Inter, 'Helvetica Neue', sans-serif);
        }

        body.sf.sf-mobile-dock-on .sf-cp-promo-top .sf-topbar-inner {
            max-width: var(--sf-layout-max-width);
            padding: 4px 16px;
        }

        /* Row 2: Main header (tygh-header equivalent) */
        .sf-topbar {
            position: sticky;
            top: 0;
            z-index: 1030;
            background: #fff;
            border-bottom: 1px solid var(--cs-base);
            box-shadow: none;
            font-family: var(--sf-font, Inter, 'Helvetica Neue', sans-serif);
            padding: 3px;
        }

        .sf-topbar-inner {
            max-width: var(--sf-layout-max-width);
            min-height: 37px;
            margin: 0 auto;
            padding: 5px 3px;
            display: flex;
            gap: 5px;
            align-items: center;
        }

        body.sf.sf-mobile-dock-on .sf-brand {
            min-width: auto;
        }

        body.sf.sf-mobile-dock-on .sf-logo {
            background: transparent;
            border: 0;
            padding: 0;
            border-radius: 0;
            width: 180px;
            max-width: 180px;
            height: 64px;
        }

        body.sf.sf-mobile-dock-on .sf-logo img {
            width: 100%;
            height: 100%;
            max-width: 100%;
            max-height: 100%;
            object-fit: contain;
            display: inline-block;
        }

        /* Search (ty-search-block) — large pill with light-gray bg */
        body.sf.sf-mobile-dock-on .sf-search {
            position: relative;
            flex: 1;
            background: var(--cs-btn-background);
            border: 1px solid var(--cs-btn-background);
            border-radius: var(--cs-base-radius);
            padding: 0;
            height: 44px;
            gap: 0;
            transition: border-color .15s ease, background .15s ease;
        }

        body.sf.sf-mobile-dock-on .sf-search:focus-within {
            border-color: var(--cs-primary-button);
            background: #fff;
        }

        body.sf.sf-mobile-dock-on .sf-search input {
            border: 0;
            outline: 0;
            background: transparent;
            color: var(--cs-font);
            font-size: 16px;
            font-weight: 400;
            padding: 7px 96px 7px 16px;
            width: 100%;
            height: 100%;
        }

        body.sf.sf-mobile-dock-on .sf-search input::placeholder {
            color: #929ba8;
            font-weight: 400;
        }

        body.sf.sf-mobile-dock-on .sf-search .sf-btn {
            position: absolute;
            top: 0;
            right: 0;
            width: 82px;
            height: 44px;
            padding: 0;
            background: var(--cs-primary-button);
            color: #fff;
            border: 0;
            border-radius: calc(var(--cs-base-radius) - 6px);
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 20px;
            font-weight: 700;
            transition: background .15s ease;
        }

        body.sf.sf-mobile-dock-on .sf-search .sf-btn:hover {
            background: var(--cs-primary-button-hover);
            transform: none;
        }

        body.sf.sf-mobile-dock-on .sf-search .sf-btn span {
            display: none;
        }

        body.sf.sf-mobile-dock-on .sf-search .sf-btn i {
            color: #fff;
            font-size: 20px;
        }

        body.sf.sf-mobile-dock-on .sf-search i:not(.bi-search) {
            color: var(--cs-secondary-text);
        }

        /* Actions: PDF/account as text link, cart as primary dark square */
        body.sf.sf-mobile-dock-on .sf-actions {
            display: flex;
            align-items: center;
        }

        body.sf.sf-mobile-dock-on .sf-cp-top-icon {
            background: transparent;
            border: 0;
            color: var(--cs-font);
            display: inline-flex;
            flex-direction: row;
            align-items: center;
            padding: 8px 10px;
            min-width: 0;
            gap: 8px;
            font-size: 14px;
            font-weight: 400;
            border-radius: var(--cs-small-radius);
            text-decoration: none;
            transition: color .15s ease;
        }

        body.sf.sf-mobile-dock-on .sf-cp-top-icon:hover {
            color: var(--cs-links-hover);
            background: transparent;
            transform: none;
        }

        body.sf.sf-mobile-dock-on .sf-cp-top-icon i {
            font-size: 18px;
            line-height: 1;
            color: var(--cs-font);
        }

        body.sf.sf-mobile-dock-on .sf-cp-top-icon .label {
            display: inline-flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            text-align: center;
            line-height: 1.08;
            font-size: 14px;
            white-space: nowrap;
        }

        body.sf.sf-mobile-dock-on .sf-cp-top-icon .label small {
            font-size: 11px;
            color: var(--cs-secondary-text);
            font-weight: 400;
            text-transform: none;
            line-height: 1.05;
        }

        /* Cart (ty-minicart__link equivalent) */
        body.sf.sf-mobile-dock-on .sf-cp-top-cart {
            background: transparent;
            border: 0;
            padding: 0;
            display: inline-flex;
            flex-direction: row;
            align-items: center;
            gap: 12px;
            text-decoration: none;
            color: var(--cs-font);
            font-size: 14px;
            line-height: 1.2;
            position: relative;
            transition: color .15s ease;
        }

        body.sf.sf-mobile-dock-on .sf-cp-top-cart:hover {
            background: transparent;
            color: inherit;
            transform: none;
        }

        body.sf.sf-mobile-dock-on .sf-cp-top-cart i {
            width: 44px;
            height: 44px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: var(--cs-base-radius);
            background: var(--cs-btn-background);
            color: var(--cs-font);
            font-size: 18px;
            line-height: 1;
            transition: background .2s ease, color .2s ease;
        }

        body.sf.sf-mobile-dock-on .sf-cp-top-cart:hover i {
            color: #fff;
        }

        body.sf.sf-mobile-dock-on .sf-cp-top-cart .sf-badge {
            position: absolute;
            top: -4px;
            left: 40px;
            background: var(--cs-primary-button);
            color: #fff;
            font-size: 11px;
            font-weight: 700;
            min-width: 20px;
            height: 20px;
            line-height: 20px;
            border-radius: 999px;
            padding: 0 6px;
            border: 2px solid #fff;
        }

        body.sf.sf-mobile-dock-on .sf-cp-sale-badge {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
            min-width: 126px;
            padding: 0 6px;
            text-align: center;
            align-self: stretch;
        }

        body.sf.sf-mobile-dock-on .sf-cp-sale-badge > div {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 2px;
            min-width: 0;
        }

        body.sf.sf-mobile-dock-on .sf-cp-sale-badge i {
            color: #111827;
            font-size: 16px;
            line-height: 1;
            margin-top: 1px;
        }

        body.sf.sf-mobile-dock-on .sf-cp-sale-badge .t {
            color: #111827;
            font-size: 13px;
            font-weight: 700;
            line-height: 1.05;
            white-space: nowrap;
        }

        body.sf.sf-mobile-dock-on .sf-cp-sale-badge .d {
            color: #111827;
            font-size: 12px;
            font-weight: 500;
            line-height: 1.08;
            white-space: nowrap;
        }

        /* Compact topbar — tadic kalınlığına yaklaştır */
        body.sf.sf-mobile-dock-on .sf-topbar {
            padding: 4px 10px;
        }
        body.sf.sf-mobile-dock-on .sf-topbar-inner {
            min-height: 44px;
        }
        body.sf.sf-mobile-dock-on .sf-logo {
            background: transparent;
            border: 0;
            padding: 0;
            border-radius: 0;
            width: auto;
            max-width: 200px;
            height: 44px;
        }
        body.sf.sf-mobile-dock-on .sf-logo img {
            width: auto;
            max-width: 100%;
            max-height: 44px;
            object-fit: contain;
            display: inline-block;
        }

        /* Row 3: Main navigation */
        body.sf.sf-mobile-dock-on .sf-cp-main-nav-row {
            background: #fff;
            border-top: 1px solid #f1f5f9;
            border-bottom: 0;
            padding: 0;
            box-shadow: 0 3px 12px rgba(15,23,42,.07);
        }

        body.sf.sf-mobile-dock-on .sf-cp-main-nav-row .sf-topbar-inner,
        body.sf.sf-mobile-dock-on .sf-cp-main-nav-row > .sf-shell,
        body.sf.sf-mobile-dock-on .sf-cp-main-nav-row > div {
            max-width: var(--sf-layout-max-width);
            margin: 0 auto;
            padding: 0 16px;
        }

        body.sf.sf-mobile-dock-on .sf-cp-main-nav {
            display: flex;
            align-items: stretch;
            gap: 0;
            flex-wrap: wrap;
        }

        body.sf.sf-mobile-dock-on .sf-cp-fast-note {
            margin-left: auto;
            display: inline-flex;
            align-items: center;
            justify-content: flex-end;
            gap: 8px;
            text-align: right;
            white-space: nowrap;
            flex: 0 0 auto;
        }

        body.sf.sf-mobile-dock-on .sf-cp-fast-note span {
            display: inline-flex;
            align-items: center;
            justify-content: flex-end;
            text-align: right;
        }

        body.sf.sf-mobile-dock-on .sf-cp-main-nav-item > .sf-cp-main-nav-link,
        body.sf.sf-mobile-dock-on .sf-cp-main-nav-link {
            color: #374151;
            font-size: 13px;
            font-weight: 500;
            font-family: var(--sf-font, Inter, 'Helvetica Neue', sans-serif);
            padding: 0 14px;
            min-height: 38px;
            border-radius: 0;
            border: 0;
            display: flex;
            align-items: center;
            gap: 6px;
            transition: background .15s ease, color .15s ease;
            text-decoration: none;
            border-bottom: 2px solid transparent;
        }

        body.sf.sf-mobile-dock-on .sf-cp-main-nav-link:hover {
            color: #111827;
            background: #fff;
            border-bottom-color: #94a3b8;
        }

        body.sf.sf-mobile-dock-on .sf-cp-main-nav-item:first-child > .sf-cp-main-nav-link {
            border-top-left-radius: 0;
            border-bottom-left-radius: 0;
        }

        body.sf.sf-mobile-dock-on .sf-cp-main-nav-dropdown {
            background: #fff;
            border: 1px solid #dbe3ee;
            border-radius: 6px;
            padding: 0;
            box-shadow: 0 16px 26px rgba(15, 23, 42, .14);
            overflow: hidden;
        }

        body.sf.sf-mobile-dock-on .sf-cp-main-nav-dropdown a {
            min-height: 44px;
            padding: 0 14px;
            display: flex;
            align-items: center;
            gap: 11px;
            border-radius: 0;
            border-bottom: 1px solid #eef2f7;
            color: #1f2937;
            text-decoration: none;
        }

        body.sf.sf-mobile-dock-on .sf-cp-main-nav-dropdown a:hover {
            color: #066fd1;
            background: rgba(6, 111, 209, .06);
        }

        @media (max-width: 991.98px) {
            body.sf.sf-mobile-dock-on {
                padding-top: calc(72px + var(--sf-above-header-marquee-h, 0px) + env(safe-area-inset-top)) !important;
            }

            body.sf.sf-mobile-dock-on .sf-marquee--above_header {
                position: fixed;
                top: 0;
                left: 0;
                right: 0;
                width: 100%;
                z-index: 1106;
            }

            body.sf.sf-mobile-dock-on .sf-topbar {
                position: fixed;
                top: var(--sf-above-header-marquee-h, 0px);
                left: 0;
                right: 0;
                width: 100%;
                z-index: 1105;
            }
            body.sf.sf-mobile-dock-on .sf-cp-main-nav-row { display: none; }
            body.sf.sf-mobile-dock-on .sf-cp-utility { display: none; }

            body.sf.sf-mobile-dock-on .sf-topbar-inner {
                min-height: 50px;
            }
            body.sf.sf-mobile-dock-on .sf-logo { height: 40px; max-width: 225px; }
            body.sf.sf-mobile-dock-on .sf-logo img { max-height: 40px; }
            body.sf.sf-mobile-dock-on .sf-search { display: none; }
            body.sf.sf-mobile-dock-on .sf-cp-top-icon .label { display: none; }

            body.sf.sf-mobile-dock-on .sf-cp-top-cart i {
                width: 44px;
                height: 44px;
                font-size: 18px;
            }
            body.sf.sf-mobile-dock-on .sf-cp-top-cart .sf-badge { left: 28px; }
        }

        /* === End CS-Cart Nova Theme Header Replica === */

        /* Footer styles live in footer.css to avoid selector duplication. */
/* sf-default-social-force */

.sf-cp-utility .sf-topbar-inner {
    position: relative !important;
}

.sf-cp-utility .sf-default-social {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 13px !important;
    z-index: 5 !important;
    white-space: nowrap !important;
}

.sf-cp-utility .sf-default-social a {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    border-radius: 999px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    font-size: 19px !important;
    line-height: 1 !important;
    padding: 0 !important;
    text-decoration: none !important;
}

.sf-cp-utility .sf-default-social a i {
    font-size: 19px !important;
    line-height: 1 !important;
}

.sf-cp-utility .sf-default-social-facebook,
.sf-cp-utility .sf-default-social-facebook i { color: #1877f2 !important; }
.sf-cp-utility .sf-default-social-instagram,
.sf-cp-utility .sf-default-social-instagram i { color: #e4405f !important; }
.sf-cp-utility .sf-default-social-linkedin,
.sf-cp-utility .sf-default-social-linkedin i { color: #0a66c2 !important; }
.sf-cp-utility .sf-default-social-x,
.sf-cp-utility .sf-default-social-x i { color: #111111 !important; }
.sf-cp-utility .sf-default-social-youtube,
.sf-cp-utility .sf-default-social-youtube i { color: #ff0000 !important; }
.sf-cp-utility .sf-default-social-tiktok { color: #111111 !important; }
.sf-cp-utility .sf-default-social-svg { width: 20px !important; height: 20px !important; display: block !important; }