/**
 * Accordion (Details) Animations
 * Płynne animacje dla elementów <details>
 */

details {
    overflow: hidden;
}

details summary {
    list-style: none;
}

details summary::-webkit-details-marker {
    display: none;
}

/* Animacja dla contentu */
details .details-content {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 300ms ease-out, opacity 300ms ease-out;
    opacity: 0;
}

details[open] .details-content {
    grid-template-rows: 1fr;
    opacity: 1;
}

details .details-content > div {
    overflow: hidden;
}

/* Animacja dla ikony */
details summary .material-symbols-outlined {
    transition: transform 300ms ease-out;
}

details[open] summary .material-symbols-outlined {
    transform: rotate(-180deg);
}