dropdown mega menu,
category hover
 */

/* =====================================================================
   1. NAV BAR (sf-cp-main-nav-row) — light grey,
strong shadow
   ===================================================================== */

.sf-cp-main-nav-row,
body.sf.sf-mobile-dock-on .sf-cp-main-nav-row{
    background: #f1f1f1 !important;
    border-bottom: none !important;
    box-shadow: 0 1px 8px rgba(0, 0, 0, 0.30) !important;
    padding: 0 !important;
}

/* =====================================================================
   2. NAV CONTAINER
   ===================================================================== */

.sf-cp-main-nav,
body.sf.sf-mobile-dock-on .sf-cp-main-nav {
    align-items: stretch !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 0 !important;
    height: 44px;
    overflow: visible !important;
}

/* =====================================================================
   3. NAV LINKS — dark charcoal on yellow, vertical separators
   ===================================================================== */

.sf-cp-main-nav-item > .sf-cp-main-nav-link,
.sf-cp-main-nav > .sf-cp-main-nav-link,
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 > .sf-cp-main-nav-link {
    align-items: center !important;
    border: 0 !important;
    border-radius: 0 !important;
    border-right: 1px solid rgba(0, 0, 0, 0.12) !important;
    color: #111827 !important;
    display: flex !important;
    font-family: var(--sf-font, 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica Neue, sans-serif !important);
    font-size: 13px !important;
    font-weight: 700 !important;
    gap: 5px !important;
    letter-spacing: 0.01em !important;
    min-height: 44px !important;
    padding: 0 15px !important;
    text-decoration: none !important;
    transition: background 0.13s ease !important;
    white-space: nowrap !important;
}

/* First item gets left border too */
.sf-cp-main-nav-item:first-child > .sf-cp-main-nav-link,
.sf-cp-main-nav > .sf-cp-main-nav-link:first-child {
    border-left: 1px solid rgba(0, 0, 0, 0.15) !important;
}

/* Separator rengi griye uygun */
.sf-cp-main-nav-item > .sf-cp-main-nav-link,
.sf-cp-main-nav > .sf-cp-main-nav-link {
    border-right-color: rgba(0, 0, 0, 0.15) !important;
}

/* Hover & open state */
.sf-cp-main-nav-item > .sf-cp-main-nav-link:hover,
.sf-cp-main-nav > .sf-cp-main-nav-link:hover,
.sf-cp-main-nav-item.sf-open > .sf-cp-main-nav-link,
body.sf.sf-mobile-dock-on .sf-cp-main-nav-item > .sf-cp-main-nav-link:hover,
body.sf.sf-mobile-dock-on .sf-cp-main-nav > .sf-cp-main-nav-link:hover {
    background: rgba(0, 0, 0, 0.11) !important;
    color: #111827 !important;
}

/* Chevron dropdown arrow */
.sf-cp-main-nav-link .bi-chevron-down {
    font-size: 9px !important;
    margin-left: 1px !important;
    opacity: 0.55 !important;
    transition: transform 0.15s ease !important;
}
.sf-cp-main-nav-item.sf-open .sf-cp-main-nav-link .bi-chevron-down {
    transform: rotate(180deg) !important;
}

/* Icon inside nav link — kullanıcının ayarladığı ikon boyu/rengi uygulansın.
   Eskiden font-size:14px !important boyu, opacity:0.8 ise rengi eziyordu. */
.sf-cp-main-nav-link .sf-page-icon {
    min-width: 14px;
    text-align: center;
}

/* =====================================================================
   4. DROPDOWN CATEGORY MENU
   ===================================================================== */
