@charset "UTF-8";

:root {
  --brand-700: #3730a3;
  --brand-600: #4f46e5;
  --brand-500: #6366f1;
  --brand-400: #818cf8;
  --brand-100: #e0e7ff;
  --brand-50: #eef2ff;
  --accent-600: #7c3aed;
  --ink-900: #0f172a;
  --ink-700: #334155;
  --ink-500: #64748b;
  --ink-300: #cbd5e1;
  --line: #e2e8f0;
  --card-bg: #ffffff;
  --zebra: #f8fafc;
  --hover: #f5f3ff;
  --empty: #e2e8f0;
  --radius-lg: 16px;
  --radius-md: 10px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  padding: 28px 24px;
  background:
    radial-gradient(1100px 460px at 50% -160px, #eef2ff 0%, transparent 62%),
    #f1f5f9;
  color: var(--ink-900);
  font-family: "Segoe UI", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
    Arial, Helvetica, sans-serif;
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
}

a {
  color: var(--brand-600);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

/* ============ institution info + table of contents ============ */

body > table:not([class]) {
  margin: 0 auto 18px;
  border-collapse: collapse;
  background: var(--card-bg);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  box-shadow: 0 1px 2px rgb(15 23 42 / 0.05);
  font-size: 13px;
}

body > table:not([class]) th {
  padding: 7px 16px;
  color: var(--ink-500);
  text-align: left;
  font-weight: 600;
  border: 0;
}

body > table:not([class]) td {
  padding: 7px 16px;
  border: 0;
  color: var(--ink-700);
}

body > table:not([class]) td a {
  font-weight: 500;
}

/* table of contents: simple clean bullet list */
body > p:has(strong) {
  margin: 22px 0 6px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--ink-500);
  text-transform: uppercase;
}

ul {
  margin: 0 auto 22px;
  max-width: 860px;
  padding-left: 28px;
  list-style: square;
  text-align: left;
  color: var(--ink-700);
  line-height: 1.7;
}

ul li {
  margin: 3px 0;
}

ul li a {
  color: var(--brand-600);
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-color: var(--brand-100);
}

ul li a:hover {
  color: var(--brand-700);
  text-decoration-color: var(--brand-600);
}

ul li ul {
  margin: 4px 0 4px 20px;
  list-style: circle;
  line-height: 1.6;
}

ul li ul li {
  margin: 2px 0;
}

ul li ul li a {
  font-weight: 400;
}

/* ============ base table scaffolding ============ */

table {
  text-align: center;
  page-break-inside: avoid;
  border-collapse: separate;
  border-spacing: 0;
  font-variant-numeric: tabular-nums;
}

/* top-level timetable tables: combined matrices, per-entity cards, statistics */
body > table[border="1"],
body > table.odd_table,
body > table.even_table {
  margin: 0 auto;
  table-layout: auto;
  min-width: 100%;
  width: auto;
  background: var(--card-bg);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: 0 10px 34px -16px rgb(15 23 42 / 0.3);
}

body > table.odd_table,
body > table.even_table {
  margin: 30px auto 8px;
}

tbody {
  border-top: 3px solid var(--brand-600);
}

/* ============ headers ============ */

thead {
  background: var(--line);
}

thead th,
tbody th {
  border: 1px solid var(--line);
}

/* entity / category bar (e.g. "I/I Sec A", "All Activities") */
thead tr:first-child th[colspan] {
  padding: 11px 16px;
  background: linear-gradient(135deg, var(--brand-700), var(--accent-600) 130%);
  color: #fff;
  font-size: 13.5px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  border: 0;
}

/* axis label run (days, hours or entities) */
thead th.xAxis {
  padding: 10px 14px;
  min-width: 104px;
  background: linear-gradient(135deg, var(--brand-600), var(--brand-500));
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  border: 0;
}

thead tr:first-child td,
tbody tr:first-child td {
  border: 0;
}

tfoot,
tbody > tr:last-child, body > table tr:last-child {
  border-bottom-left-radius: var(--radius-lg);
}

/* empty corner cells in the header */
thead td {
  background: transparent;
  border: 0;
}

/* row axis labels (hours / days) */
tbody th {
  padding: 9px 12px;
  background: var(--brand-50);
  color: var(--brand-700);
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

/* ============ body cells ============ */

td {
  padding: 10px 12px;
  border: 1px solid var(--line);
  background: var(--card-bg);
  font-size: 13px;
  line-height: 1.45;
  vertical-align: middle;
  min-width: 104px;
}

tbody tr:nth-child(even) td {
  background: var(--zebra);
}

tbody tr:hover td {
  background: var(--hover);
}

tbody tr:hover th {
  background: var(--brand-100);
  color: var(--brand-700);
}

/* empty slots ("---") */
td:not(:has(br, table)) {
  color: transparent;
  background-image: radial-gradient(circle, var(--empty) 1.5px, transparent 2px) !important;
  background-size: 12px 12px;
  background-position: center;
  background-repeat: repeat;
}

/* ============ inner detailed grid (years / activities) ============ */

table.detailed {
  min-width: 0;
  width: 100%;
  border: 0;
  border-collapse: collapse;
  background: transparent;
  box-shadow: none;
  border-radius: var(--radius-md);
  overflow: hidden;
}

table.detailed td.detailed {
  padding: 5px 9px;
  border: 0;
  border-top: 1px solid #f1f5f9;
  background: transparent;
  font-size: 11.5px;
  line-height: 1.35;
  min-width: 0;
  color: var(--ink-700);
}

table.detailed tr:first-child td.detailed {
  color: var(--ink-900);
  font-weight: 700;
  border-top: 0;
}

table.detailed td.detailed:nth-child(n + 1) + td.detailed {
  border-left: 1px solid #f1f5f9;
}

/* ============ footers, captions, back-links ============ */

caption {
  padding: 12px 0 8px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink-300);
}

tr.foot td,
tfoot td {
  padding: 9px 14px;
  background: #f8fafc;
  color: var(--ink-500);
  font-size: 11px;
  border: 0;
}

p.back,
p.back0 {
  margin: 10px auto 8px;
  text-align: center;
  font-size: 12px;
}

p.back a,
p.back0 a {
  display: inline-block;
  padding: 4px 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--card-bg);
  color: var(--ink-500);
}

