/* ==========================================================================
   AVISO DE COOKIES
   Barra inferior, no modal a pantalla completa: el aviso no debe secuestrar
   la página. La persona puede seguir leyendo y decidir cuando quiera.
   ========================================================================== */

.aviso-cookies {
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 3000;

  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 18px 24px;

  max-width: 1080px;
  margin: 0 auto;
  padding: 20px 24px;

  border: 1px solid var(--border-color, #e2e8f0);
  border-radius: 16px;
  background: var(--bg-card, #ffffff);
  box-shadow: 0 20px 50px -12px rgba(0, 0, 0, .35);

  /* Entra desde abajo. Se anima solo transform y opacity, que no obligan al
     navegador a recalcular la maquetación. */
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .25s ease, transform .25s ease;

  /* En móviles con notch, para que no quede debajo de la barra del sistema. */
  margin-bottom: env(safe-area-inset-bottom, 0px);
}

.aviso-cookies.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.aviso-cookies__texto {
  flex: 1 1 320px;
  /* Sin esto un texto largo no deja encoger al contenedor flex y los botones
     se salen de la caja. */
  min-width: 0;
}

.aviso-cookies__titulo {
  margin: 0 0 6px;
  font-family: var(--font-heading, 'Montserrat', sans-serif);
  font-size: 1rem;
  font-weight: 700;
  color: var(--text-title, #0f172a);
}

.aviso-cookies__cuerpo {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.6;
  color: var(--text-main, #334155);
  text-wrap: pretty;
}

.aviso-cookies__cuerpo a {
  color: var(--brand-blue-text, #1d737d);
  text-underline-offset: 3px;
}

.aviso-cookies__acciones {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  flex-shrink: 0;
}

.aviso-cookies__btn {
  min-height: 44px;
  padding: 0 24px;
  border-radius: 999px;
  font-size: 0.9rem;
  font-weight: 700;
  cursor: pointer;
  transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
}

.aviso-cookies__btn:active { transform: translateY(1px); }

.aviso-cookies__btn:focus-visible {
  outline: 3px solid var(--brand-blue, #2699A6);
  outline-offset: 3px;
}

/* Aceptar y rechazar tienen el MISMO tamaño y el mismo contraste de texto.
   Solo cambia el relleno. Un «rechazar» en gris claro o más pequeño hace que
   rechazar cueste más que aceptar, y eso vicia el consentimiento: deja de ser
   libre. Es un requisito, no una preferencia estética. */
.aviso-cookies__btn--si {
  border: 2px solid var(--brand-blue-contrast, #0b5d67);
  background: var(--brand-blue-contrast, #0b5d67);
  color: #ffffff;
}

.aviso-cookies__btn--si:hover {
  background: var(--brand-blue, #2699A6);
  border-color: var(--brand-blue, #2699A6);
}

.aviso-cookies__btn--no {
  border: 2px solid var(--brand-blue-contrast, #0b5d67);
  background: transparent;
  color: var(--brand-blue-contrast, #0b5d67);
}

.aviso-cookies__btn--no:hover {
  background: var(--brand-blue-light, rgba(38, 153, 166, .12));
}

[data-theme="dark"] .aviso-cookies__btn--no {
  border-color: #8ab4f8;
  color: #8ab4f8;
}

[data-theme="dark"] .aviso-cookies__btn--si {
  border-color: #2699A6;
  background: #2699A6;
}

@media (max-width: 720px) {
  .aviso-cookies {
    left: 10px;
    right: 10px;
    bottom: 10px;
    padding: 18px;
    gap: 14px;
  }

  /* Los botones ocupan el ancho y quedan uno junto a otro, del mismo tamaño. */
  .aviso-cookies__acciones { width: 100%; }
  .aviso-cookies__btn { flex: 1 1 0; padding: 0 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .aviso-cookies { transition: opacity .2s ease; transform: none; }
  .aviso-cookies.is-visible { transform: none; }
}

/* Enlace del pie que reabre el aviso: se ve como los demás enlaces del pie,
   no como un botón, porque ahí vive entre enlaces. */
.footer-cookies-btn {
  border: 0;
  background: none;
  padding: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  text-align: left;
}

.footer-cookies-btn:hover { text-decoration: underline; }

/* Mientras no es visible no debe capturar clics: si por lo que sea se quedara
   en opacidad 0, seguiría siendo una barra invisible sobre la parte baja de la
   página y se comería los clics de lo que hay debajo. */
.aviso-cookies { pointer-events: none; }
.aviso-cookies.is-visible { pointer-events: auto; }
