/* ─────────────────────────────────────────────────────────────
   Banner de cookies (Cookiebot "Swift") adaptado al sistema visual
   de oscarojeda.net: blanco/negro, líneas finas, esquinas rectas.
   El plan Premium permite quitar la marca; el resto es CSS de ajuste.
   El banner "Swift" se renderiza en el DOM normal, así que estos
   selectores (#CybotCookiebot...) funcionan desde aquí.
   ───────────────────────────────────────────────────────────── */

/* Quitar la marca "powered by Cookiebot" (banner + icono de privacidad).
   Selectores oficiales de Cookiebot; permitido al estar en plan Premium. */
a#CybotCookiebotDialogPoweredbyCybot,
div#CybotCookiebotDialogPoweredByText,
#CookiebotWidget .CookiebotWidget-body .CookiebotWidget-main-logo {
  display: none !important;
}

/* Modo "Diálogo" convertido en CAJA COMPACTA abajo-izquierda.
   Quitamos la capa de oscurecido (underlay) y liberamos el scroll de la
   página; el diálogo se ancla en la esquina sin bloquear el fondo. */
#CybotCookiebotDialogBodyUnderlay {
  display: none !important;
}
body {
  overflow: auto !important;
}
#CybotCookiebotDialog {
  position: fixed !important;
  left: 24px !important;
  bottom: 24px !important;
  top: auto !important;
  right: auto !important;
  transform: none !important;
  margin: 0 !important;
  max-width: 440px !important;
  width: calc(100% - 48px) !important;
  pointer-events: auto !important;
  border: 1px solid #e8e8e8 !important;
  border-radius: 0 !important;
  box-shadow: 0 6px 28px rgba(0, 0, 0, 0.12) !important;
}

/* En móvil: caja de ancho completo abajo (más usable en pantalla pequeña). */
@media (max-width: 600px) {
  #CybotCookiebotDialog {
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    max-width: none !important;
    width: 100% !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-bottom: 0 !important;
  }

  /* Versión COMPACTA: que tape lo mínimo posible de la carta (el visitante de
     anuncios aterriza en frío; un cajón a media pantalla espanta). Se reduce
     tipografía y relleno; no se quita nada exigible (pestañas y botones se
     mantienen, solo más pequeños). */
  #CybotCookiebotDialog h2 { font-size: 14px !important; margin: 0 0 4px 0 !important; }
  #CybotCookiebotDialog p,
  #CybotCookiebotDialogBodyContentText { font-size: 12.5px !important; line-height: 1.45 !important; }
  #CybotCookiebotDialogNav .CybotCookiebotDialogNavItemLink {
    font-size: 12px !important;
    padding: 6px 10px !important;
  }
  #CybotCookiebotDialogBodyContent { padding: 8px 12px 6px !important; }
  #CybotCookiebotDialog .CybotCookiebotDialogBodyButton,
  #CybotCookiebotDialog button {
    padding: 7px 12px !important;
    font-size: 12.5px !important;
    margin-top: 4px !important;
    margin-bottom: 0 !important;
  }
  #CybotCookiebotDialogBodyButtonsWrapper { margin: 4px 0 6px !important; }
}

/* Botones: esquinas rectas y algo más compactos. */
#CybotCookiebotDialog .CybotCookiebotDialogBodyButton,
#CybotCookiebotDialog a[class*="Button"],
#CybotCookiebotDialog button {
  border-radius: 0 !important;
  padding: 9px 16px !important;
  font-size: 13px !important;
}

/* Quitar la sombra al pasar el ratón por los botones; feedback sutil con
   opacidad (igual que el CTA del sitio). */
#CybotCookiebotDialog .CybotCookiebotDialogBodyButton:hover,
#CybotCookiebotDialog button:hover {
  box-shadow: none !important;
  opacity: 0.8 !important;
}

/* Anular la animación/opacidad que el estilo global de <p> del sitio le metía al
   texto del banner (salía con fade y costaba leerlo). Que salga directo y legible. */
#CybotCookiebotDialog p {
  opacity: 1 !important;
  animation: none !important;
  transform: none !important;
}

/* Quitar el hueco vacío de la izquierda: es el contenedor del logo/marca
   (la cabecera con los logos), que quedó vacío al ocultar la marca Cookiebot. */
#CybotCookiebotDialogHeader,
#CybotCookiebotDialogHeaderLogosWrapper {
  display: none !important;
}

/* Recortar el relleno vertical para una caja algo más compacta.
   (NO ocultamos las categorías: deben verse en "Detalles" para poder elegir.) */
#CybotCookiebotDialogBodyContent {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

/* Primer plano minimal: ocultar los interruptores de categorías de la pestaña
   "Consentimiento" (siguen accesibles en "Más detalles" / "Detalles").
   Se mantienen los botones, incluido "guardar/permitir la selección". */
#CybotCookiebotDialogBodyLevelWrapper {
  display: none !important;
}

/* Interruptores: APAGADO en gris claro, ENCENDIDO en negro, para que se
   distinga de un vistazo qué categorías están activas. Y algo más pequeños. */
#CybotCookiebotDialog .CybotCookiebotDialogBodyLevelButtonSlider {
  background-color: #cccccc !important;
  transform: scale(0.8) !important;
}
#CybotCookiebotDialog input:checked + .CybotCookiebotDialogBodyLevelButtonSlider {
  background-color: #0a0a0a !important;
}

/* ── Widget de consentimiento (icono flotante + su panel) ── */
/* Botón flotante (cerrado): fondo TRANSPARENTE, sin caja blanca, sin sombra ni
   borde, en todos los estados (normal/hover/foco). Solo se ve el iconito. */
#CookiebotWidget:not(.CookiebotWidget-open),
#CookiebotWidget button.CookiebotWidget-logo,
#CookiebotWidget button.CookiebotWidget-logo:hover,
#CookiebotWidget button.CookiebotWidget-logo:focus {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

/* Panel que se abre: fondo blanco, borde fino, esquinas rectas, sombra sutil. */
#CookiebotWidget-widgetContent {
  border: 1px solid #e8e8e8 !important;
  border-radius: 0 !important;
  box-shadow: 0 6px 28px rgba(0, 0, 0, 0.12) !important;
}
#CookiebotWidget .CookiebotWidget-contents,
#CookiebotWidget .CookiebotWidget-body,
#CookiebotWidget .CookiebotWidget-body-inner,
#CookiebotWidget .CookiebotWidget-header,
#CookiebotWidget .CookiebotWidget-consent-details-box {
  background: #ffffff !important;
  border-radius: 0 !important;
}

/* Botones del panel (Retirar / Cambiar): esquinas rectas. */
#CookiebotWidget-buttons button {
  border-radius: 0 !important;
}
