/* Middos dashboard appearance layer.
   IMPORTANT: this file is loaded AFTER the normal Middos styles.
   Light mode intentionally keeps the existing Middos design unchanged. */

html[data-middos-theme="light"]{color-scheme:light}

/* ---------- shared settings polish ---------- */
.settings-layout{align-items:start}
.settings-nav{gap:8px!important}
.settings-nav button{min-height:44px;padding:11px 13px!important;border-radius:10px!important;line-height:1.25}
.settings-pane .pane-heading{margin-bottom:20px}
.settings-pane .settings-form,.settings-pane form{gap:18px}
.school-module-grid{display:grid;gap:12px;margin:4px 0 18px}
.school-module-switch{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:flex-start;gap:12px;padding:14px;border:1px solid var(--line);border-radius:11px;background:var(--surface)}
.school-module-switch>input{margin-top:3px}
.school-module-switch>div{display:grid;gap:3px}
.school-module-switch strong{font-size:12px}
.school-module-switch small{color:var(--muted);font-weight:500;line-height:1.45}

.middos-appearance-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px}
.middos-appearance-option{appearance:none;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:12px;padding:14px;display:grid;grid-template-rows:56px auto auto;gap:7px;text-align:left;min-height:128px;box-shadow:none;transition:border-color .15s,background .15s,box-shadow .15s,transform .08s}
.middos-appearance-option:hover{border-color:var(--line-strong);background:var(--surface-2)}
.middos-appearance-option:active{transform:translateY(1px)}
.middos-appearance-option.active{border-color:var(--brand)!important;background:var(--brand-soft)!important;box-shadow:0 0 0 2px color-mix(in srgb,var(--brand) 15%,transparent)!important}
.middos-appearance-option strong{font-size:12px}
.middos-appearance-option span{font-size:10px;color:var(--muted);line-height:1.45}
.middos-theme-preview{position:relative;display:block;width:100%;height:56px;border:1px solid var(--line);border-radius:9px;overflow:hidden;background:#fff}
.middos-theme-preview:before{content:"";position:absolute;left:0;top:0;bottom:0;width:28%;background:#f0ebe2;border-right:1px solid #dfddd7}
.middos-theme-preview b:first-child{position:absolute;left:35%;top:12px;width:45%;height:8px;border-radius:99px;background:#d9dbe1}
.middos-theme-preview b:last-child{position:absolute;left:35%;right:9%;top:28px;bottom:9px;border-radius:6px;background:#f3f3f1;border:1px solid #e2e4ea}
.middos-theme-preview.dark{background:#171a1f;border-color:#333942}
.middos-theme-preview.dark:before{background:#121519;border-color:#333942}
.middos-theme-preview.dark b:first-child{background:#525b68}
.middos-theme-preview.dark b:last-child{background:#22262c;border-color:#3a414b}
.middos-theme-preview.system{background:linear-gradient(90deg,#fff 0 50%,#171a1f 50%)}
.middos-theme-preview.system:before{background:linear-gradient(90deg,#f0ebe2 0 50%,#121519 50%);border-color:#777}
.middos-theme-preview.system b:first-child{background:linear-gradient(90deg,#d9dbe1 0 50%,#525b68 50%)}
.middos-theme-preview.system b:last-child{background:linear-gradient(90deg,#f3f3f1 0 50%,#22262c 50%);border-color:#777}

.middos-integration-card{margin-bottom:16px;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--surface);display:grid;gap:13px}
.middos-integration-card header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.middos-integration-card h4{margin:2px 0 4px;font-size:14px}
.middos-integration-card p{margin:0;color:var(--muted);font-size:10px;line-height:1.5}
.middos-integration-card footer{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.middos-integration-status{display:inline-flex;align-items:center;min-height:24px;padding:0 9px;border-radius:999px;border:1px solid var(--line);font-size:9px;font-weight:800;color:var(--muted)}
.middos-integration-status.good{background:var(--green-soft);color:var(--green)}
.middos-integration-status.warn{background:var(--amber-soft);color:var(--amber)}

@media(max-width:860px){
  .settings-layout{grid-template-columns:1fr!important;gap:14px!important}
  .settings-nav{display:flex!important;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;padding:2px 1px 8px;gap:8px!important}
  .settings-nav::-webkit-scrollbar{display:none}
  .settings-nav button{flex:0 0 auto;white-space:nowrap;min-height:42px;padding:10px 13px!important;border:1px solid var(--line)!important;background:var(--surface)!important;box-shadow:none!important}
  .settings-nav button.active{border-color:var(--brand)!important;background:var(--brand-soft)!important;color:var(--brand-strong)!important}
  .settings-content{min-height:0!important}
  .settings-pane{padding:18px!important}
  .middos-appearance-options{grid-template-columns:1fr}
  .middos-appearance-option{grid-template-columns:82px 1fr;grid-template-rows:auto auto;min-height:92px;align-items:center}
  .middos-theme-preview{grid-row:1/3;height:62px}
}

/* ============================ DARK MODE ============================ */
html[data-middos-theme="dark"]{
  color-scheme:dark;

  /* legacy dashboard palette */
  --bg:#111318;
  --surface:#191c22;
  --surface-2:#20242b;
  --surface-3:#272c34;
  --ink:#f1f3f5;
  --muted:#a3aab4;
  --muted-2:#7f8792;
  --line:#2d323a;
  --line-strong:#3a414b;
  --brand:#7b87ef;
  --brand-strong:#a9b1ff;
  --brand-soft:#252a49;
  --blue:#8aa8ef;
  --blue-soft:#202b43;
  --amber:#e2b66f;
  --amber-soft:#382c1b;
  --red:#ef8d8d;
  --red-soft:#3a2023;
  --green:#82c9a2;
  --green-soft:#1d3327;
  --shadow-sm:0 1px 2px rgba(0,0,0,.24),0 7px 24px rgba(0,0,0,.16);
  --shadow-lg:0 22px 70px rgba(0,0,0,.42);

  /* current Middos brand palette */
  --middos-ink:#f1f3f5;
  --middos-ink-soft:#c8cdd4;
  --middos-blue:#7b87ef;
  --middos-blue-deep:#a9b1ff;
  --middos-blue-soft:#252a49;
  --middos-amber:#e2b66f;
  --middos-amber-soft:#382c1b;
  --middos-canvas:#111318;
  --middos-paper:#191c22;
  --middos-sand:#15181d;
  --middos-line:#30353d;
  --middos-line-cool:#353b45;
  --middos-muted:#9da5af;
  --middos-success:#82c9a2;
  --middos-danger:#ef8d8d;
}

html[data-middos-theme="dark"],
html[data-middos-theme="dark"] body,
html[data-middos-theme="dark"] #appView,
html[data-middos-theme="dark"] .app-view,
html[data-middos-theme="dark"] .workspace,
html[data-middos-theme="dark"] .content{
  background:var(--middos-canvas)!important;
  color:var(--middos-ink)!important
}

/* login/auth */
html[data-middos-theme="dark"] .auth-view,
html[data-middos-theme="dark"] .middos-login-view{background:linear-gradient(160deg,#101216 0%,#15181d 100%)!important;color:var(--middos-ink)!important}
html[data-middos-theme="dark"] .login-topbar{background:rgba(17,19,24,.94)!important;border-color:var(--middos-line)!important}
html[data-middos-theme="dark"] .login-support-link{color:var(--middos-muted)!important}
html[data-middos-theme="dark"] .middos-access-card,
html[data-middos-theme="dark"] .auth-card{background:var(--middos-paper)!important;border-color:var(--middos-line)!important;color:var(--middos-ink)!important;box-shadow:0 18px 54px rgba(0,0,0,.28)!important}
html[data-middos-theme="dark"] .middos-access-banner{background:linear-gradient(135deg,#242a49,#1a1d24)!important;border-color:var(--middos-line)!important;color:var(--middos-ink)!important}
html[data-middos-theme="dark"] .middos-access-banner *{color:inherit!important}
html[data-middos-theme="dark"] .middos-watermark{opacity:.035!important;color:#fff!important}

/* app shell */
html[data-middos-theme="dark"] .sidebar{background:var(--middos-sand)!important;border-color:var(--middos-line)!important}
html[data-middos-theme="dark"] .brand-lockup.middos-lockup{background:transparent!important}
html[data-middos-theme="dark"] .middos-wordmark strong{color:var(--middos-ink)!important}
html[data-middos-theme="dark"] .school-switcher{background:var(--middos-paper)!important;border-color:var(--middos-line)!important;color:var(--middos-ink)!important}
html[data-middos-theme="dark"] .school-monogram{background:var(--middos-blue-soft)!important;color:var(--middos-blue-deep)!important}
html[data-middos-theme="dark"] .nav-group>span{color:var(--middos-muted)!important}
html[data-middos-theme="dark"] .nav-item{color:#b5bbc3!important}
html[data-middos-theme="dark"] .nav-item i,
html[data-middos-theme="dark"] .nav-icon{color:#8f97a1!important}
html[data-middos-theme="dark"] .nav-item:hover{background:var(--surface-2)!important;color:var(--middos-ink)!important}
html[data-middos-theme="dark"] .nav-item.active{background:var(--middos-blue-soft)!important;color:var(--middos-blue-deep)!important}
html[data-middos-theme="dark"] .nav-item.active i,
html[data-middos-theme="dark"] .nav-item.active .nav-icon{color:var(--middos-blue-deep)!important}
html[data-middos-theme="dark"] .sidebar-bottom{border-color:var(--middos-line)!important}
html[data-middos-theme="dark"] .topbar{background:rgba(17,19,24,.92)!important;border-color:var(--middos-line)!important;color:var(--middos-ink)!important}
html[data-middos-theme="dark"] .topbar-title p{color:var(--middos-muted)!important}
html[data-middos-theme="dark"] .user-menu-button:hover{background:var(--surface-2)!important}
html[data-middos-theme="dark"] .user-avatar{background:#252a35!important;color:var(--middos-blue-deep)!important}

/* forms and controls */
html[data-middos-theme="dark"] input:not([type="checkbox"]):not([type="radio"]),
html[data-middos-theme="dark"] select,
html[data-middos-theme="dark"] textarea,
html[data-middos-theme="dark"] .secondary-action,
html[data-middos-theme="dark"] .secondary,
html[data-middos-theme="dark"] .button.secondary,
html[data-middos-theme="dark"] .icon-button,
html[data-middos-theme="dark"] .search-button{
  background:var(--surface)!important;
  color:var(--middos-ink)!important;
  border-color:var(--middos-line-cool)!important
}
html[data-middos-theme="dark"] input::placeholder,
html[data-middos-theme="dark"] textarea::placeholder{color:#747d88!important}
html[data-middos-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):focus,
html[data-middos-theme="dark"] select:focus,
html[data-middos-theme="dark"] textarea:focus{border-color:#7784e5!important;box-shadow:0 0 0 3px rgba(123,135,239,.15)!important}
html[data-middos-theme="dark"] label{color:#c7ccd2!important}
html[data-middos-theme="dark"] label small{color:var(--middos-muted)!important}
html[data-middos-theme="dark"] option{background:#191c22;color:#f1f3f5}
html[data-middos-theme="dark"] .button.primary,
html[data-middos-theme="dark"] .primary{background:var(--middos-blue)!important;border-color:var(--middos-blue)!important;color:#fff!important}
html[data-middos-theme="dark"] .button.primary:hover,
html[data-middos-theme="dark"] .primary:hover{background:#6977dd!important;border-color:#6977dd!important}

/* Settings — this specifically fixes the half-white screen from the screenshot */
html[data-middos-theme="dark"] .settings-layout{background:transparent!important}
html[data-middos-theme="dark"] .settings-nav{background:transparent!important}
html[data-middos-theme="dark"] .settings-nav button{background:transparent!important;color:var(--middos-muted)!important;border-color:transparent!important}
html[data-middos-theme="dark"] .settings-nav button:hover{background:var(--surface-2)!important;color:var(--middos-ink)!important}
html[data-middos-theme="dark"] .settings-nav button.active{background:var(--middos-blue-soft)!important;color:var(--middos-blue-deep)!important;border-color:#39416a!important}
html[data-middos-theme="dark"] .settings-content{background:var(--middos-paper)!important;border-color:var(--middos-line)!important;color:var(--middos-ink)!important}
html[data-middos-theme="dark"] .settings-pane{background:var(--middos-paper)!important;border-color:var(--middos-line)!important;color:var(--middos-ink)!important;box-shadow:none!important}
html[data-middos-theme="dark"] .settings-pane h2,
html[data-middos-theme="dark"] .settings-pane h3,
html[data-middos-theme="dark"] .settings-pane h4,
html[data-middos-theme="dark"] .settings-pane strong{color:var(--middos-ink)!important}
html[data-middos-theme="dark"] .settings-pane p,
html[data-middos-theme="dark"] .pane-heading p,
html[data-middos-theme="dark"] .settings-pane small{color:var(--middos-muted)!important}
html[data-middos-theme="dark"] .school-module-switch,
html[data-middos-theme="dark"] .integration-row,
html[data-middos-theme="dark"] .middos-integration-card,
html[data-middos-theme="dark"] .portal-invite-card,
html[data-middos-theme="dark"] .security-list>div,
html[data-middos-theme="dark"] .user-row{background:var(--surface)!important;border-color:var(--middos-line)!important;color:var(--middos-ink)!important}

/* core cards / lists */
html[data-middos-theme="dark"] .panel,
html[data-middos-theme="dark"] .summary-card,
html[data-middos-theme="dark"] .table-panel,
html[data-middos-theme="dark"] .card,
html[data-middos-theme="dark"] .record-card,
html[data-middos-theme="dark"] .empty-state,
html[data-middos-theme="dark"] .coverage-card{
  background:var(--middos-paper)!important;
  border-color:var(--middos-line)!important;
  color:var(--middos-ink)!important;
  box-shadow:none!important
}
html[data-middos-theme="dark"] .table-panel table,
html[data-middos-theme="dark"] .data-table,
html[data-middos-theme="dark"] table{color:var(--middos-ink)!important}
html[data-middos-theme="dark"] th{background:var(--surface-2)!important;color:var(--middos-muted)!important;border-color:var(--middos-line)!important}
html[data-middos-theme="dark"] td{background:var(--middos-paper)!important;border-color:var(--middos-line)!important;color:var(--middos-ink)!important}
html[data-middos-theme="dark"] tr:hover td{background:var(--surface-2)!important}
html[data-middos-theme="dark"] .loading-card::after{background:linear-gradient(90deg,#20242b 25%,#282d35 40%,#20242b 65%)!important;background-size:300% 100%!important}

/* enterprise dashboard */
html[data-middos-theme="dark"] .ep-dashboard-hero{background:linear-gradient(135deg,#222746 0%,#191c22 100%)!important;border-color:var(--middos-line)!important;border-left-color:var(--middos-blue)!important;color:var(--middos-ink)!important}
html[data-middos-theme="dark"] .ep-dashboard-hero *{color:inherit!important}
html[data-middos-theme="dark"] .ep-panel,
html[data-middos-theme="dark"] .ep-stat-grid article,
html[data-middos-theme="dark"] .ep-profile-hero,
html[data-middos-theme="dark"] .ep-table-card,
html[data-middos-theme="dark"] .ep-dashboard-children,
html[data-middos-theme="dark"] .ep-course-strip,
html[data-middos-theme="dark"] .ep-dashboard-children button,
html[data-middos-theme="dark"] .ep-course-strip button,
html[data-middos-theme="dark"] .ep-insight,
html[data-middos-theme="dark"] .ep-schedule-list article,
html[data-middos-theme="dark"] .ep-assignment-list article,
html[data-middos-theme="dark"] .ep-file-list article,
html[data-middos-theme="dark"] .ep-attendance-summary article,
html[data-middos-theme="dark"] .ep-announcement-preview article{
  background:var(--middos-paper)!important;
  border-color:var(--middos-line)!important;
  color:var(--middos-ink)!important;
  box-shadow:none!important
}
html[data-middos-theme="dark"] .ep-note,
html[data-middos-theme="dark"] .ep-form-note,
html[data-middos-theme="dark"] .ep-mini-stats div,
html[data-middos-theme="dark"] .ep-upcoming time,
html[data-middos-theme="dark"] .ep-file-list article>span{background:var(--surface-2)!important;border-color:var(--middos-line)!important;color:var(--middos-muted)!important}
html[data-middos-theme="dark"] .ep-tabs{background:var(--surface-2)!important;border-color:var(--middos-line)!important}
html[data-middos-theme="dark"] .ep-tabs button{color:var(--middos-muted)!important}
html[data-middos-theme="dark"] .ep-tabs button.active{background:var(--middos-paper)!important;color:var(--middos-ink)!important}
html[data-middos-theme="dark"] .ep-detail-grid{background:var(--middos-line)!important;border-color:var(--middos-line)!important}
html[data-middos-theme="dark"] .ep-detail{background:var(--middos-paper)!important;color:var(--middos-ink)!important}
html[data-middos-theme="dark"] .ep-table-card th,
html[data-middos-theme="dark"] .ep-ledger-table th{background:var(--surface-2)!important;color:var(--middos-muted)!important}
html[data-middos-theme="dark"] .ep-mobile-dock{background:rgba(25,28,34,.96)!important;border-color:var(--middos-line)!important;box-shadow:0 14px 35px rgba(0,0,0,.32)!important}
html[data-middos-theme="dark"] .ep-mobile-dock button{color:var(--middos-muted)!important}
html[data-middos-theme="dark"] .ep-mobile-dock button.active{color:var(--middos-blue-deep)!important}

/* dialogs / menus */
html[data-middos-theme="dark"] .floating-menu,
html[data-middos-theme="dark"] .search-dialog,
html[data-middos-theme="dark"] .modal,
html[data-middos-theme="dark"] .popover,
html[data-middos-theme="dark"] .dropdown-menu,
html[data-middos-theme="dark"] .user-menu{
  background:var(--middos-paper)!important;
  color:var(--middos-ink)!important;
  border-color:var(--middos-line)!important;
  box-shadow:0 18px 50px rgba(0,0,0,.34)!important
}
html[data-middos-theme="dark"] .floating-menu button,
html[data-middos-theme="dark"] .user-menu button{color:var(--middos-ink)!important}
html[data-middos-theme="dark"] .floating-menu button:hover,
html[data-middos-theme="dark"] .user-menu button:hover{background:var(--surface-2)!important}
html[data-middos-theme="dark"] .search-overlay,
html[data-middos-theme="dark"] .modal-backdrop{background:rgba(0,0,0,.66)!important}

/* Donorbox */
html[data-middos-theme="dark"] .dbx-hero,
html[data-middos-theme="dark"] .dbx-connect-callout,
html[data-middos-theme="dark"] .dbx-campaign-grid article,
html[data-middos-theme="dark"] .dbx-recurring-grid article,
html[data-middos-theme="dark"] .dbx-stewardship-list article,
html[data-middos-theme="dark"] .dbx-kpis article,
html[data-middos-theme="dark"] .dbx-panel{
  background:var(--middos-paper)!important;
  border-color:var(--middos-line)!important;
  color:var(--middos-ink)!important
}
html[data-middos-theme="dark"] .dbx-tabs{border-color:var(--middos-line)!important}
html[data-middos-theme="dark"] .dbx-tabs button{color:var(--middos-muted)!important}
html[data-middos-theme="dark"] .dbx-tabs button.active{background:var(--middos-paper)!important;color:var(--middos-ink)!important}

/* shared text */
html[data-middos-theme="dark"] .empty-inline,
html[data-middos-theme="dark"] .empty-state p,
html[data-middos-theme="dark"] .section-heading p,
html[data-middos-theme="dark"] .dashboard-heading p,
html[data-middos-theme="dark"] .helper-text,
html[data-middos-theme="dark"] .muted{color:var(--middos-muted)!important}
html[data-middos-theme="dark"] hr{border-color:var(--middos-line)!important}

@media(max-width:860px){
  html[data-middos-theme="dark"] .settings-nav button{background:var(--surface)!important;border-color:var(--middos-line)!important}
  html[data-middos-theme="dark"] .settings-nav button.active{background:var(--middos-blue-soft)!important;border-color:#434c7b!important;color:var(--middos-blue-deep)!important}
}

/* Middos calendar event drawer contrast repair — 2026-09-07 */
/* The drawer lives outside .app-view, so it must use the root theme variables. */
#enterpriseDrawerBackdrop {
  color: var(--ink);
}
#enterpriseDrawer {
  background: var(--surface) !important;
  color: var(--ink) !important;
  border-left: 1px solid var(--line) !important;
  box-sizing: border-box;
  min-width: 0;
}
#enterpriseDrawer > header {
  background: var(--surface) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
  gap: 16px;
}
#enterpriseDrawer > header > div {
  min-width: 0;
  flex: 1 1 auto;
}
#enterpriseDrawerTitle {
  color: var(--ink) !important;
  overflow-wrap: anywhere;
  line-height: 1.25;
}
#enterpriseDrawer .eyebrow {
  color: var(--brand-strong) !important;
}
#enterpriseDrawer [data-close-drawer] {
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  background: var(--surface-2) !important;
  color: var(--ink) !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px;
  display: grid;
  place-items: center;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
#enterpriseDrawer [data-close-drawer]:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 3px;
}
#enterpriseDrawerBody {
  background: var(--surface) !important;
  color: var(--ink) !important;
  min-width: 0;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}
#enterpriseDrawer .ep-event-detail {
  color: var(--ink) !important;
  overflow-wrap: anywhere;
}
#enterpriseDrawer .ep-event-detail h3 {
  color: var(--ink) !important;
  font-size: clamp(18px, 4vw, 22px);
  line-height: 1.35;
  margin: 24px 0 16px;
  overflow-wrap: anywhere;
}
#enterpriseDrawer .ep-event-detail p {
  color: var(--muted) !important;
  font-size: 14px;
  line-height: 1.6;
}
#enterpriseDrawer .ep-event-detail .ep-pill {
  background: var(--surface-2) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
  font-size: 11px;
  min-height: 26px;
  padding: 3px 10px;
}
#enterpriseDrawer .ep-event-detail .ep-note {
  background: var(--surface-2) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
#enterpriseDrawer .ep-event-detail .ep-note strong {
  color: var(--ink) !important;
}
#enterpriseDrawer .ep-event-detail .ep-note p {
  color: var(--muted) !important;
}
@media (max-width: 760px) {
  #enterpriseDrawer {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
  }
  #enterpriseDrawer > header {
    box-sizing: border-box;
    min-height: calc(76px + env(safe-area-inset-top));
    padding: calc(12px + env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) 12px max(16px, env(safe-area-inset-left));
  }
  #enterpriseDrawerBody {
    padding: 20px max(16px, env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
  }
}

/* Login contrast: external stylesheet required by the site's CSP. */
html .middos-login-view .middos-access-form-heading strong,
html .middos-login-view .login-form label,
html .middos-login-view .login-form label > span{color:var(--ink,#222833)!important}
html .middos-login-view .middos-access-form-heading span,
html .middos-login-view .middos-access-help span{color:var(--muted,#59616e)!important}
html .middos-login-view .middos-access-help a{color:#6b4fd3!important}
html[data-middos-theme="dark"] .middos-login-view .middos-access-form-heading strong,
html[data-middos-theme="dark"] .middos-login-view .login-form label,
html[data-middos-theme="dark"] .middos-login-view .login-form label > span{color:#f1edff!important}
html[data-middos-theme="dark"] .middos-login-view .middos-access-form-heading span,
html[data-middos-theme="dark"] .middos-login-view .middos-access-help span{color:#c7c3d4!important}
html[data-middos-theme="dark"] .middos-login-view .middos-access-help a{color:#c4b5fd!important}
html .middos-login-view .login-submit{background:#7055d4!important;color:#fff!important}
html .middos-login-view .login-submit:hover{background:#6044c4!important}

/* Sitewide responsive spacing and proportions pass. */
:root{--page-gutter:clamp(16px,3vw,36px);--section-gap:clamp(20px,3vw,32px)}
*,*::before,*::after{box-sizing:border-box}
.workspace{min-width:0}
.content{padding:var(--section-gap) var(--page-gutter) calc(var(--section-gap) + env(safe-area-inset-bottom))!important}
.section-heading,.dashboard-heading{gap:18px!important;margin-bottom:var(--section-gap)!important;align-items:flex-start}
.section-heading>div,.dashboard-heading>div{min-width:0}
.panel,.table-panel,.report-preview,.settings-pane{border-radius:14px!important}
.panel{padding:clamp(16px,2.2vw,24px)!important}
.panel-heading{gap:12px!important;align-items:flex-start}
.table-toolbar{gap:12px!important;padding:14px var(--page-gutter)!important;flex-wrap:wrap}
.table-scroll{overflow-x:auto}
.settings-layout{gap:var(--section-gap)!important}
.settings-content{min-width:0}
.form-grid{gap:16px!important}
.stack-form,.settings-form,.modal-form{gap:16px!important}
.button-row{gap:12px!important;flex-wrap:wrap}
@media(max-width:760px){
 .topbar{padding:12px max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left))!important;min-height:68px}
 .topbar-title h1{font-size:clamp(20px,6vw,28px)!important}
 .topbar-actions .search-button{display:none}
 .content{padding:20px 16px calc(28px + env(safe-area-inset-bottom))!important}
 .dashboard-heading,.section-heading{display:flex!important;flex-direction:column!important;gap:14px!important;margin-bottom:20px!important}
 .dashboard-heading .button,.section-heading .button{width:100%}
 .dashboard-heading>div:last-child,.section-actions{width:100%;display:grid;grid-template-columns:1fr;gap:10px}
 .summary-grid,.dashboard-grid,.report-grid{grid-template-columns:1fr!important;gap:14px!important}
 .panel{padding:16px!important}
 .panel-heading{flex-wrap:wrap}
 .table-panel{margin:0!important;border-radius:12px!important}
 .table-toolbar{padding:12px!important}
 .table-search{width:100%!important}
 .table-search input{min-width:0;width:100%}
 .settings-layout{display:block!important}
 .settings-nav{display:flex!important;overflow-x:auto!important;gap:8px!important;padding-bottom:10px!important;margin-bottom:16px!important;scrollbar-width:none}
 .settings-nav button{flex:0 0 auto!important}
 .settings-content{width:100%!important}
 .form-grid.two,.form-grid.three{grid-template-columns:1fr!important}
 .modal{width:calc(100% - 24px)!important;max-height:calc(100dvh - 24px)!important;margin:12px!important}
 .modal>header,.modal-form{padding-left:16px!important;padding-right:16px!important}
 .sidebar{width:min(86vw,320px)!important}
}
@media(min-width:761px) and (max-width:1100px){.content{padding-left:24px!important;padding-right:24px!important}.dashboard-grid{grid-template-columns:1fr!important}}

/* Dedicated phone navigation and touch layout. */
@media(max-width:760px){
 body{overflow-x:hidden}
 .workspace{width:100%;min-width:0}
 .sidebar{position:fixed!important;z-index:1000;inset:0 auto 0 0;height:100dvh!important;transform:translateX(-105%);transition:transform .22s ease;box-shadow:12px 0 35px rgba(0,0,0,.28);overflow-y:auto}
 body.menu-open .sidebar,.sidebar.open{transform:translateX(0)!important}
 .mobile-menu{display:inline-flex!important;width:42px;height:42px;align-items:center;justify-content:center;margin-right:10px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);font-size:20px}
 .topbar{position:sticky;top:0;z-index:50;background:var(--surface)!important;border-bottom:1px solid var(--line);gap:8px}
 .topbar-title{min-width:0;flex:1}
 .topbar-title>div{min-width:0}
 .topbar-title h1{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .user-menu-button{padding:5px!important;gap:0!important}
 .user-menu-button>span:not(.user-avatar),.user-menu-button>i{display:none!important}
 .user-avatar{width:36px!important;height:36px!important}
 .content{width:100%;padding:18px 14px 32px!important}
 .page{width:100%;min-width:0}
 .dashboard-heading h2{font-size:25px!important;line-height:1.15}
 .summary-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .summary-card{min-width:0!important;padding:14px!important}
 .summary-card strong{font-size:22px!important}
 .dashboard-grid{display:grid!important;grid-template-columns:1fr!important}
 .dashboard-grid>.panel{grid-column:1!important;width:100%!important;min-width:0}
 .list,.pipeline-chart{min-width:0;overflow:hidden}
 .table-scroll{margin:0 -2px;padding-bottom:6px}
 .table-scroll table{min-width:620px}
 .section-actions{display:flex!important;flex-direction:column;width:100%}
 .section-actions>*{width:100%!important}
 .nav-item{min-height:48px!important;padding:12px 14px!important}
 .sidebar-nav{padding-bottom:24px}
}
@media(max-width:420px){
 .summary-grid{grid-template-columns:1fr!important}
 .content{padding-left:12px!important;padding-right:12px!important}
 .panel{padding:14px!important}
}

@media(max-width:760px){
 .sidebar{position:fixed!important;inset:0 auto 0 0!important}
 .topbar-actions{display:flex!important;align-items:center!important;gap:8px!important}
 .topbar-actions .search-button{display:flex!important;align-items:center!important;justify-content:center!important;width:42px!important;height:42px!important;padding:0!important;font-size:0!important}
 .topbar-actions .search-button span:first-child{font-size:22px!important}
 .topbar-actions .search-button span:nth-child(2),.topbar-actions .search-button kbd{display:none!important}
 .topbar-actions .user-menu-button{display:flex!important}
 .mobile-bottom-nav{position:fixed!important;z-index:900!important;left:0!important;right:0!important;bottom:0!important;display:flex!important;align-items:stretch!important;justify-content:space-around!important;height:calc(64px + env(safe-area-inset-bottom))!important;padding:8px 8px env(safe-area-inset-bottom)!important;background:var(--surface)!important;border-top:1px solid var(--line)!important;box-shadow:0 -8px 24px rgba(0,0,0,.12)!important}
 .mobile-bottom-nav>*{flex:1 1 0!important;min-width:0!important}
 .content{padding-bottom:calc(92px + env(safe-area-inset-bottom))!important}
}

@media(max-width:760px){#mobileDock{position:fixed!important;z-index:900!important;left:0!important;right:0!important;bottom:0!important;display:flex!important;align-items:stretch!important;height:calc(68px + env(safe-area-inset-bottom))!important;padding:8px 8px env(safe-area-inset-bottom)!important;background:var(--surface)!important;border-top:1px solid var(--line)!important;box-shadow:0 -8px 24px rgba(0,0,0,.16)!important}#mobileDock>button{flex:1 1 0!important;min-width:0!important;min-height:52px!important} .content{padding-bottom:calc(98px + env(safe-area-inset-bottom))!important}}

@media(max-width:760px){#userMenu{position:fixed!important;top:72px!important;right:12px!important;z-index:2000!important;min-width:210px!important}.floating-menu{z-index:2000!important}.sidebar .sidebar-bottom{padding-bottom:calc(12px + env(safe-area-inset-bottom))!important;margin-bottom:0!important}.sidebar{padding-bottom:0!important}.sidebar-nav{margin-bottom:0!important}}

@media(max-width:760px){.ep-mobile-dock{left:0!important;right:0!important;bottom:0!important;height:calc(68px + env(safe-area-inset-bottom))!important;padding:8px 8px env(safe-area-inset-bottom)!important;border-radius:18px 18px 0 0!important;display:grid!important;gap:4px!important}.ep-mobile-dock button{min-height:52px!important}.content{padding-bottom:calc(86px + env(safe-area-inset-bottom))!important}#mobileMenu{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:42px!important;height:42px!important}.sidebar.open{z-index:1200!important}.sidebar.open~.workspace{filter:none!important}}

@media(max-width:760px){body:has(.sidebar.open) .ep-mobile-dock,body.menu-open .ep-mobile-dock{display:none!important}.ep-mobile-dock{bottom:0!important;margin-bottom:0!important;transform:none!important}.sidebar.open{height:100dvh!important;max-height:100dvh!important;overflow-y:auto!important}.sidebar.open .sidebar-bottom{margin-top:0!important;padding-bottom:calc(12px + env(safe-area-inset-bottom))!important}}

@media(max-width:760px){.dashboard-grid>.panel{min-height:0!important;height:auto!important}.dashboard-grid>.panel:has(.list:empty),.dashboard-grid>.panel:has(.pipeline-chart:empty){display:none!important}.dashboard-grid>.panel .list:empty{min-height:0!important}.dashboard-heading .button{min-height:52px!important}.ep-mobile-dock{padding-bottom:env(safe-area-inset-bottom)!important}}

@media(max-width:760px){.sidebar{display:flex!important;flex-direction:column!important}.sidebar-nav{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important}.sidebar-bottom{flex:0 0 auto!important}.sidebar-bottom .delivery-status{margin-top:10px!important}}

/* Final mobile visibility guards. */
#userMenu[hidden],#quickMenu[hidden]{display:none!important}
@media(max-width:760px){.ep-mobile-dock{position:fixed!important;inset:auto 0 0!important;margin:0!important;border-radius:18px 18px 0 0!important}.sidebar.open{position:fixed!important;inset:0 auto 0 0!important;margin:0!important;padding:0!important}.sidebar.open .sidebar-nav{padding-bottom:0!important;margin-bottom:0!important}.sidebar.open .sidebar-bottom{padding:12px 12px calc(12px + env(safe-area-inset-bottom))!important;margin:0!important}}

/* Deterministic dashboard startup and final mobile shell geometry. */
.middos-boot-screen{min-height:100dvh;display:grid;place-items:center;align-content:center;gap:8px;background:var(--surface,#fff);color:var(--ink,#222833);text-align:center;padding:32px}
.middos-boot-screen[hidden]{display:none!important}
.middos-boot-mark{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:#8069e8;color:#fff;font-size:24px;font-weight:800;margin-bottom:8px}
.middos-boot-screen strong{font-size:18px}.middos-boot-screen>span{color:var(--muted,#66716c);font-size:13px}
@media(max-width:760px){
  #mobileDock,.ep-mobile-dock{position:fixed!important;z-index:1200!important;left:0!important;right:0!important;bottom:0!important;width:100%!important;height:calc(68px + env(safe-area-inset-bottom))!important;margin:0!important;padding:6px 8px env(safe-area-inset-bottom)!important;border-radius:18px 18px 0 0!important;transform:none!important}
  #mobileDock button,.ep-mobile-dock button{min-height:52px!important;margin:0!important;padding:4px 2px!important}
  body:has(.sidebar.open) #mobileDock,body:has(.sidebar.open) .ep-mobile-dock{display:none!important}
  .sidebar.open{padding-bottom:0!important;margin:0!important}
  .sidebar.open .sidebar-nav{padding-bottom:0!important;margin-bottom:0!important}
  .sidebar.open .sidebar-bottom{margin:0!important;padding-bottom:calc(12px + env(safe-area-inset-bottom))!important}
}


/* Final drawer spacing and touch hit-area overrides (must be last because this sheet is reordered to the end). */
@media(max-width:760px){
  .sidebar.open{
    height:100dvh!important;
    max-height:100dvh!important;
    overflow-y:auto!important;
    padding-bottom:0!important;
  }
  .sidebar.open .sidebar-nav{
    flex:0 0 auto!important;
    min-height:0!important;
    overflow:visible!important;
    padding-bottom:0!important;
    margin-bottom:0!important;
  }
  .sidebar.open .sidebar-bottom{
    flex:0 0 auto!important;
    margin-top:12px!important;
    margin-bottom:0!important;
    padding-bottom:calc(12px + env(safe-area-inset-bottom))!important;
  }
  .topbar,
  .topbar-actions,
  .user-menu-button,
  #searchButton,
  #notificationButton{
    pointer-events:auto!important;
  }
}


/* Final brand cleanup: the interface uses Middos purple/blue accents throughout. */
:root{
  --green:var(--middos-blue)!important;
  --green-soft:var(--middos-blue-soft)!important;
}
.middos-access-form-heading strong{
  color:var(--middos-ink)!important;
}
.middos-access-form-heading span,
.middos-access-help span{
  color:var(--middos-muted)!important;
}
.middos-access-card .login-form input:focus{
  border-color:var(--middos-blue)!important;
  box-shadow:0 0 0 4px color-mix(in srgb,var(--middos-blue) 14%,transparent)!important;
}
.middos-access-banner{
  background:linear-gradient(125deg,var(--middos-blue-deep) 0%,var(--middos-blue) 62%,#4351be 100%)!important;
}
.login-submit,
.middos-access-card .login-submit{
  background:var(--middos-blue)!important;
  border-color:var(--middos-blue)!important;
}
.login-submit:hover,
.middos-access-card .login-submit:hover{
  background:var(--middos-blue-deep)!important;
  border-color:var(--middos-blue-deep)!important;
}
.delivery-status > span{
  background:var(--middos-blue)!important;
}


/* Keep the profile popover above the dock, sidebar scrim, and sticky topbar stacking contexts. */
#userMenu:not([hidden]){
  position:fixed!important;
  z-index:2147483000!important;
  pointer-events:auto!important;
  visibility:visible!important;
  opacity:1!important;
}
@media(max-width:760px){
  #userMenu:not([hidden]){
    top:calc(64px + env(safe-area-inset-top))!important;
    right:max(12px,env(safe-area-inset-right))!important;
    max-width:calc(100vw - 24px)!important;
  }
}


/* Profile portal is an explicit top-layer surface on every viewport. */
#userMenu[data-middos-portal="1"]:not([hidden]){
  display:block!important;
  position:fixed!important;
  z-index:2147483000!important;
  max-height:calc(100dvh - 24px)!important;
  overflow:auto!important;
  isolation:isolate!important;
  background:var(--surface,#fff)!important;
  border:1px solid var(--line,#dfe2e8)!important;
  box-shadow:0 22px 60px rgba(18,24,34,.28)!important;
}

/* Global dashboard normalization: keep every module on the same appearance tokens. */
html[data-middos-theme="dark"]{
  --canvas:#0f1115!important;--paper:#171a20!important;--surface:#171a20!important;
  --surface-2:#20242c!important;--line:#303640!important;--line-strong:#424b58!important;
  --ink:#f2f4f7!important;--muted:#a3acb8!important;--brand:#8995ff!important;
  --brand-soft:#252b52!important;--blue:#8995ff!important;--blue-deep:#b5bcff!important;
  --danger:#ff9a9a!important;--danger-soft:#3a2226!important;
  color-scheme:dark!important;
}
html[data-middos-theme="dark"] body,
html[data-middos-theme="dark"] .admin-main,
html[data-middos-theme="dark"] .admin-content,
html[data-middos-theme="dark"] .admin-view,
html[data-middos-theme="dark"] .settings-layout,
html[data-middos-theme="dark"] .settings-pane,
html[data-middos-theme="dark"] .panel,
html[data-middos-theme="dark"] .metric-card,
html[data-middos-theme="dark"] .school-row,
html[data-middos-theme="dark"] .hero-card,
html[data-middos-theme="dark"] .empty-state,
html[data-middos-theme="dark"] .archive-entry{
  background-color:var(--canvas)!important;color:var(--ink)!important;border-color:var(--line)!important;
}
html[data-middos-theme="dark"] .panel,
html[data-middos-theme="dark"] .metric-card,
html[data-middos-theme="dark"] .school-row,
html[data-middos-theme="dark"] .archive-entry{background:var(--paper)!important}
html[data-middos-theme="dark"] .hero-card{background:linear-gradient(135deg,#20284a,#191d2a)!important}
html[data-middos-theme="dark"] .admin-topbar{background:rgba(15,17,21,.92)!important;border-color:var(--line)!important}
html[data-middos-theme="dark"] .system-row,
html[data-middos-theme="dark"] .detail-list>div,
html[data-middos-theme="dark"] .compact-school-row{border-color:var(--line)!important}
html[data-middos-theme="dark"] input,
html[data-middos-theme="dark"] select,
html[data-middos-theme="dark"] textarea,
html[data-middos-theme="dark"] button:not(.nav-item){
  background:var(--paper);color:var(--ink);border-color:var(--line-strong)
}
html[data-middos-theme="dark"] input::placeholder,
html[data-middos-theme="dark"] textarea::placeholder{color:#7f8997}
html[data-middos-theme="dark"] .system-note,
html[data-middos-theme="dark"] .inline-message,
html[data-middos-theme="dark"] .mini-status,
html[data-middos-theme="dark"] .archive-entry-icon{background:var(--surface-2)!important;color:var(--ink)!important}
html[data-middos-theme="dark"] .school-action button.danger-action{background:#321f24!important;color:var(--danger)!important}
html[data-middos-theme="dark"] .empty-state{background:var(--surface-2)!important}
html[data-middos-theme="dark"] .admin-sidebar{border-right:1px solid var(--line)}
html[data-middos-theme="dark"] .middos-appearance-option{background:var(--paper)!important;color:var(--ink)!important;border-color:var(--line)!important}

/* Stable proportions across dashboard widths. */
.admin-content{width:100%;max-width:1480px;overflow-x:clip}
.panel,.metric-card,.school-row,.hero-card{min-width:0}
.panel-heading,.hero-card,.overview-grid,.schools-layout,.system-page-grid{min-width:0}
.panel-heading>*{min-width:0}
@media(min-width:1200px){.admin-content{padding-left:clamp(28px,3.5vw,52px);padding-right:clamp(28px,3.5vw,52px)}}
@media(max-width:760px){
  .admin-content{padding:18px 16px 96px!important}
  .panel{padding:18px!important;border-radius:14px!important}
  .hero-card{gap:18px!important;border-radius:14px!important}
  .panel-heading h3{font-size:18px!important}
  .metric-card{padding:16px!important}
  .metric-card strong{font-size:26px!important}
  .field-grid{gap:10px!important}
  .overview-grid,.schools-layout,.system-page-grid{gap:12px!important}
}

/* Dark-mode leak prevention: replace remaining hard-coded white enterprise/public surfaces. */
html[data-middos-theme="dark"] .ep-calendar-grid>section,
html[data-middos-theme="dark"] .ep-calendar-grid>section.outside,
html[data-middos-theme="dark"] .ep-calendar-grid>section.shabbat-day,
html[data-middos-theme="dark"] .ep-calendar-grid>section.today,
html[data-middos-theme="dark"] .ep-modal,
html[data-middos-theme="dark"] .ep-modal header,
html[data-middos-theme="dark"] .ep-modal-body,
html[data-middos-theme="dark"] .modal,
html[data-middos-theme="dark"] .modal header,
html[data-middos-theme="dark"] .modal-form,
html[data-middos-theme="dark"] .dropdown-menu,
html[data-middos-theme="dark"] .floating-menu,
html[data-middos-theme="dark"] .quick-menu,
html[data-middos-theme="dark"] .popover,
html[data-middos-theme="dark"] .user-menu,
html[data-middos-theme="dark"] #userMenu{
  background:var(--middos-paper)!important;color:var(--middos-ink)!important;border-color:var(--middos-line)!important;
}
html[data-middos-theme="dark"] .ep-calendar-grid>section.outside{background:var(--surface-2)!important;color:var(--middos-muted)!important}
html[data-middos-theme="dark"] .ep-calendar-grid>section.shabbat-day{background:#242537!important}
html[data-middos-theme="dark"] .ep-calendar-grid>section.today{box-shadow:inset 0 0 0 2px var(--middos-blue)!important}
html[data-middos-theme="dark"] .ep-modal *:not(button),
html[data-middos-theme="dark"] .modal *:not(button),
html[data-middos-theme="dark"] #userMenu *{border-color:var(--middos-line)!important}
html[data-middos-theme="dark"] .ep-modal input,
html[data-middos-theme="dark"] .ep-modal select,
html[data-middos-theme="dark"] .ep-modal textarea,
html[data-middos-theme="dark"] .modal input,
html[data-middos-theme="dark"] .modal select,
html[data-middos-theme="dark"] .modal textarea{background:var(--surface)!important;color:var(--middos-ink)!important}
html[data-middos-theme="dark"] .user-edit-fields,
html[data-middos-theme="dark"] .inline-user-field,
html[data-middos-theme="dark"] .user-edit-actions{background:transparent!important;color:var(--middos-ink)!important}
.user-row:has(.user-edit-fields){grid-template-columns:minmax(0,1fr) 150px 130px auto!important;align-items:end!important;gap:10px!important}
.user-edit-fields{display:grid;gap:4px;min-width:0}
.user-edit-fields strong{font-size:12px}.user-edit-fields small{color:var(--muted);font-size:10px;overflow:hidden;text-overflow:ellipsis}
.inline-user-field{display:grid;gap:4px;font-size:9px;color:var(--muted)}
.inline-user-field select{height:34px;font-size:11px;padding:0 8px}
.user-edit-actions{display:flex;gap:6px;align-items:end}
.user-edit-actions .row-action{height:34px}
@media(max-width:760px){.user-row:has(.user-edit-fields){grid-template-columns:1fr 1fr!important}.user-edit-fields{grid-column:1/-1}.user-edit-actions{grid-column:1/-1}}
