.dinf-collapse-content,
.dinf-collapsable-content {
    --collapse-content-padding-start: 0px;
    --collapse-content-padding-end: 0px;

    overflow: hidden;
    max-height: max-content;
    interpolate-size: allow-keywords; /* Pas encore supporté dans Firefox. Ancien comportement par défaut dans Firefox, sans animation */
    transition: max-height 0.35s ease;
    padding-left: var(--collapse-content-padding-start);
    padding-right: var(--collapse-content-padding-end);

    &.dinf-collapse-no-animation {
        transition: none;
    }

    &.hidden {
        max-height: 0;
    }

    &.dinf-collapse-content-ps {
        --collapse-content-padding-start: 15px;
    }

    &.dinf-collapse-content-pe {
        --collapse-content-padding-end: 15px;
    }

    &.dinf-collapse-content-padding {
        --collapse-content-padding-start: 15px;
        --collapse-content-padding-end: 15px;
    }

    &.dinf-collapse-border {
        --collapse-content-border-color: var(--dinf-color-border);
        border-style: none solid solid solid;
        border-width: 1px;
        border-color: var(--collapse-content-border-color);

        &.hidden {
            border-width: 0;
            transition: max-height 0.35s ease, border-width 0s linear 0.35s;
        }
    }
}

.dinf-collapse.dinf-collapse-color-section {
    --collapse-bg-color: #11594b;
    --collapse-color: white;
}

.dinf-collapse.dinf-collapse-color-dd {
    --collapse-bg-color: var(--dinf-color-dd);
    --collapse-color: black;
}

.dinf-collapse.dinf-collapse-color-vivacite {
    --collapse-bg-color: var(--dinf-color-vivacite);
    --collapse-color: black;
}

.dinf-collapse.dinf-collapse-color-creativite {
    --collapse-bg-color: var(--dinf-color-creativite);
    --collapse-color: black;
}

.dinf-collapse.dinf-collapse-color-fierte {
    --collapse-bg-color: var(--dinf-color-fierte);
    --collapse-color: black;
}

.dinf-collapse.dinf-collapse-color-solidarite {
    --collapse-bg-color: var(--dinf-color-solidarite);
    --collapse-color: black;
}

.dinf-collapse.dinf-collapse-color-bien-etre {
    --collapse-bg-color: var(--dinf-color-bien-etre);
    --collapse-color: white;
}

.dinf-collapse.dinf-collapse-color-reussite {
    --collapse-bg-color: var(--dinf-color-reussite);
    --collapse-color: white;
}

.dinf-collapse.dinf-collapse-color-or {
    --collapse-bg-color: var(--dinf-color-or);
    --collapse-color: black;
}

.dinf-collapse.dinf-collapse-color-orange {
    --collapse-bg-color: var(--dinf-color-orange);
    --collapse-color: white;
}

.dinf-collapse.dinf-collapse-color-violet {
    --collapse-bg-color: var(--dinf-color-violet);
    --collapse-color: white;
}

.dinf-collapse.dinf-collapse-color-gris {
    --collapse-bg-color: var(--dinf-color-gris);
    --collapse-color: black;
}

.dinf-collapse.dinf-collapse-color-dd-contraste {
    --collapse-bg-color: var(--dinf-color-dd-contraste);
    --collapse-color: black;
}

.dinf-collapse.dinf-collapse-color-reussite-contraste-1 {
    --collapse-bg-color: var(--dinf-color-reussite-contraste-1);
    --collapse-color: white;
}

.dinf-collapse.dinf-collapse-color-reussite-contraste-2 {
    --collapse-bg-color: var(--dinf-color-reussite-contraste-2);
    --collapse-color: white;
}

.dinf-collapse.dinf-collapse-color-fierte-accessible {
    --collapse-bg-color: var(--dinf-color-fierte-accessible);
    --collapse-color: white;
}

.dinf-collapse.dinf-collapse-header-color-2-old {
    --collapse-bg-color: #007d59;
    --collapse-color: white;
}

.dinf-collapse.dinf-collapse-header-color-3-old {
    --collapse-bg-color: var(--dinf-vert);
    --collapse-color: white;
}

