/* Palette dal logo: nero #060709, bianco #e7e1e5, rosso bandiera #a32624 (solo come accento).
   Un solo tema, scuro: il logo ha lo sfondo nero e deve fondersi con l'interfaccia. */
:root {
  color-scheme: dark;
  --bg:#060709; --card:#101114; --line:#2a2c31; --field:#0b0c0f; --field-line:#42454b;
  --fg:#f2eeee; --muted:#a9a9ad;
  --brand:#a32624; --brand-fg:#ffffff;
  --link:#ffffff; --link-hover:#ff8078;
  --danger:#ff8078; --ok:#6fd08c;
  --chrome:#060709; --chrome-fg:#e7e1e5; --chrome-muted:#b3b3b8; --chrome-line:#2a2c31; --chrome-hover:#15161a;
  --accent:#e0473f; --header-h:4rem;
}
* { box-sizing: border-box; }
body { margin:0; font:16px/1.5 system-ui,sans-serif; background:var(--bg); color:var(--fg); }
a { color:var(--link); text-underline-offset:.15em; }
a:hover { color:var(--link-hover); }
header.top { background:var(--chrome); color:var(--chrome-fg); border-bottom:1px solid var(--chrome-line); padding:0 1rem; position:sticky; top:0; z-index:11;
  height:var(--header-h); display:flex; gap:1rem; align-items:center; }
