/* overview-v1.css — collapsible lesson parts on the lessons overview.
   Part titles sit on a green container, so the disclosure marker is a small
   white triangle inline after the title text: ► collapsed, rotated down ▼ open.
   To update: edit here, bump filename to -v2, update the <link> in lessons-overview.html (en + langs/nl). */

details.part > summary {
    list-style: none; /* hide the default triangle */
    cursor: pointer;
}

details.part > summary::-webkit-details-marker {
    display: none;
}

/* white disclosure triangle right after the title text */
details.part > summary .part-title::after {
    content: "";
    display: inline-block;
    margin-left: 0.7rem;
    width: 0;
    height: 0;
    border-left: 0.55rem solid #ffffff;   /* points right when collapsed */
    border-top: 0.4rem solid transparent;
    border-bottom: 0.4rem solid transparent;
    vertical-align: middle;
    transition: rotate 0.2s ease;
}

details.part[open] > summary .part-title::after {
    rotate: 90deg; /* points down when open */
}

/* calm mode: no spin for users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
    details.part > summary .part-title::after {
        transition: none;
    }
}