/* ====== PALETA BASE TRIPLEXSOLUTIO ======
   Light & Dark con naranja, azul, negro, gris y blanco
================================================== */

/* LIGHT por defecto */
:root {
  --bg: #f5f5f7;
  --bg-soft: #ffffff;
  --bg-soft2: #ffffff;
  --bg-header: rgba(255, 255, 255, 0.9);
  --bg-footer: #ffffff;

  --accent: #ff7a1a;       /* naranja */
  --accent-soft: rgba(255, 122, 26, 0.1);
  --accent-soft2: rgba(253, 105, 0, 0.6);
  --accent2: #1f7aff;      /* azul */
  --accent2-soft: rgba(31, 122, 255, 0.08);

  --text: #111111;         /* casi negro */
  --muted: #6b7280;        /* gris medio */
  --card-bg: #ffffff;
  --border: #e2e8f0;

  --shadow-soft: 0 8px 20px rgba(15, 23, 42, 0.08);

  --radius-lg: 18px;
  --promo-bg: linear-gradient(135deg, #d0dfe7 0%, #eaeaea 100%);
}

/* DARK MODE */
html[data-theme="dark"] {
  --bg: #050816;
  --bg-soft: #0b1020;
  --bg-soft2:rgb(24, 31, 61)0;
  --bg-header: rgba(5, 8, 22, 0.95);
  --bg-footer: rgba(5, 8, 22, 0.95);

  --accent: #ff7a1a;       /* naranja */
  --accent-soft: rgba(255, 122, 26, 0.18);
  --accent-soft2: rgba(253, 105, 0, 0.6);

  --accent2: #39c5ff;      /* azul cyan */
  --accent2-soft: rgba(57, 197, 255, 0.12);

  --text: #f5f5f5;
  --muted: #a0a0b8;
  --card-bg: #11162a;
  --border: #22263b;

  --shadow-soft: 0 10px 28px rgba(0, 0, 0, 0.55);
  --promo-bg: linear-gradient(135deg, #123a38 0%, #1a1f4a 100%);
}

/* ====== RESETEO BÁSICO ====== */

*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:
    radial-gradient(circle at top, rgba(37, 99, 235, 0.12) 0, transparent 55%),
    var(--bg);
  color: var(--text);
}

.btn { display:inline-block; padding:12px 16px; border-radius:10px; text-decoration:none; font-weight:600; }
.btn-primary { background: var(--accent2-soft); color: var(--text) }
.btn-primary:hover { filter:brightness(1.1); }
.hidden { display:none; }


/* Toast / Snackbar */
.toast {
  position: fixed;
  left: 50%;
  top: 65px;                   /* separa del borde inferior */
  transform: translateX(-50%) translateY(16px);
  z-index: 9999;
  background: var(--card-bg);
  color: var(--text, #e8ecf3);
  border: 1px solid var(--border, rgba(255,255,255,.06));
  border-radius: 12px;
  padding: 12px 16px;
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
  opacity: 1;
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
  font-weight: 600;

  display: inline-flex;           /* icono + texto en fila */
  align-items: center;
  gap: 8px;
  min-width: 85vw !important;
  }
.toast.is-visible {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
  pointer-events: auto;
}
.toast--success { border-color: rgba(16,185,129,.35); }
.toast--error   { border-color: rgba(239,68,68,.35);  }
.toast__icon { margin-right: 8px; }