/* ============================================================ */
/* HABIT TRACKER PRO — MASTER DESIGN SYSTEM & THEMES */
/* ============================================================ */

:root {
  /* ============================================================ */
  /* DESIGN TOKENS — SLATE PALETTE (RGB per Tailwind Alpha)     */
  /* ============================================================ */
  /* Tema scuro (Default) */
  --color-slate-50: 248 250 252;
  --color-slate-100: 241 245 249;
  --color-slate-200: 226 232 240;
  --color-slate-300: 203 213 225;
  --color-slate-400: 148 163 184;
  --color-slate-500: 100 116 139;
  --color-slate-600: 71 85 105;
  --color-slate-700: 51 65 85;
  --color-slate-800: 30 41 59;
  --color-slate-900: 15 23 42;
  --color-slate-950: 2 6 23;
}

html.theme-light {
  /* Inversione per Tema Chiaro: Mappa i layer scuri su sfondi chiari */
  --color-slate-950: 234 239 245; /* Sfondo generale */
  --color-slate-900: 255 255 255; /* Superfici (Cards, Navbar) */
  --color-slate-800: 241 245 249; /* Superfici hover (slate-100) */
  --color-slate-700: 226 232 240; /* Superfici active (slate-200) */
  
  --color-slate-600: 148 163 184; /* slate-400 */
  --color-slate-500: 100 116 139; /* slate-500 */
  --color-slate-400: 71 85 105;   /* slate-600 */
  
  --color-slate-300: 15 23 42;    /* Testo primario inversito */
  --color-slate-200: 2 6 23;      /* Testo più scuro */
  --color-slate-100: 0 0 0;       /* Testo forte / Titoli */
  --color-slate-50:  0 0 0;
}

html.theme-oled {
  /* Tema Ultra Scuro (OLED) */
  --color-slate-950: 0 0 0;       /* Sfondo generale OLED Black */
  --color-slate-900: 10 10 10;    /* Superfici */
  --color-slate-800: 23 23 23;    /* Superfici hover */
  --color-slate-700: 38 38 38;    /* Superfici active / Bordi */
  
  --color-slate-600: 71 85 105;
  --color-slate-500: 100 116 139;
  --color-slate-400: 148 163 184;
  
  --color-slate-300: 203 213 225;
  --color-slate-200: 226 232 240;
  --color-slate-100: 241 245 249;
  --color-slate-50:  255 255 255;
}

html, body {
  height: 100%;
  height: 100dvh;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  -webkit-tap-highlight-color: transparent;
}

.font-mono {
  font-family: 'JetBrains Mono', monospace;
}

/* Custom smooth scrollbars */
::-webkit-scrollbar {
  height: 0.375rem;
  width: 0.375rem;
}
::-webkit-scrollbar-track {
  background: rgba(15, 23, 42, 0.6);
}
::-webkit-scrollbar-thumb {
  background: #334155;
  border-radius: 9999px;
}
::-webkit-scrollbar-thumb:hover {
  background: #64748b;
}

/* Pulse glow effects */
.glow-indigo {
  box-shadow: 0 0 25px -5px rgba(99, 102, 241, 0.35);
}
.glow-emerald {
  box-shadow: 0 0 25px -5px rgba(16, 185, 129, 0.35);
}

/* ============================================================ */
/* NOTION STYLE CARDS & TASK TRACKER CLASSES */
/* ============================================================ */
.notion-board-col {
  min-width: 18.125rem;
  max-width: 20rem;
}

@media (max-width: 768px) {
  .notion-board-col {
    min-width: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    margin-bottom: 1rem;
  }
}

.task-card {
  transition: transform 0.15s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.15s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.15s ease;
}
.task-card:hover {
  transform: translateY(-2px);
}

/* ============================================================ */
/* GYM SPREADSHEET & WORKOUT STYLES */
/* ============================================================ */
.sheet-scroll::-webkit-scrollbar {
  height: 0.375rem;
  width: 0.375rem;
}
.sheet-scroll::-webkit-scrollbar-track {
  background: #090d16;
}
.sheet-scroll::-webkit-scrollbar-thumb {
  background: #334155;
  border-radius: 9999px;
}

