/*
 * Terminkalender styles - Track C Phase 4 patch (v0.11.5).
 *
 * v0.11.5 changes:
 *  - View toggle hidden entirely on mobile (was Liste-only after v0.11.2;
 *    now the whole .rc-cal-view-toggle container collapses since there is
 *    nothing left to toggle between).
 *  - Mobile filter dropdowns open as a full-width centered overlay with a
 *    `[open]::before` backdrop, header (.rc-cal-filter-menu-header with
 *    title h3 + close-X), and full-width Leeren button below the list.
 *    Desktop layout unchanged (anchored 240 px panel under the summary).
 *  - .rc-cal-filter-apply / .rc-cal-filter-clear styles dropped - filters
 *    now auto-apply on checkbox change. .rc-cal-filter-reset (full-width)
 *    + .rc-cal-filter-status (live "N Termine" label) replace them.
 *
 * v0.11.1 changes:
 *  - Chip is shorter (22 px height, 11 px font) and ellipsis-truncates
 *    instead of running into the next column.
 *  - .rc-cal-month-pager keeps prev/title/next at fixed positions via
 *    title min-width.
 *  - Range slider styles dropped (Alter is a multi-checkbox now).
 *  - .rc-cal-modal styles added (desktop chip-click); drawer kept for mobile.
 *
 * v0.11.3 changes (hotfix on top of v0.11.2):
 *  - Chip font selector specificity raised. v0.11.2 wrote `.rc-cal-chip { font: 500 10px/18px ... }`
 *    but Elementor ships an inline rule `.elementor-kit-714 button { font: ... }`
 *    (specificity 0,1,1) which beat our class-only rule (0,1,0); chips rendered
 *    16 px / 800 weight instead of 10 px / 500. Every chip rule is now scoped
 *    under `.rc-cal .rc-cal-chip` (0,2,0) to win over the Elementor kit rule.
 *
 * v0.11.2 changes:
 *  - Chip font dropped to 10px medium (was 11px) for tighter month grid.
 *  - Mobile (<=767px) hides the Monat toggle button - mobile is liste-only
 *    because the grid would force-wrap blog widgets in the theme footer.
 *  - .rc-cal-cta-primary text colour locked to #ffffff !important across
 *    :link/:visited/:hover/:focus to beat any theme `<a>` colour rules
 *    (the live screenshot showed an empty green button on /terminkalender/
 *    because theme global links inherited green, hiding white-on-green text).
 *  - Agenda list-row text trimmed to 12 px on mobile for fit + readability.
 *
 * SCOPE: every selector is rooted at .rc-cal so nothing leaks into the theme.
 *
 * COLOR DISCIPLINE: #00BF63 (robbo-green) is reserved for primary CTAs and
 * the today-cell border. Chips use category-coded hues that do NOT collide.
 * View-toggle active state is slate-800.
 */

.rc-cal {
  box-sizing: border-box;
  width: 100%;
  max-width: 1366px;
  margin: 0 auto;
  padding: 24px 32px 64px;
  font-family: 'ProximaNova', 'Proxima Nova', 'Noto Sans', sans-serif;
  font-size: 15px;
  line-height: 1.5;
  color: #1e293b;
}

.rc-cal *,
.rc-cal *::before,
.rc-cal *::after {
  box-sizing: border-box;
}

/* Specificity 0,1,1 - same as `.elementor-kit-714 button` but loads later
 * and wins. Reset typography to inherit so individual class rules below
 * own the final size/weight without fighting Elementor's kit vars.
 */
.rc-cal button {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  cursor: pointer;
}

.rc-cal a {
  color: #00BF63;
  text-decoration: none;
}

.rc-cal a:hover {
  text-decoration: underline;
}

/* --- Filter bar ---------------------------------------------------------- */

.rc-cal-filters {
  display: flex;
  flex-wrap: nowrap;
  gap: 16px;
  padding: 8px 0 16px;
  border-bottom: 1px solid #f1f5f9;
  margin-bottom: 16px;
}

.rc-cal-filter {
  position: relative;
  flex: 0 1 auto;
}

