@font-face {
    font-family: 'Fira Sans Condensed';
    src: url(../fonts/FiraSansCondensed-Regular.woff2) format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'Fira Sans Condensed';
    src: url(../fonts/FiraSansCondensed-Medium.woff2) format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'Fira Sans Condensed';
    src: url(../fonts/FiraSansCondensed-Bold.woff2) format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'Fira Sans Condensed';
    src: url(../fonts/FiraSansCondensed-Italic.woff2) format('truetype');
    font-weight: 400;
    font-style: italic;
    font-display: swap
}

@font-face {
    font-family: 'Fira Sans Condensed';
    src: url(../fonts/FiraSansCondensed-Light.woff2) format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Fira Sans Condensed';
    src: url(../fonts/FiraSansCondensed-ExtraLight.woff2) format('truetype');
    font-weight: 200;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'Fira Sans';
    src: url('../fonts/FiraSans-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

html, body {
    font-family: 'Fira Sans Condensed','Helvetica Neue',Helvetica,Arial,sans-serif !important;
    height: 100%;
    margin: 0;
    padding: 0;
    box-sizing: border-box !important
}

*, *::before, *::after {
    box-sizing: border-box !important;
    font-family: 'Fira Sans Condensed','Helvetica Neue',Helvetica,Arial,sans-serif !important
}

input.k-input:-webkit-autofill, input.k-textbox:-webkit-autofill, input:-webkit-autofill, input:-webkit-autofill:focus, input:-webkit-autofill:hover {
    background-color: #fff !important;
    -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
    box-shadow: 0 0 0 1000px #fff inset !important;
    -webkit-text-fill-color: #222 !important;
    transition: background-color 5000s ease-in-out 0s
}

.k-input-solid:focus-within {
    box-shadow: none !important
}

a, .btn-link {
    color: #2F2F2F;
}

    .btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
        box-shadow: 0 0 0 .1rem white,0 0 0 .25rem #258cfb
    }

.page.app-shell {
    display: flex;
    width: 100%;
    height: 100vh;
    overflow-y: hidden;
    overflow-x: hidden
}

.main_content {
    flex: 1;
    min-width: 0;
    height: 100vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background: linear-gradient(180deg,#F9F9F9 0%,#EEFEFF 100%);
    position: relative
}

@media (max-width:769px) {
    .main_content {
        position: relative;
        overflow-x: hidden
    }

        .main_content::before {
            content: "";
            position: fixed;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            background: linear-gradient(180deg,#F9F9F9 0%,#EEFEFF 100%);
            z-index: -1;
            width: 100vw;
            height: 100vh
        }

        .main_content::after {
            display: none
        }
}

.content {
    padding-top: 3.1rem;
    background: #F4F4F4;
    height: 100%
}

h1:focus {
    outline: none
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem,#b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: #fff
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start
}

.page-container {
    width: 100%;
    max-width: none;
    margin: 0;
    padding-right: 0;
    padding-left: 12px
}

@media (min-width:1200px) {
    .page-container {
        padding-left: calc((100vw - 1164px) / 2 + 12px)
    }
}

@media (min-width:1400px) {
    .page-container {
        padding-left: calc((100vw - 1344px) / 2 + 12px)
    }
}

.page-content-container {
    width: 100%;
    max-width: 1464px;
    margin: 0 auto;
    padding: 0 12px;
    display: flex;
    align-items: center
}

@media (min-width:1200px) {
    .page-content-container {
        max-width: 1164px
    }
}

@media (min-width:1400px) {
    .page-content-container {
        max-width: 1344px
    }
}

@media (max-width:768px) {
    .page-content-container {
        padding: 0 30px;
        overflow-y: auto;
        overflow-x: hidden;
    }
}

.inner-page-container {
}

@media (max-width:768px) {
    .inner-page-container {
    }
}

::-webkit-scrollbar {
    width: 4px;
    height: 10px
}

::-webkit-scrollbar-thumb {
    background: #a4a4a4;
    border-radius: 8px
}

@media (max-width:768px) {
    .header-container {
        padding: 0 30px !important
    }
}

.login-page {
    min-height: calc(100vh - 75px);
    background: url(/images/login-bg.jpg) center/cover no-repeat,#f5f6f8;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 40px;
    padding-bottom: 40px
}

.login-card {
    width: 100%;
    max-width: 941px;
    background: #fff;
    border-radius: 10px;
    display: flex;
    overflow: hidden;
    padding: 32px;
    gap: 20px;
    height: max-content;
    box-shadow: 0 4px 13.3px 0 #00000040
}

@media (max-width:768px) {
    .login-page {
        padding: 31px 32px 79px 32px;
        background: #fff;
        align-items: flex-start
    }

    .login-card {
        flex-direction: column;
        padding: 0;
        gap: 0;
        border-radius: 0;
        background: #fff0;
        max-width: 100%;
        box-shadow: none;
        height: 100%
    }

    .login-left {
        width: 100% !important;
        height: auto !important;
        min-height: 30vh;
        order: 1
    }

    .left-overlay {
        padding: 20px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        height: 100%
    }

        .left-overlay h6 {
            font-size: 14px;
            margin-bottom: 12px
        }

    .login-right {
        width: 100% !important;
        padding: 0px !important;
        padding-top: 35px !important;
        order: 2
    }

        .login-right h2 {
            line-height: 100% !important;
            height: 38px !important;
            display: flex !important
        }

    form[method="post"] {
        width: 100% !important;
        max-width: 100%
    }

    .reset-password-form-field {
        margin-bottom: 25px !important
    }

    .input-with-icon {
        width: 100% !important;
        max-width: 100%;
        padding-left: 32px !important;
        font-size: 14px;
        height: 36px
    }

    .forgot-row {
        flex-direction: column;
        gap: 25px
    }

        .forgot-row a {
            height: 26px;
            width: 100%;
            display: flex;
            justify-content: center;
            align-items: center
        }

    .divider {
        margin: 25px 0px !important
    }

    .btn-primary {
        width: 100% !important;
        border-radius: 4px !important
    }

    ::deep.btn-outline {
        width: 100% !important;
        justify-content: center !important
    }
}

.login-left {
    background-image: url(/images/login-page-illustration.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    border-radius: 10px;
    width: 364px
}

    .login-left::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgb(0 0 0 / .2);
        border-radius: 10px;
        z-index: 1
    }

.left-overlay {
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    color: #fff;
    padding: 32px;
    z-index: 2
}

    .left-overlay h6 {
        font-size: 16px;
        line-height: 100%;
        letter-spacing: 1.6px;
        margin-bottom: 16px;
        text-transform: uppercase;
        margin-top: 0
    }

    .left-overlay p {
        font-size: 14px;
        line-height: 19px;
        font-weight: 400;
        margin-bottom: 16px;
        margin-top: 0px;
    }

        .left-overlay p:last-child {
            margin-bottom: 0px !important
        }

    .left-overlay .contact {
        font-weight: 600;
        text-decoration: underline;
        color: #fff
    }

.login-right {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    padding: 32px;
    width: 493px
}

.privacy-text {
    font-size: 12px !important;
    line-height: 15px !important;
    color: #2F2F2F !important;
    margin-top: 50px !important;
    margin-bottom: 0px !important
}

    .privacy-text a {
        text-decoration: underline !important;
        color: #2f2f2f !important
    }

        .privacy-text a:hover {
            font-weight: 600 !important
        }

.mb-50 {
    margin-bottom: 50px !important
}

.login-right h2 {
    font-size: 32px;
    font-weight: 400;
    line-height: 135%;
    margin-bottom: 8px;
    color: #2F2F2F;
    text-align: center;
    margin-top: 0
}

.login-right p {
    color: #2F2F2F;
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 50px;
    text-align: center;
    margin-top: 0
}

.form-field {
    margin-bottom: 28px
}

.input-group {
    position: relative;
    width: 400px
}

    .input-group i {
        position: absolute;
        left: 0;
        top: 10px;
        font-size: 16px;
        color: #333
    }

    .input-group .k-textbox {
        padding-left: 30px;
        border: none !important;
        border-bottom: 1px solid rgb(29 27 32 / .44);
        border-radius: 0
    }

.login-error {
    color: #d9534f;
    font-size: 12px;
    margin-bottom: 15px;
    text-align: center
}

.forgot-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 28px;
    font-size: 13px
}

    .forgot-row a {
        color: #2F2F2F;
        text-decoration: underline;
        cursor: pointer;
        font-size: 12px;
        font-weight: 400
    }

        .forgot-row a:hover {
            font-weight: 700 !important
        }

.btn-primary {
    background-color: #FFD88C;
    border: none;
    padding: 9px 24px;
    font-weight: 400;
    cursor: pointer;
    color: #2F2F2F;
    font-size: 14px;
    letter-spacing: .1px;
    border-radius: 4px;
    width: 96px;
    height: 37px
}

    .btn-primary:hover {
        background: #FFF4DD
    }

    .btn-primary:focus {
        box-shadow: none !important
    }

.divider {
    display: flex;
    align-items: center;
    margin: 25px 0 28px 0;
    color: #B3B3B3;
    font-size: 16px;
    width: 100%;
    height: 32px
}

    .divider::before, .divider::after {
        content: "";
        flex: 1;
        height: 1px;
        background: #B3B3B3
    }

    .divider span {
        margin: 0 15px
    }

.signup-text {
    margin-bottom: 16px;
    color: #2F2F2F;
    font-size: 12px;
    font-weight: 400;
    text-align: center;
    height: 24px;
    display: flex;
    align-items: center
}

.btn-outline {
    background: #fff0;
    border: 1px solid #767676;
    color: #2F2F2F;
    padding: 9px 24px;
    cursor: pointer;
    width: 94px;
    height: 37px;
    font-size: 14px;
    line-height: 19px;
    font-weight: 400;
    border-radius: 4px;
    display: flex;
    align-items: center
}

    .btn-outline:hover {
        border: none;
        background: #FFD88C
    }

.input-wrapper {
    position: relative;
    width: 100%
}

    .input-wrapper .k-invalid .password-toggle-btn {
        top: 39%
    }

    .input-wrapper:has(.k-input-inner[aria-invalid="true"]) .password-toggle-btn, .input-wrapper:has(.k-input[aria-invalid="true"]) .password-toggle-btn, .input-wrapper:has(input[aria-invalid="true"]) .password-toggle-btn {
        top: 50%
    }

.password-toggle-btn {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    margin-right: 10px
}

    .password-toggle-btn:focus {
        outline: none
    }

.input-icon {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #2F2F2F;
    font-size: 14px;
    z-index: 2
}

.input-with-icon {
    padding-left: 38px !important;
    width: 429px;
    border: none;
    border-bottom: 1px solid rgb(29 27 32 / .44) !important;
    border-radius: 0;
    font-size: 16px;
    height: 39px
}

    .input-with-icon .k-input-inner {
        padding-left: 16px !important
    }

.tb-icon-container {
    position: relative;
    margin-bottom: 29px
}

    .tb-icon-container .k-icon {
        position: absolute;
        z-index: 1;
        top: 0;
        left: .5em
    }

    .tb-icon-container .k-textbox input, .k-floating-label-container.k-empty:not(.k-focus) .k-label {
        padding-left: 2em
    }

    .tb-icon-container.with-label .k-icon {
        top: .7em
    }

    .tb-icon-container .k-input-solid {
        border-radius: 0px !important;
        border: none !important;
        border-bottom: 1px solid rgb(29 27 32 / .44) !important
    }

.validation-message {
    color: #B3261E;
    font-size: 10px;
    margin-top: 4px;
    text-align: left;
    font-family: 'Fira Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
    font-weight: 400;
}

input[type="checkbox"].invalid {
    outline: 1px solid #B3261E;
    border-color: #B3261E;
    box-shadow: 0 0 0 0 #0000
}

.modal-content {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: transparent !important;
    background-clip: padding-box;
    border: none !important;
    border-radius: 0 !important;
    outline: 0
}

.signup-wrapper {
    display: grid;
    grid-template-columns: 2.2fr 1fr;
    min-height: calc(100vh - 75px);
    background: #fff
}

.signup-form {
    padding: 66px 66px 66px 0
}

.signup-info {
    padding: 74px 46px;
    padding-right: 0;
    background: linear-gradient(180deg,#F9F9F9 0%,#EEFEFF 100%);
    color: #2F2F2F;
    position: relative;
    z-index: 1
}

    .signup-info::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        right: -100vw;
        width: 100vw;
        background: linear-gradient(180deg,#F9F9F9 0%,#EEFEFF 100%);
        z-index: -1
    }

.password-input-container {
    position: relative;
    width: 100%
}

    .password-input-container .k-input {
        position: relative;
        z-index: 1
    }

    .password-input-container input {
        padding-right: 80px
    }

.password-toggle-icon {
    position: absolute;
    right: 25px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 5;
    margin-right: 10px
}

.password-input-container:has(input[aria-invalid="true"]) .password-toggle-icon {
    top: 30% !important;
    transform: translateY(-50%)
}

.signup-form h2 {
    font-size: 32px;
    font-weight: 400;
    margin-bottom: 10px;
    color: #2F2F2F;
    margin-top: 0px;
}

.subtitle {
    font-size: 16px;
    color: #2F2F2F;
    margin-bottom: 38px
}

.section-title {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: .12em;
    color: #2F2F2F;
    margin-bottom: 26px
}

@media (max-width:768px) {
    .section-title {
        height: 19px
    }

    .k-input[aria-required="true"]::before, .k-textbox[aria-required="true"]::before, .k-picker[aria-required="true"]::before, .k-dropdownlist[aria-required="true"]::before, .k-combobox[aria-required="true"]::before, .k-autocomplete[aria-required="true"]::before, .k-multiselect[aria-required="true"]::before, .k-input:has(.k-input-inner[required])::before, .k-textbox:has(.k-input-inner[required])::before, .k-picker:has(input[required])::before, .k-dropdownlist:has(input[required])::before, .k-combobox:has(input[required])::before, .k-autocomplete:has(input[required])::before, .k-multiselect:has(input[required])::before, .k-input:has(.k-input-inner[aria-required="true"])::before, .k-textbox:has(.k-input-inner[aria-required="true"])::before, .k-picker:has(input[aria-required="true"])::before, .k-dropdownlist:has(input[aria-required="true"])::before, .k-combobox:has(input[aria-required="true"])::before, .k-autocomplete:has(input[aria-required="true"])::before, .k-multiselect:has(input[aria-required="true"])::before {
        content: "*";
        position: absolute;
        top: 61% !important;
        right: 16px;
        transform: translateY(-50%);
        color: #B3261E;
        font-weight: 700;
        font-size: 14px;
        line-height: 1;
        pointer-events: none;
        z-index: 1
    }

    .row-two {
        gap: 26px !important
    }

    .terms-side {
        font-size: 16px !important
    }

    .account-edit-actions {
        margin-top: 59px !important
    }
}

.form-two-col {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(0,1fr);
    gap: 50px;
    align-items: start
}

.form-col {
    display: flex;
    flex-direction: column
}

.signup-input {
    margin-bottom: 24px
}

    .signup-input .k-input-inner {
        padding-left: 0
    }

.form-col .signup-input.last-input {
    margin-bottom: 0 !important
}

.row-two {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px
}

.signup-input > .k-input, .signup-input > .k-dropdownlist {
    padding-left: 16px !important
}

.signup-input .k-input, .signup-input .k-input-solid, .signup-input .k-input-md {
    height: 38px;
    font-size: 14px;
    border: none !important;
    border-bottom: 1px solid #B3B3B3 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0
}

.signup-input > .k-input, .signup-input > .k-dropdownlist, .signup-input > .k-textbox, .signup-input > .k-picker, .signup-input > * {
    max-width: 100% !important;
    box-sizing: border-box
}

.signup-input .k-input-inner::placeholder {
    color: #767676 !important
}

.signup-input .k-input-inner::-webkit-input-placeholder {
    color: #767676 !important
}

.signup-input .k-input-inner::-moz-placeholder {
    color: #767676 !important;
    opacity: 1
}

.signup-input .k-input-inner:-ms-input-placeholder {
    color: #767676 !important
}

.signup-input .k-input-inner:-moz-placeholder {
    color: #767676 !important;
    opacity: 1
}

.signup-input.k-focus .k-input-inner::placeholder, .signup-input .k-input-inner::placeholder {
    color: #767676 !important
}

.signup-input .k-dropdownlist {
    height: 40px;
    border: none !important;
    border-radius: 0px !important;
    border-bottom: 1px solid #B3B3B3 !important;
    background: transparent !important
}

.password-row {
    margin-top: 63px
}

.password-section {
    display: flex;
    flex-direction: column
}

.mb-43 {
    margin-bottom: 43px !important
}

.terms-side .required {
    display: none
}

.terms-side {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 14px;
    font-weight: 400;
    color: #2F2F2F;
    margin-top: 43px
}

    .terms-side .k-checkbox, .terms-side input[type="checkbox"] {
        margin-top: 5px;
        border-radius: 0px !important;
        border-color: #1D1B20 !important
    }

    .terms-side a {
        color: #0072CE;
        text-decoration: none
    }

        .terms-side a:hover {
            text-decoration: underline
        }

.actions {
    margin-top: 43px;
    display: flex;
    gap: 23px
}

    .actions .k-button {
        min-width: 172px;
        width: 100%
    }

.signup-cancel-btn {
    font-weight: 500;
    font-size: 14px;
    color: #2F2F2F;
    background: none;
    border-color: #B6AEC6;
    height: 37px
}

    .signup-cancel-btn:hover {
        background: #FFD88C !important;
        border-color: #FFD88C !important
    }

    .signup-cancel-btn:focus {
        box-shadow: none !important
    }

.signup-submit {
    background: #FFD88C;
    border-color: #FFD88C;
    color: #2F2F2F !important;
    font-weight: 400;
    font-size: 14px;
    height: 37px
}

    .signup-submit:hover {
        background: #FFF4DD;
        border: none
    }

.signup-info h5 {
    font-size: 16px;
    font-weight: 700;
    line-height: 146%;
    margin-bottom: 0;
    margin-top: 0px;
}

.signup-info p {
    font-size: 16px;
    margin-bottom: 24px;
    line-height: 146%
}

    .signup-info p:last-child {
        margin-bottom: 0px !important
    }

@media (max-width:992px) {
    .signup-wrapper {
        grid-template-columns: 1fr
    }

    .form-two-col {
        grid-template-columns: 1fr;
        row-gap: 49px
    }
}

@media (max-width:768px) {
    .signup-form {
        padding-top: 43px !important;
        padding: 0
    }

        .signup-form h2 {
            margin-bottom: 9px;
            height: 38px;
            line-height: 100%;
            margin-top: 0px;
        }

    .subtitle {
        margin-bottom: 41px
    }

    .signup-input {
        margin-bottom: 18px
    }

    .password-row {
        margin-top: 41px
    }

    .terms-side {
        margin-top: 45px
    }

    .actions {
        flex-direction: column;
        margin-top: 45px;
        gap: 10px
    }

        .actions .k-button {
            width: 100%
        }

    .signup-info {
        margin-top: 60px;
        padding-left: 0;
        position: relative;
        z-index: 1
    }

        .signup-info::before {
            content: "";
            position: absolute;
            top: 0;
            bottom: 0;
            left: -100vw;
            width: 100vw;
            background: linear-gradient(180deg,#F9F9F9 0%,#EEFEFF 100%);
            z-index: -1
        }

        .signup-info::after {
            content: "";
            position: absolute;
            top: 0;
            bottom: 0;
            right: -100vw;
            width: 100vw;
            background: linear-gradient(180deg,#F9F9F9 0%,#EEFEFF 100%);
            z-index: -1
        }
}

.dashboard-container {
    padding: 0
}

.dashboard-header {
    margin-bottom: 26px
}

.user-info-container {
    overflow: hidden;
    padding-right: 40px
}

.welcome-card-wrapper {
    margin-bottom: 26px
}

.welcome-title {
    font-size: 20px;
    line-height: 28px;
    font-weight: 700;
    color: #2F2F2F;
    margin-bottom: .5rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    margin-top: 0
}

.designation-container {
    width: 100%;
    max-width: 100%;
    margin-bottom: 1rem
}

.designation-wrapper {
    display: grid;
    grid-template-columns: auto auto 1fr;
    align-items: center;
    column-gap: 5px;
    min-width: 0;
    max-width: 420px
}

.designation-company {
    color: #2F2F2F;
    font-size: 14px;
    font-weight: 400;
    max-width: 170px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.designation-separator {
    color: #2F2F2F;
    font-size: 14px;
    font-weight: 400;
    opacity: .7
}

.designation-title {
    color: #2F2F2F;
    font-size: 14px;
    font-weight: 400;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.quick-links {
    margin-top: 36px
}

    .quick-links a {
        flex-shrink: 0
    }

.dashboard-img {
    margin: 7px 20px 7px 10px;
    width: 152px;
    height: 145px
}

.welcome-card {
    min-height: 100px;
    overflow: hidden;
    display: flex;
    align-items: center;
    border: 1px solid #BBE4FF
}

@media (max-width:768px) {
    .welcome-card {
        margin-top: 35px;
        flex-direction: row;
        border: 1px solid #BBE4FF;
        height: 127px
    }

    .quick-links {
        margin-top: 15px !important
    }

    .dashboard-header {
        margin-bottom: 24px !important
    }

    .welcome-title {
        font-size: 1.25rem;
        height: 31px;
        margin-bottom: 15px
    }

    .recent-order-header {
        flex-direction: column;
        gap: 36px;
        margin-bottom: 0px !important
    }

    .view-all {
        margin-bottom: 32px
    }

        .view-all a {
            text-decoration: none;
            width: 100%;
            border: 1px solid #B3B3B3;
            height: 37px;
            border-radius: 4px;
            padding: 9px 24px;
            display: flex;
            align-items: center;
            justify-content: center
        }

    .designation-wrapper {
        flex-direction: column;
        align-items: flex-start;
        gap: 2px
    }

    .designation-company, .designation-title {
        max-width: 100%;
        height: 19px
    }

    .dashboard-img {
        width: 97px;
        height: 92px;
        margin: 0
    }

    .user-info-container {
        padding-left: 16px;
        padding-right: 5px;
        padding-top: 15px;
        padding-bottom: 15px
    }

    .custom-grid .k-grid-table, .custom-grid .k-grid-header-table, .custom-grid .k-table {
        table-layout: auto !important;
        width: auto !important;
        min-width: 650px !important
    }

    .recent-order-grid-section {
        overflow-x: auto !important;
        overflow-y: visible !important
    }

    .custom-grid .k-grid-content {
        overflow-x: auto !important;
        overflow-y: visible !important
    }

    .custom-grid {
        width: 100% !important;
        overflow: visible !important
    }

    .software-download-grid .k-grid-header-wrap table, .software-download-grid .k-grid-content table {
        min-width: 1200px
    }

    .software-download-grid colgroup col:nth-child(1) {
        min-width: 90px
    }

    .software-download-grid colgroup col:nth-child(2) {
        min-width: 200px
    }

    .software-download-grid colgroup col:nth-child(3) {
        min-width: 120px
    }

    .software-download-grid colgroup col:nth-child(4) {
        min-width: 100px
    }

    .software-download-grid colgroup col:nth-child(5) {
        min-width: 130px
    }

    .software-download-grid colgroup col:nth-child(6) {
        min-width: 120px
    }

    .software-download-grid colgroup col:nth-child(7) {
        min-width: 150px
    }

    .software-download-grid colgroup col:nth-child(8) {
        min-width: 80px
    }

    .software-download-grid th, .software-download-grid td {
        white-space: nowrap
    }
}

.quick-links a {
    color: #0072CE !important;
    text-decoration: none;
    font-size: 12px;
    font-weight: 400;
    line-height: 15px
}

    .quick-links a:hover {
        color: #0072CE !important;
        font-size: 14px;
        font-weight: 600
    }

.recent-order {
    color: #2F2F2F;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 1.6px
}

.view-all a {
    font-size: 12px;
    font-weight: 400;
    color: #2F2F2F;
    line-height: 15px
}

    .view-all a:hover {
        font-size: 14px;
        font-weight: 600
    }

.recent-order-header {
    margin-bottom: 5px;
    width: 100%;
    display: flex;
    justify-content: space-between
}

.page-heading {
    font-size: 32px;
    font-weight: 400;
    color: #2F2F2F;
    line-height: 123%;
    margin-bottom: 8px;
    display: block
}

::deep .mb-12px {
    margin-bottom: 12px !important
}

.mb-14px {
    margin-bottom: 14px !important
}

.not-available {
    font-size: 12px;
    line-height: 15px;
    font-weight: 400;
    color: rgb(29 27 32 / .38)
}

.certificate-info {
    height: 23px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    background: #D9D9D9;
    font-size: 12px;
    font-weight: 400;
    line-height: 15px;
    color: #2F2F2F;
    border-radius: 4px;
    margin-bottom: 12px
}

.custom-grid {
    background: #fff0;
    border: none
}

    .custom-grid .k-grid-table, .custom-grid .k-grid-header-table, .custom-grid .k-table {
        table-layout: fixed !important;
        width: auto;
        min-width: 100%
    }

    .custom-grid .k-grid-header th.k-header {
        height: auto !important;
        overflow: visible !important;
        white-space: normal !important;
        vertical-align: middle;
        padding-top: 8px;
        padding-bottom: 8px
    }

    .custom-grid .k-grid-header .k-header .k-cell-inner, .custom-grid .k-grid-header .k-header .k-link {
        display: block !important;
        height: auto !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: unset !important;
        word-break: break-word;
        overflow-wrap: anywhere;
        line-height: 1.2;
        text-align: center
    }

    .custom-grid .k-grid-header .k-column-title {
        white-space: unset
    }

    .custom-grid .k-grid-header {
        display: contents
    }

    .custom-grid th .k-link {
        display: flex;
        align-items: center;
        gap: 6px;
        padding: 12px !important
    }

        .custom-grid th .k-link:hover {
            text-decoration: none
        }

.grid-center-except-first .k-grid-header th, .grid-center-except-first .k-grid-content td, .grid-center-except-first .k-table-th, .grid-center-except-first .k-table-td, .grid-center-except-first .k-cell-inner, .grid-center-except-first .k-link {
    text-align: center !important;
    justify-content: center !important
}

    .grid-center-except-first .k-grid-header th:first-child, .grid-center-except-first .k-grid-content td:first-child, .grid-center-except-first .k-table-th:first-child, .grid-center-except-first .k-table-td:first-child, .grid-center-except-first .k-grid-content td:first-child .k-cell-inner, .grid-center-except-first .k-grid-header th:first-child .k-cell-inner {
        text-align: left !important;
        justify-content: flex-start !important
    }

        .grid-center-except-first .k-grid-header th:first-child, .grid-center-except-first .k-grid-header th:first-child .k-cell-inner, .grid-center-except-first .k-grid-header th:first-child .k-link, .grid-center-except-first .k-grid-header th:first-child .k-column-title {
            text-align: left !important;
            justify-content: flex-start !important
        }

            .grid-center-except-first .k-grid-header th:first-child .k-cell-inner {
                display: flex;
                justify-content: flex-start
            }

.custom-grid .grid-center-except-first .k-grid td .status-completed {
    display: inline-block;
    margin: 0 auto
}

.custom-grid th.center-me {
    text-align: center
}

    .custom-grid th.center-me .k-cell-inner > .k-link {
        justify-content: center
    }

.custom-grid .k-grid-table {
    table-layout: fixed;
    width: 100%
}

.custom-grid .k-grid-header, .custom-grid .k-grid-content {
    width: 100% !important
}

    .custom-grid .k-grid-header table {
        width: 100% !important
    }

.custom-grid .k-grid, .custom-grid .k-grid-header, .custom-grid .k-grid-content, .custom-grid table, .custom-grid th, .custom-grid td {
    border: none !important;
    background: #fff0
}

    .custom-grid .k-grid-header table {
        border-collapse: separate;
        border-spacing: 0 4px
    }

    .custom-grid .k-grid-content table {
        border-collapse: separate;
        border-spacing: 0 5px
    }

.custom-grid thead tr {
    background-color: #fff;
    box-shadow: 0 1px 3px rgb(0 0 0 / .08)
}

.custom-grid thead th {
    background-color: #ffffff !important;
    font-size: 14px;
    font-weight: 600 !important;
    color: #2F2F2F !important;
    vertical-align: middle
}

    .custom-grid thead th:first-child {
        border-top-left-radius: 6px;
        border-bottom-left-radius: 6px
    }

    .custom-grid thead th:last-child {
        border-top-right-radius: 6px;
        border-bottom-right-radius: 6px
    }

.custom-grid .k-grid-content tr {
    background-color: #ffffff !important;
    height: 57px
}

.custom-grid .k-grid-content td {
    background-color: #ffffff !important;
    color: #2F2F2F;
    font-size: 14px;
    padding: 10px 16px;
    border-top: 1px solid #BBE4FF !important;
    border-bottom: 1px solid #BBE4FF !important
}

    .custom-grid .k-grid-content td:first-child {
        border-left: 1px solid #BBE4FF !important;
        border-top-left-radius: 6px;
        border-bottom-left-radius: 6px
    }

    .custom-grid .k-grid-content td:last-child {
        border-right: 1px solid #BBE4FF !important;
        border-top-right-radius: 6px;
        border-bottom-right-radius: 6px
    }

.custom-grid .k-grid-content {
    overflow-y: visible !important;
    overflow-x: hidden !important
}

.custom-grid .k-grid-header {
    overflow: visible !important
}

.custom-grid .k-grid {
    height: auto !important
}

.custom-grid .k-grid-content tr {
    box-shadow: 0 1px 3px rgb(0 0 0 / .08)
}

.custom-grid td {
    padding: 16px 20px;
    font-size: 14px;
    color: #111827;
    vertical-align: middle
}

.status-completed {
    background-color: #D2FFBD;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 17px;
    border-radius: 4px
}

.status-not-completed {
    background-color: #D9D9D9;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: auto;
    border-radius: 4px
}

.action-btn {
    width: 38px;
    height: 38px;
    border-radius: 4px;
    background: #FFD88C;
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center
}

    .action-btn .k-button-text {
        display: flex;
        align-items: center;
    }

    .action-btn:hover {
        background: #FFF4DD !important
    }

    .action-btn:focus, .action-btn.k-focus, .action-btn .k-button-solid-base:focus, .action-btn .k-button-solid-base.k-focus {
        box-shadow: none !important;
        outline: none !important
    }

    .action-btn .k-button-solid-base:focus, .action-btn .k-button-solid-base.k-focus {
        box-shadow: none !important;
        outline: none !important
    }

.custom-grid .k-pager-wrap {
    background-color: #fff;
    margin-top: 12px;
    padding: 14px 20px;
    border-radius: 14px;
    box-shadow: 0 1px 3px rgb(0 0 0 / .08);
    border: none;
    width: 100%
}

.custom-grid .k-grid-pager {
    border: none;
    background: #fff;
    border-radius: 6px;
    gap: 0
}

.custom-grid .k-pager-wrap, .custom-grid .k-pager-wrap * {
    border: none !important
}

.custom-grid .k-pager-numbers .k-button {
    color: #2F2F2F;
    width: 36px;
    height: 36px;
    border-radius: 4px
}

    .custom-grid .k-pager-numbers .k-button.k-selected {
        background-color: #FFD88C !important;
        background-image: none !important;
        color: #2F2F2F !important;
        opacity: 1 !important;
        filter: none !important;
        box-shadow: none !important
    }

        .custom-grid .k-pager-numbers .k-button.k-selected .k-button-text {
            color: #2F2F2F !important
        }

        .custom-grid .k-pager-numbers .k-button.k-selected:hover, .custom-grid .k-pager-numbers .k-button.k-selected:focus, .custom-grid .k-pager-numbers .k-button.k-selected:focus-visible {
            background-color: #FFD88C !important;
            background-image: none !important;
            color: #2F2F2F !important;
            opacity: 1 !important;
            filter: none !important;
            box-shadow: none !important;
            outline: none !important
        }

        .custom-grid .k-pager-numbers .k-button.k-selected::before, .custom-grid .k-pager-numbers .k-button.k-selected::after {
            content: none !important;
            display: none !important
        }

.custom-grid .k-pager-nav {
    background: #fff0;
    border-radius: 8px;
    min-width: 36px;
    height: 36px
}

    .custom-grid .k-pager-nav:hover {
        background-color: #f3f4f6
    }

.custom-grid .k-pager-sizes .k-dropdownlist {
    background: #EBEBEB;
    border: none;
    height: 35px;
    font-size: 12px;
    font-weight: 400;
    color: #2F2F2F
}

.custom-grid .k-dropdown .k-input-inner {
    padding-left: 10px
}

.custom-grid .k-pager {
    font-size: 12px;
    font-weight: 400;
    line-height: 15px;
    color: #2F2F2F;
    text-transform: capitalize;
    padding: 4.5px 8px
}

    .custom-grid .k-pager button:focus, .custom-grid .k-pager .k-button:focus, .custom-grid .k-pager-nav:focus, .custom-grid .k-pager-numbers .k-button:focus, .custom-grid .k-pager .k-button.k-focus, .custom-grid .k-pager-nav.k-focus, .custom-grid .k-pager-numbers .k-button.k-focus {
        box-shadow: none !important;
        outline: none !important
    }

    .custom-grid .k-pager button:active, .custom-grid .k-pager .k-button:active, .custom-grid .k-pager-nav:active, .custom-grid .k-pager-numbers .k-button:active {
        box-shadow: none !important;
        outline: none !important
    }

.custom-grid.k-grid .k-grid-pager:focus {
    box-shadow: none
}

.custom-grid .k-pager-sizes .k-input-value-text {
    font-size: 14px;
    font-weight: 400;
    color: #2F2F2F
}

.custom-grid .k-pager-info {
    margin-right: 20px
}

.custom-grid.centered-page-sizes .k-pager-sizes {
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important
}

@media (max-width:768px) {
    .custom-grid .k-pager-wrap {
        padding: 10px
    }

    .custom-grid .k-grid-pager {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        max-width: 100%;
        box-sizing: border-box;
        padding: 10px;
        overflow: visible !important
    }

    .custom-grid .k-pager-numbers-wrap {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 4px;
        width: 100%;
        margin-bottom: 15px
    }

    .custom-grid .k-pager-first, .custom-grid .k-pager-prev, .custom-grid .k-pager-next, .custom-grid .k-pager-last {
        order: 0
    }

    .custom-grid .k-pager-numbers {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 4px
    }

    .custom-grid .k-pager-sizes, .custom-grid.centered-page-sizes .k-pager-sizes {
        width: 100% !important;
        display: flex !important;
        align-items: center !important;
        position: static !important;
        transform: none !important;
        left: unset !important
    }

        .custom-grid .k-pager-sizes .k-dropdownlist {
            width: 169px !important;
            display: inline-flex !important;
            align-items: center !important
        }

        .custom-grid .k-pager-sizes .k-input-inner {
            text-align: left !important
        }

    span[data-title="pager-sizes-label"] {
        display: inline !important;
        font-size: 12px !important;
        color: #2F2F2F !important;
        width: 100%;
        text-align: center;
        white-space: nowrap !important
    }

    .custom-grid .k-pager-info {
        width: 100%;
        text-align: center;
        font-size: 12px;
        margin: 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        display: block !important;
        max-width: 100%;
        margin-top: 15px
    }

    .custom-grid .k-pager .k-button, .custom-grid .k-pager-nav {
        min-width: 28px;
        height: 28px;
        font-size: 11px;
        padding: 2px 4px
    }

    .custom-grid .k-pager-wrap {
        overflow: visible !important
    }
}

.spinner-overlay {
    position: fixed !important;
    inset: 0;
    background: rgb(0 0 0 / .2);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2147483647
}

.spinner {
    width: 40px;
    height: 40px;
    border: 4px solid #fff0;
    border-top-color: #f8f9fa;
    border-radius: 50%;
    animation: spin 1.1s linear infinite
}

@keyframes spin {
    to {
        transform: rotate(360deg)
    }
}

.alert-success {
    background-color: #D2FFBD !important;
    color: #005244 !important;
    border: none !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    font-size: 12px !important;
    font-weight: 400;
    line-height: 15px;
    width: 100%;
    max-width: 600px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: auto;
    gap: 8px;
}

    .alert-success svg {
        cursor: pointer;
        color: #005244
    }

.close-btn {
    background: none;
    border: none
}

.alert-danger {
    background-color: #FFCBC8 !important;
    color: #B3261E !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 15px;
    border: none !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    width: 100%;
    max-width: 600px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: auto;
    gap: 8px;
}

    .alert-danger svg {
        cursor: pointer;
        color: #B3261E
    }

.alert-warning {
    background-color: #FFF5CD !important;
    color: #ED9D00 !important;
    border: none !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 15px;
    width: 100%;
    max-width: 600px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: auto;
    gap: 8px;
}

    .alert-warning svg {
        cursor: pointer;
        color: #ED9D00
    }

.video-popup {
    width: min(919px, 90vw);
    height: auto;
    max-width: 919px;
    max-height: min(654px, 80vh)
}

.certificate-text {
    width: 820px;
    text-overflow: ellipsis;
    overflow: hidden
}

.k-window.video-popup {
    border-radius: 6px !important
}

@media (max-width:1024px) {
    .video-popup {
        width: min(800px, 85vw);
        max-height: min(600px, 75vh);
        height: auto;
        padding: 15px 18px
    }
}

.video-popup .k-window-titlebar {
    padding: 0;
    background: none;
    border-bottom: none
}

.popup-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #2F2F2F;
    font-size: 16px;
    font-weight: 500;
    padding: 20px 21px;
    padding-bottom: 0;
    width: 919px
}

.video-popup .k-window-content {
    display: block;
    padding: 20px 21px
}

@media (max-width:768px) {
    .video-popup {
        width: min(700px, 100vw);
        height: min(485px, 70vh);
        padding-top: 82px;
        padding-left: 21px;
        padding-right: 21px;
        padding-bottom: 82px
    }

    .video-container {
        padding: 0px !important;
        height: 223px
    }

    .popup-title {
        width: 100%;
        padding: 0px !important;
        margin-bottom: 20px !important;
        gap: 20px !important
    }

    .video-popup .k-window-content {
        padding: 20px !important
    }
}

#order-video {
    display: block;
    width: 100%;
    height: stretch;
    max-width: 100%;
    object-fit: cover;
    background: #fff0
}

.video-container {
    padding: 20px 38.5px;
    display: flex;
    justify-content: center
}

.modal-header button {
    height: 38px;
    width: 38px;
    border-radius: 4px;
    background: #FFD88C;
    border: none
}

    .modal-header button .k-button-text {
        display: flex;
        align-items: center;
    }

    .modal-header button:hover {
        background: #FFF4DD
    }

    .modal-header button:focus {
        box-shadow: none
    }

.submit-remote-modeling-message {
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    color: #2F2F2F;
    margin-bottom: 0px !important;
    margin-top: 0
}

.mb-46 {
    margin-bottom: 46px !important
}

.remote-modeling-subtitle {
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    color: #2F2F2F;
    margin-bottom: 28px
}

.submit-remote-modeling-message a {
    color: #2F2F2F !important
}

.remote-modeling-requirements {
    font-size: 24px;
    font-weight: 400;
    line-height: 120%;
    color: #2F2F2F
}

.requirements-subtitle {
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    color: #2F2F2F;
    margin-bottom: 14px;
    margin-top: 14px !important
}

.remote-wrapper ul li {
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    color: #2F2F2F;
    gap: 8px;
    height: 32px
}

.remote-section {
    background: #FFF;
    margin-top: 46px;
    padding: 30px;
    border: 1px solid #BBE4FF
}

.remote-section-title {
    font-size: 16px;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 1.6px;
    margin-bottom: 25px;
    color: #2F2F2F
}

.user-info-section-subtitle {
    font-size: 14px;
    font-weight: 400;
    color: #2F2F2F
}

.radio-grid {
    display: grid !important;
    grid-template-columns: repeat(4,1fr) !important;
    gap: 32px !important;
    row-gap: 0px !important;
    align-items: center;
    margin-bottom: 54px
}

    .radio-grid .k-radio {
        border-color: #2F2F2F !important
    }

        .radio-grid .k-radio:checked, .k-radio.k-checked {
            color: #2F2F2F !important;
            border-color: #2F2F2F !important;
            background-color: #ffffff !important
        }

            .radio-grid .k-radio:checked:focus {
                box-shadow: none
            }

    .radio-grid .k-radio-list {
        display: contents
    }

        .radio-grid .k-radio-list .k-radio-list-item {
            display: flex;
            align-items: center;
            padding: .75rem;
            border: 1px solid #ddd;
            border-radius: 4px;
            transition: all 0.2s ease;
            cursor: pointer;
            background-color: #fff
        }

            .radio-grid .k-radio-list .k-radio-list-item:hover {
                border-color: #0078d4;
                background-color: #f8f9fa
            }

            .radio-grid .k-radio-list .k-radio-list-item.k-selected {
                border-color: #0078d4;
                background-color: #e7f3ff
            }

            .radio-grid .k-radio-list .k-radio-list-item .k-radio {
                margin-right: .5rem
            }

            .radio-grid .k-radio-list .k-radio-list-item .k-radio-label {
                font-weight: 500;
                color: #333
            }

@media (max-width:992px) {
    .radio-grid {
        grid-template-columns: repeat(2,1fr);
        gap: .75rem
    }
}

@media (max-width:480px) {
    .radio-grid {
        grid-template-columns: 1fr !important
    }

    .version-grid-custom .radio-grid .k-radio-list-item {
        padding-left: 24px !important
    }

    .remote-wrapper ul li {
        min-height: auto;
        height: auto;
        line-height: 20px;
        word-wrap: break-word;
        overflow-wrap: break-word
    }

    .upload-header {
        gap: 10px !important
    }

    .select-btn {
        font-size: 12px !important;
        padding: 10px !important
    }

    .status {
        font-size: 12px !important
    }

    .submit-remote-modeling-job-btn {
        width: 100% !important
    }

    .mobile-inline-text {
        display: inline
    }
}

@media (min-width:481px) and (max-width:769px) {
    .radio-grid {
        grid-template-columns: repeat(2,1fr) !important;
        column-gap: 52px !important
    }

    .version-grid-custom .radio-grid .k-radio-list-item {
        padding-left: 24px !important
    }

    .remote-wrapper ul li {
        min-height: auto;
        height: auto;
        line-height: 20px;
        word-wrap: break-word;
        overflow-wrap: break-word
    }

    .select-btn {
        font-size: 12px !important;
        padding: 10px !important
    }

    .status {
        font-size: 12px !important
    }

    .submit-remote-modeling-job-btn {
        width: 100% !important
    }

    .mobile-inline-text {
        display: inline
    }
}

@media (min-width:1200px) {
    .version-grid-custom {
        max-width: 1000px
    }
}

.upload-box {
    position: relative;
    background: #F4F4F4;
    border-radius: 8px;
    margin-bottom: 24px;
    margin-bottom: 54px;
    width: 100%
}

    .upload-box.error-border {
        border: 1px solid #B3261E !important
    }

.upload-inner {
    padding: 8px
}

.full-bleed {
    margin: 0;
    border: none;
    border-top: 1px solid #767676
}

.upload-header {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 40px
}

.file-input-overlay-header {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 40px;
    opacity: 0;
    cursor: pointer;
    z-index: 1
}

.select-btn {
    position: relative;
    z-index: 2;
    background: #FFD88C;
    height: 37px;
    padding: 10px 25px;
    border-radius: 4px;
    font-weight: 400;
    font-size: 14px;
    color: #2F2F2F;
    cursor: pointer;
    border: none
}

    .select-btn.disabled_btn {
        background: #ccc;
        cursor: not-allowed
    }

.status {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #49454F;
    font-size: 14px;
    font-weight: 400
}

.file-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px
}

.file-left {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0
}

.file-meta strong {
    display: block;
    font-weight: 400;
    color: #2F2F2F;
    font-size: 14px;
    max-width: 520px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.file-size {
    font-size: 12px;
    color: #2F2F2F
}

.file-right {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    font-weight: 400;
    color: #2F2F2F;
    position: relative;
    z-index: 2
}

.icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: #fff0;
    cursor: pointer;
    padding: 4px 8px
}

    .icon-btn:disabled {
        opacity: .4;
        cursor: not-allowed
    }

.progress-bar {
    height: 2px;
    background: #D9D9D9;
    margin-top: 8px
}

.progress-fill {
    height: 2px;
    background: #2D9B8E;
    border-radius: 1px;
    transition: width 160ms linear
}

@media (max-width:640px) {
    .file-meta strong {
        max-width: 240px
    }
}

.user-info-title {
    font-size: 16px;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 1.6px;
    margin-bottom: 26px;
    color: #2F2F2F
}

.user-info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 24px;
    row-gap: 24px;
    align-items: stretch;
    margin-bottom: 54px;
    margin-top: 26px
}

.form-column {
    grid-column: 1;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    gap: 24px;
    min-height: 0
}

.memo-column {
    grid-column: 2;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    align-self: stretch;
    min-height: 0
}

    .memo-column .k-textarea {
        padding-left: 16px !important;
        border: none !important;
        border-bottom: 1px solid rgb(29 27 32 / .44) !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        flex: 1 1 auto;
        min-height: 0
    }

        .memo-column .k-textarea .k-input-inner, .memo-column .k-textarea textarea.k-input, .memo-column .k-textarea textarea {
            flex: 1 1 auto;
            height: 100% !important;
            min-height: 0 !important;
            resize: none;
            background: #fff0;
            border: 0;
            padding-left: 0
        }

@media (max-width:768px) {
    .user-info-grid {
        grid-template-columns: 1fr !important;
        column-gap: 0 !important;
        row-gap: 24px !important
    }

    .form-column {
        grid-column: 1 !important;
        grid-row: 1 !important
    }

    .memo-column {
        grid-column: 1 !important;
        grid-row: 2 !important
    }

        .memo-column .k-textarea {
            min-height: 144px !important
        }
}

.user-info-input > .k-input {
    padding-left: 16px !important
}

.user-info-input .k-input, .user-info-input .k-input-inner, .user-info-input .k-input-solid, .user-info-input .k-input-md {
    height: 32px;
    font-size: 14px;
    border: none !important;
    border-bottom: 1px solid rgb(29 27 32 / .44) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0
}

.user-info-input > .k-input, .user-info-input > .k-dropdownlist, .user-info-input > .k-textbox, .user-info-input > .k-picker, .user-info-input > * {
    width: 100% !important;
    max-width: 100%;
    box-sizing: border-box
}

.user-info-input span.k-input ::placeholder, span.k-picker ::placeholder {
    color: #767676
}

.user-info-input .k-input-inner::placeholder {
    color: #767676 !important
}

.user-info-input .k-input:focus, .user-info-input .k-input-inner:focus {
    border-bottom: 1px solid rgb(29 27 32 / .44) !important
}

.submit-remote-modeling-job-btn {
    height: 37px;
    width: 194px;
    padding: 10px 25px;
    border-radius: 4px;
    background: #FFD88C;
    color: #2F2F2F;
    font-size: 14px;
    font-weight: 400;
    border: none;
    margin-top: 20px
}

    .submit-remote-modeling-job-btn:hover {
        background: #FFF4DD
    }

.success-text {
    color: #2D9B8E;
    font-weight: 400;
    font-size: 12px;
    letter-spacing: .5px
}

.status.success {
    color: #49454F;
    font-size: 14px;
    letter-spacing: .25px;
    font-weight: 400
}

.status.error {
    color: #49454F;
    font-size: 14px;
    letter-spacing: .25px;
    font-weight: 400
}

version-grid-custom ul li {
    margin-left: 24px
}

.radio-grid .k-radio-wrap {
    align-self: center
}

.upload-file-inner {
    padding: 16px
}

.account-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin-bottom: 28px
}

.disabled-txt {
    color: #767676
}

.mb-28 {
    margin-bottom: 28px !important
}

.ms-35 {
    margin-left: 24px !important
}

.mt-9 {
    margin-top: 9px !important
}

.my-account-links {
    font-size: 14px;
    background: none;
    font-weight: 400;
    color: #2F2F2F !important;
    line-height: 100%;
    border: none;
    text-decoration: underline
}

.account-row-two {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 26px
}

.mb-18 {
    margin-bottom: 18px !important
}

.my-account-links:hover {
    font-weight: 600;
    text-decoration: underline;
    background: none
}

.my-account-links:focus {
    box-shadow: none
}

.h-37px {
    height: 37px !important
}

.account-card {
    background-color: #fff;
    padding: 30px 36px;
    border-radius: 4px;
    border: 1px solid #BBE4FF
}

.account-password-card {
    background-color: #fff;
    padding: 14px 36px;
    border-radius: 4px;
    border: 1px solid #BBE4FF
}

    .account-password-card.editing {
        padding: 28px 36px
    }

.account-card-wrapper {
    display: flex;
    flex-direction: column;
    gap: 28px
}

.account-form-two-col {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(0,1fr);
    gap: 34px;
    align-items: start
}

.account-form-col {
    display: flex;
    flex-direction: column
}

.acccount-password-col {
    justify-content: flex-end;
    margin-top: auto
}

.card-header {
    font-size: 16px !important;
    font-weight: 400 !important;
    letter-spacing: 1.6px !important;
    color: #2F2F2F !important;
    margin-bottom: 26px !important
}

.account-form-field {
    margin-bottom: 24px
}

    .account-form-field .k-input, .account-form-field .k-input-inner, .account-form-field .k-input-solid, .account-form-field .k-input-md {
        padding: 0
    }

    .account-form-field:last-child {
        margin-bottom: 0
    }

    .account-form-field > .k-input, .account-form-field > .k-dropdownlist {
        padding-left: 16px !important
    }

    .account-form-field .k-input, .account-form-field .k-input-solid, .account-form-field .k-input-md {
        height: 32px;
        font-size: 14px !important;
        border: none !important;
        border-bottom: 1px solid rgb(29 27 32 / .44) !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        padding: 0
    }

    .account-form-field > .k-input, .account-form-field > .k-dropdownlist, .account-form-field > .k-textbox, .account-form-field > .k-picker, .account-form-field > * {
        max-width: 100%;
        box-sizing: border-box
    }

    .account-form-field span.k-input ::placeholder, span.k-picker ::placeholder {
        color: #767676
    }

    .account-form-field .k-input-inner::placeholder {
        color: #767676 !important
    }

    .account-form-field .k-dropdownlist {
        height: 40px;
        border: none !important;
        border-radius: 0px !important;
        border-bottom: 1px solid rgb(29 27 32 / .44) !important;
        background: transparent !important
    }

        .account-form-field .k-dropdownlist.k-focus {
            box-shadow: none
        }

.account-edit-actions {
    margin-top: 43px
}

.account-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 20px
}

.account-cancel {
    border-color: #767676;
    height: 37px;
    width: 142px;
    padding: 9px 24px;
    background: none !important;
    font-size: 14px;
    font-weight: 400;
    color: #2F2F2F
}

    .account-cancel:hover {
        background: #FFD88C !important;
        border: none
    }

.account-actions button:focus {
    box-shadow: none
}

.account-submit {
    height: 37px;
    width: 140px;
    padding: 9px 24px;
    background: #FFD88C;
    border: none;
    color: #2F2F2F
}

    .account-submit:hover {
        background: #FFF4DD
    }

@media (max-width:768px) {
    .account-heading {
        flex-direction: column;
        align-items: flex-start;
        margin-bottom: 0
    }

    .page-heading {
        margin-bottom: 25px !important
    }

    .my-account-links {
        text-decoration: none !important;
        height: 37px;
        border-radius: 4px;
        border: 1px solid #B3B3B3;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        margin-bottom: 24px !important;
        margin-top: 0px !important
    }

    .account-password-card .account-form-two-col {
        gap: 0px !important
    }

    .account-card-wrapper {
        gap: 20px
    }

    .account-form-two-col {
        grid-template-columns: 1fr;
        gap: 59px
    }

    .account-card {
        border: 1px solid #BBE4FF;
        padding: 32px 20px
    }

    .account-form-field:last-child {
        margin-bottom: 0 !important
    }

    .account-form-field {
        margin-bottom: 23px
    }

        .account-form-field.mobile-city-field, .mobile-city-field.account-form-field, .account-form-field .mobile-city-field {
            margin-bottom: 21px !important
        }

        .account-form-field[class*="mobile-city-field"], .account-form-field:has(.mobile-city-field) {
            margin-bottom: 21px !important
        }

    .account-password-card {
        padding: 20px !important;
        border: 1px solid #BBE4FF
    }

        .account-password-card .account-heading > span {
            margin-bottom: 26px !important;
            display: block;
            height: 19px
        }

    .acccount-password-col .account-actions {
        margin-top: 35px;
        gap: 15px
    }

    .account-password-card .card-header {
        margin-bottom: 0px !important
    }

    .account-actions {
        flex-direction: column
    }

    .account-cancel {
        width: 100%
    }

    .account-submit {
        width: 100%
    }
}

.k-animation-container .k-list .k-list-item, .k-animation-container .k-list .k-item {
    padding-left: 16px !important
}

.k-list-item.k-selected:hover, .k-selected.k-list-optionlabel:hover, .k-list-item.k-selected.k-hover, .k-selected.k-hover.k-list-optionlabel, .k-list-custom-value.k-selected:hover, .k-list-custom-value.k-selected.k-hover {
    background-color: #F4F4F4 !important;
    color: #2F2F2F !important;
    padding-left: 16px !important
}

.k-list-item.k-selected, .k-selected.k-list-optionlabel, .k-list-custom-value.k-selected {
    background-color: #FFD88C !important;
    box-shadow: none !important;
    color: #2F2F2F !important
}

.k-invalid .k-input-inner, .k-invalid.k-input, .k-textbox.k-invalid {
    border-bottom-color: #B3261E !important
}

.k-dropdownlist.k-invalid, .k-dropdownlist[aria-invalid="true"] {
    border-bottom-color: #B3261E !important
}

.k-dropdownlist[aria-expanded="true"] .k-input-button .k-svg-icon, .k-combobox[aria-expanded="true"] .k-input-button .k-svg-icon, .k-picker[aria-expanded="true"] .k-input-button .k-svg-icon {
    transform: rotate(180deg)
}

.k-dropdownlist[aria-expanded="false"] .k-input-button .k-svg-icon, .k-combobox[aria-expanded="false"] .k-input-button .k-svg-icon, .k-picker[aria-expanded="false"] .k-input-button .k-svg-icon {
    transform: none
}

.k-input, .k-textbox, .k-picker, .k-dropdownlist, .k-combobox, .k-autocomplete, .k-multiselect {
    position: relative
}

    .k-input .k-input-inner[required], .k-input .k-input-inner[aria-required="true"] {
        padding-right: 1.25rem
    }

    .k-input[aria-invalid="true"]::after, .k-textbox[aria-invalid="true"]::after, .k-picker[aria-invalid="true"]::after, .k-dropdownlist[aria-invalid="true"]::after, .k-combobox[aria-invalid="true"]::after, .k-autocomplete[aria-invalid="true"]::after, .k-multiselect[aria-invalid="true"]::after, .k-input.k-invalid::after, .k-textbox.k-invalid::after, .k-picker.k-invalid::after, .k-dropdownlist.k-invalid::after, .k-combobox.k-invalid::after, .k-autocomplete.k-invalid::after, .k-multiselect.k-invalid::after, .k-input:has(.k-input-inner[aria-invalid="true"])::after, .k-textbox:has(.k-input-inner[aria-invalid="true"])::after, .k-picker:has(input[aria-invalid="true"])::after, .k-dropdownlist:has(input[aria-invalid="true"])::after, .k-combobox:has(input[aria-invalid="true"])::after, .k-autocomplete:has(input[aria-invalid="true"])::after, .k-multiselect:has(input[aria-invalid="true"])::after {
        content: "!";
        position: absolute;
        top: 40%;
        right: .5rem;
        transform: translateY(-50%);
        width: 16px;
        height: 16px;
        border-radius: 50%;
        background: #B3261E;
        color: #fff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-weight: 700;
        font-size: 10px;
        line-height: 1;
        pointer-events: none;
        z-index: 1
    }

    .k-dropdownlist::after, .k-combobox::after, .k-picker::after {
        right: 2rem
    }

.k-input, .k-textbox, .k-picker, .k-dropdownlist, .k-combobox, .k-autocomplete, .k-multiselect {
    position: relative
}

    .k-input .k-input-inner[required], .k-input .k-input-inner[aria-required="true"] {
        padding-right: 1.25rem
    }

    .k-input[aria-required="true"]::before, .k-textbox[aria-required="true"]::before, .k-picker[aria-required="true"]::before, .k-dropdownlist[aria-required="true"]::before, .k-combobox[aria-required="true"]::before, .k-autocomplete[aria-required="true"]::before, .k-multiselect[aria-required="true"]::before, .k-input:has(.k-input-inner[required])::before, .k-textbox:has(.k-input-inner[required])::before, .k-picker:has(input[required])::before, .k-dropdownlist:has(input[required])::before, .k-combobox:has(input[required])::before, .k-autocomplete:has(input[required])::before, .k-multiselect:has(input[required])::before, .k-input:has(.k-input-inner[aria-required="true"])::before, .k-textbox:has(.k-input-inner[aria-required="true"])::before, .k-picker:has(input[aria-required="true"])::before, .k-dropdownlist:has(input[aria-required="true"])::before, .k-combobox:has(input[aria-required="true"])::before, .k-autocomplete:has(input[aria-required="true"])::before, .k-multiselect:has(input[aria-required="true"])::before {
        content: "*";
        position: absolute;
        top: 60%;
        right: 16px;
        transform: translateY(-50%);
        color: #B3261E;
        font-weight: 700;
        font-size: 14px;
        line-height: 1;
        pointer-events: none;
        z-index: 1
    }

    .k-dropdownlist::before, .k-combobox::before, .k-picker::before {
        right: 2rem
    }

    .k-input[aria-invalid="true"]::before, .k-textbox[aria-invalid="true"]::before, .k-picker[aria-invalid="true"]::before, .k-dropdownlist[aria-invalid="true"]::before, .k-combobox[aria-invalid="true"]::before, .k-autocomplete[aria-invalid="true"]::before, .k-multiselect[aria-invalid="true"]::before, .k-input.k-invalid::before, .k-textbox.k-invalid::before, .k-picker.k-invalid::before, .k-dropdownlist.k-invalid::before, .k-combobox.k-invalid::before, .k-autocomplete.k-invalid::before, .k-multiselect.k-invalid::before, .k-input:has(.k-input-inner[aria-invalid="true"])::before, .k-textbox:has(.k-input-inner[aria-invalid="true"])::before, .k-picker:has(input[aria-invalid="true"])::before, .k-dropdownlist:has(input[aria-invalid="true"])::before, .k-combobox:has(input[aria-invalid="true"])::before, .k-autocomplete:has(input[aria-invalid="true"])::before, .k-multiselect:has(input[aria-invalid="true"])::before {
        content: none
    }

    .k-input:has(.k-input-inner:not(:placeholder-shown))::before, .k-textbox:has(.k-input-inner:not(:placeholder-shown))::before, .k-autocomplete:has(input:not(:placeholder-shown))::before, .k-combobox:has(input:not(:placeholder-shown))::before, .k-picker:has(input:not(:placeholder-shown))::before {
        content: none
    }

    .k-input[aria-invalid="true"]::after, .k-textbox[aria-invalid="true"]::after, .k-picker[aria-invalid="true"]::after, .k-dropdownlist[aria-invalid="true"]::after, .k-combobox[aria-invalid="true"]::after, .k-autocomplete[aria-invalid="true"]::after, .k-multiselect[aria-invalid="true"]::after, .k-input.k-invalid::after, .k-textbox.k-invalid::after, .k-picker.k-invalid::after, .k-dropdownlist.k-invalid::after, .k-combobox.k-invalid::after, .k-autocomplete.k-invalid::after, .k-multiselect.k-invalid::after, .k-input:has(.k-input-inner[aria-invalid="true"])::after, .k-textbox:has(.k-input-inner[aria-invalid="true"])::after, .k-picker:has(input[aria-invalid="true"])::after, .k-dropdownlist:has(input[aria-invalid="true"])::after, .k-combobox:has(input[aria-invalid="true"])::after, .k-autocomplete:has(input[aria-invalid="true"])::after, .k-multiselect:has(input[aria-invalid="true"])::after {
        content: "!";
        position: absolute;
        top: 50%;
        right: .5rem;
        transform: translateY(-50%);
        width: 16px;
        height: 16px;
        border-radius: 50%;
        background: #B3261E;
        color: #fff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-weight: 700;
        font-size: 10px;
        line-height: 1;
        pointer-events: none;
        z-index: 1
    }

    .k-dropdownlist::after, .k-combobox::after, .k-picker::after {
        right: 2rem
    }

.training-discount-subtext {
    white-space: pre-wrap
}

.closing-time {
    height: 20px;
    font-size: 14px;
    color: #2F2F2F;
    font-weight: 400;
    line-height: 100%;
    background: #FFF4DD;
    padding: 2px 5px;
    border-radius: 4px;
    gap: 7px;
    display: flex;
    align-items: center
}

.bu-display {
    text-align: right;
    margin-top: 15px;
    line-height: 15px;
    font-size: 12px;
    font-weight: 400;
    color: #2F2F2F
}

.format-row {
    display: flex;
    align-items: center;
    width: 100%
}

    .format-row input {
        margin-right: 10px
    }

    .format-row .count {
        margin-left: auto;
        color: gray
    }

.training-hero {
    text-align: center;
    margin-top: 33px;
    width: 100%
}

.promo-bar {
    background: #FFF4DD;
    border-radius: 10px;
    width: 100%;
    margin-bottom: 60px;
    display: flex;
    align-items: center;
    overflow: hidden;
    height: 93px
}

.promo-icon {
    background: #FFD88C;
    color: #fff;
    width: 60px;
    height: 93px;
    font-size: 28px;
    display: flex;
    align-items: center;
    justify-content: center
}

.promo-text {
    padding: 25px 10px 25px 10px;
    text-align: left;
    color: #414142;
    font-weight: 400;
    font-size: 14px;
    line-height: 14px
}

.training-discount-info {
    letter-spacing: 1.6px;
    font-size: 16px;
    line-height: 100%;
    height: 14px;
    display: flex;
    align-items: center
}

.training-discount-subtext {
    margin-top: 16px !important;
    height: 13px;
    display: flex;
    align-items: center
}

    .training-discount-subtext p {
        margin-bottom: 0px !important;
        margin-top: 0
    }

.training-hero h1 {
    font-size: 40px;
    font-weight: 400;
    color: #2F2F2F;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0
}

.training-hero p {
    font-size: 14px;
    line-height: 19px;
    font-weight: 400;
    color: #2F2F2F;
    margin-bottom: 54px;
    margin-top: 0
}

.hero-desc {
    margin-bottom: 54px !important;
    color: #2F2F2F !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    display: flex;
    align-items: center;
    justify-content: center
}

.hero-search {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-bottom: 33px
}

.search-input-wrapper {
    position: relative;
    width: 100%;
    height: 44px
}

.search-input:focus-visible {
    outline: 1px solid #B3B3B3 !important
}

.search-icon {
    position: absolute;
    left: 18px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
    pointer-events: none
}

    .search-icon svg {
        width: 24px;
        height: 24px;
        display: block
    }

.search-input {
    width: 100%;
    height: 44px;
    border-radius: 4px;
    border: 1px solid #B3B3B3;
    padding: 0 20px 0 48px;
    font-size: 16px;
    box-sizing: border-box
}

    .search-input::placeholder {
        color: #B3B3B3
    }

.search-btn {
    height: 44px;
    width: 132px;
    padding: 0 34px;
    border-radius: 6px;
    border: none;
    background: #FFD88C;
    font-size: 14px;
    font-weight: 400;
    cursor: pointer;
    color: #414142
}

    .search-btn:hover {
        background: #FFF4DD
    }

.multiselect-filters-wrapper {
    position: relative;
    z-index: 0
}

    .multiselect-filters-wrapper .training-filters-border-line {
        position: absolute;
        top: -1px;
        left: 0;
        right: 0;
        height: 1px;
        background: #C8C9C7;
        z-index: 1
    }

        .multiselect-filters-wrapper .training-filters-border-line::before {
            content: "";
            position: absolute;
            top: 0;
            right: 100%;
            width: calc(50vw - 50%);
            height: 1px;
            background: #C8C9C7
        }

        .multiselect-filters-wrapper .training-filters-border-line::after {
            content: "";
            position: absolute;
            top: 0;
            left: 100%;
            width: calc(50vw - 50%);
            height: 1px;
            background: #C8C9C7
        }

    .multiselect-filters-wrapper::before {
        content: "";
        position: absolute;
        top: -1px;
        right: calc(100% + 2px);
        width: calc(50vw - 50%);
        height: 100%;
        background: #F4F4F4
    }

    .multiselect-filters-wrapper::after {
        content: "";
        position: absolute;
        top: -1px;
        left: calc(100% + 2px);
        width: calc(50vw - 50%);
        height: 100%;
        background: #F4F4F4
    }

@media (max-width:768px) {
    .multiselect-filters-wrapper .multiselect-filter {
        position: relative;
        z-index: 0
    }

    .multiselect-filters-wrapper .training-search-select {
        position: relative;
        background: #F4F4F4;
        width: 100vw;
        left: 50%;
        right: 50%;
        margin-left: -50vw;
        margin-right: -50vw;
        z-index: 1;
        border-radius: 0;
        padding-left: 16px;
        padding-right: 16px
    }

    .multiselect-filters-wrapper::before, .multiselect-filters-wrapper::after, .multiselect-filters-wrapper .training-filters-border-line {
        display: none
    }

    .format-item {
        padding-left: 10px !important;
    }
}

.training-search-select {
    height: 63px;
    background: #F4F4F4;
    border-radius: 0;
    font-size: 16px;
    border: none;
    margin-top: 2px
}

.my-multiselect-popup {
    background-color: #F4F4F4;
    box-shadow: 0 4px 4px 0 #00000040 !important;
    filter: none !important
}

    .my-multiselect-popup.k-popup, .my-multiselect-popup.k-list-container {
        box-shadow: 0 4px 4px 0 #00000040 !important;
        filter: none !important
    }

.k-animation-container .my-multiselect-popup, .k-animation-container-shown .my-multiselect-popup {
    box-shadow: 0 4px 4px 0 #00000040 !important;
    filter: none !important;
    z-index: 2;
}

.my-multiselect-popup .k-list, .my-multiselect-popup .k-list-content {
    box-shadow: none !important;
    filter: none !important
}

.my-multiselect-popup .k-list, .my-multiselect-popup .k-list-container, .my-multiselect-popup .k-list-content {
    background-color: #F4F4F4
}

.my-multiselect-popup .k-list-item, .my-multiselect-popup .k-list-item.k-hover, .my-multiselect-popup .k-list-item:hover, .my-multiselect-popup .k-list-item.k-selected, .my-multiselect-popup .k-list-item.k-focus, .my-multiselect-popup .k-list-item.k-selected.k-hover {
    background-color: #F4F4F4 !important;
    color: inherit;
    box-shadow: none
}

.my-multiselect-popup .format-item input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    accent-color: initial;
    width: 15px;
    height: 15px;
    margin: 0 8px 0 0;
    border: 1.6px solid #B3B3B3;
    border-radius: 3px;
    background: #FFF;
    display: inline-grid;
    place-content: center;
    cursor: pointer;
    vertical-align: middle
}

    .my-multiselect-popup .format-item input[type="checkbox"]:focus {
        outline: 1px solid #2F2F2F;
        outline-offset: 2px
    }

    .my-multiselect-popup .format-item input[type="checkbox"]:checked {
        background: #FFF;
        border-color: #2F2F2F
    }

        .my-multiselect-popup .format-item input[type="checkbox"]:checked::after {
            content: "";
            width: 12px;
            height: 12px;
            display: inline-block;
            background-color: #1D2026;
            -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8l2.5 2.5L12 5' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
            -webkit-mask-repeat: no-repeat;
            -webkit-mask-position: center;
            -webkit-mask-size: contain;
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8l2.5 2.5L12 5' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
            mask-repeat: no-repeat;
            mask-position: center;
            mask-size: contain
        }

