/* ==========================================================================
   LXV Events — list + single event
   Replaces the Events Calendar styling (tribe-events.css). Self-contained:
   it must not depend on any tribe-* stylesheet, because that plugin is gone.
   Design tokens carried over verbatim from tribe-events.css so the cards look
   identical to what was on the site before.
   ========================================================================== */

.lxvev {
  --g:    #C4A265;   /* LXV gold */
  --gh:   #D4B87A;
  --deep: #2C1810;
  --txt:  #3A3530;
  --lt:   #7A726A;
  max-width: 1200px;
  margin: 0 auto;
  padding: 3.5rem 1.25rem 4.5rem;
  font-family: var(--sc-sans, "DM Sans", sans-serif);
}

.lxvev__state {
  text-align: center;
  color: var(--lt);
  font-size: .9rem;
  letter-spacing: .04em;
  padding: 2rem 0;
}

/* ── Category chips ─────────────────────────────────────────────────────── */
.lxvev__filters {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-bottom: 2rem;
}
/* The theme ships a global <button> style (slate #525266, white text) that
   otherwise wins here and made these read as generic grey UI buttons rather
   than part of the events design. Specificity + !important, same approach the
   old tribe-events.css used against the same theme rules. */
.lxvev .lxvev__chip,
.lxvev button.lxvev__chip {
  appearance: none !important;
  -webkit-appearance: none !important;
  background: #fff !important;
  background-image: none !important;
  border: 1px solid rgba(44, 24, 16, .18) !important;
  border-radius: 0 !important;
  color: var(--txt) !important;
  padding: .62rem 1.05rem !important;
  font-family: var(--sc-sans, "DM Sans", sans-serif) !important;
  font-size: .6rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  text-shadow: none !important;
  box-shadow: none !important;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.lxvev .lxvev__chip:hover,
.lxvev button.lxvev__chip:hover {
  background: #fff !important;
  border-color: var(--g) !important;
  color: var(--deep) !important;
}
.lxvev .lxvev__chip.is-active,
.lxvev button.lxvev__chip.is-active {
  background: var(--g) !important;
  border-color: var(--g) !important;
  color: var(--deep) !important;
}
.lxvev .lxvev__chip:focus-visible { outline: 2px solid var(--deep); outline-offset: 2px; }

/* ── Grid + card ────────────────────────────────────────────────────────── */
.lxvev__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2rem;
  align-items: stretch;
}
.lxvev__card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid rgba(44, 24, 16, .12);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .06);
  overflow: hidden;
  min-height: 36rem;
}
.lxvev__imgwrap { display: block; line-height: 0; background: #f3f0eb; overflow: hidden; }
.lxvev__imgwrap img {
  display: block;
  width: 100%;
  height: 260px;
  object-fit: cover;
  transition: transform .35s ease;
}
.lxvev__card:hover .lxvev__imgwrap img { transform: scale(1.03); }

.lxvev__body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  padding: 1.35rem 1.35rem 1.4rem;
}
.lxvev__cat {
  display: inline-flex;
  align-self: flex-start;
  padding: .42rem .7rem;
  background: #f7f3ec;
  color: #5c4a3e;
  font-size: .54rem;
  font-weight: 600;
  line-height: .75;
  letter-spacing: .08em;
  text-transform: uppercase;
  border: 1px solid rgba(44, 24, 16, .08);
  margin-bottom: .95rem;
}
.lxvev__title {
  /* text-transform:none is required — a global theme rule lowercases headings */
  text-transform: none;
  margin: 0 0 .7rem;
  font-family: var(--sc-serif, "Cormorant Garamond", serif);
  font-size: 1.425rem;
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: .02em;
}
.lxvev__title a { text-transform: none; color: var(--deep); text-decoration: none; transition: color .2s ease; }
.lxvev__title a:hover { color: #6f4c2b; }

.lxvev__date {
  margin: 0 0 .45rem;
  font-size: .85rem;
  font-weight: 600;
  line-height: 1.09;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--lt);
}
.lxvev__more { display: flex; flex-wrap: wrap; gap: .35rem; margin: 0 0 .5rem; }
.lxvev__seat {
  font-size: .62rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--deep);
  background: #f7f3ec;
  padding: .3rem .5rem;
}
.lxvev__venue { margin: 0 0 .9rem; font-style: normal; font-size: .92rem; line-height: 1.16; color: var(--txt); }
.lxvev__price { margin: 0 0 .4rem; font-size: .735rem; font-weight: 600; letter-spacing: .02em; color: var(--deep); }
.lxvev__cta { margin-top: auto; }

