/* Section - Featured collection
========================================= */

/* Layout structure and alignment */
.featured-collection-layout {
  position: relative;

  /* Intro column spacing */
  & .featured-collection-layout-intro {
    margin-bottom: 4rem;
  }

  @media (min-width: 990px) {
    /* Two-column grid when intro content is visible */
    &.has-intro {
      display: grid;
      grid-template-columns: 25% 1fr;
      grid-column-gap: var(--grid-desktop-horizontal-spacing);
    }

    & .featured-collection-layout-intro {
      margin-bottom: 0;
    }

    /* Reverse grid order when countdown is positioned on the right */
    &.featured-collection-layout-left.has-intro {
      grid-template-columns: 1fr 25%;

      & .featured-collection-layout-intro {
        order: 1;
      }
    }
  }

  @media (min-width: 1200px) {
    /* Constrain intro column width on large screens */
    &.has-intro {
      grid-template-columns: min(25%, 35rem) 1fr;
    }

    &.featured-collection-layout-left.has-intro {
      grid-template-columns: 1fr min(25%, 35rem);
    }
  }
}

/* Countdown module spacing and layout */
.featured-collection-expiry-wrap {
  & .countdown {
    margin: 3rem 0;
  }

  & .featured-collection-expiry-description {
    margin-bottom: 3rem;
  }

  @media (min-width: 990px) {
    /* Limit description width alongside sticky countdown */
    & .featured-collection-expiry-description {
      max-width: 32rem;
    }
  }
}

/* Sticky countdown option */
.featured-collection-expiry-wrap-sticky {
  @media (min-width: 990px) {
    position: sticky;
    top: 2rem;
  }
}

/* Countdown message card */
.featured-collection-countdown-message {
  border-radius: var(--border-radius);
  box-shadow: inset 0 0 0 0.1rem rgb(var(--color-card-border));
  padding: 1.5rem;
  margin-bottom: 3rem;

  & > :last-child {
    margin-bottom: 0;
  }
}

/* Editor design mode notice */
.featured-collection-editor-hidden-note {
  position: absolute;
  top: 0;
  inset-inline-end: 0;
  padding: 1rem;
  background: var(--color-error-background);
  color: var(--color-error);
  font-size: calc(var(--font-body-scale) * 1.3rem);
  opacity: 0.85;
  border-radius: var(--border-radius);
  z-index: 5;
}

/* Mobile stacking for collection card */
@media (max-width: 749px) {
  .grid-item-card-fit-content {
    order: -1;
    width: 100% !important;
    max-width: 100% !important;

    & .card.card-fit-content {
      --ratio-percent: 52.25%;

      & .card-media {
        margin: 0;
        border-radius: var(--border-radius-base);
        border-end-end-radius: 0;
        border-end-start-radius: 0;
        height: auto;
        padding-bottom: 52.5%;
      }

      & .card-info-wrap {
        margin-bottom: 2rem;
      }

      & .card-info {
        position: relative;
        width: 100%;
        margin: 0;
        padding: 2rem;
        display: flex;
        height: 100%;
        flex: auto;
        flex-direction: column;
        align-items: flex-start;
        transition: box-shadow 0.18s ease;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
      }
    }
  }
}