.training-search-select .k-chip {
    background: #FFD88C;
    border: none;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
    color: #2F2F2F;
    margin-left: 20px;
    max-width: 200px;
}

.training-search-select .k-chip-label {
    text-wrap: auto !important;
}

.training-search-select .k-chip:focus {
    box-shadow: none
}

.training-search-select .k-chip .k-chip-action, .training-search-select .k-chip .k-button-icon {
    background-image: url("data:image/svg+xml, %3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.25 5.51953L11.7695 10L16.25 14.4805L14.4805 16.25L10 11.7695L5.51953 16.25L3.75 14.4805L8.23047 10L3.75 5.51953L5.51953 3.75L10 8.23047L14.4805 3.75L16.25 5.51953Z' fill='%232F2F2F'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 16px 16px !important;
    background-color: transparent !important;
    border: none !important;
    width: 20px !important;
    height: 20px !important;
    border-radius: 50% !important;
    margin-left: 8px !important
}

    .training-search-select .k-chip .k-chip-action .k-svg-icon, .training-search-select .k-chip .k-button-icon .k-svg-icon {
        display: none !important
    }

    .training-search-select .k-chip .k-chip-action:hover {
        background-color: rgb(255 216 140 / .3) !important
    }

.training-search-select .k-svg-i-x {
    display: none !important
}

.training-search-select::placeholder {
    color: #4E5566;
    font-size: 16px
}

.training-search-select .k-input-inner {
    background: #F4F4F4;
    height: 63px;
    font-size: 16px;
    font-weight: 400;
    padding-left: 27px;
    color: #4E5566
}

.training-search-select.k-multiselect[aria-expanded="true"] .k-input-inner {
    color: #2F2F2F !important;
    font-weight: 600 !important
}

.training-search-select .k-input {
    border: none;
    border-radius: 0
}

.training-search-select .k-select {
    background: #F4F4F4
}

.training-search-select .k-input-button {
    display: inline-flex !important;
    border-left: none;
    width: 60px
}

    .training-search-select .k-input-button:hover {
        background: #fff0
    }

    .training-search-select .k-input-button .k-svg-i-caret-alt-down {
        width: 16px;
        height: 16px;
        min-height: 16px !important;
        display: inline-block;
        position: relative;
        transition: transform .2s ease
    }

        .training-search-select .k-input-button .k-svg-i-caret-alt-down svg {
            visibility: hidden
        }

    .training-search-select .k-input-button .k-svg-i-caret-alt-down {
        background-repeat: no-repeat;
        background-position: center;
        background-size: 16px 16px;
        background-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M13 6L8 11L3 6' stroke='%231D2026' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
        transition: transform 0.2s ease
    }

.training-search-select[aria-expanded="true"] .k-input-button .k-svg-i-caret-alt-down, .training-search-select:has(.k-input-inner[aria-expanded="true"]) .k-input-button .k-svg-i-caret-alt-down {
    transform: rotate(180deg)
}

.training-search-select[aria-expanded="false"] .k-input-button .k-svg-i-caret-alt-down, .training-search-select:has(.k-input-inner[aria-expanded="false"]) .k-input-button .k-svg-i-caret-alt-down, .training-search-select:not(.k-focus) .k-input-button .k-svg-i-caret-alt-down, .training-search-select:not([aria-expanded="true"]) .k-input-button .k-svg-i-caret-alt-down {
    transform: rotate(0deg)
}

.training-search-select.k-focus .k-input-button .k-svg-i-caret-alt-down {
    transform: rotate(180deg)
}

.clear-filter-btn {
    border: none;
    padding: 0;
    background: none;
    height: 30px;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: #757575
}

    .clear-filter-btn .k-button-text {
        display: flex;
        align-items: center;
        gap: 10px
    }

    .clear-filter-btn:hover {
        background: none;
        font-weight: 600
    }

    .clear-filter-btn:focus {
        box-shadow: none
    }

.format-item {
    width: 100%;
    height: 40px;
    padding: 9px 9px 9px 5px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #F4F4F4
}

    .format-item:hover {
        background: #F4F4F4 !important
    }

.training-search-select .k-list-item.k-selected:hover, .k-selected.k-list-optionlabel:hover, .k-list-item.k-selected.k-hover, .k-selected.k-hover.k-list-optionlabel, .k-list-custom-value.k-selected:hover, .k-list-custom-value.k-selected.k-hover {
    background: #F4F4F4 !important
}

.k-popup:has(.my-multiselect-popup), .k-animation-container:has(.my-multiselect-popup), .k-animation-container-shown:has(.my-multiselect-popup) {
    box-shadow: none !important;
    filter: none !important
}

body:has(.training-search-select) .my-multiselect-popup .k-popup.k-list-container, body:has(.training-search-select) .my-multiselect-popup .k-animation-container .k-popup {
    box-shadow: none !important;
    outline: none !important;
    border: none !important;
    border-top: 1px solid #C8C9C7 !important;
    filter: none !important;
    padding-top: 12px;
    margin-left: 12px;
    margin-right: 12px
}

.training-search-select[aria-expanded="true"] .k-input-inner::placeholder {
    color: #2F2F2F !important;
    font-weight: 600
}

.training-search-select[aria-expanded="true"] .k-input-inner::-webkit-input-placeholder {
    color: #2F2F2F !important;
    font-weight: 600
}

.training-search-select[aria-expanded="true"] .k-input-inner::-moz-placeholder {
    color: #2F2F2F !important;
    font-weight: 600;
    opacity: 1
}

.training-search-select[aria-expanded="true"] .k-input-inner:-ms-input-placeholder {
    color: #2F2F2F !important;
    font-weight: 600
}

.training-search-select[aria-expanded="true"] .k-input-inner:-moz-placeholder {
    color: #2F2F2F !important;
    font-weight: 600;
    opacity: 1
}

.training-search-select.k-focus .k-input-inner::placeholder, .training-search-select:has([aria-expanded="true"]) .k-input-inner::placeholder {
    color: #2F2F2F !important;
    font-weight: 600
}

.format-label {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 14px;
    color: #767676
}

.format-count {
    color: #B3B3B3;
    font-size: 14px
}

.format-label input[type="checkbox"] {
    width: 15px;
    height: 15px;
    border: 1.6px solid #B3B3B3
}

    .format-label input[type="checkbox"]:checked {
        background: #FFD88C
    }

.format-text-selected {
    color: #2f2f2f
}

.search-container {
    border: 1px solid #ddd;
    padding: 20px;
    border-radius: 10px;
    background: #f9f9f9;
    margin-bottom: 25px
}

.search-top {
    display: flex;
    gap: 10px
}

.search-row {
    margin-top: 15px;
    display: flex;
    gap: 15px
}

.filter-row {
    margin-top: 15px;
    display: flex;
    gap: 10px;
    align-items: center
}

.clear-btn {
    margin-left: auto
}

.course-box {
    border: 1px solid #ddd;
    border-radius: 12px;
    padding: 20px;
    margin-top: 20px;
    background: #fff
}

.course-card {
    margin-bottom: 20px;
    background: #F4F4F4;
    border: none;
    padding: 20px;
    width: 100%
}

.course-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-bottom: 0;
    padding: 0;
    margin-bottom: 15px
}

