/* =============================================================
   RISTO THEME — "Servizio serale"
   Rivestimento estetico unificato per l'app Ristoranti.
   SOLO estetica: variabili colore, font, radius, ombre, focus.
   Nessuna regola di layout (display/position/size) → non può
   rompere la struttura delle pagine.
   Caricato DOPO gli stili di pagina (tranne in cucina: PRIMA,
   così la cucina conserva il suo monospace da comanda).
   v1 — 2026-07-07
   ============================================================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,600;9..144,700&family=Figtree:wght@400;500;600;700&display=swap');

/* -------------------------------------------------------------
   1. PALETTE — variabili condivise dalle pagine (già esistenti
      nei loro <style>): qui vengono ridefinite e unificate.
      Dark = default (sala la sera): bruno-notte + ottone.
   ------------------------------------------------------------- */
:root {
    /* set principale (admin / cameriere / cliente-ordine) */
    --bg-gradient: radial-gradient(1100px 700px at 50% -10%, #33261a 0%, #1d1510 48%, #120d09 100%);
    --card-bg: rgba(36, 28, 21, 0.92);
    --card-border: rgba(224, 164, 76, 0.16);
    --accent: #e0a44c;
    --accent-soft: rgba(224, 164, 76, 0.16);
    --accent-strong: #c98a2e;
    --accent-alt: #e8b96b;
    --text-main: #f0e7da;
    --text-muted: #b3a48e;
    --danger: #e07856;
    --badge-bg: rgba(74, 59, 42, 0.85);
    --shadow-soft: 0 24px 70px rgba(8, 5, 2, 0.55);

    /* set cliente/menu (pagina chiara "tovaglia") */
    --bg-page: #f5efe4;
    --bg-header: #fffdf8;
    --bg-card: #fffdf8;
    --bg-chip: #efe6d4;
    --border-soft: rgba(110, 88, 58, 0.16);
    --border-strong: rgba(110, 88, 58, 0.34);
    --primary: #a86c14;
    --primary-soft: rgba(168, 108, 20, 0.12);
    --primary-text: #855510;
    --danger-soft: rgba(166, 61, 61, 0.10);
    --danger-border: rgba(166, 61, 61, 0.35);
    --danger-text: #9c3a2c;
}

/* Tema chiaro (toggle in-app): "tovaglia di lino" calda */
:root[data-theme="light"] {
    --bg-gradient: radial-gradient(1100px 700px at 50% -10%, #fffdf8 0%, #f5eee1 55%, #ece2cf 100%);
    --card-bg: rgba(255, 253, 248, 0.97);
    --card-border: rgba(110, 88, 58, 0.22);
    --accent: #a86c14;
    --accent-soft: rgba(168, 108, 20, 0.12);
    --accent-strong: #855510;
    --accent-alt: #c08a2e;
    --text-main: #2b2118;
    --text-muted: #7a6b57;
    --danger: #a63d3d;
    --badge-bg: #efe6d4;
    --shadow-soft: 0 18px 45px rgba(60, 42, 20, 0.16);
}

/* -------------------------------------------------------------
   2. TIPOGRAFIA
      Figtree per l'interfaccia, Fraunces (serif da insegna) per
      i titoli principali. La cucina conserva il suo monospace
      perché questo file lì è caricato prima del CSS locale.
   ------------------------------------------------------------- */
body {
    font-family: "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}

h1, h2, .brand {
    font-family: "Fraunces", Georgia, "Times New Roman", serif;
    letter-spacing: .01em;
}

/* -------------------------------------------------------------
   3. BOOTSTRAP — solo colori/radius/ombre dei componenti.
      L'ottone sostituisce il blu primario; il verde "success"
      resta verde (semantica operativa di sala/cucina) ma più
      profondo; il danger diventa rosso vino.
   ------------------------------------------------------------- */
.btn-primary {
    --bs-btn-bg: #c98a2e;
    --bs-btn-border-color: #c98a2e;
    --bs-btn-hover-bg: #b3781f;
    --bs-btn-hover-border-color: #b3781f;
    --bs-btn-active-bg: #a86c14;
    --bs-btn-active-border-color: #a86c14;
    --bs-btn-disabled-bg: #c98a2e;
    --bs-btn-disabled-border-color: #c98a2e;
    --bs-btn-color: #fff;
    --bs-btn-hover-color: #fff;
    --bs-btn-active-color: #fff;
    box-shadow: inset 0 1px 0 rgba(255, 235, 200, 0.35);
}

.btn-outline-primary {
    --bs-btn-color: #b3781f;
    --bs-btn-border-color: #c98a2e;
    --bs-btn-hover-bg: #c98a2e;
    --bs-btn-hover-border-color: #c98a2e;
    --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: #a86c14;
    --bs-btn-active-border-color: #a86c14;
    --bs-btn-active-color: #fff;
}

.btn-success {
    --bs-btn-bg: #2f8f46;
    --bs-btn-border-color: #2f8f46;
    --bs-btn-hover-bg: #27793b;
    --bs-btn-hover-border-color: #27793b;
    --bs-btn-active-bg: #216633;
    --bs-btn-active-border-color: #216633;
}

.btn-danger {
    --bs-btn-bg: #a63d3d;
    --bs-btn-border-color: #a63d3d;
    --bs-btn-hover-bg: #8f3232;
    --bs-btn-hover-border-color: #8f3232;
    --bs-btn-active-bg: #7c2a2a;
    --bs-btn-active-border-color: #7c2a2a;
}

.btn-outline-danger {
    --bs-btn-color: #a63d3d;
    --bs-btn-border-color: #a63d3d;
    --bs-btn-hover-bg: #a63d3d;
    --bs-btn-hover-border-color: #a63d3d;
}

.btn {
    border-radius: 12px;
}
.btn-sm {
    border-radius: 10px;
}

.text-primary { color: #b3781f !important; }
.bg-primary { background-color: #c98a2e !important; }
.border-primary { border-color: #c98a2e !important; }

a { color: var(--accent-strong, #b3781f); }

.card {
    border-radius: 16px;
}

.modal-content {
    border-radius: 18px;
    box-shadow: 0 24px 70px rgba(8, 5, 2, 0.35);
}

.form-control, .form-select {
    border-radius: 10px;
}

.form-control:focus, .form-select:focus {
    border-color: #c98a2e;
    box-shadow: 0 0 0 .25rem rgba(201, 138, 46, 0.22);
}

.form-check-input:checked {
    background-color: #c98a2e;
    border-color: #c98a2e;
}
.form-check-input:focus {
    border-color: #c98a2e;
    box-shadow: 0 0 0 .25rem rgba(201, 138, 46, 0.22);
}

/* -------------------------------------------------------------
   4. LOGIN — la pagina era Bootstrap grigio puro: qui diventa
      l'ingresso del locale. Selettori usati SOLO da login.php.
   ------------------------------------------------------------- */
body:has(> .login-card) {
    background: radial-gradient(1100px 700px at 50% -10%, #33261a 0%, #1d1510 48%, #120d09 100%);
}

.login-card {
    background: #fffdf8 !important;
    border: 1px solid rgba(224, 164, 76, 0.35) !important;
    border-radius: 22px !important;
    box-shadow: 0 30px 80px rgba(8, 5, 2, 0.6) !important;
}

.login-card .brand {
    font-family: "Fraunces", Georgia, serif;
    color: #2b2118;
}

.login-card .step-label {
    color: #a86c14 !important;
    letter-spacing: .12em;
}

/* -------------------------------------------------------------
   5. FINITURE — focus visibile, selezione, scrollbar.
   ------------------------------------------------------------- */
:focus-visible {
    outline: 2px solid #c98a2e;
    outline-offset: 2px;
}

::selection {
    background: rgba(224, 164, 76, 0.35);
}

* {
    scrollbar-width: thin;
    scrollbar-color: rgba(160, 128, 78, 0.45) transparent;
}
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-thumb { background: rgba(160, 128, 78, 0.45); border-radius: 8px; }
*::-webkit-scrollbar-track { background: transparent; }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
    }
}