/* ══════════════════════════════════════════
   Linde DG — Light Theme Override
   Loaded AFTER inline <style> and Tailwind CDN
   ══════════════════════════════════════════ */

:root {
  --bg-base: #ffffff !important;
  --bg-mid: #f5f5f7 !important;
  --bg-card: #ffffff !important;
  --bg-card-hover: #f5f5f7 !important;
  --bg-input: #f0f0f2 !important;
  --text-primary: #1d1d1f !important;
  --text-secondary: #6e6e73 !important;
  --text-muted: #86868b !important;
  --border: rgba(0,0,0,0.08) !important;
  --border-strong: rgba(0,0,0,0.14) !important;
  --shadow-card: 0 0 0 1px rgba(0,0,0,0.04), 0 2px 8px rgba(0,0,0,0.06) !important;
  --line-default: rgba(0,0,0,0.10) !important;
  --line-active: rgba(227,34,25,0.45) !important;
}

body {
  background: #fff !important;
  color: #1d1d1f !important;
}

/* ── Layout shells ── */
.bg-mesh { background: linear-gradient(180deg, #ffffff, #f5f5f7) !important; }

.glass {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.08) !important;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.04), 0 2px 8px rgba(0,0,0,0.06) !important;
}

.glass-strong {
  background: #f8f8fa !important;
  border-right: 1px solid rgba(0,0,0,0.06) !important;
  box-shadow: 2px 0 12px rgba(0,0,0,0.04) !important;
}

