body #cookiesjsr {
  /* Variables principales */
  --default-margin: 1.25em !important;
  --font-size-reset: 1rem !important;

  /* Colores base */
  --uda-blue: #0070b4 !important;
  --uda-dark: #000f37 !important;
  --light-gray: #e4e5e6 !important;
  --white: #FFF !important;
  --text-dark: #333 !important;
  --text-light: #555 !important;

  /* Botones */
  --btn-font-color: var(--white) !important;
  --btn-border-color: var(--uda-blue) !important;
  --btn-bg-color: var(--uda-blue) !important;
  --btn-prime-font-color: var(--uda-blue) !important;
  --btn-prime-border-color: var(--uda-blue) !important;
  --btn-prime-bg-color: var(--white) !important;
  --btn-inv-font-color: var(--uda-blue) !important;
  --btn-inv-border-color: var(--uda-blue) !important;
  --btn-inv-bg-color: var(--white) !important;
  --btn-prime-inv-font-color: var(--white) !important;
  --btn-prime-inv-border-color: var(--uda-blue) !important;
  --btn-prime-inv-bg-color: var(--uda-blue) !important;

  /* Enlaces */
  --link-list-font-color: var(--uda-blue) !important;
  --link-list-separator-color: var(--uda-blue) !important;

  /* Banner principal */
  --banner-logo-offset: 100px !important;
  --banner-bg-color: var(--white) !important;
  --banner-font-color: var(--text-dark) !important;

  /* Capas y pestañas */
  --layer-header-height: 3.5em !important;
  --layer-header-bg-color: var(--white) !important;
  --layer-header-font-color: var(--uda-dark) !important;
  --layer-body-bg-color: #F8F8F8 !important;
  --layer-tab-bg-color: var(--white) !important;
  --layer-tab-font-color: var(--uda-dark) !important;
  --layer-tab-active-bg-color: var(--white) !important;
  --layer-tab-active-font-color: var(--uda-blue) !important;
  --layer-bg-dark: var(--uda-blue) !important;
  --layer-font-light: var(--uda-blue) !important;
  --layer-font-dark: var(--uda-dark) !important;
  --layer-border-color: #e0e0e0 !important;
  --layer-footer-bg-color: var(--white) !important;
  --layer-footer-font-color: var(--uda-dark) !important;
  --layer-footer-height: 4.5em !important;

  /* Switches */
  --switch-border-color: var(--light-gray) !important;
  --switch-handle-color: var(--white) !important;
  --switch-bg-off: var(--light-gray) !important;
  --switch-bg-on: var(--uda-blue) !important;
  --switch-width: 45px !important;
  --switch-height: 20px !important;
  --switch-always-on-font-color: var(--white) !important;
  --switch-always-on-bg-color: var(--uda-blue) !important;
}

/* Textos y tipografía */
.cookiesjsr-banner--text span {
  color: #333 !important;
}

#cookiesjsr h1,
#cookiesjsr h2,
#cookiesjsr h3,
#cookiesjsr .cookiesjsr-service__info button,
#cookiesjsr .active,
#cookiesjsr .cookiesjsr-service__title,
#cookiesjsr .cookiesjsr-layer__header-title,
#cookiesjsr .cookiesjsr-layer__panel-title,
#cookiesjsr button[data-active="true"] {
  color: #0070b4 !important;
  font-weight: bold !important;
}

.cookiesjsr-service--always-on span {
  color: white !important;
}

/* Botones */
#cookiesjsr button {
  font-weight: bold !important;
  transition: all 0.3s ease !important;
}

/* Botones principales y secundarios */
#cookiesjsr .cookiesjsr-banner__accept-all,
#cookiesjsr .cookiesjsr-banner__save,
#cookiesjsr .cookiesjsr-layer__save {
  background-color: #0070b4 !important;
  color: white !important;
  border: 1px solid #0070b4 !important;
  padding: 10px 20px !important;
}

#cookiesjsr .cookiesjsr-banner__deny-all,
#cookiesjsr .cookiesjsr-banner__settings,
#cookiesjsr .cookiesjsr-layer__settings {
  background-color: white !important;
  color: #0070b4 !important;
  border: 1px solid #0070b4 !important;
  padding: 10px 20px !important;
}

/* Panel y servicios */
#cookiesjsr .cookiesjsr-layer {
  border-radius: 8px !important;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.15) !important;
  overflow: hidden !important;
}

