/* ============ Dashboard ============ */
.db-lock{display:grid;justify-items:center;gap:10px;padding:40px 20px;text-align:center;border:1px dashed var(--line);border-radius:22px;color:var(--muted)}
.db-lock b{color:var(--ink);font-size:1.15rem}
.db-lock .cta-p{display:inline-flex;align-items:center;min-height:48px;padding:0 22px;border-radius:14px;font:700 1rem var(--body);text-decoration:none;margin-top:6px}
#dbBody{display:grid;gap:14px}
#dbBody[hidden]{display:none}

/* numeri principali */
.db-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.db-kpi{display:grid;gap:4px;align-content:start;padding:16px;border-radius:20px;border:1px solid var(--cl);background:linear-gradient(160deg,var(--c1),var(--c2));min-width:0}
.db-kl{display:flex;align-items:center;gap:8px;color:var(--muted);font:600 .82rem var(--body)}
.db-kpi b{font:800 clamp(1.8rem,4vw,2.4rem)/1.05 var(--display);color:var(--ink);letter-spacing:-.02em}
.db-ks{color:var(--muted);font-size:.8rem;line-height:1.35;overflow-wrap:anywhere}
.db-kpi.live{border-color:color-mix(in srgb,var(--ok) 45%,var(--cl))}
.db-dot{width:9px;height:9px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 0 color-mix(in srgb,var(--ok) 60%,transparent)}
@media (prefers-reduced-motion:no-preference){.db-dot{animation:dbPulse 1.8s ease-out infinite}}
@keyframes dbPulse{70%{box-shadow:0 0 0 8px transparent}}

/* schede */
.db-card{padding:16px 16px 14px;border-radius:20px;border:1px solid var(--cl);background:linear-gradient(160deg,var(--c1),var(--c2));min-width:0}
.db-ch{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:4px 12px;margin-bottom:12px}
.db-ch h3{margin:0;font:700 1.05rem var(--display);color:var(--ink)}
.db-ch .note{font-size:.8rem}
.db-two{display:grid;grid-template-columns:1fr 1fr;gap:14px}

/* grafico a barre: una sola serie, un solo colore; oggi pieno, gli altri giorni più tenui */
.db-chart svg{display:block;width:100%;height:auto;overflow:visible}
.db-grid{stroke:var(--line);stroke-width:1}
.db-ax{fill:var(--muted);font:500 11px var(--body)}
.db-today{fill:var(--ink);font-weight:700}
.db-val{fill:var(--ink);font:700 12px var(--body)}
.db-bar path{fill:color-mix(in srgb,var(--lane) 62%,transparent);transition:fill .15s}
.db-bar.today path,.db-bar.on path,.db-bar:hover path{fill:var(--lane)}
.db-zero{stroke:var(--line);stroke-width:2;stroke-linecap:round}
.db-hit{fill:transparent;cursor:pointer}
.db-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.db-tip{position:fixed;z-index:50;display:grid;gap:2px;padding:10px 12px;border-radius:12px;background:var(--surface);border:1px solid var(--cl);box-shadow:0 14px 30px -12px rgba(0,0,0,.6);color:var(--muted);font-size:.82rem;pointer-events:none;white-space:nowrap}
.db-tip b{color:var(--ink);font-size:.88rem}
.db-tip i{display:inline-block;width:10px;height:10px;margin-right:6px;border-radius:3px;background:var(--lane);vertical-align:-1px}

/* barre orizzontali */
.db-hb{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.db-hb li{display:grid;grid-template-columns:minmax(90px,1fr) 2fr auto 38px;align-items:center;gap:10px;font-size:.88rem}
.db-hn{color:var(--ink);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.db-ht{height:10px;border-radius:99px;background:var(--line);overflow:hidden}
.db-ht i{display:block;height:100%;border-radius:99px;background:var(--lane);min-width:4px}
.db-hb b{color:var(--ink);font-variant-numeric:tabular-nums}
.db-hb small{color:var(--muted);text-align:right;font-variant-numeric:tabular-nums}
.db-none{padding:18px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:14px;font-size:.9rem}

/* da fare */
.db-todo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.db-td{display:grid;gap:2px;padding:12px;border-radius:14px;background:var(--tint);color:var(--ink);text-decoration:none;transition:transform .15s,background .2s}
.db-td b{font:800 1.5rem var(--display)}
.db-td span{color:var(--muted);font-size:.8rem;line-height:1.3}
.db-td.warn{background:color-mix(in srgb,var(--warn) 16%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--warn) 55%,transparent)}
.db-td.warn b{color:var(--warn)}
.db-td:hover{transform:translateY(-2px)}
.db-foot{margin:4px 0 0;color:var(--muted);font-size:.8rem;line-height:1.5}

/* pulsante nel profilo */
.dash-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border-radius:14px;background:var(--lane);color:var(--lane-ink);font:700 1rem var(--body);text-decoration:none;box-shadow:0 10px 24px -12px var(--glow)}
.dash-link[hidden]{display:none}
.dash-link svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}

@media (max-width:860px){.db-kpis{grid-template-columns:1fr 1fr}.db-two{grid-template-columns:1fr}}
@media (max-width:420px){.db-kpi{padding:14px}.db-todo{grid-template-columns:1fr 1fr}.db-hb li{grid-template-columns:minmax(70px,1fr) 1.4fr auto 34px;gap:8px}}
/* colonne fisse: le barre partono tutte dallo stesso punto */
.db-hb li{grid-template-columns:minmax(0,110px) 1fr 48px 38px!important}
.db-hb b{text-align:right}
@media (max-width:420px){.db-hb li{grid-template-columns:minmax(0,92px) 1fr 42px 34px!important}}