p.back a:hover,
p.back0 a:hover {
  color: var(--brand-700);
  border-color: var(--brand-400);
  text-decoration: none;
}

/* ============ free-periods annotations ============ */

div.DESCRIPTION {
  text-align: left;
  font-size: 12.5px;
  line-height: 1.6;
  color: var(--ink-500);
}

.TEACHER_IS_NOT_AVAILABLE {
  color: var(--ink-300);
}

.TEACHER_HAS_A_FREE_DAY td {
  background: #f0fdf4;
  color: #15803d;
}

.TEACHER_HAS_SINGLE_GAP td {
  background: #fffbeb;
  color: #b45309;
}

.TEACHER_HAS_BIG_GAP td {
  background: #fff7ed;
  color: #c2410c;
}

.TEACHER_HAS_BORDER_GAP td {
  background: #fef2f2;
  color: #b91c1c;
}

.TEACHER_MUST_STAY_LONGER {
  color: #b45309;
}

.TEACHER_MUST_STAY_MUCH_LONGER {
  color: #ea580c;
}

.TEACHER_MUST_COME_EARLIER {
  color: #b45309;
}

.TEACHER_MUST_COME_MUCH_EARLIER {
  color: #ea580c;
}

/* ============ print ============ */

@media print {
  @page {
    size: landscape;
    margin: 10mm;
  }

  body {
    padding: 0;
    background: #fff;
  }

  table.odd_table,
  table.even_table {
    page-break-before: always;
  }

  body > table:first-of-type {
    page-break-before: avoid;
  }

  thead th.xAxis,
  thead tr:first-child th[colspan] {
    background-image: none;
    background: var(--ink-900);
  }

  a {
    color: var(--ink-900);
  }

  p.back,
  p.back0 {
    display: none;
  }
}

@media (max-width: 640px) {
  body {
    padding: 12px 8px;
  }

  thead th.xAxis {
    padding: 7px 6px;
    min-width: 72px;
    font-size: 10px;
  }

  td {
    padding: 7px 6px;
    min-width: 72px;
    font-size: 11px;
  }

  tbody th {
    padding: 6px 8px;
    font-size: 10.5px;
  }
}