@charset "UTF-8";

/* =====================================================================
   Jadwal Pelajaran — Modern Stylesheet
   Revisi tampilan untuk output FET (SMA NEGERI 2 NABIRE)
   Struktur kelas (class name) FET tetap dipertahankan.
   ===================================================================== */

:root {
  --bg:            #eef2f9;
  --bg-grad-1:     #eef2ff;
  --bg-grad-2:     #f6f9fc;
  --card:          #ffffff;
  --ink:           #1e293b;
  --ink-soft:      #64748b;
  --line:          #e2e8f0;

  --brand:         #2563eb;   /* biru utama  */
  --brand-2:       #1d4ed8;   /* biru tua    */
  --brand-soft:    #eff6ff;   /* biru sangat muda */

  --accent:        #0ea5e9;
  --free:          #f8fafc;
  --free-ink:      #cbd5e1;

  --shadow-sm:     0 1px 2px rgba(15, 23, 42, .06);
  --shadow-md:     0 10px 30px -12px rgba(15, 23, 42, .25);
  --radius:        16px;
  --radius-sm:     10px;

  --font: "Segoe UI", "Inter", system-ui, -apple-system, Roboto, Helvetica, Arial, sans-serif;
}

/* ------------------------------------------------------------------ */
/*  Dasar halaman                                                     */
/* ------------------------------------------------------------------ */

