/* ============================================================
   Landow Jewish Academy — portal design standard.
   Loaded last on every staff page; sets palette, type, rules,
   and the shared masthead drawn by /portal-chrome.js.
   Vocabulary: paper background, navy ink, one gold accent, hairline
   rules, serif headings with italic emphasis, square corners.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;0,700;1,500;1,600&family=Source+Sans+3:wght@400;600;700&display=swap');

:root{
  --navy:#14224B; --navy-deep:#0D1735; --gold:#C79B3B; --gold-soft:#E6D3A3; --tan:#B08D57;
  --paper:#FBFAF7; --paper-2:#F4F0E6; --ink:#1B1F2E; --ink-soft:#5B6072; --rule:#D8D2C4; --rule-soft:#EBE7DD;
  --ok:#2F6B3A; --bad:#9A2E22; --warn:#8A6A1F;
  --serif:'Cormorant Garamond', Georgia, serif; --sans:'Source Sans 3', system-ui, sans-serif;
  /* aliases used by older pages */
  --bg:var(--paper); --card:#fff; --line:var(--rule); --ink-2:var(--ink-soft); --accent:var(--gold);
}
html{background:var(--paper)}
body{font-family:var(--sans) !important;color:var(--ink);background:var(--paper) !important;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,.card h3,.card h2,.section h2,.tile h3{font-family:var(--serif) !important;color:var(--navy);font-weight:600;letter-spacing:0}
h1 em,h2 em{font-style:italic;font-weight:500;color:var(--tan)}
button,input,select,textarea{font-family:var(--sans) !important}
a{color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* square the corners across the board; small badges keep theirs */
.btn,button.btn,input:not([type=checkbox]):not([type=radio]),select,textarea,.card,.panel,.section,.drop,.note,.denied,.gate,.tile{border-radius:2px !important}
.btn,button.btn{box-shadow:none !important}
.btn.primary,.btn-primary,.btn:not(.quiet):not(.btn-outline):not(.btn-light):not(.bad):not(.warn):not(.ok):not(.btn-google){background:var(--navy);color:#fff;border-color:var(--navy)}
.card,.panel,.section{box-shadow:none !important;border:1px solid var(--rule)}

/* ---------- shared masthead (drawn by portal-chrome.js) ---------- */
.pc-mast{max-width:1180px;margin:0 auto;padding:22px 28px 0;display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:26px;background:var(--paper)}
.pc-mast img{width:132px;height:auto;display:block}
.pc-title{color:var(--navy);line-height:1.1}
.pc-kicker{font-family:var(--sans);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);margin:0 0 4px}
.pc-kicker a{color:var(--ink-soft);text-decoration:none}.pc-kicker a:hover{color:var(--gold)}
.pc-title h1{font-family:var(--serif) !important;font-size:clamp(26px,3vw,36px);font-weight:600;margin:0;color:var(--navy);line-height:1}
.pc-title h1 em{font-style:italic;font-weight:500;color:var(--tan)}
.pc-date{font-family:var(--serif);font-size:14.5px;color:var(--ink-soft);margin-top:6px}
.pc-date i{font-style:italic}
.pc-who{display:flex;align-items:center;gap:14px;font-size:14px;color:var(--ink-soft);justify-self:end;padding-bottom:4px;white-space:nowrap}
.pc-who .name{color:var(--navy)}
.pc-who a,.pc-who button{background:none;border:0;padding:0;font:inherit;font-size:14px;color:var(--navy);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--gold);cursor:pointer}
.pc-rule{max-width:1180px;margin:16px auto 0;padding:0 28px}
.pc-rule div{border-top:1.5px solid var(--navy);position:relative}
.pc-rule div::after{content:'';position:absolute;left:0;right:0;top:3px;border-top:1px solid var(--navy)}
body.pc-wide .pc-mast,body.pc-wide .pc-rule{max-width:1680px}
@media (max-width:820px){
  .pc-mast{grid-template-columns:auto 1fr;grid-template-areas:"logo title" "who who";padding:12px 16px 0;gap:6px 14px;align-items:center}
  .pc-mast > a{grid-area:logo}.pc-mast img{width:64px}
  .pc-title{grid-area:title}.pc-title h1{font-size:24px}.pc-kicker{font-size:10.5px;margin-bottom:2px}.pc-date{font-size:12.5px;margin-top:2px}
  .pc-who{grid-area:who;justify-self:start;padding:2px 0 0;font-size:13px;gap:10px}
  .pc-rule{padding:0 16px;margin-top:8px}
  body.pc-chrome .topbar,body.pc-chrome header.top{padding:6px 16px 0 !important}
  body.pc-chrome .topbar a,body.pc-chrome .topbar .btn,body.pc-chrome .topbar button{font-size:13px !important;padding:2px 0 !important}
}

/* legacy page bars: keep their tools, drop their duplicate branding, turn them into a quiet strip */
body.pc-chrome .topbar,body.pc-chrome header.top,body.pc-chrome .app-header{background:transparent !important;color:var(--ink) !important;border:0 !important;box-shadow:none !important;padding:6px 28px 0 !important;max-width:1180px;margin:0 auto;position:static !important}
body.pc-chrome.pc-wide .topbar{max-width:1680px}
body.pc-chrome .topbar .brand,body.pc-chrome .topbar .topbar-title,body.pc-chrome .topbar .topbar-sub,body.pc-chrome .topbar .topbar-left,body.pc-chrome .topbar > a[title="Portal home"],body.pc-chrome header.top .brand,body.pc-chrome header.top .sub,body.pc-chrome .app-header .hero,body.pc-chrome .topbar .brand-name{display:none !important}
body.pc-chrome .topbar a,body.pc-chrome .topbar .btn,body.pc-chrome .topbar button{color:var(--navy) !important;background:transparent !important;border:0 !important;padding:4px 0 !important;font-size:13.5px !important;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--gold)}
body.pc-chrome .topbar .topbar-actions,body.pc-chrome .topbar .topbar-right{display:flex;gap:4px 18px;flex-wrap:wrap;justify-content:flex-start;align-items:center}
body.pc-chrome .topbar .topbar-actions > *,body.pc-chrome .topbar .topbar-right > *{width:auto !important;flex:0 0 auto !important;margin:0 !important}
body.pc-chrome .topbar .topbar-actions a[href="/"]{display:none !important}
/* pages that repeat the school name + page title inside the content: the masthead already says it */
body.pc-chrome .dash-brand-header,body.pc-chrome .page-brand,body.pc-chrome .brand-header{display:none !important}
body.pc-chrome .topbar #userEmail,body.pc-chrome .topbar .who{display:none}
body.pc-chrome .topbar #signOutBtn,body.pc-chrome .topbar [id*="ignOut"]{display:none !important}