.rc-cal .rc-cal-filter > .rc-cal-filter-summary {
  list-style: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #ffffff;
  font: 500 14px/1.4 'ProximaNova', 'Proxima Nova', sans-serif;
  color: #1e293b;
  user-select: none;
  transition: border-color 0.15s, box-shadow 0.15s;
  white-space: nowrap;
}

.rc-cal-filter > .rc-cal-filter-summary::-webkit-details-marker { display: none; }
.rc-cal-filter > .rc-cal-filter-summary::marker { content: ''; }

.rc-cal-filter > .rc-cal-filter-summary:hover { border-color: #94a3b8; }

.rc-cal-filter[open] > .rc-cal-filter-summary {
  border-color: #00BF63;
  box-shadow: 0 0 0 2px rgba(0, 191, 99, 0.15);
}

.rc-cal-filter-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  background: #00BF63;
  color: #ffffff;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 600;
}

.rc-cal-filter-caret {
  font-size: 11px;
  color: #64748b;
  transition: transform 0.15s;
}

.rc-cal-filter[open] .rc-cal-filter-caret {
  transform: rotate(180deg);
}

.rc-cal-filter-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 50;
  min-width: 240px;
  max-height: 360px;
  display: flex;
  flex-direction: column;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
  padding: 0;
  overflow: hidden;
}

.rc-cal-filter-list {
  list-style: none;
  margin: 0;
  padding: 8px 0;
  max-height: 260px;
  overflow-y: auto;
  flex: 1 1 auto;
}

.rc-cal-filter-list li { margin: 0; padding: 0; }

.rc-cal-filter-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  cursor: pointer;
  font-size: 14px;
  color: #1e293b;
  transition: background 0.1s;
}

.rc-cal-filter-option:hover { background: #f8fafc; }

.rc-cal-filter-option input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: #00BF63;
  margin: 0;
}

/* Auto-apply filter menu footer (v0.11.5).
 * Status text shows live "N Termine" matching the current filter state.
 * Leeren button takes full menu width below it and resets THIS dropdown
 * back to its default. For Art (category) the default is "all except
 * kurse-in-schule"; for the other dropdowns the default is empty.
 */
.rc-cal-filter-menu-header { display: none; }

.rc-cal-filter-status {
  padding: 10px 14px;
  font: 500 13px/1.3 'ProximaNova', 'Proxima Nova', sans-serif;
  color: #64748b;
  border-top: 1px solid #f1f5f9;
  background: #f8fafc;
  text-align: left;
}

.rc-cal-filter-reset {
  display: block;
  width: 100%;
  padding: 12px 14px;
  background: #f8fafc;
  border: 0;
  border-top: 1px solid #f1f5f9;
  color: #475569;
  font: 500 14px/1 'ProximaNova', 'Proxima Nova', sans-serif;
  cursor: pointer;
  text-align: center;
  transition: background 0.15s, color 0.15s;
}
.rc-cal-filter-reset:hover {
  background: #f1f5f9;
  color: #1e293b;
}
.rc-cal-filter-reset:active { transform: translateY(1px); }

/* --- Active filter pills ------------------------------------------------- */

.rc-cal-active {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 4px 0 16px;
  padding: 8px 12px;
  background: #f8fafc;
  border-radius: 8px;
}

.rc-cal-active-pills { display: contents; }

.rc-cal-active-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 999px;
  font-size: 13px;
  color: #1e293b;
}

