/*
 * Ecope — aviso de cookies como modal centrado, sobre GDPR Cookie Compliance (Moove) 5.x.
 * Solo presentación: no cambia la lógica del plugin. Todo va bajo html.ecm-on, que pone ecm.js
 * cuando el modal está activo (modo 'on', o 'preview' con ?ecm_preview=1) y la barra existe:
 * sin JS o fuera de preview, la barra de Moove se queda como estaba.
 *
 * Colores: NINGUNO de marca. Fondo de tarjeta, texto y botones salen del esquema (light/dark) y del
 * color primario configurados en Moove; aquí solo se toca tamaño, posición y capas.
 *
 * Capas (z-index): fondo 9980 < tarjeta 9985 < panel de Ajustes de Moove 9990/9992.
 * Clases que pone ecm.js en <html>: ecm-on (activo) · ecm-lock (bloqueando) · ecm-legal (página legal).
 */

/* Gotcha Moove: oculta la barra con bottom:-400px (sin !important); como aquí se fija la posición con
   !important, hay que ocultarla de forma explícita o Aceptar/Rechazar no la cierran. */
html.ecm-on #moove_gdpr_cookie_info_bar.moove-gdpr-info-bar-hidden {
  display: none !important;
}

/* Tarjeta centrada. */
html.ecm-on body #moove_gdpr_cookie_info_bar {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  transform: translate(-50%, -50%) !important;
  width: min(520px, calc(100% - 32px)) !important;
  max-width: none !important;
  min-height: 0 !important;
  max-height: calc(100vh - 32px) !important;
  max-height: calc(100dvh - 32px) !important;
  margin: 0 !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  border: 0 !important;
  border-radius: 16px !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.45) !important;
  z-index: 9985 !important;
  transition: none !important;
  outline: none;
}

/* Página legal: la misma tarjeta anclada abajo, sin fondo ni bloqueo (se puede leer la política).
   overscroll auto (en el modal es contain): con la rueda o el dedo sobre la tarjeta, el scroll pasa a la
   página; con contain se quedaba en la tarjeta (sin nada que desplazar) y la página no se movía. */
html.ecm-on.ecm-legal body #moove_gdpr_cookie_info_bar {
  top: auto !important;
  bottom: 16px !important;
  transform: translateX(-50%) !important;
  max-height: calc(70vh - 16px) !important;
  max-height: calc(70dvh - 16px) !important;
  overscroll-behavior: auto;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3) !important;
}

html.ecm-on body #moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  padding: 28px 24px 24px !important;
}

html.ecm-on body #moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container .moove-gdpr-info-bar-content {
  display: block !important;
  max-width: none !important;
  padding: 0 !important;
  text-align: left !important;
}

html.ecm-on body #moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container .moove-gdpr-info-bar-content .moove-gdpr-cookie-notice {
  margin: 0 0 20px !important;
  padding: 0 !important;
}

html.ecm-on body #moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container .moove-gdpr-info-bar-content p {
  font-size: 15px !important;
  line-height: 1.55 !important;
  margin: 0 0 8px !important;
}

/* Botones: Aceptar y Rechazar con la misma caja, la misma letra y el mismo peso (criterio AEPD).
   Colores: los de Moove (primario para Aceptar/Rechazar, contorno para Ajustes). */
html.ecm-on body #moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container .moove-gdpr-info-bar-content .moove-gdpr-button-holder {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  padding: 0 !important;
  margin: 0 !important;
}

html.ecm-on body #moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container .moove-gdpr-info-bar-content .moove-gdpr-button-holder .mgbutton {
  flex: 1 1 0 !important;
  min-width: 140px !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 12px 20px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-align: center !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  border: 0 !important;
  border-radius: 150px !important;
}

html.ecm-on body #moove_gdpr_cookie_info_bar .moove-gdpr-button-holder .mgbutton.moove-gdpr-infobar-allow-all,
html.ecm-on body #moove_gdpr_cookie_info_bar .moove-gdpr-button-holder .mgbutton.moove-gdpr-infobar-reject-btn {
  box-shadow: none !important;
  opacity: 1 !important;
}

/* Ajustes con foco: Moove lo pinta con fondo #000 y su texto al 70 % (en esquema claro, gris sobre gris).
   Se le da el mismo aspecto que Moove usa en hover para cada esquema. */
html.ecm-on body #moove_gdpr_cookie_info_bar .moove-gdpr-button-holder .mgbutton.moove-gdpr-infobar-settings-btn:focus {
  background-color: #202020 !important;
  color: #fff !important;
  opacity: 1 !important;
  box-shadow: none !important;
}
html.ecm-on body #moove_gdpr_cookie_info_bar.moove-gdpr-dark-scheme .moove-gdpr-button-holder .mgbutton.moove-gdpr-infobar-settings-btn:focus {
  background-color: #fff !important;
  color: #202020 !important;
}

