#brx-content .eventinfo--header-container,
body .eventinfo--header-container {
  display: grid;
  grid-template-columns: var(--grid-2-1);
  grid-gap: var(--space-m);
  padding-bottom: var(--space-s);
  align-items: center;
}

@media (max-width: 767px) {
  #brx-content .eventinfo--header-container,
  body .eventinfo--header-container {
    grid-template-columns: var(--grid-1);
    padding-bottom: var(--space-xl);
  }
  
  #brx-content .eventinfo--header-container > *:nth-child(even),
  body .eventinfo--header-container > *:nth-child(even) {
    order: -1;
  }
}



#brx-content .dynamisk--event-bild,
body .dynamisk--event-bild {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: var(--radius-m);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}



#brx-content .event-category-badge,
body .event-category-badge {
  display: block;
  padding: 0;
  margin-top: var(--space-xs);
  margin-bottom: var(--space-m);
  text-transform: lowercase;
  background-color: transparent;
  border: none;
  font-size: calc(1.25*var(--text-m));
  font-weight: 500;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
  letter-spacing: 0.01em;
}

#brx-content .event-category-badge.workshop,
body .event-category-badge.workshop {
  color: var(--event-workshop);
}

#brx-content .event-category-badge.community,
body .event-category-badge.community {
  color: var(--event-community);
}

#brx-content .event-category-badge.open,
body .event-category-badge.open {
  color: var(--event-open);
}

#brx-content .event-category-badge.external,
body .event-category-badge.external {
  color: var(--event-extern);
}

@media (max-width: 767px) {
  #brx-content .event-category-badge,
  body .event-category-badge {
    font-size: var(--text-s);
  }
}



#brx-content h1.eventinfo--event-heading,
body h1.eventinfo--event-heading {
  font-size: var(--h3);
  color: var(--secondary);
  margin-bottom: var(--space-xs);
  line-height: 1.2;
  font-weight: 600;
}

@media (max-width: 767px) {
  #brx-content h1.eventinfo--event-heading,
  body h1.eventinfo--event-heading {
    font-size: var(--h4);
  }
}




.eventinfo--date-time-wrapper {
  padding: var(--space-s) var(--space-m);
  background-color: transparent;
  border-radius: var(--radius-s);
  border: 2px solid var(--secondary);
  border-left: 4px solid var(--secondary-semi-dark);
  max-width: fit-content;
}



#brx-content .eventinfo--info-text,
body .eventinfo--info-text {
  font-weight: 500;
  font-size: var(--text-m);
  color: var(--secondary);
  line-height: 1.6;
  margin-bottom: var(--space-xs);
}

@media (max-width: 991px) {
  #brx-content .eventinfo--info-text,
  body .eventinfo--info-text {
    font-size: var(--text-s);
  }
}



#brx-content .eventinfo--content-text,
body .eventinfo--content-text {
  font-size: var(--text-m);
  color: var(--base);
  font-weight: 400;
  line-height: 1.7;
  margin-bottom: var(--space-m);
}

#brx-content .eventinfo--content-text p,
body .eventinfo--content-text p {
  margin-bottom: var(--space-m);
}

#brx-content .eventinfo--content-text p:last-child,
body .eventinfo--content-text p:last-child {
  margin-bottom: 0;
}

#brx-content .eventinfo--content-text ul,
#brx-content .eventinfo--content-text ol,
body .eventinfo--content-text ul,
body .eventinfo--content-text ol {
  margin-left: var(--space-m);
  margin-bottom: var(--space-m);
}

#brx-content .eventinfo--content-text li,
body .eventinfo--content-text li {
  margin-bottom: var(--space-xs);
}

#brx-content .eventinfo--content-text img.emoji,
body .eventinfo--content-text img.emoji {
  display: inline;
  height: 1.2em;
  width: 1.2em;
  margin: 0 0.1em;
  vertical-align: -0.1em;
}






