/* =============================================================================
   OrganicSystem — UI-1.12 Global Navigation Theme Standardization
   Shared Light/Dark theme for shell navigation chrome. Consumes --os-* tokens.

   SCOPE (nav-scoped selectors only):
   - Sidebar (.app-sidebar, .sb-link, .sb-group, .sb-subgroup)
   - Top ribbon / topbar (.app-topbar, .app-icon-btn, profile/lang controls)
   - Classic header main menu (.os-app-header .nav-link)
   - Module main menu / PRS ribbon (.module-main-btn, .prs-ribbon-btn, sections)
   - Breadcrumb (.os-erp-breadcrumb*)
   - Module header (.os-module-toolbar)
   - Page header chrome (.os-desktop-page-header, .os-page-header-chrome-host)
   - Navigation icon / chrome buttons (topbar + header icon buttons)

   OUT OF SCOPE:
   - Routes, permissions, menu structure / markup
   - Filter bar semantics (UI-1.10)
   - Form/card panels (UI-1.11), grids/tables, dropdown popup chrome (UI-1.4)

   Load AFTER os-theme-apply.css (and after button/form theme sheets) so nav
   states win without fighting concurrent UI-1.x component CSS.
   ============================================================================= */

/* ---- Nav token aliases (UI-1.1 --os-* + shell tokens) ---- */
:root,
html[data-theme="light"],
body[data-theme="light"] {
  --os-nav-surface: var(--os-color-sidebar, var(--os-color-surface));
  --os-nav-surface-elevated: var(--os-color-sidebar-elevated, var(--os-color-surface));
  --os-nav-border: var(--os-erp-chrome-border, var(--os-color-border));
  --os-nav-text: var(--os-color-text);
  --os-nav-text-muted: var(--os-color-text-muted);
  --os-nav-hover-bg: var(--os-shell-nav-hover, var(--os-color-hover));
  --os-nav-hover-text: var(--os-color-text);
  --os-nav-active-bg: var(--os-shell-nav-active, var(--os-color-accent));
  --os-nav-active-text: var(--os-shell-nav-active-text, var(--os-color-text-inverse));
  --os-nav-selected-bg: var(--os-shell-nav-active, var(--os-color-accent));
  --os-nav-selected-text: var(--os-shell-nav-active-text, var(--os-color-text-inverse));
  --os-nav-disabled-bg: var(--os-color-button-disabled, var(--os-color-surface-muted));
  --os-nav-disabled-text: var(--os-color-button-disabled-text, var(--os-color-text-muted));
  --os-nav-disabled-border: var(--os-color-border);
  --os-nav-chrome-bg: var(--os-erp-chrome-bg, var(--os-color-surface));
  --os-nav-accent-soft: var(--os-shell-accent-soft, var(--os-color-primary-soft));
  --os-nav-danger: var(--os-color-danger);
  --os-nav-focus-ring: var(--os-color-focus-ring, color-mix(in srgb, var(--os-color-primary) 35%, transparent));
}

html[data-theme="dark"],
body[data-theme="dark"] {
  --os-nav-surface: var(--os-color-sidebar, var(--os-color-surface));
  --os-nav-surface-elevated: var(--os-color-sidebar-elevated, var(--os-color-surface-muted));
  --os-nav-border: var(--os-erp-chrome-border, var(--os-color-border));
  --os-nav-text: var(--os-color-text);
  --os-nav-text-muted: var(--os-color-text-muted);
  --os-nav-hover-bg: var(--os-shell-nav-hover, var(--os-color-hover));
  --os-nav-hover-text: var(--os-shell-nav-active-text, var(--os-color-text));
  --os-nav-active-bg: var(--os-shell-nav-active, color-mix(in srgb, var(--os-color-accent) 28%, var(--os-color-surface)));
  --os-nav-active-text: var(--os-shell-nav-active-text, var(--os-color-text));
  --os-nav-selected-bg: var(--os-nav-active-bg);
  --os-nav-selected-text: var(--os-nav-active-text);
  --os-nav-disabled-bg: var(--os-color-button-disabled, var(--os-color-surface-muted));
  --os-nav-disabled-text: var(--os-color-button-disabled-text, var(--os-color-text-muted));
  --os-nav-disabled-border: var(--os-color-border);
  --os-nav-chrome-bg: var(--os-erp-chrome-bg, var(--os-color-surface));
  --os-nav-accent-soft: var(--os-shell-accent-soft, var(--os-color-primary-soft));
  --os-nav-danger: var(--os-color-danger);
}

/* =============================================================================
   Sidebar
   ============================================================================= */
