.cmp-agenda {
  padding: 2rem clamp(var(--space-6), 6vw, 7.5rem) 0;
  padding-bottom: 3rem;
}

.cmp-layout-columns .cmp-agenda {
  padding-bottom: 3rem;
  margin-top: var(--space-8);
  padding-inline: var(--space-6);
}

.cmp-agenda__header {
  display: flex;
  flex-direction: row;
  max-width: var(--eventos-destacados-card-width);
  margin-inline: auto;
}

.cmp-agenda__title,
.cmp-agenda-title {
  color: var(--Neutros-900);
  font-family: var(--Heading-Mvil-H4-fontFamily);
  font-size: var(--Heading-Mvil-H4-fontSize);
  font-style: normal;
  font-weight: var(--Weights-Bold);
  line-height: var(--Heading-Mvil-H4-lineHeight);
  letter-spacing: var(--Heading-Mvil-H4-letterSpacing);
  margin: 0;
}

.cmp-agenda__content {
  display: flex;
  padding: 24px 0 0 0;
  flex-direction: column;
  justify-content: center;
  margin-inline: auto;
  width: 100%;
  max-width: var(--eventos-destacados-card-width);
}

.cmp-agenda__tabs {
  border-radius: var(--24, 24px);
  background: var(--Primario-500-Marca, #005288);
  max-width: fit-content;
  padding: var(--24, 24px);
  align-self: stretch;
}

.cmp-agenda__tabs__pills {
  display: flex;
  padding: 8px 24px 24px 8px;
  flex-direction: row;
  align-items: flex-start;
  gap: 8px;
  overflow: hidden;
}

.cmp-agenda__titulo-content {
  display: flex;
  border-radius: var(--8, 8px);
  background: var(--CAF-Colores-neutros-gris-50, #F2F2F2);
  padding: 8px 24px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 4px;
  cursor: pointer;
  color: var(--CAF-Primary-corporativo-primario, var(--CAF-Primary-corporativo-primario, #005288));
  min-width: 126px;
  height: 64px;
}

.cmp-agenda__titulo-content:focus-visible,
.cmp-agenda__item__content:focus-visible {
  outline: 2px solid var(--CAF-Colores-neutros-full-white, #fff);
  outline-offset: 2px;
}

.cmp-agenda__titulo-content.active,
.cmp-agenda__titulo-content.cmp-tabs__tab--active {
  border-radius: var(--8, 8px);
  background: var(--Primary-corporativo-contraste-500, #13BDCE);
  padding: 8px 24px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 4px;
  cursor: pointer;
  color: var(--CAF-Colores-neutros-full-white, var(--CAF-Colores-neutros-full-white, #FFF));
}

/* Gana a .cmp-tabs__tab y .cmp-tabs__tab--active de Core Components para evitar borde inferior en tabs. */
.cmp-agenda .cmp-agenda__titulo-content.cmp-tabs__tab,
.cmp-agenda .cmp-agenda__titulo-content.cmp-tabs__tab.cmp-tabs__tab--active {
  border-bottom: 0;
  border-color: transparent;
}

.cmp-agenda__titulo-dia {
  font-family: var(--font-family-body, "Raleway", Arial, sans-serif);
  font-size: var(--Body-Body-3-fontSize, 16px);
  font-style: normal;
  font-weight: var(--Weights-Bold, 800);
  line-height: var(--Body-Body-3-lineHeight, 22px);
  letter-spacing: var(--Body-Body-3-letterSpacing, 0.64px);
  text-transform: uppercase;
}

.cmp-agenda__titulo-fecha {
  font-family: var(--font-family-body, "Raleway", Arial, sans-serif);
  font-size: var(--Body-Body-3-fontSize, 16px);
  font-style: normal;
  font-weight: var(--Weights-Regular, 400);
  line-height: var(--Body-Body-3-lineHeight, 22px);
}

.cmp-agenda__item {
  display: none;
  flex-direction: column;
}

.cmp-agenda__item.active {
  display: flex;
}

.cmp-agenda__item__content {
  display: flex;
  padding-bottom: 24px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 8px;
  align-self: stretch;
  border-bottom: 1px solid var(--CAF-Primary-corporativo-contraste-500, #13BDCE);
  padding-top: 16px;
}

.cmp-agenda__item__content__hora {
  color: var(--CAF-Colores-neutros-full-white, var(--CAF-Colores-neutros-full-white, #FFF));
  font-family: Raleway;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
}

.cmp-agenda__item__content__titulo {
  color: var(--CAF-Colores-neutros-full-white, var(--CAF-Colores-neutros-full-white, #FFF));
  font-family: Montserrat;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 28px; /* 140% */
}

.cmp-agenda__tabs__panels {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
  padding-left: 10px;
}

.cmp-agenda--with-image .cmp-agenda__content {
  align-items: stretch;
  flex-direction: row;
  gap: 0;
  row-gap: 0;
  padding: 0;
}

.cmp-agenda--with-image .cmp-agenda__header {
  max-width: none;
  margin: 0 0 16px 0;
}
.cmp-agenda__media {
  display: none;
}
.cmp-agenda--with-image .cmp-agenda__media {
  display: flex;
  flex: 1 1 20%;
  margin: 0;
  overflow: hidden;
  border-radius: var(--24, 24px) 0 0 var(--24, 24px);
}

.cmp-agenda--with-image .cmp-agenda__media .cmp-image__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cmp-agenda--with-image .cmp-agenda__tabs {
  flex: 1 1 50%;
  max-width: none;
  padding: var(--40, 40px);
  border-radius: 0 var(--24, 24px) var(--24, 24px) 0;
}

.cmp-agenda--with-image .cmp-agenda__tabs__pills {
  padding: 0 0 24px 0;
}

.cmp-agenda--with-image .cmp-agenda__tabs__panels {
  padding-left: 0;
}

.cmp-agenda--with-image .title-no-img,
.title-with-img {
  display: none;
}
.cmp-agenda--with-image .title-with-img{
  display: flex;
}
.cmp-agenda--with-image .title-with-img .cmp-agenda-title {
  color: var(--CAF-Colores-neutros-full-white, var(--CAF-Colores-neutros-full-white, #FFF));
}

@media (max-width: 64rem) {
  .cmp-layout-columns .cmp-agenda {
    padding-bottom: 1rem;
    margin-top: 1rem;
    padding-inline: 0rem;
  }

  .cmp-agenda--with-image .cmp-agenda__content {
    flex-direction: column;
    row-gap: 0;
  }
  .cmp-agenda--with-image .cmp-agenda__media {
    flex: 0 0 auto;
    max-width: 100%;
    min-height: 15rem;
    border-radius: var(--24, 24px) var(--24, 24px) 0 0;
  }
  .cmp-agenda--with-image .cmp-agenda__tabs {
    border-radius: 0 0 var(--24, 24px) var(--24, 24px);
  }
  .cmp-agenda__tabs__pills {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: max-content;
    gap: var(--space-4);
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: var(--space-4);
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    cursor: grab;
    padding-block: var(--space-4);
  }
  .cmp-agenda__item__content__titulo {
    font-family: var(--Heading-Mvil-H5-fontFamily, Montserrat);
    font-size: var(--Heading-Mvil-H5-fontSize, 16px);
    font-style: normal;
    font-weight: var(--Weights-Bold, 700);
    line-height: var(--Heading-Mvil-H5-lineHeight, 24px); /* 150% */
    letter-spacing: var(--Heading-Mvil-H5-letterSpacing, 0);
    text-align: left;
  }
  .cmp-agenda__item__content__hora {
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px; /* 142.857% */
  }
}
@media (max-width: 40rem) {
  .cmp-agenda--with-image .cmp-agenda__media {
    min-height: 12.5rem;
  }
  .cmp-agenda--with-image .cmp-agenda__media .cmp-image__image {
    height: auto;
  }
  .cmp-agenda--with-image .cmp-agenda__tabs {
    padding: var(--24, 24px);
  }
  .cmp-agenda--with-image .cmp-agenda__tabs__pills {
    padding: 0 0 16px 0;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
  }
  .cmp-agenda--with-image .cmp-agenda__tabs__pills::-webkit-scrollbar {
    display: none;
  }
}