/* Design copied from the reference exam-calendar (לוח-מבחנים-תשפ"ז): same paper/
   teal palette, same cell/chip/dialog language. Subject-specific chip classes
   are replaced by a per-event --c custom property (types are admin-defined,
   not fixed at build time); everything else keeps the original look. */
@import url("https://fonts.googleapis.com/css2?family=Assistant:wght@400;500;600;700&family=Playpen+Sans+Hebrew:wght@400;500;600;700&family=Rubik+Doodle+Shadow&family=Rubik:wght@600;800&display=swap");

:root{
  --f-body:"Assistant","Segoe UI",system-ui,-apple-system,"Arial Hebrew",sans-serif;
  --f-title:"Rubik Doodle Shadow","Playpen Sans Hebrew","Rubik",var(--f-body);
  --f-event:"Playpen Sans Hebrew","Assistant",var(--f-body);

  --paper:#EFF2EF; --surface:#FFFFFF; --surface-2:#F7F9F7;
  --line:#CFD9D3; --line-soft:#DEE6E1;
  --ink:#0F1817; --ink-2:#2C3936; --muted:#4E5D58;
  --accent:#1F4F4C; --accent-2:#2C716C; --accent-soft:#D5E7E4; --on-accent:#FFFFFF;
  --danger:#A63A32;
  --chag-bg:#FAEFD7; --chag-edge:#E4CE9F; --chag-ink:#6D4A0C;
  --erev-bg:#FCF6E9; --chm-bg:#EFF6E7; --fast-bg:#ECEAF4; --fast-ink:#443B6E;
  --shabbat-bg:#E7EBF1; --nos-ink:#6A7883;
  --tint-ground:#FFFFFF; --tint-amt:22%; --edge-amt:48%;
  --shade-ground:#0B1413; --shade-amt:58%;
  --shadow:0 1px 2px rgba(20,36,34,.06), 0 8px 20px -14px rgba(20,36,34,.3);
  --r:12px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#101415; --surface:#191F21; --surface-2:#202829;
    --line:#374245; --line-soft:#2A3336;
    --ink:#F2F8F6; --ink-2:#CBD9D5; --muted:#94A5A0;
    --accent:#8ADCCE; --accent-2:#6FC5B8; --accent-soft:#1E3A38; --on-accent:#0E1F1D;
    --danger:#E8867D;
    --chag-bg:#2E2716; --chag-edge:#4A3E22; --chag-ink:#EDCC8A;
    --erev-bg:#242015; --chm-bg:#1C2619; --fast-bg:#20202C; --fast-ink:#BCB4E4;
    --shabbat-bg:#1B2028; --nos-ink:#7E8D97;
    --tint-ground:#151C1E; --tint-amt:26%; --edge-amt:42%;
    --shade-ground:#FFFFFF; --shade-amt:44%;
    --shadow:0 1px 2px rgba(0,0,0,.35), 0 10px 24px -16px rgba(0,0,0,.8);
  }
}
:root[data-theme="dark"]{
  --paper:#101415; --surface:#191F21; --surface-2:#202829;
  --line:#374245; --line-soft:#2A3336;
  --ink:#F2F8F6; --ink-2:#CBD9D5; --muted:#94A5A0;
  --accent:#8ADCCE; --accent-2:#6FC5B8; --accent-soft:#1E3A38; --on-accent:#0E1F1D;
  --danger:#E8867D;
  --chag-bg:#2E2716; --chag-edge:#4A3E22; --chag-ink:#EDCC8A;
  --erev-bg:#242015; --chm-bg:#1C2619; --fast-bg:#20202C; --fast-ink:#BCB4E4;
  --shabbat-bg:#1B2028; --nos-ink:#7E8D97;
  --tint-ground:#151C1E; --tint-amt:26%; --edge-amt:42%;
  --shade-ground:#FFFFFF; --shade-amt:44%;
  --shadow:0 1px 2px rgba(0,0,0,.35), 0 10px 24px -16px rgba(0,0,0,.8);
}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{color-scheme:light dark}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f-body);
  font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
.page{padding-bottom:70px}
.wrap{max-width:1300px;margin:0 auto;padding-inline:20px}
button{font:inherit;color:inherit}
a{color:inherit}