/*#cookiesjsr .cookiesjsr-service {*/
/*  border-radius: 4px !important;*/
/*  border: 1px solid #e4e5e6 !important;*/
/*  margin-bottom: 10px !important;*/
/*  padding: 15px !important;*/
/*  background-color: #f9f9f9 !important;*/
/*}*/

/* Servicios obligatorios */
#cookiesjsr .cookiesjsr-service--always-on {
  background-color: #0070b4 !important;
  border-color: #0070b4 !important;
}

#cookiesjsr .cookiesjsr-service--always-on .cookiesjsr-service__title {
  color: white !important;
}

/* Pestañas */
#cookiesjsr button[data-active="true"],
.cookiesjsr-service-group--tab[aria-selected="true"] {
  border-bottom: 2px solid #0070b4 !important;
  background-color: #0070b4 !important;
  color: white !important;
}

/* Enlaces */
#cookiesjsr a {
  color: #0070b4 !important;
  text-decoration: underline !important;
  transition: color 0.3s ease !important;
}

#cookiesjsr a:hover {
  color: #005285 !important;
}

/* Ajustes de anchura para pestañas de categorías */
@media (min-width: 768px) {
  .cookiesjsr-service-group--tab {
    width: calc(30% + 0em) !important;
  }
}

/* Ajustes para dispositivos móviles */
@media (max-width: 768px) {
  #cookiesjsr .cookiesjsr-banner,
  #cookiesjsr .cookiesjsr-banner__buttons {
    flex-direction: column !important;
  }

  #cookiesjsr .cookiesjsr-banner__buttons button {
    width: 100% !important;
    margin: 5px 0 !important;
  }
}

/* Estilo para tabs activos */
/*.cookiesjsr-service-group--content {*/
/*  border-left: 1px solid #0070b4;*/
/*}*/

button#tab-functional {
  border-bottom: 1px solid #0070b4;
}

/* Estilo para pestañas activas */
#cookiesjsr button[data-active="true"] {
  border-bottom: 2px solid #0070b4 !important;
  color: #0070b4 !important;
  font-weight: bold !important;
}

/* Ajustes para el panel de preferencias */
#cookiesjsr .cookiesjsr-layer {
  border-radius: 8px !important;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.15) !important;
}

/* Estilos adicionales para el banner de cookies */
#cookiesjsr .cookiesjsr-banner__text p {
  font-size: 14px !important;
  line-height: 1.5 !important;
  margin-bottom: 15px !important;
  color: #333 !important;
}

/* Mejorar apariencia de los switches */
#cookiesjsr .cookiesjsr-switch {
  position: relative !important;
  display: inline-block !important;
  margin: 0 !important;
}

#cookiesjsr .cookiesjsr-switch input {
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
}

#cookiesjsr .cookiesjsr-slider {
  border: 1px solid #e4e5e6 !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important;
}

#cookiesjsr .cookiesjsr-slider:before {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) !important;
}

#cookiesjsr .cookiesjsr-service__title {
  font-weight: bold !important;
  color: #0070b4 !important;
  font-size: 16px !important;
}

#cookiesjsr .cookiesjsr-service__description {
  font-size: 13px !important;
  color: #555 !important;
  line-height: 1.5 !important;
  margin-top: 5px !important;
}

/* Estilo para botones adicionales */
#cookiesjsr .cookiesjsr-banner__accept-all {
  background-color: #0070b4 !important;
  color: white !important;
  border: 1px solid #0070b4 !important;
  font-weight: bold !important;
}

#cookiesjsr .cookiesjsr-banner__deny-all {
  background-color: white !important;
  color: #555 !important;
  border: 1px solid #ccc !important;
}

/* Mejoras para el panel de configuración */
#cookiesjsr .cookiesjsr-layer__header {
  border-bottom: 1px solid #e4e5e6 !important;
  padding: 15px 20px !important;
}

#cookiesjsr .cookiesjsr-layer__header-title {
  font-size: 20px !important;
  font-weight: bold !important;
  color: #0070b4 !important;
}

#cookiesjsr .cookiesjsr-layer__body {
  padding: 20px !important;
}

#cookiesjsr .cookiesjsr-service--always-on {
  background-color: #0070b4 !important;
  border-color: #0070b4 !important;
}

#cookiesjsr .cookiesjsr-service--always-on .cookiesjsr-service__title {
  color: white !important;
}

/* Ajuste para que los textos de las etiquetas sean legibles */
#cookiesjsr label {
  color: #333 !important;
  font-weight: normal !important;
}

