/* =============================================================================
   OrganicSystem Theme Apply — FINAL kill-switch (Light + Dark)
   Every listed UI surface resolves through Theme Engine CSS variables only.
   Loads last so page/vendor CSS cannot hardcode over the active theme.
   WCAG AA: contrast comes from tokens in os-theme.css (text/muted/link).
   ============================================================================= */

html[data-theme="light"],
html[data-theme="dark"],
body[data-theme="light"],
body[data-theme="dark"] {
  color-scheme: light dark;
}

html[data-theme="light"],
body[data-theme="light"] {
  color-scheme: light;
}

html[data-theme="dark"],
body[data-theme="dark"] {
  color-scheme: dark;
}

/* ---- Pages / workspace ---- */
html,
body,
.os-app-body,
.app-main,
.app-content,
main.os-app-main,
.os-page-scroll,
.module-main-page,
.plan-page,
[class*="-edit-page"],
[class*="-index-page"] {
  background-color: var(--bg, var(--os-color-page-bg)) !important;
  color: var(--os-color-text) !important;
}

/* ---- Header / topbar / toolbar / footer / sidebar / breadcrumb ---- */
.app-topbar,
.os-app-header,
.os-module-toolbar,
.os-page-toolbar,
.os-filter-bar,
.os-erp-breadcrumb,
#os-app-page-chrome-host:not([hidden]),
.os-app-footer,
footer.footer,
.app-sidebar,
.os-app-navbar {
  background-color: var(--toolbar, var(--os-color-toolbar)) !important;
  color: var(--os-color-text) !important;
  border-color: var(--border, var(--os-color-border)) !important;
}

.app-sidebar {
  background-color: var(--sidebar, var(--os-color-sidebar)) !important;
}

.os-app-footer,
footer.footer {
  background-color: var(--footer, var(--os-color-footer)) !important;
  color: var(--os-color-text-muted) !important;
}

body.os-app-shell:not(.os-module-shell) > header.os-app-header,
body.os-app-shell:not(.os-module-shell) .os-app-navbar.bg-primary {
  background-color: var(--header, var(--os-color-header)) !important;
  color: var(--os-color-text-inverse) !important;
}

body.os-app-shell:not(.os-module-shell) .os-app-navbar .nav-link,
body.os-app-shell:not(.os-module-shell) .os-app-navbar .btn-link {
  color: var(--os-color-text-inverse) !important;
}

/* ---- Cards / panels / sections ---- */
/* FINAL surface polish: os-forms-cards-panels-theme.css (UI-1.11). */
.card,
.os-form-card,
.os-section,
.module-section-panel,
.module-main-group-panel,
.accordion-item,
.list-group-item,
.plan-grid-panel,
.rotation-panel {
  background-color: var(--card, var(--os-color-card)) !important;
  color: var(--os-color-text) !important;
  border-color: var(--border, var(--os-color-border)) !important;
}

.card-header,
.card-footer,
.modal-header,
.modal-footer,
.offcanvas-header,
.os-section__header,
.os-desktop-section-title,
.aps-site-section-title,
.os-form-section-title,
.module-section-title,
.plan-grid-panel-title,
.rotation-panel-title {
  background: var(--os-section-header-bg, var(--os-color-section-header)) !important;
  color: var(--os-section-header-text, var(--os-color-section-title-text)) !important;
  border-color: var(--border, var(--os-color-border)) !important;
}

/* ---- Forms / inputs / selects / textareas ---- */
.form-control,
.form-select,
.form-control-sm,
.form-select-sm,
textarea.form-control,
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),
select,
.login-input,
select.login-input,
.dx-texteditor,
.dx-texteditor.dx-editor-outlined,
.dx-texteditor-input,
.dx-selectbox,
.dx-tagbox,
.dx-dropdownbox,
.dx-lookup,
.dx-numberbox,
.dx-datebox,
.dx-textarea,
.dx-autocomplete,
.dx-editor-cell .dx-texteditor,
.dx-editor-cell .dx-texteditor-input,
.module-main-filter-select,
.module-main-filter-select-multiple,
.prs-station-select,
.rotation-toolbar-select,
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple,
.ts-wrapper .ts-control {
  background-color: var(--input-bg, var(--os-color-form-control-bg)) !important;
  color: var(--input-text, var(--os-color-input-text)) !important;
  border-color: var(--input-border, var(--os-color-form-border)) !important;
  -webkit-text-fill-color: var(--input-text, var(--os-color-input-text));
  caret-color: var(--input-text, var(--os-color-input-text));
}

