:root{--sa-main:#1c6045;--sa-deep:#183e2b;--sa-tint:#e8f2e9;--sa-line:#d8e6db;--sa-text:#285d3d;--sa-muted:#5d6b61}
/* Scoped to #school-workspace-panel (the embedded school-admin section of
   dashboard.html) plus the shared .school-dialog class - this file used to
   style its own standalone page (staff-access.html) with unscoped
   `body`/`main`/`:root` rules, which leaked into the rest of the dashboard
   once it was folded in here. Every rule below is deliberately scoped so
   this file can never again resize or restyle anything outside the panel
   it owns. */
#school-workspace-panel{max-width:100%}
#school-workspace-panel *{box-sizing:border-box}
#school-workspace-panel button,#school-workspace-panel input,#school-workspace-panel select{font:inherit}
#school-workspace-panel button{cursor:pointer}
#school-workspace-panel button:focus-visible,#school-workspace-panel input:focus-visible,#school-workspace-panel a:focus-visible{outline:3px solid #b18a3c;outline-offset:3px}
#school-workspace-panel .eyebrow{color:#477b60;font-size:.72rem;font-weight:800;letter-spacing:.15em;margin:0 0 8px}
#school-workspace-panel .status{min-height:1.5em;color:#8b3c35}
#school-workspace-panel .tabs{display:flex;gap:8px;overflow-x:auto;max-width:100%;border-bottom:1px solid #d8e3dc;margin:0 0 24px}
#school-workspace-panel .tabs button{white-space:nowrap;border:0;border-bottom:3px solid transparent;background:transparent;color:#4b655a;font-weight:700;padding:13px 17px}
#school-workspace-panel .tabs button[aria-current=page]{color:#144b37;border-color:#44825d}
#school-workspace-panel .tab-badge{display:inline-grid;place-items:center;min-width:18px;height:18px;margin-left:6px;padding:0 5px;border-radius:999px;color:#fff;background:var(--sa-main);font-size:.62rem;font-weight:800}
#school-workspace-panel .message-list{display:grid;gap:12px}
#school-workspace-panel .message-card{margin:0;overflow:hidden;border:1px solid var(--sa-line);border-radius:14px;background:var(--sa-tint)}
#school-workspace-panel .message-card .report-card-summary{padding:18px}
#school-workspace-panel .message-card .report-card-body{padding:0 18px 18px}
#school-workspace-panel .panel{max-width:100%;background:white;border:1px solid var(--sa-line);border-radius:18px;padding:26px;box-shadow:0 10px 35px #123c320b}
#school-workspace-panel .panel[hidden],#school-workspace-panel .tabs button[hidden]{display:none}
#school-workspace-panel .section-head{display:flex;flex-wrap:wrap;align-items:start;justify-content:space-between;gap:20px;margin-bottom:24px}
#school-workspace-panel .section-head h2{font-size:1.6rem;letter-spacing:-.035em;margin:0 0 5px}
#school-workspace-panel .section-head button,#school-workspace-panel .card-actions button,#school-workspace-panel .roster-row button{border:1px solid var(--sa-line);background:white;color:var(--sa-main);border-radius:9px;padding:10px 14px;font-weight:700}
#school-workspace-panel .primary,#school-workspace-panel .section-head .primary,#school-workspace-panel .card-actions .primary{background:var(--sa-main);color:white;border-color:var(--sa-main)}
#school-workspace-panel .group-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(255px,1fr));gap:16px;max-width:100%}
#school-workspace-panel .group-card{border:1px solid var(--sa-line);background:var(--sa-tint);border-radius:15px;padding:20px;min-height:245px;display:flex;flex-direction:column;min-width:0}
#school-workspace-panel .group-card-top{display:flex;align-items:center;justify-content:space-between}
#school-workspace-panel .group-icon{display:grid;place-items:center;width:40px;height:40px;background:var(--sa-tint);color:var(--sa-text);border-radius:11px;font-weight:800;flex-shrink:0}
#school-workspace-panel .badge{display:inline-block;border-radius:99px;padding:4px 10px;font-size:.73rem;font-weight:800;background:var(--sa-tint);color:var(--sa-text)}
#school-workspace-panel .group-card h3{font-size:1.2rem;margin:18px 0 5px;overflow-wrap:anywhere}
#school-workspace-panel .group-card p{margin:0;color:var(--sa-muted);font-size:.88rem}
#school-workspace-panel .group-card .group-tutors{margin-top:14px;line-height:1.5}
#school-workspace-panel .card-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:18px}
#school-workspace-panel .card-actions button{font-size:.86rem}
#school-workspace-panel .card-actions button.danger,#school-workspace-panel .roster-row button.danger{border-color:#c9564c;color:#a5372f}
#school-workspace-panel .empty{grid-column:1/-1;border:1px dashed #b9cbbc;background:var(--sa-tint);border-radius:12px;padding:32px;color:#596c61}
#school-workspace-panel .empty h3{margin:0 0 6px;color:#244b35}
#school-workspace-panel .search{display:flex;flex-direction:column;gap:6px;max-width:390px;width:100%;margin-bottom:16px;color:var(--sa-text);font-size:.85rem;font-weight:700}
#school-workspace-panel .search input,#school-workspace-panel .search select{border:1px solid var(--sa-line);border-radius:9px;padding:11px 12px;color:var(--sa-deep);background:white;width:100%}
#school-workspace-panel .roster{display:grid;gap:9px;max-width:100%}
#school-workspace-panel .roster-row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;padding:16px 18px;border:1px solid var(--sa-line);border-radius:11px}
#school-workspace-panel .roster-row>div{display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-width:0}
#school-workspace-panel .roster-row>div:first-child{display:grid;gap:3px}
#school-workspace-panel .roster-row strong{font-size:.95rem;overflow-wrap:anywhere}
#school-workspace-panel .roster-row small,#school-workspace-panel .roster-row span{color:var(--sa-muted);font-size:.83rem}
#school-workspace-panel .roster-row .badge{color:var(--sa-text)}
#school-workspace-panel .export-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;max-width:100%}
#school-workspace-panel .export-grid button{display:grid;gap:8px;text-align:left;padding:24px;border:1px solid var(--sa-line);border-radius:13px;background:var(--sa-tint);color:var(--sa-main)}
#school-workspace-panel .export-grid button strong{font-size:1.13rem}
#school-workspace-panel .export-grid button span{color:#617266;font-size:.9rem}
#school-workspace-panel .help{font-size:.83rem;line-height:1.5}
#school-workspace-panel .detail-stats{display:flex;flex-wrap:wrap;gap:12px}
#school-workspace-panel .detail-stats span{display:grid;background:var(--sa-tint);border-radius:10px;padding:15px;min-width:120px}
#school-workspace-panel .detail-stats b{font-size:1.4rem}
#school-workspace-panel .detail-stats small{color:#5a7161}
#school-workspace-panel .detail-row{display:flex;gap:10px;align-items:center;justify-content:space-between;border-bottom:1px solid #e6ece6;padding:10px 0}
#school-workspace-panel .invite-form{display:grid;grid-template-columns:1fr 1fr 1fr auto;align-items:end;gap:10px;margin:0 0 20px;max-width:100%}
#school-workspace-panel .invite-form label{display:grid;gap:6px;color:var(--sa-text);font-size:.85rem;font-weight:700;min-width:0}
#school-workspace-panel .invite-form input,#school-workspace-panel .invite-form select{border:1px solid var(--sa-line);border-radius:9px;padding:10px;color:var(--sa-deep);background:#fff;width:100%}
#school-workspace-panel .invite-form button{border:1px solid var(--sa-main);border-radius:9px;padding:10px 13px;font-weight:700}
#school-workspace-panel .transfer-list{display:grid;gap:10px;margin-top:18px}
#school-workspace-panel .transfer-row{border:1px solid var(--sa-line);border-radius:11px;padding:14px 16px;display:grid;gap:8px}
#school-workspace-panel .transfer-row-top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
#school-workspace-panel .transfer-undo-track{height:6px;border-radius:99px;background:var(--sa-tint);overflow:hidden}
#school-workspace-panel .transfer-undo-fill{height:100%;background:var(--sa-main);transform-origin:left;transition:transform 1s linear}
#school-workspace-panel .transfer-row.is-expired .transfer-undo-fill,#school-workspace-panel .transfer-row.is-undone .transfer-undo-fill{background:#b7c4bb}
#school-workspace-panel .transfer-form{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:end;margin-bottom:6px;max-width:100%}
#school-workspace-panel .transfer-form label{display:grid;gap:6px;color:var(--sa-text);font-size:.85rem;font-weight:700;min-width:0}
#school-workspace-panel .transfer-form input{border:1px solid var(--sa-line);border-radius:9px;padding:10px;color:var(--sa-deep);background:#fff;width:100%}
#school-workspace-panel{position:relative;min-height:120px}
/* The Students tab is #teacher-panel physically relocated here at runtime
   (see mountManagedAccountsTab in staff-access.js) - it keeps its own
   admin.css grid classes, just laid out in one column instead of the
   narrow+wide split that page uses elsewhere. */
#students-admin-panel{padding:0;border:0;background:none;box-shadow:none}
#school-workspace-panel .management-grid.roster-only{grid-template-columns:minmax(0,1fr)}
.workspace-loading{position:absolute;inset:0;display:none;align-items:center;justify-content:center;gap:12px;background:#f4f6f2cc;border-radius:18px;z-index:5;flex-direction:column}
.workspace-loading.is-visible{display:flex}
.workspace-loading .spinner{width:34px;height:34px;border-radius:50%;border:4px solid var(--sa-line);border-top-color:var(--sa-main);animation:workspace-spin .8s linear infinite}
.workspace-loading span{color:#3a5346;font-weight:700;font-size:.9rem}
@keyframes workspace-spin{to{transform:rotate(360deg)}}

/* Dialogs render in the top layer, outside #school-workspace-panel in the
   DOM, so they get their own scoped class rather than a descendant
   selector. */
.school-dialog{border:1px solid #d0ded2;border-radius:18px;box-shadow:0 20px 70px #153b3240;max-width:min(680px,calc(100vw - 28px));width:100%;padding:0;color:#173e2d;font-family:inherit}
.school-dialog::backdrop{background:#0b261a99}
.school-dialog .dialog-body{padding:28px;display:grid;gap:16px}
.school-dialog .dialog-body h2{margin:0}
.school-dialog .dialog-body h3{margin:0 0 10px}
.school-dialog .dialog-body p{margin:0;color:var(--sa-muted)}
.school-dialog .dialog-body label:not(.check-row){display:grid;gap:7px;color:#2c5038;font-weight:700}
.school-dialog .dialog-body input:not([type=checkbox]),.school-dialog .dialog-body select{border:1px solid var(--sa-line);border-radius:9px;padding:11px 12px;color:var(--sa-deep);background:white;width:100%}
.school-dialog .dialog-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:6px}
.school-dialog .dialog-actions button{border:1px solid var(--sa-line);background:white;color:var(--sa-main);border-radius:9px;padding:10px 14px;font-weight:700}
.school-dialog .dialog-actions .primary{background:var(--sa-main);color:white;border-color:var(--sa-main)}
.group-preview-dialog .dialog-body{max-height:min(82vh,760px);overflow-y:auto}
.group-preview-dialog .group-preview-sections{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.group-preview-dialog .group-preview-sections>section{min-width:0}
.group-preview-dialog .member-list{max-height:360px}
@media(max-width:600px){.group-preview-dialog .group-preview-sections{grid-template-columns:1fr}}
.school-dialog .assignment-columns{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.school-dialog .assignment-columns h3{font-size:1rem;letter-spacing:-.01em}
.school-dialog .assignment-columns>div>.help{margin-bottom:12px}
.school-dialog .assignment-columns .check-list{max-height:280px;overflow:auto;border:1px solid var(--sa-line);border-radius:10px;padding:6px;display:grid;gap:2px}
.school-dialog .check-row{display:flex;align-items:center;gap:10px;padding:9px 10px;font-size:.87rem;border-radius:8px;cursor:pointer}
.school-dialog .check-row:hover{background:var(--sa-tint)}
.school-dialog .check-row input[type=checkbox]{flex:0 0 auto;width:17px;height:17px;margin:0;accent-color:var(--sa-main)}
.school-dialog .check-row span{overflow-wrap:anywhere}
.school-dialog .assignment-columns .empty-note{padding:14px;color:var(--sa-muted);font-size:.85rem;line-height:1.5}
.school-dialog .field{display:grid;gap:6px;margin-top:12px}
.school-dialog .member-list{display:grid;gap:6px;max-height:180px;overflow:auto}
.school-dialog .member-list:empty::after{content:"Nobody yet.";color:#8a978f;font-size:.83rem;font-style:italic}
.school-dialog .member-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;border:1px solid var(--sa-line);border-radius:8px;background:var(--sa-tint)}
.school-dialog .member-row span{font-size:.85rem;overflow-wrap:anywhere}
.school-dialog .member-row small{display:block;color:var(--sa-muted);font-size:.75rem}
.school-dialog .member-row button{flex:0 0 auto;border:1px solid #c9564c;color:#a5372f;background:white;border-radius:7px;padding:5px 9px;font-size:.75rem;font-weight:700}
.school-dialog .member-search-results{display:grid;gap:6px;margin-top:8px}
.school-dialog .member-search-results:empty{margin-top:0}
.school-dialog .member-search-results .member-row button{border-color:var(--sa-main);color:var(--sa-main)}
.school-dialog .document-actions{display:flex;flex-wrap:wrap;gap:8px}
.school-dialog .document-actions button{border:1px solid var(--sa-line);border-radius:9px;background:var(--sa-tint);color:var(--sa-main);padding:9px 12px;font-weight:700}
.school-dialog .document-content{white-space:pre-wrap;word-break:break-word;max-height:65vh;overflow:auto;padding:18px;border-radius:9px;background:var(--sa-tint);color:#273b2e;font:inherit;line-height:1.55}

.undo-toast-region{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);display:grid;gap:8px;z-index:60;width:min(420px,calc(100vw - 32px))}
.undo-toast{background:var(--sa-deep);color:white;border-radius:12px;padding:13px 16px;display:flex;align-items:center;justify-content:space-between;gap:14px;box-shadow:0 14px 40px #0b261a55;overflow:hidden;position:relative}
.undo-toast span{font-size:.88rem}
.undo-toast button{background:#d8eaa7;color:var(--sa-deep);border:0;border-radius:8px;padding:7px 12px;font-weight:800;font-size:.82rem;white-space:nowrap}
.undo-toast button:disabled{opacity:.5;cursor:default}
.undo-toast-bar{position:absolute;left:0;bottom:0;height:3px;background:#d8eaa7;width:100%;transform-origin:left;transition:transform linear}

@media(max-width:650px){
  #school-workspace-panel .panel{padding:18px}
  #school-workspace-panel .section-head{flex-direction:column}
  #school-workspace-panel .roster-row{align-items:start;flex-direction:column}
  #school-workspace-panel .roster-row>div:first-child{display:flex;flex-direction:column}
  .school-dialog .dialog-body{padding:20px}
  .school-dialog .assignment-columns{grid-template-columns:1fr}
}
@media(max-width:800px){#school-workspace-panel .invite-form{grid-template-columns:1fr 1fr}}
@media(max-width:520px){#school-workspace-panel .invite-form{grid-template-columns:1fr}}