/**
 * BASTEEL Layout Tool — visual theme
 * Edit this file to change colors, backgrounds, borders, text, and shadows.
 * Layout dimensions (--panel, --right) stay in app.css.
 */
:root {
  /* ── Backgrounds ───────────────────────────────────────────── */
  --navy: #0b1622;
  --navy2: #111f30;
  --navy3: #172840;
  --steel: #1e4060;
  --steel2: #2e5c80;

  /* ── Text ─────────────────────────────────────────────────── */
  --white: #e8edf2;
  --dim: #5a7a9a;
  --text-on-accent: #0b1622;
  --text-on-danger: #ffffff;

  /* ── Borders ──────────────────────────────────────────────── */
  --border: #1e3550;

  /* ── Accent & semantic ─────────────────────────────────────── */
  --amber: #e8a020;
  --amber2: #f5c04a;
  --green: #2ea86a;
  --red: #d94f4f;
  --gate: #e8a020;
  --select: #4a9edd;
  --undo: #a47dd6;
  --multi-select: #a47dd6;

  /* ── Component-specific ────────────────────────────────────── */
  --swatch-border-selected: #ffffff;
  --swatch-border-light: #8da3be;
  --accent-checkbox: var(--amber);

  /* ── Overlays (canvas HUD, legend) ─────────────────────────── */
  --overlay-bg: rgba(11, 22, 34, 0.88);
  --overlay-bg-soft: rgba(11, 22, 34, 0.8);
  --overlay-border-subtle: rgba(255, 255, 255, 0.08);
  --text-overlay-label: rgba(255, 255, 255, 0.35);
  --text-overlay-dim: rgba(255, 255, 255, 0.45);

  /* ── Panels (tinted backgrounds / borders) ─────────────────── */
  --panel-convert-bg: rgba(232, 160, 32, 0.06);
  --panel-convert-border: rgba(232, 160, 32, 0.3);
  --panel-edit-bg: rgba(74, 158, 221, 0.04);
  --cutlist-row-border: rgba(36, 61, 90, 0.3);

  /* ── Canvas chrome (not fence product colors) ──────────────── */
  --canvas-grid: rgba(30, 64, 96, 0.25);
  --canvas-grid-label: rgba(90, 122, 154, 0.4);
  --canvas-pen-stroke: rgba(232, 160, 32, 0.55);
  --canvas-pen-label-bg: rgba(11, 22, 34, 0.88);
  --canvas-pen-label-text: rgba(232, 160, 32, 0.9);
  --canvas-pen-anchor: #e8a020;
  --canvas-box-select-fill: rgba(74, 158, 221, 0.08);
  --canvas-box-select-stroke: rgba(74, 158, 221, 0.8);
  --canvas-box-touch-stroke: rgba(232, 160, 32, 0.8);
  --canvas-origin-fill: rgba(232, 160, 32, 0.15);
  --canvas-origin-stroke: rgba(232, 160, 32, 0.6);
  --canvas-origin-text: rgba(232, 160, 32, 0.7);
  --canvas-snap: #2ea86a;
  --canvas-run-halo-fence: rgba(74, 158, 221, 0.25);
  --canvas-run-halo-gate: rgba(232, 160, 32, 0.25);
  --canvas-run-label-bg: rgba(11, 22, 34, 0.88);
  --canvas-run-label-select-fence: #4a9edd;
  --canvas-run-label-select-gate: #f5c04a;
  --canvas-post-corner: #f5c04a;
  --canvas-post-end: #e8edf2;
  --canvas-post-corner-stroke: #e8a020;
  --canvas-gate-handle-fill: #e8a020;
  --canvas-gate-handle-stroke: #f5c04a;

  /* ── Shadows ───────────────────────────────────────────────── */
  --shadow-print-sheet: 0 4px 20px rgba(0, 0, 0, 0.5);

  /* ── Print preview window (browser print dialog UI) ────────── */
  --print-preview-bg: #555555;
  --print-preview-ctrl-bg: #111111;
  --print-preview-ctrl-text: #888888;
  --print-preview-btn-bg: #e8a020;
  --print-preview-btn-text: #111111;
  --print-preview-sheet-bg: #ffffff;
}