.form-control:focus,
.form-select:focus,
.dx-texteditor.dx-state-focused,
.dx-texteditor.dx-state-focused .dx-texteditor-input {
  background-color: var(--os-color-input-focus) !important;
  border-color: var(--os-color-focus-border) !important;
  box-shadow: 0 0 0 0.15rem var(--os-color-focus-ring) !important;
  color: var(--input-text, var(--os-color-input-text)) !important;
}

.form-control::placeholder,
input::placeholder,
textarea::placeholder,
.dx-placeholder,
.dx-placeholder::before {
  color: var(--os-color-placeholder) !important;
  -webkit-text-fill-color: var(--os-color-placeholder);
  opacity: 1;
}

label,
.form-label,
.col-form-label,
legend,
.os-field-caption,
.os-filter-label,
.os-toolbar-label {
  color: var(--os-color-form-label-text) !important;
}

/* ---- Checkboxes / radios ---- */
.form-check-input,
.form-check-input[type="checkbox"],
.form-check-input[type="radio"],
.dx-checkbox-icon,
.dx-radiobutton-icon {
  background-color: var(--os-color-checkbox) !important;
  border-color: var(--os-color-checkbox-border) !important;
}

.form-check-input:checked,
.dx-checkbox-checked .dx-checkbox-icon {
  background-color: var(--os-color-checkbox-checked-bg) !important;
  border-color: var(--os-color-checkbox-checked-border) !important;
  color: var(--os-color-checkbox-checked-mark) !important;
}

.form-check-input[type="radio"]:checked {
  background-color: var(--os-color-radio-checked-bg) !important;
  border-color: var(--os-color-radio-checked-bg) !important;
}

/* ---- Buttons ---- */
.btn-primary,
.os-btn-primary {
  background-color: var(--os-color-button-primary) !important;
  border-color: var(--os-color-button-primary) !important;
  color: var(--os-color-button-primary-text) !important;
}

.btn-secondary,
.os-btn-secondary,
.btn-outline-secondary {
  background-color: var(--os-color-button-secondary) !important;
  border-color: var(--os-color-border) !important;
  color: var(--os-color-button-secondary-text) !important;
}

.btn-success { background-color: var(--os-color-button-success) !important; border-color: var(--os-color-button-success) !important; color: var(--os-color-button-success-text) !important; }
.btn-danger { background-color: var(--os-color-button-danger) !important; border-color: var(--os-color-button-danger) !important; color: var(--os-color-button-danger-text) !important; }
.btn-warning { background-color: var(--os-color-button-warning) !important; border-color: var(--os-color-button-warning) !important; color: var(--os-color-button-warning-text) !important; }
.btn-outline-primary { background-color: var(--os-color-button-outline) !important; border-color: var(--os-color-primary) !important; color: var(--os-color-button-outline-text) !important; }

/* Neutral chrome only — do not wash out semantic fills (New/Save/Delete). */
.os-module-toolbar .btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info),
.os-page-toolbar .btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info),
.os-page-toolbar-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info) {
  color: var(--os-btn-text-ink, var(--os-color-button-text)) !important;
  border-color: var(--os-btn-border, var(--os-color-border)) !important;
  background-color: var(--os-btn-neutral-bg, var(--os-color-button)) !important;
}