body {
  margin: 0;
  padding: 32px 20px 72px;
  font-family: var(--font);
  color: var(--ink);
  line-height: 1.5;
  background:
    radial-gradient(1200px 600px at 100% -10%, #dbeafe 0%, transparent 55%),
    radial-gradient(1000px 500px at -10% 0%, #ede9fe 0%, transparent 50%),
    linear-gradient(180deg, var(--bg-grad-1), var(--bg-grad-2));
  -webkit-font-smoothing: antialiased;
}

/* ------------------------------------------------------------------ */
/*  Kartu info (Nama Institusi, Komentar) + Daftar Isi                */
/* ------------------------------------------------------------------ */

/* Semua <table> polos di FET dipakai untuk header info & TOC.
   Table jadwal punya class "detailed" sehingga di-override di bawah. */
table {
  max-width: 1180px;
  margin: 0 auto 18px;
  border-collapse: separate;
  border-spacing: 0;
  text-align: left;
  page-break-inside: avoid;
}

body > table:first-of-type {
  margin-top: 6px;
}

body > table:not(.odd_table):not(.even_table):not(.detailed) th,
body > table:not(.odd_table):not(.even_table):not(.detailed) td {
  padding: 10px 16px;
  background: var(--card);
  border: 1px solid var(--line);
}

body > table:not(.odd_table):not(.even_table):not(.detailed) tr th:first-child { border-right: 0; color: var(--ink-soft); font-weight: 600; border-radius: var(--radius-sm) 0 0 var(--radius-sm); }
body > table:not(.odd_table):not(.even_table):not(.detailed) tr td:last-child  { border-left: 0; font-weight: 600; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }

/* Daftar Isi */
p strong {
  display: block;
  max-width: 1180px;
  margin: 34px auto 10px;
  font-size: 20px;
  letter-spacing: -.01em;
  color: var(--ink);
}

ul {
  max-width: 1180px;
  margin: 0 auto 14px;
  padding: 18px 22px 18px 40px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  list-style: none;
}
ul ul {
  margin: 8px 0 4px;
  padding: 0;
  border: 0;
  box-shadow: none;
  background: transparent;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
ul > li {
  font-weight: 700;
  color: var(--brand);
  margin-bottom: 6px;
}
ul ul li {
  font-weight: 500;
  color: var(--ink-soft);
  font-size: 13px;
}
ul ul a {
  display: inline-block;
  padding: 5px 12px;
  border-radius: 999px;
  background: var(--brand-soft);
  color: var(--brand);
  text-decoration: none;
  border: 1px solid transparent;
  transition: .15s ease;
}
ul ul a:hover {
  background: var(--brand);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: var(--shadow-sm);
}

/* ------------------------------------------------------------------ */
/*  Tabel jadwal utama                                                */
/* ------------------------------------------------------------------ */

table.detailed,
table.odd_table,
table.even_table {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto 30px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  box-shadow: var(--shadow-md);
  text-align: center;
}

caption {
  caption-side: top;
  padding: 18px 22px 6px;
  text-align: left;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-soft);
}

/* Judul kelas / guru (baris pertama thead: colspan) */
table.detailed thead tr:first-child th,
table.odd_table thead tr:first-child th,
table.even_table thead tr:first-child th {
  background: linear-gradient(135deg, var(--brand), var(--brand-2));
  color: #fff;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: .01em;
  padding: 14px 18px;
  text-align: center;
}
table.detailed thead tr:first-child td,
table.odd_table thead tr:first-child td,
table.even_table thead tr:first-child td { background: var(--card); }

/* -------------------------------------------------------------- */
/*  Warna judul tabel berputar (8 varian gradient)                */
/*  Setiap tabel berurutan mendapat warna berbeda.                */
/* -------------------------------------------------------------- */
table:nth-of-type(8n+1) thead tr:first-child th { background: linear-gradient(135deg, #6366f1, #8b5cf6); }
table:nth-of-type(8n+2) thead tr:first-child th { background: linear-gradient(135deg, #2563eb, #06b6d4); }
table:nth-of-type(8n+3) thead tr:first-child th { background: linear-gradient(135deg, #059669, #0d9488); }
table:nth-of-type(8n+4) thead tr:first-child th { background: linear-gradient(135deg, #e11d48, #db2777); }
table:nth-of-type(8n+5) thead tr:first-child th { background: linear-gradient(135deg, #d97706, #ea580c); }
table:nth-of-type(8n+6) thead tr:first-child th { background: linear-gradient(135deg, #c026d3, #7c3aed); }
table:nth-of-type(8n+7) thead tr:first-child th { background: linear-gradient(135deg, #0284c7, #2563eb); }
table:nth-of-type(8n)   thead tr:first-child th { background: linear-gradient(135deg, #16a34a, #65a30d); }

/* Header hari (xAxis) */
th.xAxis {
  background: #f1f5f9;
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  padding: 12px 10px;
  border-bottom: 2px solid var(--line);
}

/* Kolom jam (yAxis) */
th.yAxis {
  background: #f8fafc;
  color: var(--ink-soft);
  font-weight: 700;
  font-size: 13px;
  width: 46px;
  height: auto;
  padding: 10px 6px;
  border-right: 2px solid var(--line);
}

/* Sel pelajaran */
td {
  padding: 9px 11px;
  font-size: 12.5px;
  color: var(--ink);
  border-bottom: 1px solid var(--line);
  border-right: 1px solid var(--line);
  vertical-align: middle;
  text-align: center;
  transition: background .12s ease;
}
tbody tr:last-child td { border-bottom: 0; }

td.detailed { border: 1px solid var(--line); }

/* Footer tabel ("Jadwal dihasilkan dengan FET ...") */
tr.foot td,
tr.foot th {
  text-align: center;
  color: var(--ink-soft);
  font-size: 11px;
  font-style: italic;
  padding: 12px 16px;
  border-bottom: 0;
  background: #f8fafc;
}

/* Nama mata pelajaran (huruf pertama = kode FET) diberi penekanan lewat baris pertama teks */
td br + * { color: var(--ink-soft); }

tbody tr:hover td { background: #fafbff; }

/* Sel kosong / jam bebas ("-X-") */
td:empty,
td:only-child { background: var(--free); }

/* ------------------------------------------------------------------ */
/*  Periode bebas guru                                                */
/* ------------------------------------------------------------------ */

div.DESCRIPTION {
  text-align: center;
  font-size: 11px;
  color: var(--ink-soft);
}

/* ------------------------------------------------------------------ */
/*  Navigasi kembali ke atas                                          */
/* ------------------------------------------------------------------ */

p.back {
  max-width: 1180px;
  margin: 6px auto 30px;
}
p.back a {
  display: inline-block;
  padding: 7px 16px;
  border-radius: 999px;
  background: var(--card);
  border: 1px solid var(--line);
  color: var(--brand);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  box-shadow: var(--shadow-sm);
  transition: .15s ease;
}
p.back a:hover { background: var(--brand); color: #fff; transform: translateY(-1px); }

/* Link umum */
a { color: var(--brand); }

/* ------------------------------------------------------------------ */
/*  Cetak (print)                                                     */
/* ------------------------------------------------------------------ */

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

@media print {
  body {
    background: #fff;
    padding: 0;
  }
  table.detailed,
  table.odd_table,
  table.even_table {
    box-shadow: none;
    border: 1px solid #cbd5e1;
    page-break-inside: avoid;
  }
  table.detailed thead tr:first-child th,
  table.odd_table thead tr:first-child th,
  table.even_table thead tr:first-child th {
    background: #2563eb !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  th.xAxis, th.yAxis { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  ul ul a { background: #fff; border-color: #cbd5e1; }
}

/* Akhir file. */