/* ============================================================
   styles.css — Overrides finos sobre Tailwind (cargado via CDN).
   Mantener este archivo pequeño: solo lo que Tailwind no resuelve.
   ============================================================ */

/* Tipografía base ya la fija Tailwind (font-sans = Manrope) */
html { font-family: 'Manrope', system-ui, sans-serif; }

/* Iconos de Material Symbols: tamaño y peso consistentes */
.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    user-select: none;
    line-height: 1;
}

/* Truncado a varias líneas (Tailwind line-clamp solo cubre algunas variantes) */
.line-clamp-1 {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Acentos rojos en checkboxes/radios nativos (sin tener que poner clases en cada uno) */
input[type='checkbox'], input[type='radio'] {
    accent-color: #C01723;
}

/* Estilos para las páginas legales: anchura cómoda y jerarquía clara */
.prose-legal h2 {
    font-size: 1.25rem;
    font-weight: 700;
    color: #4f6600;
    margin: 2rem 0 0.75rem;
}
.prose-legal p, .prose-legal li {
    color: #444936;
    line-height: 1.65;
    margin: 0 0 0.75rem;
}
.prose-legal ul {
    padding-left: 1.25rem;
    list-style: disc;
    margin-bottom: 1rem;
}
.prose-legal a {
    color: #C01723;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.prose-legal a:hover {
    text-decoration: none;
}
.prose-legal table th {
    font-weight: 700;
    color: #4f6600;
}
.prose-legal strong { color: #1a1c1e; }

/* Cuando el banner de cookies está abierto, dejamos sitio por debajo */
body.cookies-shown { padding-bottom: 280px; }
@media (min-width: 768px) {
    body.cookies-shown { padding-bottom: 220px; }
}

/* Slider de precio con acento rojo del manual de marca */
input[type='range'].brand-range {
    accent-color: #C01723;
}