/* Filter-bar slot: outline/neutral actions stay ink-on-surface. */
.os-module-toolbar .os-app-page-toolbar-slot .btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info),
.os-module-toolbar .os-app-page-toolbar-slot .os-page-toolbar-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info),
.os-module-toolbar .os-app-page-toolbar-slot .os-page-toolbar-icon-btn:not(.btn-primary):not(.btn-success):not(.btn-danger),
.os-module-toolbar .os-app-page-toolbar-slot a.btn:not(.btn-primary):not(.btn-success):not(.btn-danger),
.os-module-toolbar .os-app-page-toolbar-slot button.btn:not(.btn-primary):not(.btn-success):not(.btn-danger),
#os-app-page-toolbar-slot .btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info),
#os-app-page-toolbar-slot .os-page-toolbar-btn:not(.btn-primary):not(.btn-success):not(.btn-danger) {
  color: var(--os-btn-text-ink, var(--os-color-button-text)) !important;
  border-color: var(--os-btn-border, var(--os-color-border)) !important;
  background-color: var(--os-btn-neutral-bg, var(--os-color-button)) !important;
  background-image: none !important;
}

.os-module-toolbar .os-app-page-toolbar-slot .btn:not(.btn-primary):not(.btn-success):not(.btn-danger) .bi,
.os-module-toolbar .os-app-page-toolbar-slot .btn:not(.btn-primary):not(.btn-success):not(.btn-danger) i,
.os-module-toolbar .os-app-page-toolbar-slot .os-page-toolbar-btn:not(.btn-primary):not(.btn-success):not(.btn-danger) .bi,
.os-module-toolbar .os-app-page-toolbar-slot .os-page-toolbar-btn:not(.btn-primary):not(.btn-success):not(.btn-danger) i,
#os-app-page-toolbar-slot .btn:not(.btn-primary):not(.btn-success):not(.btn-danger) .bi,
#os-app-page-toolbar-slot .os-page-toolbar-btn:not(.btn-primary):not(.btn-success):not(.btn-danger) .bi {
  color: inherit !important;
}

/*
 * Filled actions (New / Save / …): keep colored backgrounds + on-fill text.
 * Without the fill, white labels disappear on the light filter bar.
 */
.os-module-toolbar .os-app-page-toolbar-slot .btn-primary,
.os-module-toolbar .os-app-page-toolbar-slot .os-page-toolbar-labeled-btn.btn-primary,
#os-app-page-toolbar-slot .btn-primary,
#os-app-page-toolbar-slot .os-page-toolbar-labeled-btn.btn-primary {
  background-color: var(--os-color-button-primary) !important;
  border-color: var(--os-color-button-primary) !important;
  color: var(--os-btn-text-on-fill, var(--os-color-text-inverse)) !important;
  background-image: none !important;
}

.os-module-toolbar .os-app-page-toolbar-slot .btn-success,
.os-module-toolbar .os-app-page-toolbar-slot .os-page-toolbar-labeled-btn.btn-success,
#os-app-page-toolbar-slot .btn-success,
#os-app-page-toolbar-slot .os-page-toolbar-labeled-btn.btn-success {
  background-color: var(--os-color-button-success) !important;
  border-color: var(--os-color-button-success) !important;
  color: var(--os-btn-text-on-fill, var(--os-color-text-inverse)) !important;
  background-image: none !important;
}

.os-module-toolbar .os-app-page-toolbar-slot .btn-danger,
.os-module-toolbar .os-app-page-toolbar-slot .os-page-toolbar-labeled-btn.btn-danger,
#os-app-page-toolbar-slot .btn-danger,
#os-app-page-toolbar-slot .os-page-toolbar-labeled-btn.btn-danger {
  background-color: var(--os-color-button-danger) !important;
  border-color: var(--os-color-button-danger) !important;
  color: var(--os-btn-text-on-fill, var(--os-color-text-inverse)) !important;
  background-image: none !important;
}

