@import "tailwindcss";

body {
  margin: 0;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: var(--color-slate-900);
  color: var(--color-slate-200);
}

#root {
  min-height: 100svh;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track { background: var(--color-slate-800); }
::-webkit-scrollbar-thumb { background: var(--color-slate-600); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--color-slate-500); }

/* PMS column (Práce mimo směnu) — month-boundary marker.
   Dark mode: matches the original bg-slate-700/30 tint. */
.pms-cell,
.pms-week {
  background-color: color-mix(in oklab, var(--color-slate-700) 30%, transparent);
}
.pms-label { background-color: #283040; }
.pms-label-text { color: var(--color-slate-300); }

/* ============================================================
   LIGHT THEME
   Implemented by inverting the slate color scale via CSS variables.
   Browser only re-evaluates the variable, no rule matching, no !important.
   ============================================================ */
body.light {
  --color-slate-900: #f8fafc;
  --color-slate-800: #ffffff;
  --color-slate-700: #e2e8f0;
  --color-slate-600: #cbd5e1;
  --color-slate-500: #94a3b8;
  --color-slate-400: #64748b;
  --color-slate-300: #334155;
  --color-slate-200: #1e293b;
  --color-slate-100: #0f172a;
  --color-slate-50:  #020617;
}

/* Light-mode specific tweaks where simple inversion isn't enough.
   These selectors win on specificity (.light + .class > Tailwind's single class). */
body.light .bg-slate-800\/50 { background-color: #dbeafe; }   /* weekend cells in person rows */
body.light .bg-slate-700\/30 { background-color: #dbeafe; }   /* weekend cells in info rows */
body.light .schedule-wrapper { background-color: #ffffff; }
body.light .pms-cell,
body.light .pms-week { background-color: #fde68a; }
body.light .pms-week { box-shadow: inset 1px 0 0 #94a3b8, inset -1px 0 0 #94a3b8; }
body.light .pms-label { background-color: #fde68a; }
body.light .pms-label-text { color: #78350f; }