/* ═══════════════════════════════════════════════════════════════════════════ ZWR theme switcher — companion to zwr-dark.css + site.css resolved appearance (CSS); auto = nothing saved; hour-based default on load only. ═══════════════════════════════════════════════════════════════════════════ */ /* ─── Toggle icons: dark UI → sun (switch to light); light UI → moon ─────── */ .zwr-theme-toggle .zwr-theme-icon-light, .zwr-theme-toggle .zwr-theme-icon-dark { display: none !important; } html[data-zwr-theme="dark"] .zwr-theme-toggle .zwr-theme-icon-light { display: inline-block !important; } html[data-zwr-theme="dark"] .zwr-theme-toggle .zwr-theme-icon-dark { display: none !important; } html[data-zwr-theme="light"] .zwr-theme-toggle .zwr-theme-icon-light { display: none !important; } html[data-zwr-theme="light"] .zwr-theme-toggle .zwr-theme-icon-dark { display: inline-block !important; } /* ─── Global tokens (override site.css :root on ) ─────────────────── */ html[data-zwr-theme="light"] { --bg-color: #e8eaef; --surface-color: #ffffff; --muted-surface: #f0f2f7; --text-color: #141820; /* WCAG AA body text on white ≥4.5:1 */ --muted-color: #3f4756; /* Link / accent on white ≥4.5:1 (brighter orange fails AA) */ --accent-color: #9a3410; --focus-white: rgba(0, 0, 0, 0.06); color-scheme: light; } html[data-zwr-theme="light"] body { background-color: var(--bg-color) !important; color: var(--text-color) !important; } html[data-zwr-theme="light"] a { color: var(--accent-color); } html[data-zwr-theme="light"] a:hover, html[data-zwr-theme="light"] a:focus { color: #7d2a0c; } /* Bootstrap .btn sets color via variables; plain `a` rule above wins (higher specificity) — restore button text */ html[data-zwr-theme="light"] a.btn { color: var(--bs-btn-color); text-decoration: none; } html[data-zwr-theme="light"] a.btn:hover { color: var(--bs-btn-hover-color); } html[data-zwr-theme="light"] a.btn:focus, html[data-zwr-theme="light"] a.btn:focus-visible { color: var(--bs-btn-hover-color); } html[data-zwr-theme="light"] a.btn:active, html[data-zwr-theme="light"] a.btn.active { color: var(--bs-btn-active-color); background-color: var(--bs-btn-active-bg); border-color: var(--bs-btn-active-border-color); } html[data-zwr-theme="light"] a.btn:disabled, html[data-zwr-theme="light"] a.btn.disabled { color: var(--bs-btn-disabled-color); } /* ─── Main navbar ───────────────────────────────────────────────────────── */ html[data-zwr-theme="light"] .zero-app-navbar { background: linear-gradient(180deg, #ffffff 0%, #f4f5f8 100%) !important; border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.9) inset !important; } html[data-zwr-theme="light"] .zero-app-navbar .navbar-nav > .nav-item > .nav-link:not(.zwr-user-toggle) { color: #2a3140 !important; } html[data-zwr-theme="light"] .zero-app-navbar .navbar-nav > .nav-item > .nav-link:not(.zwr-user-toggle):hover, html[data-zwr-theme="light"] .zero-app-navbar .navbar-nav > .nav-item > .nav-link:not(.zwr-user-toggle):focus { color: #1a1d26 !important; background: rgba(0, 0, 0, 0.05); } html[data-zwr-theme="light"] .zero-app-navbar .navbar-nav > .nav-item > .nav-link.dropdown-toggle:not(.zwr-user-toggle).show { color: #1a1d26 !important; background: rgba(0, 0, 0, 0.06); } html[data-zwr-theme="light"] .zero-app-navbar .dropdown-menu:not(.zwr-user-menu) { background: #ffffff; border: 1px solid rgba(0, 0, 0, 0.1); box-shadow: 0 12px 36px rgba(0, 0, 0, 0.12); } html[data-zwr-theme="light"] .zero-app-navbar .dropdown-menu:not(.zwr-user-menu) .dropdown-item { color: #2a3140; } html[data-zwr-theme="light"] .zero-app-navbar .dropdown-menu:not(.zwr-user-menu) .dropdown-item:hover, html[data-zwr-theme="light"] .zero-app-navbar .dropdown-menu:not(.zwr-user-menu) .dropdown-item:focus { background: rgba(0, 0, 0, 0.05); color: #111318; } html[data-zwr-theme="light"] .zero-app-navbar .dropdown-menu:not(.zwr-user-menu) .dropdown-divider { border-color: rgba(0, 0, 0, 0.08); } html[data-zwr-theme="light"] .zero-app-navbar .navbar-toggler { border-color: rgba(0, 0, 0, 0.15); } html[data-zwr-theme="light"] .zero-app-navbar .navbar-toggler-icon { filter: invert(0.85); } html[data-zwr-theme="light"] .zwr-theme-toggle { color: #2a3140 !important; } html[data-zwr-theme="light"] .zwr-theme-toggle:hover { color: #1a1d26 !important; background: rgba(0, 0, 0, 0.05) !important; } /* User menu */ html[data-zwr-theme="light"] .zwr-user-toggle:hover, html[data-zwr-theme="light"] .zwr-user-toggle.show { background: rgba(0, 0, 0, 0.06) !important; } html[data-zwr-theme="light"] .zwr-user-menu { background: #ffffff; border: 1px solid rgba(0, 0, 0, 0.1); box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12); } html[data-zwr-theme="light"] .zwr-user-menu .dropdown-item { color: #2a3140; } html[data-zwr-theme="light"] .zwr-user-menu .dropdown-item:hover { background: rgba(0, 0, 0, 0.05); color: #111318; } html[data-zwr-theme="light"] .zwr-user-menu-header .small { color: #3f4756 !important; } html[data-zwr-theme="light"] .zwr-user-menu-header .fw-semibold { color: #1a1d26 !important; } html[data-zwr-theme="light"] .zwr-user-email { color: rgba(30, 35, 45, 0.88); } html[data-zwr-theme="light"] .zwr-user-avatar { background: rgba(154, 52, 16, 0.12); border-color: rgba(154, 52, 16, 0.45); color: #9a3410; } html[data-zwr-theme="light"] .zwr-user-menu .dropdown-item.text-danger { color: #c62828 !important; } html[data-zwr-theme="light"] .zwr-user-menu .dropdown-item.text-danger:hover { background: rgba(220, 53, 69, 0.08); color: #a61b2b !important; } /* ─── App footer ──────────────────────────────────────────────────────────── */ html[data-zwr-theme="light"] .zwr-app-footer { color: #3f4756; background: #f4f5f8; border-top: 1px solid rgba(0, 0, 0, 0.08); } html[data-zwr-theme="light"] .zwr-app-footer a { color: #9a3410; text-decoration: underline; } html[data-zwr-theme="light"] .zwr-app-footer a:hover { color: #7d2a0c; } /* ─── Home landing hero (Index.cshtml, non-Customer) — light theme ───────── Soft blue-grey band (avoid stark white) so it matches app chrome, not a sheet of paper */ html[data-zwr-theme="light"] .zwr-home-panel { background: linear-gradient(180deg, #e8eaef 0%, #dde2eb 100%); } html[data-zwr-theme="light"] .zwr-home-panel::after { background: rgba(0, 0, 0, 0.07); } html[data-zwr-theme="light"] .zwr-home-badge { color: #9a3410; border-color: rgba(154, 52, 16, 0.35); } html[data-zwr-theme="light"] .zwr-home-title { color: #12151c; } html[data-zwr-theme="light"] .zwr-home-accent { color: #c2410c; } html[data-zwr-theme="light"] .zwr-home-tagline { color: #475569; } html[data-zwr-theme="light"] .zwr-home-btn-primary { background: #c2410c; color: #ffffff; } html[data-zwr-theme="light"] .zwr-home-btn-primary:hover { background: #9a3410; color: #ffffff; } html[data-zwr-theme="light"] .zwr-home-btn-secondary { color: #334155; border-color: rgba(30, 41, 59, 0.16); background: rgba(255, 255, 255, 0.35); } html[data-zwr-theme="light"] .zwr-home-btn-secondary:hover { border-color: rgba(30, 41, 59, 0.24); color: #0f172a; background: rgba(255, 255, 255, 0.55); } html[data-zwr-theme="light"] .zwr-home-meta { color: #64748b; border-top-color: rgba(0, 0, 0, 0.08); } html[data-zwr-theme="light"] .zwr-home-visual { background: #cfd6e3; } html[data-zwr-theme="light"] .zwr-home-image { opacity: 0.93; } html[data-zwr-theme="light"] .zwr-home-image-overlay { background: linear-gradient(to right, #e4e7ef 0%, rgba(228, 231, 239, 0) 36%), linear-gradient(to top, rgba(207, 214, 227, 0.88) 0%, transparent 44%); } /* ─── Customer portal home tiles (site.css) ─────────────────────────────── */ html[data-zwr-theme="light"] .customer-portal-cards .zwr-card-body p, html[data-zwr-theme="light"] .customer-portal-cards .zwr-card-body .small, html[data-zwr-theme="light"] .customer-portal-cards .zwr-card-body dt { color: #3f4756; } html[data-zwr-theme="light"] .customer-portal-cards .zwr-card-body dd { color: #2a3140; } html[data-zwr-theme="light"] .customer-portal-cards .zwr-card:hover { box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08); } /* ═══════════════════════════════════════════════════════════════════════════ zwr-dark.css surfaces (portal + service request + admin grids) ═══════════════════════════════════════════════════════════════════════════ */ html[data-zwr-theme="light"] .zwr-create-wrap { color: #1e2430; } html[data-zwr-theme="light"] .zwr-page-title { color: #12151c; } html[data-zwr-theme="light"] .zwr-page-subtitle, html[data-zwr-theme="light"] .zwr-breadcrumb { color: #3f4756; } html[data-zwr-theme="light"] .zwr-breadcrumb span { color: #9a3410; } html[data-zwr-theme="light"] .zwr-card { background: #ffffff; border: 1px solid rgba(0, 0, 0, 0.1); } html[data-zwr-theme="light"] .zwr-card-header { background: #f4f5f8; border-bottom: 1px solid rgba(0, 0, 0, 0.08); } html[data-zwr-theme="light"] .zwr-card-title { color: #3f4756; } html[data-zwr-theme="light"] .zwr-card-icon { color: #b63d12; } /* Job overview row: SR # pill + status — same surface language on light headers */ html[data-zwr-theme="light"] .zwr-card-header .zwr-sr-badge { background: #eef2f7 !important; border: 1px solid rgba(0, 0, 0, 0.1) !important; color: #64748b !important; } html[data-zwr-theme="light"] .zwr-card-header .zwr-sr-badge span { color: #b63d12 !important; } html[data-zwr-theme="light"] .zwr-card-header .zwr-status-badge.status-draft, html[data-zwr-theme="light"] .zwr-card-header .zwr-status-badge.status-cancelled { background: #eef2f7 !important; color: #475569 !important; border: 1px solid rgba(0, 0, 0, 0.1) !important; } html[data-zwr-theme="light"] .zwr-card-header .zwr-status-badge.status-submitted { background: rgba(37, 99, 235, 0.1) !important; color: #1d4ed8 !important; border: 1px solid rgba(37, 99, 235, 0.28) !important; } html[data-zwr-theme="light"] .zwr-card-header .zwr-status-badge.status-released { background: rgba(245, 158, 11, 0.14) !important; color: #b45309 !important; border: 1px solid rgba(245, 158, 11, 0.35) !important; } html[data-zwr-theme="light"] .zwr-card-header .zwr-status-badge.status-dispatched { background: rgba(22, 163, 74, 0.12) !important; color: #15803d !important; border: 1px solid rgba(22, 163, 74, 0.3) !important; } /* ── Priority pill variants — light theme ──────────────────────────────── Deeper hues than the dark-theme tones so the pill stays legible on a light background. High and MustDoToday mirror the light-theme overrides used by timeline-priorities.css so the calendar and form palettes align. ──────────────────────────────────────────────────────────────────────── */ html[data-zwr-theme="light"] .zwr-card-header .zwr-status-badge.priority-standard { background: rgba(14, 165, 233, 0.12) !important; color: #0369a1 !important; border: 1px solid rgba(14, 165, 233, 0.3) !important; } html[data-zwr-theme="light"] .zwr-card-header .zwr-status-badge.priority-high { background: rgba(184, 130, 30, 0.14) !important; color: #b8821e !important; border: 1px solid rgba(184, 130, 30, 0.35) !important; } html[data-zwr-theme="light"] .zwr-card-header .zwr-status-badge.priority-must { background: rgba(181, 69, 69, 0.14) !important; color: #b54545 !important; border: 1px solid rgba(181, 69, 69, 0.35) !important; } /* Light-theme dropdown menu surface */ html[data-zwr-theme="light"] .zwr-priority-pill .dropdown-menu.zwr-priority-menu { background: #ffffff !important; border: 1px solid rgba(0, 0, 0, 0.12) !important; } html[data-zwr-theme="light"] .zwr-priority-pill .dropdown-menu.zwr-priority-menu .dropdown-item { color: #1f2937 !important; } html[data-zwr-theme="light"] .zwr-priority-pill .dropdown-menu.zwr-priority-menu .dropdown-item:hover:not(.disabled) { background: rgba(0, 0, 0, 0.05) !important; color: #0f172a !important; } /* Light-theme dot colours match the pill colours */ html[data-zwr-theme="light"] .zwr-priority-dot.priority-standard { background: #0369a1; } html[data-zwr-theme="light"] .zwr-priority-dot.priority-high { background: #b8821e; } html[data-zwr-theme="light"] .zwr-priority-dot.priority-must { background: #b54545; } html[data-zwr-theme="light"] .zwr-label { color: #3f4756; } html[data-zwr-theme="light"] .zwr-input, html[data-zwr-theme="light"] .zwr-textarea { background: #ffffff; border: 1px solid rgba(0, 0, 0, 0.14); color: #1a1d26; } html[data-zwr-theme="light"] .zwr-input:focus, html[data-zwr-theme="light"] .zwr-textarea:focus { border-color: rgba(224, 92, 42, 0.45); box-shadow: 0 0 0 3px rgba(224, 92, 42, 0.12); } html[data-zwr-theme="light"] .zwr-input::placeholder, html[data-zwr-theme="light"] .zwr-textarea::placeholder { color: #5d6678; } html[data-zwr-theme="light"] .zwr-input[readonly], html[data-zwr-theme="light"] .zwr-textarea[readonly] { color: #3f4756; background: #f4f5f8; border-color: rgba(0, 0, 0, 0.08); } html[data-zwr-theme="light"] .zwr-portal-locked-value { background: #f4f5f8; border: 1px solid rgba(0, 0, 0, 0.1); color: #1a1d26; } html[data-zwr-theme="light"] .zwr-input[type="datetime-local"] { color-scheme: light; } html[data-zwr-theme="light"] .zwr-create-wrap select.zwr-select { background-color: #ffffff !important; border: 1px solid rgba(0, 0, 0, 0.14); color: #1a1d26; } html[data-zwr-theme="light"] .zwr-toggle-row { background: #f4f5f8; border: 1px solid rgba(0, 0, 0, 0.1); } html[data-zwr-theme="light"] .zwr-toggle-label { color: #3d4555; } html[data-zwr-theme="light"] .zwr-toggle-track { background: #d8dce6; border-color: rgba(0, 0, 0, 0.12); } html[data-zwr-theme="light"] .zwr-toggle-track::after { background: #ffffff; } html[data-zwr-theme="light"] .zwr-actions { background: #ffffff; border: 1px solid rgba(0, 0, 0, 0.1); } html[data-zwr-theme="light"] .zwr-actions .zwr-toggle-label, html[data-zwr-theme="light"] .zwr-actions .zwr-toggle-label strong { color: #1e293b; } html[data-zwr-theme="light"] .zwr-btn-secondary { background: #eef0f4; color: #2a3140; border: 1px solid rgba(0, 0, 0, 0.1); } html[data-zwr-theme="light"] .zwr-btn-secondary:hover { background: #e2e6ee; color: #12151c; } html[data-zwr-theme="light"] .zwr-btn-ghost { color: #4a5568; border: 1px solid rgba(0, 0, 0, 0.12); } html[data-zwr-theme="light"] .zwr-btn-ghost:hover { background: rgba(0, 0, 0, 0.04); color: #1a1d26; } /* Documents (header): .zwr-btn-now navy reads wrong on light — use brand primary; skip .btn-secondary “now” chips */ html[data-zwr-theme="light"] .zwr-page-header .zwr-btn-now:not(.btn-secondary) { --bs-btn-bg: #e05c2a; --bs-btn-border-color: #e05c2a; --bs-btn-color: #ffffff; --bs-btn-hover-bg: #c4501e; --bs-btn-hover-border-color: #c4501e; --bs-btn-hover-color: #ffffff; --bs-btn-active-bg: #b84a1b; --bs-btn-active-border-color: #b84a1b; --bs-btn-active-color: #ffffff; --bs-btn-disabled-bg: #e8a090; --bs-btn-disabled-border-color: #e8a090; --bs-btn-disabled-color: rgba(255, 255, 255, 0.85); } /* Driver time tracking etc.: .zwr-btn-now reuses navy vars from zwr-dark — reset on light */ html[data-zwr-theme="light"] .zwr-btn-now.btn-secondary, html[data-zwr-theme="light"] .zwr-time-group .zwr-btn-now { --bs-btn-bg: #f1f5f9; --bs-btn-border-color: rgba(15, 23, 42, 0.14); --bs-btn-color: #334155; --bs-btn-hover-bg: #e2e8f0; --bs-btn-hover-border-color: rgba(15, 23, 42, 0.2); --bs-btn-hover-color: #0f172a; --bs-btn-active-bg: #cbd5e1; --bs-btn-active-border-color: rgba(15, 23, 42, 0.22); --bs-btn-active-color: #0f172a; --bs-btn-disabled-bg: #f8fafc; --bs-btn-disabled-border-color: rgba(15, 23, 42, 0.08); --bs-btn-disabled-color: #94a3b8; } /* “Open contracts only” — switch label must stay flat on light (no input-style chrome) */ html[data-zwr-theme="light"] .zwr-create-wrap .zwr-opencontracts-switch .form-check-label { background: transparent !important; border: none !important; color: #475569 !important; -webkit-text-fill-color: #475569 !important; } html[data-zwr-theme="light"] .zwr-create-wrap .zwr-opencontracts-switch .form-check-input:focus { box-shadow: 0 0 0 0.15rem rgba(224, 92, 42, 0.25); border-color: rgba(224, 92, 42, 0.55); } html[data-zwr-theme="light"] .zwr-alert-danger { background: rgba(220, 53, 69, 0.08); border-color: rgba(220, 53, 69, 0.25); color: #a61b2b; } /* Select2 */ html[data-zwr-theme="light"] .zwr-create-wrap .select2-container--bootstrap-5 .select2-selection { background-color: #ffffff; border: 1px solid rgba(0, 0, 0, 0.14); color: #1a1d26; } html[data-zwr-theme="light"] .zwr-create-wrap .select2-container--bootstrap-5.select2-container--focus .select2-selection, html[data-zwr-theme="light"] .zwr-create-wrap .select2-container--bootstrap-5.select2-container--open .select2-selection { border-color: rgba(224, 92, 42, 0.45); box-shadow: 0 0 0 3px rgba(224, 92, 42, 0.1); } html[data-zwr-theme="light"] .zwr-create-wrap .select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered { color: #1a1d26; } html[data-zwr-theme="light"] .zwr-create-wrap .select2-container--bootstrap-5 .select2-selection--single .select2-selection__placeholder { color: #5d6678; } html[data-zwr-theme="light"] .zwr-create-wrap .select2-dropdown { background: #ffffff; border: 1px solid rgba(0, 0, 0, 0.12); } html[data-zwr-theme="light"] .zwr-create-wrap .select2-container--bootstrap-5 .select2-results__option { color: #2a3140; } html[data-zwr-theme="light"] .zwr-create-wrap .select2-container--bootstrap-5 .select2-results__option--highlighted { background: rgba(224, 92, 42, 0.12) !important; color: #1a1d26 !important; } /* DataTables / table card chrome */ html[data-zwr-theme="light"] .zwr-table-card { background: #ffffff; border: 1px solid rgba(0, 0, 0, 0.1); } html[data-zwr-theme="light"] .zwr-table-card-header { border-bottom: 1px solid rgba(0, 0, 0, 0.08); } html[data-zwr-theme="light"] .zwr-table-card-title { color: #12151c; } html[data-zwr-theme="light"] .zwr-table-card-subtitle { color: #3f4756; } html[data-zwr-theme="light"] .zwr-dt-label { color: #3f4756; } html[data-zwr-theme="light"] .zwr-dt-search-label { background: rgba(0, 0, 0, 0.04); border: 1px solid rgba(0, 0, 0, 0.1); color: #3f4756; } html[data-zwr-theme="light"] .zwr-dt-search-input { color: #1a1d26; } html[data-zwr-theme="light"] .zwr-dt-search-input::placeholder { color: #5d6678; } html[data-zwr-theme="light"] .zwr-table-card table.dataTable thead tr { background: #f0f2f6; border-bottom: 1px solid rgba(0, 0, 0, 0.08); } html[data-zwr-theme="light"] .zwr-table-card .dt-scroll-head { background: #f0f2f6 !important; } html[data-zwr-theme="light"] .zwr-table-card table.dataTable thead > tr > th, html[data-zwr-theme="light"] .zwr-table-card table.dataTable thead > tr > td { color: #334155 !important; border-color: rgba(0, 0, 0, 0.06) !important; background-color: #f0f2f6 !important; } html[data-zwr-theme="light"] .zwr-table-card table.dataTable tbody tr { border-bottom: 1px solid rgba(0, 0, 0, 0.06); } html[data-zwr-theme="light"] .zwr-table-card table.dataTable tbody tr:hover { background: rgba(0, 0, 0, 0.03) !important; } html[data-zwr-theme="light"] .zwr-table-card table.dataTable tbody td { color: #2a3140; } html[data-zwr-theme="light"] .zwr-table-footer, html[data-zwr-theme="light"] .zwr-tf-left { color: #3f4756; } /* Panel + admin table (invoices, billing, etc.) */ html[data-zwr-theme="light"] .zwr-panel-card { background: #ffffff; border: 1px solid rgba(0, 0, 0, 0.1); } html[data-zwr-theme="light"] .zwr-panel-card > .zwr-table-card-header { border-bottom: 1px solid rgba(0, 0, 0, 0.08); } /* Admin pages: zwr-dark .zwr-admin-wrap* has higher specificity than generic light rules */ html[data-zwr-theme="light"] .zwr-admin-wrap { color: #1a1d26; } html[data-zwr-theme="light"] .zwr-admin-wrap .zwr-page-title, html[data-zwr-theme="light"] .zwr-admin-wrap .zwr-card-title { color: #141820 !important; } html[data-zwr-theme="light"] .zwr-admin-wrap .zwr-page-subtitle { color: #3f4756 !important; } html[data-zwr-theme="light"] .zwr-admin-wrap .zwr-panel-card .zwr-table-card-title { color: #141820 !important; } html[data-zwr-theme="light"] .zwr-admin-wrap .zwr-panel-card .zwr-table-card-subtitle { color: #3f4756 !important; } html[data-zwr-theme="light"] .zwr-admin-wrap .zwr-panel-card strong, html[data-zwr-theme="light"] .zwr-admin-wrap table strong { color: #141820 !important; } html[data-zwr-theme="light"] .zwr-admin-wrap .btn-secondary { --bs-btn-bg: #eef1f6; --bs-btn-border-color: rgba(0, 0, 0, 0.12); --bs-btn-color: #2a3140; --bs-btn-hover-bg: #e4e8ef; --bs-btn-hover-border-color: rgba(0, 0, 0, 0.18); --bs-btn-hover-color: #141820; } html[data-zwr-theme="light"] .zwr-admin-wrap .btn-outline-secondary, html[data-zwr-theme="light"] .zwr-create-wrap .btn-outline-secondary { --bs-btn-bg: transparent; --bs-btn-border-color: rgba(0, 0, 0, 0.14); --bs-btn-color: #334155; --bs-btn-hover-bg: rgba(0, 0, 0, 0.05); --bs-btn-hover-border-color: rgba(0, 0, 0, 0.2); --bs-btn-hover-color: #0f172a; --bs-btn-active-bg: rgba(0, 0, 0, 0.09); --bs-btn-active-border-color: rgba(0, 0, 0, 0.26); --bs-btn-active-color: #0f172a; } html[data-zwr-theme="light"] .zwr-admin-wrap .btn-outline-primary { --bs-btn-color: #1d4ed8; --bs-btn-border-color: rgba(37, 99, 235, 0.45); --bs-btn-hover-bg: rgba(37, 99, 235, 0.08); --bs-btn-hover-border-color: #2563eb; --bs-btn-hover-color: #1e3a8a; } html[data-zwr-theme="light"] .zwr-admin-wrap .btn-outline-danger { --bs-btn-color: #b91c1c; --bs-btn-border-color: rgba(220, 38, 38, 0.4); --bs-btn-hover-bg: rgba(220, 38, 38, 0.08); --bs-btn-hover-border-color: #dc2626; --bs-btn-hover-color: #991b1b; } html[data-zwr-theme="light"] .zwr-admin-wrap .btn-outline-warning { --bs-btn-color: #b45309; --bs-btn-border-color: rgba(245, 158, 11, 0.45); --bs-btn-hover-bg: rgba(245, 158, 11, 0.1); --bs-btn-hover-border-color: #d97706; --bs-btn-hover-color: #92400e; } html[data-zwr-theme="light"] .zwr-admin-wrap .btn-warning { --bs-btn-bg: rgba(245, 158, 11, 0.22); --bs-btn-border-color: rgba(245, 158, 11, 0.45); --bs-btn-color: #92400e; --bs-btn-hover-bg: rgba(245, 158, 11, 0.3); --bs-btn-hover-border-color: rgba(245, 158, 11, 0.55); --bs-btn-hover-color: #78350f; } html[data-zwr-theme="light"] .zwr-admin-wrap .badge.bg-info { background: rgba(37, 99, 235, 0.12) !important; color: #1d4ed8 !important; } html[data-zwr-theme="light"] .zwr-admin-wrap .badge.bg-success { background: rgba(22, 163, 74, 0.12) !important; color: #15803d !important; } html[data-zwr-theme="light"] .zwr-admin-wrap .badge.bg-warning { background: rgba(245, 158, 11, 0.15) !important; color: #92400e !important; } html[data-zwr-theme="light"] .zwr-admin-wrap .badge.bg-danger { background: rgba(220, 38, 38, 0.12) !important; color: #b91c1c !important; } html[data-zwr-theme="light"] .zwr-admin-wrap .text-muted { color: #64748b !important; } html[data-zwr-theme="light"] .zwr-admin-wrap hr { border-color: rgba(0, 0, 0, 0.1); } html[data-zwr-theme="light"] .zwr-admin-wrap .text-danger { color: #b91c1c !important; } html[data-zwr-theme="light"] .zwr-admin-wrap .form-control, html[data-zwr-theme="light"] .zwr-admin-wrap .form-select { background: #ffffff; border: 1px solid rgba(0, 0, 0, 0.14); color: #1a1d26; } html[data-zwr-theme="light"] .zwr-admin-wrap .form-control:focus, html[data-zwr-theme="light"] .zwr-admin-wrap .form-select:focus { background: #ffffff; color: #1a1d26; border-color: rgba(154, 52, 16, 0.45); box-shadow: 0 0 0 0.15rem rgba(154, 52, 16, 0.12); } html[data-zwr-theme="light"] .zwr-admin-wrap .form-label { color: #334155; } html[data-zwr-theme="light"] .zwr-admin-wrap .form-text { color: #64748b; } html[data-zwr-theme="light"] .zwr-admin-wrap .input-group-text { background: #f1f5f9; border-color: rgba(0, 0, 0, 0.12); color: #475569; } html[data-zwr-theme="light"] .zwr-admin-wrap .form-check-label { color: #334155; background: transparent !important; border: none !important; } html[data-zwr-theme="light"] .zwr-admin-wrap .alert.alert-info { background: rgba(59, 130, 246, 0.08); border-color: rgba(59, 130, 246, 0.28); color: #1e40af; } html[data-zwr-theme="light"] .zwr-admin-wrap .alert.alert-warning { background: rgba(245, 158, 11, 0.1); border-color: rgba(245, 158, 11, 0.35); color: #92400e; } html[data-zwr-theme="light"] .zwr-admin-wrap .btn-close { filter: none; opacity: 0.55; } html[data-zwr-theme="light"] .zwr-admin-wrap .zwr-icon-btn { box-shadow: none; } html[data-zwr-theme="light"] table.table.zwr-admin-table { color: #2a3140; --bs-table-striped-bg: rgba(0, 0, 0, 0.02); --bs-table-hover-bg: rgba(0, 0, 0, 0.04); } html[data-zwr-theme="light"] table.table.zwr-admin-table thead tr { background: #f0f2f6; border-bottom: 1px solid rgba(0, 0, 0, 0.08); } html[data-zwr-theme="light"] table.table.zwr-admin-table thead th { color: #3f4756 !important; background-color: #f0f2f6 !important; } html[data-zwr-theme="light"] table.table.zwr-admin-table tbody td { border-color: rgba(0, 0, 0, 0.06); color: #2a3140; } /* Beat zwr-dark (loads after this file on some admin pages): sticky admin grid thead */ html[data-zwr-theme="light"] .zwr-admin-wrap .zwr-admin-grid-scroll table.table.zwr-admin-table thead tr { background: #f0f2f6 !important; border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important; } html[data-zwr-theme="light"] .zwr-admin-wrap .zwr-admin-grid-scroll table.table.zwr-admin-table thead th { color: #3f4756 !important; background-color: #f0f2f6 !important; box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06) !important; } /* outline-light is for dark chrome; on light admin pages use readable outline */ html[data-zwr-theme="light"] .zwr-admin-wrap .btn-outline-light { --bs-btn-color: #334155; --bs-btn-border-color: rgba(0, 0, 0, 0.16); --bs-btn-hover-bg: rgba(0, 0, 0, 0.06); --bs-btn-hover-border-color: rgba(0, 0, 0, 0.22); --bs-btn-hover-color: #0f172a; --bs-btn-active-bg: rgba(0, 0, 0, 0.09); --bs-btn-active-border-color: rgba(0, 0, 0, 0.26); --bs-btn-active-color: #0f172a; --bs-btn-disabled-color: #94a3b8; --bs-btn-disabled-border-color: rgba(0, 0, 0, 0.12); --bs-btn-disabled-opacity: 1; } html[data-zwr-theme="light"] .billing-contacts-page .billing-edit-btn { color: #1d4ed8; } html[data-zwr-theme="light"] .billing-contacts-page .billing-edit-btn:hover, html[data-zwr-theme="light"] .billing-contacts-page .billing-edit-btn:focus-visible { color: #1e40af; } html[data-zwr-theme="light"] .billing-contacts-page .billing-unlink-btn { color: #c2410c; } html[data-zwr-theme="light"] .billing-contacts-page .billing-unlink-btn:hover, html[data-zwr-theme="light"] .billing-contacts-page .billing-unlink-btn:focus-visible { color: #9a3412; } html[data-zwr-theme="light"] .billing-contacts-page tr.billing-unlinked-header td { background: #f1f5f9 !important; color: #64748b !important; } html[data-zwr-theme="light"] .zwr-admin-wrap table.driver-group-members-table { color: #2a3140; } html[data-zwr-theme="light"] .zwr-admin-wrap .driver-group-members-thead, html[data-zwr-theme="light"] .zwr-admin-wrap table.driver-group-members-table thead tr { background: #f0f2f6; border-bottom: 1px solid rgba(0, 0, 0, 0.08); } html[data-zwr-theme="light"] .zwr-admin-wrap .driver-group-members-thead th { color: #3f4756 !important; background-color: #f0f2f6 !important; } html[data-zwr-theme="light"] .zwr-admin-wrap table.driver-group-members-table tbody td { border-color: rgba(0, 0, 0, 0.06); color: #2a3140; } /* Account manage (Identity) — zwr-dark uses !important on inputs; match specificity + !important here */ html[data-zwr-theme="light"] .zwr-manage-wrap { color: #1a1d26; } html[data-zwr-theme="light"] .zwr-manage-wrap > .col-md-9, html[data-zwr-theme="light"] .zwr-manage-wrap > .col-lg-10 { background: transparent; } html[data-zwr-theme="light"] .zwr-manage-sidebar { background: #f4f5f8; border-right: 1px solid rgba(0, 0, 0, 0.08); } html[data-zwr-theme="light"] .zwr-manage-nav-label { color: #3f4756; } html[data-zwr-theme="light"] .zwr-manage-nav-divider { border-color: rgba(0, 0, 0, 0.08); } html[data-zwr-theme="light"] .zwr-manage-sidebar .nav-pills .nav-link { color: #2a3140; } html[data-zwr-theme="light"] .zwr-manage-sidebar .nav-pills .nav-link:hover { color: #1a1d26; background: rgba(0, 0, 0, 0.04); border-color: rgba(0, 0, 0, 0.06); } html[data-zwr-theme="light"] .zwr-manage-sidebar .nav-pills .nav-link.active { color: #1a1d26; background: rgba(224, 92, 42, 0.12); border-color: rgba(224, 92, 42, 0.28); } html[data-zwr-theme="light"] .zwr-manage-page-head h3 { color: #12151c; } html[data-zwr-theme="light"] .zwr-manage-page-head .text-muted { color: #64748b !important; } html[data-zwr-theme="light"] .zwr-manage-panel { background: #ffffff !important; border: 1px solid rgba(0, 0, 0, 0.1) !important; } html[data-zwr-theme="light"] .zwr-manage-panel > .card-header { background: #f4f5f8 !important; border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important; } html[data-zwr-theme="light"] .zwr-manage-panel .card-title { color: #12151c !important; } html[data-zwr-theme="light"] .zwr-manage-panel .card-subtitle { color: #3f4756 !important; } html[data-zwr-theme="light"] .zwr-field-label { color: #475569 !important; } html[data-zwr-theme="light"] .zwr-manage-panel .form-control, html[data-zwr-theme="light"] .zwr-manage-panel .form-select, html[data-zwr-theme="light"] .zwr-manage-panel textarea.form-control { background: #ffffff !important; border: 1px solid rgba(0, 0, 0, 0.14) !important; color: #1a1d26 !important; -webkit-text-fill-color: #1a1d26 !important; } html[data-zwr-theme="light"] .zwr-manage-panel .form-control:focus, html[data-zwr-theme="light"] .zwr-manage-panel .form-select:focus, html[data-zwr-theme="light"] .zwr-manage-panel textarea.form-control:focus { background: #ffffff !important; border-color: rgba(224, 92, 42, 0.45) !important; color: #1a1d26 !important; -webkit-text-fill-color: #1a1d26 !important; box-shadow: 0 0 0 3px rgba(224, 92, 42, 0.1) !important; } html[data-zwr-theme="light"] .zwr-manage-panel .form-control:disabled, html[data-zwr-theme="light"] .zwr-manage-panel .form-select:disabled { background: #f0f2f6 !important; color: #3f4756 !important; -webkit-text-fill-color: #3f4756 !important; opacity: 1 !important; } html[data-zwr-theme="light"] .zwr-manage-panel .form-control::placeholder { color: #64748b !important; -webkit-text-fill-color: #64748b !important; opacity: 1 !important; } html[data-zwr-theme="light"] .zwr-manage-panel .zwr-input-icon { color: #64748b !important; } html[data-zwr-theme="light"] .zwr-manage-panel .zwr-pwd-toggle { color: #64748b !important; } html[data-zwr-theme="light"] .zwr-manage-panel .zwr-pwd-toggle:hover, html[data-zwr-theme="light"] .zwr-manage-panel .zwr-pwd-toggle:focus-visible { color: #334155 !important; } html[data-zwr-theme="light"] .zwr-manage-divider { background: rgba(0, 0, 0, 0.08) !important; } html[data-zwr-theme="light"] .zwr-manage-panel .text-danger { color: #b91c1c !important; } html[data-zwr-theme="light"] .zwr-manage-wrap .btn-secondary { background: #ffffff !important; border: 1px solid rgba(0, 0, 0, 0.14) !important; color: #334155 !important; } html[data-zwr-theme="light"] .zwr-manage-wrap .btn-secondary:hover, html[data-zwr-theme="light"] .zwr-manage-wrap .btn-secondary:focus { background: #f1f5f9 !important; border-color: rgba(0, 0, 0, 0.2) !important; color: #0f172a !important; } html[data-zwr-theme="light"] .zwr-manage-wrap .btn-danger { background: rgba(220, 38, 38, 0.1) !important; border: 1px solid rgba(220, 38, 38, 0.35) !important; color: #b91c1c !important; } html[data-zwr-theme="light"] .zwr-manage-wrap .btn-danger:hover { background: rgba(220, 38, 38, 0.16) !important; color: #991b1b !important; } html[data-zwr-theme="light"] .zwr-badge-confirmed { background: rgba(22, 163, 74, 0.12) !important; border-color: rgba(22, 163, 74, 0.35) !important; color: #15803d !important; } html[data-zwr-theme="light"] .zwr-badge-unconfirmed { background: rgba(245, 158, 11, 0.12) !important; border-color: rgba(245, 158, 11, 0.4) !important; color: #b45309 !important; } html[data-zwr-theme="light"] .zwr-twofa-status { background: #f8fafc !important; border: 1px solid rgba(0, 0, 0, 0.1) !important; } html[data-zwr-theme="light"] .zwr-twofa-status-label { color: #141820 !important; } html[data-zwr-theme="light"] .zwr-twofa-status-label.disabled { color: #64748b !important; } html[data-zwr-theme="light"] .zwr-twofa-status-sub { color: #64748b !important; } html[data-zwr-theme="light"] .zwr-twofa-icon.enabled { background: rgba(22, 163, 74, 0.12) !important; color: #15803d !important; } html[data-zwr-theme="light"] .zwr-twofa-icon.disabled { background: #e2e8f0 !important; color: #64748b !important; } html[data-zwr-theme="light"] .zwr-twofa-action-row { background: #f8fafc !important; border: 1px solid rgba(0, 0, 0, 0.08) !important; } html[data-zwr-theme="light"] .zwr-twofa-action-title { color: #141820 !important; } html[data-zwr-theme="light"] .zwr-twofa-action-desc { color: #64748b !important; } html[data-zwr-theme="light"] .zwr-recovery-code { color: #92400e !important; background: rgba(245, 158, 11, 0.1) !important; border: 1px solid rgba(245, 158, 11, 0.35) !important; } html[data-zwr-theme="light"] .zwr-manage-wrap .alert.alert-danger { background: rgba(220, 38, 38, 0.08) !important; border-color: rgba(220, 38, 38, 0.28) !important; color: #991b1b !important; } html[data-zwr-theme="light"] .zwr-manage-wrap .alert.alert-danger .alert-link { color: #7f1d1d !important; text-decoration: underline; } html[data-zwr-theme="light"] .zwr-manage-wrap .alert.alert-warning { background: rgba(245, 158, 11, 0.1) !important; border-color: rgba(245, 158, 11, 0.35) !important; color: #92400e !important; } html[data-zwr-theme="light"] .zwr-manage-wrap .alert.alert-warning .alert-link { color: #78350f !important; } /* ═══════════════════════════════════════════════════════════════════════════ Standalone auth layout (_AuthLayout) — body.auth-layout-page ═══════════════════════════════════════════════════════════════════════════ */ /* Page shell only — do NOT use a broad `.d-flex.flex-column` selector: login/register forms use the same utility classes and would show this grid inside the card. */ html[data-zwr-theme="light"] body.auth-layout-page { background-color: #eef0f5 !important; color: #1a1d26 !important; background-image: linear-gradient(rgba(0, 0, 0, 0.035) 1px, transparent 1px), linear-gradient(90deg, rgba(0, 0, 0, 0.035) 1px, transparent 1px) !important; background-size: 48px 48px !important; } html[data-zwr-theme="light"] body.auth-layout-page .auth-card form, html[data-zwr-theme="light"] body.auth-layout-page .auth-card > div:not(.auth-card-header) { background: transparent !important; background-image: none !important; } html[data-zwr-theme="light"] body.auth-layout-page::before { background: radial-gradient(circle, rgba(224, 92, 42, 0.06) 0%, transparent 65%) !important; } html[data-zwr-theme="light"] body.auth-layout-page::after { background: radial-gradient(circle, rgba(81, 144, 241, 0.05) 0%, transparent 65%) !important; } html[data-zwr-theme="light"] body.auth-layout-page .auth-card { background: #ffffff !important; border: 1px solid rgba(0, 0, 0, 0.1) !important; box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04) !important; } html[data-zwr-theme="light"] body.auth-layout-page .auth-card-header { background: #f4f5f8 !important; border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important; } /* Card titles use inline dark-theme colors — force readable text on light header */ html[data-zwr-theme="light"] body.auth-layout-page .auth-card-header h1, html[data-zwr-theme="light"] body.auth-layout-page .auth-card-header .fs-5.fw-semibold { color: #141820 !important; -webkit-text-fill-color: #141820 !important; } html[data-zwr-theme="light"] body.auth-layout-page .auth-card-header p, html[data-zwr-theme="light"] body.auth-layout-page .auth-card-header .small { color: #475569 !important; -webkit-text-fill-color: #475569 !important; } html[data-zwr-theme="light"] body.auth-layout-page .auth-remember-row { color: #475569 !important; -webkit-text-fill-color: #475569 !important; } html[data-zwr-theme="light"] body.auth-layout-page .auth-footnote { color: #64748b !important; -webkit-text-fill-color: #64748b !important; } html[data-zwr-theme="light"] body.auth-layout-page label.auth-remember-row { color: #475569 !important; -webkit-text-fill-color: #475569 !important; } html[data-zwr-theme="light"] body.auth-layout-page .auth-code-input { color: #1a1d26 !important; -webkit-text-fill-color: #1a1d26 !important; } html[data-zwr-theme="light"] body.auth-layout-page .auth-warn-banner { background: rgba(224, 92, 42, 0.1) !important; border: 1px solid rgba(224, 92, 42, 0.35) !important; color: #9a3410 !important; } html[data-zwr-theme="light"] body.auth-layout-page .auth-brand-logo-wrap { background: linear-gradient(145deg, #141820 0%, #1e2230 100%); border-radius: 12px; padding: 10px 18px; box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1); } html[data-zwr-theme="light"] body.auth-layout-page .auth-input { background: #ffffff !important; border: 1px solid rgba(0, 0, 0, 0.14) !important; color: #1a1d26 !important; -webkit-text-fill-color: #1a1d26 !important; } html[data-zwr-theme="light"] body.auth-layout-page .auth-input::placeholder { color: #5d6678 !important; } html[data-zwr-theme="light"] body.auth-layout-page .field-icon { color: #3f4756; } html[data-zwr-theme="light"] body.auth-layout-page .field-toggle { color: #2a3140; } html[data-zwr-theme="light"] body.auth-layout-page .auth-check { border-color: rgba(0, 0, 0, 0.2); background: #ffffff; } html[data-zwr-theme="light"] body.auth-layout-page .btn-auth-secondary { background: #f8fafc !important; border: 1px solid rgba(0, 0, 0, 0.18) !important; color: #1e293b !important; font-weight: 500; } html[data-zwr-theme="light"] body.auth-layout-page .btn-auth-secondary:hover { background: #e2e8f0 !important; border-color: rgba(0, 0, 0, 0.22) !important; color: #0f172a !important; } html[data-zwr-theme="light"] body.auth-layout-page .auth-divider { color: #3f4756; } html[data-zwr-theme="light"] body.auth-layout-page .auth-divider::before, html[data-zwr-theme="light"] body.auth-layout-page .auth-divider::after { background: rgba(0, 0, 0, 0.1); } html[data-zwr-theme="light"] body.auth-layout-page .auth-info { background: rgba(13, 110, 253, 0.08); border: 1px solid rgba(13, 110, 253, 0.28); color: #084298; } html[data-zwr-theme="light"] body.auth-layout-page .auth-info strong { color: #052c65; } html[data-zwr-theme="light"] body.auth-layout-page .auth-alert { background: rgba(220, 38, 38, 0.08) !important; border-color: rgba(220, 38, 38, 0.28) !important; color: #991b1b !important; } html[data-zwr-theme="light"] body.auth-layout-page .auth-success { background: rgba(22, 163, 74, 0.1) !important; border-color: rgba(22, 163, 74, 0.28) !important; color: #166534 !important; } html[data-zwr-theme="light"] body.auth-layout-page .field-error { color: #b91c1c !important; } html[data-zwr-theme="light"] body.auth-layout-page .field-label { color: #3f4756; } html[data-zwr-theme="light"] body.auth-layout-page .auth-tagline { color: #3f4756; } html[data-zwr-theme="light"] body.auth-layout-page .auth-link { color: #9a3410; } html[data-zwr-theme="light"] body.auth-layout-page .auth-link:hover { color: #7d2a0c; } html[data-zwr-theme="light"] body.auth-layout-page .auth-link-muted { color: #3f4756; } html[data-zwr-theme="light"] body.auth-layout-page .auth-link-muted:hover { color: #141820; } /* Fixed corner toggle on standalone auth pages */ .zwr-auth-theme-toggle { position: fixed; top: 12px; right: 12px; z-index: 50; width: 40px; height: 40px; padding: 0; display: flex; align-items: center; justify-content: center; border-radius: 10px; border: 1px solid rgba(255, 255, 255, 0.14); background: rgba(255, 255, 255, 0.06); color: rgba(255, 255, 255, 0.78); font-size: 1.1rem; line-height: 1; cursor: pointer; transition: background 0.15s, border-color 0.15s, color 0.15s; } .zwr-auth-theme-toggle:hover { background: rgba(255, 255, 255, 0.1); color: #fff; } html[data-zwr-theme="light"] .zwr-auth-theme-toggle { border-color: rgba(0, 0, 0, 0.12); background: rgba(255, 255, 255, 0.95); color: #3d4555; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06); } html[data-zwr-theme="light"] .zwr-auth-theme-toggle:hover { background: #fff; color: #1a1d26; } /* Primary actions: white text on orange must meet WCAG AA (≥4.5:1) */ html[data-zwr-theme="light"] .zwr-btn-primary { background: #9a3410; color: #ffffff; } html[data-zwr-theme="light"] .zwr-btn-primary:hover { background: #7d2a0c; color: #ffffff; opacity: 1; } /* Bootstrap utility contrast on light surfaces */ html[data-zwr-theme="light"] .text-muted { color: #3f4756 !important; } /* Focus: avoid “white ring on white” from site.css; keep 2-stop ring visible */ html[data-zwr-theme="light"] .btn:focus, html[data-zwr-theme="light"] .btn:active:focus, html[data-zwr-theme="light"] .btn-link:focus, html[data-zwr-theme="light"] .btn-link.nav-link:focus, html[data-zwr-theme="light"] .form-control:focus, html[data-zwr-theme="light"] .form-check-input:focus { box-shadow: 0 0 0 0.125rem #e8eaef, 0 0 0 0.25rem #1565c0 !important; } html[data-zwr-theme="light"] .zwr-theme-toggle:focus-visible, html[data-zwr-theme="light"] .zwr-auth-theme-toggle:focus-visible { outline: 3px solid #1565c0; outline-offset: 2px; } .zwr-auth-theme-toggle:focus-visible { outline: 3px solid rgba(224, 92, 42, 0.9); outline-offset: 2px; } /* Skip link lands here — see _Layout.cshtml */ #main-content:focus { outline: none; } .zwr-skip-link:focus { z-index: 10900; clip: auto !important; width: auto !important; height: auto !important; overflow: visible !important; white-space: nowrap; } /* Stronger than Bootstrap .navbar-dark.bg-dark when both are on