/* Shared button — .lxv-event-button is kept as the class name because
   tribe-events-eventbrite.js binds .eb-ticket-trigger on top of it.
   !important for the same reason as the chips: Book Now renders as a <button>
   for Eventbrite events and a <a> for everything else, and the theme's global
   button style would make those two look different from each other. */
.lxvev .lxv-event-button,
.lxvev-single .lxv-event-button,
.lxvev button.lxv-event-button,
.lxvev-single button.lxv-event-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  min-height: 46px !important;
  padding: .9rem 1.35rem !important;
  background: var(--g, #C4A265) !important;
  background-image: none !important;
  color: #2c1810 !important;
  border: 1px solid var(--g, #C4A265) !important;
  border-radius: 0 !important;
  font-family: var(--sc-sans, "DM Sans", sans-serif) !important;
  font-size: .6rem !important;
  font-weight: 700 !important;
  line-height: .75 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  text-shadow: none !important;
  box-shadow: none !important;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.lxvev .lxv-event-button:hover,
.lxvev-single .lxv-event-button:hover,
.lxvev button.lxv-event-button:hover,
.lxvev-single button.lxv-event-button:hover {
  background: var(--gh, #D4B87A) !important;
  border-color: var(--gh, #D4B87A) !important;
  color: #2c1810 !important;
  transform: translateY(-1px);
}

@media (max-width: 1024px) {
  .lxvev__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.75rem; }
  .lxvev__card { min-height: 34rem; }
  .lxvev__imgwrap img { height: 240px; }
  .lxvev__title { font-size: 1.275rem; }
}
@media (max-width: 640px) {
  .lxvev__grid { grid-template-columns: 1fr; gap: 1.4rem; }
  .lxvev__card { min-height: 0; }
  .lxvev__imgwrap img { height: 220px; }
  .lxvev__title { font-size: 1.1rem; }
  .lxvev .lxv-event-button { width: 100%; }
}

/* ==========================================================================
   Single event page
   ========================================================================== */

.lxvev-single {
  --g:    #C4A265;
  --gh:   #D4B87A;
  --deep: #2C1810;
  --txt:  #3A3530;
  --lt:   #7A726A;
  background: #F7F2EA;
  font-family: var(--sc-sans, "DM Sans", sans-serif);
  padding: 0 0 5rem;
}
.lxvev-single__inner { max-width: 860px; margin: 0 auto; padding: 0 1.25rem; }

.lxvev-single__hero {
  margin: 0 -1.25rem 2.25rem;
  line-height: 0;
  background: #f3f0eb;
}
.lxvev-single__hero img { width: 100%; height: clamp(240px, 42vw, 520px); object-fit: cover; display: block; }

.lxvev-single__cats { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1rem; }

.lxvev-single__title {
  text-transform: none;
  font-family: var(--sc-serif, "Cormorant Garamond", serif);
  font-size: clamp(2rem, 4.5vw, 3.1rem);
  font-weight: 500;
  line-height: 1.06;
  letter-spacing: .01em;
  color: var(--deep);
  margin: 0 0 1.5rem;
}

.lxvev-single__meta {
  display: flex;
  flex-direction: column;
  gap: .85rem;
  padding: 1.5rem;
  background: #fff;
  border: 1px solid rgba(44, 24, 16, .12);
  margin-bottom: 2rem;
}
.lxvev-single__meta > div { display: flex; gap: .75rem; align-items: flex-start; font-size: .98rem; color: var(--txt); line-height: 1.45; }
.lxvev-single__ico { font-style: normal; flex: 0 0 1.35rem; text-align: center; opacity: .8; }
.lxvev-single__when em { color: var(--lt); font-style: normal; }
.lxvev-single__cost span { font-weight: 600; color: var(--deep); }

.lxvev-single__cta { margin-bottom: 2.5rem; }

.lxvev-single__body { font-size: 1.02rem; line-height: 1.75; color: var(--txt); }
.lxvev-single__body h2,
.lxvev-single__body h3 {
  text-transform: none;
  font-family: var(--sc-serif, "Cormorant Garamond", serif);
  color: var(--deep);
  margin: 2rem 0 .75rem;
  font-weight: 500;
}
.lxvev-single__body p { margin: 0 0 1.15rem; }
.lxvev-single__body a { color: #6f4c2b; }
.lxvev-single__body img { max-width: 100%; height: auto; }
.lxvev-single__body ul,
.lxvev-single__body ol { margin: 0 0 1.15rem 1.25rem; }

.lxvev-single__back { margin-top: 3rem; }
.lxvev-single__back a {
  color: var(--lt);
  text-decoration: none;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.lxvev-single__back a:hover { color: var(--deep); }

@media (max-width: 640px) {
  .lxvev-single__meta { padding: 1.15rem; }
  .lxvev-single__cta .lxv-event-button { width: 100%; }
}
