/* ============================================================================
   Hewa EDMS — Light theme (full rebuild)
   Loads after site.css / theme-responsive / rtl. Active when:
   html[data-theme="light"] OR body.light-theme
   ============================================================================ */

html[data-theme="light"],
body.light-theme {
    /* --- Primary system (readable, low “washed lavender”) --- */
    --accent: #0550ae;
    --accent-hover: #033d8c;
    --accent-light: #0969da;
    --accent-glow: rgba(9, 105, 218, 0.22);
    --accent-rgb: 9, 105, 218;

    --success: #1a7f4c;
    --success-light: rgba(26, 127, 76, 0.12);
    --warning: #bf8700;
    --warning-light: rgba(191, 135, 0, 0.12);
    --danger: #cf222e;
    --danger-light: rgba(207, 34, 46, 0.1);
    --info: #0969da;
    --info-light: rgba(9, 105, 218, 0.1);

    --bg-body: #e8ecf2;
    --bg-surface: #ffffff;
    --bg-card: #ffffff;
    --bg-sidebar: #eef1f6;
    --bg-topnav: #ffffff;
    --bg-hover: rgba(15, 23, 42, 0.055);
    --bg-active: rgba(9, 105, 218, 0.1);

    --glass-bg: #ffffff;
    --glass-border: rgba(15, 23, 42, 0.11);
    --glass-blur: none;
    --glass-bg-hover: #f0f3f8;

    --border: #c5ccd6;
    --border-light: #dfe5ed;
    --border-accent: rgba(9, 105, 218, 0.28);

    --text-primary: #121826;
    --text-secondary: #3d4654;
    --text-muted: #5c6570;
    --text-on-dark: #121826;
    --text-on-dark-muted: #3d4654;
    --text-heading: #0a0e14;

    --primary: #eef1f6;
    --primary-light: #e2e7ef;
    --primary-hover: #d6dde8;

    --shadow-sm: 0 1px 2px rgba(10, 14, 20, 0.05);
    --shadow: 0 2px 8px rgba(10, 14, 20, 0.07);
    --shadow-md: 0 6px 18px rgba(10, 14, 20, 0.09);
    --shadow-lg: 0 14px 36px rgba(10, 14, 20, 0.11);
    --neu-flat: var(--shadow-sm);

    --mesh-gradient: none;

    --surface: #f0f3f8;
    --surface-card: #ffffff;
    --text: #121826;
}

html[data-theme="light"] body,
body.light-theme {
    background: var(--bg-body) !important;
    background-image: none !important;
    color: var(--text-primary);
}

/* --- Shell --- */
html[data-theme="light"] .topnav,
body.light-theme .topnav {
    background: var(--bg-topnav) !important;
    border-bottom: 1px solid var(--border) !important;
    box-shadow: var(--shadow-sm);
    color: var(--text-primary);
}

html[data-theme="light"] .topnav__brand,
body.light-theme .topnav__brand {
    border-right-color: var(--border) !important;
}

html[data-theme="light"] .topnav__brand-text,
body.light-theme .topnav__brand-text {
    color: var(--text-heading) !important;
}

html[data-theme="light"] .topnav__brand-text span,
body.light-theme .topnav__brand-text span {
    color: var(--accent) !important;
}

html[data-theme="light"] .topnav__menu-link,
body.light-theme .topnav__menu-link {
    color: var(--text-secondary) !important;
    font-weight: 600;
}

html[data-theme="light"] .topnav__menu-link:hover,
body.light-theme .topnav__menu-link:hover {
    background: var(--bg-hover) !important;
    color: var(--text-heading) !important;
}

html[data-theme="light"] .topnav__menu-link.active,
body.light-theme .topnav__menu-link.active {
    background: rgba(9, 105, 218, 0.12) !important;
    color: var(--accent) !important;
}

html[data-theme="light"] .topnav__notification,
html[data-theme="light"] .topnav__icon-btn,
body.light-theme .topnav__notification,
body.light-theme .topnav__icon-btn {
    color: var(--text-secondary) !important;
}

html[data-theme="light"] .topnav__user,
body.light-theme .topnav__user {
    color: var(--text-primary) !important;
}

