/* /Components/Layout/AppLayout.razor.rz.scp.css */
/* Guscio della WebApp: barra laterale sul computer, barra in alto e schede in basso sul telefono. */

.wa-shell[b-l44r0aj3pm] {
  display: flex;
  height: 100dvh;
  overflow: hidden;
}

/* ── Barra laterale (da 768px in su) ────────────────────────── */
.wa-sidebar[b-l44r0aj3pm] {
  width: var(--sidebar-w);
  background: var(--surf);
  border-right: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
}

.wa-sidebar-brand[b-l44r0aj3pm] {
  padding: 1.25rem 1rem 0.5rem;
  font-size: 1.2rem;
  font-weight: 800;
  letter-spacing: -.025em;
  color: var(--text);
}

.wa-sidebar-section[b-l44r0aj3pm] {
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--muted);
  padding: 1rem 1rem 0.3rem;
}

.wa-nav-link[b-l44r0aj3pm] {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.55rem 0.875rem;
  margin: 0 0.5rem;
  border-radius: 6px;
  font-size: 0.875rem;
  color: var(--muted);
  transition: background .12s, color .12s;
  cursor: pointer;
}
.wa-nav-link:hover[b-l44r0aj3pm]  { background: var(--surf2); color: var(--text); }
.wa-nav-link.active[b-l44r0aj3pm] { background: rgba(88,166,255,.12); color: var(--accent); font-weight: 600; }
.wa-nav-icon[b-l44r0aj3pm] { font-size: 1rem; width: 1.25rem; text-align: center; flex-shrink: 0; }

.wa-sidebar-footer[b-l44r0aj3pm] {
  margin-top: auto;
  padding: 0.875rem 1rem;
  border-top: 1px solid var(--border);
  font-size: 0.8rem;
  color: var(--muted);
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.wa-sidebar-footer strong[b-l44r0aj3pm] { color: var(--text); font-weight: 500; }

/* L'icona la cambia `applyThemeIcon` in App.razor, che legge il tema da <html>. */
.theme-toggle-btn[b-l44r0aj3pm] {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 1.1rem;
  padding: 0 .25rem;
}
.wa-sidebar-footer .theme-toggle-btn[b-l44r0aj3pm] { margin-left: auto; }

/* ── Area principale ────────────────────────────────────────── */
.wa-main[b-l44r0aj3pm] {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-width: 0;
}

/* ── Barra in alto (telefono) ───────────────────────────────── */
.wa-topbar[b-l44r0aj3pm] {
  height: var(--topbar-h);
  background: var(--surf);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 1rem;
  flex-shrink: 0;
}
.wa-topbar-brand[b-l44r0aj3pm] { font-weight: 800; font-size: 1.05rem; }
.wa-topbar-user[b-l44r0aj3pm]  {
  font-size: 0.78rem;
  color: var(--muted);
  display: flex;
  align-items: center;
  gap: .5rem;
}

/* ── Contenuto: l'unica parte che scorre ────────────────────── */
.wa-content[b-l44r0aj3pm] {
  flex: 1;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 1.25rem 1rem;
}
@media (min-width: 768px) {
  .wa-content[b-l44r0aj3pm] { padding: 2rem 2.5rem; max-width: 900px; }
}

/* ── Schede in basso (telefono) ─────────────────────────────── */
.wa-tabbar[b-l44r0aj3pm] {
  height: var(--tabbar-h);
  background: var(--surf);
  border-top: 1px solid var(--border);
  display: flex;
  flex-shrink: 0;
  /* Lo spazio della barra gesti dell'iPhone, altrimenti ci finisce sopra. */
  padding-bottom: env(safe-area-inset-bottom);
}
.wa-tab[b-l44r0aj3pm] {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  font-size: 0.6rem;
  color: var(--muted);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: color .12s;
}
.wa-tab .ti[b-l44r0aj3pm] { font-size: 1.2rem; line-height: 1; }
.wa-tab.active[b-l44r0aj3pm] { color: var(--accent); }
/* /Components/Pages/App/EventPages/HabitSections/HabitDashboard.razor.rz.scp.css */
/* Spunta del giorno: barra di avanzamento in cima e un'etichetta per ogni esito. */

.wa-progress-wrap[b-n1o3a5c1uc] {
  background: var(--surf2);
  border-radius: 99px;
  height: 6px;
  overflow: hidden;
}
.wa-progress-bar[b-n1o3a5c1uc] {
  height: 100%;
  background: var(--accent);
  border-radius: 99px;
  transition: width .4s ease;
}

.badge-done[b-n1o3a5c1uc], .badge-skip[b-n1o3a5c1uc], .badge-rest[b-n1o3a5c1uc] {
  border-radius: 6px;
  padding: .25rem .6rem;
  font-size: .75rem;
  font-weight: 600;
  white-space: nowrap;
}
.badge-done[b-n1o3a5c1uc] { background: rgba(63,185,80,.15);   color: var(--green); }
.badge-skip[b-n1o3a5c1uc] { background: rgba(139,148,158,.15); color: var(--muted); }
/* Giorno di riposo: previsto dalla frequenza, quindi non e' ne' fatto ne' saltato. */
.badge-rest[b-n1o3a5c1uc] { background: rgba(139,148,158,.1);  color: var(--surf3); }
/* /Components/Pages/App/EventPages/TimerSection.razor.rz.scp.css */
/* Timer attivi: il tempo che manca e' la cosa da leggere per prima. */

.wa-timer-card[b-4afothmne2] {
  display: flex;
  align-items: center;
  gap: .75rem;
  background: var(--surf);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .75rem .875rem;
  margin-bottom: .5rem;
}
.wa-timer-time[b-4afothmne2] {
  font-size: 1.1rem;
  font-weight: 700;
  /* Cifre di larghezza fissa: il conto alla rovescia non balla a ogni secondo. */
  font-variant-numeric: tabular-nums;
  color: var(--accent);
  min-width: 3.5rem;
}
/* /Components/Pages/App/MealPages/MealRandomizeSection.razor.rz.scp.css */
/* Randomizzatore: una card per categoria, con dentro il pasto estratto. */

.wa-meal-card[b-ok6k44ytvi] {
  background: var(--surf);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 1rem;
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: .5rem;
}
.wa-meal-pick[b-ok6k44ytvi] {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--accent);
  padding: .5rem;
  background: rgba(88,166,255,.08);
  border-radius: 6px;
  text-align: center;
  animation: pop-b-ok6k44ytvi .25s ease;
}
@keyframes pop-b-ok6k44ytvi { from { transform: scale(.9); opacity: 0; } to { transform: scale(1); opacity: 1; } }
/* /Components/Pages/App/SleepPages/SleepLogSection.razor.rz.scp.css */
/* I due pulsanti grossi "sono andato a letto" e "mi sono svegliato": si premono con una mano sola. */

