/* ═══════════════════════════════════════════════════════════════
   YÖN V1 — Mobil-Öncelik v8.0 · Varsayılan Gece Modu
   Telefon/tablet öncelikli · Her bileşen optimize
   ═══════════════════════════════════════════════════════════════ */

/* ─── Varsayılan koyu tokenlar (gündüz modu override eder) ─── */
body.yon-v1-theme.yon-mobile-first {
    --mf-bg: #060d18;
    --mf-surface: #0f172a;
    --mf-surface-2: #1a2332;
    --mf-surface-3: #243044;
    --mf-text: #f1f5f9;
    --mf-muted: #94a3b8;
    --mf-border: #2d3a4f;
    --mf-accent: #2dd4bf;
    --mf-accent-hover: #14b8a6;
    --mf-accent-soft: rgba(45, 212, 191, 0.14);
    --mf-accent-glow: rgba(45, 212, 191, 0.28);
    --mf-gold: #d4b86a;
    --mf-radius-xs: 8px;
    --mf-radius-sm: 12px;
    --mf-radius-md: 16px;
    --mf-radius-lg: 20px;
    --mf-radius-xl: 24px;
    --mf-pad: clamp(14px, 4vw, 20px);
    --mf-touch: 48px;
    --mf-nav-h: calc(76px + env(safe-area-inset-bottom, 0px));
    --mf-glass: rgba(15, 23, 42, 0.88);
    --mf-shadow: 0 2px 12px rgba(0, 0, 0, 0.28);
    --mf-shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.38);
    --mf-shell-max: 100%;
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

html:not([data-yon-appearance="dark"]) body.yon-v1-theme.yon-mobile-first {
    --mf-bg: #e8edf4;
    --mf-surface: #ffffff;
    --mf-surface-2: #f1f5f9;
    --mf-surface-3: #e2e8f0;
    --mf-text: #0b1220;
    --mf-muted: #5c6b82;
    --mf-border: #d5dde8;
    --mf-accent: #0d9488;
    --mf-accent-hover: #0f766e;
    --mf-accent-soft: rgba(13, 148, 136, 0.1);
    --mf-accent-glow: rgba(13, 148, 136, 0.22);
    --mf-glass: rgba(255, 255, 255, 0.94);
    --mf-shadow: 0 2px 8px rgba(11, 18, 32, 0.06);
    --mf-shadow-lg: 0 8px 28px rgba(11, 18, 32, 0.1);
}

/* Enterprise token senkronizasyonu */
body.yon-v1-theme.yon-mobile-first.yon-enterprise {
    --e-bg: var(--mf-bg);
    --e-surface: var(--mf-surface);
    --e-surface-2: var(--mf-surface-2);
    --e-text: var(--mf-text);
    --e-muted: var(--mf-muted);
    --e-border: var(--mf-border);
    --e-accent: var(--mf-accent);
    --e-accent-hover: var(--mf-accent-hover);
    --e-accent-soft: var(--mf-accent-soft);
    --e-accent-light: var(--mf-accent);
    --e-shadow: var(--mf-shadow);
    --e-shadow-lg: var(--mf-shadow-lg);
    --e-pad: var(--mf-pad);
    --yon-shell-max: 100%;
    background: var(--mf-bg) !important;
    color: var(--mf-text) !important;
}

/* ─── Shell — tam genişlik mobil ─── */
body.yon-v1-theme.yon-mobile-first .mobile-shell,
body.yon-v1-theme.yon-mobile-first .yon-shell {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    background: var(--mf-surface) !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 0 !important;
    padding-bottom: calc(var(--mf-nav-h) + 8px) !important;
    overflow-x: hidden !important;
}

body.yon-v1-theme.yon-mobile-first .main-content {
    background: transparent;
    overflow-x: hidden;
}