.os-module-toolbar .os-app-page-toolbar-slot .btn-warning,
.os-module-toolbar .os-app-page-toolbar-slot .os-page-toolbar-labeled-btn.btn-warning,
#os-app-page-toolbar-slot .btn-warning {
  background-color: var(--os-color-button-warning) !important;
  border-color: var(--os-color-button-warning) !important;
  color: var(--os-btn-text-on-fill, var(--os-color-text-inverse)) !important;
  background-image: none !important;
}

.os-module-toolbar .os-app-page-toolbar-slot .btn-info,
.os-module-toolbar .os-app-page-toolbar-slot .os-page-toolbar-labeled-btn.btn-info,
#os-app-page-toolbar-slot .btn-info {
  background-color: var(--os-color-button-info, var(--os-color-info)) !important;
  border-color: var(--os-color-button-info, var(--os-color-info)) !important;
  color: var(--os-btn-text-on-fill, var(--os-color-text-inverse)) !important;
  background-image: none !important;
}

.os-module-toolbar .os-app-page-toolbar-slot .btn-primary .bi,
.os-module-toolbar .os-app-page-toolbar-slot .btn-success .bi,
.os-module-toolbar .os-app-page-toolbar-slot .btn-danger .bi,
.os-module-toolbar .os-app-page-toolbar-slot .btn-warning .bi,
.os-module-toolbar .os-app-page-toolbar-slot .btn-info .bi,
#os-app-page-toolbar-slot .btn-primary .bi,
#os-app-page-toolbar-slot .btn-success .bi,
#os-app-page-toolbar-slot .btn-danger .bi {
  color: inherit !important;
}

/* ---- Dropdowns / menus ---- */
.dropdown-menu,
.dropdown-item,
.app-dropdown__panel,
.os-language-menu,
.select2-dropdown,
.ts-dropdown {
  background-color: var(--os-app-dropdown-bg, var(--popup-bg)) !important;
  color: var(--os-app-dropdown-color, var(--popup-text)) !important;
  border-color: var(--os-app-dropdown-border, var(--border)) !important;
}

.dropdown-item:hover,
.dropdown-item:focus,
.select2-results__option--highlighted,
.ts-dropdown .option.active,
.app-dropdown__link:hover {
  background-color: var(--os-app-dropdown-hover-bg, var(--os-color-hover)) !important;
  color: var(--os-color-text) !important;
}

/* ---- Date pickers / calendars ---- */
.dx-calendar,
.dx-calendar-navigator,
.dx-calendar-body,
.dx-datebox-wrapper .dx-overlay-content,
.dx-datebox-wrapper .dx-popup-content {
  background-color: var(--calendar-bg, var(--os-color-calendar-bg)) !important;
  color: var(--os-color-calendar-cell-text) !important;
  border-color: var(--os-color-calendar-border) !important;
}

.dx-calendar-cell {
  color: var(--os-color-calendar-cell-text) !important;
}

.dx-calendar-cell:hover {
  background-color: var(--os-color-calendar-cell-hover) !important;
}

.dx-calendar-cell.dx-calendar-selected-date,
.dx-calendar-cell.dx-calendar-selected-date:hover {
  background-color: var(--os-color-calendar-cell-selected) !important;
  color: var(--os-color-calendar-cell-selected-text) !important;
}

.dx-calendar-cell.dx-calendar-today {
  color: var(--os-color-calendar-cell-today) !important;
}

.dx-calendar-cell.dx-calendar-other-view {
  color: var(--os-color-calendar-cell-other) !important;
}

input[type="date"],
input[type="datetime-local"],
input[type="time"],
.dx-datebox .dx-texteditor-input {
  background-color: var(--datepicker-bg, var(--os-color-datepicker)) !important;
  color: var(--input-text) !important;
  border-color: var(--input-border) !important;
  color-scheme: inherit;
}

