:root,
.css-light-theme {
    --color-primary: 3, 94, 184;
    --color-on-primary: 255, 255, 255;
    --color-primary-container: 199, 228, 255;
    --color-on-primary-container: 0, 21, 75;
    --color-primary-fixed: 199, 228, 255;
    --color-on-primary-fixed: 0, 21, 75;
    --color-primary-fixed-variant: 154, 203, 255;
    --color-on-primary-fixed-variant: 0, 67, 154;
    --color-inverse-primary: 154, 203, 255;
    --color-secondary: 84, 98, 115;
    --color-on-secondary: 255, 255, 255;
    --color-secondary-container: 212, 227, 247;
    --color-on-secondary-container: 16, 27, 41;
    --color-secondary-fixed: 212, 227, 247;
    --color-on-secondary-fixed: 16, 27, 41;
    --color-secondary-fixed-variant: 186, 201, 220;
    --color-on-secondary-fixed-variant: 60, 73, 89;
    --color-tertiary: 45, 108, 108;
    --color-on-tertiary: 255, 255, 255;
    --color-tertiary-container: 175, 239, 238;
    --color-on-tertiary-container: 0, 34, 34;
    --color-tertiary-fixed: 175, 239, 238;
    --color-on-tertiary-fixed: 0, 34, 34;
    --color-tertiary-fixed-variant: 150, 213, 212;
    --color-on-tertiary-fixed-variant: 12, 82, 82;
    --color-quaternary: 110, 85, 122;
    --color-on-quaternary: 255, 255, 255;
    --color-quaternary-container: 242, 213, 255;
    --color-on-quaternary-container: 37, 15, 47;
    --color-quaternary-fixed: 242, 213, 255;
    --color-on-quaternary-fixed: 37, 15, 47;
    --color-quaternary-fixed-variant: 215, 187, 228;
    --color-on-quaternary-fixed-variant: 85, 61, 95;
    --color-error: 180, 19, 6;
    --color-on-error: 255, 255, 255;
    --color-error-container: 255, 210, 200;
    --color-on-error-container: 63, 0, 0;
    --color-success: 0, 119, 40;
    --color-on-success: 255, 255, 255;
    --color-success-container: 114, 255, 154;
    --color-on-success-container: 0, 36, 2;
    --color-background: 241, 249, 255;
    --color-on-background: 22, 27, 34;
    --color-surface-dark: 212, 219, 229;
    --color-surface: 241, 249, 255;
    --color-surface-light: 241, 249, 255;
    --color-on-surface: 22, 27, 34;
    --color-surface-container-1: 255, 255, 255;
    --color-surface-container-2: 238, 246, 255;
    --color-surface-container-3: 232, 239, 249;
    --color-surface-container-4: 225, 233, 243;
    --color-surface-container-5: 218, 226, 236;
    --color-inverse-surface: 43, 49, 56;
    --color-on-inverse-surface: 235, 243, 253;
    --color-surface-variant: 215, 226, 241;
    --color-on-surface-variant: 63, 73, 85;
    --color-outline: 110, 120, 134;
    --color-outline-variant: 189, 200, 215;
    --color-light-theme: 3, 94, 184;
    --color-dark-theme: 154, 203, 255;
}

.css-dark-theme {
    --color-primary: 154, 203, 255;
    --color-on-primary: 0, 43, 115;
    --color-primary-container: 0, 67, 154;
    --color-on-primary-container: 199, 228, 255;
    --color-primary-fixed: 199, 228, 255;
    --color-on-primary-fixed: 0, 21, 75;
    --color-primary-fixed-variant: 154, 203, 255;
    --color-on-primary-fixed-variant: 0, 67, 154;
    --color-inverse-primary: 3, 94, 184;
    --color-secondary: 186, 201, 220;
    --color-on-secondary: 37, 49, 64;
    --color-secondary-container: 60, 73, 89;
    --color-on-secondary-container: 212, 227, 247;
    --color-secondary-fixed: 212, 227, 247;
    --color-on-secondary-fixed: 16, 27, 41;
    --color-secondary-fixed-variant: 186, 201, 220;
    --color-on-secondary-fixed-variant: 60, 73, 89;
    --color-tertiary: 150, 213, 212;
    --color-on-tertiary: 0, 58, 58;
    --color-tertiary-container: 12, 82, 82;
    --color-on-tertiary-container: 175, 239, 238;
    --color-tertiary-fixed: 175, 239, 238;
    --color-on-tertiary-fixed: 0, 34, 34;
    --color-tertiary-fixed-variant: 150, 213, 212;
    --color-on-tertiary-fixed-variant: 12, 82, 82;
    --color-quaternary: 215, 187, 228;
    --color-on-quaternary: 60, 38, 70;
    --color-quaternary-container: 85, 61, 95;
    --color-on-quaternary-container: 242, 213, 255;
    --color-quaternary-fixed: 242, 213, 255;
    --color-on-quaternary-fixed: 37, 15, 47;
    --color-quaternary-fixed-variant: 215, 187, 228;
    --color-on-quaternary-fixed-variant: 85, 61, 95;
    --color-error: 255, 171, 155;
    --color-on-error: 102, 0, 0;
    --color-error-container: 144, 0, 0;
    --color-on-error-container: 255, 210, 200;
    --color-success: 83, 233, 129;
    --color-on-success: 0, 62, 12;
    --color-success-container: 0, 90, 26;
    --color-on-success-container: 114, 255, 154;
    --color-background: 15, 20, 27;
    --color-on-background: 218, 226, 236;
    --color-surface-dark: 15, 20, 27;
    --color-surface: 15, 20, 27;
    --color-surface-light: 53, 59, 67;
    --color-on-surface: 218, 226, 236;
    --color-surface-container-1: 11, 16, 22;
    --color-surface-container-2: 22, 27, 34;
    --color-surface-container-3: 26, 32, 39;
    --color-surface-container-4: 38, 44, 51;
    --color-surface-container-5: 48, 54, 62;
    --color-inverse-surface: 218, 226, 236;
    --color-on-inverse-surface: 43, 49, 56;
    --color-surface-variant: 63, 73, 85;
    --color-on-surface-variant: 189, 200, 215;
    --color-outline: 137, 147, 161;
    --color-outline-variant: 63, 73, 85;
}

    .css-dark-theme img {
        filter: brightness(.9) contrast(1.1);
    }

:root {
    color-scheme: light dark;
    accent-color: rgb(var(--color-primary));
    background-color: rgb(var(--color-background));
}

body {
    font-size: 100%;
    font-family: arial, verdana, sans-serif;
}

* {
    -webkit-text-size-adjust: none;
}

@media (max-width: 600px) {
    .b2c-typescale-display-l {
        font-size: 3.5625rem;
        line-height: 4rem;
    }

    .b2c-typescale-display-m {
        font-size: 2.8125rem;
        line-height: 3.25rem;
    }

    .b2c-typescale-display-s {
        font-size: 2.25rem;
        line-height: 2.75rem;
    }

    .b2c-typescale-headline-l {
        font-size: 2rem;
        line-height: 2.5rem;
    }

    .b2c-typescale-headline-m {
        font-size: 1.75rem;
        line-height: 2.25rem;
    }

    .b2c-typescale-headline-s {
        font-size: 1.5rem;
        line-height: 2rem;
    }
}

@media (min-width: 600px) {
    .b2c-typescale-display-l {
        font-size: 4rem;
        line-height: 4.5rem;
    }

    .b2c-typescale-display-m {
        font-size: 3.5625rem;
        line-height: 4rem;
    }

    .b2c-typescale-display-s {
        font-size: 2.8125rem;
        line-height: 3.25rem;
    }

    .b2c-typescale-headline-l {
        font-size: 2.25rem;
        line-height: 2.75rem;
    }

    .b2c-typescale-headline-m {
        font-size: 2rem;
        line-height: 2.5rem;
    }

    .b2c-typescale-headline-s {
        font-size: 1.75rem;
        line-height: 2.25rem;
    }
}

@media (min-width: 1240px) {
    .b2c-typescale-display-l {
        font-size: 4.5rem;
        line-height: 5.0625rem;
    }

    .b2c-typescale-display-m {
        font-size: 4rem;
        line-height: 4.5rem;
    }

    .b2c-typescale-display-s {
        font-size: 3.5625rem;
        line-height: 4rem;
    }

    .b2c-typescale-headline-l {
        font-size: 2.8125rem;
        line-height: 3.25rem;
    }

    .b2c-typescale-headline-m {
        font-size: 2.25rem;
        line-height: 2.75rem;
    }

    .b2c-typescale-headline-s {
        font-size: 2rem;
        line-height: 2.5rem;
    }
}

.myFullScreen_module {
    position: relative;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    overflow: auto;
}

    .myFullScreen_module.css-popupwindow-mainframe {
        position: fixed;
        width: 100%;
        height: 100%;
    }

.b2c-layout {
    --layout-col-width-l: var(--layout-col-width) * 2 + var(--layout-col-gap) * 1;
    width: 100%;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    grid-gap: calc(var(--layout-col-gap));
    padding: var(--layout-padding-v) calc(var(--layout-padding-h));
}

    .b2c-layout .b2c-button,
    .b2c-layout .b2c-input {
        margin: 0;
    }

.b2c-layout-col-small {
    box-sizing: border-box;
    width: calc(var(--layout-col-width));
}

.b2c-layout-col-large {
    box-sizing: border-box;
    width: calc(var(--layout-col-width-l));
}

.b2c-layout-col-full {
    box-sizing: border-box;
    width: 100%;
}

.b2c-typescale-display-l, .b2c-typescale-display-m, .b2c-typescale-display-s,
.b2c-typescale-headline-l, .b2c-typescale-headline-m, .b2c-typescale-headline-s {
    font-weight: normal;
    letter-spacing: 0;
}

.b2c-typescale-title-l {
    font-size: 1.375rem;
    font-weight: bold;
    line-height: 1.75rem;
    letter-spacing: 0;
}

.b2c-typescale-title-m {
    font-size: 1rem;
    font-weight: bold;
    line-height: 1.5rem;
    letter-spacing: 0.009375rem;
}

.b2c-typescale-title-s {
    font-size: 0.875rem;
    font-weight: bold;
    line-height: 1.25rem;
    letter-spacing: 0.00625rem;
}

.b2c-typescale-label-l {
    font-size: 0.875rem;
    font-weight: bold;
    line-height: 1.25rem;
    letter-spacing: 0.00625rem;
}

.b2c-typescale-label-m {
    font-size: 0.75rem;
    font-weight: bold;
    line-height: 1rem;
    letter-spacing: 0.03125rem;
}

.b2c-typescale-label-s {
    font-size: 0.6875rem;
    font-weight: bold;
    line-height: 1rem;
    letter-spacing: 0.03125rem;
}

.b2c-typescale-body-l {
    font-size: 1rem;
    font-weight: normal;
    line-height: 1.5rem;
    letter-spacing: 0.009375rem;
}

.b2c-typescale-body-m {
    font-size: 0.875rem;
    font-weight: normal;
    line-height: 1.25rem;
    letter-spacing: 0.015625rem;
}

.b2c-typescale-body-s {
    font-size: 0.75rem;
    font-weight: normal;
    line-height: 1rem;
    letter-spacing: 0.025rem;
}

::selection {
    background: rgb(var(--color-inverse-primary));
}

@keyframes b2c-panel-expand {
    0% {
        height: var(--panel-height-from);
        overflow: hidden;
        opacity: 0;
    }

    100% {
        height: var(--panel-height-to);
        overflow: hidden;
        opacity: 1;
    }
}

@keyframes b2c-panel-collapse {
    0% {
        height: var(--panel-height-from);
        overflow: hidden;
    }

    100% {
        height: 0;
        overflow: hidden;
    }
}