.wa-sleep-btn[b-5hykc4746a] {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .5rem;
  padding: 1.5rem;
  border-radius: 12px;
  background: var(--surf);
  border: 1px solid var(--border);
  cursor: pointer;
  transition: border-color .15s, background .15s;
  text-align: center;
  flex: 1;
}
.wa-sleep-btn:hover[b-5hykc4746a] { border-color: var(--accent); background: rgba(88,166,255,.05); }
.wa-sleep-btn .icon[b-5hykc4746a]  { font-size: 2.5rem; }
.wa-sleep-btn .label[b-5hykc4746a] { font-size: .85rem; font-weight: 600; color: var(--text); }
.wa-sleep-btn .sub[b-5hykc4746a]   { font-size: .75rem; color: var(--muted); }
/* /Components/Pages/Landing.razor.rz.scp.css */
/* Pagina di ingresso: e' l'unica senza il guscio della WebApp, quindi si centra da sola. */

.wa-landing[b-ke18ml074b] {
  min-height: 100dvh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
  background: var(--bg);
}
.wa-landing-box[b-ke18ml074b] {
  width: 100%;
  max-width: 400px;
  text-align: center;
}
.wa-landing-logo[b-ke18ml074b]  { font-size: 3.5rem; margin-bottom: 1rem; }
.wa-landing-title[b-ke18ml074b] { font-size: 2rem; font-weight: 800; letter-spacing: -.03em; margin-bottom: .5rem; }
.wa-landing-sub[b-ke18ml074b]   { color: var(--muted); font-size: .9rem; margin-bottom: 2rem; line-height: 1.7; }
.wa-landing-step[b-ke18ml074b]  {
  display: flex;
  align-items: center;
  gap: .875rem;
  background: var(--surf);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: .75rem 1rem;
  margin-bottom: .5rem;
  font-size: .875rem;
  text-align: left;
}
.wa-step-num[b-ke18ml074b] {
  width: 24px; height: 24px;
  background: rgba(88,166,255,.15);
  color: var(--accent);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: .75rem; font-weight: 700;
  flex-shrink: 0;
}

/* I riferimenti legali servono anche a chi arriva qui da Google: sono richiesti dalla verifica del consenso. */
.wa-landing-foot[b-ke18ml074b] {
  margin-top: 1.5rem;
  font-size: .8rem;
  color: var(--muted);
}
.wa-landing-foot a[b-ke18ml074b] { color: var(--muted); text-decoration: underline; }