/* ---- Dialogs / popups / notifications ---- */
.modal-content,
.offcanvas,
.popover,
.toast,
.swal2-popup,
.os-confirm-dialog,
#os-plan-sync-overlay .os-plan-sync-dialog,
.dx-overlay-content.dx-popup-normal,
.dx-overlay-content.dx-popup-draggable,
.dx-dialog-wrapper .dx-overlay-content,
.dx-dropdowneditor-overlay .dx-overlay-content,
.dx-dropdowneditor-overlay .dx-popup-content,
.dx-header-filter-menu .dx-overlay-content,
.dx-loadpanel-content,
[class*="-dropdown"].dx-overlay-wrapper .dx-overlay-content,
[class*="-popup"].dx-overlay-wrapper .dx-overlay-content,
.ags-plan-select-dropdown .dx-overlay-content,
.ags-plan-select-dropdown .dx-popup-content,
.ags-plan-select-dropdown .dx-scrollable,
.ags-plan-select-dropdown .dx-scrollable-content,
.ags-plan-select-dropdown .dx-list {
  background-color: var(--os-color-dropdown, var(--popup-bg, var(--os-color-popup))) !important;
  color: var(--popup-text, var(--os-color-text)) !important;
  border-color: var(--border, var(--os-color-border)) !important;
  opacity: 1 !important;
}

.ags-plan-select-dropdown .dx-list-item,
.ags-plan-select-dropdown .dx-list-item-content {
  color: var(--popup-text, var(--os-color-text)) !important;
}

.ags-plan-select-dropdown .dx-list-item.dx-state-hover,
.ags-plan-select-dropdown .dx-list-item.dx-state-focused,
.ags-plan-select-dropdown .dx-list-item.dx-list-item-selected {
  background-color: var(--os-popup-selection-hover-bg, var(--os-color-hover)) !important;
  color: var(--popup-text, var(--os-color-text)) !important;
}

.modal-backdrop,
.offcanvas-backdrop,
.dx-overlay-shader {
  background-color: var(--os-color-overlay) !important;
}

.toast,
.alert {
  background-color: var(--notification-bg, var(--os-color-notification)) !important;
  color: var(--os-color-text) !important;
  border-color: var(--border) !important;
}

.alert-primary,
.toast.text-bg-primary { background-color: var(--os-color-notification-info-bg) !important; color: var(--os-color-text) !important; }
.alert-success,
.toast.text-bg-success { background-color: var(--os-color-notification-success-bg) !important; color: var(--os-color-text) !important; }
.alert-warning,
.toast.text-bg-warning { background-color: var(--os-color-notification-warning-bg) !important; color: var(--os-color-text) !important; }
.alert-danger,
.toast.text-bg-danger { background-color: var(--os-color-notification-danger-bg) !important; color: var(--os-color-text) !important; }

.tooltip .tooltip-inner {
  background-color: var(--os-color-tooltip) !important;
  color: var(--os-color-tooltip-text) !important;
}

/* ---- Tables / GridViews (base; DataGrid chrome finalized in os-gridview-theme.css UI-1.7) ---- */
.table,
.dx-datagrid,
.dx-datagrid-rowsview,
.dx-datagrid-headers,
.dx-datagrid-total-footer,
.dx-datagrid-pager,
.dx-pager {
  background-color: var(--table-bg, var(--os-color-grid)) !important;
  color: var(--os-color-text) !important;
  border-color: var(--table-border, var(--os-color-grid-border, var(--os-color-border))) !important;
}

.table thead th,
.dx-datagrid-headers .dx-header-row > td,
.dx-datagrid-headers .dx-header-row > th {
  background-color: var(--table-header, var(--os-table-header-bg, var(--os-color-grid-header))) !important;
  color: var(--os-table-header-text, var(--os-color-grid-header-text)) !important;
  border-color: var(--table-border, var(--os-table-border)) !important;
}

.dx-datagrid-rowsview .dx-data-row > td,
.table > :not(caption) > * > * {
  color: var(--os-table-text, var(--os-color-text)) !important;
  border-color: var(--table-border, var(--os-table-border)) !important;
}

.dx-datagrid-rowsview .dx-row-alt > td,
.table-striped > tbody > tr:nth-of-type(odd) > * {
  background-color: var(--os-table-stripe-bg, var(--os-color-grid-alt-row)) !important;
  color: var(--os-table-text, var(--os-color-text)) !important;
}

