/* ============================================================
 * cookies.css — Banner de consentimiento (self-hosted, CSP 'self').
 * Barra inferior NO bloqueante. Usa las variables de marca de petunia.css
 * (--brand, --brand-dark, --ink, --bg, --accent) con fallbacks.
 * Aceptar y Rechazar tienen el MISMO peso visual (requisito AEPD).
 * ============================================================ */
.cookie-banner {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 9999;
  display: flex;
  justify-content: center;
  padding: 12px;
  box-sizing: border-box;
  pointer-events: none; /* la barra transparente no captura clics; sí la caja */
}
.cookie-banner[hidden] { display: none; }

.cookie-box {
  pointer-events: auto;
  width: 100%;
  max-width: 720px;
  background: var(--bg, #ffffff);
  color: var(--ink, #1a1a1a);
  border: 1px solid rgba(0, 0, 0, .12);
  border-radius: 14px;
  box-shadow: 0 8px 30px rgba(0, 0, 0, .18);
  padding: 16px 18px;
}
.cookie-box:focus { outline: none; }

.cookie-title { margin: 0 0 .4rem; font-size: 1.05rem; }
.cookie-desc { margin: 0 0 .8rem; font-size: .9rem; line-height: 1.45; }
.cookie-desc a { color: var(--brand, #0a7a5a); }

.cookie-config { margin: 0 0 .8rem; display: flex; flex-direction: column; gap: .55rem; }
.cookie-config[hidden] { display: none; }
.cookie-cat { display: flex; gap: .55rem; align-items: flex-start; font-size: .85rem; line-height: 1.4; }
.cookie-cat input { margin-top: .2rem; flex: 0 0 auto; }

.cookie-actions { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: flex-end; }
.cookie-btn {
  font: inherit;
  font-size: .9rem;
  font-weight: 600;
  cursor: pointer;
  padding: .55rem 1.05rem;
  border-radius: 10px;
  border: 1px solid transparent;
  line-height: 1.1;
}
/* Aceptar y Rechazar: idénticos (mismo tamaño, color y prominencia). */
.cookie-accept, .cookie-reject {
  background: var(--brand, #0a7a5a);
  color: #fff;
  border-color: var(--brand, #0a7a5a);
}
/* Configurar / Guardar: secundarios (outline), pero perfectamente visibles. */
.cookie-ghost {
  background: transparent;
  color: var(--ink, #222);
  border-color: rgba(0, 0, 0, .28);
}
.cookie-btn:hover { opacity: .92; }
.cookie-btn:focus-visible { outline: 2px solid var(--accent, #f5a623); outline-offset: 2px; }

/* Enlace-botón "Preferencias de cookies" (footer, aviso legal). */
.cookie-prefs-link {
  background: none; border: 0; padding: 0; margin: 0;
  font: inherit; color: inherit; text-decoration: none; cursor: pointer;
}

@media (max-width: 520px) {
  .cookie-actions { justify-content: stretch; }
  .cookie-btn { flex: 1 1 auto; }
}
