/* ===== OO Disclosure =====
   Aufklappbarer Abschnitt ohne Rahmen: Der Kopf ist ein schlichter Knopf in gedämpfter Farbe, bündig mit dem Text darum
   und nur so breit wie sein Inhalt. SummaryContent und der aufgeklappte Inhalt nehmen die volle Breite ein.
   ========================= */

.oo-disclosure {
    display: flex;
    flex-direction: column;
    gap: var(--oo-space-1);
    min-width: 0;
}

.oo-disclosure__header {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: 0.35em;
    max-width: 100%;
    margin: 0;
    padding: var(--oo-space-1) 0;
    border: 0;
    border-radius: var(--oo-radius-sm);
    background: transparent;
    color: var(--oo-color-text-subtle);
    font-family: inherit;
    font-size: var(--oo-font-size-md);
    line-height: 1.4;
    text-align: left;
    cursor: pointer;
    transition: color var(--oo-transition);
}

.oo-disclosure__header:hover {
    color: var(--oo-color-text);
}

.oo-disclosure__header:focus-visible {
    outline: 2px solid var(--oo-primary);
    outline-offset: 2px;
}

.oo-disclosure__header:disabled {
    color: var(--oo-color-text-disabled);
    cursor: not-allowed;
}

.oo-disclosure__header .oo-icon {
    flex-shrink: 0;
    font-size: 1.1em;
}

.oo-disclosure__title {
    min-width: 0;
}

.oo-disclosure__chevron {
    transition: transform var(--oo-transition);
}

.oo-disclosure--expanded > .oo-disclosure__header .oo-disclosure__chevron {
    transform: rotate(180deg);
}

@media (prefers-reduced-motion: reduce) {
    .oo-disclosure__chevron {
        transition: none;
    }
}