.rc-cal-active-pill button {
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  font-size: 16px;
  line-height: 1;
  color: #94a3b8;
  cursor: pointer;
}
.rc-cal-active-pill button:hover { color: #1e293b; }

.rc-cal-clear-all {
  margin-left: auto;
  background: transparent;
  border: 0;
  color: #64748b;
  font-size: 13px;
  text-decoration: underline;
}

/* --- Month bar (frozen pager) -------------------------------------------- */

.rc-cal-month-bar {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 4px 0 16px;
}

.rc-cal-month-pager {
  display: flex;
  align-items: center;
  gap: 12px;
}

.rc-cal-month-title {
  min-width: 180px;
  text-align: center;
  margin: 0;
  font: 700 24px/1.2 'Plakkaat', 'ProximaNova', sans-serif;
  color: #1e293b;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.rc-cal .rc-cal-nav {
  width: 36px;
  height: 36px;
  border: 1px solid #e5e7eb;
  background: #ffffff;
  border-radius: 8px;
  font: 400 18px/1 'ProximaNova', 'Proxima Nova', sans-serif;
  color: #475569;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: border-color 0.15s, background 0.15s;
}
.rc-cal .rc-cal-nav:hover { border-color: #94a3b8; background: #f8fafc; }

.rc-cal-view-toggle {
  display: inline-flex;
  margin-left: auto;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  overflow: hidden;
  background: #ffffff;
}

.rc-cal .rc-cal-view-btn {
  padding: 8px 16px;
  background: #ffffff;
  border: 0;
  font: 500 14px/1.2 'ProximaNova', 'Proxima Nova', sans-serif;
  color: #475569;
  transition: background 0.15s, color 0.15s;
}

.rc-cal .rc-cal-view-btn + .rc-cal-view-btn {
  border-left: 1px solid #e5e7eb;
}

.rc-cal .rc-cal-view-btn:hover:not(.is-active) { background: #f1f5f9; color: #1e293b; }

.rc-cal .rc-cal-view-btn.is-active {
  background: #1e293b;
  color: #ffffff;
}

/* --- Month grid (single CSS Grid) ---------------------------------------- */

.rc-cal-grid {
  display: grid;
  grid-template-columns: 48px repeat(7, minmax(0, 1fr));
  gap: 1px;
  background: #e5e7eb;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  overflow: hidden;
}

.rc-cal-grid-cell {
  background: #ffffff;
  padding: 8px;
  min-height: 24px;
}

.rc-cal-grid-head {
  background: #f8fafc;
  font: 600 13px 'ProximaNova', sans-serif;
  color: #475569;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  text-align: left;
  padding: 10px 8px;
}

.rc-cal-grid-kw {
  background: #f8fafc;
  color: #94a3b8;
  font: 600 12px 'ProximaNova', sans-serif;
  text-align: center;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 10px;
}

.rc-cal-grid-day-cell {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-height: 110px;
  padding: 6px 6px 8px;
  position: relative;
}

.rc-cal-grid-day-cell.is-today {
  background: rgba(0, 191, 99, 0.04);
  box-shadow: inset 0 0 0 2px #00BF63;
}

.rc-cal-grid-cell-other {
  background: #fafafa;
  color: #cbd5e1;
  min-height: 110px;
}
.rc-cal-grid-cell-other .rc-cal-grid-day { color: #cbd5e1; }

.rc-cal-grid-day {
  font: 600 13px 'ProximaNova', sans-serif;
  color: #475569;
}

.is-today .rc-cal-grid-day { color: #00BF63; }

.rc-cal-chips {
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin-top: 2px;
  min-width: 0;
}

/* --- Chips: compact, ellipsis-truncated --------------------------------- */

/* Specificity 0,2,0 to beat Elementor's `.elementor-kit-714 button` (0,1,1)
 * which would otherwise force the chip font to the kit's typography vars
 * (16 px / 800 weight). v0.11.2 missed this; v0.11.3 hotfix.
 */
.rc-cal .rc-cal-chip {
  height: 22px;
  padding: 2px 6px;
  border: 0;
  border-radius: 4px;
  background: #475569;
  color: #ffffff;
  font: 500 10px/18px 'ProximaNova', 'Proxima Nova', sans-serif;
  letter-spacing: 0.01em;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
  width: 100%;
  display: block;
  transition: filter 0.15s, transform 0.05s;
}
.rc-cal .rc-cal-chip:hover { filter: brightness(0.92); }
.rc-cal .rc-cal-chip:active { transform: translateY(1px); }
.rc-cal .rc-cal-chip.is-full { opacity: 0.6; }

.rc-cal .rc-cal-chip-probestunden        { background: #4F46E5; }
.rc-cal .rc-cal-chip-kurse                { background: #0E7490; }
.rc-cal .rc-cal-chip-kurse-in-schule      { background: #0F766E; }
.rc-cal .rc-cal-chip-camps                { background: #EA580C; }
.rc-cal .rc-cal-chip-workshops            { background: #7C3AED; }
.rc-cal .rc-cal-chip-geburtstage          { background: #DB2777; }
.rc-cal .rc-cal-chip-tag-der-offenen-tuer { background: #0891B2; }

.rc-cal .rc-cal-chip-more {
  margin-top: 2px;
  background: transparent;
  border: 0;
  padding: 2px 4px;
  font: 500 11px/1.4 'ProximaNova', 'Proxima Nova', sans-serif;
  color: #64748b;
  text-align: left;
  border-radius: 4px;
  text-decoration: underline;
}
.rc-cal .rc-cal-chip-more:hover { color: #1e293b; }

/* --- Agenda list (Liste view + mobile) ----------------------------------- */
/* Default: hidden. Visibility owned by .rc-cal-mode-* classes (no [hidden] attr). */

.rc-cal-list {
  display: none;
  flex-direction: column;
  gap: 16px;
}

.rc-cal-list-day {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.rc-cal-list-day-header {
  font: 600 14px 'ProximaNova', sans-serif;
  color: #475569;
  padding: 12px 4px 6px;
  border-bottom: 2px solid #e5e7eb;
  margin-bottom: 4px;
}

.rc-cal-list-day-header.is-today { color: #00BF63; }

.rc-cal-list-row {
  display: grid;
  grid-template-columns: 4px 64px 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.15s, transform 0.05s;
}
.rc-cal-list-row:hover { border-color: #94a3b8; }
.rc-cal-list-row:active { transform: translateY(1px); }
.rc-cal-list-row.is-full { opacity: 0.6; }

.rc-cal-list-strip {
  width: 4px;
  height: 32px;
  border-radius: 2px;
}

.rc-cal-list-time {
  font: 600 14px 'ProximaNova', sans-serif;
  color: #1e293b;
}

.rc-cal-list-text {
  font: 14px/1.4 'ProximaNova', sans-serif;
  color: #1e293b;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.rc-cal-list-trainer {
  font: 13px 'ProximaNova', sans-serif;
  color: #64748b;
}

/* --- Mode-class visibility ----------------------------------------------- */

.rc-cal.rc-cal-mode-monat .rc-cal-grid { display: grid; }
.rc-cal.rc-cal-mode-monat .rc-cal-list { display: none; }

.rc-cal.rc-cal-mode-liste .rc-cal-grid { display: none; }
.rc-cal.rc-cal-mode-liste .rc-cal-list { display: flex; }

/* --- Empty state --------------------------------------------------------- */

.rc-cal-empty {
  margin: 32px auto;
  padding: 32px 24px;
  text-align: center;
  background: #f8fafc;
  border-radius: 10px;
  max-width: 480px;
}

.rc-cal-empty p {
  margin: 0 0 12px;
  color: #475569;
  font-size: 15px;
}

.rc-cal-clear-inline {
  background: #00BF63;
  color: #ffffff;
  border: 0;
  border-radius: 6px;
  padding: 8px 16px;
  font: 14px/1 'ProximaNova', sans-serif;
}
.rc-cal-clear-inline:hover { background: #00A856; }

/* --- Popover ("+ N weitere" desktop) ------------------------------------ */

.rc-cal-popover {
  position: absolute;
  z-index: 60;
  min-width: 280px;
  max-width: 360px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.12);
  overflow: hidden;
}

.rc-cal-popover-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 14px;
  background: #f8fafc;
  border-bottom: 1px solid #e5e7eb;
}

.rc-cal-popover-title {
  margin: 0;
  font: 600 14px 'ProximaNova', sans-serif;
  color: #1e293b;
}

.rc-cal-popover-close {
  background: transparent;
  border: 0;
  font-size: 22px;
  line-height: 1;
  color: #64748b;
  padding: 0 4px;
}
.rc-cal-popover-close:hover { color: #1e293b; }

.rc-cal-popover-body {
  padding: 8px;
  max-height: 360px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

/* --- Detail rows shared by modal + drawer -------------------------------- */

.rc-cal-detail-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid #f1f5f9;
  font-size: 14px;
}
.rc-cal-detail-row:last-child { border-bottom: 0; }
.rc-cal-detail-label {
  color: #64748b;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.rc-cal-detail-icon { font-size: 16px; line-height: 1; }
.rc-cal-detail-value { color: #1e293b; font-weight: 600; text-align: right; }

.rc-cal-detail-desc {
  margin: 12px 0 0;
  padding: 12px 0 0;
  border-top: 1px solid #f1f5f9;
  color: #475569;
  font-size: 14px;
  line-height: 1.55;
}

/* --- CTAs (modal + drawer) ----------------------------------------------- */

.rc-cal-cta-row {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 16px;
  padding: 16px 0 0;
  border-top: 1px solid #f1f5f9;
}

/* Theme `a:visited` rules sometimes recolour links sitewide; lock our CTA
 * to white text + brand background across all link states with !important.
 */
.rc-cal-cta-primary,
.rc-cal-cta-primary:link,
.rc-cal-cta-primary:visited,
.rc-cal-cta-primary:hover,
.rc-cal-cta-primary:focus,
.rc-cal-cta-primary:active {
  background: #00BF63 !important;
  color: #ffffff !important;
  padding: 12px 22px;
  border: 0;
  border-radius: 8px;
  font: 600 14px/1 'ProximaNova', sans-serif;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}
.rc-cal-cta-primary:hover { background: #00A856 !important; }

.rc-cal-cta-primary.is-waitlist,
.rc-cal-cta-primary.is-waitlist:link,
.rc-cal-cta-primary.is-waitlist:visited,
.rc-cal-cta-primary.is-waitlist:hover,
.rc-cal-cta-primary.is-waitlist:focus {
  background: #475569 !important;
  color: #ffffff !important;
}
.rc-cal-cta-primary.is-waitlist:hover { background: #334155 !important; }

.rc-cal-cta-secondary,
.rc-cal-cta-secondary:link,
.rc-cal-cta-secondary:visited,
.rc-cal-cta-secondary:hover,
.rc-cal-cta-secondary:focus {
  background: #ffffff !important;
  color: #475569 !important;
  padding: 12px 20px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  font: 500 14px/1 'ProximaNova', sans-serif;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
}
.rc-cal-cta-secondary:hover { border-color: #94a3b8; color: #1e293b !important; }

/* --- Modal (desktop chip click) ----------------------------------------- */

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

.rc-cal-modal {
  position: fixed;
  inset: 0;
  z-index: 9998;
  display: flex;
  align-items: center;
  justify-content: center;
}

.rc-cal-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.55);
  backdrop-filter: blur(2px);
  animation: rc-cal-fade-in 0.18s ease;
}

.rc-cal-modal-panel {
  position: relative;
  width: 100%;
  max-width: 560px;
  max-height: 86vh;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(15, 23, 42, 0.25);
  padding: 0;
  display: flex;
  flex-direction: column;
  animation: rc-cal-pop-in 0.2s ease;
}

.rc-cal-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 20px 24px 12px;
  border-bottom: 1px solid #f1f5f9;
}

.rc-cal-modal-title {
  margin: 0;
  font: 700 20px/1.3 'ProximaNova', sans-serif;
  color: #1e293b;
}

.rc-cal-modal-close {
  background: transparent;
  border: 0;
  font-size: 24px;
  line-height: 1;
  color: #64748b;
  padding: 4px 8px;
  cursor: pointer;
  margin-top: -4px;
}
.rc-cal-modal-close:hover { color: #1e293b; }

.rc-cal-modal-body {
  padding: 16px 24px 0;
  overflow-y: auto;
  flex: 1 1 auto;
}

.rc-cal-modal-footer {
  padding: 0 24px 20px;
}

@keyframes rc-cal-fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes rc-cal-pop-in {
  from { opacity: 0; transform: scale(0.97); }
  to   { opacity: 1; transform: scale(1); }
}

/* --- Drawer (mobile event detail) ---------------------------------------- */

.rc-cal-drawer[hidden] { display: none; }

.rc-cal-drawer {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

.rc-cal-drawer-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.5);
  animation: rc-cal-fade-in 0.2s ease;
}

.rc-cal-drawer-panel {
  position: relative;
  width: 100%;
  max-width: 640px;
  max-height: 90vh;
  background: #ffffff;
  border-radius: 16px 16px 0 0;
  padding: 8px 20px 24px;
  overflow-y: auto;
  animation: rc-cal-slide-up 0.25s ease;
}

@keyframes rc-cal-slide-up {
  from { transform: translateY(100%); }
  to   { transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .rc-cal-drawer-backdrop, .rc-cal-drawer-panel,
  .rc-cal-modal-backdrop, .rc-cal-modal-panel { animation: none !important; }
}

.rc-cal-drawer-handle {
  display: block;
  width: 44px;
  height: 4px;
  margin: 6px auto 12px;
  background: #cbd5e1;
  border: 0;
  border-radius: 4px;
}

.rc-cal-drawer-title {
  margin: 0 0 12px;
  font: 700 18px/1.3 'ProximaNova', sans-serif;
  color: #1e293b;
}

/* --- Mobile (<768px) ----------------------------------------------------- */

@media (max-width: 767px) {
  .rc-cal {
    padding: 16px 12px 48px;
    font-size: 14px;
  }

  .rc-cal-filters {
    flex-wrap: wrap;
    gap: 8px;
  }
  .rc-cal-filter { flex: 1 1 calc(33.333% - 6px); min-width: 0; }
  .rc-cal-filter > .rc-cal-filter-summary {
    width: 100%;
    justify-content: space-between;
    padding: 10px 12px;
    min-height: 44px;
  }
  .rc-cal-filter-menu {
    left: 0;
    right: 0;
    min-width: 0;
    max-width: none;
  }

  .rc-cal-month-bar { gap: 8px; flex-wrap: wrap; }
  .rc-cal-month-pager { gap: 8px; }
  .rc-cal-month-title { min-width: 130px; font-size: 20px; }

  /* v0.11.5: mobile is liste-only AND has no toggle. The whole view-toggle
   * group collapses since there is nothing to choose between.
   */
  .rc-cal-view-toggle { display: none; }

  /* Month grid hidden on mobile, agenda list takes over. */
  .rc-cal-grid,
  .rc-cal.rc-cal-mode-monat .rc-cal-grid { display: none; }
  .rc-cal-list,
  .rc-cal.rc-cal-mode-monat .rc-cal-list { display: flex; }

  .rc-cal-list-row { min-height: 56px; }
  .rc-cal-list-time   { font-size: 13px; }
  .rc-cal-list-text   { font-size: 12px; }
  .rc-cal-list-trainer{ font-size: 11px; }

  .rc-cal-popover { display: none !important; }

  /* Use drawer instead of modal on mobile. */
  .rc-cal-modal { display: none !important; }

  /* v0.11.5: filter dropdowns become full-width centered overlay cards with
   * a backdrop. The mobile [hidden] header (title + close-X) appears.
   * Touch targets at >= 44 px per accessibility convention.
   */
  .rc-cal .rc-cal-filter[open]::before {
    content: '';
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.4);
    z-index: 9990;
  }
  .rc-cal .rc-cal-filter[open] > .rc-cal-filter-menu {
    position: fixed;
    top: 50%;
    left: 50%;
    right: auto;
    transform: translate(-50%, -50%);
    width: calc(100vw - 32px);
    max-width: 420px;
    max-height: 80vh;
    z-index: 9991;
    padding: 0;
    border-radius: 12px;
    box-shadow: 0 16px 48px rgba(15, 23, 42, 0.16);
  }
  .rc-cal-filter-menu-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    border-bottom: 1px solid #f1f5f9;
    background: #ffffff;
  }
  .rc-cal-filter-menu-title {
    margin: 0;
    font: 600 16px/1.2 'ProximaNova', 'Proxima Nova', sans-serif;
    color: #1e293b;
  }
  .rc-cal-filter-menu-close {
    background: transparent;
    border: 0;
    font-size: 24px;
    line-height: 1;
    color: #475569;
    padding: 4px 8px;
    cursor: pointer;
    min-width: 44px;
    min-height: 44px;
  }
  .rc-cal-filter-menu-close:hover { color: #1e293b; }
  .rc-cal-filter-option {
    padding: 12px 14px;
    font: 14px 'ProximaNova', 'Proxima Nova', sans-serif;
    min-height: 44px;
  }
  .rc-cal-filter-reset {
    min-height: 48px;
    font-size: 15px;
  }
}

@media (min-width: 375px) and (max-width: 414px) {
  .rc-cal-filter { flex: 1 1 calc(33.333% - 6px); }
}

@media (max-width: 374px) {
  .rc-cal-filter { flex: 1 1 calc(50% - 4px); }
}