/* Option A: a single horizontal settings tab bar inside the Admin shell. */
.settings-demo-notice {
  display: block;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
  margin: 0 0 23px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.5;
}
.settings-layout { display:block; width:100%; max-width:1390px; }
.settings-subnav {
  display:flex; align-items:center; flex-direction:row; gap:26px;
  padding:0 1px; margin: 0 0 11px; width:100%; overflow-x:auto;
  background:transparent; box-shadow:none; border:0; border-bottom:1px solid var(--line);
  border-radius:0; white-space:nowrap;
}
.settings-subnav-heading { display:none; }
.settings-subnav-item {
  display:flex; align-items:center; flex:none; gap:8px; border:0;
  border-bottom:2px solid transparent; border-radius:0; margin:0 0 -1px;
  min-height:44px; padding:11px 2px 10px;
  background:transparent; color:var(--muted); font-size:12.5px;
  font-weight:550; cursor:pointer;
}
.settings-subnav-item:hover { background:transparent; color:var(--fg); }
.settings-subnav-item.active { background:transparent; color:var(--primary); border-bottom-color:var(--primary); font-weight:700; }
.settings-subnav-item:focus-visible { outline:2px solid var(--primary); outline-offset:-3px; border-radius:4px; }
.settings-main { min-width:0; max-width:100%; }
.settings-view-general .settings-main { max-width:1080px; }
.settings-view-staff .settings-main { max-width:1390px; }
.settings-view-security .settings-main { max-width:1020px; }
.settings-main-head { display:flex; justify-content:space-between; gap:16px; align-items:center; flex-wrap:wrap; margin:0 0 21px; }
.settings-main-head h2 { font-size:21px; letter-spacing:-.35px; margin:0 0 5px; }
.settings-main-head p { max-width:620px; }
.settings-main .card { margin-bottom:16px; }
.settings-general-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:18px; align-items:stretch; }
.settings-general-grid .card { height:100%; margin:0; padding:22px 22px 20px; }
.settings-general-grid .card-desc { margin-top:3px; margin-bottom:12px; font-size:11px; line-height:1.5; }
.settings-general-grid .card-title { padding-right:60px; }
.settings-identity-panel { position:relative; min-width:0; }
.settings-general-actions { display:flex;align-items:center;justify-content:flex-end;gap:9px;flex-wrap:wrap; }
.settings-general-actions .btn { white-space:nowrap; }
.settings-detail-list { display:flex; flex-direction:column; margin:16px 0 0; gap:0; }
.settings-detail-list > div { display:flex; flex-direction:column; gap:5px; padding:12px 0; border-top:1px solid var(--line); }
.settings-detail-list > div:first-child { border-top:0; padding-top:0; }
.settings-detail-list dt { color:var(--muted); font-size:11px; line-height:1.45; }
.settings-detail-list dd { margin:0; text-align:left; font-size:12.5px; font-weight:650; line-height:1.45; overflow-wrap:anywhere; }
.settings-general-grid .settings-form { max-width:none; margin-top:22px; }
.settings-general-grid .settings-form .form-row { gap:6px; }
.settings-general-grid .settings-form .field { width:100%; }
.settings-view-staff .settings-toolbar { margin-bottom:16px; }
.settings-view-staff .settings-toolbar .search { min-width:240px; max-width:520px; }
.settings-view-staff .settings-toolbar select.field { min-width:160px; }
.settings-view-staff .table-wrap { width:100%; }
.settings-view-staff .data-table { min-width:840px; }
.settings-security-switch { display:inline-flex; gap:4px; border-radius:9px; border:1px solid var(--line); background:var(--subtle); padding:4px; margin:0 0 18px; }
.settings-security-switch button { border:0; border-radius:6px; padding:9px 16px; cursor:pointer; font-size:12px; color:var(--muted); background:transparent; }
.settings-security-switch button:hover { color:var(--fg); }
.settings-security-switch button.active { background:var(--surface); color:var(--primary); box-shadow:var(--shadow); font-weight:700; }
.settings-security-switch button:focus-visible { outline:2px solid var(--primary); outline-offset:1px; }
@media(max-width:920px) {
  .settings-layout { display:block; }
  .settings-subnav { gap:20px; }
  .settings-general-grid { grid-template-columns:1fr; }
  .settings-view-general .settings-main { max-width:700px; }
}
@media(max-width:600px) {
  .settings-subnav { gap:18px; }
  .settings-subnav-item { min-height:42px; font-size:12px; }
  .settings-main-head { align-items:flex-start; }
  .settings-main-head h2 { font-size:19px; }
  .settings-general-grid .card { padding:17px; }
  .settings-view-staff .settings-toolbar .search { min-width:100%; max-width:none; }
  .settings-security-switch { display:flex; width:max-content; max-width:100%; }
}

/* Internal staff directory + invitations share one page and one filter row. */
.settings-view-staff .settings-main .card { padding:20px 22px; }
.settings-view-staff .settings-toolbar {
  display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:0 0 18px;
}
.settings-view-staff .settings-toolbar .search { flex:1 1 260px;min-width:220px;max-width:520px; }
.settings-view-staff .settings-toolbar select.field { flex:0 1 180px;max-width:180px; }
.settings-view-staff .settings-toolbar>.muted { white-space:nowrap; }
.settings-view-staff .settings-staff-row[hidden] { display:none; }
.settings-invite-card { max-width:680px;margin-bottom:18px!important; }
.settings-invite-card .settings-form { max-width:560px;display:grid;gap:15px; }
.settings-invite-card .form-row { display:flex;flex-direction:column;gap:6px; }
.settings-invite-card .form-row .field { width:100%; }
.settings-invite-card .settings-actions { display:flex;flex-wrap:wrap;gap:9px;margin-top:4px; }
.settings-invitation-actions { display:flex;align-items:center;gap:6px;flex-wrap:wrap; }
.settings-invitation-more { min-width:116px;max-width:140px;font-size:11.5px; }
.settings-view-staff .data-table td { overflow-wrap:anywhere;vertical-align:middle; }
.settings-view-staff .data-table td:first-child { min-width:175px; }
.settings-view-staff .data-table td:last-child { min-width:150px; }
@media(max-width:600px) {
  .settings-view-staff .settings-main .card { padding:17px; }
  .settings-view-staff .settings-toolbar .search { flex-basis:100%;min-width:100%;max-width:none; }
  .settings-view-staff .settings-toolbar select.field { flex:1 1 160px;max-width:none; }
}