.course-header-content {
    display: flex;
    gap: 10px
}

.course-body {
    padding: 0
}

.tag {
    background: #D9D9D9;
    padding: 5px;
    border-radius: 6px;
    height: 30px;
    font-size: 12px;
    font-weight: 400;
    color: #707070;
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: capitalize
}

.course-name {
    font-size: 20px;
    font-weight: 400;
    line-height: 28px;
    color: #2F2F2F;
    margin-bottom: 15px;
    margin-top: 0
}

.category-icons-wrapper {
    display: flex;
    gap: 13px;
    align-items: center
}

.category-icons {
    height: 29px;
    padding: 6px 5px;
    background: #D9D9D9;
    border-radius: 4px;
    display: flex;
    align-items: center
}

.closing {
    background: #FFF4DD;
    height: 30px;
    width: 113px;
    border-radius: 6px;
    color: #ED9D00;
    padding: 5px;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px
}

.details-btn {
    height: 37px;
    width: 134px;
    border-radius: 6px;
    border: 1px solid #707070;
    background: #fff0;
    padding: 9px 20px;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: #414142
}

    .details-btn:hover {
        background: #FFD88C;
        border: none
    }

    .details-btn .k-button-text {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px
    }

.course-details {
    background: #FFF;
    padding: 10px 16px
}

.available-text {
    font-size: 11px;
    font-weight: 600;
    color: #767676;
    line-height: 100%;
    margin-bottom: 7px !important;
    height: 14px;
    display: flex;
    align-items: center
}

.session-grid {
    display: grid;
    gap: 15px;
    width: 100%
}

@media (min-width:992px) {
    .session-grid {
        grid-template-columns: repeat(4,1fr)
    }
}

@media (min-width:1200px) {
    .session-grid {
        grid-template-columns: repeat(5,1fr)
    }
}

@media (min-width:1400px) {
    .session-grid {
        grid-template-columns: repeat(6,1fr)
    }
}

@media (min-width:1600px) {
    .session-grid {
        grid-template-columns: repeat(7,1fr)
    }
}

.session-card {
    border: 1px solid #D9D9D9;
    padding: 14px 10px 14px 10px;
    border-radius: 8px;
    background: #fff;
    display: flex;
    flex-direction: column;
    min-height: 120px;
    cursor: pointer
}

    .session-card:hover {
        border: 2px solid #FFD88C
    }

.session-card-body {
    padding: 0;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    height: 100%
}

.session-format {
    font-size: 12px;
    line-height: 15px;
    font-weight: 600;
    color: #1D1B20;
    margin-bottom: 7px
}

.session-location {
    font-size: 12px;
    font-weight: 600;
    line-height: 15px;
    color: #1D1B20;
    margin-bottom: 7px
}

.session-date {
    font-size: 12px;
    font-weight: 400;
    line-height: 15px;
    color: #1D1B20;
    margin-bottom: 12px
}

.session-card-divider {
    margin-top: auto;
    margin-bottom: 4px;
    border: 0;
    border-top: 1px solid #D9D9D9;
    width: 100%
}

.session-content {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    text-align: left
}

.price-section {
    margin-top: auto;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.price {
    font-size: 20px;
    line-height: 28px;
    font-weight: 500;
    color: #1D1B20
}

.filter-wrapper {
    margin: 40px 0 50px 0;
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between
}

.filter-pill-wrapper {
    position: relative;
    display: inline-block
}

.popup {
    position: absolute;
    background: #fff;
    box-shadow: 0 4px 12px rgb(0 0 0 / .15);
    z-index: 2;
    min-width: 280px
}

.date-popup {
    min-width: 120px !important;
}

.price-popup {
    min-width: 115px !important;
}

.price-popup-filter {
    padding: 6px 19px 0 19px
}

.price-popup-footer {
    padding: 0 6px 6px
}

.price-popup label {
    display: block;
    margin: 0 0 8px 0;
    font-size: 12px;
    line-height: 20px;
    font-weight: 400;
    color: #757575;
    text-transform: uppercase
}

.price-popup input[type="number"] {
    width: 100%;
    padding: 10px;
    border: 1px solid #D9D9D9;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 400;
    line-height: 15px;
    margin-bottom: 12px;
    height: 28px
}

    .price-popup input[type="number"]::-webkit-inner-spin-button, .price-popup input[type="number"]::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0
    }

.price-popup input[type="number"] {
    appearance: textfield;
    -moz-appearance: textfield
}

.small-popup {
    max-width: 358px;
    min-width: 220px !important;
    max-height: 300px;
    overflow-y: auto
}

.scroll-popup {
    min-width: 358px;
    max-height: 300px;
    overflow-y: auto
}

.quick-row {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex-wrap: wrap;
    margin-bottom: 4px
}

    .quick-row button {
        padding: 6px 14px;
        cursor: pointer;
        color: #757575;
        font-weight: 400;
        line-height: 20px;
        font-size: 14px;
        display: flex;
        align-items: center;
        height: 32px;
        border: none;
        background: #fff0
    }

        .quick-row button:hover {
            font-weight: 600
        }

.select-row {
    cursor: pointer;
    transition: background 0.2s;
    font-size: 14px;
    font-weight: 400;
    color: #767676;
    height: auto;
    min-height: 32px;
    padding: 6px 14px;
    border: none;
    background: #fff0;
    width: 100%;
    text-align: left
}

    .select-row:hover {
        font-weight: 600
    }

    .select-row label {
        display: flex;
        align-items: center;
        gap: 15px;
        word-break: break-word
    }

        .select-row label input[type="checkbox"] {
            appearance: none;
            -webkit-appearance: none;
            -moz-appearance: none;
            accent-color: initial;
            width: 15px;
            height: 15px;
            border: 1.6px solid #B3B3B3;
            border-radius: 3px;
            background: #FFF;
            display: inline-grid;
            place-content: center;
            cursor: pointer;
            vertical-align: middle
        }

            .select-row label input[type="checkbox"]:checked {
                background: #FFF;
                border-color: #2F2F2F
            }

                .select-row label input[type="checkbox"]:checked::after {
                    content: "";
                    width: 12px;
                    height: 12px;
                    display: inline-block;
                    background-color: #1D2026;
                    mask-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8l2.5 2.5L12 5' stroke='%23000000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
                    mask-repeat: no-repeat;
                    mask-position: center;
                    mask-size: contain;
                    -webkit-mask-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8l2.5 2.5L12 5' stroke='%23000000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
                    -webkit-mask-repeat: no-repeat
                }

.check-row {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 42px;
    border-top: 1px solid #D9D9D9;
    padding-left: 8.5px;
    margin-bottom: 12px
}

    .check-row input[type="checkbox"] {
        appearance: none;
        -webkit-appearance: none;
        -moz-appearance: none;
        accent-color: initial;
        width: 15px;
        height: 15px;
        border: 1.6px solid #B3B3B3;
        border-radius: 3px;
        background: #FFF;
        display: inline-grid;
        place-content: center;
        cursor: pointer;
        vertical-align: middle
    }

        .check-row input[type="checkbox"]:checked {
            background: #FFF;
            border-color: #2F2F2F
        }

            .check-row input[type="checkbox"]:checked::after {
                content: "";
                width: 12px;
                height: 12px;
                display: inline-block;
                background-color: #1D2026;
                mask-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8l2.5 2.5L12 5' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
                mask-repeat: no-repeat;
                mask-position: center;
                mask-size: contain;
                -webkit-mask-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8l2.5 2.5L12 5' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
                -webkit-mask-repeat: no-repeat
            }

    .check-row label {
        margin: 0 !important;
        font-weight: normal !important;
        cursor: pointer;
        text-transform: capitalize;
        font-size: 14px !important;
        color: #767676
    }

.row.two {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    margin-bottom: 14px;
    padding: 0 10px
}

.training-custom-telerik-dropdown {
    width: 89px;
    padding: 6px;
    border: none;
    border-radius: 4px;
    font-size: 12px;
    background: #fff;
    height: 28px;
    color: #2F2F2F;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none
}

    .training-custom-telerik-dropdown:hover {
        background: #fff
    }

.training-search-select .k-input-values {
    overflow: auto
}

    .training-search-select .k-input-values .k-chip-list {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start;
    }

.custom-dropdown-icon .k-input-button .k-svg-icon svg {
    display: none !important
}

.custom-dropdown-icon .k-input-button .k-svg-icon {
    background: none !important
}

    .custom-dropdown-icon .k-input-button .k-svg-icon::before {
        content: "";
        display: block;
        width: 16px;
        height: 16px;
        background-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M13 6L8 11L3 6' stroke='%231D2026' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        transition: transform 0.2s ease
    }

.custom-dropdown-icon[aria-expanded="true"] .k-input-button .k-svg-icon::before {
    transform: rotate(180deg)
}

.training-custom-telerik-dropdown.k-dropdownlist + .k-animation-container, .training-custom-telerik-dropdown.k-dropdownlist + .k-animation-container .k-popup, .training-custom-telerik-dropdown.k-dropdownlist + .k-animation-container .k-list-container {
    width: 89px !important;
    min-width: 89px !important;
    max-width: 89px !important;
    left: 0 !important;
    right: auto !important;
    transform: none !important;
    margin-left: 0 !important
}

body:has(.training-custom-telerik-dropdown) .k-animation-container .k-popup {
    width: 89px !important;
    min-width: 89px !important;
    max-width: 89px !important;
    left: 0 !important;
    right: auto !important;
    transform: none !important;
    margin-left: 0 !important
}

.training-custom-telerik-dropdown option {
    height: 32px;
    width: 89px !important;
    line-height: 22px;
    font-size: 12px;
    font-weight: 400;
    color: #2F2F2F;
    background-color: #fff;
    text-align: left
}

    .training-custom-telerik-dropdown option:checked {
        background-color: #FFD88C !important;
        color: #2F2F2F !important
    }

    .training-custom-telerik-dropdown option:hover {
        background-color: #F4F4F4 !important
    }

.training-custom-telerik-dropdown:focus {
    border: none;
    box-shadow: none
}

.training-custom-telerik-dropdown:focus-visible {
    outline: 1px solid #ffffff !important
}

.custom-date-wrapper {
    padding: 6px 8px;
    background: #D9D9D9
}

.custom-selected {
    background: #D9D9D9;
    color: #2F2F2F
}

.active-date-filter {
    background-color: #FFD88C !important;
    font-weight: 500 !important
}

.apply-btn {
    width: 107px;
    height: 37px;
    padding: 8px 37px;
    background: #FFD88C;
    border: none;
    font-size: 14px;
    border-radius: 4px;
    color: #2F2F2F;
    font-weight: 400;
    cursor: pointer
}

    .apply-btn:hover {
        background: #FFF4DD
    }

.popup hr {
    margin: 0 0 8px 0;
    border: none;
    border-top: 2px solid #B3B3B3
}

.date-popup label {
    display: block;
    font-weight: 400;
    margin: 10px 0 0 10px;
    font-size: 12px;
    color: #757575;
    line-height: 20px;
    text-transform: uppercase
}

.filter-bar {
    display: flex;
    gap: 15px;
    align-items: center;
    position: relative
}

.filter-label {
    color: #767676;
    font-size: 14px
}

.pill {
    background: #fff;
    border: 1px solid #B3B3B3;
    padding: 5px 10px;
    border-radius: 26px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 400;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    line-height: 20px;
    color: #242424;
    min-width: fit-content;
    box-sizing: border-box
}

.bussiness-unit {
    width: 220px !important;
    justify-content: space-between
}

.regulatory-agency {
    width: 358px !important;
    justify-content: space-between
}

.pagination-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 30px 0
}

.pagination-container {
    display: flex;
    justify-content: center;
    margin: 50px 0 0
}

.dropdown-icon {
    transition: transform 0.2s ease
}

    .dropdown-icon.rotated {
        transform: rotate(180deg)
    }

.pagination-wrapper .k-pager-first, .pagination-wrapper .k-pager-last, .pagination-wrapper .k-pager-prev, .pagination-wrapper .k-pager-next, .pagination-wrapper .k-pager-nav, .pagination-wrapper .k-pager-info {
    display: none !important
}

.pagination-wrapper .k-pager {
    border: none;
    background: none;
    padding-left: 0;
    padding-right: 0
}

.pagination-wrapper .k-button-icon .k-svg-i-caret-alt-right, .pagination-wrapper .k-button-icon .k-svg-i-caret-alt-left {
    display: none !important
}

.pagination-wrapper .k-pager-numbers .k-button {
    color: #2F2F2F;
    width: 30px;
    height: 33px;
    border-radius: 8px
}