html[data-theme="light"] .topnav__user:hover,
body.light-theme .topnav__user:hover {
    background: var(--bg-hover) !important;
}

html[data-theme="light"] .topnav__release-badge,
body.light-theme .topnav__release-badge {
    background: rgba(9, 105, 218, 0.1) !important;
    border-color: rgba(9, 105, 218, 0.22) !important;
    color: var(--accent) !important;
}

html[data-theme="light"] .topnav__utility-link,
html[data-theme="light"] .topnav__project-toggle,
html[data-theme="light"] .topnav__icon-btn,
body.light-theme .topnav__utility-link,
body.light-theme .topnav__project-toggle,
body.light-theme .topnav__icon-btn {
    background: #f4f6fa !important;
    border: 1px solid var(--border) !important;
    color: var(--text-heading) !important;
}

html[data-theme="light"] .topnav__utility-link:hover,
html[data-theme="light"] .topnav__project-toggle:hover,
html[data-theme="light"] .topnav__icon-btn:hover,
body.light-theme .topnav__utility-link:hover,
body.light-theme .topnav__project-toggle:hover,
body.light-theme .topnav__icon-btn:hover {
    background: #e8ecf3 !important;
}

html[data-theme="light"] .topnav__project-icon,
html[data-theme="light"] .topnav__shortcut-chip,
body.light-theme .topnav__project-icon,
body.light-theme .topnav__shortcut-chip {
    background: rgba(9, 105, 218, 0.08) !important;
    border-color: rgba(9, 105, 218, 0.18) !important;
    color: var(--accent) !important;
}

html[data-theme="light"] .topnav__shortcut-chip--ghost,
body.light-theme .topnav__shortcut-chip--ghost {
    background: #f0f4fa !important;
    color: var(--accent) !important;
}

html[data-theme="light"] .global-search__input,
body.light-theme .global-search__input {
    background: #ffffff !important;
    border: 1px solid var(--border) !important;
    color: var(--text-primary) !important;
}

html[data-theme="light"] .global-search__input:focus,
body.light-theme .global-search__input:focus {
    border-color: var(--accent) !important;
    box-shadow: 0 0 0 3px rgba(9, 105, 218, 0.14) !important;
}

html[data-theme="light"] .global-search__input::placeholder,
body.light-theme .global-search__input::placeholder {
    color: var(--text-muted) !important;
}

html[data-theme="light"] .global-search > .topnav__shortcut-chip,
body.light-theme .global-search > .topnav__shortcut-chip {
    background: rgba(9, 105, 218, 0.08) !important;
    border-color: rgba(9, 105, 218, 0.16) !important;
    color: var(--accent) !important;
}

html[data-theme="light"] .global-search__shortcut,
body.light-theme .global-search__shortcut {
    background: #f0f3f8 !important;
    border-color: var(--border) !important;
    color: var(--text-muted) !important;
}

/* Tier topnav (admin / vendor) — crisp ink, not neon-on-white */
html[data-theme="light"] .theme-admin .topnav__menu-link,
body.light-theme .theme-admin .topnav__menu-link,
html[data-theme="light"].theme-admin .topnav__menu-link,
body.light-theme.theme-admin .topnav__menu-link {
    color: var(--text-secondary) !important;
}

html[data-theme="light"] .theme-admin .topnav__menu-link:hover,
html[data-theme="light"] .theme-admin .topnav__menu-link.active,
body.light-theme .theme-admin .topnav__menu-link:hover,
body.light-theme .theme-admin .topnav__menu-link.active,
html[data-theme="light"].theme-admin .topnav__menu-link:hover,
html[data-theme="light"].theme-admin .topnav__menu-link.active,
body.light-theme.theme-admin .topnav__menu-link:hover,
body.light-theme.theme-admin .topnav__menu-link.active {
    background: rgba(88, 28, 135, 0.09) !important;
    color: #581c87 !important;
}

html[data-theme="light"] .theme-vendor .topnav__menu-link,
body.light-theme .theme-vendor .topnav__menu-link,
html[data-theme="light"].theme-vendor .topnav__menu-link,
body.light-theme.theme-vendor .topnav__menu-link {
    color: var(--text-secondary) !important;
}