/* ─── Header — kompakt, cam efekt ─── */
body.yon-v1-theme.yon-mobile-first .app-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 350 !important;
    display: grid !important;
    grid-template-columns: var(--mf-touch) 1fr auto !important;
    gap: 8px !important;
    padding: calc(8px + env(safe-area-inset-top, 0px)) var(--mf-pad) 8px !important;
    background: var(--mf-glass) !important;
    backdrop-filter: blur(16px) saturate(1.3) !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.3) !important;
    border-bottom: 1px solid var(--mf-border) !important;
    box-shadow: none !important;
}

body.yon-v1-theme.yon-mobile-first .menu-toggle,
body.yon-v1-theme.yon-mobile-first button.header-btn,
body.yon-v1-theme.yon-mobile-first .header-btn {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    border-radius: var(--mf-radius-xs) !important;
    background: var(--mf-surface-2) !important;
    border: 1px solid var(--mf-border) !important;
    color: var(--mf-text) !important;
}

body.yon-v1-theme.yon-mobile-first .bz-name {
    font-size: clamp(0.88rem, 4vw, 1.05rem) !important;
    font-weight: 700 !important;
    color: var(--mf-text) !important;
}

body.yon-v1-theme.yon-mobile-first .bz-cafe-line,
body.yon-v1-theme.yon-mobile-first .yon-jacca-tagline {
    font-size: 0.62rem !important;
    color: var(--mf-accent) !important;
    letter-spacing: 0.08em;
}

/* ─── Hero — mobil vitrin ─── */
body.yon-v1-theme.yon-mobile-first .yon-nova-hero-block {
    margin: 0 !important;
}

body.yon-v1-theme.yon-mobile-first .hero-panels-wrap {
    height: clamp(210px, 56vw, 300px) !important;
    border-radius: 0 !important;
    background: var(--mf-surface-2) !important;
}

body.yon-v1-theme.yon-mobile-first .hero-title-stack {
    background: rgba(6, 13, 24, 0.72) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: var(--mf-radius-md) !important;
    padding: 12px 16px !important;
    max-width: 90% !important;
}

body.yon-v1-theme.yon-mobile-first .hero-t-norm {
    color: var(--mf-accent) !important;
    font-size: 0.68rem !important;
    letter-spacing: 0.16em !important;
}

body.yon-v1-theme.yon-mobile-first .hero-t-em {
    color: #fff !important;
    font-size: clamp(1.35rem, 6vw, 1.85rem) !important;
}

body.yon-v1-theme.yon-mobile-first .hero-nav-btn {
    width: 44px !important;
    height: 44px !important;
    background: rgba(0, 0, 0, 0.45) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    color: #fff !important;
}

body.yon-v1-theme.yon-mobile-first .hero-dot.active {
    background: var(--mf-accent) !important;
    width: 24px !important;
    border-radius: 6px !important;
}

/* ─── Hoş geldiniz kartı ─── */
body.yon-v1-theme.yon-mobile-first .yon-welcome {
    padding: 12px var(--mf-pad) 0 !important;
}

body.yon-v1-theme.yon-mobile-first .yon-welcome-card {
    background: linear-gradient(145deg, var(--mf-surface-2) 0%, var(--mf-surface) 100%) !important;
    border: 1px solid var(--mf-border) !important;
    border-radius: var(--mf-radius-lg) !important;
    padding: 18px 16px !important;
    box-shadow: var(--mf-shadow) !important;
    position: relative;
    overflow: hidden;
}

body.yon-v1-theme.yon-mobile-first .yon-welcome-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--mf-accent), var(--mf-gold));
}

body.yon-v1-theme.yon-mobile-first .yon-welcome-eyebrow {
    background: var(--mf-accent-soft) !important;
    color: var(--mf-accent) !important;
    border-radius: 99px !important;
    padding: 5px 12px !important;
    font-size: 0.62rem !important;
    font-weight: 700 !important;
}

body.yon-v1-theme.yon-mobile-first .yon-welcome-title {
    color: var(--mf-text) !important;
    font-size: clamp(1.2rem, 5.5vw, 1.5rem) !important;
    margin: 8px 0 4px !important;
}

body.yon-v1-theme.yon-mobile-first .yon-welcome-slogan {
    color: var(--mf-muted) !important;
    font-size: 0.82rem !important;
}