/* Responsive design para dispositivos móviles */
@media (max-width: 768px) {
  #cookiesjsr .cookiesjsr-banner {
    flex-direction: column !important;
    padding: 15px !important;
  }

  #cookiesjsr .cookiesjsr-banner__text {
    margin-bottom: 15px !important;
    max-width: 100% !important;
  }

  #cookiesjsr .cookiesjsr-banner__buttons {
    flex-direction: column-reverse !important;
    gap: 10px !important;
    width: 100% !important;
  }

  #cookiesjsr .cookiesjsr-banner__buttons button {
    width: 100% !important;
    margin: 5px 0 !important;
  }

  #cookiesjsr .cookiesjsr-layer__tabs {
    flex-direction: column !important;
    width: 100% !important;
  }

  #cookiesjsr .cookiesjsr-layer__tab {
    width: 100% !important;
    text-align: left !important;
    border-bottom: 1px solid #e4e5e6 !important;
  }

  #cookiesjsr .cookiesjsr-layer__panel {
    width: 100% !important;
    padding: 15px !important;
  }
}

/* Mejoras en los efectos hover de los botones */
#cookiesjsr button:active {
  transform: translateY(1px) !important;
}

/* Estilos para los enlaces */
#cookiesjsr a {
  color: #0070b4 !important;
  text-decoration: underline !important;
  transition: color 0.3s ease !important;
}

#cookiesjsr a:hover {
  color: #005285 !important;
}

/* Ajustes adicionales para las categorías */
#cookiesjsr .cookiesjsr-tab {
  font-weight: 500 !important;
  padding: 12px 15px !important;
  transition: all 0.3s ease !important;
}

#cookiesjsr .cookiesjsr-tab:hover {
  background-color: #f0f0f0 !important;
}

/* Logo de cookies */
#cookiesjsr .cookiesjsr-banner__logo {
  margin-right: 20px !important;
}

/* Arreglo para bordes y sombras */
#cookiesjsr .cookiesjsr-layer {
  overflow: hidden !important;
}

/* Ajustes para que los botones sean más coherentes */
#cookiesjsr .cookiesjsr-banner__accept-all,
#cookiesjsr .cookiesjsr-banner__save {
  background-color: #0070b4 !important;
  color: white !important;
  border: 1px solid #0070b4 !important;
  font-weight: bold !important;
  padding: 10px 20px !important;
}

#cookiesjsr .cookiesjsr-banner__deny-all,
#cookiesjsr .cookiesjsr-banner__settings {
  background-color: white !important;
  color: #0070b4 !important;
  border: 1px solid #0070b4 !important;
  padding: 10px 20px !important;
}

/* Estilo para los encabezados de secciones */
#cookiesjsr .cookiesjsr-layer__panel-title {
  font-size: 18px !important;
  font-weight: bold !important;
  color: #0070b4 !important;
  margin-bottom: 15px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid #e4e5e6 !important;
}
@media (min-width: 768px) {
  .cookiesjsr-service-group--tab {
    width: calc(30% + 0em) !important;
  }
}
.cookiesjsr-service-group--tab[aria-selected="true"] {
  border-bottom: 1px solid #0070b4 !important;
  background-color: #0070b4 !important;
  color: white !important;
}

/* Estilo para panel lateral del modal de cookies */
#cookiesjsr .cookiesjsr-service-group--tabs {
  width: 245px !important;
  border-right: 1px solid #e0e0e0 !important;
}

#cookiesjsr .cookiesjsr-service-group--tab:hover {
  background-color: #f5f5f5 !important;
}


/* Mejoramos el estilo del contenedor principal del modal */
#cookiesjsr .cookiesjsr-layer {
  border-radius: 8px !important;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3) !important;
  overflow: hidden !important;
}

/* Mejoramos el contraste de los paneles */
#cookiesjsr .cookiesjsr-service-group--content {
  background-color: white !important;
  padding: 20px !important;
  border-left: 1px solid #e0e0e0 !important;
  box-shadow: -2px 0 5px -2px rgba(0, 0, 0, 0.1) !important;
}

/* Estilo para los encabezados de cada panel */
#cookiesjsr .cookiesjsr-service-group--title {
  color: #333 !important;
  font-size: 18px !important;
  font-weight: normal !important;
  margin-bottom: 15px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid #e0e0e0 !important;
}

/* Mejoramos el efecto de sombreado para switches */
#cookiesjsr .cookiesjsr-slider {
  position: absolute !important;
  cursor: pointer !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background-color: #ccc !important;
  transition: .4s !important;
  border-radius: 34px !important;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2) !important;
}

