.cal-nav { display:flex; align-items:center; gap:8px; }
.cal-btn {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:36px; height:36px; padding:0 10px;
  border:1px solid var(--border); border-radius:8px;
  background:#fff; color:var(--text); text-decoration:none;
  font-size:14px; font-weight:600;
  transition: border-color .15s, background .15s;
}
.cal-btn:hover { border-color: var(--brand); background: #fdf4f5; }
.cal-btn-today { background: var(--brand); color:#fff; border-color: var(--brand); }
.cal-btn-today:hover { background: var(--brand-dark, #a10c25); color:#fff; }
.cal-month { font-size:15px; font-weight:600; min-width:140px; text-align:center; color:var(--brand-dark, #a10c25); }

.cal-section { margin-top: 20px; min-width: 0; }
.cal-grid-head {
  display:grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap:6px;
  font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:0.06em;
  color:var(--muted); padding:0 4px 8px;
}
.cal-grid-head > div { text-align:center; }
.cal-grid {
  display:grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap:6px;
  width: 100%;
}
.cal-day {
  background:#fff; border:1px solid var(--border); border-radius:10px;
  min-height:110px; padding:6px 7px 8px;
  display:flex; flex-direction:column; gap:3px;
  transition: border-color .15s;
  min-width: 0;   /* Grid-Track darf schrumpfen -> keine Overflow-Ausbrüche */
  overflow: hidden;
}
.cal-day-other { background:#fafbfc; opacity: 0.55; }
.cal-day-today { border-color: var(--brand); box-shadow: 0 0 0 2px rgba(207,16,46,0.10); }
.cal-day-num { font-size:12.5px; font-weight:600; color:var(--muted); margin-bottom:2px; }
.cal-day-today .cal-day-num { color: var(--brand); }
.cal-chip {
  display:flex; align-items:flex-start; gap:4px;
  color:#fff; padding:3px 6px; border-radius:6px;
  font-size:11.5px; line-height:1.25;
  max-width: 100%;
  overflow: hidden;
  word-break: break-word;
  overflow-wrap: anywhere;
}
.cal-chip-time { font-weight:700; opacity:0.9; font-size:10.5px; flex-shrink:0; padding-top:1px; }
.cal-chip-title {
  min-width: 0;
  white-space: normal;
  word-break: break-word;
  overflow-wrap: anywhere;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.cal-chip-link { text-decoration:none; cursor:pointer; }
.cal-chip-link:hover { filter: brightness(1.08); }
.cal-chip-link:focus-visible { outline: 2px solid var(--text); outline-offset: 1px; }
.cal-more { font-size:11px; color:var(--muted); padding-left:2px; }

/* Filter-Legende: klickbare Buttons */
.cal-legend {
  display:flex; flex-wrap:wrap; align-items:center; gap: 8px 10px;
  padding: 10px 12px; margin-top: 10px;
  background:#fafbfc; border:1px solid var(--border); border-radius:8px;
  font-size:12px; color:var(--muted);
}
.cal-leg {
  display:inline-flex; align-items:center; gap:6px;
  padding: 5px 10px;
  border:1px solid var(--border); border-radius:999px;
  background:#fff; color: var(--text);
  font-size:12px; font-weight:500; cursor:pointer;
  transition: opacity .15s, background .15s, border-color .15s;
}
.cal-leg:hover { border-color: var(--text-2, #6b7280); }
.cal-leg.is-off { opacity: 0.35; text-decoration: line-through; }
.cal-leg-dot { width:9px; height:9px; border-radius:50%; display:inline-block; flex-shrink:0; }
.cal-leg-hint { font-size: 11.5px; color: var(--muted); margin-left: auto; }

/* Filter-States: gesteuert per [data-hide~="type"] am #cal-root-Wrapper */
#cal-root[data-hide~="meeting"] .cal-chip[data-type="meeting"],
#cal-root[data-hide~="meeting"] .up-row[data-type="meeting"] { display: none; }
#cal-root[data-hide~="event"]   .cal-chip[data-type="event"],
#cal-root[data-hide~="event"]   .up-row[data-type="event"]   { display: none; }
#cal-root[data-hide~="region"]  .cal-chip[data-type="region"],
#cal-root[data-hide~="region"]  .up-row[data-type="region"]  { display: none; }

@media (max-width: 720px) {
  .cal-day { min-height: 72px; padding:4px; }
  .cal-chip { padding:2px 4px; font-size:10px; }
  .cal-chip-title { -webkit-line-clamp: 3; }
  .cal-day-num { font-size:11px; }
  .cal-leg-hint { display: none; }
}

.up-section { margin-top: 24px; }
.up-month-head {
  font-size: 12px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.08em;
  color: var(--muted);
  padding: 18px 2px 8px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 10px;
}
.up-month-head:first-child { padding-top: 4px; }
.up-list { display:flex; flex-direction:column; gap:10px; margin-bottom: 8px; }
.up-row {
  display:flex; align-items:flex-start; gap:12px;
  background:#fff; border:1px solid var(--border); border-radius: var(--radius);
  padding: 12px 14px;
  color: inherit; text-decoration: none;
}
.up-row-link { cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.up-row-link:hover { border-color: var(--brand); box-shadow: var(--shadow-sm); }
.up-row-link:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.up-mark { width:4px; align-self:stretch; border-radius:4px; flex-shrink:0; min-height:32px; }
.up-body { flex:1; min-width:0; }
.up-thumb {
  width: 64px; height: 64px; flex-shrink: 0;
  object-fit: cover; border-radius: 8px;
  background: #f3f4f6; border: 1px solid var(--border);
}
@media (max-width: 720px) { .up-thumb { width: 48px; height: 48px; } }
.up-title { font-weight:600; color:var(--text); font-size:14px; word-break: break-word; overflow-wrap: anywhere; }
.up-meta  { font-size:12.5px; color:var(--muted); margin-top:2px; }
.up-desc  { font-size:12.5px; color:var(--muted); margin-top:4px; line-height:1.4; word-break: break-word; }
.up-chevron {
  align-self: center; font-size: 22px; color: var(--muted-2, #9ca3af);
  padding-left: 4px; flex-shrink: 0;
}
.up-row-link:hover .up-chevron { color: var(--brand); }

.up-btn {
  align-self: center; flex-shrink: 0;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 14px; border-radius: 8px;
  font: 600 12.5px/1 'Inter', sans-serif;
  border: 1px solid var(--brand); background: var(--brand); color: #fff;
  cursor: pointer; text-decoration: none;
  transition: background .15s, border-color .15s, transform .1s;
  white-space: nowrap;
}
.up-btn:hover { background: var(--brand-dark, #a10c25); border-color: var(--brand-dark, #a10c25); }
.up-btn svg { width: 14px; height: 14px; }
.up-btn-registered {
  background: #dcfce7; color: #14532d; border-color: #86efac;
}
.up-btn-registered:hover { background: #bbf7d0; border-color: #4ade80; }
.up-btn-disabled {
  background: #f3f4f6; color: var(--muted); border-color: var(--border);
  cursor: not-allowed;
}
@media (max-width: 720px) {
  .up-btn { padding: 7px 10px; font-size: 12px; }
  .up-btn span { display: none; }
  .up-btn svg { width: 16px; height: 16px; }
}

/* Mobile: Grid + Monats-Nav ausblenden, Liste ist Hauptansicht */
@media (max-width: 720px) {
  .cal-desktop-only { display: none !important; }
  .cal-legend { margin-top: 4px; }
  .up-section { margin-top: 14px; }
  .up-row { padding: 10px 12px; gap: 10px; }
  .up-title { font-size: 13.5px; }
}