/* Lesson timetable, read-only sheets, staff-room screen and module tabs.
   Navy #1B3A6B and gold #C8960C come from the tokens in app.css. */
:root{
  --off-bg:#F3D5D2; --off-fg:#6A1F1A; --fx-bg:#F6E7B4; --fx-fg:#2B2200; --today-bg:#FBF3D9; --now-fg:#1D1600;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){ --off-bg:#4A2327; --off-fg:#F3B8B2; --fx-bg:#4A3E14; --fx-fg:#F6E7B4; --today-bg:#2A2A1E; }
}

/* ---------- module tabs ---------- */
.modbar{display:flex;gap:6px;margin:-6px 0 18px;overflow-x:auto;padding-bottom:2px;-webkit-overflow-scrolling:touch}
.modbar a{flex:none;padding:8px 15px;border-radius:99px;border:1px solid var(--rule-2);text-decoration:none;font-weight:600;font-size:.9rem;color:var(--ink-2);background:var(--card);min-height:38px;display:inline-flex;align-items:center}
.modbar a:hover{border-color:var(--navy);color:var(--navy)}
.modbar a[aria-current=page]{background:var(--navy);color:#fff;border-color:var(--navy)}

/* ---------- lesson editor (Timetable Studio's tabs on SIRIUS TOSS DESK tokens) ---------- */
.lesson-app{font-size:.95rem}
.lesson-app .ls-card{background:var(--card);border:1px solid var(--rule);border-radius:14px;box-shadow:var(--shadow);padding:16px;margin:12px 0}
.lesson-app h2{margin:2px 0 8px;font-size:1.1rem;color:var(--navy)}
.lesson-app small{color:var(--ink-2);display:inline-block;margin-top:2px}
.lesson-app .row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:8px 0}
.lesson-app input,.lesson-app select,.lesson-app textarea{background:var(--card);color:var(--ink);border:1px solid var(--rule-2);border-radius:8px;padding:8px 10px;font:inherit;max-width:100%;min-height:40px}
.lesson-app input,.lesson-app select{width:auto}
.lesson-app input[type=number]{width:70px}
.lesson-app textarea{width:100%;box-sizing:border-box;font:12.5px/1.5 ui-monospace,Menlo,Consolas,monospace}
.lesson-app button{background:var(--navy);color:#fff;border:1px solid var(--navy);border-radius:9px;padding:8px 14px;font:inherit;font-weight:600;cursor:pointer;min-height:40px}
.lesson-app button.o{background:transparent;color:var(--navy)}
.lesson-app button.g{background:var(--gold);border-color:var(--gold);color:var(--now-fg)}
.lesson-app button:disabled{opacity:.5;cursor:not-allowed}
.lesson-app .ls-tabs{gap:6px}
.lesson-app .ls-tabs button{background:var(--card);color:var(--navy);border-color:var(--rule-2)}
.lesson-app .ls-tabs button.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.lesson-app .pn{display:none}.lesson-app .pn.on{display:block}
.lesson-app #msg{min-height:22px;margin:8px 2px;font-weight:550}
.lesson-app .bad,.lesson-app #msg.bad{color:var(--margin)}
.lesson-app #pst[data-state=approved]{color:var(--chalk);font-weight:650}
.lesson-app .wrap{overflow-x:auto}
.lesson-app table{border-collapse:collapse;width:100%}
.lesson-app .at td,.lesson-app .at th{padding:4px;border-bottom:1px solid var(--rule);text-align:left;background:transparent;color:var(--ink);position:static}
.lesson-app .at th{color:var(--navy);font-size:.82rem}
.lesson-app .at input{width:100%;box-sizing:border-box}
.lesson-app #dout ul{margin:8px 0 0;padding-left:20px}

/* ---------- timetable sheets ---------- */
.tt{min-width:780px;table-layout:fixed;border-collapse:collapse;width:100%}
.tt th,.tt td{border:1px solid var(--rule-2);text-align:center;padding:3px;font-size:12px;height:54px;vertical-align:middle;overflow-wrap:break-word;word-break:normal;hyphens:auto}
.tt th{background:var(--navy);color:#fff;height:auto!important;position:static;font-weight:650}
.tt th small{display:block;font-weight:400;font-size:9.5px;opacity:.85}
.tt td.d{width:42px;font-weight:700;font-size:15px;background:var(--hi-soft);color:var(--ink);position:sticky;left:0;z-index:1}
.tt td.br{width:26px;background:var(--hi-soft);color:var(--gold);font-weight:700;padding:0}
.tt td.br b{writing-mode:vertical-rl;display:inline-block;margin:auto;font-size:11px;letter-spacing:.06em}
.tt td[data-d]{cursor:default}
.lesson-app .tt td[data-d]{cursor:pointer}
.tt td.sel{outline:3px solid var(--gold);outline-offset:-3px}
.tt td.off{background:var(--off-bg);color:var(--off-fg)}
.tt td.fx{background:var(--fx-bg);color:var(--fx-fg)}
.tt td b{display:block;font-size:12px;line-height:1.2}
.tt td i{display:block;font-style:normal;color:var(--ink-2);font-size:10.5px;margin-top:2px}
.tt td.fx i{color:var(--fx-fg);opacity:.8}.tt td.off i{color:var(--off-fg)}
.tt td.today{background:var(--today-bg)}
.tt td.d.today{background:var(--gold);color:var(--now-fg)}
.tt td.now{background:color-mix(in srgb,var(--gold) 34%,var(--card));outline:3px solid var(--gold);outline-offset:-3px}
.tt th.now{background:var(--gold);color:var(--now-fg)}
.sheet-read{margin-top:8px}
.sheet-read small{color:var(--ink-2)}
.sheet-read h2{margin:2px 0 8px;color:var(--navy)}

/* ---------- staff-room screen ---------- */
.show{position:fixed;inset:0;z-index:60;display:flex;flex-direction:column;background:var(--paper);color:var(--ink);padding:2vh 2.2vw calc(1.2vh + env(safe-area-inset-bottom));outline:0;overflow:hidden}
.show-head{display:flex;justify-content:space-between;align-items:flex-end;gap:2vw;flex-wrap:wrap;margin-bottom:1.6vh}
.show-sub{color:var(--ink-2);font-size:clamp(.85rem,1.5vw,1.4rem)}
.show-title{font:800 clamp(1.8rem,4.6vw,4.4rem)/1 var(--font-head);color:var(--navy);letter-spacing:-.02em}
.show-right{text-align:right;display:grid;gap:.8vh;justify-items:end}
.show-clock{font:650 clamp(1rem,2.3vw,2.2rem) var(--font-head);font-variant-numeric:tabular-nums}
.show-now{display:inline-block;padding:.5vh 1.2vw;border-radius:99px;font-weight:700;font-size:clamp(.9rem,1.7vw,1.6rem);background:var(--card);border:2px solid var(--rule-2);color:var(--ink)}
.show-now[data-state=lesson]{background:var(--gold);border-color:var(--gold);color:var(--now-fg)}
.show-now[data-state=break]{background:var(--chalk-soft);border-color:var(--chalk);color:var(--ink)}
.show-body{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;justify-content:center}
.show-body .wrap{overflow:visible}
.show-body small{display:none}
.show-body h2{display:none}
.show .tt{min-width:0;width:100%}
.show .tt th{font-size:clamp(.8rem,1.5vw,1.5rem);padding:.8vh .3vw}
.show .tt th small{display:block;font-size:clamp(.6rem,1vw,1rem)}
.show .tt td{height:calc((100vh - 270px) / 6);font-size:clamp(.8rem,1.6vw,1.7rem);border-width:2px}
.show .tt td b{font-size:clamp(.85rem,1.9vw,2rem)}
.show .tt td i{font-size:clamp(.7rem,1.3vw,1.4rem)}
.show .tt td.d{width:5vw;font-size:clamp(1rem,2.2vw,2.4rem)}
.show-ctrl{position:fixed;right:1.5vw;bottom:5vh;display:flex;gap:8px;align-items:center;background:var(--card);border:1px solid var(--rule-2);padding:6px 8px;border-radius:12px;box-shadow:var(--shadow);transition:opacity .4s}
.show-count{font-weight:650;font-size:.85rem;color:var(--ink-2);padding:0 4px}
.show-foot{text-align:center;color:var(--ink-3);font-size:clamp(.65rem,1vw,.95rem);padding-top:.8vh}
.show.idle .show-ctrl{opacity:0;pointer-events:none}
.show.idle{cursor:none}
@media (max-width:700px){
  .show{padding:1.5vh 3vw}
  .show .tt{min-width:720px}
  .show-body{overflow:auto;justify-content:flex-start}
  .show .tt td{height:54px}
}
@media (prefers-reduced-motion:reduce){.show-ctrl{transition:none}}

/* ---------- print ---------- */
@media print{
  @page{size:landscape;margin:10mm}
  .tt{min-width:0;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .tt th{background:#1B3A6B!important;color:#fff!important}
  .tt td.d,.tt td.br{background:#F7EBC6!important;color:#111!important}
  .tt td.fx{background:#F6E7B4!important;color:#2B2200!important}
  .tt td.today,.tt td.now,.tt td.d.today{background:inherit!important;outline:0!important}
  .lesson-app .ls-card:not(:has(#sheet)),.lesson-app .ls-tabs,.lesson-app #msg,.lesson-app .page-head,.modbar{display:none!important}
  .lesson-app .ls-card:has(#sheet) .row,.lesson-app .ls-card:has(#sheet) > small{display:none!important}
  .lesson-app .ls-card{border:0;box-shadow:none;padding:0}
  .lesson-app .pn{display:block!important}.lesson-app .pn:not(#p-t){display:none!important}
}
