/* ═══════════════════════════════════════════════════════════════════════════
   Besavibes — Base Design System
   Ortak tasarim tokenleri, reset, tipografi, scrollbar, form ve buton stilleri.
   Tum sayfalarda (Kitchen, Auth, Admin) bu dosya ilk yuklenmelidir.
   ═════════════════════════════════════════════════════════════════════════ */

/* ─── Design Tokens ──────────────────────────────────────────────────────── */
:root {
    /* Ortak palet */
    --bv-accent:         #F4A0B0;
    --bv-accent-hover:   #E8889A;
    --bv-accent-light:   #A8D8F0;
    --bv-danger:         #E05050;
    --bv-success:        #34C07A;

    /* Tipografi */
    --bv-font-family:    'Segoe UI', system-ui, sans-serif;

    /* Boyutlar */
    --bv-radius-sm:      8px;
    --bv-radius-md:      10px;
    --bv-radius-lg:      14px;
    --bv-radius-xl:      20px;

    /* Scrollbar — varsayilan (sayfa-spesifik dosyalarda override edilebilir) */
    --bv-scroll-thumb:   #F4A0B0;
    --bv-scroll-track:   #FFF0E8;
    --bv-scroll-hover:   #E8889A;
}

/* ─── Reset ──────────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* ─── Tipografi & Body ───────────────────────────────────────────────────── */
html {
    font-size: 14px;
}
@media (min-width: 768px) {
    html { font-size: 16px; }
}

body {
    font-family: var(--bv-font-family);
    margin-bottom: 0;
}

/* ─── Scrollbar (parametrik — CSS degiskenleriyle temaya gore degisir) ──── */
html {
    scrollbar-width: thin;
    scrollbar-color: var(--bv-scroll-thumb) var(--bv-scroll-track);
}

::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: var(--bv-scroll-track);
    border-radius: 100px;
}
::-webkit-scrollbar-thumb {
    background: var(--bv-scroll-thumb);
    border-radius: 100px;
    border: 1px solid var(--bv-scroll-track);
}
::-webkit-scrollbar-thumb:hover {
    background: var(--bv-scroll-hover);
}
::-webkit-scrollbar-corner {
    background: var(--bv-scroll-track);
}

/* ─── Bootstrap Focus Ring Override ──────────────────────────────────────── */
.btn:focus, .btn:active:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.15rem rgba(232, 130, 26, 0.35);
}

/* ─── Ortak Input Stili ──────────────────────────────────────────────────── */
.bv-input,
.kitchen-input,
.auth-input,
.admin-input {
    width: 100%;
    padding: 10px 13px;
    border: 1.5px solid #F0D5C8;
    border-radius: var(--bv-radius-md);
    font-size: 0.9rem;
    outline: none;
    transition: border-color 0.2s;
    background: #FFF8F6;
}
.bv-input:focus,
.kitchen-input:focus,
.auth-input:focus,
.admin-input:focus {
    border-color: var(--bv-accent);
    background: #fff;
}

/* ─── Ortak Buton Stili (gradient accent) ────────────────────────────────── */
.bv-btn,
.kitchen-btn,
.auth-btn {
    display: inline-block;
    width: 100%;
    padding: 11px;
    background: linear-gradient(135deg, var(--bv-accent), var(--bv-accent-hover));
    color: #fff;
    border: none;
    border-radius: 12px;
    font-size: 0.92rem;
    font-weight: 700;
    cursor: pointer;
    transition: opacity 0.2s, transform 0.1s;
    text-align: center;
    text-decoration: none;
}
.bv-btn:hover,
.kitchen-btn:hover,
.auth-btn:hover {
    opacity: 0.9;
    transform: translateY(-1px);
}

/* Skip to main content — a11y */
.skip-link { position:absolute; top:-40px; left:0; background:#F4A0B0; color:#fff; padding:8px 16px; z-index:9999; transition:top .2s; }
.skip-link:focus { top:0; }

/* Navbar bildirim rozeti */
.notif-badge { position:absolute; top:4px; right:0; background:#F4A0B0; color:#fff; border-radius:50%; font-size:.6rem; font-weight:700; min-width:16px; height:16px; line-height:16px; text-align:center; display:none; padding:0 3px; }
.notif-bell { position:relative; padding-right:6px; }
.notif-dropdown { min-width:320px; max-height:400px; overflow-y:auto; }
.notif-dropdown-head { padding:8px 14px; font-size:.78rem; font-weight:700; color:#888; border-bottom:1px solid #eee; }
.notif-dropdown-empty { padding:12px 14px; font-size:.8rem; color:#aaa; }
.kitchen-footer-link { color:var(--kitchen-accent); text-decoration:none; font-weight:600; }