.pagination-wrapper .k-pager-numbers {
    gap: 8px
}

    .pagination-wrapper .k-pager-numbers .k-button.k-selected {
        background-color: #FFD88C !important;
        background-image: none !important;
        color: #2F2F2F !important;
        opacity: 1 !important;
        filter: none !important;
        box-shadow: none !important
    }

        .pagination-wrapper .k-pager-numbers .k-button.k-selected .k-button-text {
            color: #2F2F2F !important
        }

        .pagination-wrapper .k-pager-numbers .k-button.k-selected:hover, .pagination-wrapper .k-pager-numbers .k-button.k-selected:focus, .pagination-wrapper .k-pager-numbers .k-button.k-selected:focus-visible {
            background-color: #FFD88C !important;
            background-image: none !important;
            color: #2F2F2F !important;
            opacity: 1 !important;
            filter: none !important;
            box-shadow: none !important;
            outline: none !important
        }

.pagination-wrapper .k-pager .k-button.k-selected:focus, .pagination-wrapper .k-pager .k-button.k-selected:active {
    outline: none !important;
    box-shadow: none !important
}

.pagination-wrapper .k-pager-numbers .k-button.k-selected::before, .pagination-wrapper .k-pager-numbers .k-button.k-selected::after {
    content: none !important;
    display: none !important
}

.training-pagination-buttons {
    border: none;
    background: none;
    height: 38px;
    padding: 8px 12px
}

    .training-pagination-buttons.disabled {
        color: #757575 !important
    }

    .training-pagination-buttons .k-button-text {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 16px;
        font-weight: 400;
        color: #1E1E1E;
        line-height: 135%
    }

    .training-pagination-buttons:hover {
        border-radius: 8px;
        background: #F4F4F4
    }

    .training-pagination-buttons:focus {
        box-shadow: none
    }

    .training-pagination-buttons .k-button:disabled, .k-button.k-disabled {
        color: #757575 !important
    }

.training-no-results {
    margin-top: 40px;
    padding: 40px
}

    .training-no-results h4 {
        margin-top: 32px;
        font-size: 32px;
        font-weight: 400;
        line-height: 123%;
        margin-bottom: 41px !important;
        color: #2F2F2F
    }

    .training-no-results span {
        font-size: 14px;
        font-weight: 400;
        line-height: 100%;
        color: #2F2F2F
    }

@media (max-width:769px) {
    .training-hero {
        margin-top: 32px !important
    }

        .training-hero p {
            margin-bottom: 44px !important
        }

    .promo-bar {
        height: auto !important;
        margin-bottom: 64px !important
    }

    .promo-text {
        padding: 20px !important
    }

    .promo-icon {
        height: stretch !important;
        width: 52px !important;
        min-width: 52px !important;
        flex-shrink: 0 !important
    }

    .training-discount-info {
        height: 19px !important
    }

    .training-discount-subtext {
        height: auto !important;
        font-size: 14px;
        line-height: 19px;
        margin-top: 15px !important;
        display: block
    }

        .training-discount-subtext p {
            margin-bottom: 0px !important
        }

    .topics-title {
        height: auto !important
    }

    .course-grid {
        grid-template-columns: 1fr !important;
        gap: 24px !important
    }

    .course-section-title {
        font-size: 32px !important;
        height: 76px !important
    }

    .free-course-card {
        box-shadow: none !important
    }

    .testimonial-grid {
        grid-template-columns: 1fr !important
    }

    .testimonial-svg {
        margin-bottom: 25px !important
    }

    .testimonial-content {
        margin-bottom: 25px !important
    }

    .testimonial {
        padding: 38px 27px 32px 28px !important
    }

    .testimonials h2 {
        margin-top: 32px !important;
        margin-bottom: 33px !important
    }

    .clear-filter-btn {
        display: flex;
        align-self: flex-end
    }

    .course-header-content {
        gap: 15px !important;
        flex-wrap: wrap
    }
}

@media (max-width:768px) {
    .training-hero h1 {
        font-size: 32px !important;
        margin-bottom: 24px !important
    }

    .hero-desc {
        margin-bottom: 44px !important
    }

    .hero-search {
        flex-direction: column;
        gap: 14px !important;
        margin-bottom: 32px !important
    }

    .search-btn {
        width: 100% !important
    }

    .multiselect-filter {
        flex-direction: column
    }

    .filter-wrapper {
        margin: 32px 0 20px 0px !important;
        flex-direction: column;
        align-items: flex-start
    }

    .filter-bar {
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
        margin-bottom: 10px
    }

    .filter-pill-wrapper {
        width: 100%
    }

    .date-popup {
        width: 100% !important
    }

    .price-popup {
        width: 100% !important
    }

    .pill {
        justify-content: space-between;
        width: 100%
    }

    .bussiness-unit {
        width: 100% !important
    }

    .filter-group {
        width: 100% !important
    }

    .regulatory-agency {
        width: 100% !important
    }

    .course-card {
        margin-bottom: 24px !important
    }

    .details-btn {
        width: 100% !important
    }

    .tag {
        font-size: 12px !important;
        line-height: 20px !important
    }

    .course-header {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 24px !important
    }

    .session-card {
        padding: 10px !important;
    }

    .session-grid {
        grid-template-columns: repeat(1,1fr);
        gap: 15px;
        max-height: calc(3 * (120px + 0.75rem));
        overflow-y: auto;
        overflow-x: hidden;
        padding-right: .25rem;
        scrollbar-width: thin;
        scrollbar-color: #ccc #fff0
    }

        .session-grid::-webkit-scrollbar {
            width: 4px
        }

        .session-grid::-webkit-scrollbar-track {
            background: #fff0
        }

        .session-grid::-webkit-scrollbar-thumb {
            background: #ccc;
            border-radius: 2px
        }

            .session-grid::-webkit-scrollbar-thumb:hover {
                background: #999
            }

    .training-search-select .k-input-inner {
        padding-left: 20px !important
    }

    .price-section {
        gap: 4px !important
    }

    .training-custom-telerik-dropdown.k-dropdownlist + .k-animation-container, .training-custom-telerik-dropdown.k-dropdownlist + .k-animation-container .k-popup, .training-custom-telerik-dropdown.k-dropdownlist + .k-animation-container .k-list-container {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important
    }

    body:has(.training-custom-telerik-dropdown) .k-animation-container .k-popup {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important
    }

    .training-custom-telerik-dropdown option {
        width: 100% !important
    }
}

.skeleton-animate {
    background: linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-loading 1.5s infinite
}

@keyframes skeleton-loading {
    0% {
        background-position: 200% 0
    }

    100% {
        background-position: -200% 0
    }
}

.skeleton-courses-container {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    width: 100%;
    padding: 1rem 0
}

.skeleton-course-card {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgb(0 0 0 / .08);
    overflow: hidden
}

.skeleton-course-header {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #f0f0f0
}

.skeleton-tag {
    width: 100px;
    height: 28px;
    border-radius: 4px
}

.skeleton-icons {
    display: flex;
    gap: .5rem;
    margin-left: auto
}

.skeleton-icon {
    width: 24px;
    height: 24px;
    border-radius: 4px
}

.skeleton-btn {
    width: 120px;
    height: 36px;
    border-radius: 6px
}

.skeleton-course-body {
    padding: 1.5rem
}

.skeleton-title {
    width: 60%;
    height: 24px;
    border-radius: 4px;
    margin-bottom: .75rem
}

.skeleton-subtitle {
    width: 30%;
    height: 16px;
    border-radius: 4px;
    margin-bottom: 1rem
}

.skeleton-sessions {
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(200px,1fr));
    gap: 1rem
}

.skeleton-session-card {
    height: 120px;
    border-radius: 8px
}

.pagination-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: .5rem;
    padding: 2rem 0;
    margin-top: 1rem
}

.pagination-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border: none;
    border-radius: 6px;
    background: #fff;
    color: #1E1E1E;
    font-size: 16px;
    font-weight: 400;
    line-height: 135%;
    cursor: pointer;
    transition: all 0.2s ease;
    height: 38px
}

    .pagination-btn.disabled {
        opacity: .5;
        cursor: not-allowed;
        pointer-events: none
    }

    .pagination-btn:not(.disabled):hover {
        background: #f4f4f4
    }

.page-numbers {
    display: flex;
    align-items: center;
    gap: .25rem
}

.page-number {
    min-width: 30px;
    height: 33px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #fff0;
    border-radius: 6px;
    background: #fff0;
    color: #2F2F2F;
    font-size: 14px;
    font-weight: 400;
    line-height: 120%;
    cursor: pointer;
    transition: all 0.2s ease
}

    .page-number:hover:not(.active) {
        background: #f5f5f5
    }

    .page-number.active {
        color: #000000 !important;
        background-color: #FFD88C !important
    }

.page-ellipsis {
    min-width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000;
    font-size: 16px
}

.cart-page {
    background-color: #FFF;
    min-height: 85vh;
    margin-top: 45px
}

.cart-header {
    margin-bottom: 72px
}

.step-text {
    color: #2F2F2F;
    font-size: 14px;
    font-weight: 400;
    line-height: 100%;
    margin-bottom: 5px;
    margin-top: 0
}

.page-title {
    font-size: 32px;
    font-weight: 400;
    color: #2F2F2F;
    line-height: 123%;
    margin-bottom: 0
}

.empty-cart-container {
    text-align: center;
    margin-top: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    margin-left: 196px;
    width: 760px;
    padding: 40px
}

.empty-cart-icon {
    margin-bottom: 32px
}

.empty-title {
    font-size: 32px;
    font-weight: 400;
    margin-bottom: 32px;
    color: #2F2F2F;
    line-height: 123%
}

.empty-description {
    max-width: 650px;
    margin-bottom: 32px;
    color: #2F2F2F;
    font-size: 14px;
    font-weight: 400;
    line-height: 19px
}

.cart-buttons {
    display: flex;
    justify-content: center;
    gap: 12px
}

.primary-btn {
    background-color: #FFD88C;
    border: none;
    padding: 9px 35px;
    font-weight: 400;
    border-radius: 4px;
    height: 35px;
    width: 149px;
    font-size: 14px;
    line-height: 100%;
    color: #2F2F2F
}

    .primary-btn:hover {
        background-color: #FFF4DD
    }

@media (max-width:768px) {
    .small-popup {
        max-width: 100% !important;
        min-width: 100% !important
    }

    .training-custom-telerik-dropdown {
        width: 100% !important
    }

    .apply-btn {
        width: 100% !important
    }

    .empty-cart-container {
        width: 100%;
        margin-left: 0px;
    }
}

.impersonate-user-message {
    border: 1px solid #ED9D00;
    border-radius: 4px;
    height: auto;
    padding: 4px 8px;
    display: flex;
    align-items: center;
    margin-bottom: 22px;
    font-size: 12px;
    line-height: 15px;
    color: #2F2F2F;
    font-weight: 400;
    margin-top: 0px;
}

.skeleton-pulse {
    background: linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-loading 1.5s infinite;
    border-radius: 4px
}

@keyframes skeleton-loading {
    0% {
        background-position: 200% 0
    }

    100% {
        background-position: -200% 0
    }
}

.skeleton-tab {
    width: 80px;
    height: 32px;
    display: inline-block;
    margin-right: 8px
}

.skeleton-card {
    opacity: .7
}

.skeleton-icon {
    width: 16px;
    height: 16px
}

.skeleton-title {
    width: 60%;
    height: 20px;
    margin-bottom: 8px
}

.skeleton-location {
    width: 40%;
    height: 14px;
    margin-bottom: 4px
}

.skeleton-date {
    width: 50%;
    height: 14px
}

.skeleton-type {
    width: 70px;
    height: 24px
}

.skeleton-qty {
    width: 100px;
    height: 32px
}

.skeleton-price {
    width: 60px;
    height: 20px
}

.skeleton-label {
    width: 80px;
    height: 16px
}

.skeleton-value {
    width: 60px;
    height: 16px
}

.skeleton-total-label {
    width: 50px;
    height: 20px
}

.skeleton-total-value {
    width: 80px;
    height: 24px
}

.skeleton-button {
    width: 100%;
    height: 40px;
    margin-top: 16px
}

.filter-tabs {
    display: flex;
    gap: 10px;
    margin: 22px 0;
    flex-wrap: wrap
}

.filter-tab {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 29px;
    padding: 7px 25px;
    border: 1px solid #D9D9D9;
    border-radius: 30px;
    background: #fff;
    cursor: pointer;
    font-size: 12px;
    font-weight: 400;
    color: #2F2F2F;
    transition: all 0.2s ease
}

    .filter-tab:hover {
        border: none !important;
        background: #FFD88C !important
    }

    .filter-tab.active {
        background: #2F2F2F;
        color: #fff
    }

    .filter-tab svg {
        width: 16px;
        height: 16px
    }

.no-items-message {
    text-align: center;
    padding: 40px;
    color: #666
}

.cart-wrapper {
    display: grid;
    grid-template-columns: 2.2fr 1fr;
    min-height: calc(100vh - 75px);
    background: #fff;
    width: 100%
}

.cart-items-scroll {
    max-height: calc(100vh - 75px);
    overflow-y: auto
}

    .cart-items-scroll::-webkit-scrollbar {
        width: 2px
    }

    .cart-items-scroll::-webkit-scrollbar-thumb {
        background: #ccc;
        border-radius: 6px
    }

    .cart-items-scroll::-webkit-scrollbar-track {
        background: #fff0
    }

.mt-12 {
    margin-top: 12px
}

.mt-15 {
    margin-top: 15px
}

.mt-32 {
    margin-top: 32px
}

.cart-items-wrapper {
    padding-right: 37px
}

.cart-heading {
    display: flex;
    flex-direction: column;
    margin-top: 45px
}

.warning-message {
    background-color: #FFF5CD;
    height: auto;
    max-width: 462px;
    width: max-content;
    border-radius: 4px;
    padding: 4px 8px;
    display: flex;
    align-items: center !important;
    gap: 8px;
    font-size: 12px;
    font-weight: 400;
    line-height: 15px;
    color: #ED9D00;
    margin-left: auto;
    margin-bottom: 22px
}

.total-summary-section {
    background: linear-gradient(180deg,#F9F9F9 0%,#EEFEFF 100%);
    position: relative;
    z-index: 1
}

    .total-summary-section::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        right: -100vw;
        width: 100vw;
        background: linear-gradient(180deg,#F9F9F9 0%,#EEFEFF 100%);
        z-index: -1
    }

.total-summary-sticky {
    position: sticky;
    top: 0;
    align-self: flex-start;
    height: 100%
}

.order-box {
    padding: 45px 0 0 30px
}

.total-section {
    height: 29px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 40px
}

.total-title {
    font-size: 20px;
    line-height: 28px;
    font-weight: 400;
    color: #2F2F2f
}

.total-amount {
    font-size: 24px;
    font-weight: 700;
    line-height: 120%;
    color: #2F2F2F
}

.continue-btn {
    background-color: #FFD88C;
    height: 37px;
    border-radius: 4px;
    padding: 9px 24px;
    border: none;
    font-weight: 400;
    font-size: 14px;
    line-height: 100%;
    color: #2F2F2F
}

    .continue-btn:focus {
        box-shadow: none !important
    }

    .continue-btn:hover {
        background: #FFF4DD
    }

.cart-item-card {
    padding: 20px 10px;
    background-color: #f4f4f4;
    border-radius: 6px;
    border: none;
    height: auto;
}

    .cart-item-card .k-card-body {
        padding: 0
    }

.cart-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.remove {
    cursor: pointer;
    width: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: center;
}

.details {
    flex: 1;
    padding: 15px 12px 0px;
    gap: 15px;
    display: flex;
    flex-direction: column
}

.title {
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    color: #2F2F2F
}

.location {
    font-size: 12px;
    line-height: 15px;
    color: #707070;
}

.date {
    font-size: 12px;
    line-height: 15px;
    color: #707070;
}

.type {
    min-width: 137px;
    max-width: 200px;
    height: auto;
    min-height: 17px;
    text-align: center;
    font-size: 14px;
    color: #2F2F2F;
    line-height: 1.2;
    font-weight: 400;
    margin: 0 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: normal;
    word-wrap: break-word;
    overflow-wrap: break-word
}

.type-text {
    height: 41px;
    padding: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 20px;
}

.type-with-bg {
    border-radius: 20px;
    background: #FFF5CD;
    min-width: 101px;
    max-width: 200px;
    width: fit-content;
    height: auto;
    min-height: 17px;
    text-align: center;
    font-size: 14px;
    color: #2F2F2F;
    line-height: 1.2;
    font-weight: 400;
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: normal;
    word-wrap: break-word;
    overflow-wrap: break-word;
    box-sizing: border-box
}

.qty-box-wrapper {
    display: flex;
    flex-direction: column;
    width: 125px
}

.qty-box {
    display: flex;
    align-items: center;
    background: #FFF;
    border-radius: 4px;
    gap: 12px;
    margin: 0 8px;
    height: 34px;
    width: 109px;
    font-size: 16px;
    font-weight: 400;
    color: #2F2F2F;
    line-height: 135%
}

.item-qty {
    width: 41px;
    display: flex;
    align-items: center;
    justify-content: center
}

.qty-box.disabled, .qty-box .disabled {
    background: #EBEBEB !important;
    color: #B3B3B3 !important;
    cursor: not-allowed
}

.qty-box button:disabled {
    color: #B3B3B3 !important;
    cursor: not-allowed
}

.qty-box button {
    border: none;
    background: #fff0;
    cursor: pointer;
    color: #2F2F2F;
    padding: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box
}

.qty-box-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 125px;
    padding: 20px 8px 0 8px
}

.qty-message-container {
    display: flex;
    align-items: flex-start;
    justify-content: center
}

.qty-danger-msg {
    font-size: 10px;
    text-align: right;
    margin-top: 20px;
    font-weight: 400;
    line-height: 10px;
    color: #767676;
    margin-right: 8px;
    margin-bottom: 0px;
}

.item-price {
    width: 125px;
    min-width: 125px;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 14px;
    line-height: 100%;
    font-weight: 400;
    color: #2F2F2F;
    overflow: visible;
}

.item-price-data {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
    height: 62px;
}

.editable-price-input {
    width: 120px !important;
    height: 34px !important;
    margin: 0 !important;
    flex-shrink: 0;
}

.item-price > .k-numerictextbox {
    width: 120px !important;
    height: 34px !important;
    margin: 20px 0 auto !important;
}

.item-price .k-input-inner {
    text-align: center !important;
}

.top-42 {
    top: 42px !important;
}

.item-price-discount {
    width: 125px;
    margin: 0;
    text-align: center;
    white-space: nowrap;
    color: #707070;
    margin-top: 10px;
}

.subtotal-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
    height: 29px
}

.payment-summery-subtotal-title {
    font-size: 14px;
    font-weight: 400;
    line-height: 100%;
    color: #2F2F2F
}

.payment-summery-subtotal {
    font-size: 20px;
    line-height: 28px;
    color: #2F2F2F;
    font-weight: 400;
    text-align: right
}

.discount-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 17px;
    margin-bottom: 6px
}

.sales-tax-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px
}

.discount-code-section {
    display: flex;
    align-items: center;
    gap: 13px
}

.discount-code-input {
    height: 37px;
    border-radius: 4px;
    border-color: #B3B3B3;
    font-size: 14px;
    line-height: 100%;
    font-weight: 400
}

    .discount-code-input .k-input-inner {
        padding-left: 16px
    }

        .discount-code-input.k-input-inner::placeholder {
            color: #B3B3B3 !important
        }

        .discount-code-input.k-input-inner::-webkit-input-placeholder {
            color: #B3B3B3 !important
        }

        .discount-code-input.k-input-inner::-moz-placeholder {
            color: #B3B3B3 !important;
            opacity: 1
        }

        .discount-code-input.k-input-inner:-ms-input-placeholder {
            color: #B3B3B3 !important
        }

        .discount-code-input.k-input-inner:-moz-placeholder {
            color: #B3B3B3 !important;
            opacity: 1
        }

        .discount-code-input.k-focus .k-input-inner::placeholder, .discount-code-input.k-input-inner::placeholder {
            color: #B3B3B3 !important
        }

.apply-discount-code-btn {
    height: 35px;
    width: 94px;
    border-radius: 4px;
    color: #fff;
    background: #2F2F2F;
    font-size: 14px;
    font-weight: 400;
    line-height: 100%;
    padding: 9px 15px
}

.payment-summery-divider {
    border: 1px solid #BBE4FF;
    margin-bottom: 45px;
    margin-top: 40px
}

.discount-applied-msg {
    margin-top: 12px
}

.mb-22 {
    margin-bottom: 22px !important
}

.mb-40 {
    margin-bottom: 40px !important
}

.mb-6 {
    margin-bottom: 6px !important
}

@media (max-width:768px) {
    .filter-tabs {
        margin: 24px 0px !important
    }

    .cart-item-card {
        height: auto !important;
        min-height: 0 !important;
        padding: 9px;
        box-sizing: border-box;
        overflow: visible !important;
    }

        .cart-item-card .k-card-body {
            height: auto !important;
            min-height: 0 !important;
            flex: none !important;
            overflow: visible !important;
            box-sizing: border-box;
        }

    .mb-mobile-24 {
        margin-bottom: 24px !important
    }

    .cart-row {
        display: grid;
        grid-template-columns: 34px minmax(0, 1fr) minmax(0, 1fr);
        grid-template-areas:
            "remove details details"
            "remove type qty"
            "remove price price";
        width: 100%;
        min-width: 0;
        height: auto !important;
        min-height: 0 !important;
        gap: 0;
        row-gap: 20px;
        align-items: start;
        overflow: visible !important;
    }

    .type,
    .qty-box-wrapper,
    .item-price,
    .details {
        min-width: 0;
    }

    .remove {
        grid-area: remove;
        width: 24px;
        padding-top: 4px;
        justify-content: center;
        align-items: center;
        height: 100%;
        margin-right: 10px
    }

    .details {
        grid-area: details;
        padding: 12px;
        gap: 16px;
        display: flex;
        flex-direction: column
    }

        .details::before {
            content: "Product";
            font-weight: 400;
            font-size: 12px;
            line-height: 15px;
            color: #B3B3B3;
        }

    .title {
        font-size: 16px;
        line-height: 22px;
        font-weight: 400
    }

    .location, .date {
        font-size: 12px;
        line-height: 16px
    }

    .type-text {
        margin-top: 10px;
    }

    .attendee-info-card-body .type-text {
        margin-top: 20px;
    }

    .type {
        grid-area: type;
        margin: 0;
        min-width: unset;
        max-width: unset;
        justify-content: flex-start;
        padding: 10px 12px;
        display: flex;
        flex-direction: column;
        padding-top: 0px;
    }

        .type::before {
            content: "Category";
            font-weight: 400;
            font-size: 12px;
            line-height: 15px;
            color: #B3B3B3;
        }

    .type-with-bg {
        margin: 0;
        padding: 4px 14px;
        font-size: 14px
    }

    .qty-box-wrapper {
        grid-area: qty;
        width: auto;
        height: auto;
        padding: 0;
        justify-self: end;
        gap: 20px;
        padding-right: 18px;
    }

        .qty-box-wrapper::before {
            content: "Quantity";
            font-weight: 400;
            font-size: 12px;
            line-height: 15px;
            color: #B3B3B3;
        }

    .qty-danger-msg {
        margin-top: 0px !important;
        margin-right: 0px !important;
    }

    .qty-box {
        width: 100%;
        height: 36px;
        margin: 0;
        gap: 8px;
        justify-content: space-around;
    }

        .qty-box.disabled {
            grid-area: qty;
            width: auto;
            height: auto;
            padding: 0;
            align-items: center;
            justify-self: end;
            width: 104px;
            height: 36px;
            margin: 0;
            gap: 8px
        }

    .item-price {
        grid-area: price;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        height: auto !important;
        min-height: 0 !important;
        display: grid;
        grid-template-columns: minmax(0, 1fr) 120px;
        grid-template-rows: 43px;
        column-gap: 43px;
        row-gap: 2px;
        justify-self: stretch;
        align-self: start;
        padding: 0 18px 0 12px;
        margin: 0;
        box-sizing: border-box;
        overflow: visible !important;
        margin-bottom: 24px;
    }

        .item-price::before {
            content: "Unit Price";
            grid-column: 1;
            grid-row: 1 / span 2;
            justify-self: end;
            align-self: start;
            font-size: 12px;
            line-height: 15px;
            font-weight: 400;
            color: #B3B3B3;
            padding: 14px 12px;
        }

    .item-price-data {
        margin-top: 0px;
        height: auto;
    }

    .item-price .price-value {
        grid-column: 2;
        grid-row: 1;
        justify-self: end;
        align-self: start;
        margin: 0;
        white-space: nowrap;
        padding: 14px 12px;
    }

    .item-price .item-price-discount {
        grid-column: 2;
        grid-row: 2;
        justify-self: end;
        align-self: start;
        position: static;
        width: auto;
        margin: 0;
        transform: none;
        max-width: 100%;
        white-space: normal;
        overflow-wrap: anywhere;
        word-break: break-word;
        font-size: 12px;
        line-height: 15px;
        color: #707070;
    }
}

