/* ========== BUTTONS ========== */
.discard-button a,
.close-button a {
    text-decoration: none;
}

.discard-button-full,
.close-button-full {
    display: none;
}

.discard-button-icon,
.close-button-icon {
    display: block;
}



.delete-button-full {
    display: none;
}

.delete-button-icon {
    display: block;
}

.discard-button-full,
.delete-button-full {
    --md-filled-button-container-color: var(--md-sys-color-error);
    --md-filled-button-label-text-color: var(--md-sys-color-on-error);
    --md-filled-button-icon-color: var(--md-sys-color-on-error);
}

.discard-button-icon {
    --md-filled-icon-button-container-color: var(--md-sys-color-error);
    --md-filled-icon-button-icon-color: var(--md-sys-color-on-error);
}


.delete-button-icon {
    --md-filled-icon-button-container-color: var(--md-sys-color-error);
    --md-filled-icon-button-icon-color: var(--md-sys-color-on-error);
}

.confirm-button-full {
    --md-filled-button-container-color: var(--md-sys-color-confirm);
    --md-filled-button-label-text-color: var(--md-sys-color-on-confirm);
    --md-filled-button-icon-color: var(--md-sys-color-on-confirm);
}

.confirm-button-icon {
    --md-filled-icon-button-container-color: var(--md-sys-color-confirm);
    --md-filled-icon-button-icon-color: var(--md-sys-color-on-confirm);
}

.preview-actions {
    max-width: 900px;
    margin: 2rem auto 0 auto;
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
}