@keyframes b2c-panel-display {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.b2c-panel {
    --panel-height-from: auto;
    --panel-height-to: auto;
    background: rgb(var(--color-surface-container-2));
    color: rgb(var(--color-on-surface));
    display: flex;
    flex-direction: column;
    border: 1px solid rgb(var(--color-outline-variant));
    border-radius: 0.75rem;
}

    .b2c-panel .b2c-panel-header {
        top: 0;
        padding: 1rem;
        border-radius: 0.75rem;
        position: sticky;
        display: flex;
        z-index: 1;
        grid-gap: 1rem;
        align-items: center;
        background: rgb(var(--color-surface-container-2));
    }

        .b2c-panel .b2c-panel-header .b2c-panel-title {
            flex-grow: 1;
            overflow: hidden;
        }

        .b2c-panel .b2c-panel-header .b2c-panel-icon {
            min-width: 2.5rem;
            height: 2.5rem;
            background-size: 2.5rem;
            background-position: center;
        }

        .b2c-panel .b2c-panel-header .b2c-panel-tool-collapse {
            margin-left: auto;
            flex-shrink: 0;
            align-self: start;
        }

            .b2c-panel .b2c-panel-header .b2c-panel-tool-collapse .b2c-button-icon {
                transform: rotate(-90deg);
                transition: transform .2s ease-in-out;
            }

        .b2c-panel .b2c-panel-header ~ .b2c-panel-container {
            padding-top: 0;
        }

    .b2c-panel .b2c-panel-container {
        flex-grow: 1;
        z-index: 0;
        overflow: auto;
        animation: b2c-panel-expand .2s ease-in-out -.2s 1;
    }

    .b2c-panel .b2c-panel-footer {
        bottom: 0;
        padding: 1rem;
        position: sticky;
        display: flex;
        align-items: center;
        border-top: 1px solid rgb(var(--color-outline-variant));
    }

    .b2c-panel:not(.b2c-panel-collapsed) > .b2c-panel-header .b2c-panel-header-expanded,
    .b2c-panel.b2c-panel-collapsed > .b2c-panel-header .b2c-panel-header-collapsed {
        animation: b2c-panel-display .2s ease-in-out 1;
    }

    .b2c-panel.b2c-panel-collapsed > .b2c-panel-header .b2c-panel-header-expanded,
    .b2c-panel:not(.b2c-panel-collapsed) > .b2c-panel-header .b2c-panel-header-collapsed {
        display: none !important;
    }

    .b2c-panel.b2c-panel-collapsed > .b2c-panel-header .b2c-panel-tool-collapse .b2c-button-icon {
        transform: rotate(90deg);
    }

    .b2c-panel.b2c-panel-collapsed .b2c-panel-container {
        height: 0;
        visibility: collapse;
        animation: b2c-panel-collapse .2s ease-in-out -.2s 1;
    }

.b2c-button {
    height: 2.5rem;
    margin: 0.5rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    border: 0;
    border-radius: 1.25rem;
    outline: 0;
    box-sizing: border-box;
    position: relative;
    display: inline-flex;
    z-index: 0;
    overflow: hidden;
    justify-content: center;
    align-items: center;
    vertical-align: top;
    text-overflow: ellipsis;
    font-family: arial, verdana, sans-serif;
    background: transparent;
    color: rgb(var(--color-primary));
    cursor: pointer;
    transition: box-shadow .2s ease-out, background-color .2s ease-out;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
}

    .b2c-button .b2c-button-icon {
        width: 1.125rem;
        height: 1.125rem;
        margin-right: 0.5rem;
        flex-shrink: 0;
    }

    .b2c-button .b2c-button-overlay {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background: rgb(var(--color-primary));
        opacity: 0;
        pointer-events: none;
        -webkit-transition: opacity .2s cubic-bezier(0, 0, .2, 1);
        transition: opacity .2s cubic-bezier(0, 0, .2, 1);
    }

    .b2c-button .b2c-button-ripple {
        position: absolute;
        top: 0;
        left: 0;
        border-radius: 200vh;
        background: rgba(var(--color-primary), .1);
        opacity: 0;
        pointer-events: none;
        -webkit-transform: scale(0);
        transform: scale(0);
        -webkit-transition: -webkit-transform cubic-bezier(0, 0, .2, 1) .4s, opacity linear .1s;
        transition: transform cubic-bezier(0, 0, .2, 1) .4s, opacity linear .1s;
    }

    .b2c-button:hover .b2c-button-overlay {
        opacity: .08;
    }

    .b2c-button:focus {
        outline: 0;
    }

        .b2c-button:focus .b2c-button-overlay {
            opacity: .1;
        }

    .b2c-button:active .b2c-button-overlay {
        opacity: .1;
    }

    .b2c-button:disabled {
        color: rgba(var(--color-on-surface), .38);
        cursor: not-allowed;
    }

        .b2c-button:disabled .b2c-button-overlay {
            display: none;
        }

        .b2c-button:disabled * {
            pointer-events: none;
        }

.b2c-filled-button {
    background: rgb(var(--color-primary));
    color: rgb(var(--color-on-primary));
}

    .b2c-filled-button .b2c-button-overlay {
        background: rgb(var(--color-on-primary));
    }

    .b2c-filled-button .b2c-button-ripple {
        background: rgba(var(--color-on-primary), .1);
    }

    .b2c-filled-button:hover {
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .3), 0 1px 3px 1px rgba(0, 0, 0, .15);
    }

    .b2c-filled-button:disabled {
        background: rgba(var(--color-on-surface), .12);
        box-shadow: none;
    }

.b2c-tonal-button {
    background: rgb(var(--color-secondary-container));
    color: rgb(var(--color-on-secondary-container));
}

    .b2c-tonal-button .b2c-button-overlay {
        background: rgb(var(--color-on-secondary-container));
    }

    .b2c-tonal-button .b2c-button-ripple {
        background: rgba(var(--color-on-secondary-container), .1);
    }

.b2c-outlined-button {
    border: 1px solid rgb(var(--color-outline));
}

    .b2c-outlined-button:focus {
        border-color: rgb(var(--color-primary));
    }

    .b2c-outlined-button:disabled {
        border-color: rgba(var(--color-on-surface), .12);
    }