body.os-module-shell .app-sidebar {
  background-color: var(--os-nav-surface) !important;
  color: var(--os-nav-text) !important;
  border-color: var(--os-nav-border) !important;
}

body.os-module-shell .app-sidebar__brand,
body.os-module-shell .app-sidebar__search {
  border-color: var(--os-nav-border);
  color: var(--os-nav-text);
}

body.os-module-shell .app-sidebar__title {
  color: var(--os-nav-text);
}

body.os-module-shell .app-sidebar__search input {
  background: var(--os-color-form-control-bg, var(--os-nav-surface-elevated));
  color: var(--os-nav-text);
  border-color: var(--os-nav-border);
}

body.os-module-shell .app-sidebar__search input::placeholder {
  color: var(--os-nav-text-muted);
}

body.os-module-shell .sb-group__toggle,
body.os-module-shell .sb-subgroup__toggle,
body.os-module-shell .sb-link {
  color: var(--os-nav-text);
  background: transparent;
  border-color: transparent;
}

body.os-module-shell .sb-group__name,
body.os-module-shell .sb-subgroup__name,
body.os-module-shell .sb-link__text,
body.os-module-shell .sb-icon,
body.os-module-shell .sb-group__chevron,
body.os-module-shell .sb-subgroup__chevron {
  color: inherit;
}

/* Hover / focus */
body.os-module-shell .sb-link:hover,
body.os-module-shell .sb-link:focus-visible,
body.os-module-shell .sb-group__toggle:hover,
body.os-module-shell .sb-group__toggle:focus-visible,
body.os-module-shell .sb-subgroup__toggle:hover,
body.os-module-shell .sb-subgroup__toggle:focus-visible {
  background: var(--os-nav-hover-bg) !important;
  color: var(--os-nav-hover-text) !important;
}

body.os-module-shell .sb-link:hover .sb-link__text,
body.os-module-shell .sb-link:hover .sb-icon,
body.os-module-shell .sb-link:hover .bi,
body.os-module-shell .sb-link:focus-visible .sb-link__text,
body.os-module-shell .sb-link:focus-visible .sb-icon,
body.os-module-shell .sb-link:focus-visible .bi,
body.os-module-shell .sb-group__toggle:hover .sb-group__name,
body.os-module-shell .sb-group__toggle:hover .sb-icon,
body.os-module-shell .sb-group__toggle:hover .sb-group__chevron,
body.os-module-shell .sb-group__toggle:hover .bi,
body.os-module-shell .sb-subgroup__toggle:hover .sb-subgroup__name,
body.os-module-shell .sb-subgroup__toggle:hover .sb-subgroup__chevron,
body.os-module-shell .sb-subgroup__toggle:hover .bi {
  color: var(--os-nav-hover-text) !important;
  opacity: 1 !important;
}

/* Active / selected */
body.os-module-shell .sb-item.is-active > .sb-link,
body.os-module-shell .sb-item.is-active > .sb-link:hover,
body.os-module-shell .sb-item.is-active > .sb-link:focus-visible,
body.os-module-shell .sb-item.is-selected > .sb-link {
  background: var(--os-nav-active-bg) !important;
  color: var(--os-nav-active-text) !important;
}

body.os-module-shell .sb-item.is-active > .sb-link .sb-link__text,
body.os-module-shell .sb-item.is-active > .sb-link .sb-icon,
body.os-module-shell .sb-item.is-active > .sb-link .bi,
body.os-module-shell .sb-item.is-active > .sb-link:hover .sb-link__text,
body.os-module-shell .sb-item.is-active > .sb-link:hover .sb-icon,
body.os-module-shell .sb-item.is-active > .sb-link:hover .bi {
  color: var(--os-nav-active-text) !important;
}

/* Disabled sidebar items */
body.os-module-shell .sb-link[aria-disabled="true"],
body.os-module-shell .sb-link.is-disabled,
body.os-module-shell .sb-link:disabled,
body.os-module-shell .sb-group__toggle[aria-disabled="true"],
body.os-module-shell .sb-group__toggle:disabled {
  background: var(--os-nav-disabled-bg) !important;
  color: var(--os-nav-disabled-text) !important;
  border-color: var(--os-nav-disabled-border) !important;
  opacity: 0.55;
  cursor: not-allowed;
  pointer-events: none;
}

body.os-module-shell .sb-link:focus-visible,
body.os-module-shell .sb-group__toggle:focus-visible,
body.os-module-shell .sb-subgroup__toggle:focus-visible {
  outline: 2px solid var(--os-nav-focus-ring);
  outline-offset: 1px;
}

