/* WBC Digital Exit Portal - Clean UI Baseline v2.0.25
   This file intentionally replaces legacy stacked login CSS.
   Login must match Background Preview v2.0.2, with Master SVG Branding. */

:root{
  --blue:#367588;
  --blue2:#4f8ea0;
  --teal:#367588;
  --teal-dark:#2b6070;
  --gold:#c9a227;
  --gold-soft:#f4ead0;
  --gold-dark:#9b7710;
  --ink:#1f2f33;
  --muted:#66777c;
  --line:#d7e1e4;
  --white:#fff;
  --green:#16794c;
  --greenbg:#e8f7ef;
  --amber:#8a6511;
  --amberbg:#f7efd8;
  --red:#b42318;
  --redbg:#feeceb;
  --shadow:0 10px 30px rgba(30,70,78,.12);
  --font:Inter, "Segoe UI", Arial, sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:var(--font);color:var(--ink)}
button,input,select,textarea{font:inherit}
.hidden{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.error-text{color:var(--red);min-height:16px;font-size:12px}
.btn{border:0;border-radius:8px;padding:10px 14px;font-weight:700;cursor:pointer}
.btn.primary{background:var(--gold);color:#203238}
.btn.secondary{background:#e6f1f3;color:var(--blue);border:1px solid #c8dde2}
.btn.danger{background:var(--redbg);color:var(--red);border:1px solid #f3c5c1}
.btn.emergency{background:#fff4d8;color:#7a5700;border:1px solid #dfbd55}
.btn.ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.35)}
.btn:disabled{opacity:.55;cursor:not-allowed}

/* === Approved Login Page / Background Preview v2.0.2 locked layout === */
.login-shell{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px 18px;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.12) 1.35px, transparent 1.7px) 0 0 / 22px 22px,
    linear-gradient(120deg, rgba(255,255,255,.055) 0 12%, transparent 12% 100%),
    linear-gradient(145deg, #367588 0%, #367588 45%, #5d93a2 100%);
}
.login-shell::before{
  content:"";
  position:absolute;
  inset:0;
  opacity:.16;
  pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg width='280' height='280' viewBox='0 0 280 280' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M38 34v44m-10-34v22m20-22v22M28 78h20v34c0 7-4 12-10 12s-10-5-10-12V78Z'/%3E%3Cpath d='M214 44c18 0 32 14 32 32s-14 32-32 32-32-14-32-32 14-32 32-32Z'/%3E%3Cpath d='M199 76h30M214 61v30'/%3E%3Cpath d='M75 208c0-16 13-29 29-29h7c16 0 29 13 29 29v20H75v-20Z'/%3E%3Cpath d='M104 164a18 18 0 1 0 0-36 18 18 0 0 0 0 36Z'/%3E%3Cpath d='M205 178h42v48h-42zM213 190h26M213 202h20M213 214h13'/%3E%3C/g%3E%3C/svg%3E");
  background-size:280px 280px;
  background-position:center;
}
.login-card-final{
  position:relative;
  z-index:1;
  width:min(480px, calc(100vw - 44px));
  margin:0 auto;
  padding:32px 42px 28px;
  border-radius:18px;
  border-top:4px solid var(--gold);
  background:#ffffff;
  box-shadow:0 22px 46px rgba(19,70,82,.28);
  overflow:hidden;
}

/* Master SVG Branding sizing for login */
.wbc-branding-login{
  width:min(330px, 100%)!important;
  min-height:64px!important;
  margin:0 auto 18px!important;
  padding:9px 20px!important;
  background:#ffffff!important;
  border-radius:8px!important;
  box-shadow:0 6px 20px rgba(17,54,62,.06)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.wbc-branding-login .wbc-logo-svg{
  width:100%!important;
  max-height:52px!important;
  height:auto!important;
  display:block!important;
  shape-rendering:geometricPrecision!important;
  text-rendering:geometricPrecision!important;
}

.login-title{
  margin:0;
  text-align:center;
  font-size:28px;
  line-height:1.2;
  color:#1f2f33;
  font-weight:800;
  letter-spacing:-.01em;
}
.login-title-accent{display:flex;align-items:center;justify-content:center;gap:8px;margin:15px 0 26px}
.login-title-accent span{width:92px;height:1px;background:rgba(201,162,39,.55)}
.login-title-accent b{width:8px;height:8px;background:transparent;border:1.5px solid var(--gold);transform:rotate(45deg);border-radius:1px}

.login-form-final{display:grid;gap:10px;margin:0}
.login-field-label{display:block;margin:0;color:#17282d;font-size:13px;font-weight:800;line-height:1.25}
.login-field{
  position:relative;
  display:flex;
  align-items:center;
  width:100%;
  min-height:48px;
  height:48px;
  margin:0 0 8px;
  border:1px solid #c7d5d9;
  border-radius:8px;
  background:#fff;
  overflow:hidden;
  box-shadow:none;
}
.login-field:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px rgba(54,117,136,.16)}
.login-field input{
  width:100%;
  height:48px;
  min-height:48px;
  line-height:48px;
  padding:0 54px 0 16px;
  border:0;
  outline:0;
  background:transparent;
  color:#34454a;
  font-family:var(--font);
  font-size:16px;
  font-weight:400;
  letter-spacing:0;
  box-shadow:none;
}
.login-field input::placeholder{color:#697980;opacity:1;font-weight:400}
.field-icon,.password-eye{
  position:absolute;
  top:50%;
  right:16px;
  left:auto;
  transform:translateY(-50%);
  width:22px;
  height:22px;
  min-width:22px;
  min-height:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  margin:0;
  border:0;
  background:transparent;
  line-height:1;
  z-index:2;
}
.field-icon::before,.password-eye::before,.field-icon::after,.password-eye::after{content:none!important;display:none!important}
.field-icon{color:#5b3491;pointer-events:none}
.password-eye{color:#697980;cursor:pointer}
.field-icon svg,.password-eye svg{width:20px;height:20px;display:block;fill:currentColor;flex:none}
.password-eye:hover{color:var(--blue)}
.forgot-row{display:flex;justify-content:flex-end;margin:-2px 0 16px}
.forgot-link{border:0;background:transparent;color:#075d6d;font-size:13px;font-weight:800;text-decoration:none;cursor:pointer;padding:0}
.forgot-link:hover{text-decoration:underline}
.login-signin-btn{
  width:100%;
  height:48px;
  border-radius:8px;
  background:var(--blue);
  color:#fff;
  font-size:15px;
  font-weight:800;
  box-shadow:0 13px 24px rgba(54,117,136,.22);
}
.login-signin-btn:hover{filter:brightness(1.04)}
.login-error{margin:0;text-align:center;min-height:16px}
.login-or{display:flex;align-items:center;gap:14px;margin:26px 0 18px;color:#64767b}
.login-or span{height:1px;background:#d9e1e4;flex:1}
.login-or b{font-size:12px;font-weight:700}
.microsoft-login-btn{
  width:100%;
  height:46px;
  border-radius:7px;
  border:1px solid #c7d5d9;
  background:#fff;
  color:#222;
  font-size:14px;
  font-weight:800;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  cursor:pointer;
}
.microsoft-login-btn:hover{background:#f7fbfb}
.ms-logo{width:17px;height:17px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:2px}
.ms-logo i:nth-child(1){background:#f25022}.ms-logo i:nth-child(2){background:#7fba00}.ms-logo i:nth-child(3){background:#00a4ef}.ms-logo i:nth-child(4){background:#ffb900}
.login-card-rule{margin:24px 0 14px;border:0;height:1px;background:#dce4e6}
.login-security{display:flex;justify-content:center;align-items:center;gap:24px;font-size:10px;color:#66777c;margin:0}
.login-security span{color:var(--gold);font-weight:900;margin-right:4px}
.login-footer{position:static;width:auto;margin:16px 0 0;padding:0;border:0;text-align:center;color:#66777c;font-size:10px;line-height:1.4;white-space:normal}
.login-note{position:static;margin:14px auto 0;max-width:370px;text-align:center;color:#7e8d91;font-size:9.5px;line-height:1.45}
.access-source-panel{display:grid;grid-template-columns:minmax(0,1fr) 108px;gap:12px;align-items:center;margin:16px 0 0;padding:12px;border:1px solid #c8dde2;border-radius:10px;background:#f7fbfb}.access-source-copy{min-width:0}.access-source-kicker{display:block;color:var(--gold-dark);font-size:9px;font-weight:900;letter-spacing:.11em;text-transform:uppercase}.access-source-panel h2{margin:3px 0 5px;color:var(--teal-dark);font-size:13px}.access-source-identity,.access-source-screen,.access-qr-notice{margin:0;color:var(--muted);font-size:10px;line-height:1.4}.access-source-screen{margin-top:2px}.access-qr-notice{margin-top:7px}.access-portal-link{display:block;overflow:hidden;margin-top:6px;color:var(--blue);font-size:10px;font-weight:750;text-overflow:ellipsis;white-space:nowrap}.access-qr-wrap{display:grid;min-height:96px;place-items:center}.access-qr-image{width:96px;height:96px;padding:4px;border-radius:6px;background:#fff;box-shadow:0 1px 4px rgba(43,96,112,.13)}

/* Portal/workspace styles retained for post-login pages */
.portal{min-height:100vh;background:linear-gradient(180deg,#e5eff0 0%,#f7fbfb 50%,#eaf3f3 100%)}
.topbar{height:70px;background:var(--blue);border-bottom:3px solid var(--gold);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 22px;position:sticky;top:0;z-index:10}
.brand-row{display:flex;gap:16px;align-items:center}.brand-row.compact strong{display:block;font-size:18px}.brand-row.compact span{display:block;font-size:11px;opacity:.88;margin-top:2px}
.portal-brand-row .wbc-branding{justify-content:flex-start}.portal-brand-row .wbc-branding-header{margin:0;background:transparent;box-shadow:none;padding:0;min-height:auto}.portal-brand-row .wbc-branding-header .wbc-logo-svg{width:190px;max-width:100%}
.user-area{display:flex;gap:14px;align-items:center;font-size:13px}
.portal-body{display:grid;grid-template-columns:230px 1fr;min-height:calc(100vh - 70px)}
.sidebar{background:#fff;border-right:1px solid var(--line);padding:18px 12px}.sidebar nav{display:grid;gap:5px}
.nav-btn{width:100%;text-align:left;border:0;background:transparent;padding:10px 12px;border-radius:8px;color:#334155;cursor:pointer;font-weight:650}
.nav-btn.active,.nav-btn:hover{background:var(--gold-soft);color:var(--teal-dark);box-shadow:inset 3px 0 0 var(--gold)}
.main{padding:24px;min-width:0}
.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}.page-head h2{margin:0 0 4px;font-size:24px}.page-head p{margin:0;color:var(--muted);font-size:13px}.actions{display:flex;gap:8px;flex-wrap:wrap}
.panel{background:#fff;border:1px solid var(--line);border-radius:11px;padding:16px;box-shadow:0 2px 8px rgba(16,49,85,.03);margin-bottom:16px}.panel h3{margin:0 0 12px;font-size:16px}.compact-note{font-size:12px;color:var(--muted)}
.dashboard-insights{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}
.insight-panel{position:relative;margin:0;padding:20px;border-width:2px;box-shadow:0 12px 28px rgba(43,96,112,.10);overflow:hidden}
.exit-status-highlight{border-color:#9fc7d0;background:linear-gradient(145deg,#fff 0%,#f4fafb 100%)}
.sla-performance-highlight{border-color:#dfc66f;background:linear-gradient(145deg,#fff 0%,#fffaf0 100%)}
.insight-panel::before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:var(--teal)}
.insight-panel.sla-performance-highlight::before{background:var(--gold)}
.insight-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px}
.insight-heading h3{margin:3px 0 0;font-size:20px;color:var(--teal-dark)}
.insight-kicker{color:var(--gold-dark);font-size:10px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.insight-total{padding:7px 10px;border-radius:999px;background:var(--teal);color:#fff;font-size:12px;white-space:nowrap}
.insight-stats{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.insight-stats span{display:grid;min-width:96px;padding:7px 9px;border-radius:8px;background:#edf6f7;color:var(--muted);font-size:10px;text-align:right}
.insight-stats b{color:var(--teal-dark);font-size:18px;line-height:1.1}.insight-stats .breach-count{background:var(--redbg);color:var(--red)}.insight-stats .breach-count b{color:var(--red)}
.insight-panel .chart-row{padding:5px 0;margin:5px 0}.insight-panel .bar{height:18px}.insight-panel .chart-num{font-size:14px;color:var(--teal-dark)}
.exit-status-pie-layout{display:grid;grid-template-columns:minmax(170px,.8fr) minmax(190px,1fr);align-items:center;gap:14px}.exit-status-pie{display:block;width:100%;max-width:210px;height:190px;margin:auto;overflow:visible}.exit-status-pie-slice{cursor:pointer;stroke:#fff;stroke-width:2;transition:transform .15s ease,filter .15s ease;transform-origin:90px 90px}.exit-status-pie-slice:hover,.exit-status-pie-slice:focus,.exit-status-pie-slice.is-active{filter:brightness(.9);outline:none;transform:scale(1.035)}.exit-status-pie-completed{fill:var(--teal)}.exit-status-pie-progress{fill:var(--blue2)}.exit-status-pie-action{fill:#d97706}.exit-status-pie-draft{fill:#94a3b8}.exit-status-pie-centre{fill:#fff}.exit-status-pie-total,.exit-status-pie-caption{text-anchor:middle;pointer-events:none}.exit-status-pie-total{font-size:25px;font-weight:850;fill:var(--teal-dark)}.exit-status-pie-caption{font-size:10px;fill:var(--muted);text-transform:uppercase;letter-spacing:.08em}.exit-status-legend{display:grid;gap:7px}.exit-status-segment{display:grid;grid-template-columns:10px 1fr auto;align-items:center;gap:8px;width:100%;padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);font:inherit;text-align:left;cursor:pointer}.exit-status-segment:hover,.exit-status-segment:focus-visible,.exit-status-segment[aria-pressed="true"]{border-color:var(--teal);background:#f1fafb;outline:none}.exit-status-segment i{width:10px;height:10px;border-radius:50%}.exit-status-segment span{font-size:12px}.exit-status-segment strong{font-size:16px;color:var(--teal-dark)}.exit-status-summary{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:2px 0 13px;padding:12px 14px;border:1px solid #a9d2d7;border-left:4px solid var(--teal);border-radius:8px;background:#f1fafb}.exit-status-summary>div{display:grid;gap:2px}.exit-status-summary strong{color:var(--teal-dark);font-size:15px}.exit-status-summary span:not(.insight-kicker){font-size:12px;color:var(--muted)}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:9px;background:#fff}.data-table{width:100%;border-collapse:collapse;white-space:nowrap;font-size:12px}.data-table th{background:var(--teal);color:#fff;text-align:left;padding:9px 10px;border-bottom:1px solid var(--line);font-size:11px;text-transform:uppercase;letter-spacing:.03em}.data-table td{padding:9px 10px;border-bottom:1px solid #edf1f5;vertical-align:middle}.data-table tr:last-child td{border-bottom:0}
.link-btn{border:0;background:transparent;color:var(--blue);font-weight:800;padding:0;cursor:pointer}.status{display:inline-flex;align-items:center;border-radius:999px;padding:4px 8px;font-size:10px;font-weight:800;letter-spacing:.02em}.status.green{background:var(--greenbg);color:var(--green)}.status.amber{background:var(--amberbg);color:var(--amber)}.status.red{background:var(--redbg);color:var(--red)}.status.blue{background:#e9f2fc;color:var(--blue)}
.progress{width:110px;height:7px;background:#e8edf3;border-radius:99px;overflow:hidden;display:inline-block;vertical-align:middle;margin-right:6px}.progress>span{height:100%;display:block;background:linear-gradient(90deg,var(--blue2),var(--gold))}
.chart-row{display:flex;align-items:center;gap:10px;margin:9px 0}.chart-row .chart-label{width:120px;font-size:12px;color:#475569}.bar{height:16px;background:#e9eff6;border-radius:4px;overflow:hidden;flex:1}.bar span{display:block;height:100%;background:linear-gradient(90deg,var(--blue2),var(--gold));min-width:2px}.chart-num{width:44px;text-align:right;font-weight:700;font-size:12px}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.form-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.full{grid-column:1/-1}.toolbar{display:flex;gap:8px;align-items:end;flex-wrap:wrap;margin-bottom:12px}.toolbar label{min-width:130px;flex:1}
input,select,textarea{width:100%;padding:10px 12px;border:1px solid #c9d5e3;border-radius:8px;background:#fff;color:var(--ink)}
textarea{min-height:90px;resize:vertical}input:focus,select:focus,textarea:focus{outline:2px solid #9ec9f5;outline-offset:1px}
.template-guidance{display:flex;align-items:center;gap:12px;padding:12px 14px;margin-bottom:14px;border:1px solid #b9d7d9;border-radius:9px;background:#f2fbfb;color:var(--teal-dark)}
.template-guidance span{font-size:12px;color:var(--muted)}
.selected-template-summary{display:grid;gap:3px;padding:10px 12px;margin:2px 0 12px;border-left:3px solid var(--gold);background:var(--gold-soft);border-radius:6px}
.selected-template-summary span{font-size:12px;color:var(--muted)}
.template-value-grid{padding:14px;border:1px solid var(--line);border-radius:9px;background:#f8fbff}
.required-mark{display:inline-block;margin-left:5px;color:var(--red);font-size:10px;font-weight:800;text-transform:uppercase}
.email-body-editor{min-height:300px;font-family:var(--font);line-height:1.55;white-space:pre-wrap}
.placeholder-panel{padding:14px;border:1px solid var(--line);border-radius:9px;background:#fbfdff}.placeholder-panel h3{margin:0 0 3px}
.placeholder-selector{display:grid;grid-template-columns:minmax(260px,1fr) auto auto;gap:10px;align-items:end;margin-top:12px}
.custom-placeholder-row{display:grid;grid-template-columns:1.2fr 1fr auto auto;gap:10px;align-items:end;padding:10px 0;border-bottom:1px solid #e5ebf2}.custom-placeholder-row:last-child{border-bottom:0}
.placeholder-row-actions{display:flex;gap:8px;align-items:center;min-height:40px}.placeholder-row-actions .remove-placeholder{color:var(--red)}
.check-row{display:flex!important;align-items:center;gap:8px;min-height:40px}.check-row input{width:auto;min-width:16px}
.department-summary.has-admin-override{border-left:4px solid var(--gold)}
.department-summary-actions{display:flex;gap:7px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.admin-override-note{display:grid;gap:3px;margin:12px 0;padding:11px 13px;border:1px solid #e5c762;border-radius:8px;background:#fff8e6;color:#72530a;font-size:12px}.admin-override-note strong{font-size:13px}.emergency-signature-note{padding:10px 12px;border-radius:8px;background:#fff8e6;color:#72530a;font-size:12px}
.emergency-editor-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}.emergency-editor-head h2{margin:3px 0}.emergency-editor-head p{margin:0;color:var(--muted)}.emergency-kicker{color:var(--red);font-size:10px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.emergency-warning{margin-bottom:16px}.emergency-item-table textarea{min-width:260px;min-height:58px}.emergency-item-table select{min-width:150px}
.modal{position:fixed;inset:0;background:rgba(11,23,39,.58);display:grid;place-items:center;padding:20px;z-index:100}.modal-card{position:relative;background:#fff;border-radius:12px;width:min(1100px,96vw);max-height:92vh;overflow:auto;padding:24px;box-shadow:var(--shadow)}.modal-close{position:absolute;right:12px;top:8px;border:0;background:transparent;font-size:28px;color:#667085;cursor:pointer}
.toast{position:fixed;right:20px;bottom:20px;background:#172033;color:#fff;padding:12px 16px;border-radius:8px;box-shadow:var(--shadow);z-index:120;max-width:420px}.toast.error{background:#8f1d18}
.danger-note{background:var(--redbg);color:var(--red);padding:10px 12px;border-radius:8px;font-size:12px}.success-note{background:var(--greenbg);color:var(--green);padding:10px 12px;border-radius:8px;font-size:12px}

@media(max-width:1000px){
  .portal-body{grid-template-columns:190px 1fr}
  .dashboard-insights{grid-template-columns:1fr}
  .exit-status-pie-layout{grid-template-columns:1fr}
  .custom-placeholder-row{grid-template-columns:1fr 1fr}
  .placeholder-row-actions{grid-column:1/-1}
  .placeholder-selector{grid-template-columns:1fr 1fr}
  .placeholder-selector label{grid-column:1/-1}
}
@media(max-width:720px){
  .login-shell{padding:12px}
  .login-card-final{width:min(460px, calc(100vw - 24px));padding:28px 30px 24px}
  .wbc-branding-login{width:min(300px,100%)!important}
  .login-title{font-size:25px}
  .login-security{gap:12px;flex-wrap:wrap}
  .portal-body{display:block}
  .sidebar{position:static;border-right:0;border-bottom:1px solid var(--line)}
  .sidebar nav{display:flex;overflow:auto}
  .nav-btn{white-space:nowrap}
  .main{padding:16px}
  .form-grid,.form-grid.three{grid-template-columns:1fr}
  .placeholder-selector{grid-template-columns:1fr}
  .placeholder-selector label{grid-column:auto}
  .custom-placeholder-row{grid-template-columns:1fr}
  .placeholder-row-actions{grid-column:auto}
  .template-guidance{align-items:flex-start;flex-direction:column}
  .insight-heading,.emergency-editor-head{flex-direction:column}.insight-stats{justify-content:flex-start}.department-summary-actions{justify-content:flex-start}
  .exit-status-summary{align-items:flex-start;flex-direction:column}
  .topbar{padding:0 12px}
  .user-area #userLabel{display:none}
  .access-source-panel{grid-template-columns:1fr}.access-qr-wrap{min-height:0}.access-qr-image{width:116px;height:116px}
}


/* v2.0.10 - Username field alignment hard fix.
   Removes legacy username glyph/icon overlap and aligns placeholder text cleanly. */
.login-form-final label.login-field:first-of-type .field-icon,
.login-form-final label.login-field:first-of-type .user-field-icon,
.login-form-final .username-field .field-icon,
.login-form-final .username-field .user-field-icon {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.login-form-final label.login-field:first-of-type .field-icon::before,
.login-form-final label.login-field:first-of-type .field-icon::after,
.login-form-final label.login-field:first-of-type .user-field-icon::before,
.login-form-final label.login-field:first-of-type .user-field-icon::after {
  content: "" !important;
  display: none !important;
}

#loginUsername,
.login-form-final label.login-field:first-of-type input {
  padding-left: 16px !important;
  padding-right: 16px !important;
  text-indent: 0 !important;
  transform: none !important;
  letter-spacing: normal !important;
  word-spacing: normal !important;
  line-height: 48px !important;
  vertical-align: middle !important;
}

#loginUsername::placeholder,
.login-form-final label.login-field:first-of-type input::placeholder {
  color: #697980 !important;
  opacity: 1 !important;
  text-indent: 0 !important;
  transform: none !important;
}


/* v2.0.10 - FINAL LOGIN PAGE ALIGNMENT BASELINE
   Purpose: force the running browser page to line up exactly with the approved preview_v2.0 final login page.
   This section intentionally overrides any older stacked login CSS. */

html,
body,
body.wbc-login-page,
body.login-final-v205 {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
}

#loginView.login-shell,
.login-shell {
  min-height: 100vh !important;
  width: 100vw !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px 18px !important;
}

.login-card-final {
  width: 480px !important;
  max-width: calc(100vw - 44px) !important;
  margin: 0 auto !important;
  padding: 32px 42px 28px !important;
  border-radius: 18px !important;
  border-top: 4px solid var(--gold, #c9a227) !important;
  overflow: hidden !important;
}

/* Logo block must remain centered and use the master SVG only. */
.login-card-final [data-branding],
.login-card-final .wbc-branding-login {
  width: 330px !important;
  max-width: 100% !important;
  min-height: 64px !important;
  margin: 0 auto 18px !important;
  padding: 9px 20px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.login-card-final .wbc-logo-svg,
.login-card-final [data-branding] svg {
  width: 100% !important;
  height: auto !important;
  max-height: 52px !important;
  display: block !important;
  shape-rendering: geometricPrecision !important;
  text-rendering: geometricPrecision !important;
}

/* Field alignment matches the final preview. */
.login-form-final {
  width: 100% !important;
  margin: 0 !important;
  display: grid !important;
  gap: 10px !important;
}

.login-field-label {
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
}

.login-form-final .login-field {
  width: 100% !important;
  height: 48px !important;
  min-height: 48px !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  display: block !important;
  position: relative !important;
  border-radius: 8px !important;
}

/* Username field: no icon, no glyph, no overlap. */
.login-form-final label.login-field:first-of-type .field-icon,
.login-form-final label.login-field:first-of-type .user-field-icon,
#loginUsername ~ .field-icon,
#loginUsername ~ .user-field-icon {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Also suppress any browser/legacy pseudo glyph around the Username input. */
.login-form-final label.login-field:first-of-type::before,
.login-form-final label.login-field:first-of-type::after,
#loginUsername::before,
#loginUsername::after {
  content: none !important;
  display: none !important;
}

#loginUsername,
#loginPassword {
  width: 100% !important;
  height: 48px !important;
  line-height: 48px !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-indent: 0 !important;
  transform: none !important;
  letter-spacing: normal !important;
  word-spacing: normal !important;
  font-size: 16px !important;
  font-weight: 400 !important;
}

#loginUsername {
  padding: 0 16px !important;
}

#loginPassword {
  padding: 0 54px 0 16px !important;
}

#loginUsername::placeholder,
#loginPassword::placeholder {
  color: #697980 !important;
  opacity: 1 !important;
  text-indent: 0 !important;
  transform: none !important;
  font-weight: 400 !important;
}

/* Password eye remains aligned to the right. */
.password-eye,
.login-form-final .password-eye {
  position: absolute !important;
  top: 50% !important;
  right: 16px !important;
  left: auto !important;
  transform: translateY(-50%) !important;
  width: 22px !important;
  height: 22px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Footer stays inside card and aligned like preview. */
.login-card-final .login-footer,
.login-card-final .login-note {
  position: static !important;
  width: auto !important;
  max-width: 100% !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  text-align: center !important;
}

.login-card-final .login-footer {
  margin: 16px 0 0 !important;
}

.login-card-final .login-note {
  margin: 14px auto 0 !important;
  max-width: 370px !important;
}

@media (max-width: 560px) {
  .login-card-final {
    width: min(460px, calc(100vw - 24px)) !important;
    padding: 28px 30px 24px !important;
  }
  .login-card-final [data-branding],
  .login-card-final .wbc-branding-login {
    width: min(300px, 100%) !important;
  }
}


/* v2.0.10 - Attractive Username & Password Fields with Lovota font support
   No font file is bundled. If Lovota is installed locally or placed as licensed web font,
   the browser will use it; otherwise it falls back to Segoe UI. */
:root{
  --wbc-auth-font:"Lovota","Segoe UI",Arial,sans-serif;
  --wbc-field-bg:#fbfdfe;
  --wbc-field-bg-focus:#ffffff;
  --wbc-field-border:#c8d7db;
  --wbc-field-border-focus:#367588;
  --wbc-field-shadow:0 10px 22px rgba(54,117,136,.08);
  --wbc-field-shadow-focus:0 0 0 4px rgba(54,117,136,.13), 0 14px 28px rgba(54,117,136,.10);
}

body.lovota-auth .login-title,
body.lovota-auth .login-field-label,
body.lovota-auth .login-field input,
body.lovota-auth .forgot-link,
body.lovota-auth .login-signin-btn,
body.lovota-auth .microsoft-login-btn,
body.lovota-auth .login-security,
body.lovota-auth .login-footer,
body.lovota-auth .login-note{
  font-family:var(--wbc-auth-font) !important;
}

body.lovota-auth .login-field-label{
  font-size:13px !important;
  font-weight:800 !important;
  letter-spacing:.015em !important;
  color:#18333a !important;
  margin-bottom:2px !important;
}

body.lovota-auth .login-field{
  height:52px !important;
  min-height:52px !important;
  border:1px solid var(--wbc-field-border) !important;
  border-radius:12px !important;
  background:linear-gradient(180deg,#fff,var(--wbc-field-bg)) !important;
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset, var(--wbc-field-shadow) !important;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease, background .18s ease !important;
  overflow:hidden !important;
}

body.lovota-auth .login-field::after{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  bottom:0 !important;
  width:4px !important;
  background:linear-gradient(180deg,#c9a227,#e7c75a) !important;
  opacity:.42 !important;
  transition:opacity .18s ease,width .18s ease !important;
  display:block !important;
}

body.lovota-auth .login-field:focus-within{
  border-color:var(--wbc-field-border-focus) !important;
  background:var(--wbc-field-bg-focus) !important;
  box-shadow:var(--wbc-field-shadow-focus) !important;
  transform:translateY(-1px) !important;
}

body.lovota-auth .login-field:focus-within::after{
  opacity:1 !important;
  width:5px !important;
}

body.lovota-auth #loginUsername,
body.lovota-auth #loginPassword{
  height:52px !important;
  line-height:52px !important;
  font-size:16px !important;
  font-weight:500 !important;
  color:#20363d !important;
  background:transparent !important;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  text-indent:0 !important;
  letter-spacing:.005em !important;
}

body.lovota-auth #loginUsername{
  padding:0 18px 0 18px !important;
}

body.lovota-auth #loginPassword{
  padding:0 58px 0 18px !important;
}

body.lovota-auth #loginUsername::placeholder,
body.lovota-auth #loginPassword::placeholder{
  color:#6f8288 !important;
  opacity:1 !important;
  font-weight:400 !important;
  letter-spacing:.005em !important;
}

body.lovota-auth .password-eye{
  right:14px !important;
  width:32px !important;
  height:32px !important;
  border-radius:999px !important;
  background:#f2f7f8 !important;
  color:#5d6c72 !important;
  box-shadow:inset 0 0 0 1px #d7e3e6 !important;
  transition:background .16s ease,color .16s ease,box-shadow .16s ease !important;
}

body.lovota-auth .password-eye:hover,
body.lovota-auth .password-eye:focus-visible{
  background:#e7f1f3 !important;
  color:#367588 !important;
  box-shadow:inset 0 0 0 1px #b9cfd5 !important;
}

body.lovota-auth .password-eye svg{
  width:18px !important;
  height:18px !important;
}

body.lovota-auth .login-signin-btn{
  height:50px !important;
  border-radius:12px !important;
  letter-spacing:.015em !important;
  background:linear-gradient(135deg,#367588 0%,#087986 100%) !important;
  box-shadow:0 16px 26px rgba(54,117,136,.24) !important;
}

body.lovota-auth .login-signin-btn:hover{
  filter:brightness(1.05) !important;
  transform:translateY(-1px) !important;
}

body.lovota-auth .forgot-link{
  color:#075d6d !important;
  font-weight:800 !important;
}

/* Hard safety: username field must never show an overlapping icon/glyph. */
body.lovota-auth .username-auth-field .field-icon,
body.lovota-auth .username-auth-field .user-field-icon,
body.lovota-auth .username-auth-field::before{
  display:none !important;
  content:none !important;
  visibility:hidden !important;
}


/* v2.0.10 - Final login controls activation
   Adds non-disruptive interaction states while preserving v2.0.6 Lovota login design. */
.login-signin-btn.is-loading,
.microsoft-login-btn.is-loading {
  cursor: wait !important;
  opacity: .82 !important;
}
.login-signin-btn.is-loading::after {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-left: 8px;
  border: 2px solid rgba(255,255,255,.45);
  border-top-color: #fff;
  border-radius: 50%;
  vertical-align: -2px;
  animation: wbc-spin .8s linear infinite;
}
@keyframes wbc-spin { to { transform: rotate(360deg); } }
.caps-lock-warning {
  margin: -2px 0 8px !important;
  padding: 6px 10px !important;
  border-radius: 8px !important;
  background: rgba(201,162,39,.13) !important;
  color: #7a5d0c !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
}
.login-error.info {
  color: #367588 !important;
}
.login-error.success {
  color: #16794c !important;
}
.password-eye[aria-pressed="true"] {
  color: #367588 !important;
}


/* v2.0.10 - Configuration-safe deployment marker
   This patch is ClientApp-only and must not change server port, .env, server.js, database, or scripts.
   Target live port remains 8082 as per deployment configuration. */
body.login-final-v2010::after,
body.login-final-v2012::after {
  content: "";
  display: none;
}


/* v2.0.10 - Post Login Separate Page Mode
   After successful login, portal must render as a new full page.
   Login must not remain above the portal or require scroll-down navigation. */

html.wbc-portal-active,
body.wbc-portal-page-mode {
  width: 100% !important;
  height: 100vh !important;
  min-height: 100vh !important;
  overflow: hidden !important;
  background: #eef5f6 !important;
}

body.wbc-portal-page-mode #loginView {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

body.wbc-portal-page-mode #portalView,
#portalView:not(.hidden) {
  display: flex !important;
  flex-direction: column !important;
  width: 100vw !important;
  height: 100vh !important;
  min-height: 100vh !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 50 !important;
  overflow: hidden !important;
  background: linear-gradient(180deg,#e5eff0 0%,#f7fbfb 50%,#eaf3f3 100%) !important;
}

body.wbc-portal-page-mode .topbar,
#portalView:not(.hidden) .topbar {
  flex: 0 0 70px !important;
}

body.wbc-portal-page-mode .portal-body,
#portalView:not(.hidden) .portal-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: calc(100vh - 70px) !important;
  overflow: hidden !important;
}

body.wbc-portal-page-mode .sidebar,
#portalView:not(.hidden) .sidebar {
  height: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

body.wbc-portal-page-mode .main,
#portalView:not(.hidden) .main {
  height: 100% !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  scroll-behavior: smooth !important;
}

body.wbc-login-page-mode #portalView {
  display: none !important;
}

body.wbc-login-page-mode #loginView {
  display: flex !important;
}

/* Keep modal and toast above both login and portal pages. */
.modal {
  z-index: 200 !important;
}

.toast {
  z-index: 220 !important;
}

/* v2.0.12 - physical login/workspace page separation.
   index.html contains only loginView; workspace.html contains only portalView. */
body[data-view="login"] {
  min-height: 100vh !important;
  overflow-y: auto !important;
}

body[data-view="workspace"] {
  height: 100vh !important;
  min-height: 100vh !important;
  overflow: hidden !important;
}

body[data-view="workspace"] #portalView {
  display: flex !important;
  visibility: visible !important;
}

.nav-btn[aria-current="page"] {
  background: var(--gold-soft) !important;
  color: var(--teal-dark) !important;
  box-shadow: inset 3px 0 0 var(--gold) !important;
}

.server-control-grid{display:grid !important;grid-template-columns:minmax(0,1.65fr) minmax(360px,0.95fr) !important;gap:18px !important;align-items:stretch !important;width:100% !important}
.server-control-main{min-width:0}
.server-perf-card{border:1px solid var(--line);border-radius:10px;background:#fbfdff;padding:12px;min-width:0;min-height:210px;display:flex;flex-direction:column;justify-content:center;box-sizing:border-box;visibility:visible !important}
.server-perf-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:4px}
.server-perf-head strong:first-child{display:block;font-size:13px;color:var(--ink)}
.server-perf-head span{display:block;margin-top:2px;font-size:10px;color:var(--muted)}
.server-perf-value{font-size:15px;color:var(--teal-dark);white-space:nowrap}
.server-perf-pie{display:block;width:100%;height:156px;margin:1px auto 4px;overflow:visible}
.server-perf-pie-node{fill:var(--teal)}
.server-perf-pie-other{fill:var(--gold)}
.server-perf-pie-free{fill:#dce9ed}
.server-perf-legend{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin:0 2px 4px}
.server-perf-legend span{display:grid;grid-template-columns:9px 1fr;align-items:center;column-gap:4px;font-size:9px;color:var(--muted)}
.server-perf-legend i{width:8px;height:8px;border-radius:50%;grid-row:span 2}.server-perf-legend b{grid-column:2;color:var(--teal-dark);font-size:10px}
.server-perf-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:9px;margin-top:-2px}
@media (max-width:900px){.server-control-grid{grid-template-columns:1fr !important}.server-perf-card{min-height:180px}}

.server-perf-build{font-size:10px;font-weight:700;color:var(--muted);text-align:right;margin-bottom:2px}.server-perf-empty{min-height:128px;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:11px;border:1px dashed var(--line);border-radius:8px;margin-top:6px}

/* v2.0.31: Read-only Server Performance pie chart occupies the right-hand column. */
.server-control-grid{display:grid !important;grid-template-columns:minmax(0,1fr) minmax(380px,0.95fr) !important;gap:18px !important;align-items:stretch !important;width:100% !important;}
.server-control-main{min-width:0 !important;}
.server-control-main .detail-grid{display:grid;grid-template-columns:1fr;gap:4px;margin-top:13px}
.server-control-main .detail-box{display:flex;align-items:baseline;gap:8px;min-width:0;padding:3px 0;border:0;background:transparent;box-shadow:none}
.server-control-main .detail-box span{font-weight:650;color:#334155;white-space:nowrap}
.server-control-main .detail-box span::after{content:' -';color:var(--muted);font-weight:500}
.server-control-main .detail-box strong{min-width:0;overflow-wrap:anywhere;color:var(--teal-dark)}
.server-perf-card{display:flex !important;visibility:visible !important;opacity:1 !important;min-height:250px !important;background:#fbfdff !important;align-self:stretch !important;justify-content:flex-start !important;}
.server-perf-card #serverPerfChart{display:block;min-height:180px;flex:1;}
@media (max-width:900px){.server-control-grid{grid-template-columns:1fr !important;}}

/* v2.0.33: Department-owner checklist for IT, Administration, and all configured departments. */
.dept-body{min-height:100vh;margin:0;background:linear-gradient(180deg,#e7f1f2 0%,#f8fbfb 48%,#eef5f5 100%);color:var(--ink)}
.topbar.standalone{position:sticky;top:0;z-index:20;display:flex;min-height:68px;align-items:center;padding:0 28px;border-bottom:3px solid var(--gold);background:var(--teal);box-shadow:0 4px 14px rgba(13,76,88,.18)}
.topbar.standalone .brand-row{color:#fff}.topbar.standalone .brand-row span{display:block;color:#d8edef;font-size:11px}.topbar.standalone .wbc-mark{color:#fff}
.dept-shell{width:min(1180px,calc(100% - 32px));margin:24px auto 56px}.dept-shell>.panel{margin-bottom:16px}.dept-loading{min-height:120px;display:grid;place-items:center;color:var(--muted);font-weight:700}
.dept-hero{overflow:hidden;border-top:4px solid var(--gold)}.dept-head{display:flex;align-items:flex-start;justify-content:space-between;gap:22px}.dept-head h1{margin:4px 0 6px;color:var(--teal-dark);font-size:clamp(23px,3vw,34px);line-height:1.15}.dept-head p{margin:0;color:var(--muted)}.dept-kicker{color:var(--gold-dark);font-size:10px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}.dept-badges{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}.dept-details{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:20px 0 14px}.dept-details .detail-box{display:grid;gap:3px;min-width:0;padding:10px 12px;border:1px solid #d6e3e6;border-radius:9px;background:#f8fbfb}.dept-details .detail-box span{color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase}.dept-details .detail-box strong{min-width:0;overflow-wrap:anywhere;color:var(--teal-dark)}
.checklist-progress{display:grid;grid-template-columns:auto minmax(120px,1fr) auto;align-items:center;gap:12px;padding:11px 13px;border-radius:10px;background:#f0f7f8}.checklist-progress strong{color:var(--teal-dark)}.checklist-progress span{color:var(--muted);font-size:11px}.checklist-progress>b{color:var(--teal-dark)}.checklist-progress-track{height:9px;overflow:hidden;border-radius:999px;background:#dbe8eb}.checklist-progress-track>span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--teal),var(--gold));transition:width .2s ease}
.checklist-heading{align-items:flex-start;margin-bottom:14px}.checklist-heading h2,.submit-panel h2{margin:0 0 4px;color:var(--teal-dark)}.checklist-list{display:grid;gap:12px}.checklist-row{display:grid;grid-template-columns:minmax(220px,1.1fr) minmax(280px,1fr) minmax(240px,1.15fr);gap:14px;align-items:start;padding:15px;border:1px solid #cbdde1;border-radius:11px;background:#fff;box-shadow:0 3px 10px rgba(43,96,112,.06)}.checklist-row.is-pending{border-left:4px solid var(--gold)}.checklist-item-header{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:9px;align-items:start}.checklist-number{display:grid;width:28px;height:28px;place-items:center;border-radius:50%;background:var(--teal);color:#fff;font-size:12px;font-weight:900}.checklist-item-name{display:block;padding:6px 0;color:var(--ink);line-height:1.35}.owner-added-label{display:block;margin-top:3px;color:var(--blue);font-size:9px;font-weight:800;text-transform:uppercase}.item-name{min-width:0}
.checklist-status-group{display:flex;flex-wrap:wrap;gap:7px;margin:0;padding:0;border:0}.checklist-status-group legend{width:100%;margin-bottom:3px;color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase}.status-check{position:relative;display:inline-flex;align-items:center;cursor:pointer}.status-check input{position:absolute;opacity:0;pointer-events:none}.status-check span{display:inline-flex;align-items:center;gap:6px;padding:7px 9px;border:1px solid #c9d8dc;border-radius:8px;background:#f8fbfb;color:#455b62;font-size:11px;font-weight:750}.status-check span::before{content:'';width:14px;height:14px;border:2px solid #9bb0b5;border-radius:4px;background:#fff;box-sizing:border-box}.status-check input:checked+span{border-color:var(--teal);background:#e8f5f3;color:var(--teal-dark)}.status-check input:checked+span::before{border-color:var(--teal);background:var(--teal);box-shadow:inset 0 0 0 3px #fff}.status-check.is-action input:checked+span{border-color:#bd5b55;background:var(--redbg);color:var(--red)}.status-check.is-action input:checked+span::before{border-color:var(--red);background:var(--red)}.status-check.is-na input:checked+span{border-color:#778a91;background:#eef2f3;color:#455b62}.status-check.is-na input:checked+span::before{border-color:#66777c;background:#66777c}.status-check input:disabled+span{cursor:not-allowed;opacity:.78}
.checklist-comment{min-width:0}.checklist-comment>span{float:right;color:var(--muted);font-size:9px}.checklist-comment .required-mark{color:var(--red)}.checklist-comment textarea{width:100%;min-height:72px;margin-top:5px;box-sizing:border-box}.locked-notice{margin:0 0 14px}.checklist-panel.is-locked .checklist-row{background:#f8fbfb}.submit-panel{display:grid;grid-template-columns:minmax(230px,1fr) minmax(260px,1fr);gap:18px;align-items:end}.signature-field{grid-column:2}.checklist-actions{grid-column:1/-1;justify-content:flex-end}
.archive-section{margin-top:14px;border:1px solid var(--line);border-radius:9px;background:#f8fbfb}.archive-section summary{cursor:pointer;padding:11px 13px;color:var(--teal-dark);font-size:12px;font-weight:800}.archive-section[open] summary{border-bottom:1px solid var(--line)}.archive-section .table-wrap{border:0;border-radius:0 0 9px 9px}
@media(max-width:900px){.dept-shell{width:min(100% - 20px,760px);margin-top:14px}.dept-head{flex-direction:column}.dept-badges{justify-content:flex-start}.dept-details{grid-template-columns:repeat(2,minmax(0,1fr))}.checklist-row{grid-template-columns:1fr}.submit-panel{grid-template-columns:1fr}.signature-field,.checklist-actions{grid-column:1}.checklist-actions{justify-content:flex-start}}
@media(max-width:560px){.topbar.standalone{padding:0 14px}.dept-shell{width:calc(100% - 14px)}.dept-details{grid-template-columns:1fr}.checklist-progress{grid-template-columns:1fr auto}.checklist-progress-track{grid-column:1/-1;grid-row:2}.checklist-item-header{grid-template-columns:28px minmax(0,1fr)}.checklist-item-header .remove-item{grid-column:2;justify-self:start}.checklist-status-group{display:grid;grid-template-columns:1fr}.status-check span{width:100%;box-sizing:border-box}.checklist-actions .btn{width:100%}}

/* v2.0.34: Refined alignment and presentation for the department-owner workspace. */
.topbar.standalone .brand-row{width:min(1180px,calc(100% - 32px));margin:0 auto;gap:12px}
.topbar.standalone .brand-row>div:last-child{display:grid;gap:2px;line-height:1.15}
.dept-shell>.panel{padding:22px;border:1px solid rgba(123,157,165,.28);border-radius:14px;box-shadow:0 10px 28px rgba(24,74,84,.08)}
.dept-hero{background:linear-gradient(135deg,#fff 0%,#fbfdfd 70%,#f3f9f9 100%)}
.dept-head{align-items:center}.dept-badges{align-items:center}
.dept-details .detail-box{min-height:64px;align-content:center;padding:12px 14px;border-radius:10px}
.checklist-heading{display:flex;justify-content:space-between;gap:18px}.checklist-heading .actions{flex:0 0 auto;align-items:center}
.checklist-row{grid-template-columns:minmax(220px,1.1fr) minmax(310px,1fr) minmax(250px,1.15fr);column-gap:22px;padding:18px}
.checklist-status-group{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:8px}
.status-check{width:100%}.status-check span{justify-content:center;width:100%;min-height:40px;box-sizing:border-box;text-align:center}
.checklist-comment{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 8px;font-weight:700;color:var(--teal-dark)}
.checklist-comment>span{float:none;justify-self:end;font-weight:600}.checklist-comment textarea{grid-column:1/-1;margin-top:2px;line-height:1.45;resize:vertical}
.submit-panel{padding:22px;background:linear-gradient(135deg,#fff 0%,#f6fafb 100%)}
.signature-field input{margin-top:6px}.checklist-actions{gap:10px}
.dept-shell button:focus-visible,.dept-shell input:focus-visible,.dept-shell textarea:focus-visible{outline:3px solid rgba(204,161,24,.35);outline-offset:2px}
@media(max-width:1000px){.checklist-row{grid-template-columns:1fr;row-gap:16px}.checklist-status-group{max-width:620px}}
@media(max-width:560px){.topbar.standalone .brand-row{width:100%}.dept-shell>.panel{padding:16px;border-radius:12px}.checklist-heading{display:grid}.checklist-heading .actions{justify-content:flex-start}.checklist-status-group{grid-template-columns:1fr}.dept-head h1{font-size:24px}.checklist-row{padding:14px}.submit-panel{padding:16px}}

/* v2.0.35: Selectable, paginated department invitation history. */
.invite-history-head{align-items:center;gap:16px;margin-bottom:14px}.invite-history-head h3{margin:0 0 4px}.invite-history-head .btn{flex:0 0 auto}
.selection-count{display:inline-grid;min-width:20px;height:20px;margin-left:6px;padding:0 5px;place-items:center;border-radius:999px;background:rgba(255,255,255,.22);font-size:10px}
.invite-table-summary{display:flex;justify-content:space-between;gap:12px;margin:0 2px 8px;color:var(--muted);font-size:11px;font-weight:700}
.invite-table .invite-select-cell{width:42px;text-align:center}.invite-table input[type="checkbox"]{width:16px;height:16px;margin:0;accent-color:var(--teal);cursor:pointer}.invite-table input[type="checkbox"]:disabled{cursor:not-allowed;opacity:.5}
.invite-table td{vertical-align:middle}.invite-table .compact-note{margin-top:2px}.invite-loading{padding:18px 4px;text-align:center}
.table-pagination{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:12px}.table-pagination>span{min-width:110px;text-align:center;color:var(--muted);font-size:11px}.table-pagination strong{color:var(--teal-dark)}
@media(max-width:720px){.invite-history-head{display:grid}.invite-history-head .btn{width:100%}.invite-table-summary{display:grid;gap:3px}.table-pagination{justify-content:space-between}.table-pagination .btn{min-width:86px}}

/* v2.0.36: Initiator off-boarding and Compliance Training workspaces. */
.initiator-workspace-tabs{display:inline-flex;gap:6px;padding:5px;margin:0 0 16px;background:#e7eef5;border:1px solid #cfdae6;border-radius:12px}
.initiator-tab{border:0;background:transparent;color:#35516a;font:inherit;font-weight:750;padding:10px 18px;border-radius:9px;cursor:pointer}
.initiator-tab:hover{background:#f7fafc}.initiator-tab.active{background:#0b5263;color:#fff;box-shadow:0 5px 14px #0b526329}
.training-create-panel{border-top:4px solid #c9a227}.training-subject-preview{align-self:end;min-height:73px}.training-subject-preview strong{font-size:.9rem;line-height:1.35}.training-subject-editor{display:flex;gap:10px;align-items:center;margin-top:7px}.training-subject-editor input{flex:1;min-width:0}.training-subject-editor .actions{flex-wrap:nowrap}
.training-assignment-table td{vertical-align:top}.training-assignment-table .compact-note{margin-top:4px}
@media(max-width:720px){.initiator-workspace-tabs{display:grid;grid-template-columns:1fr 1fr;width:100%}.initiator-tab{padding:10px 8px}.training-template-field{grid-column:auto}.training-subject-preview{min-height:auto}.training-subject-editor{align-items:stretch;flex-direction:column}.training-subject-editor .actions{justify-content:flex-start}}

/* v2.0.37: Post-login module selection for Off-Boarding and Compliance Training. */
.module-selector-shell{position:relative;isolation:isolate;overflow:hidden;max-width:1080px;margin:30px auto;padding:36px;border:1px solid rgba(11,82,99,.14);border-radius:26px;background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(240,247,250,.94));box-shadow:0 22px 55px rgba(11,43,92,.08)}.module-selector-shell::before{content:'';position:absolute;inset:0;z-index:-2;background:linear-gradient(rgba(11,82,99,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(11,82,99,.045) 1px,transparent 1px),radial-gradient(circle at 15% 15%,rgba(0,160,220,.12),transparent 30%),radial-gradient(circle at 88% 80%,rgba(201,162,39,.12),transparent 28%);background-size:30px 30px,30px 30px,auto,auto}.module-selector-shell::after{content:'';position:absolute;inset:14px;z-index:-1;border:1px solid rgba(201,162,39,.22);border-radius:19px;pointer-events:none}.module-selector-intro{text-align:center;max-width:720px;margin:0 auto 34px}.module-selector-intro::after{content:'◆';display:flex;align-items:center;justify-content:center;gap:12px;width:210px;margin:22px auto 0;color:#c9a227;font-size:11px;background:linear-gradient(90deg,transparent 0 45%,#c9a227 45% 55%,transparent 55%);background-size:100% 1px;background-position:center;background-repeat:no-repeat}.module-selector-intro .eyebrow{display:inline-block;margin-bottom:8px;color:#a57d08;font-size:11px;font-weight:850;letter-spacing:.22em;text-transform:uppercase}.module-selector-intro h2{margin:0;color:var(--navy);font-family:Georgia,'Times New Roman',serif;font-size:36px;letter-spacing:.015em}.module-selector-intro p{max-width:650px;margin:12px auto 0;color:var(--muted);line-height:1.6}.module-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.module-choice-card{position:relative;overflow:hidden;display:grid;grid-template-columns:76px 1fr;gap:20px;min-height:270px;padding:42px 30px 30px;text-align:left;border:1px solid #d6e0ea;border-radius:18px;background:linear-gradient(150deg,rgba(255,255,255,.98),rgba(245,250,251,.95));color:var(--text);cursor:pointer;box-shadow:0 14px 32px rgba(11,43,92,.09);transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}.module-choice-card::before{content:'';position:absolute;right:-45px;bottom:-65px;width:180px;height:180px;border:1px solid rgba(0,160,220,.14);border-radius:50%;box-shadow:0 0 0 24px rgba(0,160,220,.035),0 0 0 48px rgba(0,160,220,.025)}.module-choice-card::after{content:'';position:absolute;left:0;bottom:0;width:0;height:3px;background:linear-gradient(90deg,var(--teal),#00a0dc,#c9a227);transition:width .28s ease}.module-choice-card:hover,.module-choice-card:focus-visible{transform:translateY(-5px);box-shadow:0 22px 46px rgba(11,43,92,.17),0 0 0 1px rgba(0,160,220,.12);border-color:#8bb6c2;outline:none}.module-choice-card:hover::after,.module-choice-card:focus-visible::after{width:100%}.module-choice-card.training{border-top:5px solid #c9a227}.module-choice-card.offboarding{border-top:5px solid var(--teal)}.module-choice-card.training::before{border-color:rgba(201,162,39,.18);box-shadow:0 0 0 24px rgba(201,162,39,.04),0 0 0 48px rgba(201,162,39,.025)}.module-choice-code{position:absolute;top:13px;right:18px;color:#71869a;font-family:Consolas,'Courier New',monospace;font-size:9px;font-weight:700;letter-spacing:.14em}.module-choice-icon{display:grid;width:64px;height:64px;place-items:center;border:1px solid rgba(11,82,99,.18);border-radius:50% 50% 46% 54%;background:linear-gradient(145deg,#f5fbfc,#dceef1);color:var(--teal-dark);font-family:Georgia,'Times New Roman',serif;font-size:30px;font-weight:900;box-shadow:inset 0 0 0 5px rgba(255,255,255,.55),0 8px 18px rgba(11,82,99,.12)}.module-choice-card.training .module-choice-icon{border-color:rgba(201,162,39,.26);background:linear-gradient(145deg,#fffdf6,#f4e7ba);color:#8b6808;box-shadow:inset 0 0 0 5px rgba(255,255,255,.58),0 8px 18px rgba(160,121,9,.12)}.module-choice-copy{position:relative;z-index:1;display:flex;flex-direction:column}.module-choice-kicker{margin-bottom:6px;color:#527181;font-size:10px;font-weight:850;letter-spacing:.13em;text-transform:uppercase}.module-choice-card.training .module-choice-kicker{color:#8a6c1f}.module-choice-copy>strong{color:var(--navy);font-family:Georgia,'Times New Roman',serif;font-size:25px;letter-spacing:.01em}.module-choice-copy>small{margin-top:12px;color:var(--muted);font-size:14px;line-height:1.6}.module-choice-action{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:24px;color:var(--teal-dark);font-size:12px;font-weight:850;letter-spacing:.04em;text-transform:uppercase}.module-choice-action b{font-size:18px;transition:transform .18s ease}.module-choice-card:hover .module-choice-action b{transform:translateX(4px)}.module-choice-card.training .module-choice-action{color:#806007}.module-session-note{margin:26px auto 0;padding:14px 18px;max-width:760px;text-align:center;color:#52677a;background:rgba(238,244,248,.82);border:1px solid #d5e1ea;border-radius:12px;font-size:12px;backdrop-filter:blur(5px)}.module-session-note strong{color:var(--navy)}
@media(max-width:820px){.module-selector-shell{margin:12px auto;padding:6px}.module-choice-grid{grid-template-columns:1fr}.module-choice-card{min-height:210px}.module-selector-intro h2{font-size:29px}}
@media(max-width:520px){.module-choice-card{grid-template-columns:1fr;padding:22px}.module-choice-icon{width:54px;height:54px}.module-choice-copy>strong{font-size:21px}}

/* v2.0.38: full-width People Engagement Portal workspace launcher. */
#portalView.module-selection-mode .portal-body{display:block;min-height:calc(100vh - 70px)}
#portalView.module-selection-mode .sidebar{display:none!important}
#portalView.module-selection-mode .main{min-height:calc(100vh - 70px);padding:0;background:var(--teal)}
.module-launch-shell{position:relative;isolation:isolate;overflow:hidden;display:grid;align-content:center;min-height:calc(100vh - 70px);padding:54px clamp(24px,6vw,88px);color:var(--white);background:linear-gradient(135deg,var(--teal-dark),var(--teal) 58%,#4f8ea0)}
.module-launch-shell::before{content:'';position:absolute;inset:0;z-index:-2;opacity:.18;background-image:linear-gradient(rgba(255,255,255,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.18) 1px,transparent 1px);background-size:36px 36px}
.module-launch-shell::after{content:'';position:absolute;inset:22px;z-index:-1;border:1px solid rgba(201,162,39,.52);border-radius:24px;box-shadow:inset 0 0 54px rgba(255,255,255,.035);pointer-events:none}
.module-launch-intro{text-align:center;margin:0 auto 42px}.module-launch-logo{display:block;width:min(330px,70vw);height:auto;max-height:72px;margin:0 auto 22px;padding:13px 22px;object-fit:contain;background:var(--white);border-radius:9px;box-shadow:0 10px 26px rgba(18,46,53,.22)}.module-launch-intro>span{display:block;margin-bottom:9px;color:#f4ead0;font-size:11px;font-weight:800;letter-spacing:.22em;text-transform:uppercase}.module-launch-intro h2{margin:0;color:var(--white);font:800 clamp(30px,4vw,46px)/1.12 var(--font);letter-spacing:.01em}.module-launch-intro p{margin:12px 0 0;color:rgba(255,255,255,.84);font-size:15px}
.module-launch-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,5vw,70px);width:min(1120px,100%);margin:0 auto}
.module-launch-button{position:relative;overflow:hidden;display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;align-items:center;min-height:188px;padding:32px 36px;text-align:left;color:var(--white);font:inherit;border:2px solid rgba(255,255,255,.72);border-radius:22px;background:rgba(16,74,87,.3);box-shadow:0 16px 36px rgba(18,46,53,.24),inset 0 0 0 1px rgba(201,162,39,.25);cursor:pointer;transition:transform .2s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease}
.module-launch-button::after{content:'';position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .22s ease}.module-launch-button:hover,.module-launch-button:focus-visible{transform:translateY(-5px);border-color:var(--gold);background:rgba(255,255,255,.12);box-shadow:0 23px 44px rgba(18,46,53,.32),0 0 0 4px rgba(201,162,39,.16);outline:none}.module-launch-button:hover::after,.module-launch-button:focus-visible::after{transform:scaleX(1)}
.module-launch-index{position:absolute;top:17px;right:20px;color:rgba(244,234,208,.8);font-size:10px;font-weight:800;letter-spacing:.18em}.module-launch-button strong{align-self:end;color:var(--white);font:800 clamp(25px,3vw,38px)/1.15 var(--font);letter-spacing:.01em;text-shadow:0 2px 0 rgba(23,54,62,.35)}.module-launch-button small{align-self:start;margin-top:10px;color:rgba(255,255,255,.8);font-size:13px;line-height:1.4}.module-launch-button>b{grid-column:2;grid-row:1/3;align-self:center;margin-left:20px;color:var(--gold);font-size:34px;transition:transform .2s ease}.module-launch-button:hover>b{transform:translateX(5px)}
.module-launch-shell .module-session-note{color:rgba(255,255,255,.78);background:transparent;border:0}.module-launch-shell .module-session-note strong{color:var(--gold-soft)}
.workspace-context{display:block;margin-bottom:5px;color:var(--gold-dark);font-size:10px;font-weight:850;letter-spacing:.13em;text-transform:uppercase}
.company-master-logo{display:block;width:196px;height:42px;padding:6px 10px;object-fit:contain;object-position:left center;background:var(--white);border-radius:5px}
@media(max-width:760px){.module-launch-shell{padding:42px 22px}.module-launch-shell::after{inset:12px}.module-launch-grid{grid-template-columns:1fr;gap:20px}.module-launch-button{min-height:154px;padding:27px}.module-launch-intro{margin-bottom:28px}}

/* v2.0.44: workspace switching lives in navigation. The post-login selector is retired. */
.workspace-switcher{display:grid;gap:7px;margin:2px 0 14px;padding:12px 10px;border:1px solid rgba(201,162,39,.34);border-radius:10px;background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(244,234,208,.66))}.workspace-switcher>span{padding:0 5px;color:#8a6910;font-size:10px;font-weight:850;letter-spacing:.14em;text-transform:uppercase}.workspace-switch-btn{width:100%;padding:9px 10px;border:1px solid transparent;border-radius:7px;background:transparent;color:var(--navy);font:750 13px/1.25 var(--font);text-align:left;cursor:pointer}.workspace-switch-btn:hover,.workspace-switch-btn:focus-visible{border-color:rgba(11,82,99,.28);background:rgba(255,255,255,.75);outline:none}.workspace-switch-btn.active{border-color:var(--gold);background:var(--teal);color:var(--white);box-shadow:0 3px 10px rgba(11,82,99,.2)}
.workspace-access-field{display:flex;flex-wrap:wrap;gap:11px 22px;align-items:center;padding:13px 15px;border:1px solid #c8d9e4;border-radius:9px;background:#f7fbfd}.workspace-access-field legend{padding:0 5px;color:var(--navy);font-weight:800}.workspace-access-field .compact-note{flex-basis:100%;margin:0}.workspace-access-field label{display:flex;align-items:center;gap:7px;margin:0;font-weight:700}.workspace-access-field input{width:auto;min-height:auto}
.shared-action-heading{min-width:210px}
.shared-action-heading>span{display:block;margin-bottom:8px}
.shared-action-controls{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.shared-action-controls .btn{white-space:nowrap}
.select-all-action{display:inline-flex;align-items:center;gap:5px;margin:0;font-size:12px;font-weight:700;text-transform:none;white-space:nowrap}
.select-all-action input,.shared-action-cell input{width:16px;height:16px;margin:0;accent-color:var(--gold)}
.shared-action-cell{text-align:center;vertical-align:middle}
.audit-rollback-notice{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;margin-bottom:14px;border-left:4px solid var(--gold);background:var(--gold-soft);border-radius:8px}
.audit-rollback-notice span{color:var(--muted);font-size:13px}
.audit-action-cell{min-width:180px}