/**
 * Utilidades para las páginas legales (privacidad, términos, contacto).
 *
 * Esas vistas se escribieron con clases de Tailwind, pero el sitio NO carga Tailwind:
 * `max-w-4xl`, `p-8`, `space-y-*`... no existían, así que el texto salía a 1272px de
 * ancho, pegado al borde del bloque blanco y sin separación entre secciones.
 *
 * En vez de reescribir 900 líneas de HTML, se implementa aquí el subconjunto de
 * utilidades que esas páginas usan. TODO va scopeado bajo `.legal-page` para no
 * colisionar con el CSS del resto del sitio (bundle-main.css).
 */

.legal-page { --lp-text: #4b5563; --lp-heading: #1f2937; --lp-link: #2563eb; }

/* Layout */
.legal-page .container { width: 100%; }
.legal-page .mx-auto { margin-left: auto; margin-right: auto; }
.legal-page .max-w-4xl { max-width: 56rem; }
.legal-page .w-full { width: 100%; }
.legal-page .block { display: block; }

/* Espaciado */
.legal-page .p-4 { padding: 1rem; }
.legal-page .p-6 { padding: 1.5rem; }
.legal-page .p-8 { padding: 2rem; }
.legal-page .px-4 { padding-left: 1rem; padding-right: 1rem; }
.legal-page .px-8 { padding-left: 2rem; padding-right: 2rem; }
.legal-page .py-3 { padding-top: .75rem; padding-bottom: .75rem; }
.legal-page .py-8 { padding-top: 2rem; padding-bottom: 2rem; }
.legal-page .pt-6 { padding-top: 1.5rem; }
.legal-page .mb-2 { margin-bottom: .5rem; }
.legal-page .mb-3 { margin-bottom: .75rem; }
.legal-page .mb-4 { margin-bottom: 1rem; }
.legal-page .mb-6 { margin-bottom: 1.5rem; }
.legal-page .mb-8 { margin-bottom: 2rem; }
.legal-page .mt-3 { margin-top: .75rem; }
.legal-page .mt-4 { margin-top: 1rem; }
.legal-page .mt-8 { margin-top: 2rem; }
.legal-page .ml-4 { margin-left: 1rem; }
.legal-page .mr-2 { margin-right: .5rem; }
.legal-page .space-y-1 > * + * { margin-top: .25rem; }
.legal-page .space-y-2 > * + * { margin-top: .5rem; }
.legal-page .space-y-6 > * + * { margin-top: 1.5rem; }

/* Tipografía */
.legal-page .text-sm { font-size: .875rem; }
.legal-page .text-lg { font-size: 1.125rem; }
.legal-page .text-xl { font-size: 1.25rem; line-height: 1.4; }
.legal-page .text-2xl { font-size: 1.5rem; line-height: 1.35; }
.legal-page .text-4xl { font-size: 2.25rem; line-height: 1.2; }
.legal-page .font-medium { font-weight: 500; }
.legal-page .font-semibold { font-weight: 600; }
.legal-page .font-bold { font-weight: 700; }
.legal-page .leading-relaxed { line-height: 1.7; }
.legal-page .text-center { text-align: center; }
.legal-page .underline { text-decoration: underline; }

/* Color */
.legal-page .text-gray-500 { color: #6b7280; }
.legal-page .text-gray-600 { color: var(--lp-text); }
.legal-page .text-gray-700 { color: #374151; }
.legal-page .text-gray-800 { color: var(--lp-heading); }
.legal-page .text-blue-600 { color: var(--lp-link); }
.legal-page .text-white { color: #fff; }
.legal-page .text-green-800 { color: #166534; }
.legal-page .text-red-800 { color: #991b1b; }
.legal-page .bg-white { background-color: #fff; }

/* Bordes y sombras */
.legal-page .border { border: 1px solid #e5e7eb; }
.legal-page .border-gray-300 { border-color: #d1d5db; }
.legal-page .rounded { border-radius: .25rem; }
.legal-page .rounded-lg { border-radius: .5rem; }
.legal-page .shadow-md { box-shadow: 0 4px 6px -1px rgba(0,0,0,.1), 0 2px 4px -2px rgba(0,0,0,.1); }
.legal-page .shadow-lg { box-shadow: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1); }

/* Listas: sin esto los <li> pierden la viñeta y la sangría */
.legal-page .list-disc { list-style-type: disc; }
.legal-page .list-inside { list-style-position: inside; }
.legal-page ul.list-disc { padding-left: .5rem; }
.legal-page ul.list-disc li { margin-bottom: .35rem; }

/* Grid de contacto */
.legal-page .grid { display: grid; }
.legal-page .gap-6 { gap: 1.5rem; }
@media (min-width: 768px) {
    .legal-page .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Interacción */
.legal-page .transition-colors { transition: color .15s ease, background-color .15s ease; }
.legal-page .transition-shadow { transition: box-shadow .15s ease; }
.legal-page .hover\:underline:hover { text-decoration: underline; }
.legal-page .hover\:shadow-lg:hover { box-shadow: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1); }
.legal-page .resize-vertical { resize: vertical; }
.legal-page .focus\:ring-2:focus,
.legal-page .focus\:ring-blue-500:focus { outline: 2px solid var(--lp-link); outline-offset: 1px; }
.legal-page .focus\:border-transparent:focus { border-color: transparent; }

/* Ritmo de lectura: el bloque blanco necesita aire propio en móvil */
@media (max-width: 640px) {
    .legal-page .p-8 { padding: 1.25rem; }
    .legal-page .text-4xl { font-size: 1.75rem; }
    .legal-page .text-2xl { font-size: 1.3rem; }
}