/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */
.page-template-default .embla {
  overflow: hidden;
  padding-bottom: 2rem;
}
.page-template-default .embla__container {
  grid-column: content / full;
  display: flex;
  gap: 0.5rem;
}
/* @media screen and (min-width: 1024px) {
  .page-template-default .embla__container {
    gap: 1rem;
  }
} */

.page-template-default .embla__slide {
  flex: 0 0 90%;
  min-width: 0;
}
@media screen and (min-width: 768px) {
  .page-template-default .embla__slide {
    flex: 0 0 55%;
  }
}
@media screen and (min-width: 1024px) {
  .page-template-default .embla__slide {
    flex: 0 0 33%;
  }
}
/*
@media screen and (min-width: 768px) {
  .iws-coach-showcase .embla__slide {
    flex: 0 0 55%;
  }
}
@media screen and (min-width: 1024px) {
  .iws-coach-showcase .embla__slide {
    flex: 0 0 33%;
  }
} */

/********************************************************************************
* "Siehe auch" carousel on single workshop pages
*
* Was missing its .embla__viewport wrapper, so the theme's generic
* initEmblaCarousel() (which requires one) never actually ran on it — no
* drag/snap, no arrows. Now matches the coach/workshop showcase carousels:
* .embla__prev/.embla__next live in workshop-single-indes.php, auto-wired
* by that same init.
********************************************************************************/
.single-workshop__linked-workshops .embla__viewport {
  overflow: hidden;
  /* .single-workshop__linked-workshops main is itself a grid item of the
     theme's outer .base-grid (header.php) — grid items default to
     min-width: auto, so without an explicit width here the embla track's
     intrinsic (unwrapped) content width bubbles up and blows out the whole
     page grid horizontally instead of being clipped at this viewport. */
  width: 100%;
  /* room for the card shadows, which would otherwise be clipped */
  padding: 0.5rem 0 2rem;
  margin: -0.5rem 0 -1rem;
}

.single-workshop__linked-workshops .embla__container {
  display: flex;
  gap: 0.5rem;
  /* Required so the browser leaves horizontal panning to Embla's own drag
     handling instead of native-scrolling the page (see indes-carousel.css). */
  touch-action: pan-y pinch-zoom;
}

/* Same slide widths as the workshop showcase carousel. */
.single-workshop__linked-workshops .embla__slide {
  flex: 0 0 90%;
  min-width: 0;
}

@media screen and (min-width: 768px) {
  .single-workshop__linked-workshops .embla__slide {
    flex: 0 0 55%;
  }
}

@media screen and (min-width: 1024px) {
  .single-workshop__linked-workshops .embla__slide {
    flex: 0 0 33%;
  }
}

/********************************************************************************
* Coach row on single workshop pages
*
* Same fixed-slide-width Embla carousel as the coach/workshop showcase blocks
* (workshop-single-indes.php wraps .coach-picture in .embla__viewport +
* .embla__prev/.embla__next, auto-wired by the theme's generic
* initEmblaCarousel()). The partial gives photo cards `w-full` inside
* `max-w-[200px]` but the no-photo placeholder a hard `w-[200px]` — both now
* sit in a `.embla__slide` with a fixed flex-basis so neither can shrink.
********************************************************************************/
.single-workshop__coach-carousel .embla__viewport {
  overflow: hidden;
  /* same reason as the "Siehe auch" viewport above: main is a grid item of
     the theme's outer .base-grid, so an explicit width is required to stop
     the embla track's intrinsic width from blowing out the page grid. */
  width: 100%;
  padding-inline: 0.5rem;
}

.single-workshop .coach-picture {
  /* leaves horizontal panning to Embla's own drag handling instead of
     native-scrolling the page (see indes-carousel.css). */
  touch-action: pan-y pinch-zoom;
}

.single-workshop .coach-picture > .embla__slide {
  flex: 0 0 200px;
  max-width: none;
  min-width: 0;
}

/* the no-photo placeholder carries its own w-[200px] */
.single-workshop .coach-picture > .embla__slide > a > div {
  width: 100%;
}

/* long names wrap to two lines inside the card rather than over it */
.single-workshop .coach-picture > .embla__slide > a + div {
  line-height: 1.2;
}

