.central-access,
.central-users { width: min(100%, 920px); margin: 0 auto; }
.central-page-header { margin-bottom: 18px; }
.central-card { margin: 0 0 18px; overflow: hidden; }
.central-form { padding: 4px 0 0; }
.central-field { display: grid; gap: 6px; margin: 0 0 15px; color: var(--ink-soft); font-size: 11px; font-weight: 650; }
.central-field input,
.central-field select { width: 100%; min-height: 42px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 5px; background: var(--surface); color: var(--ink); }
.central-field input::placeholder { color: var(--muted); }
.central-form .form-actions { padding-top: 3px; }
.central-space { display: flex; align-items: flex-start; gap: 11px; margin: 0 0 24px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); }
.central-space-indicator { width: 8px; height: 8px; margin-top: 5px; border-radius: 50%; flex: none; background: var(--amber); }
.central-space--live .central-space-indicator { background: var(--teal); }
.central-space strong { font-size: 11px; color: var(--ink); }
.central-space p { margin: 3px 0 0; color: var(--muted); font-size: 10px; }
.central-space-name { display: inline-block; margin-top: 5px; color: var(--ink-soft); font-size: 10px; }
.central-message { padding: 11px 13px; margin: 0 0 16px; border-radius: 5px; font-size: 11px; }
.central-message--error { color: #913a31; background: var(--red-soft); border: 1px solid #efd0c9; }
.central-message--notice { color: #79511f; background: var(--amber-soft); border: 1px solid #ecd8b7; }
.central-create-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.central-create-grid .form-actions { grid-column: 1 / -1; }
.central-user-list .panel-head { padding: 17px 19px; }
.central-user-list .table-wrap { overflow-x: auto; }
.central-user-list .data-table { min-width: 560px; }
.central-user-status { display: inline-flex; align-items: center; padding: 4px 8px; border-radius: 999px; font-size: 10px; font-weight: 650; }
.central-user-status.is-active { color: #2e6559; background: var(--teal-soft); }
.central-user-status.is-inactive { color: #79511f; background: var(--amber-soft); }
.central-toggle { white-space: nowrap; }
.central-self-note { color: var(--muted); font-size: 10px; }
.central-empty { padding: 25px 12px; text-align: center; }
.central-empty p { margin: 5px 0 0; color: var(--muted); font-size: 11px; }
.central-form :is(input, select, button):focus-visible { outline: 3px solid rgba(201,71,59,.3); outline-offset: 2px; }
.portal-unauthenticated { background: #f4f1eb; }
.portal-unauthenticated .sidebar,
.portal-unauthenticated .topbar,
.portal-unauthenticated .page-footer { display: none; }
.portal-unauthenticated .main-area { width: 100%; min-height: 100dvh; margin: 0; }
.portal-unauthenticated .content { width: 100%; max-width: none; min-height: 100dvh; padding: 28px 20px; display: grid; place-items: center; }
.central-login-screen { width: min(100%, 430px); }
.central-login-card { padding: 30px 32px 22px; border: 1px solid #e1dfd8; border-radius: 16px; background: #fffefa; box-shadow: 0 14px 40px rgba(49,50,44,.08); }
.central-login-brand { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 8px; margin: 0 0 22px; }
.central-login-mark { display: grid; width: 46px; height: 46px; place-items: center; border-radius: 14px; background: #efb932; color: #302d24; font-size: 19px; font-weight: 800; box-shadow: 0 2px 5px rgba(97,77,24,.12); }
.central-login-name { margin-top: 3px; color: #303739; font-size: 10px; line-height: 1; font-weight: 800; letter-spacing: .24em; }
.central-login-caption { color: #555d60; font-size: 9px; font-weight: 750; letter-spacing: .22em; }
.central-login-card h1 { margin: 0; text-align: center; font-size: 24px; line-height: 1.25; letter-spacing: -.035em; }
.central-login-intro { margin: 8px 0 25px; color: var(--ink-soft); text-align: center; font-size: 13px; }
.central-login-card .central-field { margin-bottom: 16px; color: #333b3d; font-size: 12px; font-weight: 700; }
.central-login-card .central-field input { min-height: 44px; border-color: #deddd6; border-radius: 11px; background: #faf9f5; }
.central-login-card .central-form .form-actions { padding-top: 8px; }
.central-login-card .button-primary { width: 100%; min-height: 46px; border-radius: 10px; background: #188575; }
.central-forgot { margin: -1px 0 10px; text-align: right; color: #374144; font-size: 12px; font-weight: 700; }
.central-forgot summary { cursor: pointer; list-style: none; }
.central-forgot summary::-webkit-details-marker { display: none; }
.central-forgot[open] { text-align: left; }
.central-forgot p { margin: 8px 0 10px; padding: 10px 12px; border-radius: 8px; background: #f2f0ea; color: #5c6565; font-size: 11px; font-weight: 450; line-height: 1.55; }
.central-login-foot { display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: 19px; color: #818987; font-size: 10px; }
.central-login-foot span { width: 7px; height: 7px; border-radius: 50%; background: var(--teal); }
.central-message { line-height: 1.5; }
.central-users { width: min(100%, 970px); }
.central-users .central-page-header { flex-direction: column; align-items: stretch; margin-bottom: 24px; }
.central-users .central-page-header h1 { margin: 5px 0 6px; color: #272e30; font-size: clamp(28px, 4vw, 36px); letter-spacing: -.04em; }
.central-users .central-page-header .page-subtitle { margin: 0; color: #7b8587; font-size: 13px; }
.central-add-user { width: 100%; min-width: 0; min-height: 42px; justify-content: center; border-radius: 9px; background: var(--teal); }
.central-user-list { overflow: hidden; border: 1px solid #e3e1da; border-radius: 13px; background: #fffefa; box-shadow: 0 3px 13px rgba(45,48,42,.035); }
.central-user-list .panel-head { padding: 19px 20px 12px; }
.central-user-list .panel-title { color: #30383a; font-size: 15px; }
.central-user-list .panel-sub { margin-top: 4px; color: #879091; font-size: 11px; }
.central-user-tools { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 0 18px 15px; padding: 9px; border: 1px solid #e5e3dc; border-radius: 12px; background: #fff; box-shadow: 0 2px 8px rgba(41,44,39,.035); }
.central-search { display: flex; align-items: center; gap: 9px; width: min(100%, 390px); min-height: 40px; padding: 0 11px; border: 1px solid #e4e2dc; border-radius: 9px; background: #faf9f5; }
.central-search svg { width: 16px; height: 16px; flex: none; fill: none; stroke: #899294; stroke-width: 1.8; stroke-linecap: round; }
.central-search input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: 12px; }
.central-search input::placeholder { color: #979d9d; }
.central-user-filters { display: flex; gap: 3px; padding: 3px; border-radius: 9px; background: #f1f0eb; }
.central-user-filters button { min-height: 33px; padding: 0 12px; border: 0; border-radius: 7px; background: transparent; color: #687174; font-size: 11px; font-weight: 650; cursor: pointer; }
.central-user-filters button.is-selected { background: #fffefa; color: #273133; box-shadow: 0 1px 4px rgba(34,38,35,.12); }
.central-user-list .data-table { min-width: 900px; border-collapse: collapse; }
.central-user-list .data-table thead { background: #f7f6f2; }
.central-user-list .data-table th { padding: 11px 16px; color: #7b8587; font-size: 9px; font-weight: 700; letter-spacing: .09em; }
.central-user-list .data-table td { padding: 15px 16px; color: #515b5d; border-top: 1px solid #eeece6; font-size: 12px; }
.central-user-list .data-table td strong { color: #30383a; }
.central-user-list .data-table td:last-child { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.central-user-status { padding: 4px 9px; font-size: 9px; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.central-user-status.is-active { color: #247465; background: #e5f3ef; }
.central-user-status.is-inactive { color: #8a6828; background: #f8efd9; }
.central-user-list .button-secondary,
.central-user-list .button-primary { min-height: 34px; padding: 7px 10px; border-radius: 8px; font-size: 10px; }
.central-create-panel { padding: 20px; border: 1px solid #e3e1da; border-radius: 12px; background: #fffefa; }
.central-create-panel[hidden] { display: none; }
.central-user-list tr[hidden] { display: none !important; }
.central-user-list td { overflow-wrap: anywhere; }
.central-user-tools { min-width: 0; flex-wrap: wrap; }
.central-search { min-width: 0; flex: 1 1 180px; }
.central-user-filters { flex-shrink: 0; }
.central-login-card .form-actions button { justify-content: center; }
.central-create-panel .form-section-head { margin-bottom: 17px; }
.central-create-panel .step-number { background: var(--teal-soft); color: var(--teal); }
.central-empty { color: #586264; }
.central-create-panel .central-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.central-create-panel :is(input, select, button):focus-visible { outline: 3px solid rgba(201,71,59,.3); outline-offset: 2px; }
.central-access > .central-card { width: min(100%, 680px); margin-inline: auto; }
.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; }
@media (max-width: 680px) {
  .central-access, .central-users { width: 100%; }
  .central-search { flex: 0 1 auto; }
  .central-create-grid { grid-template-columns: 1fr; }
  .central-create-grid .form-actions { grid-column: auto; }
  .central-create-panel .central-form { grid-template-columns: 1fr; }
  .central-user-list .data-table { min-width: 0; }
  .central-user-list thead { display: none; }
  .central-user-list tbody tr { display: grid; gap: 10px; padding: 15px; border-bottom: 1px solid var(--line); }
  .central-user-list tbody td { display: flex; justify-content: space-between; gap: 12px; padding: 0; border: 0; text-align: right; }
  .central-user-list tbody td::before { content: attr(data-label); color: var(--muted); font-size: 10px; text-align: left; }
  .central-user-list tbody td:has(.central-empty) { display: block; }
  .central-user-list tbody td:has(.central-empty)::before { content: none; }
  .central-login-card { padding: 27px 23px 20px; }
  .central-users .central-page-header { align-items: stretch; flex-direction: column; gap: 17px; }
  .central-add-user { width: 100%; }
  .central-user-tools { margin: 0 12px 12px; align-items: stretch; flex-direction: column; }
  .central-search { width: 100%; }
  .central-user-filters { justify-content: space-between; }
  .central-user-filters button { flex: 1; padding-inline: 5px; }
  .central-user-list .data-table { min-width: 0; }
  .central-user-list tbody td:last-child { justify-content: flex-end; flex-wrap: wrap; }
  .central-user-list tbody td:last-child::before { margin-right: auto; }
}

/* Match the portal-wide blue action treatment on central access screens. */
.central-login-card .button-primary,
.central-add-user {
  color: #fff;
  background: #527187;
  border-color: #527187;
  text-align: center;
  box-shadow: 0 2px 6px rgba(55, 85, 105, .14);
}

.central-login-card .button-primary:hover,
.central-add-user:hover {
  color: #fff;
  background: #405f75;
  border-color: #405f75;
  box-shadow: 0 4px 10px rgba(55, 85, 105, .2);
}

.central-login-card .button-primary:focus-visible,
.central-add-user:focus-visible,
.central-form :is(.button-primary, .button-secondary):focus-visible,
.central-create-panel :is(.button-primary, .button-secondary):focus-visible {
  outline: 3px solid rgba(82, 113, 135, .38);
  outline-offset: 2px;
}

.central-login-card .button-primary:disabled,
.central-add-user:disabled,
.central-form :is(.button-primary, .button-secondary):disabled {
  color: #f4f6f7;
  background: #9aaab4;
  border-color: #9aaab4;
  box-shadow: none;
  cursor: not-allowed;
  opacity: .72;
  transform: none;
}

.central-user-list [data-central-delete-user] {
  color: #fff;
  background: #b4483b;
  border-color: #b4483b;
}

.central-user-list [data-central-delete-user]:hover {
  color: #fff;
  background: #963a31;
  border-color: #963a31;
}

.central-user-list [data-central-delete-user]:focus-visible {
  outline: 3px solid rgba(180, 72, 59, .36);
  outline-offset: 2px;
}
