/* Power Core contact page — dark aero overrides.
   This file must be loaded after the page's inline <style> block. */

html[data-theme="dark"] {
  --bg0: #071321;
  --bg1: #040b13;
  --shadow:
    0 24px 64px rgba(0, 5, 15, 0.52),
    inset 0 1px 0 rgba(214, 239, 255, 0.08);
}

html[data-theme="dark"] body.contact-page {
  color: var(--ink);
  background:
    radial-gradient(900px 520px at 10% 5%, rgba(47, 112, 225, 0.22), transparent 62%),
    radial-gradient(760px 520px at 92% 16%, rgba(11, 183, 218, 0.15), transparent 60%),
    radial-gradient(820px 560px at 50% 95%, rgba(34, 197, 94, 0.07), transparent 58%),
    linear-gradient(180deg, #091829 0%, #07111e 48%, #040a12 100%);
  background-attachment: fixed;
}

html[data-theme="dark"] body.contact-page::before {
  opacity: 0.035;
  mix-blend-mode: screen;
}

/* Main glass surfaces */
html[data-theme="dark"] .contact-page .glass {
  border-color: rgba(145, 205, 255, 0.16);
  background:
    radial-gradient(circle at 12% 0%, rgba(175, 220, 255, 0.08), transparent 29%),
    linear-gradient(180deg, rgba(21, 43, 70, 0.79), rgba(7, 21, 38, 0.70));
  box-shadow:
    0 25px 62px rgba(0, 4, 13, 0.52),
    inset 0 1px 0 rgba(218, 242, 255, 0.10),
    inset 0 -1px 0 rgba(0, 0, 0, 0.22);
}

html[data-theme="dark"] .contact-page .glass::before {
  background:
    radial-gradient(640px 250px at 15% 0%, rgba(69, 137, 255, 0.20), transparent 61%),
    radial-gradient(520px 240px at 88% 10%, rgba(29, 205, 234, 0.13), transparent 61%),
    radial-gradient(560px 260px at 48% 110%, rgba(39, 194, 106, 0.07), transparent 62%);
  opacity: 0.72;
}

/* Hero and headings */
html[data-theme="dark"] .contact-page .hero h1,
html[data-theme="dark"] .contact-page .hero h2,
html[data-theme="dark"] .contact-page .sec-head h3,
html[data-theme="dark"] .contact-page .company-name,
html[data-theme="dark"] .contact-page .distributor-copy h3,
html[data-theme="dark"] .contact-page .success-dialog h3 {
  color: var(--ink);
}

html[data-theme="dark"] .contact-page .hero p,
html[data-theme="dark"] .contact-page .sec-head p,
html[data-theme="dark"] .contact-page .distributor-copy p,
html[data-theme="dark"] .contact-page .success-dialog p {
  color: var(--muted);
}

html[data-theme="dark"] .contact-page .clean-visual img {
  filter: drop-shadow(0 34px 58px rgba(0, 0, 0, 0.62));
}

/* Light pills and badges */
html[data-theme="dark"] .contact-page .badge {
  border-color: rgba(154, 208, 255, 0.17);
  color: var(--muted);
  background:
    linear-gradient(180deg, rgba(31, 58, 91, 0.86), rgba(11, 28, 49, 0.82));
  box-shadow:
    0 10px 28px rgba(0, 5, 15, 0.34),
    inset 0 1px 0 rgba(218, 242, 255, 0.11),
    inset 0 -1px 0 rgba(0, 0, 0, 0.20);
}

html[data-theme="dark"] .contact-page .badge strong {
  color: #eaf5ff;
}

html[data-theme="dark"] .contact-page .company-badge {
  border-color: rgba(100, 170, 255, 0.25);
  color: #9ec8ff;
  background: rgba(43, 106, 210, 0.14);
}

/* Installer map */
html[data-theme="dark"] .contact-page .map-wrap {
  border-color: rgba(146, 205, 255, 0.17);
  background: #07111e;
  box-shadow:
    0 22px 54px rgba(0, 4, 13, 0.56),
    inset 0 1px 0 rgba(220, 243, 255, 0.08);
}

html[data-theme="dark"] .contact-page .map-wrap iframe {
  filter:
    invert(0.88)
    hue-rotate(180deg)
    saturate(0.82)
    brightness(0.82)
    contrast(1.04);
  transition: filter 0.35s var(--ease);
}

html[data-theme="dark"] .contact-page .map-wrap::after {
  background:
    linear-gradient(180deg, rgba(5, 15, 28, 0.08), rgba(5, 15, 28, 0.20)),
    radial-gradient(600px 210px at 10% 0%, rgba(53, 126, 241, 0.13), transparent 61%),
    radial-gradient(600px 210px at 90% 0%, rgba(20, 197, 226, 0.10), transparent 61%);
}

/* Company details */
html[data-theme="dark"] .contact-page .contact-layout > :first-child {
  border-right-color: rgba(153, 207, 247, 0.13);
}

html[data-theme="dark"] .contact-page .company-row {
  border-bottom-color: rgba(158, 207, 245, 0.12);
}

html[data-theme="dark"] .contact-page .company-row span {
  color: var(--muted2);
}

html[data-theme="dark"] .contact-page .company-row strong {
  color: #e9f4ff;
}

html[data-theme="dark"] .contact-page .company-row a {
  color: #77b6ff;
}

html[data-theme="dark"] .contact-page .name-svg {
  filter: brightness(0) invert(1);
  opacity: 0.92;
}

/* Form controls */
html[data-theme="dark"] .contact-page .contact-form {
  color-scheme: dark;
}

html[data-theme="dark"] .contact-page .form-group label {
  color: #b8cbe0;
}

html[data-theme="dark"] .contact-page .form-group input,
html[data-theme="dark"] .contact-page .form-group textarea {
  color: #edf7ff;
  caret-color: #72c8ff;
  border-color: rgba(151, 207, 255, 0.17);
  background:
    linear-gradient(180deg, rgba(11, 28, 49, 0.88), rgba(7, 20, 36, 0.88));
  box-shadow:
    inset 0 1px 0 rgba(217, 241, 255, 0.07),
    0 10px 25px rgba(0, 5, 15, 0.20);
}

html[data-theme="dark"] .contact-page .form-group input:hover,
html[data-theme="dark"] .contact-page .form-group textarea:hover {
  border-color: rgba(121, 188, 255, 0.27);
}

html[data-theme="dark"] .contact-page .form-group input:focus,
html[data-theme="dark"] .contact-page .form-group textarea:focus {
  border-color: rgba(89, 161, 255, 0.72);
  background:
    linear-gradient(180deg, rgba(15, 36, 62, 0.95), rgba(8, 23, 41, 0.94));
  box-shadow:
    0 0 0 4px rgba(69, 137, 255, 0.13),
    0 15px 34px rgba(0, 5, 15, 0.30),
    inset 0 1px 0 rgba(217, 241, 255, 0.09);
}

html[data-theme="dark"] .contact-page .form-group input::placeholder,
html[data-theme="dark"] .contact-page .form-group textarea::placeholder {
  color: #72859d;
}

html[data-theme="dark"] .contact-page input:-webkit-autofill,
html[data-theme="dark"] .contact-page input:-webkit-autofill:hover,
html[data-theme="dark"] .contact-page input:-webkit-autofill:focus {
  -webkit-text-fill-color: #edf7ff;
  caret-color: #edf7ff;
  box-shadow: 0 0 0 1000px #0a1c31 inset;
  transition: background-color 9999s ease-out 0s;
}

/* Distributor CTA */
html[data-theme="dark"] .contact-page .distributor-actions {
  border-left-color: rgba(151, 207, 255, 0.14);
  background:
    radial-gradient(circle at 80% 10%, rgba(71, 143, 255, 0.13), transparent 37%),
    linear-gradient(180deg, rgba(29, 55, 85, 0.78), rgba(11, 28, 48, 0.76));
}

html[data-theme="dark"] .contact-page .distributor-actions::before {
  background:
    radial-gradient(260px 180px at 82% 18%, rgba(77, 153, 255, 0.15), transparent 70%),
    radial-gradient(260px 180px at 18% 90%, rgba(35, 211, 116, 0.07), transparent 70%);
}

html[data-theme="dark"] .contact-page .distributor-kicker {
  color: #8db8e4;
}

html[data-theme="dark"] .contact-page .distributor-note {
  color: var(--muted);
}

/* Success modal */
html[data-theme="dark"] .contact-page .success-modal {
  background: rgba(1, 7, 15, 0.72);
}

html[data-theme="dark"] .contact-page .success-dialog {
  border: 1px solid rgba(151, 207, 255, 0.17);
  color: var(--ink);
  background:
    radial-gradient(circle at 15% 0%, rgba(87, 156, 255, 0.12), transparent 35%),
    linear-gradient(180deg, rgba(22, 45, 73, 0.95), rgba(7, 21, 38, 0.95));
  box-shadow:
    0 40px 100px rgba(0, 3, 10, 0.70),
    inset 0 1px 0 rgba(219, 243, 255, 0.10);
}

/* Smooth theme response for local elements */
.contact-page .glass,
.contact-page .badge,
.contact-page .map-wrap,
.contact-page .map-wrap iframe,
.contact-page .form-group input,
.contact-page .form-group textarea,
.contact-page .distributor-actions,
.contact-page .success-dialog {
  transition:
    color 0.28s var(--ease),
    background 0.28s var(--ease),
    border-color 0.28s var(--ease),
    box-shadow 0.28s var(--ease),
    filter 0.35s var(--ease);
}

@media (max-width: 860px) {
  html[data-theme="dark"] .contact-page .contact-layout > :first-child {
    border-right-color: transparent;
    border-bottom-color: rgba(153, 207, 247, 0.13);
  }

  html[data-theme="dark"] .contact-page .distributor-actions {
    border-left-color: transparent;
    border-top-color: rgba(151, 207, 255, 0.14);
  }
}

@media (max-width: 640px) {
  html[data-theme="dark"] body.contact-page {
    background-attachment: scroll;
  }
}

@media (prefers-reduced-motion: reduce) {
  .contact-page .glass,
  .contact-page .badge,
  .contact-page .map-wrap,
  .contact-page .map-wrap iframe,
  .contact-page .form-group input,
  .contact-page .form-group textarea,
  .contact-page .distributor-actions,
  .contact-page .success-dialog {
    transition: none !important;
  }
}