@media (max-width:768px) {
    .cart-wrapper {
        display: flex;
        flex-direction: column;
        grid-template-columns: unset !important;
        min-height: auto !important;
        width: 100%;
        gap: 24px;
    }

    .cart-items-wrapper {
        padding-right: 0px !important;
        max-height: max-content
    }

    .warning-message {
        width: 100% !important;
        align-items: flex-start !important;
        margin-bottom: 24px !important
    }

        .warning-message svg {
            width: 16px !important;
            height: 16px !important;
            min-width: 16px !important;
            min-height: 16px !important;
            max-width: 16px !important;
            max-height: 16px !important;
            flex-shrink: 0 !important;
            flex-grow: 0 !important;
            display: inline-block
        }

    .subtotal-section {
        margin-bottom: 15px
    }

    .sales-tax-section {
        margin-bottom: 34px
    }

    .pay-terms {
        margin-bottom: 43px !important
    }

    .pay-divider {
        margin-top: 29px
    }

    .pay-actions {
        gap: 12px !important
    }

    .total-section {
        margin-bottom: 37px !important
    }

    .payment-summery-divider {
        margin-bottom: 44px
    }

    .total-summary-section {
        padding-bottom: 45px
    }

        .total-summary-section::before {
            content: "";
            position: absolute;
            top: 0;
            bottom: 0;
            right: -100vw;
            width: 100vw;
            background: linear-gradient(180deg,#F9F9F9 0%,#EEFEFF 100%);
            z-index: -1
        }

        .total-summary-section::after {
            content: "";
            position: absolute;
            top: 0;
            bottom: 0;
            left: -100vw;
            width: 100vw;
            background: linear-gradient(180deg,#F9F9F9 0%,#EEFEFF 100%);
            z-index: -1
        }

    .order-box {
        padding-left: 0;
        padding-top: 40px
    }
}

.skeleton {
    background: linear-gradient(90deg,#f0f0f0 25%,#e8e8e8 50%,#f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer 1.5s infinite ease-in-out;
    border-radius: 4px
}

@keyframes skeleton-shimmer {
    0% {
        background-position: 200% 0
    }

    100% {
        background-position: -200% 0
    }
}

.skeleton-text {
    display: inline-block
}

.skeleton-button {
    border-radius: 6px;
    display: inline-block
}

.skeleton-badge {
    border-radius: 12px;
    display: inline-block
}

.skeleton-circle {
    border-radius: 50%;
    display: inline-block
}

.skeleton-progress {
    border-radius: 4px
}

.skeleton-input {
    border-radius: 4px
}

.skeleton-card {
    padding: 20px;
    margin-bottom: 16px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgb(0 0 0 / .1)
}

.skeleton-form {
    background: #fafafa;
    border-radius: 8px;
    margin-top: 16px
}

.shopping-cart-add-attendee-wrapper {
    overflow: auto;
    max-height: calc(100vh - 75px)
}

    .shopping-cart-add-attendee-wrapper.scrollable-content::-webkit-scrollbar {
        width: 2px
    }

.shopping-cart-continue-btn-wrapper {
    position: sticky;
    top: 0;
    z-index: 10
}

.session-type-tabs {
    display: flex;
    gap: 10px;
    margin: 20px 0;
    flex-wrap: wrap
}

.tab-button {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 29px;
    padding: 7px 25px;
    border: 1px solid #D9D9D9;
    border-radius: 30px;
    background: #fff;
    cursor: pointer;
    font-size: 12px;
    font-weight: 400;
    color: #2F2F2F;
    transition: all 0.2s ease
}

    .tab-button:hover {
        border: none !important;
        background: #FFD88C !important
    }

    .tab-button.active {
        background: #2F2F2F;
        color: #fff
    }

    .tab-button svg {
        width: 16px;
        height: 16px
    }

.incomplete-attendee-error-msg {
    margin-left: auto !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    max-width: max-content !important;
    margin-bottom: 20px
}

.global-success {
    margin-left: auto !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    max-width: max-content !important;
    margin-bottom: 20px
}

.global-default {
    margin-left: auto !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    max-width: max-content !important;
    margin-bottom: 20px
}

.attendees-info-progress-wrapper {
    margin: 0 19px
}

.attendee-toggle-btn {
    border: none;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0;
    background: #fff0;
    font-size: 14px;
    line-height: 100%;
    color: #2f2f2f
}

.attendees-info-toggle-section {
    display: flex;
    justify-content: center;
    margin: 15px 0
}

.instructions-section {
    padding: 0
}

.instructions-title {
    font-size: 16px;
    font-weight: 600;
    color: #2F2F2F;
    margin-bottom: 30px;
    line-height: 22px;
    margin-top: 0
}

.instructions-list {
    padding-left: 20px;
    margin: 0 0 16px 0;
    font-size: 14px;
    color: #2F2F2F;
    line-height: 1.6
}

    .instructions-list li:last-child {
        margin-bottom: 0
    }

.instructions-collapsed {
    max-height: 90px;
    overflow: hidden;
    position: relative
}

    .instructions-collapsed::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 60px;
        pointer-events: none;
        background: linear-gradient( 180deg, rgba(247, 250, 250, 0) 0%, rgba(247, 250, 250, 0.35) 40%, rgba(247, 250, 250, 0.7) 70%, #F7FAFA 100% );
    }

.btn-toggle-details {
    background: none;
    border: none;
    color: #2F2F2F;
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    text-decoration: underline;
    cursor: pointer;
    padding: 9px 24px;
    margin-top: 40px;
    height: 35px;
    margin-bottom: 40px;
    display: block;
    text-align: center;
    width: 100%
}

    .btn-toggle-details:hover {
        font-weight: 600
    }

.policies-content {
    border: 1px solid #BBE4FF;
    background: #FFF;
    padding: 32px 15px;
    border-radius: 4px;
    margin-bottom: 45px
}

.policies-title {
    font-size: 14px;
    font-weight: 600;
    color: #2F2F2F;
    margin-bottom: 12px
}

.policies-content ul {
    padding-left: 16px;
    margin: 0;
    font-size: 13px;
    color: #2F2F2F;
    line-height: 1.6
}

.shopping-cart-add-attendee-wrapper {
    padding-right: 37px
}

.shopping-cart-step-header-section {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.shopping-cart-step-back-link {
    height: 36px;
    width: 107px;
    padding: 9px 24px;
    font-size: 14px;
    font-weight: 400;
    line-height: 100%;
    color: #2F2F2F;
    gap: 8px;
    display: flex;
    align-items: center;
    text-decoration: none;
    cursor: pointer
}

.mb-25 {
    margin-bottom: 25px !important
}

.mb-20 {
    margin-bottom: 20px !important
}

.gap-62 {
    gap: 62px !important
}

.attendee-info-card {
    border-radius: 6px !important;
    background: #F4F4F4;
    border: 1px solid #F4F4F4;
    margin-bottom: 20px
}

    .attendee-info-card .k-card-body {
        padding: 0
    }

.attendee-info-card-body {
    background: #F4F4F4;
    padding: 15px 9px;
    padding-bottom: 0
}

.product-name {
    font-size: 14px;
    font-weight: 400;
    line-height: 100%;
    color: #2F2F2F !important;
    margin-bottom: 0;
    margin-top: 0
}

.qty-pill-section {
    width: 100px;
    padding: 0 8px;
    display: flex;
}

.qty-pill {
    font-weight: 400;
    align-items: center;
    display: flex;
    justify-content: center;
    height: 32px;
    background: #EBEBEB;
    border-radius: 4px;
    font-size: 16px;
    color: #2F2F2F;
    line-height: 135%;
    margin-top: 20px;
    width: 100%;
}

.attnedee-header-divider {
    margin: 15px 21.5px
}

.attendee-header {
    background-color: #F4F4F4;
    margin: 0 9px;
    height: 45px;
    padding: 8.5px 22px;
    margin-bottom: 15px
}

.attendee-icon-wrapper {
    display: flex;
    align-items: center;
    gap: 12px
}

.attendee-card {
    background-color: #fff;
    border: none;
    border-radius: 6px;
    margin: 15px 21px;
    padding: 9px;
    height: 171px
}

.required-attendee-qty {
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    color: #2F2F2F
}

.attendee-required-msg {
    color: #2F2F2F;
    font-size: 14px;
    line-height: 100%;
    font-style: italic;
    font-weight: 400
}

.attendee-form-card {
    border: none;
    border-radius: 6px;
    margin: 15px 21px 15px 21px;
    background: #fff;
    padding: 21px 27px 19px 27px
}

.use-account-info {
    display: flex;
    gap: 10px;
    align-items: center;
    font-size: 14px;
    font-weight: 400;
    line-height: 100%;
    color: #2F2F2F;
    margin-bottom: 37px;
    height: 17px
}

    .use-account-info input[type="checkbox"] {
        appearance: none;
        -webkit-appearance: none;
        -moz-appearance: none;
        accent-color: initial;
        width: 12px;
        height: 12px;
        border: 1.6px solid #2F2F2F;
        border-radius: 0;
        background: #FFF;
        display: inline-grid;
        place-content: center;
        cursor: pointer;
        vertical-align: middle;
        margin-bottom: 0
    }

    .use-account-info .k-checkbox-wrap {
        align-items: center
    }

    .use-account-info input[type="checkbox"]:checked {
        background: #FFF;
        border-color: #2F2F2F;
        box-shadow: none !important
    }

        .use-account-info input[type="checkbox"]:checked::after {
            content: "";
            width: 15px;
            height: 12px;
            display: inline-block;
            background-color: #1D2026;
            mask-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8l2.5 2.5L12 5' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
            mask-repeat: no-repeat;
            mask-position: center;
            mask-size: contain;
            -webkit-mask-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8l2.5 2.5L12 5' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
            -webkit-mask-repeat: no-repeat
        }

.attendee-form-section-title {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: .12em;
    color: #767676;
    margin-bottom: 26px
}

.order-number-error-message {
    color: #B3261E;
    background: #FDECEA;
    border: 1px solid #F5C6C3;
    border-radius: 6px;
    padding: 10px 12px;
    font-size: 13px;
    font-weight: 500;
    margin-top: 10px;
    line-height: 1.4;
}

.card-busy {
    position: relative;
    pointer-events: none;
    opacity: 0.7;
}

.card-saving-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: rgba(255, 255, 255, 0.95);
    padding: 12px 24px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    z-index: 10;
    font-weight: 500;
    color: #2F2F2F;
}

.h-36 {
    height: 36px !important
}

.h-29 {
    height: 29px !important
}

.h-28 {
    height: 28px !important
}

.W-308 {
    width: 308px
}

.attendee-form-divider {
    margin-top: 18px;
    margin-bottom: 21px
}

.dietary-section-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 28px
}

.dietary-section .dietary-question {
    font-size: 14px;
    font-weight: 400;
    line-height: 100%;
    color: #2F2F2F;
    display: block
}

.dietary-answer {
    color: #2F2F2F
}

.diet-details {
    color: #2F2F2F;
    font-weight: 600
}

.dietary-section {
    color: #2F2F2F
}

.ms-10 {
    margin-left: 10px
}

.dietary-section .dietary-options {
    margin-top: 12px
}

.dietray-options label {
    font-size: 14px;
    font-weight: 400;
    line-height: 100%;
    color: #2F2F2F
}

.dietary-section input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    accent-color: initial;
    width: 12px;
    height: 12px;
    border: 1.6px solid #2F2F2F;
    border-radius: 0;
    background: #FFF;
    display: inline-grid;
    place-content: center;
    cursor: pointer;
    vertical-align: middle
}

    .dietary-section input[type="checkbox"]:checked {
        background: #FFF;
        border-color: #2F2F2F;
        box-shadow: none !important
    }

        .dietary-section input[type="checkbox"]:checked::after {
            content: "";
            width: 15px;
            height: 12px;
            display: inline-block;
            background-color: #1D2026;
            mask-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8l2.5 2.5L12 5' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
            mask-repeat: no-repeat;
            mask-position: center;
            mask-size: contain;
            -webkit-mask-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8l2.5 2.5L12 5' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
            -webkit-mask-repeat: no-repeat
        }

.info-box {
    display: flex;
    align-items: center;
    background-color: #F4F4F4;
    border-radius: 6px;
    padding: 4px 9px;
    width: 100%;
    color: #767676;
    gap: 10px;
    font-size: 12px;
    line-height: 15px;
    font-weight: 400;
    height: 38px
}

.attendee-form-buttons {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 38px
}

.attendee-form-cancel {
    height: 37px;
    width: 144px;
    border-radius: 6px;
    border-color: #707070;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: #2F2F2F;
    background: #fff
}

    .attendee-form-cancel:hover {
        background: #FFD88C;
        border: none
    }

    .attendee-form-cancel:focus {
        box-shadow: none
    }

.attendee-form-submit {
    height: 37px;
    width: 165px;
    padding: 9px 24px;
    background: #FFD88C;
    border: none;
    font-size: 14px;
    line-height: 100%;
    font-weight: 400;
    color: #2F2F2F
}

    .attendee-form-submit:hover {
        background: #FFF4DD
    }

.delete-col {
    width: 40px;
    justify-content: center;
    display: flex;
    align-items: center
}

.btn-delete {
    background: none;
    border: none;
    color: #999;
    font-size: 14px;
    cursor: pointer;
    padding: 4px 8px
}

    .btn-delete:hover {
        color: #333
    }

.contact-col {
    min-width: 200px;
    padding: 12px
}

.company-col {
    min-width: 250px;
    padding: 22px 12px 12px
}

.action-col {
    gap: 9px
}

.add-attendee-button-wrapper {
    background: #fff;
    margin: 0 19px 15px;
    padding: 10px !important;
    border-radius: 6px
}

.btn-attendee-action {
    width: 38px;
    height: 72px;
    background-color: #FFF4DD;
    border: none;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer
}

    .btn-attendee-action:hover {
        background-color: #FFD88C
    }

    .btn-attendee-action.disabled {
        cursor: not-allowed !important
    }

.alert-full-width-with-margins {
    width: calc(100% - 42px) !important;
    margin-left: 21px !important;
    margin-right: 21px !important;
    max-width: none !important;
    margin-bottom: 15px !important
}

.attendee-name {
    font-size: 16px;
    font-weight: 600;
    line-height: 135%;
    color: #2F2F2F;
    margin-bottom: 15px;
    margin-top: 0
}

.attendee-personal-info {
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    color: #2F2F2F
}

.attendee-company-info {
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    color: #2F2F2F;
    margin-bottom: 15px
}

.attendee-dietary-option-message {
    display: flex;
    flex-direction: column;
    font-size: 14px;
    font-weight: 400;
    line-height: 19px
}

.qa-row {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #2F2F2F
}

.btn-add-attendee {
    background-color: #FFD88C;
    border: none;
    border-radius: 4px;
    padding: 11px;
    cursor: pointer;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center
}

    .btn-add-attendee:hover {
        background-color: #FFF4DD
    }

.plus-icon {
    font-size: 22px;
    font-weight: 700;
    color: #333
}

.shopping-cart-policies-section {
    background: linear-gradient(180deg,#F9F9F9 0%,#EEFEFF 100%);
    position: relative;
    z-index: 1;
    align-self: stretch
}

    .shopping-cart-policies-section::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        right: -100vw;
        width: 100vw;
        background: linear-gradient(180deg,#F9F9F9 0%,#EEFEFF 100%);
        z-index: -1
    }

.shopping-cart-policies-content-section {
    margin: 45px 0 0 30px;
    height: 100vh;
    overflow: auto;
    max-height: calc(100vh - 300px);
    padding-right: 20px
}

.sticky-continue-wrapper {
    position: sticky;
    top: 45px;
    z-index: 999;
    padding-bottom: 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0 auto;
    padding: 0 30px;
}

    .sticky-continue-wrapper::before {
        content: "";
        position: absolute;
        inset: -20px -10px 0 0;
        background: #F9F9F9;
        z-index: -1
    }

.shopping-cart-continue-btn {
    height: 37px;
    border-radius: 4px;
    padding: 9px 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 400;
    line-height: 100%;
    color: #2F2F2F;
    background: #FFD88C;
    border: none;
    width: 90%;
    margin: 0 auto
}

    .shopping-cart-continue-btn:hover {
        background: #FFF4DD
    }

    .shopping-cart-continue-btn:disabled {
        background: rgb(118 118 118 / .12);
        cursor: not-allowed
    }

.shopping-cart-policies-divider {
    margin: 40px auto;
    border: 1px solid #BBE4FF;
    width: 90%
}

.policies-content h3 {
    font-size: 12px;
    font-weight: 600;
    line-height: 17px;
    color: #2F2F2F;
    margin-bottom: 20px;
    margin-top: 0
}

.policies-content ul {
    padding-left: 1.5rem
}

    .policies-content ul li {
        font-size: 12px;
        font-weight: 400;
        line-height: 17px;
        color: #2F2F2F
    }

.format-text-selected {
    color: #2f2f2f
}

input[type="password"]::-ms-reveal {
    display: none !important
}

input[type="password"]::-ms-clear {
    display: none !important
}

input[type="password"]::-ms-reveal, input[type="password"]::-ms-clear {
    display: none !important
}

.progress-bar-container {
    width: 100%;
    height: 2px;
    background-color: #B3B3B3;
    margin-bottom: 8px
}

.progress-bar-fill {
    height: 100%;
    transition: width 0.3s ease
}

.progress-label-row {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.progress-label {
    font-weight: 400;
    font-size: 12px;
    line-height: 15px;
    color: #b3b3b3
}

.progress-percentage {
    font-weight: 400;
    font-size: 12px;
    line-height: 133%;
    color: #242424
}

.progress-green {
    background-color: #2D9B8E
}

.progress-red {
    background-color: #B3261E
}

@media (max-width:768px) {
    .attendee-info-card-body .cart-row {
        grid-template-columns: 1fr 1fr;
        grid-template-areas:
            "details details"
            "type qtypill"
            "price price";
        align-items: start;
        row-gap: 20px;
    }

    .qty-pill-section::before {
        content: "Quantity";
        font-weight: 400;
        font-size: 12px;
        line-height: 15px;
        color: #B3B3B3;
    }

    .product-name {
        font-size: 16px;
        line-height: 135%;
        font-weight: 400
    }

    .attendee-info-card-body .details {
        grid-area: details
    }

    .attendee-info-card-body .type {
        grid-area: type;
    }

    .attendee-info-card-body .qty-pill-section {
        grid-area: qtypill;
        justify-self: end;
        text-align: center;
        display: block;
        width: 100%;
        padding-right: 18px;
    }

    .qty-pill {
        height: 36px
    }

    .attendee-info-card-body .item-price {
        grid-area: price;
        justify-self: end
    }

    .add-attendee-button-wrapper {
        margin: 0 9px 15px
    }

    .alert-full-width-with-margins {
        margin-left: 9px !important;
        margin-right: 9px !important;
        width: calc(100% - 18px) !important
    }

    .attendee-form-card {
        padding: 19px 27px;
        margin-top: 32px !important;
        margin: 9px
    }

    .attnedee-header-divider {
        margin: 11px 21.5px 9px 21.5px !important
    }

    .attendees-info-progress-wrapper {
        margin: 0 9px
    }

    .use-account-info {
        margin-bottom: 40px
    }

    .attendee-form-card .form-two-col {
        gap: 40px !important;
        margin-top: 0;
        padding-top: 19px
    }

        .attendee-form-card .form-two-col .form-col .signup-input:last-child {
            margin-bottom: 0 !important
        }

        .attendee-form-card .form-two-col .form-col .row-two:last-child .signup-input {
            margin-bottom: 0 !important
        }

    .attendee-form-divider {
        margin-top: 38px;
        margin-bottom: 24px
    }

    .dietary-section {
        align-self: flex-start
    }

    .dietary-section-wrapper .signup-input .k-dropdownlist {
        height: 44px !important
    }

    .attendee-form-card .form-col .row-two {
        display: grid;
        grid-template-columns: repeat(2,minmax(0,1fr));
        gap: 9px !important;
        width: 100%
    }

        .attendee-form-card .form-col .row-two > div {
            width: 100%;
            min-width: 0
        }

        .attendee-form-card .form-col .row-two input, .attendee-form-card .form-col .row-two select, .attendee-form-card .form-col .row-two .k-input, .attendee-form-card .form-col .row-two .k-picker, .attendee-form-card .form-col .row-two .k-dropdownlist {
            width: 100% !important;
            box-sizing: border-box
        }

    .item-price > .k-numerictextbox {
        margin: 0px !important;
        width: 100% !important;
    }
}

@media (max-width:768px) {
    .attendee-header-divider {
        margin: 20px 15px
    }

    .session-type-tabs {
        margin: 24px 0
    }

    .shopping-cart-add-attendee-wrapper {
        width: 100% !important;
        max-width: 100% !important;
        overflow: visible !important;
        overflow-x: hidden !important;
        overflow-y: visible !important;
        max-height: none !important;
        height: auto !important;
        padding-right: 0 !important;
    }

    .shopping-cart-step-header-section {
        flex-direction: column;
        align-items: flex-start;
        gap: 23px
    }

    .shopping-cart-step-back-link {
        width: 100%;
        border: 1px solid #B3B3B3;
        border-radius: 4px;
        justify-content: center
    }

        .shopping-cart-step-back-link svg {
            display: none
        }

    .global-default {
        align-items: flex-start;
        margin-bottom: 24px
    }

        .global-default svg {
            width: 16px !important;
            height: 16px !important;
            min-width: 16px !important;
            min-height: 16px !important;
            max-width: 16px !important;
            max-height: 16px !important;
            flex-shrink: 0 !important;
            flex-grow: 0 !important;
            display: inline-block
        }

    .global-success {
        align-items: flex-start;
        margin-bottom: 24px
    }

        .global-success svg {
            width: 16px !important;
            height: 16px !important;
            min-width: 16px !important;
            min-height: 16px !important;
            max-width: 16px !important;
            max-height: 16px !important;
            flex-shrink: 0 !important;
            flex-grow: 0 !important;
            display: inline-block
        }

    .attendee-info-card {
        margin-bottom: 24px
    }

    .attendee-info-card-body {
        padding: 9px
    }

    .attendee-header {
        flex-direction: column;
        height: auto;
        padding-top: 0
    }

    .attendee-icon-wrapper {
        height: 28px !important;
        margin-bottom: 5px
    }

    .attendee-required-msg {
        height: 24px;
        display: flex;
        align-items: center
    }

    .attendee-card {
        height: auto;
        margin: 9px
    }

        .attendee-card > div:first-child, .attendee-card > .d-flex {
            display: flex;
            flex-direction: row !important;
            flex-wrap: wrap;
            align-items: flex-start
        }

    .contact-col, .company-col {
        width: 100%;
        min-width: 100%
    }

    .contact-col {
        order: 1
    }

    .company-col {
        order: 2
    }

    .delete-col {
        order: 3;
        width: calc(100% - 167px);
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 20px;
        height: 47px
    }

    .action-col {
        order: 4;
        display: flex !important;
        flex-direction: row !important;
        margin-top: 22px
    }

    .btn-attendee-action {
        height: 47px;
        width: 79px
    }

    .sticky-continue-wrapper {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        z-index: auto !important;
        margin: 0 !important;
        padding: 20px 0 !important;
    }

        .sticky-continue-wrapper::before {
            display: none !important;
        }

    .shopping-cart-continue-btn {
        width: 100% !important;
        margin: 0 !important;
    }

    .info-box {
        height: auto
    }

    .attendee-form-cancel {
        height: 44px !important;
        width: 100% !important
    }

    .attendee-form-submit {
        height: 44px !important;
        width: 100% !important
    }

    .incomplete-attendee-error-msg {
        align-items: flex-start !important
    }

    .dietary-section-wrapper {
        flex-direction: column;
        gap: 25px
    }

        .dietary-section-wrapper > div:nth-child(2) {
            width: 100%
        }

    .shopping-cart-policies-section::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        right: -100vw;
        width: 100vw;
        background: linear-gradient(180deg,#F9F9F9 0%,#EEFEFF 100%);
        z-index: -1
    }

    .shopping-cart-policies-section::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: -100vw;
        width: 100vw;
        background: linear-gradient(180deg,#F9F9F9 0%,#EEFEFF 100%);
        z-index: -1
    }

    .shopping-cart-policies-content-section {
        overflow: visible !important;
        overflow-x: hidden !important;
        overflow-y: visible !important;
        max-height: none !important;
        height: auto !important;
        margin: 30px 0 0 !important;
        padding-right: 0 !important;
    }

    .shopping-cart-policies-section {
        padding-bottom: 45px
    }

    .attendees-info-toggle-section {
        margin-top: 32px;
        height: 37px;
        margin-bottom: 32px
    }

        .attendees-info-toggle-section.see-attendee-toggle {
            margin-bottom: 9px !important
        }
}

.login-card.reset-password {
    height: 583px !important
}

.reset-password-container {
    padding: 32px
}

.reset-password-title {
    text-align: center;
    font-size: 32px;
    font-weight: 400;
    line-height: 123%;
    color: #2F2F2F;
    margin-bottom: 8px
}

.reset-password-sub-title {
    text-align: center;
    font-size: 16px;
    font-weight: 400;
    line-height: 135%;
    color: #2F2F2F;
    margin-bottom: 50px
}

.reset-password-form-field {
    margin-bottom: 28px
}

    .reset-password-form-field .k-input-inner {
        padding-left: 16px
    }

.reset-password-row {
    display: flex;
    justify-content: end;
    align-items: center;
    margin-top: 30px
}

.reset-password-btn {
    height: 37px;
    width: 165px;
    border-radius: 4px;
    padding: 9px 24px;
    background: #FFD88C;
    font-size: 14px;
    line-height: 100%;
    font-weight: 400;
    color: #2F2F2F;
    border: none
}

    .reset-password-btn:hover {
        background: #FFF4DD
    }

    .reset-password-btn:focus {
        box-shadow: none !important
    }

.disabled-text-color {
    color: #2f2f2f !important
}

    .disabled-text-color.k-textbox.k-disabled {
        color: #2f2f2f !important
    }

@media (max-width:768px) {
    .login-card.reset-password {
        flex-direction: column;
        height: auto !important
    }

    .login-left {
        width: 100%;
        height: auto;
        min-height: 200px;
        order: 1
    }

    .reset-password-container {
        width: 100%;
        padding-top: 35px !important;
        padding: 0;
        order: 2
    }

    .reset-password-title {
        font-size: 32px;
        margin-bottom: 1rem
    }

    .reset-password-sub-title {
        font-size: 16px;
        margin-bottom: 50px
    }

    .reset-password-form-field {
        margin-bottom: 1rem
    }

    .input-wrapper {
        position: relative
    }

    .password-toggle-icon {
        position: absolute;
        right: 20px;
        top: 50%;
        transform: translateY(-50%);
        background: none;
        border: none;
        cursor: pointer
    }

    .reset-password-btn {
        width: 100%
    }
}

.skeleton-animate {
    background: linear-gradient(90deg,#f0f0f0 25%,#e8e8e8 50%,#f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer 1.5s infinite ease-in-out;
    border-radius: 4px
}

@keyframes skeleton-shimmer {
    0% {
        background-position: 200% 0
    }

    100% {
        background-position: -200% 0
    }
}

.skeleton-update-box {
    display: flex;
    gap: 16px;
    padding: 20px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgb(0 0 0 / .1)
}

.software-skeleton-icon {
    width: 60px;
    height: 60px;
    border-radius: 8px
}

.skeleton-content {
    flex: 1
}

.software-skeleton-title {
    height: 24px;
    width: 200px;
    margin-bottom: 12px
}

.skeleton-body {
    height: 16px;
    width: 100%;
    margin-bottom: 8px
}

.skeleton-body-short {
    height: 16px;
    width: 70%
}

.skeleton-heading {
    height: 32px;
    width: 250px;
    margin-bottom: 12px
}

.skeleton-paragraph {
    height: 20px;
    width: 400px;
    margin-bottom: 24px
}

.software-skeleton-card {
    background: #fff;
    padding: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 280px
}

.skeleton-tool-icon {
    width: 58px;
    height: 58px;
    margin-bottom: 12px
}

.skeleton-tool-name {
    height: 20px;
    width: 60px
}

.skeleton-section-label {
    height: 18px;
    width: 100px;
    margin-bottom: 8px
}

.skeleton-headline {
    height: 36px;
    width: 300px;
    margin-bottom: 16px
}

.skeleton-benefit-card {
    padding: 20px;
    background: #fff;
    border-radius: 8px
}

.skeleton-benefit-title {
    height: 24px;
    width: 150px;
    margin-bottom: 16px
}

.skeleton-benefit-desc {
    height: 16px;
    width: 100%;
    margin-bottom: 8px
}

.skeleton-benefit-desc-short {
    height: 16px;
    width: 80%
}

.skeleton-filter-headline {
    height: 36px;
    width: 280px;
    margin-bottom: 12px
}

.skeleton-filter-subtitle {
    height: 20px;
    width: 350px;
    margin-bottom: 20px
}

.skeleton-filter-btn {
    height: 40px;
    width: 120px;
    display: inline-block;
    margin-right: 12px;
    margin-bottom: 12px
}

.skeleton-software-card {
    padding: 20px;
    background: #fff;
    border-radius: 8px
}

.skeleton-card-title {
    height: 20px;
    width: 120px
}

.skeleton-card-logo {
    height: 61px;
    width: 61px;
    margin-left: auto
}

.skeleton-category-tag {
    height: 32px;
    width: 100px;
    margin: 12px 0
}

.skeleton-card-desc {
    height: 60px;
    width: 100%;
    margin-bottom: 8px
}

.skeleton-card-desc-short {
    height: 16px;
    width: 60%;
    margin-bottom: 16px
}

.skeleton-learn-btn {
    height: 40px;
    width: 120px
}

.critical-update-section {
    margin-top: 72px;
    width: 100%;
    min-height: 120px;
    margin-bottom: 83px
}

.critical-update-carousel .k-scrollview-nav {
    display: none !important
}

.critical-update-carousel .k-scrollview-elements {
    display: none !important
}

.critical-update-carousel {
    border: none;
    height: 167px;
    min-height: 140px
}

.update-box {
    position: relative;
    display: grid;
    grid-template-columns: 56px 1fr;
    align-items: center;
    border-radius: 10px;
    background: #FFF6E6;
    gap: 4px;
    min-height: 93px
}

.update-icon {
    background: #FFD88C;
    width: 60px;
    height: 100%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px 0 0 10px
}

    .update-icon img {
        width: 40px !important;
        height: 40px !important;
        aspect-ratio: 1 /1
    }

.update-content {
    flex: 1;
    padding: 20px 20px 20px 25px
}

    .update-content a {
        font-weight: 600
    }

.update-title {
    font-size: 16px;
    line-height: 100%;
    color: #414142;
    text-transform: uppercase;
    letter-spacing: 1.6px;
    font-weight: 400;
    display: block;
    margin-bottom: 18px;
    margin-top: 0
}

.update-body {
    margin: 0;
    font-size: 14px;
    line-height: 19px;
    font-weight: 400;
    color: #414142;
    text-wrap: auto;
    gap: 10px;
    display: flex;
    flex-direction: column
}

    .update-body p {
        margin-bottom: 0;
        margin-top: 0
    }

    .update-body a {
        color: #414142
    }

.alert-card__footer {
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px
}

.footer-arrow {
    border: none;
    background: none;
    padding: 0;
    cursor: pointer;
}

.footer-count {
    font-size: 14px;
    font-weight: 400;
    line-height: 180%;
    color: #2F2F2F
}

.tools h2 {
    font-size: 40px;
    line-height: 100%;
    font-weight: 400;
    color: #2F2F2F;
    margin-bottom: 20px;
    margin-top: 72px;
    height: 48px;
    display: flex;
    align-items: center
}

.tools .tools-description {
    font-size: 14px;
    line-height: 19px;
    font-weight: 400;
    color: #2F2F2F
}

.software-category-wrapper {
    display: flex;
    align-items: center;
    gap: 32px;
    margin-bottom: 43px
}

.breeze-logo-wrapper {
    margin: 27px 0
}

.software-categories {
    display: grid;
    grid-template-columns: repeat(6,1fr);
    gap: 24px;
    margin-bottom: 72px
}

.software-category-card {
    height: 192px;
    width: 100%;
    border-radius: 10px;
    padding: 39px 11px;
    background: #F4F4F4;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 37px
}

    .software-category-card.selected {
        background-color: #FFD88C;
        border-radius: 10px
    }

    .software-category-card a {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-decoration: none
    }

        .software-category-card a img {
            width: 58px;
            height: 58px;
            margin-bottom: 37px
        }

.software-category-name {
    font-size: 16px;
    line-height: 120%;
    font-weight: 400;
    color: #2F2F2F
}

@media (max-width:992px) {
    .software-categories {
        grid-template-columns: 1fr !important;
        margin-bottom: 0px !important
    }
}

@media (max-width:576px) {
    .software-categories {
        grid-template-columns: 1fr;
        margin-bottom: 0;
        gap: 10px
    }
}

.tool {
    border: 1px solid #ddd;
    padding: 15px
}

    .tool.active {
        background: #f4b84a;
        color: #fff
    }

.benefits-section {
    margin-top: 72px;
    margin-bottom: 20px;
    font-size: 16px;
    text-transform: uppercase;
    font-size: 16px;
    line-height: 100%;
    font-weight: 400;
    letter-spacing: 1.6px;
    color: #2F2F2F;
    justify-content: center;
    display: flex
}

.benefits-section-title {
    font-size: 40px;
    line-height: 100%;
    font-weight: 400;
    color: #1E1E1E;
    text-align: center;
    margin-bottom: 36px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center
}

.section-divider {
    position: relative;
    width: 100%;
    height: 1px;
    background-color: #B2B2B2;
    margin-top: 0;
    margin-bottom: 32px
}

    .section-divider::before {
        content: "";
        position: absolute;
        top: -8px;
        left: 50%;
        transform: translateX(-50%);
        width: 172px;
        height: 8px;
        background: linear-gradient(90deg,#005E71 0%,#001E60 100%)
    }

.benefits-grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 10px;
    margin-bottom: 72px
}

.benefit-card {
    border: 1px solid #B3B3B3;
    border-radius: 6px;
    padding: 20px 32px;
    height: 100%;
    width: 100%;
    box-sizing: border-box;
    background: #fff;
    display: flex;
    flex-direction: column;
}

    .benefit-card a {
        color: #414142
    }

    .benefit-card h3 {
        margin: 0 0 16px 0;
        font-size: 20px;
        font-weight: 600;
        line-height: 150%;
        color: #2F2F2F
    }

    .benefit-card div {
        margin: 0;
        font-size: 14px;
        font-weight: 400;
        color: #2F2F2F;
        line-height: 150%;
        overflow: hidden;
        flex: 1 1 auto;
    }

.service-learn-more-btn {
    background: transparent;
    border: none;
    color: #414142;
    cursor: pointer;
    padding: 0;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    margin-top: 16px;
    display: flex;
    align-items: center;
    gap: 10px;
    height: 40px;
}

.software-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 32px;
    height: 60px
}

@media (max-width:992px) {
    .benefits-grid {
        grid-template-columns: repeat(2,1fr);
        gap: 20px
    }
}

@media (max-width:768px) {
    .software-category-wrapper {
        flex-direction: column
    }

    .benefits-grid {
        grid-template-columns: 1fr;
        gap: 24px;
        margin-bottom: 89px
    }

    .benefit-card {
        padding: 27px 32px
    }

    .benefits-section {
        margin-top: 109px
    }

    .benefits-section-title {
        height: auto;
        font-size: 32px
    }

    .section-divider {
        margin-bottom: 62px
    }

    .filter-headline {
        height: auto !important;
        margin-top: 85px !important
    }

    .filter-buttons {
        flex-wrap: wrap;
        margin-bottom: 57px
    }

    .software-card {
        padding: 28px 20px 16px 20px !important
    }

    .service-card h3 {
        height: auto !important;
        align-items: flex-start !important
    }

    .software-card-header {
        margin-bottom: 32px
    }

    .software-description {
        margin-bottom: 44px !important
    }

    .category-tag {
        margin-bottom: 29px !important
    }
}

@media (max-width:576px) {
    .benefits-grid {
        grid-template-columns: 1fr;
        gap: 24px;
        margin-bottom: 89px
    }

    .benefits-section {
        margin-top: 109px
    }

    .benefits-section-title {
        height: auto;
        font-size: 32px
    }

    .section-divider {
        margin-bottom: 62px
    }

    .filter-headline {
        height: auto !important;
        margin-top: 85px !important
    }

    .filter-buttons {
        flex-wrap: wrap;
        margin-bottom: 57px !important
    }

    .critical-update-section {
        margin-bottom: 0px !important;
        min-height: 120px
    }

    .carousel-hidden {
        opacity: 0;
        visibility: hidden
    }

    .carousel-visible {
        opacity: 1;
        transition: opacity 0.2s ease-in;
        display: block
    }

    .software-card {
        padding: 28px 20px 16px 20px !important
    }
}

.software-product-filter-wrapper {
    position: relative;
    background: linear-gradient(180deg,#F9F9F9 0%,#EEFEFF 100%)
}

    .software-product-filter-wrapper::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: -100vw;
        width: 100vw;
        background: linear-gradient(180deg,#F9F9F9 0%,#EEFEFF 100%)
    }

    .software-product-filter-wrapper::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        right: -100vw;
        width: 100vw;
        background: linear-gradient(180deg,#F9F9F9 0%,#EEFEFF 100%)
    }

.filter-headline {
    margin-top: 72px;
    font-size: 40px;
    line-height: 100%;
    font-weight: 400;
    color: #2F2F2F;
    margin-bottom: 20px;
    height: 48px;
    display: flex;
    align-items: center
}

.filter-subtitle {
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    color: #2F2F2F;
    margin-bottom: 32px
}

    .filter-subtitle p {
        margin-bottom: 0
    }

.filter-buttons {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 55px
}

.filter-btn {
    height: 30px;
    border-radius: 32px;
    padding: 5px 20px;
    border: 1px solid #B3B3B3;
    background: #fff0;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #2F2F2F;
    cursor: pointer
}

    .filter-btn.filter-active {
        background: #FFD88C;
        border: none
    }

.software-card {
    background: #fff;
    border-radius: 4px;
    padding: 32px 15px;
    height: 100%;
    display: flex;
    flex-direction: column;
    border: 1px solid #BBE4FF
}

.mb-32 {
    margin-bottom: 32px !important
}

.software-grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 10px;
    margin-bottom: 55px;
    padding: 0
}

@media (max-width:992px) {
    .software-grid {
        grid-template-columns: repeat(3,1fr)
    }
}

@media (max-width:768px) {
    .software-grid {
        grid-template-columns: repeat(2,1fr)
    }

    .critical-update-carousel {
        height: 410px
    }

    .critical-update-section {
        margin-bottom: 0px !important
    }

    .tools {
        width: 100% !important;
        min-height: 700px
    }

        .tools h4 {
            height: max-content;
            margin-bottom: 15px;
            margin-top: 43px;
            font-size: 32px
        }

    .software-category-card {
        height: 88px;
        padding: 15px;
        flex-direction: row;
    }

    .software-category-name {
        width: 150px;
        text-align: center
    }

    .software-category-card a {
        flex-direction: row;
        gap: 37px
    }

        .software-category-card a img {
            margin-bottom: 0px !important
        }
}

@media (max-width:480px) {
    .software-grid {
        grid-template-columns: 1fr;
        gap: 20px
    }
}

.software-tool-name {
    font-size: 20px;
    line-height: 150%;
    font-weight: 400;
    color: #414142;
    margin-bottom: 0;
    margin-top: 0
}

.software-card img {
    width: 61px;
    height: 61px;
    aspect-ratio: 1/1;
    object-fit: contain
}

.category-tag {
    height: 32px;
    border-radius: 40px;
    background: #F4F4F4;
    padding: 9px 24px;
    margin-bottom: 32px;
    display: flex;
    width: max-content;
    align-items: center;
    font-size: 12px;
    line-height: 15px;
    font-weight: 400;
    color: #2F2F2F;
    justify-content: center
}

.software-description {
    font-size: 12px;
    line-height: 15px;
    font-weight: 400;
    color: #6D7280;
    margin-bottom: 32px;
    min-height: 80px
}

    .software-description p {
        margin-bottom: 0
    }

.learn-more-btn {
    margin-top: auto !important;
    width: 100%;
    height: 40px;
    border: 1px solid #707070;
    padding: 10px 20px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 14px;
    font-weight: 400;
    line-height: 23px;
    color: #414142;
    background: #fff;
    text-decoration: none;
    cursor: pointer;
}

    .learn-more-btn:hover {
        border: none;
        background: #FFD88C
    }

.k-scrollview {
    margin: 0 auto
}

.image-with-text {
    position: relative
}

    .image-with-text > p {
        position: absolute;
        top: 1rem;
        left: 1.6rem;
        color: rgb(255 255 255 / .8);
        margin: 0;
        font-style: italic;
        text-shadow: 1px 1px 2px rgb(0 0 0 / .8)
    }

.software-tab-desktop-only {
    display: block
}

.software-tabs-dropdown-mobile-only {
    display: none
}

.software-detail-page {
    font-family: Arial,Helvetica,sans-serif;
    background: #fff
}

.software-details-content-section {
    margin-top: 32px;
    width: 100%
}

.product-section {
    display: flex;
    justify-content: space-between;
    gap: 47px;
    margin-bottom: 57px;
    margin-top: 72px
}

.product-text {
    flex: 1
}

    .product-text h1 {
        font-size: 40px;
        font-weight: 400;
        color: #2F2F2F;
        margin: 0 0 20px 0;
        line-height: 100%;
        margin-top: 51px
    }

    .product-text .software-subtitle {
        color: #2F2F2F;
        font-size: 14px;
        line-height: 19px;
        font-weight: 400;
        margin-bottom: 47px
    }

.edition-price-wrapper {
    display: flex;
    align-items: flex-start;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
    width: fit-content;
    max-width: 100%;
    margin-bottom: 8px
}

.edition-price-label {
    background: #F4F4F4;
    width: 187px;
    min-width: 187px;
    flex-shrink: 0;
    padding: 19px 15px 18px 32px;
    text-align: center;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: stretch
}

    .edition-price-label span {
        font-weight: 400;
        color: #2F2F2F;
        text-transform: uppercase;
        font-size: 16px;
        line-height: 100%;
        letter-spacing: 1.6px
    }

.edition-details-grid {
    display: grid;
    grid-template-columns: repeat(4,200px);
    background: #fff;
    flex: 1;
    min-width: 0
}

.edition-detail-item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 15px;
    background: #fff;
    box-sizing: border-box;
    min-height: 56px
}

    .edition-detail-item:nth-child(4n) {
        border-right: none
    }

    .edition-detail-item:nth-last-child(-n+4) {
        border-bottom: none
    }

    .edition-detail-item .edition-name {
        font-size: 14px;
        font-weight: 400;
        line-height: 19px;
        color: #2F2F2F;
        margin-bottom: 5px
    }

    .edition-detail-item .edition-price {
        font-size: 16px;
        line-height: 135%;
        font-weight: 600;
        color: #2F2F2F
    }

.comparison-link {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end
}

    .comparison-link .comparison-link-btn {
        display: flex;
        align-items: center;
        color: #2f2f2f;
        text-decoration: underline;
        font-size: 14px;
        line-height: 19px;
        font-weight: 400;
        border: none;
        background: #fff0
    }

        .comparison-link .comparison-link-btn:hover {
            font-weight: 600
        }

@media (min-width:993px) {
    .edition-details-grid {
        grid-template-columns: repeat(4,200px)
    }

    .edition-detail-item:nth-child(4n) {
        border-right: none
    }

    .edition-detail-item:nth-last-child(-n+4) {
        border-bottom: none
    }
}

@media (min-width:769px) and (max-width:992px) {
    .edition-details-grid {
        grid-template-columns: repeat(3,200px)
    }

    .edition-detail-item:nth-child(4n) {
        border-right: 1px solid #e0e0e0
    }

    .edition-detail-item:nth-child(3n) {
        border-right: none
    }

    .edition-detail-item:nth-last-child(-n+3) {
        border-bottom: none
    }
}

@media (min-width:481px) and (max-width:768px) {
    .edition-details-grid {
        grid-template-columns: repeat(2,200px)
    }

    .edition-detail-item:nth-child(4n), .edition-detail-item:nth-child(3n) {
        border-right: 1px solid #e0e0e0
    }

    .edition-detail-item:nth-child(2n) {
        border-right: none
    }

    .edition-detail-item:nth-last-child(-n+2) {
        border-bottom: none
    }
}

@media (max-width:480px) {
    .edition-price-wrapper {
        flex-direction: column;
        width: 100%
    }

    .edition-price-label {
        width: 100%;
        min-width: 100%;
        border-right: none;
        min-height: 60px;
        align-self: auto
    }

    .edition-details-grid {
        grid-template-columns: 1fr;
        width: 100%
    }

    .edition-detail-item {
        border-right: none;
        border-bottom: 1px solid #e0e0e0;
        width: 100%;
        min-height: 80px;
        padding: 20px 15px
    }

        .edition-detail-item:last-child {
            border-bottom: none
        }

        .edition-detail-item:nth-child(4n), .edition-detail-item:nth-child(3n), .edition-detail-item:nth-child(2n) {
            border-right: none
        }
}

@media (max-width:768px) {
    .edition-price-wrapper {
        flex-direction: row;
        width: 100%;
        margin-bottom: 10px !important
    }

    .edition-price-label {
        width: 84px;
        min-width: 84px;
        padding: 12px;
        height: auto;
        align-self: stretch;
    }

        .edition-price-label span {
            font-size: 16px;
            writing-mode: horizontal-tb;
            letter-spacing: 2px
        }

    .edition-details-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
        width: 100%
    }

    .edition-detail-item {
        padding: 12px;
        min-height: auto
    }

    .edition-name {
        font-size: 13px
    }

    .edition-price {
        font-size: 15px
    }

    .edition-detail-item:nth-child(4n), .edition-detail-item:nth-last-child(-n+4) {
        border: none
    }
}

@media (max-width:360px) {
    .edition-price-label {
        padding: 15px 10px
    }

        .edition-price-label span {
            font-size: 14px
        }

    .edition-detail-item {
        padding: 15px 10px
    }

        .edition-detail-item .edition-name {
            font-size: 13px
        }

        .edition-detail-item .edition-price {
            font-size: 15px
        }
}

.price-card {
    width: 284px;
    height: 382px;
    padding: 25px;
    background: #F4F4F4;
    border-radius: 4px 4px 0 0;
    flex-shrink: 0
}

.price-card-header {
    font-size: 16px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 1.6px;
    line-height: 100%;
    color: #1E1E1E;
    margin-bottom: 10px;
    height: 26px;
    display: flex
}

.price-card-subtext {
    font-size: 12px;
    color: #1E1E1E;
    margin-bottom: 26px;
    line-height: 15px;
    font-weight: 400
}

.software-bundle-dropdown {
    height: 36px;
    border: none;
    border-bottom: 1px solid #1D1B2070;
    border-radius: 0;
    font-size: 14px;
    margin-bottom: 26px;
    background: #fff0
}

    .software-bundle-dropdown .k-input-inner {
        padding-left: 16px
    }

    .software-bundle-dropdown:hover {
        background: #fff0
    }

.custom-dropdown-popup, .custom-dropdown-popup *, .custom-dropdown-popup .k-list, .custom-dropdown-popup .k-list-item, .custom-dropdown-popup .k-list-container, .custom-dropdown-popup .k-popup, .custom-dropdown-popup .k-animation-container {
    margin: 0 !important;
    padding: 0 !important;
    text-indent: 0 !important;
    list-style: none !important
}

.custom-dropdown-popup {
    border: 1px solid #ccc !important;
    border-radius: 0 !important;
    box-shadow: 0 2px 4px rgb(0 0 0 / .1) !important;
    width: 234px;
    z-index: 2;
}

    .custom-dropdown-popup .k-list {
        width: 100% !important;
        background: white !important
    }

    .custom-dropdown-popup .k-list-item {
        width: 100% !important;
        box-sizing: border-box !important;
        position: relative !important;
        padding-left: 25px !important
    }

.dropdown-group-header {
    background: #767676 !important;
    color: white !important;
    font-weight: 400 !important;
    font-size: 10px !important;
    line-height: 15px !important;
    text-align: center !important;
    pointer-events: none !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: block !important;
    position: relative !important;
    margin: 0 !important;
    padding: 8px 0 !important;
    left: 0 !important;
    right: 0 !important;
    text-indent: 0 !important;
    text-align: center !important;
    border: none !important;
    outline: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important
}

.dropdown-item-content {
    background: white !important;
    transition: background-color 0.2s ease !important;
    cursor: pointer !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: block !important;
    position: relative !important;
    padding: 10px 25px !important;
    margin: 0 !important;
    left: 0 !important;
    right: 0 !important
}

.custom-dropdown-popup .k-list-item:hover .dropdown-item-content {
    background: #f0f0f0 !important
}

.custom-dropdown-popup .k-list-item.k-selected .dropdown-item-content {
    background: #FFD88C !important
}

.item-title {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #2F2F2F !important;
    line-height: 19px !important;
    margin-bottom: 4px !important;
    width: 100% !important;
    margin-left: 0 !important;
    text-indent: 0 !important;
    padding-left: 25px !important;
    padding-right: 25px !important
}

.software-details-item-price {
    font-size: 12px !important;
    color: #767676 !important;
    line-height: 15px !important;
    font-weight: 400 !important;
    width: 100% !important;
    text-align: left !important;
    margin-left: 0 !important;
    text-indent: 0 !important;
    padding-left: 25px !important;
    padding-right: 25px !important
}

.custom-dropdown-popup .k-list-container {
    width: 234px !important
}

.custom-dropdown-popup ul {
    list-style: none !important;
    padding-left: 0 !important;
    margin-left: 0 !important
}

.custom-dropdown-popup li {
    list-style: none !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
    text-indent: 0 !important
}

.custom-dropdown-popup .k-list-item[class*="k-"] {
    padding-left: 0 !important;
    margin-left: 0 !important
}

.custom-dropdown-popup .k-list-item > * {
    margin-left: 0 !important;
    padding-left: 0 !important;
    text-indent: 0 !important
}

.custom-dropdown-popup .k-list-item:has(.dropdown-group-header) {
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important
}

.custom-dropdown-popup .k-popup {
    padding: 0 !important;
    margin: 0 !important
}

.k-animation-container:has(.custom-dropdown-popup) {
    padding: 0 !important;
    margin: 0 !important
}

.dropdown-group-header {
    position: static !important;
    transform: none !important
}

.dropdown-item-content {
    position: static !important;
    transform: none !important
}

@media (max-width:768px) {
    .k-animation-container {
        max-width: none !important;
        overflow: visible !important
    }

        .k-animation-container > .custom-dropdown-popup {
            width: 100% !important;
            min-width: 100% !important;
            max-width: 100% !important;
            box-sizing: border-box !important;
            margin: 0 !important
        }

    .custom-dropdown-popup .k-list-container {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important
    }

    .custom-dropdown-popup .k-list {
        width: 100% !important
    }

    .custom-dropdown-popup .k-list-item {
        width: 100% !important;
        padding: 0 !important
    }
}

.price-row {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 25px;
    justify-content: space-between
}

.quantity-selector {
    display: flex;
    align-items: center;
    gap: 5px
}

.quantity-dropdown {
    width: 46px !important;
    border: none;
    border-bottom: 1px solid #000;
    border-radius: 0
}

    .quantity-dropdown:hover {
        background: transparent !important
    }

    .quantity-dropdown .k-input-inner {
        font-size: 14px !important;
        padding: 0px !important;
        text-align: center !important
    }

    .quantity-dropdown .k-input-button {
        width: 20px !important
    }

    .quantity-dropdown .k-svg-icon {
        color: #666 !important
    }

    .quantity-dropdown .k-input-inner:focus {
        border-bottom: 2px solid #007bff !important;
        outline: none !important;
        box-shadow: none !important
    }

    .quantity-dropdown:hover .k-input-inner {
        border-bottom-color: #007bff !important
    }

    .quantity-dropdown .k-picker-wrap {
        border: none !important;
        border-radius: 0 !important;
        background: transparent !important
    }

    .quantity-dropdown .k-picker {
        border: none !important;
        border-radius: 0 !important;
        background: transparent !important
    }

.price-display {
    display: flex;
    align-items: baseline;
    gap: 8px
}

.current-price {
    font-size: 40px;
    font-weight: 400;
    color: #1E1E1E;
    line-height: 100%;
    height: 48px;
    display: flex;
    align-items: center
}

.original-price {
    font-size: 16px;
    color: #B3B3B3;
    line-height: 120%;
    text-decoration: line-through;
    font-weight: 400;
    line-height: 1
}

.editions-section {
    margin-bottom: 72px
}

.add-to-cart-btn {
    width: 100%;
    height: 37px;
    padding: 10px 84px;
    background: #fff !important;
    border: 1px solid #B3B3B3;
    border-radius: 4px;
    font-size: 14px;
    line-height: 19px;
    font-weight: 400;
    color: #2F2F2F;
    cursor: pointer;
    margin-bottom: 16px;
    transition: background 0.2s
}

    .add-to-cart-btn:focus {
        box-shadow: none !important
    }

.buy-btn {
    width: 100%;
    height: 37px;
    padding: 10px 92px;
    background: #FFD88C;
    border: none;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    color: #2F2F2F;
    cursor: pointer;
    transition: background 0.2s
}

    .buy-btn:focus {
        box-shadow: none !important
    }

    .buy-btn:hover {
        background: #FFF4DD
    }

.recent-updates-description p {
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    color: #2F2F2F;
    margin-top: 0
}

.recent-updates-title {
    font-size: 16px;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 1.6px;
    color: #2F2F2F;
    text-transform: uppercase
}

.recent-update-summary {
    margin-top: 18px;
    margin-bottom: 72px
}

.recent-update-summery-content {
    background: #f4f4f4;
    padding: 17px 23px 17px 22px;
    display: flex;
    border-radius: 6px;
    align-items: center;
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    color: #2F2F2F;
    margin-bottom: 15px
}

    .recent-update-summery-content p {
        margin-bottom: 0
    }

.no-data-message {
    padding: 80px;
    text-align: center;
    color: #2f2f2f
}

    .no-data-message p {
        margin-bottom: 0
    }

.accordion {
    margin-top: 72px
}

.accordion-button {
    font-size: 18px !important;
    line-height: 150% !important;
    font-weight: 600 !important;
    color: #2F2F2F !important;
    height: 67px;
    padding: 20px 32px !important
}

    .accordion-button::after {
        display: none !important
    }

.custom-accordion-icon {
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    transition: transform 0.2s ease-in-out
}

.accordion-button.collapsed .custom-accordion-icon {
    transform: translateY(-50%) rotate(0deg)
}

.accordion-button:not(.collapsed) .custom-accordion-icon {
    transform: translateY(-50%) rotate(-180deg)
}

.accordion-button.collapsed .custom-accordion-icon svg path {
    stroke: #1E1E1E !important
}

.accordion-button:not(.collapsed) .custom-accordion-icon svg path {
    stroke: #FFD88C !important
}

.accordion-item {
    border: none !important;
    border-bottom: 1px solid #B3B3B3 !important;
    margin-bottom: 0 !important;
    border-radius: 0px !important
}

.accordion-header {
    height: auto !important;
    margin: 0px !important
}

.accordion-button:not(.collapsed) {
    font-size: 18px !important;
    line-height: 150% !important;
    font-weight: 600 !important;
    color: #2F2F2F !important;
    background: white !important;
    border-bottom: none !important
}

.accordion-button:focus {
    box-shadow: none !important
}

.accordion-body {
    background: #f4f4f4 !important;
    font-size: 16px !important;
    line-height: 135%;
    font-weight: 400;
    color: #6D7280 !important;
    padding: 20px 32px !important
}

@media (max-width:768px) {
    .accordion-body li {
        margin-left: 18px !important
    }

    .editions-section .accordion-item h2, .accordion-item h2 {
        margin-top: 0px !important
    }
}

.accordion-body p {
    margin-bottom: 0
}

.accordion-item:not(:last-child) {
    border-bottom: 1px solid #b3b3b3 !important
}

.accordion-collapse {
    border-bottom: none !important
}

.accordion-item .accordion-collapse.collapsing {
    border-bottom: 1px solid #f4f4f4 !important
}

.accordion-item:has(.accordion-collapse.show) {
    border-bottom: 1px solid #f4f4f4 !important
}

.accordion-item[aria-expanded="true"] {
    border-bottom: 1px solid #f4f4f4 !important
}

.accordion-button:not(.collapsed) {
    font-size: 18px !important;
    line-height: 150% !important;
    font-weight: 600 !important;
    color: #2F2F2F !important;
    background: white !important;
    border-bottom: none !important
}

.accordion-button:focus {
    box-shadow: none !important
}

.faq-title {
    font-size: 32px;
    line-height: 123%;
    font-weight: 400;
    color: #2f2f2f;
    margin-top: 72px;
    margin-bottom: 30px;
    height: 39px;
    display: flex;
    align-items: center
}

.faq-subtitle p {
    font-size: 14px;
    line-height: 19px;
    font-weight: 400;
    color: #2f2f2f;
    margin-bottom: 42px;
    margin-top: 0
}

.faq-accordion {
    margin-top: 0px !important
}

    .faq-accordion .accordion-item {
        border: 1px solid #F4F4F4 !important;
        margin-bottom: .5rem
    }

    .faq-accordion .accordion-button {
        border: none;
        color: #212529;
        display: flex;
        align-items: center
    }

        .faq-accordion .accordion-button p {
            margin-bottom: 0
        }

        .faq-accordion .accordion-button:not(.collapsed) {
            background-color: #FFF4DD !important;
            color: #0c63e4;
            border-color: #86b7fe
        }

        .faq-accordion .accordion-button:focus {
            z-index: 3;
            border-color: #86b7fe;
            outline: 0;
            box-shadow: 0 0 0 .25rem rgb(13 110 253 / .25)
        }

    .faq-accordion .accordion-body p {
        margin-bottom: 0px !important
    }

.tabs-navigation {
    display: flex;
    align-items: center;
    margin-bottom: 0;
    height: 40px
}

.tab-nav-arrow {
    background: none;
    border: none;
    padding: 8px;
    cursor: pointer;
    height: 40px;
    width: 40px;
    color: #2F2F2F;
    transition: background 0.2s;
    display: flex;
    align-items: center;
    justify-content: center
}

    .tab-nav-arrow svg {
        height: 16px !important;
        width: 16px !important;
        flex-shrink: 0;
        display: block
    }

    .tab-nav-arrow:hover:not(:disabled) {
        background: #e0e0e0
    }

    .tab-nav-arrow:disabled {
        opacity: .5;
        color: #767676;
        cursor: not-allowed
    }

.tabs-container {
    display: flex;
    flex-direction: row;
    flex: 1;
    overflow-x: auto;
    gap: 0;
    align-items: center
}

.tab-item {
    padding: 10px 16px;
    cursor: pointer;
    height: 37px;
    width: 179px;
    font-size: 14px;
    line-height: 19px;
    font-weight: 400;
    color: #767676;
    text-align: center;
    transition: all 0.2s;
    white-space: nowrap;
    background: #fff0;
    border: none
}

    .tab-item.active {
        color: #2F2F2F;
        background: #F4F4F4;
        font-weight: 400
    }

.tab-content {
    display: none
}

    .tab-content.active {
        display: block
    }

.editions-section h2, .editions-section h3 {
    font-size: 32px;
    font-weight: 400;
    line-height: 123%;
    color: #2F2F2F;
    margin: 72px 0 20px 0
}

.editions-subtitle {
    color: #2F2F2F;
    font-size: 14px;
    font-weight: 400;
    line-height: 100%;
    margin-bottom: 41px;
    margin-top: 0
}

.table {
    width: 100%;
    border-collapse: collapse
}

    .table th {
        background: #333;
        color: #fff;
        padding: 12px 15px;
        text-align: left;
        font-weight: 500
    }

    .table td {
        border: 1px solid #e0e0e0;
        padding: 12px 15px
    }

    .table .section-header td {
        background: #f5f5f5;
        font-weight: 600
    }

    .table .feature-cell {
        width: 50%
    }

    .table .edition-cell {
        text-align: center
    }

.resources {
    display: flex;
    justify-content: space-between;
    margin-top: 40px;
    gap: 40px
}

.resource-card {
    display: flex;
    margin-bottom: 15px
}

    .resource-card img {
        width: 60px;
        height: 60px;
        margin-right: 15px;
        object-fit: cover
    }

    .resource-card b {
        display: block;
        margin-bottom: 5px
    }

    .resource-card p {
        margin: 0;
        font-size: 14px;
        color: #666
    }

.software-services {
    margin-top: 72px
}

    .software-services h2 {
        font-size: 32px;
        line-height: 123%;
        font-weight: 400;
        color: #2f2f2f;
        margin-bottom: 20px
    }

.services-description p {
    font-size: 14px;
    line-height: 19px;
    font-weight: 400;
    color: #2f2f2f;
    margin-top: 0
}

.recent-update-summery-content p:last-child {
    margin-bottom: 0px !important;
    margin-top: 0
}

@media (max-width:768px) {
    .update-box {
        grid-template-columns: 42px 1fr !important;
        gap: 0px !important
    }

    .update-content {
        padding: 34px 9px 41px 15px !important
    }

    .update-icon {
        width: 42px !important
    }

    .product-text h2 {
        margin-bottom: 37px !important;
        margin-top: 32px !important
    }

    .editions-subtitle {
        margin-bottom: 48px !important
    }

    .recent-updates-description p {
        margin-bottom: 35px !important;
        margin-top: 0
    }

    .recent-update-summary {
        margin-top: 35px !important
    }

    .recent-update-summery-content {
        padding: 10px !important
    }

    .software-services {
        margin-top: 52px !important
    }

    .services-grid {
        grid-template-columns: 1fr !important
    }

    .gallery-grid {
        grid-template-columns: 1fr !important;
        margin-top: 52px !important
    }

    .china-pricing-box {
        flex-direction: column;
        justify-content: center !important;
        height: max-content !important
    }

    .china-left h3 {
        margin-top: 0px !important
    }

    .china-right {
        flex-direction: column;
        margin-top: 66px;
        width: 100%
    }

        .china-pricing-box .china-right a, .china-right a {
            width: 100% !important
        }

    .have-questions-section-grid {
        grid-template-columns: 1fr !important
    }

    .software-tab-desktop-only {
        display: none
    }

    .software-tabs-dropdown-mobile-only {
        display: block;
    }

    .featured-video {
        grid-template-columns: 1fr !important
    }

    .tab-dropdown {
        width: 100%;
        padding: 10px 20px;
        font-size: 16px;
        border-radius: 4px;
        background: #F4F4F4;
        border-color: #F4F4F4;
        height: 48px
    }

        .tab-dropdown .k-input-button .k-svg-icon svg {
            display: none !important
        }

        .tab-dropdown .k-input-button .k-svg-icon {
            background: none !important;
            width: 20px;
            height: 20px
        }

            .tab-dropdown .k-input-button .k-svg-icon::before {
                content: "";
                display: block;
                width: 20px;
                height: 20px;
                background-image: url("data:image/svg+xml, %3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%232F2F2F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
                background-repeat: no-repeat;
                background-position: center;
                background-size: contain;
                transition: transform 0.2s ease
            }

        .tab-dropdown .k-input-button:hover {
            background: #fff0
        }

        .tab-dropdown .k-input-button {
            display: inline-flex !important;
            border-left: none;
            width: 40px;
            align-items: center;
            justify-content: center
        }

    .price-card {
        width: 100% !important;
        height: 367px !important
    }

    .product-section {
        margin-top: 32px !important;
        flex-direction: column;
        gap: 64px !important
    }

    .editions-section h2, .editions-section h3 {
        margin-top: 48px !important
    }

    .contact-us-section {
        margin-top: 124px
    }

    .contact-btn {
        width: 100% !important
    }

    .china-left h3 {
        margin-top: 0px !important
    }
}

.services-grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 20px
}

.service-card {
    background: #f4f4f4;
    border-radius: 6px;
    padding: 32px
}

    .service-card h3 {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 23px;
        font-size: 20px;
        line-height: 20px;
        height: 30px;
        color: #414142;
        margin-top: 0
    }

    .service-card p {
        font-size: 14px;
        font-weight: 400;
        line-height: 19px;
        color: #2f2f2f;
        margin-bottom: 0;
        margin-top: 0
    }

.arrow {
    font-size: 18px
}

.gallery-grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 20px;
    margin-top: 72px
}

