/*----------------------------------------------------------------------------
    Kalenderfunktion (Ticket #1180)
    Farben über CSS-Variablen, damit Produkte sie im Theme überschreiben können.
----------------------------------------------------------------------------*/
.dp-kalender {
    --dpk-rand:            #d9d9d9;
    --dpk-kachel-bg:       #d9d9d9;
    --dpk-kachel-text:     #ffffff;
    --dpk-text:            #333333;
    --dpk-text-leise:      #6c757d;
    --dpk-akzent:          var(--bs-primary, #0d6efd);
    --dpk-radius:          1.5rem;
    --dpk-pikto:           1.35rem;
    color: var(--dpk-text);
}

/* Filter */
.dp-kalender-filter { margin-bottom: 1.5rem; }
.dp-kalender-filter .form-label { font-size: .85rem; margin-bottom: .2rem; color: var(--dpk-text-leise); }

/* Karte */
.dp-kalender-karte {
    border: 1px solid var(--dpk-rand);
    border-radius: var(--dpk-radius);
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    background: #fff;
}
.dp-kalender-kopf { display: flex; gap: 1.25rem; align-items: flex-start; }
.dp-kalender-kachel {
    flex: 0 0 6.5rem;
    border-radius: 1rem;
    background: var(--dpk-kachel-bg);
    color: var(--dpk-kachel-text);
    text-align: center;
    padding: .9rem .25rem;
    line-height: 1.1;
}
.dp-kalender-kachel .tag   { display: block; font-size: 2.2rem; font-weight: 700; }
.dp-kalender-kachel .monat { display: block; font-size: 1rem; font-weight: 600; }
.dp-kalender-inhalt { flex: 1 1 auto; min-width: 0; }
.dp-kalender-titel { font-size: 1.25rem; font-weight: 600; margin: 0 0 .35rem; }
.dp-kalender-zeile { display: flex; flex-wrap: wrap; gap: .35rem 1.5rem; margin-bottom: .3rem; }
.dp-kalender-angabe { display: inline-flex; align-items: center; gap: .45rem; }
.dp-kalender-pikto { width: var(--dpk-pikto); height: var(--dpk-pikto); flex: 0 0 auto; }
.dp-kalender-angabe a { color: inherit; }

/* Rechte Spalte: Anmelde-Button oben, Aufklapp-Pfeil unten (auch zugeklappt sichtbar) */
.dp-kalender-rechts {
    flex: 0 0 auto;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-end;
    gap: .5rem;
}
.dp-kalender-knoepfe { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .5rem; }
.dp-kalender-angemeldet:hover { background: var(--bs-success, #198754); color: #fff; }
.dp-kalender-titel a { color: inherit; text-decoration: none; }
.dp-kalender-titel a:hover { text-decoration: underline; }

/* Aufklappen */
.dp-kalender-umschalter {
    margin-top: auto;
    border: 0;
    background: none;
    padding: .25rem .5rem;
    color: var(--dpk-text);
    font-size: 1.1rem;
    line-height: 1;
}
.dp-kalender-umschalter .bi { display: inline-block; transition: transform .2s; }
.dp-kalender-umschalter[aria-expanded="true"] .bi { transform: rotate(90deg); }
.dp-kalender-details { padding-top: .75rem; }
.dp-kalender-beschreibung { white-space: pre-line; }
.dp-kalender-folgetermine { margin-top: .75rem; }
.dp-kalender-aktion { margin-top: .75rem; }

/* Kompakt */
.dp-kalender-kompakt .list-group-item { display: flex; gap: .75rem; align-items: center; }
.dp-kalender-kompakt .dp-kalender-kachel { flex-basis: 3.5rem; padding: .35rem .2rem; border-radius: .6rem; }
.dp-kalender-kompakt .dp-kalender-kachel .tag   { font-size: 1.25rem; }
.dp-kalender-kompakt .dp-kalender-kachel .monat { font-size: .7rem; }

@media (max-width: 575.98px) {
    .dp-kalender-kopf { flex-direction: column; }
    .dp-kalender-kachel { flex-basis: auto; width: 100%; display: flex; justify-content: center; gap: .5rem; align-items: baseline; padding: .5rem; }
    .dp-kalender-kompakt .dp-kalender-kachel { width: auto; display: block; }
    .dp-kalender-rechts { flex-direction: row; align-items: center; width: 100%; }
    .dp-kalender-knoepfe { justify-content: flex-start; }
    .dp-kalender-umschalter { margin-left: auto; }
}