html[data-theme="light"] .theme-vendor .topnav__menu-link:hover,
html[data-theme="light"] .theme-vendor .topnav__menu-link.active,
body.light-theme .theme-vendor .topnav__menu-link:hover,
body.light-theme .theme-vendor .topnav__menu-link.active,
html[data-theme="light"].theme-vendor .topnav__menu-link:hover,
html[data-theme="light"].theme-vendor .topnav__menu-link.active,
body.light-theme.theme-vendor .topnav__menu-link:hover,
body.light-theme.theme-vendor .topnav__menu-link.active {
    background: rgba(5, 122, 85, 0.1) !important;
    color: #065f46 !important;
}

/* --- Sidebar rail --- */
html[data-theme="light"] .sidebar,
body.light-theme .sidebar {
    background: var(--bg-sidebar) !important;
    border-right: 1px solid var(--border) !important;
    box-shadow: inset -1px 0 0 rgba(15, 23, 42, 0.04) !important;
}

html[data-theme="light"] .sidebar--admin,
body.light-theme .sidebar--admin {
    background: linear-gradient(180deg, #f6f2ff 0%, #eef1f6 52%, #e8ecf2 100%) !important;
    border-right: 1px solid #7c3aed !important;
}

html[data-theme="light"] .sidebar--vendor,
body.light-theme .sidebar--vendor {
    background: linear-gradient(180deg, #ecfdf5 0%, #eef1f6 48%, #e8ecf2 100%) !important;
    border-right: 1px solid #059669 !important;
}

html[data-theme="light"] .sidebar-header,
body.light-theme .sidebar-header {
    background: linear-gradient(180deg, #f6f8fc 0%, #eef1f6 100%) !important;
    color: var(--text-heading) !important;
    border-bottom: 1px solid var(--border) !important;
}

html[data-theme="light"] .sidebar-title,
body.light-theme .sidebar-title {
    color: var(--text-heading) !important;
}

html[data-theme="light"] .sidebar-subtitle,
body.light-theme .sidebar-subtitle {
    color: var(--text-muted) !important;
}

html[data-theme="light"] .sidebar-header__badge,
html[data-theme="light"] .admin-sidebar__version,
html[data-theme="light"] .vendor-sidebar__version,
body.light-theme .sidebar-header__badge,
body.light-theme .admin-sidebar__version,
body.light-theme .vendor-sidebar__version {
    background: #ffffff !important;
    border: 1px solid var(--border) !important;
    color: var(--text-secondary) !important;
}

html[data-theme="light"] .sidebar__profile,
html[data-theme="light"] .sidebar__project-switcher,
body.light-theme .sidebar__profile,
body.light-theme .sidebar__project-switcher {
    border-bottom-color: var(--border) !important;
}

html[data-theme="light"] .sidebar__profile-name,
html[data-theme="light"] .sidebar__project-select,
body.light-theme .sidebar__profile-name,
body.light-theme .sidebar__project-select {
    color: var(--text-primary) !important;
}

html[data-theme="light"] .sidebar__search-input,
html[data-theme="light"] .sidebar__project-select,
body.light-theme .sidebar__search-input,
body.light-theme .sidebar__project-select {
    background: #ffffff !important;
    border-color: var(--border) !important;
}

html[data-theme="light"] .sidebar__collapse-btn,
body.light-theme .sidebar__collapse-btn {
    background: #f0f3f8 !important;
    border-top: 1px solid var(--border) !important;
    color: var(--text-secondary) !important;
}

html[data-theme="light"] .sidebar__collapse-btn:hover,
body.light-theme .sidebar__collapse-btn:hover {
    background: #e4e9f2 !important;
    color: var(--text-heading) !important;
}

/* Nav tree */
html[data-theme="light"] .nav-main-tab,
body.light-theme .nav-main-tab {
    border-color: var(--border-light) !important;
    background: #ffffff !important;
    box-shadow: 0 4px 14px rgba(10, 14, 20, 0.05) !important;
}

html[data-theme="light"] .nav-main-tab-btn,
body.light-theme .nav-main-tab-btn {
    color: var(--text-primary) !important;
    border-bottom: 1px solid var(--border-light) !important;
    background: #ffffff !important;
}

html[data-theme="light"] .nav-main-tab-btn:hover,
body.light-theme .nav-main-tab-btn:hover {
    background: #eef4ff !important;
    color: var(--accent) !important;
}

html[data-theme="light"] .nav-main-tab-btn[aria-expanded="true"],
body.light-theme .nav-main-tab-btn[aria-expanded="true"] {
    background: var(--accent) !important;
    color: #ffffff !important;
}

html[data-theme="light"] .nav-level-2,
body.light-theme .nav-level-2 {
    background: #f4f6fa !important;
}

html[data-theme="light"] .nav-sub-tab-btn,
html[data-theme="light"] .nav-direct-link-a,
html[data-theme="light"] .nav-item-link,
html[data-theme="light"] .nav-item-exp-btn,
html[data-theme="light"] .nav-sub-item-link,
body.light-theme .nav-sub-tab-btn,
body.light-theme .nav-direct-link-a,
body.light-theme .nav-item-link,
body.light-theme .nav-item-exp-btn,
body.light-theme .nav-sub-item-link {
    color: var(--text-secondary) !important;
    border-color: var(--border-light) !important;
    background: #fafbfe !important;
}

html[data-theme="light"] .nav-sub-tab-btn:hover,
html[data-theme="light"] .nav-direct-link-a:hover,
html[data-theme="light"] .nav-item-link:hover,
html[data-theme="light"] .nav-item-exp-btn:hover,
body.light-theme .nav-sub-tab-btn:hover,
body.light-theme .nav-direct-link-a:hover,
body.light-theme .nav-item-link:hover,
body.light-theme .nav-item-exp-btn:hover {
    background: #eef4ff !important;
    color: var(--accent) !important;
}

html[data-theme="light"] .nav-sub-tab-btn[aria-expanded="true"],
html[data-theme="light"] .nav-direct-link-a.active,
html[data-theme="light"] .nav-item-link.active,
body.light-theme .nav-sub-tab-btn[aria-expanded="true"],
body.light-theme .nav-direct-link-a.active,
body.light-theme .nav-item-link.active {
    background: #dbeafe !important;
    color: #0b4ed0 !important;
    font-weight: 600;
}

html[data-theme="light"] .chevron-icon,
body.light-theme .chevron-icon {
    opacity: 0.75 !important;
    color: var(--text-muted) !important;
}

html[data-theme="light"] .sidebar-quick-link,
body.light-theme .sidebar-quick-link {
    background: #ffffff !important;
    border: 1px solid var(--border) !important;
    color: var(--text-heading) !important;
}

html[data-theme="light"] .sidebar-quick-link:hover,
html[data-theme="light"] .sidebar-quick-link.active,
body.light-theme .sidebar-quick-link:hover,
body.light-theme .sidebar-quick-link.active {
    background: #eef4ff !important;
    border-color: rgba(9, 105, 218, 0.28) !important;
    color: var(--accent) !important;
}

html[data-theme="light"] .sidebar-shortcut-chip,
body.light-theme .sidebar-shortcut-chip {
    background: rgba(9, 105, 218, 0.09) !important;
    border-color: rgba(9, 105, 218, 0.18) !important;
    color: var(--accent) !important;
}

html[data-theme="light"] .sidebar-shortcut-chip--ghost,
html[data-theme="light"] .sidebar-shortcut-chip--muted,
body.light-theme .sidebar-shortcut-chip--ghost,
body.light-theme .sidebar-shortcut-chip--muted {
    background: #f0f3f8 !important;
    color: var(--text-secondary) !important;
}

html[data-theme="light"] .tab-number,
body.light-theme .tab-number {
    background: #e2e8f0 !important;
    border-color: var(--border) !important;
    color: var(--text-secondary) !important;
}

/* Main */
html[data-theme="light"] .main-content,
body.light-theme .main-content {
    background: var(--bg-body) !important;
}

html[data-theme="light"] .breadcrumb,
body.light-theme .breadcrumb {
    color: var(--text-muted) !important;
}

html[data-theme="light"] .breadcrumb a,
body.light-theme .breadcrumb a {
    color: var(--text-secondary) !important;
}

html[data-theme="light"] .page-header__title,
body.light-theme .page-header__title {
    color: var(--text-heading) !important;
}

html[data-theme="light"] .page-header__subtitle,
body.light-theme .page-header__subtitle {
    color: var(--text-secondary) !important;
}

/* Cards & panels */
html[data-theme="light"] .card,
body.light-theme .card {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    box-shadow: var(--shadow-sm) !important;
}

html[data-theme="light"] .card__header,
body.light-theme .card__header {
    border-bottom-color: var(--border) !important;
    background: #f4f6fa !important;
}

html[data-theme="light"] .card__title,
body.light-theme .card__title {
    color: var(--text-heading) !important;
}

html[data-theme="light"] .card__footer,
body.light-theme .card__footer {
    border-top-color: var(--border-light) !important;
    background: #f0f3f8 !important;
}

html[data-theme="light"] .stat-card,
body.light-theme .stat-card {
    background: #ffffff !important;
    border: 1px solid var(--border) !important;
    box-shadow: var(--shadow-sm) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

html[data-theme="light"] .stat-card:hover,
body.light-theme .stat-card:hover {
    border-color: var(--border-accent) !important;
    box-shadow: var(--shadow-md) !important;
}

html[data-theme="light"] .stat-card__label,
body.light-theme .stat-card__label {
    color: var(--text-secondary) !important;
    font-weight: 600 !important;
}

html[data-theme="light"] .stat-card__value,
body.light-theme .stat-card__value {
    color: var(--text-heading) !important;
}

html[data-theme="light"] .stat-card__detail,
body.light-theme .stat-card__detail {
    color: var(--text-muted) !important;
}

/* Dashboard hero */
html[data-theme="light"] .dashboard-hero__content,
html[data-theme="light"] .dashboard-hero__aside,
body.light-theme .dashboard-hero__content,
body.light-theme .dashboard-hero__aside {
    background: #ffffff !important;
    border: 1px solid var(--border) !important;
    box-shadow: var(--shadow-md) !important;
}

html[data-theme="light"] .dashboard-hero__content::before,
body.light-theme .dashboard-hero__content::before {
    background: radial-gradient(circle at 100% 0%, rgba(9, 105, 218, 0.07), transparent 46%) !important;
}

html[data-theme="light"] .dashboard-hero__eyebrow-badge,
body.light-theme .dashboard-hero__eyebrow-badge {
    background: rgba(9, 105, 218, 0.1) !important;
    border: 1px solid rgba(9, 105, 218, 0.2) !important;
    color: var(--accent) !important;
}

html[data-theme="light"] .dashboard-hero__eyebrow-text,
html[data-theme="light"] .dashboard-hero__summary,
body.light-theme .dashboard-hero__eyebrow-text,
body.light-theme .dashboard-hero__summary {
    color: var(--text-secondary) !important;
}

html[data-theme="light"] .dashboard-hero .page-header__title,
html[data-theme="light"] .dashboard-hero .page-header__title .icon,
body.light-theme .dashboard-hero .page-header__title,
body.light-theme .dashboard-hero .page-header__title .icon {
    color: var(--text-heading) !important;
}

html[data-theme="light"] .dashboard-mini-card,
body.light-theme .dashboard-mini-card {
    background: #f4f6fa !important;
    border-color: var(--border) !important;
}

html[data-theme="light"] .dashboard-mini-card__value,
body.light-theme .dashboard-mini-card__value {
    color: var(--text-heading) !important;
}

html[data-theme="light"] .dashboard-metric-card__icon,
body.light-theme .dashboard-metric-card__icon {
    background: rgba(9, 105, 218, 0.1) !important;
    border: 1px solid rgba(9, 105, 218, 0.2) !important;
    color: var(--accent) !important;
}

html[data-theme="light"] .dashboard-card__eyebrow,
body.light-theme .dashboard-card__eyebrow {
    background: rgba(9, 105, 218, 0.12) !important;
    color: var(--accent) !important;
    border: 1px solid rgba(9, 105, 218, 0.22) !important;
}

body.light-theme .dashboard-chart-body {
    background: #fafbfc !important;
    border-radius: 0 0 var(--border-radius-lg) var(--border-radius-lg);
}

html[data-theme="light"] .card__body.dashboard-chart-body,
body.light-theme .card__body.dashboard-chart-body {
    border-top: 1px solid var(--border-light);
}

html[data-theme="light"] .dashboard-section__subtitle,
body.light-theme .dashboard-section__subtitle {
    color: var(--text-secondary) !important;
}

/* Tables */
html[data-theme="light"] .data-table,
body.light-theme .data-table {
    border-color: var(--border) !important;
}

html[data-theme="light"] .data-table thead th,
body.light-theme .data-table thead th {
    background: #e4e9f2 !important;
    color: var(--text-heading) !important;
    border-color: var(--border) !important;
}

html[data-theme="light"] .data-table tbody td,
body.light-theme .data-table tbody td {
    border-color: var(--border-light) !important;
    color: var(--text-primary) !important;
}

html[data-theme="light"] .data-table tbody tr:hover,
body.light-theme .data-table tbody tr:hover {
    background: #eef2f7 !important;
}

/* Forms */
html[data-theme="light"] .form-control,
html[data-theme="light"] select.form-control,
body.light-theme .form-control,
body.light-theme select.form-control {
    background: #ffffff !important;
    border: 1px solid var(--border) !important;
    color: var(--text-primary) !important;
}

html[data-theme="light"] .form-control:focus,
body.light-theme .form-control:focus {
    border-color: var(--accent) !important;
    box-shadow: 0 0 0 3px rgba(9, 105, 218, 0.12) !important;
}

html[data-theme="light"] .form-label,
body.light-theme .form-label {
    color: var(--text-secondary) !important;
    font-weight: 600;
}

html[data-theme="light"] .filter-toolbar,
body.light-theme .filter-toolbar {
    background: #f0f3f8 !important;
    border-bottom: 1px solid var(--border) !important;
}

html[data-theme="light"] .filter-toolbar__input,
body.light-theme .filter-toolbar__input {
    background: #ffffff !important;
    border-color: var(--border) !important;
    color: var(--text-primary) !important;
}

/* Buttons */
html[data-theme="light"] .btn--primary,
body.light-theme .btn--primary {
    background: var(--accent) !important;
    border-color: var(--accent) !important;
    color: #ffffff !important;
}

html[data-theme="light"] .btn--primary:hover,
body.light-theme .btn--primary:hover {
    background: var(--accent-hover) !important;
    color: #ffffff !important;
}

html[data-theme="light"] .btn--secondary,
body.light-theme .btn--secondary {
    background: #ffffff !important;
    border: 1px solid var(--border) !important;
    color: var(--text-heading) !important;
}

html[data-theme="light"] .btn--secondary:hover,
body.light-theme .btn--secondary:hover {
    background: #f0f3f8 !important;
    border-color: var(--accent) !important;
    color: var(--accent) !important;
}

html[data-theme="light"] .btn--ghost,
body.light-theme .btn--ghost {
    color: var(--text-secondary) !important;
}

html[data-theme="light"] .btn--ghost:hover,
body.light-theme .btn--ghost:hover {
    background: var(--bg-hover) !important;
    color: var(--text-heading) !important;
}

/* Dropdown */
html[data-theme="light"] .dropdown__menu,
body.light-theme .dropdown__menu {
    background: #ffffff !important;
    border: 1px solid var(--border) !important;
    box-shadow: var(--shadow-md) !important;
}

html[data-theme="light"] .dropdown__item,
body.light-theme .dropdown__item {
    color: var(--text-primary) !important;
}

html[data-theme="light"] .dropdown__item:hover,
body.light-theme .dropdown__item:hover {
    background: #eef2f7 !important;
}

html[data-theme="light"] .topnav__project-menu-heading,
body.light-theme .topnav__project-menu-heading {
    color: var(--text-muted) !important;
}

html[data-theme="light"] .dropdown__header,
body.light-theme .dropdown__header {
    color: var(--text-heading) !important;
}

/* Footer */
html[data-theme="light"] .app-footer,
html[data-theme="light"] .app-footer.app-footer--compact,
body.light-theme .app-footer,
body.light-theme .app-footer.app-footer--compact {
    background: #ffffff !important;
    border: 1px solid var(--border) !important;
    color: var(--text-muted) !important;
    box-shadow: var(--shadow-sm) !important;
}

html[data-theme="light"] .app-footer--compact .app-footer__link,
body.light-theme .app-footer--compact .app-footer__link {
    color: var(--accent) !important;
}

html[data-theme="light"] .app-footer__copy,
body.light-theme .app-footer__copy {
    color: var(--text-muted) !important;
}

/* Misc */
html[data-theme="light"] .empty-state__text,
html[data-theme="light"] .timeline__text,
body.light-theme .empty-state__text,
body.light-theme .timeline__text {
    color: var(--text-secondary) !important;
}

html[data-theme="light"] .timeline__title,
body.light-theme .timeline__title {
    color: var(--text-heading) !important;
}

/* Login */
html[data-theme="light"] .login-card,
body.light-theme .login-card {
    border: 1px solid var(--border) !important;
    box-shadow: var(--shadow-lg) !important;
}

/* Nav icon markers */
html[data-theme="light"] .sidebar-nav--web .nav-sub-item-link::before,
html[data-theme="light"] .sidebar-nav--web .nav-item-exp-btn .tab-label::before,
body.light-theme .sidebar-nav--web .nav-sub-item-link::before,
body.light-theme .sidebar-nav--web .nav-item-exp-btn .tab-label::before {
    color: var(--accent) !important;
}

html[data-theme="light"] .sidebar-nav--admin .nav-sub-item-link::before,
html[data-theme="light"] .sidebar-nav--admin .nav-item-exp-btn .tab-label::before,
body.light-theme .sidebar-nav--admin .nav-sub-item-link::before,
body.light-theme .sidebar-nav--admin .nav-item-exp-btn .tab-label::before {
    color: #6d28d9 !important;
}

html[data-theme="light"] .sidebar-nav--vendor .nav-sub-item-link::before,
html[data-theme="light"] .sidebar-nav--vendor .nav-item-exp-btn .tab-label::before,
body.light-theme .sidebar-nav--vendor .nav-sub-item-link::before,
body.light-theme .sidebar-nav--vendor .nav-item-exp-btn .tab-label::before {
    color: #047857 !important;
}

/* Kill dark variable bleed when tier + light */
html[data-theme="light"].theme-admin,
html[data-theme="light"].theme-vendor,
body.light-theme.theme-admin,
body.light-theme.theme-vendor {
    --bg-sidebar: #eef1f6;
    --bg-body: #e8ecf2;
    --glass-bg: #ffffff;
    --text-primary: #121826;
}

/* Native select popup contrast guardrail.
   This file loads after the shared styles, so keep the popup text readable even
   when the browser renders the opened option list with its own light surface. */
html[data-theme="dark"] select option,
html[data-theme="dark"] select optgroup,
html[data-theme="dark"] .form-control option,
html[data-theme="dark"] .form-control optgroup,
html[data-theme="dark"] .form-select option,
html[data-theme="dark"] .form-select optgroup,
html[data-theme="dark"] .param-input option,
html[data-theme="dark"] .param-input optgroup,
html[data-theme="dark"] .sidebar__project-select option,
html[data-theme="dark"] .sidebar__project-select optgroup,
body:not(.light-theme) select option,
body:not(.light-theme) select optgroup,
body:not(.light-theme) .form-control option,
body:not(.light-theme) .form-control optgroup,
body:not(.light-theme) .form-select option,
body:not(.light-theme) .form-select optgroup,
body:not(.light-theme) .param-input option,
body:not(.light-theme) .param-input optgroup,
body:not(.light-theme) .sidebar__project-select option,
body:not(.light-theme) .sidebar__project-select optgroup {
    color-scheme: light !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
    color: #111827 !important;
}

html[data-theme="dark"] select option:checked,
html[data-theme="dark"] select option:hover,
html[data-theme="dark"] select option:focus,
html[data-theme="dark"] .form-control option:checked,
html[data-theme="dark"] .form-control option:hover,
html[data-theme="dark"] .form-control option:focus,
html[data-theme="dark"] .form-select option:checked,
html[data-theme="dark"] .form-select option:hover,
html[data-theme="dark"] .form-select option:focus,
html[data-theme="dark"] .param-input option:checked,
html[data-theme="dark"] .param-input option:hover,
html[data-theme="dark"] .param-input option:focus,
html[data-theme="dark"] .sidebar__project-select option:checked,
html[data-theme="dark"] .sidebar__project-select option:hover,
html[data-theme="dark"] .sidebar__project-select option:focus,
body:not(.light-theme) select option:checked,
body:not(.light-theme) select option:hover,
body:not(.light-theme) select option:focus,
body:not(.light-theme) .form-control option:checked,
body:not(.light-theme) .form-control option:hover,
body:not(.light-theme) .form-control option:focus,
body:not(.light-theme) .form-select option:checked,
body:not(.light-theme) .form-select option:hover,
body:not(.light-theme) .form-select option:focus,
body:not(.light-theme) .param-input option:checked,
body:not(.light-theme) .param-input option:hover,
body:not(.light-theme) .param-input option:focus,
body:not(.light-theme) .sidebar__project-select option:checked,
body:not(.light-theme) .sidebar__project-select option:hover,
body:not(.light-theme) .sidebar__project-select option:focus {
    background: #2563eb !important;
    background-color: #2563eb !important;
    color: #ffffff !important;
}

html[data-theme="light"] select option,
html[data-theme="light"] select optgroup,
html[data-theme="light"] .form-control option,
html[data-theme="light"] .form-control optgroup,
html[data-theme="light"] .form-select option,
html[data-theme="light"] .form-select optgroup,
html[data-theme="light"] .param-input option,
html[data-theme="light"] .param-input optgroup,
html[data-theme="light"] .sidebar__project-select option,
html[data-theme="light"] .sidebar__project-select optgroup,
body.light-theme select option,
body.light-theme select optgroup,
body.light-theme .form-control option,
body.light-theme .form-control optgroup,
body.light-theme .form-select option,
body.light-theme .form-select optgroup,
body.light-theme .param-input option,
body.light-theme .param-input optgroup,
body.light-theme .sidebar__project-select option,
body.light-theme .sidebar__project-select optgroup {
    color-scheme: light !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
    color: #121826 !important;
}

html[data-theme="light"] select option:checked,
html[data-theme="light"] select option:hover,
html[data-theme="light"] select option:focus,
html[data-theme="light"] .form-control option:checked,
html[data-theme="light"] .form-control option:hover,
html[data-theme="light"] .form-control option:focus,
html[data-theme="light"] .form-select option:checked,
html[data-theme="light"] .form-select option:hover,
html[data-theme="light"] .form-select option:focus,
html[data-theme="light"] .param-input option:checked,
html[data-theme="light"] .param-input option:hover,
html[data-theme="light"] .param-input option:focus,
html[data-theme="light"] .sidebar__project-select option:checked,
html[data-theme="light"] .sidebar__project-select option:hover,
html[data-theme="light"] .sidebar__project-select option:focus,
body.light-theme select option:checked,
body.light-theme select option:hover,
body.light-theme select option:focus,
body.light-theme .form-control option:checked,
body.light-theme .form-control option:hover,
body.light-theme .form-control option:focus,
body.light-theme .form-select option:checked,
body.light-theme .form-select option:hover,
body.light-theme .form-select option:focus,
body.light-theme .param-input option:checked,
body.light-theme .param-input option:hover,
body.light-theme .param-input option:focus,
body.light-theme .sidebar__project-select option:checked,
body.light-theme .sidebar__project-select option:hover,
body.light-theme .sidebar__project-select option:focus {
    background: #2563eb !important;
    background-color: #2563eb !important;
    color: #ffffff !important;
}