/* Operations screens use the same semantic tokens as the main design system.
 * Load after design-system.css, outside its low-priority legacy layer. */

.global-branch-switcher {
    display: flex;
    min-width: 0;
    max-width: 280px;
    align-items: center;
    gap: 10px;
    padding: 7px 12px;
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius-sm);
    background: var(--ds-surface);
}
.global-branch-switcher label {
    display: grid;
    min-width: 0;
    flex: 1 1 auto;
    gap: 2px;
    color: var(--ds-text-muted);
    font-size: 11px;
}
.global-branch-switcher select {
    width: 100%;
    min-width: 0;
    max-width: 220px;
    min-height: 24px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--ds-text-strong);
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    text-overflow: ellipsis;
}
.global-branch-icon { width: 20px; height: 20px; flex: 0 0 auto; color: var(--ds-text-muted); }
.global-branch-switcher:focus-within { border-color: var(--ds-action); box-shadow: 0 0 0 3px var(--ds-focus-ring); }

.settings-section-nav {
    display: flex;
    width: fit-content;
    max-width: 100%;
    gap: 4px;
    margin: 0 0 24px;
    padding: 5px;
    overflow-x: auto;
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius-md);
    background: var(--ds-surface);
}
.settings-section-nav a {
    display: inline-flex;
    min-height: 40px;
    flex: 0 0 auto;
    align-items: center;
    padding: 8px 16px;
    border-radius: var(--ds-radius-sm);
    color: var(--ds-text-muted);
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
}
.settings-section-nav a:hover { color: var(--ds-text-strong); background: var(--ds-surface-muted); }
.settings-section-nav a.is-active { color: var(--ds-text-inverse); background: var(--ds-action); }
.settings-catalog-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
    align-items: start;
    gap: 24px;
}
.settings-catalog-panel { min-width: 0; container-type: inline-size; }
.settings-catalog-list { display: grid; gap: 12px; padding: 20px; }
.settings-catalog-row {
    display: grid;
    min-width: 0;
    gap: 10px;
    padding: 16px;
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius-md);
    background: var(--ds-surface);
}
.settings-catalog-row > form:last-child { justify-self: end; }
.settings-catalog-row.is-inactive, .business-rule-card.is-inactive {
    background: var(--ds-surface-subtle);
    border-style: dashed;
}
.settings-inline-form {
    display: grid;
    min-width: 0;
    grid-template-columns: auto minmax(0, 1fr) minmax(0, 1fr) auto;
    align-items: end;
    gap: 12px;
}
.settings-inline-form--plan { grid-template-columns: minmax(0, 1fr) minmax(95px, .6fr) minmax(0, 1.2fr) auto; }
.settings-item-number {
    display: grid;
    min-width: 40px;
    height: 44px;
    place-items: center;
    padding: 0 8px;
    border-radius: var(--ds-radius-sm);
    color: var(--ds-action);
    background: var(--ds-action-soft);
    font-weight: 800;
}
.settings-create-card { position: sticky; top: 0; display: grid; min-width: 0; gap: 18px; padding: 24px; }
.settings-create-card h2 { margin: 0; font-size: 20px; letter-spacing: var(--ds-tracking-tight); }
.settings-catalog-empty, .business-empty, .guardian-empty { margin: 0; padding: 24px; color: var(--ds-text-muted); text-align: center; line-height: var(--ds-leading-body); }

