:root {
    --gray-50: #F9FAFB;
    --gray-200: #EAECF0;
    --gray-500: #667085;
    --gray-600: #475467;
    --gray-700: #344054;
    --gray-800: #1D2939;
    --gray-900: #101828;
    --neutral-50: #F9FAFB;
    --neutral-200: #EAECF0;
    --neutral-600: #475467;
    --error-500: #F04438;
    --primary-50: #FAF5FF;
    --primary-500: #9333EA;
    --primary-600: #9333EA;
    --primary-700: #7E22CE;
    --primary-900: #581C87;
    --mud-palette-divider: #EAECF0 !important;
    --mud-palette-lines-inputs: #D0D5DD !important;
    --mud-palette-primary: #9333EA !important;
    --mud-palette-primary-darken: #5826e1 !important;
    --mud-palette-action-disabled-background: #EAECF0 !important;
    --mud-palette-action-disabled: #FFF !important;
    --mud-elevation-1: 0px 1px 2px 0px #1018280D !important;
    --mud-palette-secondary: #32D896 !important;
}

::-webkit-scrollbar-thumb {
    background: var(--neutral-200) !important;
    border-radius: 8px !important;
}

html, body {
    overflow-x: hidden;
}

#app {
    background-color: #F7F7F7;
    min-height: 100vh;
}

.text-gray-500 {
    color: var(--gray-500);
}

.text-gray-600 {
    color: var(--gray-600) !important;
}

.text-gray-700 {
    color: var(--gray-700);
}

.text-gray-800 {
    color: var(--gray-800);
}

.text-gray-900 {
    color: var(--gray-900);
}

.text-primary-600 {
    color: var(--primary-600);
}

.text-primary-700 {
    color: var(--primary-700);
}

.text-primary-900 {
    color: var(--primary-900);
}

.text-error-500 {
    color: var(--error-500) !important;
}

.text-white {
    color: #FFF !important;
}

.border-neutral-200 {
    border: 1px solid var(--neutral-200);
}

.border-top-neutral-200 {
    border-top: 1px solid var(--neutral-200);
}

.background-neutral-50 {
    background-color: var(--neutral-50);
}

.background-gray-50 {
    background-color: var(--gray-50);
}

.background-gray-200 {
    background-color: var(--gray-200);
}

.background-gray-900 {
    background-color: var(--gray-900);
}

.background-primary-50 {
    background-color: var(--primary-50);
}

.background-primary-500 {
    background-color: var(--primary-500);
}

.background-primary-600 {
    background-color: var(--primary-600) !important;
}

.background-white {
    background-color: #FFF;
}

.font-weight-400 {
    font-weight: 400;
}

.font-weight-500 {
    font-weight: 500;
}

.font-weight-600 {
    font-weight: 600;
}

.min-w-48 {
    min-width: 48px;
}

.max-w-370 {
    max-width: 370px;
}

.h-4 {
    height: 4px;
}

.h-192 {
    height: 192px;
}

.text-14 {
    font-size: 14px;
}

.text-16 {
    font-size: 16px;
}

.text-18 {
    font-size: 18px;
}

.text-20 {
    font-size: 20px;
}

.text-24 {
    font-size: 24px;
}

.text-36 {
    font-size: 36px;
}

.general-info-title {
    width: 300px;
}

.general-info-form {
    width: calc(100% - 300px);
}

.general-info-form-holder {
    width: 100%;
    max-width: 480px;
}

.carousel-stepper .mud-carousel-item {
    position: static;
}

.carousel-stepper .mud-carousel-swipe {
    width: 100%;
}

.submit-center {
    display: block !important;
}

.submit-center .general-info-title {
    display: none;
}

.submit-center .general-info-form-holder {
    margin: 0 auto;
}

.submit-center .general-info-form {
    width: 100%;
}

.max-w-768 {
    max-width: 768px;
}

