:root{
  --osc-accent: #2b864b;
  --osc-accent-strong: rgba(43, 134, 75, 1);
  --osc-muted: #646463;
  --osc-bg: #ffffff;
  --osc-text: #363636;
  --osc-divider: #cdcecd;
  --osc-radius: 4px;
}

/* Namespace for upcoming events */
.osc-upcoming-events {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  line-height: 1.5;
  font-size: 16px;
  --card-padding: 1rem 1.5rem;
}

.osc-upcoming-events .content-wrapper{
  margin: 0 auto;
  width: 80%;
  max-width: 1000px;
}

.osc-upcoming-events .card-grid {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  justify-content: center;
}

.osc-upcoming-events .card {
  position: relative;
  box-sizing: border-box;
  border: 1px solid var(--osc-accent);
  background: var(--osc-bg);
  color: var(--osc-text);
  padding: var(--card-padding);
  min-width: 250px;
  min-height: 300px;
  display: flex;
  flex-direction: column;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.osc-upcoming-events .card:hover {
  background: var(--osc-accent-strong);
  color: #fff;
  transform: translateY(-5px);
  box-shadow: 0 8px 16px rgba(0,0,0,0.12);
}

.osc-upcoming-events .card-link { color: inherit; text-decoration: none; display:block; }

.osc-upcoming-events .card-content-wrapper{ margin: .5rem; }

.osc-upcoming-events .event-category {
  position: absolute;
  top: -0.2rem;
  right: -0.2rem;
  background: var(--osc-accent);
  color: #fff;
  padding: .25rem .5rem;
  border: 1px solid var(--osc-accent);
  border-bottom-left-radius: 7px;
  font-size: .7rem;
  font-weight: 700;
  height: 2rem;
}

.osc-upcoming-events .event-date{
  font-weight: 500;
  font-size: 1rem;
  color: #494848;
}

.osc-upcoming-events .event-time-loc{
  color: #5e5d5d;
  display:flex;
  gap:.25rem;
  margin:.45rem 0 .6rem 0;
  align-items:center;
}

.osc-upcoming-events .divider{ width:2px; background:#9d9e9c; align-self:stretch; margin:.3rem .1rem; }

.osc-upcoming-events .title{
  font-weight: 600;
  font-size: 1.2rem;
  color: var(--osc-accent);
  text-align: justify;
  margin:.25rem 0;
}

.osc-upcoming-events .separator{
  height:1px;
  background: var(--osc-divider);
  margin: .6rem 0;
}

.osc-upcoming-events .description{
  font-size:.9rem;
  color:#444;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-overflow:ellipsis;
  text-align:justify;
  margin:auto 0;
  flex-grow:1;
}

/* footer */
.osc-upcoming-events .event-footer{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:0;
  margin-top:.4rem;
}

.osc-upcoming-events .event-host-info,
.osc-upcoming-events .event-contact-info{
  font-size:.86rem;
  color: var(--osc-muted);
  font-weight:500;
  white-space:normal;
  word-break:break-word;
}

.osc-upcoming-events .event-contact-info a{ color: var(--osc-accent); text-decoration:underline; font-size:.8rem; font-weight:400; }

/* responsive tweaks */
@media (max-width: 768px){
  .osc-upcoming-events .content-wrapper { width: 95%; }
  .osc-upcoming-events .card { min-height: 220px; }
}