.settings-inline-form label, .business-form-grid label, .business-period-form label, .advanced-filter-form label {
    display: grid;
    min-width: 0;
    gap: 6px;
    color: var(--ds-text-muted);
    font-size: 12px;
    font-weight: 600;
}
.settings-inline-form input:not([type="hidden"]),
.business-form-grid input:not([type="hidden"]), .business-form-grid select, .business-form-grid textarea,
.business-table-row input:not([type="hidden"]), .business-table-row select,
.business-period-form input, .advanced-filter-form input:not([type="hidden"]), .advanced-filter-form select {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    min-height: 44px;
    height: auto;
    padding: 10px 12px;
    border: 1px solid var(--ds-border-strong);
    border-radius: var(--ds-radius-sm);
    outline: none;
    color: var(--ds-text);
    background: var(--ds-surface);
    font: inherit;
    font-size: 13px;
    line-height: 1.4;
}
.business-form-grid textarea { resize: vertical; }
.settings-inline-form input:focus, .business-form-grid :is(input, select, textarea):focus,
.business-table-row :is(input, select):focus, .business-period-form input:focus,
.advanced-filter-form :is(input, select):focus {
    border-color: var(--ds-action);
    box-shadow: 0 0 0 3px var(--ds-focus-ring);
}
.catalog-status-button, .guardian-actions button, .guardian-passport button, .expense-item button, .filter-reset-link {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    padding: 8px 12px;
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius-sm);
    color: var(--ds-text-muted);
    background: var(--ds-surface);
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
}
.catalog-status-button:hover, .guardian-actions button:hover, .filter-reset-link:hover { color: var(--ds-text-strong); background: var(--ds-surface-muted); }
.guardian-actions [data-delete-guardian], .expense-item button { color: var(--ds-danger); background: var(--ds-danger-soft); border-color: transparent; }
.guardian-passport button { justify-content: start; width: fit-content; color: var(--ds-action); background: var(--ds-action-soft); border-color: transparent; }
.settings-section-nav a:focus-visible, .catalog-status-button:focus-visible, .guardian-actions button:focus-visible,
.guardian-passport button:focus-visible, .expense-item button:focus-visible, .filter-reset-link:focus-visible {
    outline: 2px solid var(--ds-action);
    outline-offset: 3px;
}

.list-view-toolbar--advanced { flex-direction: column; align-items: stretch; gap: 12px; }
.list-view-toolbar--advanced .list-filter-tabs { width: 100%; }
.list-view-toolbar--advanced .list-filter-tab { min-height: 40px; }
.advanced-filter-form {
    display: flex;
    width: 100%;
    min-width: 0;
    align-self: stretch;
    flex-wrap: wrap;
    align-items: end;
    gap: 12px;
    padding: 16px;
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius-md);
    background: var(--ds-surface);
}
.advanced-filter-form label { flex: 1 1 140px; align-items: stretch; }
.advanced-filter-form label > span { color: var(--ds-text-muted); font-size: 12px; }
.advanced-filter-form label:has(input[type="number"]) { flex: 0 1 90px; }
.advanced-filter-form > button, .advanced-filter-form > .filter-reset-link { min-height: 44px; }
.filter-reset-link { align-self: end; }

.classroom-buttons { min-width: 0; flex-wrap: wrap; gap: 8px; }
.classroom-button {
    width: auto;
    min-width: 44px;
    max-width: 240px;
    height: 40px;
    flex: 0 0 auto;
    padding: 0 12px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.lesson-room-badge--detail {
    width: auto;
    min-width: 24px;
    max-width: 180px;
    height: auto;
    min-height: 24px;
    flex: 0 1 auto;
    padding: 4px 8px;
    border-radius: var(--ds-radius-xs);
    overflow-wrap: anywhere;
}

.guardian-card { grid-column: 1 / -1; min-width: 0; }
.guardian-card-header { align-items: center; justify-content: space-between; flex-wrap: wrap; }
.guardian-card-header p:not(.schedule-kicker) { margin: 6px 0 0; color: var(--ds-text-muted); font-size: 13px; line-height: var(--ds-leading-body); }
.guardian-list { display: grid; gap: 12px; }
.guardian-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(140px, .5fr) auto;
    align-items: center;
    gap: 20px;
    padding: 18px;
    border: 1px solid var(--ds-border);
    border-radius: var(--ds-radius-md);
    background: var(--ds-surface-subtle);
}
.guardian-item > div { display: grid; min-width: 0; gap: 6px; overflow-wrap: anywhere; }
.guardian-item span, .guardian-item small { color: var(--ds-text-muted); font-size: 12px; line-height: var(--ds-leading-body); }
.guardian-item .guardian-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.guardian-empty { border-radius: var(--ds-radius-sm); background: var(--ds-surface-muted); }
.guardian-dialog .dialog-body { min-height: 0; }
.guardian-dialog .student-field--wide { grid-column: 1 / -1; }
.guardian-dialog .field-hint { color: var(--ds-text-muted); font-size: 12px; line-height: var(--ds-leading-body); }

