/* ==========================================================================
   darkmode.css — Acuario S.A.C.
   Activo cuando: html[data-theme="dark"] o body[data-theme="dark"]
   ========================================================================== */

html[data-theme="dark"],
body[data-theme="dark"]{
  --bg: #070a12;
  --panel: #0b1020;
  --card: rgba(255,255,255,0.04);

  --text: rgba(255,255,255,0.92);
  --muted: rgba(255,255,255,0.70);

  --border: rgba(20,184,255,0.14);

  --shadow-sm: 0 10px 30px rgba(0,0,0,0.35);
  --shadow-md: 0 28px 90px rgba(0,0,0,0.42);

  --ring: 0 0 0 4px rgba(20, 184, 255, 0.24);
}

body[data-theme="dark"]{
  background: var(--bg);
  color: var(--text);
}

/* Navbar + topbar */
body[data-theme="dark"] .topbar{
  background: rgba(6, 9, 18, 0.92);
  border-bottom-color: rgba(255,255,255,0.10);
}

body[data-theme="dark"] .navbar{
  background: rgba(7,10,18,0.78);
  border-bottom-color: rgba(20,184,255,0.12);
}

body[data-theme="dark"] .navbar__toggle-lines,
body[data-theme="dark"] .navbar__toggle-lines::before,
body[data-theme="dark"] .navbar__toggle-lines::after{
  background: rgba(255,255,255,0.88);
}

body[data-theme="dark"] .navbar__tagline{
  color: rgba(255,255,255,0.70);
}

body[data-theme="dark"] .navbar__link{
  color: rgba(255,255,255,0.88);
}
body[data-theme="dark"] .navbar__link:hover{
  background: rgba(20,184,255,0.08);
}
body[data-theme="dark"] .navbar__link.is-active{
  background: rgba(20,184,255,0.10);
  border-color: rgba(20,184,255,0.18);
}

body[data-theme="dark"] .navdrop__summary{
  color: rgba(255,255,255,0.88);
}
body[data-theme="dark"] .navdrop__summary:hover{
  background: rgba(20,184,255,0.08);
}
body[data-theme="dark"] .navdrop__menu{
  background: rgba(9,12,22,0.92);
  border-color: rgba(20,184,255,0.18);
  box-shadow: 0 34px 120px rgba(0,0,0,0.55);
}
body[data-theme="dark"] .navdrop__item{
  background: rgba(20,184,255,0.06);
  border-color: rgba(20,184,255,0.14);
}
body[data-theme="dark"] .navdrop__item:hover{
  background: rgba(20,184,255,0.10);
}
body[data-theme="dark"] .navdrop__desc{
  color: rgba(255,255,255,0.70);
}

/* Buttons */
body[data-theme="dark"] .btn--ghost{
  background: rgba(20,184,255,0.08);
  border-color: rgba(20,184,255,0.16);
  color: rgba(255,255,255,0.92);
}
body[data-theme="dark"] .btn--ghost:hover{
  background: rgba(20,184,255,0.12);
}

/* Cards */
body[data-theme="dark"] .card{
  background: var(--card);
  border-color: rgba(20,184,255,0.14);
}
body[data-theme="dark"] .card--panel{
  background: linear-gradient(180deg, rgba(255,255,255,0.05), rgba(20,184,255,0.03));
}
body[data-theme="dark"] .card--cta{
  background: radial-gradient(900px 280px at 10% 10%, rgba(20,184,255,0.18), transparent 55%),
              linear-gradient(180deg, rgba(255,255,255,0.05), rgba(20,184,255,0.03));
  border-color: rgba(20,184,255,0.22);
}

body[data-theme="dark"] .card__text,
body[data-theme="dark"] .section-text,
body[data-theme="dark"] .section-subtitle{
  color: rgba(255,255,255,0.70);
}

/* Chips / pills / badges */
body[data-theme="dark"] .badge{
  background: rgba(20,184,255,0.08);
  border-color: rgba(20,184,255,0.16);
}
body[data-theme="dark"] .badge--muted{
  background: rgba(255,255,255,0.05);
  border-color: rgba(255,255,255,0.10);
  color: rgba(255,255,255,0.72);
}
body[data-theme="dark"] .pill{
  background: rgba(255,255,255,0.05);
  border-color: rgba(255,255,255,0.10);
  color: rgba(255,255,255,0.75);
}
body[data-theme="dark"] .chip{
  background: rgba(20,184,255,0.08);
  border-color: rgba(20,184,255,0.16);
  color: rgba(255,255,255,0.88);
}
body[data-theme="dark"] .chip:hover{
  background: rgba(20,184,255,0.12);
}

/* Strip stats */
body[data-theme="dark"] .strip{
  background: linear-gradient(90deg, rgba(20,184,255,0.08), rgba(10,44,255,0.05));
  border-top-color: rgba(20,184,255,0.12);
  border-bottom-color: rgba(20,184,255,0.12);
}
body[data-theme="dark"] .stat{
  background: rgba(255,255,255,0.04);
  border-color: rgba(20,184,255,0.14);
}

/* Hero badge */
body[data-theme="dark"] .hero__badge{
  background: rgba(0,0,0,0.55);
  border-color: rgba(255,255,255,0.14);
}

/* FAQ */
body[data-theme="dark"] .faq__item{
  background: rgba(255,255,255,0.04);
  border-color: rgba(20,184,255,0.14);
}
body[data-theme="dark"] .faq__a{
  color: rgba(255,255,255,0.70);
}

/* Inputs */
body[data-theme="dark"] .search__input{
  background: rgba(255,255,255,0.05);
  color: rgba(255,255,255,0.92);
  border-color: rgba(20,184,255,0.18);
}
body[data-theme="dark"] .search__input::placeholder{
  color: rgba(255,255,255,0.55);
}

/* Footer */
body[data-theme="dark"] .footer{
  background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.00));
  border-top-color: rgba(20,184,255,0.12);
}
body[data-theme="dark"] .footer__links a,
body[data-theme="dark"] .footer__contactitem{
  color: rgba(255,255,255,0.86);
}
body[data-theme="dark"] .footer__copy,
body[data-theme="dark"] .footer__legal a{
  color: rgba(255,255,255,0.70);
}
body[data-theme="dark"] .footer__bottom{
  border-top-color: rgba(20,184,255,0.12);
}

/* Mobile panel */
@media (max-width: 980px){
  body[data-theme="dark"] .navbar__panel{
    background: rgba(7,10,18,0.96);
    border-left-color: rgba(20,184,255,0.18);
  }
  body[data-theme="dark"] .navbar__mini{
    background: rgba(255,255,255,0.05);
    border-color: rgba(255,255,255,0.10);
    color: rgba(255,255,255,0.88);
  }
}