:root {
  --ebi-color-primary: #29aae2; /* bright blue */
  --ebi-color-date: #b08b5e; /* bronze/brown */
  --ebi-bg-wann: #d6efeb; /* light mint */
  --ebi-text-wann: #5eb1bf; /* dark mint/teal */
  --ebi-bg-wo: #ffe0c2; /* light orange/peach */
  --ebi-text-wo: #f09e56; /* dark orange */
  --ebi-bg-tickets: #f0d3df; /* light pink */
  --ebi-text-tickets: #d68d9a; /* dark pink */
  --ebi-card-radius: 0px;
  --ebi-card-border-color: #ddd;
  --ebi-card-border-width: 1px;
  --ebi-strip-height: 3px;
  --ebi-strip-border-width: 3px;
}

.ebi-events-container {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.ebi-event-card {
  position: relative;
  padding: 20px;
  background-color: #fff;
  /* Simulate the 'thrv-content-box' look */
  border: var(--ebi-card-border-width, 1px) solid var(--ebi-card-border-color, #ddd);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
  margin-bottom: 2rem;
  border-radius: var(--ebi-card-radius, 0px);
  overflow: hidden;
}

/* The colored top border strip from the example */
.ebi-event-bg-strip {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: var(--ebi-strip-height, 3px);
  background-color: var(--ebi-color-primary);
  border: var(--ebi-strip-border-width, 3px) solid var(--ebi-color-primary);
  border-radius: var(--ebi-card-radius, 0px) var(--ebi-card-radius, 0px) 0 0;
  z-index: 0;
}

.ebi-event-inner {
  position: relative;
  z-index: 1;
  padding: 10px;
}

.ebi-event-header {
  margin-bottom: 20px;
}

.ebi-event-title {
  color: var(--ebi-color-primary);
  font-size: 2em;
  margin: 0 0 10px 0;
  line-height: 1.2;
  text-transform: uppercase;
  font-weight: 700;
}

.ebi-event-date-subtitle {
  font-size: 1em;
  font-weight: 700;
  text-transform: uppercase;
  margin: 0;
  color: var(--ebi-color-date);
}

.ebi-event-image-wrapper {
  margin-bottom: 25px;
}

.ebi-event-img {
  width: 100%;
  height: auto;
  display: block;
  max-width: 100%;
}

.ebi-event-body {
  margin-bottom: 30px;
}

.ebi-event-body p {
  margin-bottom: 1em;
}

.ebi-event-summary {
  margin: 0 0 0.75em 0;
  color: #444;
  font-weight: 600;
}

.ebi-event-excerpt {
  margin: 0 0 0.75em 0;
  color: #444;
}

.ebi-event-readmore {
  border: 1px solid #e5e5e5;
  border-radius: 6px;
  padding: 10px 12px;
  background: #fafafa;
}

.ebi-event-readmore summary {
  cursor: pointer;
  font-weight: 700;
  color: var(--ebi-color-primary);
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.ebi-event-readmore summary::-webkit-details-marker {
  display: none;
}

.ebi-event-readmore summary::before {
  content: "+";
  display: inline-block;
  width: 1.1em;
  height: 1.1em;
  line-height: 1.1em;
  text-align: center;
  border: 1px solid var(--ebi-color-primary);
  border-radius: 50%;
  font-weight: 700;
}

.ebi-event-readmore[open] summary::before {
  content: "−";
}

.ebi-event-readmore-content {
  margin-top: 12px;
}

.ebi-readmore-desktop-only {
  display: block;
}

.ebi-readmore-mobile-only {
  display: none;
}

/* Footer Columns */
.ebi-event-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  padding-top: 0;
}

.ebi-event-col {
  flex: 1 1 250px; /* Responsive columns */
  text-align: center;
  padding: 20px;
}

.ebi-event-col h4 {
  margin-top: 0;
  margin-bottom: 5px;
  font-size: 1.2em;
  color: #333;
  text-transform: uppercase;
  font-weight: 700;
}

.ebi-event-col p {
  margin: 0;
  line-height: 1.5;
  color: #333;
  font-size: 0.95em;
}

/* Specific Column Styles */
.ebi-col-wann {
  background-color: var(--ebi-bg-wann);
}

.ebi-col-wann h4 {
  color: var(--ebi-text-wann);
}

.ebi-col-wo {
  background-color: var(--ebi-bg-wo);
}

.ebi-col-wo h4 {
  color: var(--ebi-text-wo);
}

.ebi-col-tickets {
  background-color: var(--ebi-bg-tickets);
}

.ebi-col-tickets h4 {
  color: var(--ebi-text-tickets);
}

.ebi-ticket-button {
  display: inline-block;
  margin-top: 5px;
  color: inherit;
  text-decoration: none;
  font-weight: bold;
}

.ebi-ticket-button:hover {
  text-decoration: underline;
}

@media (max-width: 768px) {
  .ebi-event-footer {
    flex-direction: column;
  }

  .ebi-readmore-desktop-only {
    display: none;
  }

  .ebi-readmore-mobile-only {
    display: block;
  }
}