.dinf-collapse.dinf-collapse-header-color-5-old {
    --collapse-bg-color: #4d8406;
    --collapse-color: white;
}

.dinf-collapse.dinf-collapse-header-color-6-old {
    --collapse-bg-color: #b6baaf;
    --collapse-color: white;
}

.dinf-collapse.dinf-collapse-header-color-9-old {
    --collapse-bg-color: #727868;
    --collapse-color: white;
}

.dinf-collapse {
    --collapse-icon-padding-start: 0px;
    --collapse-icon-padding-end: 0px;
    --collapse-icon-width: 0px;
    --collapse-icon-content: '';
    --collapse-margin-bottom: 0px;
    --collapse-header-font-size: 1rem;
    --collapse-padding-x: 0px;
    --collapse-padding-y: 0.5rem;
    --collapse-bg-color: inherit;
    --collapse-border-color: var(--collapse-bg-color);
    --collapse-color: inherit;

    position: relative;
    font-size: var(--collapse-header-font-size);
    padding: var(--collapse-padding-y) var(--collapse-padding-x) var(--collapse-padding-y) calc(var(--collapse-padding-x) + var(--collapse-icon-padding-start) + var(--collapse-icon-width) + var(--collapse-icon-padding-end));
    margin-bottom: var(--collapse-margin-bottom);
    cursor: pointer;
    text-align: left;
    align-items: center;
}

.dinf-collapse.input-group-text {
    --collapse-bg-color: var(--bs-tertiary-bg);
    --collapse-color: var(--bs-body-color);
}

.dinf-collapse:not(.btn) {
    color: var(--collapse-color);
    background-color: var(--collapse-bg-color);
}

.dinf-collapse.btn {
    --collapse-padding-x: var(--bs-btn-padding-x);
    --collapse-padding-y: var(--bs-btn-padding-y);
    height: calc(var(--collapse-header-font-size) + var(--collapse-padding-y) * 2);
}

.dinf-collapse::before {
    position: absolute;
    left: calc(var(--collapse-padding-x) + var(--collapse-icon-padding-start));
    top: 50%;
    transform: translateY(-50%);
    line-height: 1;
    padding-left: var(--collapse-icon-padding-start);
    content: var(--collapse-icon-content);
    width: var(--collapse-icon-width);
    text-align: center;
}

.dinf-collapse.dinf-collapse-border {
    border: 1px solid var(--collapse-border-color);
}

.dinf-collapse.dinf-collapse-mb-1 {
    --collapse-margin-bottom: 0.5rem;
}

.dinf-collapse.dinf-collapse-padding-x {
    --collapse-padding-x: 0.5rem;
}

.dinf-collapse.dinf-collapse-header-size-1 {
    --collapse-header-font-size: 1.5rem;
}

.dinf-collapse.dinf-collapse-header-size-2 {
    --collapse-header-font-size: 1.2rem;
}

.dinf-collapse.dinf-collapse-header-size-3 {
    --collapse-header-font-size: 1rem;
}

label.dinf-collapse-header-size-1 {
    font-size: 1.5rem;
    cursor: pointer;
}

label.dinf-collapse-header-size-2 {
    font-size: 1.2rem;
    cursor: pointer;
}

label.dinf-collapse-header-size-3 {
    font-size: 1rem;
    cursor: pointer;
}

.dinf-collapse.dinf-collapse-arrow {
    --collapse-icon-content: '\25ba';
    --collapse-icon-width: var(--collapse-header-font-size);
    --collapse-icon-padding-end: 0.25rem;
}

.dinf-collapse.dinf-collapse-arrow[data-expanded=true] {
    --collapse-icon-content: '\25bc';
}

.dinf-collapse.dinf-collapse-plus {
    --collapse-icon-content: '\002b';
    --collapse-icon-width: var(--collapse-header-font-size);
    --collapse-icon-padding-end: 0.25rem;
}

.dinf-collapse.dinf-collapse-plus[data-expanded=true] {
    --collapse-icon-content: '\2212';
}

.dinf-collapse:not(.btn):empty {
    --collapse-padding-x: 0.5rem;
}

.dinf-collapse:empty {
    --collapse-icon-padding-end: 0px;
}