body.yon-v1-theme.yon-mobile-first .yon-stat-pill {
    background: var(--mf-surface-3) !important;
    border: 1px solid var(--mf-border) !important;
    color: var(--mf-muted) !important;
    border-radius: 99px !important;
    padding: 6px 11px !important;
    font-size: 0.7rem !important;
}

body.yon-v1-theme.yon-mobile-first .yon-stat-pill strong {
    color: var(--mf-text) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-stat-pill i {
    color: var(--mf-accent) !important;
}

/* ─── Güven & iletişim ─── */
body.yon-v1-theme.yon-mobile-first .yon-trust-strip {
    padding: 10px var(--mf-pad) !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

body.yon-v1-theme.yon-mobile-first .yon-trust-strip::-webkit-scrollbar { display: none; }

body.yon-v1-theme.yon-mobile-first .yon-trust-item {
    flex-shrink: 0;
    background: var(--mf-surface) !important;
    border: 1px solid var(--mf-border) !important;
    color: var(--mf-muted) !important;
    border-radius: 99px !important;
    padding: 8px 12px !important;
    font-size: 0.68rem !important;
}

body.yon-v1-theme.yon-mobile-first .yon-trust-item i {
    color: var(--mf-accent) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-contact-bar {
    margin: 0 var(--mf-pad) 12px !important;
    padding: 12px !important;
    background: var(--mf-surface) !important;
    border: 1px solid var(--mf-border) !important;
    border-radius: var(--mf-radius-md) !important;
    gap: 8px !important;
}

body.yon-v1-theme.yon-mobile-first .yon-contact-item {
    color: var(--mf-text) !important;
    font-size: 0.78rem !important;
    min-height: var(--mf-touch);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

body.yon-v1-theme.yon-mobile-first .yon-contact-item i {
    color: var(--mf-accent) !important;
}

/* ─── Arama ─── */
body.yon-v1-theme.yon-mobile-first .yon-home-search-wrap {
    padding: 0 var(--mf-pad) !important;
    margin-bottom: 12px !important;
}

body.yon-v1-theme.yon-mobile-first .yon-home-search {
    background: var(--mf-surface) !important;
    border: 1px solid var(--mf-border) !important;
    border-radius: var(--mf-radius-md) !important;
    min-height: var(--mf-touch) !important;
    box-shadow: var(--mf-shadow) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-home-search input {
    color: var(--mf-text) !important;
    background: transparent !important;
}

body.yon-v1-theme.yon-mobile-first .yon-home-search i {
    color: var(--mf-muted) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-search-results {
    background: var(--mf-surface) !important;
    border: 1px solid var(--mf-border) !important;
    border-radius: var(--mf-radius-md) !important;
    box-shadow: var(--mf-shadow-lg) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-search-item {
    color: var(--mf-text) !important;
    border-bottom: 1px solid var(--mf-border) !important;
    min-height: var(--mf-touch) !important;
}

/* ─── Duyuru şeridi ─── */
body.yon-v1-theme.yon-mobile-first .yon-announce-bar {
    margin: 0 var(--mf-pad) 12px !important;
    background: linear-gradient(90deg, var(--mf-accent-soft), transparent) !important;
    border: 1px solid var(--mf-border) !important;
    border-left: 3px solid var(--mf-accent) !important;
    border-radius: var(--mf-radius-md) !important;
    padding: 12px 14px !important;
    min-height: var(--mf-touch) !important;
    color: var(--mf-text) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-announce-bar i {
    color: var(--mf-accent) !important;
}

/* ─── Hızlı erişim ─── */
body.yon-v1-theme.yon-mobile-first .yon-quick-dock {
    margin: 0 var(--mf-pad) 14px !important;
    padding: 14px !important;
    background: var(--mf-surface) !important;
    border: 1px solid var(--mf-border) !important;
    border-radius: var(--mf-radius-lg) !important;
    box-shadow: var(--mf-shadow) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-quick-dock-title {
    color: var(--mf-text) !important;
    font-weight: 700 !important;
}

body.yon-v1-theme.yon-mobile-first .yon-quick-dock-sub {
    color: var(--mf-muted) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-quick-actions {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 8px !important;
}

@media (max-width: 340px) {
    body.yon-v1-theme.yon-mobile-first .yon-quick-actions {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

body.yon-v1-theme.yon-mobile-first .yon-action-btn {
    background: var(--mf-surface-2) !important;
    border: 1px solid var(--mf-border) !important;
    border-radius: var(--mf-radius-md) !important;
    min-height: 76px !important;
    padding: 10px 6px !important;
    transition: transform 0.15s, border-color 0.2s;
}

body.yon-v1-theme.yon-mobile-first .yon-action-btn:active {
    transform: scale(0.96);
    border-color: var(--mf-accent) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-action-label {
    color: var(--mf-text) !important;
    font-size: 0.66rem !important;
    font-weight: 600 !important;
}

body.yon-v1-theme.yon-mobile-first .yon-action-icon {
    width: 40px !important;
    height: 40px !important;
    border-radius: 12px !important;
}

/* ─── Kategori şeridi ─── */
body.yon-v1-theme.yon-mobile-first .yon-cat-strip {
    padding: 0 var(--mf-pad) 14px !important;
    gap: 8px !important;
    scroll-padding-left: var(--mf-pad);
}

body.yon-v1-theme.yon-mobile-first .yon-cat-chip {
    background: var(--mf-surface) !important;
    border: 1px solid var(--mf-border) !important;
    color: var(--mf-text) !important;
    border-radius: 99px !important;
    padding: 9px 16px !important;
    font-size: 0.76rem !important;
    font-weight: 600 !important;
    min-height: 36px !important;
    flex-shrink: 0;
}

body.yon-v1-theme.yon-mobile-first .yon-cat-chip.active {
    background: var(--mf-accent) !important;
    border-color: var(--mf-accent) !important;
    color: var(--mf-bg) !important;
    box-shadow: 0 4px 14px var(--mf-accent-glow) !important;
}

/* ─── Bölüm başlıkları ─── */
body.yon-v1-theme.yon-mobile-first .yon-section-head h2 {
    color: var(--mf-text) !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
}

body.yon-v1-theme.yon-mobile-first .yon-section-head h2 i {
    color: var(--mf-accent) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-section-link {
    background: var(--mf-surface-2) !important;
    border: 1px solid var(--mf-border) !important;
    color: var(--mf-accent) !important;
    border-radius: 99px !important;
    padding: 6px 14px !important;
    font-size: 0.72rem !important;
    font-weight: 700 !important;
}

/* ─── Kategori kartları ─── */
body.yon-v1-theme.yon-mobile-first .categories-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    padding: 0 var(--mf-pad) 20px !important;
}

body.yon-v1-theme.yon-mobile-first .category-card-h {
    display: grid !important;
    grid-template-columns: 84px 1fr 40px !important;
    align-items: center !important;
    gap: 12px !important;
    min-height: 84px !important;
    padding: 10px 12px 10px 10px !important;
    background: var(--mf-surface) !important;
    border: 1px solid var(--mf-border) !important;
    border-radius: var(--mf-radius-md) !important;
    box-shadow: var(--mf-shadow) !important;
    transition: transform 0.15s, border-color 0.2s;
}

body.yon-v1-theme.yon-mobile-first .category-card-h:active {
    transform: scale(0.98);
    border-color: var(--mf-accent) !important;
}

body.yon-v1-theme.yon-mobile-first .category-card-h .cat-img-wrap {
    width: 84px !important;
    height: 68px !important;
    border-radius: var(--mf-radius-sm) !important;
    background: var(--mf-surface-2) !important;
    overflow: hidden !important;
}

body.yon-v1-theme.yon-mobile-first .category-card-h .cat-name {
    color: var(--mf-text) !important;
    font-weight: 700 !important;
    font-size: 0.9rem !important;
}

body.yon-v1-theme.yon-mobile-first .category-card-h .cat-count {
    color: var(--mf-muted) !important;
    font-size: 0.72rem !important;
}

body.yon-v1-theme.yon-mobile-first .category-card-h .cat-arrow {
    color: var(--mf-accent) !important;
    width: 32px !important;
    height: 32px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--mf-accent-soft) !important;
    border-radius: 50% !important;
}

/* ─── Popüler ürünler ─── */
body.yon-v1-theme.yon-mobile-first .product-scroll {
    display: flex !important;
    gap: 12px !important;
    padding: 4px var(--mf-pad) 22px !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
    -webkit-overflow-scrolling: touch;
}

body.yon-v1-theme.yon-mobile-first .product-card-h {
    flex: 0 0 min(74vw, 268px) !important;
    width: min(74vw, 268px) !important;
    scroll-snap-align: start !important;
    background: var(--mf-surface) !important;
    border: 1px solid var(--mf-border) !important;
    border-radius: var(--mf-radius-md) !important;
    overflow: hidden !important;
    box-shadow: var(--mf-shadow) !important;
}

body.yon-v1-theme.yon-mobile-first .product-card-h-media {
    background: var(--mf-surface-2) !important;
    aspect-ratio: 4/3 !important;
}

body.yon-v1-theme.yon-mobile-first .product-card-h-badge {
    background: var(--mf-accent) !important;
    color: var(--mf-bg) !important;
    font-size: 0.58rem !important;
    font-weight: 800 !important;
    border-radius: 6px !important;
}

body.yon-v1-theme.yon-mobile-first .product-card-h-name {
    color: var(--mf-text) !important;
    font-weight: 700 !important;
    font-size: 0.88rem !important;
}

body.yon-v1-theme.yon-mobile-first .product-card-h-add {
    background: var(--mf-accent) !important;
    color: var(--mf-bg) !important;
    border: none !important;
    border-radius: 10px !important;
    min-width: 40px !important;
    min-height: 40px !important;
}

body.yon-v1-theme.yon-mobile-first .bz-price-tag {
    background: var(--mf-accent-soft) !important;
    color: var(--mf-accent) !important;
    border-radius: var(--mf-radius-xs) !important;
}

/* ─── Özellik kutuları ─── */
body.yon-v1-theme.yon-mobile-first .features-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
    padding: 0 var(--mf-pad) 20px !important;
}

body.yon-v1-theme.yon-mobile-first .feature-box {
    background: var(--mf-surface) !important;
    border: 1px solid var(--mf-border) !important;
    border-radius: var(--mf-radius-md) !important;
    padding: 14px 12px !important;
    text-align: center;
}

body.yon-v1-theme.yon-mobile-first .feature-box i {
    color: var(--mf-accent) !important;
    font-size: 1.4rem !important;
    margin-bottom: 6px;
}

body.yon-v1-theme.yon-mobile-first .feature-box-title {
    color: var(--mf-text) !important;
    font-weight: 700 !important;
    font-size: 0.8rem !important;
}

body.yon-v1-theme.yon-mobile-first .feature-box-desc {
    color: var(--mf-muted) !important;
    font-size: 0.68rem !important;
}

/* ─── Footer CTA ─── */
body.yon-v1-theme.yon-mobile-first .home-footer-cta {
    padding: 0 var(--mf-pad) 16px !important;
    gap: 12px !important;
}

body.yon-v1-theme.yon-mobile-first .footer-cta-btn,
body.yon-v1-theme.yon-mobile-first .footer-whatsapp {
    background: var(--mf-surface-2) !important;
    border: 1px solid var(--mf-border) !important;
    border-radius: var(--mf-radius-lg) !important;
    color: var(--mf-text) !important;
    width: 100% !important;
    min-height: var(--mf-touch) !important;
    padding: 14px 16px !important;
}

body.yon-v1-theme.yon-mobile-first .footer-cta-btn {
    background: linear-gradient(135deg, var(--mf-accent) 0%, var(--mf-accent-hover) 100%) !important;
    border: none !important;
    color: var(--mf-bg) !important;
    box-shadow: 0 6px 20px var(--mf-accent-glow) !important;
}

body.yon-v1-theme.yon-mobile-first .footer-slogan {
    color: var(--mf-muted) !important;
    font-size: 0.78rem !important;
}

body.yon-v1-theme.yon-mobile-first .yon-brand-footer {
    color: var(--mf-muted) !important;
    opacity: 0.7;
    padding: 12px var(--mf-pad) 8px !important;
    font-size: 0.65rem !important;
}

/* ─── Ürünler sayfası ─── */
body.yon-v1-theme.yon-mobile-first .page-header {
    background: var(--mf-glass) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border-bottom: 1px solid var(--mf-border) !important;
    padding: 10px var(--mf-pad) !important;
}

body.yon-v1-theme.yon-mobile-first .page-title {
    color: var(--mf-text) !important;
}

body.yon-v1-theme.yon-mobile-first .back-btn {
    background: var(--mf-surface-2) !important;
    border: 1px solid var(--mf-border) !important;
    color: var(--mf-text) !important;
    border-radius: var(--mf-radius-xs) !important;
}

body.yon-v1-theme.yon-mobile-first #productsPage .search-box {
    background: var(--mf-surface) !important;
    border: 1px solid var(--mf-border) !important;
    border-radius: var(--mf-radius-md) !important;
    margin: 10px var(--mf-pad) !important;
    color: var(--mf-text) !important;
}

body.yon-v1-theme.yon-mobile-first #productsPage .search-box input {
    color: var(--mf-text) !important;
}

body.yon-v1-theme.yon-mobile-first #productsPage .product-card {
    background: var(--mf-surface) !important;
    border: 1px solid var(--mf-border) !important;
    border-radius: var(--mf-radius-md) !important;
    padding: 12px !important;
}

body.yon-v1-theme.yon-mobile-first #productsPage .product-name {
    color: var(--mf-text) !important;
}

body.yon-v1-theme.yon-mobile-first #productsPage .product-desc {
    color: var(--mf-muted) !important;
}

body.yon-v1-theme.yon-mobile-first #productsPage .add-btn {
    background: var(--mf-accent) !important;
    color: var(--mf-bg) !important;
    border-radius: 10px !important;
}

/* ─── Alt navigasyon — premium mobil ─── */
body.yon-v1-theme.yon-mobile-first .bottom-nav.yon-bottom-nav {
    background: transparent !important;
    padding: 0 max(10px, env(safe-area-inset-left)) env(safe-area-inset-bottom, 0px) max(10px, env(safe-area-inset-right)) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-bottom-nav-inner {
    background: var(--mf-glass) !important;
    backdrop-filter: blur(20px) saturate(1.4) !important;
    -webkit-backdrop-filter: blur(20px) saturate(1.4) !important;
    border: 1px solid var(--mf-border) !important;
    border-radius: var(--mf-radius-xl) var(--mf-radius-xl) 0 0 !important;
    box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.35) !important;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom, 0px)) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-bottom-nav .nav-label,
body.yon-v1-theme.yon-mobile-first .yon-bottom-nav .nav-center-label {
    color: var(--mf-muted) !important;
    font-size: 0.58rem !important;
    font-weight: 600 !important;
}

body.yon-v1-theme.yon-mobile-first .yon-bottom-nav .nav-item.active .nav-label {
    color: var(--mf-accent) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-bottom-nav .nav-icon-wrap {
    color: var(--mf-muted) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-bottom-nav .nav-item.active .nav-icon-wrap {
    color: var(--mf-accent) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-bottom-nav .nav-center.yon-nav-fab {
    background: linear-gradient(145deg, var(--mf-accent), var(--mf-accent-hover)) !important;
    color: var(--mf-bg) !important;
    width: 56px !important;
    height: 56px !important;
    margin-top: -20px !important;
    box-shadow: 0 8px 24px var(--mf-accent-glow) !important;
    border: 2px solid var(--mf-surface) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-fab-top {
    background: var(--mf-surface-2) !important;
    border: 1px solid var(--mf-border) !important;
    color: var(--mf-accent) !important;
    bottom: calc(var(--mf-nav-h) + 10px) !important;
    box-shadow: var(--mf-shadow) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-fab-top.show {
    opacity: 1;
}

/* ─── Modallar — tam ekran sheet ─── */
body.yon-v1-theme.yon-mobile-first .modal-overlay {
    background: rgba(0, 0, 0, 0.65) !important;
    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
    align-items: flex-end !important;
}

body.yon-v1-theme.yon-mobile-first .modal-content,
body.yon-v1-theme.yon-mobile-first .yon-sheet-modal,
body.yon-v1-theme.yon-mobile-first .yon-product-modal,
body.yon-v1-theme.yon-mobile-first .yon-cart-modal,
body.yon-v1-theme.yon-mobile-first .yon-table-modal {
    background: var(--mf-surface) !important;
    border: 1px solid var(--mf-border) !important;
    border-bottom: none !important;
    border-radius: var(--mf-radius-xl) var(--mf-radius-xl) 0 0 !important;
    max-height: min(94dvh, 94vh) !important;
    color: var(--mf-text) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-sheet-handle {
    background: var(--mf-border) !important;
    width: 44px !important;
    height: 5px !important;
}

body.yon-v1-theme.yon-mobile-first .modal-header,
body.yon-v1-theme.yon-mobile-first .yon-modal-header {
    background: var(--mf-surface) !important;
    border-bottom: 1px solid var(--mf-border) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-modal-head-text h3 {
    color: var(--mf-text) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-modal-sub {
    color: var(--mf-muted) !important;
}

body.yon-v1-theme.yon-mobile-first .modal-close {
    background: var(--mf-surface-2) !important;
    border: 1px solid var(--mf-border) !important;
    color: var(--mf-text) !important;
    border-radius: 50% !important;
    width: 40px !important;
    height: 40px !important;
}

body.yon-v1-theme.yon-mobile-first .waiter-option {
    background: var(--mf-surface-2) !important;
    border: 1px solid var(--mf-border) !important;
    border-radius: var(--mf-radius-md) !important;
    color: var(--mf-text) !important;
    min-height: 60px !important;
}

body.yon-v1-theme.yon-mobile-first .waiter-option-icon {
    background: var(--mf-accent-soft) !important;
    color: var(--mf-accent) !important;
}

body.yon-v1-theme.yon-mobile-first .form-control,
body.yon-v1-theme.yon-mobile-first .form-select {
    background: var(--mf-surface-2) !important;
    border: 1px solid var(--mf-border) !important;
    color: var(--mf-text) !important;
    border-radius: var(--mf-radius-sm) !important;
    min-height: var(--mf-touch) !important;
}

body.yon-v1-theme.yon-mobile-first .order-btn,
body.yon-v1-theme.yon-mobile-first .copy-password-btn,
body.yon-v1-theme.yon-mobile-first .add-cart-btn,
body.yon-v1-theme.yon-mobile-first .yon-cart-order-btn {
    background: linear-gradient(135deg, var(--mf-accent), var(--mf-accent-hover)) !important;
    color: var(--mf-bg) !important;
    border: none !important;
    border-radius: var(--mf-radius-md) !important;
    min-height: var(--mf-touch) !important;
    font-weight: 700 !important;
    box-shadow: 0 6px 18px var(--mf-accent-glow) !important;
}

/* ─── Mega menü — tam ekran ─── */
body.yon-v1-theme.yon-mobile-first .mega-menu {
    width: 100% !important;
    max-width: 100% !important;
    background: var(--mf-surface) !important;
    border-right: 1px solid var(--mf-border) !important;
}

body.yon-v1-theme.yon-mobile-first .mega-menu-header {
    background: var(--mf-surface-2) !important;
    border-bottom: 1px solid var(--mf-border) !important;
}

body.yon-v1-theme.yon-mobile-first .mega-cat-head,
body.yon-v1-theme.yon-mobile-first .mega-sub-item {
    color: var(--mf-text) !important;
    border-color: var(--mf-border) !important;
    min-height: var(--mf-touch) !important;
}

body.yon-v1-theme.yon-mobile-first .mega-quick-btn,
body.yon-v1-theme.yon-mobile-first .mega-footer-btn {
    background: var(--mf-surface-2) !important;
    border: 1px solid var(--mf-border) !important;
    color: var(--mf-text) !important;
    border-radius: var(--mf-radius-sm) !important;
}

/* ─── Masa rozeti ─── */
body.yon-v1-theme.yon-mobile-first .table-badge {
    margin: 8px var(--mf-pad) !important;
    background: var(--mf-accent-soft) !important;
    border: 1px solid var(--mf-border) !important;
    color: var(--mf-accent) !important;
    border-radius: var(--mf-radius-md) !important;
}

/* ─── Scroll progress ─── */
body.yon-v1-theme.yon-mobile-first .yon-scroll-progress span {
    background: linear-gradient(90deg, var(--mf-accent), var(--mf-gold)) !important;
}

/* ─── Tema paneli ─── */
body.yon-v1-theme.yon-mobile-first .yon-theme-panel {
    background: var(--mf-surface) !important;
    border: 1px solid var(--mf-border) !important;
    box-shadow: var(--mf-shadow-lg) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-theme-opt {
    color: var(--mf-text) !important;
    border-radius: var(--mf-radius-xs) !important;
}

body.yon-v1-theme.yon-mobile-first .yon-theme-opt.active {
    background: var(--mf-accent) !important;
    color: var(--mf-bg) !important;
}

body.yon-v1-theme.yon-mobile-first #langDropdown {
    background: var(--mf-surface) !important;
    border: 1px solid var(--mf-border) !important;
}

body.yon-v1-theme.yon-mobile-first #langDropdown a {
    color: var(--mf-text) !important;
}

body.yon-v1-theme.yon-mobile-first #langDropdown a.active {
    background: var(--mf-accent-soft) !important;
    color: var(--mf-accent) !important;
}

/* ─── Boş / yükleme durumları ─── */
body.yon-v1-theme.yon-mobile-first .empty-state,
body.yon-v1-theme.yon-mobile-first .cart-empty {
    color: var(--mf-muted) !important;
}

body.yon-v1-theme.yon-mobile-first .loading {
    color: var(--mf-muted) !important;
}

/* ─── Reduced motion ─── */
@media (prefers-reduced-motion: reduce) {
    body.yon-v1-theme.yon-mobile-first * {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

/* ─── Büyük ekran — mobil shell ortala (opsiyonel) ─── */
@media (min-width: 520px) {
    body.yon-v1-theme.yon-mobile-first .yon-shell,
    body.yon-v1-theme.yon-mobile-first .mobile-shell {
        max-width: 480px !important;
        margin: 0 auto !important;
        border-left: 1px solid var(--mf-border);
        border-right: 1px solid var(--mf-border);
    }

    body.yon-v1-theme.yon-mobile-first .app-header {
        max-width: 480px;
        margin: 0 auto;
    }
}

/* Kategori / ürün sayfası görünürlüğü — tüm !important çakışmalarını geçersiz kılar */
body.yon-v1-theme #homePage.yon-page-active {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
}

body.yon-v1-theme #homePage:not(.yon-page-active) {
    display: none !important;
}

body.yon-v1-theme #productsPage.yon-page-active,
body.yon-v1-theme #galleryPage.yon-page-active,
body.yon-v1-theme #subCategoriesPage.yon-page-active,
body.yon-v1-theme #productsPage.active,
body.yon-v1-theme #galleryPage.active,
body.yon-v1-theme #subCategoriesPage.active {
    display: block !important;
}

body.yon-v1-theme #productsPage:not(.yon-page-active):not(.active),
body.yon-v1-theme #galleryPage:not(.yon-page-active):not(.active),
body.yon-v1-theme #subCategoriesPage:not(.yon-page-active):not(.active) {
    display: none !important;
}