.sf-cp-main-nav-item {position: relative !important;}
.sf-cp-main-nav-dropdown,body.sf.sf-mobile-dock-on .sf-cp-main-nav-dropdown {background:#fff!important;border:1px solid #dbe3ee!important;border-radius:6px!important;box-shadow:0 16px 26px rgba(15,23,42,.14)!important;display:none!important;left:0!important;min-width:300px!important;padding:0!important;position:absolute!important;top:calc(100% + 8px)!important;overflow:hidden!important;z-index:1060!important;}
@media (hover:hover){.sf-cp-main-nav-item:hover>.sf-cp-main-nav-dropdown{display:block!important;}}
.sf-cp-main-nav-item.sf-open>.sf-cp-main-nav-dropdown{display:block!important;}
.sf-cp-main-nav-dropdown::before{display:none!important;content:none!important;}
.sf-cp-main-nav-dropdown a,body.sf.sf-mobile-dock-on .sf-cp-main-nav-dropdown a{align-items:center!important;background:#fff!important;border:0!important;border-bottom:1px solid #eef2f7!important;border-radius:0!important;color:#1f2937!important;display:flex!important;font-family:var(--sf-font,'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif)!important;font-size:14px!important;font-weight:500!important;gap:11px!important;justify-content:flex-start!important;min-height:44px!important;padding:0 14px!important;text-decoration:none!important;transition:background-color .12s ease,color .12s ease!important;}
.sf-cp-main-nav-dropdown a:last-child,body.sf.sf-mobile-dock-on .sf-cp-main-nav-dropdown a:last-child{border-bottom:0!important;}
.sf-cp-main-nav-dropdown a>i,.sf-cp-main-nav-dropdown a>svg{width:18px!important;min-width:18px!important;color:#64748b!important;font-size:15px!important;font-weight:400!important;line-height:1!important;}
.sf-cp-main-nav-dropdown a::after{margin-left:auto;color:#94a3b8!important;content:"\f285";font-family:bootstrap-icons;font-size:11px;font-weight:400!important;opacity:1;transition:color .12s ease;}
.sf-cp-main-nav-dropdown a:hover,body.sf.sf-mobile-dock-on .sf-cp-main-nav-dropdown a:hover{background:rgba(6,111,209,.06)!important;border-left:0!important;color:#066fd1!important;padding-left:14px!important;}
.sf-cp-main-nav-dropdown a:hover>i,.sf-cp-main-nav-dropdown a:hover>svg,.sf-cp-main-nav-dropdown a:hover::after{color:#066fd1!important;}

/* =====================================================================
   5. FAST NOTE (delivery info right side of nav bar)
   ===================================================================== */

.sf-cp-fast-note,
body.sf.sf-mobile-dock-on .sf-cp-fast-note {
    align-items: center !important;
    color: #111827 !important;
    display: inline-flex !important;
    font-family: var(--sf-font, 'Inter', sans-serif !important);
    font-size: 15px !important;
    font-weight: 600 !important;
    gap: 4px !important;
    letter-spacing: 0.01em !important;
    margin-left: auto !important;
    padding: 0 4px 0 12px !important;
    white-space: nowrap !important;
}

.sf-cp-fast-note strong {
    color: #111827 !important;
    font-weight: 800 !important;
}

.sf-cp-fast-note .bi-chevron-right {
    font-size: 11px !important;
    opacity: 0.7;
}

/* =====================================================================
   6. UTILITY BAR refinements
   ===================================================================== */

.sf-cp-utility,
body.sf.sf-mobile-dock-on .sf-cp-utility {
    background: #ffffff !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

.sf-cp-utility-left a,
.sf-cp-utility-right a {
    color: #4b5563 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    transition: color 0.12s ease !important;
}

.sf-cp-utility-left a:hover,
.sf-cp-utility-right a:hover {
    color: #111827 !important;
}

/* Active locale chip → yellow accent */
.sf-cp-locale-chip.active {
    background: #ffd400 !important;
    border-color: #e6b800 !important;
    color: #111827 !important;
}

.sf-cp-locale-chip:not(.active):hover {
    background: #fffbeb !important;
    border-color: #ffd400 !important;
    color: #111827 !important;
}

/* =====================================================================
   7b. CATEGORY PILL (oval kategoriler) hover effect — Electro accent
   ===================================================================== */

.sf-cat-pill-wrap a,
.sf-cat-pill {
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease !important;
}

.sf-cat-pill-wrap a:hover .sf-cat-pill-circle,
.sf-cat-pill:hover {
    background: #fffbeb !important;
    border-color: #ffd400 !important;
    box-shadow: 0 4px 14px rgba(255, 212, 0, 0.30) !important;
    transform: none !important;
}

.sf-cat-pill-circle {
    transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}

.sf-cat-pill-wrap a:hover .sf-cat-pill-circle {
    border: 2px solid #ffd400 !important;
    box-shadow: 0 0 0 3px rgba(255, 212, 0, 0.18) !important;
}

.sf-cat-pill-title {
    font-weight: 600 !important;
    transition: color 0.12s ease !important;
}

.sf-cat-pill-wrap a:hover .sf-cat-pill-title {
    color: #92400e !important;
}

/* =====================================================================
   9. PROMO TOP BAR
   Admin panelinden seçilen renkler inline style ile geliyor.
   Burada override YAPILMAZ — admin renkleri korunur.
   ===================================================================== */

/* Sadece buton stilini güncelle{
    font-weight: 800 !important;
}

/* =====================================================================
   10. RESPONSIVE — hide on mobile (already handled by nova.css)
   ===================================================================== */

@media (max-width: 991.98px) {
    .sf-cp-main-nav-row {
        display: none !important;
    }
}