/* Foco visible con el color de texto del esquema. */
html.ecm-on body #moove_gdpr_cookie_info_bar .mgbutton:focus-visible,
html.ecm-on body #moove_gdpr_cookie_info_bar a:focus-visible,
html.ecm-on body #moove_gdpr_cookie_info_bar button.change-settings-button:focus-visible {
  outline: 2px solid #202020 !important;
  outline-offset: 3px !important;
}
html.ecm-on body #moove_gdpr_cookie_info_bar.moove-gdpr-dark-scheme .mgbutton:focus-visible,
html.ecm-on body #moove_gdpr_cookie_info_bar.moove-gdpr-dark-scheme a:focus-visible,
html.ecm-on body #moove_gdpr_cookie_info_bar.moove-gdpr-dark-scheme button.change-settings-button:focus-visible {
  outline-color: #fff !important;
}

/* Sin "X" de cierre: hay que elegir (si alguien la activa en Moove, sigue oculta). */
html.ecm-on body #moove_gdpr_cookie_info_bar .moove-gdpr-infobar-close-btn,
html.ecm-on body #moove_gdpr_cookie_info_bar .moove-gdpr-close-cookie-popup {
  display: none !important;
}

/* Fondo a pantalla completa, sin manejadores de cierre (ecm.js además se come los clics). */
#ecm-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9980;
  background: rgba(10, 14, 18, 0.62);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
  /* Táctil: sin desplazar la página de detrás, pero con zoom de dos dedos (accesibilidad). */
  touch-action: pinch-zoom;
}

html.ecm-on.ecm-lock #ecm-overlay {
  display: block;
}

/* Scroll bloqueado mientras se decide. */
html.ecm-on.ecm-lock,
html.ecm-on.ecm-lock body {
  overflow: hidden !important;
  overscroll-behavior: none !important;
}

/* Flotantes que quedarían por encima del fondo o del panel de Ajustes (chatbots, WhatsApp, traductor,
   volver arriba): fuera mientras se decide y con el panel de Moove abierto
   (html.gdpr_lightbox-active / body.moove_gdpr_overflow). Lista de conocidos + .ecm-hidden-float,
   que pone ecm.js a lo que de verdad tape (prueba de impacto con elementFromPoint).
   OneTap (accesibilidad) NO va aquí: en escritorio no tapa la tarjeta y quien lo necesita para leer
   tiene que poder usarlo; solo se quita en móvil (bloque de abajo). */
html.ecm-on:is(.ecm-lock, .gdpr_lightbox-active) :is(.ecm-hidden-float, #ht-ctc-chat, .ht-ctc-chat, .joinchat, .gtranslate_wrapper, .gt_float_switcher, #wpfront-scroll-top-container, .hfe-scroll-to-top-wrap, [class*="buttonizer"], #eco-fab, #eco-popup, #eco-tooltip),
html.ecm-on body.moove_gdpr_overflow :is(.ecm-hidden-float, #ht-ctc-chat, .ht-ctc-chat, .joinchat, .gtranslate_wrapper, .gt_float_switcher, #wpfront-scroll-top-container, .hfe-scroll-to-top-wrap, [class*="buttonizer"], #eco-fab, #eco-popup, #eco-tooltip),
html.ecm-on .ecm-hidden-float {
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* OneTap en móvil: su botón cae encima de la tarjeta. Mismo ancho que ONETAP_MAX en ecm.js. */
@media (max-width: 640px) {
  html.ecm-on:is(.ecm-lock, .gdpr_lightbox-active) :is(.onetap-container-toggle, .onetap-toggle),
  html.ecm-on body.moove_gdpr_overflow :is(.onetap-container-toggle, .onetap-toggle) {
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }
}

/* visibility la puede reabrir un hijo con visibility:visible: cortarlo también. */
html.ecm-on .ecm-hidden-float * {
  visibility: hidden !important;
}

/* Red de seguridad: la tarjeta nunca hereda ese ocultado. */
html.ecm-on #moove_gdpr_cookie_info_bar {
  visibility: visible !important;
}

@media (max-width: 420px) {
  html.ecm-on body #moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container {
    padding: 22px 18px 18px !important;
  }
  html.ecm-on body #moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container .moove-gdpr-info-bar-content .moove-gdpr-button-holder .mgbutton {
    flex-basis: 100% !important;
  }
}

@media (prefers-reduced-motion: no-preference) {
  html.ecm-on.ecm-lock #ecm-overlay {
    animation: ecm-fade 0.2s ease-out;
  }
}

@keyframes ecm-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* Alto contraste (Windows): el fondo de la tarjeta y de los botones desaparece, y con el border:0 de
   arriba no se verían sus bordes. Mismos selectores (gana por ir después). */
@media (forced-colors: active) {
  html.ecm-on body #moove_gdpr_cookie_info_bar {
    border: 1px solid CanvasText !important;
  }
  html.ecm-on body #moove_gdpr_cookie_info_bar .moove-gdpr-info-bar-container .moove-gdpr-info-bar-content .moove-gdpr-button-holder .mgbutton {
    border: 1px solid ButtonText !important;
  }
}