.b2c-flat-button {
    min-width: 3rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

.b2c-button-icon-only {
    width: 2.5rem;
    min-width: unset;
    padding: 0;
}

    .b2c-button-icon-only .b2c-button-icon {
        width: 1.5rem;
        height: 1.5rem;
        margin-right: 0;
    }

.b2c-button-with-icon {
    padding-left: 1rem;
    padding-right: 1.5rem;
}

    .b2c-button-with-icon.b2c-flat-button {
        padding-left: 0.75rem;
        padding-right: 1rem;
    }

    .b2c-button-with-icon.b2c-button-next {
        margin-left: auto;
        padding-left: 1.5rem;
        padding-right: 1rem;
        flex-direction: row-reverse;
    }

        .b2c-button-with-icon.b2c-button-next .b2c-button-icon {
            margin-left: 0.5rem;
            margin-right: 0;
        }

.b2c-button-alt {
    color: rgb(var(--color-tertiary));
}

    .b2c-button-alt .b2c-button-overlay {
        background: rgb(var(--color-tertiary));
    }

    .b2c-button-alt .b2c-button-ripple {
        background: rgba(var(--color-tertiary), .1);
    }

    .b2c-button-alt.b2c-filled-button {
        background: rgb(var(--color-tertiary));
        color: rgb(var(--color-on-tertiary));
    }

        .b2c-button-alt.b2c-filled-button .b2c-button-overlay {
            background: rgb(var(--color-on-tertiary));
        }

        .b2c-button-alt.b2c-filled-button .b2c-button-ripple {
            background: rgba(var(--color-on-tertiary), .1);
        }

    .b2c-button-alt.b2c-tonal-button {
        background: rgb(var(--color-tertiary-container));
        color: rgb(var(--color-on-tertiary-container));
    }

        .b2c-button-alt.b2c-tonal-button .b2c-button-overlay {
            background: rgb(var(--color-on-tertiary-container));
        }

        .b2c-button-alt.b2c-tonal-button .b2c-button-ripple {
            background: rgba(var(--color-on-tertiary-container), .1);
        }

    .b2c-button-alt.b2c-outlined-button:focus {
        border-color: rgb(var(--color-tertiary));
    }

.b2c-button-destructive {
    color: rgb(var(--color-error));
}

    .b2c-button-destructive .b2c-button-overlay {
        background: rgb(var(--color-error));
    }

    .b2c-button-destructive .b2c-button-ripple {
        background: rgba(var(--color-error), .1);
    }

    .b2c-button-destructive.b2c-filled-button {
        background: rgb(var(--color-error));
        color: rgb(var(--color-on-error));
    }

        .b2c-button-destructive.b2c-filled-button .b2c-button-overlay {
            background: rgb(var(--color-on-error));
        }

        .b2c-button-destructive.b2c-filled-button .b2c-button-ripple {
            background: rgba(var(--color-on-error), .1);
        }

    .b2c-button-destructive.b2c-tonal-button {
        background: rgb(var(--color-error-container));
        color: rgb(var(--color-on-error-container));
    }

        .b2c-button-destructive.b2c-tonal-button .b2c-button-overlay {
            background: rgb(var(--color-on-error-container));
        }

        .b2c-button-destructive.b2c-tonal-button .b2c-button-ripple {
            background: rgba(var(--color-on-error-container), .1);
        }

    .b2c-button-destructive.b2c-outlined-button:focus {
        border-color: rgb(var(--color-error));
    }

@keyframes b2c-input-label-shake {
    0% {
        transform-origin: top left;
    }

    33% {
        transform-origin: 0.5rem top;
    }

    66% {
        transform-origin: -0.5rem top;
    }

    100% {
        transform-origin: top left;
    }
}

.b2c-input {
    /*margin: 1rem;*/
    position: relative;
    display: inline-flex;
    flex-direction: column;
    vertical-align: top;
    color: rgb(var(--color-on-surface-variant));
    transform: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    .b2c-input .b2c-input-label {
        top: 0.75rem;
        left: 1rem;
        right: auto;
        position: absolute;
        display: block;
        white-space: nowrap;
        z-index: 1;
        color: rgb(var(--color-on-surface-variant));
        pointer-events: none;
        transition: color .2s ease-in-out, transform .2s ease-in-out;
        -webkit-transform-origin: top left;
        transform-origin: top left;
    }

        .b2c-input .b2c-input-label.b2c-input-label-shake {
            animation: b2c-input-label-shake .25s 1;
        }

        .b2c-input .b2c-input-label ~ .b2c-input-wrap {
            padding-top: 1.25rem;
            padding-bottom: 0.25rem;
        }

    .b2c-input .b2c-input-wrap {
        padding: 0.75rem 1rem;
        border-radius: 0.75rem;
        box-sizing: border-box;
        position: relative;
        display: flex;
        align-items: center;
        background: rgb(var(--color-surface));
        overflow: auto;
    }

    .b2c-input .b2c-input-icon {
        top: 0.75rem;
        left: 0.75rem;
        width: 1.5rem;
        height: 1.5rem;
        position: absolute;
        flex-shrink: 0;
        z-index: 1;
        color: rgb(var(--color-on-surface-variant));
    }

        .b2c-input .b2c-input-icon ~ .b2c-input-label {
            left: 3.25rem;
        }

        .b2c-input .b2c-input-icon ~ .b2c-input-wrap {
            padding-left: 3.25rem;
        }

    .b2c-input .b2c-input-control {
        width: 100%;
        padding: 0;
        border: 0;
        border-radius: 0;
        outline: 0;
        box-sizing: border-box;
        display: block;
        flex-grow: 1;
        overflow: auto;
        font-family: arial, verdana, sans-serif;
        background: transparent;
        color: rgb(var(--color-on-surface));
        caret-color: rgb(var(--color-primary));
        transition: color .25s ease-in-out;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        -webkit-text-size-adjust: none;
    }

        .b2c-input .b2c-input-control:-webkit-autofill,
        .b2c-input .b2c-input-control:-webkit-autofill:hover,
        .b2c-input .b2c-input-control:-webkit-autofill:focus {
            -webkit-text-fill-color: rgb(var(--color-on-surface));
            -webkit-box-shadow: inset 0 0 0 200vh rgb(var(--color-surface));
            transition: background-color 2147483647s ease-in-out 0s;
        }

    .b2c-input .b2c-input-msg {
        margin-bottom: -0.25rem;
        padding: 0.25rem 1rem 0;
        box-sizing: unset;
        display: flex;
        color: rgb(var(--color-on-surface-variant));
    }

    .b2c-input .b2c-input-msg-icon {
        width: 1rem;
        height: 1rem;
        margin-right: 0.5rem;
        display: none;
        flex-shrink: 0;
    }

    .b2c-input .b2c-input-msg-text,
    .b2c-input .b2c-input-msg-err-text {
        flex-grow: 1;
    }

    .b2c-input .b2c-input-msg-err-text {
        display: none;
    }

    .b2c-input.b2c-input-active .b2c-input-label {
        -webkit-transform: translateY(-0.5rem) scale(calc(2 / 3));
        transform: translateY(-0.5rem) scale(calc(2 / 3));
    }

    .b2c-input.b2c-input-focused .b2c-input-label {
        color: rgb(var(--color-primary));
    }

    .b2c-input .b2c-input-wrap:before {
        content: '';
        inset: 0;
        border: 1px solid rgb(var(--color-outline));
        border-radius: 0.75rem;
        box-sizing: content-box;
        position: absolute;
        pointer-events: none;
        transition: border .2s ease-in-out;
    }

    .b2c-input.b2c-input-focused .b2c-input-wrap:before {
        border-width: 2px;
        border-color: rgb(var(--color-primary));
    }

    .b2c-input.b2c-input-disabled {
        opacity: .38;
    }

        .b2c-input.b2c-input-disabled .b2c-input-control {
            cursor: unset;
        }

    .b2c-input.b2c-input-inline {
        padding: 0.75rem 1rem;
        border-radius: 0.75rem;
        box-sizing: border-box;
        display: inline-grid;
        grid-template-rows: 1fr min-content;
        grid-template-columns: 1fr min-content;
        align-items: center;
        background: rgb(var(--color-surface));
    }

        .b2c-input.b2c-input-inline .b2c-input-label {
            grid-area: 1 / 1;
            position: unset;
            white-space: normal;
        }

            .b2c-input.b2c-input-inline .b2c-input-label ~ .b2c-input-msg {
                grid-row: 2;
            }

        .b2c-input.b2c-input-inline .b2c-input-wrap {
            grid-area: 1 / 2 / span 2;
            margin-top: -50%;
            margin-bottom: -50%;
            margin-left: 1rem;
            padding: 0;
            border: none;
            border-radius: 0;
            background: unset;
        }

        .b2c-input.b2c-input-inline .b2c-input-icon {
            grid-area: 1 / 1;
            position: unset;
        }

            .b2c-input.b2c-input-inline .b2c-input-icon ~ .b2c-input-label,
            .b2c-input.b2c-input-inline .b2c-input-icon ~ .b2c-input-msg {
                margin-left: 2.5rem;
            }

        .b2c-input.b2c-input-inline .b2c-input-msg {
            grid-area: 1 / 1;
            min-height: unset;
            margin: 0;
            padding: 0;
        }

        .b2c-input.b2c-input-inline.b2c-input-active .b2c-input-label {
            -webkit-transform: none;
            transform: none;
        }

    .b2c-input.b2c-input-compact .b2c-input-label {
        display: none;
    }

    .b2c-input.b2c-input-compact .b2c-input-wrap {
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
    }

    .b2c-input.b2c-input-compact .b2c-input-icon {
        width: 1rem;
        height: 1rem;
    }

        .b2c-input.b2c-input-compact .b2c-input-icon ~ .b2c-input-wrap {
            padding-left: 2.5rem;
        }

    .b2c-input.b2c-input-compact.b2c-input-inline {
        width: auto;
        padding: 0.5rem 1rem;
        justify-items: center;
        background: transparent;
    }

        .b2c-input.b2c-input-compact.b2c-input-inline .b2c-input-icon,
        .b2c-input.b2c-input-compact.b2c-input-inline .b2c-input-msg {
            display: none;
        }

        .b2c-input.b2c-input-compact.b2c-input-inline .b2c-input-wrap {
            grid-column: 1 / -1;
            margin: 0;
            padding: 0;
        }

            .b2c-input.b2c-input-compact.b2c-input-inline .b2c-input-wrap:before {
                display: none;
            }

    .b2c-input.b2c-input-compact.b2c-combobox .b2c-input-wrap:after {
        top: 0.5rem;
    }

.b2c-validatebox.b2c-validatebox-error .b2c-input-label {
    color: rgb(var(--color-error));
}

.b2c-validatebox.b2c-validatebox-error .b2c-input-wrap:before {
    border-color: rgb(var(--color-error));
}

.b2c-validatebox.b2c-validatebox-error .b2c-input-control {
    caret-color: rgb(var(--color-error));
}

.b2c-validatebox.b2c-validatebox-error .b2c-input-msg-icon,
.b2c-validatebox.b2c-validatebox-error .b2c-input-msg-err-text {
    display: block;
    color: rgb(var(--color-error));
}

.b2c-validatebox.b2c-validatebox-error .b2c-input-msg-text {
    display: none;
}

.b2c-textbox .b2c-input-control {
    margin-right: -1rem;
    padding-right: 1rem;
    resize: none;
}

.b2c-textbox .b2c-textbox-counter {
    margin-left: 0.5rem;
    color: rgb(var(--color-on-surface-variant));
}

.b2c-maskedbox .b2c-maskedbox-wrap {
    width: calc(100% + 0.5rem);
    margin: 0 -0.25rem;
    padding: 0 0.25rem;
    box-sizing: border-box;
    position: relative;
    display: flex;
    overflow: auto;
    scrollbar-width: none;
}

    .b2c-maskedbox .b2c-maskedbox-wrap::-webkit-scrollbar {
        display: none;
    }

.b2c-maskedbox .b2c-maskedbox-mask {
    position: absolute;
    font-family: Monaco, Consolas, "Lucida Console", monospace;
    font-variant-numeric: slashed-zero tabular-nums;
    white-space: pre;
    color: rgb(var(--color-on-outline-variant));
    opacity: .32;
    pointer-events: none;
    transition: opacity .2s ease-in-out;
}

    .b2c-maskedbox .b2c-maskedbox-mask span {
        color: transparent;
    }

.b2c-maskedbox:not(.b2c-input-active) .b2c-maskedbox-mask {
    opacity: 0;
}

.b2c-maskedbox .b2c-input-control {
    width: 1rem;
    min-width: 1rem;
    flex-shrink: 0;
    z-index: 1;
    font-family: Monaco, Consolas, "Lucida Console", monospace;
    font-variant-numeric: slashed-zero tabular-nums;
}

.b2c-numbox .b2c-input-control {
    text-align: right;
    font-variant-numeric: slashed-zero tabular-nums;
}

.b2c-numbox .b2c-numbox-prefix {
    margin-right: 0.25rem;
    flex-shrink: 0;
    transition: opacity .2s ease-in-out;
}

.b2c-numbox .b2c-numbox-suffix {
    margin-left: 0.25rem;
    flex-shrink: 0;
    transition: opacity .2s ease-in-out;
}

.b2c-numbox:not(.b2c-input-inline):not(.b2c-input-active) .b2c-input-label ~ .b2c-input-wrap .b2c-numbox-prefix,
.b2c-numbox:not(.b2c-input-inline):not(.b2c-input-active) .b2c-input-label ~ .b2c-input-wrap .b2c-numbox-suffix {
    opacity: 0;
}

.b2c-combobox .b2c-input-wrap {
    padding-right: 2.5rem;
}

    .b2c-combobox .b2c-input-wrap:after {
        content: '';
        top: 0.75rem;
        right: 0.75rem;
        height: 1.5rem;
        width: 1.5rem;
        position: absolute;
        background: rgb(var(--color-on-surface-variant));
        -webkit-mask: url(../jsLibrary/jquery-easy-ui/jquery-easy-ui-1.10.6/themes/default/images/combo_arrow.png) center/contain no-repeat;
        mask: url(../jsLibrary/jquery-easy-ui/jquery-easy-ui-1.10.6/themes/default/images/combo_arrow.png) center/contain no-repeat;
    }

.b2c-combobox .b2c-combobox-value-list {
    width: calc(100% + 0.5rem);
    margin: 0 -0.25rem;
    padding: 0 0.25rem;
    box-sizing: border-box;
    display: flex;
    overflow: auto;
    scrollbar-width: none;
}

    .b2c-combobox .b2c-combobox-value-list::-webkit-scrollbar {
        display: none;
    }

.b2c-combobox .b2c-combobox-chip {
    max-width: calc(100% - 2.5rem);
    margin-right: 0.5rem;
    padding: 0 0.5rem;
    border: 1px solid rgb(var(--color-outline));
    border-radius: 0.5rem;
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    white-space: nowrap;
    background: rgb(var(--color-surface-container-5));
    color: rgb(var(--color-on-surface-variant));
}

.b2c-combobox .b2c-combobox-chip-label {
    overflow: hidden;
    text-overflow: ellipsis;
}

.b2c-combobox .b2c-combobox-chip-remove {
    width: 1.5rem;
    height: 1.5rem;
    margin: -1px -0.5rem -1px 0;
    padding: 0.5rem;
    flex-shrink: 0;
    background: rgb(var(--color-on-surface-variant));
    cursor: pointer;
    -webkit-mask: url(spritesheet_svg_simple.svg#view-icon-delete) 0 0/contain content-box no-repeat;
    mask: url(spritesheet_svg_simple.svg#view-icon-delete) 0 0/contain content-box no-repeat;
}

.b2c-combobox .b2c-input-control {
    width: 1rem;
    min-width: 1rem;
    flex-shrink: 0;
}

.b2c-combobox.b2c-input-readonly .b2c-combobox-chip,
.b2c-combobox.b2c-input-disabled .b2c-combobox-chip {
    padding-right: 0.5rem;
}

.b2c-combobox.b2c-input-readonly .b2c-combobox-chip-remove,
.b2c-combobox.b2c-input-disabled .b2c-combobox-chip-remove {
    display: none;
}

.b2c-combobox-results {
    height: 100vh;
    border-radius: 0.75rem;
    position: relative;
    flex-grow: 1;
    overflow: hidden auto;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
}

    .b2c-combobox-results .b2c-combobox-optgroup {
        margin-top: -1px;
        padding: 0.5rem 0;
        border-top: 1px solid rgb(var(--color-outline-variant));
    }

    .b2c-combobox-results .b2c-combobox-optgroup-header {
        top: -1px;
        padding: 1.125rem 0.75rem;
        position: -webkit-sticky;
        position: sticky;
        display: flex;
        z-index: 1;
        color: rgb(var(--color-on-surface-variant));
    }

    .b2c-combobox-results .b2c-combobox-optgroup-title {
        flex-grow: 1;
    }

    .b2c-combobox-results .b2c-combobox-optgroup-counter {
        margin-left: 0.75rem;
    }

    .b2c-combobox-results .b2c-combobox-option {
        padding: 0.875rem 0.75rem 0.875rem 3rem;
        position: relative;
        color: rgb(var(--color-on-surface));
        cursor: pointer;
    }

        .b2c-combobox-results .b2c-combobox-option:after {
            content: '';
            top: 1rem;
            left: 1rem;
            width: 1rem;
            height: 1rem;
            position: absolute;
            background-position-x: -1rem;
            background-repeat: repeat-y;
            -webkit-mask: url(spritesheet_svg_simple.svg#view-icon-ok) 0 0/contain no-repeat;
            mask: url(spritesheet_svg_simple.svg#view-icon-ok) 0 0/contain no-repeat;
        }

        .b2c-combobox-results .b2c-combobox-option.b2c-combobox-option-hover {
            box-shadow: inset 0 0 0 200vh rgba(var(--color-on-surface), .08);
        }

        .b2c-combobox-results .b2c-combobox-option.b2c-combobox-option-focused {
            box-shadow: inset 0 0 0 200vh rgba(var(--color-on-surface), .1);
        }

        .b2c-combobox-results .b2c-combobox-option.b2c-combobox-option-selected {
            background: rgb(var(--color-secondary-container));
        }

            .b2c-combobox-results .b2c-combobox-option.b2c-combobox-option-selected:after {
                background: linear-gradient(rgb(var(--color-on-secondary-container)), rgb(var(--color-on-secondary-container)));
                background-position-x: 0;
                transition: background-position-x .2s ease-in-out;
            }

        .b2c-combobox-results .b2c-combobox-option.b2c-combobox-option-disabled {
            background: none;
            opacity: .38;
            cursor: unset;
        }

    .b2c-combobox-results > .b2c-combobox-option:not(.b2c-combobox-option ~ .b2c-combobox-option) {
        margin-top: 0.5rem;
    }

    .b2c-combobox-results > .b2c-combobox-option:last-child {
        margin-bottom: 0.5rem;
    }

    .b2c-combobox-results.b2c-combobox-results-inline {
        height: unset;
        min-height: 4rem;
        position: fixed;
        z-index: 2147483646;
        background: rgb(var(--color-surface-container-3));
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .3), 0 2px 6px 2px rgba(0, 0, 0, .15);
    }

    .b2c-combobox-results .b2c-combobox-results-msg {
        width: 100%;
        height: 100%;
        position: absolute;
        display: flex;
        justify-content: center;
        align-items: center;
        color: rgb(var(--color-on-surface-variant));
    }

.b2c-togglebox .b2c-input-wrap {
    position: unset;
    cursor: pointer;
}

.b2c-togglebox .b2c-input-control,
.b2c-togglebox .b2c-input-control:checked {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    border-radius: 0.75rem;
    position: absolute;
    opacity: 0;
    cursor: inherit;
}

.b2c-togglebox.b2c-input-disabled .b2c-input-wrap {
    cursor: unset;
}

.b2c-togglebox.b2c-checkbox,
.b2c-togglebox.b2c-radiobox {
    grid-template-columns: min-content 1fr;
}

    .b2c-togglebox.b2c-checkbox .b2c-input-icon,
    .b2c-togglebox.b2c-checkbox .b2c-input-label,
    .b2c-togglebox.b2c-checkbox .b2c-input-msg,
    .b2c-togglebox.b2c-radiobox .b2c-input-icon,
    .b2c-togglebox.b2c-radiobox .b2c-input-label,
    .b2c-togglebox.b2c-radiobox .b2c-input-msg {
        grid-column: 2;
    }

    .b2c-togglebox.b2c-checkbox .b2c-input-wrap,
    .b2c-togglebox.b2c-radiobox .b2c-input-wrap {
        grid-column: 1;
        margin-left: 0;
        margin-right: 0.75rem;
    }

.b2c-switchbox .b2c-switchbox-track {
    width: 2.75rem;
    height: 1.5rem;
    padding-right: 1.5rem;
    border-radius: 0.75rem;
    box-sizing: border-box;
    position: relative;
    background: rgb(var(--color-surface-container-5));
    transition: background-color .2s ease-in-out;
}

    .b2c-switchbox .b2c-switchbox-track:before {
        content: '';
        inset: 0;
        border: 2px solid rgb(var(--color-outline));
        border-radius: 0.75rem;
        position: absolute;
        transition: border-width .2s ease-in-out;
    }

.b2c-switchbox .b2c-switchbox-handle {
    left: 0;
    width: 1.5rem;
    height: 1.5rem;
    padding: 0.5rem;
    position: relative;
    display: block;
    transition: left .2s ease-in-out;
}

    .b2c-switchbox .b2c-switchbox-handle:before {
        content: '';
        inset: 0.375rem;
        border-radius: 50%;
        position: absolute;
        background: rgb(var(--color-outline));
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .3), 0 1px 3px 1px rgba(0, 0, 0, .15);
        transition: background-color .2s ease-in-out, box-shadow .2s ease-in-out, inset .2s ease-in-out;
    }

    .b2c-switchbox .b2c-switchbox-handle .b2c-switchbox-handle-icon {
        width: 100%;
        height: 100%;
        display: block;
        background-position-x: -0.625rem;
        background-repeat: repeat-y;
        -webkit-mask: url(spritesheet_svg_simple.svg#view-icon-ok) 0 0/contain no-repeat;
        mask: url(spritesheet_svg_simple.svg#view-icon-ok) 0 0/contain no-repeat;
    }

.b2c-switchbox.b2c-input-disabled .b2c-switchbox-handle:before {
    box-shadow: none;
}

.b2c-switchbox .b2c-input-control:checked ~ .b2c-switchbox-track {
    background: rgb(var(--color-primary));
}

    .b2c-switchbox .b2c-input-control:checked ~ .b2c-switchbox-track:before {
        border-width: 0;
    }

    .b2c-switchbox .b2c-input-control:checked ~ .b2c-switchbox-track .b2c-switchbox-handle {
        left: 100%;
    }

        .b2c-switchbox .b2c-input-control:checked ~ .b2c-switchbox-track .b2c-switchbox-handle:before {
            inset: 0.125rem;
            background: rgb(var(--color-on-primary));
        }

    .b2c-switchbox .b2c-input-control:checked ~ .b2c-switchbox-track .b2c-switchbox-handle-icon {
        background-image: linear-gradient(rgb(var(--color-on-primary-container)), rgb(var(--color-on-primary-container)));
        background-position-x: 0;
        transition: background-position-x .2s ease-in-out;
    }

.b2c-checkbox .b2c-checkbox-box {
    width: 1.25rem;
    height: 1.25rem;
    padding: 0.25rem;
    border: 2px solid rgb(var(--color-on-surface-variant));
    border-radius: 0.375rem;
    box-sizing: border-box;
    position: relative;
    transition: background-color .1s ease-in-out, border-color .1s ease-in-out;
}

    .b2c-checkbox .b2c-checkbox-box:before,
    .b2c-checkbox .b2c-checkbox-box:after {
        content: '';
        top: calc(0.25rem - 2px);
        bottom: calc(0.25rem - 2px);
        left: calc(0.25rem - 2px);
        right: calc(0.25rem - 2px);
        position: absolute;
        background-position-x: -0.75rem;
        background-repeat: repeat-y;
    }

    .b2c-checkbox .b2c-checkbox-box:before {
        -webkit-mask: url('spritesheet_svg_simple.svg#view-icon-remove') 0 0/contain no-repeat;
        mask: url('spritesheet_svg_simple.svg#view-icon-remove') 0 0/contain no-repeat;
    }

    .b2c-checkbox .b2c-checkbox-box:after {
        -webkit-mask: url('spritesheet_svg_simple.svg#view-icon-ok') 0 0/contain no-repeat;
        mask: url('spritesheet_svg_simple.svg#view-icon-ok') 0 0/contain no-repeat;
    }

.b2c-checkbox .b2c-input-control:indeterminate ~ .b2c-checkbox-box,
.b2c-checkbox .b2c-input-control:checked ~ .b2c-checkbox-box {
    border-color: transparent;
    background: rgb(var(--color-primary));
}

    .b2c-checkbox .b2c-input-control:indeterminate ~ .b2c-checkbox-box:before,
    .b2c-checkbox .b2c-input-control:checked ~ .b2c-checkbox-box:after {
        background: linear-gradient(rgb(var(--color-on-primary)), rgb(var(--color-on-primary)));
        background-position-x: 0;
        transition: background-position-x .2s ease-in-out;
    }

.b2c-calendar {
    min-width: 19rem;
    min-height: 22rem;
    padding: 0.75rem;
    border-radius: 1rem;
    position: relative;
    display: flex;
    flex-direction: column;
    background: rgb(var(--color-surface-container-4));
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
}

    .b2c-calendar .b2c-calendar-nav {
        margin-bottom: 0.5rem;
        display: grid;
        grid-auto-flow: column;
        justify-content: end;
        align-items: center;
    }

        .b2c-calendar .b2c-calendar-nav .b2c-calendar-nav-title {
            min-width: 6rem;
            position: absolute;
        }

            .b2c-calendar .b2c-calendar-nav .b2c-calendar-nav-title .b2c-calendar-nav-month {
                padding-right: 0.5rem;
            }

        .b2c-calendar .b2c-calendar-nav .b2c-calendar-nav-prev,
        .b2c-calendar .b2c-calendar-nav .b2c-calendar-nav-next {
            margin: 0;
        }

    .b2c-calendar .b2c-calendar-datepicker,
    .b2c-calendar .b2c-calendar-monthpicker {
        flex-grow: 1;
        outline: none;
        display: grid;
        color: rgb(var(--color-on-surface));
    }

    .b2c-calendar .b2c-calendar-datepicker {
        grid-template-columns: repeat(7, 1fr);
        grid-template-rows: repeat(7, 1fr);
    }

    .b2c-calendar .b2c-calendar-monthpicker {
        grid-template-rows: repeat(4, 1fr);
        grid-template-columns: repeat(3, 1fr);
    }

    .b2c-calendar .b2c-calendar-weekday,
    .b2c-calendar .b2c-calendar-day,
    .b2c-calendar .b2c-calendar-day-label,
    .b2c-calendar .b2c-calendar-month,
    .b2c-calendar .b2c-calendar-month .b2c-calendar-month-label {
        box-sizing: border-box;
        position: relative;
        display: inline-flex;
        justify-content: center;
        align-items: center;
    }

    .b2c-calendar .b2c-calendar-day-label {
        width: 2.25rem;
        height: 2.25rem;
        border-radius: 50%;
    }

    .b2c-calendar .b2c-calendar-month .b2c-calendar-month-label {
        width: 4.5rem;
        height: 2.5rem;
        border-radius: 1.25rem;
    }

    .b2c-calendar .b2c-calendar-day-label,
    .b2c-calendar .b2c-calendar-month .b2c-calendar-month-label {
        pointer-events: none;
    }

    .b2c-calendar .b2c-calendar-day:hover .b2c-calendar-day-label,
    .b2c-calendar .b2c-calendar-month:hover .b2c-calendar-month-label {
        box-shadow: inset 0 0 0 200vh rgba(var(--color-on-surface-variant), .08);
    }

    .b2c-calendar .b2c-calendar-other-month {
        --calendar-day-opacity: .74;
        color: rgba(var(--color-on-surface-variant), var(--calendar-day-opacity, 1));
    }

    .b2c-calendar .b2c-calendar-range {
        color: rgba(var(--color-on-secondary-container), var(--calendar-day-opacity, 1));
    }

        .b2c-calendar .b2c-calendar-range:before {
            background: rgb(var(--color-secondary-container));
        }

        .b2c-calendar .b2c-calendar-range:hover .b2c-calendar-day-label {
            box-shadow: inset 0 0 0 200vh rgba(var(--color-on-secondary-container), .08);
        }

    .b2c-calendar .b2c-calendar-range-preview:after {
        border: dashed rgb(var(--color-outline-variant));
        border-width: 1px 0;
    }

    .b2c-calendar .b2c-calendar-range:before,
    .b2c-calendar .b2c-calendar-range-preview:after {
        content: '';
        top: calc(50% - 1.125rem);
        bottom: calc(50% - 1.125rem);
        left: 0;
        right: 0;
        position: absolute;
        pointer-events: none;
    }

    .b2c-calendar .b2c-calendar-range:nth-child(7n + 1):before,
    .b2c-calendar .b2c-calendar-range-preview:nth-child(7n + 1):after {
        left: -0.75rem;
    }

    .b2c-calendar .b2c-calendar-range:nth-child(7n):before,
    .b2c-calendar .b2c-calendar-range-preview:nth-child(7n):after {
        right: -0.75rem;
    }

    .b2c-calendar .b2c-calendar-range.b2c-calendar-range-start:before,
    .b2c-calendar .b2c-calendar-range-preview.b2c-calendar-range-preview-start:after {
        left: calc(50% - 1.125rem);
        border-left-width: 1px;
        border-top-left-radius: 1.125rem;
        border-bottom-left-radius: 1.125rem;
    }

    .b2c-calendar .b2c-calendar-range.b2c-calendar-range-end:before,
    .b2c-calendar .b2c-calendar-range-preview.b2c-calendar-range-preview-end:after {
        right: calc(50% - 1.125rem);
        border-right-width: 1px;
        border-top-right-radius: 1.125rem;
        border-bottom-right-radius: 1.125rem;
    }

    .b2c-calendar .b2c-calendar-today .b2c-calendar-day-label {
        border: 1px solid rgb(var(--color-primary));
        color: rgba(var(--color-primary), var(--calendar-day-opacity, 1));
    }

    .b2c-calendar .b2c-calendar-today.b2c-calendar-selected .b2c-calendar-day-label {
        border-color: rgb(var(--color-on-primary));
        color: rgba(var(--color-on-primary), var(--calendar-day-opacity, 1));
    }

    .b2c-calendar .b2c-calendar-today:hover .b2c-calendar-day-label {
        box-shadow: inset 0 0 0 200vh rgba(var(--color-primary), .08);
    }

    .b2c-calendar .b2c-calendar-holiday {
        color: rgba(var(--color-error), var(--calendar-day-opacity, 1));
    }

        .b2c-calendar .b2c-calendar-holiday.b2c-calendar-selected {
            color: rgba(var(--color-on-error), var(--calendar-day-opacity, 1));
        }

    .b2c-calendar .b2c-calendar-selected {
        color: rgba(var(--color-on-primary), var(--calendar-day-opacity, 1));
    }

        .b2c-calendar .b2c-calendar-selected .b2c-calendar-month-label,
        .b2c-calendar .b2c-calendar-selected .b2c-calendar-day-label {
            background: rgb(var(--color-primary));
        }

        .b2c-calendar .b2c-calendar-selected:hover .b2c-calendar-month-label,
        .b2c-calendar .b2c-calendar-selected:hover .b2c-calendar-day-label {
            box-shadow: inset 0 0 0 200vh rgba(var(--color-on-primary), .08);
        }

    .b2c-calendar .b2c-calendar-disabled .b2c-calendar-day-label {
        opacity: .38;
    }

    .b2c-calendar .b2c-calendar-disabled:hover .b2c-calendar-day-label {
        box-shadow: none;
    }

    .b2c-calendar.b2c-calendar-month-mode .b2c-calendar-nav .b2c-calendar-nav-title .b2c-calendar-nav-month,
    .b2c-calendar.b2c-calendar-month-mode .b2c-calendar-datepicker,
    .b2c-calendar:not(.b2c-calendar-month-mode) .b2c-calendar-monthpicker {
        display: none;
    }

    .b2c-calendar .b2c-calendar-focused .b2c-calendar-day-label,
    .b2c-calendar .b2c-calendar-focused .b2c-calendar-month-label {
        box-shadow: inset 0 0 0 200vh rgba(var(--color-on-surface-variant), .1);
    }

    .b2c-calendar .b2c-calendar-range.b2c-calendar-focused .b2c-calendar-day-label {
        box-shadow: inset 0 0 0 200vh rgba(var(--color-on-primary-container), .1);
    }

    .b2c-calendar .b2c-calendar-today.b2c-calendar-focused .b2c-calendar-day-label {
        box-shadow: inset 0 0 0 200vh rgba(var(--color-primary), .1);
    }

    .b2c-calendar .b2c-calendar-selected.b2c-calendar-focused .b2c-calendar-month-label,
    .b2c-calendar .b2c-calendar-selected.b2c-calendar-focused .b2c-calendar-day-label {
        box-shadow: inset 0 0 0 200vh rgba(var(--color-on-primary), .1);
    }

    .b2c-calendar.b2c-calendar-inline {
        position: fixed;
        z-index: 2147483646;
    }

.b2c-timepicker {
    min-width: 19rem;
    min-height: 26.25rem;
    padding: 1.5rem;
    border-radius: 1rem;
    position: relative;
    display: flex;
    flex-direction: column;
    background: rgb(var(--color-surface-container-4));
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
}

    .b2c-timepicker .b2c-timepicker-nav {
        height: 5rem;
        margin-bottom: 2.25rem;
        display: grid;
        grid-template-columns: 7.125rem 1.5rem 7.125rem;
        justify-content: center;
        align-items: center;
        text-align: center;
        font-variant-numeric: slashed-zero tabular-nums;
        color: rgb(var(--color-on-surface));
    }

        .b2c-timepicker .b2c-timepicker-nav .b2c-timepicker-nav-hour,
        .b2c-timepicker .b2c-timepicker-nav .b2c-timepicker-nav-minute {
            border-radius: 0.5rem;
            background: rgb(var(--color-surface-container-5));
        }

    .b2c-timepicker .b2c-timepicker-clock {
        width: 16rem;
        height: 16rem;
        margin: auto;
        border-radius: 50%;
        outline: none;
        position: relative;
        color: rgb(var(--color-on-surface));
        background: rgb(var(--color-surface-container-5));
    }

        .b2c-timepicker .b2c-timepicker-clock:after {
            content: '';
            top: 7.75rem;
            left: 7.75rem;
            width: 0.5rem;
            height: 0.5rem;
            border-radius: 50%;
            position: absolute;
            background: rgb(var(--color-primary));
        }

    .b2c-timepicker .b2c-timepicker-hour,
    .b2c-timepicker .b2c-timepicker-minute {
        top: 6.5rem;
        left: 6.5rem;
        width: 3rem;
        height: 3rem;
        box-sizing: border-box;
        position: absolute;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        z-index: 1;
        transform: rotate(calc(var(--clock-number) * 30deg)) translateY(-6.25rem) rotate(calc(var(--clock-number) * -30deg));
        pointer-events: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -webkit-touch-callout: none;
    }

        .b2c-timepicker .b2c-timepicker-hour.b2c-timepicker-hour-inner {
            transform: rotate(calc(var(--clock-number) * 30deg)) translateY(-4.5rem) rotate(calc(var(--clock-number) * -30deg));
        }

    .b2c-timepicker .b2c-timepicker-handle {
        --clock-value: 0;
        bottom: calc(8rem + 1px);
        left: calc(8rem - 1px);
        height: calc(4.75rem + clamp(0, var(--clock-value) - 11, 1) * -1.75rem);
        border: 1px solid rgb(var(--color-primary));
        position: absolute;
        box-sizing: content-box;
        transform-origin: bottom;
        transform: rotate(calc(var(--clock-value) * 30deg));
    }

        .b2c-timepicker .b2c-timepicker-handle:after {
            content: '';
            top: calc(-3rem + 1px);
            left: -1.5rem;
            width: 3rem;
            height: 3rem;
            border: 1.5rem solid rgb(var(--color-primary));
            border-radius: 50%;
            position: absolute;
            box-sizing: border-box;
            pointer-events: none;
        }

    .b2c-timepicker .b2c-timepicker-selected {
        color: rgb(var(--color-on-primary));
    }

    .b2c-timepicker:not(.b2c-timepicker-minute-mode) .b2c-timepicker-nav .b2c-timepicker-nav-hour,
    .b2c-timepicker.b2c-timepicker-minute-mode .b2c-timepicker-nav .b2c-timepicker-nav-minute {
        background: rgb(var(--color-primary-container));
        color: rgb(var(--color-on-primary-container));
    }

    .b2c-timepicker.b2c-timepicker-minute-mode .b2c-timepicker-hour,
    .b2c-timepicker:not(.b2c-timepicker-minute-mode) .b2c-timepicker-minute {
        display: none;
    }

    .b2c-timepicker.b2c-timepicker-minute-mode .b2c-timepicker-handle {
        height: 4.75rem;
        transform: rotate(calc(var(--clock-value) * 6deg));
    }

        .b2c-timepicker.b2c-timepicker-minute-mode .b2c-timepicker-handle:not(.b2c-timepicker-minute.b2c-timepicker-selected ~ .b2c-timepicker-handle):after {
            border-width: 1.375rem;
        }

    .b2c-timepicker.b2c-timepicker-inline {
        position: fixed;
        z-index: 2147483646;
    }

        .b2c-timepicker.b2c-timepicker-inline.b2c-timepicker-nav {
            display: none;
        }

@keyframes b2c-dialog-open {
    0% {
        opacity: 0;
        transform: scale(.8);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

.b2c-dialog {
    top: 0;
    left: 0;
    position: fixed;
    z-index: 2147483646;
    transform: translateX(calc(50vw - 50%)) translateY(calc(50vh - 50%));
}

    .b2c-dialog .b2c-dialog-container {
        min-width: calc(min(100vw, 280px));
        max-width: calc(min(100vw - 96px, 560px));
        max-height: calc(min(100vh - 96px, 560px));
        border-radius: 1.75rem;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        background: rgb(var(--color-surface-container-4));
        animation: b2c-dialog-open .1s ease-in-out 1;
    }

    .b2c-dialog .b2c-dialog-header {
        padding: 1.5rem 1.5rem 0;
        display: flex;
        flex-direction: column;
    }

    .b2c-dialog .b2c-dialog-icon {
        width: 1.5rem;
        height: 1.5rem;
        margin-bottom: 1rem;
        align-self: center;
        color: rgb(var(--color-secondary));
    }

        .b2c-dialog .b2c-dialog-icon ~ .b2c-dialog-title {
            text-align: center;
        }

    .b2c-dialog .b2c-dialog-title {
        color: rgb(var(--color-on-surface));
    }

    .b2c-dialog .b2c-dialog-body {
        padding: 1rem 1.5rem;
        box-sizing: border-box;
        flex-grow: 1;
        overflow: auto;
        color: rgb(var(--color-on-surface-variant));
    }

        .b2c-dialog .b2c-dialog-body .b2c-layout {
            padding: 0;
        }

    .b2c-dialog .b2c-dialog-footer {
        padding: 0.5rem 1.5rem 1.5rem;
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(3rem, 1fr));
        grid-gap: 0.5rem;
    }

    .b2c-dialog .b2c-dialog-btn {
        margin: 0;
    }

    .b2c-dialog .b2c-dialog-scrim {
        top: -50vh;
        bottom: -50vh;
        left: -50vw;
        right: -50vw;
        position: fixed;
        z-index: -1;
        background: rgba(0, 0, 0, .32);
        transition: opacity .1s ease-in-out;
    }

    .b2c-dialog.b2c-dialog-closed {
        pointer-events: none;
    }

        .b2c-dialog.b2c-dialog-closed .b2c-dialog-container {
            opacity: 0;
            transition: opacity .1s ease-in-out;
            animation: none;
        }

        .b2c-dialog.b2c-dialog-closed .b2c-dialog-scrim {
            opacity: 0;
            pointer-events: none;
        }

    .b2c-dialog hr {
        border-color: rgb(var(--color-outline));
    }

.b2c-combobox-dialog .b2c-dialog-header,
.b2c-datebox-dialog .b2c-dialog-header {
    padding: 1rem 1.5rem 0.75rem;
    border-bottom: 1px solid rgb(var(--color-outline-variant));
    color: rgb(var(--color-on-surface-variant));
}

.b2c-timebox-dialog .b2c-dialog-header {
    padding: 1rem 1.5rem 0rem;
    color: rgb(var(--color-on-surface-variant));
}

    .b2c-combobox-dialog .b2c-dialog-header .b2c-dialog-title,
    .b2c-datebox-dialog .b2c-dialog-header .b2c-dialog-title,
    .b2c-timebox-dialog .b2c-dialog-header .b2c-dialog-title {
        color: rgb(var(--color-on-surface-variant));
    }

        .b2c-combobox-dialog .b2c-dialog-header .b2c-dialog-title:not(:empty),
        .b2c-datebox-dialog .b2c-dialog-header .b2c-dialog-title:not(:empty) {
            margin-bottom: 0.5rem;
        }

        .b2c-timebox-dialog .b2c-dialog-header .b2c-dialog-title:not(:empty) {
            margin-top: 0.5rem;
            margin-bottom: 0.75rem;
        }

.b2c-combobox-dialog .b2c-dialog-body,
.b2c-datebox-dialog .b2c-dialog-body,
.b2c-timebox-dialog .b2c-dialog-body {
    padding: 0;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
}

.b2c-combobox-dialog .b2c-dialog-footer,
.b2c-datebox-dialog .b2c-dialog-footer,
.b2c-timebox-dialog .b2c-dialog-footer {
    padding: 0.5rem 0.75rem;
    border-top: 1px solid rgb(var(--color-outline-variant));
}

.b2c-combobox-dialog .b2c-dialog-container {
    width: 100vw;
    height: 100vh;
}

.b2c-combobox-dialog .b2c-combobox-filter .b2c-input-wrap {
    border-radius: 1.25rem;
}

    .b2c-combobox-dialog .b2c-combobox-filter .b2c-input-wrap:before {
        display: none;
    }

.b2c-datebox-dialog .b2c-dialog-container,
.b2c-timebox-dialog .b2c-dialog-container {
    min-width: 19rem;
}

.b2c-datebox-dialog .b2c-datebox-display {
    margin-top: auto;
    font-family: Monaco, Consolas, "Lucida Console", monospace;
    font-variant-numeric: slashed-zero tabular-nums;
}

    .b2c-datebox-dialog .b2c-datebox-display:empty:before {
        content: 'YYYY-MM-DD';
        color: rgba(var(--color-on-surface-variant), .38);
    }

.b2c-datebox-dialog .b2c-datebox-picker {
    min-height: 21.5rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    background: unset;
}

.b2c-timebox-dialog .b2c-timebox-picker {
    min-height: 24.25rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    background: unset;
}

@keyframes b2c-snackbar-open {
    0% {
        opacity: 0;
        transform: scale(.8);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

.b2c-snackbar {
    bottom: 0;
    left: 0;
    min-width: calc(min(100vw - 2rem, 360px));
    margin: 1rem;
    padding: 0.875rem 1rem;
    border-radius: 0.5rem;
    box-sizing: border-box;
    position: fixed;
    display: flex;
    background: rgb(var(--color-inverse-surface));
    color: rgb(var(--color-on-inverse-surface));
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .3), 0 4px 8px 3px rgba(0, 0, 0, .15);
    animation: b2c-snackbar-open .1s ease-in-out 1;
}

    .b2c-snackbar.b2c-snackbar-closed {
        pointer-events: none;
        opacity: 0;
        transition: opacity .1s ease-in-out;
        animation: none;
    }

    .b2c-snackbar.b2c-snackbar-success {
        background: rgb(var(--color-success));
        color: rgb(var(--color-on-success));
    }

.css_compact_layout .b2c-snackbar {
    right: 0;
    min-width: unset;
    margin: 0.5rem;
}

.b2c-loading {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    position: fixed;
    z-index: 2147483647;
    background-color: rgba(0, 0, 0, .32);
    background-image: url(icons/loading.gif);
    background-repeat: no-repeat;
    background-position: center;
}

@keyframes b2c-tab-select {
    0% {
        left: 50%;
        right: 50%;
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        left: 5%;
        right: 5%;
    }
}

.b2c-tab {
    flex-shrink: 0;
    overflow-x: auto;
}

    .b2c-tab .b2c-tab-container {
        width: 100%;
        min-width: max-content;
        display: grid;
        grid-auto-columns: 1fr;
        grid-auto-flow: column;
        background: rgb(var(--color-surface-container-3));
    }

    .b2c-tab .b2c-tab-header {
        height: 3rem;
        min-width: max-content;
        margin: 0;
        padding: 0.25rem;
        border: solid rgb(var(--color-surface-variant));
        border-width: 0 0 1px;
        outline: none;
        position: relative;
        background: transparent;
        color: rgb(var(--color-on-surface-variant));
        cursor: pointer;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
    }

        .b2c-tab .b2c-tab-header .b2c-tab-title {
            text-align: center;
            white-space: nowrap;
        }

        .b2c-tab .b2c-tab-header:hover {
            color: rgb(var(--color-on-surface));
            box-shadow: inset 0 0 0 200vh rgba(var(--color-on-surface), .08);
        }

        .b2c-tab .b2c-tab-header:focus {
            color: rgb(var(--color-on-surface));
            box-shadow: inset 0 0 0 200vh rgba(var(--color-on-surface), .1);
        }

        .b2c-tab .b2c-tab-header.b2c-tab-selected {
            color: rgb(var(--color-primary));
        }

            .b2c-tab .b2c-tab-header.b2c-tab-selected:after {
                content: '';
                bottom: 0;
                left: 5%;
                right: 5%;
                border-top: 3px solid rgb(var(--color-primary));
                border-top-left-radius: 3px;
                border-top-right-radius: 3px;
                position: absolute;
                animation: b2c-tab-select .2s ease-in-out 1;
            }

            .b2c-tab .b2c-tab-header.b2c-tab-selected:hover {
                box-shadow: inset 0 0 0 200vh rgba(var(--color-primary), .08);
            }

            .b2c-tab .b2c-tab-header.b2c-tab-selected:focus {
                box-shadow: inset 0 0 0 200vh rgba(var(--color-primary), .1);
            }

.b2c-navbar {
    flex-shrink: 0;
    z-index: 1;
}

    .b2c-navbar .b2c-navbar-container {
        width: 100%;
        padding: 0 0.25rem;
        box-sizing: border-box;
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(3rem, 1fr));
        align-items: start;
        background: rgb(var(--color-surface-container-3));
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .3), 0 2px 6px 2px rgba(0, 0, 0, .15);
    }

    .b2c-navbar .b2c-navbar-header {
        margin: 0;
        padding: 0.75rem 0.25rem 1rem;
        border: none;
        outline: none;
        background: transparent;
        color: rgb(var(--color-on-surface-variant));
        cursor: pointer;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
    }

        .b2c-navbar .b2c-navbar-header .b2c-navbar-header-container {
            width: 4rem;
            margin: auto;
            padding: 0.375rem;
            border-radius: 1rem;
            box-sizing: border-box;
        }

            .b2c-navbar .b2c-navbar-header .b2c-navbar-header-container .b2c-navbar-icon {
                width: 1.25rem;
                height: 1.25rem;
                margin: auto;
                color: rgb(var(--color-on-surface));
            }

        .b2c-navbar .b2c-navbar-header .b2c-navbar-title {
            padding-top: 0.25rem;
            text-align: center;
            white-space: nowrap;
        }

        .b2c-navbar .b2c-navbar-header:hover .b2c-navbar-header-container {
            box-shadow: inset 0 0 0 200vh rgba(var(--color-on-surface), .08);
        }

        .b2c-navbar .b2c-navbar-header.b2c-navbar-selected .b2c-navbar-header-container {
            background: rgb(var(--color-secondary-container));
        }

            .b2c-navbar .b2c-navbar-header.b2c-navbar-selected .b2c-navbar-header-container .b2c-navbar-icon {
                background: rgb(var(--color-on-secondary-container));
            }

        .b2c-navbar .b2c-navbar-header.b2c-navbar-selected .b2c-navbar-title {
            color: rgb(var(--color-on-surface));
        }

.b2c-stepper {
    flex-shrink: 0;
    padding: 0 1.5rem;
    display: grid;
    grid-auto-columns: 1fr;
    grid-auto-flow: column;
    background: rgb(var(--color-surface-container-3));
    color: rgb(var(--color-on-surface-variant));
    counter-reset: step;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    .b2c-stepper .b2c-stepper-progress {
        --stepper-total: 1;
        --stepper-current: 1;
        width: 2.5rem;
        height: 2.5rem;
        margin: 0.5rem 0;
        border-radius: 50%;
        position: relative;
        display: none;
        justify-content: center;
        align-items: center;
        background: radial-gradient(closest-side circle at center, transparent calc(100% - 0.25rem), rgb(var(--color-surface-variant)) calc(100% - 0.25rem));
    }

        .b2c-stepper .b2c-stepper-progress .b2c-stepper-progress-circle {
            fill: transparent;
            stroke: rgb(var(--color-primary));
            stroke-width: 4;
            stroke-dasharray: 113.04;
            stroke-dashoffset: calc((var(--stepper-total) - var(--stepper-current)) * 113.04px / var(--stepper-total));
            transform: rotate(-90deg);
            transform-origin: center;
            transition: stroke-dashoffset .2s ease-in-out;
        }

        .b2c-stepper .b2c-stepper-progress .b2c-stepper-progress-text {
            position: absolute;
        }

    .b2c-stepper .b2c-stepper-step {
        padding: 0.5rem 1rem;
        grid-row: 1;
        flex-grow: 1;
        position: relative;
        text-align: center;
        counter-increment: step;
    }

        .b2c-stepper .b2c-stepper-step .b2c-stepper-indicator {
            width: 1.5rem;
            height: 1.5rem;
            margin: auto;
            margin-bottom: 0.5rem;
            border-radius: 50%;
            text-align: center;
            background: rgb(var(--color-primary));
            color: rgb(var(--color-on-primary));
        }

        .b2c-stepper .b2c-stepper-step .b2c-stepper-icon {
            width: 0.75rem;
            height: 0.75rem;
            margin: 0.375rem;
            position: absolute;
            -webkit-mask: url(spritesheet_svg_simple.svg#view-icon-ok) 0 0/contain no-repeat;
            mask: url(spritesheet_svg_simple.svg#view-icon-ok) 0 0/contain no-repeat;
            background: rgb(var(--color-on-primary));
        }

        .b2c-stepper .b2c-stepper-step ~ .b2c-stepper-step:before,
        .b2c-stepper .b2c-stepper-step:not(:last-child):after {
            content: '';
            position: absolute;
            top: 1.25rem;
            width: calc(50% - 1.25rem);
            border-bottom: 1px solid rgb(var(--color-primary));
        }

        .b2c-stepper .b2c-stepper-step ~ .b2c-stepper-step:before {
            left: 0;
        }

        .b2c-stepper .b2c-stepper-step:not(:last-child):after {
            right: 0;
        }

        .b2c-stepper .b2c-stepper-step.b2c-stepper-step-current .b2c-stepper-title {
            font-weight: bold;
            color: rgb(var(--color-on-surface));
        }

        .b2c-stepper .b2c-stepper-step.b2c-stepper-step-current:after,
        .b2c-stepper .b2c-stepper-step.b2c-stepper-step-current ~ .b2c-stepper-step:before,
        .b2c-stepper .b2c-stepper-step.b2c-stepper-step-current ~ .b2c-stepper-step:after {
            border-color: rgb(var(--color-outline-variant));
        }

        .b2c-stepper .b2c-stepper-step.b2c-stepper-step-current .b2c-stepper-icon,
        .b2c-stepper .b2c-stepper-step.b2c-stepper-step-current ~ .b2c-stepper-step .b2c-stepper-icon {
            line-height: 0.75rem;
            -webkit-mask: unset;
            mask: unset;
            background: unset;
        }

            .b2c-stepper .b2c-stepper-step.b2c-stepper-step-current .b2c-stepper-icon:after,
            .b2c-stepper .b2c-stepper-step.b2c-stepper-step-current ~ .b2c-stepper-step .b2c-stepper-icon:after {
                content: counter(step);
            }

        .b2c-stepper .b2c-stepper-step.b2c-stepper-step-current ~ .b2c-stepper-step {
            color: rgb(var(--color-outline));
        }

            .b2c-stepper .b2c-stepper-step.b2c-stepper-step-current ~ .b2c-stepper-step .b2c-stepper-indicator {
                background: rgb(var(--color-outline));
                color: rgb(var(--color-surface-variant));
            }

.css_compact_layout .b2c-stepper {
    grid-template-columns: auto 1fr;
}

    .css_compact_layout .b2c-stepper .b2c-stepper-progress {
        display: flex;
    }

    .css_compact_layout .b2c-stepper .b2c-stepper-step {
        align-self: center;
        text-align: left;
    }

        .css_compact_layout .b2c-stepper .b2c-stepper-step:not(.b2c-stepper-step-current),
        .css_compact_layout .b2c-stepper .b2c-stepper-step .b2c-stepper-indicator,
        .css_compact_layout .b2c-stepper .b2c-stepper-step.b2c-stepper-step-current:before,
        .css_compact_layout .b2c-stepper .b2c-stepper-step.b2c-stepper-step-current:after {
            display: none;
        }

.b2c-stepper.b2c-stepper-editing {
    padding: 0;
}

    .b2c-stepper.b2c-stepper-editing .b2c-stepper-progress,
    .b2c-stepper.b2c-stepper-editing .b2c-stepper-step:not(.b2c-stepper-step-current),
    .b2c-stepper.b2c-stepper-editing .b2c-stepper-step .b2c-stepper-indicator,
    .b2c-stepper.b2c-stepper-editing .b2c-stepper-step.b2c-stepper-step-current:before,
    .b2c-stepper.b2c-stepper-editing .b2c-stepper-step.b2c-stepper-step-current:after {
        display: none;
    }

    .b2c-stepper.b2c-stepper-editing .b2c-stepper-step.b2c-stepper-step-current .b2c-stepper-title {
        font-weight: normal;
    }

.b2c-card {
    padding: 1rem;
    border: 1px solid rgb(var(--color-outline-variant));
    border-radius: 0.75rem;
    background: rgb(var(--color-surface-container-2));
    color: rgb(var(--color-on-surface));
}

.css_desktop_layout ::-webkit-scrollbar {
    width: 16px;
    height: 16px;
}

.css_desktop_layout ::-webkit-scrollbar-track {
    background: rgba(var(--color-on-surface), .08);
    border-radius: 100px;
    border: 4px solid transparent;
    background-clip: content-box;
}

.css_desktop_layout ::-webkit-scrollbar-corner {
    background: transparent;
}

.css_desktop_layout ::-webkit-scrollbar-thumb {
    background: rgba(var(--color-primary), .32);
    border-radius: 100px;
    border: 4px solid transparent;
    background-clip: content-box;
}

    .css_desktop_layout ::-webkit-scrollbar-thumb:hover {
        background: rgba(var(--color-primary));
        background-clip: content-box;
    }

@supports not selector(::-webkit-scrollbar) {
    scrollbar-color: rgb(var(--color-primary)) rgba(var(--color-on-surface), .08);
}

/*temp style for overriding b2b style*/
hr {
    width: 100%;
    border: none;
    border-top: 1px solid rgb(var(--color-outline-variant));
}

.datagrid-wrap {
    background: transparent;
}

.datagrid-toolbar {
    padding: 0;
    background: transparent;
}

.datagrid-header, .datagrid-toolbar {
    border: none;
}

.datagrid-header, .datagrid-td-rownumber {
    background-color: unset;
}

    .datagrid-header .datagrid-cell, .datagrid-header .datagrid-cell-group {
        color: rgb(var(--color-primary));
        padding-top: 1rem;
        padding-bottom: 1rem;
        display: flex;
        align-items: center;
    }

        .datagrid-header .datagrid-cell span {
            font-size: 0.875rem;
            font-weight: bold;
            flex-grow: 1;
        }

    .datagrid-header td, .datagrid-body td, .datagrid-footer td {
        border-left: none;
        border-right: none;
        border-color: rgb(var(--color-outline-variant));
    }

        .datagrid-row-over, .datagrid-header td.datagrid-header-over {
            background: unset;
            box-shadow: inset 0 0 0 200vh rgba(var(--color-on-surface-variant), .08);
        }

.datagrid-row-selected {
    background: rgb(var(--color-secondary-container));
}

.datagrid-header-row, .datagrid-row {
    height: 3rem;
}

.datagrid-sort .datagrid-sort-icon {
    top: unset;
}

.datagrid-htable, .datagrid-btable, .datagrid-ftable {
    color: rgb(var(--color-on-surface));
}

.datagrid-cell, .datagrid-cell-group, .datagrid-header-rownumber, .datagrid-cell-rownumber {
    font-size: 0.875rem;
    font-weight: normal;
    line-height: 1.25rem;
    letter-spacing: 0.015625rem;
    text-overflow: ellipsis;
}

.datagrid-pager, .datagrid-footer-inner {
    border: none;
}

.b2c_module {
    flex-grow: 1;
    min-height: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    overflow: auto;
    background: rgb(var(--color-surface));
}

.b2c-navdrawer {
    display: flex;
    flex-direction: column;
    background: rgb(var(--color-inverse-primary));
    overflow-x: hidden;
}

.sidemenu .accordion {
    padding: 1rem 0;
    background: rgb(var(--color-inverse-primary));
}

    .sidemenu .accordion .panel {
        padding: 0 1rem;
    }

    .sidemenu .accordion .panel-last .sidemenu-tree {
        border-bottom: none;
        margin: 0;
    }

    .sidemenu .accordion .accordion-header,
    .sidemenu .accordion .accordion-header.accordion-header-selected {
        height: unset !important;
        padding: 1.125rem 1rem;
        background: rgb(var(--color-inverse-primary));
        color: rgb(var(--color-on-primary-container));
        border-radius: 1.75rem;
    }

        .sidemenu .accordion .accordion-header:hover {
            background: rgb(var(--color-inverse-primary));
            box-shadow: inset 0 0 0 200vh rgba(var(--color-on-surface-variant), .08);
        }

        .sidemenu .accordion .accordion-header.accordion-header-selected,
        .sidemenu .accordion .accordion-header.accordion-header-selected + .accordion-body .tree-node {
            box-shadow: none;
        }

            .sidemenu .accordion .accordion-header.accordion-header-selected .panel-icon,
            .sidemenu .accordion .accordion-header.accordion-header-selected .panel-title {
                color: rgb(var(--color-on-primary-container));
            }

            .sidemenu .accordion .accordion-header.accordion-header-selected .accordion-collapse {
                background: linear-gradient(rgb(var(--color-on-primary-container)), rgb(var(--color-on-primary-container)));
            }

            .sidemenu .accordion .accordion-header.accordion-header-selected + .accordion-body .tree-node-hover {
                box-shadow: inset 0 0 0 200vh rgba(var(--color-on-surface-variant), .08);
            }

            .sidemenu .accordion .accordion-header.accordion-header-selected.accordion-header-no-children {
                background: rgb(var(--color-primary));
                color: rgb(var(--color-on-primary));
            }

                .sidemenu .accordion .accordion-header.accordion-header-selected.accordion-header-no-children .panel-icon,
                .sidemenu .accordion .accordion-header.accordion-header-selected.accordion-header-no-children .panel-title {
                    color: rgb(var(--color-on-primary));
                }

                .sidemenu .accordion .accordion-header.accordion-header-selected.accordion-header-no-children .accordion-collapse {
                    background: linear-gradient(rgb(var(--color-on-primary)), rgb(var(--color-on-primary)));
                }

        .sidemenu .accordion .accordion-header .panel-title {
            color: rgb(var(--color-on-primary-container));
            height: unset;
            padding-left: 2.25rem;
            font-size: 0.875rem;
            font-weight: bold;
            line-height: 1.25rem;
            letter-spacing: 0.00625rem;
        }

        .sidemenu .accordion .accordion-header .panel-icon {
            top: 1.125rem;
            left: 1.125rem;
            width: 1.25rem;
            height: 1.25rem;
        }

        .sidemenu .accordion .accordion-header .panel-tool {
            right: 1rem;
            width: 1.5rem;
            height: 1.5rem;
            margin: -0.75rem 0;
        }

    .sidemenu .accordion .accordion-collapse {
        width: 1.5rem;
        height: 1.5rem;
        opacity: 1;
        -webkit-mask: url(../jsLibrary/jquery-easy-ui/jquery-easy-ui-1.10.6/themes/default/images/combo_arrow.png) center/contain no-repeat;
        mask: url(../jsLibrary/jquery-easy-ui/jquery-easy-ui-1.10.6/themes/default/images/combo_arrow.png) center/contain no-repeat;
        background: linear-gradient(rgb(var(--color-on-primary-container)), rgb(var(--color-on-primary-container)));
        transform: rotate(180deg);
    }

    .sidemenu .accordion .accordion-expand {
        transform: rotate(0deg);
    }

    .sidemenu .accordion .accordion-body {
        background: rgb(var(--color-inverse-primary));
    }

    .sidemenu .accordion .sidemenu-tree {
        padding: 1rem 0;
        border-bottom: 1px solid rgb(var(--color-outline));
        margin-bottom: 1rem;
    }

    .sidemenu .accordion .tree-node {
        color: rgb(var(--color-on-primary-container));
        height: unset;
        padding: 1.125rem 1rem;
        border-radius: 1.75rem;
    }

    .sidemenu .accordion .tree-indent {
        margin: 0;
        width: 2.25rem;
    }

/*#region B2C 日期范围控件 itb2cdaterange（基于 b2ccalendar） */
.b2c-input.b2c-daterange {
    position: relative;
    min-width: 12.5rem;
    vertical-align: middle;
    cursor: pointer;
}

    .b2c-input.b2c-daterange .b2c-input-wrap,
    .b2c-input.b2c-daterange .b2c-input-control {
        cursor: pointer;
    }

.b2c-daterange-picker {
    position: fixed;
    z-index: 2147483646;
    padding: 0.75rem;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    border-radius: 0.875rem;
    background: rgb(var(--color-surface-container-4));
    box-shadow: 0 0.5rem 1.5rem rgba(var(--color-shadow), .2), 0 0.125rem 0.375rem rgba(var(--color-shadow), .12);
    animation: b2c-daterange-pop 0.16s ease-out;
}

@keyframes b2c-daterange-pop {
    from {
        opacity: 0;
        transform: translateY(-0.375rem);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.b2c-daterange-picker .b2c-daterange-shortcuts {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    padding-right: 0.625rem;
    border-right: 1px solid rgba(var(--color-outline-variant), .5);
}

    .b2c-daterange-picker .b2c-daterange-shortcuts > a {
        padding: 0.25rem 0.5rem;
        cursor: pointer;
        border-radius: 2rem;
        white-space: nowrap;
        font-size: 0.8125rem;
        color: rgb(var(--color-on-surface-variant));
        text-decoration: none;
        transition: background 0.12s, color 0.12s;
    }

        .b2c-daterange-picker .b2c-daterange-shortcuts > a:hover {
            background: rgba(var(--color-primary), .08);
            color: rgb(var(--color-primary));
        }

        .b2c-daterange-picker .b2c-daterange-shortcuts > a.b2c-daterange-shortcut-often {
            color: rgb(var(--color-primary));
        }

        .b2c-daterange-picker .b2c-daterange-shortcuts > a.b2c-daterange-shortcut-reset {
            margin-top: 0.25rem;
            padding-top: 0.5rem;
            border-top: 1px dashed rgba(var(--color-outline-variant), .6);
            border-radius: 0 0 2rem 2rem;
            color: rgb(var(--color-error));
        }

            .b2c-daterange-picker .b2c-daterange-shortcuts > a.b2c-daterange-shortcut-reset:hover {
                background: rgba(var(--color-error), .08);
            }

.b2c-daterange-picker .b2c-daterange-calendars {
    display: flex;
    align-items: flex-start;
    gap: 0.375rem;
}

    .b2c-daterange-picker .b2c-daterange-calendars > .b2c-daterange-cal {
        background: unset;
    }

    /* 仅在 daterange 弹层内缩小日历本体，不影响全局 .b2c-calendar（datebox/timepicker 等其它控件） */
    .b2c-daterange-picker .b2c-calendar {
        min-width: 15.5rem;
        min-height: 18.5rem;
        padding: 0.5rem;
    }

        .b2c-daterange-picker .b2c-calendar .b2c-calendar-nav {
            margin-bottom: 0.375rem;
        }

        .b2c-daterange-picker .b2c-calendar .b2c-calendar-day-label,
        .b2c-daterange-picker .b2c-calendar .b2c-calendar-month .b2c-calendar-month-label {
            font-size: 0.8125rem;
        }
/*#endregion B2C 日期范围控件 */

    .sidemenu .accordion .tree-icon {
        height: 1.25rem;
        width: 1.25rem;
        margin: 0;
    }

    .sidemenu .accordion .tree-title {
        font-size: 0.875rem;
        font-weight: bold;
        line-height: 1.25rem;
        letter-spacing: 0.00625rem;
        margin: 0;
        padding-left: 0.75rem;
        white-space: pre-line;
        height: unset;
    }

.sidemenu .accordion-header .panel-icon {
    left: 1.25rem;
    background-size: 1.5rem;
    width: 1rem;
    height: 1rem;
    margin: 0;
}

.sidemenu .accordion .tree-node-hover {
    color: rgb(var(--color-on-primary-container));
    background: rgb(var(--color-inverse-primary));
    box-shadow: inset 0 0 0 200vh rgba(var(--color-on-surface-variant), .08);
}

.sidemenu .accordion .tree-node-selected {
    color: rgb(var(--color-on-primary));
    background: rgb(var(--color-primary));
}

.sidemenu.sidemenu-collapsed .accordion .panel {
    padding: 0.75rem;
}

.sidemenu.sidemenu-collapsed .accordion .accordion-header {
    height: 2rem !important;
    padding: 0;
}

    .sidemenu.sidemenu-collapsed .accordion .accordion-header .panel-title {
        display: none;
    }

    .sidemenu.sidemenu-collapsed .accordion .accordion-header .panel-icon {
        top: 0.375rem;
    }

.sidemenu-tooltip {
    border-radius: 0.75rem;
    overflow: hidden auto;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .3), 0 2px 6px 2px rgba(0, 0, 0, .15);
}

    .sidemenu-tooltip .sidemenu .accordion {
        padding: 0;
        border: none;
    }

        .sidemenu-tooltip .sidemenu .accordion .accordion-header:hover {
            background: rgb(var(--color-inverse-primary));
            box-shadow: none;
        }

        .sidemenu-tooltip .sidemenu .accordion .sidemenu-tree {
            border-bottom: none;
            margin: 0;
            border-top: 1px solid rgb(var(--color-outline));
        }

            .sidemenu-tooltip .sidemenu .accordion .sidemenu-tree:empty {
                padding: 0;
                border-top: none;
            }

        .sidemenu-tooltip .sidemenu .accordion .panel {
            padding: 0;
        }

        .sidemenu-tooltip .sidemenu .accordion .accordion-header .panel-title {
            padding: 0;
        }

        .sidemenu-tooltip .sidemenu .accordion .tree-node {
            border-radius: 0;
        }

.menu {
    min-width: 7rem;
    max-width: 13.75rem;
    width: auto !important;
    background-color: rgb(var(--color-inverse-primary));
    border: none;
    color: rgb(var(--color-on-primary-container));
    border-radius: 0.75rem;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .3), 0 2px 6px 2px rgba(0, 0, 0, .15);
    padding: 0.5rem 0;
}

.menu-item {
    height: unset !important;
    padding: 0.75rem;
    border: none;
    display: flex;
    align-items: center;
}

.menu-active {
    color: rgb(var(--color-on-primary-container));
    background: rgb(var(--color-inverse-primary));
    box-shadow: inset 0 0 0 200vh rgba(var(--color-on-surface-variant), .1);
}

.menu-icon {
    left: 0.75rem;
    top: 0.75rem;
    height: 1.5rem;
    width: 1.5rem;
    margin-top: 0;
}

.menu-text {
    height: unset !important;
    font-size: 0.875rem;
    font-weight: bold;
    line-height: 1.25rem !important;
    letter-spacing: 0.00625rem;
    padding-left: 2.25rem;
    flex-grow: 1;
    white-space: pre-line;
}

    .menu-text:only-child {
        padding-left: 0;
    }

.menu-rightarrow {
    width: 1.5rem;
    height: 1.5rem;
    margin-top: 0;
    margin-left: 0.75rem;
    position: relative;
    background: rgb(var(--color-on-primary-container));
    -webkit-mask: url(../jsLibrary/jquery-easy-ui/jquery-easy-ui-1.10.6/themes/default/images/menu_arrows.png) -3rem 0/cover no-repeat;
    mask: url(../jsLibrary/jquery-easy-ui/jquery-easy-ui-1.10.6/themes/default/images/menu_arrows.png) -3rem 0/cover no-repeat;
}

.menu-bottomarrow {
    width: 1.5rem;
    height: 1.5rem;
    margin-top: 0;
    margin-left: 0.75rem;
    position: relative;
    background: rgb(var(--color-on-primary-container));
    -webkit-mask: url(../jsLibrary/jquery-easy-ui/jquery-easy-ui-1.10.6/themes/default/images/menu_arrows.png) 0rem 0/cover no-repeat;
    mask: url(../jsLibrary/jquery-easy-ui/jquery-easy-ui-1.10.6/themes/default/images/menu_arrows.png) 0rem 0/cover no-repeat;
}

.menu-shadow {
    display: none !important;
}

.labelContent {
    color: rgb(var(--color-on-surface-variant));
    font-size: 0.875rem;
    font-weight: normal;
    line-height: 1.25rem;
    letter-spacing: 0.015625rem;
}

[itform] {
    display: contents;
}

.b2c_panel {
    padding: 1rem;
}

    .b2c_panel > .panel {
        color: rgb(var(--color-on-surface));
    }

        .b2c_panel > .panel > .panel-header {
            padding: 1rem;
            border: 1px solid rgb(var(--color-outline-variant));
            border-bottom-width: 0;
            background: rgb(var(--color-surface-container-2));
            color: currentColor;
            border-radius: 0.75rem 0.75rem 0 0;
        }

            .b2c_panel > .panel > .panel-header > .panel-with-icon {
                padding-left: 3.5rem;
            }

            .b2c_panel > .panel > .panel-header > .panel-icon {
                min-width: 2.5rem;
                height: 2.5rem;
                background-size: 2.5rem;
                background-position: center;
                margin-top: -0.25rem;
                top: 1rem;
                left: 1rem;
            }

            .b2c_panel > .panel > .panel-header > .panel-title {
                font-size: 1.5rem;
                font-weight: normal;
                line-height: 2rem;
                letter-spacing: 0;
                padding-bottom: 0;
                border-bottom-width: 0;
            }

        .b2c_panel > .panel > .panel-body {
            background-color: rgb(var(--color-surface-container-2));
            color: rgb(var(--color-on-surface));
            font-size: unset;
            border: 1px solid rgb(var(--color-outline-variant));
            border-top-width: 0;
            border-radius: 0 0 0.75rem 0.75rem;
            padding: 1rem;
        }

        .b2c_panel > .panel > .panel-body-noheader {
            border-top-width: 1px;
            border-radius: 0.75rem;
        }

    .b2c_panel > .panel-collapsed > .panel-header {
        border-bottom: 1px;
        border-radius: 0.75rem;
    }

.b2c_border_panel > .panel {
    color: rgb(var(--color-primary));
    border-left: 0.75rem solid currentColor;
    border-radius: 0.75rem;
}

    .b2c_border_panel > .panel > .panel-body-noheader, .b2c_border_panel > .panel > .panel-header {
        border-left-width: 0;
        border-top-left-radius: 0;
    }

    .b2c_border_panel > .panel > .panel-body {
        border-left-width: 0;
        border-bottom-left-radius: 0;
    }

.b2c_border_panel > .panel-collapsed > .panel-header {
    border-bottom: 1px solid rgb(var(--color-outline-variant));
    border-bottom-left-radius: 0;
}

.b2c_table {
    margin: 0;
    width: 100%;
    font-size: 0.875rem;
    font-weight: normal;
    line-height: 1.25rem;
    letter-spacing: 0.015625rem;
    overflow: auto;
}

    .b2c_table thead {
        border-bottom: 1px solid rgb(var(--color-outline-variant));
        color: var(--color-primary);
    }

    .b2c_table tbody tr:nth-of-type(odd) {
        background: unset;
    }

    .b2c_table tbody tr[ng-click]:hover {
        background: unset !important;
        cursor: pointer;
        box-shadow: inset 0 0 0 200vh rgb(var(--color-on-surface-variant), .08);
    }

    .b2c_table th {
        padding: 1rem;
        color: rgb(var(--color-primary));
    }

    .b2c_table td {
        padding: 1rem;
        color: rgb(var(--color-on-surface-variant));
    }

    .b2c_table tfoot {
        border-top: 1px solid rgb(var(--color-outline-variant));
    }

    .b2c_table .b2c-button {
        margin: 0;
        flex-shrink: 0;
    }

    .b2c_table .b2c_table_msg {
        text-align: center;
    }

        .b2c_table .b2c_table_msg:not(:last-child) {
            display: none;
        }

.b2c_datagrid {
    min-height: 15rem;
    height: 100%;
}

    .b2c_datagrid.b2c-card {
        padding: 0;
    }

    .b2c_datagrid .datagrid-body {
        max-height: unset;
    }

.css_compact_layout .b2c_datagrid {
    min-height: unset;
}

[data-itdept-type="itLayoutRegion"] {
    color: rgb(var(--color-on-surface));
}

.myFullScreen_module {
    display: block;
}

#uidiv_home_top {
    padding: 0 0.5rem;
    border-bottom: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-gap: 0.5rem;
    background: rgb(var(--color-surface-container-3));
    color: rgb(var(--color-on-surface));
}

    #uidiv_home_top #uibtn_sub_menu {
        color: rgb(var(--color-on-surface-variant));
    }

        #uidiv_home_top #uibtn_sub_menu .l-btn-text {
            font-size: 0.875rem;
            font-weight: bold;
            line-height: 1.25rem;
            letter-spacing: 0.00625rem;
        }

        #uidiv_home_top #uibtn_sub_menu .m-btn-downarrow {
            background: rgb(var(--color-on-surface-variant));
            -webkit-mask: url(../jsLibrary/jquery-easy-ui/jquery-easy-ui-1.10.6/themes/default/images/menu_arrows.png) 0 0/cover no-repeat;
            mask: url(../jsLibrary/jquery-easy-ui/jquery-easy-ui-1.10.6/themes/default/images/menu_arrows.png) 0 0/cover no-repeat;
        }

.module_header {
    padding: 0 0.5rem;
    background-color: unset;
}

    .module_header .module_content {
        max-width: unset !important;
    }

    .module_header div.module_bar {
        margin: 0;
        min-width: unset;
    }

    .module_header div.module_name {
        font-size: 1.375rem;
        font-weight: bold;
        line-height: 1.75rem;
        letter-spacing: 0;
        color: rgb(var(--color-on-background));
        font-family: arial, verdana, sans-serif;
        padding: 0;
    }

.css_toggle_nav_btn {
    width: 2.5rem;
    font-family: monospace;
    min-width: unset;
    margin: 0;
    font-size: 1.25rem;
    color: rgb(var(--color-on-surface));
}

.css_toggle_toolbox_btn {
    position: absolute;
    top: 0.75rem;
    right: 0.5rem;
}

.css_flow_ctrl .b2c-button {
    width: calc(var(--layout-col-width));
}

.css_compact_layout .css_flow_ctrl .b2c-button {
    width: unset;
    flex-basis: 0;
    flex-grow: 1;
}

.payment_grid_check {
    width: 1.25rem;
    height: 1.25rem;
    padding: 0.25rem;
    border: 2px solid rgb(var(--color-outline));
    border-radius: 0.375rem;
    box-sizing: border-box;
    position: relative;
    transition: background-color .1s ease-in-out, border-color .1s ease-in-out;
}

    .payment_grid_check::after {
        content: '';
        top: calc(0.25rem - 2px);
        left: calc(0.25rem - 2px);
        right: calc(0.25rem - 2px);
        bottom: calc(0.25rem - 2px);
        position: absolute;
        background-position-x: -0.75rem;
        background-repeat: repeat-y;
        -webkit-mask: url('spritesheet_svg_simple.svg#view-icon-ok') 0 0/contain no-repeat;
        mask: url('spritesheet_svg_simple.svg#view-icon-ok') 0 0/contain no-repeat;
    }

.datagrid-row-checked .payment_grid_check {
    border-color: transparent;
    background: rgb(var(--color-primary));
}

    .datagrid-row-checked .payment_grid_check:after {
        background: linear-gradient(rgb(var(--color-on-primary)), rgb(var(--color-on-primary)));
        background-position-x: 0;
        transition: background-position-x .2s ease-in-out;
    }


@media (orientation: landscape) {
    .css_mobile_layout .b2c-dialog .b2c-dialog-container.b2c-datebox-dialog-container {
        width: unset;
        height: 21.5rem;
        min-width: unset;
        max-width: calc(min(100vw - 96px, 560px));
        min-height: calc(min(100vh, 280px));
        max-height: calc(min(100vh - 96px, 560px));
        display: grid;
        grid-template-columns: auto 1fr;
        grid-gap: 0 1.5rem;
    }

    .css_mobile_layout .b2c-datebox-dialog-container .b2c-dialog-header {
        grid-area: 1 / 2;
    }

    .css_mobile_layout .b2c-datebox-dialog-container .b2c-datebox-dialog {
        grid-area: 1 / 1 / span 3;
    }

    .css_mobile_layout .b2c-datebox-dialog-container .b2c-datebox-dialog-btn {
        grid-area: 2 / 2;
    }

    .css_mobile_layout .b2c-datebox-dialog-container .b2c-dialog-footer {
        grid-area: 3 / 2;
    }
}