/* ══════════════════════════════════════════════════════════
   Artist → Events sub-tab (.cm-ev-*)
   Ported from src/features/artist/drill-down.css — that file is no
   longer linked under the design migration, so the Songkick Events
   sub-tab rendered unstyled on PR #57. These rules restore the
   card/date-block/split layout to match the live site. CSS only;
   no markup or JS changes. Tokens resolve via the alias block above.
   ══════════════════════════════════════════════════════════ */
.cm-ev-split{display:grid;grid-template-columns:1fr 360px;gap:var(--space-5);align-items:start}
@media(max-width:900px){.cm-ev-split{grid-template-columns:1fr;gap:var(--space-3)}}
.cm-ev-split-main{min-width:0}
.cm-ev-split-side{min-width:0;position:sticky;top:0}

/* Event list — compact rows */
.cm-ev-list{display:flex;flex-direction:column}
.cm-ev-row{display:flex;align-items:flex-start;gap:14px;padding:10px 0;border-bottom:1px solid var(--divider)}
.cm-ev-row:last-child{border-bottom:none}
.cm-ev-row.affinity{background:var(--indigo-soft);border-radius:var(--radius);padding:10px 12px;margin:0 -6px;border-bottom:none}
.cm-ev-row.affinity + .cm-ev-row{border-top:1px solid var(--divider)}

/* Date block — compact */
.cm-ev-date-block{width:48px;text-align:center;flex-shrink:0}
.cm-ev-date-day{font-family:var(--font-mono);font-size:22px;font-weight:700;color:var(--indigo);line-height:1}
.cm-ev-date-month{font-family:var(--font-mono);font-size:10px;color:var(--text-faint);letter-spacing:0.5px;text-transform:uppercase;margin-top:2px}
.cm-ev-date-year{font-family:var(--font-mono);font-size:10px;color:var(--text-faint)}

/* Event body */
.cm-ev-body-main{flex:1;min-width:0}
.cm-ev-name{font-family:var(--font-body);font-size:14px;font-weight:700;color:var(--text);line-height:1.3}
.cm-ev-venue-line{font-family:var(--font-body);font-size:12px;color:var(--text-muted);margin-top:3px;line-height:1.4}
.cm-ev-meta-row{display:flex;align-items:center;gap:8px;margin-top:5px;flex-wrap:wrap}
.cm-ev-flag{font-size:14px}
.cm-ev-type{font-family:var(--font-body);font-size:10px;font-weight:600;padding:2px 7px;border-radius:var(--radius-sm);background:var(--surface-offset);color:var(--text-muted);text-transform:uppercase;letter-spacing:0.3px}
.cm-ev-affinity-badge{font-family:var(--font-mono);font-size:10px;font-weight:700;padding:2px 7px;border-radius:var(--radius-sm);background:var(--indigo);color:white;letter-spacing:0.3px}

/* Action links — inline pills, bold, visible */
.cm-ev-link-pill{display:inline-flex;align-items:center;font-family:var(--font-body);font-size:11px;font-weight:700;padding:3px 10px;border-radius:var(--radius-sm);text-decoration:none;letter-spacing:0.2px;transition:all var(--duration-fast) var(--ease);line-height:1.4}
.cm-ev-link-pill.sk{background:rgba(241,80,37,0.1);color:#f15025;border:1px solid rgba(241,80,37,0.2)}
.cm-ev-link-pill.sk:hover{background:rgba(241,80,37,0.2);border-color:rgba(241,80,37,0.4)}
.cm-ev-link-pill.venue{background:var(--surface-offset);color:var(--text-muted);border:1px solid var(--divider)}
.cm-ev-link-pill.venue:hover{background:var(--indigo-soft);color:var(--indigo);border-color:var(--indigo)}
.cm-ev-link-pill.tickets{background:var(--indigo);color:white;border:1px solid var(--indigo)}
.cm-ev-link-pill.tickets:hover{opacity:0.85}

/* Venues — compact list (replaces table for sidebar) */
.cm-ev-venues-compact{display:flex;flex-direction:column}
.cm-ev-venue-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--divider);font-family:var(--font-body);font-size:13px}
.cm-ev-venue-row:last-child{border-bottom:none}
.cm-ev-venue-row:hover{background:var(--surface-offset);margin:0 -8px;padding:8px 8px;border-radius:var(--radius)}
.cm-ev-venue-row .v-name{flex:1;font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.cm-ev-venue-row .v-city{color:var(--text-muted);font-size:12px;flex-shrink:0}
.cm-ev-venue-row .v-count{font-family:var(--font-mono);font-size:11px;font-weight:700;color:var(--text-faint);flex-shrink:0;min-width:18px;text-align:right}
.cm-ev-venue-row .v-link{font-size:11px;color:var(--indigo);text-decoration:none;font-weight:600;flex-shrink:0;opacity:0;transition:opacity var(--duration-fast) var(--ease)}
.cm-ev-venue-row:hover .v-link{opacity:1}

/* Tour Market Analysis */
.cm-ev-tour-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-6)}
@media(max-width:640px){.cm-ev-tour-grid{grid-template-columns:1fr;gap:var(--space-5)}}
.cm-ev-tour-title{font-family:var(--font-body);font-size:var(--text-xs);font-weight:700;letter-spacing:1.1px;text-transform:uppercase;margin-bottom:4px}
.cm-ev-tour-row{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) 0;border-bottom:1px solid var(--divider);font-family:var(--font-body);font-size:var(--text-base);cursor:pointer;transition:background var(--duration-fast) var(--ease)}
.cm-ev-tour-row:last-child{border-bottom:none}
.cm-ev-tour-row:hover{background:var(--surface-offset)}
.cm-ev-tour-row .flag{font-size:var(--text-md);flex-shrink:0}
.cm-ev-tour-row .city-name{flex:1;color:var(--text);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cm-ev-tour-row .listeners{font-family:var(--font-mono);font-size:var(--text-sm);font-weight:600;color:var(--text-muted);min-width:64px;text-align:right}
.cm-ev-tour-row .affinity{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-faint);min-width:40px;text-align:right}