header.top a { color:var(--chrome-fg); }
header.top .muted { color:var(--chrome-muted); }
header.top .logo { height:3rem; width:auto; display:block; flex:none; }
header.top .logo-link { display:flex; align-items:center; gap:1.1rem; color:var(--chrome-fg); text-decoration:none; min-width:0; }
header.top .logo-link:hover { color:#fff; }
header.top button.link { color:var(--chrome-fg); }
header.top .spacer { flex:1; }
header.top form { display:inline; margin:0; }
.layout { display:flex; align-items:flex-start; }
main { max-width:1000px; margin:1.5rem auto; padding:0 1rem; flex:1; min-width:0; }
.sidebar { width:15rem; flex:none; position:sticky; top:var(--header-h); align-self:flex-start; min-height:calc(100vh - var(--header-h)); max-height:calc(100vh - var(--header-h)); overflow-y:auto;
  background:var(--chrome); border-right:1px solid var(--chrome-line); padding:.75rem 0; display:flex; flex-direction:column; }
.sidebar .nav-item { display:block; padding:.4rem 1.1rem; color:var(--chrome-fg); text-decoration:none; border-left:3px solid transparent; }
.sidebar .nav-item.sub { padding-left:1.9rem; color:var(--chrome-muted); }
.sidebar .nav-item:hover { background:var(--chrome-hover); color:#fff; }
.sidebar .nav-item.attiva { border-left-color:var(--accent); background:var(--chrome-hover); color:#fff; font-weight:600; }
.nav-group summary { cursor:pointer; padding:.5rem 1.1rem; font-size:.78rem; font-weight:700; color:var(--chrome-muted); list-style:none; }
.nav-group summary::-webkit-details-marker { display:none; }
.nav-group summary::before { content:"▸"; display:inline-block; width:1rem; }
.nav-group[open] summary::before { content:"▾"; }
.brand { line-height:1.2; font-size:1.05rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; }
.nav-foot { margin-top:auto; border-top:1px solid var(--chrome-line); padding-top:.5rem; }
.burger { display:none; background:none; color:var(--chrome-fg); border:1px solid var(--chrome-line); padding:.2rem .6rem; font-size:1.2rem; }
@media (max-width:800px) {
  .burger { display:inline-block; }
  .sidebar { display:none; position:fixed; z-index:10; top:var(--header-h); left:0; bottom:0; width:min(18rem,85vw); max-height:none; box-shadow:0 8px 24px rgba(0,0,0,.4); }
  body.nav-open .sidebar { display:flex; }
}
.card { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:1.25rem; margin-bottom:1rem; }
h1 { font-size:1.5rem; margin:.2rem 0 1rem; }
table { width:100%; border-collapse:collapse; }
th, td { text-align:left; padding:.5rem .6rem; border-bottom:1px solid var(--line); vertical-align:top; }
th { color:var(--muted); font-weight:600; font-size:.85rem; }
input, select, textarea { font:inherit; padding:.45rem .6rem; border:1px solid var(--field-line); border-radius:6px; background:var(--field); color:var(--fg); width:100%; max-width:480px; }
.filters input, .filters select { width:auto; }
label { display:block; font-weight:600; margin-top:.8rem; }
.helptext, .muted { color:var(--muted); font-size:.85rem; }
.errorlist { color:var(--danger); padding-left:1rem; margin:.2rem 0; }
button, .btn { font:inherit; background:var(--brand); color:var(--brand-fg); border:2px solid var(--brand); border-radius:6px; padding:.45rem 1rem; cursor:pointer; text-decoration:none; display:inline-block; }
button:hover, .btn:hover { filter:brightness(1.15); }
button.link { background:none; color:var(--link); border:0; padding:0; text-decoration:underline; }
button.link:hover { filter:none; }
.btn.secondary { background:transparent; color:var(--fg); border:2px solid var(--field-line); }
.btn.secondary:hover { border-color:var(--fg); color:#fff; filter:none; }
.btn.danger, button.danger { background:transparent; color:var(--danger); border:2px solid var(--danger); }
.btn.danger:hover, button.danger:hover { background:var(--danger); color:#060709; filter:none; }
.msg { padding:.6rem 1rem; border-radius:6px; margin-bottom:1rem; border:1px solid var(--line); background:var(--card); }
.msg.error { border-color:var(--danger); color:var(--danger); }
.msg.success { border-color:var(--ok); color:var(--ok); }
dl { display:grid; grid-template-columns:max-content 1fr; gap:.3rem 1.2rem; margin:0; }
dt { color:var(--muted); }
dd { margin:0; }
.codes { font:1.1rem/1.8 ui-monospace,monospace; columns:2; background:var(--bg); padding:1rem; border-radius:6px; }
.qr svg { width:220px; height:220px; background:#fff; padding:8px; border-radius:6px; }
.focus-ring, :focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.tag { padding:.1rem .5rem; border-radius:99px; border:1px solid var(--line); font-size:.8rem; }
.narrow { max-width:420px; margin:2rem auto; }
.table-wrap { overflow-x:auto; }
.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:1rem; }
.product { padding:0; overflow:hidden; display:flex; flex-direction:column; }
.product img, .product .noimg { width:100%; aspect-ratio:4/3; object-fit:cover; background:var(--line); display:block; }
.product .body { padding:1rem; }
.price { font-weight:700; font-size:1.1rem; }
.hp { position:absolute; left:-9999px; }
.radio-list ul, ul.radio { list-style:none; padding:0; margin:.2rem 0; }
.radio-list label, ul.radio label { font-weight:400; margin-top:.2rem; display:inline; }
.radio-list input, ul.radio input { width:auto; }
.right { text-align:right; }
.total td { font-weight:700; }

.login-logo { display:block; width:9rem; height:auto; margin:0 auto 1.25rem; }
@media (max-width:800px) { header.top .muted { display:none; } }
.center { text-align:center; }

/* Home: logo grande e sbiadito in sottofondo; sopra tessere, azioni rapide, attività recenti, collegamenti */
.home-bg { position:fixed; top:var(--header-h); left:15rem; right:0; bottom:0; z-index:0; pointer-events:none;
  background:url("img/logo-crop.png") center / contain no-repeat; opacity:.08; margin:2rem; }
.home { position:relative; z-index:1; }
.tiles { display:grid; grid-template-columns:repeat(auto-fit, minmax(175px, 1fr)); gap:1rem; margin-bottom:1rem; }
.tile { display:flex; flex-direction:column; gap:.15rem; padding:1rem 1.25rem; border-radius:8px; text-decoration:none; color:var(--fg);
  background:rgba(16,17,20,.88); border:1px solid var(--line); border-left:4px solid var(--field-line); }
.tile:hover { border-color:var(--fg); color:#fff; }
.tile.attention { border-left-color:var(--accent); }
.tile-label { color:var(--muted); font-size:.88rem; }
.tile-value { font-size:2rem; font-weight:700; line-height:1.2; }
.tile-note { color:var(--muted); font-size:.82rem; }
.quick { display:flex; flex-wrap:wrap; gap:.6rem; margin:0 0 1rem; }
.recent-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(340px, 1fr)); gap:1rem; margin-bottom:1rem; }
.home-card { background:rgba(16,17,20,.88); border:1px solid var(--line); border-radius:8px; padding:1rem 1.25rem; }
.home-card h2 { display:flex; justify-content:space-between; align-items:baseline; margin:0 0 .5rem; font-size:1.05rem; }
.home-card h2 .all { font-size:.8rem; font-weight:400; }
.row { display:flex; justify-content:space-between; gap:1rem; padding:.5rem .25rem; border-top:1px solid var(--line); text-decoration:none; color:var(--fg); border-radius:4px; }
.row:first-of-type { border-top:0; }
a.row:hover { background:var(--chrome-hover); color:#fff; }
.row-main { display:flex; flex-direction:column; min-width:0; }
.row-title { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.row-sub { color:var(--muted); font-size:.82rem; }
.row-side { display:flex; flex-direction:column; align-items:flex-end; gap:.2rem; white-space:nowrap; }
.link-row { display:flex; flex-wrap:wrap; gap:.4rem 1.2rem; padding:.45rem 0; border-top:1px solid var(--line); }
.link-row:first-of-type { border-top:0; }
.link-group { width:8.5rem; color:var(--muted); font-size:.9rem; }
.link-items { display:flex; flex-wrap:wrap; gap:.3rem 1.2rem; }
@media (max-width:800px) { .home-bg { left:0; margin:1rem; opacity:.06; } .recent-grid { grid-template-columns:1fr; } }
header.top a, header.top button.link { white-space:nowrap; flex:none; }
label.field-gap { margin-bottom:.6rem; }
.auth-card h1, .auth-card label { text-align:center; }