/* =============================================
   privacidad.css: estilos propios de la política de privacidad.
   El resto (contenedor, índice, bloques y tablas) viene de faq.css
   ============================================= */

/* FECHA: debajo del título, más pegada a él que el subtítulo de la FAQ */
.fecha-privacidad {
    margin-bottom: 32px;
    font-size: 1rem;
}

/* CAJAS DE TEXTO */
/* Como las preguntas de la FAQ: caja blanca (con fondo propio para leerla
   bien aunque detrás pase el circuito), pero con varios párrafos y listas */
.caja {
    margin-bottom: 16px;
    padding: 24px;
    border: 1px solid #E5E7EB;
    border-radius: 12px;
    background-color: #FFFFFF;
    line-height: 1.6;
}

/* La caja de la introducción, separada del índice como el subtítulo de la FAQ */
.fecha-privacidad + .caja {
    margin-bottom: 48px;
}

.caja h3 {
    margin: 0 0 12px;
    font-size: 1rem;
    line-height: 1.4;
}

.caja p {
    margin: 0 0 12px;
}

/* Aquí las listas sí llevan viñetas, como en el índice de la FAQ */
.caja ul {
    margin: 0 0 12px;
    padding-left: 20px;
    list-style: revert;
}

.caja li {
    margin-top: 6px;
}

/* El texto en gris, como en la FAQ (los títulos y las negritas siguen en negro) */
.caja p,
.caja li {
    color: #6B7280;
}

/* Lo que va dentro de un punto de la lista, pegado a él */
.caja li ul,
.caja li p {
    margin: 6px 0 0;
}

/* Lo último de cada caja no necesita margen abajo */
.caja> :last-child {
    margin-bottom: 0;
}

.caja a {
    font-weight: 600;
    color: #0A7A90;
}

/* TABLAS */
/* En faq.css las tablas miden al menos 640px y en el móvil se mueven de lado.
   Estas tienen poco texto por celda: caben en el ancho del móvil */
.privacidad table {
    min-width: 0;
}

/* Con varias líneas en una celda, el texto se lee mejor alineado arriba */
.privacidad th,
.privacidad td {
    vertical-align: top;
}

/* Tablas de dos columnas: la de la izquierda (el nombre de cada fila), algo más estrecha */
.tabla-clave tbody th {
    width: 32%;
}

/* La tabla dentro de una caja, separada de las listas de arriba y abajo */
.caja .tabla-scroll {
    margin: 0 0 12px;
}

/* En el móvil, celdas más justas y letra algo menor: así la tabla de
   proveedores (tres columnas, dentro de una caja) cabe sin salirse */
@media (max-width: 639px) {
    .privacidad table {
        font-size: 0.875rem;
    }

    .privacidad th,
    .privacidad td {
        padding: 8px;
    }
}