/********************************************************************************
* Print view of Workshop Detail Pages
********************************************************************************/
@media print {
  body::before,
  body::after {
    display: none !important;
  }

  .single-workshop {
  }

  .single-workshop .indes-header {
    display: none;
  }

  .single-workshop main.base-grid > .indes-spacer {
    display: none;
  }

  .single-workshop .indes-back-to-archive {
    display: none;
  }

  @media (orientation: landscape) {
    .single-workshop .article-right {
      margin-top: 0px;
      grid-column: center-start / feature !important;
    }
  }

  .single-workshop .article-left {
    padding-top: 1rem;
    top: 0px;
  }

  .single-workshop h1 {
    font-size: 30px;
  }

  .single-workshop .font-small {
    font-size: 1rem;
  }

  .single-workshop .single-workshop-color {
    print-color-adjust: exact;
  }

  .single-workshop .mt-24 {
    margin-top: 0px;
  }

  .single-workshop .pb-8 {
    padding-bottom: 0px;
  }

  .single-workshop .pt-8,
  .single-workshop .pt-4 {
    padding-top: 0.5rem;
  }

  .single-workshop .single-workshop__content {
    padding-top: 1rem;
    /* display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 1rem; */
  }

  .single-workshop__coach-carousel .embla__viewport {
    overflow: visible;
    padding-inline: 0;
  }

  .single-workshop .coach-picture {
    flex-wrap: wrap;
    transform: none !important;
  }

  .single-workshop__coach-carousel .embla__prev,
  .single-workshop__coach-carousel .embla__next {
    display: none;
  }

  .single-workshop .coach-picture img {
    max-height: 240px;
  }

  .single-workshop .site-footer {
    display: none;
  }

  /* A carousel only prints the visible slides, so drop it from the print view. */
  .single-workshop__linked-workshops {
    display: none;
  }
}

/********************************************************************************
* Workshop Schedule
********************************************************************************/
.workshop-schedule__wrapper {
  --indes--workshop--schedule--border-color: rgba(0, 0, 0, 0.05);
  --indes--workshop--schedule--hr-color: rgba(0, 0, 0, 0.5);
  --indes--workshop--schedule--bg-color: rgba(0, 0, 0, 0.05);
  --indes--workshop--schedule--link-color: rgba(0, 0, 0, 0.9);
  --indes--workshop--schedule--max-width: 2400px;
  overflow-x: auto;
  padding-right: 0.5rem;
  border-left: 1px solid
    var(--ws-border-color, var(--indes--workshop--schedule--border-color));
  width: 100vw;
  /* max-width: var(--indes--workshop--schedule--max-width); */
  margin-inline: auto;
}

@media screen and (min-width: 1024px) {
  .workshop-schedule__wrapper {
    width: 100%;
  }
}

/* Weekly columns: time rail fixed, day columns scroll — avoids sticky overlap */
.workshop-schedule__wrapper.workshop-schedule__wrapper--weekly-columns-split {
  overflow-x: visible;
}

.workshop-schedule.workshop-schedule--weekly-columns-shell {
  display: flex;
  align-items: stretch;
  /* width: 100%; */
  max-width: 100%;
  border-left: 1px solid
    var(--ws-border-color, var(--indes--workshop--schedule--border-color));
}

.workshop-schedule.workshop-schedule--weekly-rows-shell {
  border-left: 1px solid
    var(--ws-border-color, var(--indes--workshop--schedule--border-color));
}

.workshop-schedule__weekly-time-rail {
  display: grid;
  grid-template-columns: min-content;
  flex: 0 0 auto;
  box-sizing: border-box;
  border-right: 1px solid
    var(--ws-border-color, var(--indes--workshop--schedule--border-color));
}

.workshop-schedule__weekly-time-rail__cell {
  background-color: var(--ws-entry-bg, #fff);
  position: relative;
  z-index: 1;
}

.workshop-schedule__weekly-days-scroll {
  flex: 1 1 0;
  min-width: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.workshop-schedule.workshop-schedule__weekly-days-grid {
  border: none;
}

.workshop-schedule.workshop-schedule__weekly-days-grid::before {
  display: none;
}

.workshop-schedule {
  width: fit-content;
  position: relative;
  display: grid;
  gap: 1.5px;
  --iws-schedule-border: var(
    --ws-border-color,
    var(--indes--workshop--schedule--border-color)
  );
  border: 1px solid
    var(--ws-border-color, var(--indes--workshop--schedule--border-color));
  border-width: 1px 1px 1px 0;
}

.workshop-schedule::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  background-color: var(
    --ws-border-color,
    var(--indes--workshop--schedule--border-color)
  );
}

.workshop-schedule > * {
  background-color: var(--ws-entry-bg, #fff);
  position: relative;
  z-index: 1;
}

.workshop-schedule__cell {
  display: flex;
  flex-direction: column;
}

.workshop-schedule__header {
  border-bottom: 1px solid
    var(--ws-border-color, var(--indes--workshop--schedule--border-color));
}

.workshop-entry {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  align-items: center;
  justify-content: center;
  height: 100%;
  text-align: center;
  overflow: hidden;
}

.workshop-entry--next {
}

.workshop-entry__type {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 0.15rem;
  opacity: 0.5;
  transition: all 0.2s ease-in-out;
}

.workshop-entry:hover .workshop-entry__type {
  height: 100%;
  opacity: 0.15;
}
.workshop-entry__type--bg-fixed {
  height: 100%;
  opacity: 0.075;
}

.workshop-entry a {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0.5rem;
  text-decoration: none !important;
  color: var(--ws-entry-text, var(--indes--workshop--schedule--link-color));
}

.schedule-firstcol {
  position: sticky;
  z-index: 10;
  left: 0;
  font-weight: bold;
  background-color: var(--ws-entry-bg, #fff);
  border-right: 1px solid
    var(--ws-border-color, var(--indes--workshop--schedule--border-color));
}

/********************************************************************************
* Coach Showcase
********************************************************************************/
.iws-coach-showcase .coach-card__workshop-section {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  translate: 0 100%;
  transition: translate 0.3s ease-in-out;
}
.iws-coach-showcase .coach-card:hover .coach-card__workshop-section {
  translate: 0 0;
}

/*******************************************************************
Wishlist Link
*******************************************************************/
#workshop-wishlist {
  z-index: 1000;
  /* position: relative; */
  overflow: visible;
}

/* Ripple animation effect */
#workshop-wishlist::before,
#workshop-wishlist::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 4px solid darkred;
  opacity: 0;
  transform: translate(-50%, -50%) scale(1);
  pointer-events: none;
  box-shadow: 0 0 10px rgba(139, 0, 0, 0.5);
}

#workshop-wishlist.ripple-animate::before {
  animation: ripple 2s ease-out forwards;
}

