
:root{
  --bg:#ffffff; --card:#ffffff; --text:#222222; --muted:#64748b;
  --ok:#22c55e; --issue:#ef4444; --accent:#FF7323; --border:#e5e7eb;
  --blue:#2563eb; --orange:#FF7323; --red:#ef4444; --green:#16a34a;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0; background:var(--bg); color:var(--text); font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; line-height:1.5}
.container{width:100%; max-width:1000px; margin:0 auto; padding:0 16px}

/* Header */
.site-header{background:#fff}
.brand-strip{height:14px; background:var(--accent)}
.logo-bar{background:#fff; border-bottom:1px solid var(--border)}
.logo-bar .container{display:flex; justify-content:center; align-items:center; height:90px}
.brand-logo{width:400px; max-width:100%; height:auto; display:block}

/* Hero */
.hero{padding:28px 0 10px; text-align:center}
.hero h1{font-size:clamp(26px,4vw,38px); margin:0 0 6px}
.hero .lede{margin:0 auto; max-width:720px; color:var(--text)}

/* Accordion */
.accordion{margin:16px 0 48px}
.day{background:var(--card); border:1px solid var(--border); border-radius:12px; margin:12px 0; overflow:hidden}
.day summary{display:flex; align-items:center; gap:12px; padding:14px 16px; cursor:pointer; list-style:none}
.day summary::-webkit-details-marker{display:none}
.day .dot{width:10px; height:10px; border-radius:999px; display:inline-block}
.day.ok .dot{background:var(--ok)}
.day.issue .dot{background:var(--issue)}
.day .date{font-weight:700; color:#0f172a}

/* OK note on right (when no incidents) */
.ok-note{margin-left:auto; background:#f0fdf4; color:#166534; border:1px solid #bbf7d0; padding:6px 10px; border-radius:8px; font-size:12px; font-weight:700}

/* Status panel for incident days */
.status-panel{margin-left:auto; display:flex; flex-direction:column; align-items:flex-end; gap:6px; min-width:210px}
.status-label{text-transform:uppercase; font-size:11px; letter-spacing:.08em; color:var(--muted); font-weight:700}
.severity-meter{display:grid; grid-template-columns:1fr 1fr 1fr; gap:6px; width:100%}
.severity-meter .seg{display:inline-flex; align-items:center; justify-content:center; border:1px solid #cbd5e1; border-radius:9px; padding:6px 8px; font-size:11px; font-weight:700; color:#475569; background:#fff}
.severity-meter.sev-low .low{background:var(--blue); color:#fff; border-color:var(--blue)}
.severity-meter.sev-medium .medium{background:var(--orange); color:#fff; border-color:var(--orange)}
.severity-meter.sev-high .high{background:var(--red); color:#fff; border-color:var(--red)}

.day .content{padding:0 16px 16px; border-top:1px solid var(--border); color:var(--text)}

/* Alternative text for no-incident days */
.no-incident-notes{margin:12px 0 0 18px}
.no-incident-notes li{margin:4px 0}

/* Incident card */
.incident{background:#f8fafc; border:1px solid var(--border); border-left:4px solid #cbd5e1; border-radius:10px; padding:12px 14px; margin-top:12px}
.incident-title{font-weight:700}
.incident-desc{margin:6px 0 8px}
.incident-meta{display:flex; align-items:center; gap:12px; color:#333}
.state-badge{display:inline-flex; align-items:center; justify-content:center; padding:4px 10px; border-radius:8px; font-size:12px; font-weight:700; color:#fff}
.state-badge.in-corso{background:var(--muted)}
.state-badge.chiuso{background:var(--green)}
.timestamp time{font-variant-numeric:tabular-nums}

/* Footer */
.site-footer{border-top:1px solid var(--border); background:#fff}
.footer-wrap{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 0}
.footer-left .marca{height:28px; width:auto; display:block}
.footer-right{color:#444}
.footer-right a{color:#0b62d6; text-decoration:none}
.footer-right a:hover{text-decoration:underline}

@media (max-width:560px){
  .status-panel{min-width:auto}
}
