.react-custom-components-ui-button {
    /*width: max-content;*/
    padding: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.react-custom-components-ui-textCenter {
    text-align: center;
}

.react-custom-components-ui-smSize {
    padding: 4px 8px;
}

.react-custom-components-ui-mdSize {
    padding: 8px 16px;
}

.react-custom-components-ui-lgSize {
    padding: 12px 24px;
}

.react-custom-components-ui-xlSize {
    padding: 16px 32px;
}

.react-custom-components-ui-primaryOrange {
    background-color: #ea580c;
    color: white;
}

.react-custom-components-ui-primaryOrange:hover {
    background-color: #c2410c;
}

.react-custom-components-ui-secondaryOrange {
    background-color: #ffedd5;
    color: #ea580c;
}

.react-custom-components-ui-secondaryOrange:hover {
    background-color: #fed7aa;
    color: #c2410c;
}

.react-custom-components-ui-primaryBlue {
    background-color: #2563eb;
    color: white;
}

.react-custom-components-ui-primaryBlue:hover {
    background-color: #1d4ed8;
}

.react-custom-components-ui-secondaryBlue {
    background-color: #dbeafe;
    color: #2563eb;
}

.react-custom-components-ui-secondaryBlue:hover {
    background-color: #bfdbfe;
    color: #1d4ed8;
}

.react-custom-components-ui-primaryGreen {
    background-color: #16a34a;
    color: white;
}

.react-custom-components-ui-primaryGreen:hover {
    background-color: #15803d;
}

.react-custom-components-ui-secondaryGreen {
    background-color: #dcfce7;
    color: #16a34a;
}

.react-custom-components-ui-secondaryGreen:hover {
    background-color: #bbf7d0;
    color: #15803d;
}

.react-custom-components-ui-primaryRed {
    background-color: #dc2626;
    color: white;
}

.react-custom-components-ui-primaryRed:hover {
    background-color: #b91c1c;
}

.react-custom-components-ui-secondaryRed {
    background-color: #fee2e2;
    color: #dc2626;
}

.react-custom-components-ui-secondaryRed:hover {
    background-color: #fecaca;
    color: #b91c1c;
}

.react-custom-components-ui-primaryPink {
    background-color: #db2777;
    color: white;
}

.react-custom-components-ui-primaryPink:hover {
    background-color: #be185d;
}

.react-custom-components-ui-secondaryPink {
    background-color: #fce7f3;
    color: #db2777;
}

.react-custom-components-ui-secondaryPink:hover {
    background-color: #fbcfe8;
    color: #be185d;
}

.react-custom-components-ui-primaryPurple {
    background-color: #9333ea;
    color: white;
}

.react-custom-components-ui-primaryPurple:hover {
    background-color: #7e22ce;
}

.react-custom-components-ui-secondaryPurple {
    background-color: #f3e8ff;
    color: #9333ea;
}

.react-custom-components-ui-secondaryPurple:hover {
    background-color: #e9d5ff;
    color: #7e22ce;
}

.react-custom-components-ui-defaultColor {
    background-color: #f3f4f6;
    color: black;
}

.react-custom-components-ui-defaultColor:hover {
    background-color: #e5e7eb;
}

.react-custom-components-ui-cursorPointer {
    cursor: pointer;
}

.react-custom-components-ui-cursorNotAllowed {
    cursor: not-allowed;
}