/* === Show index =============================================================
   Loaded only on the cw_show archive (the post type loses its cw_ prefix, so
   this file is show.css).

   A station's line-up is a day, not a wall. The page leads with what is on
   air, then shelves the rest by daypart. Each show is the same card the
   presenter roster uses: the photograph, then three quiet lines. See
   docs/design-language.md.
   ========================================================================== */

.icrt-showpage__index { margin: 2.5rem 0 3rem; }

/* --- masthead: what is on right now ------------------------------------- */

.icrt-showsidx__mast {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: clamp(1.5rem, 4vw, 3rem);
  padding: 1.5rem 0 0;
  color: var(--icrt-ink);
}

.icrt-showsidx__intro { min-width: 0; max-width: 46rem; }

.icrt-showsidx__kind { display: none; }

.icrt-showsidx__title {
  margin: 0;
  font-size: clamp(1.8rem, 3.6vw, 2.7rem);
  line-height: 1.1;
  letter-spacing: -0.025em;
  color: var(--icrt-ink);
}

.icrt-showsidx__lead {
  margin: .75rem 0 0;
  font-size: 1.05rem;
  line-height: 1.6;
  color: var(--icrt-ink-soft);
}

.icrt-nowcard {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: .85rem 1.25rem .85rem .85rem;
  border-radius: 14px;
  background: var(--icrt-mist);
  color: var(--icrt-ink);
  text-decoration: none;
  transition: background .15s ease;
}

.icrt-nowcard:hover { background: var(--icrt-line); }

.icrt-nowcard__art {
  flex: 0 0 auto;
  width: 4.4rem;
  height: 4.4rem;
  border-radius: 10px;
  overflow: hidden;
  background: var(--icrt-line);
}

.icrt-nowcard__art--photo { background: none; }

.icrt-nowcard__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 18%;
}

.icrt-nowcard__body { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }

.icrt-nowcard__kind {
  display: flex;
  align-items: center;
  gap: .4rem;
  font-size: .8125rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  color: var(--icrt-muted);
}

.icrt-nowcard__dot {
  width: .45rem;
  height: .45rem;
  border-radius: 50%;
  background: var(--icrt-accent);
  box-shadow: 0 0 0 3px rgba(77, 146, 245, .35);
}

.icrt-nowcard__title { font-size: 1.1rem; font-weight: 600; letter-spacing: -0.012em; line-height: 1.25; color: var(--icrt-ink); }

.icrt-nowcard__when { font-size: .8125rem; color: var(--icrt-muted); font-variant-numeric: tabular-nums; }
.icrt-nowcard__with { font-size: .8125rem; color: var(--icrt-ink-soft); }

/* --- shelves --------------------------------------------------------------- */

.icrt-showsidx__shelves { margin: 2.5rem 0 3rem; }

.icrt-shelf { margin: 0 0 2.75rem; }

.icrt-shelf__head {
  display: flex;
  align-items: baseline;
  gap: .6rem;
  margin: 0 0 1.1rem;
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.icrt-shelf__n {
  font-size: .875rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  color: var(--icrt-muted);
}

/* --- one card anatomy ------------------------------------------------------ */

.icrt-shows {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 1.75rem 1.25rem;
  grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr));
}

@media (min-width: 64rem) {
  .icrt-shows { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 2.25rem 1.5rem; }
}

.icrt-show { min-width: 0; }

.icrt-show__art,
.icrt-show__art--photo {
  display: block;
  height: auto;
  aspect-ratio: 3 / 4;
  margin: 0 0 .75rem;
  padding: 0;
  overflow: hidden;
  border-radius: 12px;
  background: var(--icrt-mist);
}

.icrt-show__mark { display: none; }

/* Presenter portraits are full-length; 18% from the top keeps the face. */
.icrt-show__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 18%;
  transition: filter .25s ease;
}

.icrt-show:hover .icrt-show__img { filter: brightness(.93); }

.icrt-show.is-live { border: 0; box-shadow: none; }

/* The one accent on the page: a true statement about the schedule. */
.icrt-show__live {
  display: flex;
  align-items: center;
  gap: .4rem;
  margin: 0 0 .25rem;
  font-size: .8125rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  color: var(--icrt-accent);
}

.icrt-show__dot {
  width: .45rem;
  height: .45rem;
  border-radius: 50%;
  background: var(--icrt-accent);
  box-shadow: 0 0 0 3px rgba(77, 146, 245, .35);
}

.icrt-show__name {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 600;
  letter-spacing: -0.012em;
  line-height: 1.3;
  color: var(--icrt-ink);
}

.icrt-show__with {
  display: block;
  margin: .2rem 0 0;
  padding: 0;
  border: 0;
  font-size: .875rem;
  font-weight: 400;
  line-height: 1.4;
  color: var(--icrt-ink-soft);
}

.icrt-show__withlabel { display: none; }

.icrt-show__when {
  margin: .15rem 0 0;
  font-size: .8125rem;
  font-weight: 400;
  line-height: 1.4;
  color: var(--icrt-muted);
  font-variant-numeric: tabular-nums;
}

/* Three quiet lines are the card; the blurb belongs to the show's own page. */
.icrt-show__blurb { display: none; }

@media (prefers-reduced-motion: reduce) {
  .icrt-show__img { transition: none; }
  .icrt-nowcard { transition: none; }
}
