/* ═══════════════════════════════════════════════════════════════════════════
   aspetto-enoha.css — UNICO_ASPETTO_ENOHA_V1 (tappa 4, passo 9)
   ───────────────────────────────────────────────────────────────────────────
   Adattamenti che riportano, nel programma unico, l'aspetto che Enoha ha oggi
   in produzione. Il tema chiaro (theme-light.css) e il conto largo
   (desktop-fill.css) sono presi dalla produzione così come sono; qui stanno
   solo le differenze di markup fra il programma unico e quello di Enoha del
   12/10/2026.

   Caricato SOLO da chi ha interfaccia.tema_legacy = "enoha" nella scheda
   (il compositore lo aggiunge alle pagine, dopo theme-light e desktop-fill).
   Faro e Taverna non lo ricevono. Sparisce con la grafica per tutti (tappa 9).
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Contenitori del conto e del conto separato ─────────────────────────────
   Altrove sono trasparenti (display: contents, main.css); a Enoha sono blocchi
   normali, come nel markup di produzione (sotto i 1024px una colonna sola). */
.cassa-azioni,
.sep-colonna-voci,
.sep-colonna-paga { display: block; background: none; }
/* I pulsanti del conto separato a Enoha oggi non restano fissi in fondo alla
   finestra (nessun sticky nella produzione): qui stanno nel flusso, come oggi.
   Nel programma unico erano sticky con lo sfondo trasparente sopra i campi. */
#modal-separato .modal-btns { position: static; }

/* ── Finestra Cassa: campi di pagamento sopra, «Tutto contanti / Tutto carta»
   sotto (come a Enoha oggi). Nel markup del programma unico i tasti rapidi
   stanno sopra i campi: qui si rimettono nell'ordine di Enoha. */
#modal-cassa .cassa-metodo { display: flex; flex-direction: column; }
#modal-cassa .cassa-metodo > .cassa-metodo-campi { order: 1; }
#modal-cassa .cassa-metodo > .cassa-pag-info,
#modal-cassa .cassa-metodo > .cassa-pag-nota { order: 2; }
#modal-cassa .cassa-metodo > .cassa-metodo-tasti { order: 3; margin: 10px 0 0 !important; }
/* I due tasti rapidi sono più piccoli che nel programma unico (padding e scritta di Enoha). */
#modal-cassa .cassa-metodo-tasti button { padding: 8px !important; font-size: 0.75rem !important; min-height: 44px !important; }

/* ── Struttura della sala e della barra in basso, come a Enoha oggi ──────────
   Nel programma unico (base di Faro) i tavoli si dispongono «a riempimento» e la
   barra in basso si centra con tasti da 220px sui PC; a Enoha i tavoli stanno in
   5 colonne e la barra occupa tutta la larghezza. */
@media (min-width: 1040px) {
  .sala-map-section-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .grid-tavoli { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
}
@media (min-width: 760px) {
  .prods-flat { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@media (min-width: 1024px) {
  .tab-bar { justify-content: normal; }
  .tab-bar .tab-btn { max-width: none; }
}
.cal-grid { max-width: none; margin-left: 0; margin-right: 0; }
/* Il filtro «Jolly» (tavoli fuori dalle sale) si vede solo se ce n'è almeno uno. */
.sala-filter-btn[data-sala-filter="unassigned"]:has(.sala-filter-count[aria-label$=" su 0"]) { display: none; }

/* ── Caratteri e riquadri di Enoha oggi ──────────────────────────────────────
   Il programma unico usa il carattere senza grazie anche dove il token «display»
   era il corsivo con le grazie (nomi dei tavoli, titoli): a Enoha restano come oggi. */
body.faro-pro-ui { --font-display: "Cormorant Garamond", "EB Garamond", Georgia, serif; }
/* Dallo <style> in testa a index.html di Enoha (tolto dalla pulizia di ottobre): il peso dei
   titoli dei riquadri. Il resto di quelle regole in produzione era già battuto da faro-pro.css. */
.hub-card, .hub-btn { font-weight: var(--fw-semibold) !important; }

/* ── Finestra Cassa a una colonna (tablet in verticale, telefono): l'ordine di Enoha oggi
   è totale, sconto, metodo di pagamento, azioni. Nel programma unico il metodo di
   pagamento viene prima dello sconto: qui si rimettono in ordine come a Enoha. Da 1024px
   in su l'ordine lo decide la griglia di desktop-fill.css. */
@media (max-width: 1023px) {
  #modal-cassa .modal-box { display: flex; flex-direction: column; }
  /* Nella colonna i riquadri non si stringono: con la finestra all'altezza massima (telefono)
     il titolo «Cassa Tavolo …» (overflow: hidden) si schiacciava a pochi pixel, tagliato. */
  #modal-cassa .modal-box > * { flex-shrink: 0; }
  #modal-cassa #cassa-sconto-touch { order: 1; }
  #modal-cassa .cassa-metodo { order: 2; }
  #modal-cassa .cassa-azioni { order: 3; }
}

/* ── Sale dinamiche (tappa 5, E35): numerazione della sala nuova e mappa vuota ──
   Nel tema chiaro l'oro del tema scuro non si legge sul bianco: stessi colori della
   nota «disponibili» di theme-light.css. */
:root[data-theme="light"] .sale-numbering-field { border-color: #d5deea; background: #f5f8fd; }
:root[data-theme="light"] .sale-numbering-field legend,
:root[data-theme="light"] .sale-numbering-preview { color: #34435c; }
:root[data-theme="light"] .sale-numbering-preview.is-error { color: #b91c1c; }
:root[data-theme="light"] .sale-numbering-choice:hover { background: #eef3fb; }
:root[data-theme="light"] .sale-map-empty { border-color: #d5deea; }

/* ── Ordinato del tavolo nel tema chiaro (UNICO_ORDINATO_CHIARO_V1, 20/10/2026) ──
   ordini.js disegna l'elenco «Ordinato» con le classi .sent-* di main.css, pensate per
   lo scuro (oro, rosa e verde chiari). theme-light.css le correggeva quando erano stili
   in linea (selettori [style*="F0D79C"], [style*="#60a070"]…), che non trovano più nulla:
   la riga «🔒 automatico · 2 × €2.00» del coperto era oro chiaro sul bianco (1,41:1).
   Stessi colori di quelle regole di theme-light.css. Il blocco «In attesa di uscire»
   (UNICO_PORTATE_IN_ATTESA_V1, 25/10/2026) usa solo token del tema: qui serve solo il
   rosso di ANNULLA (.sent-attesa-btn--annulla), come «annulla tutti». */
:root[data-theme="light"] .sent-servizio-lock { border-color: #8a5a12; color: #8a5a12; }
:root[data-theme="light"] .sent-prezzo-btn { border-color: #b45309; color: #b45309; }
:root[data-theme="light"] .sent-nota { color: #a3184a; }
:root[data-theme="light"] .sent-add-badge { color: #157a3f; }
:root[data-theme="light"] .sent-void-all,
:root[data-theme="light"] .sent-attesa-btn--annulla,
:root[data-theme="light"] .sent-errore { border-color: #b91c1c; color: #b91c1c; }
