.button-download-icon {
    --button--height: 3em;
    --button--border-radius: calc(var(--button--height) / 2);
    --button-label--font-size: 1.2em;

    display: block flex;
    text-transform: uppercase;
    border-radius: var(--button--border-radius, 1.5em);
    height: var(--button--height, 3em);
    max-width: var(--button--width, 55%);
    width: fit-content;
    padding-right: 2em;
    background-color: var(--button--background-color, var(--icad-color-primary));
    transition: opacity 500ms;
    color: white;
}

.button-download-icon:any-link {
    color: white;
}

.button-download-icon:hover {
    opacity: 80%;
}

.button-download-icon.disabled {
    background-color: var(--icad-color-gray);
    cursor: not-allowed;
}

.button-download-icon > span {
    align-self: center;
    text-align: center;
    vertical-align: middle;
    font-weight: bold;
    font-size: var(--button-label--font-size, 1.2em);
    padding-left: 1em;
}

.button-download-icon > img, .button-download-icon > .icon-container {
    display: inline-block;
    position: relative;
    height: calc(var(--button--height) - calc(var(--button-icon--margin, 2px) * 2));
    margin: var(--button-icon--margin, 2px);
}

.button-download-icon[data-button-size="small"] {
    --button-icon--margin: 1px;
    --button--height: 2.5em;
    --button-label--font-size: 1em;
}

.button-download-icon[data-button-size="large"] {
    --button-icon--margin: 3px;
    --button--height: 3.5em;
    --button-label--font-size: 1.3em;
}

.button-download-icon[data-button-theme="detenteur-ci"] {
    --button--background-color: var(--icad-color-primary);
    --button--width: 55%;
}

.button-download-icon[data-button-theme="creation-cp"] {
    --button--background-color: var(--icad-color-secondary);
    --button--width: 100%;
}

.button-download-icon[data-button-theme="creation-ci"] {
    --button--background-color: var(--icad-color-primary);
    --button--width: 100%;
}