/* ---------- masthead ---------- */
.top{background:linear-gradient(180deg,var(--surface),var(--surface-2));border-bottom:1px solid var(--line)}
.topin{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-end;justify-content:space-between;padding-block:28px 20px}
.eyebrow{margin:0 0 8px;font-size:13.5px;font-weight:700;letter-spacing:.06em;color:var(--accent-2);display:flex;align-items:center;gap:8px}
h1{margin:0;font-family:var(--f-title);font-weight:400;
  font-size:clamp(30px,4.6vw,48px);line-height:1.2;text-wrap:balance;color:var(--ink)}
.sub{margin:6px 0 0;color:var(--ink-2);font-size:15px;max-width:58ch}
.groupSelect{font:inherit;font-size:13px;font-weight:700;color:var(--accent-2);background:var(--accent-soft);
  border:1px solid transparent;border-radius:99px;padding:3px 9px}

/* ---------- controls ---------- */
.controls{position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--paper) 90%,transparent);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.ctlin{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;padding-block:10px}
.filters{display:flex;align-items:center;gap:5px;flex-wrap:wrap;min-width:0}
.fchip{font-size:13.5px;cursor:pointer;border-radius:99px;padding:4px 11px;
  border:1px solid color-mix(in srgb,var(--c,var(--line)) var(--edge-amt),var(--tint-ground));
  background:var(--surface);color:var(--ink-2);display:inline-flex;align-items:center;gap:5px;
  transition:background .15s,color .15s,border-color .15s}
.fchip:hover{border-color:var(--accent-2)}
.fchip[aria-pressed="true"]{background:color-mix(in srgb,var(--c,var(--accent)) var(--tint-amt),var(--tint-ground));
  color:color-mix(in srgb,var(--c,var(--accent)) var(--shade-amt),var(--shade-ground));font-weight:700}
:focus-visible{outline:2px solid var(--accent-2);outline-offset:2px}