#brx-content .eventinfo--ticket-button2,
#brxe-fjddxk .eventinfo--ticket-button2,
body .eventinfo--ticket-button2 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-s) var(--space-m);
  background-color: var(--member-cta);
  color: white;
  font-weight: 500;
  font-size: var(--text-m);
  border-radius: var(--radius-m);
  border: none;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
  text-decoration: none;
  cursor: pointer;
}

#brx-content .eventinfo--ticket-button2:hover,
#brxe-fjddxk .eventinfo--ticket-button2:hover,
body .eventinfo--ticket-button2:hover {
  background-color: var(--member-cta);
  color: white;
  transform: translateY(-3px) scale(1.05);
  box-shadow: 0 5px 12px rgba(240, 128, 128, 0.2); 
}

#brx-content .eventinfo--ticket-button2:active,
#brxe-fjddxk .eventinfo--ticket-button2:active,
body .eventinfo--ticket-button2:active {
  transform: translateY(0);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

@media (max-width: 767px) {
  #brx-content .eventinfo--ticket-button2,
  #brxe-fjddxk .eventinfo--ticket-button2,
  body .eventinfo--ticket-button2 {
    width: 100%;
    padding: var(--space-s) var(--space-m);
  }
}


#brx-content .eventinfo--back-button,
#brxe-fjddxk .eventinfo--back-button,
body .eventinfo--back-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-s) var(--space-m);
  background-color: var(--primary);
  color: var(--secondary);
  font-weight: 500;
  font-size: var(--text-m);
  border-radius: var(--radius-m);
  border: 2px solid var(--tertiary);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  transition: all 0.3s ease;
  text-decoration: none;
  cursor: pointer;
}

#brx-content .eventinfo--back-button:hover,
#brxe-fjddxk .eventinfo--back-button:hover,
body .eventinfo--back-button:hover {
  background-color: var(--primary-light);
  border-color: var(--tertiary-dark);
  color: var(--secondary-dark);
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

#brx-content .eventinfo--back-button:active,
#brxe-fjddxk .eventinfo--back-button:active,
body .eventinfo--back-button:active {
  transform: translateY(0);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

@media (max-width: 767px) {
  #brx-content .eventinfo--back-button,
  #brxe-fjddxk .eventinfo--back-button,
  body .eventinfo--back-button {
    width: 100%;
    padding: var(--space-s) var(--space-m);
  }
}


#brx-content #brxe-fjddxk {
  display: flex;
  justify-content: space-between;
  gap: var(--space-m);
  flex-wrap: wrap;
}

@media (max-width: 767px) {
  #brx-content #brxe-fjddxk {
    flex-direction: column;
    gap: var(--space-s);
  }
}


.eventinfo--content-text a {
  color: #cf718f !important;
  text-decoration: none !important;
  border-bottom: 2px solid rgba(207, 113, 143, 0.4) !important;
  padding-bottom: 1px !important;
  font-weight: 500 !important;
}

.eventinfo--content-text a:hover {
  color: #a55871 !important;
  border-bottom-color: #cf718f !important;
  background-color: rgba(207, 113, 143, 0.1) !important;
  padding: 2px 4px !important;
  margin: 0 -4px !important;
  border-radius: 2px !important;
}

.eventinfo--content-text a[href*="facebook.com"] {
  color: #344734 !important;
  border-bottom-color: rgba(52, 71, 52, 0.4) !important;
}

.eventinfo--content-text a[href*="facebook.com"]:hover {
  color: #1a2518 !important;
  border-bottom-color: #344734 !important;
  background-color: rgba(52, 71, 52, 0.1) !important;
}



#brx-content #brxe-mhujmt {
  display: grid;
  grid-template-columns: var(--grid-2-1);
  grid-gap: var(--space-m);
}

@media (max-width: 767px) {
  #brx-content #brxe-mhujmt {
    grid-template-columns: var(--grid-1);
  }
}



@media (max-width: 767px) {
  #brx-content .hide--mobile-in-template,
  body .hide--mobile-in-template {
    display: none;
  }
}