/* ==========================================================================
   Consentimiento de cookies. Modulo portable del kit.

   No depende del sistema visual del tema: declara sus propias fichas y las
   toma de las del tema con valor de respaldo, asi el mismo archivo entra en
   cualquier re-skin.

   De "Veneras 4": la banda es franja de accion, asi que suelo verde profundo.
   Un solo acento, el ambar, y solo en lo accionable. Radio 6px en botones y
   paneles, 3px en filetes y casillas. Sin sombras. Movimiento corto.
   ========================================================================== */

.labc {
  --labc-hueso: var(--lab-hueso, #f7f3e9);
  --labc-crema: var(--lab-crema, #e0d5ba);
  --labc-verde: var(--lab-verde, #0e4a33);
  --labc-verde-hondo: var(--lab-verde-hondo, #04271a);
  --labc-tinta: var(--lab-nogal, #241811);
  --labc-tinta-suave: var(--lab-nogal-suave, #5c4b41);
  --labc-salvia: var(--lab-salvia, #a9b2a4);
  --labc-ambar: var(--lab-ambar, #e8a93a);
  --labc-ambar-texto: var(--lab-ambar-texto, #764506);
  --labc-filete: var(--lab-filete, #7e7460);
  --labc-filete-verde: var(--lab-filete-oscuro, #5e7a6b);
  --labc-display: var(--lab-display, "Alegreya", Georgia, serif);
  --labc-texto: var(--lab-texto, "Archivo", system-ui, sans-serif);
  --labc-radio: var(--lab-radio, 3px);
  --labc-radio-md: var(--lab-radio-md, 6px);

  font-family: var(--labc-texto);
  font-size: 0.9375rem;
  line-height: 1.65;
}

:where(.labc *, .labc *::before, .labc *::after) { box-sizing: border-box; }
:where(.labc p, .labc h2, .labc ul, .labc li) { margin: 0; padding: 0; list-style: none; }

/* --------------------------------------------------------------------------
   Primera capa: franja inferior

   Franja, no ventana modal: no se secuestra la navegacion para pedir permiso.
   -------------------------------------------------------------------------- */

.labc-franja {
  position: fixed;
  inset: auto 0 0 0;
  z-index: 80;
  background: var(--labc-verde-hondo);
  border-top: 1px solid var(--labc-filete-verde);
  color: var(--labc-hueso);
  padding: var(--lab-e3, 1.75rem) var(--lab-e2, 1rem);
}

.labc-franja[hidden] { display: none; }

@media (prefers-reduced-motion: no-preference) {
  .labc-franja { animation: labc-entra 170ms cubic-bezier(.2, 0, .2, 1) both; }
}

@keyframes labc-entra {
  from { opacity: 0; transform: translateY(.5rem); }
  to   { opacity: 1; transform: none; }
}

.labc-franja__caja {
  max-width: var(--lab-ancho, 74rem);
  margin-inline: auto;
  display: grid;
  gap: var(--lab-e2, 1rem);
}

@media (min-width: 62rem) {
  .labc-franja__caja {
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: var(--lab-e4, 3.5rem);
  }
}

.labc-franja__titulo {
  font-family: var(--labc-display);
  font-weight: 700;
  font-size: 1.375rem;
  line-height: 1.05;
  color: var(--labc-hueso);
}

.labc-franja__texto {
  margin-top: var(--lab-e1, .5rem);
  color: var(--labc-salvia);
  max-width: 66ch;
}

.labc-franja__resp {
  margin-top: var(--lab-e1, .5rem);
  font-size: .8125rem;
  color: var(--labc-salvia);
}

.labc-franja__resp a { color: var(--labc-ambar); }

/* Aceptar y rechazar comparten fila, tamano y color. La AEPD pide que
   rechazar este al mismo nivel, no un paso por detras. */
.labc-franja__acciones {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--lab-e1, .5rem);
}

/* --------------------------------------------------------------------------
   Controles
   -------------------------------------------------------------------------- */

.labc-btn {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: .75rem 1.5rem;
  border: 0;
  border-radius: var(--labc-radio-md);
  background: var(--labc-ambar);
  color: var(--labc-verde-hondo);
  font: inherit;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  transition: background 170ms cubic-bezier(.2, 0, .2, 1);
}

.labc-btn:hover { background: var(--lab-ambar-halo, #f7d999); }

.labc-btn--verde {
  background: var(--labc-verde);
  color: var(--labc-hueso);
}

.labc-btn--verde:hover { background: var(--labc-verde-hondo); }

/* Terciario del sistema: texto con filete inferior de 2px en ambar. */
.labc-enlace {
  appearance: none;
  border: 0;
  background: none;
  padding: .375rem 0;
  font: inherit;
  color: inherit;
  border-bottom: 2px solid var(--labc-ambar);
  cursor: pointer;
}

.labc-enlace--claro { color: var(--labc-ambar-texto); }

.labc-btn:focus-visible,
.labc-enlace:focus-visible,
.labc-grupo__caja input:focus-visible + .labc-marca {
  outline: 2px solid var(--labc-ambar);
  outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   Segunda capa: panel de finalidades
   -------------------------------------------------------------------------- */

.labc-panel {
  width: min(38rem, calc(100vw - 2rem));
  max-height: min(85vh, 46rem);
  padding: 0;
  overflow: auto;
  border: 1px solid var(--labc-filete);
  border-radius: var(--labc-radio-md);
  background: var(--labc-hueso);
  color: var(--labc-tinta);
}

.labc-panel::backdrop { background: rgb(4 39 26 / .6); }

.labc-panel__cab {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--lab-e2, 1rem);
  padding: var(--lab-e3, 1.75rem) var(--lab-e3, 1.75rem) var(--lab-e2, 1rem);
  border-bottom: 1px solid var(--labc-filete);
}

.labc-panel__titulo {
  font-family: var(--labc-display);
  font-weight: 700;
  font-size: 1.625rem;
  line-height: 1.05;
}

.labc-panel__cerrar {
  appearance: none;
  border: 0;
  background: none;
  padding: .25rem;
  color: var(--labc-tinta);
  line-height: 0;
  cursor: pointer;
}

.labc-panel__cuerpo {
  padding: var(--lab-e2, 1rem) var(--lab-e3, 1.75rem);
  display: grid;
  gap: var(--lab-e2, 1rem);
}

.labc-panel__pie {
  position: sticky;
  bottom: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--lab-e1, .5rem);
  padding: var(--lab-e2, 1rem) var(--lab-e3, 1.75rem) var(--lab-e3, 1.75rem);
  background: var(--labc-hueso);
  border-top: 1px solid var(--labc-filete);
}

.labc-panel__nota {
  flex-basis: 100%;
  font-size: .8125rem;
  color: var(--labc-tinta-suave);
}

.labc-panel__nota a { color: var(--labc-ambar-texto); }

/* Una finalidad por bloque, separadas por filete. Nada de fila de tarjetas. */
.labc-grupo {
  padding-bottom: var(--lab-e2, 1rem);
  border-bottom: 1px solid var(--labc-filete);
}

.labc-grupo:last-child { padding-bottom: 0; border-bottom: 0; }

.labc-grupo__caja {
  display: flex;
  align-items: center;
  gap: .75rem;
  cursor: pointer;
}

.labc-grupo__caja input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  opacity: 0;
}

/* Casilla cuadrada. El sistema no tiene pildoras, asi que tampoco
   interruptores redondeados. */
.labc-marca {
  flex: 0 0 auto;
  position: relative;
  width: 1.25rem;
  height: 1.25rem;
  border: 1px solid var(--labc-filete);
  border-radius: var(--labc-radio);
  background: transparent;
}

.labc-grupo__caja input:checked + .labc-marca {
  border-color: var(--labc-ambar-texto);
  background: var(--labc-ambar);
}

.labc-grupo__caja input:checked + .labc-marca::after {
  content: "";
  position: absolute;
  inset: .25rem .3125rem;
  border: solid var(--labc-verde-hondo);
  border-width: 0 0 2px 2px;
  transform: rotate(-45deg);
}

.labc-grupo__caja input:disabled + .labc-marca {
  border-color: var(--labc-filete);
  background: var(--labc-filete);
}

.labc-grupo__caja input:disabled + .labc-marca::after { border-color: var(--labc-hueso); }

.labc-grupo__nombre { font-weight: 600; }

.labc-grupo__fija {
  font-weight: 400;
  font-size: .8125rem;
  color: var(--labc-tinta-suave);
}

.labc-grupo__texto,
.labc-grupo__quien {
  margin-top: var(--lab-e1, .5rem);
  padding-left: 2rem;
  color: var(--labc-tinta-suave);
}

.labc-grupo__quien { margin-top: .25rem; font-size: .8125rem; }

/* --------------------------------------------------------------------------
   Hueco de tercero sin permiso

   Sustituye al contenido externo mientras no hay consentimiento. El boton lo
   carga solo en esta visita, que es accion inequivoca de la persona.
   Suelo crema, que en el sistema es el tono de panel y cuadro de aviso.
   -------------------------------------------------------------------------- */

.labc-hueco {
  display: grid;
  gap: var(--lab-e1, .5rem);
  justify-items: start;
  padding: var(--lab-e2, 1rem);
  border: 1px solid var(--labc-filete);
  border-radius: var(--labc-radio);
  background: var(--labc-crema);
  color: var(--labc-tinta);
  font-family: var(--labc-texto);
  font-size: 0.9375rem;
}

.labc-hueco__texto { color: var(--labc-tinta-suave); max-width: 56ch; }

.labc-hueco__acciones {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--lab-e1, .5rem);
}

/* --------------------------------------------------------------------------
   Tabla de cookies de la politica

   Fuente unica: se pinta desde el mismo inventario que usa el bloqueo, para
   que la politica no se desvie de lo que la web carga de verdad.
   -------------------------------------------------------------------------- */

.labc-tabla {
  width: 100%;
  border-collapse: collapse;
  margin-top: var(--lab-e2, 1rem);
  font-size: .9375rem;
  font-variant-numeric: tabular-nums;
}

.labc-tabla caption {
  text-align: left;
  font-family: var(--labc-display);
  font-weight: 700;
  font-size: 1.25rem;
  margin-bottom: var(--lab-e1, .5rem);
}

.labc-tabla th,
.labc-tabla td {
  text-align: left;
  vertical-align: top;
  padding: .5rem .75rem .5rem 0;
  border-bottom: 1px solid var(--labc-filete);
}

.labc-tabla thead th { font-weight: 600; white-space: nowrap; }

.labc-tabla tbody th {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .875rem;
  font-weight: 400;
}

@media (max-width: 47.99rem) {
  .labc-tabla thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
  }

  .labc-tabla tbody tr {
    display: grid;
    gap: .125rem;
    padding: .75rem 0;
    border-bottom: 1px solid var(--labc-filete);
  }

  .labc-tabla tbody th,
  .labc-tabla tbody td { border: 0; padding: 0; }

  .labc-tabla tbody td::before {
    content: attr(data-th) ": ";
    color: var(--labc-tinta-suave);
  }
}

/* Mientras la franja pide permiso, la barra fija de movil se aparta: dos
   elementos fijos en el mismo borde se tapan el uno al otro. */
body.labc-preguntando .lab-barra { display: none; }