/* Kill prior hardcoded light hex hovers — tokens only */
html[data-theme="light"] body.os-module-shell .sb-link:hover,
html[data-theme="light"] body.os-module-shell .sb-link:focus-visible,
body.os-module-shell[data-theme="light"] .sb-link:hover,
body.os-module-shell[data-theme="light"] .sb-link:focus-visible,
html[data-theme="light"] body.os-module-shell .sb-group__toggle:hover,
html[data-theme="light"] body.os-module-shell .sb-subgroup__toggle:hover,
body.os-module-shell[data-theme="light"] .sb-group__toggle:hover,
body.os-module-shell[data-theme="light"] .sb-subgroup__toggle:hover {
  background: var(--os-nav-hover-bg) !important;
  color: var(--os-nav-hover-text) !important;
}

html[data-theme="light"] body.os-module-shell .sb-link:hover .sb-link__text,
html[data-theme="light"] body.os-module-shell .sb-link:hover .sb-icon,
html[data-theme="light"] body.os-module-shell .sb-link:hover .bi,
html[data-theme="light"] body.os-module-shell .sb-group__toggle:hover .sb-group__name,
html[data-theme="light"] body.os-module-shell .sb-group__toggle:hover .sb-icon,
html[data-theme="light"] body.os-module-shell .sb-group__toggle:hover .sb-group__chevron,
html[data-theme="light"] body.os-module-shell .sb-subgroup__toggle:hover .sb-subgroup__name,
html[data-theme="light"] body.os-module-shell .sb-subgroup__toggle:hover .sb-subgroup__chevron,
body.os-module-shell[data-theme="light"] .sb-link:hover .sb-link__text,
body.os-module-shell[data-theme="light"] .sb-link:hover .sb-icon,
body.os-module-shell[data-theme="light"] .sb-link:hover .bi,
body.os-module-shell[data-theme="light"] .sb-group__toggle:hover .sb-group__name,
body.os-module-shell[data-theme="light"] .sb-group__toggle:hover .sb-icon,
body.os-module-shell[data-theme="light"] .sb-group__toggle:hover .sb-group__chevron,
body.os-module-shell[data-theme="light"] .sb-subgroup__toggle:hover .sb-subgroup__name,
body.os-module-shell[data-theme="light"] .sb-subgroup__toggle:hover .sb-subgroup__chevron {
  color: var(--os-nav-hover-text) !important;
}

html[data-theme="light"] body.os-module-shell .sb-item.is-active > .sb-link:hover,
html[data-theme="light"] body.os-module-shell .sb-item.is-active > .sb-link:focus-visible,
body.os-module-shell[data-theme="light"] .sb-item.is-active > .sb-link:hover,
body.os-module-shell[data-theme="light"] .sb-item.is-active > .sb-link:focus-visible {
  background: var(--os-nav-active-bg) !important;
  color: var(--os-nav-active-text) !important;
}

/* =============================================================================
   Top ribbon / topbar
   ============================================================================= */
body.os-module-shell .app-topbar,
body.os-module-shell .app-main > .app-topbar {
  background: color-mix(in srgb, var(--os-nav-chrome-bg) 94%, transparent) !important;
  color: var(--os-nav-text) !important;
  border-bottom-color: var(--os-nav-border) !important;
}

body.os-module-shell .app-topbar__company {
  background: var(--os-nav-accent-soft) !important;
  border-color: var(--os-nav-border) !important;
  color: var(--os-nav-text) !important;
}

body.os-module-shell .app-topbar__menu,
body.os-module-shell .app-icon-btn,
body.os-module-shell .app-profile__toggle,
body.os-module-shell .os-theme-toggle-btn {
  color: var(--os-nav-text);
}

body.os-module-shell .app-icon-btn:hover,
body.os-module-shell .app-icon-btn:focus-visible,
body.os-module-shell .app-topbar__menu:hover,
body.os-module-shell .app-profile__toggle:hover,
body.os-module-shell .app-profile.is-open .app-profile__toggle {
  background: var(--os-nav-hover-bg) !important;
  border-color: var(--os-nav-border) !important;
  color: var(--os-nav-hover-text) !important;
}

body.os-module-shell .app-icon-btn:active,
body.os-module-shell .app-topbar__menu:active {
  background: var(--os-nav-accent-soft) !important;
  color: var(--os-nav-text) !important;
}

body.os-module-shell .app-icon-btn:disabled,
body.os-module-shell .app-icon-btn[aria-disabled="true"],
body.os-module-shell .app-topbar__menu:disabled,
body.os-module-shell .app-topbar__menu[aria-disabled="true"],
body.os-module-shell .os-theme-toggle-btn:disabled {
  background: var(--os-nav-disabled-bg) !important;
  color: var(--os-nav-disabled-text) !important;
  border-color: var(--os-nav-disabled-border) !important;
  opacity: 0.55;
  cursor: not-allowed;
  pointer-events: none;
}

