/*
 Theme Name:   Crawford Child (Spotlight Events) — v4.1
 Theme URI:    https://spotlight.family/
 Description:  Events archive grouped by year with sticky year bar, Spotlight styling, Poster field, and Lineup on archive cards. Clean 'Events' header (no span).
 Author:       ChatGPT (for Chris Cruse)
 Version:      1.3.1
 Template:     crawford
 Tags:         events, archive, gallery, video, child-theme
*/

@import url("../crawford/style.css");

/* ===== Spotlight styling (scoped to Events) ===== */
.events-archive, .event {
  background:#000;
  color:#fff;
  font-family: "Courier New", Courier, monospace;
  padding-bottom:2rem;
}
.events-archive a, .event a { color:#fff; text-decoration: underline; }
.events-archive h1, .events-archive h2,
.event h1, .event h2 { color:#fff; }

/* Make headings look tight/monospace-friendly */
.events-archive h1 { margin:1rem 0 1.2rem; letter-spacing: .02em; }
.events-archive h2 { margin:2.4rem 0 1rem; border-bottom:1px solid #333; padding-bottom:.3rem; }
.event .meta{color:#bbb}

/* Cards on black */
.events-archive .event-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.2rem;margin:0;padding:0;list-style:none}
.events-archive .event-item{border:1px solid #333;border-radius:10px;overflow:hidden;background:#000;transition:transform .06s ease}
.events-archive .event-item:hover{transform:translateY(-1px)}
.events-archive .event-item img{width:100%;height:auto;display:block}
.events-archive .event-item h3{font-size:1.3rem;margin:.6rem .8rem .2rem;line-height:1.3}
/* Date/Location stays grey */
.events-archive .event-item .meta{
  color:#bbb;
  margin:0 .8rem .8rem;
  font-size:1.1rem;          /* ensures a clear baseline size */
  line-height:1.4;
}
/* Lineup before meta; make it white and same size */
.events-archive .event-item .lineup{
  color:#fff;              /* white text */
  margin:0 .8rem .2rem;
  font-size:1.3rem;          /* same size as .meta */
  line-height:1.4;
  /* optional: make it a bit bolder */
  font-weight:600; 
}

/* Gallery and video */
.event .gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px;margin:1rem 0}
.event video{width:100%;height:auto;display:block;margin:1rem 0;background:#000}

/* Prev/Next */
.prev-next{display:flex;justify-content:space-between;gap:1rem;margin-top:2rem}

/* ===== Sticky year bar ===== */
:root{
  --yearbar-h: 44px;
  --yearbar-pad-x: 10px;
}
body.admin-bar .year-bar{ top: calc(32px); }

.year-bar-wrap{
  height: var(--yearbar-h);
  margin-bottom: .6rem;
}
.year-bar{
  position: sticky;
  top: 0;
  z-index: 999;
  display:flex; align-items:center; gap:.5rem; flex-wrap:nowrap;
  overflow-x:auto;
  padding: 6px var(--yearbar-pad-x);
  height: var(--yearbar-h);
  background: rgba(0,0,0,.92);
  border-bottom: 1px solid #222;
  scrollbar-width: thin;
}
.year-bar a{
  display:inline-block;
  padding:.2rem .55rem;
  border:1px solid #333;
  border-radius:6px;
  white-space:nowrap;
  text-decoration:none;
  color:#fff;
}
.year-bar a:hover{ background:#111; }

.events-archive h2{ scroll-margin-top: calc(var(--yearbar-h) + 12px); }

.events-archive, .event { max-width: 1200px; margin: 0 auto; padding-left: 12px; padding-right: 12px; }