/* codex-event-card-master-lock-20260814: layout oficial dos cards de Eventos Relacionados e Destaques. Intocavel sem ordem expressa, especifica e direta do usuario. */
:root {
  --em-official-event-card-width: 250px;
  --em-official-event-card-radius: 14px;
  --em-official-event-card-image-ratio: 16 / 9;
}

body .event-details-section .related-event-wrap,
body .event-page-section [data-event-list],
body .events-section .events-active,
body .em-organizer-events-content {
  --em-event-card-lock-active: 1;
}

body .event-details-section .related-event-wrap:not(.slick-initialized) {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 18px !important;
  align-items: stretch !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-snap-type: x mandatory;
}

body .event-details-section .related-event-wrap:not(.slick-initialized) > .event-item {
  flex: 0 0 var(--em-official-event-card-width) !important;
  width: var(--em-official-event-card-width) !important;
  max-width: var(--em-official-event-card-width) !important;
  scroll-snap-align: start;
}

body .event-details-section .related-event-wrap.slick-initialized .slick-track {
  display: flex !important;
  align-items: stretch !important;
}

body .event-details-section .related-event-wrap.slick-initialized .slick-slide {
  height: auto !important;
  display: flex !important;
}

body .event-details-section .related-event-wrap.slick-initialized .slick-slide > div {
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
}

body .event-details-section .related-event-wrap .event-item,
body .event-page-section .em-event-list-card,
body .events-section .event-item,
body .em-organizer-events-content .em-event-list-card {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: var(--em-official-event-card-width) !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  overflow: hidden !important;
  position: relative !important;
  border-radius: var(--em-official-event-card-radius) !important;
}

body .event-details-section .related-event-wrap .event-image,
body .event-page-section .em-event-list-card .event-image,
body .events-section .event-item .event-image,
body .em-organizer-events-content .em-event-list-card .event-image {
  box-sizing: border-box !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: var(--em-official-event-card-image-ratio) !important;
  flex: 0 0 auto !important;
  display: block !important;
  overflow: hidden !important;
  border-radius: var(--em-official-event-card-radius) var(--em-official-event-card-radius) 0 0 !important;
}

body .event-details-section .related-event-wrap .event-image a,
body .event-details-section .related-event-wrap .event-image img,
body .event-page-section .em-event-list-card .event-image a,
body .event-page-section .em-event-list-card .event-image img,
body .events-section .event-item .event-image a,
body .events-section .event-item .event-image img,
body .em-organizer-events-content .em-event-list-card .event-image a,
body .em-organizer-events-content .em-event-list-card .event-image img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  border-radius: 0 !important;
}

body .event-details-section .related-event-wrap .event-image img,
body .event-page-section .em-event-list-card .event-image img,
body .events-section .event-item .event-image img,
body .em-organizer-events-content .em-event-list-card .event-image img {
  object-fit: cover !important;
  object-position: center center !important;
  transform: none !important;
}

body .event-details-section .related-event-wrap .event-content,
body .event-page-section .em-event-list-card .event-content,
body .em-organizer-events-content .em-event-list-card .event-content {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 84px !important;
  padding: 12px 14px 14px !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 12px !important;
  flex: 1 1 auto !important;
}

body .event-details-section .related-event-wrap .time-info,
body .event-page-section .em-event-list-card .time-info,
body .em-organizer-events-content .em-event-list-card .time-info {
  box-sizing: border-box !important;
  flex: 0 0 58px !important;
  width: 58px !important;
  min-width: 58px !important;
  max-width: 58px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  text-align: center !important;
}

body .event-details-section .related-event-wrap .time-info li,
body .event-page-section .em-event-list-card .time-info li,
body .em-organizer-events-content .em-event-list-card .time-info li {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body .event-details-section .related-event-wrap .time-info span,
body .event-page-section .em-event-list-card .time-info span,
body .em-organizer-events-content .em-event-list-card .time-info span {
  justify-content: center !important;
  text-align: center !important;
}

body .event-details-section .related-event-wrap .info-organ,
body .event-page-section .em-event-list-card .info-organ,
body .em-organizer-events-content .em-event-list-card .info-organ {
  box-sizing: border-box !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body .event-details-section .related-event-wrap .info-organ h5,
body .event-details-section .related-event-wrap .info-organ h5 a,
body .event-page-section .em-event-list-card .info-organ h5,
body .event-page-section .em-event-list-card .info-organ h5 a,
body .em-organizer-events-content .em-event-list-card .info-organ h5,
body .em-organizer-events-content .em-event-list-card .info-organ h5 a {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}

body .event-details-section .related-event-wrap .organizer,
body .event-page-section .em-event-list-card .organizer,
body .em-organizer-events-content .em-event-list-card .organizer {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin-top: 2px !important;
  margin-bottom: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body .events-section .event-item .event-content h5,
body .events-section .event-item .event-content h5 a,
body .events-section .event-item .organizer,
body .events-section .event-item .event-description {
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  overflow-wrap: anywhere !important;
}

body .events-section .event-item .event-content h5,
body .events-section .event-item .event-description {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
}

body .events-section .event-item .event-content h5 {
  -webkit-line-clamp: 2 !important;
  line-clamp: 2 !important;
}

body .events-section .event-item .event-description {
  -webkit-line-clamp: 2 !important;
  line-clamp: 2 !important;
}

body .event-details-section .related-event-wrap .wishlist-btn,
body .event-page-section .em-event-list-card .wishlist-btn,
body .events-section .event-item .wishlist-btn,
body .em-organizer-events-content .em-event-list-card .wishlist-btn {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  left: auto !important;
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  max-width: 40px !important;
  max-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  z-index: 3 !important;
}

body .event-details-section .related-event-wrap .wishlist-btn i,
body .event-page-section .em-event-list-card .wishlist-btn i,
body .events-section .event-item .wishlist-btn i,
body .em-organizer-events-content .em-event-list-card .wishlist-btn i {
  line-height: 1 !important;
  margin: 0 !important;
}

@media (max-width: 767.98px) {
  :root {
    --em-official-event-card-width: 250px;
  }

  body .event-details-section .related-event-wrap:not(.slick-initialized) > .event-item {
    flex-basis: var(--em-official-event-card-width) !important;
  }

  body .event-details-section .releted-event-header {
    margin-top: 20px !important;
  }
}

/* codex-event-mobile-edge-width-20260814: cards da listagem de eventos no mobile usam a largura util do super banner. */
@media (max-width: 767.98px) {
  body .event-page-section .row-events-list > [class*="col-"],
  body .event-page-section [data-event-list] > [class*="col-"] {
    width: 100% !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
    padding-left: 2.5px !important;
    padding-right: 2.5px !important;
    display: flex !important;
    justify-content: center !important;
  }

  body .event-page-section .event-page-content {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }

  body .event-page-section .row-events-list .event-page-content > .em-event-list-card,
  body .event-page-section [data-event-list] .event-page-content > .em-event-list-card {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* codex-event-mobile-edge-width-v2-20260814: corrige a arvore real da listagem mobile de eventos sem alterar relacionados/destaques. */
@media (max-width: 767.98px) {
  body .event-page-section .row-events-list .event-page-content > .row {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body .event-page-section .row-events-list .event-page-content > .row > [class*="col-"] {
    width: 100% !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    display: flex !important;
  }

  body .event-page-section .row-events-list .em-event-list-card,
  body .event-page-section .event-page-content .em-event-list-card {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