body.os-module-shell .app-dropdown__link--danger {
  color: var(--os-nav-danger) !important;
}

html[data-theme="dark"] body.os-module-shell .app-dropdown__link--danger,
body.os-module-shell[data-theme="dark"] .app-dropdown__link--danger {
  color: var(--os-nav-danger) !important;
}

/* =============================================================================
   Classic app header — main menu links
   ============================================================================= */
body.os-app-shell:not(.os-module-shell) .os-app-header .navbar .nav-link:not(.btn-link),
body.os-app-shell:not(.os-module-shell) .os-app-header .navbar .btn-link.nav-link {
  color: var(--os-color-text-inverse);
}

body.os-app-shell:not(.os-module-shell) .os-app-header .navbar .nav-link:not(.btn-link):hover:not(.os-btn-selected):not(:disabled),
body.os-app-shell:not(.os-module-shell) .os-app-header .navbar .nav-link:not(.btn-link):focus-visible:not(.os-btn-selected):not(:disabled) {
  background: var(--os-btn-chrome-hover-bg);
  border-color: var(--os-btn-chrome-hover-border);
  color: var(--os-color-text-inverse);
}

body.os-app-shell:not(.os-module-shell) .os-app-header .navbar .nav-link:not(.btn-link).active,
body.os-app-shell:not(.os-module-shell) .os-app-header .navbar .nav-link:not(.btn-link).os-nav-active,
body.os-app-shell:not(.os-module-shell) .os-app-header .navbar .nav-link:not(.btn-link).os-btn-selected {
  background: var(--os-btn-chrome-selected-bg);
  border-color: var(--os-btn-chrome-selected-border);
  color: var(--os-color-text-inverse);
}

body.os-app-shell:not(.os-module-shell) .os-app-header .navbar .nav-link:disabled,
body.os-app-shell:not(.os-module-shell) .os-app-header .navbar .nav-link[aria-disabled="true"] {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}

/* =============================================================================
   Module main menu / PRS ribbon (submenu panels + nav buttons)
   ============================================================================= */
.module-main-section,
.prs-ribbon-section {
  background: var(--os-color-surface) !important;
  border-color: var(--os-color-border) !important;
  color: var(--os-nav-text);
}

.module-main-section-title,
.prs-ribbon-section-title {
  color: var(--os-nav-text-muted) !important;
}

.module-main-section.is-sidebar-selected {
  border-color: var(--os-module-header-bg, var(--os-color-primary));
  background: var(--os-module-accent-softer, var(--os-nav-accent-soft)) !important;
}

.module-main-btn,
.prs-ribbon-btn,
button.module-main-btn.module-main-group-toggle,
button.module-main-btn.module-main-section-trigger {
  color: var(--os-color-input-text, var(--os-nav-text));
  border-color: var(--os-btn-border, var(--os-color-border));
  background: var(--os-btn-neutral-bg, var(--os-color-button, var(--os-color-surface)));
}

.module-main-btn:hover:not(.os-btn-selected):not(.active):not(.is-selected):not(.module-main-btn-disabled):not(:disabled),
.prs-ribbon-btn:hover:not(.os-btn-selected):not(.active):not(.is-selected):not(.prs-ribbon-btn-disabled):not(:disabled),
.module-main-group-toggle:hover:not(.os-btn-selected):not(.active):not(:disabled),
.module-main-section-trigger:hover:not(.os-btn-selected):not(.active):not(:disabled) {
  background: var(--os-btn-neutral-bg-hover, var(--os-nav-hover-bg)) !important;
  border-color: var(--os-module-header-bg, var(--os-btn-border-hover, var(--os-color-border))) !important;
  color: var(--os-module-header-bg, var(--os-color-primary)) !important;
}

.module-main-btn:active:not(.module-main-btn-disabled):not(.active):not(.is-selected):not(:disabled),
.prs-ribbon-btn:active:not(.prs-ribbon-btn-disabled):not(.active):not(.is-selected):not(:disabled) {
  background: var(--os-btn-neutral-bg-hover, var(--os-nav-hover-bg)) !important;
  border-color: var(--os-btn-border, var(--os-color-border)) !important;
  color: var(--os-nav-text) !important;
}

