/*
 * Estilos para las tablas accesibles de cookies de Complianz Free.
 *
 * Replica visualmente las reglas que ya aplicaba
 * wp-content/plugins/complianz-gdpr/assets/css/document.css para
 * ".cookies-per-purpose" (hoja activa por defecto: opción de Complianz
 * "use_document_css" = true), adaptadas al nuevo markup de
 * h4.purpose + table.cmplz-cookie-table en lugar de los <div> originales.
 * No se modifica ningún archivo del plugin.
 *
 * Mapeo con el CSS original (document.css):
 * - ".cookies-per-purpose"            -> igual selector, mismo contenedor
 * - ".cookies-per-purpose div"        -> th/td de la tabla
 * - ".name-header/.retention-header/.function-header" (>=600px)
 *                                     -> "thead th" (misma media query)
 * - cabeceras en mobile (<600px)      -> "thead th" (line-height)
 *
 * Ver overrides de templates en:
 * wp-content/themes/CriteriaCaixa/complianz-gdpr/templates/cookiepolicy/
 */

/*
 * Se iguala la especificidad de los selectores del plugin
 * (id + clases) para que estas reglas ganen sin !important; el plugin
 * encola su CSS antes que el theme, así que esta hoja siempre se
 * imprime después en el <head>.
 */
#cmplz-cookies-overview .cmplz-dropdown .cookies-per-purpose,
#cmplz-document .cmplz-dropdown .cookies-per-purpose,
.editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown .cookies-per-purpose {
    border: 1px solid #dadada;
    margin-bottom: 10px;
}

/* Barra de título del propósito: antes era un <div class="purpose">
   (recibía padding:15px por ser hijo de .cookies-per-purpose) envolviendo
   un <h4> con margin:5px 0; ahora el padding y el margin viven juntos
   en el propio h4, para mantener el mismo espacio total (15px + 5px). */
#cmplz-cookies-overview .cmplz-dropdown .cookies-per-purpose .purpose,
#cmplz-document .cmplz-dropdown .cookies-per-purpose .purpose,
.editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown .cookies-per-purpose .purpose {
    background-color: white;
    padding: 20px 15px;
    margin: 0;
}

.cmplz-cookie-table-wrapper {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.cmplz-cookie-table {
    width: 100%;
    border-collapse: collapse;
}

/* Antes: ".cookies-per-purpose div { background:white; padding:15px }",
   aplicado por igual a cabeceras y celdas de datos. */
.cmplz-cookie-table th,
.cmplz-cookie-table td {
    background-color: white;
    padding: 15px;
    text-align: left;
    vertical-align: top;
    border: 1px solid #dadada;
}

.cmplz-cookie-table thead th {
    font-weight: bold;
    text-transform: none;
}

/* Antes: fondo gris en .name-header/.retention-header/.function-header
   solo a partir de 600px. */
@media only screen and (min-width: 600px) {
    .cmplz-cookie-table thead th {
        background-color: #f7f7f7;
    }
}

/* Antes: line-height:1.8 en los <h5> de cabecera por debajo de 600px. */
@media only screen and (max-width: 600px) {
    .cmplz-cookie-table thead th {
        line-height: 1.8;
    }
}

/* El nombre de la cookie va en un <th scope="row"> (necesario para la
   accesibilidad), pero visualmente antes no iba en negrita: solo las
   cabeceras de columna lo estaban. Se anula el bold por defecto de <th>. */
.cmplz-cookie-table tbody th[scope="row"] {
    font-weight: normal;
}