:root {
    --st-overlay-color: rgba(0, 0, 0, 0.4);
    --st-overlay-z-index: 1000;
    --st-overlay-transition: opacity 0.6s cubic-bezier(0.25, 1, 0.5, 1);
    --st-overlay-perspective: 1000px;

    // MODAL WINDOW
    --st-modal-minWidth: 300px;

    --st-modal-borderRadius: 5px;
    --st-modal-border: none;
    --st-modal-boxShadow: 0 0 10px rgba(0, 0, 0, 0.3);

    --st-modal-transformVisible: translate3d(-50%, -50%, 0) scale(1) rotateX(0);
    --st-modal-transformHidden: translate3d(-50%, 100%, 0) scale(0.5) rotateX(-90deg);
    --st-modal-transition: all 0.6s cubic-bezier(0.25, 1, 0.5, 1);

    --st-modal-backgroundColor: #ffffff;
    --st-modal-titleTextColor: #444444;
    --st-modal-secondColor: #f6f6f6;

    // BUTTON
    --st-button-dangerColor: #ff5c5c;
    --st-button-dangerTextColor: #ffffff;

    --st-button-primaryColor: #5d9aff;
    --st-button-primaryTextColor: #ffffff;

    --st-button-lightColor: #f6f6f6;
    --st-button-lightTextColor: #444444;

    --st-button-darkColor: #444444;
    --st-button-darkTextColor: #f6f6f6;

    --st-button-borderRadius: 6px;

    // INPUT
    --st-input-padding: 0.5rem;
    --st-input-border: solid 1px #eeeeee;
    --st-input-borderRadius: 6px;

    // DIALOG
    --st-dialog-baseWidth: 95%;
    --st-dialog-maxWidth: 600px;
    --st-dialog-padding: 1rem;
    --st-dialog-maxContentHeight: 85vh;
    --st-dialog-contentColor: #000000;
}