/* Festivals */
.cm-ev-festivals-list{display:flex;flex-direction:column}
.cm-ev-festival-row{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) 0;border-bottom:1px solid var(--divider);font-family:var(--font-body);font-size:var(--text-base)}
.cm-ev-festival-row:last-child{border-bottom:none}
.cm-ev-festival-row .festival-name{flex:1;font-weight:600;color:var(--text)}
.cm-ev-festival-row .festival-loc{color:var(--text-muted);font-size:var(--text-sm)}
.cm-ev-festival-row .festival-date{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-faint);min-width:80px;text-align:right}
.cm-ev-festival-row .festival-billing{font-family:var(--font-mono);font-size:var(--text-xs);font-weight:700;padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);background:var(--indigo-soft);color:var(--indigo)}
@media(max-width:640px){
  .cm-ev-row{gap:6px;padding:5px 0}
  .cm-ev-date-block{width:32px}
  .cm-ev-date-day{font-size:14px}
  .cm-ev-festival-row{flex-wrap:wrap;gap:var(--space-2) var(--space-3);padding:var(--space-3) 0}
  .cm-ev-festival-row .festival-date{min-width:auto}
}

/* Co-Performers — sidebar-friendly single column */
.cm-ev-co-performers-grid{display:flex;flex-direction:column;gap:0}
.cm-ev-co-performer-card{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid var(--divider);transition:background var(--duration-fast) var(--ease)}
.cm-ev-co-performer-card:last-child{border-bottom:none}
.cm-ev-co-performer-card:hover{background:var(--surface-offset);margin:0 -8px;padding:9px 8px;border-radius:var(--radius)}
.cm-ev-co-performer-name{font-family:var(--font-body);font-size:13px;font-weight:600;color:var(--text);line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}
.cm-ev-co-performer-name a:hover{color:var(--indigo) !important}
.cm-ev-co-performer-count{font-family:var(--font-mono);font-size:11px;color:var(--text-muted);font-weight:600;flex-shrink:0;white-space:nowrap}

/* Venue count badge */
.cm-ev-count{font-family:var(--font-body);font-size:var(--text-xs);color:var(--text-faint);text-transform:uppercase;letter-spacing:0.6px;font-weight:600;margin-bottom:6px}

/* Events loading/empty placeholder (also from drill-down.css) */
.cm-placement-empty{font-family:var(--font-body);font-size:var(--text-base);color:var(--text-faint);text-align:center;padding:var(--space-6) 0;font-style:italic}

/* Events sub-tab card wrappers. The panel markup (Ian's Phase 9 events code)
   uses the legacy .card/.card-padded/.section-hdr wrappers from core/layout.css,
   which the design migration no longer links. design.css has no standalone
   .card style, so these boxes rendered with no background/border/padding.
   Scoped to #artistEvents so we don't touch design panels that use .card
   (e.g. wire-featured, sidebar-card, revenue cards). Mirrors live (layout.css). */
#artistEvents .card{background:var(--surface);border-radius:var(--radius);border:1px solid var(--divider);box-shadow:var(--shadow-sm);overflow:hidden}
#artistEvents .card-padded{padding:var(--space-4) var(--space-5)}
#artistEvents .section-hdr{font-family:var(--font-body);font-size:var(--text-base);font-weight:600;letter-spacing:0.5px;text-transform:uppercase;color:var(--text-muted);margin-bottom:12px;display:flex;align-items:center;gap:var(--space-3)}