.dx-datagrid-rowsview .dx-selection > td,
.dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused) > td {
  background-color: var(--os-color-grid-selected) !important;
  color: var(--os-color-text) !important;
}

.dx-datagrid-rowsview .dx-row-focused > td {
  background-color: var(--os-color-grid-focused) !important;
  color: var(--os-color-text) !important;
}

.dx-datagrid-rowsview .dx-data-row:hover > td {
  background-color: var(--os-color-grid-hover) !important;
}

.dx-datagrid-filter-row td {
  background-color: var(--os-color-grid-filter) !important;
}

.dx-datagrid-total-footer,
.dx-datagrid-summary-item,
.table tfoot td {
  background-color: var(--os-table-footer-bg, var(--os-color-grid-totals)) !important;
  color: var(--os-table-text, var(--os-color-text)) !important;
}

/* ---- Progress bars ---- */
.progress {
  background-color: var(--progress-track, var(--os-color-progress-track)) !important;
}

.progress-bar,
#os-plan-sync-bar,
.os-plan-sync-bar,
.dx-progressbar-range {
  background-color: var(--progress-bar, var(--os-color-progress-bar)) !important;
  color: var(--os-btn-text-on-fill) !important;
}

/* ---- Icons ---- */
.bi,
[class^="bi-"],
[class*=" bi-"],
.dx-icon,
.dx-dropdowneditor-icon,
.app-icon-btn,
.sb-icon {
  color: inherit;
}

.app-icon-btn,
.os-theme-toggle-btn {
  color: var(--icon, var(--os-color-icon)) !important;
}

.dx-texteditor .dx-icon,
.dx-texteditor .dx-dropdowneditor-icon,
.dx-texteditor .dx-icon-clear,
.dx-texteditor .dx-icon-search,
.dx-texteditor .dx-icon-date,
.dx-texteditor .dx-icon-clock {
  color: var(--icon-muted, var(--os-color-icon-muted)) !important;
}

/* ---- Scrollbars ---- */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--os-scroll-thumb) var(--os-scroll-track);
}

*::-webkit-scrollbar-track {
  background: var(--os-scroll-track) !important;
}

*::-webkit-scrollbar-thumb {
  background: var(--os-scroll-thumb) !important;
  border-radius: var(--os-scroll-radius);
}

*::-webkit-scrollbar-thumb:hover {
  background: var(--os-scroll-thumb-hover) !important;
}

*::-webkit-scrollbar-thumb:active {
  background: var(--os-scroll-thumb-active) !important;
}

/* ---- Utility overrides that break theme ---- */
.text-muted,
.form-text,
.text-secondary,
.text-body-secondary {
  color: var(--os-color-text-muted) !important;
}

.text-dark,
.text-black,
.text-body {
  color: var(--os-color-text) !important;
}

.bg-white,
.bg-light {
  background-color: var(--os-color-surface) !important;
  color: var(--os-color-text) !important;
}

.bg-dark {
  background-color: var(--os-color-header) !important;
  color: var(--os-color-text-inverse) !important;
}

.border,
.border-top,
.border-bottom,
.border-start,
.border-end {
  border-color: var(--os-color-border) !important;
}

/* Focus ring AA visibility */
:focus-visible {
  outline: 2px solid var(--os-color-focus) !important;
  outline-offset: 2px;
}

/* Phase 8.6 C1 — final cascade guard (loads after os-responsive-form / orientation).
   Portrait/stack column+wrap places #os-app-page-toolbar-slot beside filters and
   overflow-x:clip hides Refresh. Keep module filter column stacked, no wrap. */
body.os-portrait-layout .os-module-toolbar-inner,
html.os-portrait-root .os-module-toolbar-inner,
html[data-os-layout="stack"] .os-module-toolbar-inner,
html[data-os-device="mobile"] .os-module-toolbar-inner {
  flex-direction: column !important;
  flex-wrap: nowrap !important;
}