.module-main-btn.os-btn-selected:not(.active):not(.is-selected),
.prs-ribbon-btn.os-btn-selected:not(.active):not(.is-selected),
.module-main-group-toggle.os-btn-selected:not(.active),
.module-main-section-trigger.os-btn-selected:not(.active) {
  background: var(--os-btn-neutral-bg-selected, var(--os-nav-accent-soft)) !important;
  border-color: var(--os-module-header-bg, var(--os-btn-border-hover)) !important;
  color: var(--os-module-header-bg, var(--os-color-primary)) !important;
}

.module-main-btn.active,
.module-main-btn.is-selected,
.module-main-group-toggle.active,
.module-main-section-trigger.active,
.prs-ribbon-btn.active,
.prs-ribbon-btn.is-selected {
  color: var(--os-module-header-text, var(--os-color-text-inverse)) !important;
  border-color: var(--os-module-header-bg, var(--os-color-primary)) !important;
  background: var(--os-module-header-bg, var(--os-color-primary)) !important;
}

.module-main-btn-disabled,
.prs-ribbon-btn-disabled,
a.module-main-btn.module-main-btn-disabled,
.module-main-btn:disabled,
.prs-ribbon-btn:disabled,
.module-main-btn[aria-disabled="true"],
.prs-ribbon-btn[aria-disabled="true"] {
  color: var(--os-nav-disabled-text) !important;
  background: var(--os-nav-disabled-bg) !important;
  border-color: var(--os-nav-disabled-border) !important;
  cursor: not-allowed;
  pointer-events: none;
  opacity: 1;
}

.module-main-btn-disabled:hover,
.module-main-btn-disabled:active,
.module-main-btn-disabled.is-selected,
.prs-ribbon-btn-disabled:hover,
.prs-ribbon-btn-disabled:active,
.prs-ribbon-btn-disabled.is-selected,
a.module-main-btn.module-main-btn-disabled:hover,
a.module-main-btn.module-main-btn-disabled:active,
a.module-main-btn.module-main-btn-disabled.is-selected {
  background: var(--os-nav-disabled-bg) !important;
  border-color: var(--os-nav-disabled-border) !important;
  color: var(--os-nav-disabled-text) !important;
  box-shadow: none;
}

/* =============================================================================
   Breadcrumb (removed globally — keep theme rules inert)
   ============================================================================= */
.os-erp-breadcrumb,
.os-erp-page-header__crumbs {
  display: none !important;
}

.os-erp-breadcrumb__link {
  color: var(--os-nav-text-muted) !important;
}

.os-erp-breadcrumb__link:hover,
.os-erp-breadcrumb__link:focus-visible {
  color: var(--os-color-accent, var(--os-color-primary)) !important;
}

.os-erp-breadcrumb__current {
  color: var(--os-nav-text) !important;
}

.os-erp-breadcrumb__sep {
  color: var(--os-nav-text-muted) !important;
}

.breadcrumb,
.breadcrumb-item,
.breadcrumb-item a {
  color: var(--os-nav-text);
  background-color: transparent;
}

.breadcrumb-item.active {
  color: var(--os-nav-text-muted);
}

.breadcrumb-item a:hover,
.breadcrumb-item a:focus-visible {
  color: var(--os-color-accent, var(--os-color-primary));
}

/* =============================================================================
   Module header (filter ribbon host)
   ============================================================================= */
.os-module-toolbar {
  background: var(--os-module-header-bg, var(--os-color-header, var(--os-color-primary))) !important;
  color: var(--os-module-header-text, var(--os-color-text-inverse)) !important;
  border-bottom-color: var(--os-module-header-border, color-mix(in srgb, var(--os-color-text-inverse) 18%, transparent)) !important;
}

.os-module-ags .os-module-toolbar .module-main-filter-label,
.os-module-ags .os-module-toolbar .prs-station-label,
.os-module-aps .os-module-toolbar .module-main-filter-label,
.os-module-aps .os-module-toolbar .prs-station-label,
.os-module-prs .os-module-toolbar .module-main-filter-label,
.os-module-prs .os-module-toolbar .prs-station-label {
  color: var(--os-module-header-text, var(--os-color-text-inverse));
}

/* =============================================================================
   Page header chrome (surface / text only — layout owned elsewhere)
   ============================================================================= */
.os-desktop-page-header,
.os-page-header-chrome-host,
#os-app-page-chrome-host:not([hidden]) {
  color: var(--os-nav-text);
  border-color: var(--os-nav-border);
}

.os-desktop-page-header h1,
.os-desktop-page-header .h3,
.os-page-header-chrome-host h1,
.os-page-header-chrome-host .h3,
.os-page-header-title-row {
  color: var(--os-nav-text);
}

#os-app-page-chrome-host:not([hidden]) {
  background-color: var(--os-nav-chrome-bg) !important;
  border-color: var(--os-nav-border) !important;
}