.header-home {
    min-height: calc(100vh - 73px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 545px;
}

.header-home h1 {
    font-size: 60px;
}

.body-part-link {
    height: 200px;
    width: 100%;
    border-radius: 12px;
    background-size: cover;
    background-position: center center;
}

.body-part-link-bottom {
    background-color: rgba(0, 0, 0, 0.4);
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
}

.body-part-link-backdrop {
    background-color: #12B76A4D;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
    transition: all 0.3s;
}

.body-part-link:hover {
    text-decoration: none !important;
}

.body-part-link:hover .body-part-link-backdrop {
    background-color: #9333EAB2;
    filter: blur(0);
}

.body-part-link-text {
    font-size: 24px;
}


.validation-message {
    /*noinspection CssUnresolvedCustomProperty*/
    color: var(--mud-palette-error);
}

.landing-header {
    background: radial-gradient(100% 284.74% at 87.88% 0%, #32D896 0%, rgba(107, 33, 168, 0.9) 53.34%, #6B21A8 100%);
}

.max-w-full {
    max-width: 100%;
}

.about-title {
    font-size: 48px;
}

.py-96 {
    padding: 96px 0;
}

.list-style-disc {
    list-style-type: disc;
}

.about-text-60 {
    font-size: 60px;
}

.product-feature-number {
    width: 48px;
    height: 48px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    border: 2px solid var(--primary-50);
    background-color: #F3E8FF;
    color: var(--primary-600);
    font-size: 20px;
    font-width: 600;
    flex: 0 0 48px;
    margin-right: 16px;
}

.product-feature-title {
    margin: 10px 0;
}

.product-benefit-item {
    padding: 32px;
    box-shadow: 0px 12px 16px -4px #10182814;
    border: 1px solid var(--gray-200);
    border-radius: 16px;
}

.product-benefit-title {
    font-size: 20px;
    font-weight: 600;
    color: var(--primary-600);
    text-align: center;
}

.flex-100 {
    flex: 0 0 100%;
    width: 100%;
}

.otp-number-field input {
    text-align: center;
}

.internal-slider-image {
    height: 400px;
    width: 100%;
    object-fit: contain;
    background-color: #000;
    border-radius: 8px
}

.mud-icon-root.mud-svg-icon {
    fill: var(--primary-600);
}

.internal-slider {
    height: 400px;
}

.internal-slider {
    height: 400px;
}

.onboarding-table {
    margin-bottom: 7px;;
}

.onboarding-table table {
    border: 0;
}

.onboarding-table table th {
    background-color: var(--neutral-50);
    color: var(--neutral-600);
    font-size: 14px;
    font-weight: 500;
}

.onboarding-table table td {
    color: var(--neutral-600);
    font-size: 14px;
    font-weight: 400;
}

@media (max-width: 960px) {
    .landing-header {
        background: linear-gradient(188.6deg, #32D896 6.62%, rgba(107, 33, 168, 0.9) 59.56%, #6B21A8 99.98%);
    }

    .header-home {
        min-height: 0;
        margin: 0 auto;
    }

    .header-home h1 {
        font-size: 36px;
    }

    .workflow-image {
        width: 100%;
        background: #F2F4F7;
        padding: 24px 0;
        margin-top: 30px;
    }

    .demo-mud-paper {
        border-radius: 0 !important;
        background-color: var(--gray-50);
        border: 0;
    }

    .general-info-title, .general-info-form {
        width: 100%;
    }

    .general-info-form-holder {
        max-width: 100%;
    }

    .general-info-form-holder input {
        background-color: #FFF !important;
    }

    .general-info-form-holder .min-w-48 {
        min-width: 0;
    }

    .form-fixed-buttons {
        display: flex;
        padding: 20px;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: #fff;
        width: 100vw;
    }

    .demo-mud-paper {
        padding-bottom: 120px !important;
    }

    #app {
        background-color: #f9fafb;
    }
}

@media (max-width: 599px) {
    .body-part-link-text {
        font-size: 14px;
    }

    .body-part-link {
        height: 115px;
    }


    .header-button {
        width: 100%;
    }

    .nova-platform-section .text-36 {
        font-size: 18px;
    }

    .nova-platform-section .text-18 {
        font-size: 16px;
    }

    .about-title {
        font-size: 36px;
    }

    .about-us-page .text-20 {
        font-size: 18px;
    }

    .about-text-60 {
        font-size: 48px;
    }

}
