//////////////////////////////////
// THEME / COMPONENTS / COLLAPSIBLE-FIELDSETS
//////////////////////////////////

@import '../../scss/pre.tmp.scss';

// When the fieldset is opened we want the outer fieldset to go first
.unl .dcf-collapsible-fieldset:not(.dcf-motion-none).unl-collapsible-fieldset-open {
    transition:
        border-color $animation-duration-fieldset $animation-timing-fieldset,
        padding $animation-duration-fieldset $animation-timing-fieldset;
}

// When the fieldset is closed we want to wait for the contents to finish
.unl .dcf-collapsible-fieldset:not(.dcf-motion-none).unl-collapsible-fieldset-close {
    transition:
        border-color $animation-duration-fieldset $animation-timing-fieldset $animation-duration-fieldset-contents,
        border-radius 0s $animation-timing-fieldset $animation-duration-fieldset-contents,
        padding $animation-duration-fieldset $animation-timing-fieldset $animation-duration-fieldset-contents;
}

// When the fieldset is opened we want to wait for the outer fieldset to finish
.unl .dcf-collapsible-fieldset:not(.dcf-motion-none) .unl-collapsible-fieldset-contents-open {
    transition:
        opacity $animation-duration-fieldset-contents $animation-timing-fieldset $animation-duration-fieldset,
        max-height $animation-duration-fieldset-contents $animation-timing-fieldset $animation-duration-fieldset;
}

// When the fieldset is closed we want the contents to go first
.unl .dcf-collapsible-fieldset:not(.dcf-motion-none) .unl-collapsible-fieldset-contents-close {
    transition:
        opacity $animation-duration-fieldset-contents $animation-timing-fieldset,
        max-height $animation-duration-fieldset-contents $animation-timing-fieldset;
}