.gallery-item {
    background: rgb(0 0 0 / .2);
    display: flex;
    align-items: center
}

    .gallery-item img {
        width: 100%
    }

.contact-us-section {
    margin-top: 72px
}

.top-section {
    align-items: center
}

    .top-section h2 {
        height: 39px;
        font-size: 32px;
        font-weight: 400;
        line-height: 123%;
        color: #2f2f2f;
        margin-bottom: 21px
    }

.intro-text p {
    margin-bottom: 19px;
    margin-top: 0;
    font-weight: 400;
    font-size: 14px;
    line-height: 19px;
    color: #2f2f2f
}

.right-info h3 {
    font-weight: 400;
    font-size: 20px;
    line-height: 28px;
    color: #2f2f2f;
    margin-bottom: 7px;
    height: 35px;
    display: flex;
    align-items: center
}

.info-block p {
    font-size: 14px;
    line-height: 19px;
    font-weight: 400;
    color: #2f2f2f;
    margin-bottom: 39px;
    margin-top: 0
}

.info-block:last-child p:last-child {
    margin-bottom: 0
}

.contact-us-right .info-block:last-child p:last-child {
    margin-bottom: 0
}

.info-block:last-child {
    margin-bottom: 0
}

.contact-us-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 94px
}

.contact-us-left {
    justify-content: center
}

    .contact-us-left h2 {
        color: #2F2F2F;
        display: flex;
        align-items: center;
        font-size: 32px;
        line-height: 123%;
        font-weight: 400;
        margin-bottom: 21px;
        margin-top: 0
    }

