/**
 * Promotion list + detail styles (missing from mirrored CSS bundle).
 */

/* ---- Page container ---- */
.layout-content-holder-bc:has(.promotionsList-bc),
.hm-row-bc:has(.promotionsList-bc),
.hm-row-bc:has(.promotion-horizontal-sl-list-bc) {
  overflow-x: hidden;
  max-width: 100%;
  box-sizing: border-box;
}

.promotionsList-bc {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  overflow: hidden;
}

.promotionsList-bc.gridView .promotionsListEl-bc {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.promotionsListEl-bc {
  box-sizing: border-box;
  overflow: hidden;
}

.promotionsListEl-bc:before {
  width: calc(100% - 4px) !important;
  height: calc(100% - 4px) !important;
  top: 2px !important;
  left: 2px !important;
}

.promotion-horizontal-sl-list-bc {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* ---- Promotion detail panel (overlay + popup) ---- */
.promotion-details-container {
  display: flex;
  flex-direction: column;
  min-height: 0;
  height: 100%;
  max-height: 100%;
  background: rgb(var(--b, 10 10 10));
  box-sizing: border-box;
}

.promotion-details-header {
  position: relative;
  flex-shrink: 0;
}

.promotion-details-img {
  display: block;
  width: 100%;
  max-width: 100%;
  max-height: min(42vh, 360px);
  object-fit: cover;
  object-position: center top;
}

.promotion-details-header .promotions-opt-button {
  position: absolute;
  right: 12px;
  bottom: 12px;
  z-index: 2;
}

.promotion-details-info {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 16px 18px 28px;
  font-size: 14px;
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.9) !important;
  -webkit-overflow-scrolling: touch;
  word-break: break-word;
}

.promotion-details-info p,
.promotion-details-info li,
.promotion-details-info span,
.promotion-details-info div,
.promotion-details-info td,
.promotion-details-info th {
  color: rgba(255, 255, 255, 0.88) !important;
}

.promotion-details-info strong,
.promotion-details-info b {
  color: #ffecba !important;
  font-weight: 700;
}

.promotion-details-info a {
  color: #5eb8ff !important;
  text-decoration: underline;
}

.promotion-details-info img {
  display: inline-block;
  max-width: 100% !important;
  height: auto !important;
  margin: 8px 4px 8px 0;
}

.promotion-details-info ul,
.promotion-details-info ol {
  padding-left: 1.2em;
  margin: 0.6em 0;
}

.promotion-footer-title {
  flex-shrink: 0;
  padding: 12px 18px 18px;
  font-size: 12px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.55) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.promotion-footer-title * {
  color: inherit !important;
}

/* Mobile / tablet sliding detail panel */
.overlay-sliding-wrapper-bc.promotion-details-popup,
.overlay-sliding-wrapper-bc:has(.promotion-details-container) {
  width: 100% !important;
  max-width: 100vw !important;
  left: 0 !important;
  right: 0 !important;
}

.overlay-sliding-wrapper-bc.promotion-details-popup .overlay-sliding-w-c-content-slider-bc,
.overlay-sliding-wrapper-bc:has(.promotion-details-container) .overlay-sliding-w-c-content-slider-bc {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  max-height: 100%;
  overflow: hidden;
  background: rgb(var(--b, 10 10 10));
}

.overlay-sliding-wrapper-bc.promotion-details-popup .back-nav-bc,
.overlay-sliding-wrapper-bc:has(.promotion-details-container) .back-nav-bc {
  flex-shrink: 0;
}

.overlay-sliding-wrapper-bc.promotion-details-popup .promotion-details-container,
.overlay-sliding-wrapper-bc:has(.promotion-details-container) .promotion-details-container {
  flex: 1;
  min-height: 0;
}

/* Desktop — centered detail card instead of clipped strip */
@media (min-width: 1024px) {
  .overlay-sliding-wrapper-bc.promotion-details-popup,
  .overlay-sliding-wrapper-bc:has(.promotion-details-container) {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 100% !important;
    top: 0 !important;
    bottom: 0 !important;
    padding: 24px 16px !important;
    box-sizing: border-box !important;
    background: rgba(0, 0, 0, 0.72) !important;
  }

  .overlay-sliding-wrapper-bc.promotion-details-popup .overlay-sliding-w-c-content-slider-bc,
  .overlay-sliding-wrapper-bc:has(.promotion-details-container) .overlay-sliding-w-c-content-slider-bc {
    width: min(780px, 92vw) !important;
    max-height: min(90vh, 920px) !important;
    height: auto !important;
    border-radius: 10px;
    overflow: hidden;
    transform: none !important;
    animation: none !important;
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.55);
    border: 1px solid rgba(255, 255, 255, 0.08);
  }

  .overlay-sliding-wrapper-bc.promotion-details-popup .promotion-details-img,
  .overlay-sliding-wrapper-bc:has(.promotion-details-container) .promotion-details-img {
    max-height: min(38vh, 340px);
  }

  .overlay-sliding-wrapper-bc.promotion-details-popup .promotion-details-info,
  .overlay-sliding-wrapper-bc:has(.promotion-details-container) .promotion-details-info {
    max-height: none;
  }

  .promotionsList-bc.gridView {
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)) !important;
  }
}

/* Desktop popup variant (widget click) */
.popup-holder-bc.windowed.poker-popup.promotion-details-popup .popup-inner-bc,
.popup-holder-bc.promotion-details-popup.poker-popup .popup-inner-bc {
  width: min(780px, 94vw) !important;
  max-height: 90vh !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}

.popup-holder-bc.promotion-details-popup .status-popup-content-w-bc,
.popup-holder-bc.poker-popup.promotion-details-popup .status-popup-content-w-bc {
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
  max-height: 90vh !important;
  overflow: hidden !important;
}

.popup-holder-bc.promotion-details-popup .promotion-details-container,
.popup-holder-bc.poker-popup .promotion-details-container {
  max-height: 90vh;
}

@media (max-width: 1023px) {
  html,
  body {
    overflow-x: hidden;
    max-width: 100%;
  }

  .promotionsList-bc.gridView {
    grid-template-columns: 1fr !important;
    padding: clamp(0.4rem, 2.5vw, 0.85rem) !important;
    gap: clamp(0.4rem, 2vw, 0.75rem) !important;
  }

  .promotionsList-bc.gridView .promotionsListEl-bc,
  .promotionsList-bc.gridView .promotionsListEl-bc.promotion-large {
    grid-column: span 1 !important;
    height: auto !important;
    min-height: clamp(5.5rem, 22vw, 8.5rem);
    aspect-ratio: 16 / 5;
  }

  .overlay-sliding-wrapper-bc.promotion-details-popup,
  .overlay-sliding-wrapper-bc:has(.promotion-details-container) {
    height: calc(100dvh - var(--mobile-header-main-section-height, 5.5rem)) !important;
  }

  .overlay-sliding-wrapper-bc.promotion-details-popup .overlay-sliding-w-c-content-slider-bc,
  .overlay-sliding-wrapper-bc:has(.promotion-details-container) .overlay-sliding-w-c-content-slider-bc {
    transform: none !important;
    animation: none !important;
  }

  .promotion-details-info {
    padding: clamp(0.75rem, 3vw, 1rem) clamp(0.75rem, 3vw, 1rem) clamp(1.25rem, 4vw, 1.5rem);
    font-size: clamp(0.8125rem, 3.2vw, 0.9375rem);
  }

  .promotion-details-img {
    max-height: min(36dvh, 40vw);
  }
}