/* gtcookies — banner de consentimiento */
#gtc-root, #gtc-root *, #gtc-float { box-sizing: border-box; }
:root { --gtc-accent: #A9743F; --gtc-radius: 16px; }

#gtc-root[hidden], #gtc-float[hidden] { display: none !important; }
/* El contenedor tiene que estar visible para pintar el panel de preferencias, pero
   el banner de primera capa no debe volver a asomar a quien ya decidió. */
#gtc-root.gtc-no-banner .gtc-banner { display: none !important; }
body.gtc-lock { overflow: hidden; }

/* ── Banner (primera capa) ─────────────────────────────────────── */
.gtc-banner {
	position: fixed; z-index: 99999;
	/* 460px: con 420 los tres botones iguales no daban para «Rechazar todas» en una
	   línea y partían en dos. Sigue siendo una caja discreta en la esquina. */
	width: 460px; max-width: calc(100vw - 32px);
	padding: 22px 22px 20px;
	border-radius: var(--gtc-radius);
	box-shadow: 0 18px 60px rgba(0,0,0,.28), 0 2px 8px rgba(0,0,0,.12);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Inter, sans-serif;
	font-size: 14px; line-height: 1.55;
	animation: gtc-in .45s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes gtc-in { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
/* Al aparecer, el banner recibe el foco para que lo anuncie el lector de pantalla.
   Eso pinta el anillo azul del navegador alrededor de toda la caja, que no aporta
   nada —el contenedor no es un control— y queda feo. Los botones de dentro sí
   conservan el suyo. */
#gtc-banner:focus { outline: none !important; }
/* Sin transform: para las posiciones que ya se colocan con translate, animar el
   transform anulaba el centrado y la caja se salía de la pantalla. */
@keyframes gtc-fade { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .gtc-banner, .gtc-modal-box { animation: none !important; } }

.gtc-pos-bottom-left .gtc-banner { left: 16px; bottom: 16px; }
.gtc-pos-bottom .gtc-banner { left: 50%; bottom: 16px; transform: translateX(-50%); animation-name: gtc-fade; }
.gtc-pos-center .gtc-banner { left: 50%; top: 50%; transform: translate(-50%,-50%); animation-name: gtc-fade; }

/* Barra a lo ancho */
.gtc-layout-bar .gtc-banner {
	left: 0; right: 0; bottom: 0; width: 100%; max-width: 100%;
	border-radius: 0; display: flex; align-items: center; gap: 28px;
	padding: 18px 28px; transform: none;
}
.gtc-layout-bar .gtc-banner-text { flex: 1; }
.gtc-layout-bar .gtc-banner-actions { margin-top: 0; flex-shrink: 0; }

.gtc-banner-title { display: block; font-size: 15px; font-weight: 700; margin-bottom: 6px; }
.gtc-banner-text p { margin: 0; }
.gtc-banner-text a, .gtc-modal a { color: var(--gtc-accent); text-decoration: underline; text-underline-offset: 2px; transition: color .2s, filter .2s; }
.gtc-banner-text a:hover, .gtc-modal a:hover { filter: brightness(1.18); }
/* Enlaces accesibles sobre tema oscuro: acento aclarado (se adapta a cualquier color) */
.gtc-theme-dark .gtc-banner-text a, .gtc-theme-dark .gtc-modal a { color: #cfe6ad; color: color-mix(in srgb, var(--gtc-accent) 52%, #fff); }
.gtc-theme-dark .gtc-banner-text a:hover, .gtc-theme-dark .gtc-modal a:hover { color: #fff; filter: none; }

/* Los tres botones comparten fila, ancho y alto exactos: el grid reparte el
   espacio a partes iguales y «stretch» iguala la altura aunque una etiqueta
   larga parta línea. Hasta la 1.3.2 «Configurar» llevaba grid-column: 1 / -1
   y salía al doble de ancho que los otros dos, y además con otro estilo. */
.gtc-banner-actions {
	display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 10px !important; margin-top: 18px;
}

/* ── Botones ───────────────────────────────────────────────────────────────────
   TODO lo que define la caja y la tipografía va con !important, y no por gusto.
   Este CSS se carga en webs ajenas: un kit de Elementor pinta sus botones con
   selectores como «.elementor-kit-7 button», que pesan más que un simple .gtc-btn
   y le imponen su font-size, su padding y —lo que de verdad rompía— un
   white-space: nowrap. Con eso el texto ni encogía ni partía línea: «Rechazar
   todas» se salía del botón y se cortaba contra el borde del banner.
   Es la misma lección que ya llevaba .gtc-x más abajo. */
.gtc-btn {
	font-family: inherit !important;
	font-size: 13.5px !important; font-weight: 600 !important; line-height: 1.25 !important;
	text-transform: none !important; letter-spacing: normal !important;
	cursor: pointer; border-radius: 12px;
	padding: 11px 10px !important; margin: 0 !important;
	border: 1.5px solid transparent !important; outline: none !important; box-shadow: none !important; text-decoration: none !important;
	transition: transform .2s, background .2s, border-color .2s, filter .2s;
	/* flex + min-height: el texto queda centrado y todos miden lo mismo de alto
	   aunque uno parta en dos líneas. 44px es el objetivo táctil mínimo (WCAG 2.5.8). */
	display: flex !important; align-items: center !important; justify-content: center !important;
	text-align: center !important;
	min-height: 44px !important; height: auto !important;
	min-width: 0 !important; max-width: none !important;
	white-space: normal !important; overflow-wrap: break-word !important; word-break: normal !important;
	hyphens: auto; overflow: visible !important; text-overflow: clip !important;
}
.gtc-btn:focus-visible { outline: 2px solid var(--gtc-accent) !important; outline-offset: 2px; }
.gtc-btn-equal { width: 100% !important; flex: initial !important; }

/* Configurar / Rechazar / Guardar / Aceptar: idénticos en color y en peso visual.
   Ninguna opción destaca sobre otra (Directrices 03/2022 del CEPD sobre patrones
   engañosos; ap. 3.2 de la Guía de cookies de la AEPD). */
.gtc-accept, .gtc-reject, .gtc-save, .gtc-prefs-open {
	background: var(--gtc-accent) !important; color: var(--gtc-accent-ink, #fff) !important; border-color: var(--gtc-accent) !important;
}
.gtc-accept:hover, .gtc-reject:hover, .gtc-save:hover, .gtc-prefs-open:hover { filter: brightness(1.08); transform: translateY(-1px); }

/* ── Temas ─────────────────────────────────────────────────────── */
.gtc-theme-dark .gtc-banner, .gtc-theme-dark .gtc-modal-box { background: #1b1b1d; color: #f3f1ec; }
.gtc-theme-light .gtc-banner, .gtc-theme-light .gtc-modal-box { background: #fff; color: #1c1c1e; }

/* ── Modal de preferencias ─────────────────────────────────────── */
.gtc-modal[hidden] { display: none; }
.gtc-modal { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: center; justify-content: center; padding: 20px; }
.gtc-overlay { position: absolute; inset: 0; background: rgba(8,6,4,.55); backdrop-filter: blur(2px); }
.gtc-modal-box {
	position: relative; width: 600px; max-width: 100%; max-height: 88vh; overflow: hidden;
	border-radius: var(--gtc-radius); display: flex; flex-direction: column;
	box-shadow: 0 24px 80px rgba(0,0,0,.4);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Inter, sans-serif; font-size: 14px;
	animation: gtc-in .35s cubic-bezier(.2,.8,.2,1) both;
}
.gtc-modal-head { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px; border-bottom: 1px solid rgba(128,128,128,.18); font-size: 16px; }
/* X cerrar: glifo oculto, × dibujada con pseudo-elementos (centrada al pixel) — roja en reposo, hover = círculo rojo + × blanca + giro. Box props !important = inmune al CSS de botones de cualquier tema. */
.gtc-x { position: relative !important; display: flex !important; align-items: center; justify-content: center; width: 36px !important; height: 36px !important; min-width: 0 !important; flex: 0 0 auto; padding: 0 !important; margin: 0 !important; background: rgba(128,128,128,.12) !important; border: 0 !important; border-radius: 50% !important; font-size: 0 !important; line-height: 0 !important; color: transparent !important; cursor: pointer; opacity: 1; box-shadow: none !important; text-shadow: none; transition: background .25s, transform .35s cubic-bezier(.2,.8,.2,1); }
.gtc-x::before, .gtc-x::after { content: ""; position: absolute; top: 50%; left: 50%; width: 16px; height: 2px; margin: -1px 0 0 -8px; border-radius: 2px; background: #e34b4b; transition: background .25s; }
.gtc-x::before { transform: rotate(45deg); }
.gtc-x::after { transform: rotate(-45deg); }
.gtc-x:hover { background: #e34b4b !important; transform: rotate(90deg); }
.gtc-x:hover::before, .gtc-x:hover::after { background: #fff; }
.gtc-x:focus { outline: none !important; }
.gtc-x:focus-visible { outline: 2px solid var(--gtc-accent) !important; outline-offset: 2px; }
.gtc-theme-dark .gtc-x { background: rgba(243,241,236,.10) !important; }
.gtc-modal-body { padding: 10px 22px; overflow-y: auto; }
.gtc-modal-policy { margin: 0; padding: 14px 22px 0; font-size: 13px; }
.gtc-modal-foot { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 10px !important; padding: 16px 22px; border-top: 1px solid rgba(128,128,128,.18); }

.gtc-cat { padding: 16px 0; border-bottom: 1px solid rgba(128,128,128,.14); }
.gtc-cat:last-child { border-bottom: 0; }
.gtc-cat-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.gtc-cat-name { font-weight: 700; font-size: 15px; }
/* El fondo sale del acento configurado, no de un marrón fijo. */
.gtc-tag { font-size: 11px; font-weight: 600; padding: 3px 8px; border-radius: 999px; background: rgba(128,128,128,.18); background: color-mix(in srgb, var(--gtc-accent) 18%, transparent); color: var(--gtc-accent); margin-left: 8px; }
.gtc-theme-dark .gtc-tag { color: #cfe6ad; color: color-mix(in srgb, var(--gtc-accent) 52%, #fff); }
.gtc-cat-desc { margin: 8px 0 0; opacity: .8; }

/* Interruptor */
.gtc-switch { position: relative; display: inline-block; width: 46px; height: 26px; flex-shrink: 0; }
.gtc-switch input { opacity: 0; width: 0; height: 0; }
.gtc-slider { position: absolute; inset: 0; cursor: pointer; background: #b9b9bb; border-radius: 999px; transition: .25s; }
.gtc-slider::before { content: ""; position: absolute; height: 20px; width: 20px; left: 3px; top: 3px; background: #fff; border-radius: 50%; transition: .25s; box-shadow: 0 1px 3px rgba(0,0,0,.25); }
.gtc-switch input:checked + .gtc-slider { background: var(--gtc-accent); }
.gtc-switch input:checked + .gtc-slider::before { transform: translateX(20px); }
.gtc-switch input:disabled + .gtc-slider { opacity: .55; cursor: not-allowed; }
/* La casilla real es invisible (opacity 0): sin esto, al llegar con el tabulador no
   se vería dónde está el foco (WCAG 2.4.7). */
.gtc-switch input:focus-visible + .gtc-slider { outline: 2px solid var(--gtc-accent); outline-offset: 3px; }
.gtc-switch:has(> input:disabled) { display: none; } /* "Siempre activas": basta el tag, sin interruptor */

.gtc-details { margin-top: 12px; }
.gtc-details summary { cursor: pointer; font-size: 13px; color: var(--gtc-accent); transition: filter .2s; }
.gtc-details summary:hover { text-decoration: underline; text-underline-offset: 2px; filter: brightness(1.12); }
.gtc-theme-dark .gtc-details summary { color: #cfe6ad; color: color-mix(in srgb, var(--gtc-accent) 52%, #fff); }
.gtc-theme-dark .gtc-details summary:hover { color: #fff; filter: none; }
.gtc-table-wrap { overflow-x: auto; margin-top: 10px; }
.gtc-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.gtc-table th, .gtc-table td { text-align: left; padding: 7px 10px; border-bottom: 1px solid rgba(128,128,128,.16); vertical-align: top; }
.gtc-table th { font-weight: 600; opacity: .7; }
.gtc-table code { font-size: 12px; background: rgba(128,128,128,.14); padding: 1px 5px; border-radius: 4px; }

/* ── Botón flotante ────────────────────────────────────────────── */
.gtc-float {
	position: fixed; left: 16px; bottom: 16px; z-index: 99998;
	width: 46px; height: 46px; border-radius: 50%; border: 0; cursor: pointer;
	display: flex; align-items: center; justify-content: center;
	box-shadow: 0 6px 20px rgba(0,0,0,.25); transition: transform .2s;
}
.gtc-float:hover { transform: scale(1.08); }
.gtc-float.gtc-theme-dark { background: #1b1b1d; color: #f3f1ec; }
.gtc-float.gtc-theme-light { background: #fff; color: #1c1c1e; border: 1px solid #e2e2e0; }

/* ── Política de cookies (shortcode) ───────────────────────────── */
/* Colores neutros (rgba grises + currentColor) → se adapta al tema/acento de cada web. */
.gtc-policy { font-size: 16px; line-height: 1.75; }
.gtc-policy > :first-child { margin-top: 0; }
.gtc-policy h2 { font-size: 1.5em; font-weight: 700; line-height: 1.25; letter-spacing: -.01em; margin: 2.4em 0 .55em; padding-bottom: .35em; border-bottom: 1px solid rgba(128,128,128,.18); }
.gtc-policy h3 { font-size: 1.12em; font-weight: 700; line-height: 1.3; margin: 1.6em 0 .45em; }
.gtc-policy p { margin: 0 0 1.05em; }
.gtc-policy ul, .gtc-policy ol { margin: 0 0 1.2em 1.25em; padding: 0; }
.gtc-policy li { margin: 0 0 .45em; }
.gtc-policy a { color: var(--gtc-accent); text-decoration: underline; text-underline-offset: 2px; }
.gtc-policy a:hover { text-decoration-thickness: 2px; }
.gtc-policy code { font-size: .86em; background: rgba(128,128,128,.14); padding: 2px 6px; border-radius: 5px; word-break: break-word; }

/* Tablas: contenedor redondeado + scroll horizontal en móvil */
.gtc-policy .gtc-table-wrap { overflow-x: auto; margin: 16px 0 28px; border: 1px solid rgba(128,128,128,.2); border-radius: 12px; -webkit-overflow-scrolling: touch; }
.gtc-policy table, .gtc-policy .gtc-table { width: 100%; border-collapse: collapse; font-size: .9em; margin: 0; }
.gtc-policy th, .gtc-policy td { padding: 12px 15px; text-align: left; vertical-align: top; border-bottom: 1px solid rgba(128,128,128,.14); }
.gtc-policy tbody tr:last-child > * { border-bottom: 0; }
.gtc-policy thead th { background: rgba(128,128,128,.09); font-weight: 700; white-space: nowrap; }
/* zebra solo en las tablas de cookies */
.gtc-policy .gtc-cookie-table tbody tr:nth-child(even) { background: rgba(128,128,128,.04); }
/* tabla responsable (clave / valor) */
.gtc-policy .gtc-responsable th { width: 210px; background: rgba(128,128,128,.05); font-weight: 600; white-space: nowrap; }
.gtc-policy .gtc-responsable td { font-weight: 400; }
@media (max-width: 560px) { .gtc-policy .gtc-responsable th { width: 120px; white-space: normal; } .gtc-policy th, .gtc-policy td { padding: 10px 12px; } }

.gtc-policy .gtc-empty { opacity: .65; font-style: italic; }
.gtc-policy .gtc-open-prefs { cursor: pointer; border: 0 !important; background: var(--gtc-accent) !important; color: var(--gtc-accent-ink, #fff) !important; border-radius: 10px; padding: 12px 22px; font: inherit; font-weight: 600; text-decoration: none !important; transition: filter .2s, transform .2s; }
.gtc-policy .gtc-open-prefs:hover { filter: brightness(1.08); transform: translateY(-1px); }

/* ── Responsive ────────────────────────────────────────────────── */
@media (max-width: 600px) {
	.gtc-banner { left: 12px !important; right: 12px; bottom: 12px; width: auto; max-width: none; transform: none !important; }
	.gtc-layout-bar .gtc-banner { flex-direction: column; align-items: stretch; gap: 14px; }
	.gtc-banner-actions { margin-top: 14px; grid-template-columns: 1fr !important; }
	.gtc-modal-foot { grid-template-columns: 1fr !important; }
}

/* ── Enlace permanente de retirada del consentimiento (v1.3.1) ──────────────
   Se muestra cuando el botón flotante está desactivado, para que SIEMPRE exista una
   forma de reabrir las preferencias (art. 7.3 RGPD).

   OJO: este bloque se imprime en wp_footer, colgando del <body>, FUERA del footer del
   tema. Por eso no puede heredar estilos: hay que fijarlos aquí o el botón sale con el
   color de enlace por defecto (un rosa #c36) y desbordando el ancho en móvil. */
.gtc-footer-link{
  display:block;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  margin:0;
  padding:10px 16px 16px;
  text-align:center;
  background:transparent;
  line-height:1.4;
}
.gtc-footer-link .gtc-link-btn{
  display:inline-block;
  max-width:100%;
  background:none !important;
  border:0 !important;
  box-shadow:none !important;
  margin:0;
  padding:6px 10px;
  font-family:inherit;
  font-size:14px !important;
  font-weight:500;
  line-height:1.4;
  /* Hereda el color del pie del tema: un gris fijo se quedaba en 3,4:1 sobre fondo
     claro (y peor sobre oscuro). Retirar el consentimiento tiene que ser tan fácil
     de encontrar como darlo (art. 7.3 RGPD). */
  color:currentColor !important;
  opacity:.85;
  text-decoration:underline;
  text-underline-offset:2px;
  cursor:pointer;
  border-radius:4px;
  -webkit-appearance:none;
  appearance:none;
}
.gtc-footer-link .gtc-link-btn:hover,
.gtc-footer-link .gtc-link-btn:focus-visible{ opacity:1; text-decoration-thickness:2px; }
.gtc-footer-link .gtc-link-btn:focus-visible{ outline:2px solid currentColor; outline-offset:2px; }
