:root {
  /* Grundlayout */
  --color-page-bg: #dbeafe;
  --color-page-text: #1f2937;
  --color-card-bg: #ffffff;
  --color-card-shadow: rgba(0, 0, 0, 0.12);

  /* Überschriften / sekundärer Text */
  --color-text-primary: #111827;
  --color-text-secondary: #374151;
  --color-text-muted: #4b5563;
  --color-text-soft: #6b7280;
  --color-text-placeholder: #9ca3af;

  /* Eingabefeld */
  --color-input-bg: #ffffff;
  --color-input-border: #d1d5db;
  --color-input-focus-border: #2563eb;
  --color-input-focus-ring: rgba(37, 99, 235, 0.14);
  --color-input-overlay-text: #9ca3af;

  /* Primärfarbe / Buttons */
  --color-primary: #2563eb;
  --color-primary-hover: #1d4ed8;
  --color-primary-contrast: #ffffff;
  --color-primary-soft: #eff6ff;
  --color-primary-soft-hover: #dbeafe;
  --color-primary-soft-border: #bfdbfe;
  --color-primary-border-strong: #93c5fd;
  --color-primary-active-ring: rgba(37, 99, 235, 0.18);
  --color-primary-subtle-fill: rgba(37, 99, 235, 0.08);

  /* Ergebnis-Karten */
  --color-station-card-bg: #f9fafb;
  --color-station-card-bg-hover: #f8fbff;
  --color-station-card-border: #dbe3f0;
  --color-station-card-border-hover: #93c5fd;

  /* Pills / Status */
  --color-distance-pill-bg: #dbeafe;
  --color-distance-pill-text: #1d4ed8;
  --color-maps-pill-bg: #2563eb;
  --color-maps-pill-text: #ffffff;
  --color-apple-pill-bg: #111827;
  --color-apple-pill-text: #ffffff;
  --color-phone-pill-bg: #16a34a;
  --color-phone-pill-text: #ffffff;
  --color-history-pill-bg: #f59e0b;
  --color-history-pill-text: #ffffff;

  /* Bookmark */
  --color-bookmark: #facc15;
  --color-bookmark-hover: #f59e0b;

  /* Preis-Pills */
  --color-fuel-pill-bg: #ffffff;
  --color-fuel-pill-border: #bfdbfe;
  --color-fuel-pill-shadow: rgba(37, 99, 235, 0.08);
  --color-fuel-label: #6b7280;
  --color-fuel-value: #111827;
  --color-fuel-empty: #9ca3af;
  --color-fastfood-distance: #6b7280;

  /* History-Panel */
  --color-history-panel-bg: #fff7ed;
  --color-history-panel-border: #fed7aa;
  --color-history-title: #9a3412;
  --color-history-subtitle: #7c2d12;
  --color-history-chart-bg: #ffffff;
  --color-history-chart-border: #fed7aa;
  --color-history-chart-grid: #e5e7eb;
  --color-history-chart-grid-soft: #f3f4f6;
  --color-history-chart-axis: #9ca3af;
  --color-history-chart-label: #6b7280;
  --color-history-tab-e5: #2563eb;
  --color-history-tab-e10: #10b981;
  --color-history-tab-diesel: #111827;
  --color-history-tab-active-border: rgba(255, 255, 255, 0.7);
  --color-history-tab-active-shadow: rgba(0, 0, 0, 0.08);

  /* Öl-/Gas-Panel */
  --color-oil-panel-bg: #eff6ff;
  --color-oil-panel-border: #bfdbfe;
  --color-oil-title: #1d4ed8;
  --color-oil-text: #1e3a8a;
  --color-oil-summary-bg: rgba(255, 255, 255, 0.55);
  --color-oil-summary-dot-default: #93c5fd;
  --color-oil-trend-up: #ef4444;
  --color-oil-trend-down: #22c55e;
  --color-oil-trend-flat: #f59e0b;
  --color-oil-trend-dot-inner-ring: rgba(255, 255, 255, 0.28);

  /* Kartenansicht */
  --color-status-error: #dc2626;
  --color-status-warning: #f59e0b;
  --color-map-page-bg: #e2e8f0;
  --color-map-text-primary: #0f172a;
  --color-map-text-muted: #475569;
  --color-map-panel-bg: rgba(255, 255, 255, 0.96);
  --color-map-panel-overlay-bg: rgba(255, 255, 255, 0.98);
  --color-map-border: #dbe2ea;
  --color-map-panel-border: rgba(148, 163, 184, 0.35);
  --color-map-panel-shadow: 0 12px 28px rgba(15, 23, 42, 0.18);
  --color-map-focus-ring: rgba(37, 99, 235, 0.12);
  --color-map-pill-active-shadow: 0 6px 16px rgba(37, 99, 235, 0.22);
  --color-map-marker-shadow: #0f172a;
  --color-map-marker-hitbox: #000000;
  --color-map-marker-text: #111827;
  --color-map-marker-halo: #ffffff;
  --color-map-fastfood-fallback-fill: #ffffff;
  --color-map-fastfood-fallback-stroke: #f59e0b;
  --color-map-fastfood-fallback-text: #111827;
  --color-map-google-dot: #2563eb;
  --color-map-google-dot-inner: #ffffff;
  --color-price-tier-green: #16a34a;
  --color-price-tier-yellow: #f59e0b;
  --color-price-tier-red: #dc2626; 
  --alpha-map-marker-shadow-strong: 0.24;
  --alpha-map-marker-shadow-soft: 0.18;

  /* Rohpalette aus index-v32.html */
  --palette-white: #ffffff;
  --palette-white-alt: #fff;
  --palette-blue-50: #eff6ff;
  --palette-blue-100: #dbeafe;
  --palette-blue-200: #bfdbfe;
  --palette-blue-300: #93c5fd;
  --palette-blue-600: #2563eb;
  --palette-blue-700: #1d4ed8;
  --palette-blue-900: #1e3a8a;
  --palette-gray-50: #f9fafb;
  --palette-gray-100-alt: #f8fbff;
  --palette-gray-300: #d1d5db;
  --palette-gray-300-alt: #dbe3f0;
  --palette-gray-400: #9ca3af;
  --palette-gray-500: #6b7280;
  --palette-gray-600: #4b5563;
  --palette-gray-700: #374151;
  --palette-gray-800: #1f2937;
  --palette-gray-900: #111827;
  --palette-yellow-400: #facc15;
  --palette-amber-500: #f59e0b;
  --palette-orange-100: #fed7aa;
  --palette-orange-50: #fff7ed;
  --palette-orange-800: #9a3412;
  --palette-orange-900: #7c2d12;
  --palette-green-500: #22c55e;
  --palette-green-600: #16a34a;
  --palette-emerald-500: #10b981;
  --palette-red-500: #ef4444;

  /* Transparenzen */
  --alpha-shadow-card: rgba(0, 0, 0, 0.12);
  --alpha-shadow-soft: rgba(0, 0, 0, 0.08);
  --alpha-primary-soft: rgba(37, 99, 235, 0.08);
  --alpha-primary-ring: rgba(37, 99, 235, 0.14);
  --alpha-primary-ring-strong: rgba(37, 99, 235, 0.18);
  --alpha-white-70: rgba(255, 255, 255, 0.7);
  --alpha-white-55: rgba(255, 255, 255, 0.55);
  --alpha-white-28: rgba(255, 255, 255, 0.28);
}