/* Chores Bank — páginas de aviso de privacidad y soporte.
 *
 * Los colores salen de `02-brand/tokens/tokens.css`, que es la fuente única de verdad.
 * Se copian aquí y no se importan porque estas páginas se despliegan solas a Netlify,
 * fuera del árbol de la app: un `@import` a un archivo que no viaja con ellas rompería
 * el estilo en producción sin avisar en local.
 */

:root {
  --cb-violet-700: #4A22A8;
  --cb-violet-600: #6038D0;
  --cb-violet-100: #EDE7FC;
  --cb-indigo-900: #0E1132;
  --cb-green-800:  #12654A;
  --cb-green-100:  #DFF5EC;
  --cb-gold-500:   #F8B008;

  --ink:   #1B1830;
  --muted: #6B6880;
  --bg:    #F7F5FD;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color: var(--ink);
  background: var(--bg);
  line-height: 1.6;
}

.wrap { max-width: 760px; margin: 0 auto; padding: 32px 20px 64px; }

header { text-align: center; padding: 24px 0 8px; }

.logo {
  display: inline-block;
  font-size: 28px;
  font-weight: 800;
  background: linear-gradient(90deg, var(--cb-violet-600), var(--cb-gold-500));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

h1 { font-size: 26px; margin: 16px 0 4px; }
h2 { font-size: 18px; margin: 28px 0 8px; color: var(--cb-indigo-900); }
h3 { font-size: 16px; margin: 22px 0 6px; }

.updated { color: var(--muted); font-size: 14px; margin-bottom: 24px; }

p, li { color: #2C2942; }

a { color: var(--cb-violet-700); }

.idiomas { text-align: center; font-size: 14px; color: var(--muted); margin-bottom: 20px; }

.card {
  background: #fff;
  border: 1px solid #E7E1F6;
  border-radius: 16px;
  padding: 20px 22px;
}

/* El resumen de arriba del aviso. Es lo único que mucha gente va a leer, y en una app
   para menores es justo lo que un padre —o un revisor— necesita ver primero. */
.resumen {
  background: var(--cb-green-100);
  border: 1px solid #B9E5D3;
  border-radius: 14px;
  padding: 16px 20px;
  margin-bottom: 24px;
}
.resumen h2 { margin-top: 0; color: var(--cb-green-800); }
.resumen ul { margin: 0; padding-left: 20px; }

.cta {
  display: inline-block;
  margin-top: 8px;
  padding: 12px 22px;
  border-radius: 999px;
  color: #fff;
  text-decoration: none;
  font-weight: 700;
  background: linear-gradient(90deg, var(--cb-violet-600), var(--cb-violet-700));
}

table { border-collapse: collapse; width: 100%; margin: 12px 0; font-size: 15px; }
th, td { text-align: left; padding: 8px 10px; border-bottom: 1px solid #EDE9F7; vertical-align: top; }
th { color: var(--cb-indigo-900); }

footer { text-align: center; color: var(--muted); font-size: 13px; margin-top: 32px; }

/* El sitio se sirve en un móvil la mayoría de las veces: es el enlace que abre un padre
   desde la ficha de la App Store, dentro del propio teléfono. */
@media (max-width: 480px) {
  .wrap { padding: 20px 16px 48px; }
  h1 { font-size: 22px; }
  table { font-size: 14px; }
}