/* Events calendar — styles for the concert list (js/events-calendar.js). */

.ec-wrap{
  --ec-font-date: inherit;
  --ec-font-band: inherit;
  --ec-font-city: inherit;
  --ec-font-venue: inherit;
  --ec-accent: #ffffff;
  --ec-muted: #999999;
  --ec-past: #666666;
  --ec-border: #2a2a2a;
  max-width: 560px;
  margin: 0 auto;
}

.ec-section-label{
  color: var(--ec-muted);
  font-size: 11px;
  letter-spacing: 3px;
  text-transform: uppercase;
  margin: 0 0 4px;
}
.ec-section-label.ec-past-label{ color: var(--ec-past); margin-top: 1.25rem; }

.ec-scroll{ max-height: 380px; overflow-y: auto; padding-right: 6px; }

.ec-row{
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 14px 4px;
  border-bottom: 1px solid var(--ec-border);
}
.ec-row.ec-row-past{ opacity: .75; }

.ec-date-block{ text-align: center; min-width: 54px; }
.ec-day{ font-family: var(--ec-font-date); color: var(--ec-accent); font-size: 24px; font-weight: 300; line-height: 1; }
.ec-month{ font-family: var(--ec-font-date); color: var(--ec-muted); font-size: 11px; letter-spacing: 2px; margin-top: 3px; }

.ec-body{ flex: 1; }
.ec-band{ font-family: var(--ec-font-band); color: var(--ec-accent); font-size: 16px; letter-spacing: 1px; font-weight: 500; }
.ec-city{ font-family: var(--ec-font-city); color: var(--ec-accent); font-size: 13px; letter-spacing: 1px; margin-top: 2px; }
.ec-venue{ font-family: var(--ec-font-venue); color: var(--ec-muted); font-size: 13px; margin-top: 2px; }

.ec-info{
  color: var(--ec-accent);
  border: 1px solid #777;
  padding: 7px 16px;
  font-size: 11px;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
}

.ec-row-past .ec-day,
.ec-row-past .ec-band,
.ec-row-past .ec-city{ color: var(--ec-past); }
.ec-row-past .ec-month,
.ec-row-past .ec-venue{ color: #555; }
.ec-row-past .ec-border{ border-color: #222; }

.ec-empty{ color: var(--ec-past); font-size: 13px; padding: 10px 4px; }

.ec-more{
  display:inline-block; margin-top:12px; font-size:11px; letter-spacing:2px;
  text-transform:uppercase; text-decoration:none; color:var(--ec-muted, #999);
}
.ec-more:hover{ color:var(--ec-accent, #fff); }