#cookiesjsr .cookiesjsr-slider:before {
  position: absolute !important;
  content: "" !important;
  height: 16px !important;
  width: 16px !important;
  left: 4px !important;
  bottom: 4px !important;
  background-color: white !important;
  transition: .4s !important;
  border-radius: 50% !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

/* Mejoramos el diseño general del modal */
#cookiesjsr .cookiesjsr-layer__header {
  padding: 20px !important;
  border-bottom: 1px solid #e0e0e0 !important;
}

#cookiesjsr .cookiesjsr-layer__header-title {
  margin: 0 !important;
  color: #333 !important;
  font-size: 18px !important;
}

#cookiesjsr .cookiesjsr-layer__footer {
  padding: 15px 20px !important;
  display: flex !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  border-top: 1px solid #e0e0e0 !important;
}

/* Ajuste para dispositivos móviles */
@media (max-width: 768px) {
  #cookiesjsr .cookiesjsr-service-group--tabs {
    width: 100% !important;
    border-right: none !important;
    border-bottom: 1px solid #e0e0e0 !important;
  }

  #cookiesjsr .cookiesjsr-service-group--tab[aria-selected="true"] {
    border-right: none !important;
    border-bottom: 1px solid #e0e0e0 !important;
    margin-right: 0 !important;
    border-left: 3px solid #0070b4 !important;
  }

  #cookiesjsr .cookiesjsr-service-group--content {
    border-left: none !important;
    box-shadow: none !important;
  }
}

/* Limpiar estilos previos conflictivos que podrían afectar */
.cookiesjsr-service-group--tab[aria-selected="true"] {
  border-bottom: none !important;
  background-color: transparent !important;
  color: inherit !important;
}

/* Nuevo estilo para el contenedor de pestañas */
#cookiesjsr .cookiesjsr-service-group--tabs {
  width: 245px !important;
  border-right: 1px solid #e0e0e0 !important;
  background-color: #f8f8f8 !important;
}

/* Estilo base para todas las pestañas */
#cookiesjsr .cookiesjsr-service-group--tab {
  padding: 15px 20px !important;
  border-bottom: 1px solid #e0e0e0 !important;
  cursor: pointer !important;
  color: #333 !important;
  font-size: 14px !important;
  position: relative !important;
  transition: background-color 0.3s ease !important;
  background-color: #f8f8f8 !important;
  /*border-right: 1px solid #e0e0e0 !important;*/
}

/* Efecto hover para las pestañas */
#cookiesjsr .cookiesjsr-service-group--tab:hover {
  background-color: #f0f0f0 !important;
}

/* Estilo para la pestaña activa */
#cookiesjsr .cookiesjsr-service-group--tab[aria-selected="true"] {
  background-color: white !important;
  color: #0070b4 !important;
  font-weight: bold !important;
  border-right: 0 !important; /* Elimina el borde derecho */
  margin-right: -1px !important; /* Ajusta para cubrir el borde del contenedor */
  position: relative !important;
  z-index: 5 !important; /* Mayor z-index para asegurar que esté por encima */
  border-left: 3px solid #0070b4 !important; /* Indicador visual en el lado izquierdo */
  padding-left: 17px !important; /* Compensar el borde izquierdo */
}

/* Panel de contenido - asegurando que tiene el fondo blanco */
#cookiesjsr .cookiesjsr-service-group--content {
  background-color: white !important;
  padding: 20px !important;
  border-left: 1px solid #e0e0e0 !important;}

/* Estilos para dispositivos móviles */
@media (max-width: 768px) {
  #cookiesjsr .cookiesjsr-service-group--tabs {
    width: 100% !important;
    border-right: none !important;
    background-color: #f8f8f8 !important;
    border-bottom: 1px solid #e0e0e0 !important;
  }

  #cookiesjsr .cookiesjsr-service-group--tab {
    border-right: none !important;
  }

  #cookiesjsr .cookiesjsr-service-group--tab[aria-selected="true"] {
    border-right: none !important;
    margin-right: 0 !important;
    border-left: 3px solid #0070b4 !important;
    border-bottom: 1px solid #e0e0e0 !important;
    background-color: white !important;
  }

  #cookiesjsr .cookiesjsr-service-group--content {
    border-left: none !important;
    box-shadow: none !important;
  }
}
.cookiesjsr-layer--header {
  border-bottom: 1px solid #e0e0e0 !important;
}