/* ============================================================
   OMS Dashboard Theme Integration — WBS 6B.5
   
   Maps theme CSS custom properties (--oms-*) to the product
   dashboard's existing variables and selectors.
   
   All rules use !important to override the inline <style> block
   in product-dashboard.html which has hardcoded colors.
   ============================================================ */

/* ── Override dashboard :root variables with theme values ── */
:root,
[data-theme="ocean"] {
  --primary: var(--oms-accent);
  --primary-dark: #5a67d8;
  --navy: var(--oms-panel-bg);
  --gray: var(--oms-text-secondary);
  --success: #10b981;
  --danger: var(--oms-critical);
  --warning: var(--oms-warning);
  --light: var(--oms-panel-border);
}

[data-theme="sunset"] {
  --primary: var(--oms-accent);
  --primary-dark: #b45309;
  --navy: var(--oms-panel-bg);
  --gray: var(--oms-text-secondary);
  --success: #10b981;
  --danger: var(--oms-critical);
  --warning: var(--oms-warning);
  --light: var(--oms-panel-border);
}

[data-theme="forest"] {
  --primary: var(--oms-accent);
  --primary-dark: #15803d;
  --navy: var(--oms-panel-bg);
  --gray: var(--oms-text-secondary);
  --success: #10b981;
  --danger: var(--oms-critical);
  --warning: var(--oms-warning);
  --light: var(--oms-panel-border);
}

[data-theme="arctic"] {
  --primary: var(--oms-accent);
  --primary-dark: #1d4ed8;
  --navy: var(--oms-panel-bg);
  --gray: var(--oms-text-secondary);
  --success: #10b981;
  --danger: var(--oms-critical);
  --warning: var(--oms-warning);
  --light: var(--oms-panel-border);
}

[data-theme="midnight"] {
  --primary: var(--oms-accent);
  --primary-dark: #3b82f6;
  --navy: var(--oms-panel-bg);
  --gray: var(--oms-text-secondary);
  --success: #10b981;
  --danger: var(--oms-critical);
  --warning: var(--oms-warning);
  --light: var(--oms-panel-border);
}

/* ── Dashboard body background ──────────────────────────── */
[data-theme] body,
body[data-theme] {
  background: linear-gradient(135deg, var(--oms-panel-bg) 0%, var(--oms-panel-border) 100%) !important;
  color: var(--oms-text-primary) !important;
}

/* ── Header (both title bar and nav bar) ─────────────────── */
/* Dark themes: dark header */
[data-theme="sunset"] .header,
[data-theme="forest"] .header,
[data-theme="midnight"] .header {
  background: var(--oms-panel-bg) !important;
  border: 1px solid var(--oms-panel-border) !important;
  color: var(--oms-text-primary) !important;
}

[data-theme="sunset"] .header h1,
[data-theme="forest"] .header h1,
[data-theme="midnight"] .header h1 {
  color: var(--oms-text-primary) !important;
}

/* Light theme: keep white header */
[data-theme="arctic"] .header {
  background: rgba(255, 255, 255, 0.95) !important;
  border: 1px solid var(--oms-panel-border) !important;
  color: #0f172a !important;
}

[data-theme="arctic"] .header h1 {
  color: #0f172a !important;
}

/* Ocean: keep original white header — no override needed */

/* ── Company badge ──────────────────────────────────────── */
[data-theme] .header .company-badge {
  background: linear-gradient(135deg, var(--oms-accent), var(--oms-primary-dark, var(--oms-accent))) !important;
  color: #fff !important;
}

/* ── Nav links ───────────────────────────────────────────── */
/* Ocean keeps original blue links */
[data-theme="ocean"] .header .nav-links a {
  color: #667eea !important;
}
[data-theme="ocean"] .header .nav-links a:hover {
  background: #f0f2ff !important;
}

/* Arctic: blue links on white */
[data-theme="arctic"] .header .nav-links a {
  color: #2563eb !important;
}
[data-theme="arctic"] .header .nav-links a:hover {
  background: #eff6ff !important;
}

/* Dark themes: accent-colored links */
[data-theme="sunset"] .header .nav-links a,
[data-theme="forest"] .header .nav-links a,
[data-theme="midnight"] .header .nav-links a {
  color: var(--oms-accent) !important;
}
[data-theme="sunset"] .header .nav-links a:hover,
[data-theme="forest"] .header .nav-links a:hover,
[data-theme="midnight"] .header .nav-links a:hover {
  background: color-mix(in srgb, var(--oms-accent) 15%, transparent) !important;
}

[data-theme] .header .nav-links a.active {
  background: linear-gradient(135deg, var(--oms-accent), var(--oms-primary-dark, var(--oms-accent))) !important;
  color: #fff !important;
}

/* ── Price Bar ──────────────────────────────────────────── */
[data-theme] .price-bar {
  background: var(--oms-panel-bg) !important;
  border: 1px solid var(--oms-panel-border) !important;
}

[data-theme="arctic"] .price-bar {
  background: rgba(255, 255, 255, 0.95) !important;
}

[data-theme] .price-item .value {
  color: var(--oms-text-primary) !important;
}

[data-theme] .price-item .label {
  color: var(--oms-text-secondary) !important;
}

/* ── Product Cards ──────────────────────────────────────── */
[data-theme] .product-card {
  background: linear-gradient(135deg, var(--oms-panel-bg), var(--oms-panel-border)) !important;
  color: var(--oms-text-primary) !important;
  border: 1px solid var(--oms-panel-border) !important;
}

[data-theme] .product-card h3 {
  color: var(--oms-text-secondary) !important;
}

[data-theme] .product-card .volume {
  color: var(--oms-text-primary) !important;
}

[data-theme] .product-card .value .dollar {
  color: var(--oms-accent) !important;
}

[data-theme] .product-card .breakdown {
  border-top: 1px solid var(--oms-panel-border) !important;
}

/* ── Asset Panel ────────────────────────────────────────── */
[data-theme] .asset-panel {
  background: var(--oms-panel-bg) !important;
  border: 1px solid var(--oms-panel-border) !important;
  color: var(--oms-text-primary) !important;
}

[data-theme="arctic"] .asset-panel {
  background: #fff !important;
}

[data-theme] .asset-panel h3 {
  color: var(--oms-text-primary) !important;
}

[data-theme] .asset-panel h3 i {
  color: var(--oms-accent) !important;
}

[data-theme] .asset-panel .back-btn {
  color: var(--oms-accent) !important;
}

/* ── Asset Cards ─────────────────────────────────────────── */
[data-theme] .asset-card {
  background: var(--oms-panel-bg) !important;
  border: 1px solid var(--oms-panel-border) !important;
  color: var(--oms-text-primary) !important;
}

[data-theme="arctic"] .asset-card {
  background: #fff !important;
}

[data-theme] .asset-card:hover {
  border-color: var(--oms-accent) !important;
  box-shadow: 0 2px 8px color-mix(in srgb, var(--oms-accent) 30%, transparent) !important;
}

[data-theme] .asset-card .name {
  color: var(--oms-text-primary) !important;
}

[data-theme] .asset-card .location {
  color: var(--oms-text-secondary) !important;
}

[data-theme] .asset-card .volume {
  color: var(--oms-accent) !important;
}

[data-theme] .asset-card .capacity {
  color: var(--oms-text-secondary) !important;
}

/* ── Progress Bars ──────────────────────────────────────── */
[data-theme] .progress-fill {
  background: linear-gradient(90deg, var(--oms-gauge-fill-start), var(--oms-gauge-fill-end)) !important;
}

