body {
  font-family: system-ui, sans-serif;
  background:#111;
  color:#eee;
  padding:10px;
}
header {
  display:flex;
  align-items:center;
  justify-content:space-between;
}
button { font-size:18px; }
.weekdays, .calendar {
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:6px;
}
.weekdays div {
  text-align:center;
  color:#aaa;
}
.day {
  border:1px solid #333;
  min-height:95px;
  padding:6px;
}
.num {
  font-size:12px;
  color:#aaa;
}
.badge {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:36px;
  height:26px;
  border-radius:6px;
  font-weight:700;
  margin-top:4px;
}
.M { background:#2e7d32; }
.P { background:#1565c0; }
.N { background:#6a1b9a; }
.RC { background:#f9a825; color:#000; }
.RN { background:#ef6c00; }
.ON { background:#c62828; }
.eff {
  opacity:0.9;
}
.icons {
  display:flex;
  gap:4px;
  margin-top:6px;
  font-size:13px;
}
/* ===== FINESTRA GIORNO ===== */

.day-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 999;
}

.day-overlay.hidden {
  display: none;
}

.day-window {
  width: 65%;
  max-width: 900px;
  height: 80%;
  background: #111;
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.6);
  display: flex;
  flex-direction: column;
}

.day-window-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
  border-bottom: 1px solid #333;
}

.day-window-header span {
  font-size: 16px;
  font-weight: 600;
}

.day-window-header button {
  background: none;
  border: none;
  color: #fff;
  font-size: 18px;
  cursor: pointer;
}

.day-window-body {
  flex: 1;
  padding: 16px;
  overflow: auto;
}

/* Responsive: su schermi piccoli diventa quasi full */
@media (max-width: 900px) {
  .day-window {
    width: 95%;
    height: 90%;
  }
}