/* ── Text color overrides (Tailwind utilities) ── */
.text-white { color: #1d1d1f !important; }
.text-\[\#fafafa\] { color: #1d1d1f !important; }
.text-\[\#8e8e93\] { color: #86868b !important; }
.text-\[\#636366\] { color: #aeaeb2 !important; }
.text-\[\#98989d\] { color: #6e6e73 !important; }

/* Keep white text on primary / colored backgrounds */
.btn-primary,
.btn-primary span,
.btn-primary code { color: #fff !important; }
.btn-primary .icon-wrap svg,
.btn-primary i { stroke: #fff !important; color: #fff !important; }
[style*="stroke:#fff"],
[style*="stroke: #fff"] { stroke: #fff !important; }

/* Status badges keep their own colors */
.status-badge { color: inherit; }
.status-certified, .status-live, .status-active, .status-approved { color: #1d1d1f !important; background: rgba(0,0,0,0.04) !important; }
.status-pending, .status-pilot, .status-review { color: #6e6e73 !important; }
.status-draft, .status-planned { color: #aeaeb2 !important; }

/* ── Background color overrides ── */
.bg-black { background-color: #f0f0f2 !important; }
.bg-\[\#0e0e10\] { background-color: #f0f0f2 !important; }
.bg-\[\#0a0a0c\] { background-color: #f5f5f7 !important; }
.bg-\[\#000\], .bg-\[\#050506\] { background-color: #fff !important; }

/* Card-like dark fills → light */
.bg-\[\#121214\] { background-color: #fff !important; }
.bg-\[\#1a1a1e\] { background-color: #f5f5f7 !important; }
.bg-\[\#18181b\] { background-color: #f5f5f7 !important; }
.bg-\[\#141416\] { background-color: #f5f5f7 !important; }
.bg-\[\#1e1e22\] { background-color: #f5f5f7 !important; }
.bg-\[\#222226\] { background-color: #f0f0f2 !important; }

/* ── Alpha border overrides (white/* → black/*) ── */
.border-white\/5 { border-color: rgba(0,0,0,0.05) !important; }
.border-white\/10 { border-color: rgba(0,0,0,0.06) !important; }
.border-white\/12 { border-color: rgba(0,0,0,0.08) !important; }
.border-white\/20 { border-color: rgba(0,0,0,0.10) !important; }
.border-transparent { border-color: transparent !important; }

/* ── Alpha background overrides ── */
.bg-white\/5 { background-color: rgba(0,0,0,0.03) !important; }
.bg-white\/6 { background-color: rgba(0,0,0,0.03) !important; }
.bg-white\/10 { background-color: rgba(0,0,0,0.04) !important; }
.bg-white\/8 { background-color: rgba(0,0,0,0.03) !important; }
.bg-black\/30 { background-color: rgba(0,0,0,0.04) !important; }

/* ── Hover states ── */
.hover\:text-white:hover { color: var(--linde-red) !important; }
.hover\:border-white\/20:hover { border-color: rgba(0,0,0,0.12) !important; }

/* ── Placeholder ── */
.placeholder-\[\#636366\]::placeholder { color: #aeaeb2 !important; }

/* ── Focus rings ── */
.focus\:border-white\/30:focus { border-color: rgba(0,0,0,0.15) !important; }
.focus\:ring-white\/10:focus { --tw-ring-color: rgba(0,0,0,0.06) !important; }

/* ── Gradient avatar placeholder ── */
.bg-gradient-to-br.from-\[\#3a3a3e\].to-\[\#52525b\] {
  background: linear-gradient(to bottom right, #d1d1d6, #aeaeb2) !important;
}

/* ── Nav items ── */
.nav-item:hover, .nav-item.active {
  background: #f0f0f2 !important;
  border-left: 3px solid #1d1d1f !important;
  color: #1d1d1f !important;
}
.nav-item.active .text-white,
.nav-item.active .\!text-white { color: #1d1d1f !important; }

/* ── Filter chips ── */
.filter-chip {
  background: #f5f5f7 !important;
  border-color: rgba(0,0,0,0.08) !important;
  color: #6e6e73 !important;
}
.filter-chip:hover { color: #1d1d1f !important; border-color: rgba(0,0,0,0.15) !important; }
.filter-chip.active {
  background: rgba(227,34,25,0.08) !important;
  border-color: rgba(227,34,25,0.30) !important;
  color: #E32219 !important;
}

/* ── Buttons ── */
.btn-ghost {
  color: #6e6e73 !important;
  border-color: rgba(0,0,0,0.08) !important;
}
.btn-ghost:hover { color: #1d1d1f !important; border-color: rgba(0,0,0,0.15) !important; }

/* ── Role switcher ── */
.role-switcher .bg-white\/10 { background-color: rgba(0,0,0,0.06) !important; }

/* ── Locale switcher ── */
.lang-switcher {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
.lang-switcher button { color: #86868b !important; }
.lang-switcher button.active {
  background: rgba(227,34,25,0.08) !important;
  color: #E32219 !important;
}

/* ── Platform brand ── */
.platform-brand-title { color: #1d1d1f !important; }
.linde-logo { filter: none !important; }

/* ── Icon strokes (red stays) ── */
.icon-wrap svg, svg.lucide { stroke: #E32219 !important; color: #E32219 !important; }

/* ── Stat tiles ── */
.stat-value { color: #1d1d1f !important; }

/* ── Data tables ── */
.data-table th, .dict-table th { color: #86868b !important; border-bottom-color: rgba(0,0,0,0.08) !important; }
.data-table td, .dict-table td { color: #6e6e73 !important; border-bottom-color: rgba(0,0,0,0.04) !important; }
.data-table tr:hover td, .dict-table tr:hover td { background: #f5f5f7 !important; color: #1d1d1f !important; }

/* ── Scenario item / Metric item / Term item ── */
.scenario-item:hover, .metric-item:hover, .term-item:hover {
  background: #f5f5f7 !important;
  border-color: rgba(0,0,0,0.08) !important;
}
.scenario-item.active, .metric-item.active, .term-item.active {
  background: rgba(227,34,25,0.05) !important;
  border-color: rgba(227,34,25,0.25) !important;
}

/* ── Charts (chart.js canvas stays as-is, just adjust grid) ── */
.chart-wrap { background: transparent !important; }

/* ── Maturity / Progress bars ── */
.maturity-bar { background: rgba(0,0,0,0.06) !important; }

/* ── Target cards ── */
.target-card { border-left-color: rgba(227,34,25,0.45) !important; }

/* ── Lineage graph ── */
.lineage-canvas-wrap, .graph-wrap { background: #f8f8fa !important; border-color: rgba(0,0,0,0.06) !important; }

/* SVG graph nodes */
.sg-node text { fill: #1d1d1f !important; }
.sg-node .sub { fill: #86868b !important; }
.lineage-node text { fill: #1d1d1f !important; }
.lineage-node .sub { fill: #86868b !important; }

.sg-node circle, .sg-node rect, .sg-node polygon { fill: #ffffff !important; stroke: rgba(0,0,0,0.12) !important; }
.type-scenario circle { fill: #fff !important; stroke: #E32219 !important; }
.sg-node:hover rect, .sg-node:hover circle, .sg-node:hover polygon,
.sg-node.selected rect, .sg-node.selected circle, .sg-node.selected polygon { stroke: #E32219 !important; }
.sg-edge { stroke: rgba(0,0,0,0.12) !important; }
.sg-edge.highlight { stroke: rgba(227,34,25,0.45) !important; }

.lineage-node rect { fill: #fff !important; stroke: rgba(0,0,0,0.10) !important; }
.lineage-node:hover rect, .lineage-node.selected rect { stroke: #E32219 !important; }
.lineage-edge { stroke: rgba(0,0,0,0.12) !important; }
.lineage-edge.highlight { stroke: rgba(0,0,0,0.35) !important; }
.type-source rect { fill: #f8f8fa !important; }
.type-transform rect { fill: #f5f5f7 !important; }
.type-mart rect { fill: #f0f0f2 !important; }

/* Legend swatches */
.legend-swatch { border-color: rgba(0,0,0,0.12) !important; }
.legend-dot { border-color: rgba(0,0,0,0.12) !important; }

/* ── Definition boxes (dictionary) ── */
.def-box { background: #f8f8fa !important; border-color: rgba(0,0,0,0.06) !important; }
.def-box.business { border-left-color: #1d1d1f !important; }
.def-box.technical { border-left-color: #aeaeb2 !important; }

/* ── Strategy cards ── */
.strategy-card { background: #fff !important; border-color: rgba(0,0,0,0.06) !important; }
.strategy-card:hover { border-color: rgba(227,34,25,0.30) !important; }

/* ── Lineage phase dots ── */
.lineage-phase::before { background: rgba(0,0,0,0.08) !important; }
.lineage-dot { background: rgba(227,34,25,0.10) !important; border-color: #E32219 !important; }
.lineage-phase .glass { background: #f5f5f7 !important; }

/* ── Workflow steps ── */
.step-dot { background: #f0f0f2 !important; border-color: rgba(0,0,0,0.10) !important; }
.workflow-step.done .step-dot { background: #E32219 !important; border-color: #E32219 !important; }
.workflow-step.active .step-dot { box-shadow: 0 0 0 4px rgba(227,34,25,0.15) !important; border-color: #E32219 !important; }
.workflow-step::after { background: rgba(0,0,0,0.08) !important; }

/* ── Tab buttons ── */
.tab-btn { color: #86868b !important; border-bottom-color: transparent !important; }
.tab-btn:hover { color: #1d1d1f !important; }
.tab-btn.active { color: #E32219 !important; border-bottom-color: #E32219 !important; }

/* ── Forms ── */
.form-field label { color: #86868b !important; }
.form-field input, .form-field select, .form-field textarea {
  background: #f5f5f7 !important;
  border-color: rgba(0,0,0,0.08) !important;
  color: #1d1d1f !important;
}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus {
  border-color: rgba(0,0,0,0.20) !important;
}

/* ── Activity items ── */
.activity-item { border-bottom-color: rgba(0,0,0,0.05) !important; }

/* ── Drawer ── */
.drawer { background: #fff !important; border-left-color: rgba(0,0,0,0.06) !important; }
.drawer-overlay { background: rgba(0,0,0,0.25) !important; }

/* ── Toast ── */
[x-show="toastVisible"] {
  background: #1d1d1f !important;
  color: #fff !important;
  border-color: rgba(0,0,0,0.12) !important;
}

/* ── Mobile iPhone shell ── */
.iphone-shell { background: linear-gradient(145deg,#e5e5ea,#d1d1d6) !important; box-shadow: 0 40px 80px rgba(0,0,0,0.15) !important; }
.iphone-screen { background: #fff !important; }
.iphone-notch { background: #1d1d1f !important; }
.iphone-home-bar { background: rgba(0,0,0,0.25) !important; }

/* ── Scrollbar (webkit) ── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.12); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(0,0,0,0.20); }

/* ── Trend colors ── */
.trend-up { color: #1d1d1f !important; }
.trend-down { color: #E32219 !important; }

/* ── Search inputs in header ── */
input[type="search"], select {
  background: #f0f0f2 !important;
  border-color: rgba(0,0,0,0.08) !important;
  color: #1d1d1f !important;
}
input[type="search"]::placeholder { color: #aeaeb2 !important; }

/* ── Layer tags (dictionary) ── */
.layer-tag { border-color: rgba(0,0,0,0.10) !important; }
.layer-business { color: #1d1d1f !important; }
.layer-technical { color: #86868b !important; }
.layer-field { color: #6e6e73 !important; }

/* ── Asset link hover ── */
.asset-link:hover { color: #E32219 !important; }

/* ── Mobile flow step ── */
.mobile-flow-step { background: #fff !important; border-color: rgba(0,0,0,0.08) !important; }
.mobile-flow-line { background: rgba(0,0,0,0.08) !important; }

/* ── Login page specifics ── */
.login-card { background: #fff !important; }