.business-finance-page {
    display: flex;
    min-width: 0;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 24px;
    padding: clamp(20px, 3vw, 36px);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
}
.business-finance-page > * { flex-shrink: 0; min-width: 0; }
.business-finance-header { display: flex; justify-content: space-between; align-items: start; gap: 24px; }
.business-finance-header h1 { margin: 6px 0 12px; color: var(--ds-text-strong); font-size: clamp(28px, 3vw, 40px); line-height: var(--ds-leading-tight); letter-spacing: var(--ds-tracking-tight); }
.business-finance-header p:not(.schedule-kicker) { margin: 0; color: var(--ds-text-muted); font-size: 14px; line-height: var(--ds-leading-body); }
.business-finance-header .settings-access-badge { white-space: normal; }
.business-period-form { display: flex; width: fit-content; max-width: 100%; align-items: end; flex-wrap: wrap; gap: 12px; padding: 16px; border: 1px solid var(--ds-border); border-radius: var(--ds-radius-md); background: var(--ds-surface); }
.business-period-form label { min-width: 160px; flex: 1 1 auto; }
.business-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.business-summary-grid article { display: grid; align-content: start; min-width: 0; gap: 10px; padding: 22px; border: 1px solid var(--ds-border); border-radius: var(--ds-radius-lg); background: var(--ds-surface); box-shadow: var(--ds-shadow-xs); }
.business-summary-grid span, .business-summary-grid small { color: var(--ds-text-muted); font-size: 12px; line-height: var(--ds-leading-body); }
.business-summary-grid strong { color: var(--ds-text-strong); font-size: clamp(22px, 2.4vw, 30px); letter-spacing: var(--ds-tracking-tight); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.business-summary-grid .is-positive { background: var(--ds-success-soft); }
.business-summary-grid .is-positive strong { color: var(--ds-success); }
.business-summary-grid .is-negative { background: var(--ds-danger-soft); }
.business-summary-grid .is-negative strong { color: var(--ds-danger); }
.business-section { min-width: 0; padding: 24px; border: 1px solid var(--ds-border); border-radius: var(--ds-radius-lg); background: var(--ds-surface); box-shadow: var(--ds-shadow-xs); }
.business-section > header { display: flex; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.business-section h2, .business-section h3 { margin: 4px 0; color: var(--ds-text-strong); font-size: 20px; line-height: 1.3; letter-spacing: var(--ds-tracking-tight); }
.business-section h3 { font-size: 16px; }
.business-table { min-width: 0; overflow-x: auto; scrollbar-width: thin; }
.business-table-head, .business-table-row { display: grid; grid-template-columns: minmax(160px, 1.4fr) minmax(140px, 1.2fr) minmax(100px, .8fr) minmax(110px, .8fr) minmax(155px, 1.2fr) auto; align-items: center; gap: 16px; min-width: 960px; padding: 16px 8px; }
.business-table-head { border-radius: var(--ds-radius-xs); background: var(--ds-surface-subtle); color: var(--ds-text-muted); font-size: 11px; font-weight: 700; }
.business-table-row { border-bottom: 1px solid var(--ds-border); font-size: 13px; }
.business-table-row:last-child { border-bottom: 0; }
.business-table-row > span, .business-table-row label { display: grid; min-width: 0; gap: 6px; overflow-wrap: anywhere; }
.business-table-row small { color: var(--ds-text-muted); font-size: 12px; }
.business-field-label { display: none; }
.business-two-column { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 24px; }
.business-rule-list, .expense-list { display: grid; gap: 12px; }
.business-rule-card { display: grid; min-width: 0; gap: 12px; padding: 16px; border: 1px solid var(--ds-border); border-radius: var(--ds-radius-md); background: var(--ds-surface-subtle); }
.business-rule-card > form { min-width: 0; }
.business-rule-card > form:last-child { justify-self: end; }
.business-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; }
.business-wide { grid-column: 1 / -1; }
.business-create-form { display: grid; gap: 16px; margin-top: 24px; padding-top: 24px; border-top: 1px solid var(--ds-border); }
.business-create-form > button { justify-self: start; }
.business-create-form .business-form-grid { margin-bottom: 0; }
.expense-category-summary { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.expense-category-summary span { display: flex; flex-wrap: wrap; gap: 8px; padding: 8px 12px; border-radius: var(--ds-radius-sm); background: var(--ds-surface-muted); font-size: 12px; }
.expense-category-summary em { color: var(--ds-text-muted); font-style: normal; }
.expense-item { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 12px; padding: 16px; border: 1px solid var(--ds-border); border-radius: var(--ds-radius-md); }
.expense-item > div { display: grid; min-width: 0; gap: 6px; overflow-wrap: anywhere; }
.expense-item > strong { font-variant-numeric: tabular-nums; }
.expense-item span, .expense-item small { color: var(--ds-text-muted); font-size: 12px; }
.business-experimental-note { margin: 0; padding: 16px 20px; border-radius: var(--ds-radius-md); background: var(--ds-warning-soft); color: var(--ds-text); font-size: 13px; line-height: var(--ds-leading-body); }

@container (max-width: 720px) {
    .settings-inline-form, .settings-inline-form--plan { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .settings-item-number { grid-column: 1 / -1; justify-self: start; }
    .settings-inline-form--plan label:last-of-type { grid-column: 1 / -1; }
    .settings-inline-form > button { justify-self: start; }
}
@container (max-width: 460px) {
    .settings-inline-form, .settings-inline-form--plan { grid-template-columns: minmax(0, 1fr); }
    .settings-catalog-list { padding: 12px; }
}
@media (max-width: 1280px) {
    .app-shell--branch-navigation .account-copy { display: none; }
    .settings-catalog-layout, .business-two-column { grid-template-columns: minmax(0, 1fr); }
    .settings-create-card { position: static; }
    .business-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .guardian-item { grid-template-columns: minmax(0, 1fr) minmax(140px, .6fr); }
    .guardian-actions { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
    /* Give branch navigation its own row; workspace height uses the same token. */
    .app-shell--branch-navigation { --topbar-height: 124px; }
    .app-shell--branch-navigation .app-topbar { padding: 0 14px 58px; }
    .app-shell--branch-navigation .global-branch-switcher { position: absolute; bottom: 10px; left: 14px; right: 14px; max-width: none; min-height: 44px; }
    .app-shell--branch-navigation .global-branch-switcher label { grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 12px; }
    .app-shell--branch-navigation .global-branch-switcher select { max-width: none; min-height: 28px; }
    .business-finance-header { flex-direction: column; gap: 16px; }
    .business-table-head { display: none; }
    .business-table-row { min-width: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 20px 0; }
    .business-table-row > span:first-of-type, .business-table-row > button { grid-column: 1 / -1; }
    .business-field-label { display: block; color: var(--ds-text-muted); font-size: 12px; font-weight: 600; }
}
@media (max-width: 660px) {
    .app-shell--branch-navigation .topbar-start, .app-shell--branch-navigation .topbar-end { gap: 8px; }
    .app-shell--branch-navigation .brand-name { display: none; }
    .advanced-filter-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 12px; gap: 12px; }
    .advanced-filter-form label { width: auto; }
    .advanced-filter-form > label:first-of-type { grid-column: 1 / -1; }
    .advanced-filter-form > button { width: 100%; }
    .classroom-buttons { flex-wrap: nowrap; width: 100%; overflow-x: auto; padding-bottom: 4px; }
    .classroom-button { max-width: 200px; }
    .guardian-item { grid-template-columns: minmax(0, 1fr); gap: 16px; padding: 16px; }
    .business-finance-page { padding: 20px 14px; gap: 20px; }
    .business-section, .settings-create-card { padding: 18px; }
    .business-summary-grid { gap: 12px; }
    .business-summary-grid article { padding: 16px; }
    .business-form-grid { grid-template-columns: minmax(0, 1fr); }
    .expense-item { grid-template-columns: minmax(0, 1fr) auto; }
    .expense-item > div { grid-column: 1 / -1; }
}
@media (max-width: 380px) {
    .business-summary-grid, .business-table-row { grid-template-columns: minmax(0, 1fr); }
    .settings-section-nav a { padding-inline: 10px; }
}
