/*
 * Season accordion — ONE component, both sides of the app.
 *
 * The player catalogue (.catalogue-season, built by catalogue-sections.js) and the
 * Admin visibility matrix (.admin-matrix-season, built by admin-console.js) already
 * emit the same structure: a <details> with an eyebrow, a title, a "N families ·
 * N variants" count and a chevron. They just drew it with two unrelated sets of
 * literals, so Admin looked nothing like the player side.
 *
 * This file owns the shared shell for both. Tone comes from the --c7s4 / --c7s3
 * suffix classes both sides already use, so no markup change is needed on either.
 *
 * Loaded after catalogue-sections.css on the player side and after admin.css on the
 * Admin side. The admin selectors are anchored on #adminMatrixGroups so they outrank
 * the runtime <style> injected by admin-console.js (which uses .admin-matrix-season
 * at (0,1,0); ours is (1,1,0) and wins on ID count).
 */

/* ---- shared tokens --------------------------------------------------- */

.catalogue-season,
#adminMatrixGroups .admin-matrix-season{
  --season-accent:var(--st-cyan,#5cd3e6);
  --season-tint:rgba(92,211,230,.16);
  --season-radius:18px;

  overflow:clip;
  border:1px solid color-mix(in srgb,var(--season-accent) 26%,var(--ct-border,rgba(255,255,255,.1)));
  border-radius:var(--season-radius);
  background:
    radial-gradient(circle at 92% -30%,var(--season-tint),transparent 42%),
    linear-gradient(150deg,color-mix(in srgb,var(--st-surface-2,#111f34) 94%,transparent),
                           color-mix(in srgb,var(--st-surface,#0a1420) 96%,transparent));
  box-shadow:0 14px 38px rgba(0,0,0,.18);
}

/* Current season reads green/teal; previous season reads violet. Matches the
   player-side treatment that already shipped. */
.catalogue-season--c7s4,
#adminMatrixGroups .admin-matrix-season--c7s4{
  --season-accent:#5fe0ad;
  --season-tint:rgba(55,221,165,.18);
}
.catalogue-season--c7s3,
#adminMatrixGroups .admin-matrix-season--c7s3{
  --season-accent:#a88dff;
  --season-tint:rgba(138,110,255,.14);
}

/* ---- summary row ----------------------------------------------------- */

.catalogue-season__summary,
#adminMatrixGroups .admin-matrix-season > summary{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  align-items:center;
  gap:18px;
  min-height:76px;
  padding:16px 20px;
  cursor:pointer;
  list-style:none;
  user-select:none;
  color:var(--ct-text,#f7fbff);
  border-bottom:1px solid transparent;
  transition:background var(--duration-fast,120ms) var(--motion-ease,ease);
}
.catalogue-season__summary::-webkit-details-marker,
#adminMatrixGroups .admin-matrix-season > summary::-webkit-details-marker{display:none}

.catalogue-season__summary:hover,
#adminMatrixGroups .admin-matrix-season > summary:hover{
  background:color-mix(in srgb,var(--season-accent) 7%,transparent);
}
.catalogue-season[open] > .catalogue-season__summary,
#adminMatrixGroups .admin-matrix-season[open] > summary{
  border-bottom-color:color-mix(in srgb,var(--season-accent) 20%,transparent);
}

.catalogue-season__summary:focus-visible,
#adminMatrixGroups .admin-matrix-season > summary:focus-visible{
  outline:3px solid var(--season-accent);
  outline-offset:-4px;
}

/* Copy block: eyebrow above title. */
.catalogue-season__copy,
#adminMatrixGroups .admin-matrix-season > summary > span:first-child{
  display:grid !important;
  gap:4px !important;
  min-width:0;
}
.catalogue-season__eyebrow,
#adminMatrixGroups .admin-matrix-season > summary small{
  color:var(--season-accent) !important;
  font-size:var(--type-3xs,.66rem) !important;
  font-weight:900 !important;
  letter-spacing:.14em !important;
  text-transform:uppercase !important;
}
.catalogue-season__copy strong,
#adminMatrixGroups .admin-matrix-season > summary strong{
  font-size:clamp(1.05rem,2vw,1.3rem) !important;
  letter-spacing:-.02em;
  line-height:1.15;
}

/* Count + chevron on the right. */
.catalogue-season__meta,
#adminMatrixGroups .admin-matrix-season-count{
  display:flex !important;
  align-items:center;
  gap:12px;
  color:var(--ct-secondary,#9eb0c7) !important;
  font-size:var(--type-xs,.76rem) !important;
  font-weight:800 !important;
  white-space:nowrap;
}

.catalogue-season__chevron{
  width:11px;height:11px;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:rotate(45deg);
  transition:transform var(--duration-normal,180ms) var(--motion-ease,ease);
}
.catalogue-season[open] .catalogue-season__chevron{transform:rotate(225deg)}

#adminMatrixGroups .admin-matrix-season-count b{
  font-size:1.15rem;
  transition:transform var(--duration-normal,180ms) var(--motion-ease,ease);
}
#adminMatrixGroups .admin-matrix-season[open] .admin-matrix-season-count b{transform:rotate(180deg)}

/* ---- body ------------------------------------------------------------ */

.catalogue-season__body{padding:16px 16px 18px}
#adminMatrixGroups .admin-matrix-season > .admin-matrix-scroll{
  border-inline:0;
  border-bottom:0;
  border-radius:0;
}

#grid.catalogue-seasons,
#adminMatrixGroups{display:grid;gap:var(--space-4,16px)}

/* ---- light theme ----------------------------------------------------- */

html[data-theme="light"] .catalogue-season,
html[data-theme="light"] #adminMatrixGroups .admin-matrix-season{
  border-color:color-mix(in srgb,var(--season-accent) 30%,rgba(50,92,133,.2));
  background:
    radial-gradient(circle at 92% -30%,var(--season-tint),transparent 42%),
    linear-gradient(150deg,#f9fcff,#eef5fa);
  box-shadow:0 12px 30px rgba(28,56,82,.1);
}
html[data-theme="light"] .catalogue-season__summary,
html[data-theme="light"] #adminMatrixGroups .admin-matrix-season > summary{color:#12253b}
html[data-theme="light"] .catalogue-season--c7s4,
html[data-theme="light"] #adminMatrixGroups .admin-matrix-season--c7s4{--season-accent:#1b8f69}
html[data-theme="light"] .catalogue-season--c7s3,
html[data-theme="light"] #adminMatrixGroups .admin-matrix-season--c7s3{--season-accent:#6b4fd0}

/* ---- narrow ---------------------------------------------------------- */

@media(max-width:620px){
  .catalogue-season__summary,
  #adminMatrixGroups .admin-matrix-season > summary{
    grid-template-columns:minmax(0,1fr) auto;
    align-items:start;
    gap:6px 12px;
    min-height:0;
    padding:14px 15px;
  }
  .catalogue-season__meta,
  #adminMatrixGroups .admin-matrix-season-count{
    grid-column:1;
    font-size:var(--type-3xs,.68rem) !important;
  }
  .catalogue-season__chevron{grid-column:2;grid-row:1/3;align-self:center}
  #adminMatrixGroups .admin-matrix-season-count b{position:absolute;right:15px;top:18px}
  #adminMatrixGroups .admin-matrix-season > summary{position:relative}
  .catalogue-season__body{padding:10px 9px 12px}
}

@media(prefers-reduced-motion:reduce){
  .catalogue-season__chevron,
  #adminMatrixGroups .admin-matrix-season-count b,
  .catalogue-season__summary,
  #adminMatrixGroups .admin-matrix-season > summary{transition:none !important}
}