.contact-us-left, .contact-us-right {
    display: flex;
    flex-direction: column
}

@media (max-width:768px) {
    .contact-us-grid {
        grid-template-columns: 1fr;
        gap: 94px
    }
}

@media (max-width:992px) and (min-width:769px) {
    .contact-us-grid {
        gap: 1.5rem
    }
}

.contact-btn {
    height: 37px;
    width: 167px;
    background: #FFD88C;
    border: none;
    padding: 9px 24px;
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    color: #2f2f2f;
    display: flex;
    text-decoration: none;
    align-items: center;
    justify-content: center;
    border-radius: 4px
}

    .contact-btn:hover {
        background: #FFF4DD
    }

.china-pricing-box {
    background: #F4F4F4;
    padding: 38px 44px;
    margin-top: 103px;
    border-radius: 4px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 144px
}

.china-left h3 {
    height: 35px;
    display: flex;
    font-size: 24px;
    font-weight: 400;
    line-height: 120%;
    color: #2f2f2f;
    margin-bottom: 16px;
    margin-top: 0
}

.china-left p {
    font-size: 14px;
    line-height: 19px;
    font-weight: 400;
    color: #2f2f2f;
    margin-bottom: 0;
    margin-top: 0
}

.china-right {
    gap: 14px;
    display: flex;
    align-items: center
}

    .china-right a {
        width: 185px !important
    }

.have-questions-section {
    margin-top: 72px;
    padding-top: 42px;
    padding-bottom: 64px;
    background: linear-gradient(90deg,#005E71 0%,#001E60 100%);
    position: relative
}

    .have-questions-section::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: -99vw;
        width: 100vw;
        background: linear-gradient(90deg,#001E60 0%,#005E71 100%)
    }

    .have-questions-section::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        right: -99vw;
        width: 100vw;
        background: linear-gradient(90deg,#001E60 0%,#005E71 100%)
    }

.have-questions-title {
    height: 39px;
    font-size: 32px !important;
    line-height: 123% !important;
    font-weight: 400 !important;
    text-align: center !important;
    color: #ffffff !important;
    margin-bottom: 39px !important;
    margin-top: 0px !important
}

.have-questions-section-grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 24px
}

.have-questions-section-grid-card {
    background: #f4f4f4;
    border-radius: 6px;
    padding-top: 24px;
    padding-bottom: 29px;
    z-index: 1
}

.team-name {
    margin-bottom: 11px;
    font-size: 18px;
    line-height: 128%;
    font-weight: 400;
    color: #2f2f2f;
    text-align: center
}

.team-email {
    font-size: 14px;
    line-height: 19px;
    font-weight: 400;
    text-decoration: underline;
    text-align: center;
    color: #2f2f2f;
    margin-bottom: 0;
    display: flex;
    justify-content: center
}

.comparison-table {
    font-family: 'Fira Sans Condensed',sans-serif !important
}

    .comparison-table table {
        font-family: 'Fira Sans Condensed',sans-serif !important
    }

        .comparison-table table tr {
            height: 42px !important
        }

            .comparison-table table tr p {
                margin-bottom: 0px !important;
                margin-top: 0px !important
            }

        .comparison-table table th, .comparison-table table td {
            font-family: 'Fira Sans Condensed',sans-serif
        }

.tutorial-section {
    margin-top: 72px
}

.featured-video {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
    margin-bottom: 45px;
    align-items: start
}

.video-left {
    width: 100%;
    height: 420px;
    background: linear-gradient(0deg,#D9D9D9,#D9D9D9),linear-gradient(180deg,#fff0 0%,rgb(0 0 0 / .2) 100%)
}

    .video-left video {
        width: 100%;
        height: 100%;
        object-fit: fill;
        display: block
    }

.video-right {
    height: 100%;
    padding: 32px
}

.video-content {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 8px
}

    .video-content .video-title {
        font-size: 16px !important;
        font-weight: 400 !important;
        line-height: 120% !important;
        margin: 0 !important;
        margin-top: 15px !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word;
        color: #000 !important
    }

.video-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0
}

.video-info {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #767676
}

    .video-info span {
        font-size: 12px;
        line-height: 15px;
        color: #767676;
        white-space: nowrap
    }

@media (max-width:768px) {
    .video-title {
        font-size: 14px;
        -webkit-line-clamp: 3
    }

    .video-info {
        font-size: 11px
    }

    .video-left {
        height: 248px !important
    }

    .video-right {
        padding: 0px !important
    }

        .video-right .featured-video-name {
            margin-top: 23px !important
        }
}

@media (max-width:480px) {
    .video-card {
        flex-direction: column;
        height: auto !important;
        align-items: flex-start !important
    }

    .video-content {
        min-height: auto !important
    }

    .video-card .video-content .video-title {
        margin-bottom: 0px !important
    }
}

.featured-video-name {
    margin-top: 26px !important;
    font-size: 24px !important;
    line-height: 120% !important;
    font-weight: 400 !important;
    color: #2F2F2F !important;
    margin-bottom: 0 !important
}

.video-grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 20px
}

.video-card {
    display: flex;
    gap: 18px;
    padding: 11px 9px;
    border-radius: 4px;
    align-items: center;
    height: 144px
}

.video-thumbnail {
    position: relative;
    width: 122px;
    height: 122px;
    overflow: hidden;
    background: #D9D9D9;
    flex-shrink: 0;
    cursor: pointer
}

    .video-thumbnail video {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block
    }

.feature-video-meta {
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    color: #767676;
    display: flex;
    align-items: center;
    gap: 9px
}

@media (max-width:768px) {
    .video-grid {
        grid-template-columns: 1fr
    }
}

.recent-order-grid-section {
    width: 100% !important;
    max-width: 100vw;
    overflow-x: auto !important;
    display: block !important;
    -webkit-overflow-scrolling: touch
}

.custom-grid .k-grid-header, .custom-grid .k-grid-content {
    overflow: scroll !important;
    overflow-y: hidden !important
}

.custom-grid.k-grid {
    display: block !important;
    width: 100% !important
}

.page-numbers {
    display: flex;
    gap: 4px
}

.editable-price-input {
    width: 120px !important;
    height: 34px;
}

    .editable-price-input .k-input {
        text-align: right
    }

    .editable-price-input .k-button {
        background: white !important;
    }

.skeleton-tabs {
    display: flex;
    gap: 12px
}

.skeleton-tab {
    width: 100px;
    height: 36px;
    background: linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
    border-radius: 4px
}

.skeleton-card {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 16px
}

.skeleton-icon {
    width: 16px;
    height: 16px;
    background: linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
    border-radius: 50%
}

.skeleton-title {
    width: 60%;
    height: 20px;
    background: linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
    border-radius: 4px;
    margin-bottom: 8px
}

.skeleton-location {
    width: 40%;
    height: 14px;
    background: linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
    border-radius: 4px;
    margin-bottom: 4px
}

.skeleton-date {
    width: 50%;
    height: 14px;
    background: linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
    border-radius: 4px
}

.skeleton-type {
    width: 80px;
    height: 24px;
    background: linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
    border-radius: 4px
}

.skeleton-qty {
    width: 100px;
    height: 36px;
    background: linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
    border-radius: 4px
}

.skeleton-price {
    width: 80px;
    height: 20px;
    background: linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
    border-radius: 4px
}

.skeleton-summary {
    padding: 20px
}

.skeleton-summary-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
    height: 16px;
    background: linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
    border-radius: 4px
}

.skeleton-total-row {
    height: 24px;
    background: linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
    border-radius: 4px;
    margin-bottom: 16px
}

.skeleton-button {
    width: 100%;
    height: 44px;
    background: linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
    border-radius: 4px
}

@keyframes shimmer {
    0% {
        background-position: -200% 0
    }

    100% {
        background-position: 200% 0
    }
}

.pay-total-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 42px
}

.pay-total-label {
    font-size: 20px;
    line-height: 28px;
    font-weight: 400;
    color: #2F2F2F
}

.pay-total-amt {
    font-size: 24px;
    line-height: 120%;
    font-weight: 700;
    color: #2F2F2F
}

.pay-option {
    background: #fff;
    border: 1px solid #BBE4FF;
    border-radius: 4px 4px 0 0;
    margin-bottom: 12px;
    overflow: hidden;
    cursor: pointer
}

.pay-option--active {
    border: none
}

.pay-option-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    background: #fff
}

.pay-option--active .pay-option-header {
    background: #BBE4FF
}

.pay-option-title {
    font-size: 15px;
    color: #111;
    font-weight: 400
}

.pay-radio {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 2px solid #2F2F2F;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: #fff
}

.pay-radio--checked {
    border-color: #2F2F2F
}

.pay-radio-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #2F2F2F
}

.pay-online-body.normal-user {
    padding: 0px !important
}

.pay-online-body, .pay-offline-body {
    padding: 20px 15px;
    cursor: default
}

.pay-offline-title {
    font-size: 16px;
    font-weight: 400;
    line-height: 135%;
    color: #2f2f2f;
    margin: 0 0 10px 0
}

.pay-offline-desc {
    font-size: 14px;
    color: #2f2f2f;
    line-height: 19px;
    margin: 0 0 32px 0
}

.pay-field {
    margin-bottom: 20px
}

.pay-input-with-icon {
    position: relative;
    display: flex;
    align-items: center
}

    .pay-input-with-icon .pay-input {
        width: 100%;
        padding-right: 36px
    }

.input-error-icon {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none
}

.pay-input.input-error {
    border-color: #fff0 #fff0 #B3261E #fff0;
    border-bottom: 2px solid #B3261E
}

.pay-input {
    width: 100%;
    box-sizing: border-box;
    border: none;
    border-radius: 4px 4px 0 0;
    background: #fff;
    padding: 7px 16px;
    font-size: 14px;
    color: #2f2f2f;
    outline: none;
    font-family: 'Fira Sans Condensed','Helvetica Neue',Helvetica,Arial,sans-serif;
    border-bottom: 1px solid #76767670;
    height: 31px
}

    .pay-input::placeholder {
        color: #B3B3B3;
        font-size: 14px;
        line-height: 100%;
        font-weight: 400
    }

    .pay-input:focus {
        border-color: #aaa
    }

.stripe-el {
    width: 100%;
    box-sizing: border-box;
    border: none;
    border-bottom: 1px solid #76767670;
    border-radius: 4px 4px 0 0;
    background: #fff;
    font-family: 'Fira Sans Condensed','Helvetica Neue',Helvetica,Arial,sans-serif;
    padding: 10px 12px;
    min-height: 36px;
    height: 36px;
    font-size: 14px
}

    .stripe-el.StripeElement--focus {
        border-color: #aaa
    }

    .stripe-el.StripeElement--invalid {
        border-color: #e53e3e
    }

.pay-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px
}

    .pay-row .pay-field {
        margin-bottom: 0px !important
    }

.pay-divider {
    border: none;
    border-top: 2px dashed #76767670;
    margin: 32px 0 19px 0
}

.pay-terms {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 42px
}

    .pay-terms input[type="checkbox"] {
        margin-top: 3px;
        flex-shrink: 0;
        width: 12px;
        height: 12px
    }

    .pay-terms label {
        font-size: 14px;
        font-weight: 400;
        color: #2F2F2F;
        line-height: 19px
    }

    .pay-terms a {
        color: #0072CE;
        text-decoration: none
    }

        .pay-terms a:hover {
            font-weight: 700
        }

.pay-error {
    color: #e53e3e;
    font-size: 12px;
    margin-bottom: 10px
}

.pay-actions {
    display: flex;
    flex-direction: column;
    gap: 13px
}

.btn-pay {
    width: 100%;
    padding: 9px 24px;
    background: #FFD88C;
    color: #2F2F2F;
    border: none;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 400;
    line-height: 100%;
    cursor: pointer;
    font-family: inherit;
    height: 37px
}

    .btn-pay:hover {
        background: #FFF4DD
    }

    .btn-pay:disabled {
        cursor: not-allowed
    }

.btn-cancel {
    width: 100%;
    padding: 9px 24px;
    background: #fff;
    color: #2f2f2f;
    border: 1px solid #B3B3B3;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 400;
    line-height: 100%;
    cursor: pointer;
    font-family: inherit;
    height: 37px
}

    .btn-cancel:hover {
        background: #FFD88C;
        border: none
    }

    .btn-cancel:disabled {
        cursor: not-allowed
    }

.payment-method-label {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 8px;
    color: #333
}

.pay-success {
    color: #155724;
    background-color: #d4edda;
    border: 1px solid #c3e6cb;
    padding: 4px 8px;
    border-radius: 4px;
    margin-bottom: 10px;
    font-size: 14px
}

.security-badge {
    display: inline-flex;
    align-items: center;
    font-size: 12px;
    font-weight: 500;
    padding: 5px 10px;
    border-radius: 4px;
    margin-bottom: 14px
}

.security-badge--loading {
    background: #f0f4ff;
    color: #4a6fa5;
    border: 1px solid #c7d7f0
}

.security-badge--ready {
    background: #f0faf4;
    color: #276749;
    border: 1px solid #b2dfc7
}

.security-badge--error {
    background: #fff5f5;
    color: #c53030;
    border: 1px solid #feb2b2
}

.stripe-status-msg {
    font-size: 12px;
    color: #c53030;
    margin-bottom: 10px;
    min-height: 16px;
    line-height: 1.5
}

.trust-badges {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin: 10px 0 4px 0
}

.trust-badge {
    font-size: 11px;
    color: #555;
    background: #f7f7f7;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    padding: 3px 8px
}

.stripe-secure-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 8px 0;
    padding: 6px 0;
    border-top: 1px solid #f0f0f0;
    border-bottom: 1px solid #f0f0f0
}

.stripe-logo {
    width: 18px;
    height: 18px;
    border-radius: 3px
}

.stripe-secure-text {
    font-size: 12px;
    color: #888
}

.forgot-password-btn-section {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 54px;
    margin-bottom: 192px
}

.send-email-btn {
    width: 165px;
    height: 37px;
    opacity: 1;
    border-radius: 4px;
    border-width: 1px;
    padding-top: 9px;
    padding-right: 24px;
    padding-bottom: 9px;
    padding-left: 24px;
    background: #FFD88C;
    border: none;
    font-size: 14px;
    line-height: 19px;
    font-weight: 400;
    color: #2f2f2f
}

    .send-email-btn:hover {
        background: #FFF4DD
    }

    .send-email-btn:focus {
        box-shadow: none !important
    }

.forgot-password-go-back-link {
    display: flex;
    font-size: 12px;
    line-height: 15px;
    color: #2f2f2f
}

    .forgot-password-go-back-link:hover {
        font-size: 14px;
        font-weight: 700
    }

.forgot-password-policies {
    font-size: 12px;
    line-height: 15px;
    color: #2f2f2f
}

    .forgot-password-policies a {
        font-size: 12px;
        line-height: 15px;
        color: #2f2f2f;
        text-decoration: underline
    }

        .forgot-password-policies a:hover {
            font-weight: 700 !important
        }

@media (max-width:768px) {
    .forgot-password-btn-section {
        margin-bottom: 50px;
        flex-direction: column;
        gap: 25px
    }

    .send-email-btn {
        width: 100%
    }
}

.order-confirmation-wrapper {
    display: flex;
    flex-direction: column;
    width: 100%
}

.confirmation-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 33px;
    margin-bottom: 45px
}

.confirmation-card {
    background-color: #f4f4f4;
    border-radius: 6px;
    padding: 74px;
    text-align: center;
    width: 100%;
    max-width: 100%;
    height: auto
}

.confirmation-success-message h1 {
    color: #2F2F2F;
    font-weight: 700;
    margin-bottom: 42px;
    font-style: italic;
    font-size: 24px;
    line-height: 120%;
    margin-top: 0
}

.confirmation-label {
    color: #2F2F2F;
    font-weight: 400;
    font-size: 20px;
    line-height: 28px
}

.confirmation-order-number {
    color: #2F2F2F;
    font-weight: 700;
    font-size: 20px;
    line-height: 28px;
    margin-bottom: 45px
}

.confirmation-instructions {
    color: #2F2F2F;
    line-height: 19px;
    font-size: 14px;
    font-weight: 400;
    margin: 2rem 0
}

    .confirmation-instructions p {
        margin-bottom: 16px;
        margin-top: 0
    }

    .confirmation-instructions strong {
        color: #2f2f2f
    }

.confirmation-action {
    margin-top: 52px
}

.my-account-btn {
    background-color: #fff0;
    border: 1px solid #B3B3B3;
    color: #2F2F2F;
    padding: 9px 24px;
    border-radius: 4px;
    font-weight: 400;
    font-size: 14px;
    line-height: 19px;
    cursor: pointer;
    height: 37px;
    width: 151px
}

    .my-account-btn:hover {
        background-color: #fff0
    }

@media (max-width:768px) {
    .confirmation-card {
        padding: 40px 25px
    }
}

.email-sent-card {
    background-color: #f4f4f4;
    border-radius: 6px;
    padding: 72px;
    text-align: center;
    width: 100%;
    max-width: 100%
}

.email-sent-success-message h1 {
    color: #2F2F2F;
    font-weight: 700;
    margin-bottom: 20px;
    font-style: italic;
    font-size: 24px;
    line-height: 120%
}

.email-sent-instructions {
    color: #2F2F2F;
    line-height: 19px;
    font-size: 14px;
    font-weight: 400
}

    .email-sent-instructions p {
        margin-bottom: 33px
    }

.dont-email-sent-instructions {
    color: #2F2F2F;
    line-height: 19px;
    font-size: 14px;
    font-weight: 400
}

    .dont-email-sent-instructions p {
        margin-bottom: 33px
    }

.email-sent-action {
    margin-bottom: 61px
}

.my-account-btn {
    background-color: #FFD88C;
    border: none;
    color: #2F2F2F;
    padding: 9px 24px;
    border-radius: 4px;
    font-weight: 400;
    font-size: 14px;
    line-height: 19px;
    cursor: pointer;
    height: 37px;
    width: 137px
}

    .my-account-btn:hover {
        background-color: #FFF4DD
    }

.dont-get-email-wrapper {
    background: #FFF;
    padding: 32px
}

.dont-get-email-message h2 {
    color: #2F2F2F;
    font-weight: 700;
    margin-bottom: 20px;
    font-style: italic;
    font-size: 16px;
    line-height: 120%
}

.resent-email-btn {
    background-color: #fff0;
    border: 1px solid #767676;
    color: #2F2F2F;
    padding: 9px 24px;
    border-radius: 4px;
    font-weight: 400;
    font-size: 14px;
    line-height: 19px;
    cursor: pointer;
    height: 37px;
    width: 149px
}

.visually-hidden {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0
}

button:focus-visible, a:focus-visible {
    outline: 3px solid #005fcc;
    outline-offset: 2px
}

.payment-processing-overlay {
    position: fixed;
    inset: 0;
    background: rgb(0 0 0 / .55);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(3px)
}

.payment-processing-box {
    background: #fff;
    border-radius: 12px;
    padding: 40px 48px;
    text-align: center;
    max-width: 400px;
    width: 90%;
    box-shadow: 0 8px 40px rgb(0 0 0 / .18)
}

.payment-processing-spinner {
    width: 48px;
    height: 48px;
    border: 4px solid #e0e0e0;
    border-top-color: #2F2F2F;
    border-radius: 50%;
    animation: spin 0.85s linear infinite;
    margin: 0 auto 24px
}

@keyframes spin {
    to {
        transform: rotate(360deg)
    }
}

.payment-processing-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: #2F2F2F;
    margin-bottom: 8px
}

.payment-processing-subtitle {
    font-size: .875rem;
    color: #666;
    margin: 0
}

.disabled-link {
    pointer-events: none;
    opacity: .4;
    cursor: not-allowed
}

@media (max-width:768px) {
    .email-sent-card {
        padding: 72px 32px
    }

    .dont-get-email-message h2 {
        font-size: 16px !important;
        line-height: 120% !important;
        margin-bottom: 20px !important
    }
}

.eval-wrapper {
    width: 100%;
    min-height: 100vh;
    margin: 0;
    padding: 72px 0;
    display: flex;
    align-items: center;
    justify-content: center
}

.eval-card {
    background-color: #fff;
    width: 100%;
    padding: 32px;
    border-radius: 10px
}

.eval-header {
    text-align: center;
    margin-bottom: 40px
}

    .eval-header h2 {
        font-size: 32px;
        font-weight: 400;
        color: #2F2F2F;
        line-height: 123%;
        margin: 0 0 20px
    }

    .eval-header .eval-subtitle {
        font-size: 18px;
        color: #2F2F2F;
        line-height: 129%;
        font-weight: 400;
        margin: 0 0 60px
    }

.rating-row {
    display: flex;
    align-items: center;
    padding: 15px 32px;
    height: 79px
}

    .rating-row.odd-row {
        background-color: #F4F4F4
    }

    .rating-row.even-row {
        background-color: #fff
    }

.rating-label {
    flex: 1;
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    color: #2F2F2F;
    min-width: 508px
}

.required-star {
    color: #c0392b;
    margin-left: 2px
}

.rating-question-wrapper {
    margin-bottom: 60px
}

.rating-options {
    display: flex;
    flex-shrink: 0;
    justify-content: flex-end
}

    .rating-options .k-radio-list {
        display: flex;
        flex-direction: row;
        gap: 0
    }

    .rating-options .k-radio-list-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 6px;
        min-width: 101px;
        text-align: center
    }

    .rating-options .k-radio-wrap {
        width: 100%;
        justify-content: center;
        height: 28px
    }

    .rating-options .k-radio-list-item .k-radio-label {
        order: 2;
        font-size: 12px;
        line-height: 15px;
        color: #A6A6A6;
        font-weight: 400;
        white-space: nowrap;
        margin: 0
    }

    .rating-options .k-radio-list-item .k-radio {
        order: 1;
        margin: 0;
        height: 16px;
        width: 16px;
        border-color: #2F2F2F
    }

    .rating-options .k-radio:checked, .k-radio.k-checked {
        color: #2F2F2F !important;
        border-color: #2F2F2F !important;
        background-color: #ffffff !important
    }

        .rating-options .k-radio:checked:focus {
            box-shadow: none !important
        }

    .rating-options .k-radio-list {
        padding: 0;
        margin: 0
    }

.section-divider {
    border: none;
    border-top: 1px solid #e0e0e0;
    margin: 30px 0
}

.open-question {
    margin-bottom: 32px
}

    .open-question label {
        display: block;
        font-size: 14px;
        line-height: 19px;
        font-weight: 400;
        color: #2F2F2F;
        margin-bottom: 7px
    }

    .open-question .k-textarea {
        width: 100%;
        border: 1px solid #D9D9D9;
        border-radius: 4px;
        height: 74px
    }

.validation-msg {
    color: #B3261E;
    font-size: 10px;
    margin-top: 4px;
    padding-left: 32px;
    text-align: left;
    font-family: 'Fira Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}

.recaptcha-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center
}

.submit-wrapper {
    text-align: center;
    margin-top: 32px
}

    .submit-wrapper .k-button.k-button-solid-primary {
        background-color: #FFD88C;
        border: none;
        height: 37px;
        width: 165px;
        color: #2f2f2f;
        font-size: 14px;
        font-weight: 400;
        line-height: 19px;
        padding: 9px 24px;
        border-radius: 4px
    }

        .submit-wrapper .k-button.k-button-solid-primary:hover:not(:disabled) {
            background-color: #FFF4DD
        }

    .submit-wrapper .k-button-solid-primary:focus {
        box-shadow: none
    }

    .submit-wrapper .k-button.k-button-solid-primary:disabled {
        opacity: .6
    }

.loading-msg {
    text-align: center;
    padding: 60px;
    color: #5a7a8a;
    font-size: 1rem
}

.expired-state {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 80px 40px;
    text-align: center
}

.expired-message {
    font-size: 1rem;
    color: #2f2f2f;
    margin: 0
}

@media (max-width:768px) {
    .eval-header h2 {
        margin: 0 0 30px !important
    }

    .rating-row {
        padding: 20px 15px !important;
        flex-direction: column;
        align-items: flex-start !important;
        height: auto !important;
        gap: 20px
    }

    .rating-label {
        min-width: fit-content !important
    }

    .rating-options {
        width: 100%;
        justify-content: center !important
    }

        .rating-options .k-radio-list {
            width: 100%;
            justify-content: space-between !important;
            gap: 0 !important
        }

        .rating-options .k-radio-list-item {
            min-width: 0 !important;
            flex: 1 1 0%;
            text-align: center;
            padding: 0 2px
        }

        .rating-options .k-radio-label {
            white-space: normal !important;
            margin-bottom: 0 !important;
            width: 100%;
            display: block
        }

        .rating-options .k-radio {
            margin-bottom: 0 !important;
            margin-top: 0 !important
        }
}

