/* Negozio — PANNELLO DI CONTROLLO (/admin, /ordini).
   Foglio autonomo: il pannello non carica il CSS del sito pubblico. Stile Windows 11 / Fluent, sobrio,
   mobile first (il titolare lo usa dal telefono): barra di navigazione scorrevole in alto sul telefono,
   colonna a sinistra da 960 px. Target touch minimi 44 px. Contiene anche le classi usate dalle sezioni
   ereditate dal motore (preventivi, newsletter: .btn, .field, .dga-table, .gr-chip, .summary-row…). */

:root {
  --a-bg: #f3f3f3;
  --a-card: #ffffff;
  --a-line: #e1e1e1;
  --a-line-2: #ececec;
  --a-text: #1b1b1b;
  --a-soft: #5c5c5c;
  --a-mute: #696969;   /* 4,9:1 anche sul fondo #f3f3f3 */
  --a-accent: #0f6cbd;
  --a-accent-2: #115ea3;
  --a-accent-bg: #ebf3fc;
  --a-ok: #0e700e;
  --a-ok-bg: #e7f4e4;
  --a-warn: #8a5300;
  --a-warn-bg: #fff4ce;
  --a-err: #b10e1c;
  --a-err-bg: #fde7e9;
  --a-side: #172033;   /* blu notte del marchio Negozio */
  --a-side-2: #223054;
  --a-side-text: #c9d1e0;
  --a-brand: #d71920;
  --a-radius: 8px;
  --a-shadow: 0 1px 2px rgba(0,0,0,.06), 0 2px 6px rgba(0,0,0,.04);
  --a-font: "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; scrollbar-color: #b9bfca transparent; }
.adm ::selection { background: #cfe4fa; color: var(--a-text); }
.adm input, .adm textarea { caret-color: var(--a-accent); }
.adm ::-webkit-scrollbar { width: 10px; height: 10px; }
.adm ::-webkit-scrollbar-thumb { background: #c3c8d1; border-radius: 10px; border: 2px solid var(--a-bg); }
.adm ::-webkit-scrollbar-track { background: transparent; }
body.adm { margin: 0; background: var(--a-bg); color: var(--a-text); font: 15px/1.5 var(--a-font); }
.adm a { color: var(--a-accent); text-decoration: none; }
.adm a:hover { text-decoration: underline; }
.adm h1 { font-size: clamp(21px, 4.5vw, 26px); font-weight: 600; line-height: 1.25; margin: 0 0 14px; }
.adm h2 { font-size: 17px; font-weight: 600; margin: 26px 0 10px; }
.adm h3 { font-size: 15px; font-weight: 600; margin: 0 0 10px; }
.adm code { font: 12.5px/1.4 Consolas, "Cascadia Mono", monospace; background: #f0f0f0; padding: 1px 5px; border-radius: 4px; word-break: break-all; }
.adm :focus-visible { outline: 2px solid var(--a-accent); outline-offset: 2px; }
.adm .sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.adm .muted { color: var(--a-mute); }
.adm .num { font-variant-numeric: tabular-nums; }

/* ---------- impaginazione ---------- */
.adm-shell { min-height: 100vh; display: flex; flex-direction: column; }
.adm-side { background: var(--a-side); color: #fff; position: sticky; top: 0; z-index: 30; }
.adm-brand { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 14px; }
.adm-brand b { font-size: 16px; font-weight: 700; letter-spacing: .01em; color: #fff; }
.adm-brand b span { color: #9cc8ff; font-weight: 600; }
.adm-brand__logo { display: flex; align-items: center; gap: 10px; color: inherit; }
.adm-brand__logo:hover { text-decoration: none; }
.adm-brand__tile { display: grid; place-items: center; width: 32px; height: 32px; flex-shrink: 0; border-radius: 7px; background: var(--a-brand); color: #fff; font: 800 13px/1 var(--a-font); letter-spacing: .02em; }
.adm-brand small { display: block; font-size: 11px; color: #a9b3c6; font-weight: 400; }
.adm-brand__azioni { display: flex; gap: 6px; }
.adm-nav { display: flex; overflow-x: auto; scrollbar-width: none; padding: 0 6px 6px; gap: 2px; }
.adm-nav::-webkit-scrollbar { display: none; }
.adm-nav a, .adm-nav button { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 12px; white-space: nowrap; color: var(--a-side-text); border-radius: 6px; font: 500 14px/1 var(--a-font); background: none; border: 0; cursor: pointer; flex-shrink: 0; }
.adm-nav a:hover, .adm-nav button:hover { background: rgba(255,255,255,.07); color: #fff; text-decoration: none; }
.adm-nav a[aria-current="page"] { background: var(--a-side-2); color: #fff; box-shadow: inset 0 -3px 0 #9cc8ff; }
.adm-nav svg { width: 18px; height: 18px; flex-shrink: 0; opacity: .9; }
.adm .adm-ext { width: 13px; height: 13px; flex-shrink: 0; margin-left: 4px; vertical-align: -1px; opacity: .7; }
.adm-nav .adm-ext { margin-left: auto; opacity: .55; }
.adm-nav a, .adm .adm-btn, .adm .btn { position: relative; }
.adm-nav :focus-visible { outline-color: #9cc8ff; outline-offset: -2px; }
.adm-nav .adm-nav__sep { display: none; }
.adm-nav .adm-badge { margin-left: 2px; }
.adm-main { flex: 1; width: 100%; max-width: 1180px; margin: 0 auto; padding: 16px 14px 90px; }
.adm-foot { font-size: 12px; color: var(--a-mute); text-align: center; padding: 18px 10px 30px; }
.adm-foot a { color: var(--a-soft); }
@media (min-width: 960px) {
  .adm-shell { flex-direction: row; }
  .adm-side { width: 252px; height: 100vh; flex-shrink: 0; display: flex; flex-direction: column; overflow-y: auto; }
  .adm-brand { padding: 18px 18px 14px; }
  .adm-nav { flex-direction: column; overflow: visible; padding: 0 8px 12px; }
  .adm-nav a, .adm-nav button { min-height: 40px; width: 100%; text-align: left; }
  .adm-nav a[aria-current="page"] { box-shadow: inset 3px 0 0 #9cc8ff; }
  .adm-nav .adm-nav__sep { display: block; height: 1px; background: rgba(255,255,255,.1); margin: 8px 6px; }
  .adm-nav .adm-nav__titolo { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: #8f9bb3; padding: 4px 12px 2px; }
  .adm-main { padding: 26px 30px 60px; }
}
.adm-nav .adm-nav__titolo { display: none; }

/* ---------- elementi ---------- */
.adm-card { background: var(--a-card); border: 1px solid var(--a-line); border-radius: var(--a-radius); box-shadow: var(--a-shadow); padding: 16px; }
.adm-card + .adm-card { margin-top: 14px; }
.adm-grid > .adm-card + .adm-card { margin-top: 0; }   /* nelle griglie lo spazio lo dà il gap: schede allineate in alto */
.adm-card--flat { box-shadow: none; }
.adm-grid { display: grid; gap: 14px; }
@media (min-width: 900px) { .adm-grid--2 { grid-template-columns: 1fr 1fr; } .adm-grid--side { grid-template-columns: minmax(0, 1fr) 340px; align-items: start; } }
.adm-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
.adm-head h1 { margin: 0; }
.adm-msg { padding: 12px 14px; border-radius: var(--a-radius); border: 1px solid #b7dfb1; background: var(--a-ok-bg); color: var(--a-ok); margin: 0 0 14px; font-size: 14px; }
.adm-msg--warn { background: var(--a-warn-bg); border-color: #f2d48b; color: var(--a-warn); }
.adm-msg--err { background: var(--a-err-bg); border-color: #f1b8bd; color: var(--a-err); }
.adm-empty { text-align: center; padding: 34px 16px; color: var(--a-soft); }
.adm-empty b { display: block; font-size: 16px; color: var(--a-text); margin-bottom: 4px; }

/* KPI */
.adm-kpi { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0 0 18px; }
@media (min-width: 720px) { .adm-kpi { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); } }
.adm-kpi > a, .adm-kpi > div { display: block; padding: 14px; background: var(--a-card); border: 1px solid var(--a-line); border-radius: var(--a-radius); color: inherit; box-shadow: var(--a-shadow); }
.adm-kpi > a:hover { border-color: var(--a-accent); text-decoration: none; }
.adm-kpi b { display: block; font-size: clamp(20px, 5vw, 26px); font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.2; }
.adm-kpi span { font-size: 12.5px; color: var(--a-soft); }
.adm-kpi b span { font-size: inherit; color: inherit; }
.adm-kpi .is-alert { border-color: #f2d48b; background: var(--a-warn-bg); }
.adm-kpi .is-alert b { color: var(--a-warn); }
.adm-live { display: inline-block; width: 9px; height: 9px; margin-right: 8px; border-radius: 50%; background: #13a10e; vertical-align: middle; animation: admLive 1.8s ease-out infinite; }
@keyframes admLive { 0% { box-shadow: 0 0 0 0 rgba(19,161,14,.55); } 100% { box-shadow: 0 0 0 10px rgba(19,161,14,0); } }
@media (prefers-reduced-motion: reduce) { .adm-live { animation: none; } }

/* pulsanti (anche quelli delle sezioni ereditate) */
.adm .btn, .adm .adm-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 0 16px; border-radius: 6px; border: 1px solid var(--a-accent); background: var(--a-accent); color: #fff; font: 600 14px/1.2 var(--a-font); cursor: pointer; text-decoration: none; text-align: center; }
.adm .btn:hover, .adm .adm-btn:hover { background: var(--a-accent-2); text-decoration: none; }
.adm .btn--outline, .adm .adm-btn--sec { background: #fff; color: var(--a-text); border-color: #d1d1d1; }
.adm .btn--outline:hover, .adm .adm-btn--sec:hover { background: #f5f5f5; }
.adm .btn--block { display: flex; width: 100%; }
.adm .btn--lg { min-height: 52px; font-size: 16px; }
.adm .btn--wa, .adm .adm-btn--wa { background: #107c10; border-color: #107c10; color: #fff; }
.adm .btn--wa:hover, .adm .adm-btn--wa:hover { background: #0b5a0b; }
.adm .adm-btn--danger { background: #fff; color: var(--a-err); border-color: #f1b8bd; }
.adm .adm-btn--danger:hover { background: var(--a-err-bg); }
.adm .adm-btn--sm, .adm .btn--sm { min-height: 36px; padding: 0 12px; font-size: 13px; }
.adm button:disabled { opacity: .55; cursor: not-allowed; }
.adm .linkbtn { background: none; border: 0; color: var(--a-accent); cursor: pointer; font: inherit; padding: 6px 4px; min-height: 36px; }
.adm-azioni { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.adm-azioni form { margin: 0; }

/* moduli */
.adm .field { margin-bottom: 12px; }
.adm .field label, .adm-label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 4px; color: var(--a-soft); }
.adm input[type=text], .adm input[type=email], .adm input[type=tel], .adm input[type=url], .adm input[type=number], .adm input[type=date], .adm input[type=search], .adm input[type=password], .adm input:not([type]), .adm select, .adm textarea {
  width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid #c8c8c8; border-bottom-color: #8a8a8a; border-radius: 6px; background: #fff; color: var(--a-text); font: 15px/1.4 var(--a-font); }
.adm textarea { min-height: 80px; resize: vertical; }
.adm input:focus, .adm select:focus, .adm textarea:focus { outline: none; border-color: var(--a-accent); box-shadow: inset 0 -2px 0 var(--a-accent); }
.adm input[type=checkbox], .adm input[type=radio] { width: 18px; height: 18px; accent-color: var(--a-accent); vertical-align: middle; }
.adm-check { display: flex; align-items: center; gap: 8px; min-height: 40px; font-size: 14px; cursor: pointer; }
.adm-grid2, .adm .adm-grid2 { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 0 14px; }
.adm .cat-search, .adm-cerca { display: flex; gap: 8px; margin: 0 0 14px; }
.adm .cat-search input, .adm-cerca input { flex: 1; min-width: 0; }

/* schede filtro (stile Shopify) */
.adm-tabs { display: flex; gap: 2px; overflow-x: auto; scrollbar-width: none; border-bottom: 1px solid var(--a-line); margin: 0 0 14px; }
.adm-tabs::-webkit-scrollbar { display: none; }
.adm-tabs a { display: flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 12px; white-space: nowrap; color: var(--a-soft); font-weight: 600; font-size: 14px; border-bottom: 3px solid transparent; margin-bottom: -1px; }
.adm-tabs a:hover { color: var(--a-text); text-decoration: none; }
.adm-tabs a[aria-current="page"] { color: var(--a-text); border-bottom-color: var(--a-accent); }
.adm-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; font-size: 11.5px; font-weight: 700; background: #e6e6e6; color: var(--a-soft); font-variant-numeric: tabular-nums; }
.adm-badge--hot { background: #c42b1c; color: #fff; }
.adm .gr-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.adm .gr-chip { display: inline-flex; align-items: center; min-height: 36px; padding: 0 12px; border-radius: 18px; border: 1px solid #d1d1d1; background: #fff; color: var(--a-text); font-size: 13px; cursor: pointer; }
.adm .gr-chip.is-active { background: var(--a-accent); border-color: var(--a-accent); color: #fff; }

/* stati */
.adm-stato { display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px; border-radius: 12px; font-size: 12px; font-weight: 600; white-space: nowrap; line-height: 20px; }
.adm-stato::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.adm-stato--ok { background: var(--a-ok-bg); color: var(--a-ok); }
.adm-stato--attesa { background: var(--a-warn-bg); color: var(--a-warn); }
.adm-stato--allerta { background: #c42b1c; color: #fff; }
.adm-stato--allerta::before { background: #fff; }
.adm-stato--lavoro { background: var(--a-accent-bg); color: var(--a-accent-2); }
.adm-stato--via { background: #242424; color: #fff; }
.adm-stato--via::before { background: #ffd34d; }
.adm-stato--spento { background: #eee; color: var(--a-mute); }
.adm-nota { display: block; margin-top: 6px; padding: 3px 8px; border-radius: 4px; background: #fff7d6; font-size: 12.5px; color: var(--a-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* lista ordini: righe-scheda sul telefono, tabella da 900 px */
.adm-lista { list-style: none; margin: 0; padding: 0; background: var(--a-card); border: 1px solid var(--a-line); border-radius: var(--a-radius); overflow: hidden; box-shadow: var(--a-shadow); }
.adm-lista > li { display: flex; align-items: flex-start; border-top: 1px solid var(--a-line-2); }
.adm-lista > li:first-child { border-top: 0; }
.adm-lista > li.is-hot { background: #fffaf2; }
.adm-sel { display: flex; align-items: center; justify-content: center; min-width: 44px; min-height: 52px; cursor: pointer; }
.adm .adm-riga { flex: 1; min-width: 0; display: block; padding: 10px 14px 12px 0; color: inherit; }
.adm .adm-riga:hover { text-decoration: none; background: #fafafa; }
.adm-riga__top, .adm-riga__mid { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; }
.adm-riga__num { font: 700 13.5px/1.3 Consolas, "Cascadia Mono", monospace; }
.adm-riga__tot { font-weight: 700; font-variant-numeric: tabular-nums; }
.adm-riga__chi { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.adm-riga__quando { font-size: 12px; color: var(--a-mute); white-space: nowrap; }
.adm-riga__badge { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 6px; font-size: 12px; color: var(--a-mute); }
.adm-tab { width: 100%; border-collapse: collapse; font-size: 14px; }
.adm-tab th { text-align: left; font-size: 12px; font-weight: 600; color: var(--a-soft); background: #fafafa; padding: 8px 10px; border-bottom: 1px solid var(--a-line); white-space: nowrap; }
.adm-tab td { padding: 10px; border-top: 1px solid var(--a-line-2); vertical-align: top; }
.adm-tab tr.is-link { cursor: pointer; }
.adm-tab tr.is-link:hover td { background: #fafafa; }
.adm-tab .r { text-align: right; }
.adm-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; background: var(--a-card); border: 1px solid var(--a-line); border-radius: var(--a-radius); box-shadow: var(--a-shadow); }
.adm-solo-desk { display: none; }
@media (min-width: 900px) { .adm-solo-tel { display: none; } .adm-solo-desk { display: block; } }
.adm-barra-stampa { position: sticky; bottom: 0; z-index: 20; display: none; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-top: 10px; padding: 10px 12px; background: #242424; color: #fff; border-radius: var(--a-radius); }
.adm-barra-stampa.is-on { display: flex; }


/* dettaglio ordine */
.adm-dl { display: grid; grid-template-columns: auto 1fr; gap: 4px 14px; margin: 0; font-size: 14px; }
.adm-dl dt { color: var(--a-mute); }
.adm-dl dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; }
.adm-dl .tot { font-weight: 700; font-size: 16px; border-top: 1px solid var(--a-line); padding-top: 6px; }
.adm-righe { list-style: none; margin: 0; padding: 0; }
.adm-righe li { padding: 10px 0; border-top: 1px solid var(--a-line-2); display: flex; justify-content: space-between; gap: 12px; }
.adm-righe li:first-child { border-top: 0; }
.adm-righe small { display: block; color: var(--a-mute); }
.adm-box { border-radius: var(--a-radius); padding: 12px 14px; margin: 0 0 14px; font-size: 14px; border: 1px solid var(--a-line); background: #fff; }
.adm-box--ok { background: var(--a-ok-bg); border-color: #b7dfb1; }
.adm-box--warn { background: var(--a-warn-bg); border-color: #f2d48b; }
.adm-box--err { background: var(--a-err-bg); border-color: #f1b8bd; }
.adm-box--info { background: var(--a-accent-bg); border-color: #b4d6fa; }
.adm-storico { list-style: none; padding: 0; margin: 0; font-size: 13px; display: grid; gap: 6px; }
.adm-storico li { padding-bottom: 6px; border-bottom: 1px solid var(--a-line-2); }
.adm details.adm-card > summary { cursor: pointer; font-weight: 600; min-height: 28px; }
.adm details.adm-card[open] > summary { margin-bottom: 12px; }
.adm-progress { height: 8px; border-radius: 4px; background: #e6e6e6; overflow: hidden; margin-top: 8px; }
.adm-progress > i { display: block; height: 100%; width: 0; background: var(--a-accent); transition: width .2s; }

/* tabelle ereditate (preventivi, newsletter, archivio) */
.adm .dga-table { width: 100%; border-collapse: collapse; background: #fff; font-size: 13.5px; }
.adm .dga-table th, .adm .dga-table td { padding: 8px 10px; border-bottom: 1px solid var(--a-line-2); text-align: center; vertical-align: top; }
.adm .dga-table th { background: #fafafa; font-size: 12px; color: var(--a-soft); font-weight: 600; }
.adm .ig__scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--a-line); border-radius: var(--a-radius); background: #fff; }
.adm .cart-blocco { padding: 12px 14px; border-radius: var(--a-radius); border: 1px solid #f2d48b; background: var(--a-warn-bg); color: var(--a-warn); margin: 0 0 14px; }
.adm .checkout { display: grid; gap: 18px; }
@media (min-width: 900px) { .adm .checkout { grid-template-columns: minmax(0, 1fr) 340px; align-items: start; } }
.adm .summary, .adm .summary-box { background: #fff; border: 1px solid var(--a-line); border-radius: var(--a-radius); padding: 16px; }
.adm .summary-row { display: flex; justify-content: space-between; gap: 10px; padding: 4px 0; font-size: 14px; }
.adm .summary-row.total { font-weight: 700; font-size: 16px; border-top: 1px solid var(--a-line); margin-top: 6px; padding-top: 8px; }
.adm .product__cat { font-size: 13px; margin: 0 0 8px; }
.adm .pagination { display: flex; flex-wrap: wrap; gap: 6px; margin: 14px 0; }
.adm .pagination a, .adm .pagination span { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; min-height: 40px; border: 1px solid var(--a-line); border-radius: 6px; background: #fff; }

/* login */
.adm-login { min-height: 100vh; display: grid; place-items: center; padding: 20px; }
.adm-login form { width: 100%; max-width: 380px; background: #fff; border: 1px solid var(--a-line); border-radius: 12px; padding: 28px 24px; box-shadow: 0 8px 30px rgba(0,0,0,.08); }
.adm-login h1 { font-size: 22px; }

/* allarme nuovo ordine */
#csAlarm { position: fixed; inset: 0; z-index: 999; display: none; place-items: center; background: rgba(196,43,28,.94); color: #fff; text-align: center; padding: 20px; }
#csAlarm.is-on { display: grid; animation: admBlink 1s steps(2) infinite; }
@keyframes admBlink { 50% { background: rgba(120,20,12,.96); } }
@media (prefers-reduced-motion: reduce) { #csAlarm.is-on { animation: none; } }
.cs-alarm__t { font-size: clamp(28px, 8vw, 48px); font-weight: 800; letter-spacing: .04em; }
.cs-alarm__n { font-size: 18px; margin: 10px 0 24px; }
.cs-alarm__h { font-size: 13px; opacity: .85; margin-top: 14px; }
.adm #csAlarm .btn { background: #fff; color: #c42b1c; border-color: #fff; margin: 4px; }

/* stampa */
@media print { .adm-side, .adm-foot, .adm-noprint { display: none !important; } .adm-main { padding: 0; } body.adm { background: #fff; } }