/* tables: hairline rules, small-caps headers */
body.pc-chrome table{border-collapse:collapse}
body.pc-chrome th{font-family:var(--sans);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);font-weight:600}
body.pc-chrome thead th{border-bottom:1px solid var(--navy)}
body.pc-chrome td{border-bottom:1px solid var(--rule-soft)}

/* status pills: one palette */
.pill,.badge,.status{font-family:var(--sans);font-weight:700;letter-spacing:.02em}

body.pc-hidebar .topbar,body.pc-hidebar header.top{display:none !important}

/* ☰ page menu in the masthead (holds the page's own toolbar links) */
.pc-menu{position:relative;align-self:end;padding-bottom:4px}
.pc-menu summary{list-style:none;cursor:pointer;font-size:20px;line-height:1;color:var(--navy);padding:2px 8px;border:1px solid var(--rule);background:#fff;user-select:none}
.pc-menu summary::-webkit-details-marker{display:none}
.pc-menu[open] summary{border-color:var(--navy)}
.pc-menu-body{position:absolute;right:0;top:calc(100% + 6px);background:#fff;border:1px solid var(--rule);border-top:3px solid var(--navy);min-width:230px;padding:6px 0;z-index:30;box-shadow:0 12px 30px rgba(14,27,51,.14)}
.pc-menu-body > *{display:block !important;width:100% !important;text-align:left !important;background:none !important;border:0 !important;padding:9px 16px !important;font:inherit !important;font-size:14.5px !important;color:var(--navy) !important;text-decoration:none !important;cursor:pointer;border-radius:0 !important;box-shadow:none !important}
.pc-menu-body > *:hover{background:#FBF6EA !important}
.pc-mast{grid-template-columns:auto 1fr auto auto}
@media (max-width:820px){ .pc-mast{grid-template-columns:auto 1fr auto;grid-template-areas:"logo title menu" "who who who"} .pc-menu{grid-area:menu;align-self:center;padding:0} }