[data-theme] .progress-fill.high {
  background: linear-gradient(90deg, #10b981, #059669) !important;
}

[data-theme] .progress-fill.medium {
  background: linear-gradient(90deg, var(--oms-warning), color-mix(in srgb, var(--oms-warning) 70%, #000)) !important;
}

[data-theme] .progress-fill.low,
[data-theme] .progress-fill.over {
  background: linear-gradient(90deg, var(--oms-critical), color-mix(in srgb, var(--oms-critical) 70%, #000)) !important;
}

[data-theme] .progress-fill.over {
  animation: pulse-bar 1.5s infinite !important;
}

/* ── Stat Items ─────────────────────────────────────────── */
[data-theme] .stat-item .stat-num {
  background: linear-gradient(135deg, var(--oms-accent), var(--oms-primary-dark, var(--oms-accent))) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

/* ── User Badge ─────────────────────────────────────────── */
[data-theme] .user-badge {
  background: linear-gradient(135deg, var(--oms-accent), var(--oms-primary-dark, var(--oms-accent))) !important;
}

/* ── Buttons ────────────────────────────────────────────── */
[data-theme] .btn-primary,
[data-theme] .btn-logout {
  background: linear-gradient(135deg, var(--oms-accent), var(--oms-primary-dark, var(--oms-accent))) !important;
  color: #fff !important;
  border: 1px solid var(--oms-accent) !important;
}

/* ── Cards (generic) ────────────────────────────────────── */
[data-theme] .card {
  background: var(--oms-panel-bg) !important;
  border: 1px solid var(--oms-panel-border) !important;
  color: var(--oms-text-primary) !important;
}

[data-theme="arctic"] .card {
  background: #fff !important;
}

/* ── Gauge fill (for SVG/canvas gauges) ────────────────── */
[data-theme] .gauge-fill,
[data-theme] .gauge-bar {
  background: linear-gradient(180deg, var(--oms-gauge-fill-start), var(--oms-gauge-fill-end)) !important;
}

/* ── Blend Spec Entry ───────────────────────────────────── */
[data-theme] .source-panel,
[data-theme] .target-panel {
  background: var(--oms-panel-bg) !important;
  border-color: var(--oms-panel-border) !important;
}

[data-theme] .source-panel h2,
[data-theme] .target-panel label {
  color: var(--oms-text-secondary) !important;
}

[data-theme] .source-panel *,
[data-theme] .target-panel select,
[data-theme] .target-panel input {
  color: var(--oms-text-primary) !important;
}

[data-theme] .target-panel select,
[data-theme] .target-panel input {
  background: var(--oms-panel-bg) !important;
  border-color: var(--oms-panel-border) !important;
}

[data-theme] .blend-dropdown-btn {
  background: var(--oms-panel-bg) !important;
  color: var(--oms-text-primary) !important;
  border-color: var(--oms-panel-border) !important;
}

[data-theme] .blend-dropdown-menu {
  background: var(--oms-panel-bg) !important;
  border-color: var(--oms-panel-border) !important;
}

[data-theme] .results .spec {
  color: var(--oms-text-secondary) !important;
}

[data-theme] .results .method {
  color: var(--oms-accent) !important;
}

[data-theme] .footer {
  background: var(--oms-panel-bg) !important;
  color: var(--oms-text-secondary) !important;
}

[data-theme] .footer .meta {
  color: var(--oms-text-secondary) !important;
}

/* Arctic-specific: light theme overrides for blend page */
[data-theme="arctic"] .source-panel,
[data-theme="arctic"] .target-panel {
  background: rgba(255, 255, 255, 0.95) !important;
  border-bottom-color: #cbd5e1 !important;
}

[data-theme="arctic"] .source-panel h2,
[data-theme="arctic"] .target-panel label {
  color: #1e293b !important;
}

[data-theme="arctic"] .source-panel *,
[data-theme="arctic"] .target-panel select,
[data-theme="arctic"] .target-panel input {
  color: #0f172a !important;
}

[data-theme="arctic"] .target-panel select,
[data-theme="arctic"] .target-panel input {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
}

[data-theme="arctic"] .blend-dropdown-btn {
  background: #f8fafc !important;
  color: #0f172a !important;
  border-color: #cbd5e1 !important;
}

[data-theme="arctic"] .blend-dropdown-menu {
  background: #fff !important;
  border-color: #e2e8f0 !important;
}

[data-theme="arctic"] .results .spec {
  color: #64748b !important;
}

[data-theme="arctic"] .footer {
  background: rgba(248, 250, 252, 0.95) !important;
  color: #1e293b !important;
}

/* ── Print: hide theme picker, force light ──────────────── */
@media print {
  [data-theme] body {
    background: #fff !important;
    color: #000 !important;
  }
  [data-theme] .header,
  [data-theme] .product-card,
  [data-theme] .asset-card,
  [data-theme] .asset-panel {
    background: #fff !important;
    border-color: #ccc !important;
    color: #000 !important;
  }
  [data-theme] .theme-picker,
  [data-theme] .theme-picker-wrapper,
  [data-theme] .no-print {
    display: none !important;
  }
}
/* ── Arctic: Blend page comprehensive fixes ───────────── */

/* Buttons */
[data-theme="arctic"] .btn-primary,
[data-theme="arctic"] .btn-success,
[data-theme="arctic"] .btn-outline {
  color: #fff !important;
}
[data-theme="arctic"] .btn-primary {
  background: #2563eb !important;
  border-color: #2563eb !important;
}
[data-theme="arctic"] .btn-primary:hover {
  background: #1d4ed8 !important;
}
[data-theme="arctic"] .btn-success {
  background: #059669 !important;
  border-color: #059669 !important;
}
[data-theme="arctic"] .btn-success:hover {
  background: #047857 !important;
}
[data-theme="arctic"] .btn-outline {
  background: #f1f5f9 !important;
  color: #334155 !important;
  border-color: #cbd5e1 !important;
}
[data-theme="arctic"] .btn-outline:hover {
  background: #e2e8f0 !important;
  color: #1e293b !important;
}

/* Badges */
[data-theme="arctic"] .badge-neutral {
  background: #e2e8f0 !important;
  color: #334155 !important;
}
[data-theme="arctic"] .badge-pass {
  background: #d1fae5 !important;
  color: #065f46 !important;
}
[data-theme="arctic"] .badge-fail {
  background: #fee2e2 !important;
  color: #991b1b !important;
}
[data-theme="arctic"] .badge-warn {
  background: #fef3c7 !important;
  color: #92400e !important;
}

/* Navigation & header */
[data-theme="arctic"] #backToDashboard {
  color: #2563eb !important;
}
[data-theme="arctic"] #backToDashboard:hover {
  color: #1d4ed8 !important;
}
[data-theme="arctic"] .header .theme-gear-btn {
  background: linear-gradient(135deg, #3b82f6, #1d4ed8) !important;
  color: #fff !important;
  border-color: #2563eb !important;
}
[data-theme="arctic"] .header .theme-gear-icon,
[data-theme="arctic"] .header .theme-gear-label {
  color: #fff !important;
}

/* Source & target panels - force dark text on light backgrounds */
[data-theme="arctic"] .source-panel,
[data-theme="arctic"] .target-panel {
  background: rgba(255, 255, 255, 0.95) !important;
  border-bottom-color: #cbd5e1 !important;
}
[data-theme="arctic"] .source-panel h2,
[data-theme="arctic"] .source-panel h3,
[data-theme="arctic"] .target-panel label,
[data-theme="arctic"] .target-panel span,
[data-theme="arctic"] .target-panel p {
  color: #334155 !important;
}

/* Empty state */
[data-theme="arctic"] .empty-state,
[data-theme="arctic"] .empty-state h3,
[data-theme="arctic"] .empty-state p,
[data-theme="arctic"] #emptyStateTitle {
  color: #334155 !important;
}

/* Footer */
[data-theme="arctic"] .footer,
[data-theme="arctic"] .footer .meta,
[data-theme="arctic"] .footer p,
[data-theme="arctic"] .footer span {
  color: #1e293b !important;
}

/* Spec title */
[data-theme="arctic"] h1,
[data-theme="arctic"] h2 {
  color: #0f172a !important;
}

/* ============================================================
   WBS-6B-ARCTIC-HR — Historical Reports Arctic Overrides
   
   Maps dark-theme inline styles in historical-reports.html
   to readable Arctic-theme values. All rules use !important
   to override the inline <style> block.
   
   WBS Reference: WBS-6B-ARCTIC-HR-2026-07-14.md (Rev 2)
   Authorization: AUTH-6B-HR-DEPLOY-20260714.md
   Author: OC2 (full-stack dev)
   ============================================================ */

/* ── 6B-HR.10: body, .header h1 (verification — rules already
   exist above; this block confirms coverage is complete). ── */
/* (body covered by [data-theme] body at line 69-70)
   (.header h1 covered by [data-theme="arctic"] .header h1 at line 98) */

/* ── 6B-HR.9: nav-links + buttons ──────────────────────────── */
[data-theme="arctic"] .nav-links a,
[data-theme="arctic"] .nav-links button {
  color: #1e293b !important;
}
[data-theme="arctic"] .nav-links a:hover,
[data-theme="arctic"] .nav-links button:hover {
  background: #e2e8f0 !important;
  color: #0f172a !important;
}

/* ── 6B-HR.3: controls-bar ─────────────────────────────────── */
[data-theme="arctic"] .controls-bar {
  background: rgba(255, 255, 255, 0.95) !important;
  border: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .controls-bar label {
  color: #1e293b !important;
}
[data-theme="arctic"] .controls-bar select,
[data-theme="arctic"] .controls-bar input {
  background: #f1f5f9 !important;
  color: #0f172a !important;
  border: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .controls-bar select option {
  background: #f1f5f9 !important;
  color: #0f172a !important;
}

/* ── 6B-HR.9: buttons (btn-secondary) ──────────────────────── */
[data-theme="arctic"] .btn-secondary {
  background: #e2e8f0 !important;
  color: #0f172a !important;
  border: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .btn-secondary:hover {
  background: #cbd5e1 !important;
}
/* (.btn-export uses green gradient with white text — works on Arctic; no override.) */

/* ── 6B-HR.2: product-group-header + product-name/stats ────── */
[data-theme="arctic"] .product-group-header {
  background: rgba(102, 126, 234, 0.08) !important;
  border: 1px solid rgba(102, 126, 234, 0.25) !important;
}
[data-theme="arctic"] .product-group-header .product-name {
  color: #0f172a !important;
}
[data-theme="arctic"] .product-group-header .product-stats {
  color: #1e293b !important;
}

/* ── 6B-HR.4: asset-panel + variants ───────────────────────── */
[data-theme="arctic"] .asset-panel {
  background: rgba(255, 255, 255, 0.95) !important;
  border: 1px solid #e2e8f0 !important;
}
[data-theme="arctic"] .asset-panel-name {
  color: #0f172a !important;
}
[data-theme="arctic"] .asset-panel-meta {
  color: #1e293b !important;
}
[data-theme="arctic"] .asset-location {
  color: #1e293b !important;
}
/* (.asset-pct base is layout-only; variants use saturated colors that work on both themes.) */

/* ── 6B-HR.5: enhanced-chart, chart-area, chart-meta,
   chart-legend, y-label, ref-line ─────────────────────────── */
[data-theme="arctic"] .enhanced-chart {
  border-top: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .chart-area {
  border-left: 1px solid #cbd5e1 !important;
  border-bottom: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .chart-meta {
  color: #1e293b !important;
}
[data-theme="arctic"] .chart-legend {
  color: #1e293b !important;
}
[data-theme="arctic"] .y-label {
  color: #1e293b !important;
}
[data-theme="arctic"] .ref-line {
  border-top: 1px dashed rgba(0, 0, 0, 0.1) !important;
}

/* ── 6B-HR.6: fill-gauge-track, tick, label, value ─────────── */
[data-theme="arctic"] .fill-gauge-track {
  background: #e2e8f0 !important;
  border: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .fill-gauge-tick {
  background: rgba(0, 0, 0, 0.25) !important;
  width: 2px !important;
}
[data-theme="arctic"] .fill-gauge-tick-label {
  color: #0f172a !important;
  font-size: 0.65rem !important;
  font-weight: 600 !important;
}
[data-theme="arctic"] .fill-gauge-label {
  color: #1e293b !important;
}
[data-theme="arctic"] .fill-gauge-value {
  color: #0f172a !important;
  text-shadow: none !important;
}

/* ── 6B-HR.1: summary-card + variants ──────────────────────── */
[data-theme="arctic"] .summary-card {
  background: rgba(255, 255, 255, 0.95) !important;
  border: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .summary-card .label {
  color: #1e293b !important;
}
[data-theme="arctic"] .summary-card .value {
  color: #0f172a !important;
}
[data-theme="arctic"] .summary-card .sub {
  color: #1e293b !important;
}

/* ── 6B-HR.7: setting-card + variants ──────────────────────── */
[data-theme="arctic"] .setting-card {
  background: rgba(255, 255, 255, 0.95) !important;
  border: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .setting-label {
  color: #1e293b !important;
}
[data-theme="arctic"] .setting-value {
  color: #0f172a !important;
}
[data-theme="arctic"] .setting-row {
  border-bottom: 1px solid #e2e8f0 !important;
}

/* ── 6B-HR.8: bars-container, bar, bar .tooltip ────────────── */
[data-theme="arctic"] .bar .tooltip {
  background: rgba(15, 23, 42, 0.95) !important;
  border: 1px solid #cbd5e1 !important;
  color: #e2e8f0 !important;
}
/* (.bar and .bars-container are layout-only.) */

/* ── 6B-HR.10: loading, product-other ──────────────────────── */
[data-theme="arctic"] .loading {
  color: #1e293b !important;
}
[data-theme="arctic"] .product-other {
  color: #1e293b !important;
}

/* ============================================================
   WBS-6B-ARCTIC-BLEND — Blend Spec Entry Arctic Overrides
   Maps dark-theme inline styles in blend-spec-entry.html
   to readable Arctic-theme values. All rules use !important
   to override the inline <style> block.
   Pattern: Same as WBS-6B-ARCTIC-HR (Rev 2)
   ============================================================ */

/* ── 6B-BLEND.1: source-panel, source-slot ──────────────────── */
[data-theme="arctic"] .source-panel h2 {
  color: #1e293b !important;
}
[data-theme="arctic"] .source-slot {
  background: #f8fafc !important;
  border: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .source-slot .slot-label {
  color: #1e293b !important;
}
[data-theme="arctic"] .source-slot select {
  background: #f1f5f9 !important;
  color: #0f172a !important;
  border: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .source-slot .pct-input input {
  background: #f1f5f9 !important;
  border: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .source-slot .pct-input span {
  color: #1e293b !important;
}
[data-theme="arctic"] .source-slot .entry-info {
  color: #1e293b !important;
}

/* ── 6B-BLEND.2: tank-source-card ───────────────────────────── */
[data-theme="arctic"] .tank-source-card {
  background: #f8fafc !important;
  border: 1px solid #3b82f6 !important;
}
[data-theme="arctic"] .tank-source-card .tank-name {
  color: #0f172a !important;
}
[data-theme="arctic"] .tank-source-card .tank-product {
  color: #3b82f6 !important;
}
[data-theme="arctic"] .tank-source-card .tank-location {
  color: #1e293b !important;
}

/* ── 6B-BLEND.3: target-panel ───────────────────────────────── */
[data-theme="arctic"] .target-panel {
  background: #f8fafc !important;
  border-bottom: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .target-panel label {
  color: #1e293b !important;
}
[data-theme="arctic"] .target-panel select,
[data-theme="arctic"] .target-panel input {
  background: #f1f5f9 !important;
  color: #0f172a !important;
  border: 1px solid #cbd5e1 !important;
}

/* ── 6B-BLEND.4: blend-dropdown, blend-item ──────────────────── */
[data-theme="arctic"] .blend-dropdown-btn {
  background: #f1f5f9 !important;
  color: #0f172a !important;
  border: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .blend-dropdown-btn:hover {
  background: #e2e8f0 !important;
}
[data-theme="arctic"] .blend-dropdown-menu {
  background: #f8fafc !important;
  border: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .blend-item {
  border-bottom: 1px solid #e2e8f0 !important;
}
[data-theme="arctic"] .blend-item:hover {
  background: #f1f5f9 !important;
}
[data-theme="arctic"] .blend-item-meta {
  color: #1e293b !important;
}
[data-theme="arctic"] .blend-item-actions button {
  color: #1e293b !important;
}

/* ── 6B-BLEND.5: results table ──────────────────────────────── */
[data-theme="arctic"] .results th {
  background: #f1f5f9 !important;
  color: #1e293b !important;
  border-bottom: 2px solid #cbd5e1 !important;
}
[data-theme="arctic"] .results th.source-col {
  color: #3b82f6 !important;
}
[data-theme="arctic"] .results th.source-col-active {
  background: #dbeafe !important;
  border-bottom: 3px solid #3b82f6 !important;
}
[data-theme="arctic"] .results .spec {
  color: #1e293b !important;
}
[data-theme="arctic"] .results .unit {
  color: #1e293b !important;
}
[data-theme="arctic"] .results .val {
  color: #0f172a !important;
}
[data-theme="arctic"] .results .val-editable {
  color: #0f172a !important;
}
[data-theme="arctic"] .results td.source-active {
  background: #dbeafe !important;
  color: #0f172a !important;
  border-left: 3px solid #3b82f6 !important;
  border-right: 3px solid #3b82f6 !important;
  border-top: 1px solid #93c5fd !important;
  border-bottom: 1px solid #93c5fd !important;
}
[data-theme="arctic"] .results td.source-active .val-editable {
  background: #bfdbfe !important;
  color: #0f172a !important;
  border: 1px solid #3b82f6 !important;
}
[data-theme="arctic"] .results td {
  border-bottom: 1px solid #e2e8f0 !important;
}


/* ── 6B-BLEND.6: modal-box, entry-card ──────────────────────── */
[data-theme="arctic"] .modal-box {
  background: #f8fafc !important;
  border: 1px solid #cbd5e1 !important;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.15) !important;
}
[data-theme="arctic"] .modal-box h3 {
  color: #0f172a !important;
}
[data-theme="arctic"] .modal-box label {
  color: #1e293b !important;
}
[data-theme="arctic"] .modal-box input,
[data-theme="arctic"] .modal-box select {
  background: #f1f5f9 !important;
  border: 1px solid #cbd5e1 !important;
  color: #0f172a !important;
}
[data-theme="arctic"] .modal .entry-card {
  background: #f1f5f9 !important;
  border: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .modal .entry-card .meta {
  color: #1e293b !important;
}
[data-theme="arctic"] .modal .entry-card .preview {
  color: #1e293b !important;
}

/* ── 6B-BLEND.7: btn-outline, status-draft, section-header ─── */
[data-theme="arctic"] .btn-outline {
  color: #1e293b !important;
  border: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .btn-outline:hover {
  background: #f1f5f9 !important;
  color: #0f172a !important;
}
[data-theme="arctic"] .status-draft {
  background: #f1f5f9 !important;
  color: #1e293b !important;
  border: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .section-header td {
  background: #f1f5f9 !important;
  color: #0f172a !important;
}
[data-theme="arctic"] .section-header:hover td {
  background: #e2e8f0 !important;
}

/* ── 6B-BLEND.8: add-source-btn, footer, loading ───────────── */
[data-theme="arctic"] .add-source-btn {
  background: #f1f5f9 !important;
  border: 2px dashed #cbd5e1 !important;
  color: #1e293b !important;
}
[data-theme="arctic"] .add-source-btn:hover {
  background: #e2e8f0 !important;
  border-color: #3b82f6 !important;
  color: #3b82f6 !important;
}
[data-theme="arctic"] .footer {
  background: #f8fafc !important;
  color: #1e293b !important;
  border-top: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .loading-state {
  color: #1e293b !important;
}
/* ============================================================
   WBS-6B-ARCTIC-BLEND — Inline Style Overrides
   JavaScript-generated inline styles with dark-theme colors.
   These !important rules override inline style attributes.
   ============================================================ */

/* ── 6B-BLEND.2: tank-source-card ───────────────────────────── */
[data-theme="arctic"] .tank-source-card {
  background: #f8fafc !important;
  border: 1px solid #3b82f6 !important;
}
[data-theme="arctic"] .tank-source-card .tank-name {
  color: #0f172a !important;
}
[data-theme="arctic"] .tank-source-card .tank-product {
  color: #3b82f6 !important;
}
[data-theme="arctic"] .tank-source-card .tank-location {
  color: #1e293b !important;
}

/* ── 6B-BLEND.3: target-panel ───────────────────────────────── */
[data-theme="arctic"] .target-panel {
  background: #f8fafc !important;
  border-bottom: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .target-panel label {
  color: #1e293b !important;
}
[data-theme="arctic"] .target-panel select,
[data-theme="arctic"] .target-panel input {
  background: #f1f5f9 !important;
  color: #0f172a !important;
  border: 1px solid #cbd5e1 !important;
}

/* ── 6B-BLEND.4: blend-dropdown, blend-item ──────────────────── */
[data-theme="arctic"] .blend-dropdown-btn {
  background: #f1f5f9 !important;
  color: #0f172a !important;
  border: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .blend-dropdown-btn:hover {
  background: #e2e8f0 !important;
}
[data-theme="arctic"] .blend-dropdown-menu {
  background: #f8fafc !important;
  border: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .blend-item {
  border-bottom: 1px solid #e2e8f0 !important;
}
[data-theme="arctic"] .blend-item:hover {
  background: #f1f5f9 !important;
}
[data-theme="arctic"] .blend-item-meta {
  color: #1e293b !important;
}
[data-theme="arctic"] .blend-item-actions button {
  color: #1e293b !important;
}

/* ── 6B-BLEND.5: results table ──────────────────────────────── */
[data-theme="arctic"] .results th {
  background: #f1f5f9 !important;
  color: #1e293b !important;
  border-bottom: 2px solid #cbd5e1 !important;
}
[data-theme="arctic"] .results th.source-col {
  color: #3b82f6 !important;
}
[data-theme="arctic"] .results th.source-col-active {
  background: #dbeafe !important;
  border-bottom: 3px solid #3b82f6 !important;
}
[data-theme="arctic"] .results .spec {
  color: #1e293b !important;
}
[data-theme="arctic"] .results .unit {
  color: #1e293b !important;
}
[data-theme="arctic"] .results .val {
  color: #0f172a !important;
}
[data-theme="arctic"] .results .val-editable {
  color: #0f172a !important;
}
[data-theme="arctic"] .results td.source-active {
  background: #dbeafe !important;
  color: #0f172a !important;
  border-left: 3px solid #3b82f6 !important;
  border-right: 3px solid #3b82f6 !important;
  border-top: 1px solid #93c5fd !important;
  border-bottom: 1px solid #93c5fd !important;
}
[data-theme="arctic"] .results td.source-active .val-editable {
  background: #bfdbfe !important;
  color: #0f172a !important;
  border: 1px solid #3b82f6 !important;
}
[data-theme="arctic"] .results td {
  border-bottom: 1px solid #e2e8f0 !important;
}


/* ── 6B-BLEND.6: modal-box, entry-card ──────────────────────── */
[data-theme="arctic"] .modal-box {
  background: #f8fafc !important;
  border: 1px solid #cbd5e1 !important;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.15) !important;
}
[data-theme="arctic"] .modal-box h3 {
  color: #0f172a !important;
}
[data-theme="arctic"] .modal-box label {
  color: #1e293b !important;
}
[data-theme="arctic"] .modal-box input,
[data-theme="arctic"] .modal-box select {
  background: #f1f5f9 !important;
  border: 1px solid #cbd5e1 !important;
  color: #0f172a !important;
}
[data-theme="arctic"] .modal .entry-card {
  background: #f1f5f9 !important;
  border: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .modal .entry-card .meta {
  color: #1e293b !important;
}
[data-theme="arctic"] .modal .entry-card .preview {
  color: #1e293b !important;
}

/* ── 6B-BLEND.7: btn-outline, status-draft, section-header ─── */
[data-theme="arctic"] .btn-outline {
  color: #1e293b !important;
  border: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .btn-outline:hover {
  background: #f1f5f9 !important;
  color: #0f172a !important;
}
[data-theme="arctic"] .status-draft {
  background: #f1f5f9 !important;
  color: #1e293b !important;
  border: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .section-header td {
  background: #f1f5f9 !important;
  color: #0f172a !important;
}
[data-theme="arctic"] .section-header:hover td {
  background: #e2e8f0 !important;
}

/* ── 6B-BLEND.8: add-source-btn, footer, loading ───────────── */
[data-theme="arctic"] .add-source-btn {
  background: #f1f5f9 !important;
  border: 2px dashed #cbd5e1 !important;
  color: #1e293b !important;
}
[data-theme="arctic"] .add-source-btn:hover {
  background: #e2e8f0 !important;
  border-color: #3b82f6 !important;
  color: #3b82f6 !important;
}
[data-theme="arctic"] .footer {
  background: #f8fafc !important;
  color: #1e293b !important;
  border-top: 1px solid #cbd5e1 !important;
}
[data-theme="arctic"] .loading-state {
  color: #1e293b !important;
}
/* ============================================================
   WBS-6B-ARCTIC-BLEND — Inline Style Overrides
   JavaScript-generated inline styles with dark-theme colors.
   These !important rules override inline style attributes.
   ============================================================ */

/* Catch-all: any element with inline light-gray/dark-theme colors under Arctic */

/* Tank name inline styles */

/* Results inline styles */

/* Footer inline styles */
[data-theme="arctic"] .source-slot.active {
  border-color: #3b82f6 !important;
  box-shadow: 0 0 0 2px #3b82f6, 0 0 12px rgba(59, 130, 246, 0.25) !important;
  background: #eff6ff !important;
}
[data-theme="arctic"] .source-slot:hover {
  border-color: #94a3b8 !important;
}
[data-theme="arctic"] .source-slot.active .slot-label .remove-btn {
  color: #ef4444 !important;
}
[data-theme="arctic"] .modal .entry-card.selected {
  border-color: #10b981 !important;
  background: rgba(16, 185, 129, 0.12) !important;
  box-shadow: 0 0 0 2px #10b981 !important;
}
[data-theme="arctic"] .modal .entry-card:hover {
  border-color: #3b82f6 !important;
  background: #f1f5f9 !important;
}

[data-theme="arctic"] .results th.source-col-inactive {
  border-left: 1px solid #cbd5e1 !important;
  border-right: 1px solid #cbd5e1 !important;
  color: #94a3b8 !important;
  background: #f8fafc !important;
}
[data-theme="arctic"] .results td.source-inactive {
  border-left: 1px solid #cbd5e1 !important;
  border-right: 1px solid #cbd5e1 !important;
  color: #64748b !important;
  background: #fafafa !important;
}/* ── 6B-BLEND.10: Results table complete Arctic overrides ──── */
/* These override the original dark-theme .results styles */
[data-theme="arctic"] .results td {
  color: #0f172a !important;
  border-bottom: 1px solid #e2e8f0 !important;
}
[data-theme="arctic"] .results tr:hover td {
  background: #f1f5f9 !important;
}
[data-theme="arctic"] .results .prop {
  color: #0f172a !important;
  font-weight: 700 !important;
}
[data-theme="arctic"] .results .val {
  color: #1e293b !important;
}
[data-theme="arctic"] .results .blend {
  color: #d97706 !important;
}
[data-theme="arctic"] .results .blend.over {
  color: #dc2626 !important;
  text-shadow: none !important;
}
[data-theme="arctic"] .results .blend.under {
  color: #059669 !important;
}
[data-theme="arctic"] .results .spec {
  color: #1e293b !important;
}
[data-theme="arctic"] .results .method {
  color: #6d28d9 !important;
}
[data-theme="arctic"] .results .status.pass {
  color: #059669 !important;
}
[data-theme="arctic"] .results .status.fail {
  color: #dc2626 !important;
}
[data-theme="arctic"] .results .status.na {
  color: #94a3b8 !important;
}
[data-theme="arctic"] .results .row-fail td {
  background: rgba(239, 68, 68, 0.06) !important;
}
[data-theme="arctic"] .results .row-fail:hover td {
  background: rgba(239, 68, 68, 0.12) !important;
}/* ============================================================
   WBS-6B-ARCTIC-BLEND — Inline Style Overrides
   JavaScript-generated inline styles with dark-theme colors.
   These !important rules override inline style attributes.
   ============================================================ */

/* Catch-all: any element with inline light-gray/dark-theme colors under Arctic */

/* Tank name inline styles */

/* Results inline styles */

/* Footer inline styles */
/* ── 6B-BLEND.11: Tank card class overrides (Arctic) ─────── */
[data-theme="arctic"] .tank-name {
  color: #0f172a !important;
}
[data-theme="arctic"] .tank-product {
  color: #3b82f6 !important;
}
[data-theme="arctic"] .tank-volume {
  color: #059669 !important;
}
[data-theme="arctic"] .tank-pct {
  color: #1e293b !important;
}
[data-theme="arctic"] .source-detail {
  color: #1e293b !important;
}
[data-theme="arctic"] .cost-display {
  color: #059669 !important;
}
[data-theme="arctic"] .manual-note {
  color: #1e293b !important;
}
/* ── 6B-BLEND.11: Tank card class overrides (Arctic) ─────── */
[data-theme="arctic"] .tank-name {
  color: #0f172a !important;
}
[data-theme="arctic"] .tank-product {
  color: #3b82f6 !important;
}
[data-theme="arctic"] .tank-volume {
  color: #059669 !important;
}
[data-theme="arctic"] .tank-pct {
  color: #1e293b !important;
}
[data-theme="arctic"] .source-detail {
  color: #1e293b !important;
}
[data-theme="arctic"] .cost-display {
  color: #059669 !important;
}
[data-theme="arctic"] .manual-note {
  color: #1e293b !important;
}/* ── 6B-BLEND.12: Picker modal (large modal) Arctic overrides ── */
/* The tank/entry picker uses .modal class (not .modal-box) */
[data-theme="arctic"] .modal {
  background: #ffffff !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25) !important;
}
[data-theme="arctic"] .modal h2 {
  color: #0f172a !important;
}
[data-theme="arctic"] .modal .entry-card {
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
}
[data-theme="arctic"] .modal .entry-card:hover {
  background: #f1f5f9 !important;
  border-color: #3b82f6 !important;
}
[data-theme="arctic"] .modal .entry-card.selected {
  border-color: #10b981 !important;
  background: #ecfdf5 !important;
  box-shadow: 0 0 0 2px #10b981 !important;
}
[data-theme="arctic"] .modal .entry-card h3 {
  color: #0f172a !important;
}
[data-theme="arctic"] .modal .entry-card .meta {
  color: #1e293b !important;
}
[data-theme="arctic"] .modal .entry-card .preview {
  color: #475569 !important;
}
/* Type badges on Arctic */
[data-theme="arctic"] .type-entry {
  background: #dbeafe !important;
  color: #1d4ed8 !important;
}
[data-theme="arctic"] .type-ifq {
  background: #fef3c7 !important;
  color: #92400e !important;
}
[data-theme="arctic"] .type-tank {
  background: #d1fae5 !important;
  color: #065f46 !important;
}
/* Modal overlay on Arctic */
[data-theme="arctic"] .modal-overlay {
  background: rgba(0, 0, 0, 0.4) !important;
}
/* Modal actions buttons */
[data-theme="arctic"] .modal .modal-actions .btn-primary {
  background: #3b82f6 !important;
  color: #ffffff !important;
}
[data-theme="arctic"] .modal .modal-actions .btn-outline {
  background: #f1f5f9 !important;
  color: #1e293b !important;
  border: 1px solid #cbd5e1 !important;
}
/* Select All button in picker */
[data-theme="arctic"] #selectAllBtn {
  background: #f1f5f9 !important;
  color: #1e293b !important;
  border: 1px solid #cbd5e1 !important;
}/* ── Reports page — Dark-theme overrides (Sunset, Forest, Midnight) ── */
/* reports.html uses light-theme hardcoded colors (white bg, dark text)   */
/* which are invisible on dark theme backgrounds. These overrides make   */
/* all text and backgrounds theme-aware.                                  */

/* body text color */
[data-theme="sunset"] body,
[data-theme="forest"] body,
[data-theme="midnight"] body {
  color: var(--oms-text-primary) !important;
}

/* header */
[data-theme="sunset"] .header,
[data-theme="forest"] .header,
[data-theme="midnight"] .header {
  background: var(--oms-panel-bg) !important;
  border: 1px solid var(--oms-panel-border) !important;
}

/* content area */
[data-theme="sunset"] .content,
[data-theme="forest"] .content,
[data-theme="midnight"] .content {
  background: var(--oms-panel-bg) !important;
  border: 1px solid var(--oms-panel-border) !important;
  color: var(--oms-text-primary) !important;
}

/* report cards */
[data-theme="sunset"] .report-card,
[data-theme="forest"] .report-card,
[data-theme="midnight"] .report-card {
  background: var(--oms-panel-bg) !important;
  border-color: var(--oms-panel-border) !important;
  color: var(--oms-text-primary) !important;
}

[data-theme="sunset"] .report-card:hover,
[data-theme="forest"] .report-card:hover,
[data-theme="midnight"] .report-card:hover {
  border-color: var(--oms-accent) !important;
  box-shadow: 0 4px 12px color-mix(in srgb, var(--oms-accent) 25%, transparent) !important;
}

[data-theme="sunset"] .report-card h3,
[data-theme="forest"] .report-card h3,
[data-theme="midnight"] .report-card h3 {
  color: var(--oms-text-primary) !important;
}

[data-theme="sunset"] .report-card p,
[data-theme="forest"] .report-card p,
[data-theme="midnight"] .report-card p {
  color: var(--oms-text-secondary) !important;
}

/* result header */
[data-theme="sunset"] .result-header h2,
[data-theme="forest"] .result-header h2,
[data-theme="midnight"] .result-header h2 {
  color: var(--oms-text-primary) !important;
}

/* results table */
[data-theme="sunset"] .results,
[data-theme="forest"] .results,
[data-theme="midnight"] .results {
  color: var(--oms-text-primary) !important;
}

[data-theme="sunset"] .results th,
[data-theme="forest"] .results th,
[data-theme="midnight"] .results th {
  background: var(--oms-panel-border) !important;
  color: #fff !important;
}

[data-theme="sunset"] .results td,
[data-theme="forest"] .results td,
[data-theme="midnight"] .results td {
  border-bottom-color: var(--oms-panel-border) !important;
  color: var(--oms-text-primary) !important;
}

[data-theme="sunset"] .results tr:hover td,
[data-theme="forest"] .results tr:hover td,
[data-theme="midnight"] .results tr:hover td {
  background: color-mix(in srgb, var(--oms-panel-bg) 50%, var(--oms-panel-border)) !important;
}

/* back button */
[data-theme="sunset"] .back-btn,
[data-theme="forest"] .back-btn,
[data-theme="midnight"] .back-btn {
  color: var(--oms-accent) !important;
}

[data-theme="sunset"] .back-btn:hover,
[data-theme="forest"] .back-btn:hover,
[data-theme="midnight"] .back-btn:hover {
  background: color-mix(in srgb, var(--oms-accent) 15%, transparent) !important;
}

/* stat cards — these have gradient backgrounds with white text, OK on dark themes */
/* but the text inside needs to stay white */
[data-theme="sunset"] .stat-card,
[data-theme="forest"] .stat-card,
[data-theme="midnight"] .stat-card {
  color: #fff !important;
}

[data-theme="sunset"] .stat-card h4,
[data-theme="forest"] .stat-card h4,
[data-theme="midnight"] .stat-card h4 {
  color: rgba(255,255,255,0.9) !important;
}

[data-theme="sunset"] .stat-card .num,
[data-theme="forest"] .stat-card .num,
[data-theme="midnight"] .stat-card .num {
  color: #fff !important;
}

/* badges — should have enough contrast on dark */
[data-theme="sunset"] .badge-green,
[data-theme="forest"] .badge-green,
[data-theme="midnight"] .badge-green {
  background: rgba(16, 185, 129, 0.2) !important;
  color: #6ee7b7 !important;
}

[data-theme="sunset"] .badge-blue,
[data-theme="forest"] .badge-blue,
[data-theme="midnight"] .badge-blue {
  background: rgba(59, 130, 246, 0.2) !important;
  color: #93c5fd !important;
}

[data-theme="sunset"] .badge-orange,
[data-theme="forest"] .badge-orange,
[data-theme="midnight"] .badge-orange {
  background: rgba(245, 158, 11, 0.2) !important;
  color: #fbbf24 !important;
}

[data-theme="sunset"] .badge-purple,
[data-theme="forest"] .badge-purple,
[data-theme="midnight"] .badge-purple {
  background: rgba(124, 58, 237, 0.2) !important;
  color: #c4b5fd !important;
}

[data-theme="sunset"] .badge-red,
[data-theme="forest"] .badge-red,
[data-theme="midnight"] .badge-red {
  background: rgba(239, 68, 68, 0.2) !important;
  color: #fca5a5 !important;
}

/* content h2 */
[data-theme="sunset"] .content h2,
[data-theme="forest"] .content h2,
[data-theme="midnight"] .content h2 {
  color: var(--oms-text-primary) !important;
}

/* loading text */
[data-theme="sunset"] .loading,
[data-theme="forest"] .loading,
[data-theme="midnight"] .loading {
  color: var(--oms-text-secondary) !important;
}

/* ── Reports page — Arctic overrides ── */
/* Arctic already works well since reports uses light theme colors,    */
/* but ensure the content card background stays crisp */

[data-theme="arctic"] .content {
  background: rgba(255, 255, 255, 0.95) !important;
  border: 1px solid #cbd5e1 !important;
  color: #0f172a !important;
}

[data-theme="arctic"] .report-card {
  background: #fff !important;
  border-color: #e2e8f0 !important;
}

[data-theme="arctic"] .report-card:hover {
  border-color: #3b82f6 !important;
  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.15) !important;
}

[data-theme="arctic"] .results th {
  background: #f1f5f9 !important;
  color: #0f172a !important;
  border-bottom: 2px solid #cbd5e1 !important;
}

[data-theme="arctic"] .results td {
  border-bottom-color: #e2e8f0 !important;
  color: #0f172a !important;
}

[data-theme="arctic"] .results tr:hover td {
  background: #f8fafc !important;
}

[data-theme="arctic"] .result-header h2 {
  color: #0f172a !important;
}

[data-theme="arctic"] .back-btn {
  color: #2563eb !important;
}

[data-theme="arctic"] .back-btn:hover {
  background: #eff6ff !important;
}

/* ── Reports page — Inline style overrides for dark themes ── */
/* The h2 "Report Generator" has inline style="color:#1e3c72" */

[data-theme="sunset"] .content h2,
[data-theme="forest"] .content h2,
[data-theme="midnight"] .content h2 {
  color: var(--oms-text-primary) !important;
}

/* The company-badge has inline style from JS — already handled by .company-badge rule */

/* Report card hover inline styles from JS — already handled by .report-card rules */

/* Loading spinner inline color */
[data-theme="sunset"] .loading p,
[data-theme="forest"] .loading p,
[data-theme="midnight"] .loading p {
  color: var(--oms-text-secondary) !important;
}

/* Nav-links active state inline style */
[data-theme="sunset"] .nav-links a.active,
[data-theme="forest"] .nav-links a.active,
[data-theme="midnight"] .nav-links a.active {
  background: linear-gradient(135deg, var(--oms-accent), var(--oms-primary-dark, var(--oms-accent))) !important;
  color: #fff !important;
}

/* Error text in reports */
[data-theme="sunset"] .content p[style*="color:#ef4444"],
[data-theme="forest"] .content p[style*="color:#ef4444"],
[data-theme="midnight"] .content p[style*="color:#ef4444"] {
  color: var(--oms-critical) !important;
}

/* Stat-card inline styles from JS */
[data-theme="sunset"] .stat-card,
[data-theme="forest"] .stat-card,
[data-theme="midnight"] .stat-card {
  color: #fff !important;
}

/* Arctic inline h2 override */
[data-theme="arctic"] .content h2 {
  color: #0f172a !important;
}

/* ── Reports page — Ocean theme overrides ── */
/* Ocean uses white text (--oms-text-primary: #fff) but reports.html has        */
/* white/light content areas and cards, making text invisible (white-on-white).  */

/* Content area: white background needs dark text */
[data-theme="ocean"] .content {
  background: rgba(255, 255, 255, 0.95) !important;
  color: #1e293b !important;
}

/* Report cards: white background, need dark text */
[data-theme="ocean"] .report-card {
  background: #fff !important;
  border-color: #e5e7eb !important;
  color: #1e293b !important;
}

[data-theme="ocean"] .report-card:hover {
  border-color: #667eea !important;
  box-shadow: 0 4px 12px rgba(102, 126, 234, 0.2) !important;
}

[data-theme="ocean"] .report-card h3 {
  color: #1e3c72 !important;
}

[data-theme="ocean"] .report-card p {
  color: #6b7280 !important;
}

/* Result header */
[data-theme="ocean"] .result-header h2 {
  color: #1e3c72 !important;
}

/* Results table */
[data-theme="ocean"] .results td {
  color: #333 !important;
  border-bottom-color: #e5e7eb !important;
}

[data-theme="ocean"] .results tr:hover td {
  background: #f8f9fa !important;
}

/* Back button */
[data-theme="ocean"] .back-btn {
  color: #667eea !important;
}

[data-theme="ocean"] .back-btn:hover {
  background: #f0f2ff !important;
}

/* Loading text */
[data-theme="ocean"] .loading {
  color: #6b7280 !important;
}

/* Content h2 */
[data-theme="ocean"] .content h2 {
  color: #1e3c72 !important;
}

/* ============================================================
   WBS-6B-NEW-ASSET — New Asset Page Theme Overrides
   
   Maps dark-theme hardcoded colors in new-asset.html to
   theme-aware values using --oms-* custom properties.
   
   Covers: topbar, left-panel, right-panel, asset-options,
   form inputs, buttons, strapping, compartments, unit-toggle,
   drop-zone, badges, toasts, breadcrumbs, and more.
   ============================================================ */

/* ── NEW-ASSET.1: Body ─────────────────────────────────────── */
/* Already handled by [data-theme] body rule at top of file */

/* ── NEW-ASSET.2: Topbar / Header ─────────────────────────── */
/* Dark themes (Sunset, Forest, Midnight) */
[data-theme="sunset"] .topbar,
[data-theme="forest"] .topbar,
[data-theme="midnight"] .topbar {
  background: linear-gradient(135deg, var(--oms-panel-bg), var(--oms-panel-border)) !important;
  border-bottom-color: var(--oms-accent) !important;
}

[data-theme="sunset"] .topbar h1,
[data-theme="forest"] .topbar h1,
[data-theme="midnight"] .topbar h1 {
  color: var(--oms-text-primary) !important;
}

[data-theme="sunset"] .topbar h1 span,
[data-theme="forest"] .topbar h1 span,
[data-theme="midnight"] .topbar h1 span {
  color: var(--oms-accent) !important;
}

[data-theme="sunset"] .topbar .breadcrumb,
[data-theme="forest"] .topbar .breadcrumb,
[data-theme="midnight"] .topbar .breadcrumb {
  color: var(--oms-text-secondary) !important;
}

[data-theme="sunset"] .topbar .breadcrumb a,
[data-theme="forest"] .topbar .breadcrumb a,
[data-theme="midnight"] .topbar .breadcrumb a {
  color: var(--oms-accent) !important;
}

/* Ocean topbar */
[data-theme="ocean"] .topbar {
  background: linear-gradient(135deg, #1e3c72 0%, #2d3a6e 100%) !important;
  border-bottom-color: #667eea !important;
}

[data-theme="ocean"] .topbar h1 {
  color: #f8fafc !important;
}

[data-theme="ocean"] .topbar h1 span {
  color: #667eea !important;
}

[data-theme="ocean"] .topbar .breadcrumb {
  color: #64748b !important;
}

[data-theme="ocean"] .topbar .breadcrumb a {
  color: #60a5fa !important;
}

/* Arctic topbar */
[data-theme="arctic"] .topbar {
  background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%) !important;
  border-bottom: 2px solid #3b82f6 !important;
}

[data-theme="arctic"] .topbar h1 {
  color: #0f172a !important;
}

[data-theme="arctic"] .topbar h1 span {
  color: #2563eb !important;
}

[data-theme="arctic"] .topbar .breadcrumb {
  color: #64748b !important;
}

[data-theme="arctic"] .topbar .breadcrumb a {
  color: #2563eb !important;
}

/* ── NEW-ASSET.3: Left Panel ──────────────────────────────── */
/* Dark themes */
[data-theme="sunset"] .left-panel,
[data-theme="forest"] .left-panel,
[data-theme="midnight"] .left-panel {
  background: var(--oms-panel-bg) !important;
  border-right-color: var(--oms-panel-border) !important;
}

[data-theme="sunset"] .left-panel h3,
[data-theme="forest"] .left-panel h3,
[data-theme="midnight"] .left-panel h3 {
  color: var(--oms-text-secondary) !important;
}

/* Ocean left panel */
[data-theme="ocean"] .left-panel {
  background: #0f172a !important;
  border-right-color: #1e3a5f !important;
}

/* Arctic left panel */
[data-theme="arctic"] .left-panel {
  background: #f1f5f9 !important;
  border-right-color: #cbd5e1 !important;
}

[data-theme="arctic"] .left-panel h3 {
  color: #334155 !important;
}

/* ── NEW-ASSET.4: Right Panel ─────────────────────────────── */
/* Dark themes */
[data-theme="sunset"] .right-panel,
[data-theme="forest"] .right-panel,
[data-theme="midnight"] .right-panel {
  background: transparent !important;
}

/* Arctic right panel */
[data-theme="arctic"] .right-panel {
  background: #ffffff !important;
}

[data-theme="arctic"] .form-area h2 {
  color: #0f172a !important;
}

[data-theme="arctic"] .form-area .sub {
  color: #64748b !important;
}

/* Dark themes */
[data-theme="sunset"] .form-area h2,
[data-theme="forest"] .form-area h2,
[data-theme="midnight"] .form-area h2 {
  color: var(--oms-text-primary) !important;
}

[data-theme="sunset"] .form-area .sub,
[data-theme="forest"] .form-area .sub,
[data-theme="midnight"] .form-area .sub {
  color: var(--oms-text-secondary) !important;
}

/* ── NEW-ASSET.5: Asset Options ───────────────────────────── */
/* Dark themes */
[data-theme="sunset"] .asset-option,
[data-theme="forest"] .asset-option,
[data-theme="midnight"] .asset-option {
  border-color: transparent !important;
}

[data-theme="sunset"] .asset-option:hover,
[data-theme="forest"] .asset-option:hover,
[data-theme="midnight"] .asset-option:hover {
  background: color-mix(in srgb, var(--oms-text-primary) 5%, transparent) !important;
}

[data-theme="sunset"] .asset-option.active,
[data-theme="forest"] .asset-option.active,
[data-theme="midnight"] .asset-option.active {
  border-color: var(--oms-accent) !important;
  background: color-mix(in srgb, var(--oms-accent) 8%, transparent) !important;
}

[data-theme="sunset"] .ao-title,
[data-theme="forest"] .ao-title,
[data-theme="midnight"] .ao-title {
  color: var(--oms-text-primary) !important;
}

/* Ocean asset options */
[data-theme="ocean"] .asset-option:hover {
  background: rgba(255,255,255,0.03) !important;
}

[data-theme="ocean"] .ao-title {
  color: #e2e8f0 !important;
}

/* Arctic asset options */
[data-theme="arctic"] .asset-option {
  border-color: transparent !important;
  background: transparent !important;
}

[data-theme="arctic"] .asset-option:hover {
  background: #f1f5f9 !important;
}

[data-theme="arctic"] .asset-option.active {
  border-color: #3b82f6 !important;
  background: #eff6ff !important;
}

[data-theme="arctic"] .ao-title {
  color: #0f172a !important;
}

[data-theme="arctic"] .ao-desc {
  color: #334155 !important;
}

/* Dark themes ao-desc */
[data-theme="sunset"] .ao-desc,
[data-theme="forest"] .ao-desc,
[data-theme="midnight"] .ao-desc {
  color: var(--oms-text-secondary) !important;
}

/* ── NEW-ASSET.6: Badge colors (all themes) ──────────────── */
/* Tank badge */
[data-theme="sunset"] .ao-badge.tank-bg { background: rgba(16,185,129,0.2) !important; color: #6ee7b7 !important; }
[data-theme="forest"] .ao-badge.tank-bg { background: rgba(16,185,129,0.2) !important; color: #6ee7b7 !important; }
[data-theme="midnight"] .ao-badge.tank-bg { background: rgba(16,185,129,0.2) !important; color: #6ee7b7 !important; }
[data-theme="arctic"] .ao-badge.tank-bg { background: #d1fae5 !important; color: #065f46 !important; }
[data-theme="arctic"] .ao-icon.tank-bg { background: #d1fae5 !important; }

/* Truck badge */
[data-theme="sunset"] .ao-badge.truck-bg { background: rgba(59,130,246,0.2) !important; color: #93c5fd !important; }
[data-theme="forest"] .ao-badge.truck-bg { background: rgba(59,130,246,0.2) !important; color: #93c5fd !important; }
[data-theme="midnight"] .ao-badge.truck-bg { background: rgba(59,130,246,0.2) !important; color: #93c5fd !important; }
[data-theme="arctic"] .ao-badge.truck-bg { background: #dbeafe !important; color: #1d4ed8 !important; }
[data-theme="arctic"] .ao-icon.truck-bg { background: #dbeafe !important; }

/* Barge badge */
[data-theme="sunset"] .ao-badge.barge-bg { background: rgba(6,182,212,0.2) !important; color: #67e8f9 !important; }
[data-theme="forest"] .ao-badge.barge-bg { background: rgba(6,182,212,0.2) !important; color: #67e8f9 !important; }
[data-theme="midnight"] .ao-badge.barge-bg { background: rgba(6,182,212,0.2) !important; color: #67e8f9 !important; }
[data-theme="arctic"] .ao-badge.barge-bg { background: #cffafe !important; color: #0e7490 !important; }
[data-theme="arctic"] .ao-icon.barge-bg { background: #cffafe !important; }

/* Railcar badge */
[data-theme="sunset"] .ao-badge.railcar-bg { background: rgba(245,158,11,0.2) !important; color: #fcd34d !important; }
[data-theme="forest"] .ao-badge.railcar-bg { background: rgba(245,158,11,0.2) !important; color: #fcd34d !important; }
[data-theme="midnight"] .ao-badge.railcar-bg { background: rgba(245,158,11,0.2) !important; color: #fcd34d !important; }
[data-theme="arctic"] .ao-badge.railcar-bg { background: #fef3c7 !important; color: #92400e !important; }
[data-theme="arctic"] .ao-icon.railcar-bg { background: #fef3c7 !important; }

/* CSV badge */
[data-theme="sunset"] .ao-badge.csv-bg { background: rgba(139,92,246,0.2) !important; color: #c4b5fd !important; }
[data-theme="forest"] .ao-badge.csv-bg { background: rgba(139,92,246,0.2) !important; color: #c4b5fd !important; }
[data-theme="midnight"] .ao-badge.csv-bg { background: rgba(139,92,246,0.2) !important; color: #c4b5fd !important; }
[data-theme="arctic"] .ao-badge.csv-bg { background: #ede9fe !important; color: #5b21b6 !important; }
[data-theme="arctic"] .ao-icon.csv-bg { background: #ede9fe !important; }

/* ── NEW-ASSET.7: Form inputs ─────────────────────────────── */
/* Dark themes */
[data-theme="sunset"] .form-group input,
[data-theme="sunset"] .form-group select,
[data-theme="sunset"] .form-group textarea,
[data-theme="forest"] .form-group input,
[data-theme="forest"] .form-group select,
[data-theme="forest"] .form-group textarea,
[data-theme="midnight"] .form-group input,
[data-theme="midnight"] .form-group select,
[data-theme="midnight"] .form-group textarea {
  background: var(--oms-panel-bg) !important;
  border-color: var(--oms-panel-border) !important;
  color: var(--oms-text-primary) !important;
}

[data-theme="sunset"] .form-group input:focus,
[data-theme="sunset"] .form-group select:focus,
[data-theme="sunset"] .form-group textarea:focus,
[data-theme="forest"] .form-group input:focus,
[data-theme="forest"] .form-group select:focus,
[data-theme="forest"] .form-group textarea:focus,
[data-theme="midnight"] .form-group input:focus,
[data-theme="midnight"] .form-group select:focus,
[data-theme="midnight"] .form-group textarea:focus {
  border-color: var(--oms-accent) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--oms-accent) 20%, transparent) !important;
}

[data-theme="sunset"] .form-group label,
[data-theme="forest"] .form-group label,
[data-theme="midnight"] .form-group label {
  color: var(--oms-text-secondary) !important;
}

/* Arctic form inputs */
[data-theme="arctic"] .form-group input,
[data-theme="arctic"] .form-group select,
[data-theme="arctic"] .form-group textarea {
  background: #ffffff !important;
  border: 1px solid #cbd5e1 !important;
  color: #0f172a !important;
}

[data-theme="arctic"] .form-group input:focus,
[data-theme="arctic"] .form-group select:focus,
[data-theme="arctic"] .form-group textarea:focus {
  border-color: #3b82f6 !important;
  box-shadow: 0 0 0 3px rgba(59,130,246,0.2) !important;
}

[data-theme="arctic"] .form-group label {
  color: #334155 !important;
}

/* Ocean form inputs */
[data-theme="ocean"] .form-group input:focus,
[data-theme="ocean"] .form-group select:focus,
[data-theme="ocean"] .form-group textarea:focus {
  border-color: #667eea !important;
  box-shadow: 0 0 0 3px rgba(102,126,234,0.2) !important;
}

/* ── NEW-ASSET.8: Buttons ─────────────────────────────────── */
/* btn-cancel — all dark themes */
[data-theme="sunset"] .btn-cancel,
[data-theme="forest"] .btn-cancel,
[data-theme="midnight"] .btn-cancel {
  border-color: var(--oms-panel-border) !important;
  color: var(--oms-text-secondary) !important;
  background: transparent !important;
}

[data-theme="sunset"] .btn-cancel:hover,
[data-theme="forest"] .btn-cancel:hover,
[data-theme="midnight"] .btn-cancel:hover {
  background: var(--oms-panel-bg) !important;
  color: var(--oms-text-primary) !important;
}

/* btn-secondary — all dark themes */
[data-theme="sunset"] .btn-secondary,
[data-theme="forest"] .btn-secondary,
[data-theme="midnight"] .btn-secondary {
  background: var(--oms-panel-bg) !important;
  color: var(--oms-text-secondary) !important;
  border-color: var(--oms-panel-border) !important;
}

[data-theme="sunset"] .btn-secondary:hover,
[data-theme="forest"] .btn-secondary:hover,
[data-theme="midnight"] .btn-secondary:hover {
  background: var(--oms-panel-border) !important;
  color: var(--oms-text-primary) !important;
}

/* btn-primary — use theme accent */
[data-theme="sunset"] .btn-primary,
[data-theme="forest"] .btn-primary,
[data-theme="midnight"] .btn-primary {
  background: linear-gradient(135deg, var(--oms-accent), var(--oms-primary-dark, var(--oms-accent))) !important;
  color: #fff !important;
}

/* btn-success — all themes */
[data-theme="sunset"] .btn-success,
[data-theme="forest"] .btn-success,
[data-theme="midnight"] .btn-success {
  background: #10b981 !important;
  color: #fff !important;
}

/* Arctic buttons */
[data-theme="arctic"] .btn-primary {
  background: linear-gradient(135deg, #3b82f6, #1d4ed8) !important;
  color: #fff !important;
}

[data-theme="arctic"] .btn-secondary {
  background: #e2e8f0 !important;
  color: #334155 !important;
  border: none !important;
}

[data-theme="arctic"] .btn-secondary:hover {
  background: #cbd5e1 !important;
  color: #0f172a !important;
}

[data-theme="arctic"] .btn-success {
  background: #059669 !important;
  color: #fff !important;
}

[data-theme="arctic"] .btn-success:hover {
  background: #047857 !important;
}

[data-theme="arctic"] .btn-cancel {
  background: transparent !important;
  border: 1px solid #cbd5e1 !important;
  color: #475569 !important;
}

[data-theme="arctic"] .btn-cancel:hover {
  background: #f1f5f9 !important;
  color: #0f172a !important;
}

/* ── NEW-ASSET.9: Strapping Section ───────────────────────── */
/* Dark themes */
[data-theme="sunset"] .strap-section,
[data-theme="forest"] .strap-section,
[data-theme="midnight"] .strap-section {
  border-color: var(--oms-panel-border) !important;
}

[data-theme="sunset"] .strap-header,
[data-theme="forest"] .strap-header,
[data-theme="midnight"] .strap-header {
  background: linear-gradient(135deg, color-mix(in srgb, var(--oms-accent) 8%, transparent), var(--oms-panel-bg)) !important;
}

[data-theme="sunset"] .strap-header:hover,
[data-theme="forest"] .strap-header:hover,
[data-theme="midnight"] .strap-header:hover {
  background: linear-gradient(135deg, color-mix(in srgb, var(--oms-accent) 14%, transparent), var(--oms-panel-bg)) !important;
}

[data-theme="sunset"] .strap-header h3,
[data-theme="forest"] .strap-header h3,
[data-theme="midnight"] .strap-header h3 {
  color: var(--oms-accent) !important;
}

[data-theme="sunset"] .strap-body,
[data-theme="forest"] .strap-body,
[data-theme="midnight"] .strap-body {
  background: var(--oms-panel-bg) !important;
}

[data-theme="sunset"] .strap-method,
[data-theme="forest"] .strap-method,
[data-theme="midnight"] .strap-method {
  background: var(--oms-panel-bg) !important;
  border-color: var(--oms-panel-border) !important;
  color: var(--oms-text-secondary) !important;
}

[data-theme="sunset"] .strap-method.active,
[data-theme="forest"] .strap-method.active,
[data-theme="midnight"] .strap-method.active {
  background: color-mix(in srgb, var(--oms-accent) 15%, transparent) !important;
  border-color: var(--oms-accent) !important;
  color: var(--oms-accent) !important;
}

/* Arctic strapping */
[data-theme="arctic"] .strap-section {
  border-color: #cbd5e1 !important;
}

[data-theme="arctic"] .strap-header {
  background: linear-gradient(135deg, rgba(16,185,129,0.06), #f8fafc) !important;
}

[data-theme="arctic"] .strap-header:hover {
  background: linear-gradient(135deg, rgba(16,185,129,0.1), #f1f5f9) !important;
}

[data-theme="arctic"] .strap-header h3 {
  color: #059669 !important;
}

[data-theme="arctic"] .strap-header .strap-toggle {
  color: #94a3b8 !important;
}

[data-theme="arctic"] .strap-body {
  background: #ffffff !important;
}

[data-theme="arctic"] .strap-method {
  background: #f1f5f9 !important;
  border-color: #cbd5e1 !important;
  color: #475569 !important;
}

[data-theme="arctic"] .strap-method.active {
  background: rgba(16,185,129,0.1) !important;
  border-color: #10b981 !important;
  color: #059669 !important;
}

/* ── NEW-ASSET.10: Strap table inputs ─────────────────────── */
/* Dark themes */
[data-theme="sunset"] .strap-table th,
[data-theme="forest"] .strap-table th,
[data-theme="midnight"] .strap-table th {
  color: var(--oms-text-secondary) !important;
  border-bottom-color: var(--oms-panel-border) !important;
}

[data-theme="sunset"] .strap-table input,
[data-theme="forest"] .strap-table input,
[data-theme="midnight"] .strap-table input {
  background: var(--oms-panel-bg) !important;
  border-color: var(--oms-panel-border) !important;
  color: var(--oms-text-primary) !important;
}

[data-theme="sunset"] .strap-table input:focus,
[data-theme="forest"] .strap-table input:focus,
[data-theme="midnight"] .strap-table input:focus {
  border-color: var(--oms-accent) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--oms-accent) 15%, transparent) !important;
}

[data-theme="sunset"] .del-row,
[data-theme="forest"] .del-row,
[data-theme="midnight"] .del-row {
  background: var(--oms-panel-bg) !important;
  border-color: var(--oms-critical) !important;
  color: var(--oms-critical) !important;
}

[data-theme="sunset"] .add-row-btn,
[data-theme="forest"] .add-row-btn,
[data-theme="midnight"] .add-row-btn {
  background: var(--oms-panel-bg) !important;
  border-color: var(--oms-panel-border) !important;
  color: var(--oms-text-secondary) !important;
}

[data-theme="sunset"] .add-row-btn:hover,
[data-theme="forest"] .add-row-btn:hover,
[data-theme="midnight"] .add-row-btn:hover {
  background: var(--oms-panel-border) !important;
  color: var(--oms-text-primary) !important;
}

/* Arctic strap table */
[data-theme="arctic"] .strap-table th {
  color: #64748b !important;
  border-bottom-color: #e2e8f0 !important;
}

[data-theme="arctic"] .strap-table input {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

[data-theme="arctic"] .strap-table input:focus {
  border-color: #10b981 !important;
  box-shadow: 0 0 0 2px rgba(16,185,129,0.15) !important;
}

[data-theme="arctic"] .del-row {
  background: #fef2f2 !important;
  border-color: #fca5a5 !important;
  color: #dc2626 !important;
}

[data-theme="arctic"] .del-row:hover {
  background: #fee2e2 !important;
  color: #991b1b !important;
}

[data-theme="arctic"] .add-row-btn {
  background: #f1f5f9 !important;
  border-color: #cbd5e1 !important;
  color: #475569 !important;
}

[data-theme="arctic"] .add-row-btn:hover {
  background: #e2e8f0 !important;
  color: #0f172a !important;
}

/* ── NEW-ASSET.11: Compartment Section ────────────────────── */
/* Dark themes */
[data-theme="sunset"] .compartment-section,
[data-theme="forest"] .compartment-section,
[data-theme="midnight"] .compartment-section {
  border-color: var(--oms-panel-border) !important;
}

[data-theme="sunset"] .compartment-header,
[data-theme="forest"] .compartment-header,
[data-theme="midnight"] .compartment-header {
  background: linear-gradient(135deg, color-mix(in srgb, var(--oms-accent) 10%, transparent), var(--oms-panel-bg)) !important;
}

[data-theme="sunset"] .compartment-header:hover,
[data-theme="forest"] .compartment-header:hover,
[data-theme="midnight"] .compartment-header:hover {
  background: linear-gradient(135deg, color-mix(in srgb, var(--oms-accent) 18%, transparent), var(--oms-panel-bg)) !important;
}

[data-theme="sunset"] .compartment-header h3,
[data-theme="forest"] .compartment-header h3,
[data-theme="midnight"] .compartment-header h3 {
  color: var(--oms-accent) !important;
}

[data-theme="sunset"] .compartment-body,
[data-theme="forest"] .compartment-body,
[data-theme="midnight"] .compartment-body {
  background: var(--oms-panel-bg) !important;
}

/* Arctic compartment */
[data-theme="arctic"] .compartment-section {
  border-color: #cbd5e1 !important;
}

[data-theme="arctic"] .compartment-header {
  background: linear-gradient(135deg, rgba(6,182,212,0.06), #f8fafc) !important;
}

[data-theme="arctic"] .compartment-header:hover {
  background: linear-gradient(135deg, rgba(6,182,212,0.12), #f1f5f9) !important;
}

[data-theme="arctic"] .compartment-header h3 {
  color: #0891b2 !important;
}

[data-theme="arctic"] .compartment-header .comp-toggle {
  color: #94a3b8 !important;
}

[data-theme="arctic"] .compartment-body {
  background: #ffffff !important;
}

/* ── NEW-ASSET.12: Compartment Card ───────────────────────── */
/* Dark themes */
[data-theme="sunset"] .comp-card,
[data-theme="forest"] .comp-card,
[data-theme="midnight"] .comp-card {
  background: var(--oms-panel-bg) !important;
  border-color: var(--oms-panel-border) !important;
}

[data-theme="sunset"] .comp-card-header,
[data-theme="forest"] .comp-card-header,
[data-theme="midnight"] .comp-card-header {
  background: var(--oms-panel-border) !important;
}

[data-theme="sunset"] .comp-card-header:hover,
[data-theme="forest"] .comp-card-header:hover,
[data-theme="midnight"] .comp-card-header:hover {
  background: var(--oms-panel-bg) !important;
}

[data-theme="sunset"] .comp-card-title,
[data-theme="forest"] .comp-card-title,
[data-theme="midnight"] .comp-card-title {
  color: var(--oms-text-primary) !important;
}

[data-theme="sunset"] .comp-card-toggle,
[data-theme="forest"] .comp-card-toggle,
[data-theme="midnight"] .comp-card-toggle {
  color: var(--oms-text-secondary) !important;
}

[data-theme="sunset"] .comp-card-del,
[data-theme="forest"] .comp-card-del,
[data-theme="midnight"] .comp-card-del {
  color: var(--oms-text-secondary) !important;
}

/* Arctic comp card */
[data-theme="arctic"] .comp-card {
  background: #ffffff !important;
  border-color: #e2e8f0 !important;
}

[data-theme="arctic"] .comp-card-header {
  background: #f8fafc !important;
}

[data-theme="arctic"] .comp-card-header:hover {
  background: #f1f5f9 !important;
}

[data-theme="arctic"] .comp-card-title {
  color: #0f172a !important;
}

[data-theme="arctic"] .comp-card-toggle {
  color: #94a3b8 !important;
}

[data-theme="arctic"] .comp-card-del {
  color: #94a3b8 !important;
}

[data-theme="arctic"] .comp-card-del:hover {
  color: #dc2626 !important;
  background: #fef2f2 !important;
}

[data-theme="arctic"] .comp-card-num {
  background: rgba(6,182,212,0.1) !important;
  color: #0891b2 !important;
}

/* ── NEW-ASSET.13: Comp-Strap (compartment strap tables) ──── */
/* Dark themes */
[data-theme="sunset"] .comp-strap,
[data-theme="forest"] .comp-strap,
[data-theme="midnight"] .comp-strap {
  border-color: var(--oms-panel-border) !important;
}

[data-theme="sunset"] .comp-strap-header,
[data-theme="forest"] .comp-strap-header,
[data-theme="midnight"] .comp-strap-header {
  background: var(--oms-panel-bg) !important;
  color: var(--oms-text-secondary) !important;
}

[data-theme="sunset"] .comp-strap-header:hover,
[data-theme="forest"] .comp-strap-header:hover,
[data-theme="midnight"] .comp-strap-header:hover {
  background: var(--oms-panel-border) !important;
}

[data-theme="sunset"] .comp-strap-header span,
[data-theme="forest"] .comp-strap-header span,
[data-theme="midnight"] .comp-strap-header span {
  color: var(--oms-accent) !important;
}

[data-theme="sunset"] .comp-strap-body,
[data-theme="forest"] .comp-strap-body,
[data-theme="midnight"] .comp-strap-body {
  background: var(--oms-panel-bg) !important;
}

[data-theme="sunset"] .comp-strap-method,
[data-theme="forest"] .comp-strap-method,
[data-theme="midnight"] .comp-strap-method {
  background: var(--oms-panel-bg) !important;
  border-color: var(--oms-panel-border) !important;
  color: var(--oms-text-secondary) !important;
}

[data-theme="sunset"] .comp-strap-method.active,
[data-theme="forest"] .comp-strap-method.active,
[data-theme="midnight"] .comp-strap-method.active {
  background: color-mix(in srgb, var(--oms-accent) 15%, transparent) !important;
  border-color: var(--oms-accent) !important;
  color: var(--oms-accent) !important;
}

[data-theme="sunset"] .comp-strap-table th,
[data-theme="forest"] .comp-strap-table th,
[data-theme="midnight"] .comp-strap-table th {
  color: var(--oms-text-secondary) !important;
  border-bottom-color: var(--oms-panel-border) !important;
}

[data-theme="sunset"] .comp-strap-table input,
[data-theme="forest"] .comp-strap-table input,
[data-theme="midnight"] .comp-strap-table input {
  background: var(--oms-panel-bg) !important;
  border-color: var(--oms-panel-border) !important;
  color: var(--oms-text-primary) !important;
}

[data-theme="sunset"] .comp-strap-skip,
[data-theme="forest"] .comp-strap-skip,
[data-theme="midnight"] .comp-strap-skip {
  color: var(--oms-text-secondary) !important;
}

/* Arctic comp-strap */
[data-theme="arctic"] .comp-strap {
  border-color: #e2e8f0 !important;
}

[data-theme="arctic"] .comp-strap-header {
  background: #f8fafc !important;
  color: #475569 !important;
}

[data-theme="arctic"] .comp-strap-header:hover {
  background: #f1f5f9 !important;
}

[data-theme="arctic"] .comp-strap-header span {
  color: #059669 !important;
}

[data-theme="arctic"] .comp-strap-header .strap-toggle-sm {
  color: #94a3b8 !important;
}

[data-theme="arctic"] .comp-strap-body {
  background: #f8fafc !important;
}

[data-theme="arctic"] .comp-strap-method {
  background: #f1f5f9 !important;
  border-color: #cbd5e1 !important;
  color: #475569 !important;
}

[data-theme="arctic"] .comp-strap-method.active {
  background: rgba(16,185,129,0.1) !important;
  border-color: #10b981 !important;
  color: #059669 !important;
}

[data-theme="arctic"] .comp-strap-table th {
  color: #64748b !important;
  border-bottom-color: #e2e8f0 !important;
}

[data-theme="arctic"] .comp-strap-table input {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

[data-theme="arctic"] .comp-strap-table input:focus {
  border-color: #10b981 !important;
}

[data-theme="arctic"] .comp-strap-skip {
  color: #64748b !important;
}

/* ── NEW-ASSET.14: Unit Toggle ────────────────────────────── */
/* Dark themes */
[data-theme="sunset"] .unit-row,
[data-theme="forest"] .unit-row,
[data-theme="midnight"] .unit-row {
  background: var(--oms-panel-bg) !important;
  border-color: var(--oms-panel-border) !important;
}

[data-theme="sunset"] .unit-row label.unit-label,
[data-theme="forest"] .unit-row label.unit-label,
[data-theme="midnight"] .unit-row label.unit-label {
  color: var(--oms-text-secondary) !important;
}

[data-theme="sunset"] .unit-toggle,
[data-theme="forest"] .unit-toggle,
[data-theme="midnight"] .unit-toggle {
  border-color: var(--oms-panel-border) !important;
}

[data-theme="sunset"] .unit-toggle button,
[data-theme="forest"] .unit-toggle button,
[data-theme="midnight"] .unit-toggle button {
  background: var(--oms-panel-bg) !important;
  color: var(--oms-text-secondary) !important;
}

[data-theme="sunset"] .unit-toggle button:hover:not(.active),
[data-theme="forest"] .unit-toggle button:hover:not(.active),
[data-theme="midnight"] .unit-toggle button:hover:not(.active) {
  background: var(--oms-panel-border) !important;
  color: var(--oms-text-primary) !important;
}

[data-theme="sunset"] .unit-toggle button.active,
[data-theme="forest"] .unit-toggle button.active,
[data-theme="midnight"] .unit-toggle button.active {
  background: linear-gradient(135deg, var(--oms-accent), var(--oms-primary-dark, var(--oms-accent))) !important;
  color: #fff !important;
}

/* Arctic unit toggle */
[data-theme="arctic"] .unit-row {
  background: #f1f5f9 !important;
  border-color: #cbd5e1 !important;
}

[data-theme="arctic"] .unit-row label.unit-label {
  color: #334155 !important;
}

[data-theme="arctic"] .unit-toggle {
  border-color: #cbd5e1 !important;
}

[data-theme="arctic"] .unit-toggle button {
  background: #ffffff !important;
  color: #475569 !important;
}

[data-theme="arctic"] .unit-toggle button:hover:not(.active) {
  background: #f1f5f9 !important;
  color: #0f172a !important;
}

[data-theme="arctic"] .unit-toggle button.active {
  background: linear-gradient(135deg, #3b82f6, #1d4ed8) !important;
  color: #fff !important;
}

/* ── NEW-ASSET.15: Drop Zone ──────────────────────────────── */
/* Dark themes */
[data-theme="sunset"] .drop-zone,
[data-theme="forest"] .drop-zone,
[data-theme="midnight"] .drop-zone {
  border-color: var(--oms-panel-border) !important;
}

[data-theme="sunset"] .drop-zone:hover,
[data-theme="forest"] .drop-zone:hover,
[data-theme="midnight"] .drop-zone:hover {
  border-color: var(--oms-accent) !important;
  background: color-mix(in srgb, var(--oms-accent) 6%, transparent) !important;
}

[data-theme="sunset"] .drop-zone .label,
[data-theme="forest"] .drop-zone .label,
[data-theme="midnight"] .drop-zone .label {
  color: var(--oms-text-secondary) !important;
}

[data-theme="sunset"] .drop-zone .hint,
[data-theme="forest"] .drop-zone .hint,
[data-theme="midnight"] .drop-zone .hint {
  color: var(--oms-text-secondary) !important;
}

/* Arctic drop zone */
[data-theme="arctic"] .drop-zone {
  border-color: #cbd5e1 !important;
  background: #f8fafc !important;
}

[data-theme="arctic"] .drop-zone:hover {
  border-color: #8b5cf6 !important;
  background: rgba(139,92,246,0.04) !important;
}

[data-theme="arctic"] .drop-zone .label {
  color: #475569 !important;
}

[data-theme="arctic"] .drop-zone .hint {
  color: #94a3b8 !important;
}

/* ── NEW-ASSET.16: Divider ────────────────────────────────── */
[data-theme="sunset"] .divider,
[data-theme="forest"] .divider,
[data-theme="midnight"] .divider {
  border-top-color: var(--oms-panel-border) !important;
}

[data-theme="arctic"] .divider {
  border-top-color: #e2e8f0 !important;
}

/* ── NEW-ASSET.17: Field Note ──────────────────────────────── */
[data-theme="sunset"] .field-note,
[data-theme="forest"] .field-note,
[data-theme="midnight"] .field-note {
  color: var(--oms-text-secondary) !important;
}

[data-theme="arctic"] .field-note {
  color: #94a3b8 !important;
}

/* ── NEW-ASSET.18: New Farm Form ──────────────────────────── */
/* Dark themes */
[data-theme="sunset"] #newFarmForm,
[data-theme="forest"] #newFarmForm,
[data-theme="midnight"] #newFarmForm {
  background: var(--oms-panel-bg) !important;
  border-color: var(--oms-panel-border) !important;
}

[data-theme="sunset"] #newFarmForm div,
[data-theme="forest"] #newFarmForm div,
[data-theme="midnight"] #newFarmForm div {
  color: var(--oms-accent) !important;
}

[data-theme="sunset"] #newFarmForm input,
[data-theme="forest"] #newFarmForm input,
[data-theme="midnight"] #newFarmForm input {
  background: var(--oms-panel-bg) !important;
  border-color: var(--oms-panel-border) !important;
  color: var(--oms-text-primary) !important;
}

/* Arctic new farm form */
[data-theme="arctic"] #newFarmForm {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
}

[data-theme="arctic"] #newFarmForm div {
  color: #2563eb !important;
}

[data-theme="arctic"] #newFarmForm input {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

/* ── NEW-ASSET.19: Compartment inputs (comp-row) ──────────── */
/* Dark themes */
[data-theme="sunset"] .comp-row input,
[data-theme="sunset"] .comp-row select,
[data-theme="forest"] .comp-row input,
[data-theme="forest"] .comp-row select,
[data-theme="midnight"] .comp-row input,
[data-theme="midnight"] .comp-row select {
  background: var(--oms-panel-bg) !important;
  border-color: var(--oms-panel-border) !important;
  color: var(--oms-text-primary) !important;
}

[data-theme="sunset"] .comp-row label,
[data-theme="forest"] .comp-row label,
[data-theme="midnight"] .comp-row label {
  color: var(--oms-text-secondary) !important;
}

[data-theme="sunset"] .comp-num,
[data-theme="forest"] .comp-num,
[data-theme="midnight"] .comp-num {
  color: var(--oms-accent) !important;
}

/* Arctic comp-row */
[data-theme="arctic"] .comp-row input,
[data-theme="arctic"] .comp-row select {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

[data-theme="arctic"] .comp-row input:focus,
[data-theme="arctic"] .comp-row select:focus {
  border-color: #06b6d4 !important;
}

[data-theme="arctic"] .comp-row label {
  color: #64748b !important;
}

[data-theme="arctic"] .comp-num {
  color: #0891b2 !important;
}

/* ── NEW-ASSET.20: Toast ──────────────────────────────────── */
/* Toasts are already dark-themed, but make sure they work on all themes */
[data-theme="arctic"] .toast {
  box-shadow: 0 8px 24px rgba(0,0,0,0.15) !important;
}

/* ── NEW-ASSET.21: Theme picker in topbar ─────────────────── */
/* Ensure theme picker looks good in the topbar */
[data-theme="sunset"] .topbar .theme-picker-wrapper,
[data-theme="forest"] .topbar .theme-picker-wrapper,
[data-theme="midnight"] .topbar .theme-picker-wrapper {
  flex-shrink: 0;
}

[data-theme="arctic"] .topbar .theme-gear-btn {
  background: linear-gradient(135deg, #3b82f6, #1d4ed8) !important;
  color: #fff !important;
  border-color: #2563eb !important;
}

[data-theme="arctic"] .topbar .theme-gear-icon,
[data-theme="arctic"] .topbar .theme-gear-label {
  color: #fff !important;
}


/* ── NEW-ASSET.22: Arctic text visibility improvements ──── */
/* Darken light-gray text (#94a3b8 → #64748b or darker) on white backgrounds */

[data-theme="arctic"] .ao-desc {
  color: #334155 !important;
}

[data-theme="arctic"] .strap-header .strap-toggle {
  color: #475569 !important;
}

[data-theme="arctic"] .comp-card-toggle {
  color: #475569 !important;
}

[data-theme="arctic"] .comp-card-del {
  color: #475569 !important;
}

[data-theme="arctic"] .comp-strap-header .strap-toggle-sm {
  color: #475569 !important;
}

[data-theme="arctic"] .drop-zone .hint {
  color: #475569 !important;
}

[data-theme="arctic"] .field-note {
  color: #475569 !important;
}

[data-theme="arctic"] .left-panel h3 {
  color: #334155 !important;
}

[data-theme="arctic"] .form-area .sub {
  color: #334155 !important;
}

[data-theme="arctic"] .topbar .breadcrumb {
  color: #334155 !important;
}

[data-theme="arctic"] .strap-table th {
  color: #334155 !important;
}

[data-theme="arctic"] .comp-strap-table th {
  color: #334155 !important;
}

[data-theme="arctic"] .comp-row label {
  color: #334155 !important;
}

[data-theme="arctic"] .comp-strap-skip {
  color: #334155 !important;
}

[data-theme="arctic"] .unit-row label.unit-label {
  color: #334155 !important;  /* was #334155 already ok, ensure */
}

[data-theme="arctic"] .drop-zone .label {
  color: #334155 !important;  /* was #475569, darken more */
}

/* ── NEW-ASSET.23: Ocean theme overrides (dark blue) ────── */
/* Ocean uses dark blue bg (#1e3c72 → #1e293b), similar to default dark theme
   but needs specific overrides for elements using hardcoded dark-theme colors
   that don't match well on the navy background */

[data-theme="ocean"] .right-panel {
  background: transparent !important;
}

[data-theme="ocean"] .form-area h2 {
  color: #f1f5f9 !important;
}

[data-theme="ocean"] .form-area .sub {
  color: #cbd5e1 !important;
}

[data-theme="ocean"] .ao-title {
  color: #e2e8f0 !important;
}

[data-theme="ocean"] .ao-desc {
  color: #cbd5e1 !important;
}

[data-theme="ocean"] .form-group label {
  color: #cbd5e1 !important;
}

[data-theme="ocean"] .form-group input,
[data-theme="ocean"] .form-group select,
[data-theme="ocean"] .form-group textarea {
  background: rgba(15,23,42,0.6) !important;
  border-color: #334155 !important;
  color: #e2e8f0 !important;
}

[data-theme="ocean"] .btn-cancel {
  border-color: #475569 !important;
  color: #cbd5e1 !important;
  background: transparent !important;
}

[data-theme="ocean"] .btn-cancel:hover {
  background: #1e293b !important;
  color: #e2e8f0 !important;
}

[data-theme="ocean"] .btn-secondary {
  background: #1e293b !important;
  color: #cbd5e1 !important;
  border-color: #334155 !important;
}

[data-theme="ocean"] .btn-secondary:hover {
  background: #334155 !important;
  color: #e2e8f0 !important;
}

[data-theme="ocean"] .btn-success {
  background: #10b981 !important;
  color: #fff !important;
}

[data-theme="ocean"] .btn-primary {
  background: linear-gradient(135deg, #667eea, #764ba2) !important;
  color: #fff !important;
}

[data-theme="ocean"] .strap-section {
  border-color: #334155 !important;
}

[data-theme="ocean"] .strap-header {
  background: linear-gradient(135deg, rgba(102,126,234,0.1), #0f172a) !important;
}

[data-theme="ocean"] .strap-header:hover {
  background: linear-gradient(135deg, rgba(102,126,234,0.15), #0f172a) !important;
}

[data-theme="ocean"] .strap-header h3 {
  color: #6ee7b7 !important;
}

[data-theme="ocean"] .strap-header .strap-toggle {
  color: #94a3b8 !important;
}

[data-theme="ocean"] .strap-body {
  background: rgba(15,23,42,0.6) !important;
}

[data-theme="ocean"] .strap-method {
  background: #0f172a !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

[data-theme="ocean"] .strap-method.active {
  background: rgba(16,185,129,0.15) !important;
  border-color: #10b981 !important;
  color: #6ee7b7 !important;
}

[data-theme="ocean"] .strap-table th {
  color: #cbd5e1 !important;
  border-bottom-color: #334155 !important;
}

[data-theme="ocean"] .strap-table input {
  background: #0f172a !important;
  border-color: #475569 !important;
  color: #e2e8f0 !important;
}

[data-theme="ocean"] .strap-table input:focus {
  border-color: #667eea !important;
  box-shadow: 0 0 0 2px rgba(102,126,234,0.2) !important;
}

[data-theme="ocean"] .del-row {
  background: #1c1012 !important;
  border-color: #7f1d1d !important;
  color: #f87171 !important;
}

[data-theme="ocean"] .add-row-btn {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

[data-theme="ocean"] .add-row-btn:hover {
  background: #334155 !important;
  color: #e2e8f0 !important;
}

[data-theme="ocean"] .compartment-section {
  border-color: #334155 !important;
}

[data-theme="ocean"] .compartment-header {
  background: linear-gradient(135deg, rgba(102,126,234,0.1), #0f172a) !important;
}

[data-theme="ocean"] .compartment-header:hover {
  background: linear-gradient(135deg, rgba(102,126,234,0.15), #0f172a) !important;
}

[data-theme="ocean"] .compartment-header h3 {
  color: #67e8f9 !important;
}

[data-theme="ocean"] .compartment-header .comp-toggle {
  color: #94a3b8 !important;
}

[data-theme="ocean"] .compartment-body {
  background: rgba(15,23,42,0.6) !important;
}

[data-theme="ocean"] .comp-card {
  background: #1e293b !important;
  border-color: #334155 !important;
}

[data-theme="ocean"] .comp-card-header {
  background: #334155 !important;
}

[data-theme="ocean"] .comp-card-header:hover {
  background: #475569 !important;
}

[data-theme="ocean"] .comp-card-title {
  color: #e2e8f0 !important;
}

[data-theme="ocean"] .comp-card-toggle {
  color: #cbd5e1 !important;
}

[data-theme="ocean"] .comp-card-del {
  color: #cbd5e1 !important;
}

[data-theme="ocean"] .comp-card-num {
  background: rgba(6,182,212,0.15) !important;
  color: #67e8f9 !important;
}

[data-theme="ocean"] .comp-strap {
  border-color: #334155 !important;
}

[data-theme="ocean"] .comp-strap-header {
  background: #0f172a !important;
  color: #cbd5e1 !important;
}

[data-theme="ocean"] .comp-strap-header:hover {
  background: #1e293b !important;
}

[data-theme="ocean"] .comp-strap-header span {
  color: #6ee7b7 !important;
}

[data-theme="ocean"] .comp-strap-header .strap-toggle-sm {
  color: #94a3b8 !important;
}

[data-theme="ocean"] .comp-strap-body {
  background: #0f172a !important;
}

[data-theme="ocean"] .comp-strap-method {
  background: #0f172a !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

[data-theme="ocean"] .comp-strap-method.active {
  background: rgba(16,185,129,0.15) !important;
  border-color: #10b981 !important;
  color: #6ee7b7 !important;
}

[data-theme="ocean"] .comp-strap-table th {
  color: #cbd5e1 !important;
  border-bottom-color: #334155 !important;
}

[data-theme="ocean"] .comp-strap-table input {
  background: #0f172a !important;
  border-color: #475569 !important;
  color: #e2e8f0 !important;
}

[data-theme="ocean"] .comp-strap-table input:focus {
  border-color: #667eea !important;
}

[data-theme="ocean"] .comp-strap-skip {
  color: #94a3b8 !important;
}

[data-theme="ocean"] .unit-row {
  background: #1e293b !important;
  border-color: #334155 !important;
}

[data-theme="ocean"] .unit-row label.unit-label {
  color: #cbd5e1 !important;
}

[data-theme="ocean"] .unit-toggle {
  border-color: #334155 !important;
}

[data-theme="ocean"] .unit-toggle button {
  background: #0f172a !important;
  color: #cbd5e1 !important;
}

[data-theme="ocean"] .unit-toggle button:hover:not(.active) {
  background: #1e293b !important;
  color: #e2e8f0 !important;
}

[data-theme="ocean"] .unit-toggle button.active {
  background: linear-gradient(135deg, #667eea, #764ba2) !important;
  color: #fff !important;
}

[data-theme="ocean"] .drop-zone {
  border-color: #334155 !important;
}

[data-theme="ocean"] .drop-zone:hover {
  border-color: #667eea !important;
  background: rgba(102,126,234,0.06) !important;
}

[data-theme="ocean"] .drop-zone .label {
  color: #cbd5e1 !important;
}

[data-theme="ocean"] .drop-zone .hint {
  color: #94a3b8 !important;
}

[data-theme="ocean"] .divider {
  border-top-color: #334155 !important;
}

[data-theme="ocean"] .field-note {
  color: #94a3b8 !important;
}

[data-theme="ocean"] #newFarmForm {
  background: #1e293b !important;
  border-color: #334155 !important;
}

[data-theme="ocean"] #newFarmForm div {
  color: #667eea !important;
}

[data-theme="ocean"] #newFarmForm input {
  background: #0f172a !important;
  border-color: #475569 !important;
  color: #e2e8f0 !important;
}

[data-theme="ocean"] .comp-row input,
[data-theme="ocean"] .comp-row select {
  background: #0f172a !important;
  border-color: #475569 !important;
  color: #e2e8f0 !important;
}

[data-theme="ocean"] .comp-row input:focus,
[data-theme="ocean"] .comp-row select:focus {
  border-color: #667eea !important;
}

[data-theme="ocean"] .comp-row label {
  color: #cbd5e1 !important;
}

[data-theme="ocean"] .comp-num {
  color: #67e8f9 !important;
}

[data-theme="ocean"] .left-panel h3 {
  color: #cbd5e1 !important;
}

[data-theme="ocean"] .topbar .breadcrumb {
  color: #cbd5e1 !important;
}

[data-theme="ocean"] .topbar .breadcrumb a {
  color: #60a5fa !important;
}

/* Ocean badge overrides */
[data-theme="ocean"] .ao-badge.tank-bg { background: #065f46 !important; color: #6ee7b7 !important; }
[data-theme="ocean"] .ao-icon.tank-bg { background: #065f46 !important; }
[data-theme="ocean"] .ao-badge.truck-bg { background: #1e3a5f !important; color: #93c5fd !important; }
[data-theme="ocean"] .ao-icon.truck-bg { background: #1e3a5f !important; }
[data-theme="ocean"] .ao-badge.barge-bg { background: #164e63 !important; color: #67e8f9 !important; }
[data-theme="ocean"] .ao-icon.barge-bg { background: #164e63 !important; }
[data-theme="ocean"] .ao-badge.railcar-bg { background: #78350f !important; color: #fcd34d !important; }
[data-theme="ocean"] .ao-icon.railcar-bg { background: #78350f !important; }
[data-theme="ocean"] .ao-badge.csv-bg { background: #4c1d95 !important; color: #c4b5fd !important; }
[data-theme="ocean"] .ao-icon.csv-bg { background: #4c1d95 !important; }

[data-theme="ocean"] .asset-option {
  border-color: transparent !important;
  background: transparent !important;
}

[data-theme="ocean"] .asset-option.active {
  border-color: #667eea !important;
  background: rgba(102,126,234,0.08) !important;
}


/* ── Calculator (Vue app) ────────────────────────────────── */
[data-theme=ocean] .calculator, [data-theme=ocean] .history { background: #1e3c72 !important; border-color: rgba(255,255,255,0.12) !important; color: #ffffff !important; }
[data-theme=sunset] .calculator, [data-theme=sunset] .history { background: #1a1412 !important; border-color: rgba(255,255,255,0.12) !important; color: #fef3c7 !important; }
[data-theme=forest] .calculator, [data-theme=forest] .history { background: #0d1f17 !important; border-color: rgba(255,255,255,0.12) !important; color: #d1fae5 !important; }
[data-theme=midnight] .calculator, [data-theme=midnight] .history { background: #000000 !important; border-color: rgba(255,255,255,0.12) !important; color: #e2e8f0 !important; }
[data-theme=arctic] .calculator,
[data-theme=arctic] .history {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}
/* Calculator headings */
[data-theme=ocean] .calculator h2,
[data-theme=sunset] .calculator h2,
[data-theme=forest] .calculator h2,
[data-theme=midnight] .calculator h2,
[data-theme=ocean] .history h2,
[data-theme=sunset] .history h2,
[data-theme=forest] .history h2,
[data-theme=midnight] .history h2 {
  color: var(--oms-text-primary) !important;
}
[data-theme=arctic] .calculator h2,
[data-theme=arctic] .history h2 {
  color: #0f172a !important;
}
/* Calculator form labels */
[data-theme=ocean] .form-group label,
[data-theme=sunset] .form-group label,
[data-theme=forest] .form-group label,
[data-theme=midnight] .form-group label {
  color: #94a3b8 !important;
}
[data-theme=arctic] .form-group label {
  color: #475569 !important;
}
/* Calculator inputs */
[data-theme=ocean] .form-group input,
[data-theme=ocean] .form-group select,
[data-theme=sunset] .form-group input,
[data-theme=sunset] .form-group select,
[data-theme=forest] .form-group input,
[data-theme=forest] .form-group select,
[data-theme=midnight] .form-group input,
[data-theme=midnight] .form-group select {
  background: rgba(15,23,42,0.8) !important;
  border-color: rgba(255,255,255,0.15) !important;
  color: #e2e8f0 !important;
}
[data-theme=arctic] .form-group input,
[data-theme=arctic] .form-group select {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}
/* Calculator history items */
[data-theme=ocean] .history-item,
[data-theme=sunset] .history-item,
[data-theme=forest] .history-item,
[data-theme=midnight] .history-item {
  background: rgba(15,23,42,0.5) !important;
  border-color: rgba(255,255,255,0.06) !important;
  color: #e2e8f0 !important;
}
[data-theme=arctic] .history-item {
  background: #f8fafc !important;
  border-color: #e2e8f0 !important;
  color: #0f172a !important;
}
/* Calculator buttons */
[data-theme] .calculator-section button {
  background: var(--oms-gauge-fill-start) !important;
  color: white !important;
}
/* Error/success boxes */
[data-theme=ocean] .error,
[data-theme=sunset] .error,
[data-theme=forest] .error,
[data-theme=midnight] .error {
  background: rgba(239,68,68,0.15) !important;
  color: #fca5a5 !important;
}
[data-theme] .result {
  background: rgba(34,197,94,0.12) !important;
}
[data-theme] .result h3 {
  color: var(--oms-gauge-fill-start) !important;
}


/* ── Per-theme body backgrounds ──────────────────────────── */
[data-theme=ocean] body { background: linear-gradient(135deg, #1e3c72 0%, #2a5298 100%) !important; color: #f8fafc !important; }
[data-theme=sunset] body { background: linear-gradient(135deg, #1a1412 0%, #3d2c1e 100%) !important; color: #fef3c7 !important; }
[data-theme=forest] body { background: linear-gradient(135deg, #0d1f17 0%, #1e5f3d 100%) !important; color: #d1fae5 !important; }
[data-theme=arctic] body { background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%) !important; color: #0f172a !important; }
[data-theme=midnight] body { background: linear-gradient(135deg, #0f172a 0%, #020617 100%) !important; color: #e2e8f0 !important; }