/* Rest & Session timer widgets */
.timer-pulse {
  animation: timerPulse 2s infinite ease-in-out;
}
@keyframes timerPulse {
  0% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.03); opacity: 0.9; }
  100% { transform: scale(1); opacity: 1; }
}

/* ============================================================ */
/* APP VIEWPORT ZOOM LEVELS (PER-APP CUSTOMIZATION) */
/* ============================================================ */
#app-viewport.font-zoom-xs {
  font-size: 13px !important;
}
#app-viewport.font-zoom-sm {
  font-size: 14.5px !important;
}
#app-viewport.font-zoom-md {
  font-size: 16px !important;
}
#app-viewport.font-zoom-lg {
  font-size: 18px !important;
}
#app-viewport.font-zoom-xl {
  font-size: 20px !important;
}

/* Specific Card Zoom for Task Board */
.zoom-xs .card-title { font-size: 0.75rem !important; }
.zoom-xs .card-meta { font-size: 9px !important; }
.zoom-sm .card-title { font-size: 0.82rem !important; }
.zoom-md .card-title { font-size: 0.95rem !important; }
.zoom-lg .card-title { font-size: 1.05rem !important; }
.zoom-xl .card-title { font-size: 1.2rem !important; }

/* ============================================================ */
/* TASK TRACKER BADGES — MASSIMA LEGGIBILITÀ (SOLO BIANCO O NERO) */
/* ============================================================ */
.badge-priority,
.badge-status {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.18rem 0.55rem;
  font-size: 0.6875rem;
  font-weight: 700;
  border-radius: 9999px;
  line-height: 1.2;
  white-space: nowrap;
}

.badge-dot {
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 9999px;
  flex-shrink: 0;
}

/* Tema Scuro (Dark Mode): Testo BIANCO PURO (#ffffff) */
.badge-priority-alta {
  background-color: #be123c !important;
  color: #ffffff !important;
  border: 1px solid #f43f5e !important;
}
.badge-priority-media {
  background-color: #b45309 !important;
  color: #ffffff !important;
  border: 1px solid #f59e0b !important;
}
.badge-priority-bassa {
  background-color: #047857 !important;
  color: #ffffff !important;
  border: 1px solid #10b981 !important;
}

.badge-status-da-iniziare {
  background-color: rgb(var(--color-slate-700)) !important;
  color: #ffffff !important;
  border: 1px solid rgb(var(--color-slate-600)) !important;
}
.badge-status-in-corso {
  background-color: #1e3a8a !important;
  color: #ffffff !important;
  border: 1px solid #3b82f6 !important;
}
.badge-status-fatto {
  background-color: #065f46 !important;
  color: #ffffff !important;
  border: 1px solid #10b981 !important;
}

.card-today-btn {
  background-color: #881337 !important;
  border: 1px solid #f43f5e !important;
  color: #ffffff !important;
}
.card-today-btn * {
  color: #ffffff !important;
}

/* Tema Chiaro (Light Mode): Testo NERO PURO (#000000) AD ALTO CONTRASTO */
html.theme-light .badge-priority,
html.theme-light .badge-status,
html.theme-light .badge-priority *,
html.theme-light .badge-status * {
  color: #000000 !important;
  font-weight: 700 !important;
}

html.theme-light .badge-priority-alta {
  background-color: #fee2e2 !important;
  border: 1.5px solid #fca5a5 !important;
}
html.theme-light .badge-priority-media {
  background-color: #fef3c7 !important;
  border: 1.5px solid #fcd34d !important;
}
html.theme-light .badge-priority-bassa {
  background-color: #dcfce7 !important;
  border: 1.5px solid #86efac !important;
}

html.theme-light .badge-status-da-iniziare {
  background-color: #fef3c7 !important;
  border: 1.5px solid #fcd34d !important;
}
html.theme-light .badge-status-in-corso {
  background-color: #e0f2fe !important;
  border: 1.5px solid #7dd3fc !important;
}
html.theme-light .badge-status-fatto {
  background-color: #dcfce7 !important;
  border: 1.5px solid #86efac !important;
}

html.theme-light .card-today-btn {
  background-color: #fee2e2 !important;
  border: 1.5px solid #fca5a5 !important;
}

/* Modali Overlay */
.modal-overlay {
  background: rgba(var(--color-slate-950), 0.85);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}