/* ==========================================================
   SILVARN - Dark mode (html[data-theme="dark"])
   ========================================================== */

html[data-theme="dark"] {
  color-scheme: dark;

  --bg: #181a1b;              /* Charcoal */
  --surface: #25292b;         /* panel / card */
  --accent: #e0783f;          /* Ember Orange */
  --accent-text: #e0783f;     /* text-safe accent on dark */
  --text: #f3f1ed;
  --text-muted: #b9b4ac;
  --border: #3b4145;
  --control-border: #e0783f;
  --input-bg: #25292b;
  --alt-surface: #25292b;

  --btn-bg: #e0783f;
  --btn-text: #181a1b;
  --btn-hover-bg: #ec8f5b;    /* hover accent */
  --btn-hover-text: #181a1b;

  --logo-gear: #e0783f;
  --logo-s: #181a1b;

  --shadow: 0 8px 22px rgba(0,0,0, 0.55);
}

/* Theme icon swap: sun visible in dark mode */
html[data-theme="dark"] .theme-toggle .icon-sun { display: block; }
html[data-theme="dark"] .theme-toggle .icon-moon { display: none; }

/* Hover on controls uses copper light in dark mode */
html[data-theme="dark"] .icon-btn:hover,
html[data-theme="dark"] .social a:hover {
  background: var(--accent-text);
  border-color: var(--accent-text);
  color: #181a1b;
}

html[data-theme="dark"] .dropdown a:hover,
html[data-theme="dark"] .dropdown a[aria-current="page"] {
  background: var(--bg);
}

html[data-theme="dark"] :focus-visible { outline-color: var(--accent-text); }

/* ---------- Home 1 / Section 1: Forge Reveal (dark) ---------- */
html[data-theme="dark"] .hero {
  --hero-ov: 24, 26, 27;          /* deep petrol overlay */
  --hero-ov-top: .86;
  --hero-ov-mid: .66;
  --hero-ov-bot: .92;
  --hero-chip-bg: rgba(24,26,27, .7);
  --hero-card-bg: var(--surface);
  --hero-card-border: rgba(236,143,91, .55);
  --hero-spark: #ec8f5b;
  --hero-gear-op: .4;
}
html[data-theme="dark"] .hero-arrow:hover { background: var(--accent-text); }


/* ---------- about-us (dark) ---------- */
html[data-theme="dark"] {--ab-shadow:0 12px 28px rgba(0,0,0,.45);--ab-shadow-lg:0 22px 44px rgba(0,0,0,.55)}

/* ---------- about-us / section 4: The Moving Wall (dark: deeper shadows) ---------- */
html[data-theme="dark"] {
  --ab-wall-sh: 0 2px 4px rgba(0,0,0,.40), 0 10px 22px rgba(0,0,0,.46), 0 26px 48px rgba(0,0,0,.52);
  --ab-wall-sh-hover: 0 3px 6px rgba(0,0,0,.50), 0 18px 32px rgba(0,0,0,.58), 0 38px 64px rgba(0,0,0,.62);
  --ab-wall-btn-sh: 0 2px 4px rgba(0,0,0,.40), 0 10px 20px rgba(0,0,0,.46), 0 20px 34px rgba(0,0,0,.34);
}

/* ---------- about-us / section 5: The Build Path (dark: deeper shadows) ---------- */
html[data-theme="dark"] {
  --ab-path-sh: 0 -8px 22px -6px rgba(0,0,0,.55), 0 16px 34px rgba(0,0,0,.50);
}

/* ---------- Services / Section 1: The Weld Seam (dark) ---------- */
html[data-theme="dark"] .sv-hero { --sv-ov: 24, 26, 27; }

/* ---------- Services / Section 1: The Link Chain (dark) ---------- */
html[data-theme="dark"] .sv3-dia img { filter: brightness(.9) contrast(1.05); }


/* ---------- Contact page: theme-aware form and location details ---------- */
html[data-theme="dark"] .page-main--contact .ctf__field input[type="text"],
html[data-theme="dark"] .page-main--contact .ctf__field input[type="email"],
html[data-theme="dark"] .page-main--contact .ctf__field textarea {
  color: var(--text);
  background: var(--input-bg);
  border-color: var(--control-border);
}
html[data-theme="dark"] .page-main--contact .ctm__frame {
  border-color: var(--control-border);
  background: var(--surface);
}