@import url('./layout.css');
@import url('./extended-components.css');
.card{background:var(--sm-surface);border:1px solid var(--sm-line);border-radius:var(--sm-radius);box-shadow:var(--sm-shadow);padding:20px;margin-bottom:18px;min-width:0;max-width:100%}
.card h2{font-size:var(--sm-font-h2);margin:0 0 10px}.card h3{font-size:var(--sm-font-h3);margin:0 0 8px}.muted{color:var(--sm-muted)}.small{font-size:var(--sm-font-small);color:var(--sm-muted)}
.button,button{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:7px;text-decoration:none;border:1px solid #cfd5dc;border-radius:var(--sm-button-radius);background:#fff;color:#344054;font-weight:650;padding:9px var(--sm-button-padding-x);cursor:pointer;min-height:var(--sm-button-height);font-size:var(--sm-font-body);line-height:1.25}
.button:hover,button:hover{background:#f8fafc}.button-primary{background:var(--sm-primary);border-color:var(--sm-primary);color:white}.button-primary:hover{background:var(--sm-primary-hover);color:white}.button-danger{border-color:#f04438;color:var(--sm-danger)}.button-small{min-height:var(--sm-button-compact-height);padding:6px 10px;font-size:var(--sm-font-small)}
.button-large{min-height:var(--sm-button-large-height);padding:12px 20px}
.button-icon{height:var(--sm-button-height);width:var(--sm-button-height);padding:0;flex:none}
.button:disabled,button:disabled,[aria-disabled="true"].button{cursor:not-allowed;opacity:.55;pointer-events:none}.button-full{width:100%}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #8ed3ec;outline-offset:2px}
.alert{padding:13px 15px;border-radius:10px;margin:0 0 16px;border:1px solid transparent;line-height:1.45}
.alert.success{background:var(--sm-success-bg);border-color:#abefc6;color:#05603a}.alert.warning{background:var(--sm-warning-bg);border-color:#fedf89;color:#93370d}
.alert.danger{background:var(--sm-danger-bg);border-color:#fecdca;color:#912018}.alert.info{background:var(--sm-info-bg);border-color:#bde3f5;color:#164a71}
label{display:block;font-size:var(--sm-font-label);font-weight:var(--sm-font-weight-label);color:#344054}label>input,label>select,label>textarea{display:block;width:100%;margin-top:6px;border:1px solid #cfd5dc;border-radius:var(--sm-control-radius);background:white;color:var(--sm-text);padding:9px var(--sm-control-padding-x);min-height:var(--sm-control-height);min-width:0;max-width:100%;font-size:var(--sm-font-body)}
label>input[type=checkbox]{display:inline-block;width:auto;margin:0 6px 0 0;vertical-align:middle}.field-help{display:block;font-size:12px;font-weight:400;color:var(--sm-muted);margin-top:5px}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.form-grid>*,.grid>*{min-width:0}
.form-stack{display:grid;gap:14px}.form-stack p{margin:0}.form-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.pill{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:4px 9px;background:#f2f4f7;color:#475467;font-size:11px;font-weight:700;white-space:normal}
.pill.active{background:var(--sm-success-bg);color:var(--sm-success)}.pill.warning{background:var(--sm-warning-bg);color:var(--sm-warning)}.pill.inactive{background:var(--sm-danger-bg);color:var(--sm-danger)}
.kpi{background:#fff;border:1px solid var(--sm-line);border-radius:10px;padding:16px;min-width:0}.kpi-label{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:650;color:#475467}.kpi-value{font-size:27px;line-height:1.2;font-weight:800;margin-top:9px}.kpi-icon{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:9px;background:#edf6f8;color:var(--sm-primary)}
.status-line{display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:1px solid var(--sm-line);padding:12px 0}.status-line:last-child{border-bottom:0}
/* Progressive table: actual wide reports may opt into overflow, ordinary admin tables reflow instead. */
.responsive-table{max-width:100%;min-width:0;container-type:inline-size}
.table-wrap{max-width:100%;min-width:0;border:1px solid var(--sm-line);border-radius:10px;overflow:hidden}
table{width:100%;max-width:100%;border-collapse:collapse;table-layout:fixed;background:#fff}
th,td{padding:10px 11px;text-align:left;font-size:var(--sm-font-table);border-bottom:1px solid var(--sm-line);vertical-align:middle;overflow-wrap:anywhere;word-break:normal}
th{background:#f8fafc;color:#475467;text-transform:uppercase;letter-spacing:.035em;font-size:var(--sm-font-table-heading)}tbody tr:last-child td{border-bottom:0}
.table-actions{white-space:normal}.table-actions .button{font-size:12px;padding:5px 7px;min-height:var(--sm-button-compact-height)}.table-name{font-weight:700;display:block}.table-sub{font-size:11px;color:var(--sm-muted);display:block;margin-top:3px}
/* Keep all actions accessible. Container queries work when table is in half-width card, even on wide desktop. */
@container (max-width:740px){
 .table-wrap{border:0;overflow:visible}.responsive-table table,.responsive-table thead,.responsive-table tbody,.responsive-table tr,.responsive-table td{display:block;width:100%}
 .responsive-table thead{position:absolute;clip:rect(0,0,0,0);height:1px;width:1px;overflow:hidden}
 .responsive-table tr{margin-bottom:10px;border:1px solid var(--sm-line);border-radius:10px;padding:6px 12px;overflow:hidden;background:#fff}
 .responsive-table tr:last-child{margin-bottom:0}.responsive-table td{display:grid;grid-template-columns:minmax(90px,33%) minmax(0,1fr);gap:8px;align-items:start;padding:8px 2px;border-bottom:1px solid #edf0f3}
 .responsive-table td:last-child{border-bottom:0}.responsive-table td::before{content:attr(data-label);font-size:11px;font-weight:700;color:var(--sm-muted);text-transform:uppercase;letter-spacing:.02em}
}
.login-shell{max-width:480px;margin:35px auto;min-width:0}.login-shell .card{padding:28px}.login-shell h1{font-size:var(--sm-font-h1);margin:0 0 10px}.login-shell .form-stack{margin:20px 0}
.error-shell{max-width:690px;margin:45px auto;min-width:0}.error-card{padding:38px;text-align:center}.error-card h1{font-size:29px;line-height:1.2;margin:10px 0}.error-icon{width:68px;height:68px;background:#edf5f9;border-radius:20px;display:grid;place-items:center;margin:0 auto;color:var(--sm-primary)}.error-icon .icon{width:34px;height:34px}.error-ref{background:#f4f6f8;border:1px solid var(--sm-line);border-radius:8px;padding:10px;font-size:12px;margin:20px auto;max-width:410px;overflow-wrap:anywhere}
.footer-note{font-size:11px;color:var(--sm-muted)}.icon-button{padding:5px;min-height:29px}
.demo-mark{color:var(--sm-primary);font-size:11px;font-weight:800;letter-spacing:.07em}.table-demo-note{font-size:11px;color:var(--sm-muted);margin-bottom:10px}
@media(max-width:900px){.form-grid,.form-grid.three{grid-template-columns:1fr}.card{padding:16px}.login-shell{margin:20px auto}}
@media(max-width:600px){.error-card{padding:25px 15px}.error-shell{margin:25px auto}.error-card h1{font-size:24px}.button{white-space:normal}}

/* v1.0.1 canonical login modes: Local, Hybrid, Identity-only. */
.auth-page .auth-main{display:flex;align-items:center;justify-content:center}
.auth-page .login-shell{width:100%;margin:22px auto;max-width:480px}
.auth-page .login-card{margin:0;padding:28px}
.auth-page .login-card .eyebrow{margin:0 0 8px}
.auth-page .login-card h1{font-size:var(--sm-font-login-h1);line-height:1.2;margin:0 0 18px}
.auth-page .login-sso-action{margin:22px 0 0}
.auth-page .login-sso-action .button{min-height:var(--sm-button-large-height);text-align:center;white-space:normal}
.auth-page .login-divider{display:flex;align-items:center;gap:12px;white-space:nowrap;color:var(--sm-muted);font-size:12px;margin:25px 0 28px}
.auth-page .login-divider::before,.auth-page .login-divider::after{content:"";height:1px;background:var(--sm-line);flex:1;min-width:0}
.auth-page .login-local-lead{font-size:13px;color:var(--sm-muted);margin:12px 0 20px}
.auth-page .login-local-form{margin:0;gap:18px}
.auth-page .login-local-form .button{min-height:var(--sm-button-height)}
@media(max-width:450px){.auth-page .login-card{padding:22px 18px}.auth-page .login-divider{gap:7px;font-size:11px;white-space:normal;text-align:center}}

/* v1.0.2 shared diagnostics system; same cards, type, header and buttons as every admin page. */
.diagnostics-summary{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:0 0 16px}
.diagnostics-summary .pill{font-size:12px;padding:7px 11px}
.diagnostic-check{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center;padding:16px 0;border-top:1px solid var(--sm-line)}
.diagnostic-check:first-child{border-top:0}
.diagnostic-check strong{display:block;font-size:var(--sm-font-body)}
.diagnostic-check .small{display:block;margin-top:4px;line-height:1.5}
.diagnostic-result{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:10px}
.diagnostic-details{font:12px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;background:var(--sm-bg);border:1px solid var(--sm-line);padding:10px 12px;border-radius:var(--sm-control-radius);overflow-wrap:anywhere}
.diagnostic-actions{display:flex;flex-wrap:wrap;gap:8px}
@media(max-width:600px){.diagnostic-check{grid-template-columns:1fr;gap:8px}.diagnostic-result{justify-content:flex-start}}

/* Production login pages show only one server-returned error at a time. */