:root {}

/* =========================================================
   CookieConsent v3 overrides — ARCHIVObyPau
   - Banner: pill slim (desktop bottom-right, mobile centered 92%)
   - Modal preferencias: SIEMPRE visible (fix crítico)
   ========================================================= */

#cc-main {
  --cc-font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --cc-z-index: 9999999;

  --cc-bg: #1a1a1a;
  --cc-text: #ffffff;

  /* Buttons radius = mismo que botón “Auditoría” (8px en la web) */
  --cc-btn-border-radius: 8px;
}

/* ---------- Banner (píldora) ---------- */

#cc-main .cm {
  position: fixed !important;
  bottom: max(16px, env(safe-area-inset-bottom, 0px)) !important;

  background: #1a1a1a !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;

  padding: 10px 14px !important;
  border-radius: 999px !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35) !important;

  z-index: 9999999 !important;
}

/* Preferencias abiertas: el banner NO puede estorbar (prioridad máxima) */
html.show-preferences #cc-main .cm,
html.cc--show-preferences #cc-main .cm {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Mobile: centrado abajo, 92% ancho */
@media (max-width: 899px) {
  #cc-main .cm {
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    width: 92vw !important;
    max-width: 92vw !important;
    border-radius: 18px !important;
  }
}

/* Desktop: abajo a la derecha, fino y en una línea */
@media (min-width: 900px) {
  #cc-main .cm {
    right: 16px !important;
    left: auto !important;
    transform: none !important;
    width: auto !important;
    max-width: 720px !important;
    padding: 8px 14px !important;
  }
}

/* Layout interno: texto izquierda, botones derecha */
#cc-main .cm__inner,
#cc-main .cm__body {
  display: flex !important;
  gap: 12px !important;
}

@media (min-width: 900px) {
  #cc-main .cm__inner,
  #cc-main .cm__body {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
  }
}

@media (max-width: 899px) {
  #cc-main .cm__inner,
  #cc-main .cm__body {
    flex-direction: column !important;
    align-items: stretch !important;
  }
}

#cc-main .cm__texts {
  min-width: 0 !important;
}

#cc-main .cm__desc {
  margin: 0 !important;
  font-size: 12px !important;
  line-height: 1.25 !important;
  color: rgba(255, 255, 255, 0.85) !important;
}

#cc-main .cm__btns {
  display: flex !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}

@media (min-width: 900px) {
  #cc-main .cm__btns {
    flex-wrap: nowrap !important;
    align-items: center !important;
  }
}

@media (max-width: 899px) {
  #cc-main .cm__btns {
    flex-direction: column !important;
    align-items: stretch !important;
  }
}

/* Botones: radio 8px y contraste */
#cc-main .cm__btn,
#cc-main .pm__btn {
  border-radius: var(--cc-btn-border-radius) !important;
  min-height: 44px !important;
  padding: 12px 16px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}

#cc-main .cm__btn--accept-all,
#cc-main .cm__btn--acceptAll,
#cc-main .cm__btn--accept {
  background: #ffffff !important;
  border: 1px solid #ffffff !important;
  color: #000000 !important;
}

#cc-main .cm__btn--show-preferences,
#cc-main .cm__btn--showPreferences,
#cc-main .cm__btn--secondary {
  background: transparent !important;
  border: 1px solid rgba(255, 255, 255, 0.35) !important;
  color: #ffffff !important;
}

/* ---------- Modal preferencias (fix crítico de visibilidad) ---------- */

.cc--main .pm { 
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 2147483647 !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Estilo modal compacto oscuro */
#cc-main .pm__overlay,
#cc-main .pm__backdrop,
#cc-main .pm-overlay {
  background: rgba(0, 0, 0, 0.65) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}

#cc-main .pm {
  width: min(92vw, 560px) !important;
  max-height: min(72vh, 720px) !important;
  height: auto !important;
  overflow: hidden !important;
  background: #1a1a1a !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  border-radius: 14px !important;
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.55) !important;
  /* Asegura que el modal no se vea "blurry" por herencia */
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  filter: none !important;
}

/* Móvil: modal más alto y seguro (iPhone) */
@media (max-width: 520px) {
  #cc-main .pm {
    max-height: 90vh !important;
  }
}

/* Colores de texto en Preferencias (evita que hereden estilos claros) */
#cc-main .pm__title,
#cc-main .pm__header,
#cc-main .pm__header-title,
#cc-main .pm__section-title,
#cc-main .pm__section--title,
#cc-main .pm__row-title,
#cc-main .pm__row-headline,
#cc-main .pm__row,
#cc-main .pm__desc,
#cc-main .pm__section-desc,
#cc-main .pm__section--description,
#cc-main .pm__row-desc,
#cc-main .pm__row-description,
#cc-main .pm__toggle-desc {
  color: rgba(255, 255, 255, 0.92) !important;
}

#cc-main .pm__desc,
#cc-main .pm__section-desc,
#cc-main .pm__row-desc,
#cc-main .pm__row-description,
#cc-main .pm__toggle-desc {
  color: rgba(255, 255, 255, 0.72) !important;
}

/* Filas de categorías: fondo oscuro para contraste */
#cc-main .pm__section,
#cc-main .pm__row,
#cc-main .pm__section--toggle,
#cc-main .pm__section--expandable,
#cc-main .pm__section--acc {
  background: #111111 !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
}

/* Evita “tarjetas” blancas internas en filas/toggles */
#cc-main .pm__section *,
#cc-main .pm__row *,
#cc-main .pm__section--toggle *,
#cc-main .pm__section--expandable *,
#cc-main .pm__section--acc * {
  background-color: transparent !important;
}

/* Track/toggle: oscuro con buen contraste */
#cc-main .pm__toggle,
#cc-main .pm__switch,
#cc-main .pm__slider,
#cc-main .pm__toggle label,
#cc-main .pm__switch label {
  background: rgba(255, 255, 255, 0.14) !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
}

/* Botones oficiales v3 (reglas finales) */
#cc-main .pm__btn {
  border-radius: var(--cc-btn-border-radius) !important;
}

/* BOTÓN GUARDAR (EL GRIS) */
#cc-main .pm__btns button[data-cc="save-preferences"],
#cc-main .pm__btn--secondary {
  background: #333333 !important;
  background-color: #333333 !important;
  color: #ffffff !important;
  border: 1px solid #333333 !important;
}

/* BOTÓN ACEPTAR TODAS (EL BLANCO, texto gris) */
#cc-main .pm__btns button[data-cc="accept-all"],
#cc-main .pm__btn--primary {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: rgba(0, 0, 0, 0.62) !important;
  border: 1px solid #ffffff !important;
}

/* Iconos (chevrons/close) en blanco */
#cc-main .pm__close-btn,
#cc-main .pm__close-btn svg,
#cc-main .pm__close-btn path,
#cc-main .pm__section-arrow,
#cc-main .pm__section-arrow svg,
#cc-main .pm__section-arrow path {
  color: rgba(255, 255, 255, 0.9) !important;
  fill: rgba(255, 255, 255, 0.9) !important;
}

#cc-main .pm__body {
  overflow: auto !important;
  -webkit-overflow-scrolling: touch;
}

#cc-main .pm__footer,
#cc-main .pm__btns {
  gap: 10px !important;
}

@media (max-width: 520px) {
  #cc-main .pm__footer,
  #cc-main .pm__btns {
    flex-direction: column !important;
  }
  /* margen de seguridad inferior para iPhone */
  #cc-main .pm__footer,
  #cc-main .pm__btns {
    padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px)) !important;
  }
}