/* Shared spacing; component colors and behavior remain in their own stylesheets. */
:root {
  --page-width: 1200px;
  --page-gutter: clamp(16px, 2.5vw, 32px);
  --section-gap: 24px;
  --card-padding: 24px;
  --field-gap: 16px;
}
.teacher-workspace, .campus-page, .parent-workspace {
  width: 100%;
  max-width: var(--page-width);
  margin-inline: auto;
  padding: 28px var(--page-gutter) 48px;
}
.teacher-nav, .campus-nav { gap: 8px; margin-bottom: var(--section-gap); }
.teacher-heading, .campus-page > .instruction-heading {
  gap: 16px;
  margin-bottom: var(--section-gap);
  align-items: center;
}
.teacher-heading h1, .campus-page > .instruction-heading h1 {
  margin: 0;
  font-size: 30px;
  line-height: 1.2;
}
.teacher-heading .eyebrow { margin-bottom: 8px; }
.instruction-heading h2, .instruction-heading h3 { margin: 0; }
.teacher-form-card, .publish-card { padding: var(--card-padding); }
.teacher-form-card > h2, .publish-card > h2 { margin-bottom: 20px; }
.form-section-title { margin-bottom: 20px; }
.teacher-editor, .people-workspace, .editor-main { gap: var(--section-gap); }
.teacher-form-card label { margin-bottom: 8px; line-height: 1.5; }
.teacher-form-card :is(input:not([type=checkbox]):not([type=radio]), textarea, select) { width: 100%; }
.teacher-form-card :is(input:not([type=checkbox]):not([type=radio]), textarea) { margin-bottom: var(--field-gap); }
.teacher-form-card label:has(> input, > textarea, > select) {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: var(--field-gap);
}
.teacher-form-card label > :is(input, textarea, select) { margin-bottom: 0; }
.teacher-form-card .checkbox-label, .teacher-form-card .submission-setting {
  flex-direction: row;
  align-items: center;
  gap: 8px;
}
.teacher-form-card input[type=checkbox], .people-workspace input[type=checkbox] {
  width: 16px;
  height: 16px;
  margin: 0;
  flex: 0 0 16px;
}
.teacher-form-card fieldset, .dialog-body fieldset {
  border: 1px solid var(--blue-border);
  border-radius: 8px;
  padding: 16px;
  margin: 0 0 20px;
  min-width: 0;
}
.teacher-form-card fieldset legend, .dialog-body fieldset legend { padding-inline: 6px; }
.teacher-form-card fieldset label { font-weight: 400; margin-bottom: 10px; }
.teacher-form-card fieldset label:last-child { margin-bottom: 0; }
#invite-emails { min-height: 144px; }
.people-workspace .placement-fields { margin-bottom: 16px; }
.person-row { padding-block: 16px; }
.person-row > label { margin: 0 !important; }
.person-row .text-button { padding-block: 8px; }
.account-overview { gap: 16px; margin-bottom: var(--section-gap); }
.account-overview > div { padding: 18px 20px; }
.managed-courses { gap: 16px; margin-top: 24px; }
#new-course { display: block; margin-bottom: 20px; }
.teacher-workspace #teacher-body > label { display: block; margin-bottom: 8px; }
.record-filters { gap: 16px; margin-bottom: 24px; align-items: end; }
.record-card { padding: 20px; margin: 0 0 16px; }
.record-card > p:last-child { margin-bottom: 0; }
.record-actions { margin-top: 16px; }
#message-list { margin-top: 20px; }
.message-row { margin: 0 0 12px; padding: 18px 20px; }
.campus-page .period-tabs { max-width: 360px; }
.campus-page .period-tabs button[aria-pressed=true] { background: white; color: var(--blue); }
.page-banner { min-height: 0; padding-bottom: 24px; }
.page-banner h1 { margin: 0; }
.portal-columns {
  max-width: 1600px;
  margin-inline: auto;
  padding: 24px var(--page-gutter) 48px;
  gap: var(--section-gap);
}
.content-title { margin: 0 0 20px; }
.content-toolbar { margin-bottom: 20px; }
.aside-content, .logbook-columns .aside-content { gap: 20px; }
.side-column { padding-top: 0; }
.logbook-columns #full-planner { margin: 0; }
.logbook-columns .resources { order: 3; }
.logbook-assessments { order: 2; }
.eds-compact { padding: 16px; border: 1px solid var(--blue-border); border-radius: 12px; }
.eds-compact > .instruction-heading { margin-bottom: 16px; }
.eds-compact h2 { font-size: 20px; }
.eds-compact p:last-child, .eds-compact .record-card:last-child { margin-bottom: 0; }
.logbook-schedule .schedule-empty { margin: 0 0 16px; padding: 10px 12px; }
.logbook-schedule-heading { margin-bottom: 16px; }
.schedule-week-controls { margin-bottom: 16px; }
.parent-workspace .campus-page { max-width: none; padding: 0; }
.parent-workspace > select { margin-bottom: 20px; }
.dialog-body form { max-width: none; }
.dialog-body label > :is(input:not([type=checkbox]):not([type=radio]), textarea, select) { width: 100%; }
@media (max-width: 800px) {
  :root { --section-gap: 20px; --card-padding: 20px; }
  .teacher-workspace, .campus-page, .parent-workspace { padding-top: 24px; }
}
@media (max-width: 758px) {
  :root { --card-padding: 18px; }
  .teacher-topbar { padding: 16px 16px 16px 56px; min-height: 72px; gap: 12px; }
  .teacher-brand { min-width: 0; }
  .teacher-brand img { width: 145px; }
  .teacher-brand > span { display: none; }
  .teacher-topbar .role-badge { white-space: nowrap; font-size: 10px; }
  .teacher-nav, .campus-page > .campus-nav, .parent-workspace > .campus-nav {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 8px;
    margin-bottom: 20px;
    scrollbar-width: thin;
  }
  .teacher-nav a, .campus-nav a { flex-shrink: 0; white-space: nowrap; }
  .teacher-heading, .campus-page > .instruction-heading { flex-wrap: wrap; align-items: start; gap: 12px; }
  .teacher-heading h1, .campus-page > .instruction-heading h1 { font-size: 26px; }
  .teacher-heading-actions { width: auto; }
  .record-filters { gap: 16px; align-items: stretch; }
  .record-card { padding: 16px; }
  .record-card header strong { font-size: 16px; }
  .campus-page .period-tabs { max-width: none; }
  .portal-columns { padding-top: 20px; }
  .page-banner { padding-bottom: 20px; }
  .page-banner h1 { padding: 0; margin: 0; }
  .logbook-schedule { padding: 16px; }
  .account-overview { gap: 12px; }
  .account-overview > div { padding: 16px; }
  .managed-courses { grid-template-columns: minmax(0, 1fr); }
  .auth-card .campus-nav { gap: 8px; margin-bottom: 24px; }
  .auth-card .campus-nav a { white-space: normal; padding: 10px 12px; }
  .parent-header { padding-left: 16px; }
}
@media print {
  .portal-columns { max-width: none; padding: 0; }
  .page-banner { padding: 12px; }
}
.logbook-close {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  background: white;
  color: #d42b3a;
  border: 1px solid #efbbc1;
  border-radius: 8px;
  font-size: 20px;
  text-decoration: none;
}
.logbook-close:hover { background: #fff3f4; border-color: #d42b3a; }
.logbook-close:focus-visible { outline-color: #d42b3a; }
@media(max-width:758px) { .logbook-close { width: 36px; height: 36px; } }
.school-classes { margin-bottom: var(--section-gap); }
.admin-class-row { display:flex; align-items:center; gap:16px; padding:16px 0; border-top:1px solid var(--blue-border); }
.admin-class-row>div { flex:1; min-width:0; }
.admin-class-row strong,.admin-class-row small { display:block; overflow-wrap:anywhere; }
.admin-class-row small { margin-top:6px; color:var(--muted); }
.class-members { max-height:320px; overflow:auto; }
.message-dialog { width:560px; }
#message-recipients>label { margin-bottom:8px; }
#message-recipients>input { width:100%; margin-bottom:16px; }
.recipient-chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.recipient-chip { display:inline-flex; align-items:center; gap:8px; padding:6px 8px 6px 12px; background:var(--blue-soft); color:var(--blue); border:1px solid var(--blue-border); border-radius:8px; max-width:100%; overflow-wrap:anywhere; }
.recipient-chip button { border-radius:4px; padding:2px 6px; color:var(--blue); background:white; font-size:18px; }
.recipient-count { margin:12px 0 20px; font-size:12px; color:var(--muted); }
.message-receivers { margin-bottom:16px; }.message-receivers ul { max-height:220px; overflow:auto; }
.eds-own-absence { border-top:1px solid var(--blue-border); margin-top:32px; padding-top:24px; }
.eds-own-absence .campus-page { padding:0; max-width:none; }
@media(max-width:758px){.admin-class-row { gap:10px; }.eds-own-absence { margin-top:24px; padding-top:20px; }}
.logbook-header { padding:24px var(--page-gutter) 0; border-bottom:1px solid var(--blue-border); }
.logbook-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:20px; }
.logbook-heading h1 { margin:0; font-size:30px; line-height:1.2; }
.logbook-tabs { display:flex; gap:8px; overflow-x:auto; scrollbar-width:thin; }
.logbook-tabs a { flex-shrink:0; display:flex; align-items:center; gap:8px; padding:12px 16px; border-bottom:3px solid transparent; color:var(--muted); text-decoration:none; }
.logbook-tabs a[aria-current=page] { border-color:var(--blue); color:var(--blue); font-weight:600; }
.logbook-tabs a:hover { background:var(--blue-soft); }
.logbook-columns .primary-column > .content-toolbar { margin-bottom:16px; }
#logbook-assessments-main>.campus-page,#logbook-messages>.campus-page { padding:20px; border:1px solid var(--blue-border); border-radius:12px; }
.schedule-today .schedule-column-heading { background:var(--blue); color:white; }
.schedule-today .schedule-date { color:white; }
@media(max-width:758px){.logbook-header { padding-top:18px; }.logbook-heading { padding-left:38px; margin-bottom:16px; }.logbook-heading h1 { font-size:26px; }.logbook-tabs a { padding:12px; }.logbook-tabs { gap:4px; }}
@media print{.logbook-tabs,.logbook-close { display:none; }.logbook-header { padding:12px; }}
/* Collapsed state must override the regular and logbook grid widths. */
.portal-columns.aside-collapsed { grid-template-columns:minmax(0,1fr) 36px; }
.portal-columns.aside-collapsed .side-column { min-height:36px; }
.aside-content[hidden] { display:none !important; }
@media(max-width:800px){
  .logbook-columns.aside-collapsed { grid-template-columns:minmax(0,1fr); }
  .logbook-columns .side-column { padding-top:44px; }
  .logbook-columns .aside-toggle { display:grid; top:0; right:0; }
}
@media(max-width:758px){
  .portal-columns.aside-collapsed { grid-template-columns:minmax(0,1fr); }
  .portal-columns .side-column { padding-top:44px; }
  .portal-columns .aside-toggle { top:0; right:0; }
}