#workshop-wishlist.ripple-animate::after {
  animation: ripple 2s ease-out 0.4s forwards;
}

@keyframes ripple {
  0% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
    border-width: 4px;
    box-shadow: 0 0 10px rgba(139, 0, 0, 0.5);
  }
  50% {
    opacity: 0.6;
    border-width: 3px;
    box-shadow: 0 0 20px rgba(139, 0, 0, 0.3);
  }
  100% {
    transform: translate(-50%, -50%) scale(6);
    opacity: 0;
    border-width: 2px;
    box-shadow: 0 0 30px rgba(139, 0, 0, 0);
  }
}

/*******************************************************************
Weekly schedule (per-week border via inline --iws-schedule-border)
*******************************************************************/
.workshop-schedule__border-b {
  border-bottom: 1px solid var(--iws-schedule-border);
}

.workshop-schedule__border-r {
  border-right: 1px solid var(--iws-schedule-border);
}

.workshop-schedule__day-column,
.workshop-schedule__day-row {
  position: relative;
}

.workshop-entry--weekly {
  position: absolute;
  box-sizing: border-box;
  padding: 8px;
}

.workshop-entry__link--rows-flush {
  padding: 0;
}

.workshop-entry__important-notice.is-compact {
  height: 30px;
  width: 30px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Touch: no hover, so the notice lives in the workshop modal instead. Let taps on the badge
   reach the entry link, and hide the tooltip (a tap would leave it stuck open via :hover). */
@media (hover: none) {
  .workshop-entry__important-notice {
    pointer-events: none !important;
  }

  .workshop-entry__important-tooltip {
    display: none !important;
  }
}

/* Screen-reader hint inside the entry link: this workshop has a notice (shown in the modal). */
.workshop-entry__important-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Important notice inside the workshop modal. */
.workshop-modal__notice {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  margin-bottom: 1rem;
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
  background: #991b1b;
  color: #fff;
  font-size: 0.875rem;
  line-height: 1.4;
}

.workshop-modal__notice[hidden] {
  display: none;
}

.workshop-modal__notice-icon {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  border: 1.5px solid #fff;
  border-radius: 50%;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1;
}

/* Time/location/next-session facts shown in the weekly schedule's workshop
   modal in place of the excerpt. */
.workshop-modal__info {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 1rem;
  row-gap: 0.35rem;
  margin: 0;
  font-size: 0.875rem;
}

.workshop-modal__info dt {
  font-weight: 700;
}

.workshop-modal__info dd {
  margin: 0;
}

.workshop-modal__info a {
  text-decoration: underline;
}

.workshop-modal__description:empty {
  margin: 0;
}

/*******************************************************************
External calendar — monthly grid view
*******************************************************************/
.iws-calendar {
  --iws-cal-border: rgba(0, 0, 0, 0.12);
  --iws-cal-bg: #fff;
  --iws-cal-muted: rgba(0, 0, 0, 0.45);
  --iws-cal-today: rgba(139, 0, 0, 0.08);
  width: 100%;
  max-width: 100%;
}

.iws-calendar__nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.iws-calendar__title {
  margin: 0;
  /* font-size: 1.35rem; */
  /* font-weight: 600; */
}

.iws-calendar__nav-controls {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

.iws-calendar__subscribe-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 2.5rem;
  margin-left: 0.5rem;
  padding: 0 0.75rem;
  border: 1px solid var(--iws-cal-border);
  border-radius: 4px;
  text-decoration: none;
  color: inherit;
  background: transparent;
  cursor: pointer;
  font-size: 0.875rem;
  font-family: inherit;
  line-height: 1;
  white-space: nowrap;
}

.iws-calendar__subscribe-btn:hover {
  background: var(--iws-cal-today);
}

.iws-calendar__subscribe {
  position: relative;
}

.iws-calendar__subscribe > summary {
  list-style: none;
}

.iws-calendar__subscribe > summary::-webkit-details-marker {
  display: none;
}

.iws-calendar__subscribe-menu {
  position: absolute;
  top: calc(100% + 0.25rem);
  right: 0;
  z-index: 20;
  min-width: 15rem;
  margin: 0;
  padding: 0.25rem 0;
  list-style: none;
  border: 1px solid var(--iws-cal-border);
  border-radius: 4px;
  background: #fff;
}

.iws-calendar__subscribe-menu a,
.iws-calendar__subscribe-menu button {
  display: block;
  width: 100%;
  padding: 0.5rem 0.75rem;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 0.875rem;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.iws-calendar__subscribe-menu a:hover,
.iws-calendar__subscribe-menu button:hover {
  background: var(--iws-cal-today);
}

.iws-calendar__nav-prev,
.iws-calendar__nav-next,
.iws-calendar__nav-today {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 2.5rem;
  border: 1px solid var(--iws-cal-border);
  border-radius: 4px;
  text-decoration: none;
  color: inherit;
  background: transparent;
  cursor: pointer;
  font-size: 1rem;
  font-family: inherit;
  line-height: 1;
}

.iws-calendar__nav-prev,
.iws-calendar__nav-next {
  width: 2.5rem;
  font-size: 1.25rem;
}

.iws-calendar__nav-today {
  padding: 0 0.75rem;
}

.iws-calendar__nav-prev:hover,
.iws-calendar__nav-next:hover,
.iws-calendar__nav-today:hover {
  background: rgba(0, 0, 0, 0.04);
}

.iws-calendar__grid {
  border: 1px solid var(--iws-cal-border);
  border-radius: 6px;
  overflow: hidden;
  background: var(--iws-cal-bg);
}

.iws-calendar__weekdays,
.iws-calendar__week {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.iws-calendar__day-name {
  padding: 0.5rem 0.35rem;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  text-align: center;
  background: rgba(0, 0, 0, 0.03);
  border-bottom: 1px solid var(--iws-cal-border);
}

.iws-calendar__week {
  min-height: 6.5rem;
  row-gap: 0.15rem;
}

/* Background cell: spans all rows of the week, carries borders and tints. */
.iws-calendar__day {
  border-right: 1px solid var(--iws-cal-border);
  border-bottom: 1px solid var(--iws-cal-border);
}

.iws-calendar__day:nth-child(7) {
  border-right: none;
}

.iws-calendar__day--today {
  background: var(--iws-cal-today);
}

.iws-calendar__day--other-month {
  background: rgba(0, 0, 0, 0.02);
}

.iws-calendar__day-num {
  padding: 0.35rem 0.35rem 0;
  font-size: 0.85rem;
  font-weight: 600;
  line-height: 1.2;
}

.iws-calendar__day-num--other-month {
  color: var(--iws-cal-muted);
}

/* Single-day events for one day, below the multi-day bar lanes. */
.iws-calendar__events {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-height: 0;
  padding: 0 0.35rem 0.35rem;
}

.iws-calendar__event {
  --cal-color: #4a6fa5;
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  padding: 0.15rem 0.35rem;
  border-radius: 3px;
  background: color-mix(in srgb, var(--cal-color) 18%, transparent);
  border-left: 3px solid var(--cal-color);
  font-size: 0.72rem;
  line-height: 1.25;
  overflow: hidden;
}

.iws-calendar__event[hidden] {
  display: none;
}

.iws-calendar__event--all-day {
  order: -1;
}

/* Multi-day event: one continuous bar per week, spanning day columns. */
.iws-calendar__event--bar {
  flex-direction: row;
  align-items: center;
  gap: 0.35rem;
  min-width: 0;
  margin: 0 0.25rem;
  padding: 0.2rem 0.4rem;
  background: color-mix(in srgb, var(--cal-color) 30%, transparent);
  z-index: 1;
}

.iws-calendar__event--bar.iws-calendar__event--cont-left {
  margin-left: 0;
  border-left: 0;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.iws-calendar__event--bar.iws-calendar__event--cont-right {
  margin-right: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.iws-calendar__event--bar .iws-calendar__event-time,
.iws-calendar__event--bar .iws-calendar__event-title {
  flex: 0 1 auto;
  min-width: 0;
}

.iws-calendar__event-time {
  font-weight: 600;
  opacity: 0.85;
}

.iws-calendar__event-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.iws-calendar__event-title a {
  color: inherit;
  text-decoration: none;
}

.iws-calendar__event-title a:hover {
  text-decoration: underline;
}

.iws-calendar__list {
  display: none;
}

@media (max-width: 600px) {
  .iws-calendar__grid {
    display: none;
  }

  .iws-calendar__list {
    display: block;
    margin-top: 1rem;
  }

  .iws-calendar__list-day {
    margin-bottom: 1.25rem;
  }

  .iws-calendar__list-day-title {
    margin: 0 0 0.5rem;
    font-size: 1rem;
    font-weight: 600;
  }

  .iws-calendar__list-events {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .iws-calendar__list-event {
    --cal-color: #4a6fa5;
    display: flex;
    gap: 0.5rem;
    align-items: baseline;
    padding: 0.5rem 0.65rem;
    margin-bottom: 0.35rem;
    border-left: 3px solid var(--cal-color);
    background: color-mix(in srgb, var(--cal-color) 12%, transparent);
    border-radius: 4px;
  }

  .iws-calendar__list-event-time {
    flex: 0 0 auto;
    font-size: 0.85rem;
    font-weight: 600;
    min-width: 3.5rem;
  }

  .iws-calendar__list-event-title {
    font-size: 0.95rem;
  }
}

.iws-calendar--loading {
  opacity: 0.5;
  pointer-events: none;
  transition: opacity 0.15s;
}

.iws-calendar__event {
  cursor: pointer;
}

/* Filter bar */
.iws-calendar__filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-bottom: 0.75rem;
}

.iws-calendar__filter-btn {
  display: inline-flex;
  align-items: center;
  height: 2rem;
  padding: 0 0.75rem;
  border: 1px solid var(--iws-cal-border);
  border-radius: 999px;
  background: transparent;
  cursor: pointer;
  font-size: 0.8125rem;
  font-family: inherit;
  color: inherit;
  line-height: 1;
  transition:
    background 0.1s,
    border-color 0.1s;
}

.iws-calendar__filter-btn:hover {
  background: rgba(0, 0, 0, 0.04);
}

.iws-calendar__filter-btn--active {
  background: rgba(0, 0, 0, 0.85);
  border-color: rgba(0, 0, 0, 0.85);
  color: #fff;
}

/* Calendar event modal */
.iws-cal-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.iws-cal-modal[hidden] {
  display: none;
}

.iws-cal-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
}

.iws-cal-modal__dialog {
  position: relative;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
  width: 100%;
  max-width: 480px;
  /* Same recipe as .iws-trial-modal__dialog: a long description (or, for the
     theme's day-detail modal reusing this same shell, many events on one
     day) could otherwise push the dialog taller than the viewport with no
     way to reach the rest of it. */
  max-height: 85vh;
  overflow-y: auto;
}

.iws-cal-modal__color-bar {
  height: 4px;
}

.iws-cal-modal__body {
  padding: 1.5rem;
}

.iws-cal-modal__close {
  position: absolute;
  top: 0.6rem;
  right: 0.6rem;
  width: 2rem;
  height: 2rem;
  border: none;
  background: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  padding: 0;
}

.iws-cal-modal__title {
  font-size: 1.2rem;
  font-weight: 600;
  margin: 0 2.5rem 0.75rem 0;
}

.iws-cal-modal__datetime {
  font-size: 0.875rem;
  color: rgba(0, 0, 0, 0.6);
  margin: 0 0 0.4rem;
}

.iws-cal-modal__location {
  font-size: 0.875rem;
  color: rgba(0, 0, 0, 0.6);
  margin: 0 0 0.4rem;
}

.iws-cal-modal__description {
  font-size: 1rem;
  margin: 0.75rem 0 0;
  white-space: pre-line;
}

.iws-cal-modal__link,
.iws-cal-modal__workshop-link {
  display: inline-block;
  margin-top: 1rem;
  margin-right: 0.5rem;
  padding: 0.45rem 1.1rem;
  border: 1px solid rgba(0, 0, 0, 0.25);
  border-radius: 4px;
  text-decoration: none;
  font-size: 0.875rem;
  color: inherit;
}

.iws-cal-modal__link:hover,
.iws-cal-modal__workshop-link:hover {
  background: rgba(0, 0, 0, 0.04);
}

/* Trial class request modal */
.iws-trial-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.iws-trial-modal[hidden] {
  display: none;
}

.iws-trial-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
}

.iws-trial-modal__dialog {
  position: relative;
  background: #fff;
  color: #000;
  border-radius: 8px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
  width: 100%;
  max-width: 560px;
  max-height: 85vh;
  overflow-y: auto;
}

.iws-trial-modal__body {
  padding: 1.5rem;
}

.iws-trial-modal__close {
  position: absolute;
  top: 0.6rem;
  right: 0.6rem;
  width: 2rem;
  height: 2rem;
  border: none;
  background: transparent;
  color: rgba(0, 0, 0, 0.6);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  padding: 0;
}

.iws-trial-modal__close:hover {
  color: #000;
}

.iws-trial-modal__title {
  font-size: 1.2rem;
  font-weight: 600;
  margin: 0 2.5rem 0.25rem 0;
}

.iws-trial-modal__workshop {
  font-size: 0.875rem;
  color: rgba(0, 0, 0, 0.6);
  margin: 0 0 1rem;
}

/* Upcoming sessions box (workshop single view) */
.iws-upcoming-sessions {
  position: relative;
  margin-top: 0.75rem;
  margin-right: 2rem;
  padding: 0.75rem 1rem;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 8px;
}

.iws-upcoming-sessions__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.iws-upcoming-sessions__title {
  font-size: 0.8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.iws-upcoming-sessions__toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  line-height: 1;
  background: transparent;
  cursor: pointer;
  padding: 0;
  font-size: 1rem;
}

.iws-upcoming-sessions__toggle:hover {
  background: rgba(0, 0, 0, 0.04);
}

.iws-upcoming-sessions__next {
  margin-top: 0.35rem;
  font-size: 0.875rem;
}

.iws-upcoming-sessions__more {
  list-style: none;
  margin: 0.35rem 0 0;
  padding: 0.35rem 0 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.iws-upcoming-sessions__more li {
  margin: 0.25rem 0;
  font-size: 0.875rem;
}

.iws-upcoming-sessions__more[hidden] {
  display: none;
}

/********************************************************************************
* Simple event (single view)
*
* Info box (date, venue, price, contact):
*  - < 1024px: stacked card above the content
*  - 1024-1599px: wrapping meta row above the content
*  - >= 1600px: sticky in the left gutter of the theme's base-grid, so the
*    content column keeps its full width at every breakpoint
********************************************************************************/
.iws-event-info {
  padding: 0.75rem 1rem;
  border: 1px solid color-mix(in srgb, currentColor 25%, transparent);
  border-radius: 8px;
  font-size: 0.875rem;
  line-height: 1.4;
}

.iws-event-info__row + .iws-event-info__row {
  margin-top: 0.75rem;
}

.iws-event-info__label {
  margin-bottom: 0.15rem;
  font-size: 0.8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.iws-event-info__value a {
  text-decoration: underline;
  overflow-wrap: anywhere;
}

.iws-event-info__button {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 1.25rem;
  border-radius: 8px;
  background: #000;
  color: #fff;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
}

.iws-event-info__button:hover,
.iws-event-info__button:focus-visible {
  background: #333;
  color: #fff;
}

@media (min-width: 1024px) and (max-width: 1599px) {
  .iws-event-info__row--registration {
    margin-left: auto;
    align-self: center;
  }
}

@media (min-width: 1024px) {
  .iws-event-info {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 2.5rem;
  }

  .iws-event-info__row + .iws-event-info__row {
    margin-top: 0;
  }
}

/* Page title: kept in the DOM for SEO/screen readers, visually hidden */
.iws-event-single__title {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.iws-event-single__thumbnail {
  margin-bottom: 1.5rem;
}

.iws-event-single__thumbnail img {
  display: block;
  width: 100%;
  height: auto;
}

/* Featured image: feature-wide, directly under the h1 */
@media (min-width: 1024px) {
  .iws-event-single__layout.base-grid > .iws-event-single__thumbnail {
    grid-column: feature;
  }
}

@media (min-width: 1600px) {
  /* Row 1: featured image (the h1 is visually hidden). Row 2: box in the
     left gutter + content, so the box starts below the image. */
  .iws-event-single__layout.base-grid > .iws-event-single__thumbnail {
    grid-row: 1;
  }

  .iws-event-single__layout.base-grid > .iws-event-single__aside {
    grid-column: full-start / content-start;
    grid-row: 2;
    align-self: start;
    justify-self: end;
    position: sticky;
    top: 10rem;
    padding-right: 1.5rem;
    z-index: 10;
    max-width: 300px;
  }

  .iws-event-single__layout.base-grid > .iws-event-single {
    grid-column: content;
    grid-row: 2;
  }

  .iws-event-single__aside .iws-event-info {
    display: block;
    margin-block: 0;
  }
}

@media print {
  .iws-event-single__aside {
    position: static !important;
  }
}

/********************************************************************************
* Discord links box
*
* Used both in the simple event aside (below the info box) and in the single
* workshop sidebar (below the existing sidebar content).
********************************************************************************/
.iws-discord-links {
  padding: 0.75rem 1rem;
  border: 1px solid color-mix(in srgb, currentColor 25%, transparent);
  border-radius: 8px;
  font-size: 0.875rem;
  line-height: 1.4;
}

.iws-event-info + .iws-discord-links {
  margin-top: 0.75rem;
}

@media (min-width: 1024px) {
  .iws-event-info + .iws-discord-links {
    margin-top: 1rem;
  }
}

.iws-discord-links__title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
  font-size: 0.8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.iws-discord-links__icon {
  width: 1.125rem;
  height: 1.125rem;
  flex-shrink: 0;
  color: #5865f2;
}

.iws-discord-links__list {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.iws-discord-links__item {
  margin: 0;
  padding: 0;
  list-style: none;
}

.iws-discord-links__link {
  text-decoration: underline;
  overflow-wrap: anywhere;
}

/********************************************************************************
* Simple events overview (archive)
*
* List: date + place in a left column; title, uncropped featured image and
* excerpt to the right. Stacked below 640px.
********************************************************************************/
.iws-event-archive__title,
.iws-event-archive__section-title,
.iws-event-archive__empty,
.iws-event-archive .navigation.pagination {
  margin-block: 2rem 1.5rem;
}

.iws-event-list {
  display: flex;
  flex-direction: column;
  gap: 3rem;
  margin: 0 0 2rem;
  padding: 0;
  list-style: none;
}

.iws-event-archive.base-grid > .iws-event-archive__title,
.iws-event-archive.base-grid > .iws-event-archive__section-title,
.iws-event-archive.base-grid > .iws-event-archive__empty,
.iws-event-archive.base-grid > .navigation {
  grid-column: content;
}

.iws-event-archive.base-grid > .iws-event-archive__intro,
.iws-event-archive.base-grid > .iws-event-archive__outro {
  grid-column: content;
}

.iws-event-archive.base-grid > .iws-event-list {
  grid-column: feature;
}

.iws-event-card {
  margin: 0;
  padding: 0;
  list-style: none;
}

.iws-event-card__link {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.75rem;
  color: inherit;
  text-decoration: none;
}

@media (min-width: 640px) {
  .iws-event-card__link {
    grid-template-columns: 9rem minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
  }

  /* Keep the main column aligned even when an event has no date/place */
  .iws-event-card__main {
    grid-column: 2;
  }
}

/* Featured images (wide banners) are shown uncropped at their natural ratio */
.iws-event-card__image img {
  display: block;
  width: 100%;
  height: auto;
}

.iws-event-card__main {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.iws-event-card__meta {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.3;
}

.iws-event-card__date {
  font-weight: 700;
}

.iws-event-card__title {
  margin: 0;
  font-size: 1.5rem;
  line-height: 1.2;
}

.iws-event-card__link:hover .iws-event-card__title,
.iws-event-card__link:focus-visible .iws-event-card__title {
  text-decoration: underline;
}

.iws-event-card__excerpt {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.5;
}

/********************************************************************************
* Events Feature block
*
* Next upcoming simple events as cards: image, date + place, title, button.
* Two columns from 640px, stacked below. Loaded on every page, so this also
* styles the block on themes without the INDES base-grid.
********************************************************************************/
.iws-event-feature__title {
  margin: 0 0 1.5rem;
}

.iws-event-feature__list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 2rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

@media (min-width: 640px) {
  .iws-event-feature__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.iws-event-feature__card {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Featured images (wide banners) are shown uncropped at their natural ratio */
.iws-event-feature__image,
.iws-event-feature__image img {
  display: block;
  width: 100%;
  height: auto;
}

.iws-event-feature__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.75rem;
}

.iws-event-feature__meta {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.3;
}

.iws-event-feature__date {
  font-weight: 700;
}

.iws-event-feature__name {
  margin: 0;
  font-size: 1.5rem;
  line-height: 1.2;
}

.iws-event-feature__name a {
  color: inherit;
  text-decoration: none;
}

.iws-event-feature__name a:hover,
.iws-event-feature__name a:focus-visible {
  text-decoration: underline;
}

/* Button sits at the bottom so buttons line up across cards of different height */
.iws-event-feature__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: auto;
  padding: 0.75rem 1.25rem;
  border-radius: 8px;
  background: #000;
  color: #fff;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
}

.iws-event-feature__button:hover,
.iws-event-feature__button:focus-visible {
  background: #333;
  color: #fff;
}

/********************************************************************************
* Workshops Grid block
*
* Column count reacts to the block's own rendered width (container query),
* not the viewport - the grid-cols-* Tailwind viewport breakpoints it used to
* rely on broke when the block was nested inside a narrow WP Columns block.
********************************************************************************/
.workshops-grid-container {
  container-type: inline-size;
  container-name: workshops-grid;
}

/* Small viewports: edge-to-edge. A @container rule can't style the container
   itself, so this is a viewport query. The block is a direct child of the
   theme's base-grid, so the `full` column does it without 100vw/negative-margin
   hacks (ignored where the block isn't a grid child, e.g. inside Columns). */
@media (max-width: 479px) {
  .workshops-grid-container {
    grid-column: full;
  }

  .workshops-grid-container .workshop-grid__heading,
  .workshops-grid-container .workshop-grid__button-wrap {
    padding-inline: 0.5rem;
  }
}

/* Opt-in edge-to-edge on small viewports for blocks that are NOT a child of
   the theme's base-grid (e.g. inside Columns): add "iws-grid-bleed" under
   Advanced > Additional CSS class(es). --iws-bleed-offset is set by
   initGridBleed() in indes-workshops-public.js (distance from the viewport's
   left edge to the parent's content box); the fallback assumes a parent that
   is centered in the viewport. */
@media (max-width: 479px) {
  .workshops-grid-container.iws-grid-bleed {
    width: 100vw;
    max-width: none;
    margin-left: var(--iws-bleed-offset, calc(50% - 50vw));
  }
}

/* Narrow container (the former 1-column layout): horizontal Embla carousel.
   The JS starts Embla only while the list computes to display:flex, so this
   query is the single source of truth for the breakpoint. */
/* Arrows only exist while the list is a carousel; JS adds .is-hidden at the
   ends. Display is owned here (not by a Tailwind `hidden` toggle) so the
   container query stays the single source of truth. */
.workshops-grid-container .iws-grid-carousel__nav {
  display: none;
}

@container workshops-grid (max-width: 479px) {
  .workshops-grid-container .iws-grid-carousel__nav:not(.is-hidden) {
    display: flex;
  }

  .workshops-grid-container .iws-grid-carousel {
    position: relative;
    overflow: hidden;
    /* room for the cards' drop shadow, which overflow:hidden would clip */
    padding-bottom: 1.5rem;
    padding-inline: 0.5rem;
  }

  .workshops-grid-container .iws-grid-carousel__list {
    display: flex;
    row-gap: 0;
    /* leave horizontal panning to Embla's drag handling */
    touch-action: pan-y pinch-zoom;
    /* the list's Tailwind `transition-all` would ease Embla's per-frame
       transform updates, making drag/swipe feel laggy */
    transition: none;
  }

  .workshops-grid-container .iws-grid-carousel__slide {
    flex: 0 0 85%;
    min-width: 0;
  }
}

@container workshops-grid (min-width: 480px) {
  .workshops-grid-container .iws-grid-carousel__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@container workshops-grid (min-width: 720px) {
  .workshops-grid-container .iws-grid-carousel__list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@container workshops-grid (min-width: 960px) {
  .workshops-grid-container .iws-grid-carousel__list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@container workshops-grid (min-width: 1200px) {
  .workshops-grid-container .iws-grid-carousel__list {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

/* "Cards per row (max)" block setting: caps the staircase above at a fixed
   column count instead of letting it grow further on wide containers. */
@container workshops-grid (min-width: 480px) {
  .workshops-grid-container.iws-grid-max-cols-2 .iws-grid-carousel__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@container workshops-grid (min-width: 720px) {
  .workshops-grid-container.iws-grid-max-cols-2 .iws-grid-carousel__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .workshops-grid-container.iws-grid-max-cols-3 .iws-grid-carousel__list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@container workshops-grid (min-width: 960px) {
  .workshops-grid-container.iws-grid-max-cols-2 .iws-grid-carousel__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .workshops-grid-container.iws-grid-max-cols-3 .iws-grid-carousel__list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .workshops-grid-container.iws-grid-max-cols-4 .iws-grid-carousel__list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@container workshops-grid (min-width: 1200px) {
  .workshops-grid-container.iws-grid-max-cols-2 .iws-grid-carousel__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .workshops-grid-container.iws-grid-max-cols-3 .iws-grid-carousel__list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .workshops-grid-container.iws-grid-max-cols-4 .iws-grid-carousel__list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* Schedule: wishlist filter */
.workshop-schedule__wishlist-filter {
  margin-bottom: 1rem;
}

.workshop-schedule__wishlist-filter[hidden] {
  display: none;
}

.workshop-schedule__wishlist-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  cursor: pointer;
  user-select: none;
}

.workshop-schedule__wishlist-toggle-input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.workshop-schedule__wishlist-toggle-switch {
  position: relative;
  flex: none;
  width: 2.25rem;
  height: 1.25rem;
  border: 2px solid currentColor;
  border-radius: 999px;
  transition: background-color 0.2s;
}

.workshop-schedule__wishlist-toggle-switch::after {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: calc(1.25rem - 8px);
  height: calc(1.25rem - 8px);
  border-radius: 50%;
  background: currentColor;
  transition: transform 0.2s;
}

.workshop-schedule__wishlist-toggle-input:checked + .workshop-schedule__wishlist-toggle-switch {
  background-color: darkred;
  border-color: darkred;
}

.workshop-schedule__wishlist-toggle-input:checked + .workshop-schedule__wishlist-toggle-switch::after {
  background: #fff;
  transform: translateX(1rem);
}

.workshop-schedule__wishlist-toggle-input:focus-visible + .workshop-schedule__wishlist-toggle-switch {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

.iws-schedule-wishlist-only .workshop-entry--clickable:not(.is-wishlisted) {
  opacity: 0.2;
  transition: opacity 0.2s;
}

.iws-schedule-wishlist-only .workshop-entry--clickable:not(.is-wishlisted):hover {
  opacity: 0.6;
}

/* Coach image slider (single coach page; featured image is slide #1) */
.iws-coach-slider {
  position: relative;
}
.iws-coach-slider__viewport {
  overflow: hidden;
}
.iws-coach-slider__container {
  display: flex;
}
.iws-coach-slider__slide {
  flex: 0 0 100%;
  min-width: 0;
}
.iws-coach-slider__slide img {
  display: block;
}
/* Dot row, overlaid on the bottom edge of the image */
.iws-coach-slider__dots {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 1rem;
  display: flex;
  justify-content: center;
  gap: 0.5rem;
}
.iws-coach-slider__dot {
  width: 0.625rem;
  height: 0.625rem;
  padding: 0;
  border: 0;
  border-radius: 9999px;
  background: #fff;
  opacity: 0.5;
  cursor: pointer;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}
.iws-coach-slider__dot:hover,
.iws-coach-slider__dot.is-active {
  opacity: 1;
}