.survey-wrapper {
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    width: 100vw;
    background: linear-gradient(180deg,#F9F9F9 0%,#EEFEFF 100%);
    box-sizing: border-box;
    overflow-x: hidden
}

.thankyou-wrapper {
    min-height: 100vh;
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 72px 0
}

.thankyou-card {
    background-color: #fff;
    border-radius: 10px;
    padding: 32px;
    text-align: center;
    height: 600px;
    width: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center
}

.thankyou-title {
    font-size: 32px;
    font-weight: 400;
    color: #2F2F2F;
    margin: 0 0 30px;
    line-height: 123%
}

.thankyou-subtitle {
    font-size: 18px;
    line-height: 129%;
    font-weight: 400;
    color: #2F2F2F;
    margin: 0 0 32px
}

.download-certificate-btn {
    height: 37px;
    width: 165px;
    border-radius: 4px;
    background: #FFD88C;
    padding: 9px 24px;
    border: none;
    font-size: 14px;
    line-height: 19px;
    color: #2f2f2f;
    font-weight: 400
}

    .download-certificate-btn:hover {
        background-color: #FFF4DD
    }

.w-100 {
    width: 100%
}

.mh-100 {
    max-height: 100% !important;
}

.mw-100 {
    max-width: 100%
}

.d-flex {
    display: flex
}

.flex-column {
    flex-direction: column
}

.justify-content-between {
    justify-content: space-between
}

.align-items-center {
    align-items: center
}

.align-content-center {
    align-content: center
}

.align-items-start {
    align-items: flex-start
}

.gap-1 {
    gap: .25rem
}

.text-center {
    text-align: center
}

.text-danger {
    color: #dc3545
}

.text-start {
    text-align: left
}

.text-white {
    color: #fff !important
}

.fw-normal {
    font-weight: 400
}

.fw-bold {
    font-weight: 700
}

.mb-0 {
    margin-bottom: 0
}

.mt-0 {
    margin-top: 0
}

.mt-3 {
    margin-top: 16px
}

.ms-2 {
    margin-left: 8px
}

.me-4 {
    margin-right: 24px
}

.ml-2 {
    margin-left: 8px
}

.border-0 {
    border: none
}

.p-0 {
    padding: 0
}

.ps-2 {
    padding-left: 8px
}

.g-3 {
    gap: 16px
}

.bg-transparent {
    background: #fff0
}

.flex-grow-1 {
    flex-grow: 1
}

.min-w-0 {
    min-width: 0
}

.text-truncate {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.flex-wrap {
    display: flex;
    flex-wrap: wrap
}

.gap-4 {
    gap: 24px
}

.mb-4 {
    margin-bottom: 24px !important;
}

.fw-semibold {
    font-weight: 600
}

.row {
    display: flex;
    flex-wrap: wrap
}

.custom-date-error {
    color: #dc3545;
    font-size: 12px;
    margin: 8px 0;
    text-align: center
}

@media (max-width:768px) {

    .cart-wrapper {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        min-height: auto !important;
        height: calc(100vh - 75px) !important;
        gap: 32px;
    }

    .shopping-cart-add-attendee-wrapper {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        padding-right: 0 !important;
        order: 1;
    }

    .shopping-cart-policies-section {
        position: relative !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        align-self: stretch !important;
        order: 2;
        z-index: 1 !important;
    }

    .shopping-cart-policies-content-section {
        margin: 24px 0 0 !important;
        padding-right: 0 !important;
        width: 100% !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        position: relative;
    }

    .sticky-continue-wrapper {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        z-index: auto !important;
        padding: 72px 0px 0px !important;
        margin: 0 0 24px 0 !important;
    }

        .sticky-continue-wrapper::before {
            display: none !important;
        }

    .shopping-cart-continue-btn {
        width: 100% !important;
        margin: 0 !important;
    }

    .cart-items-scroll {
        height: max-content !important;
        overflow: visible !important;
    }
}

.popup-overlay {
    position: fixed;
    inset: 0;
    background: transparent;
    z-index: 2;
}

.popup {
    position: absolute;
    z-index: 1000;
    min-width: max-content;
    z-index: 2;
}

.resource-row {
    border-bottom: 1px solid #eee;
    padding: 18px 4px;
}

    article.resource-row:first-of-type,
    .resource-row:first-of-type,
    .resource-row.w-100:first-of-type {
        padding-top: 0 !important;
    }

.resource-row-content {
    display: flex;
    align-items: center;
    gap: 16px;
    color: inherit;
}

.resource-file-icon {
    flex-shrink: 0;
    display: inline-flex;
}

.resource-row-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.resource-row-date {
    font-size: 12px;
    color: #767676;
    font-weight: 500;
}

.resource-row-title {
    font-size: 18px;
    font-weight: 600;
    color: #2F2F2F;
    text-decoration: none;
    width: fit-content;
}

    .resource-row-title:hover {
        color: #2F2F2F;
        text-decoration: underline;
    }

.sort-by-wrapper {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: 4px;
    position: relative;
}

.sort-by-pill {
    min-width: 220px;
    justify-content: space-between;
}

    .sort-by-pill[aria-expanded="true"] {
        box-shadow: 0 0 0 2px rgba(42, 112, 183, 0.2);
    }

.sort-by-wrapper .sort-popup {
    position: absolute !important;
    top: calc(100% + 6px) !important;
    left: auto !important;
    right: 0 !important;
    min-width: 190px;
    padding: 4px 0;
    z-index: 60;
}

.sort-option {
    padding: 6px 14px;
    cursor: pointer;
    color: #757575;
    font-weight: 400;
    line-height: 20px;
    font-size: 14px;
    display: flex;
    align-items: center;
    height: 32px;
    border: none;
    background: #fff0;
}

    .sort-option:hover {
        font-weight: 600;
    }

.sort-option-active {
    background-color: #FFD88C !important;
    font-weight: 500 !important;
}

.training-search-select.software-resource-select .k-input-button {
    width: 40px !important;
}

.dual-calendar {
    display: flex;
    gap: 24px;
    padding: 8px 4px 0;
}

.calendar-block {
    width: 240px;
}

.custom-container {
    position: relative;
}

.resource-custom-selected {
    background: #F4F4F4;
    color: #757575;
}

.resource-date-popup {
    display: flex; /* lay children in a row */
    align-items: stretch; /* <-- makes both columns the same height */
    width: fit-content;
}

.date-popup-left {
    display: flex;
    flex-direction: column;
    width: 135px;
    max-width: 135px;
    flex-shrink: 0;
}

.calendar-year-select,
.calendar-month-select {
    border: none;
    background: transparent;
    font-weight: 700;
    font-size: 15px;
    color: #1e1e1e;
    cursor: pointer;
    padding: 0;
    margin-left: 2px;
}

    .calendar-year-select:focus,
    .calendar-month-select:focus {
        outline: none;
    }

.resource-custom-date-wrapper {
    background: #F4F4F4;
    padding: 10px;
    z-index: 1001;
}

.calendar-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    font-weight: 700;
    font-size: 14px;
    color: #2f2f2f;
}

.cal-nav-btn {
    border: none;
    background: transparent;
    font-size: 18px;
    cursor: pointer;
    color: #2f2f2f;
    padding: 2px 8px;
    line-height: 1;
    border-radius: 50%;
}

    .cal-nav-btn:hover {
        background: #f0f0f0;
    }

.calendar-weekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    text-align: center;
    font-size: 13px;
    color: #757575;
    margin-bottom: 4px;
}

.calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    row-gap: 2px;
}

.calendar-day {
    border: none;
    background: transparent;
    padding: 8px 0;
    font-size: 14px;
    color: #1e1e1e;
    cursor: pointer;
    text-align: center;
}

.calendar-title {
    font-weight: 400;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: 0%;
    color: #2F2F2F;
}

.calendar-day.outside-month {
    color: #B3B3B3;
}

.calendar-day.range-in-between {
    background-color: #FFD88C;
}

.calendar-day.range-edge {
    background-color: #FFD88C;
    border-radius: 4px;
    border: 1px solid #2f2f2f;
}

.calendar-day.is-today:not(.range-edge) {
    border-radius: 4px;
    background: #FFD88C;
}

.calendar-day:hover:not(.range-edge) {
    border: 1px solid #2F2F2F;
    border-radius: 4px;
}

.calendar-actions {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 22px;
}

    .calendar-actions .close-btn {
        border: 1px solid #B3B3B3;
        background: #fff;
        height: 29px;
        border-radius: 4px;
        padding: 5px 12px;
        font-weight: 400;
        cursor: pointer;
        color: #2F2F2F;
        font-size: 14px;
        line-height: 100%;
        width: 57px;
    }

        .calendar-actions .close-btn:hover {
            background: #FFD88C;
            border: none;
        }

    .calendar-actions .apply-btn {
        border: none;
        background: #FFD88C;
        border-radius: 4px;
        height: 29px;
        padding: 5px 12px;
        font-weight: 400;
        cursor: pointer;
        color: #2F2F2F;
        font-size: 14px;
        line-height: 100%;
        cursor: pointer;
        width: 57px;
    }

        .calendar-actions .apply-btn:hover {
            background: #FFF4DD;
        }

@media (max-width: 768px) {
    .sort-by-wrapper {
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
    }

    .pill.sort-by-pill {
        justify-content: space-between;
        width: 100%;
    }

    .resource-date-popup {
        width: 100% !important;
        flex-direction: column;
    }

    .date-popup-left {
        width: 100%;
        max-width: 100% !important;
    }

    .dual-calendar {
        flex-direction: column !important;
    }

    .calendar-block {
        width: 100% !important;
    }

    .calendar-actions .close-btn {
        width: 100% !important;
    }

    .calendar-actions {
        flex-direction: column;
    }

    .resource-file-icon svg {
        width: 40px;
        height: 40px;
    }
}

#maintenance-main-content {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.contact-banner {
    width: 100%;
    background: linear-gradient(90deg, #005E71 0%, #001E60 100%);
    color: #ffffff;
    padding: 72px 0px;
    box-sizing: border-box;
    position: relative;
    z-index: 1
}

    .contact-banner::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: -99vw;
        width: 100vw;
        background: linear-gradient(90deg,#001E60 0%,#005E71 100%);
        z-index: -1
    }

    .contact-banner::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        right: -99vw;
        width: 100vw;
        background: linear-gradient(90deg,#001E60 0%,#005E71 100%);
        z-index: -1
    }

    .contact-banner h3 {
        margin-bottom: 30px;
        font-size: 32px;
        font-weight: 400;
        line-height: 132%;
        text-align: center;
        margin-top: 0px;
    }

.contact-banner-buttons {
    display: flex;
    gap: 21px;
    width: 100%;
    align-items: center;
    justify-content: center;
}

.contact-banner-btn {
    height: 70px;
    background: #ffffff;
    color: #414142;
    border: none;
    border-radius: 6px;
    padding: 20px 32px;
    font-size: 20px;
    font-weight: 400;
    line-height: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    cursor: pointer;
}

    .contact-banner-btn:hover {
        font-weight: 500;
    }

        .contact-banner-btn:hover svg {
            flex-shrink: 0;
        }

    .contact-banner-btn svg * {
        transition: stroke .18s ease, fill .18s ease;
    }

    .contact-banner-btn:hover svg,
    .contact-banner-btn:hover svg * {
        stroke: #FFD88C !important;
    }

.faq-section {
    box-sizing: border-box;
    width: 100%;
    background: linear-gradient(180deg, #F9F9F9 0%, #EEFEFF 100%);
    position: relative;
    z-index: 1
}

    .faq-section::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: -99vw;
        width: 100vw;
        background: linear-gradient(180deg, #F9F9F9 0%, #EEFEFF 100%);
        z-index: -1
    }

    .faq-section::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        right: -99vw;
        width: 100vw;
        background: linear-gradient(180deg, #F9F9F9 0%, #EEFEFF 100%);
        z-index: -1
    }


.support-faq-title {
    font-size: 48px;
    line-height: 100%;
    font-weight: 200;
    color: #2f2f2f;
    text-align: center;
    margin: 100px 0px 42px 0px;
}

.faq-tabstrip {
    margin-bottom: 100px;
}

    .faq-tabstrip .k-tabstrip-items-wrapper {
        border-bottom: 1px solid #B3B3B3;
        position: relative;
        margin: 20px 0px;
    }

    .faq-tabstrip .k-tabstrip-items {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0;
        margin: 0;
        width: 100%;
        list-style: none;
        height: 33px;
    }

    .faq-tabstrip .k-tabstrip-item {
        flex: 1 1 0;
        min-width: 0;
    }

        .faq-tabstrip .k-tabstrip-item > .k-link {
            display: block;
            text-align: center;
            font-weight: 400;
            color: #767676;
            font-size: 14px;
            text-decoration: none;
            border-bottom: 3px solid transparent;
            box-sizing: border-box;
            padding: 8px 0px;
        }

        .faq-tabstrip .k-tabstrip-item.k-active > .k-link {
            color: #2F2F2F;
            border-bottom-color: #2F2F2F;
            position: relative;
            z-index: 2;
            background: transparent;
            padding: 0px;
            height: 33px;
        }

        .faq-tabstrip .k-tabstrip-item:focus {
            box-shadow: none !important;
            background: transparent !important;
        }

    .faq-tabstrip .k-tabstrip-content:focus {
        outline: 0px !important;
    }

    .faq-tabstrip .k-tabstrip-item.k-active {
        background: transparent;
        border: 0;
        border-color: transparent;
    }

    .faq-tabstrip .k-tabstrip-content.k-active {
        background: transparent;
        border: 0;
        padding: 0;
    }

.faq-tab-panel {
    padding-top: 42px;
}

.faq-layout {
    display: flex;
    gap: 25px;
    align-items: flex-start;
}

.faq-categories {
    list-style: none;
    margin: 0;
    padding: 0;
    min-width: 269px;
    flex-shrink: 0;
}

    .faq-categories li {
        margin-bottom: 20px;
    }

    .faq-categories button {
        background: none;
        border: none;
        padding: 9px 24px;
        font-weight: 400;
        font-size: 14px;
        color: #2F2F2F;
        cursor: pointer;
        text-align: left;
    }

        .faq-categories button:hover {
            font-size: 16px;
        }

    .faq-categories li.active button {
        font-weight: 700;
        text-decoration: underline;
    }

.faq-questions {
    flex: 1;
    border: 1px solid #BBE4FF;
    border-radius: 10px;
    overflow: hidden;
}

.faq-question-row {
    border-bottom: 1px solid #BBE4FF;
    background: #FFFFFF;
}

    .faq-question-row:last-child {
        border-bottom: none;
    }

    .faq-question-row:first-child .faq-question-header {
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
    }

    .faq-question-row:last-child .faq-question-header {
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
    }

    .faq-question-row:last-child.expanded .faq-question-header {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }

    .faq-question-row:last-child.expanded .faq-answer {
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
    }

.faq-question-header {
    width: 100%;
    background: none;
    border: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 32px;
    font-size: 18px;
    font-weight: 500;
    color: #2f2f2f;
    cursor: pointer;
    text-align: left;
}

.faq-question-row.expanded .faq-question-header {
    background: #fbead0;
}

.faq-question-header svg {
    flex-shrink: 0;
    transition: transform 0.2s ease;
}

.faq-question-row.expanded .faq-question-header svg {
    transform: rotate(180deg);
}

.faq-answer {
    padding: 20px 32px !important;
    background: #F4F4f4 !important;
    color: #2F2F2F !important;
    font-size: 14px !important;
    line-height: 150% !important;
    box-sizing: border-box !important;
}

    .faq-answer a {
        text-decoration: underline !important;
    }

    .faq-answer,
    .faq-answer * {
        color: #2f2f2f !important;
        font-size: 14px !important;
        line-height: inherit !important;
        font-family: inherit !important;
        font-weight: 400 !important;
        text-decoration: none !important;
        background: #f4f4f4 !important;
        margin: 0 !important;
        box-sizing: inherit !important;
    }

        .faq-answer [style],
        .faq-answer [style] * {
            color: inherit !important;
            font-size: inherit !important;
            line-height: inherit !important;
            font-family: inherit !important;
            background: transparent !important;
        }

        .faq-answer p {
            margin: 0 !important;
            color: inherit !important;
            font-size: inherit !important;
            line-height: inherit !important;
            background: inherit !important;
            padding: 0px !important;
        }

.release-table-wrapper {
    border: 1px solid rgba(29, 27, 32, 0.12);
    border-radius: 6px;
    overflow: hidden;
    width: 100%;
    box-sizing: border-box;
    border-bottom: 0px;
}

.release-table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    border: none;
    background: #FFFFFF;
}

    .release-table th {
        background: #2F2F2F;
        color: #ffffff;
        text-align: center;
        padding: 12px;
        font-weight: 500;
        font-size: 14px;
        border-right: 1px solid #f4f4f4;
        box-sizing: border-box;
    }

    .release-table thead th:first-child {
        border-top-left-radius: 6px;
    }

    .release-table thead th:last-child {
        border-top-right-radius: 6px;
        border-right: none;
    }

    .release-table th:first-child {
        width: 300px;
    }

    .release-table th:last-child {
        border-right: none;
    }

    .release-table td {
        padding: 12px;
        border-bottom: 1px solid rgba(29, 27, 32, 0.12);
        font-size: 14px;
        font-weight: 400;
        color: #2f2f2f;
        background: #FFFFFF;
    }

        .release-table td.versions a {
            color: #2F2F2F;
            text-decoration: underline;
            margin-right: 14px;
            white-space: nowrap;
        }

.agreements-content p {
    font-size: 14px;
    line-height: 129%;
    color: #2F2F2F;
    margin-bottom: 16px;
    margin-top: 0px;
}

    .agreements-content p:last-child,
    .agreements-content p:last-of-type {
        margin-bottom: 0 !important;
    }

.agreements-content ul {
    margin-top: 0px;
    margin-bottom: 42px;
}

.agreements-content h2 {
    font-size: 40px;
    font-weight: 500;
    color: #2f2f2f;
    margin: 42px 0 30px;
    line-height: 123%;
}

.agreements-content a {
    color: #2F2F2F;
    text-decoration: underline;
}

.faq-category-dropdown-toggle {
    display: none;
}

.faq-categories-wrapper .faq-categories {
    display: flex;
    flex-direction: column;
}

@media (max-width:768px) {

    .contact-banner h3 {
        font-size: 20px;
        line-height: 132%;
        font-weight: 400;
    }

    .contact-banner {
        padding: 72px 2px;
    }

    .contact-banner-buttons {
        flex-direction: column;
    }

    .support-faq-title {
        font-size: 32px;
        font-weight: 400;
        line-height: 129%;
    }

    .faq-tabstrip .k-tabstrip-items-wrapper {
        margin-bottom: 44px;
    }

    .faq-tabstrip .k-tabstrip-items,
    .faq-tabstrip-wrapper .k-tabstrip-items,
    .faq-tabstrip [role="tablist"] {
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        overflow-y: hidden;
    }

        .faq-tabstrip .k-tabstrip-items > li,
        .faq-tabstrip [role="tablist"] > * {
            display: inline-flex;
            flex: 0 0 auto;
            white-space: normal;
        }

        .faq-tabstrip .k-tabstrip-items [role="tab"],
        .faq-tabstrip [role="tablist"] [role="tab"] {
            display: inline-flex;
            align-items: center;
        }

            .faq-tabstrip .k-tabstrip-items [role="tab"]:focus {
                outline: none;
            }

    .release-title {
        font-size: 24px !important;
    }

    .changelog-heading {
        font-size: 20px !important;
    }

    .faq-category-dropdown-toggle {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        padding: 10px 20px;
        background: #fff;
        border: 1px solid #fff;
        border-radius: 4px;
        cursor: pointer;
        height: 48px;
        font-size: 15px;
        line-height: 28px;
        font-weight: 400;
        color: #2f2f2f;
    }

    .dropdown-chevron {
        transition: transform 0.2s ease;
    }

    .faq-categories-wrapper {
        width: 100%;
    }

        .faq-categories-wrapper.open .dropdown-chevron {
            transform: rotate(180deg);
        }

        .faq-categories-wrapper .faq-categories {
            display: none;
            position: absolute;
            top: 100%;
            left: 0;
            right: 0;
            z-index: 10;
            background: #fff;
            border: 1px solid #ddd;
            border-top: none;
            margin: 0;
            padding: 20px;
            list-style: none;
            box-shadow: 0px 4px 8px rgba(0,0,0,0.25);
        }

        .faq-categories-wrapper.open .faq-categories {
            display: flex;
            gap: 20px;
            flex-direction: column;
        }

        .faq-categories-wrapper .faq-categories li button {
            display: block;
            width: 100%;
            text-align: center;
            padding: 9px 0;
            border: none;
            background: none;
        }

        .faq-categories-wrapper .faq-categories li.active button {
            font-weight: 700;
            text-decoration: underline;
        }

    .faq-tabstrip .k-tabstrip-items {
        flex-wrap: nowrap;
    }

    .faq-tabstrip .k-tabstrip-item {
        min-width: 260px;
    }

    .faq-layout {
        flex-direction: column;
        gap: 32px;
    }

    .release-table-wrapper {
        overflow-x: scroll;
        scrollbar-width: thin;
    }

    .agreements-content h2 {
        font-size: 24px;
    }
}

.faq-categories {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

    .faq-categories li {
        margin-bottom: 0;
    }

.faq-categories-wrapper {
    position: relative;
}

.faq-question-header {
    gap: 15px;
}

.release-table th:first-child,
.release-table td:first-child {
    min-width: 300px !important;
    width: 300px !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}

.agreement-heading {
    font-size: 36px;
}

#release-note-main-content {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.release-detail-section {
    padding-top: 100px;
    box-sizing: border-box;
    width: 100%;
    background: linear-gradient(180deg, #F9F9F9 0%, #EEFEFF 100%);
    position: relative;
}

    .release-detail-section::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: -99vw;
        width: 100vw;
        background: linear-gradient(180deg, #F9F9F9 0%, #EEFEFF 100%);
        z-index: -1
    }

    .release-detail-section::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        right: -99vw;
        width: 100vw;
        background: linear-gradient(180deg, #F9F9F9 0%, #EEFEFF 100%);
        z-index: -1
    }

.breadcrumb-link {
    background: none;
    border: none;
    padding: 0;
    color: #1568a8;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 24px;
}

    .breadcrumb-link:hover {
        text-decoration: underline;
    }

.versions-bar {
    display: flex;
    align-items: center;
    gap: 30px;
    border: 1px solid #BBE4FF;
    border-radius: 6px;
    padding: 10px;
    margin-bottom: 42px;
    position: relative;
}

.versions-label {
    color: #b3b3b3;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 10%;
}

.available-versions {
    gap: 12px;
    display: flex;
    flex-wrap: wrap;
}

.versions-bar a {
    color: #2F2F2F;
    text-decoration: underline;
    font-size: 14px;
    font-weight: 400;
}

    .versions-bar a.active {
        font-weight: 700;
    }

.refresh-indicator {
    margin-left: auto;
    font-size: 0.78rem;
    font-weight: 600;
    color: #9a9a9a;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.refresh-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #1a8fa8;
    animation: refresh-pulse 1s ease-in-out infinite;
}

@keyframes refresh-pulse {
    0%, 100% {
        opacity: 0.3;
    }

    50% {
        opacity: 1;
    }
}

.release-header-row {
    display: flex;
    margin-bottom: 30px;
}

.release-content-fading {
    opacity: 0.55;
}

.release-title {
    font-size: 40px;
    font-weight: 500;
    color: #2f2f2f;
    line-height: 123%;
    margin: 0;
}

.release-date {
    color: #2f2f2f;
    font-size: 14px;
    font-weight: 400;
    margin: 0 0 42px 0;
}

.changelog-heading {
    font-size: 32px;
    font-weight: 400;
    line-height: 132%;
    color: #2F2F2F;
    margin: 0px 0 30px 0;
}

.changelog-body {
    font-size: 14px;
    line-height: 19px;
    font-weight: 400;
    color: #2F2F2F;
    margin: 0 0 42px 0;
}

    .changelog-body p {
        font-size: 14px;
        line-height: 19px;
        font-weight: 400;
        color: #2f2f2f;
    }

        .changelog-body p,
        .changelog-body p * {
            font-size: 14px !important;
            line-height: 19px !important;
            font-weight: 400 !important;
            color: #2f2f2f !important;
            background: transparent !important;
            font-family: 'Fira Sans Condensed', sans-serif !important;
        }

            .changelog-body p,
            .changelog-body p * {
                font-size: 14px !important;
                line-height: 19px !important;
                font-weight: 400 !important;
                color: #2f2f2f !important;
                background: transparent !important;
                font-family: 'Fira Sans Condensed', sans-serif !important;
            }

    .changelog-body img {
        max-width: 100% !important;
    }

    .changelog-body ul,
    .changelog-body ol {
        font-size: 14px !important;
        font-weight: 400 !important;
        color: #2f2f2f !important;
        background: transparent !important;
        margin: 0px !important;
    }

    .changelog-body a {
        color: #2F2F2F;
        text-decoration: underline;
    }

.go-back-btn {
    background: transparent;
    color: #2F2F2F;
    border: 1px solid #767676;
    border-radius: 4px;
    height: 37px;
    padding: 9px 24px;
    font-size: 14px;
    font-weight: 400;
    cursor: pointer;
    margin-bottom: 100px;
}

    .go-back-btn:hover {
        background: #FFD88C;
        border: none;
    }

.not-found-box {
    padding: 60px 0;
    text-align: center;
    color: #6a6c70;
}

@media (max-width: 640px) {
    .release-detail-section {
        padding: 100px 0px 0px;
    }

    .release-header-row {
        flex-direction: column;
    }

    .refresh-indicator {
        margin-left: 0;
    }
}

.remove span.disabled {
    cursor: not-allowed !important;
}

.cart-line-wrapper {
    position: relative !important;
    display: block;
    width: 100%;
    overflow: hidden;
    border-radius: 12px;
}

.cart-line-saving-overlay {
    position: absolute !important;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.30); /* more transparent */
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-weight: 500;
    color: #2F2F2F;
    pointer-events: all;
}

.cart-item-card.has-header-row {
    height: auto;
}

.cart-header-row {
    height: auto;
}

    .cart-header-row .remove {
        visibility: hidden;
    }

    .cart-header-row .details {
        flex-direction: row;
        align-items: center;
        padding: 0 12px;
        gap: 0;
    }

    .cart-header-row .type {
        min-height: auto;
    }

    .cart-header-row .qty-box-wrapper {
        height: auto;
        padding: 0 8px;
        align-items: center;
    }

    .cart-header-row .item-price {
        height: auto;
    }

    .cart-header-row .cart-header-text {
        font-weight: 400;
        font-size: 13px;
        color: #B0B0B0;
    }

    .cart-header-row .details {
        flex-direction: row;
        align-items: center;
        padding: 0 12px;
        gap: 0;
    }

    .cart-header-row .type,
    .cart-header-row .qty-pill-section,
    .cart-header-row .item-price {
        justify-content: center;
        text-align: center;
    }

    .cart-header-row .cart-header-text {
        font-weight: 400;
        font-size: 12px;
        color: #B3B3B3;
        line-height: 15px;
    }

@media (max-width: 768px) {
    .cart-header-row {
        display: none;
    }
}

.cart-item-card.has-header-row .item-price {
    height: auto;
    flex-direction: column;
    justify-content: center;
}

.cart-item-card.has-header-row .item-price-discount {
    position: static;
    width: auto;
    transform: none;
    margin-top: 2px;
}

.active-filters-bar {
    display: flex;
    align-items: flex-start;
    flex-wrap: nowrap;
    gap: 15px;
    background: #FFF4DD;
    border-radius: 6px;
    padding: 10px;
    margin-top: 50px;
    margin-bottom: 50px;
}

.active-filters-label {
    font-weight: 700;
    color: #767676;
    font-size: 14px;
    line-height: 19px;
    white-space: nowrap;
    flex-shrink: 0;
}

.active-filter-groups {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    flex: 1;
    min-width: 0;
    gap: 16px;
    align-items: start;
}

.active-filter-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
    max-width: 100%;
    position: relative;
}

    .active-filter-group:not(:first-child)::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: -15px;
        width: 1px;
        background-color: #B3B3B3;
        pointer-events: none;
    }

.active-filter-group-label {
    font-size: 14px;
    color: #767676;
    line-height: 19px;
}

.active-filter-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    min-width: 0;
}

.active-filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: #FFD88C;
    border: 1px solid #ED9D00;
    border-radius: 32px;
    padding: 5px 15px;
    font-size: 14px;
    font-weight: 400;
    color: #2F2F2F;
}

.chip-remove-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    color: #2F2F2F;
    flex-shrink: 0;
}

.active-filter-more-btn {
    display: inline-flex;
    align-items: center;
    background: #FFD88C;
    border: 1px solid #ED9D00;
    border-radius: 32px;
    padding: 5px 15px;
    font-size: 14px;
    font-weight: 400;
    color: #2F2F2F;
    cursor: pointer;
}

.filter-pill-wrapper {
    flex-shrink: 0;
}

.filter-bar .pill {
    white-space: nowrap;
}

    .filter-bar .pill .pill-text {
        display: inline-block;
        max-width: 220px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        vertical-align: middle;
    }

.agency-search-popup {
    display: flex;
    flex-direction: column;
    min-width: 358px !important;
}

.agency-search-input {
    margin: 0 0 8px 0;
    padding: 6px 10px;
    border: 1px solid #DDD;
    border-radius: 6px;
    font-size: 14px;
    width: 100%;
    box-sizing: border-box;
}

    .agency-search-input:focus-visible {
        outline: none !important;
    }

.agency-options-scroll {
    max-height: 220px;
    overflow-y: auto;
}

.agency-no-results {
    color: #999;
    font-size: 13px;
    padding: 6px 0;
}

@media (max-width: 768px) {
    .active-filters-bar {
        flex-direction: column;
        margin-bottom: 74px;
        margin-top: 0;
    }

    .active-filter-groups {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .active-filter-group {
        padding-right: 0;
    }

        .active-filter-group:not(:first-child)::before {
            display: none;
        }

    .agency-search-popup {
        min-width: 100% !important;
    }
}
.important-notice {
    display: flex;
    align-items: stretch;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    margin: 0 0 25px 0;
    padding: 0;
    overflow: hidden;
    border-radius: 10px;
    background-color: #fff5e5;
    color: #263746;
}

.important-notice-icon {
    flex: 0 0 54px;
    width: 54px;
    min-width: 54px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ffda91;
}

    .important-notice-icon svg {
        display: block;
        width: 26px;
        height: 26px;
    }

.important-notice-content {
    flex: 1 1 0;
    min-width: 0;
    padding: 12px 18px;
    box-sizing: border-box;
}

.important-notice-heading {
    margin: 0 0 5px 0;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.important-notice-content p {
    margin: 0;
    padding: 0;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.5;
    white-space: normal;
    overflow-wrap: anywhere;
}

.important-notice-content a {
    color: inherit;
    text-decoration: underline;
    font-weight: 600;
}

    .important-notice-content a:hover {
        text-decoration: none;
    }

@@media (max-width: 576px) {
    .important-notice-icon {
        flex-basis: 44px;
        width: 44px;
        min-width: 44px;
    }

    .important-notice-content {
        padding: 10px 12px;
    }

    .important-notice-heading {
        font-size: 12px;
    }

    .important-notice-content p {
        font-size: 12px;
        line-height: 1.45;
    }
}

.notice-link {
    color: inherit;
    font-weight: 700;
    text-decoration: underline;
}

    .notice-link:hover {
        text-decoration: none;
    }