/* Final shared cascade: normalize rebuilt route surfaces to the active theme tokens. */

.layout.app-shell :where(
  .positions-panel,
  .positions-page .panel,
  .logistics-panel,
  .unit-panel,
  .summary-panel,
  .summary-period-picker,
  .analytics-metric,
  .analytics-unit-overview,
  .analytics-table-wrap,
  .analytics-empty-state,
  .events-header,
  .events-toolbar,
  .event-list-panel,
  .event-calendar-card,
  .event-day-summary,
  .reports-overview > div,
  .reports-table-wrap,
  .system-alert,
  .system-card,
  .system-empty-state,
  .dictionaries-detail,
  .dictionaries-list a,
  .dictionaries-empty-state
) {
  border-color: var(--line);
  background: var(--panel);
  color: var(--text);
}

.layout.app-shell :where(
  .operational-summary-card,
  .logistics-summary-card,
  .summary-metric-card,
  .summary-incident-card,
  .unit-card,
  .unit-structure-node,
  .event-list-card,
  .event-day-metrics div,
  .events-empty-state,
  .summary-zpm-row,
  .control-position-card
) {
  border-color: color-mix(in srgb, var(--line) 88%, transparent);
  background: var(--soft-panel);
  color: var(--text);
}

.layout.app-shell :where(
  .page-kicker,
  .control-table-toolbar__meta,
  .positions-filter-field,
  .positions-empty,
  .positions-empty span,
  .logistics-filter-field span,
  .logistics-table-count,
  .logistics-empty-state,
  .logistics-mobile-card span:not(.logistics-status-pill),
  .logistics-mobile-card p,
  .unit-filter-field span,
  .unit-structure-panel .unit-panel-head p,
  .unit-card dt,
  .unit-structure-node span,
  .unit-structure-node em,
  .unit-structure-meta dt,
  .unit-empty-state,
  .summary-metric-card span,
  .summary-metric-card em,
  .summary-incident-card span,
  .summary-filter-field,
  .summary-time-grid label,
  .summary-zpm-row span,
  .summary-empty-state,
  .analytics-header p,
  .analytics-metric span,
  .analytics-metric em,
  .analytics-table td span,
  .analytics-unit-overview span,
  .events-header p,
  .events-toolbar label,
  .event-calendar-weekdays,
  .event-calendar-day span,
  .event-day-metrics span,
  .event-summary-lists .notice,
  .event-list-card span,
  .events-empty-state span,
  .event-list-head span,
  .reports-header p,
  .reports-toolbar label,
  .reports-overview span,
  .reports-empty-state,
  .system-header p,
  .system-panel-header p,
  .system-card span,
  .dictionaries-header p
) {
  color: var(--muted);
}

.layout.app-shell :where(
  .unit-structure-summary span,
  .unit-structure-label,
  .unit-structure-drag-handle
) {
  border-color: var(--line);
  background: var(--panel);
  color: var(--text);
}

.layout.app-shell :where(.unit-structure-summary strong) {
  color: var(--accent);
}

.layout.app-shell :where(.unit-structure-node::before) {
  background: color-mix(in srgb, var(--accent) 44%, var(--line));
}

.layout.app-shell :where(.unit-structure-node.is-root::before) {
  background: var(--accent);
}

.layout.app-shell :where(.unit-structure-drop-zone.is-drop-target) {
  background: var(--accent);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 18%, transparent);
}

.layout.app-shell :where(.unit-structure-node.is-drop-target) {
  border-color: var(--accent);
  box-shadow: inset 0 0 0 1px var(--accent);
}

.layout.app-shell :where(
  .positions-empty strong,
  .summary-metric-card strong,
  .summary-incident-card strong,
  .analytics-metric strong,
  .reports-overview strong
) {
  color: var(--text);
}

.layout.app-shell :where(
  .control-page .control-table-scroll,
  .logistics-table-scroll,
  .unit-table-scroll,
  .summary-table-scroll,
  .system-table-wrap,
  .dictionaries-table-wrap
) {
  border-color: var(--line);
  background: var(--panel);
}

.layout.app-shell :where(
  .control-page .control-table,
  .logistics-table,
  .unit-table,
  .summary-table,
  .analytics-table,
  .reports-table,
  .system-table,
  .dictionaries-table
) {
  background: var(--panel);
  color: var(--text);
}

.layout.app-shell :where(
  .control-page .control-table th,
  .logistics-table th,
  .unit-table th,
  .summary-table th,
  .analytics-table th,
  .reports-table th,
  .system-table th,
  .dictionaries-table th
) {
  border-color: var(--line);
  background: color-mix(in srgb, var(--bg) 44%, var(--panel));
  color: var(--muted);
}

.layout.app-shell :where(
  .control-page .control-table td,
  .logistics-table td,
  .unit-table td,
  .summary-table td,
  .analytics-table td,
  .reports-table td,
  .system-table td,
  .dictionaries-table td
) {
  border-color: color-mix(in srgb, var(--line) 86%, transparent);
  color: color-mix(in srgb, var(--text) 94%, var(--muted));
}

