/*
 * Estilos compartidos por las páginas legales estáticas (public/legal/*.html).
 * Viven fuera del pipeline de Astro/Tailwind a propósito — son páginas
 * standalone que Apple/Google referencian por URL fija desde el listado de
 * la app, así que no pasan por el router de Astro. Los valores de color de
 * abajo son un calco manual de los tokens en src/styles/global.css; si esos
 * tokens cambian, actualizar también aquí.
 */

@font-face {
  font-family: 'Sora';
  src: url('/fonts/sora-variable.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Karla';
  src: url('/fonts/karla-variable.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root { color-scheme: light dark; }

body {
  margin: 0; padding: 0;
  background: #FAFAFA; color: #1B1A19;
  font-family: 'Karla', ui-sans-serif, system-ui, sans-serif;
  line-height: 1.6;
}

.site-link {
  display: flex; align-items: center; gap: 8px;
  max-width: 720px; margin: 0 auto; padding: 28px 20px 0;
}
.site-link img { height: 22px; width: auto; opacity: .85; }
.site-link span { font-size: 13px; color: #605E5C; }
.site-link:hover span { color: #1B1A19; }

.wrap { max-width: 720px; margin: 0 auto; padding: 24px 20px 80px; }
h1 { font-family: 'Sora', ui-sans-serif, system-ui, sans-serif; font-weight: 650; font-size: 26px; margin-bottom: 4px; }
h2 { font-family: 'Sora', ui-sans-serif, system-ui, sans-serif; font-weight: 600; font-size: 19px; margin-top: 36px; border-top: 1px solid #EDEBE9; padding-top: 20px; }
.updated { color: #605E5C; font-size: 13px; margin-bottom: 32px; }
.lang-nav { display: flex; gap: 12px; margin-bottom: 32px; font-size: 13px; }
.lang-nav a { color: #0078D4; text-decoration: none; font-weight: 600; }
a { color: #0078D4; }
ul { padding-left: 20px; }
section { margin-bottom: 8px; }
hr.divider { border: none; border-top: 2px solid #EDEBE9; margin: 56px 0; }
code { background: #F3F4F6; padding: 1px 5px; border-radius: 4px; font-size: 13px; }

@media (prefers-color-scheme: dark) {
  body { background: #0B0E14; color: #E6EDF3; }
  .site-link span { color: #9DA7B3; }
  .site-link:hover span { color: #E6EDF3; }
  h2 { border-top-color: #262C36; }
  .updated { color: #9DA7B3; }
  hr.divider { border-top-color: #262C36; }
  a { color: #4AABFF; }
  code { background: #1F2630; }
}