.tools{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.tools.end{margin-inline-start:auto}
.tbtn{cursor:pointer;font-size:13.5px;font-weight:600;padding:6px 13px;border-radius:9px;
  border:1px solid var(--line);background:var(--surface);color:var(--ink-2);text-decoration:none;display:inline-flex;align-items:center}
.tbtn:hover{border-color:var(--accent-2);color:var(--ink)}
.tbtn.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.tbtn.primary:hover{background:var(--accent-2);border-color:var(--accent-2);color:var(--on-accent)}
.tbtn.ghost{background:transparent;color:var(--muted)}
.tbtn.danger{color:var(--danger);border-color:color-mix(in srgb,var(--danger) 45%,var(--line))}
.tbtn:disabled{opacity:.4;cursor:default}
.saved{font-size:13px;font-weight:600;color:var(--muted)}

.monthswitch{display:flex;align-items:center;gap:4px;flex-wrap:wrap;min-width:0}
.monthswitch select{font:inherit;font-size:13.5px;font-weight:600;color:var(--ink-2);background:var(--surface);
  border:1px solid var(--line);border-radius:9px;padding:5px 8px;min-width:0}

/* ---------- month quick-nav (jump within the scrollable year) ---------- */
.monthnav{border-bottom:1px solid var(--line);background:var(--surface)}
.navin{display:flex;gap:2px;overflow-x:auto;padding-block:8px;scrollbar-width:thin}
.monthnav a{white-space:nowrap;text-decoration:none;color:var(--ink-2);font-size:13.5px;font-weight:600;
  padding:5px 10px;border-radius:8px;display:inline-flex;gap:6px;align-items:center;cursor:pointer}
.monthnav a:hover{background:var(--accent-soft);color:var(--accent)}
.monthnav a i{font-style:normal;font-size:11px;background:var(--accent-soft);color:var(--accent);
  border-radius:99px;padding:1px 6px;font-variant-numeric:tabular-nums}
.monthnav a.current{background:var(--accent);color:var(--on-accent)}
.monthnav a.current i{background:var(--on-accent);color:var(--accent)}

/* ---------- month ---------- */
.month{margin-top:28px;scroll-margin-top:96px}
.mhead{display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  padding-bottom:10px;margin-bottom:12px;border-bottom:2px solid var(--line)}
.mtitles{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.mhead h2{margin:0;font-family:var(--f-body);font-weight:700;font-size:28px;letter-spacing:-.01em;color:var(--ink)}
.hmon{margin:0;font-size:18px;font-weight:600;color:var(--accent-2)}
.mcount{font-size:13.5px;color:var(--muted);white-space:nowrap}
.mcount b{color:var(--ink-2);font-variant-numeric:tabular-nums}

.dow{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin-bottom:6px}
.dow span{text-align:center;font-size:13px;font-weight:700;letter-spacing:.06em;color:var(--muted);padding-bottom:2px}
.grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}

.cell{position:relative;z-index:0;background:var(--surface);border:1px solid var(--line-soft);border-radius:var(--r);
  min-height:132px;padding:8px 9px 9px;display:flex;flex-direction:column;gap:6px;
  cursor:pointer;transition:opacity .18s,border-color .15s}
.cell:hover{border-color:color-mix(in srgb,var(--accent) 35%,var(--line));z-index:20}
.cell.blank{background:transparent;border:0;min-height:0;cursor:default}
.head{display:flex;align-items:baseline;justify-content:space-between;gap:6px}
.gd{font-size:22px;font-weight:700;line-height:1;font-variant-numeric:tabular-nums;color:var(--ink)}
.hd{font-size:14px;font-weight:600;color:var(--muted);line-height:1}
.rcm{font-size:10px;vertical-align:2px}

.cell.shabbat{background:var(--shabbat-bg);border-color:transparent}
.cell.friday{background:color-mix(in srgb,var(--shabbat-bg) 45%,var(--surface))}
.cell.chag{background:var(--chag-bg);border-color:var(--chag-edge)}
.cell.chag .gd,.cell.chag .hd{color:var(--chag-ink)}
.cell.erev{background:var(--erev-bg);border-color:color-mix(in srgb,var(--chag-edge) 55%,var(--surface))}
.cell.chm{background:var(--chm-bg)}
.cell.fast{background:var(--fast-bg)}
.cell.today{outline:2.5px solid var(--accent);outline-offset:1px}

.tags{display:flex;flex-direction:column;gap:3px}
.tag{font-size:12px;font-weight:600;line-height:1.35;color:var(--ink-2);display:flex;gap:5px;align-items:flex-start}
.t-chag{color:var(--chag-ink);font-weight:700}
.t-fast{color:var(--fast-ink)}
.t-modern,.t-minor,.t-chm{color:var(--muted)}

.chips{display:flex;flex-direction:column;gap:5px;margin-top:auto}
.chip{--c:#8A9691;width:100%;text-align:start;cursor:pointer;position:relative;
  font-family:var(--f-event);font-size:13px;line-height:1.3;
  background:color-mix(in srgb,var(--c) var(--tint-amt),var(--tint-ground));
  color:color-mix(in srgb,var(--c) var(--shade-amt),var(--shade-ground));
  border:1px solid color-mix(in srgb,var(--c) var(--edge-amt),var(--tint-ground));
  border-radius:9px;padding:5px 7px 6px;display:flex;align-items:center;gap:5px;
  transition:opacity .18s,transform .12s}
.chip:hover{transform:translateY(-1px)}
.chip .tt{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.chip .lock{flex:none;font-size:10.5px;opacity:.75}
.more{width:100%;text-align:center;cursor:pointer;font-size:12px;font-weight:700;
  background:transparent;border:1px dashed var(--line);border-radius:9px;padding:3px 6px;color:var(--muted)}
.more:hover{border-color:var(--accent-2);color:var(--accent-2)}

/* ---------- hover popover with full event details ---------- */
.chip .pop{display:none;position:absolute;z-index:40;inset-inline-start:0;top:calc(100% + 6px);width:max-content;
  max-width:260px;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:11px;
  padding:10px 12px;box-shadow:0 16px 40px -18px rgba(10,25,22,.45);text-align:start;white-space:normal;
  font-family:var(--f-body);font-size:12.5px;line-height:1.5}
.chip:hover .pop{display:block}
.pop .pop-title{font-weight:700;font-size:13.5px;margin-bottom:4px}
.pop .pop-row{color:var(--muted)}
.pop .pop-row b{color:var(--ink-2);font-weight:600}

/* ---------- filtering ---------- */
.filtering .chip:not(.match){opacity:.14}
.filtering .cell:not(.hit){opacity:.45}
.filtering .cell.hit{box-shadow:var(--shadow)}

/* ---------- editor / day-sheet dialogs ---------- */
dialog{border:1px solid var(--line);border-radius:16px;padding:0;background:var(--surface);
  color:var(--ink);box-shadow:0 24px 60px -20px rgba(10,25,22,.5);max-width:480px;width:calc(100% - 32px)}
dialog::backdrop{background:rgba(10,22,20,.5)}
.edform{display:flex;flex-direction:column;gap:13px;padding:22px 22px 20px;max-height:85vh;overflow-y:auto}
.edform h2{margin:0;font-size:22px;font-weight:700}
.edform label{display:flex;flex-direction:column;gap:5px;font-size:13.5px;font-weight:600;color:var(--muted)}
.edform input,.edform select,.edform textarea{font:inherit;font-size:15.5px;font-weight:400;color:var(--ink);
  background:var(--surface-2);border:1px solid var(--line);border-radius:9px;padding:8px 11px;width:100%}
.edform textarea{resize:vertical;min-height:52px}
.edform input:focus,.edform select:focus,.edform textarea:focus{border-color:var(--accent-2);outline:none}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.edbtns{display:flex;gap:8px;margin-top:4px;flex-wrap:wrap}
.edbtns .danger{margin-inline-start:auto}

.pplist{display:flex;flex-wrap:wrap;gap:6px}
.ppchip{cursor:pointer;font-size:13px;border-radius:99px;padding:5px 12px;border:1px solid var(--line);
  background:var(--surface-2);color:var(--ink-2);display:inline-flex;align-items:center;gap:5px}
.ppchip[aria-pressed="true"]{background:color-mix(in srgb,var(--accent) var(--tint-amt),var(--tint-ground));
  border-color:var(--accent-2);color:color-mix(in srgb,var(--accent) var(--shade-amt),var(--shade-ground));font-weight:700}
.ppchip.all{border-style:dashed}

.vistoggle{display:flex;gap:6px}
.vistoggle button{flex:1;cursor:pointer;font-size:13.5px;font-weight:600;padding:8px;border-radius:9px;
  border:1px solid var(--line);background:var(--surface-2);color:var(--ink-2)}
.vistoggle button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}

.sheetlist{display:flex;flex-direction:column;gap:8px}
.sheetitem{display:flex;align-items:center;gap:8px;padding:9px 11px;border-radius:10px;cursor:pointer;
  border:1px solid color-mix(in srgb,var(--c,var(--line)) var(--edge-amt),var(--tint-ground));
  background:color-mix(in srgb,var(--c,var(--line)) var(--tint-amt),var(--tint-ground))}
.sheetitem .tt{font-weight:600;flex:1}
.sheetitem .meta{font-size:12px;color:var(--muted)}

/* ---------- legend ---------- */
.legend{margin-top:44px;padding-top:24px;border-top:1px solid var(--line)}
.legend h3{margin:0 0 14px;font-size:19px;font-weight:700}
.legrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px}
.lt{margin:0 0 10px;font-size:13px;letter-spacing:.06em;color:var(--muted);font-weight:700}
.lrow{display:flex;align-items:center;gap:10px;margin-bottom:8px;font-size:13.5px;color:var(--ink-2)}
.swatch{flex:none;width:28px;height:21px;border-radius:6px;border:1px solid var(--line)}
.sw-chag{background:var(--chag-bg);border-color:var(--chag-edge)}
.sw-erev{background:var(--erev-bg)} .sw-chm{background:var(--chm-bg)}
.sw-fast{background:var(--fast-bg)} .sw-shabbat{background:var(--shabbat-bg)}

.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--paper);
  padding:10px 18px;border-radius:99px;font-size:13.5px;font-weight:600;box-shadow:var(--shadow);z-index:100}

@media (max-width:900px){
  .cell{min-height:96px;padding:6px;border-radius:9px}
  .gd{font-size:17px} .hd{font-size:12px}
  .chip{font-size:11.5px;padding:4px 6px} .tag{font-size:10.5px}
  .grid,.dow{gap:4px}
  .two{grid-template-columns:1fr}
  .chip .pop{display:none!important}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
@media print{
  .controls{display:none}
  body{background:#fff}
  .month{break-inside:avoid;page-break-inside:avoid}
}