.layout.app-shell :where(
  .control-row:hover td,
  .analytics-table tbody tr[data-analytics-unit]:hover,
  .logistics-row:hover td
) {
  background: var(--row-hover);
}

.layout.app-shell :where(
  .positions-filter-field input,
  .positions-filter-field select,
  .logistics-filter-field input,
  .logistics-filter-field select,
  .logistics-filter-archive-button,
  .unit-filter-field input,
  .summary-filter-field input,
  .summary-time-grid input,
  .analytics-toolbar input,
  .analytics-toolbar select,
  .analytics-toolbar button,
  .events-toolbar input,
  .events-toolbar button,
  .event-calendar-head button,
  .event-day-summary button,
  .reports-toolbar input,
  .reports-toolbar select,
  .reports-toolbar button,
  .system-toolbar input,
  .system-toolbar select,
  .dictionaries-toolbar input,
  .dictionaries-toolbar select
) {
  border-color: var(--control-border);
  background: color-mix(in srgb, var(--bg) 62%, var(--panel));
  color: var(--text);
}

.layout.app-shell :where(
  .positions-route-pill,
  .logistics-route-pill,
  .unit-route-pill,
  .summary-route-pill,
  .summary-period-pill,
  .analytics-status,
  .events-status,
  .reports-status,
  .report-status-pill,
  .system-status,
  .system-panel-header span,
  .system-pill,
  .dictionaries-status,
  .dictionaries-detail header span
) {
  border: 1px solid color-mix(in srgb, var(--accent) 40%, var(--line));
  background: color-mix(in srgb, var(--accent) 13%, var(--panel));
  color: color-mix(in srgb, var(--accent) 36%, var(--text));
}

.layout.app-shell :where(
  .unit-tabs a,
  .unit-subtabs a,
  .summary-tabs a,
  .system-tabs a,
  .dictionaries-list a
) {
  border-color: var(--line);
  background: var(--panel);
  color: var(--text);
}

.layout.app-shell :where(
  .unit-tabs a.is-active,
  .unit-subtabs a.is-active,
  .summary-tabs a.is-active,
  .system-tabs a.active,
  .dictionaries-list a.active
) {
  border-color: color-mix(in srgb, var(--accent) 72%, var(--line));
  background: color-mix(in srgb, var(--accent) 18%, var(--panel));
  color: var(--text);
  box-shadow: inset 3px 0 0 var(--accent);
}

.layout.app-shell :where(
  .positions-route-error,
  .logistics-route-error,
  .unit-route-error,
  .summary-route-error,
  .events-error,
  .reports-error,
  .system-error,
  .dictionaries-error
) {
  border-color: color-mix(in srgb, var(--red) 62%, var(--line));
  background: color-mix(in srgb, var(--red) 11%, var(--panel));
  color: color-mix(in srgb, var(--red) 28%, var(--text));
}

.layout.app-shell :where(
  .logistics-empty-state,
  .unit-empty-state,
  .summary-empty-state,
  .reports-empty-state,
  .events-empty-state
) {
  border-color: color-mix(in srgb, var(--line) 82%, var(--accent));
  background: color-mix(in srgb, var(--soft-panel) 56%, transparent);
}

.layout.app-shell :where(.status-pill, .logistics-status-pill, .unit-status-pill) {
  background: color-mix(in srgb, var(--neutral) 78%, var(--panel));
  color: var(--text);
}

.layout.app-shell :where(.status-pill--bg, .logistics-status-pill--success, .unit-status-pill.is-success) {
  background: color-mix(in srgb, var(--green) 82%, var(--mix-success-deep));
  color: var(--on-status);
}

.layout.app-shell :where(.status-pill--waiting, .logistics-status-pill--warning, .system-pill.is-warning) {
  background: color-mix(in srgb, var(--yellow) 78%, var(--mix-warning-deep));
  color: var(--on-warning);
}

.layout.app-shell :where(.status-pill--not_bg, .status-pill--no_report, .logistics-status-pill--danger, .unit-status-pill.is-danger, .system-pill.is-danger) {
  background: color-mix(in srgb, var(--red) 82%, var(--mix-danger-deep));
  color: var(--on-status);
}

.layout.app-shell :where(.logistics-status-pill--done) {
  background: color-mix(in srgb, var(--purple) 74%, var(--mix-purple-deep));
  color: var(--on-status);
}

.layout.app-shell :where(.event-calendar-day) {
  border-color: var(--line);
  background: var(--soft-panel);
}

.layout.app-shell :where(.event-calendar-day.heat-1) {
  background: color-mix(in srgb, var(--yellow) 16%, var(--panel));
}

.layout.app-shell :where(.event-calendar-day.heat-2) {
  border-color: color-mix(in srgb, var(--yellow) 55%, var(--line));
  background: color-mix(in srgb, var(--yellow) 28%, var(--panel));
}

.layout.app-shell :where(.event-calendar-day.heat-3) {
  border-color: color-mix(in srgb, var(--red) 45%, var(--line));
  background: color-mix(in srgb, var(--red) 22%, var(--panel));
}

.layout.app-shell :where(.event-calendar-day.heat-4) {
  border-color: var(--red);
  background: color-mix(in srgb, var(--red) 36%, var(--panel));
}