@import '_content/BlazorSortableList/BlazorSortableList.bundle.scp.css';

/* _content/eLipsOnline/Components/Layout/MainLayout.razor.rz.scp.css */

.topbar-right[b-bjaewfqzbd] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
}

.top-row[b-bjaewfqzbd] {
    background-color: var(--white);
    border-bottom: 1px solid var(--color-gray-200);
    justify-content: space-between;
    height: 40px;
    min-height: 40px;
    flex: 0 0 40px;
    display: flex;
    align-items: center;
    box-sizing: border-box;
}

.top-row[b-bjaewfqzbd]  a, .top-row[b-bjaewfqzbd]  .btn-link {
    white-space: nowrap;
    margin-left: 1.5rem;
    text-decoration: none;
}

    .top-row[b-bjaewfqzbd]  a:hover, .top-row[b-bjaewfqzbd]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-bjaewfqzbd]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

.top-row-left[b-bjaewfqzbd] {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #686868;
}

.top-row-right[b-bjaewfqzbd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: black;
}

    .top-row-right span[b-bjaewfqzbd] {
        padding-left: 30px;
    }


@media (max-width: 640.98px) {
    .top-row[b-bjaewfqzbd] {
        height: auto;
        min-height: 40px;
        flex: 0 0 auto;
        padding-top: 4px;
        padding-bottom: 4px;
        flex-wrap: wrap;
        align-items: center;
        gap: 4px;
    }

    .top-row-left[b-bjaewfqzbd],
    .topbar-right[b-bjaewfqzbd] {
        width: 100%;
        min-width: 0;
    }

    .top-row-left[b-bjaewfqzbd] {
        order: 2;
        justify-content: flex-start;
        gap: 6px;
    }

    .topbar-right[b-bjaewfqzbd] {
        order: 1;
    }

    .topbar-report-actions[b-bjaewfqzbd] {
        display: flex;
        min-width: 0;
        flex: 1 1 auto;
        align-items: center;
        gap: 6px !important;
    }

    .topbar-report-actions[b-bjaewfqzbd]  .k-dropdownlist {
        width: auto !important;
        min-width: 100px;
        flex: 1 1 160px;
    }

    .topbar-report-actions[b-bjaewfqzbd]  .k-button {
        flex: 0 0 auto;
    }

    .topbar-right[b-bjaewfqzbd] {
        justify-content: flex-end;
        gap: 6px;
    }

    .top-row-right span[b-bjaewfqzbd] {
        padding-left: 0;
    }

    .top-row[b-bjaewfqzbd]  a, .top-row[b-bjaewfqzbd]  .btn-link {
        margin-left: 0;
    }
}

@media (max-width: 420px) {
    .topbar-report-actions[b-bjaewfqzbd] {
        gap: 4px !important;
    }

    .topbar-report-actions[b-bjaewfqzbd]  .k-dropdownlist {
        min-width: 80px;
    }

    .topbar-right[b-bjaewfqzbd] {
        gap: 4px;
    }
}

/* Compact mobile topbar with a toggleable reports tray. */
.mobile-reports-slot[b-bjaewfqzbd] {
    display: none !important;
}

@media (max-width: 640.98px) {
    .top-row-left[b-bjaewfqzbd] {
        display: contents;
    }

    .sidebar-menu-button[b-bjaewfqzbd] {
        order: 1;
        flex: 0 0 auto;
    }

    .mobile-reports-slot[b-bjaewfqzbd] {
        order: 2;
        display: inline-flex !important;
        flex: 0 0 auto;
    }

    .mobile-reports-slot[b-bjaewfqzbd]  .mobile-reports-toggle {
        display: inline-flex !important;
        width: 32px;
        min-width: 32px;
        height: 32px;
        padding: 0;
        align-items: center;
        justify-content: center;
    }

    .mobile-reports-slot[b-bjaewfqzbd]  .mobile-reports-toggle svg {
        width: 16px;
        height: 16px;
        fill: currentColor;
    }

    .mobile-reports-slot[b-bjaewfqzbd]  .mobile-reports-toggle.is-open {
        color: var(--color-primary-700);
        background: var(--color-selected-bg);
    }

    .topbar-right[b-bjaewfqzbd] {
        order: 3;
        width: auto;
        min-width: 0;
        flex: 1 1 auto;
        justify-content: flex-end;
        gap: 6px;
    }

    .topbar-report-actions[b-bjaewfqzbd] {
        order: 4;
        display: flex;
        width: 100%;
        min-width: 0;
        max-height: 0;
        flex: 0 0 100%;
        align-items: center;
        gap: 6px !important;
        overflow: hidden;
        opacity: 0;
        pointer-events: none;
        transform: translateY(-4px);
        transition: max-height 0.25s ease, opacity 0.18s ease, transform 0.25s ease;
    }

    .topbar-report-actions.is-open[b-bjaewfqzbd] {
        max-height: 40px;
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
    }
}

@media (min-width: 641px) {
    .page[b-bjaewfqzbd] {
        flex-direction: row;
    }

    .top-row[b-bjaewfqzbd] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-bjaewfqzbd]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-bjaewfqzbd] {
/*        padding-left: 2rem !important;
        padding-right: 1.5rem !important;*/
    }

    article[b-bjaewfqzbd] {
        padding-left: 1rem !important;
/*        padding-right: 1rem !important;*/
    }

    .content-login[b-bjaewfqzbd] {
        padding-left: 0!important;
    }
}

#blazor-error-ui[b-bjaewfqzbd] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-bjaewfqzbd] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }


.profile-dd[b-bjaewfqzbd] {
    padding: 16px;
}

.rapportage-popup .k-animation-container[b-bjaewfqzbd],
.rapportage-popup[b-bjaewfqzbd] {
    z-index: 12000;
}

/*.rapportage-popup__content {*/
/*    width: 550px;*/
    /*background: #fff;
    border: 1px solid #dcdcdc;
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
    overflow: hidden;
}*/

.rapportage-popup__header[b-bjaewfqzbd] {
    padding: 14px 18px;
    font-size: 1rem;
    font-weight: 600;
    border-bottom: 1px solid #ececec;
    background: #fff;
}

.vestiging-value[b-bjaewfqzbd] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

    .vestiging-value[b-bjaewfqzbd]  .k-svg-icon {
        color: var(--color-primary-700);
        width: 14px;
        height: 14px;
    }

.vestiging-popup-header[b-bjaewfqzbd] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 5px 10px;
    font-size: var(--fs-caption);
    color: var(--color-gray-400);
    font-weight: 450;
}
/* _content/eLipsOnline/Components/Layout/NavMenu.razor.rz.scp.css */
.sidebar-main[b-3boohzv8qx] {
    position: sticky;
    width: 100%;
    height: 100vh;
        background: var(--nav-bg);
/*    background: #07244A;*/
/*        background: #004F74;*/
    transition: all 0.4s ease;
    border-right: 1px solid var(--color-gray-200);
}

    .sidebar-main.collapsed[b-3boohzv8qx] {
        width: 100%;
    }

    .sidebar-main .sidebar-header[b-3boohzv8qx] {
        display: flex;
        align-items: center;
        padding: 25px 10px 0px 12px;
        justify-content: space-between;
    }

.sidebar-header .header-logo img[b-3boohzv8qx] {
    height: 30px;
    width: 30px;
    display: block;
    object-fit: contain;
    border-radius: 50%;
}

.sidebar-header .sidebar-toggler[b-3boohzv8qx] {
    position: absolute;
    right: 10px;
    height: 37px;
    width: 40px;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
        background: var(--white);
/*    background: #305484;*/
    transition: 0.4s ease;
/*    color: white;*/
    color: var(--color-gray-800);
}

    .sidebar-header .sidebar-toggler:hover[b-3boohzv8qx] {
                background: var(--color-gray-200);
/*        background: #3F5067;*/
/*        color: white;*/
    }

.sidebar-main.collapsed .sidebar-toggler[b-3boohzv8qx] {
    transform: translate(4px, 60px);
    margin-bottom: 15px;
}

.sidebar-header .sidebar-toggler span[b-3boohzv8qx] {
    transition: 0.4s ease;
}

.sidebar-main.collapsed .sidebar-toggler span[b-3boohzv8qx] {
    transform: rotate(180deg);
}

.sidebar-nav .nav-list[b-3boohzv8qx] {
    list-style: none;
    display: flex;
    gap: 4px;
    padding: 0 2px;
    flex-direction: column;
    transform: translateY(15px);
    transition: 0.4s ease;
}

.sidebar-nav .primary-nav[b-3boohzv8qx] {
    overflow-y: auto;
    height: calc(100vh - 204px);
    padding-bottom: 50px;
    scrollbar-width: thin;
    scrollbar-color: transparent transparent;
}

    .sidebar-nav .primary-nav:hover[b-3boohzv8qx] {
        scrollbar-color: var(--nav-scrollbar-color, var(--color-gray-200)) transparent;
    }

.sidebar-main.collapsed .sidebar-nav .primary-nav[b-3boohzv8qx] {
    overflow-y: unset;
    transform: translateY(65px);
}

.sidebar-main.collapsed .nav-link[b-3boohzv8qx] {
    justify-content: center;
    padding-left: 0;
    padding-right: 0;
}

    .sidebar-main.collapsed .nav-link:active[b-3boohzv8qx] {
        padding: 10px;
        margin: 0;
    }

.sidebar-nav .secondary-nav[b-3boohzv8qx] {
    position: absolute;
    bottom: 30px;
    width: 100%;
    background: var(--nav-background, var(--nav-bg));
/*    background: #07244A;*/
}

.sidebar-nav .divider[b-3boohzv8qx] {
        border-bottom: 1px solid var(--color-gray-200);
/*    border-bottom: 1px solid #3F5067;*/
    margin: 8px 15px;
    height: 0;
    list-style: none;
}

.sidebar-main.collapsed .divider[b-3boohzv8qx] {
    margin: 8px auto;
    width: 40px;
}

/* Dropdown Styling */

.sidebar-nav .nav-item[b-3boohzv8qx] {
    position: relative;
}

.sidebar-nav .drop-container .drop-icon[b-3boohzv8qx] {
    margin: 0 0px 0 auto;
    transition: transform 0.4s ease, opacity 0.3s 0.2s ease;
}

.sidebar-main.collapsed .drop-container .drop-icon[b-3boohzv8qx] {
    transition: opacity 0.3s 0s ease;
}

.sidebar-nav .dropdown-container.open .dropdown-icon[b-3boohzv8qx] {
    transform: rotate(180deg);
}

.sidebar-nav .drop-menu[b-3boohzv8qx] {
    height: 0;
    overflow-y: hidden;
    list-style: none;
    padding-left: 15px;
    transition: height 0.4s ease;
}

.sidebar-main.collapsed .drop-menu[b-3boohzv8qx] {
    position: absolute;
    left: 100%;
    top: -12px;
    opacity: 0;
    height: auto !important;
    pointer-events: none;
    overflow-y: unset;
    padding: 4px 10px 0px 24px;
    border-radius: 0 5px 5px 0;
    background: var(--nav-dropdown-background, var(--nav-bg));
/*    background: white;
    background: #07244A;*/
    transition: 0s;
}

    .sidebar-main.collapsed .drop-menu:has(.drop-link)[b-3boohzv8qx] {
        padding: 7px 10px 7px 10px;
    }

.sidebar-main.collapsed .nav-item:hover .drop-menu[b-3boohzv8qx] {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(12px);
    transition: 0.4s ease;
}

.drop-menu .nav-item .nav-link[b-3boohzv8qx] {
    padding: 9px 15px;
}

.drop-menu .nav-item:hover .nav-link:hover:not(.drop-title)[b-3boohzv8qx] {
    color: var(--nav-dropdown-hover-color, var(--nav-hover-color));
    background: var(--nav-dropdown-hover-background, var(--nav-hover-background));
/*    background: #3F5067;
    color: white;*/
}

.sidebar-main.collapsed .drop-menu .nav-link[b-3boohzv8qx] {
    padding: 5px 15px;
}

.drop-menu .nav-item .drop-title[b-3boohzv8qx] {
    display: none;
    font-weight: 500;
    margin-left: -5px;
    color: var(--color-primary-700);
}

.drop-menu:has(.drop-link) .nav-item .drop-title[b-3boohzv8qx] {
    font-weight: 500;
}

.sidebar-main.collapsed .drop-menu .nav-item .drop-title[b-3boohzv8qx] {
    display: block;
}

/* REPSONSIVE */
@media (max-width: 768px) {
    .sidebar-main.collapsed .sidebar-header .sidebar-toggler[b-3boohzv8qx] {
        transform: none;
    }

    .sidebar-main.collapsed .sidebar-nav .primary-nav[b-3boohzv8qx] {
        transform: translateY(15px);
    }
}

.nav-link svg[b-3boohzv8qx] {
    width: 18px;
    height: 18px;
    flex: 0 0 20px;
/*    fill: white;*/
    fill: var(--color-gray-700);
    margin-left: 5px;
}

.sidebar-nav .nav-section-title[b-3boohzv8qx] {
    padding: 14px 15px 6px;
    color: var(--color-gray-500);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.09em;
    line-height: 1;
    text-transform: uppercase;
    user-select: none;
}

/* Hide section titles when the sidebar is collapsed */
.sidebar-main.collapsed .nav-section-title[b-3boohzv8qx] {
    display: none;
}

.sidebar-main[b-3boohzv8qx] {
    --nav-background: var(--nav-bg);
    --nav-border-color: var(--color-gray-200);
    --nav-text-color: var(--color-gray-700);
    --nav-title-color: var(--color-gray-900);
    --nav-section-title-color: #9a9fa9;
    --nav-divider-color: var(--color-gray-200);
    --nav-scrollbar-color: var(--color-gray-200);

    --nav-dropdown-background: var(--nav-background);
    --nav-dropdown-hover-color: var(--color-primary-700);
    --nav-dropdown-hover-background: var(--color-primary-50);
    --nav-dropdown-arrow-color: var(--color-gray-500);
    --nav-dropdown-arrow-active-color: var(--nav-active-color);

    --nav-card-background: var(--nav-card-surface);
    --nav-card-border-color: var(--color-gray-200);
    --nav-card-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);

    --nav-active-color: var(--color-primary-700);
    --nav-active-accent-color: var(--color-primary-700);

    --nav-hover-color: var(--color-primary-700);
    --nav-hover-background: var(--color-primary-50);
    --nav-hover-border-color: transparent;

    --nav-child-active-color: var(--color-primary-700);
    --nav-child-active-background: var(--color-primary-50);
    --nav-child-active-border-color: transparent;

    --nav-toggle-color: var(--color-gray-500);
    --nav-toggle-background: var(--white);
    --nav-toggle-border-color: var(--color-gray-200);
    --nav-toggle-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
    --nav-toggle-hover-color: var(--color-primary-700);
    --nav-toggle-hover-background: var(--color-white);
    --nav-toggle-hover-border-color: #cfd5df;

    color: var(--nav-text-color);
    background: var(--nav-background);
    border-right-color: var(--nav-border-color);
}

.sidebar-main .sidebar-header[b-3boohzv8qx] {
    min-height: 58px;
    padding: 14px 12px 8px 13px;
}

.sidebar-header .header-logo img[b-3boohzv8qx] {
    width: 28px;
    height: 28px;
    border-radius: 7px;
}

.sidebar-header .header-logo[b-3boohzv8qx] {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    color: var(--nav-title-color);
    text-decoration: none;
}

.sidebar-header .header-title[b-3boohzv8qx] {
    display: block;
    max-width: 120px;
    opacity: 1;
    overflow: hidden;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    transform: translateX(0);
    visibility: visible;
    transition:
        max-width 0.3s ease,
        opacity 0.2s ease 0.08s,
        transform 0.3s ease,
        visibility 0s linear;
}

.sidebar-main.collapsed .header-title[b-3boohzv8qx] {
    max-width: 0;
    opacity: 0;
    transform: translateX(-6px);
    visibility: hidden;
    pointer-events: none;
    transition:
        max-width 0.3s ease,
        opacity 0.15s ease,
        transform 0.25s ease,
        visibility 0s linear 0.3s;
}

.sidebar-header .sidebar-toggler[b-3boohzv8qx] {
    right: 12px;
    width: 27px;
    height: 27px;
    color: var(--nav-toggle-color);
    background: var(--nav-toggle-background);
    border: 1px solid var(--nav-toggle-border-color);
    border-radius: 6px;
    box-shadow: var(--nav-toggle-shadow);
}

.sidebar-header .sidebar-toggler:hover[b-3boohzv8qx] {
    color: var(--nav-toggle-hover-color);
    background: var(--nav-toggle-hover-background);
    border-color: var(--nav-toggle-hover-border-color);
}

.sidebar-main.collapsed .sidebar-header .sidebar-toggler[b-3boohzv8qx] {
    right: auto;
    left: 50%;
    transform: translate(-50%, 60px);
}

.sidebar-header .sidebar-toggler span[b-3boohzv8qx] {
    display: flex;
    width: 16px;
    height: 16px;
    margin: 0;
    align-items: center;
    justify-content: center;
    line-height: 0;
}

.sidebar-header .sidebar-toggler span[b-3boohzv8qx]  .k-svg-icon {
    width: 15px;
    height: 15px;
}

.sidebar-header .sidebar-toggler span[b-3boohzv8qx]  svg {
    display: block;
    width: 15px;
    height: 15px;
    margin: 0;
}

.sidebar-nav .nav-list[b-3boohzv8qx] {
    gap: 2px;
    padding-inline: 8px;
    transform: translateY(6px);
}

.sidebar-nav .primary-nav[b-3boohzv8qx] {
    height: calc(100vh - 174px);
    padding-bottom: 32px;
}

.sidebar-nav .secondary-nav[b-3boohzv8qx] {
    bottom: 12px;
    padding-block: 5px;
    background: var(--nav-background);
}

.sidebar-nav .nav-section-title[b-3boohzv8qx] {
    padding: 15px 7px 6px;
    color: var(--nav-section-title-color);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0.055em;
}

.sidebar-nav .divider[b-3boohzv8qx] {
    margin: 9px 7px 2px;
    border-bottom-color: var(--nav-divider-color);
}

.nav-link svg[b-3boohzv8qx] {
    width: 16px;
    height: 16px;
    flex-basis: 16px;
    margin-left: 0;
    fill: currentColor;
}

.sidebar-nav .drop-container .drop-icon[b-3boohzv8qx] {
    display: flex;
    width: 14px;
    height: 14px;
    color: var(--nav-dropdown-arrow-color);
}

.sidebar-nav .drop-container .drop-icon[b-3boohzv8qx]  .k-svg-icon {
    width: 14px;
    height: 14px;
    color: inherit;
}

.sidebar-nav .drop-container > .drop-toggle.is-parent-active .drop-icon[b-3boohzv8qx] {
    color: var(--nav-dropdown-arrow-active-color);
}

.sidebar-nav .drop-menu[b-3boohzv8qx] {
    padding-left: 18px;
}

.drop-menu .nav-item .nav-link[b-3boohzv8qx] {
    padding: 6px 9px;
}

.sidebar-main.collapsed .sidebar-nav .primary-nav[b-3boohzv8qx] {
    transform: translateY(50px);
}

/* Keep all collapsed icons on one fixed vertical axis. */
.sidebar-main.collapsed .sidebar-nav > .nav-list[b-3boohzv8qx] {
    align-items: center;
    padding-inline: 5px;
}

.sidebar-main.collapsed .sidebar-nav > .nav-list > .nav-item:not(.divider)[b-3boohzv8qx] {
    width: 100%;
}

.sidebar-main.collapsed .sidebar-nav > .nav-list > .nav-item > .nav-link[b-3boohzv8qx] {
    width: 36px;
    min-height: 34px;
    margin-inline: auto;
    padding: 0 !important;
    justify-content: center;
    gap: 0;
    box-sizing: border-box;
}

.sidebar-main.collapsed .sidebar-nav > .nav-list > .nav-item > .nav-link > svg[b-3boohzv8qx] {
    flex: 0 0 16px;
    margin: 0;
}

.sidebar-main.collapsed .sidebar-nav > .nav-list > .nav-item > .nav-link > :where(.nav-label, .drop-icon)[b-3boohzv8qx] {
    display: none;
}

.sidebar-main.collapsed .sidebar-nav .divider[b-3boohzv8qx] {
    width: 36px;
    margin-inline: auto;
}

@media (max-width: 768px) {
    .sidebar-main.collapsed .sidebar-header .sidebar-toggler[b-3boohzv8qx] {
        right: 12px;
        left: auto;
        transform: none;
    }

    .sidebar-main.collapsed .sidebar-nav .primary-nav[b-3boohzv8qx] {
        transform: translateY(6px);
    }
}
/* _content/eLipsOnline/Components/Layout/NavMenuSide.razor.rz.scp.css */
.navbar-toggler[b-4le5xr5soh] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-4le5xr5soh] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-4le5xr5soh] {
    height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-4le5xr5soh] {
    font-size: 1.1rem;
}

.bi[b-4le5xr5soh] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-4le5xr5soh] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-4le5xr5soh] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-4le5xr5soh] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-4le5xr5soh] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-4le5xr5soh] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-4le5xr5soh] {
        padding-bottom: 1rem;
    }

    .nav-item[b-4le5xr5soh]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item[b-4le5xr5soh]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-4le5xr5soh]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-4le5xr5soh] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-4le5xr5soh] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-4le5xr5soh] {
        display: none;
    }

    .nav-scrollable[b-4le5xr5soh] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* _content/eLipsOnline/Components/Pages/Contracten/BeheerPage.razor.rz.scp.css */
/* ================================================================
   PAGE LAYOUT AND SPLITTER
   ================================================================ */

.page-body[b-2qdk7i1mwt] {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--color-gray-50);
}

.page-body-content[b-2qdk7i1mwt] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    display: flex;
    overflow: hidden;
}

.splitter-host[b-2qdk7i1mwt] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    height: 100%;
    overflow: hidden;
}

.splitter-host[b-2qdk7i1mwt]  .k-splitter,
.splitter-host[b-2qdk7i1mwt]  .k-pane {
    min-height: 0;
    overflow: hidden;
}

.contract-beheer-page[b-2qdk7i1mwt]  .k-pane {
    background-color: var(--color-gray-50);
}

/* ================================================================
   LEFT FILTER PANEL AND HEADER
   ================================================================ */

.contract-filter-panel[b-2qdk7i1mwt] {
    box-sizing: border-box;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 20px 22px;
    background: var(--white);
    border-right: 1px solid var(--color-gray-200);
    overflow: hidden;
}

.contract-panel-header[b-2qdk7i1mwt],
.contract-content-header[b-2qdk7i1mwt],
.contract-rules-header[b-2qdk7i1mwt] {
    flex: 0 0 auto;
    min-width: 0;
}

.contract-content-header[b-2qdk7i1mwt] { 
    margin: 5px;
}

.contract-panel-header[b-2qdk7i1mwt] {
    display: grid;
    gap: 25px;
    margin-bottom: 16px;
}

.contract-panel-header h4[b-2qdk7i1mwt],
.contract-content-header h4[b-2qdk7i1mwt],
.contract-rules-header h4[b-2qdk7i1mwt] {
    margin: 0;
    color: var(--color-secondary-700);
    font-size: var(--fs-h4);
    line-height: 1.2;
}

.contract-panel-header span[b-2qdk7i1mwt],
.contract-content-header span[b-2qdk7i1mwt] {
    display: block;
    margin-top: 4px;
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
    line-height: 1.3;
}

    .contract-panel-header span[b-2qdk7i1mwt] {
        margin-top: -5px;
    }

    .contract-toolbar[b-2qdk7i1mwt] {
        display: flex;
        align-items: center;
        gap: 10px;
        min-width: 0;
    }

/* ================================================================
   TREEVIEW BASE LAYOUT
   ================================================================ */

.contract-tree-container[b-2qdk7i1mwt] {
    --tree-accent: var(--color-primary-700);
    --tree-border: var(--color-gray-200);
    --tree-surface: var(--white);
    --tree-surface-hover: var(--color-gray-50);
    --tree-surface-selected: var(--color-selected-bg);
    --tree-text: var(--color-gray-700);
    --tree-text-muted: var(--color-gray-500);
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
    overflow: hidden;
}

.contract-tree-container[b-2qdk7i1mwt]  .contract-tree-search-input,
.contract-tree-container[b-2qdk7i1mwt]  .contract-tree-search-input.k-input,
.contract-tree-container[b-2qdk7i1mwt]  .contract-tree-search-input.k-textbox {
    flex: 0 0 auto;
    width: 100% !important;
    min-width: 0;
    height: 33px;
    min-height: 33px;
    box-sizing: border-box;
    border-color: var(--color-gray-200);
    border-radius: 4px;
}

.contract-tree-container[b-2qdk7i1mwt]  .contract-tree-search-input .k-input-inner,
.contract-tree-container[b-2qdk7i1mwt]  .contract-tree-search-input input {
    height: 31px;
    min-height: 31px;
    font-size: var(--fs-body-3);
    line-height: 31px;
}

.contract-tree-container[b-2qdk7i1mwt]  .contract-tree-search-input .k-input-prefix {
    flex: 0 0 32px;
    width: 32px;
    color: var(--color-gray-500);
}

.contract-tree-container[b-2qdk7i1mwt]  .contract-tree-search-input input::placeholder {
    color: var(--color-gray-500);
}

.contract-tree-scroll[b-2qdk7i1mwt] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    overflow: auto;
    padding: 4px 6px 10px 0;
    margin-left: -25px;
    scrollbar-gutter: stable;
}

.contract-tree-scroll[b-2qdk7i1mwt]  .k-treeview {
    width: max-content;
    min-width: 100%;
    color: var(--tree-text);
    font-size: var(--fs-body-2-5);
    line-height: 1.35;
    white-space: nowrap;
}

.contract-selected[b-2qdk7i1mwt] {
    color: var(--color-primary-700);
    font-weight: 700;
    padding: 5px 10px;
}

.contract-inactive[b-2qdk7i1mwt] {
    color: var(--color-gray-400);
    text-decoration: line-through;
}

/* ================================================================
   CONTENT AND RULES PANELS
   ================================================================ */

.contract-rules-panel[b-2qdk7i1mwt] {
    box-sizing: border-box;
    height: calc(100% - 40px);
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 20px;
    overflow: hidden;
    background-color: var(--white);
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.contract-content-panel[b-2qdk7i1mwt] {
    box-sizing: border-box;
    height: calc(100% - 32px);
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    margin: 16px 0px 16px 4px;
}

.contract-rules-panel[b-2qdk7i1mwt] {
    margin: 20px 20px 20px 5px;
}

.contract-content-header[b-2qdk7i1mwt],
.contract-rules-header[b-2qdk7i1mwt] {
    margin-bottom: 16px;
}

/* ================================================================
   CONTRACT SUMMARY
   ================================================================ */

.contract-summary-card[b-2qdk7i1mwt] {
    flex: 0 0 auto;
    min-width: 0;
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr) auto;
    align-items: center;
    gap: 24px;
    padding: 18px;
    margin: 5px 5px 8px;
    background: var(--white);
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.contract-summary-icon[b-2qdk7i1mwt] {
    width: 50px;
    height: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary-700);
    background: var(--color-selected-bg);
    border-radius: 5px;
}

.contract-summary-icon[b-2qdk7i1mwt]  .k-svg-icon {
    width: 25px;
    height: 25px;
}

.contract-summary-copy[b-2qdk7i1mwt] {
    min-width: 0;
    display: grid;
    gap: 7px;
}

.contract-summary-copy h3[b-2qdk7i1mwt] {
    margin: 0;
    color: var(--color-secondary-700);
    font-size: var(--fs-h4);
    font-weight: 500;
    line-height: 1.15;
    overflow-wrap: anywhere;
}

.contract-summary-copy p[b-2qdk7i1mwt] {
    margin: 0;
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
    font-weight: 400;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.contract-summary-relatie[b-2qdk7i1mwt] {
    color: var(--color-primary-700);
    font-weight: 450;
}

.contract-summary-separator[b-2qdk7i1mwt] {
    margin: 0 10px;
    color: var(--color-gray-400);
}

.contract-summary-type[b-2qdk7i1mwt] {
    color: var(--color-gray-500);
    font-weight: 450;
}

.contract-summary-date[b-2qdk7i1mwt] {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 2px;
    color: var(--color-secondary-700);
    font-size: var(--fs-caption);
    font-weight: 450;
}

.contract-summary-date-icon[b-2qdk7i1mwt] {
    flex: 0 0 auto;
    width: 23px;
    height: 23px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary-700);
    border-radius: 6px;
    margin-left: -4px;
}

.contract-summary-date[b-2qdk7i1mwt] {
    min-width: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0px 10px;
}

.contract-summary-date-item[b-2qdk7i1mwt] {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}

.contract-summary-date-icon[b-2qdk7i1mwt] {
    flex: 0 0 auto;
}

.contract-summary-date-divider[b-2qdk7i1mwt] {
    flex: 0 0 auto;
    width: 1px;
    height: 16px;
    margin: 0 2px;
    background: var(--color-gray-300);
}

@media (max-width: 700px) {
    .contract-summary-date[b-2qdk7i1mwt] {
        align-items: flex-start;
        flex-direction: column;
        gap: 3px;
    }

    .contract-summary-date-divider[b-2qdk7i1mwt] {
        display: none;
    }
}

.contract-summary-date-icon[b-2qdk7i1mwt]  .k-svg-icon {
    width: 14px;
    height: 14px;
}

.contract-status-pill[b-2qdk7i1mwt] {
    align-self: start;
    justify-self: end;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

.contract-status-pill--active[b-2qdk7i1mwt] {
    color: var(--green);
    background: var(--green-light);
}

.contract-status-pill--inactive[b-2qdk7i1mwt] {
    color: var(--orange);
    background: var(--orange-light);
}

/* ================================================================
   CONTRACT SECTIONS AND COLLAPSE CONTROLS
   ================================================================ */

.contract-section-stack[b-2qdk7i1mwt] {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(260px, 1fr);
    gap: 7px;
    overflow-x: hidden;
    overflow-y: auto;
}

    .contract-section-stack .contract-section:first-child[b-2qdk7i1mwt] {
        min-height: 0;
        align-self: start;
    }

    .contract-section-stack .contract-section:first-child .contract-tiles[b-2qdk7i1mwt] {
        flex: 0 0 auto;
    }

    .contract-section-stack .contract-section:last-child[b-2qdk7i1mwt] {
        min-height: 260px;
    }

.contract-section[b-2qdk7i1mwt] {
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 5px;
    background: var(--white);
    margin: 5px;
    border: 1px solid var(--color-gray-200);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.contract-section--collapsed[b-2qdk7i1mwt] {
    flex: 0 0 auto;
}

.contract-section-title[b-2qdk7i1mwt] {
    flex: 0 0 auto;
    min-height: 58px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 14px;
    padding: 18px 18px 18px;
}

.contract-section-title-header[b-2qdk7i1mwt] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

    .contract-section-title-header h4[b-2qdk7i1mwt] {
        margin: 0;
        font-size: var(--fs-h5);
        color: var(--color-secondary-700);
    }

.contract-section-title-header span[b-2qdk7i1mwt] {
    font-size: var(--fs-caption);
    color: var(--color-gray-500);
    font-weight: 400;
}

.contract-section-heading[b-2qdk7i1mwt] {
    min-width: 0;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-1);
    font-weight: 500;
    line-height: 1.15;
    overflow-wrap: anywhere;
}

.contract-section-actions[b-2qdk7i1mwt] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.contract-section-actions[b-2qdk7i1mwt]  .contract-section-action {
    width: 34px;
    height: 34px;
    min-width: 34px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.contract-section-actions[b-2qdk7i1mwt]  .contract-section-action .k-svg-icon {
    width: 16px;
    height: 16px;
}

.contract-section-toggle[b-2qdk7i1mwt] {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.contract-section-toggle[b-2qdk7i1mwt]  .k-svg-icon {
    width: 16px;
    height: 16px;
    color: var(--color-gray-700);
    transition: transform 0.16s ease;
}

.contract-section:not(.contract-section--collapsed) .contract-section-toggle[b-2qdk7i1mwt]  .k-svg-icon {
    transform: rotate(180deg);
}

.contract-section--collapsed .contract-tiles[b-2qdk7i1mwt] {
    display: none;
}

/* ================================================================
   TILE GRIDS AND EMPTY STATES
   ================================================================ */

.contract-tiles[b-2qdk7i1mwt] {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
    align-content: start;
    gap: 14px;
    overflow-y: auto;
    padding: 0 18px 18px 18px;
    scrollbar-gutter: stable;
}

.contract-basis-cards[b-2qdk7i1mwt] {
    flex: 0 0 auto;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-content: start;
    gap: 10px;
    overflow: visible;
    padding-bottom: 18px;
}

.contract-toeslag-cards[b-2qdk7i1mwt] {
    grid-template-columns: repeat(auto-fill, minmax(128px, 1fr));
    align-content: start;
    gap: 14px;
}

.contract-tiles--empty[b-2qdk7i1mwt] {
    display: flex;
    align-items: stretch;
    justify-content: stretch;
    overflow: visible;
    scrollbar-gutter: auto;
}

.contract-empty[b-2qdk7i1mwt] {
    width: 100%;
    min-height: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;
    color: var(--color-gray-500);
    text-align: center;
    margin-top: -20px;
}

.contract-empty--rules[b-2qdk7i1mwt] {
    height: 100%;
    min-height: 260px;
}

.contract-empty__visual[b-2qdk7i1mwt] {
    width: 200px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.contract-empty__visual img[b-2qdk7i1mwt] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.contractregel-empty__visual[b-2qdk7i1mwt] {
    width: 240px;
    height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.contractregel-empty__visual img[b-2qdk7i1mwt] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.contract-empty__text[b-2qdk7i1mwt] {
    max-width: 320px;
    display: grid;
    gap: 6px;
}

.contract-empty__title[b-2qdk7i1mwt] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-2);
    font-weight: 600;
    line-height: 1.2;
}

.contract-empty__description[b-2qdk7i1mwt] {
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
    line-height: 1.4;
}

.contract-empty-simple[b-2qdk7i1mwt] {
    width: 100%;
    border: 1px dashed var(--color-gray-300);
    border-radius: 8px;
    background: var(--color-gray-30);
}

.contract-empty-simple--basis[b-2qdk7i1mwt] {
    min-height: 132px;
}

/* ================================================================
   BASIS CARDS — COMPACT ROUTE AND STAFFEL OVERVIEW
   ================================================================ */

.contract-basis-card[b-2qdk7i1mwt],
.contract-basis-card:only-child[b-2qdk7i1mwt] {
    appearance: none;
    box-sizing: border-box;
    position: relative;
    isolation: isolate;
    min-width: 0;
    min-height: 150px;
    display: grid;
    grid-template-rows: auto 1fr auto;
    align-items: start;
    gap: 8px;
    overflow: hidden;
    padding: 12px 12px 0;
    border: 1px solid var(--color-gray-200);
    border-radius: 8px;
    background: var(--white);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
    color: var(--color-secondary-700);
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.contract-basis-card:only-child[b-2qdk7i1mwt] {
    grid-column: 1 / -1;
}

.contract-basis-card--route:hover[b-2qdk7i1mwt],
.contract-basis-card--route.contract-basis-card--selected[b-2qdk7i1mwt] {
    border-color: #8fc7ff;
    background: #f5fbff;
    transform: translateY(-1px);
}

.contract-basis-card--staffel:hover[b-2qdk7i1mwt],
.contract-basis-card--staffel.contract-basis-card--selected[b-2qdk7i1mwt] {
    border-color: #f3b46f;
    background: #fff8f0;
    transform: translateY(-1px);
}

.contract-basis-card__icon[b-2qdk7i1mwt] {
    position: relative;
    z-index: 2;
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary-700);
    background: #eef6ff;
    border: 1px solid #d8eaff;
    border-radius: 50%;
}

.contract-basis-card--staffel .contract-basis-card__icon[b-2qdk7i1mwt] {
    color: #e66f00;
    background: #fff2e6;
    border-color: #f8dec6;
}

.contract-basis-card__icon[b-2qdk7i1mwt]  .k-svg-icon {
    width: 18px;
    height: 18px;
}

.contract-basis-card__status[b-2qdk7i1mwt] {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 23px;
    padding: 4px 8px;
    border: 0;
    border-radius: 999px;
    color: var(--color-primary-700);
    background: #eef6ff;
    font-size: 12px;
    font-weight: 450;
    line-height: 1;
    white-space: nowrap;
}

.contract-basis-card--staffel .contract-basis-card__status[b-2qdk7i1mwt] {
    color: #b85a00;
    background: #fff1e2;
}

.contract-basis-card__status-dot[b-2qdk7i1mwt] {
    display: block;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: currentColor;
}

.contract-basis-card__content[b-2qdk7i1mwt] {
    position: relative;
    z-index: 2;
    max-width: 66%;
    align-self: center;
    display: grid;
    gap: 4px;
}

.contract-basis-card__title[b-2qdk7i1mwt] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-2);
    font-weight: 500;
    line-height: 1.12;
}

.contract-basis-card__description[b-2qdk7i1mwt] {
    color: var(--color-gray-500);
    font-size: 10px;
    font-weight: 450;
    line-height: 1.25;
}

.contract-basis-card__footer[b-2qdk7i1mwt] {
    z-index: 2;
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
    margin: 0 -12px;
    padding: 0 12px;
    border-top: 1px solid #e1ecfb;
    color: var(--color-primary-700);
    background: var(--white);
    font-size: var(--fs-caption);
    font-weight: 450;
    white-space: nowrap;
}

.contract-basis-card--staffel .contract-basis-card__footer[b-2qdk7i1mwt] {
    border-color: #f7e4d1;
    color: #e66f00;
}

.contract-basis-card--route:hover .contract-basis-card__footer[b-2qdk7i1mwt],
.contract-basis-card--route.contract-basis-card--selected .contract-basis-card__footer[b-2qdk7i1mwt] {
    border-color: #d5e6ff;
    color: var(--color-primary-700);
    background: rgba(247, 251, 255, 0.92);
}

.contract-basis-card--staffel:hover .contract-basis-card__footer[b-2qdk7i1mwt],
.contract-basis-card--staffel.contract-basis-card--selected .contract-basis-card__footer[b-2qdk7i1mwt] {
    border-color: #f7e4d1;
    color: #e66f00;
    background: rgba(255, 249, 242, 0.92);
}

.contract-basis-card__footer[b-2qdk7i1mwt]  .k-svg-icon {
    width: 14px;
    height: 14px;
}

.contract-basis-card__image[b-2qdk7i1mwt] {
    display: block;
    position: absolute;
    right: 0;
    bottom: 32px;
    z-index: 1;
    width: 36%;
    max-width: 105px;
    max-height: 72px;
    object-fit: contain;
    object-position: right bottom;
    pointer-events: none;
    user-select: none;
}

/* ================================================================
   TOESLAG CARDS
   ================================================================ */

.contract-toeslag-card[b-2qdk7i1mwt] {
    appearance: none;
    box-sizing: border-box;
    position: relative;
    isolation: isolate;
    width: 100%;
    min-width: 0;
    height: 124px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    overflow: hidden;
    padding: 15px 12px 12px;
    border: 1px solid var(--color-gray-200);
    border-radius: 8px;
    background: var(--white);
    color: var(--color-secondary-700);
    font: inherit;
    text-align: center;
    cursor: pointer;
}

.contract-toeslag-card[b-2qdk7i1mwt]::before,
.contract-toeslag-card[b-2qdk7i1mwt]::after {
    content: "";
    position: absolute;
    z-index: 0;
    right: -20px;
    bottom: -10px;
    width: 108px;
    height: 46px;
    border: 2px solid rgba(142, 74, 232, 0.10);
    border-radius: 50%;
    background: rgba(142, 74, 232, 0.02);
}

.contract-toeslag-card[b-2qdk7i1mwt]::after {
    right: 30px;
    bottom: -28px;
    width: 100px;
}

.contract-toeslag-card:hover[b-2qdk7i1mwt] {
    border: 1px solid #d8b8ff;
    background: #fff8ff;
}

.contract-toeslag-card--selected[b-2qdk7i1mwt],
.contract-toeslag-card--selected:hover[b-2qdk7i1mwt] {
    border: 1px solid #c99cf8;
    background: #f5e9ff;
}

.contract-toeslag-card__icon[b-2qdk7i1mwt] {
    position: relative;
    z-index: 1;
    width: 45px;
    height: 45px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 11px;
    color: #8e4ae8;
    background: #f0e0ff;
    border: 1px solid #e5d0ff;
    border-radius: 50%;
}

.contract-toeslag-card__icon[b-2qdk7i1mwt]  .k-svg-icon {
    width: 24px;
    height: 24px;
}

.contract-toeslag-card__label[b-2qdk7i1mwt],
.contract-toeslag-card__title[b-2qdk7i1mwt] {
    position: relative;
    z-index: 1;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.contract-toeslag-card__label[b-2qdk7i1mwt] {
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
    font-weight: 500;
    line-height: 1.2;
}

.contract-toeslag-card__title[b-2qdk7i1mwt] {
    margin-top: 3px;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-2);
    font-weight: 600;
    line-height: 1.2;
    text-transform: uppercase;
}

/* ================================================================
   DARK MODE — CARDS
   ================================================================ */

html[data-theme="dark"] .contract-basis-card--route:hover[b-2qdk7i1mwt],
html[data-theme="dark"] .contract-basis-card--route.contract-basis-card--selected[b-2qdk7i1mwt] {
    border-color: #5599d8;
    background: #253545;
}

html[data-theme="dark"] .contract-basis-card--staffel:hover[b-2qdk7i1mwt],
html[data-theme="dark"] .contract-basis-card--staffel.contract-basis-card--selected[b-2qdk7i1mwt] {
    border-color: #d68b48;
    background: #382b21;
}

html[data-theme="dark"] .contract-basis-card__icon[b-2qdk7i1mwt],
html[data-theme="dark"] .contract-basis-card__status[b-2qdk7i1mwt] {
    color: #78b7ff;
    border-color: #3b5878;
    background: #26384b;
}

html[data-theme="dark"] .contract-basis-card--staffel .contract-basis-card__icon[b-2qdk7i1mwt],
html[data-theme="dark"] .contract-basis-card--staffel .contract-basis-card__status[b-2qdk7i1mwt] {
    color: #f3a45d;
    border-color: #664b35;
    background: #3a2d23;
}

html[data-theme="dark"] .contract-basis-card__footer[b-2qdk7i1mwt] {
    border-color: #35485e;
    color: #78b7ff;
    background: rgba(34, 44, 55, 0.92);
}

html[data-theme="dark"] .contract-basis-card--staffel .contract-basis-card__footer[b-2qdk7i1mwt] {
    border-color: #5c4634;
    color: #f3a45d;
    background: rgba(48, 39, 31, 0.94);
}

html[data-theme="dark"] .contract-toeslag-card[b-2qdk7i1mwt] {
    border-color: #514265;
    background: #27232d;
}

html[data-theme="dark"] .contract-toeslag-card[b-2qdk7i1mwt]::before,
html[data-theme="dark"] .contract-toeslag-card[b-2qdk7i1mwt]::after {
    border-color: rgba(185, 145, 238, 0.18);
    background: rgba(142, 74, 232, 0.06);
}

html[data-theme="dark"] .contract-toeslag-card:hover[b-2qdk7i1mwt] {
    border-color: #a978df;
    background: #332a3d;
}

html[data-theme="dark"] .contract-toeslag-card--selected[b-2qdk7i1mwt],
html[data-theme="dark"] .contract-toeslag-card--selected:hover[b-2qdk7i1mwt] {
    border-color: #b98bea;
    background: #40304d;
}

html[data-theme="dark"] .contract-toeslag-card__icon[b-2qdk7i1mwt] {
    color: #c49af5;
    border-color: #5d4876;
    background: #3b2e49;
}

html[data-theme="dark"] .contract-toeslag-card__title[b-2qdk7i1mwt] {
    color: var(--color-secondary-700);
}

/* ================================================================
   CONTRACT RULE TYPE TILES
   ================================================================ */

.contract-tile[b-2qdk7i1mwt] {
    appearance: none;
    min-width: 0;
    min-height: 116px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 14px 10px;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    background: #fff;
    color: var(--color-secondary-700);
    font: inherit;
    text-align: center;
    cursor: pointer;
}

    .contract-tile:hover[b-2qdk7i1mwt],
    .contract-tile--selected[b-2qdk7i1mwt] {
        border-color: var(--color-selected-border);
        background: var(--color-selected-bg);
    }

.contract-tile-icon[b-2qdk7i1mwt] {
    width: 54px;
    height: 54px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
}

.contract-tile-icon--basis[b-2qdk7i1mwt] {
    color: var(--color-primary-700);
    background: var(--color-primary-50);
}

.contract-tile-icon--staffel[b-2qdk7i1mwt] {
    color: #e67e22;
    background: #fff0dc;
}

.contract-tile-icon--toeslag[b-2qdk7i1mwt] {
    color: #6f42c1;
    background: #f1e7ff;
}

.contract-tile-icon[b-2qdk7i1mwt]  .k-svg-icon {
    width: 24px;
    height: 24px;
}

.contract-tile-text[b-2qdk7i1mwt] {
    max-width: 100%;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 550;
    line-height: 1.2;
    overflow-wrap: anywhere;
    margin: 5px 0;
}

/* ================================================================
   CONTRACT RULES GRID
   ================================================================ */

.contract-rules-grid[b-2qdk7i1mwt] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.contract-rules-grid[b-2qdk7i1mwt]  .k-grid {
    height: 100%;
}

.contract-content-header span[b-2qdk7i1mwt] {
    font-size: var(--fs-body-2);
    color: var(--color-primary-700);
    font-weight: 500;
}

.contract-regels-title-header[b-2qdk7i1mwt] {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

    .contract-regels-title-header h4[b-2qdk7i1mwt] {
        margin: 0;
        font-size: var(--fs-h4);
        color: var(--color-secondary-700);
    }

    .contract-regels-title-header span[b-2qdk7i1mwt] {
        font-size: var(--fs-caption);
        color: var(--color-gray-500);
        font-weight: 400;
    }

/* ================================================================
   RESPONSIVE LAYOUT
   ================================================================ */

@media (max-width: 1500px) {
    .contract-filter-panel[b-2qdk7i1mwt] {
        padding: 18px 16px 22px;
    }

    .contract-content-panel[b-2qdk7i1mwt],
    .contract-rules-panel[b-2qdk7i1mwt] {
        height: calc(100% - 28px);
        margin-top: 14px;
        margin-bottom: 14px;
    }

    .contract-tiles[b-2qdk7i1mwt] {
        grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
    }

    .contract-summary-card[b-2qdk7i1mwt] {
        grid-template-columns: 60px minmax(0, 1fr) auto;
        gap: 16px;
        padding: 18px;
    }

    .contract-summary-icon[b-2qdk7i1mwt] {
        width: 60px;
        height: 60px;
    }

        .contract-summary-icon[b-2qdk7i1mwt]  .k-svg-icon {
            width: 30px;
            height: 30px;
        }
}

@media (max-width: 1100px) {
    .page-body[b-2qdk7i1mwt],
    .page-body-content[b-2qdk7i1mwt] {
        height: auto;
        overflow: visible;
    }

    .contract-content-panel[b-2qdk7i1mwt],
    .contract-rules-panel[b-2qdk7i1mwt] {
        padding: 18px;
    }

    .splitter-host[b-2qdk7i1mwt] {
        height: auto;
        min-height: 100%;
        overflow: visible;
    }

    .splitter-host[b-2qdk7i1mwt]  .k-splitter {
        display: flex;
        flex-direction: column;
        height: auto !important;
        min-height: 100%;
        overflow: visible;
    }

    .splitter-host[b-2qdk7i1mwt]  .k-pane {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: none !important;
        height: auto !important;
        min-width: 0 !important;
        flex-basis: auto !important;
        overflow: visible;
    }

    .splitter-host[b-2qdk7i1mwt]  .k-splitbar {
        display: none !important;
    }

    .contract-filter-panel[b-2qdk7i1mwt],
    .contract-content-panel[b-2qdk7i1mwt],
    .contract-rules-panel[b-2qdk7i1mwt] {
        height: auto;
        margin: 0;
        border-radius: 0;
        border-right: 0;
        border-left: 0;
        box-shadow: none;
    }

    .contract-tree-scroll[b-2qdk7i1mwt],
    .contract-rules-grid[b-2qdk7i1mwt] {
        max-height: 480px;
        overflow: auto;
    }

    .contract-section-stack[b-2qdk7i1mwt] {
        min-height: 520px;
    }
}

@media (max-width: 700px) {
    .contract-filter-panel[b-2qdk7i1mwt],
    .contract-content-panel[b-2qdk7i1mwt],
    .contract-rules-panel[b-2qdk7i1mwt] {
        padding: 16px 12px;
    }

    .contract-toolbar[b-2qdk7i1mwt] {
        flex-wrap: wrap;
    }

    .contract-summary-card[b-2qdk7i1mwt] {
        grid-template-columns: 52px minmax(0, 1fr);
        align-items: start;
        gap: 12px;
        padding: 14px;
        margin: 0 0 8px;
    }

    .contract-summary-icon[b-2qdk7i1mwt] {
        width: 52px;
        height: 52px;
    }

        .contract-summary-icon[b-2qdk7i1mwt]  .k-svg-icon {
            width: 28px;
            height: 28px;
        }

    .contract-status-pill[b-2qdk7i1mwt] {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .contract-summary-copy[b-2qdk7i1mwt] {
        gap: 6px;
    }

    .contract-summary-copy h3[b-2qdk7i1mwt] {
        font-size: var(--fs-body-1);
    }

    .contract-section-title[b-2qdk7i1mwt] {
        gap: 10px;
        padding: 16px 12px;
    }

    .contract-section-actions[b-2qdk7i1mwt] {
        gap: 8px;
    }

    .contract-tiles[b-2qdk7i1mwt] {
        grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
        gap: 10px;
        padding: 0 12px 14px;
    }

    .contract-basis-cards[b-2qdk7i1mwt] {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .contract-section-stack[b-2qdk7i1mwt] {
        grid-template-rows: auto minmax(260px, auto);
    }

    .contract-tile[b-2qdk7i1mwt] {
        min-height: 104px;
        padding: 12px 8px;
    }

    .contract-empty__visual[b-2qdk7i1mwt] {
        width: 180px;
        height: 82px;
    }
}

@media (max-width: 420px) {
    .contract-summary-card[b-2qdk7i1mwt] {
        grid-template-columns: 44px minmax(0, 1fr);
    }

    .contract-summary-icon[b-2qdk7i1mwt] {
        width: 44px;
        height: 44px;
    }

        .contract-summary-icon[b-2qdk7i1mwt]  .k-svg-icon {
            width: 24px;
            height: 24px;
        }

    .contract-section-title[b-2qdk7i1mwt] {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .contract-section-actions[b-2qdk7i1mwt] {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .contract-section-toggle[b-2qdk7i1mwt] {
        grid-column: 2;
        grid-row: 1;
    }

}

/* ================================================================
   TREEVIEW ITEM ICONS
   ================================================================ */

.contract-tree-item[b-2qdk7i1mwt] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.contract-tree-icon[b-2qdk7i1mwt] {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-gray-500);
}

.contract-tree-icon[b-2qdk7i1mwt]  .k-svg-icon {
    width: 18px;
    height: 18px;
    color: currentColor;
}

.contract-tree-icon--vestiging[b-2qdk7i1mwt] {
    color: var(--color-secondary-700);
}

.contract-tree-icon--relatie[b-2qdk7i1mwt] {
    color: var(--color-secondary-700);
}

.contract-tree-icon--verkoop[b-2qdk7i1mwt] {
    color: var(--color-success-700);
}

.contract-tree-icon--inkoop[b-2qdk7i1mwt] {
    color: var(--color-danger-700);
}

.contract-tree-icon--contract[b-2qdk7i1mwt] {
    color: var(--color-primary-700);
}

/* ================================================================
   TREEVIEW — modern SaaS navigation
   ================================================================ */

.contract-tree-scroll[b-2qdk7i1mwt]::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.contract-tree-scroll[b-2qdk7i1mwt]::-webkit-scrollbar-track {
    background: transparent;
}

.contract-tree-scroll[b-2qdk7i1mwt]::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    border-radius: 999px;
    background: var(--color-gray-300);
    background-clip: padding-box;
}

.contract-tree-scroll[b-2qdk7i1mwt]  .k-treeview-lines,
.contract-tree-scroll[b-2qdk7i1mwt]  .k-treeview-group {
    gap: 2px;
}

.contract-tree-scroll[b-2qdk7i1mwt]  .k-treeview-item {
    padding-block: 1px;
}

.contract-tree-scroll[b-2qdk7i1mwt]  .k-treeview-mid,
.contract-tree-scroll[b-2qdk7i1mwt]  .k-treeview-top,
.contract-tree-scroll[b-2qdk7i1mwt]  .k-treeview-bot {
    align-items: center;
}

.contract-tree-scroll[b-2qdk7i1mwt]  .k-treeview-leaf {
    min-height: 30px;
    padding: 5px 10px;
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--tree-text);
    background: transparent;
    transition: color 140ms ease, background-color 140ms ease, border-color 140ms ease, box-shadow 140ms ease;
}

.contract-tree-scroll[b-2qdk7i1mwt]  .k-treeview-leaf:focus,
.contract-tree-scroll[b-2qdk7i1mwt]  .k-treeview-leaf.k-focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(47, 125, 244, 0.13);
}

.contract-tree-scroll[b-2qdk7i1mwt]  .k-treeview-leaf.k-selected:focus,
.contract-tree-scroll[b-2qdk7i1mwt]  .k-treeview-leaf.k-selected.k-focus {
    box-shadow: inset 3px 0 0 var(--tree-accent), 0 0 0 3px rgba(47, 125, 244, 0.13);
}

.contract-tree-scroll[b-2qdk7i1mwt]  .k-treeview-toggle {
    width: 28px;
    height: 28px;
    margin-inline: 0 2px;
    border-radius: 7px;
    color: var(--tree-text-muted);
    transition: color 140ms ease, background-color 140ms ease;
}

.contract-tree-scroll[b-2qdk7i1mwt]  .k-treeview-toggle:hover {
    color: var(--tree-accent);
    background: var(--tree-surface-selected);
}

.contract-tree-scroll[b-2qdk7i1mwt]  .k-treeview-toggle .k-svg-icon {
    width: 14px;
    height: 14px;
}

.contract-tree-scroll .contract-tree-item[b-2qdk7i1mwt] {
    gap: 10px;
    font-weight: 450;
}

.contract-tree-scroll .contract-tree-icon[b-2qdk7i1mwt] {
    width: 20px;
    height: 20px;
}

.contract-tree-scroll .contract-tree-icon[b-2qdk7i1mwt]  .k-svg-icon {
    width: 17px;
    height: 17px;
}

.contract-tree-scroll[b-2qdk7i1mwt]  .k-treeview-leaf.k-selected .contract-tree-item {
    font-weight: 550;
}

html[data-theme="dark"] .contract-tree-container[b-2qdk7i1mwt] {
    --tree-border: #3e454f;
    --tree-surface: #24282e;
    --tree-surface-hover: #2d333b;
    --tree-surface-selected: #243746;
    --tree-text: #d2d7df;
    --tree-text-muted: #9aa4b2;
}

html[data-theme="dark"] .contract-tree-container[b-2qdk7i1mwt]  .contract-tree-search-input {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"] .contract-tree-scroll[b-2qdk7i1mwt]  .k-treeview-leaf.k-selected,
html[data-theme="dark"] .contract-tree-scroll[b-2qdk7i1mwt]  .k-treeview-leaf.k-selected:hover {
    border-color: #3f6288;
}

@media (max-width: 520px) {
    .contract-basis-card[b-2qdk7i1mwt],
    .contract-basis-card:only-child[b-2qdk7i1mwt] {
        min-height: 126px;
    }

    .contract-empty-simple--basis[b-2qdk7i1mwt] {
        min-height: 126px;
    }
}

/* ================================================================
   CONTRACT REGELS — NEW RULE OPTIONS MENU
   ================================================================ */

.contract-rules-header[b-2qdk7i1mwt] {
    position: relative;
    z-index: 30;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.contract-regels-heading[b-2qdk7i1mwt] {
    min-width: 0;
}

.contract-regel-add-menu[b-2qdk7i1mwt] {
    position: relative;
    flex: 0 0 auto;
}

.contract-regel-add-trigger[b-2qdk7i1mwt] {
    color: var(--color-primary-700);
    border-color: var(--color-primary-300);
}

.contract-regel-add-trigger[b-2qdk7i1mwt]  .k-button-text {
    display: flex;
    align-items: center;
    gap: 7px;
}

.contract-regel-add-options[b-2qdk7i1mwt] {
    position: absolute;
    z-index: 5000;
    top: calc(100% + 6px);
    right: 0;
    width: 270px;
    padding: 6px;
    background: var(--white);
    border: 1px solid var(--color-gray-200);
    border-radius: 7px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.contract-regel-add-options button[b-2qdk7i1mwt] {
    position: relative;
    width: 100%;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: center;
    gap: 0;
    padding: 10px;
    color: var(--color-gray-800);
    text-align: left;
    background: transparent;
    border: 0;
    border-radius: 5px;
    cursor: pointer;
}

.contract-regel-add-options button:not(:last-child)[b-2qdk7i1mwt]::after {
    content: "";
    position: absolute;
    right: 5px;
    bottom: 0;
    left: 5px;
    height: 1px;
    background: var(--color-gray-100);
}

.contract-regel-add-options button:hover[b-2qdk7i1mwt] {
    background: var(--color-gray-50);
}

.contract-regel-add-options button > .k-svg-icon[b-2qdk7i1mwt] {
    color: var(--color-primary-700);
}

.contract-regel-add-options button[b-2qdk7i1mwt]  .k-svg-icon {
    width: 16px;
    height: 16px;
}

.contract-regel-add-options button span[b-2qdk7i1mwt] {
    min-width: 0;
    display: grid;
}

.contract-regel-add-options strong[b-2qdk7i1mwt] {
    font-size: var(--fs-body-3);
    font-weight: 500;
    color: var(--color-secondary-700);
}

.contract-regel-add-options small[b-2qdk7i1mwt] {
    font-size: 12px;
    color: var(--color-gray-400);
    font-weight: 300;
}

html[data-theme="dark"] .contract-regel-add-options[b-2qdk7i1mwt] {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
}

.contract-regel-add-options[b-2qdk7i1mwt] 
.contract-regel-option--route > .k-svg-icon {
    color: var(--color-primary-700);
}

.contract-regel-add-options[b-2qdk7i1mwt] 
.contract-regel-option--staffel > .k-svg-icon {
    color: var(--orange);
}

.contract-regel-add-options[b-2qdk7i1mwt] 
.contract-regel-option--toeslag > .k-svg-icon {
    color: var(--purple);
}

/* ================================================================
   TOESLAGEN — ACTIVE COUNT TAG
   ================================================================ */

.contract-toeslag-active-tag[b-2qdk7i1mwt] {
    min-height: 23px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 0 10px;
    border-radius: 999px;
    color: #7650d8;
    background: var(--purple-light);
    font-size: 12px;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
}

.contract-toeslag-active-tag__dot[b-2qdk7i1mwt] {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: currentColor;
}

html[data-theme="dark"] .contract-toeslag-active-tag[b-2qdk7i1mwt] {
    border-color: #5d4876;
    color: #c49af5;
}

@media (max-width: 700px) {
    .contract-rules-header[b-2qdk7i1mwt] {
        align-items: flex-start;
        flex-direction: column;
    }

    .contract-regel-add-menu[b-2qdk7i1mwt],
    .contract-regel-add-trigger[b-2qdk7i1mwt] {
        width: 100%;
    }

    .contract-regel-add-options[b-2qdk7i1mwt] {
        right: auto;
        left: 0;
        width: 100%;
    }
}
/* _content/eLipsOnline/Components/Pages/Contracten/ContractComponent.razor.rz.scp.css */
.rv-title[b-npnd03u6bo] {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
    padding: 5px 0;
}

.rv-title-icon[b-npnd03u6bo] {
    width: 45px;
    height: 45px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 5px;
    background: var(--color-primary-50);
    color: var(--color-primary-700);
}

    .rv-title-icon[b-npnd03u6bo]  .k-svg-icon {
        width: 25px !important;
        height: 25px !important;
    }

.rv-title-main[b-npnd03u6bo] {
    color: var(--color-secondary-700);
    font-size: var(--fs-h4);
    margin-bottom: 5px;
}

.rv-title-sub[b-npnd03u6bo] {
    margin-top: 0px;
    color: var(--color-gray-500);
    font-size: var(--fs-body-2);
    font-weight: 400;
    line-height: 1.25;
}

.contract-popup[b-npnd03u6bo] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.contract-popup-header[b-npnd03u6bo] {
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--kendo-color-border);
}

    .contract-popup-header label[b-npnd03u6bo] {
        font-size: .8rem;
        color: var(--txt-muted);
        display: block;
    }

    .contract-popup-header div:last-child[b-npnd03u6bo] {
        font-size: 1.2rem;
        font-weight: 600;
    }

.contract-popup-body[b-npnd03u6bo] {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 1rem 1rem;
    align-items: center;
}

    .contract-popup-body .k-input[b-npnd03u6bo],
    .contract-popup-body .k-picker[b-npnd03u6bo],
    .contract-popup-body .k-dropdownlist[b-npnd03u6bo],
    .contract-popup-body .k-textarea[b-npnd03u6bo] {
        width: 100%;
    }

.contract-form-row[b-npnd03u6bo] {
    display: contents;
}

.contract-note-full-width[b-npnd03u6bo] {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 1rem;
    align-items: start;
}

    .contract-note-full-width .k-textarea[b-npnd03u6bo] {
        width: 100%;
        min-height: 120px;
    }

.contract-checkbox[b-npnd03u6bo] {
    grid-column: 2;
    display: flex;
    align-items: center;
    gap: .5rem;
}

    .contract-checkbox label[b-npnd03u6bo] {
        margin: 0;
    }


.contract-dialog-actions[b-npnd03u6bo]{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.contract-dialog-actions-right[b-npnd03u6bo] {
    display: flex;
    gap: .75rem;
}
/* _content/eLipsOnline/Components/Pages/Contracten/ContractenRoutes.razor.rz.scp.css */
.contract-popup-body[b-k6l1rtxgmm] {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 1rem;
    align-items: center;
    padding: .25rem;
}

.contract-form-row[b-k6l1rtxgmm] {
    display: contents;
}

.contract-popup-body[b-k6l1rtxgmm]  .k-input,
.contract-popup-body[b-k6l1rtxgmm]  .k-picker,
.contract-popup-body[b-k6l1rtxgmm]  .k-dropdownlist,
.contract-popup-body[b-k6l1rtxgmm]  .k-numerictextbox {
    width: 100%;
    min-width: 0;
}

.contract-checkbox[b-k6l1rtxgmm] {
    display: flex;
    align-items: center;
    gap: .5rem;
}

    .contract-checkbox label[b-k6l1rtxgmm] {
        margin: 0;
    }

.contract-option-item[b-k6l1rtxgmm] {
    display: flex;
    align-items: center;
    gap: 8px;
}
/* _content/eLipsOnline/Components/Pages/Contracten/ContractRegelComponent.razor.rz.scp.css */
.lading-window[b-wjeofsam8d]  .k-window-content {
    height: 100%;
    min-height: 0;
    padding: 0;
    overflow: hidden;
}

.lading-window[b-wjeofsam8d]  .k-window-footer {
    padding: 8px 10px;
}

.contract-regel-title-meta[b-wjeofsam8d] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 28px;
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
    font-weight: 400;
}

.contract-regel-popup[b-wjeofsam8d] {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(300px, 370px) minmax(0, 1fr);
    overflow: hidden;
    background: var(--color-gray-50);
}

.contract-regel-title-icon--route[b-wjeofsam8d] {
    color: var(--color-primary-700);
    background: var(--color-primary-50);
}

.contract-regel-title-icon--staffel[b-wjeofsam8d] {
    color: #e67e22;
    background: #fff0dc;
}

.contract-regel-title-icon--toeslag[b-wjeofsam8d] {
    color: #6f42c1;
    background: #f1e7ff;
}

.contract-regel-title-icon--route[b-wjeofsam8d]  .k-svg-icon,
.contract-regel-title-icon--staffel[b-wjeofsam8d]  .k-svg-icon,
.contract-regel-title-icon--toeslag[b-wjeofsam8d]  .k-svg-icon {
    color: currentColor;
}


.contract-regel-list-icon--route[b-wjeofsam8d] {
    color: var(--color-primary-700);
    background: var(--color-primary-50);
}

.contract-regel-list-icon--staffel[b-wjeofsam8d] {
    color: #e67e22;
    background: #fff0dc;
}

.contract-regel-list-icon--toeslag[b-wjeofsam8d] {
    color: #6f42c1;
    background: #f1e7ff;
}

.detail-list-item__main[b-wjeofsam8d],
.detail-list-item__meta[b-wjeofsam8d] {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.detail-list-item__main strong[b-wjeofsam8d],
.detail-list-item__main span[b-wjeofsam8d],
.detail-list-item__meta span[b-wjeofsam8d] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.detail-list-item__main strong[b-wjeofsam8d] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 650;
}

.detail-list-item__main span[b-wjeofsam8d],
.detail-list-item__meta span[b-wjeofsam8d] {
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
}

.detail-list-item__meta[b-wjeofsam8d] {
    justify-items: end;
}

.detail-list-item-badge[b-wjeofsam8d] {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 2px 8px;
    color: var(--color-primary-700);
    background: var(--color-primary-50);
    border-radius: 999px;
    font-size: var(--fs-caption);
}

.detail-list-item__chevron[b-wjeofsam8d] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-gray-400);
}

.detail-list-item__chevron[b-wjeofsam8d]  .k-svg-icon {
    width: 14px;
    height: 14px;
}

.detail-list-empty-state[b-wjeofsam8d] {
    min-height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
    text-align: center;
}

.lading-detail-panel[b-wjeofsam8d] {
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: #fff;
}

.lading-form[b-wjeofsam8d] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    overflow: hidden;
}

.lading-form[b-wjeofsam8d],
.lading-form[b-wjeofsam8d]  form {
    height: 100%;
    min-height: 0;
}

.lading-form[b-wjeofsam8d]  form {
    display: flex;
    flex-direction: column;
}

.lading-form[b-wjeofsam8d]  .k-form-fieldset {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    border: 0;
    overflow: hidden;
}

.lading-form[b-wjeofsam8d]  .k-form-legend,
.lading-form[b-wjeofsam8d]  .k-form-buttons {
    display: none;
}

.lading-form-body[b-wjeofsam8d] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    background-color: var(--color-gray-50);
}

.lading-step-layout[b-wjeofsam8d] {
    height: 100%;
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 14px;
    overflow: hidden;
}

.lading-step-nav[b-wjeofsam8d] {
    min-height: 0;
    overflow: hidden;
    padding: 20px 0 0 25px;
}

.contract-regel-stepper[b-wjeofsam8d] {
    margin-top: 14px;
    padding-right: 18px;
}

.contract-regel-stepper[b-wjeofsam8d]  .k-step-list-vertical {
    gap: 4px;
}

.lading-step-content[b-wjeofsam8d] {
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow-y: auto;
    padding: 20px 12px 25px 5px;
    scroll-behavior: smooth;
}

.lading-section-grid[b-wjeofsam8d] {
    display: grid;
    width: min(100%, 900px);
    grid-template-columns: 1fr;
    gap: 20px;
    align-items: start;
}

.lading-section-grid > h5[b-wjeofsam8d] {
    margin: 0;
    color: var(--color-secondary-700);
    font-size: var(--fs-h5);
    font-weight: 500;
}

.lading-field-section[b-wjeofsam8d] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 24px;
    border: 1px solid var(--color-gray-200);
    border-radius: 6px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.lading-form-row[b-wjeofsam8d] {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    align-items: center;
    gap: 20px;
    min-width: 0;
}

.contract-regel-inline[b-wjeofsam8d] {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
}

.contract-regel-check-grid[b-wjeofsam8d] {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
    gap: 10px;
}

.contract-regel-section-toolbar[b-wjeofsam8d] {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.contract-regel-section-search[b-wjeofsam8d] {
    flex: 1 1 320px;
    max-width: 460px;
}

.contract-regel-selection-count[b-wjeofsam8d] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 3px 10px;
    border-radius: 999px;
    background: var(--color-selected-bg);
    color: var(--color-primary-700);
    font-size: var(--fs-caption);
    font-weight: 500;
    white-space: nowrap;
}

.contract-regel-uitsluiten-section[b-wjeofsam8d] {
    min-height: min(640px, calc(84vh - 190px));
}

.contract-regel-check-grid--uitsluiten[b-wjeofsam8d] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    overflow-y: auto;
    scrollbar-gutter: stable;
}

.contract-regel-check-item[b-wjeofsam8d] {
    min-width: 0;
    min-height: 44px;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid var(--color-gray-200);
    border-radius: 6px;
    background: #fff;
    color: var(--color-gray-900);
    cursor: pointer;
    transition: border-color 120ms ease, background-color 120ms ease, box-shadow 120ms ease;
}

    .contract-regel-check-item:hover[b-wjeofsam8d] {
        border-color: var(--color-gray-300);
        background: var(--color-gray-50);
    }

    .contract-regel-check-item.is-selected[b-wjeofsam8d] {
        border-color: var( --color-selected-border);
        background: var(--color-selected-bg);
    }

.contract-regel-check-item input[b-wjeofsam8d] {
    flex: 0 0 auto;
}

.contract-regel-check-item span[b-wjeofsam8d] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.contract-regel-check-item--rekening[b-wjeofsam8d] {
    min-height: 50px;
    align-items: center;
}

.contract-regel-rekening-text[b-wjeofsam8d] {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(72px, auto) minmax(0, 1fr);
    align-items: center;
    gap: 18px;
}

.contract-regel-rekening-text strong[b-wjeofsam8d],
.contract-regel-rekening-text span[b-wjeofsam8d] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.contract-regel-rekening-text strong[b-wjeofsam8d] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 550;
}

.contract-regel-rekening-text span[b-wjeofsam8d] {
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
    font-weight: 400;
}

.contract-regel-section--disabled[b-wjeofsam8d] {
    background: #fbfbfc;
}

.contract-regel-empty[b-wjeofsam8d] {
    min-height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
    text-align: center;
    border: 1px dashed var(--color-gray-200);
    border-radius: 6px;
    background: #fff;
}

.contract-regel-empty--compact[b-wjeofsam8d] {
    grid-column: 1 / -1;
    min-height: 86px;
}

.lading-form[b-wjeofsam8d]  .k-floating-label-container {
    width: 100%;
}

.lading-form[b-wjeofsam8d]  .k-input,
.lading-form[b-wjeofsam8d]  .k-picker,
.lading-form[b-wjeofsam8d]  .k-numerictextbox,
.lading-form[b-wjeofsam8d]  .k-dropdownlist,
.lading-form[b-wjeofsam8d]  .k-combobox {
    min-height: 32px;
}

.lading-window-footer[b-wjeofsam8d],
.contract-dialog-actions[b-wjeofsam8d] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.contract-dialog-actions > div[b-wjeofsam8d] {
    display: flex;
    align-items: center;
    gap: 10px;
}

@media (max-width: 1100px) {
    .lading-window[b-wjeofsam8d] {
        width: 90vw !important;
        max-width: 90vw !important;
        height: 90dvh !important;
        max-height: 90dvh !important;
    }

    .lading-step-layout[b-wjeofsam8d] {
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
    }

    .contract-regel-popup[b-wjeofsam8d] {
        grid-template-columns: minmax(0, 1fr);
    }

    .contract-regel-popup > .detail-list-panel[b-wjeofsam8d] {
        display: none;
    }

    .lading-step-nav[b-wjeofsam8d] {
        display: none;
    }

    .lading-step-content[b-wjeofsam8d] {
        height: 100%;
        overflow-y: auto;
        padding: 18px 16px 24px;
    }

    .lading-section-grid[b-wjeofsam8d] {
        width: 100%;
    }

    .lading-field-section[b-wjeofsam8d] {
        gap: 18px;
        padding: 20px;
    }

    .lading-form-row[b-wjeofsam8d] {
        grid-template-columns: 150px minmax(0, 1fr);
        gap: 16px;
    }

    .contract-regel-title-meta[b-wjeofsam8d] {
        gap: 16px;
    }
}

@media (max-width: 800px) {
    .lading-window[b-wjeofsam8d]  .k-window-content {
        overflow: hidden;
    }

    .contract-regel-popup[b-wjeofsam8d] {
        grid-template-rows: minmax(0, 1fr);
        height: 100%;
        min-height: 0;
        overflow: hidden;
    }

    .lading-detail-panel[b-wjeofsam8d],
    .lading-form[b-wjeofsam8d],
    .lading-form[b-wjeofsam8d]  form,
    .lading-form[b-wjeofsam8d]  .k-form-fieldset,
    .lading-form-body[b-wjeofsam8d],
    .lading-step-layout[b-wjeofsam8d] {
        min-height: 0;
        height: 100%;
        overflow: hidden;
    }

    .lading-step-content[b-wjeofsam8d] {
        height: 100%;
        min-height: 0;
        padding: 14px;
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    .lading-form-row[b-wjeofsam8d] {
        grid-template-columns: 1fr;
        gap: 7px;
    }

    .lading-field-section[b-wjeofsam8d] {
        gap: 16px;
        padding: 18px;
    }

    .lading-section-grid[b-wjeofsam8d] {
        gap: 14px;
    }

    .contract-dialog-actions[b-wjeofsam8d] {
        align-items: stretch;
        flex-direction: column;
    }

    .contract-dialog-actions > div[b-wjeofsam8d] {
        justify-content: flex-end;
        width: 100%;
    }
}

@media (max-width: 600px) {
    .lading-window[b-wjeofsam8d] {
        width: 90vw !important;
        max-width: 90vw !important;
        height: 90dvh !important;
        max-height: 90dvh !important;
    }

    .lading-window[b-wjeofsam8d]  .k-window-titlebar {
        padding-inline: 12px;
    }

    .lading-window[b-wjeofsam8d]  .k-window-footer {
        padding: 8px 10px max(8px, env(safe-area-inset-bottom));
    }

    .contract-regel-title-meta[b-wjeofsam8d] {
        display: none;
    }

    .lading-step-content[b-wjeofsam8d] {
        padding: 12px 10px 18px;
    }

    .lading-field-section[b-wjeofsam8d] {
        gap: 14px;
        padding: 16px 14px;
    }

    .contract-regel-section-toolbar[b-wjeofsam8d] {
        align-items: stretch;
        flex-direction: column;
        gap: 8px;
    }

    .contract-regel-section-search[b-wjeofsam8d] {
        max-width: none;
    }

    .contract-regel-selection-count[b-wjeofsam8d] {
        align-self: flex-end;
    }

    .contract-regel-check-grid--uitsluiten[b-wjeofsam8d] {
        grid-template-columns: 1fr;
        max-height: 320px;
    }

    .contract-regel-inline[b-wjeofsam8d],
    .contract-dialog-actions > div:last-child[b-wjeofsam8d] {
        grid-template-columns: 1fr 1fr;
    }

    .contract-dialog-actions > div:last-child[b-wjeofsam8d] {
        display: grid;
        gap: 8px;
    }

    .contract-dialog-actions > div:last-child[b-wjeofsam8d]  .k-button {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 380px) {
    .lading-field-section[b-wjeofsam8d] {
        padding-inline: 12px;
    }

    .contract-regel-check-grid[b-wjeofsam8d] {
        grid-template-columns: 1fr;
    }
}
/* _content/eLipsOnline/Components/Pages/Contracten/CopyContractComponent.razor.rz.scp.css */
.rv-title[b-rsrtvnd887] {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
    padding: 5px 0;
}

.rv-title-icon[b-rsrtvnd887] {
    width: 45px;
    height: 45px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 5px;
    background: var(--color-primary-50);
    color: var(--color-primary-700);
}

    .rv-title-icon[b-rsrtvnd887]  .k-svg-icon {
        width: 25px !important;
        height: 25px !important;
    }

.rv-title-main[b-rsrtvnd887] {
    color: var(--color-secondary-700);
    font-size: var(--fs-h4);
    margin-bottom: 5px;
}

.rv-title-sub[b-rsrtvnd887] {
    margin-top: 0px;
    color: var(--color-gray-500);
    font-size: var(--fs-body-2);
    font-weight: 400;
    line-height: 1.25;
}

.cc-dialog[b-rsrtvnd887] {
    min-width: 0;
    display: grid;
    gap: 0;
    padding: 0 2px 2px;
}

.cc-panel[b-rsrtvnd887],
.cc-option[b-rsrtvnd887] {
    min-width: 0;
    background: #fff;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.cc-panel[b-rsrtvnd887] {
    display: grid;
    gap: 0;
    padding: 17px 18px 25px;
    margin: 15px 0;
}

.cc-panel--active[b-rsrtvnd887],
.cc-option--active[b-rsrtvnd887] {
    border-color: var(--color-gray-200);
    background: #fff;
}

.cc-panel-header[b-rsrtvnd887] {
    min-width: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 7px;
    padding: 0 0 12px;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 500;
}

.cc-panel-header[b-rsrtvnd887]  .k-svg-icon {
    width: 12px;
    height: 12px;
    flex: 0 0 auto;
}

.cc-panel-header h3[b-rsrtvnd887] {
    margin: 0;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 500;
    line-height: 1.25;
}

.cc-panel-header p[b-rsrtvnd887] {
    margin: 3px 0 0;
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
    font-weight: 400;
    line-height: 1.35;
}

.cc-option-grid[b-rsrtvnd887] {
    min-width: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
}

.cc-option[b-rsrtvnd887] {
    display: grid;
    align-content: start;
    gap: 12px;
    padding: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.cc-option-title[b-rsrtvnd887] {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.cc-option-title label[b-rsrtvnd887],
.cc-checkline label[b-rsrtvnd887] {
    min-width: 0;
    color: var(--color-gray-700);
    font-size: var(--fs-body-2);
    font-weight: 500;
    line-height: 1.25;
    cursor: pointer;
}

.cc-option-title[b-rsrtvnd887]  .k-checkbox,
.cc-checkline[b-rsrtvnd887]  .k-checkbox {
    width: 16px;
    height: 16px;
    border-radius: 4px;
}

.cc-fields[b-rsrtvnd887] {
    min-width: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 2px 0 20px 26px;
}

.cc-fields--three[b-rsrtvnd887] {
    grid-template-columns: 1fr;
    align-items: stretch;
}

.cc-fields--toeslagen[b-rsrtvnd887] {
    grid-template-columns: 1fr;
}

.cc-field[b-rsrtvnd887] {
    min-width: 0;
    display: grid;
    gap: 6px;
}

.cc-field span[b-rsrtvnd887],
.cc-or[b-rsrtvnd887] {
    color: var(--color-gray-600);
    font-size: var(--fs-body-3);
    line-height: 1.25;
}

.cc-field span[b-rsrtvnd887] {
    font-weight: 500;
}

.cc-or[b-rsrtvnd887] {
    align-self: start;
    padding: 0;
    color: var(--color-secondary-700);
    font-weight: 600;
}

.cc-field[b-rsrtvnd887]  .k-numerictextbox,
.cc-field[b-rsrtvnd887]  .k-input,
.cc-date-grid[b-rsrtvnd887]  .k-datepicker {
    width: 100% !important;
    min-width: 0;
}

.cc-checkline[b-rsrtvnd887] {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.cc-lower-grid[b-rsrtvnd887] {
    min-width: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    align-items: start;
}

.cc-date-grid[b-rsrtvnd887] {
    min-width: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
}

.cc-date-field[b-rsrtvnd887],
.cc-date-field[b-rsrtvnd887]  .k-floating-label-container,
.cc-date-field[b-rsrtvnd887]  .k-datepicker,
.cc-date-field[b-rsrtvnd887]  .k-input {
    width: 100% !important;
    min-width: 0;
}

.cc-dialog-actions[b-rsrtvnd887] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
}

@media (max-width: 520px) {
    .rv-title[b-rsrtvnd887] {
        gap: 12px;
    }

    .rv-title-icon[b-rsrtvnd887] {
        width: 38px;
        height: 38px;
    }

        .rv-title-icon[b-rsrtvnd887]  .k-svg-icon {
            width: 21px !important;
            height: 21px !important;
        }

    .rv-title-main[b-rsrtvnd887] {
        font-size: var(--fs-body-1);
    }

    .rv-title-sub[b-rsrtvnd887] {
        font-size: var(--fs-body-3);
    }

    .cc-panel[b-rsrtvnd887] {
        padding: 14px;
    }

    .cc-fields--three[b-rsrtvnd887],
    .cc-fields--toeslagen[b-rsrtvnd887] {
        grid-template-columns: 1fr;
    }

    .cc-or[b-rsrtvnd887] {
        justify-self: start;
        padding: 0;
    }

    .cc-dialog-actions[b-rsrtvnd887] {
        flex-wrap: wrap;
    }
}
/* _content/eLipsOnline/Components/Pages/DetailPages/ActiviteitDetails - Copy.razor.rz.scp.css */

.form-actions[b-wbu8cx3vu5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 20px;
    border-top: 1px solid #ccc;
    background-color: #f0f0f0;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
}

.form-actions-left[b-wbu8cx3vu5], .form-actions-right[b-wbu8cx3vu5] {
    display: flex;
    gap: 10px;
}

.page-layout[b-wbu8cx3vu5] {
    display: grid;
    grid-template-rows: 90% 10%; /* of bijv. 70% 30% */
    height: calc(100vh - 60px); /* -60px als je rekening houdt met header of knoppen */
}

.page-top[b-wbu8cx3vu5] {
    overflow: auto; /* zodat je kan scrollen in de tab inhoud */
}

.page-bottom[b-wbu8cx3vu5] {
    overflow: auto; /* zodat de grid netjes scrollt */
}

/* Binnen elke kolom: label + input */
.form-two-col[b-wbu8cx3vu5] {
    display: grid;
    grid-template-columns: 150px 1fr; /* label + veld */
    gap: 6px 12px;
    align-items: center;
}

    .form-two-col label[b-wbu8cx3vu5] {
        font-size: 0.9rem;
    }

/* Orders-tab: 2 kolommen, elk met label+veld-grid */
.form-columns[b-wbu8cx3vu5] {
    display: grid;
    grid-template-columns: 30% 70%; /* links/rechts/bijlagen kolom */
    gap: 16px 32px;
    padding-right: 16px;
    box-sizing: border-box;
    width: 98%;
}

.remove-button[b-wbu8cx3vu5] {
    background-color: #9c1818; /* Red background */
    border: none;
    color: white;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    margin: 20px 2px;
    cursor: pointer;
    border-radius: 50%; /* Circular button */
    width: 28px; /* Fixed width */
    height: 28px; /* Fixed height */
    line-height: 20px; /* Match the height to vertically center the '-' */
    padding: 0; /* Reset padding */
    font-weight: bold;
}

    .remove-button:hover[b-wbu8cx3vu5] {
        background-color: #601515; /* Darker shade of red */
    }


.activity-layout[b-wbu8cx3vu5] {
    display: grid;
    grid-template-columns: 50% 50%;
    gap: 18px;
}

/* Panels */
.section-panel[b-wbu8cx3vu5] {
    border: 1px solid #c0c0c0;
    border-radius: 4px;
    padding: 12px 10px 10px;
    background: #f8f8f8;
    position: relative;
}

.section-header[b-wbu8cx3vu5] {
    position: absolute;
    top: -9px;
    left: 12px;
    background: #f8f8f8;
    padding: 0 5px;
    font-weight: bold;
    font-size: 0.85rem;
}

/* Labels + Velden */
.section-body-2col[b-wbu8cx3vu5] {
    display: grid;
    grid-template-columns: 150px 1fr;
    gap: 6px 12px;
    margin-top: 4px;
}

.inline-row[b-wbu8cx3vu5] {
    display: flex;
    gap: 12px;
    align-items: center;
}

.inline-2[b-wbu8cx3vu5] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.inline-3[b-wbu8cx3vu5] {
    display: grid;
    grid-template-columns: 1fr 80px 80px;
    gap: 6px;
}

.inline-3-postcode[b-wbu8cx3vu5] {
    display: grid;
    grid-template-columns: 150px 1fr 100px;
    gap: 6px;
}

.left-col[b-wbu8cx3vu5], .right-col[b-wbu8cx3vu5] {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.section-extra-grid[b-wbu8cx3vu5] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 20px;
    margin-top: 6px;
}

.field-pair[b-wbu8cx3vu5] {
    display: grid;
    grid-template-columns: 150px 1fr;
    gap: 6px 10px;
    align-items: center;
}

    .field-pair label[b-wbu8cx3vu5] {
        font-size: 0.9rem;
    }

    


/* 2 kolommen in Activiteit */
.section-activity-2col[b-wbu8cx3vu5] {
    display: grid;
    grid-template-columns: 50% 50%;
    gap: 16px 24px;
    margin-top: 6px;
}

.activity-left[b-wbu8cx3vu5] {
    display: grid;
    grid-template-columns: 140px 1fr;
    gap: 6px 12px;
    align-items: center;
}

.activity-right[b-wbu8cx3vu5] {
    display: grid;
    grid-template-columns: 140px 1fr;
    gap: 6px 12px;
    align-items: center;
}
/* Checkboxes onder elkaar rechts */
.checkbox-col[b-wbu8cx3vu5] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.section-extra-grid[b-wbu8cx3vu5] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.field-full[b-wbu8cx3vu5] {
    grid-column: 1 / -1; /* neemt de volledige breedte */
    display: grid;
    grid-template-columns: 150px 1fr;
    gap: 6px 10px;
    align-items: start; /* textarea netjes bovenaan */
}

    .field-full label[b-wbu8cx3vu5] {
        font-size: 0.9rem;
    }
/* _content/eLipsOnline/Components/Pages/DetailPages/ActiviteitDetails.razor.rz.scp.css */
.activity-page[b-m9s1l141m4] {
    box-sizing: border-box;
    height: 100%;
    max-height: 100%;
    min-height: 0;
    background: var(--color-gray-50);
    color: #111827;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    overflow: hidden;
}

.activity-layout[b-m9s1l141m4] {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(300px, 380px) minmax(0, 1fr);
    overflow: hidden;
}

.activity-editor[b-m9s1l141m4] {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    overflow: hidden;
}

.activity-page--loading[b-m9s1l141m4] {
    display: grid;
    place-items: center;
}

.activity-page[b-m9s1l141m4]  .activity-details-form,
.activity-page[b-m9s1l141m4]  .activity-details-form.k-form {
    width: 100%;
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    display: block;
    gap: 0;
    overflow: hidden;
}

.activity-page[b-m9s1l141m4]  .activity-details-form .k-form-fieldset {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 14px;
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    overflow: hidden;
}

.activity-page[b-m9s1l141m4]  .activity-details-form .k-form-legend,
.activity-page[b-m9s1l141m4]  .activity-details-form .k-form-buttons {
    display: none;
}

.activity-page[b-m9s1l141m4]  .activity-details-form .k-input,
.activity-page[b-m9s1l141m4]  .activity-details-form .k-picker,
.activity-page[b-m9s1l141m4]  .activity-details-form .k-textarea,
.activity-page[b-m9s1l141m4]  .activity-details-form .k-multicolumncombobox {
    border-color: #dfe3e8;
    border-radius: 4px;
}

.activity-top[b-m9s1l141m4] {
    display: grid;
    gap: 7px;
    padding: 16px;
}

.activity-title-row[b-m9s1l141m4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.activity-links[b-m9s1l141m4] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 24px;
}

.activity-link-button[b-m9s1l141m4] {
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.activity-link-button:hover[b-m9s1l141m4] {
    color: var(--color-primary-700);
}

.activity-panel[b-m9s1l141m4] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
    padding: 18px;
}

.activity-strip[b-m9s1l141m4] {
    display: grid;
    grid-template-columns: auto minmax(210px, 1fr) minmax(250px, 1.3fr) minmax(340px, 1.4fr) auto;
    align-items: center;
    gap: 28px;
    padding: 15px 22px;
}

.activity-index[b-m9s1l141m4] {
    display: grid;
    place-items: center;
    min-width: 30px;
    height: 30px;
    padding: 0 12px;
    border-radius: 6px;
    background: #f3f4f6;
    font-size: 1rem;
    font-weight: 600;
}

.activity-strip-field[b-m9s1l141m4] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    min-width: 0;
}

.activity-strip-field--date[b-m9s1l141m4] {
    grid-template-columns: auto minmax(0, 1fr);
}

.input-with-button[b-m9s1l141m4] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 38px;
    gap: 8px;
    align-items: center;
    min-width: 0;
}

.date-time-grid[b-m9s1l141m4] {
    display: grid;
    grid-template-columns: minmax(140px, 1fr) minmax(72px, .5fr) minmax(72px, .5fr);
    gap: 8px;
    min-width: 0;
}

.activity-options[b-m9s1l141m4] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 24px;
}

.check-field[b-m9s1l141m4] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    white-space: nowrap;
}

.activity-content-grid[b-m9s1l141m4] {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    gap: 14px;
    min-height: 0;
    padding: 0 16px;
    align-items: stretch;
}

.activity-column[b-m9s1l141m4] {
    display: grid;
    gap: 14px;
    min-width: 0;
    min-height: 0;
}

.activity-column--left[b-m9s1l141m4] {
    grid-template-rows: auto minmax(0, 1fr);
}

.activity-column--right[b-m9s1l141m4] {
    grid-template-rows: minmax(0, 1fr);
}

.activity-content-grid.has-tourpoint .activity-column--right[b-m9s1l141m4] {
    grid-template-rows: auto minmax(120px, 1fr);
}

.address-card[b-m9s1l141m4],
.extra-card[b-m9s1l141m4],
.activity-tourpoint-card[b-m9s1l141m4],
.activity-cargo-card[b-m9s1l141m4] {
    min-width: 0;
    min-height: 0;
}

.address-card[b-m9s1l141m4] {
    align-self: start;
}

.extra-card[b-m9s1l141m4] {
    align-self: stretch;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
}

.activity-cargo-card[b-m9s1l141m4] {
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    padding: 0;
    overflow: hidden;
}

.field-stack[b-m9s1l141m4] {
    display: grid;
    gap: 10px;
    min-height: 0;
}

.form-row[b-m9s1l141m4] {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    align-items: center;
    gap: 20px;
}

.form-row--textarea[b-m9s1l141m4] {
    align-items: start;
    min-height: 0;
}

.form-row--textarea .txt-label[b-m9s1l141m4] {
    padding-top: 6px;
}

.split-fields[b-m9s1l141m4] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.split-fields--street[b-m9s1l141m4] {
    grid-template-columns: minmax(0, 1fr) minmax(64px, .19fr) minmax(72px, .23fr);
}

.split-fields--three[b-m9s1l141m4] {
    grid-template-columns: minmax(100px, .5fr) minmax(0, 1fr) minmax(86px, .45fr);
}

.activity-location-summary[b-m9s1l141m4] {
    margin-left: 200px;
}

.icon-only-button[b-m9s1l141m4] {
    width: 34px;
    height: 34px;
    padding: 0;
}

.activity-cargo-card[b-m9s1l141m4]  .k-grid {
    width: 100% !important;
    max-width: 100%;
    min-width: 0;
    height: 100%;
    border-width: 0;
    border-radius: 0;
    min-height: 0;
    overflow: hidden;
}

.activity-cargo-card[b-m9s1l141m4]  .k-grid-header {
    background: #f3f4f6;
}

.activity-cargo-card[b-m9s1l141m4]  .k-grid-aria-root,
.activity-cargo-card[b-m9s1l141m4]  .k-grid-container,
.activity-cargo-card[b-m9s1l141m4]  .k-grid-header,
.activity-cargo-card[b-m9s1l141m4]  .k-grid-header-wrap,
.activity-cargo-card[b-m9s1l141m4]  .k-grid-content {
    max-width: 100%;
    min-width: 0;
}

.activity-actions[b-m9s1l141m4] {
    z-index: 5;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 12px 16px;
    background-color: var(--color-gray-50);
}

.activity-button[b-m9s1l141m4] {
    min-width: 112px;
    font-weight: 800;
}

.activity-button--primary[b-m9s1l141m4] {
    color: #fff;
    border-color: #0ea5d7;
    background: #0ea5d7;
}

.activity-button--secondary[b-m9s1l141m4] {
    color: #111827;
    border-color: #e5e7eb;
    background: #fff;
}

@media (min-width: 1401px) {
    .extra-card .field-stack[b-m9s1l141m4] {
        align-content: stretch;
    }

    .extra-card .form-row--textarea[b-m9s1l141m4] {
        align-items: stretch;
    }

    .extra-card .form-row--textarea[b-m9s1l141m4]  .k-textarea {
        height: clamp(54px, 6.4dvh, 92px);
        min-height: 54px;
        max-height: 92px;
    }

    .activity-tourpoint-card .form-row--textarea[b-m9s1l141m4] {
        align-items: stretch;
    }

    .activity-tourpoint-card .form-row--textarea[b-m9s1l141m4]  .k-textarea {
        height: clamp(48px, 5.4dvh, 74px);
        min-height: 48px;
        max-height: 74px;
    }

    .form-row--textarea[b-m9s1l141m4]  textarea,
    .form-row--textarea[b-m9s1l141m4]  .k-input-inner {
        height: 100%;
        min-height: 0;
        resize: none;
        overflow: auto;
    }
}

@media (max-width: 1400px) {
    .activity-page[b-m9s1l141m4] {
        display: block;
        height: auto;
        max-height: none;
        min-height: calc(100vh - 40px);
        min-height: calc(100dvh - 40px);
        overflow: visible;
    }

    .activity-layout[b-m9s1l141m4],
    .activity-editor[b-m9s1l141m4] {
        height: auto;
        max-height: none;
        overflow: visible;
    }

    .activity-page[b-m9s1l141m4]  .activity-details-form,
    .activity-page[b-m9s1l141m4]  .activity-details-form.k-form,
    .activity-page[b-m9s1l141m4]  .activity-details-form .k-form-fieldset {
        height: auto;
        max-height: none;
        overflow: visible;
    }

    .activity-page[b-m9s1l141m4]  .activity-details-form .k-form-fieldset {
        display: grid;
        grid-template-rows: auto auto;
    }

    .activity-content-grid[b-m9s1l141m4] {
        min-height: 0;
    }

    .activity-column[b-m9s1l141m4],
    .activity-column--left[b-m9s1l141m4],
    .activity-column--right[b-m9s1l141m4],
    .activity-content-grid.has-tourpoint .activity-column--right[b-m9s1l141m4] {
        min-height: 0;
    }

    .activity-cargo-card[b-m9s1l141m4] {
        min-height: 260px;
    }

    .form-row--textarea[b-m9s1l141m4]  .k-textarea {
        height: 78px;
        min-height: 78px;
        max-height: 78px;
    }

    .form-row--textarea[b-m9s1l141m4]  textarea,
    .form-row--textarea[b-m9s1l141m4]  .k-input-inner {
        height: 100%;
        min-height: 0;
        resize: vertical;
    }

    .activity-actions[b-m9s1l141m4] {
        position: sticky;
        bottom: 0;
        margin-top: 14px;
        border-top: 1px solid #e5e7eb;
        background: rgba(247, 247, 248, .96);
        backdrop-filter: blur(6px);
    }
}

@media (max-width: 1180px) {
    .activity-page[b-m9s1l141m4] {
        height: auto;
        min-height: calc(100vh - 72px);
        overflow: visible;
    }

    .activity-strip[b-m9s1l141m4] {
        grid-template-columns: auto minmax(220px, 1fr) minmax(280px, 1fr);
    }

    .activity-strip-field--date[b-m9s1l141m4],
    .activity-options[b-m9s1l141m4] {
        grid-column: 2 / -1;
    }

    .activity-options[b-m9s1l141m4] {
        justify-content: flex-start;
    }

    .form-row[b-m9s1l141m4] {
        grid-template-columns: 150px minmax(0, 1fr);
    }

    .activity-location-summary[b-m9s1l141m4] {
        margin-left: 170px;
    }

    .form-row--textarea[b-m9s1l141m4]  .k-textarea {
        height: 78px;
        min-height: 78px;
        max-height: 78px;
    }

    .form-row--textarea[b-m9s1l141m4]  textarea,
    .form-row--textarea[b-m9s1l141m4]  .k-input-inner {
        height: 100%;
        min-height: 0;
        resize: vertical;
    }
}

@media (max-width: 920px) {
    .activity-page[b-m9s1l141m4] {
        display: block;
    }

    .activity-layout[b-m9s1l141m4] {
        grid-template-columns: 1fr;
    }

    .activity-list-panel[b-m9s1l141m4] {
        border-right: 0;
        border-bottom: 1px solid var(--color-gray-200);
        max-height: 260px;
    }

    .activity-title-row[b-m9s1l141m4] {
        align-items: flex-start;
        flex-direction: column;
    }

    .activity-links[b-m9s1l141m4] {
        justify-content: flex-start;
        gap: 14px;
    }

    .activity-strip[b-m9s1l141m4],
    .activity-content-grid[b-m9s1l141m4] {
        grid-template-columns: 1fr;
    }

    .activity-column[b-m9s1l141m4],
    .activity-column--left[b-m9s1l141m4],
    .activity-column--right[b-m9s1l141m4],
    .activity-content-grid.has-tourpoint .activity-column--right[b-m9s1l141m4] {
        grid-template-rows: none;
    }

    .activity-cargo-card[b-m9s1l141m4] {
        min-height: 360px;
    }

    .field-stack[b-m9s1l141m4] {
        overflow-y: visible;
        padding-right: 0;
    }

    .activity-strip-field--date[b-m9s1l141m4],
    .activity-options[b-m9s1l141m4] {
        grid-column: auto;
    }

    .activity-strip[b-m9s1l141m4] {
        gap: 16px;
    }

    .activity-index[b-m9s1l141m4] {
        justify-self: start;
    }

    .activity-actions[b-m9s1l141m4] {
        position: sticky;
        bottom: 0;
        padding: 12px 18px;
    }
}

@media (max-width: 640px) {
    .activity-title-row h5[b-m9s1l141m4] {
        font-size: 1.35rem;
    }

    .activity-strip[b-m9s1l141m4],
    .panel-heading[b-m9s1l141m4],
    .field-stack[b-m9s1l141m4] {
        padding-left: 14px;
        padding-right: 14px;
    }

    .activity-strip-field[b-m9s1l141m4],
    .form-row[b-m9s1l141m4] {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .activity-location-summary[b-m9s1l141m4] {
        margin-left: 0;
    }

    .date-time-grid[b-m9s1l141m4],
    .split-fields[b-m9s1l141m4],
    .split-fields--street[b-m9s1l141m4],
    .split-fields--three[b-m9s1l141m4] {
        grid-template-columns: 1fr;
    }

    .activity-options[b-m9s1l141m4] {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

    .activity-actions[b-m9s1l141m4] {
        align-items: stretch;
        flex-direction: column-reverse;
        padding: 12px;
    }

    .activity-button[b-m9s1l141m4] {
        width: 100%;
    }
}
/* _content/eLipsOnline/Components/Pages/DetailPages/ActiviteitDetailsWindow.razor.rz.scp.css */
.activity-page[b-iajvau2qwt] {
    box-sizing: border-box;
    height: 100%;
    max-height: 100%;
    min-height: 0;
    background: var(--color-gray-50);
    color: #111827;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    overflow: hidden;
}

.activity-layout[b-iajvau2qwt] {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(300px, 380px) minmax(0, 1fr);
    overflow: hidden;
}

.activity-editor[b-iajvau2qwt] {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    overflow-y: auto;
}

.activity-page--loading[b-iajvau2qwt] {
    display: grid;
    place-items: center;
}

.activity-page[b-iajvau2qwt]  .activity-details-form,
.activity-page[b-iajvau2qwt]  .activity-details-form.k-form {
    width: 100%;
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    display: block;
    gap: 0;
    overflow-y: auto;
}

.activity-page[b-iajvau2qwt]  .activity-details-form .k-form-fieldset {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 14px;
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    overflow: hidden;
}

.activity-page[b-iajvau2qwt]  .activity-details-form .k-form-legend,
.activity-page[b-iajvau2qwt]  .activity-details-form .k-form-buttons {
    display: none;
}

.activity-top[b-iajvau2qwt] {
    display: grid;
    gap: 7px;
    padding: 16px 16px 10px 16px;
}

.activity-title-row[b-iajvau2qwt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 5px;
}

.activity-links[b-iajvau2qwt] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 24px;
}

.activity-link-button[b-iajvau2qwt] {
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.activity-link-button:hover[b-iajvau2qwt] {
    color: var(--color-primary-700);
}

.activity-panel[b-iajvau2qwt] {
    background: var(--white);
    border: 1px solid var(--color-gray-200);
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
    padding: 18px;
}

.activity-strip[b-iajvau2qwt] {
    display: grid;
    grid-template-columns: auto minmax(150px, 0.8fr) minmax(150px, 1.0fr) minmax(450px, 1.6fr);
    align-items: center;
    gap: 28px;
    padding: 15px 22px;
}

.activity-index[b-iajvau2qwt] {
    display: grid;
    place-items: center;
    min-width: 30px;
    height: 30px;
    padding: 0 12px;
    border-radius: 6px;
    background: #f3f4f6;
    font-size: 1rem;
    font-weight: 600;
}

.activity-index.activity-status--purple[b-iajvau2qwt],
.detail-list-item__icon.activity-status--purple[b-iajvau2qwt] {
    color: #6f42c1;
    background: #f1e7ff;
    border: 1px solid #6f42c1;
}

.activity-index.activity-status--orange[b-iajvau2qwt],
.detail-list-item__icon.activity-status--orange[b-iajvau2qwt] {
    color: #e67e22;
    background: #fff0dc;
    border: 1px solid #ffd8a8;
}

.activity-index.activity-status--green[b-iajvau2qwt],
.detail-list-item__icon.activity-status--green[b-iajvau2qwt] {
    color: #198754;
    background: #dff5e7;
    border: 1px solid #a9dfbf;
}

.activity-index.activity-status--red[b-iajvau2qwt],
.detail-list-item__icon.activity-status--red[b-iajvau2qwt] {
    color: #dc3545;
    background: #fde2e2;
    border: 1px solid #f5b5b9;
}

.activity-index.activity-status--default[b-iajvau2qwt],
.detail-list-item__icon.activity-status--default[b-iajvau2qwt] {
    color: #5f6368;
    background: #f1f3f4;
    border: 1px solid #d6d9dc;
}

.activity-strip-field[b-iajvau2qwt] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    min-width: 0;
}

.activity-strip-field--date[b-iajvau2qwt] {
    grid-template-columns: auto minmax(0, 1fr);
}

.input-with-button[b-iajvau2qwt] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 38px;
    gap: 8px;
    align-items: center;
    min-width: 0;
}

.date-time-grid[b-iajvau2qwt] {
    display: grid;
    grid-template-columns: minmax(140px, 1fr) minmax(72px, .5fr) minmax(72px, .5fr);
    gap: 8px;
    min-width: 0;
}

.activity-options[b-iajvau2qwt] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 24px;
}

.check-field[b-iajvau2qwt] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    white-space: nowrap;
}

.activity-content-grid[b-iajvau2qwt] {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    gap: 10px;
    min-height: 0;
    padding: 0 16px 16px 16px;
    align-items: stretch;
    overflow-y: auto;
    overflow-x: hidden;
}

.activity-column[b-iajvau2qwt] {
    display: grid;
    gap: 10px;
    min-width: 0;
    min-height: 0;
}

.activity-column--left[b-iajvau2qwt] {
    grid-template-rows: auto minmax(0, 1fr);
}

.activity-column--right[b-iajvau2qwt] {
    grid-template-rows: minmax(0, 1fr);
}

.activity-content-grid.has-tourpoint .activity-column--right[b-iajvau2qwt] {
    grid-template-rows: auto minmax(120px, 1fr);
}

.address-card[b-iajvau2qwt],
.extra-card[b-iajvau2qwt],
.activity-tourpoint-card[b-iajvau2qwt],
.activity-cargo-card[b-iajvau2qwt] {
    min-width: 0;
    min-height: 0;
}

.address-card[b-iajvau2qwt] {
    align-self: start;
}

.extra-card[b-iajvau2qwt] {
    align-self: stretch;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
}

.activity-cargo-card[b-iajvau2qwt] {
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    padding: 0;
    overflow: hidden;
}

.field-stack[b-iajvau2qwt] {
    display: grid;
    gap: 10px;
    min-height: 0;
}

.form-row[b-iajvau2qwt] {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    align-items: center;
    gap: 20px;
}

.form-row--textarea[b-iajvau2qwt] {
    align-items: start;
    min-height: 0;
}

.form-row--textarea .txt-label[b-iajvau2qwt] {
    padding-top: 6px;
}

.split-fields[b-iajvau2qwt] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.split-fields--street[b-iajvau2qwt] {
    grid-template-columns: minmax(0, 1fr) minmax(64px, .19fr) minmax(72px, .23fr);
}

.split-fields--three[b-iajvau2qwt] {
    grid-template-columns: minmax(100px, .5fr) minmax(0, 1fr) minmax(86px, .45fr);
}

.activity-location-summary[b-iajvau2qwt] {
    margin-left: 200px;
}

.icon-only-button[b-iajvau2qwt] {
    width: 34px;
    height: 34px;
    padding: 0;
}

.activity-cargo-card[b-iajvau2qwt]  .k-grid {
    width: 100% !important;
    max-width: 100%;
    min-width: 0;
    height: 100%;
    border-width: 0;
    border-radius: 0;
    min-height: 0;
    overflow: hidden;
}

.activity-cargo-card[b-iajvau2qwt]  .k-grid-header {
    background: #f3f4f6;
}

.activity-cargo-card[b-iajvau2qwt]  .k-grid-aria-root,
.activity-cargo-card[b-iajvau2qwt]  .k-grid-container,
.activity-cargo-card[b-iajvau2qwt]  .k-grid-header,
.activity-cargo-card[b-iajvau2qwt]  .k-grid-header-wrap,
.activity-cargo-card[b-iajvau2qwt]  .k-grid-content {
    max-width: 100%;
    min-width: 0;
}

.activity-actions[b-iajvau2qwt] {
    z-index: 5;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 12px 16px;
    background-color: var(--color-gray-50);
}

.activity-button[b-iajvau2qwt] {
    min-width: 112px;
    font-weight: 800;
}

.activity-button--primary[b-iajvau2qwt] {
    color: #fff;
    border-color: #0ea5d7;
    background: #0ea5d7;
}

.activity-button--secondary[b-iajvau2qwt] {
    color: #111827;
    border-color: #e5e7eb;
    background: #fff;
}

@media (min-width: 1401px) {
    .extra-card .field-stack[b-iajvau2qwt] {
        align-content: stretch;
    }

    .extra-card .form-row--textarea[b-iajvau2qwt] {
        align-items: stretch;
    }

/*    .extra-card .form-row--textarea ::deep .k-textarea {
        height: clamp(54px, 6.4dvh, 92px);
        min-height: 54px;
        max-height: 92px;
    }*/

    .activity-tourpoint-card .form-row--textarea[b-iajvau2qwt] {
        align-items: stretch;
    }

    .activity-tourpoint-card .form-row--textarea[b-iajvau2qwt]  .k-textarea {
        height: clamp(48px, 5.4dvh, 74px);
        min-height: 48px;
        max-height: 74px;
    }

    .form-row--textarea[b-iajvau2qwt]  textarea,
    .form-row--textarea[b-iajvau2qwt]  .k-input-inner {
        height: 100%;
        min-height: 0;
        resize: none;
        overflow: auto;
    }
}

@media (max-width: 1600px) {
    .activity-editor[b-iajvau2qwt] {
        display: block;
        height: 100%;
        min-height: 0;
        overflow-x: hidden;
        overflow-y: auto;
    }

    .activity-page[b-iajvau2qwt]  .activity-details-form,
    .activity-page[b-iajvau2qwt]  .activity-details-form.k-form,
    .activity-page[b-iajvau2qwt]  .activity-details-form .k-form-fieldset {
        height: auto;
        max-height: none;
        overflow: visible;
    }

    .activity-page[b-iajvau2qwt]  .activity-details-form .k-form-fieldset {
        display: block;
    }

    .activity-strip[b-iajvau2qwt] {
        grid-template-columns: auto minmax(220px, 1fr) minmax(280px, 1fr);
        column-gap: 20px;
        row-gap: 14px;
    }

    .activity-strip-field--date[b-iajvau2qwt] {
        grid-column: 2 / -1;
    }

    .activity-content-grid[b-iajvau2qwt] {
        align-items: start;
        overflow: visible;
    }

    .activity-column--left[b-iajvau2qwt],
    .activity-column--right[b-iajvau2qwt],
    .activity-content-grid.has-tourpoint .activity-column--right[b-iajvau2qwt] {
        grid-template-rows: auto;
    }

    .activity-cargo-card[b-iajvau2qwt] {
        min-height: 360px;
    }
}

@media (max-width: 1400px) {
    .activity-page[b-iajvau2qwt] {
        display: grid;
        height: 100%;
        max-height: 100%;
        min-height: 0;
        overflow: hidden;
    }

    .activity-layout[b-iajvau2qwt] {
        height: 100%;
        max-height: 100%;
        min-height: 0;
        overflow: hidden;
    }

    .activity-editor[b-iajvau2qwt] {
        display: block;
        height: 100%;
        max-height: 100%;
        min-height: 0;
        overflow-x: hidden;
        overflow-y: auto;
    }

    .activity-page[b-iajvau2qwt]  .activity-details-form,
    .activity-page[b-iajvau2qwt]  .activity-details-form.k-form,
    .activity-page[b-iajvau2qwt]  .activity-details-form .k-form-fieldset {
        height: auto;
        max-height: none;
        min-height: 0;
        overflow: visible;
    }

    .activity-page[b-iajvau2qwt]  .activity-details-form .k-form-fieldset {
        display: block;
    }

    .activity-content-grid[b-iajvau2qwt] {
        min-height: 0;
        overflow: visible;
    }

    .activity-column[b-iajvau2qwt],
    .activity-column--left[b-iajvau2qwt],
    .activity-column--right[b-iajvau2qwt],
    .activity-content-grid.has-tourpoint .activity-column--right[b-iajvau2qwt] {
        min-height: 0;
    }

    .activity-cargo-card[b-iajvau2qwt] {
        min-height: 260px;
    }

    .form-row--textarea[b-iajvau2qwt]  .k-textarea {
        height: 78px;
        min-height: 78px;
        max-height: 78px;
    }

    .form-row--textarea[b-iajvau2qwt]  textarea,
    .form-row--textarea[b-iajvau2qwt]  .k-input-inner {
        height: 100%;
        min-height: 0;
        resize: vertical;
    }

    .activity-actions[b-iajvau2qwt] {
        position: sticky;
        bottom: 0;
        margin-top: 14px;
        border-top: 1px solid #e5e7eb;
        background: rgba(247, 247, 248, .96);
        backdrop-filter: blur(6px);
    }
}

@media (max-width: 1180px) {
    .activity-page[b-iajvau2qwt] {
        height: 100%;
        min-height: 0;
        overflow: hidden;
    }

    .activity-options[b-iajvau2qwt] {
        justify-content: flex-start;
    }

    .form-row[b-iajvau2qwt] {
        grid-template-columns: 150px minmax(0, 1fr);
    }

    .activity-location-summary[b-iajvau2qwt] {
        margin-left: 170px;
    }

    .form-row--textarea[b-iajvau2qwt]  .k-textarea {
        height: 78px;
        min-height: 78px;
        max-height: 78px;
    }

    .form-row--textarea[b-iajvau2qwt]  textarea,
    .form-row--textarea[b-iajvau2qwt]  .k-input-inner {
        height: 100%;
        min-height: 0;
        resize: vertical;
    }
}

@media (max-width: 1025px) {
    .activity-page[b-iajvau2qwt] {
        display: grid;
    }

    .activity-layout[b-iajvau2qwt] {
        grid-template-columns: 1fr;
    }

    .activity-layout > .detail-list-panel[b-iajvau2qwt] {
        display: none;
    }

    .activity-title-row[b-iajvau2qwt] {
        align-items: flex-start;
        flex-direction: column;
    }

    .activity-links[b-iajvau2qwt] {
        justify-content: flex-start;
        gap: 14px;
    }

    .activity-strip[b-iajvau2qwt],
    .activity-content-grid[b-iajvau2qwt] {
        grid-template-columns: 1fr;
        padding-bottom: 20px;
    }

    .activity-column[b-iajvau2qwt],
    .activity-column--left[b-iajvau2qwt],
    .activity-column--right[b-iajvau2qwt],
    .activity-content-grid.has-tourpoint .activity-column--right[b-iajvau2qwt] {
        grid-template-rows: none;
    }

    .activity-cargo-card[b-iajvau2qwt] {
        min-height: 360px;
    }

    .field-stack[b-iajvau2qwt] {
        overflow-y: visible;
        padding-right: 0;
    }

    .activity-strip-field--date[b-iajvau2qwt],
    .activity-options[b-iajvau2qwt] {
        grid-column: auto;
    }

    .activity-strip[b-iajvau2qwt] {
        gap: 16px;
    }

    .activity-index[b-iajvau2qwt] {
        justify-self: start;
    }

    .activity-actions[b-iajvau2qwt] {
        position: sticky;
        bottom: 0;
        padding: 12px 18px;
    }
}

@media (max-width: 640px) {
    .activity-title-row h5[b-iajvau2qwt] {
        font-size: 1.35rem;
    }

    .activity-strip[b-iajvau2qwt],
    .panel-heading[b-iajvau2qwt],
    .field-stack[b-iajvau2qwt] {
        padding-left: 14px;
        padding-right: 14px;
    }

    .activity-strip-field[b-iajvau2qwt],
    .form-row[b-iajvau2qwt] {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .activity-location-summary[b-iajvau2qwt] {
        margin-left: 0;
    }

    .date-time-grid[b-iajvau2qwt],
    .split-fields[b-iajvau2qwt],
    .split-fields--street[b-iajvau2qwt],
    .split-fields--three[b-iajvau2qwt] {
        grid-template-columns: 1fr;
    }

    .activity-options[b-iajvau2qwt] {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

    .activity-actions[b-iajvau2qwt] {
        align-items: stretch;
        flex-direction: column-reverse;
        padding: 12px;
    }

    .activity-button[b-iajvau2qwt] {
        width: 100%;
    }
}
/* _content/eLipsOnline/Components/Pages/DetailPages/LadingDetails.razor.rz.scp.css */
.lading-page[b-yqo4g9l4sd] {
    box-sizing: border-box;
    height: auto;
    max-height: calc(100vh - 126px);
    min-height: 0;
    overflow: auto;
}

.lading-page--loading[b-yqo4g9l4sd] {
    display: grid;
    place-items: center;
}

.lading-page-title[b-yqo4g9l4sd] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.lading-top[b-yqo4g9l4sd] {
    padding: 12px 22px 12px;
}

.lading-title-row[b-yqo4g9l4sd] {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 18px;
}

.lading-links[b-yqo4g9l4sd] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 28px;
}

.lading-link-button[b-yqo4g9l4sd] {
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.lading-link-button:hover[b-yqo4g9l4sd] {
    color: var(--color-primary-700);
}

.lading-content-grid[b-yqo4g9l4sd] {
    min-height: 0;
    padding: 0 22px 18px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 14px;
    align-items: start;
    overflow: visible;
}

.lading-column[b-yqo4g9l4sd] {
    min-width: 0;
    display: grid;
    gap: 10px;
}

/*@media (min-width: 981px) {
    .lading-content-grid > .lading-column:first-child {
        margin-top: -21px;
    }
}*/

.lading-panel[b-yqo4g9l4sd] {
    min-width: 0;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .05), 0 4px 12px rgba(0, 0, 0, .04);
    padding: 18px 22px;
}

/*.lading-product-card {
    min-height: 344px;
}*/

.lading-t1-card[b-yqo4g9l4sd] {
    min-height: 294px;
}

.lading-document-card[b-yqo4g9l4sd] {
    min-height: 270px;
}

.lading-seals-card[b-yqo4g9l4sd],
.lading-customs-card[b-yqo4g9l4sd] {
    min-height: 0;
}

.lading-panel-heading[b-yqo4g9l4sd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 12px;
}

.lading-panel-heading .form-box-label[b-yqo4g9l4sd] {
    margin-bottom: 0;
}

.lading-field-stack[b-yqo4g9l4sd] {
    display: grid;
    gap: 12px;
    min-height: 0;
}

.lading-form-row[b-yqo4g9l4sd] {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    align-items: center;
    gap: 20px;
    min-width: 0;
}

.lading-form-row--compact[b-yqo4g9l4sd] {
    grid-template-columns: 160px minmax(110px, 1fr);
}

.lading-form-row--summary[b-yqo4g9l4sd] {
    align-items: start;
}

.lading-two-col-fields[b-yqo4g9l4sd] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 12px 30px;
}

.lading-seal-grid[b-yqo4g9l4sd] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 12px 42px;
}

.lading-seal-grid .lading-form-row--compact[b-yqo4g9l4sd] {
    grid-template-columns: 76px minmax(0, 1fr);
    gap: 14px;
}

.lading-customs-row[b-yqo4g9l4sd] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 12px 42px;
    align-items: center;
}

.lading-customs-field[b-yqo4g9l4sd] {
    display: grid;
    grid-template-columns: 112px minmax(120px, 1fr);
    align-items: center;
    gap: 0px;
    min-width: 0;
}

.lading-split-fields[b-yqo4g9l4sd] {
    display: grid;
    gap: 12px;
    min-width: 0;
}

.lading-split-fields--value[b-yqo4g9l4sd] {
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 8px 12px;
}

.lading-checks[b-yqo4g9l4sd] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 42px;
    padding-top: 8px;
    margin-left: 0;
}

.lading-t1-check[b-yqo4g9l4sd] {
    padding-top: 0;
    justify-self: auto;
}

.check-field[b-yqo4g9l4sd] {
    display: inline-flex;
    align-items: center;
    gap: 0px;
    white-space: nowrap;
}

.lading-summary-field[b-yqo4g9l4sd] {
    display: grid;
    gap: 12px;
    min-width: 0;
}

.lading-address-placeholder[b-yqo4g9l4sd] {
    display: grid;
    gap: 4px;
    padding-left: 0;
    line-height: 1.35;
}

.lading-actions[b-yqo4g9l4sd] {
    z-index: 5;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    width: 100%;
}

.lading-button[b-yqo4g9l4sd] {
    min-width: 112px;
    font-weight: 800;
}

.lading-button--primary[b-yqo4g9l4sd] {
    color: #fff;
    border-color: #0ea5d7;
    background: #0ea5d7;
}

@media (max-width: 1400px) {
    .lading-page[b-yqo4g9l4sd] {
        display: block;
        height: auto;
        max-height: calc(100vh - 126px);
        overflow: auto;
    }

    [b-yqo4g9l4sd] .lading-window .k-window-content {
        overflow: auto;
    }

    .lading-page[b-yqo4g9l4sd]  .lading-details-form,
    .lading-page[b-yqo4g9l4sd]  .lading-details-form.k-form,
    .lading-page[b-yqo4g9l4sd]  .lading-details-form .k-form-fieldset {
        height: auto;
        max-height: none;
        overflow: visible;
    }

    .lading-content-grid[b-yqo4g9l4sd] {
        overflow: visible;
    }

    .lading-actions[b-yqo4g9l4sd] {
        background: rgba(247, 247, 248, .96);
    }
}

@media (max-width: 1280px) {
    .lading-content-grid[b-yqo4g9l4sd] {
        gap: 12px;
        padding-left: 18px;
        padding-right: 18px;
    }

    .lading-panel[b-yqo4g9l4sd] {
        padding: 16px 18px;
    }

    .lading-form-row[b-yqo4g9l4sd],
    .lading-form-row--compact[b-yqo4g9l4sd] {
        grid-template-columns: 170px minmax(0, 1fr);
        gap: 14px;
    }

    .lading-two-col-fields[b-yqo4g9l4sd],
    .lading-customs-row[b-yqo4g9l4sd] {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .lading-customs-field[b-yqo4g9l4sd] {
        grid-template-columns: 170px minmax(0, 1fr);
        gap: 14px;
    }

    .lading-product-card[b-yqo4g9l4sd],
    .lading-t1-card[b-yqo4g9l4sd],
    .lading-document-card[b-yqo4g9l4sd] {
        min-height: 0;
    }
}

@media (max-width: 1180px) {
    .lading-form-row[b-yqo4g9l4sd],
    .lading-form-row--compact[b-yqo4g9l4sd] {
        grid-template-columns: 170px minmax(0, 1fr);
    }

    .lading-two-col-fields[b-yqo4g9l4sd] {
        gap: 18px;
    }

    .lading-seal-grid[b-yqo4g9l4sd],
    .lading-customs-row[b-yqo4g9l4sd] {
        gap: 24px;
    }

    .lading-customs-field[b-yqo4g9l4sd] {
        grid-template-columns: 170px minmax(0, 1fr);
    }
}

@media (max-width: 980px) {
    .lading-title-row[b-yqo4g9l4sd] {
        align-items: flex-start;
        flex-direction: column;
    }

    .lading-links[b-yqo4g9l4sd] {
        justify-content: flex-start;
        gap: 14px;
    }

    .lading-content-grid[b-yqo4g9l4sd] {
        grid-template-columns: 1fr;
    }

    .lading-panel-heading[b-yqo4g9l4sd] {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 680px) {
    .lading-top[b-yqo4g9l4sd] {
        padding: 18px 14px 8px;
    }

    .lading-content-grid[b-yqo4g9l4sd] {
        padding: 0 14px 16px;
    }

    .lading-panel[b-yqo4g9l4sd] {
        padding: 16px 14px;
    }

    .lading-form-row[b-yqo4g9l4sd],
    .lading-form-row--compact[b-yqo4g9l4sd],
    .lading-seal-grid[b-yqo4g9l4sd],
    .lading-seal-grid .lading-form-row--compact[b-yqo4g9l4sd],
    .lading-customs-row[b-yqo4g9l4sd],
    .lading-customs-field[b-yqo4g9l4sd],
    .lading-two-col-fields[b-yqo4g9l4sd],
    .lading-split-fields--value[b-yqo4g9l4sd] {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .lading-checks[b-yqo4g9l4sd] {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

    .lading-actions[b-yqo4g9l4sd] {
        align-items: stretch;
        flex-direction: column-reverse;
        padding: 12px;
    }

    .lading-button[b-yqo4g9l4sd] {
        width: 100%;
    }
}
/* _content/eLipsOnline/Components/Pages/DetailPages/LadingDetailsOld.razor.rz.scp.css */

.form-actions[b-wm9gmoni5y] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 20px;
    border-top: 1px solid #ccc;
    background-color: #f0f0f0;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
}

.form-actions-left[b-wm9gmoni5y], .form-actions-right[b-wm9gmoni5y] {
    display: flex;
    gap: 10px;
}

.page-layout[b-wm9gmoni5y] {
    display: grid;
    grid-template-rows: 90% 10%; /* of bijv. 70% 30% */
    height: calc(100vh - 60px); /* -60px als je rekening houdt met header of knoppen */
}

.page-top[b-wm9gmoni5y] {
    overflow: auto; /* zodat je kan scrollen in de tab inhoud */
}

.page-bottom[b-wm9gmoni5y] {
    overflow: auto; /* zodat de grid netjes scrollt */
}

/* Binnen elke kolom: label + input */
.form-two-col[b-wm9gmoni5y] {
    display: grid;
    grid-template-columns: 150px 1fr; /* label + veld */
    gap: 6px 12px;
    align-items: center;
}

    .form-two-col label[b-wm9gmoni5y] {
        font-size: 0.9rem;
    }

.form-columns[b-wm9gmoni5y] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px 32px;
    padding: 0 16px;
}

.remove-button[b-wm9gmoni5y] {
    background-color: #9c1818; /* Red background */
    border: none;
    color: white;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    margin: 20px 2px;
    cursor: pointer;
    border-radius: 50%; /* Circular button */
    width: 28px; /* Fixed width */
    height: 28px; /* Fixed height */
    line-height: 20px; /* Match the height to vertically center the '-' */
    padding: 0; /* Reset padding */
    font-weight: bold;
}

    .remove-button:hover[b-wm9gmoni5y] {
        background-color: #601515; /* Darker shade of red */
    }


.section-panel[b-wm9gmoni5y] {
    border: 1px solid #ccc;
    padding: 12px;
    border-radius: 4px;
    background: #fafafa;
}

.section-title[b-wm9gmoni5y] {
    font-weight: 600;
    margin-top: -8px;
    margin-bottom: 12px;
    background: #fafafa;
    display: inline-block;
    padding: 0 4px;
    font-size: 0.95rem;
}

.section-grid-2col[b-wm9gmoni5y] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 24px;
}

.section-inner-two-col[b-wm9gmoni5y] {
    display: grid;
    grid-template-columns: 120px 1fr;
    gap: 6px 12px;
    align-items: center;
}

.section-fullwidth[b-wm9gmoni5y] {
    grid-column: span 2 !important;
}

.section-grid-4col[b-wm9gmoni5y] {
    display: grid;
    grid-template-columns: auto auto auto auto auto;
    gap: 16px 24px;
}

.section-inner-one-col[b-wm9gmoni5y] {
    display: flex;
    flex-direction: column;
}

.section-title-document[b-wm9gmoni5y] {
    font-weight: 600;
    background: #fafafa;
    display: inline-block;
    padding: 0 4px;
    font-size: 0.95rem;
}
/* _content/eLipsOnline/Components/Pages/DetailPages/OrderDetails - Copy.razor.rz.scp.css */

.form-actions[b-7oy04lafek] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 20px;
    border-top: 1px solid #ccc;
    background-color: #f0f0f0;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
}

.form-actions-left[b-7oy04lafek], .form-actions-right[b-7oy04lafek] {
    display: flex;
    gap: 10px;
}

.page-layout[b-7oy04lafek] {
    display: grid;
    grid-template-rows: 50% 50%; /* of bijv. 70% 30% */
    height: calc(100vh - 60px); /* -60px als je rekening houdt met header of knoppen */
}

.page-top[b-7oy04lafek] {
    position: relative;
    overflow: auto; /* zodat je kan scrollen in de tab inhoud */
}

.page-bottom[b-7oy04lafek] {
    overflow: auto; /* zodat de grid netjes scrollt */
}

/* Binnen elke kolom: label + input */
.form-two-col[b-7oy04lafek] {
    display: grid;
    grid-template-columns: 150px 1fr; /* label + veld */
    gap: 6px 12px;
    align-items: center;
}

    .form-two-col label[b-7oy04lafek] {
        font-size: 0.9rem;
    }

/* Orders-tab: 2 kolommen, elk met label+veld-grid */
.form-columns[b-7oy04lafek] {
    display: grid;
    grid-template-columns: auto auto auto; /* links/rechts/bijlagen kolom */
    gap: 16px 32px;
    padding-right: 16px;
    box-sizing: border-box;
    width: 50%;
}

/* dropzone style */
.drop-zone[b-7oy04lafek] {
    max-height: 290px; /* vaste hoogte */
    overflow-y: auto;
    min-width: 1050px;
    border: 2px dashed #bbb;
    border-radius: 6px;
    padding: 20px;
    text-align: center;
    color: #666;
    font-size: 0.9rem;
    cursor: pointer;
    background: #fafafa;
}

    .drop-zone.hover[b-7oy04lafek] {
        border-color: #007bff;
        color: #007bff;
        background: #f0f8ff;
    }

.remove-button[b-7oy04lafek] {
    background-color: #9c1818; /* Red background */
    border: none;
    color: white;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    margin: 20px 2px;
    cursor: pointer;
    border-radius: 50%; /* Circular button */
    width: 28px; /* Fixed width */
    height: 28px; /* Fixed height */
    line-height: 20px; /* Match the height to vertically center the '-' */
    padding: 0; /* Reset padding */
    font-weight: bold;
}

    .remove-button:hover[b-7oy04lafek] {
        background-color: #601515; /* Darker shade of red */
    }

/* zachte overgang */
.rz-dropdown[b-7oy04lafek],
.rz-dropdown-data-grid[b-7oy04lafek] {
    transition: box-shadow .15s ease, border-color .15s ease;
}

    /* FOCUS via :has() (Chrome, Edge, Safari, Opera) */
    .rz-dropdown-data-grid:has(.rz-inputtext:focus)[b-7oy04lafek],
    .rz-dropdown:has(.rz-inputtext:focus)[b-7oy04lafek] {
        border: 20px solid #0078d7 !important;
        box-shadow: 0 0 0 3px rgba(0,120,215,.25) !important;
        background-color: #f0f9ff !important;
    }

    /* fallback voor browsers zonder :has() (optioneel, minder precies) */
    .rz-dropdown-data-grid.rz-state-focus[b-7oy04lafek],
    .rz-dropdown.rz-state-focus[b-7oy04lafek] {
        border: 20px solid #0078d7 !important;
        box-shadow: 0 0 0 3px rgba(0,120,215,.25) !important;
        background-color: #f0f9ff !important;
    }

/* _content/eLipsOnline/Components/Pages/DetailPages/OrderDetails.razor.rz.scp.css */
html[b-9ak4jwwnow], body[b-9ak4jwwnow], #app[b-9ak4jwwnow] {
    height: 100%;
    margin: 0;
}

*[b-9ak4jwwnow],
*[b-9ak4jwwnow]::before,
*[b-9ak4jwwnow]::after {
    box-sizing: border-box;
}

.split-page[b-9ak4jwwnow] {
    height: 100dvh;
    display: grid;
    grid-template-rows: 1fr 1fr;
    overflow: hidden;
    background-color: var(--color-gray-50);
}

.split-panel[b-9ak4jwwnow] {
    min-height: 0;
    overflow: hidden;
}

/* TOP */
.top-shell[b-9ak4jwwnow],
.bottom-shell[b-9ak4jwwnow] {
    height: 100%;
    min-height: 0;
    display: grid;
    gap: 10px;
    overflow: hidden;
}

.top-shell[b-9ak4jwwnow] {
    grid-template-rows: auto 1fr;
    padding: 8px;
}

.bottom-shell[b-9ak4jwwnow] {
    grid-template-rows: auto 1fr auto;
    background-color: var(--color-gray-50);
    padding: 5px 16px 16px 16px;
}

.page-title[b-9ak4jwwnow] {
    margin: 0;
    padding: 8px 8px 0 8px;
}

.page-title-bottom[b-9ak4jwwnow] {
    margin: 0;
    padding: 8px 8px 0 0;
}

.top-content[b-9ak4jwwnow] {
    min-height: 0;
    overflow: hidden;
}

.detail-tabstrip[b-9ak4jwwnow] {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

    /* Telerik TabStrip interne wrappers */
    .detail-tabstrip .k-tabstrip[b-9ak4jwwnow],
    .detail-tabstrip .k-tabstrip-content[b-9ak4jwwnow],
    .detail-tabstrip .k-content[b-9ak4jwwnow] {
        height: 100%;
        min-height: 0;
        overflow: hidden;
    }

.tab-pane-fill[b-9ak4jwwnow] {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.tab-pane-scroll[b-9ak4jwwnow] {
    overflow: auto;
}

/* FORM TAB */
.form-scroll[b-9ak4jwwnow] {
    height: 100%;
    min-height: 0;
    padding: 20px;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}

.order-layout[b-9ak4jwwnow] {
    min-height: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(280px, 0.9fr);
    gap: 40px;
    align-items: start;
}

.form-column[b-9ak4jwwnow] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.form-pair[b-9ak4jwwnow] {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-width: 0;
}

    .form-pair > label[b-9ak4jwwnow] {
        margin: 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        text-align: left;
    }

    .form-pair > *:last-child[b-9ak4jwwnow] {
        min-width: 0;
    }

/* GRID TAB */
.grid-host[b-9ak4jwwnow] {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.card[b-9ak4jwwnow] {
    padding: 12px;
    border-radius: 8px;
    background: #e9ecef;
    margin-bottom: 12px;
}

/* Bottom */
.bottom-content[b-9ak4jwwnow] {
    min-height: 0;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.bottom-actionbar[b-9ak4jwwnow] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-top: 10px;
    background-color: var(--color-gray-50);
    flex-shrink: 0;
}

.bottom-actionbar__left[b-9ak4jwwnow],
.bottom-actionbar__right[b-9ak4jwwnow] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.bottom-actionbar__right[b-9ak4jwwnow] {
    justify-content: flex-end;
}

/* Responsive */
@media (max-width: 1400px) {
    .order-layout[b-9ak4jwwnow] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 900px) {
    .split-page[b-9ak4jwwnow] {
        display: block;
        width: 100%;
        max-width: 100%;
        height: 100dvh !important;
        overflow-x: hidden;
        overflow-y: auto;
    }

    .top-panel[b-9ak4jwwnow],
    .bottom-panel[b-9ak4jwwnow] {
        display: block;
    }

    .split-panel[b-9ak4jwwnow],
    .top-shell[b-9ak4jwwnow],
    .bottom-shell[b-9ak4jwwnow],
    .top-content[b-9ak4jwwnow],
    .bottom-content[b-9ak4jwwnow],
    .detail-tabstrip[b-9ak4jwwnow],
    .detail-tabstrip .k-tabstrip[b-9ak4jwwnow],
    .detail-tabstrip .k-tabstrip-content[b-9ak4jwwnow],
    .detail-tabstrip .k-content[b-9ak4jwwnow],
    .detail-tabstrip[b-9ak4jwwnow]  .k-tabstrip,
    .detail-tabstrip[b-9ak4jwwnow]  .k-tabstrip-content,
    .detail-tabstrip[b-9ak4jwwnow]  .k-content,
    .tab-pane-fill[b-9ak4jwwnow],
    .form-scroll[b-9ak4jwwnow],
    .grid-host[b-9ak4jwwnow] {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }

    .order-layout[b-9ak4jwwnow] {
        grid-template-columns: 1fr;
        min-width: 0;
        width: 100%;
        max-width: 100%;
    }

    .form-pair[b-9ak4jwwnow] {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .detail-tabstrip[b-9ak4jwwnow]  .k-tabstrip-items-wrapper {
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
    }

    .detail-tabstrip[b-9ak4jwwnow]  .k-tabstrip-items {
        width: max-content;
        max-width: none;
    }

    .bottom-content[b-9ak4jwwnow] {
        overflow-x: auto !important;
        min-height: 220px;
    }

    .bottom-content[b-9ak4jwwnow]  .k-grid {
        height: auto !important;
        min-height: 220px;
        max-width: 100%;
    }

    .grid-host[b-9ak4jwwnow] {
        min-height: 250px;
    }

        .grid-host[b-9ak4jwwnow]  .k-grid {
            min-height: 250px;
        }

        .grid-host[b-9ak4jwwnow]  .k-grid-content {
            min-height: 250px;
        }
}

@media (max-width: 600px) {
    .top-shell[b-9ak4jwwnow] {
        padding: 0px;
        gap: 8px;
    }

    .bottom-shell[b-9ak4jwwnow] {
        padding: 8px;
        gap: 8px;
    }

    .page-title[b-9ak4jwwnow] {
        padding: 20px 8px 0px 8px;
    }

    .page-title-bottom[b-9ak4jwwnow] {
        padding-left: 0;
        padding-right: 0;
    }

    .form-scroll[b-9ak4jwwnow] {
        padding: 14px 12px;
        width: 100%;
        max-width: 100%;
        overflow-x: hidden !important;
    }

    .order-layout[b-9ak4jwwnow] {
        gap: 22px;
    }

    .form-pair[b-9ak4jwwnow],
    .form-pair > *[b-9ak4jwwnow] {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .form-scroll[b-9ak4jwwnow]  .k-input,
    .form-scroll[b-9ak4jwwnow]  .k-input-inner,
    .form-scroll[b-9ak4jwwnow]  .k-picker,
    .form-scroll[b-9ak4jwwnow]  .k-textbox,
    .form-scroll[b-9ak4jwwnow]  .k-dropdownlist,
    .form-scroll[b-9ak4jwwnow]  .k-combobox,
    .form-scroll[b-9ak4jwwnow]  .k-multicolumncombobox,
    .form-scroll[b-9ak4jwwnow]  .k-datepicker,
    .form-scroll[b-9ak4jwwnow]  .k-upload,
    .form-scroll[b-9ak4jwwnow]  .k-upload .k-dropzone {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .form-scroll[b-9ak4jwwnow]  .k-upload .k-dropzone {
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .form-scroll[b-9ak4jwwnow]  .k-dropzone-hint {
        display: none;
    }

    .form-scroll[b-9ak4jwwnow]  .k-upload-files,
    .form-scroll[b-9ak4jwwnow]  .k-file {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .form-scroll[b-9ak4jwwnow]  .k-file-name,
    .form-scroll[b-9ak4jwwnow]  .k-file-info {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .form-scroll[b-9ak4jwwnow]  .k-file-actions {
        flex-shrink: 0;
    }

    .detail-tabstrip[b-9ak4jwwnow]  .k-tabstrip-items-wrapper {
        overflow-x: auto;
        overflow-y: hidden;
    }

    .detail-tabstrip[b-9ak4jwwnow]  .k-tabstrip-items {
        width: max-content;
        max-width: none;
        flex-wrap: nowrap;
    }

    .detail-tabstrip[b-9ak4jwwnow]  .k-tabstrip-item {
        flex: 0 0 auto;
    }

    .bottom-actionbar[b-9ak4jwwnow] {
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
        padding-bottom: 12px;
    }

    .bottom-actionbar__left[b-9ak4jwwnow],
    .bottom-actionbar__right[b-9ak4jwwnow] {
        width: 100%;
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .bottom-actionbar__right .me-5[b-9ak4jwwnow],
    .bottom-actionbar__right[b-9ak4jwwnow]  .me-5 {
        margin-right: 0 !important;
    }

    .bottom-actionbar[b-9ak4jwwnow]  .btn-lg {
        padding: 6px 10px;
        font-size: 14px;
    }
}

.attachment-title[b-9ak4jwwnow] {
    margin-bottom: 10px;
}
/* _content/eLipsOnline/Components/Pages/DetailPages/OrderDetailsWindow - Copy.razor.rz.scp.css */
html[b-ch0yrpv6ut], body[b-ch0yrpv6ut], #app[b-ch0yrpv6ut] {
    height: 100%;
    margin: 0;
}

*[b-ch0yrpv6ut],
*[b-ch0yrpv6ut]::before,
*[b-ch0yrpv6ut]::after {
    box-sizing: border-box;
}

.split-page[b-ch0yrpv6ut] {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(200px, 1fr);
/*    gap: 10px;*/
    overflow: hidden;
    background-color: var(--color-gray-50);
}

.split-panel[b-ch0yrpv6ut] {
    min-height: 0;
    overflow: hidden;
}

.top-panel[b-ch0yrpv6ut] {
    height: 100%;
    min-height: 0;
}

/* TOP */
.top-shell[b-ch0yrpv6ut],
.bottom-shell[b-ch0yrpv6ut] {
    min-height: 0;
    display: grid;
    gap: 10px;
    overflow: hidden;
}

.top-shell[b-ch0yrpv6ut] {
    height: 100%;
    grid-template-rows: minmax(0, 1fr);
    padding: 16px 16px 0px 16px;
}

.bottom-shell[b-ch0yrpv6ut] {
    height: 100%;
    background-color: var(--color-gray-50);
    padding: 0 8px 8px 8px;
}

.page-title[b-ch0yrpv6ut] {
    margin: 0;
    padding: 8px 8px 0 8px;
}

.page-title-bottom[b-ch0yrpv6ut] {
    margin: 0;
    padding: 0px 8px 0 0;
}

.top-content[b-ch0yrpv6ut] {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.detail-tabstrip[b-ch0yrpv6ut] {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

    /* Telerik TabStrip interne wrappers */
    .detail-tabstrip .k-tabstrip[b-ch0yrpv6ut],
    .detail-tabstrip .k-tabstrip-content[b-ch0yrpv6ut],
    .detail-tabstrip .k-content[b-ch0yrpv6ut],
    .detail-tabstrip[b-ch0yrpv6ut]  .k-tabstrip,
    .detail-tabstrip[b-ch0yrpv6ut]  .k-tabstrip-content,
    .detail-tabstrip[b-ch0yrpv6ut]  .k-content {
        height: 100%;
        min-height: 0;
        overflow: hidden;
    }

.tab-pane-fill[b-ch0yrpv6ut] {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.tab-pane-scroll[b-ch0yrpv6ut] {
    overflow: auto;
}

/* FORM TAB */
.form-scroll[b-ch0yrpv6ut] {
    height: 100%;
    min-height: 0;
    padding: 2px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.order-layout[b-ch0yrpv6ut] {
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(300px, 0.9fr);
    gap: 12px;
    align-items: stretch;
}

.order-info-card[b-ch0yrpv6ut],
.attachment-panel[b-ch0yrpv6ut] {
    min-width: 0;
    padding: 20px 20px 27px 20px;
    background-color: white;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.order-info-fields[b-ch0yrpv6ut] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 40px;
}

.form-column[b-ch0yrpv6ut] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.form-column-title-spacer[b-ch0yrpv6ut] {
    min-height: 28px;
}

.form-pair[b-ch0yrpv6ut] {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-width: 0;
}

    .form-pair > label[b-ch0yrpv6ut] {
        margin: 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        text-align: left;
    }

    .form-pair > *:last-child[b-ch0yrpv6ut] {
        min-width: 0;
    }



/* GRID TAB */
.grid-host[b-ch0yrpv6ut] {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.card[b-ch0yrpv6ut] {
    padding: 12px;
    border-radius: 8px;
    background: #e9ecef;
    margin-bottom: 12px;
}

/* Bottom */
.bottom-content[b-ch0yrpv6ut] {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

/* Responsive */
@media (max-width: 1400px) {
    .order-layout[b-ch0yrpv6ut] {
        grid-template-columns: minmax(0, 1.6fr) minmax(280px, 0.9fr);
    }

    .order-info-fields[b-ch0yrpv6ut] {
        grid-template-columns: 1fr;
        gap: 14px;
    }
}

@media (max-height: 760px) {
    .split-page[b-ch0yrpv6ut] {
        grid-template-rows: minmax(280px, 1fr) minmax(180px, 1fr);
    }
}

@media (max-width: 900px) {
    .split-page[b-ch0yrpv6ut] {
        display: block;
        height: 100%;
        overflow-x: hidden;
        overflow-y: auto;
    }

    .top-panel[b-ch0yrpv6ut] {
        height: auto;
    }

    .top-shell[b-ch0yrpv6ut],
    .bottom-shell[b-ch0yrpv6ut],
    .top-content[b-ch0yrpv6ut],
    .bottom-content[b-ch0yrpv6ut],
    .detail-tabstrip[b-ch0yrpv6ut],
    .detail-tabstrip .k-tabstrip[b-ch0yrpv6ut],
    .detail-tabstrip .k-tabstrip-content[b-ch0yrpv6ut],
    .detail-tabstrip .k-content[b-ch0yrpv6ut],
    .detail-tabstrip[b-ch0yrpv6ut]  .k-tabstrip,
    .detail-tabstrip[b-ch0yrpv6ut]  .k-tabstrip-content,
    .detail-tabstrip[b-ch0yrpv6ut]  .k-content,
    .tab-pane-fill[b-ch0yrpv6ut],
    .form-scroll[b-ch0yrpv6ut],
    .grid-host[b-ch0yrpv6ut] {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }

    .order-layout[b-ch0yrpv6ut] {
        grid-template-columns: 1fr;
        min-width: 0;
        width: 100%;
        max-width: 100%;
    }

    .order-info-fields[b-ch0yrpv6ut] {
        grid-template-columns: 1fr;
    }

    .form-pair[b-ch0yrpv6ut] {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .form-column-title-spacer[b-ch0yrpv6ut] {
        display: none;
    }

    .detail-tabstrip[b-ch0yrpv6ut]  .k-tabstrip-items-wrapper {
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
    }

    .detail-tabstrip[b-ch0yrpv6ut]  .k-tabstrip-items {
        width: max-content;
        max-width: none;
    }

    .bottom-content[b-ch0yrpv6ut] {
        overflow-x: auto !important;
        min-height: 220px;
    }

    .bottom-content[b-ch0yrpv6ut]  .k-grid,
    .grid-host[b-ch0yrpv6ut],
    .grid-host[b-ch0yrpv6ut]  .k-grid,
    .grid-host[b-ch0yrpv6ut]  .k-grid-content {
        min-height: 220px;
        max-width: 100%;
    }
}

@media (max-width: 600px) {
    .top-shell[b-ch0yrpv6ut] {
        padding: 8px;
        gap: 8px;
    }

    .bottom-shell[b-ch0yrpv6ut] {
        padding: 8px;
        gap: 8px;
    }

    .page-title[b-ch0yrpv6ut] {
        padding: 20px 8px 0px 8px;
    }

    .page-title-bottom[b-ch0yrpv6ut] {
        padding-left: 0;
        padding-right: 0;
    }

    .form-scroll[b-ch0yrpv6ut] {
        padding: 0;
    }

    .order-layout[b-ch0yrpv6ut] {
        gap: 22px;
    }

    .form-pair[b-ch0yrpv6ut],
    .form-pair > *[b-ch0yrpv6ut] {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .form-scroll[b-ch0yrpv6ut]  .k-input,
    .form-scroll[b-ch0yrpv6ut]  .k-input-inner,
    .form-scroll[b-ch0yrpv6ut]  .k-picker,
    .form-scroll[b-ch0yrpv6ut]  .k-textbox,
    .form-scroll[b-ch0yrpv6ut]  .k-dropdownlist,
    .form-scroll[b-ch0yrpv6ut]  .k-combobox,
    .form-scroll[b-ch0yrpv6ut]  .k-multicolumncombobox,
    .form-scroll[b-ch0yrpv6ut]  .k-datepicker,
    .form-scroll[b-ch0yrpv6ut]  .k-upload,
    .form-scroll[b-ch0yrpv6ut]  .k-upload .k-dropzone {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .form-scroll[b-ch0yrpv6ut]  .k-upload .k-dropzone {
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .attachment-empty[b-ch0yrpv6ut] {
        align-items: flex-start;
    }

    .form-scroll[b-ch0yrpv6ut]  .k-dropzone-hint {
        display: none;
    }

    .form-scroll[b-ch0yrpv6ut]  .k-upload-files,
    .form-scroll[b-ch0yrpv6ut]  .k-file {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .form-scroll[b-ch0yrpv6ut]  .k-file-name,
    .form-scroll[b-ch0yrpv6ut]  .k-file-info {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .form-scroll[b-ch0yrpv6ut]  .k-file-actions {
        flex-shrink: 0;
    }

    .detail-tabstrip[b-ch0yrpv6ut]  .k-tabstrip-items-wrapper {
        overflow-x: auto;
        overflow-y: hidden;
    }

    .detail-tabstrip[b-ch0yrpv6ut]  .k-tabstrip-items {
        width: max-content;
        max-width: none;
        flex-wrap: nowrap;
    }

    .detail-tabstrip[b-ch0yrpv6ut]  .k-tabstrip-item {
        flex: 0 0 auto;
    }

    .bottom-actionbar[b-ch0yrpv6ut] {
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
        padding-bottom: 12px;
    }

    .bottom-actionbar__left[b-ch0yrpv6ut],
    .bottom-actionbar__right[b-ch0yrpv6ut] {
        width: 100%;
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .bottom-actionbar__right .me-5[b-ch0yrpv6ut],
    .bottom-actionbar__right[b-ch0yrpv6ut]  .me-5 {
        margin-right: 0 !important;
    }

    .bottom-actionbar[b-ch0yrpv6ut]  .btn-lg {
        padding: 6px 10px;
        font-size: 14px;
    }
}
/* _content/eLipsOnline/Components/Pages/DetailPages/OrderDetailsWindow.razor.rz.scp.css */
html[b-c81e4620zj], body[b-c81e4620zj], #app[b-c81e4620zj] {
    height: 100%;
    margin: 0;
}

*[b-c81e4620zj],
*[b-c81e4620zj]::before,
*[b-c81e4620zj]::after {
    box-sizing: border-box;
}

.split-page[b-c81e4620zj] {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(200px, 1fr);
/*    gap: 10px;*/
    overflow: hidden;
    background-color: var(--color-gray-50);
}

.split-panel[b-c81e4620zj] {
    min-height: 0;
    overflow: hidden;
}

.top-panel[b-c81e4620zj] {
    height: 100%;
    min-height: 0;
}

/* TOP */
.top-shell[b-c81e4620zj],
.bottom-shell[b-c81e4620zj] {
    min-height: 0;
    display: grid;
    gap: 10px;
    overflow: hidden;
}

.top-shell[b-c81e4620zj] {
    height: 100%;
    grid-template-rows: minmax(0, 1fr);
    padding: 10px 16px 0px 16px;
}

.bottom-shell[b-c81e4620zj] {
    height: 100%;
    background-color: var(--color-gray-50);
    padding: 0 8px 8px 8px;
}

.page-title[b-c81e4620zj] {
    margin: 0;
    padding: 8px 8px 0 8px;
}

.page-title-bottom[b-c81e4620zj] {
    margin: 0;
    padding: 0px 8px 0 0;
}

.top-content[b-c81e4620zj] {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.detail-tabstrip[b-c81e4620zj] {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

    /* Telerik TabStrip interne wrappers */
    .detail-tabstrip .k-tabstrip[b-c81e4620zj],
    .detail-tabstrip .k-tabstrip-content[b-c81e4620zj],
    .detail-tabstrip .k-content[b-c81e4620zj],
    .detail-tabstrip[b-c81e4620zj]  .k-tabstrip,
    .detail-tabstrip[b-c81e4620zj]  .k-tabstrip-content,
    .detail-tabstrip[b-c81e4620zj]  .k-content {
        height: 100%;
        min-height: 0;
        overflow: hidden;
    }

.tab-pane-fill[b-c81e4620zj] {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.tab-pane-scroll[b-c81e4620zj] {
    overflow: auto;
}

/* FORM TAB */
.form-scroll[b-c81e4620zj] {
    height: 100%;
    min-height: 0;
    padding: 2px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.order-layout[b-c81e4620zj] {
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(300px, 0.9fr);
    gap: 12px;
    align-items: stretch;
}

.order-info-card[b-c81e4620zj],
.attachment-panel[b-c81e4620zj] {
    min-width: 0;
    padding: 20px 20px 27px 20px;
    background-color: var(--white);
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.order-info-fields[b-c81e4620zj] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 40px;
}

.form-column[b-c81e4620zj] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.form-column-title-spacer[b-c81e4620zj] {
    min-height: 28px;
}

.form-pair[b-c81e4620zj] {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-width: 0;
}

    .form-pair > label[b-c81e4620zj] {
        margin: 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        text-align: left;
    }

    .form-pair > *:last-child[b-c81e4620zj] {
        min-width: 0;
    }



/* GRID TAB */
.grid-host[b-c81e4620zj] {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.card[b-c81e4620zj] {
    padding: 12px;
    border-radius: 8px;
    background: #e9ecef;
    margin-bottom: 12px;
}

/* Bottom */
.bottom-content[b-c81e4620zj] {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

/* Responsive */
@media (max-width: 1400px) {
    .order-layout[b-c81e4620zj] {
        grid-template-columns: minmax(0, 1.6fr) minmax(280px, 0.9fr);
    }

    .order-info-fields[b-c81e4620zj] {
        grid-template-columns: 1fr;
        gap: 14px;
    }
}

@media (max-height: 760px) {
    .split-page[b-c81e4620zj] {
        grid-template-rows: minmax(280px, 1fr) minmax(180px, 1fr);
    }
}

@media (max-width: 900px) {
    .split-page[b-c81e4620zj] {
        display: block;
        height: 100%;
        overflow-x: hidden;
        overflow-y: auto;
    }

    .top-panel[b-c81e4620zj] {
        height: auto;
    }

    .top-shell[b-c81e4620zj],
    .bottom-shell[b-c81e4620zj],
    .top-content[b-c81e4620zj],
    .bottom-content[b-c81e4620zj],
    .detail-tabstrip[b-c81e4620zj],
    .detail-tabstrip .k-tabstrip[b-c81e4620zj],
    .detail-tabstrip .k-tabstrip-content[b-c81e4620zj],
    .detail-tabstrip .k-content[b-c81e4620zj],
    .detail-tabstrip[b-c81e4620zj]  .k-tabstrip,
    .detail-tabstrip[b-c81e4620zj]  .k-tabstrip-content,
    .detail-tabstrip[b-c81e4620zj]  .k-content,
    .tab-pane-fill[b-c81e4620zj],
    .form-scroll[b-c81e4620zj],
    .grid-host[b-c81e4620zj] {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }

    .order-layout[b-c81e4620zj] {
        grid-template-columns: 1fr;
        min-width: 0;
        width: 100%;
        max-width: 100%;
    }

    .order-info-fields[b-c81e4620zj] {
        grid-template-columns: 1fr;
    }

    .form-pair[b-c81e4620zj] {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .form-column-title-spacer[b-c81e4620zj] {
        display: none;
    }

    .detail-tabstrip[b-c81e4620zj]  .k-tabstrip-items-wrapper {
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
    }

    .detail-tabstrip[b-c81e4620zj]  .k-tabstrip-items {
        width: max-content;
        max-width: none;
    }

    .bottom-content[b-c81e4620zj] {
        overflow-x: auto !important;
        min-height: 220px;
    }

    .bottom-content[b-c81e4620zj]  .k-grid,
    .grid-host[b-c81e4620zj],
    .grid-host[b-c81e4620zj]  .k-grid,
    .grid-host[b-c81e4620zj]  .k-grid-content {
        min-height: 220px;
        max-width: 100%;
    }
}

@media (max-width: 600px) {
    .top-shell[b-c81e4620zj] {
        padding: 8px;
        gap: 8px;
    }

    .bottom-shell[b-c81e4620zj] {
        padding: 8px;
        gap: 8px;
    }

    .page-title[b-c81e4620zj] {
        padding: 20px 8px 0px 8px;
    }

    .page-title-bottom[b-c81e4620zj] {
        padding-left: 0;
        padding-right: 0;
    }

    .form-scroll[b-c81e4620zj] {
        padding: 0;
    }

    .order-layout[b-c81e4620zj] {
        gap: 22px;
    }

    .form-pair[b-c81e4620zj],
    .form-pair > *[b-c81e4620zj] {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .form-scroll[b-c81e4620zj]  .k-input,
    .form-scroll[b-c81e4620zj]  .k-input-inner,
    .form-scroll[b-c81e4620zj]  .k-picker,
    .form-scroll[b-c81e4620zj]  .k-textbox,
    .form-scroll[b-c81e4620zj]  .k-dropdownlist,
    .form-scroll[b-c81e4620zj]  .k-combobox,
    .form-scroll[b-c81e4620zj]  .k-multicolumncombobox,
    .form-scroll[b-c81e4620zj]  .k-datepicker,
    .form-scroll[b-c81e4620zj]  .k-upload,
    .form-scroll[b-c81e4620zj]  .k-upload .k-dropzone {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .form-scroll[b-c81e4620zj]  .k-upload .k-dropzone {
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .attachment-empty[b-c81e4620zj] {
        align-items: flex-start;
    }

    .form-scroll[b-c81e4620zj]  .k-dropzone-hint {
        display: none;
    }

    .form-scroll[b-c81e4620zj]  .k-upload-files,
    .form-scroll[b-c81e4620zj]  .k-file {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .form-scroll[b-c81e4620zj]  .k-file-name,
    .form-scroll[b-c81e4620zj]  .k-file-info {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .form-scroll[b-c81e4620zj]  .k-file-actions {
        flex-shrink: 0;
    }

    .detail-tabstrip[b-c81e4620zj]  .k-tabstrip-items-wrapper {
        overflow-x: auto;
        overflow-y: hidden;
    }

    .detail-tabstrip[b-c81e4620zj]  .k-tabstrip-items {
        width: max-content;
        max-width: none;
        flex-wrap: nowrap;
    }

    .detail-tabstrip[b-c81e4620zj]  .k-tabstrip-item {
        flex: 0 0 auto;
    }

    .bottom-actionbar[b-c81e4620zj] {
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
        padding-bottom: 12px;
    }

    .bottom-actionbar__left[b-c81e4620zj],
    .bottom-actionbar__right[b-c81e4620zj] {
        width: 100%;
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .bottom-actionbar__right .me-5[b-c81e4620zj],
    .bottom-actionbar__right[b-c81e4620zj]  .me-5 {
        margin-right: 0 !important;
    }

    .bottom-actionbar[b-c81e4620zj]  .btn-lg {
        padding: 6px 10px;
        font-size: 14px;
    }
}
/* _content/eLipsOnline/Components/Pages/DetailPages/OrderregelDetails - Copy.razor.rz.scp.css */

.form-actions[b-koe4ru9236] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 20px;
    border-top: 1px solid #ccc;
    background-color: #f0f0f0;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
}

.form-actions-left[b-koe4ru9236], .form-actions-right[b-koe4ru9236] {
    display: flex;
    gap: 10px;
}

.page-layout[b-koe4ru9236] {
    display: grid;
    grid-template-rows: 60% 40%; /* of bijv. 70% 30% */
    height: calc(100vh - 60px); /* -60px als je rekening houdt met header of knoppen */
}

.page-top[b-koe4ru9236] {
    overflow: auto; /* zodat je kan scrollen in de tab inhoud */
}

.page-bottom[b-koe4ru9236] {
    overflow: auto; /* zodat de grid netjes scrollt */
}

/* Binnen elke kolom: label + input */
.form-two-col[b-koe4ru9236] {
    display: grid;
    grid-template-columns: 150px 1fr; /* label + veld */
    gap: 6px 12px;
    align-items: center;
}

    .form-two-col label[b-koe4ru9236] {
        font-size: 0.9rem;
    }

/* Orders-tab: 2 kolommen, elk met label+veld-grid */
.form-columns[b-koe4ru9236] {
    display: grid;
    grid-template-columns: auto auto auto auto; /* links/rechts/bijlagen kolom */
    gap: 16px 32px;
    padding-right: 16px;
    box-sizing: border-box;
    width: 50%;
}

.drop-zone[b-koe4ru9236] {
    overflow-y:auto;
    height:100%;
    max-height:100%;
    width: 100%; /* in plaats van vaste breedte */
    border: 2px dashed #bbb;
    border-radius: 6px;
    padding: 20px;
    text-align: center;
    color: #666;
    font-size: 0.9rem;
    cursor: pointer;
    background: #fafafa;
    box-sizing: border-box;
}
    .drop-zone.hover[b-koe4ru9236] {
        border-color: #007bff;
        color: #007bff;
        background: #f0f8ff;
    }

.remove-button[b-koe4ru9236] {
    background-color: #9c1818; /* Red background */
    border: none;
    color: white;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    margin: 20px 2px;
    cursor: pointer;
    border-radius: 50%; /* Circular button */
    width: 28px; /* Fixed width */
    height: 28px; /* Fixed height */
    line-height: 20px; /* Match the height to vertically center the '-' */
    padding: 0; /* Reset padding */
    font-weight: bold;
}

    .remove-button:hover[b-koe4ru9236] {
        background-color: #601515; /* Darker shade of red */
    }

.orderRegelDetailsOptionalElements[b-koe4ru9236] {
    max-height: 150px;
    min-height:150px;
    width: 100%;
    overflow-x: auto;
    overflow-y: auto;
}

.orderRegelDetailsOptionalElementsItem[b-koe4ru9236] {
    display: grid;
    grid-template-columns: auto 150px 1fr; /* checkbox | code | omschrijving */
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 2px 4px;
    box-sizing: border-box;
}

    .orderRegelDetailsOptionalElementsItem label[b-koe4ru9236] {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .orderRegelDetailsOptionalElementsItem .omschrijving[b-koe4ru9236] {
        text-align: left;
    }


.section-group[b-koe4ru9236] {
    border: 1px solid #ccc;
    padding: 12px 16px;
    border-radius: 6px;
    margin-bottom: 18px;
    background: #fafafa;
}

.section-title[b-koe4ru9236] {
    font-weight: bold;
    margin-top: -14px;
    margin-left: 4px;
    background: #fafafa;
    padding: 0 6px;
    position: absolute;
}

.section-grid[b-koe4ru9236] {
    display: grid;
    grid-template-columns: 150px auto;
    row-gap: 6px;
    column-gap: 12px;
}

.section-row[b-koe4ru9236] {
    display: flex;
    flex-direction: row;
    gap: 20px;
}


.orderregel-sections[b-koe4ru9236] {
    display: grid;
    grid-template-columns: 1.2fr 1fr 1.2fr;
    gap: 8px;
    margin-top: 4px;
}

/* kolommen */
.section-column[b-koe4ru9236] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* groupbox */
.section-panel[b-koe4ru9236] {
    position: relative;
    border: 1px solid #c0c0c0;
    border-radius: 3px;
    padding: 10px 8px 8px;
    background-color: #f8f8f8;
}

/* titel boven rand (WinForms groupbox style) */
.section-header[b-koe4ru9236] {
    position: absolute;
    top: -9px;
    left: 10px;
    padding: 0 4px;
    background-color: #f0f0f0;
    font-weight: bold;
    font-size: 0.85rem;
}

/* standaard layout: label + control */
.section-body[b-koe4ru9236] {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    gap: 2px 6px;
    margin-top: 4px;
}

/* wat compacter voor sub-secties */
.section-body-tight[b-koe4ru9236] {
    grid-template-columns: 130px minmax(0, 1fr);
}

/* 1 kolom variant (bijlagen/opties) */
.section-body.single-column[b-koe4ru9236] {
    grid-template-columns: 1fr;
}

/* sub sectie binnen groupbox (HERKOMST / BESTEMMING) */
.sub-section[b-koe4ru9236] {
    margin-top: 4px;
    padding-top: 4px;
    border-top: 1px dashed #c0c0c0;
}

.sub-section-title[b-koe4ru9236] {
    font-weight: bold;
    font-size: 0.8rem;
    margin-bottom: 2px;
}

/* Titel bovenaan per blok */
.od-title[b-koe4ru9236] {
    grid-column: 1 / -1;
    font-weight: bold;
    font-size: 0.85rem;
    margin-bottom: 6px;
    border-bottom: 1px solid #ddd;
    padding-bottom: 2px;
}

/* Herkomst + Bestemming: label en input naast elkaar */
.origin-destination-grid .od-panel[b-koe4ru9236] {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    gap: 6px 10px;
    align-items: center;
}


.origin-destination-grid[b-koe4ru9236] {
    grid-column: 1 / -1;  /*pak BEIDE columns van section-body  */
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 32px;
    width: 100%;
}
    .origin-destination-grid label[b-koe4ru9236] {
        margin-top: 8px;
        font-weight: 500;
    }

.sub-section-title[b-koe4ru9236] {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 8px;
    border-bottom: 1px solid #ddd;
}


/* GRID voor Voormelding + Afstanden */
.dual-grid[b-koe4ru9236] {
    grid-column: 1 / -1; /* override section-body 2-column gedoe */
    display: grid;
    grid-template-columns: 1fr 1fr; /* twee gelijke kolommen */
    gap: 4px 8px;
    width: 100%;
}

/* Velden iets smaller maken */
.small-fields[b-koe4ru9236] {
    grid-template-columns: 120px 1fr !important;
}

.dual-grid .section-panel[b-koe4ru9236] {
    min-width: 0; /* voorkomt dat hij breder wil worden dan de kolom */
}

/* Container: 2 kolommen binnen de panel */
.section-body.container-grid[b-koe4ru9236] {
    display: grid;
    grid-template-columns: 1fr 1fr; /* links / rechts */
    gap: 8px 16px;
}

/* Per kolom weer label + veld */
.container-grid-col[b-koe4ru9236] {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    gap: 2px 6px;
}


.voormelding-grid[b-koe4ru9236] {
    display: grid;
    grid-template-columns: 140px 1fr 140px 1fr; /* label veld | label veld */
    gap: 6px 12px;
    align-items: center;
}

/* als extra info ook naast elkaar moet */
.voormelding-grid-full[b-koe4ru9236] {
    grid-template-columns: 140px 1fr 140px 1fr;
}

/* Voormelding links – Bijlagen rechts */
.voormelding-met-bijlagen-row[b-koe4ru9236] {
    display: flex;
    height:100%;
}

    /* Panel mag kleiner worden zodat het mooi naast elkaar past */
    .voormelding-met-bijlagen-row .section-panel[b-koe4ru9236] {
        min-width: 0;
    }

/* 2 kolommen voor Lading sectie */
.section-body.lading-grid[b-koe4ru9236] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 16px;
}

/* Binnen elke kolom: label + veld */
.lading-grid-col[b-koe4ru9236] {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    gap: 2px 6px;
}
/* _content/eLipsOnline/Components/Pages/DetailPages/OrderregelDetails.razor.rz.scp.css */
.orderregel-detail-page[b-h1zmyp1xsf] {
    height: 100dvh;
    display: grid;
    grid-template-rows: minmax(0, 1.70fr) minmax(180px, 1fr);
    gap: 10px;
    padding: 18px 8px;
    overflow: hidden;
    background: var(--color-gray-50);
    box-sizing: border-box;
}

.upper-panel[b-h1zmyp1xsf] {
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.panel-topbar[b-h1zmyp1xsf],
.bottom-topbar[b-h1zmyp1xsf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-shrink: 0;
    padding: 0 8px;
}

    .panel-topbar h5[b-h1zmyp1xsf] {
        margin-top: -10px;
    }

    .topbar-actions[b-h1zmyp1xsf],
    .bottom-actions-right[b-h1zmyp1xsf],
    .bottom-actions-left[b-h1zmyp1xsf] {
        display: flex;
        align-items: center;
        gap: 18px;
        flex-wrap: wrap;
    }

.topbar-actions[b-h1zmyp1xsf] {
    min-height: 32px;
}

.topbar-switch-field[b-h1zmyp1xsf] {
    height: 32px;
    display: grid;
    grid-template-rows: 12px 18px;
    align-items: center;
    justify-items: center;
    gap: 1px;
}

    .topbar-switch-field span[b-h1zmyp1xsf] {
        font-size: 0.7rem;
        line-height: 1;
        color: var(--color-gray-600);
        white-space: nowrap;
    }

    .topbar-switch-field[b-h1zmyp1xsf]  .k-switch {
        transform: scale(0.82);
        transform-origin: center;
    }

.topbar-order-pill[b-h1zmyp1xsf] {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 0.75rem;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    background: #fff;
    color: var(--color-gray-800);
    font-size: 0.875rem;
    line-height: 1;
    white-space: nowrap;
}

.orderregel-tabs-shell[b-h1zmyp1xsf] {
    min-height: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

    .orderregel-tabs-shell[b-h1zmyp1xsf]  .k-tabstrip {
        flex: 1;
        min-height: 0;
        height: 100%;
        padding: 0px 8px 8px 8px;
        background: transparent;
        box-shadow: none;
    }

    .orderregel-tabs-shell[b-h1zmyp1xsf]  .k-tabstrip-items-wrapper,
    .orderregel-tabs-shell[b-h1zmyp1xsf]  .k-tabstrip-items {
        overflow: visible;
    }

        .orderregel-tabs-shell[b-h1zmyp1xsf]  .k-tabstrip-items .k-item.k-active {
            position: relative;
            z-index: 2;
            background: #fff;
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
        }

    .orderregel-tabs-shell[b-h1zmyp1xsf]  .k-tabstrip-content,
    .orderregel-tabs-shell[b-h1zmyp1xsf]  .k-tabstrip > .k-content {
        position: relative;
        z-index: 1;
        min-height: 0;
        flex: 1 1 auto;
        display: flex;
        flex-direction: column;
        background: #fff;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
    }

[b-h1zmyp1xsf] .order-tabs {
    min-height: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
}

    [b-h1zmyp1xsf] .order-tabs .k-tabstrip-content,
    [b-h1zmyp1xsf] .order-tabs .k-tabstrip-content.k-active,
    [b-h1zmyp1xsf] .order-tabs > .k-content,
    [b-h1zmyp1xsf] .order-tabs > .k-content.k-active {
        width: 100%;
        max-width: 100%;
        min-height: 0;
        min-width: 0;
        flex: 1;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        padding: 0;
    }

[b-h1zmyp1xsf] .order-tabs .k-tabstrip-content > *,
[b-h1zmyp1xsf] .order-tabs .k-content > * {
    width: 100%;
    max-width: 100%;
    min-height: 0;
    min-width: 0;
}

.voorcalculaties-tab[b-h1zmyp1xsf] {
    width: 100%;
    max-width: 100%;
    height: 100%;
    min-height: 0;
    min-width: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) minmax(200px, 0.35fr);
    overflow: hidden;
}

.voorcalculaties-pane-upper[b-h1zmyp1xsf] {
    border-bottom: 1px solid var(--color-gray-200);
}

.voorcalculaties-pane[b-h1zmyp1xsf] {
    width: 100%;
    max-width: 100%;
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.grid-tab[b-h1zmyp1xsf] {
    width: 100%;
    max-width: 100%;
    height: 100%;
    min-height: 0;
    min-width: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    overflow: hidden;
}

.grid-pane[b-h1zmyp1xsf] {
    width: 100%;
    max-width: 100%;
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

    .grid-pane[b-h1zmyp1xsf]  .k-grid {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

.voormelden-tab[b-h1zmyp1xsf] {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.38fr);
    grid-template-rows: minmax(0, 1fr);
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.voormeld-message-pane[b-h1zmyp1xsf] {
    height: 100%;
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-left: 1px solid var(--color-gray-200);
    background: #fff;
}

.voormeld-message-title[b-h1zmyp1xsf] {
    flex-shrink: 0;
    min-height: 39px;
    display: flex;
    align-items: center;
    padding: 0 12px;
    border-bottom: 1px solid var(--color-gray-200);
    color: var(--color-gray-800);
    font-size: 0.9rem;
    font-weight: 600;
}

.voormeld-message-content[b-h1zmyp1xsf] {
    max-height: 100%;
    min-height: 0;
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 12px;
    color: var(--color-gray-800);
    font-size: 0.9rem;
    line-height: 1.4;
    white-space: pre-wrap;
}

.voormeld-message-empty[b-h1zmyp1xsf] {
    color: var(--color-gray-500);
}

.extra-info-pane[b-h1zmyp1xsf] {
    align-items: stretch;
    padding: 10px;
    box-sizing: border-box;
}

.extra-waarde-cell[b-h1zmyp1xsf] {
    width: 100%;
    min-height: 1.5rem;
    cursor: text;
}

.opmerkingen-tab[b-h1zmyp1xsf] {
    width: 100%;
    max-width: 100%;
    height: 100%;
    min-height: 0;
    min-width: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    padding: 10px;
    box-sizing: border-box;
    background: #fff;
}

.opmerkingen-header[b-h1zmyp1xsf] {
    min-height: 0;
    display: flex;
    align-items: center;
    padding: 0 0 8px 2px;
}

    .opmerkingen-header h6[b-h1zmyp1xsf] {
        margin: 0;
        line-height: 1.2;
    }

.opmerkingen-tab[b-h1zmyp1xsf]  .opmerkingen-textarea,
.opmerkingen-tab[b-h1zmyp1xsf]  .opmerkingen-textarea textarea {
    height: 100%;
    min-height: 0;
    resize: none;
}

[b-h1zmyp1xsf] .orderregel-form {
    flex: 1;
    width: 100%;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

    [b-h1zmyp1xsf] .orderregel-form .k-form-layout,
    [b-h1zmyp1xsf] .orderregel-form .k-form-fieldset {
        flex: 1;
        height: 100%;
        min-height: 0;
        margin: 0;
        padding: 0;
        border: 0;
        display: flex;
        flex-direction: column;
    }

    [b-h1zmyp1xsf] .orderregel-form .k-form-field,
    [b-h1zmyp1xsf] .orderregel-form .k-form-field-wrap,
    [b-h1zmyp1xsf] .orderregel-form .k-form-field > .k-form-field-wrap {
        flex: 1;
        width: 100%;
        height: 100%;
        min-height: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
    }

    [b-h1zmyp1xsf] .orderregel-form .k-form-buttons {
        display: none;
    }

.order-layout[b-h1zmyp1xsf] {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(320px, 1.5fr) minmax(430px, 2fr) minmax(140px, 0.6fr);
    gap: 10px;
    padding: 10px;
}

.box-group[b-h1zmyp1xsf] {
    min-height: 0;
}

.group-one[b-h1zmyp1xsf] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1.3fr 0.75fr;
    gap: 10px;
}

.one-a[b-h1zmyp1xsf] {
    grid-column: 1;
    grid-row: 1;
}

.one-b[b-h1zmyp1xsf] {
    grid-column: 1;
    grid-row: 2;
}

.one-c[b-h1zmyp1xsf] {
    grid-column: 2;
    grid-row: 1 / span 2;
}

.group-two-three[b-h1zmyp1xsf] {
    display: grid;
    grid-template-columns: 1fr 1fr 0.52fr;
    grid-template-rows: 1fr 0.88fr;
    gap: 10px;
}

.two-a[b-h1zmyp1xsf] {
    grid-column: 1;
    grid-row: 1;
}

.two-b[b-h1zmyp1xsf] {
    grid-column: 2;
    grid-row: 1;
}

.two-c[b-h1zmyp1xsf] {
    grid-column: 3;
    grid-row: 1;
}

.optional-elements-box[b-h1zmyp1xsf] {
    align-self: start;
    min-height: 0;
    max-height: min(100%, 22rem);
}

.optional-elements-list[b-h1zmyp1xsf] {
    min-height: 0;
    overflow-y: auto;
}

.three-a[b-h1zmyp1xsf] {
    grid-column: 1;
    grid-row: 2;
}

.three-b[b-h1zmyp1xsf] {
    grid-column: 2 / span 2;
    grid-row: 2;
}

.group-four[b-h1zmyp1xsf] {
    display: grid;
}

.box[b-h1zmyp1xsf] {
    min-width: 0;
    min-height: 9rem;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    line-height: 1;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0.3rem;
    padding: 0.7rem 1rem;
    font-size: 0.9rem;
    background-color: white;
}

.box-xs[b-h1zmyp1xsf] {
    min-width: 0;
    min-height: 11rem;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    line-height: 1;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0.3rem;
    padding: 0.7rem 0.5rem;
    font-size: 0.9rem;
    background-color: white;
}

.lading-form-grid > .checkbox-row[b-h1zmyp1xsf] {
    grid-column: 1 / -1;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    white-space: normal;
    line-height: 1.2;
}

    .lading-form-grid > .checkbox-row span[b-h1zmyp1xsf] {
        min-width: 0;
    }

.bottom-panel[b-h1zmyp1xsf] {
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 0 8px;
}

.activity-box[b-h1zmyp1xsf] {
    flex: 1;
    min-height: 120px;
    background: #fff;
    min-width: 0;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.activity-box[b-h1zmyp1xsf]  .k-grid {
    width: 100%;
    max-width: 100%;
}

.bottom-actions[b-h1zmyp1xsf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-shrink: 0;
}

/* Tablet */
@media (max-width: 1100px) {
    .orderregel-detail-page[b-h1zmyp1xsf] {
        height: auto;
        min-height: 100dvh;
        overflow: visible;
        grid-template-rows: auto auto;
    }

    .upper-panel[b-h1zmyp1xsf],
    .bottom-panel[b-h1zmyp1xsf] {
        min-height: auto;
    }

    .orderregel-tabs-shell[b-h1zmyp1xsf] {
        min-height: auto;
        overflow: visible;
    }

    [b-h1zmyp1xsf] .order-tabs {
        flex: initial;
        min-height: auto;
    }

    [b-h1zmyp1xsf] .orderregel-form,
    [b-h1zmyp1xsf] .orderregel-form .k-form-layout,
    [b-h1zmyp1xsf] .orderregel-form .k-form-fieldset {
        flex: initial;
        height: auto;
        min-height: auto;
    }

    [b-h1zmyp1xsf] .orderregel-form .k-form-field,
    [b-h1zmyp1xsf] .orderregel-form .k-form-field-wrap,
    [b-h1zmyp1xsf] .orderregel-form .k-form-field > .k-form-field-wrap {
        height: auto;
        min-height: auto;
    }

    .order-layout[b-h1zmyp1xsf] {
        height: auto;
        min-height: auto;
        grid-template-columns: 1fr;
    }

    .group-one[b-h1zmyp1xsf] {
        min-height: 360px;
    }

    .group-two-three[b-h1zmyp1xsf] {
        min-height: 420px;
    }

    .group-four[b-h1zmyp1xsf] {
        min-height: 260px;
    }

    .optional-elements-box[b-h1zmyp1xsf] {
        max-height: 18rem;
    }

    .voormelden-tab[b-h1zmyp1xsf] {
        grid-template-columns: 1fr;
        grid-template-rows: minmax(320px, 1fr) minmax(180px, auto);
    }

    .voormeld-message-pane[b-h1zmyp1xsf] {
        min-height: 180px;
        border-left: 0;
        border-top: 1px solid var(--color-gray-200);
    }

    [b-h1zmyp1xsf] .order-tabs .k-tabstrip-content,
    [b-h1zmyp1xsf] .order-tabs .k-tabstrip-content.k-active,
    [b-h1zmyp1xsf] .order-tabs > .k-content,
    [b-h1zmyp1xsf] .order-tabs > .k-content.k-active {
        flex: initial;
        min-height: auto;
        overflow: visible;
    }
}

/* Mobile */
@media (max-width: 640px) {
    .orderregel-detail-page[b-h1zmyp1xsf] {
        padding: 14px;
        gap: 14px;
    }

    .panel-topbar[b-h1zmyp1xsf],
    .bottom-actions[b-h1zmyp1xsf] {
        align-items: stretch;
        flex-direction: column;
    }

    .topbar-actions[b-h1zmyp1xsf],
    .bottom-actions-right[b-h1zmyp1xsf] {
        gap: 10px;
    }

    [b-h1zmyp1xsf] .topbar-actions .k-button,
    [b-h1zmyp1xsf] .bottom-actions .k-button {
        width: 100%;
    }

    .group-one[b-h1zmyp1xsf],
    .group-two-three[b-h1zmyp1xsf] {
        display: flex;
        flex-direction: column;
        min-height: auto;
    }

    .box[b-h1zmyp1xsf] {
        min-height: 150px;
    }

    .four-a[b-h1zmyp1xsf] {
        min-height: 220px;
    }

    .activity-box[b-h1zmyp1xsf] {
        min-height: 260px;
    }
}

.orderregel-map-shell[b-h1zmyp1xsf] {
    height: 100%;
    min-height: 0;
    flex: 1;
    display: grid;
    grid-template-rows: minmax(0, 1.2fr) minmax(150px, 1fr);
    background: #fff;
}

[b-h1zmyp1xsf] .kaart-window .k-window-content {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
}

.map-embed-panel[b-h1zmyp1xsf],
.map-bottom-panel[b-h1zmyp1xsf] {
    min-height: 0;
    min-width: 0;
    overflow: hidden;
    background: #fff;
}

.map-embed[b-h1zmyp1xsf] {
    width: 100%;
    height: 100%;
    min-height: 280px;
    border: 0;
    display: block;
}

.map-bottom-panel[b-h1zmyp1xsf] {
    display: flex;
    flex-direction: column;
}

.map-bottom-toolbar[b-h1zmyp1xsf] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    flex-shrink: 0;
    padding: 8px;
    border-bottom: 1px solid var(--color-gray-200);
    background: var(--color-gray-50);
}

.map-bottom-content[b-h1zmyp1xsf] {
    min-height: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: #fff;
}

[b-h1zmyp1xsf] .map-result-tabs {
    height: 100%;
    min-height: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    border: 0;
    background: #fff;
}

    [b-h1zmyp1xsf] .map-result-tabs .k-tabstrip-items-wrapper {
        flex-shrink: 0;
        border-bottom: 1px solid var(--color-gray-200);
        background: #fff;
    }

    [b-h1zmyp1xsf] .map-result-tabs .k-tabstrip-items {
        min-height: 34px;
    }

    [b-h1zmyp1xsf] .map-result-tabs .k-tabstrip-items .k-item {
        min-height: 34px;
        font-size: 0.84rem;
    }

    [b-h1zmyp1xsf] .map-result-tabs .k-tabstrip-content,
    [b-h1zmyp1xsf] .map-result-tabs .k-tabstrip-content.k-active,
    [b-h1zmyp1xsf] .map-result-tabs > .k-content,
    [b-h1zmyp1xsf] .map-result-tabs > .k-content.k-active {
        height: 100%;
        min-height: 0;
        flex: 1;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        padding: 0;
        border: 0;
        background: #fff;
    }

.map-result-pane[b-h1zmyp1xsf] {
    height: 100%;
    min-height: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.map-grid-host[b-h1zmyp1xsf] {
    height: 100%;
    min-height: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-sizing: border-box;
}

    .map-grid-host[b-h1zmyp1xsf]  .k-grid {
        height: 100% !important;
        min-height: 0;
        flex: 1;
        display: flex;
        flex-direction: column;
        width: 100%;
        max-width: 100%;
    }

    .map-grid-host[b-h1zmyp1xsf]  .k-grid-container {
        min-height: 0;
        flex: 1;
    }

    .map-grid-host[b-h1zmyp1xsf]  .k-grid-content {
        min-height: 0;
        flex: 1;
        overflow: auto;
    }
/* _content/eLipsOnline/Components/Pages/DetailPages/OrderregelDetailsWindow.razor.rz.scp.css */
.orderregel-container[b-mtubmldwnt] {
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    box-sizing: border-box;
}

[b-mtubmldwnt] .orderregel-details-window .k-window-content {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
}

.orderregel-detail-page[b-mtubmldwnt] {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, 1.10fr) minmax(180px, 0.70fr);
    gap: 10px;
    padding: 5px 8px 16px 8px;
    overflow: hidden;
    background: var(--color-gray-50);
    box-sizing: border-box;
}

.upper-panel[b-mtubmldwnt] {
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.panel-topbar[b-mtubmldwnt],
.bottom-topbar[b-mtubmldwnt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-shrink: 0;
    padding: 0 8px;
}

    .panel-topbar[b-mtubmldwnt] {
        margin-top: -10px;
        margin-bottom: 3px;
/*        justify-content: flex-end;*/
    }

    .topbar-actions[b-mtubmldwnt] {
        display: flex;
        align-items: center;
        gap: 18px;
        flex-wrap: wrap;
    }

.topbar-meta[b-mtubmldwnt] {
    display: flex;
    flex-direction: row;
    gap: 15px;
    align-items: center;
    justify-content: flex-end;
    min-width: 0;
    flex-wrap: wrap;
    row-gap: 6px;
}

.topbar-meta h6[b-mtubmldwnt] {
    margin: 0;
    white-space: nowrap;
}

.topbar-actions[b-mtubmldwnt] {
    min-height: 32px;
}

.topbar-switch-field[b-mtubmldwnt] {
    height: 32px;
    display: grid;
    grid-template-rows: 12px 18px;
    align-items: center;
    justify-items: center;
    gap: 1px;
}

    .topbar-switch-field span[b-mtubmldwnt] {
        font-size: 0.7rem;
        line-height: 1;
        color: var(--color-gray-600);
        white-space: nowrap;
    }

    .topbar-switch-field[b-mtubmldwnt]  .k-switch {
        transform: scale(0.82);
        transform-origin: center;
    }

.topbar-order-pill[b-mtubmldwnt] {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 0.75rem;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    background: #fff;
    color: var(--color-gray-800);
    font-size: 0.875rem;
    line-height: 1;
    white-space: nowrap;
}

.orderregel-tabs-shell[b-mtubmldwnt] {
    min-height: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

    .orderregel-tabs-shell[b-mtubmldwnt]  .k-tabstrip {
        flex: 1;
        min-height: 0;
        height: 100%;
        padding: 0px 8px 8px 8px;
        background: transparent;
        box-shadow: none;
    }

    .orderregel-tabs-shell[b-mtubmldwnt]  .k-tabstrip-items-wrapper,
    .orderregel-tabs-shell[b-mtubmldwnt]  .k-tabstrip-items {
        overflow: visible;
    }

        .orderregel-tabs-shell[b-mtubmldwnt]  .k-tabstrip-items .k-item.k-active {
            position: relative;
            z-index: 2;
            background: #fff;
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
        }

    .orderregel-tabs-shell[b-mtubmldwnt]  .k-tabstrip-content,
    .orderregel-tabs-shell[b-mtubmldwnt]  .k-tabstrip > .k-content {
        position: relative;
        z-index: 1;
        min-height: 0;
        flex: 1 1 auto;
        display: flex;
        flex-direction: column;
        background: #fff;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
    }

[b-mtubmldwnt] .order-tabs {
    min-height: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
}

    [b-mtubmldwnt] .order-tabs .k-tabstrip-content,
    [b-mtubmldwnt] .order-tabs .k-tabstrip-content.k-active,
    [b-mtubmldwnt] .order-tabs > .k-content,
    [b-mtubmldwnt] .order-tabs > .k-content.k-active {
        width: 100%;
        max-width: 100%;
        min-height: 0;
        min-width: 0;
        flex: 1;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        padding: 0;
    }

[b-mtubmldwnt] .order-tabs .k-tabstrip-content > *,
[b-mtubmldwnt] .order-tabs .k-content > * {
    width: 100%;
    max-width: 100%;
    min-height: 0;
    min-width: 0;
}

.voorcalculaties-tab[b-mtubmldwnt] {
    width: 100%;
    max-width: 100%;
    height: 100%;
    min-height: 0;
    min-width: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) minmax(200px, 0.35fr);
    overflow: hidden;
}

.voorcalculaties-pane-upper[b-mtubmldwnt] {
    border-bottom: 1px solid var(--color-gray-200);
}

.voorcalculaties-pane[b-mtubmldwnt] {
    width: 100%;
    max-width: 100%;
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.grid-tab[b-mtubmldwnt] {
    width: 100%;
    max-width: 100%;
    height: 100%;
    min-height: 0;
    min-width: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    overflow: hidden;
}

.grid-pane[b-mtubmldwnt] {
    width: 100%;
    max-width: 100%;
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

    .grid-pane[b-mtubmldwnt]  .k-grid {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

.voormelden-tab[b-mtubmldwnt] {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.38fr);
    grid-template-rows: minmax(0, 1fr);
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.voormeld-message-pane[b-mtubmldwnt] {
    height: 100%;
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-left: 1px solid var(--color-gray-200);
    background: #fff;
}

.voormeld-message-title[b-mtubmldwnt] {
    flex-shrink: 0;
    min-height: 39px;
    display: flex;
    align-items: center;
    padding: 0 12px;
    border-bottom: 1px solid var(--color-gray-200);
    color: var(--color-gray-800);
    font-size: 0.9rem;
    font-weight: 600;
}

.voormeld-message-content[b-mtubmldwnt] {
    max-height: 100%;
    min-height: 0;
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 12px;
    color: var(--color-gray-800);
    font-size: 0.9rem;
    line-height: 1.4;
    white-space: pre-wrap;
}

.voormeld-message-empty[b-mtubmldwnt] {
    color: var(--color-gray-500);
}

.extra-info-pane[b-mtubmldwnt] {
    align-items: stretch;
    padding: 10px;
    box-sizing: border-box;
}

.extra-waarde-cell[b-mtubmldwnt] {
    width: 100%;
    min-height: 1.5rem;
    cursor: text;
}

.opmerkingen-tab[b-mtubmldwnt] {
    width: 100%;
    max-width: 100%;
    height: 100%;
    min-height: 0;
    min-width: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    padding: 10px;
    box-sizing: border-box;
    background: #fff;
}

.opmerkingen-header[b-mtubmldwnt] {
    min-height: 0;
    display: flex;
    align-items: center;
    padding: 0 0 8px 2px;
}

    .opmerkingen-header h6[b-mtubmldwnt] {
        margin: 0;
        line-height: 1.2;
    }

.opmerkingen-tab[b-mtubmldwnt]  .opmerkingen-textarea,
.opmerkingen-tab[b-mtubmldwnt]  .opmerkingen-textarea textarea {
    height: 100%;
    min-height: 0;
    resize: none;
}

[b-mtubmldwnt] .orderregel-form {
    flex: 1;
    width: 100%;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

    [b-mtubmldwnt] .orderregel-form .k-form-layout,
    [b-mtubmldwnt] .orderregel-form .k-form-fieldset {
        flex: 1;
        height: 100%;
        min-height: 0;
        margin: 0;
        padding: 0;
        border: 0;
        display: flex;
        flex-direction: column;
    }

    [b-mtubmldwnt] .orderregel-form .k-form-field,
    [b-mtubmldwnt] .orderregel-form .k-form-field-wrap,
    [b-mtubmldwnt] .orderregel-form .k-form-field > .k-form-field-wrap {
        flex: 1;
        width: 100%;
        height: 100%;
        min-height: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
    }

    [b-mtubmldwnt] .orderregel-form .k-form-buttons {
        display: none;
    }

.order-layout[b-mtubmldwnt] {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(320px, 1.5fr) minmax(430px, 2fr) minmax(140px, 0.6fr);
    gap: 10px;
    padding: 10px;
}

.box-group[b-mtubmldwnt] {
    min-height: 0;
}

.group-one[b-mtubmldwnt] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1.3fr 0.75fr;
    gap: 10px;
}

.one-a[b-mtubmldwnt] {
    grid-column: 1;
    grid-row: 1;
}

.one-b[b-mtubmldwnt] {
    grid-column: 1;
    grid-row: 2;
}

.one-c[b-mtubmldwnt] {
    grid-column: 2;
    grid-row: 1 / span 2;
}

.group-two-three[b-mtubmldwnt] {
    display: grid;
    grid-template-columns: 1fr 1fr 0.52fr;
    grid-template-rows: 1fr 0.88fr;
    gap: 10px;
}

.two-a[b-mtubmldwnt] {
    grid-column: 1;
    grid-row: 1;
}

.two-b[b-mtubmldwnt] {
    grid-column: 2;
    grid-row: 1;
}

.two-c[b-mtubmldwnt] {
    grid-column: 3;
    grid-row: 1;
}

.optional-elements-box[b-mtubmldwnt] {
    align-self: start;
    min-height: 0;
    max-height: min(100%, 22rem);
}

.optional-elements-list[b-mtubmldwnt] {
    min-height: 0;
    overflow-y: auto;
}

.three-a[b-mtubmldwnt] {
    grid-column: 1;
    grid-row: 2;
}

.three-b[b-mtubmldwnt] {
    grid-column: 2 / span 2;
    grid-row: 2;
}

.group-four[b-mtubmldwnt] {
    display: grid;
}

.form-box-label[b-mtubmldwnt] { 
    margin-bottom: 5px;
}

.box[b-mtubmldwnt] {
    min-width: 0;
    min-height: 9rem;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    line-height: 1;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0.3rem;
    padding: 0.7rem 1rem;
    font-size: 0.9rem;
    background-color: white;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.box-xs[b-mtubmldwnt] {
    min-width: 0;
    min-height: 11rem;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    line-height: 1;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0.3rem;
    padding: 0.7rem 0.5rem;
    font-size: 0.9rem;
    background-color: white;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.lading-form-grid > .checkbox-row[b-mtubmldwnt] {
    grid-column: 1 / -1;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    white-space: normal;
    line-height: 1.2;
}

    .lading-form-grid > .checkbox-row span[b-mtubmldwnt] {
        min-width: 0;
    }

.bottom-panel[b-mtubmldwnt] {
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 0 8px;
}

.activity-box[b-mtubmldwnt] {
    flex: 1;
    min-height: 120px;
    background: #fff;
    min-width: 0;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.activity-box[b-mtubmldwnt]  .k-grid {
    width: 100%;
    max-width: 100%;
}

@media (max-width: 1440px) {
    .orderregel-container[b-mtubmldwnt] {
        overflow-x: hidden;
        overflow-y: auto;
    }

    .orderregel-detail-page[b-mtubmldwnt] {
        height: auto;
        min-height: 100%;
        grid-template-rows: auto minmax(260px, 42vh);
        padding: 10px 8px 16px 8px;
        overflow: visible;
    }

    .upper-panel[b-mtubmldwnt],
    .bottom-panel[b-mtubmldwnt] {
        min-height: auto;
    }

    .orderregel-tabs-shell[b-mtubmldwnt] {
        overflow: visible;
    }

    [b-mtubmldwnt] .orderregel-form,
    [b-mtubmldwnt] .orderregel-form .k-form-layout,
    [b-mtubmldwnt] .orderregel-form .k-form-fieldset {
        flex: initial;
        height: auto;
        min-height: auto;
    }

    [b-mtubmldwnt] .orderregel-form .k-form-field,
    [b-mtubmldwnt] .orderregel-form .k-form-field-wrap,
    [b-mtubmldwnt] .orderregel-form .k-form-field > .k-form-field-wrap {
        height: auto;
        min-height: auto;
    }

    .order-layout[b-mtubmldwnt] {
        height: auto;
        min-height: auto;
        grid-template-columns: minmax(440px, 0.95fr) minmax(620px, 1.35fr);
        align-items: start;
    }

    .group-one[b-mtubmldwnt],
    .group-two-three[b-mtubmldwnt],
    .group-four[b-mtubmldwnt] {
        min-height: auto;
    }

    .group-four[b-mtubmldwnt] {
        grid-column: 1 / -1;
    }

    .four-a[b-mtubmldwnt] {
        min-height: 9rem;
    }

    .optional-elements-box[b-mtubmldwnt] {
        max-height: 18rem;
    }

    .bottom-panel[b-mtubmldwnt] {
        min-height: 260px;
    }

    .bottom-actionbar[b-mtubmldwnt] {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .bottom-actionbar__right[b-mtubmldwnt] {
        flex-wrap: wrap;
        row-gap: 8px;
    }

    [b-mtubmldwnt] .order-tabs {
        min-height: 260px;
    }

    [b-mtubmldwnt] .order-tabs .k-tabstrip-content,
    [b-mtubmldwnt] .order-tabs .k-tabstrip-content.k-active,
    [b-mtubmldwnt] .order-tabs > .k-content,
    [b-mtubmldwnt] .order-tabs > .k-content.k-active {
        min-height: 220px;
    }
}

/* Tablet */
@media (max-width: 1180px) {
    .orderregel-detail-page[b-mtubmldwnt] {
        grid-template-rows: auto auto;
    }

    .upper-panel[b-mtubmldwnt],
    .bottom-panel[b-mtubmldwnt] {
        min-height: auto;
    }

    .orderregel-tabs-shell[b-mtubmldwnt] {
        min-height: auto;
    }

    [b-mtubmldwnt] .order-tabs {
        flex: initial;
        min-height: auto;
    }

    [b-mtubmldwnt] .orderregel-form,
    [b-mtubmldwnt] .orderregel-form .k-form-layout,
    [b-mtubmldwnt] .orderregel-form .k-form-fieldset {
        flex: initial;
        height: auto;
        min-height: auto;
    }

    [b-mtubmldwnt] .orderregel-form .k-form-field,
    [b-mtubmldwnt] .orderregel-form .k-form-field-wrap,
    [b-mtubmldwnt] .orderregel-form .k-form-field > .k-form-field-wrap {
        height: auto;
        min-height: auto;
    }

    .order-layout[b-mtubmldwnt] {
        grid-template-columns: 1fr;
    }

    .group-one[b-mtubmldwnt] {
        min-height: auto;
    }

    .group-two-three[b-mtubmldwnt] {
        min-height: auto;
    }

    .group-four[b-mtubmldwnt] {
        min-height: auto;
    }

    .optional-elements-box[b-mtubmldwnt] {
        max-height: 18rem;
    }

    .voormelden-tab[b-mtubmldwnt] {
        grid-template-columns: 1fr;
        grid-template-rows: minmax(320px, 1fr) minmax(180px, auto);
    }

    .voormeld-message-pane[b-mtubmldwnt] {
        min-height: 180px;
        border-left: 0;
        border-top: 1px solid var(--color-gray-200);
    }

    [b-mtubmldwnt] .order-tabs .k-tabstrip-content,
    [b-mtubmldwnt] .order-tabs .k-tabstrip-content.k-active,
    [b-mtubmldwnt] .order-tabs > .k-content,
    [b-mtubmldwnt] .order-tabs > .k-content.k-active {
        flex: initial;
        min-height: auto;
    }
}

/* Mobile */
@media (max-width: 640px) {
    .orderregel-detail-page[b-mtubmldwnt] {
        padding: 10px;
        gap: 14px;
    }

    .topbar-meta[b-mtubmldwnt] {
        justify-content: flex-start;
        gap: 8px;
    }

    .bottom-actionbar[b-mtubmldwnt],
    .bottom-actionbar__left[b-mtubmldwnt],
    .bottom-actionbar__right[b-mtubmldwnt] {
        width: 100%;
    }

    .bottom-actionbar__right[b-mtubmldwnt] {
        justify-content: stretch;
    }

    .bottom-actionbar__right[b-mtubmldwnt]  .k-button {
        flex: 1 1 9rem;
    }

    .panel-topbar[b-mtubmldwnt] {
        align-items: stretch;
        flex-direction: column;
    }

    .topbar-actions[b-mtubmldwnt] {
        gap: 10px;
    }

    [b-mtubmldwnt] .topbar-actions .k-button {
        width: 100%;
    }

    .group-one[b-mtubmldwnt],
    .group-two-three[b-mtubmldwnt] {
        display: flex;
        flex-direction: column;
        min-height: auto;
    }

    .box[b-mtubmldwnt] {
        min-height: 150px;
        padding: 0.7rem;
    }

    .four-a[b-mtubmldwnt] {
        min-height: 180px;
    }

    .activity-box[b-mtubmldwnt] {
        min-height: 260px;
    }
}

.orderregel-map-shell[b-mtubmldwnt] {
    height: 100%;
    min-height: 0;
    flex: 1;
    display: grid;
    grid-template-rows: minmax(0, 1.2fr) minmax(150px, 1fr);
    background: #fff;
}

[b-mtubmldwnt] .kaart-window .k-window-content {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
}

.map-embed-panel[b-mtubmldwnt],
.map-bottom-panel[b-mtubmldwnt] {
    min-height: 0;
    min-width: 0;
    overflow: hidden;
    background: #fff;
}

.map-embed[b-mtubmldwnt] {
    width: 100%;
    height: 100%;
    min-height: 280px;
    border: 0;
    display: block;
}

.map-bottom-panel[b-mtubmldwnt] {
    display: flex;
    flex-direction: column;
}

.map-bottom-toolbar[b-mtubmldwnt] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    flex-shrink: 0;
    padding: 8px;
    border-bottom: 1px solid var(--color-gray-200);
    background: var(--color-gray-50);
}

.map-bottom-content[b-mtubmldwnt] {
    min-height: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: #fff;
}

[b-mtubmldwnt] .map-result-tabs {
    height: 100%;
    min-height: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    border: 0;
    background: #fff;
}

    [b-mtubmldwnt] .map-result-tabs .k-tabstrip-items-wrapper {
        flex-shrink: 0;
        border-bottom: 1px solid var(--color-gray-200);
        background: #fff;
    }

    [b-mtubmldwnt] .map-result-tabs .k-tabstrip-items {
        min-height: 34px;
    }

    [b-mtubmldwnt] .map-result-tabs .k-tabstrip-items .k-item {
        min-height: 34px;
        font-size: 0.84rem;
    }

    [b-mtubmldwnt] .map-result-tabs .k-tabstrip-content,
    [b-mtubmldwnt] .map-result-tabs .k-tabstrip-content.k-active,
    [b-mtubmldwnt] .map-result-tabs > .k-content,
    [b-mtubmldwnt] .map-result-tabs > .k-content.k-active {
        height: 100%;
        min-height: 0;
        flex: 1;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        padding: 0;
        border: 0;
        background: #fff;
    }

.map-result-pane[b-mtubmldwnt] {
    height: 100%;
    min-height: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.map-grid-host[b-mtubmldwnt] {
    height: 100%;
    min-height: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-sizing: border-box;
}

    .map-grid-host[b-mtubmldwnt]  .k-grid {
        height: 100% !important;
        min-height: 0;
        flex: 1;
        display: flex;
        flex-direction: column;
        width: 100%;
        max-width: 100%;
    }

    .map-grid-host[b-mtubmldwnt]  .k-grid-container {
        min-height: 0;
        flex: 1;
    }

    .map-grid-host[b-mtubmldwnt]  .k-grid-content {
        min-height: 0;
        flex: 1;
        overflow: auto;
    }

.orderregel-order-link[b-mtubmldwnt] {
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    line-height: 1;
    cursor: pointer;
    white-space: nowrap;
}

.orderregel-order-link:hover .txt-primary[b-mtubmldwnt] {
    text-decoration: underline;
}
/* _content/eLipsOnline/Components/Pages/DetailPages/RitDetails.razor.rz.scp.css */
.rit-page[b-ug0dxb6chu] {
    box-sizing: border-box;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    height: 100%;
    max-height: 100%;
    min-height: 0;
    overflow: hidden;
    background: var(--color-gray-50);
    color: #111827;
    padding: 8px;
}

.rit-page--loading[b-ug0dxb6chu] {
    display: grid;
    place-items: center;
}

.rit-top[b-ug0dxb6chu] {
    display: grid;
    gap: 7px;
}

.rit-title-row[b-ug0dxb6chu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 8px 8px 0 8px;
}

.rit-panel[b-ug0dxb6chu],
.rit-card[b-ug0dxb6chu],
.rit-grid-card[b-ug0dxb6chu] {
    min-width: 0;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 5px;
/*    box-shadow: 0 1px 2px rgba(0, 0, 0, .05), 0 4px 12px rgba(0, 0, 0, .04);*/
}

.rit-panel[b-ug0dxb6chu] {
    padding: 18px;
}

.rit-tabs[b-ug0dxb6chu],
.rit-tabs.k-tabstrip[b-ug0dxb6chu] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    min-height: 0;
    padding: 0 16px;
}

.rit-tabs[b-ug0dxb6chu]  .k-tabstrip-content-wrapper,
.rit-tabs[b-ug0dxb6chu]  .k-tabstrip-content,
.rit-tabs[b-ug0dxb6chu]  .k-tabstrip-content.k-active,
.rit-tabs[b-ug0dxb6chu]  .k-content,
.rit-tabs[b-ug0dxb6chu]  .k-content.k-active {
    display: block;
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.rit-tab-content[b-ug0dxb6chu] {
    display: grid;
    grid-template-rows: auto minmax(280px, 1fr);
    gap: 16px;
    height: 100%;
    min-height: 0;
}

.rit-overview[b-ug0dxb6chu] {
    display: grid;
    grid-template-columns: minmax(250px, 1.15fr) minmax(250px, 1.15fr) minmax(300px, 1.1fr) minmax(230px, .85fr);
    gap: 16px;
    align-items: stretch;
    min-height: 0;
}

.rit-card[b-ug0dxb6chu] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    padding: 18px 22px;
}

.rit-address-column[b-ug0dxb6chu] {
    display: grid;
    grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
    gap: 16px;
    min-width: 0;
    min-height: 0;
}

.rit-card--address[b-ug0dxb6chu],
.rit-card--boardcomputer[b-ug0dxb6chu] {
    min-height: 0;
}

.rit-card--options[b-ug0dxb6chu] {
    align-content: start;
}

.field-stack[b-ug0dxb6chu] {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.form-row[b-ug0dxb6chu] {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.form-row > *[b-ug0dxb6chu] {
    min-width: 0;
}

.form-row[b-ug0dxb6chu]  .k-input,
.form-row[b-ug0dxb6chu]  .k-picker,
.form-row[b-ug0dxb6chu]  .k-textbox,
.form-row[b-ug0dxb6chu]  .k-numerictextbox,
.form-row[b-ug0dxb6chu]  .k-multicolumncombobox,
.form-row[b-ug0dxb6chu]  .combo-popup-active {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

.rit-card:nth-child(2) .form-row[b-ug0dxb6chu],
.rit-address-column .form-row[b-ug0dxb6chu] {
    grid-template-columns: 120px minmax(0, 1fr);
}

.rit-options[b-ug0dxb6chu] {
    display: grid;
    gap: 18px;
    align-content: start;
    padding-top: 4px;
}

.rit-readonly-field[b-ug0dxb6chu] {
    display: block;
    width: 100%;
    height: 32px;
    background-color: #f9fafb;
    border: 1px solid #dfe3e8;
    border-radius: 4px;
    box-sizing: border-box;
    pointer-events: none;
}

.check-field[b-ug0dxb6chu] {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    white-space: nowrap;
}

.rit-grid-row[b-ug0dxb6chu] {
    display: grid;
    grid-template-columns: minmax(260px, .54fr) minmax(0, 1fr);
    gap: 16px;
    min-height: 0;
}

.rit-grid-card[b-ug0dxb6chu] {
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    min-height: 0;
    padding: 0;
    overflow: hidden;
}

.rit-grid-card > *[b-ug0dxb6chu] {
    min-height: 0;
}

.rit-activities-card[b-ug0dxb6chu]  .grid-noborder {
    height: 100%;
    width: 100%;
}

.rit-grid-card[b-ug0dxb6chu]  .k-grid {
    width: 100% !important;
    height: 100%;
    min-width: 0;
    min-height: 0;
    border-width: 0;
    border-radius: 0;
    overflow: hidden;
}

.rit-grid-card[b-ug0dxb6chu]  .rit-data-grid .k-grid-table {
    min-width: 1200px;
}

.rit-grid-card--small[b-ug0dxb6chu]  .rit-data-grid .k-grid-table {
    min-width: 900px;
}

.rit-grid-card[b-ug0dxb6chu]  .rit-data-grid--wide .k-grid-table {
    min-width: 1800px;
}

.rit-grid-card[b-ug0dxb6chu]  .k-grid-header {
    background: #f3f4f6;
}

.rit-grid-card[b-ug0dxb6chu]  .k-grid-toolbar {
    min-height: 44px;
    padding: 8px 12px;
    background: #fff;
    border-color: #e5e7eb;
}

.rit-grid-card[b-ug0dxb6chu]  .k-grid-toolbar h6 {
    margin: 0;
    font-size: .95rem;
    font-weight: 700;
}

.rit-grid-card[b-ug0dxb6chu]  .k-grid-aria-root,
.rit-grid-card[b-ug0dxb6chu]  .k-grid-container,
.rit-grid-card[b-ug0dxb6chu]  .k-grid-header,
.rit-grid-card[b-ug0dxb6chu]  .k-grid-header-wrap,
.rit-grid-card[b-ug0dxb6chu]  .k-grid-content {
    max-width: 100%;
    min-width: 0;
}

.rit-secondary-tab[b-ug0dxb6chu] {
    display: grid;
    gap: 16px;
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.rit-secondary-tab--voorcalc[b-ug0dxb6chu] {
    grid-template-rows: minmax(220px, .85fr) minmax(320px, 1.15fr);
}

.rit-secondary-tab--distance[b-ug0dxb6chu] {
    grid-template-rows: minmax(0, 1fr);
}

.rit-secondary-tab--log[b-ug0dxb6chu] {
    grid-template-rows: minmax(0, 1fr);
}

.rit-distance-card[b-ug0dxb6chu]  .grid-noborder {
    height: 100%;
    width: 100%;
}

.rit-log-card[b-ug0dxb6chu]  .grid-noborder {
    height: 100%;
    width: 100%;
}

.rit-voorcalc-card[b-ug0dxb6chu]  .grid-noborder {
    height: 100%;
    width: 100%;
}

.rit-nacalc-card[b-ug0dxb6chu]  .grid-noborder {
    height: 100%;
    width: 100%;
}

.actual-costs[b-ug0dxb6chu],
.distance-panel[b-ug0dxb6chu] {
    display: grid;
    gap: 0px;
    align-content: start;
}

.actual-costs[b-ug0dxb6chu] {
    grid-template-rows: auto auto minmax(0, 1fr);
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    align-content: stretch;
}

.cost-inputs[b-ug0dxb6chu],
.distance-inputs[b-ug0dxb6chu] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px 24px;
}

    .cost-inputs[b-ug0dxb6chu]{
        margin-top: 5px;
        margin-bottom: 15px;
    }

    .cost-field[b-ug0dxb6chu] {
        display: inline-flex;
        align-items: center;
        gap: 10px;
    }

.cost-field svg[b-ug0dxb6chu] {
    color: #374151;
}

.nested-grid[b-ug0dxb6chu] {
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    max-width: 100%;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.rit-nacalc-card[b-ug0dxb6chu] {
    max-width: 100%;
}

.rit-nacalc-card > *[b-ug0dxb6chu] {
    min-width: 0;
    min-height: 0;
}

.rit-nacalc-card[b-ug0dxb6chu]  .k-grid {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    width: 100% !important;
    max-width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.rit-nacalc-card[b-ug0dxb6chu]  .k-grid-aria-root,
.rit-nacalc-card[b-ug0dxb6chu]  .k-grid-container,
.rit-nacalc-card[b-ug0dxb6chu]  .k-grid-header,
.rit-nacalc-card[b-ug0dxb6chu]  .k-grid-header-wrap,
.rit-nacalc-card[b-ug0dxb6chu]  .k-grid-content {
    max-width: 100%;
    min-width: 0;
    min-height: 0;
}

.rit-nacalc-card[b-ug0dxb6chu]  .k-grid-aria-root {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
}

.rit-nacalc-card[b-ug0dxb6chu]  .k-grid-container {
    overflow: hidden;
}

.rit-nacalc-card[b-ug0dxb6chu]  .k-grid-header-wrap {
    overflow: hidden;
}

.rit-nacalc-card[b-ug0dxb6chu]  .k-grid-content {
    overflow-x: auto;
    overflow-y: auto;
}

.rit-nacalc-card[b-ug0dxb6chu]  .k-grid-header-table,
.rit-nacalc-card[b-ug0dxb6chu]  .k-grid-table {
    min-width: max-content;
}

.rit-actions[b-ug0dxb6chu] {
    z-index: 5;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 12px 8px 8px 0;
    background-color: var(--color-gray-50);
}

@media (max-width: 1500px) {
    .rit-overview[b-ug0dxb6chu] {
        grid-template-columns: repeat(2, minmax(280px, 1fr));
    }

    .rit-grid-row[b-ug0dxb6chu] {
        grid-template-columns: minmax(0, .7fr) minmax(0, 1fr);
    }
}

@media (max-width: 1180px) {
    .rit-page[b-ug0dxb6chu] {
        display: block;
        height: auto;
        max-height: none;
        min-height: calc(100vh - 72px);
        overflow: visible;
    }

    .rit-page[b-ug0dxb6chu]  .rit-details-form,
    .rit-page[b-ug0dxb6chu]  .rit-details-form.k-form,
    .rit-page[b-ug0dxb6chu]  .rit-details-form .k-form-fieldset {
        height: auto;
        max-height: none;
        overflow: visible;
    }

    .rit-tabs[b-ug0dxb6chu],
    .rit-tabs.k-tabstrip[b-ug0dxb6chu] {
        display: block;
        height: auto;
        min-height: 0;
    }

    .rit-tabs[b-ug0dxb6chu]  .k-tabstrip-content-wrapper,
    .rit-tabs[b-ug0dxb6chu]  .k-tabstrip-content,
    .rit-tabs[b-ug0dxb6chu]  .k-tabstrip-content.k-active,
    .rit-tabs[b-ug0dxb6chu]  .k-content,
    .rit-tabs[b-ug0dxb6chu]  .k-content.k-active {
        height: auto;
        overflow: visible;
    }

    .rit-tab-content[b-ug0dxb6chu],
    .rit-secondary-tab[b-ug0dxb6chu] {
        height: auto;
        min-height: 0;
    }

    .rit-grid-card[b-ug0dxb6chu] {
        min-height: 360px;
    }

    .rit-actions[b-ug0dxb6chu] {
        position: sticky;
        bottom: 0;
        margin-top: 14px;
        border-top: 1px solid #e5e7eb;
        background: rgba(247, 247, 248, .96);
        backdrop-filter: blur(6px);
    }
}

@media (max-width: 920px) {
    .rit-overview[b-ug0dxb6chu],
    .rit-grid-row[b-ug0dxb6chu] {
        grid-template-columns: 1fr;
    }

    .rit-address-column[b-ug0dxb6chu] {
        grid-template-rows: none;
    }
}

@media (max-width: 640px) {
    .rit-top[b-ug0dxb6chu],
    .rit-tabs[b-ug0dxb6chu] {
        padding-left: 12px;
        padding-right: 12px;
    }

    .rit-panel[b-ug0dxb6chu],
    .rit-card[b-ug0dxb6chu] {
        padding: 14px;
    }

    .form-row[b-ug0dxb6chu],
    .rit-card:nth-child(2) .form-row[b-ug0dxb6chu],
    .rit-address-column .form-row[b-ug0dxb6chu],
    .distance-inputs[b-ug0dxb6chu] {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .check-field[b-ug0dxb6chu] {
        white-space: normal;
    }

    .rit-actions[b-ug0dxb6chu] {
        align-items: stretch;
        flex-direction: column-reverse;
        padding: 12px;
    }

    .rit-actions[b-ug0dxb6chu]  .btn {
        width: 100%;
    }
}
/* _content/eLipsOnline/Components/Pages/DetailPages/RitDetailsOld.razor.rz.scp.css */

.form-actions[b-puj2blfdvn] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 20px;
    border-top: 1px solid #ccc;
    background-color: #f0f0f0;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
}

.form-actions-left[b-puj2blfdvn], .form-actions-right[b-puj2blfdvn] {
    display: flex;
    gap: 10px;
}

.page-layout[b-puj2blfdvn] {
    height: calc(100vh - 70px); /* 70px = hoogte van fixed knoppen */
    overflow: auto;
    padding-bottom: 20px; /* ruimte boven fixed knoppen */
}
.page-top[b-puj2blfdvn] {
    overflow: auto; /* zodat je kan scrollen in de tab inhoud */
}

.page-bottom[b-puj2blfdvn] {
    overflow: auto; /* zodat de grid netjes scrollt */
}

/* Binnen elke kolom: label + input */
.form-two-col[b-puj2blfdvn] {
    display: grid;
    grid-template-columns: 150px 1fr; /* label + veld */
    gap: 6px 12px;
    align-items: center;
}

    .form-two-col label[b-puj2blfdvn] {
        font-size: 0.9rem;
    }

/* Orders-tab: 2 kolommen, elk met label+veld-grid */
.form-columns[b-puj2blfdvn] {
    display: grid;
    grid-template-columns: auto auto auto; /* links/rechts/bijlagen kolom */
    gap: 16px 32px;
    padding-right: 16px;
    box-sizing: border-box;
    width: 50%;
}

/* dropzone style */
.drop-zone[b-puj2blfdvn] {
    max-height: 290px; /* vaste hoogte */
    overflow-y: auto;
    min-width: 1050px;
    border: 2px dashed #bbb;
    border-radius: 6px;
    padding: 20px;
    text-align: center;
    color: #666;
    font-size: 0.9rem;
    cursor: pointer;
    background: #fafafa;
}

    .drop-zone.hover[b-puj2blfdvn] {
        border-color: #007bff;
        color: #007bff;
        background: #f0f8ff;
    }

.remove-button[b-puj2blfdvn] {
    background-color: #9c1818; /* Red background */
    border: none;
    color: white;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    margin: 20px 2px;
    cursor: pointer;
    border-radius: 50%; /* Circular button */
    width: 28px; /* Fixed width */
    height: 28px; /* Fixed height */
    line-height: 20px; /* Match the height to vertically center the '-' */
    padding: 0; /* Reset padding */
    font-weight: bold;
}

    .remove-button:hover[b-puj2blfdvn] {
        background-color: #601515; /* Darker shade of red */
    }



.voorcalc-layout[b-puj2blfdvn] {
    display: flex;
    flex-direction: column;
    gap: 15px;
    padding: 10px;
}

.voorcalc-top-grid[b-puj2blfdvn] {
    min-height:150px;
    height: fit-content;
}

.werkelijke-kosten[b-puj2blfdvn] {
    border: 1px solid #ccc;
    padding: 10px;
    background: #fafafa;
    min-height: 300px;
    height: fit-content;
}



.nacalculatie-grid[b-puj2blfdvn] {
    min-height: 200px;
    height:fit-content;
}

.kosten-inputs[b-puj2blfdvn] {
    display: flex;
    gap: 30px;
    align-items: end;
    margin-bottom: 15px;
}

.kosten-item[b-puj2blfdvn] {
    display: flex;
    flex-direction: column;
}

.icon-input[b-puj2blfdvn] {
    display: flex;
    align-items: center;
}

.orders-grids[b-puj2blfdvn] {
    display: flex;
    gap: 10px;
    margin-top: 20px;
}

    .orders-grids .left[b-puj2blfdvn] {
        flex: 0 0 30%;
    }

    .orders-grids .right[b-puj2blfdvn] {
        flex: 0 0 70%;
    }

.afstand-layout[b-puj2blfdvn] {
    padding: 10px 15px;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.afstand-header h5[b-puj2blfdvn] {
    margin: 0;
    padding-bottom: 4px;
    font-weight: 600;
}

.afstand-inputs[b-puj2blfdvn] {
    border: 1px solid #ccc;
    background: #fafafa;
    padding: 10px 12px;
}

.afstand-row[b-puj2blfdvn] {
    display: flex;
    align-items: center;
    gap: 15px;
}

    .afstand-row label[b-puj2blfdvn] {
        font-size: 0.85rem;
        font-weight: 500;
        min-width: 90px;
        text-align: right;
    }

.afstand-grid[b-puj2blfdvn] {
    margin-top: 10px;
}
/* _content/eLipsOnline/Components/Pages/DetailPages/RitDetailsWindow.razor.rz.scp.css */
.split-page[b-z1sr4tkyvd] {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(280px, 1fr);
    overflow: hidden;
    background-color: var(--color-gray-50);
}

.split-panel[b-z1sr4tkyvd] {
    min-height: 0;
    overflow: hidden;
}

.top-panel[b-z1sr4tkyvd] {
    min-height: 0;
}

.top-shell[b-z1sr4tkyvd],
.bottom-shell[b-z1sr4tkyvd] {
    min-height: 0;
    display: grid;
    gap: 10px;
    overflow: hidden;
}

.top-shell[b-z1sr4tkyvd] {
    grid-template-rows: minmax(0, 1fr);
    padding: 8px 8px 0 8px;
}

.bottom-shell[b-z1sr4tkyvd] {
    height: 100%;
    grid-template-rows: minmax(0, 1fr);
    padding: 0 8px 8px 8px;
    background-color: var(--color-gray-50);
}

.top-content[b-z1sr4tkyvd],
.bottom-content[b-z1sr4tkyvd],
.detail-tabstrip[b-z1sr4tkyvd],
.tab-pane-fill[b-z1sr4tkyvd],
.grid-host[b-z1sr4tkyvd] {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}


.form-scroll[b-z1sr4tkyvd] {
    height: 100%;
    min-height: 0;
    padding: 2px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 8px 8px 0 8px;
}

.detail-tabstrip[b-z1sr4tkyvd]  .k-tabstrip-content-wrapper,
.detail-tabstrip[b-z1sr4tkyvd]  .k-tabstrip-content,
.detail-tabstrip[b-z1sr4tkyvd]  .k-tabstrip-content.k-active,
.detail-tabstrip[b-z1sr4tkyvd]  .k-content,
.detail-tabstrip[b-z1sr4tkyvd]  .k-content.k-active {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}
.rit-page[b-z1sr4tkyvd] {
    box-sizing: border-box;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    height: 100%;
    max-height: 100%;
    min-height: 0;
    overflow: hidden;
    background: var(--color-gray-50);
    color: #111827;
}

.rit-page--loading[b-z1sr4tkyvd] {
    display: grid;
    place-items: center;
}

.rit-top[b-z1sr4tkyvd] {
    display: grid;
    gap: 7px;
}

.rit-title-row[b-z1sr4tkyvd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 8px 8px 0 8px;
}

.rit-panel[b-z1sr4tkyvd],
.rit-card[b-z1sr4tkyvd],
.rit-grid-card[b-z1sr4tkyvd] {
    min-width: 0;
    background: #fff;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .05), 0 4px 12px rgba(0, 0, 0, .04);
}

.rit-panel[b-z1sr4tkyvd] {
    padding: 18px;
}

.top-content[b-z1sr4tkyvd]  .rit-tabs,
.top-content[b-z1sr4tkyvd]  .rit-tabs.k-tabstrip {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    min-height: 0;
    padding: 0 16px;
}

    .rit-tabs[b-z1sr4tkyvd]  .k-tabstrip-content-wrapper,
    .rit-tabs[b-z1sr4tkyvd]  .k-tabstrip-content,
    .rit-tabs[b-z1sr4tkyvd]  .k-tabstrip-content.k-active,
    .rit-tabs[b-z1sr4tkyvd]  .k-content,
    .rit-tabs[b-z1sr4tkyvd]  .k-content.k-active {
        display: block;
        height: 100%;
        min-height: 0;
        overflow: hidden;
    }

.rit-tab-content[b-z1sr4tkyvd] {
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    gap: 16px;
    height: 100%;
    min-height: 0;
}

.rit-overview[b-z1sr4tkyvd] {
    display: grid;
    grid-template-columns: minmax(250px, 1.15fr) minmax(250px, 1.15fr) minmax(300px, 1.1fr) minmax(230px, .85fr);
    gap: 16px;
    align-items: stretch;
    min-height: 0;
}

.rit-card[b-z1sr4tkyvd] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    padding: 18px 22px;
}

.rit-address-column[b-z1sr4tkyvd] {
    display: grid;
    grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
    gap: 16px;
    min-width: 0;
    min-height: 0;
}

.rit-card--address[b-z1sr4tkyvd],
.rit-card--boardcomputer[b-z1sr4tkyvd] {
    min-height: 0;
}

.rit-card--options[b-z1sr4tkyvd] {
    align-content: start;
}

.field-stack[b-z1sr4tkyvd] {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.form-row[b-z1sr4tkyvd] {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    align-items: center;
    gap: 18px;
    min-width: 0;
}

    .form-row > *[b-z1sr4tkyvd] {
        min-width: 0;
    }

    .form-row[b-z1sr4tkyvd]  .k-input,
    .form-row[b-z1sr4tkyvd]  .k-picker,
    .form-row[b-z1sr4tkyvd]  .k-textbox,
    .form-row[b-z1sr4tkyvd]  .k-numerictextbox,
    .form-row[b-z1sr4tkyvd]  .k-multicolumncombobox,
    .form-row[b-z1sr4tkyvd]  .combo-popup-active {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

.rit-card:nth-child(2) .form-row[b-z1sr4tkyvd],
.rit-address-column .form-row[b-z1sr4tkyvd] {
    grid-template-columns: 120px minmax(0, 1fr);
}

.rit-options[b-z1sr4tkyvd] {
    display: grid;
    gap: 18px;
    align-content: start;
    padding-top: 4px;
}

.rit-readonly-field[b-z1sr4tkyvd] {
    display: block;
    width: 100%;
    height: 32px;
    background-color: #f9fafb;
    border: 1px solid #dfe3e8;
    border-radius: 4px;
    box-sizing: border-box;
    pointer-events: none;
}

.check-field[b-z1sr4tkyvd] {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    white-space: nowrap;
}

.rit-grid-row[b-z1sr4tkyvd] {
    display: grid;
    grid-template-columns: minmax(260px, .54fr) minmax(0, 1fr);
    gap: 16px;
    min-height: 0;
    height: 100%;
    padding: 10px;
}

.rit-grid-card[b-z1sr4tkyvd] {
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    min-height: 0;
    padding: 0;
    overflow: hidden;
    box-shadow: none;
}

    .rit-grid-card > *[b-z1sr4tkyvd] {
        min-height: 0;
    }

.rit-activities-card[b-z1sr4tkyvd]  .grid-noborder {
    height: 100%;
    width: 100%;
}

.rit-grid-card[b-z1sr4tkyvd]  .k-grid {
    width: 100% !important;
    height: 100%;
    min-width: 0;
    min-height: 0;
    border-width: 0;
    border-radius: 0;
    overflow: hidden;
}

.rit-grid-card[b-z1sr4tkyvd]  .rit-data-grid .k-grid-table {
    min-width: 1200px;
}

.rit-grid-card--small[b-z1sr4tkyvd]  .rit-data-grid .k-grid-table {
    min-width: 900px;
}

.rit-grid-card[b-z1sr4tkyvd]  .rit-data-grid--wide .k-grid-table {
    min-width: 1800px;
}

.rit-grid-card[b-z1sr4tkyvd]  .k-grid-header {
    background: #f3f4f6;
}

.rit-grid-card[b-z1sr4tkyvd]  .k-grid-toolbar {
    min-height: 44px;
    padding: 8px 12px;
    background: #fff;
    border-color: #e5e7eb;
}

    .rit-grid-card[b-z1sr4tkyvd]  .k-grid-toolbar h6 {
        margin: 0;
        font-size: .95rem;
        font-weight: 700;
    }

.rit-grid-card[b-z1sr4tkyvd]  .k-grid-aria-root,
.rit-grid-card[b-z1sr4tkyvd]  .k-grid-container,
.rit-grid-card[b-z1sr4tkyvd]  .k-grid-header,
.rit-grid-card[b-z1sr4tkyvd]  .k-grid-header-wrap,
.rit-grid-card[b-z1sr4tkyvd]  .k-grid-content {
    max-width: 100%;
    min-width: 0;
}

.rit-secondary-tab[b-z1sr4tkyvd] {
    display: grid;
    gap: 16px;
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.rit-secondary-tab--voorcalc[b-z1sr4tkyvd] {
    grid-template-rows: minmax(220px, .85fr) minmax(320px, 1.15fr);
}

.rit-secondary-tab--distance[b-z1sr4tkyvd],
.rit-secondary-tab--nacalc[b-z1sr4tkyvd] {
    grid-template-rows: minmax(0, 1fr);
}

.rit-secondary-tab--log[b-z1sr4tkyvd] {
    grid-template-rows: minmax(0, 1fr);
}

.rit-distance-card[b-z1sr4tkyvd]  .grid-noborder {
    height: 100%;
    width: 100%;
}

.rit-log-card[b-z1sr4tkyvd]  .grid-noborder {
    height: 100%;
    width: 100%;
}

.rit-voorcalc-card[b-z1sr4tkyvd]  .grid-noborder {
    height: 100%;
    width: 100%;
}

.rit-nacalc-card[b-z1sr4tkyvd]  .grid-noborder {
    height: 100%;
    width: 100%;
}

.actual-costs[b-z1sr4tkyvd],
.distance-panel[b-z1sr4tkyvd] {
    display: grid;
    gap: 0px;
    align-content: start;
}


.rit-nacalc-panel[b-z1sr4tkyvd] {
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.rit-nacalc-panel .actual-costs[b-z1sr4tkyvd] {
    grid-template-rows: auto minmax(0, 1fr);
    height: 100%;
}
.actual-costs[b-z1sr4tkyvd] {
    grid-template-rows: auto auto minmax(0, 1fr);
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    align-content: stretch;
}

.cost-inputs[b-z1sr4tkyvd],
.distance-inputs[b-z1sr4tkyvd] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px 24px;
}

.cost-inputs[b-z1sr4tkyvd] {
    margin: 15px 0 15px 5px;
}

.cost-field[b-z1sr4tkyvd] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

    .cost-field svg[b-z1sr4tkyvd] {
        color: #374151;
    }

.nested-grid[b-z1sr4tkyvd] {
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    max-width: 100%;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.rit-nacalc-card[b-z1sr4tkyvd] {
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    height: 100%;
    max-width: 100%;
    min-height: 0;
    overflow: hidden;
}

    .rit-nacalc-card > *[b-z1sr4tkyvd] {
        min-width: 0;
        min-height: 0;
    }

    .rit-nacalc-card[b-z1sr4tkyvd]  .k-grid {
        display: grid;
        grid-template-rows: auto minmax(0, 1fr);
        width: 100% !important;
        max-width: 100%;
        height: 100% !important;
        min-width: 0;
        min-height: 0;
        overflow: hidden;
    }

    .rit-nacalc-card[b-z1sr4tkyvd]  .k-grid-aria-root,
    .rit-nacalc-card[b-z1sr4tkyvd]  .k-grid-container,
    .rit-nacalc-card[b-z1sr4tkyvd]  .k-grid-header,
    .rit-nacalc-card[b-z1sr4tkyvd]  .k-grid-header-wrap,
    .rit-nacalc-card[b-z1sr4tkyvd]  .k-grid-content {
        max-width: 100%;
        min-width: 0;
        min-height: 0;
    }

    .rit-nacalc-card[b-z1sr4tkyvd]  .k-grid-aria-root {
        display: grid;
        grid-template-rows: auto minmax(0, 1fr);
        overflow: hidden;
    }

    .rit-nacalc-card[b-z1sr4tkyvd]  .k-grid-container {
        height: 100%;
        overflow: hidden;
    }

    .rit-nacalc-card[b-z1sr4tkyvd]  .k-grid-header-wrap {
        overflow: hidden;
    }

    .rit-nacalc-card[b-z1sr4tkyvd]  .k-grid-content {
        height: 100%;
        overflow-x: auto;
        overflow-y: auto;
    }

    .rit-nacalc-card[b-z1sr4tkyvd]  .k-grid-header-table,
    .rit-nacalc-card[b-z1sr4tkyvd]  .k-grid-table {
        min-width: max-content;
    }

.rit-actions[b-z1sr4tkyvd] {
    z-index: 5;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 12px 8px 8px 0;
    background-color: var(--color-gray-50);
}

.actual-costs-panel[b-z1sr4tkyvd] {
    padding: 10px 10px 5px ;
}

@media (max-width: 1500px) {
    .rit-overview[b-z1sr4tkyvd] {
        grid-template-columns: repeat(2, minmax(280px, 1fr));
    }

    .rit-grid-row[b-z1sr4tkyvd] {
        grid-template-columns: minmax(0, .7fr) minmax(0, 1fr);
    }
}

@media (max-width: 1180px) {
    .rit-page[b-z1sr4tkyvd] {
        display: block;
        height: auto;
        max-height: none;
        min-height: calc(100vh - 72px);
        overflow: visible;
    }

        .rit-page[b-z1sr4tkyvd]  .rit-details-form,
        .rit-page[b-z1sr4tkyvd]  .rit-details-form.k-form,
        .rit-page[b-z1sr4tkyvd]  .rit-details-form .k-form-fieldset {
            height: auto;
            max-height: none;
            overflow: visible;
        }

    .top-content[b-z1sr4tkyvd]  .rit-tabs,
    .top-content[b-z1sr4tkyvd]  .rit-tabs.k-tabstrip {
        display: block;
        height: auto;
        min-height: 0;
    }

        .rit-tabs[b-z1sr4tkyvd]  .k-tabstrip-content-wrapper,
        .rit-tabs[b-z1sr4tkyvd]  .k-tabstrip-content,
        .rit-tabs[b-z1sr4tkyvd]  .k-tabstrip-content.k-active,
        .rit-tabs[b-z1sr4tkyvd]  .k-content,
        .rit-tabs[b-z1sr4tkyvd]  .k-content.k-active {
            height: auto;
            overflow: visible;
        }

    .rit-tab-content[b-z1sr4tkyvd],
    .rit-secondary-tab[b-z1sr4tkyvd] {
        height: auto;
        min-height: 0;
    }

    .rit-grid-card[b-z1sr4tkyvd] {
        min-height: 360px;
    }

    .rit-actions[b-z1sr4tkyvd] {
        position: sticky;
        bottom: 0;
        margin-top: 14px;
        border-top: 1px solid #e5e7eb;
        background: rgba(247, 247, 248, .96);
        backdrop-filter: blur(6px);
    }
}

@media (max-width: 920px) {
    .rit-overview[b-z1sr4tkyvd],
    .rit-grid-row[b-z1sr4tkyvd] {
        grid-template-columns: 1fr;
    }

    .rit-address-column[b-z1sr4tkyvd] {
        grid-template-rows: none;
    }
}

@media (max-width: 640px) {
    .rit-top[b-z1sr4tkyvd],
    .top-content[b-z1sr4tkyvd]  .rit-tabs {
        padding-left: 12px;
        padding-right: 12px;
    }

    .rit-panel[b-z1sr4tkyvd],
    .rit-card[b-z1sr4tkyvd] {
        padding: 14px;
    }

        .form-row[b-z1sr4tkyvd],
        .rit-card:nth-child(2) .form-row[b-z1sr4tkyvd],
        .rit-address-column .form-row[b-z1sr4tkyvd],
        .distance-inputs[b-z1sr4tkyvd] {
            grid-template-columns: 1fr;
            gap: 8px;
        }

    .check-field[b-z1sr4tkyvd] {
        white-space: normal;
    }

    .rit-actions[b-z1sr4tkyvd] {
        align-items: stretch;
        flex-direction: column-reverse;
        padding: 12px;
    }

        .rit-actions[b-z1sr4tkyvd]  .btn {
            width: 100%;
        }
}
@media (max-width: 1180px) {
    .rit-page[b-z1sr4tkyvd] {
        display: block;
        height: 100%;
        max-height: 100%;
        min-height: 0;
        overflow: hidden;
    }

    .split-page[b-z1sr4tkyvd] {
        display: block;
        height: 100%;
        max-height: 100%;
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .split-panel[b-z1sr4tkyvd],
    .top-panel[b-z1sr4tkyvd],
    .top-shell[b-z1sr4tkyvd],
    .bottom-shell[b-z1sr4tkyvd],
    .top-content[b-z1sr4tkyvd],
    .bottom-content[b-z1sr4tkyvd],
    .detail-tabstrip[b-z1sr4tkyvd],
    .tab-pane-fill[b-z1sr4tkyvd],
    .form-scroll[b-z1sr4tkyvd],
    .grid-host[b-z1sr4tkyvd],
    .rit-tab-content[b-z1sr4tkyvd],
    .rit-secondary-tab[b-z1sr4tkyvd],
    .actual-costs[b-z1sr4tkyvd],
    .rit-nacalc-panel[b-z1sr4tkyvd],
    .nested-grid[b-z1sr4tkyvd] {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }

    .top-shell[b-z1sr4tkyvd] {
        padding: 8px;
    }

    .detail-tabstrip[b-z1sr4tkyvd]  .k-tabstrip-content-wrapper,
    .detail-tabstrip[b-z1sr4tkyvd]  .k-tabstrip-content,
    .detail-tabstrip[b-z1sr4tkyvd]  .k-tabstrip-content.k-active,
    .detail-tabstrip[b-z1sr4tkyvd]  .k-content,
    .detail-tabstrip[b-z1sr4tkyvd]  .k-content.k-active {
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }

    .detail-tabstrip[b-z1sr4tkyvd]  .k-tabstrip-items-wrapper {
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
    }

    .detail-tabstrip[b-z1sr4tkyvd]  .k-tabstrip-items {
        width: max-content;
        max-width: none;
    }

    .rit-secondary-tab--voorcalc[b-z1sr4tkyvd],
    .rit-secondary-tab--nacalc[b-z1sr4tkyvd] {
        display: block;
    }

    .rit-grid-card[b-z1sr4tkyvd],
    .rit-nacalc-panel[b-z1sr4tkyvd],
    .actual-costs[b-z1sr4tkyvd] {
        min-height: 360px;
    }

    .actual-costs[b-z1sr4tkyvd] {
        margin-top: 16px;
    }

    .rit-grid-card[b-z1sr4tkyvd]  .k-grid,
    .rit-grid-card[b-z1sr4tkyvd]  .grid-noborder,
    .nested-grid[b-z1sr4tkyvd]  .k-grid,
    .nested-grid[b-z1sr4tkyvd]  .grid-noborder {
        min-height: 320px;
        max-width: 100%;
    }
}

@media (max-width: 600px) {
    .detail-tabstrip[b-z1sr4tkyvd]  .k-tabstrip-items {
        flex-wrap: nowrap;
    }

    .detail-tabstrip[b-z1sr4tkyvd]  .k-tabstrip-item {
        flex: 0 0 auto;
    }
}
/* _content/eLipsOnline/Components/Pages/DetailPages/RitRegelDetails.razor.rz.scp.css */
.activity-page[b-i0pxkd5niq] {
    box-sizing: border-box;
    height: 100%;
    max-height: 100%;
    min-height: 0;
    background: var(--color-gray-50);
    color: #111827;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    overflow: hidden;
}

.activity-layout[b-i0pxkd5niq] {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(300px, 380px) minmax(0, 1fr);
    overflow: hidden;
}

.activity-editor[b-i0pxkd5niq] {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    overflow-y: auto;
}

.activity-page--loading[b-i0pxkd5niq] {
    display: grid;
    place-items: center;
}

.activity-page[b-i0pxkd5niq]  .activity-details-form,
.activity-page[b-i0pxkd5niq]  .activity-details-form.k-form {
    width: 100%;
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    display: block;
    gap: 0;
    overflow-y: auto;
}

.activity-page[b-i0pxkd5niq]  .activity-details-form .k-form-fieldset {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 14px;
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    overflow: hidden;
}

.activity-page[b-i0pxkd5niq]  .activity-details-form .k-form-legend,
.activity-page[b-i0pxkd5niq]  .activity-details-form .k-form-buttons {
    display: none;
}

.activity-page[b-i0pxkd5niq]  .activity-details-form .k-input,
.activity-page[b-i0pxkd5niq]  .activity-details-form .k-picker,
.activity-page[b-i0pxkd5niq]  .activity-details-form .k-textarea,
.activity-page[b-i0pxkd5niq]  .activity-details-form .k-multicolumncombobox {
    border-color: #dfe3e8;
    border-radius: 4px;
}

.activity-top[b-i0pxkd5niq] {
    display: grid;
    gap: 7px;
    padding: 16px 16px 10px 16px;
}

.activity-title-row[b-i0pxkd5niq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 5px;
}

.activity-links[b-i0pxkd5niq] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 24px;
}

.activity-link-button[b-i0pxkd5niq] {
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.activity-link-button:hover[b-i0pxkd5niq] {
    color: var(--color-primary-700);
}

.activity-panel[b-i0pxkd5niq] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
    padding: 18px;
}

.activity-strip[b-i0pxkd5niq] {
    display: grid;
    grid-template-columns: auto minmax(150px, 0.8fr) minmax(150px, 1.0fr) minmax(450px, 1.6fr);
    align-items: center;
    gap: 28px;
    padding: 15px 22px;
}

.activity-index[b-i0pxkd5niq] {
    display: grid;
    place-items: center;
    min-width: 30px;
    height: 30px;
    padding: 0 12px;
    border-radius: 6px;
    background: #f3f4f6;
    font-size: 1rem;
    font-weight: 600;
}

.activity-index.activity-status--purple[b-i0pxkd5niq],
.detail-list-item__icon.activity-status--purple[b-i0pxkd5niq] {
    color: #6f42c1;
    background: #f1e7ff;
    border: 1px solid #6f42c1;
}

.activity-index.activity-status--orange[b-i0pxkd5niq],
.detail-list-item__icon.activity-status--orange[b-i0pxkd5niq] {
    color: #e67e22;
    background: #fff0dc;
    border: 1px solid #ffd8a8;
}

.activity-index.activity-status--green[b-i0pxkd5niq],
.detail-list-item__icon.activity-status--green[b-i0pxkd5niq] {
    color: #198754;
    background: #dff5e7;
    border: 1px solid #a9dfbf;
}

.activity-index.activity-status--red[b-i0pxkd5niq],
.detail-list-item__icon.activity-status--red[b-i0pxkd5niq] {
    color: #dc3545;
    background: #fde2e2;
    border: 1px solid #f5b5b9;
}

.activity-index.activity-status--default[b-i0pxkd5niq],
.detail-list-item__icon.activity-status--default[b-i0pxkd5niq] {
    color: #5f6368;
    background: #f1f3f4;
    border: 1px solid #d6d9dc;
}

.activity-strip-field[b-i0pxkd5niq] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    min-width: 0;
}

.activity-strip-field--date[b-i0pxkd5niq] {
    grid-template-columns: auto minmax(0, 1fr);
}

.input-with-button[b-i0pxkd5niq] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 38px;
    gap: 8px;
    align-items: center;
    min-width: 0;
}

.date-time-grid[b-i0pxkd5niq] {
    display: grid;
    grid-template-columns: minmax(140px, 1fr) minmax(72px, .5fr) minmax(72px, .5fr);
    gap: 8px;
    min-width: 0;
}

.activity-options[b-i0pxkd5niq] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 24px;
}

.check-field[b-i0pxkd5niq] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    white-space: nowrap;
}

.activity-content-grid[b-i0pxkd5niq] {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    gap: 10px;
    min-height: 0;
    padding: 0 16px 16px 16px;
    align-items: stretch;
    overflow-y: auto;
    overflow-x: hidden;
}

.activity-column[b-i0pxkd5niq] {
    display: grid;
    gap: 10px;
    min-width: 0;
    min-height: 0;
}

.activity-column--left[b-i0pxkd5niq] {
    grid-template-rows: auto minmax(0, 1fr);
}

.activity-column--right[b-i0pxkd5niq] {
    grid-template-rows: minmax(0, 1fr);
}

.activity-content-grid.has-tourpoint .activity-column--right[b-i0pxkd5niq] {
    grid-template-rows: auto minmax(120px, 1fr);
}

.address-card[b-i0pxkd5niq],
.extra-card[b-i0pxkd5niq],
.activity-tourpoint-card[b-i0pxkd5niq],
.activity-cargo-card[b-i0pxkd5niq] {
    min-width: 0;
    min-height: 0;
}

.address-card[b-i0pxkd5niq] {
    align-self: start;
}

.extra-card[b-i0pxkd5niq] {
    align-self: stretch;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
}

.activity-cargo-card[b-i0pxkd5niq] {
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    padding: 0;
    overflow: hidden;
}

.field-stack[b-i0pxkd5niq] {
    display: grid;
    gap: 10px;
    min-height: 0;
}

.form-row[b-i0pxkd5niq] {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    align-items: center;
    gap: 20px;
}

.form-row--textarea[b-i0pxkd5niq] {
    align-items: start;
    min-height: 0;
}

.form-row--textarea .txt-label[b-i0pxkd5niq] {
    padding-top: 6px;
}

.split-fields[b-i0pxkd5niq] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.split-fields--street[b-i0pxkd5niq] {
    grid-template-columns: minmax(0, 1fr) minmax(64px, .19fr) minmax(72px, .23fr);
}

.split-fields--three[b-i0pxkd5niq] {
    grid-template-columns: minmax(100px, .5fr) minmax(0, 1fr) minmax(86px, .45fr);
}

.activity-location-summary[b-i0pxkd5niq] {
    margin-left: 200px;
}

.icon-only-button[b-i0pxkd5niq] {
    width: 34px;
    height: 34px;
    padding: 0;
}

.activity-cargo-card[b-i0pxkd5niq]  .k-grid {
    width: 100% !important;
    max-width: 100%;
    min-width: 0;
    height: 100%;
    border-width: 0;
    border-radius: 0;
    min-height: 0;
    overflow: hidden;
}

.activity-cargo-card[b-i0pxkd5niq]  .k-grid-header {
    background: #f3f4f6;
}

.activity-cargo-card[b-i0pxkd5niq]  .k-grid-aria-root,
.activity-cargo-card[b-i0pxkd5niq]  .k-grid-container,
.activity-cargo-card[b-i0pxkd5niq]  .k-grid-header,
.activity-cargo-card[b-i0pxkd5niq]  .k-grid-header-wrap,
.activity-cargo-card[b-i0pxkd5niq]  .k-grid-content {
    max-width: 100%;
    min-width: 0;
}

.activity-actions[b-i0pxkd5niq] {
    z-index: 5;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 12px 16px;
    background-color: var(--color-gray-50);
}

.activity-button[b-i0pxkd5niq] {
    min-width: 112px;
    font-weight: 800;
}

.activity-button--primary[b-i0pxkd5niq] {
    color: #fff;
    border-color: #0ea5d7;
    background: #0ea5d7;
}

.activity-button--secondary[b-i0pxkd5niq] {
    color: #111827;
    border-color: #e5e7eb;
    background: #fff;
}

@media (min-width: 1401px) {
    .extra-card .field-stack[b-i0pxkd5niq] {
        align-content: stretch;
    }

    .extra-card .form-row--textarea[b-i0pxkd5niq] {
        align-items: stretch;
    }

/*    .extra-card .form-row--textarea ::deep .k-textarea {
        height: clamp(54px, 6.4dvh, 92px);
        min-height: 54px;
        max-height: 92px;
    }*/

    .activity-tourpoint-card .form-row--textarea[b-i0pxkd5niq] {
        align-items: stretch;
    }

    .activity-tourpoint-card .form-row--textarea[b-i0pxkd5niq]  .k-textarea {
        height: clamp(48px, 5.4dvh, 74px);
        min-height: 48px;
        max-height: 74px;
    }

    .form-row--textarea[b-i0pxkd5niq]  textarea,
    .form-row--textarea[b-i0pxkd5niq]  .k-input-inner {
        height: 100%;
        min-height: 0;
        resize: none;
        overflow: auto;
    }
}

@media (max-width: 1600px) {
    .activity-editor[b-i0pxkd5niq] {
        display: block;
        height: 100%;
        min-height: 0;
        overflow-x: hidden;
        overflow-y: auto;
    }

    .activity-page[b-i0pxkd5niq]  .activity-details-form,
    .activity-page[b-i0pxkd5niq]  .activity-details-form.k-form,
    .activity-page[b-i0pxkd5niq]  .activity-details-form .k-form-fieldset {
        height: auto;
        max-height: none;
        overflow: visible;
    }

    .activity-page[b-i0pxkd5niq]  .activity-details-form .k-form-fieldset {
        display: block;
    }

    .activity-strip[b-i0pxkd5niq] {
        grid-template-columns: auto minmax(220px, 1fr) minmax(280px, 1fr);
        column-gap: 20px;
        row-gap: 14px;
    }

    .activity-strip-field--date[b-i0pxkd5niq] {
        grid-column: 2 / -1;
    }

    .activity-content-grid[b-i0pxkd5niq] {
        align-items: start;
        overflow: visible;
    }

    .activity-column--left[b-i0pxkd5niq],
    .activity-column--right[b-i0pxkd5niq],
    .activity-content-grid.has-tourpoint .activity-column--right[b-i0pxkd5niq] {
        grid-template-rows: auto;
    }

    .activity-cargo-card[b-i0pxkd5niq] {
        min-height: 360px;
    }
}

@media (max-width: 1400px) {
    .activity-page[b-i0pxkd5niq] {
        display: grid;
        height: 100%;
        max-height: 100%;
        min-height: 0;
        overflow: hidden;
    }

    .activity-layout[b-i0pxkd5niq] {
        height: 100%;
        max-height: 100%;
        min-height: 0;
        overflow: hidden;
    }

    .activity-editor[b-i0pxkd5niq] {
        display: block;
        height: 100%;
        max-height: 100%;
        min-height: 0;
        overflow-x: hidden;
        overflow-y: auto;
    }

    .activity-page[b-i0pxkd5niq]  .activity-details-form,
    .activity-page[b-i0pxkd5niq]  .activity-details-form.k-form,
    .activity-page[b-i0pxkd5niq]  .activity-details-form .k-form-fieldset {
        height: auto;
        max-height: none;
        min-height: 0;
        overflow: visible;
    }

    .activity-page[b-i0pxkd5niq]  .activity-details-form .k-form-fieldset {
        display: block;
    }

    .activity-content-grid[b-i0pxkd5niq] {
        min-height: 0;
        overflow: visible;
    }

    .activity-column[b-i0pxkd5niq],
    .activity-column--left[b-i0pxkd5niq],
    .activity-column--right[b-i0pxkd5niq],
    .activity-content-grid.has-tourpoint .activity-column--right[b-i0pxkd5niq] {
        min-height: 0;
    }

    .activity-cargo-card[b-i0pxkd5niq] {
        min-height: 260px;
    }

    .form-row--textarea[b-i0pxkd5niq]  .k-textarea {
        height: 78px;
        min-height: 78px;
        max-height: 78px;
    }

    .form-row--textarea[b-i0pxkd5niq]  textarea,
    .form-row--textarea[b-i0pxkd5niq]  .k-input-inner {
        height: 100%;
        min-height: 0;
        resize: vertical;
    }

    .activity-actions[b-i0pxkd5niq] {
        position: sticky;
        bottom: 0;
        margin-top: 14px;
        border-top: 1px solid #e5e7eb;
        background: rgba(247, 247, 248, .96);
        backdrop-filter: blur(6px);
    }
}

@media (max-width: 1180px) {
    .activity-page[b-i0pxkd5niq] {
        height: 100%;
        min-height: 0;
        overflow: hidden;
    }

    .activity-options[b-i0pxkd5niq] {
        justify-content: flex-start;
    }

    .form-row[b-i0pxkd5niq] {
        grid-template-columns: 150px minmax(0, 1fr);
    }

    .activity-location-summary[b-i0pxkd5niq] {
        margin-left: 170px;
    }

    .form-row--textarea[b-i0pxkd5niq]  .k-textarea {
        height: 78px;
        min-height: 78px;
        max-height: 78px;
    }

    .form-row--textarea[b-i0pxkd5niq]  textarea,
    .form-row--textarea[b-i0pxkd5niq]  .k-input-inner {
        height: 100%;
        min-height: 0;
        resize: vertical;
    }
}

@media (max-width: 1025px) {
    .activity-page[b-i0pxkd5niq] {
        display: grid;
    }

    .activity-layout[b-i0pxkd5niq] {
        grid-template-columns: 1fr;
    }

    .activity-layout > .detail-list-panel[b-i0pxkd5niq] {
        display: none;
    }

    .activity-title-row[b-i0pxkd5niq] {
        align-items: flex-start;
        flex-direction: column;
    }

    .activity-links[b-i0pxkd5niq] {
        justify-content: flex-start;
        gap: 14px;
    }

    .activity-strip[b-i0pxkd5niq],
    .activity-content-grid[b-i0pxkd5niq] {
        grid-template-columns: 1fr;
        padding-bottom: 20px;
    }

    .activity-column[b-i0pxkd5niq],
    .activity-column--left[b-i0pxkd5niq],
    .activity-column--right[b-i0pxkd5niq],
    .activity-content-grid.has-tourpoint .activity-column--right[b-i0pxkd5niq] {
        grid-template-rows: none;
    }

    .activity-cargo-card[b-i0pxkd5niq] {
        min-height: 360px;
    }

    .field-stack[b-i0pxkd5niq] {
        overflow-y: visible;
        padding-right: 0;
    }

    .activity-strip-field--date[b-i0pxkd5niq],
    .activity-options[b-i0pxkd5niq] {
        grid-column: auto;
    }

    .activity-strip[b-i0pxkd5niq] {
        gap: 16px;
    }

    .activity-index[b-i0pxkd5niq] {
        justify-self: start;
    }

    .activity-actions[b-i0pxkd5niq] {
        position: sticky;
        bottom: 0;
        padding: 12px 18px;
    }
}

@media (max-width: 640px) {
    .activity-title-row h5[b-i0pxkd5niq] {
        font-size: 1.35rem;
    }

    .activity-strip[b-i0pxkd5niq],
    .panel-heading[b-i0pxkd5niq],
    .field-stack[b-i0pxkd5niq] {
        padding-left: 14px;
        padding-right: 14px;
    }

    .activity-strip-field[b-i0pxkd5niq],
    .form-row[b-i0pxkd5niq] {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .activity-location-summary[b-i0pxkd5niq] {
        margin-left: 0;
    }

    .date-time-grid[b-i0pxkd5niq],
    .split-fields[b-i0pxkd5niq],
    .split-fields--street[b-i0pxkd5niq],
    .split-fields--three[b-i0pxkd5niq] {
        grid-template-columns: 1fr;
    }

    .activity-options[b-i0pxkd5niq] {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

    .activity-actions[b-i0pxkd5niq] {
        align-items: stretch;
        flex-direction: column-reverse;
        padding: 12px;
    }

    .activity-button[b-i0pxkd5niq] {
        width: 100%;
    }
}
/* Ritregel-specific activity-window mapping */
.ritregel-details-window[b-i0pxkd5niq]  .k-window-content {
    overflow: hidden;
}

.ritregel-list-panel .detail-list-item__icon[b-i0pxkd5niq] {
    flex: 0 0 auto;
}

.ritregel-content-grid .activity-column--right[b-i0pxkd5niq] {
    grid-template-rows: minmax(420px, 1fr) auto;
}

.ritregel-boordcomputer-card[b-i0pxkd5niq] {
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    padding: 0;
    overflow: hidden;
}

.ritregel-boordcomputer-scroll[b-i0pxkd5niq] {
    min-width: 0;
    min-height: 0;
    display: grid;
    align-content: start;
    gap: 14px;
    padding: 18px;
    overflow: auto;
}

.ritregel-status-grid[b-i0pxkd5niq] {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.ritregel-status-panel[b-i0pxkd5niq],
.ritregel-execution-panel[b-i0pxkd5niq] {
    display: grid;
    min-width: 0;
}

.execution-status-grid[b-i0pxkd5niq] {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    align-items: center;
    gap: 18px 28px;
    min-width: 0;
}

.bc-task-card[b-i0pxkd5niq] {
    display: grid;
    grid-template-columns: 34px 82px 160px 110px minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    min-width: 0;
    padding: 10px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 5px;
}

.bc-icon-slot[b-i0pxkd5niq] {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border: 1px solid #e5e7eb;
    border-radius: 5px;
    background: #fbfbfc;
}

.time-table-wrap[b-i0pxkd5niq] {
    width: 100%;
    overflow-x: auto;
}

.time-table[b-i0pxkd5niq] {
    width: 100%;
    min-width: 820px;
    border-collapse: collapse;
    background: #fff;
}

.time-table th[b-i0pxkd5niq],
.time-table td[b-i0pxkd5niq] {
    height: 38px;
    padding: 6px 8px;
    border: 1px solid #e5e7eb;
    vertical-align: middle;
}

.time-table th[b-i0pxkd5niq] {
    background: #f3f4f6;
    font-weight: 700;
    text-align: center;
}

.time-table td:first-child[b-i0pxkd5niq] {
    width: 150px;
    font-weight: 600;
}

.bc-distance-panel[b-i0pxkd5niq] {
    display: grid;
    gap: 0;
    padding: 18px 16px 26px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 5px;
}

.bc-distance-grid[b-i0pxkd5niq] {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    align-items: center;
    gap: 10px 28px;
    min-width: 0;
}

.dialog-actions[b-i0pxkd5niq] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    width: 100%;
}

@media (max-width: 1600px) {
    .ritregel-content-grid .activity-column--right[b-i0pxkd5niq] {
        grid-template-rows: auto;
    }
}

@media (max-width: 1025px) {
    .ritregel-content-grid .activity-column--right[b-i0pxkd5niq] {
        grid-template-rows: none;
    }

    .ritregel-boordcomputer-card[b-i0pxkd5niq] {
        min-height: 360px;
    }
}

@media (max-width: 640px) {
    .bc-task-card[b-i0pxkd5niq],
    .bc-distance-grid[b-i0pxkd5niq],
    .execution-status-grid[b-i0pxkd5niq] {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .dialog-actions[b-i0pxkd5niq] {
        align-items: stretch;
        flex-direction: column;
    }
}
/* _content/eLipsOnline/Components/Pages/DetailPages/RitRegelDetailsOld.razor.rz.scp.css */
/* ==== PAGINA STRUCTUUR =================================================== */

.page-layout[b-txftc3mrq2] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 60px);
}

.page-top[b-txftc3mrq2] {
    flex: 1;
    overflow: auto;
    padding: 10px 20px 90px;
}


/* ==== TOP BLOK MET 2 KOLLOMMEN ============================================ */

.ritregel-header[b-txftc3mrq2] {
    display: grid;
    grid-template-columns: 1fr 250px;
    gap: 20px;
    width: 100%;
    align-items: start;
}

.ritregel-left-wrapper[b-txftc3mrq2] {
    display: grid;
    grid-template-columns: 1.2fr 80fr 0.8fr; /* linkerkolom + extra-info kolom */
    gap: 20px;
    align-items: center;
}

.ritregel-left[b-txftc3mrq2] {
    padding-right: 10px;
}

.ritregel-right[b-txftc3mrq2] {
    width: 250px;
    justify-self: end;
}


/* ==== FORM ROWS ========================================================== */

.form-row[b-txftc3mrq2] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
}

    .form-row label[b-txftc3mrq2] {
        width: 120px;
        font-size: 0.9rem;
    }

/* label direct naast checkbox */
.label-inline[b-txftc3mrq2] {
    width: auto !important;
}

/* label rechts uitgelijnd */
.form-row .label-right[b-txftc3mrq2] {
    width: 80px;
    font-size: 0.9rem;
}


/* ==== TIME INPUTS ========================================================= */

.time-input[b-txftc3mrq2],
.timebox[b-txftc3mrq2] {
    width: 70px;
    height: 33px;
    font-size: 14px;
    text-align: right;
    border: 1px solid #dadfe2 !important;
}


/* ==== RECHTER INFO KOLOM ================================================== */

.info-row[b-txftc3mrq2] {
    display: flex;
    justify-content: end;
    align-items: center;
    margin-bottom: 6px;
}

    .info-row label[b-txftc3mrq2] {
        margin-right:10px;
        width: 80px;
        text-align: right;
        font-size: 0.85rem;
        white-space: nowrap;
    }


/* ==== ADRES BLOK ========================================================== */

.adres-block[b-txftc3mrq2] {
    max-width:750px;
    margin-top: 12px;
    padding: 10px 12px;
    border: 1px solid #ccc;
    background: #f8f8f8;
    border-radius: 4px;
}

    .adres-block .form-row[b-txftc3mrq2] {
        gap: 12px;
    }

    .adres-block input[b-txftc3mrq2],
    .adres-block .rz-input[b-txftc3mrq2],
    .adres-block .rz-dropdown[b-txftc3mrq2] {
        font-size: 0.9rem;
    }


/* ==== INSTRUCTIES / OPMERKINGEN ========================================== */

.ritregel-instructions[b-txftc3mrq2] {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 20px;
    margin-top: 20px;
}

    .ritregel-instructions label[b-txftc3mrq2] {
        display: block;
        margin-bottom: 4px;
        font-size: 0.9rem;
    }


/* ==== EXTRA INFO BLOK ===================================================== */

.extra-info-block[b-txftc3mrq2] {
    margin-top:130px;
    padding: 10px;
    background: #f8f8f8;
    border: 1px solid #ccc;
    border-radius: 4px;
    display: grid;
    row-gap: 6px;
    height:270px;
}


/* ==== BOORDCOMPUTER ======================================================= */

.boordcomputer-section[b-txftc3mrq2] {
    margin-top: 25px;
}

.bc-row[b-txftc3mrq2] {
    display: flex;
    align-items: center;
    gap: 12px;
}


/* ==== TIJDSCHEMA TABEL ==================================================== */

.time-table[b-txftc3mrq2] {
    margin-top: 10px;
    border-collapse: collapse;
}

    .time-table th[b-txftc3mrq2],
    .time-table td[b-txftc3mrq2] {
        padding: 4px 8px;
        border: 1px solid #ccc;
    }

.expected[b-txftc3mrq2] {
    color: purple;
    font-weight: bold;
}

.desired[b-txftc3mrq2] {
    color: #cc00cc;
    font-weight: bold;
}


/* ==== KM ROWS ============================================================= */

.km-section[b-txftc3mrq2] {
    margin-top: 15px;
    display: grid;
    align-items: center;
    margin-left:60vh;
}


/* ==== FIX BOTTOM BUTTON BAR =============================================== */

.form-actions[b-txftc3mrq2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 20px;
    border-top: 1px solid #ccc;
    background: #eee;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
}

.form-actions-left[b-txftc3mrq2],
.form-actions-right[b-txftc3mrq2] {
    display: flex;
    gap: 10px;
}

.ritregel-extra[b-txftc3mrq2] {
    align-self: center;
    width: 100%;
}
/* _content/eLipsOnline/Components/Pages/DetailPages/VoorcalculatieDetails.razor.rz.scp.css */

.form-actions[b-g6ocv7jp1y] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 20px;
    border-top: 1px solid #ccc;
    background-color: #f0f0f0;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
}

.form-actions-left[b-g6ocv7jp1y], .form-actions-right[b-g6ocv7jp1y] {
    display: flex;
    gap: 10px;
}

.page-layout[b-g6ocv7jp1y] {
    display: grid;
    grid-template-rows: 90% 10%; /* of bijv. 70% 30% */
    height: calc(100vh - 60px); /* -60px als je rekening houdt met header of knoppen */
}

.page-top[b-g6ocv7jp1y] {
    overflow: auto; /* zodat je kan scrollen in de tab inhoud */
}

.page-bottom[b-g6ocv7jp1y] {
    overflow: auto; /* zodat de grid netjes scrollt */
}

/* Binnen elke kolom: label + input */
.form-two-col[b-g6ocv7jp1y] {
    display: grid;
    grid-template-columns: 150px 1fr; /* label + veld */
    gap: 6px 12px;
    align-items: center;
}

    .form-two-col label[b-g6ocv7jp1y] {
        font-size: 0.9rem;
    }

/* Orders-tab: 2 kolommen, elk met label+veld-grid */
.form-columns[b-g6ocv7jp1y] {
    display: grid;
    grid-template-columns: 1fr 1fr; /* links/rechts/bijlagen kolom */
    gap: 16px 32px;
    padding-right: 16px;
    box-sizing: border-box;
    width: 50%;
}

.remove-button[b-g6ocv7jp1y] {
    background-color: #9c1818; /* Red background */
    border: none;
    color: white;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    margin: 20px 2px;
    cursor: pointer;
    border-radius: 50%; /* Circular button */
    width: 28px; /* Fixed width */
    height: 28px; /* Fixed height */
    line-height: 20px; /* Match the height to vertically center the '-' */
    padding: 0; /* Reset padding */
    font-weight: bold;
}

    .remove-button:hover[b-g6ocv7jp1y] {
        background-color: #601515; /* Darker shade of red */
    }


.form-row[b-g6ocv7jp1y] {
    display: flex;
    width: max-content;
    gap: 12px 24px; /* ruimte tussen blokjes */
}



    .form-field[b-g6ocv7jp1y] {
    display: flex;
    flex-direction: column; /* label boven input */
}

    .form-field label[b-g6ocv7jp1y] {
        font-size: 0.9rem;
        margin-bottom: 4px;
    }


.form-right-block[b-g6ocv7jp1y] {
    grid-column: 2; /* zet dit blok in de rechterkolom */
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.section-header[b-g6ocv7jp1y] {
    font-weight: 500;
    font-size: 1rem;
    margin-bottom: 4px;
    margin-left: 20px;
    border-bottom: 1px solid #ccc;
    /* eventueel zelfde styling als Ladingen-header */
}

.soort-vc-content[b-g6ocv7jp1y] {
    display: flex;
    gap: 50px;
    /* eventueel een beetje marge naar links ipv inline style */
    margin-left: 20px;
}
/* _content/eLipsOnline/Components/Pages/DetailPages/VoorcalculatieDetailsPopup.razor.rz.scp.css */
.voorcalculatie-details-window[b-lcbidwt96l]  .k-window-content {
    min-height: 0;
    padding: 0;
    overflow: hidden;
}

.vc-popup-layout[b-lcbidwt96l] {
    flex: 1 1 auto;
    width: 100%;
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(280px, 380px) minmax(0, 1fr);
    overflow: hidden;
    background: var(--color-gray-50);
}

.vc-list-panel[b-lcbidwt96l] {
    min-height: 0;
}

.vc-list-icon--income[b-lcbidwt96l],
.detail-list-item.is-selected .vc-list-icon--income[b-lcbidwt96l] {
    color: #16824b;
    background: #e8f7ef;
}

.vc-list-icon--expense[b-lcbidwt96l],
.detail-list-item.is-selected .vc-list-icon--expense[b-lcbidwt96l] {
    color: #c93636;
    background: #fdecec;
}

.detail-list-item-badge.vc-list-badge--income[b-lcbidwt96l],
.detail-list-item.is-selected .detail-list-item-badge.vc-list-badge--income[b-lcbidwt96l] {
    color: #16824b;
    background: #e8f7ef;
}

.detail-list-item-badge.vc-list-badge--expense[b-lcbidwt96l],
.detail-list-item.is-selected .detail-list-item-badge.vc-list-badge--expense[b-lcbidwt96l] {
    color: #c93636;
    background: #fdecec;
}

.vc-detail-panel[b-lcbidwt96l] {
    min-width: 0;
    min-height: 0;
    overflow-y: auto;
    background: var(--color-gray-50);
}

.voorcalculatie-form[b-lcbidwt96l] {
    min-height: 100%;
}

.vc-body[b-lcbidwt96l] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 14px;
    height: 100%;
    min-height: 0;
    padding: 16px 25px;
}

.vc-topline[b-lcbidwt96l] {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.vc-vestiging-field[b-lcbidwt96l] {
    display: grid;
    grid-template-columns: 65px minmax(160px, 184px);
    align-items: center;
    gap: 20px;
}

.vc-meta[b-lcbidwt96l] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 24px;
}

.vc-meta-item[b-lcbidwt96l] {
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.vc-meta-item:hover[b-lcbidwt96l] {
    color: var(--color-primary-700);
}

.vc-check-panel[b-lcbidwt96l] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    padding: 14px 18px;
}

.vc-check-row[b-lcbidwt96l] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 24px;
    min-height: 24px;
    margin: 0;
}

.vc-check-item[b-lcbidwt96l] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}

.vc-panel[b-lcbidwt96l] {
    min-width: 0;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.vc-panel-main[b-lcbidwt96l] {
    padding: 18px 18px 25px 18px;
}

.vc-form-grid[b-lcbidwt96l] {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    align-items: center;
    gap: 15px;
}

.vc-two-fields[b-lcbidwt96l] {
    display: grid;
    grid-template-columns: minmax(220px, .9fr) minmax(260px, 1.1fr);
    align-items: center;
    gap: 12px;
}

.vc-amount-panel[b-lcbidwt96l] {
    padding: 18px 18px 25px 18px;
}

.vc-wacht-panel[b-lcbidwt96l] {
    padding: 18px 18px 25px 18px;
}

.vc-wacht-grid[b-lcbidwt96l] {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr) minmax(120px, 150px);
    align-items: end;
    gap: 18px;
}

.vc-lading-panel[b-lcbidwt96l] {
    display: flex;
    flex-direction: column;
    min-height: 200px;
    padding: 0;
    overflow: hidden;
}

.vc-lading-panel[b-lcbidwt96l]  > * {
    flex: 1 1 auto;
    min-height: 0;
}

.vc-lading-panel[b-lcbidwt96l]  .k-grid {
    width: 100% !important;
    max-width: 100%;
    min-width: 0;
    height: 100%;
    border-width: 0;
    border-radius: 0;
    min-height: 0;
    overflow: hidden;
}

.vc-lading-panel[b-lcbidwt96l]  .k-grid-header {
    background: #f3f4f6;
}

.vc-amount-grid[b-lcbidwt96l] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: end;
    gap: 18px 20px;
}

.vc-stack[b-lcbidwt96l] {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.vc-actions[b-lcbidwt96l] {
    z-index: 5;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    width: 100%;
    padding: 12px 16px;
    background-color: var(--color-gray-50);
}

@media (max-width: 1400px) {
    .vc-actions[b-lcbidwt96l] {
        position: sticky;
        bottom: 0;
        border-top: 1px solid #e5e7eb;
        background: rgba(247, 247, 248, .96);
        backdrop-filter: blur(6px);
    }
}

@media (max-width: 1180px) {
    .vc-popup-layout[b-lcbidwt96l] {
        grid-template-columns: minmax(250px, 30%) minmax(0, 1fr);
    }

    .vc-form-grid[b-lcbidwt96l] {
        grid-template-columns: 150px minmax(0, 1fr);
    }

    .vc-wacht-grid[b-lcbidwt96l] {
        grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) minmax(120px, 150px);
    }

    .vc-lading-panel[b-lcbidwt96l] {
        min-height: 200px;
    }
}

@media (max-width: 920px) {
    .vc-popup-layout[b-lcbidwt96l] {
        height: 100%;
        grid-template-columns: minmax(0, 1fr);
    }

    .vc-popup-layout > .detail-list-panel[b-lcbidwt96l] {
        display: none;
    }

    .vc-check-panel[b-lcbidwt96l] {
        align-items: flex-start;
        flex-direction: column;
    }

    .vc-two-fields[b-lcbidwt96l] {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

    .vc-amount-grid[b-lcbidwt96l] {
        grid-template-columns: repeat(2, minmax(140px, 1fr));
    }
}

@media (max-width: 640px) {
    .voorcalculatie-details-window[b-lcbidwt96l]  .k-window-content {
        overflow: hidden;
    }

    .vc-detail-panel[b-lcbidwt96l] {
        overscroll-behavior: contain;
    }

    .vc-header[b-lcbidwt96l] {
        min-height: 0;
        padding: 16px;
    }

    .vc-header h1[b-lcbidwt96l] {
        font-size: 1.35rem;
    }

    .vc-body[b-lcbidwt96l] {
        padding: 12px;
    }

    .vc-vestiging-field[b-lcbidwt96l],
    .vc-form-grid[b-lcbidwt96l],
    .vc-two-fields[b-lcbidwt96l],
    .vc-wacht-grid[b-lcbidwt96l],
    .vc-amount-grid[b-lcbidwt96l] {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .vc-check-row[b-lcbidwt96l] {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

    .vc-actions[b-lcbidwt96l] {
        align-items: stretch;
        flex-direction: column-reverse;
        padding: 12px;
    }
}
/* _content/eLipsOnline/Components/Pages/Facturatie/FacturatieSectionNav.razor.rz.scp.css */
/* _content/eLipsOnline/Components/Pages/Facturatie/FacturenPage.razor.rz.scp.css */
.facturen-page[b-imenaiapaj] {
    height: 100%;
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.page-body[b-imenaiapaj] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
    min-width: 0;
    overflow: hidden;
}

.page-body-content[b-imenaiapaj] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    display: flex;
    overflow: hidden;
}

.splitter-host[b-imenaiapaj] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    height: 100%;
    background: var(--color-gray-50);
}

.main-pane[b-imenaiapaj] {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    min-width: 0;
    overflow: hidden;
    padding: 20px 5px 20px 20px;
    background: var(--color-gray-50);
    gap: 8px;
}

.oo-title[b-imenaiapaj] { 
    margin-bottom: -6px;
}

.oo-title h3[b-imenaiapaj] {
    margin-bottom: 5px;
}

.oo-grid-card[b-imenaiapaj] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: white;
    padding: 12px 16px 16px 16px;
    box-shadow: rgba(0, 0, 0, 0.05) 0px 1px 2px, rgba(0, 0, 0, 0.04) 0px 4px 12px;
    border-radius: 6px;
    border: 1px solid var(--color-gray-200);
}

.oo-nav[b-imenaiapaj] {
    flex: 0 0 auto;
    width: 100%;
    background-color: transparent;
    overflow: hidden;
}

.oo-nav-toolbar[b-imenaiapaj] {
    padding: 5px 0 10px 0;
    gap: 12px;
}

.oo-nav-group[b-imenaiapaj] {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 4px;
}

.oo-nav-label[b-imenaiapaj] {
    color: #8f8f8f;
    font-size: var(--fs-caption);
    line-height: 1;
    padding-left: 0;
    white-space: nowrap;
}

.oo-nav-group-body[b-imenaiapaj] {
    gap: 6px!important;
    min-height: 32px;
}

.fo-nav-actions .btn[b-imenaiapaj] {
    height: 32px;
    min-width: 32px;
    padding: 6px 7px;
}

.fo-checkbox-filter[b-imenaiapaj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #374151;
    font-size: var(--fs-body-3);
    line-height: 1;
    white-space: nowrap;
    margin: 0;
}

.fo-new-btn[b-imenaiapaj] {
    min-width: 72px;
    padding-inline: 14px;
}

.grid-host[b-imenaiapaj] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

[b-imenaiapaj] .splitter-host > .k-splitter {
    min-height: 0;
}

[b-imenaiapaj] .splitter-host .k-pane {
    min-height: 0;
    overflow: hidden;
}

[b-imenaiapaj] .main-pane .k-grid {
    flex: 1 1 auto;
    min-height: 0;
    border-radius: 7px;
}

[b-imenaiapaj] .main-pane .k-grid-footer {
    background: #fafafa;
}

.fo-grid-footer-total[b-imenaiapaj] {
    display: block;
    width: 100%;
    color: #111827;
    font-weight: 700;
    text-align: right;
}

.fo-dashboard[b-imenaiapaj] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: minmax(150px, 0.95fr) minmax(210px, 1.25fr) minmax(150px, 0.9fr) minmax(150px, 0.9fr);
    gap: 14px;
    width: 100%;
    margin: 8px 0 14px;
}

.fo-dashboard-card[b-imenaiapaj] {
    min-width: 0;
    min-height: 84px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    background: white;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.fo-dashboard-icon[b-imenaiapaj] {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
}

[b-imenaiapaj] .fo-dashboard-icon .k-svg-icon {
    width: 18px;
    height: 18px;
}

.fo-dashboard-icon--blue[b-imenaiapaj] {
    color: white;
    background: var(--blue);
}

.fo-dashboard-icon--green[b-imenaiapaj] {
    color: white;
    background: var(--green);
}

.fo-dashboard-icon--red[b-imenaiapaj] {
    color: white;
    background: var(--red);
}

.fo-dashboard-icon--amber[b-imenaiapaj] {
    color: white;
    background: var(--purple);
}

.fo-dashboard-icon--cyan[b-imenaiapaj] {
    color: white;
    background: var(--cyan);
}

.fo-dashboard-copy[b-imenaiapaj] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.fo-dashboard-label[b-imenaiapaj] {
    color: #6b7280;
    font-size: var(--fs-caption);
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-bottom: 2px;
}

.fo-dashboard-copy strong[b-imenaiapaj] {
    color: #111827;
    font-size: var(--fs-h4);
    font-weight: 600;
    line-height: 1.05;
    overflow-wrap: anywhere;
}

.fo-dashboard-card--wide .fo-dashboard-copy strong[b-imenaiapaj] {
    font-size: var(--fs-h4);
}

.fo-dashboard-meta[b-imenaiapaj] {
    color: #6b7280;
    font-size: var(--fs-caption);
    line-height: 1.2;
    overflow-wrap: anywhere;
}

@media (max-width: 1100px) {
    .facturen-page[b-imenaiapaj],
    .page-body[b-imenaiapaj],
    .page-body-content[b-imenaiapaj] {
        height: auto;
        overflow: visible;
    }

    .facturen-page[b-imenaiapaj] {
        height: 100%;
        min-height: 0;
        overflow-y: auto;
    }

    .splitter-host[b-imenaiapaj] {
        height: auto;
        min-height: 100%;
        overflow: visible;
    }

    [b-imenaiapaj] .splitter-host > .k-splitter {
        display: flex;
        flex-direction: column;
        height: auto !important;
        min-height: 100%;
        overflow: visible;
    }

    [b-imenaiapaj] .splitter-host > .k-splitter > .k-pane {
        flex: 0 0 auto !important;
        flex-basis: auto !important;
        width: 100% !important;
        max-width: none !important;
        height: auto !important;
        min-width: 0 !important;
        overflow: visible;
    }

    [b-imenaiapaj] .splitter-host > .k-splitter > .k-splitbar {
        display: none !important;
    }

    .main-pane[b-imenaiapaj] {
        height: auto;
        min-height: 720px;
        overflow: visible;
        padding-right: 20px;
    }

    .oo-grid-card[b-imenaiapaj] {
        min-height: 420px;
    }

    .invoice-preview-shell[b-imenaiapaj] {
        height: min(720px, 85vh);
        min-height: 520px;
        padding: 0 20px 20px;
    }

    .fo-dashboard[b-imenaiapaj] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .main-pane[b-imenaiapaj] {
        min-height: 900px;
        padding: 16px 8px;
    }

    .invoice-preview-shell[b-imenaiapaj] {
        height: 680px;
        min-height: 480px;
        padding: 0 8px 8px;
    }

    .fo-dashboard[b-imenaiapaj] {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .fo-dashboard-card[b-imenaiapaj] {
        min-height: 74px;
    }
}
/* _content/eLipsOnline/Components/Pages/Facturatie/FactuurDetailPage.razor.rz.scp.css */

.invoice-page[b-c9tfagh5kn] {
    box-sizing: border-box;
    height: calc(100vh - 40px);
    height: calc(100dvh - 40px);
    max-height: calc(100vh - 40px);
    max-height: calc(100dvh - 40px);
    min-height: 0;
    background: var(--color-gray-50);
    color: #111827;
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    overflow: hidden;
}

.invoice-page--loading[b-c9tfagh5kn] {
    place-items: center;
}

.invoice-page[b-c9tfagh5kn]  .invoice-details-form,
.invoice-page[b-c9tfagh5kn]  .invoice-details-form.k-form {
    width: 100%;
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    gap: 0;
    overflow: hidden;
}

.invoice-page[b-c9tfagh5kn]  .invoice-details-form .k-form-fieldset {
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    overflow: hidden;
}

.invoice-page[b-c9tfagh5kn]  .invoice-details-form > .k-form-fieldset {
    min-height: 0;
}

.invoice-page[b-c9tfagh5kn]  .invoice-details-form .k-form-legend,
.invoice-page[b-c9tfagh5kn]  .invoice-details-form .k-form-buttons {
    display: none;
}

.invoice-workspace[b-c9tfagh5kn] {
    box-sizing: border-box;
    min-width: 0;
    min-height: 0;
    height: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1.50fr) minmax(390px, .95fr);
    gap: 8px;
    padding: 16px 8px 16px 16px;
    overflow: hidden;
    align-items: stretch;
}

.invoice-content[b-c9tfagh5kn] {
    box-sizing: border-box;
    min-width: 0;
    min-height: 0;
    height: 100%;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 16px;
}

.invoice-panel[b-c9tfagh5kn] {
    min-width: 0;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
    padding: 20px;
}

.invoice-card-header[b-c9tfagh5kn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-width: 0;
}

.invoice-card-header h4[b-c9tfagh5kn],
.invoice-card-header h5[b-c9tfagh5kn] {
    margin: 0;
}

.invoice-input-card[b-c9tfagh5kn] {
    display: grid;
    gap: 18px;
}

.invoice-form-grid[b-c9tfagh5kn] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: 36px;
    row-gap: 14px;
    padding-bottom: 10px;
}

.field-stack[b-c9tfagh5kn] {
    display: grid;
    gap: 12px;
    min-width: 0;
}

.form-row[b-c9tfagh5kn] {
    display: grid;
    grid-template-columns: 110px minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    min-width: 0;
}

.form-row--wide[b-c9tfagh5kn] {
    grid-column: 1 / -1;
}

.invoice-extra-section[b-c9tfagh5kn] {
    display: grid;
    gap: 8px;
    padding-top: 4px;
    padding-bottom: 10px;
}

.split-fields[b-c9tfagh5kn] {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.split-fields--currency[b-c9tfagh5kn] {
    grid-template-columns: minmax(0, 1fr) minmax(96px, .48fr);
}

.invoice-lower-grid[b-c9tfagh5kn] {
    box-sizing: border-box;
    min-width: 0;
    min-height: 0;
    height: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
    gap: 16px;
}

.invoice-attachments-card[b-c9tfagh5kn],
.invoice-payments-card[b-c9tfagh5kn] {
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 14px;
}

.invoice-dropzone[b-c9tfagh5kn] {
    height: 44px;
    border: 1px dashed #8b93a1;
    border-radius: 4px;
    background: #f7f7f8;
}

.invoice-card-actions[b-c9tfagh5kn] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.invoice-page[b-c9tfagh5kn]  .btn-icon {
    width: 34px;
    height: 34px;
    padding: 0;
}

.invoice-payment-empty-state[b-c9tfagh5kn] {
    display: grid;
    place-items: center;
    min-height: 78px;
    border: 1px solid #eef0f3;
    border-radius: 6px;
    color: #8b93a1;
    font-size: .9rem;
}

.invoice-payments-list[b-c9tfagh5kn] {
    min-height: 0;
    overflow: auto;
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding-right: 2px;
}

.invoice-payment-card[b-c9tfagh5kn] {
    flex: 0 0 auto;
    min-height: 40px;
    display: grid;
    grid-template-columns: 36px minmax(100px, 1fr) auto auto;
    align-items: center;
    gap: 16px;
    padding: 7px 10px 7px 7px;
    background: #fff;
    border: 1px solid #edf0f3;
    border-radius: 5px;
    color: #111827;
    cursor: pointer;
}

.invoice-payment-card:hover[b-c9tfagh5kn],
.invoice-payment-card--selected[b-c9tfagh5kn] {
    background: #f3f8fb;
    border-color: var(--color-primary-500);
}

.invoice-payment-card--selected[b-c9tfagh5kn] {
    box-shadow: inset 0 0 0 1px var(--color-primary-500);
}

.invoice-payment-card__icon[b-c9tfagh5kn] {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    color: var(--color-primary-600);
    background: #f8fafc;
    border: 1px solid #eef1f5;
    border-radius: 5px;
}

.invoice-payment-card__icon[b-c9tfagh5kn]  svg {
    width: 20px;
    height: 20px;
    fill: var(--color-primary-700);
}

.invoice-payment-card__date[b-c9tfagh5kn] {
    min-width: 0;
    color: var(--color-gray-600);
    font-size: var(--fs-body-3);
    font-weight: 400;
}

.invoice-payment-card__amount[b-c9tfagh5kn] {
    color: #111827;
    font-size: var(--fs-body-2);
    font-weight: 500;
    text-align: right;
    white-space: nowrap;
}

.invoice-payment-card__currency[b-c9tfagh5kn] {
    color: #6b7280;
    font-size: var(--fs-body-2);
    white-space: nowrap;
}

.payment-window-body[b-c9tfagh5kn] {
    display: grid;
    gap: 15px;
    padding: 20px 30px 25px;
}

.payment-window-invoice[b-c9tfagh5kn] {
    color: #6b7280;
    font-size: var(--fs-caption);
    font-weight: 400;
}

.payment-window-form[b-c9tfagh5kn] {
    display: grid;
    grid-template-columns: 100px minmax(0, 1fr);
    align-items: center;
    gap: 22px 26px;
}

.payment-window-actions[b-c9tfagh5kn] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

.invoice-card-total[b-c9tfagh5kn] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 16px;
    padding-top: 14px;
    border-top: 1px solid #dfe3e8;
}

    .invoice-card-total span[b-c9tfagh5kn] {
        font-size: var(--fs-body-2);
    }

    .invoice-card-total strong[b-c9tfagh5kn] {
        font-size: var(--fs-body-2);
        font-weight: 600;
        color: black;
    }


.activity-actions[b-c9tfagh5kn] {
    z-index: 5;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 12px 16px;
    background-color: var(--color-gray-50);
}

@media (max-width: 920px) {
    .invoice-page[b-c9tfagh5kn] {
        display: block;
        height: auto;
        max-height: none;
        min-height: calc(100vh - 40px);
        min-height: calc(100dvh - 40px);
        overflow: visible;
    }

    .invoice-page[b-c9tfagh5kn]  .invoice-details-form,
    .invoice-page[b-c9tfagh5kn]  .invoice-details-form.k-form,
    .invoice-page[b-c9tfagh5kn]  .invoice-details-form .k-form-fieldset {
        height: auto;
        max-height: none;
        overflow: visible;
    }

    .invoice-workspace[b-c9tfagh5kn] {
        grid-template-columns: minmax(0, 1fr);
        overflow: visible;
    }

    .invoice-content[b-c9tfagh5kn] {
        min-height: 0;
    }

    .activity-actions[b-c9tfagh5kn] {
        position: sticky;
        bottom: 0;
        margin-top: 14px;
        padding: 12px 16px;
        border-top: 1px solid #e5e7eb;
        background: rgba(247, 247, 248, .96);
        backdrop-filter: blur(6px);
    }
}

@media (max-width: 920px) {
    .invoice-form-grid[b-c9tfagh5kn],
    .invoice-lower-grid[b-c9tfagh5kn] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .invoice-workspace[b-c9tfagh5kn] {
        padding: 12px;
    }

    .invoice-panel[b-c9tfagh5kn] {
        padding: 14px;
    }

    .form-row[b-c9tfagh5kn],
    .form-row--wide[b-c9tfagh5kn] {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .split-fields--currency[b-c9tfagh5kn] {
        grid-template-columns: 1fr;
    }

    .activity-actions[b-c9tfagh5kn] {
        align-items: stretch;
        flex-direction: column-reverse;
        padding: 12px;
    }

    .activity-button[b-c9tfagh5kn] {
        width: 100%;
    }
}

/* _content/eLipsOnline/Components/Pages/Facturatie/FactuurDetailPageOld.razor.rz.scp.css */
/* _content/eLipsOnline/Components/Pages/Facturatie/FactuurExportPage.razor.rz.scp.css */
.factuur-export-page[b-1tiuhxupzv] {
    height: 100%;
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--color-gray-50);
}

.page-body[b-1tiuhxupzv] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    display: flex;
    overflow: hidden;
    background: var(--color-gray-50);
}

.page-body-content[b-1tiuhxupzv] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    display: flex;
    overflow: hidden;
}

.fe-main-pane[b-1tiuhxupzv] {
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 20px;
    overflow: hidden;
}

.fe-hero-card[b-1tiuhxupzv],
.fe-dashboard-card[b-1tiuhxupzv],
.fe-export-panel[b-1tiuhxupzv] {
    background: #fff;
    border: 1px solid var(--color-gray-100);
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.fe-hero-card[b-1tiuhxupzv] {
    flex: 0 0 auto;
    display: grid;
    gap: 22px;
    padding: 22px 28px 24px;
}

.fe-hero-header[b-1tiuhxupzv] {
    display: grid;
    gap: 18px;
    min-width: 0;
}

.fe-hero-header h4[b-1tiuhxupzv],
.fe-panel-header h4[b-1tiuhxupzv],
.fe-empty-state h4[b-1tiuhxupzv] {
    margin: 0;
}

.fe-controls[b-1tiuhxupzv] {
    display: flex;
    align-items: flex-end;
    gap: 16px;
    min-width: 0;
    flex-wrap: wrap;
}

.fe-field[b-1tiuhxupzv] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.fe-log-button[b-1tiuhxupzv],
.fe-export-button[b-1tiuhxupzv],
.fe-filter-button[b-1tiuhxupzv],
.fe-new-button[b-1tiuhxupzv] {
    min-height: 34px;
    white-space: nowrap;
}

.fe-progress-row[b-1tiuhxupzv] {
    display: grid;
    grid-template-columns: minmax(160px, 1fr) auto auto;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.fe-progress-track[b-1tiuhxupzv] {
    height: 16px;
    overflow: hidden;
    background: #eef3fd;
    border-radius: 999px;
}

.fe-progress-track span[b-1tiuhxupzv] {
    display: block;
    width: 0;
    height: 100%;
    background: var(--color-primary-700);
    border-radius: inherit;
    transition: background 180ms ease;
}

.fe-progress-track--complete span[b-1tiuhxupzv] {
    background: linear-gradient(90deg, #22c55e, #16a34a);
}

.fe-progress-row strong[b-1tiuhxupzv] {
    color: var(--color-primary-700);
    font-size: var(--fs-body-3);
    font-weight: 700;
}

.fe-progress-value--complete[b-1tiuhxupzv] {
    color: #16a34a !important;
}

.fe-progress-row > span[b-1tiuhxupzv] {
    color: var(--color-gray-500);
    font-weight: 450;
    font-size: var(--fs-body-3);
    white-space: nowrap;
}

.fe-dashboard[b-1tiuhxupzv] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.fe-dashboard-card[b-1tiuhxupzv] {
    min-width: 0;
    min-height: 112px;
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    align-items: center;
    gap: 18px;
    padding: 20px 26px;
}

.fe-dashboard-icon[b-1tiuhxupzv],
.fe-empty-icon[b-1tiuhxupzv] {
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary-700);
    background: #eaf1ff;
    border-radius: 50%;
}

.fe-dashboard-icon--success[b-1tiuhxupzv] {
    color: var(--color-success-700);
    background: #dcfce7;
}

.fe-dashboard-icon--danger[b-1tiuhxupzv] {
    color: var(--color-danger-700);
    background: #fee2e2;
}

[b-1tiuhxupzv] .fe-dashboard-icon .k-svg-icon,
[b-1tiuhxupzv] .fe-empty-icon .k-svg-icon {
    width: 22px;
    height: 22px;
}

.fe-dashboard-copy[b-1tiuhxupzv] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fe-dashboard-label[b-1tiuhxupzv],
.fe-dashboard-meta[b-1tiuhxupzv],
.fe-card-amount span[b-1tiuhxupzv],
.fe-card-date span[b-1tiuhxupzv], .fe-card-date strong[b-1tiuhxupzv] {
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
    line-height: 1.2;
    font-weight: 400;
}

.fe-card-main span[b-1tiuhxupzv] {
    font-size: var(--fs-body-3);
    color: var(--color-gray-600);
}

.fe-dashboard-copy strong[b-1tiuhxupzv] {
    color: #111827;
    font-size: var(--fs-h4);
    font-weight: 700;
    line-height: 1.1;
    overflow-wrap: anywhere;
}

.fe-status-success[b-1tiuhxupzv] {
    color: var(--color-success-700) !important;
}

.fe-status-failed[b-1tiuhxupzv] {
    color: var(--color-danger-700) !important;
}

.fe-export-panel[b-1tiuhxupzv] {
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 20px 24px;
    overflow: hidden;
}

.fe-panel-header[b-1tiuhxupzv] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

.fe-panel-toolbar[b-1tiuhxupzv] {
    flex: 1 1 auto;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
    min-width: 300px;
}

.fe-search[b-1tiuhxupzv] {
    position: relative;
    flex: 0 1 300px;
    min-width: 210px;
    display: block;
}

.fe-search[b-1tiuhxupzv]  .k-svg-icon {
    position: absolute;
    z-index: 1;
    left: 14px;
    top: 50%;
    width: 17px;
    height: 17px;
    color: var(--color-gray-500);
    transform: translateY(-50%);
    pointer-events: none;
}

.fe-search[b-1tiuhxupzv]  .k-textbox,
.fe-search[b-1tiuhxupzv]  .k-input {
    width: 100%;
    height: 34px;
}

.fe-search[b-1tiuhxupzv]  input {
    padding-left: 42px;
    color: #111827;
    font-size: var(--fs-body-3);
}

.fe-search[b-1tiuhxupzv]  input::placeholder {
    color: var(--color-gray-500);
}

.fe-controls[b-1tiuhxupzv]  .k-combobox {
    max-width: 100%;
}

.fe-filter-button[b-1tiuhxupzv],
.fe-new-button[b-1tiuhxupzv] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.fe-export-list[b-1tiuhxupzv] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--color-gray-200);
    border-radius: 6px;
    overflow-x: hidden;
    overflow-y: auto;
}

.fe-export-card[b-1tiuhxupzv] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: 35px minmax(210px, 1.5fr) minmax(120px, 0.7fr) minmax(140px, 0.75fr) minmax(170px, 0.75fr);
    align-items: center;
    gap: 20px;
    min-height: 78px;
    padding: 14px 16px;
    background: #fff;
    border-bottom: 1px solid var(--color-gray-200);
}

/*.fe-export-card:last-child {
    border-bottom: 0;
}*/

.fe-card-status-icon[b-1tiuhxupzv] {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-gray-700);
    background: var(--color-gray-200);
    border-radius: 50%;
}

[b-1tiuhxupzv] .fe-card-status-icon .k-svg-icon {
    width: 16px;
    height: 16px;
}

.fe-card-main[b-1tiuhxupzv] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.fe-card-main strong[b-1tiuhxupzv],
.fe-card-amount strong[b-1tiuhxupzv] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-2);
    font-weight: 700;
    line-height: 1.2;
}

.fe-status-badge[b-1tiuhxupzv] {
    justify-self: start;
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 7px 18px;
    color: var(--color-gray-600);
    background: var(--color-gray-100);
    border-radius: 999px;
    font-size: var(--fs-caption);
    font-weight: 700;
    text-transform: uppercase;
    white-space: nowrap;
}

.fe-card-amount[b-1tiuhxupzv],
.fe-card-date[b-1tiuhxupzv] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.fe-card-date[b-1tiuhxupzv] {
    justify-self: end;
    text-align: right;
}

.fe-card-date strong[b-1tiuhxupzv],
.fe-card-amount strong[b-1tiuhxupzv],
.fe-card-main strong[b-1tiuhxupzv] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fe-card-menu[b-1tiuhxupzv] {
    width: 30px;
    min-width: 30px;
    height: 30px;
    padding: 0;
    border: 0;
    color: #64748b;
    font-weight: 800;
    letter-spacing: 0;
    box-shadow: none;
}

.fe-empty-state[b-1tiuhxupzv] {
    flex: 1 1 auto;
    width: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 32px;
    text-align: center;
}

.fe-empty-visual[b-1tiuhxupzv] {
    width: 145px;
    height: 145px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fe-empty-image[b-1tiuhxupzv] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.fe-empty-state p[b-1tiuhxupzv] {
    margin: 0;
    color: #64748b;
    font-size: var(--fs-body-3);
}

.fe-panel-footer[b-1tiuhxupzv] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    min-height: 56px;
    padding: 0 4px;
    color: #64748b;
    font-size: var(--fs-body-3);
}

@media (max-width: 1360px) {
    .fe-main-pane[b-1tiuhxupzv] {
        gap: 14px;
        padding: 16px;
    }

    .fe-hero-card[b-1tiuhxupzv] {
        gap: 18px;
        padding: 18px 22px;
    }

    .fe-dashboard[b-1tiuhxupzv] {
        gap: 14px;
    }

    .fe-dashboard-card[b-1tiuhxupzv] {
        min-height: 96px;
        grid-template-columns: 42px minmax(0, 1fr);
        gap: 14px;
        padding: 16px 18px;
    }

    .fe-dashboard-icon[b-1tiuhxupzv],
    .fe-empty-icon[b-1tiuhxupzv] {
        width: 42px;
        height: 42px;
    }

    .fe-export-panel[b-1tiuhxupzv] {
        padding: 18px 20px;
    }

    .fe-export-card[b-1tiuhxupzv] {
        grid-template-columns: 35px minmax(180px, 1.35fr) minmax(120px, 0.65fr) minmax(120px, 0.7fr) minmax(150px, 0.75fr);
        gap: 16px;
        padding-inline: 14px;
    }
}

@media (max-width: 1180px) {
    .fe-dashboard[b-1tiuhxupzv] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .fe-progress-row[b-1tiuhxupzv] {
        grid-template-columns: minmax(160px, 1fr) auto;
    }

    .fe-progress-row > span[b-1tiuhxupzv] {
        grid-column: 1 / -1;
    }

    .fe-panel-header[b-1tiuhxupzv] {
        align-items: flex-start;
    }

    .fe-panel-toolbar[b-1tiuhxupzv] {
        min-width: 260px;
    }

    .fe-export-card[b-1tiuhxupzv] {
        grid-template-columns: 35px minmax(0, 1fr) minmax(130px, auto);
    }

    .fe-status-badge[b-1tiuhxupzv],
    .fe-card-date[b-1tiuhxupzv] {
        grid-column: 2 / -1;
    }

    .fe-card-date[b-1tiuhxupzv] {
        justify-self: start;
        text-align: left;
    }

    .fe-card-amount[b-1tiuhxupzv] {
        grid-column: 3;
        grid-row: 1;
    }
}

@media (max-width: 900px) {
    .page-body-content[b-1tiuhxupzv] {
        overflow-y: auto;
    }

    .fe-main-pane[b-1tiuhxupzv] {
        height: auto;
        min-height: 100%;
        overflow: visible;
    }

    .fe-export-panel[b-1tiuhxupzv] {
        flex: 0 0 auto;
        min-height: 460px;
    }

    .fe-panel-header[b-1tiuhxupzv] {
        align-items: stretch;
        flex-direction: column;
    }

    .fe-panel-toolbar[b-1tiuhxupzv] {
        width: 100%;
        min-width: 0;
        justify-content: flex-start;
    }

    .fe-search[b-1tiuhxupzv] {
        flex: 1 1 auto;
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 760px) {
    .fe-main-pane[b-1tiuhxupzv] {
        padding: 14px;
    }

    .fe-dashboard[b-1tiuhxupzv] {
        grid-template-columns: 1fr;
    }

    .fe-hero-card[b-1tiuhxupzv],
    .fe-export-panel[b-1tiuhxupzv] {
        padding: 18px;
    }

    .fe-field[b-1tiuhxupzv],
    .fe-controls[b-1tiuhxupzv],
    .fe-panel-toolbar[b-1tiuhxupzv] {
        align-items: stretch;
        flex-direction: column;
    }

    .fe-field[b-1tiuhxupzv] {
        gap: 8px;
    }

    .fe-field[b-1tiuhxupzv]  .k-combobox {
        width: 100% !important;
    }

    .fe-panel-toolbar[b-1tiuhxupzv],
    .fe-search[b-1tiuhxupzv] {
        width: 100%;
        min-width: 0;
    }

    .fe-progress-row[b-1tiuhxupzv] {
        grid-template-columns: 1fr auto;
    }

    .fe-progress-row > span[b-1tiuhxupzv] {
        grid-column: 1 / -1;
    }

    .fe-export-card[b-1tiuhxupzv] {
        grid-template-columns: 28px minmax(0, 1fr);
        gap: 12px;
        align-items: start;
        padding: 14px;
    }

    .fe-status-badge[b-1tiuhxupzv],
    .fe-card-amount[b-1tiuhxupzv],
    .fe-card-date[b-1tiuhxupzv] {
        grid-column: 2 / -1;
    }

    .fe-card-amount[b-1tiuhxupzv] {
        grid-row: auto;
    }

    .fe-card-date[b-1tiuhxupzv] {
        justify-self: start;
        text-align: left;
    }

    .fe-empty-state[b-1tiuhxupzv] {
        padding: 28px 18px;
    }

    .fe-empty-visual[b-1tiuhxupzv] {
        width: 120px;
        height: 120px;
    }
}

@media (max-width: 520px) {
    .fe-main-pane[b-1tiuhxupzv] {
        gap: 12px;
        padding: 10px;
    }

    .fe-hero-card[b-1tiuhxupzv],
    .fe-export-panel[b-1tiuhxupzv] {
        padding: 14px;
    }

    .fe-hero-header[b-1tiuhxupzv] {
        gap: 14px;
    }

    .fe-log-button[b-1tiuhxupzv],
    .fe-export-button[b-1tiuhxupzv] {
        width: 100%;
    }

    .fe-progress-row[b-1tiuhxupzv] {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .fe-progress-row strong[b-1tiuhxupzv],
    .fe-progress-row > span[b-1tiuhxupzv] {
        grid-column: auto;
    }

    .fe-dashboard-card[b-1tiuhxupzv] {
        min-height: 86px;
        grid-template-columns: 38px minmax(0, 1fr);
        padding: 14px;
    }

    .fe-dashboard-icon[b-1tiuhxupzv],
    .fe-empty-icon[b-1tiuhxupzv] {
        width: 38px;
        height: 38px;
    }

    .fe-export-card[b-1tiuhxupzv] {
        grid-template-columns: 24px minmax(0, 1fr);
        min-height: 0;
    }

    .fe-status-badge[b-1tiuhxupzv] {
        width: max-content;
        max-width: 100%;
        padding-inline: 12px;
    }

    .fe-empty-state h4[b-1tiuhxupzv] {
        font-size: var(--fs-body-1);
    }
}
/* _content/eLipsOnline/Components/Pages/Facturatie/FactuurRegelComponent.razor.rz.scp.css */
.fr-popup[b-a4ccjxo9q1] {
    display: grid;
    grid-template-columns: minmax(280px, 380px) minmax(0, 1fr);
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    background: var(--color-gray-50);
}

.fr-list-panel[b-a4ccjxo9q1],
.fr-detail-panel[b-a4ccjxo9q1] {
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: #fff;
}

.fr-list-panel[b-a4ccjxo9q1] {
    border-right: 1px solid var(--color-gray-200);
}

.fr-list[b-a4ccjxo9q1] {
    box-sizing: border-box;
    flex: 1 1 auto;
    min-height: 0;
    padding-bottom: 28px;
    overflow-y: auto;
}

.fr-detail-panel[b-a4ccjxo9q1] {
    overflow: hidden;
}

.fr-list-header h5[b-a4ccjxo9q1] {
    margin: 0;
}

.fr-list-icon--debet[b-a4ccjxo9q1],
.detail-list-item.is-selected .fr-list-icon--debet[b-a4ccjxo9q1] {
    color: #16824b;
    background: #e8f7ef;
}

.fr-list-icon--credit[b-a4ccjxo9q1],
.detail-list-item.is-selected .fr-list-icon--credit[b-a4ccjxo9q1] {
    color: #c93636;
    background: #fdecec;
}

.detail-list-item-badge.fr-list-badge--debet[b-a4ccjxo9q1],
.detail-list-item.is-selected .detail-list-item-badge.fr-list-badge--debet[b-a4ccjxo9q1] {
    color: #16824b;
    background: #e8f7ef;
}

.detail-list-item-badge.fr-list-badge--credit[b-a4ccjxo9q1],
.detail-list-item.is-selected .detail-list-item-badge.fr-list-badge--credit[b-a4ccjxo9q1] {
    color: #c93636;
    background: #fdecec;
}

.fr-list-item__main[b-a4ccjxo9q1] {
    flex: 1 1 auto;
}

.fr-list-item__meta[b-a4ccjxo9q1] {
    min-width: 78px;
}

.fr-page[b-a4ccjxo9q1] {
    box-sizing: border-box;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-height: 0;
    overflow: auto;
    padding: 16px 25px;
    background-color: var(--color-gray-50);
}

.fr-topline[b-a4ccjxo9q1] {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) auto auto minmax(220px, 264px);
    gap: 24px;
    align-items: center;
}

.fr-reference-text[b-a4ccjxo9q1] {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 6px;
}

.fr-reference-text span[b-a4ccjxo9q1],
.fr-reference-text strong[b-a4ccjxo9q1] {
    color: #111827;
    font-weight: 700;
}

.fr-reference-text strong[b-a4ccjxo9q1] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fr-regel-field[b-a4ccjxo9q1] {
    display: grid;
    grid-template-columns: auto minmax(120px, 1fr);
    align-items: center;
    gap: 14px;
}

.vc-meta-item[b-a4ccjxo9q1] {
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.vc-meta-item:hover[b-a4ccjxo9q1] {
    color: var(--color-primary-700);
}

.vc-meta-item span[b-a4ccjxo9q1] {
    display: inline-block;
}

.vc-meta-item span + span[b-a4ccjxo9q1] {
    margin-left: 5px;
}

.vc-panel[b-a4ccjxo9q1] {
    min-width: 0;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .05), 0 4px 12px rgba(0, 0, 0, .04);
}

.vc-panel-main[b-a4ccjxo9q1] {
    padding: 18px;
}

.vc-amount-panel[b-a4ccjxo9q1] {
    padding: 18px;
}

.vc-form-grid[b-a4ccjxo9q1] {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    align-items: center;
    gap: 15px;
}

.vc-amount-grid[b-a4ccjxo9q1] {
    display: grid;
    grid-template-columns: 74px minmax(110px, 1fr) minmax(130px, 1.15fr) minmax(120px, 1fr) minmax(120px, 1fr) minmax(120px, 1fr) minmax(130px, 1fr) minmax(130px, 1fr);
    align-items: end;
    gap: 20px;
}

.vc-stack[b-a4ccjxo9q1] {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.dialog-actions[b-a4ccjxo9q1] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    width: 100%;
}

[b-a4ccjxo9q1] .factuurregel-form,
[b-a4ccjxo9q1] .factuurregel-form.k-form,
[b-a4ccjxo9q1] .factuurregel-form .k-form-fieldset {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    max-height: none;
}

[b-a4ccjxo9q1] .factuurregel-window .k-window-content {
    display: flex;
    flex: 1 1 auto;
    height: calc(100% - 112px);
    min-height: 0;
    padding: 0;
    overflow: hidden;
    background: var(--color-gray-50);
}

[b-a4ccjxo9q1] .factuurregel-form .k-form-buttons {
    margin: 0;
    padding: 0;
}

[b-a4ccjxo9q1] .fr-page .k-input,
[b-a4ccjxo9q1] .fr-page .k-picker,
[b-a4ccjxo9q1] .fr-page .k-dropdownlist,
[b-a4ccjxo9q1] .fr-page .k-multicolumncombobox {
    min-width: 0;
}

.vc-topline[b-a4ccjxo9q1] {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.vc-meta[b-a4ccjxo9q1] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 24px;
}

.vc-amount-grid[b-a4ccjxo9q1] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    align-items: end;
    gap: 18px 20px;
}

.vc-stack[b-a4ccjxo9q1] {
    display: grid;
    gap: 8px;
    min-width: 0;
}

@media (max-width: 1180px) {
    .fr-topline[b-a4ccjxo9q1] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .vc-form-grid[b-a4ccjxo9q1] {
        grid-template-columns: 150px minmax(0, 1fr);
    }
}

@media (max-width: 920px) {
    .fr-popup[b-a4ccjxo9q1] {
        grid-template-columns: 1fr;
        height: auto;
        max-height: calc(100vh - 150px);
        overflow: auto;
    }

    .fr-list-panel[b-a4ccjxo9q1] {
        max-height: 260px;
        border-right: 0;
        border-bottom: 1px solid var(--color-gray-100);
    }

    .fr-topline[b-a4ccjxo9q1] {
        gap: 14px;
    }

    .vc-amount-grid[b-a4ccjxo9q1] {
        grid-template-columns: repeat(2, minmax(140px, 1fr));
    }
}

@media (max-width: 760px) {
    .fr-page[b-a4ccjxo9q1] {
        padding: 12px;
    }

    .vc-panel[b-a4ccjxo9q1] {
        padding: 16px 14px;
    }

    .fr-topline[b-a4ccjxo9q1],
    .fr-regel-field[b-a4ccjxo9q1],
    .vc-form-grid[b-a4ccjxo9q1],
    .vc-amount-grid[b-a4ccjxo9q1] {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .dialog-actions[b-a4ccjxo9q1] {
        align-items: stretch;
        flex-direction: column-reverse;
        padding: 12px;
    }

    .dialog-actions .btn[b-a4ccjxo9q1] {
        width: 100%;
    }
}
/* _content/eLipsOnline/Components/Pages/Facturatie/FactuurVerzamelPage.razor.rz.scp.css */
.page-body[b-9lnksibype] {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--color-gray-50);
}

.page-body-content[b-9lnksibype] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    display: flex;
    overflow: hidden;
}

.splitter-host[b-9lnksibype] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    height: 100%;
    overflow: hidden;
}

.splitter-host[b-9lnksibype]  .k-splitter,
.splitter-host[b-9lnksibype]  .k-pane {
    min-height: 0;
    overflow: hidden;
}

.splitter-host[b-9lnksibype]  .fv-result-splitter-pane {
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.page-body[b-9lnksibype]  .k-pane {
    background-color: var(--color-gray-50);
}

.fv-filter-panel[b-9lnksibype] {
    box-sizing: border-box;
    height: 100%;
    min-height: 0;
    padding: 18px 24px 28px;
    background: #fff;
    border-right: 1px solid var(--color-gray-100);
    overflow: hidden;
/*    margin-right: 5px;*/
/*    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);*/
}

.fv-filter-title[b-9lnksibype] {
    margin: 0 0 18px;
    color: #111827;
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.3;
}

.fv-filter-content[b-9lnksibype] {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.fv-filter-header[b-9lnksibype] {
    position: sticky;
    top: 0;
    z-index: 1;
    flex: 0 0 auto;
    padding-bottom: 14px;
    background: #fff;
}

.fv-filter-header h4[b-9lnksibype] {
    margin: 5px 0 8px;
}

.fv-filter-fields[b-9lnksibype] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 14px;
    min-height: 0;
    overflow-y: auto;
    padding-right: 4px;
}

.factuur-verzamelen-desc[b-9lnksibype] {
    color: var(--color-gray-500);
    margin: 0;
}

.fv-field-stack[b-9lnksibype] {
    display: grid;
    gap: 8px;
    min-width: 0;
}


.fv-check-field[b-9lnksibype] {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    margin: 4px 0 0;
    cursor: pointer;
}


.fv-filter-divider[b-9lnksibype] {
    height: 1px;
    margin: 16px 0 6px;
    background: #f0f1f3;
}

.fv-filter-panel[b-9lnksibype]  .fv-submit-button {
    width: 100%;
    min-height: 40px;
    font-weight: 600;
    background-color: var(--color-primary-700);
    color: white;
    font-size: var(--fs-body-2);
}

.fv-filter-panel[b-9lnksibype]  .fv-submit-button:hover {
    background-color: var(--color-primary-500);
}


.fv-filter-panel[b-9lnksibype]  .fv-clearfilters-btn {
    width: 100%;
    min-height: 40px;
    font-weight: 500;
    background-color: white;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    border: none;
}

    .fv-filter-panel[b-9lnksibype]  .fv-clearfilters-btn svg {
        fill: var(--color-secondary-700);
    }


    .fv-filter-panel[b-9lnksibype]  .fv-clearfilters-btn:hover {
        box-shadow: none;
        color: var(--color-primary-700);
    }

        .fv-filter-panel[b-9lnksibype]  .fv-clearfilters-btn:hover svg {
            fill: var(--color-primary-700);
        }

.fv-filter-panel[b-9lnksibype]  .fv-filter-form,
.fv-filter-panel[b-9lnksibype]  .fv-filter-form.k-form,
.fv-filter-panel[b-9lnksibype]  .fv-filter-form .k-form-fieldset {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    gap: 0;
    border: 0;
}

.fv-filter-panel[b-9lnksibype]  .fv-filter-form .k-form-legend {
    display: none;
}

.fv-buttons-stack[b-9lnksibype] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}

.fv-filter-panel[b-9lnksibype]  .fv-filter-form .k-form-buttons {
    position: sticky;
    bottom: 0;
    z-index: 1;
    margin: 0;
    flex: 0 0 auto;
    padding: 12px 0 0;
    background: #fff;
}

.fv-filter-panel[b-9lnksibype]  .k-input,
.fv-filter-panel[b-9lnksibype]  .k-picker,
.fv-filter-panel[b-9lnksibype]  .k-dropdownlist,
.fv-filter-panel[b-9lnksibype]  .k-textarea {
    width: 100%;
    min-width: 0;
    border-color: #dfe3e8;
    border-radius: 4px;
}

.fv-debiteur-panel[b-9lnksibype] {
    box-sizing: border-box;
    height: calc(100% - 32px);
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 20px;
    overflow: hidden;
    background-color: white;
    margin: 16px 10px;
    border-radius: 10px;
    border: 1px solid var(--color-gray-100);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.fv-debiteur-header[b-9lnksibype] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.fv-debiteur-title-row[b-9lnksibype] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 20px;
}

.fv-selected-count[b-9lnksibype] {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 0 11px;
    color: var(--color-primary-700);
    background: #eef5ff;
    border-radius: 5px;
    font-size: var(--fs-caption);
    font-weight: 600;
    white-space: nowrap;
}

.fv-debiteur-toolbar[b-9lnksibype] {
    flex: 1 1 auto;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
    min-width: 260px;
}

.fv-debiteur-search[b-9lnksibype] {
    position: relative;
    flex: 0 1 300px;
    min-width: 190px;
    display: block;
}

.fv-debiteur-search[b-9lnksibype]  .k-svg-icon {
    position: absolute;
    z-index: 1;
    left: 14px;
    top: 50%;
    width: 18px;
    height: 18px;
    color: var(--color-gray-500);
    transform: translateY(-50%);
    pointer-events: none;
}

.fv-debiteur-search[b-9lnksibype]  .k-textbox,
.fv-debiteur-search[b-9lnksibype]  .k-input {
    width: 100%;
    height: 33px;
}

.fv-debiteur-search[b-9lnksibype]  input {
    padding-left: 42px;
    color: #111827;
    font-size: var(--fs-body-3);
}

.fv-debiteur-search[b-9lnksibype]  input::placeholder {
    color: var(--color-gray-500);
}

.fv-debiteur-filter-button[b-9lnksibype] {
    position: relative;
    white-space: nowrap;
}

.inkoop-filter-actions[b-9lnksibype] {
    justify-content: flex-start;
    flex: 1 1 auto;
    flex-wrap: wrap;
}

.inkoop-filter-button[b-9lnksibype] {
    position: relative;
}

.filter-badge[b-9lnksibype],
.count-badge[b-9lnksibype] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 6px;
    border-radius: 50px;
    background-color: var(--color-gray-100);
    color: var(--color-gray-600);
    font-size: 12px;
    font-weight: 600;
}

.inkoop-filter-popup[b-9lnksibype] {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    display: grid;
    gap: 28px;
    padding: 16px;
    background: #fff;
    border-radius: 7px;
}

.inkoop-filter-section[b-9lnksibype] {
    display: grid;
    gap: 14px;
    min-width: 0;
}

.inkoop-filter-section--status[b-9lnksibype] {
    gap: 16px;
}

.inkoop-popup-field[b-9lnksibype] {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.inkoop-popup-field label[b-9lnksibype] {
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
    font-weight: 500;
}
.fv-debiteur-list[b-9lnksibype] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
    overflow-y: auto;
    padding: 0 4px 16px 0;
}

.fv-debiteur-card[b-9lnksibype] {
    display: grid;
    grid-template-columns: 28px 48px minmax(0, 1fr);
    gap: 18px;
    align-items: center;
    width: 100%;
    min-height: 85px;
    padding: 10px 20px 10px 15px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
/*    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);*/
}

.fv-debiteur-card--selected[b-9lnksibype] {
    border-color: var(--color-primary-700);
    background-color: color-mix(in srgb, var(--kendo-color-primary, #0d6efd) 6%, #fff);
}

.fv-debiteur-check[b-9lnksibype] {
    display: flex;
    justify-content: center;
}

.fv-debiteur-icon[b-9lnksibype] {
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #0284c7;
    background: #eaf4ff;
    border-radius: 6px;
}

.fv-debiteur-icon[b-9lnksibype]  .k-svg-icon {
    width: 20px;
    height: 20px;
}

.fv-debiteur-content[b-9lnksibype] {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) max-content;
    align-items: center;
    gap: 18px;
    color: #111827;
    cursor: pointer;
}

.fv-debiteur-identity[b-9lnksibype] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.fv-debiteur-code[b-9lnksibype] {
    margin: 0;
    color: var(--color-secondary-700);
    font-size: var(--fs-h5);
    font-weight: 550;
    line-height: 1.1;
    overflow-wrap: anywhere;
}

.fv-debiteur-name[b-9lnksibype] {
    color: var(--color-gray-500);
    font-size: var(--fs-body-2);
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.fv-debiteur-number[b-9lnksibype] {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 6px 14px;
    color: #111827;
    font-size: var(--fs-body-3);
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.fv-debiteur-number strong[b-9lnksibype] {
    font-weight: 600;
}

.fv-debiteur-side[b-9lnksibype] {
    min-width: 118px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
}

.fv-debiteur-location[b-9lnksibype] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 15px;
    min-width: 0;
}

.fv-debiteur-place[b-9lnksibype] {
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.fv-debiteur-country[b-9lnksibype] {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 10px;
    color: var(--color-gray-500);
    background: var(--color-gray-100);
    border-radius: 999px;
    font-size: var(--fs-caption);
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
}

.fv-debiteur-method[b-9lnksibype] {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 11px;
    color: #0284c7;
    background: #eaf4ff;
    border-radius: 999px;
    font-size: var(--fs-caption);
    font-weight: 600;
    white-space: nowrap;
}

.fv-debiteur-empty[b-9lnksibype] {
    flex: 1 1 auto;
    display: grid;
    place-items: center;
    min-height: 180px;
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
    border: 1px dashed #dfe3e8;
    border-radius: 6px;
}

.fv-debiteur-footer[b-9lnksibype] {
    flex: 0 0 auto;
    padding: 12px 4px 0;
    color: var(--color-gray-400);
    font-size: var(--fs-body-3);
    font-weight: 500;
    text-align: right;
}

.fv-debiteur-panel[b-9lnksibype]  .k-checkbox:checked,
.fv-debiteur-panel[b-9lnksibype]  .k-checkbox.k-checked {
    border-color: var(--color-primary-700);
    background-color: var(--color-primary-700);
}

.fv-result-panel[b-9lnksibype] {
    box-sizing: border-box;
    height: calc(100% - 32px);
    max-height: calc(100% - 32px);
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 20px 22px;
    background: #fff;
    border: 1px solid var(--color-gray-100);
    border-radius: 10px;
    overflow: hidden;
    margin: 16px 10px 16px 5px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.fv-result-panel h4[b-9lnksibype] {
    flex: 0 0 auto;
    margin: 0 0 22px;
}

.fv-result-summary[b-9lnksibype] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    min-width: 0;
}

.fv-result-kpi[b-9lnksibype] {
    min-width: 0;
    min-height: 80px;
    display: grid;
    place-items: center;
    gap: 5px;
    padding: 15px 14px;
    background: var(--color-gray-50);
    border-radius: 6px;
    border: 1px solid var(--color-gray-100);
}

.fv-result-kpi-label[b-9lnksibype] {
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
    font-weight: 500;
}

.fv-result-kpi strong[b-9lnksibype] {
    color: var(--color-secondary-700);
    font-size: 1.55rem;
    font-weight: 600;
    line-height: 1;
}

.fv-result-kpi-status[b-9lnksibype] {
    font-size: var(--fs-body-3);
    font-weight: 600;
    line-height: 1.1;
}

.fv-result-kpi-status--success[b-9lnksibype] {
    color: var(--color-success-700);
}

.fv-result-kpi-status--error[b-9lnksibype] {
    color: var(--color-danger-700);
}

.fv-result-divider[b-9lnksibype] {
    flex: 0 0 auto;
    height: 1px;
    margin: 22px 0 16px;
    background: var(--color-gray-100);
}

.fv-result-list[b-9lnksibype] {
    flex: 1 1 auto;
    min-height: 0;
    max-height: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    padding: 0 4px 6px 0;
}

.fv-result-card[b-9lnksibype] {
    position: relative;
    flex: 0 0 auto;
    overflow: hidden;
    background: #fff;
    border: 1px solid #edf0f3;
    border-radius: 6px;
}

.fv-result-card[b-9lnksibype]::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: var(--color-success-500);
}

.fv-card-status--error[b-9lnksibype]::before {
    background: var(--color-danger-500);
}

.fv-result-card-main[b-9lnksibype] {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    align-items: center;
    gap: 14px;
    padding: 16px 16px 12px 20px;
    overflow-x: hidden;
}

.fv-result-status-tile[b-9lnksibype] {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 6px;
    background: var(--color-success-50);
}

.fv-result-status-tile--error[b-9lnksibype] {
    background: var(--color-danger-50);
}

.fv-result-status-icon[b-9lnksibype] {
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border-radius: 999px;
    line-height: 1;
}

.fv-result-status-icon[b-9lnksibype]  .k-svg-icon {
    width: 20px;
    height: 20px;
}

.fv-result-status-icon--success[b-9lnksibype]  {
    color: var(--color-success-500);
}

.fv-result-status-icon--error[b-9lnksibype]  {
    color: var(--color-danger-700);
}

.fv-result-content[b-9lnksibype] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) max-content;
    align-items: start;
    gap: 14px;
    min-width: 0;
}

.fv-result-error-message[b-9lnksibype] {
    grid-column: 2;
    min-width: 0;
    display: block;
    color: var(--color-gray-700);
    font-size: var(--fs-body-3);
    line-height: 1.45;
    overflow-wrap: anywhere;
    white-space: normal;
}

.fv-result-title-stack[b-9lnksibype] {
    display: grid;
    align-content: start;
    gap: 8px;
    min-width: 0;
}

.fv-result-title-stack h6[b-9lnksibype] {
    margin: 0;
    color: #111827;
    font-size: var(--fs-body-1);
    font-weight: 500;
    line-height: 1.15;
    overflow-wrap: anywhere;
}

.fv-result-status-text[b-9lnksibype] {
    justify-self: start;
    min-height: 20px;
    display: inline-flex;
    align-items: center;
    padding: 0 9px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

.fv-result-status-text--success[b-9lnksibype] {
    color: var(--color-success-700);
    background: var(--color-success-50);
}

.fv-result-status-text--error[b-9lnksibype] {
    color: var(--color-danger-700);
    background: var(--color-danger-50);
}

.fv-result-invoice-stack[b-9lnksibype] {
    display: grid;
    gap: 8px;
    justify-items: end;
    min-width: 0;
    text-align: right;
}

.fv-result-invoice-number[b-9lnksibype] {
    color: var(--color-gray-800);
    font-size: var(--fs-body-3);
    font-weight: 500;
    white-space: nowrap;
}

.fv-result-method[b-9lnksibype] {
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
    font-weight: 400;
}

.fv-result-footer[b-9lnksibype] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    padding: 8px 15px 9px 22px;
    background: var(--color-gray-50);
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
    font-weight: 400;
    text-align: right;
}

.fv-result-footer[b-9lnksibype]  .k-svg-icon {
    width: 14px;
    height: 14px;
    color: var(--color-gray-500);
}

@media (max-width: 1500px) {
    .fv-filter-panel[b-9lnksibype] {
        padding: 18px 18px 24px;
    }

    .fv-filter-fields[b-9lnksibype] {
        gap: 12px;
    }

    .factuur-verzamelen-desc[b-9lnksibype] {
        margin-bottom: 0;
    }

    .fv-filter-divider[b-9lnksibype] {
        margin: 12px 0 4px;
    }

    .fv-debiteur-panel[b-9lnksibype],
    .fv-result-panel[b-9lnksibype] {
        margin-top: 14px;
        margin-bottom: 14px;
        height: calc(100% - 28px);
    }

    .fv-debiteur-panel[b-9lnksibype] {
        padding: 18px;
    }

    .fv-result-panel[b-9lnksibype] {
        padding: 18px 16px;
    }

    .fv-result-summary[b-9lnksibype] {
        gap: 10px;
    }

    .fv-result-kpi[b-9lnksibype] {
        min-height: 80px;
        padding: 12px 10px;
    }

    .fv-result-divider[b-9lnksibype] {
        margin: 18px 0 14px;
    }

    .fv-result-card-main[b-9lnksibype] {
        grid-template-columns: 48px minmax(0, 1fr);
        gap: 12px;
        padding: 14px 14px 10px 18px;
    }

    .fv-result-content[b-9lnksibype] {
        grid-template-columns: minmax(0, 1fr);
        gap: 8px;
    }

    .fv-result-invoice-stack[b-9lnksibype] {
        justify-items: start;
        gap: 4px;
        text-align: left;
    }

    .fv-result-status-text[b-9lnksibype] {
        max-width: 100%;
    }

    .fv-result-footer[b-9lnksibype] {
        justify-content: flex-start;
        padding: 8px 14px 9px 18px;
    }
}
@media (max-width: 1200px) {
    .fv-filter-panel[b-9lnksibype] {
        padding: 16px 18px 24px;
    }

    .fv-debiteur-panel[b-9lnksibype] {
        padding: 16px;
    }

    .fv-debiteur-header[b-9lnksibype] {
        align-items: flex-start;
        flex-direction: column;
    }

    .fv-debiteur-toolbar[b-9lnksibype] {
        width: 100%;
        min-width: 0;
        justify-content: stretch;
    }

    .fv-debiteur-search[b-9lnksibype] {
        flex: 1 1 auto;
    }

    .fv-debiteur-card[b-9lnksibype] {
        grid-template-columns: 28px 44px minmax(0, 1fr);
        gap: 14px;
        padding: 10px 20px 10px 15px;
    }

    .fv-debiteur-icon[b-9lnksibype] {
        width: 44px;
        height: 44px;
    }

    .fv-result-panel[b-9lnksibype] {
        padding: 18px 16px;
    }

    .fv-result-summary[b-9lnksibype] {
        gap: 12px;
    }

    .fv-result-kpi[b-9lnksibype] {
        min-height: 112px;
    }

    .fv-result-card-main[b-9lnksibype] {
        grid-template-columns: 48px minmax(0, 1fr);
        gap: 12px;
        padding: 14px 14px 10px 18px;
    }

    .fv-result-content[b-9lnksibype] {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

    .fv-result-invoice-stack[b-9lnksibype] {
        justify-items: start;
        gap: 4px;
        text-align: left;
    }
}

@media (max-width: 900px) {
    .page-body[b-9lnksibype],
    .page-body-content[b-9lnksibype] {
        height: auto !important;
        overflow: visible;
    }

    .splitter-host[b-9lnksibype] {
        height: auto !important;
        min-height: 100%;
        overflow: visible;
    }

    .splitter-host[b-9lnksibype]  .k-splitter {
        display: flex;
        flex-direction: column;
        height: auto !important;
        min-height: 100%;
        overflow: visible;
    }

    .splitter-host[b-9lnksibype]  .k-pane {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: none !important;
        height: auto !important;
        min-width: 0 !important;
        overflow: visible;
    }

    .splitter-host[b-9lnksibype]  .k-splitbar {
        display: none;
    }

    .fv-filter-panel[b-9lnksibype],
    .fv-debiteur-panel[b-9lnksibype],
    .fv-result-panel[b-9lnksibype] {
        height: auto;
        border-right: 0;
        border-left: 0;
    }

    .fv-filter-panel[b-9lnksibype] {
        border-bottom: 1px solid #e5e7eb;
        overflow: visible;
    }

    .fv-filter-panel[b-9lnksibype]  .fv-filter-form,
    .fv-filter-panel[b-9lnksibype]  .fv-filter-form.k-form,
    .fv-filter-panel[b-9lnksibype]  .fv-filter-form .k-form-fieldset {
        height: auto;
    }

    .fv-filter-panel[b-9lnksibype]  .fv-filter-form .k-form-buttons {
        margin-top: 4px;
    }

    .fv-filter-content[b-9lnksibype] {
        height: auto;
        overflow: visible;
    }

    .fv-filter-header[b-9lnksibype],
    .fv-filter-panel[b-9lnksibype]  .fv-filter-form .k-form-buttons {
        position: static;
    }

    .fv-filter-fields[b-9lnksibype] {
        overflow: visible;
    }

    .fv-debiteur-panel[b-9lnksibype] {
        min-height: 360px;
    }

    .fv-result-panel[b-9lnksibype] {
        min-height: 320px;
        border-top: 1px solid #e5e7eb;
    }

    .fv-debiteur-list[b-9lnksibype],
    .fv-result-list[b-9lnksibype] {
        height: auto;
        max-height: 520px;
        overflow-y: auto;
    }
}

@media (max-width: 640px) {
    .fv-filter-panel[b-9lnksibype],
    .fv-debiteur-panel[b-9lnksibype],
    .fv-result-panel[b-9lnksibype] {
        padding: 16px 12px;
    }

    .fv-debiteur-title-row[b-9lnksibype],
    .fv-debiteur-toolbar[b-9lnksibype] {
        align-items: stretch;
        flex-direction: column;
        gap: 10px;
    }

    .fv-selected-count[b-9lnksibype] {
        align-self: flex-start;
    }

    .fv-debiteur-search[b-9lnksibype],
    .fv-debiteur-filter-button[b-9lnksibype] {
        width: 100%;
    }

    .fv-debiteur-filter-button[b-9lnksibype] {
        justify-content: center;
    }

    .fv-debiteur-list[b-9lnksibype],
    .fv-result-list[b-9lnksibype] {
        max-height: 460px;
        padding-right: 4px;
    }

    .fv-debiteur-card[b-9lnksibype] {
        grid-template-columns: 24px 40px minmax(0, 1fr);
        gap: 10px;
        align-items: start;
        min-height: auto;
        height: auto;
        padding: 14px 12px;
        overflow: visible;
    }

    .fv-debiteur-icon[b-9lnksibype] {
        width: 40px;
        height: 40px;
    }

    .fv-debiteur-icon[b-9lnksibype]  .k-svg-icon {
        width: 22px;
        height: 22px;
    }

    .fv-debiteur-content[b-9lnksibype] {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
    }

    .fv-debiteur-side[b-9lnksibype] {
        min-width: 0;
        align-items: flex-start;
        gap: 8px;
    }

    .fv-debiteur-location[b-9lnksibype] {
        justify-content: flex-start;
        flex-wrap: wrap;
        gap: 8px;
    }

    .fv-debiteur-content[b-9lnksibype] {
        display: flex;
        flex-direction: column;
        gap: 10px;
        min-width: 0;
    }

    .fv-debiteur-identity[b-9lnksibype] {
        gap: 6px;
    }

    .fv-debiteur-number[b-9lnksibype] {
        display: grid;
        gap: 4px;
    }

    .fv-debiteur-method[b-9lnksibype] {
        max-width: 100%;
        min-height: 24px;
        white-space: normal;
    }

    .fv-result-summary[b-9lnksibype] {
        grid-template-columns: minmax(0, 1fr);
    }

    .fv-result-kpi[b-9lnksibype] {
        min-height: 96px;
        padding: 16px 12px;
    }

    .fv-result-card-main[b-9lnksibype] {
        grid-template-columns: 42px minmax(0, 1fr);
        gap: 10px;
        padding: 14px 12px 10px 16px;
    }

    .fv-result-status-tile[b-9lnksibype] {
        width: 40px;
        height: 40px;
    }

    .fv-result-content[b-9lnksibype] {
        grid-template-columns: minmax(0, 1fr);
        gap: 8px;
    }

    .fv-result-title-stack[b-9lnksibype] {
        gap: 4px;
    }

    .fv-result-title-stack h6[b-9lnksibype] {
        margin: 0;
        line-height: 1.25;
    }

    .fv-result-invoice-stack[b-9lnksibype] {
        justify-items: start;
        gap: 4px;
        text-align: left;
    }

    .fv-result-status-icon[b-9lnksibype] {
        width: 24px;
        height: 24px;
    }

    .fv-result-invoice-number[b-9lnksibype] {
        white-space: normal;
    }

    .fv-result-footer[b-9lnksibype] {
        justify-content: flex-start;
        padding: 8px 14px;
    }
}
@media (max-width: 380px) {
    .fv-debiteur-card[b-9lnksibype] {
        grid-template-columns: 22px minmax(0, 1fr);
    }

    .fv-debiteur-icon[b-9lnksibype] {
        display: none;
    }

    .fv-debiteur-content[b-9lnksibype] {
        grid-column: 2;
    }

    .fv-result-card-main[b-9lnksibype] {
        grid-template-columns: minmax(0, 1fr);
    }

    .fv-result-error-message[b-9lnksibype] {
        grid-column: 1;
    }

    .fv-result-status-tile[b-9lnksibype] {
        display: none;
    }
}
/* _content/eLipsOnline/Components/Pages/Facturatie/InkoopFacturenPage.razor.rz.scp.css */
.facturen-page[b-ys7bwukwlg] {
    height: 100%;
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.page-body[b-ys7bwukwlg] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
    min-width: 0;
    overflow: hidden;
}

.page-body-content[b-ys7bwukwlg] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    display: flex;
    overflow: hidden;
}

.splitter-host[b-ys7bwukwlg] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    height: 100%;
    background: var(--color-gray-50);
}

.main-pane[b-ys7bwukwlg] {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    min-width: 0;
    overflow: hidden;
    padding: 20px 5px 20px 20px;
    background: var(--color-gray-50);
    gap: 8px;
}

.oo-title[b-ys7bwukwlg] { 
    margin-bottom: -6px;
}

.oo-title h3[b-ys7bwukwlg] {
    margin-bottom: 5px;
}

.oo-grid-card[b-ys7bwukwlg] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: white;
    padding: 12px 16px 16px 16px;
    box-shadow: rgba(0, 0, 0, 0.05) 0px 1px 2px, rgba(0, 0, 0, 0.04) 0px 4px 12px;
    border-radius: 6px;
    border: 1px solid var(--color-gray-200);
}

.oo-nav[b-ys7bwukwlg] {
    flex: 0 0 auto;
    width: 100%;
    background-color: transparent;
    overflow: hidden;
}

.oo-nav-toolbar[b-ys7bwukwlg] {
    padding: 5px 0 10px 0;
    gap: 12px;
}

.oo-nav-group[b-ys7bwukwlg] {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 4px;
}

.oo-nav-label[b-ys7bwukwlg] {
    color: #8f8f8f;
    font-size: var(--fs-caption);
    line-height: 1;
    padding-left: 0;
    white-space: nowrap;
}

.oo-nav-group-body[b-ys7bwukwlg] {
    gap: 6px!important;
    min-height: 32px;
}

.fo-nav-actions .btn[b-ys7bwukwlg] {
    height: 32px;
    min-width: 32px;
    padding: 6px 7px;
}

.fo-checkbox-filter[b-ys7bwukwlg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #374151;
    font-size: var(--fs-body-3);
    line-height: 1;
    white-space: nowrap;
    margin: 0;
}

.fo-new-btn[b-ys7bwukwlg] {
    min-width: 72px;
    padding-inline: 14px;
}

.grid-host[b-ys7bwukwlg] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

[b-ys7bwukwlg] .splitter-host > .k-splitter {
    min-height: 0;
}

[b-ys7bwukwlg] .splitter-host .k-pane {
    min-height: 0;
    overflow: hidden;
}

[b-ys7bwukwlg] .main-pane .k-grid {
    flex: 1 1 auto;
    min-height: 0;
    border-radius: 7px;
}

[b-ys7bwukwlg] .main-pane .k-grid-footer {
    background: #fafafa;
}

.fo-grid-footer-total[b-ys7bwukwlg] {
    display: block;
    width: 100%;
    color: #111827;
    font-weight: 700;
    text-align: right;
}

.fo-dashboard[b-ys7bwukwlg] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: minmax(150px, 0.95fr) minmax(210px, 1.25fr) minmax(150px, 0.9fr) minmax(150px, 0.9fr);
    gap: 14px;
    width: 100%;
    margin: 8px 0 14px;
}

.fo-dashboard-card[b-ys7bwukwlg] {
    min-width: 0;
    min-height: 84px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    background: white;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.fo-dashboard-icon[b-ys7bwukwlg] {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
}

[b-ys7bwukwlg] .fo-dashboard-icon .k-svg-icon {
    width: 18px;
    height: 18px;
}

.fo-dashboard-icon--blue[b-ys7bwukwlg] {
    color: white;
    background: var(--blue);
}

.fo-dashboard-icon--green[b-ys7bwukwlg] {
    color: white;
    background: var(--blue);
}

.fo-dashboard-icon--red[b-ys7bwukwlg] {
    color: white;
    background: var(--red);
}

.fo-dashboard-icon--amber[b-ys7bwukwlg] {
    color: white;
    background: var(--purple);
}

.fo-dashboard-icon--cyan[b-ys7bwukwlg] {
    color: white;
    background: var(--cyan);
}

.fo-dashboard-copy[b-ys7bwukwlg] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.fo-dashboard-label[b-ys7bwukwlg] {
    color: #6b7280;
    font-size: var(--fs-caption);
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-bottom: 2px;
}

.fo-dashboard-copy strong[b-ys7bwukwlg] {
    color: #111827;
    font-size: var(--fs-h4);
    font-weight: 600;
    line-height: 1.05;
    overflow-wrap: anywhere;
}

.fo-dashboard-card--wide .fo-dashboard-copy strong[b-ys7bwukwlg] {
    font-size: var(--fs-h4);
}

.fo-dashboard-meta[b-ys7bwukwlg] {
    color: #6b7280;
    font-size: var(--fs-caption);
    line-height: 1.2;
    overflow-wrap: anywhere;
}

@media (max-width: 1100px) {
    .facturen-page[b-ys7bwukwlg],
    .page-body[b-ys7bwukwlg],
    .page-body-content[b-ys7bwukwlg] {
        height: auto;
        overflow: visible;
    }

    .facturen-page[b-ys7bwukwlg] {
        height: 100%;
        min-height: 0;
        overflow-y: auto;
    }

    .splitter-host[b-ys7bwukwlg] {
        height: auto;
        min-height: 100%;
        overflow: visible;
    }

    [b-ys7bwukwlg] .splitter-host > .k-splitter {
        display: flex;
        flex-direction: column;
        height: auto !important;
        min-height: 100%;
        overflow: visible;
    }

    [b-ys7bwukwlg] .splitter-host > .k-splitter > .k-pane {
        flex: 0 0 auto !important;
        flex-basis: auto !important;
        width: 100% !important;
        max-width: none !important;
        height: auto !important;
        min-width: 0 !important;
        overflow: visible;
    }

    [b-ys7bwukwlg] .splitter-host > .k-splitter > .k-splitbar {
        display: none !important;
    }

    .main-pane[b-ys7bwukwlg] {
        height: auto;
        min-height: 720px;
        overflow: visible;
        padding-right: 20px;
    }

    .oo-grid-card[b-ys7bwukwlg] {
        min-height: 420px;
    }

    .invoice-preview-shell[b-ys7bwukwlg] {
        height: min(720px, 85vh);
        min-height: 520px;
        padding: 0 20px 20px;
    }

    .fo-dashboard[b-ys7bwukwlg] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .main-pane[b-ys7bwukwlg] {
        min-height: 900px;
        padding: 16px 8px;
    }

    .invoice-preview-shell[b-ys7bwukwlg] {
        height: 680px;
        min-height: 480px;
        padding: 0 8px 8px;
    }

    .fo-dashboard[b-ys7bwukwlg] {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .fo-dashboard-card[b-ys7bwukwlg] {
        min-height: 74px;
    }
}
/* _content/eLipsOnline/Components/Pages/Facturatie/InkoopFactuurDetailPage.razor.rz.scp.css */
.invoice-page[b-y46dyv6a1p] {
    box-sizing: border-box;
    height: calc(100vh - 40px);
    height: calc(100dvh - 40px);
    max-height: calc(100vh - 40px);
    max-height: calc(100dvh - 40px);
    min-height: 0;
    background: var(--color-gray-50);
    color: #111827;
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    overflow: hidden;
}

.invoice-page--loading[b-y46dyv6a1p] {
    place-items: center;
}

.invoice-page[b-y46dyv6a1p]  .invoice-details-form,
.invoice-page[b-y46dyv6a1p]  .invoice-details-form.k-form {
    width: 100%;
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    gap: 0;
    overflow: hidden;
}

.invoice-page[b-y46dyv6a1p]  .invoice-details-form .k-form-fieldset {
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    overflow: hidden;
}

.invoice-page[b-y46dyv6a1p]  .invoice-details-form .k-form-legend,
.invoice-page[b-y46dyv6a1p]  .invoice-details-form .k-form-buttons {
    display: none;
}

.invoice-workspace[b-y46dyv6a1p] {
    box-sizing: border-box;
    min-width: 0;
    min-height: 0;
    height: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(390px, .95fr);
    grid-template-rows: minmax(260px, auto) minmax(0, 1fr);
    gap: 16px 16px;
    padding: 16px;
    overflow: hidden;
    align-items: stretch;
}

.invoice-panel[b-y46dyv6a1p] {
    min-width: 0;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
    padding: 20px;
}

.invoice-card-header[b-y46dyv6a1p] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-width: 0;
}

.invoice-card-header h4[b-y46dyv6a1p],
.invoice-card-header h5[b-y46dyv6a1p] {
    margin: 0;
}

.invoice-input-card[b-y46dyv6a1p] {
    display: grid;
    gap: 10px;
}

.invoice-form-grid[b-y46dyv6a1p] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: 36px;
    row-gap: 14px;
    padding-bottom: 10px;
}

.field-stack[b-y46dyv6a1p] {
    display: grid;
    gap: 12px;
    min-width: 0;
}

.form-row[b-y46dyv6a1p] {
    display: grid;
    grid-template-columns: 110px minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    min-width: 0;
}

.form-row--wide[b-y46dyv6a1p] {
    grid-column: 1 / -1;
}

.split-fields[b-y46dyv6a1p] {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.split-fields--currency[b-y46dyv6a1p] {
    grid-template-columns: minmax(0, 1fr) minmax(96px, .48fr);
}

.invoice-card-actions[b-y46dyv6a1p] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    min-width: 0;
}

.activity-actions[b-y46dyv6a1p] {
    z-index: 5;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 8px 16px 12px;
    background-color: var(--color-gray-50);
}

.inkoop-invoice-title[b-y46dyv6a1p] {
    grid-column: 1 / -1;
    margin-bottom: 5px;
}

.inkoop-top-row[b-y46dyv6a1p] {
    grid-column: 1 / -1;
    grid-row: 1;
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(285px, 400px);
    gap: 16px;
    align-items: stretch;
}

.inkoop-info-card[b-y46dyv6a1p],
.inkoop-attachments-card[b-y46dyv6a1p] {
    min-height: 0;
}

.inkoop-main-form-grid[b-y46dyv6a1p] {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
    column-gap: 28px;
    row-gap: 12px;
    padding-bottom: 0;
}

.inkoop-main-form-grid .form-row[b-y46dyv6a1p] {
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 8px;
}

.inkoop-main-form-grid .form-row--wide[b-y46dyv6a1p] {
    grid-column: 1 / -1;
}

.split-fields--period[b-y46dyv6a1p] {
    grid-template-columns: minmax(0, 1fr) minmax(72px, .65fr);
}

.inkoop-attachments-card[b-y46dyv6a1p] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
}

.inkoop-lines-card[b-y46dyv6a1p] {
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 12px;
    padding: 14px 16px;
    overflow: hidden;
}

.inkoop-grid-shell[b-y46dyv6a1p] {
    min-height: 0;
    min-width: 0;
    overflow: hidden;
}

.inkoop-grid-shell[b-y46dyv6a1p]  .k-grid,
.inkoop-grid-shell[b-y46dyv6a1p]  .factuur-regel-grid,
.inkoop-grid-shell[b-y46dyv6a1p]  [class*="grid"] {
    min-height: 0;
}

.inkoop-filter-actions[b-y46dyv6a1p] {
    justify-content: flex-start;
    flex: 1 1 auto;
    flex-wrap: wrap;
}

.inkoop-filter-button[b-y46dyv6a1p] {
    position: relative;
}

.profile-dd[b-y46dyv6a1p] {
    padding: 16px;
}

.filter-badge[b-y46dyv6a1p] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 6px;
    border-radius: 50px;
    background-color: var(--color-gray-100);
    color: var(--color-gray-600);
    font-size: 12px;
    font-weight: 600;
}

.inkoop-filter-popup[b-y46dyv6a1p] {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    display: grid;
    gap: 28px;
    padding: 16px;
    background: #fff;
    border-radius: 7px;
}

.inkoop-filter-section[b-y46dyv6a1p] {
    display: grid;
    gap: 14px;
    min-width: 0;
}

.inkoop-filter-section--status[b-y46dyv6a1p] {
    gap: 16px;
}

.inkoop-popup-check[b-y46dyv6a1p] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    font-size: var(--fs-body-2);
    font-weight: 500;
    white-space: nowrap;
}

.inkoop-popup-date-grid[b-y46dyv6a1p] {
    display: grid;
    gap: 18px;
    min-width: 0;
}

.inkoop-popup-field[b-y46dyv6a1p] {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.inkoop-popup-field label[b-y46dyv6a1p] {
    margin: 0;
    color: #9ca3af;
    font-size: var(--fs-caption);
    font-weight: 500;
    line-height: 1.25;
}

.inkoop-summary-card[b-y46dyv6a1p] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    padding: 8px 14px;
    background: #f4f4f5;
    border-radius: 5px;
}

.inkoop-summary-card--split[b-y46dyv6a1p] {
    grid-template-columns: minmax(0, 1fr) minmax(0, auto);
}

.inkoop-summary-card div[b-y46dyv6a1p] {
    display: grid;
    grid-template-columns: minmax(0, auto) auto;
    align-items: baseline;
    gap: 4px 8px;
}

.inkoop-summary-card span[b-y46dyv6a1p] {
    grid-column: 1 / -1;
    color: #374151;
    font-size: var(--fs-body-3);
}

.inkoop-summary-card strong[b-y46dyv6a1p] {
    color: #111827;
    font-size: var(--fs-body-1);
    font-weight: 600;
    line-height: 1.1;
}

.inkoop-summary-card em[b-y46dyv6a1p] {
    color: #6b7280;
    font-size: var(--fs-body-3);
    font-style: normal;
    font-weight: 400;
    margin-left: 10px;
}

.inkoop-actions[b-y46dyv6a1p] {
    align-items: center;
}

.inkoop-actions-spacer[b-y46dyv6a1p] {
    flex: 1 1 auto;
}

.text-danger[b-y46dyv6a1p] {
    color: var(--color-danger-700) !important;
}

.invoice-card-action-btn svg[b-y46dyv6a1p] {
    fill: var(--color-primary-blue)!important;
}

@media (max-width: 1100px) {
    .invoice-workspace[b-y46dyv6a1p] {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: auto auto auto minmax(360px, 1fr) minmax(360px, 1fr);
        overflow: auto;
    }

    .inkoop-top-row[b-y46dyv6a1p],
    .inkoop-info-card[b-y46dyv6a1p],
    .inkoop-invoice-title[b-y46dyv6a1p] {
        grid-column: 1;
        grid-row: auto;
    }

    .inkoop-top-row[b-y46dyv6a1p] {
        grid-template-columns: 1fr;
    }

    .inkoop-main-form-grid[b-y46dyv6a1p] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }
}

@media (max-width: 920px) {
    .invoice-page[b-y46dyv6a1p] {
        display: block;
        height: auto;
        max-height: none;
        min-height: calc(100vh - 40px);
        min-height: calc(100dvh - 40px);
        overflow: visible;
    }

    .invoice-page[b-y46dyv6a1p]  .invoice-details-form,
    .invoice-page[b-y46dyv6a1p]  .invoice-details-form.k-form,
    .invoice-page[b-y46dyv6a1p]  .invoice-details-form .k-form-fieldset {
        height: auto;
        max-height: none;
        overflow: visible;
    }

    .invoice-workspace[b-y46dyv6a1p] {
        overflow: visible;
    }

    .activity-actions[b-y46dyv6a1p] {
        position: sticky;
        bottom: 0;
        margin-top: 14px;
        padding: 12px 16px;
        border-top: 1px solid #e5e7eb;
        background: rgba(247, 247, 248, .96);
        backdrop-filter: blur(6px);
    }
}

@media (max-width: 760px) {
    .invoice-workspace[b-y46dyv6a1p] {
        padding: 12px;
    }

    .invoice-panel[b-y46dyv6a1p] {
        padding: 14px;
    }

    .invoice-form-grid[b-y46dyv6a1p],
    .inkoop-main-form-grid[b-y46dyv6a1p],
    .inkoop-summary-card--split[b-y46dyv6a1p] {
        grid-template-columns: 1fr;
    }

    .form-row[b-y46dyv6a1p],
    .form-row--wide[b-y46dyv6a1p] {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .split-fields--currency[b-y46dyv6a1p],
    .split-fields--period[b-y46dyv6a1p] {
        grid-template-columns: 1fr;
    }

    .invoice-card-header[b-y46dyv6a1p] {
        align-items: stretch;
        flex-direction: column;
    }

    .inkoop-filter-actions[b-y46dyv6a1p] {
        justify-content: flex-start;
    }

    .activity-actions[b-y46dyv6a1p] {
        align-items: stretch;
        flex-direction: column-reverse;
        padding: 12px;
    }

    .activity-button[b-y46dyv6a1p],
    .inkoop-match-button[b-y46dyv6a1p] {
        width: 100%;
    }

    .inkoop-actions-spacer[b-y46dyv6a1p] {
        display: none;
    }
}




.vc-meta-item[b-y46dyv6a1p] {
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

    .vc-meta-item:hover[b-y46dyv6a1p] {
        color: var(--color-primary-700);
    }
/* _content/eLipsOnline/Components/Pages/Facturatie/InkoopFactuurExportPage.razor.rz.scp.css */
.factuur-export-page[b-asnf9148ff] {
    height: 100%;
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--color-gray-50);
}

.page-body[b-asnf9148ff] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    display: flex;
    overflow: hidden;
    background: var(--color-gray-50);
}

.page-body-content[b-asnf9148ff] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    display: flex;
    overflow: hidden;
}

.fe-main-pane[b-asnf9148ff] {
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 20px;
    overflow: hidden;
}

.fe-hero-card[b-asnf9148ff],
.fe-dashboard-card[b-asnf9148ff],
.fe-export-panel[b-asnf9148ff] {
    background: #fff;
    border: 1px solid var(--color-gray-100);
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.fe-hero-card[b-asnf9148ff] {
    flex: 0 0 auto;
    display: grid;
    gap: 22px;
    padding: 22px 28px 24px;
}

.fe-hero-header[b-asnf9148ff] {
    display: grid;
    gap: 18px;
    min-width: 0;
}

.fe-hero-header h4[b-asnf9148ff],
.fe-panel-header h4[b-asnf9148ff],
.fe-empty-state h4[b-asnf9148ff] {
    margin: 0;
}

.fe-controls[b-asnf9148ff] {
    display: flex;
    align-items: flex-end;
    gap: 16px;
    min-width: 0;
    flex-wrap: wrap;
}

.fe-field[b-asnf9148ff] {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.fe-log-button[b-asnf9148ff],
.fe-export-button[b-asnf9148ff],
.fe-filter-button[b-asnf9148ff],
.fe-new-button[b-asnf9148ff] {
    min-height: 34px;
    white-space: nowrap;
}

.fe-progress-row[b-asnf9148ff] {
    display: grid;
    grid-template-columns: minmax(160px, 1fr) auto auto;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.fe-progress-track[b-asnf9148ff] {
    height: 16px;
    overflow: hidden;
    background: #eef3fd;
    border-radius: 999px;
}

.fe-progress-track span[b-asnf9148ff] {
    display: block;
    width: 0;
    height: 100%;
    background: var(--color-primary-700);
    border-radius: inherit;
    transition: background 180ms ease;
}

.fe-progress-track--complete span[b-asnf9148ff] {
    background: linear-gradient(90deg, #22c55e, #16a34a);
}

.fe-progress-row strong[b-asnf9148ff] {
    color: var(--color-primary-700);
    font-size: var(--fs-body-3);
    font-weight: 700;
}

.fe-progress-value--complete[b-asnf9148ff] {
    color: #16a34a !important;
}

.fe-progress-row > span[b-asnf9148ff] {
    color: var(--color-gray-500);
    font-weight: 450;
    font-size: var(--fs-body-3);
    white-space: nowrap;
}

.fe-dashboard[b-asnf9148ff] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.fe-dashboard-card[b-asnf9148ff] {
    min-width: 0;
    min-height: 112px;
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    align-items: center;
    gap: 18px;
    padding: 20px 26px;
}

.fe-dashboard-icon[b-asnf9148ff],
.fe-empty-icon[b-asnf9148ff] {
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary-700);
    background: #eaf1ff;
    border-radius: 50%;
}

.fe-dashboard-icon--success[b-asnf9148ff] {
    color: var(--color-success-700);
    background: #dcfce7;
}

.fe-dashboard-icon--danger[b-asnf9148ff] {
    color: var(--color-danger-700);
    background: #fee2e2;
}

[b-asnf9148ff] .fe-dashboard-icon .k-svg-icon,
[b-asnf9148ff] .fe-empty-icon .k-svg-icon {
    width: 22px;
    height: 22px;
}

.fe-dashboard-copy[b-asnf9148ff] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fe-dashboard-label[b-asnf9148ff],
.fe-dashboard-meta[b-asnf9148ff],
.fe-card-amount span[b-asnf9148ff],
.fe-card-date span[b-asnf9148ff] {
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
    line-height: 1.2;
    font-weight: 400;
}

.fe-card-main span[b-asnf9148ff] {
    font-size: var(--fs-body-3);
    color: var(--color-gray-600);
}

.fe-dashboard-copy strong[b-asnf9148ff] {
    color: #111827;
    font-size: var(--fs-h4);
    font-weight: 700;
    line-height: 1.1;
    overflow-wrap: anywhere;
}

.fe-status-success[b-asnf9148ff] {
    color: var(--color-success-700) !important;
}

.fe-status-failed[b-asnf9148ff] {
    color: var(--color-danger-700) !important;
}

.fe-export-panel[b-asnf9148ff] {
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 20px 24px;
    overflow: hidden;
}

.fe-panel-header[b-asnf9148ff] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

.fe-panel-toolbar[b-asnf9148ff] {
    flex: 1 1 auto;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
    min-width: 300px;
}

.fe-search[b-asnf9148ff] {
    position: relative;
    flex: 0 1 300px;
    min-width: 210px;
    display: block;
}

.fe-search[b-asnf9148ff]  .k-svg-icon {
    position: absolute;
    z-index: 1;
    left: 14px;
    top: 50%;
    width: 17px;
    height: 17px;
    color: var(--color-gray-500);
    transform: translateY(-50%);
    pointer-events: none;
}

.fe-search[b-asnf9148ff]  .k-textbox,
.fe-search[b-asnf9148ff]  .k-input {
    width: 100%;
    height: 34px;
}

.fe-search[b-asnf9148ff]  input {
    padding-left: 42px;
    color: #111827;
    font-size: var(--fs-body-3);
}

.fe-search[b-asnf9148ff]  input::placeholder {
    color: var(--color-gray-500);
}

.fe-controls[b-asnf9148ff]  .k-combobox {
    max-width: 100%;
}

.fe-filter-button[b-asnf9148ff],
.fe-new-button[b-asnf9148ff] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.fe-export-list[b-asnf9148ff] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--color-gray-200);
    border-radius: 6px;
    overflow-x: hidden;
    overflow-y: auto;
}

.fe-export-card[b-asnf9148ff] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: 35px minmax(210px, 1.5fr) minmax(120px, 0.7fr) minmax(140px, 0.75fr) minmax(170px, 0.75fr);
    align-items: center;
    gap: 20px;
    min-height: 78px;
    padding: 14px 16px;
    background: #fff;
    border-bottom: 1px solid var(--color-gray-200);
}

/*.fe-export-card:last-child {
    border-bottom: 0;
}*/

.fe-card-status-icon[b-asnf9148ff] {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-gray-700);
    background: var(--color-gray-200);
    border-radius: 50%;
}

[b-asnf9148ff] .fe-card-status-icon .k-svg-icon {
    width: 16px;
    height: 16px;
}

.fe-card-main[b-asnf9148ff] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.fe-card-main strong[b-asnf9148ff],
.fe-card-amount strong[b-asnf9148ff],
.fe-card-date strong[b-asnf9148ff] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-2);
    font-weight: 700;
    line-height: 1.2;
}

.fe-status-badge[b-asnf9148ff] {
    justify-self: start;
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 7px 18px;
    color: var(--color-gray-600);
    background: var(--color-gray-100);
    border-radius: 999px;
    font-size: var(--fs-caption);
    font-weight: 700;
    text-transform: uppercase;
    white-space: nowrap;
}

.fe-card-amount[b-asnf9148ff],
.fe-card-date[b-asnf9148ff] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.fe-card-date[b-asnf9148ff] {
    justify-self: end;
    text-align: right;
}

.fe-card-date strong[b-asnf9148ff],
.fe-card-amount strong[b-asnf9148ff],
.fe-card-main strong[b-asnf9148ff] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fe-card-menu[b-asnf9148ff] {
    width: 30px;
    min-width: 30px;
    height: 30px;
    padding: 0;
    border: 0;
    color: #64748b;
    font-weight: 800;
    letter-spacing: 0;
    box-shadow: none;
}

.fe-empty-state[b-asnf9148ff] {
    flex: 1 1 auto;
    width: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 32px;
    text-align: center;
}

.fe-empty-visual[b-asnf9148ff] {
    width: 145px;
    height: 145px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fe-empty-image[b-asnf9148ff] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.fe-empty-state p[b-asnf9148ff] {
    margin: 0;
    color: #64748b;
    font-size: var(--fs-body-3);
}

.fe-panel-footer[b-asnf9148ff] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    min-height: 56px;
    padding: 0 4px;
    color: #64748b;
    font-size: var(--fs-body-3);
}

@media (max-width: 1360px) {
    .fe-main-pane[b-asnf9148ff] {
        gap: 14px;
        padding: 16px;
    }

    .fe-hero-card[b-asnf9148ff] {
        gap: 18px;
        padding: 18px 22px;
    }

    .fe-dashboard[b-asnf9148ff] {
        gap: 14px;
    }

    .fe-dashboard-card[b-asnf9148ff] {
        min-height: 96px;
        grid-template-columns: 42px minmax(0, 1fr);
        gap: 14px;
        padding: 16px 18px;
    }

    .fe-dashboard-icon[b-asnf9148ff],
    .fe-empty-icon[b-asnf9148ff] {
        width: 42px;
        height: 42px;
    }

    .fe-export-panel[b-asnf9148ff] {
        padding: 18px 20px;
    }

    .fe-export-card[b-asnf9148ff] {
        grid-template-columns: 35px minmax(180px, 1.35fr) minmax(120px, 0.65fr) minmax(120px, 0.7fr) minmax(150px, 0.75fr);
        gap: 16px;
        padding-inline: 14px;
    }
}

@media (max-width: 1180px) {
    .fe-dashboard[b-asnf9148ff] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .fe-progress-row[b-asnf9148ff] {
        grid-template-columns: minmax(160px, 1fr) auto;
    }

    .fe-progress-row > span[b-asnf9148ff] {
        grid-column: 1 / -1;
    }

    .fe-panel-header[b-asnf9148ff] {
        align-items: flex-start;
    }

    .fe-panel-toolbar[b-asnf9148ff] {
        min-width: 260px;
    }

    .fe-export-card[b-asnf9148ff] {
        grid-template-columns: 35px minmax(0, 1fr) minmax(130px, auto);
    }

    .fe-status-badge[b-asnf9148ff],
    .fe-card-date[b-asnf9148ff] {
        grid-column: 2 / -1;
    }

    .fe-card-date[b-asnf9148ff] {
        justify-self: start;
        text-align: left;
    }

    .fe-card-amount[b-asnf9148ff] {
        grid-column: 3;
        grid-row: 1;
    }
}

@media (max-width: 900px) {
    .page-body-content[b-asnf9148ff] {
        overflow-y: auto;
    }

    .fe-main-pane[b-asnf9148ff] {
        height: auto;
        min-height: 100%;
        overflow: visible;
    }

    .fe-export-panel[b-asnf9148ff] {
        flex: 0 0 auto;
        min-height: 460px;
    }

    .fe-panel-header[b-asnf9148ff] {
        align-items: stretch;
        flex-direction: column;
    }

    .fe-panel-toolbar[b-asnf9148ff] {
        width: 100%;
        min-width: 0;
        justify-content: flex-start;
    }

    .fe-search[b-asnf9148ff] {
        flex: 1 1 auto;
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 760px) {
    .fe-main-pane[b-asnf9148ff] {
        padding: 14px;
    }

    .fe-dashboard[b-asnf9148ff] {
        grid-template-columns: 1fr;
    }

    .fe-hero-card[b-asnf9148ff],
    .fe-export-panel[b-asnf9148ff] {
        padding: 18px;
    }

    .fe-field[b-asnf9148ff],
    .fe-controls[b-asnf9148ff],
    .fe-panel-toolbar[b-asnf9148ff] {
        align-items: stretch;
        flex-direction: column;
    }

    .fe-field[b-asnf9148ff] {
        gap: 8px;
    }

    .fe-field[b-asnf9148ff]  .k-combobox {
        width: 100% !important;
    }

    .fe-panel-toolbar[b-asnf9148ff],
    .fe-search[b-asnf9148ff] {
        width: 100%;
        min-width: 0;
    }

    .fe-progress-row[b-asnf9148ff] {
        grid-template-columns: 1fr auto;
    }

    .fe-progress-row > span[b-asnf9148ff] {
        grid-column: 1 / -1;
    }

    .fe-export-card[b-asnf9148ff] {
        grid-template-columns: 28px minmax(0, 1fr);
        gap: 12px;
        align-items: start;
        padding: 14px;
    }

    .fe-status-badge[b-asnf9148ff],
    .fe-card-amount[b-asnf9148ff],
    .fe-card-date[b-asnf9148ff] {
        grid-column: 2 / -1;
    }

    .fe-card-amount[b-asnf9148ff] {
        grid-row: auto;
    }

    .fe-card-date[b-asnf9148ff] {
        justify-self: start;
        text-align: left;
    }

    .fe-empty-state[b-asnf9148ff] {
        padding: 28px 18px;
    }

    .fe-empty-visual[b-asnf9148ff] {
        width: 120px;
        height: 120px;
    }
}

@media (max-width: 520px) {
    .fe-main-pane[b-asnf9148ff] {
        gap: 12px;
        padding: 10px;
    }

    .fe-hero-card[b-asnf9148ff],
    .fe-export-panel[b-asnf9148ff] {
        padding: 14px;
    }

    .fe-hero-header[b-asnf9148ff] {
        gap: 14px;
    }

    .fe-log-button[b-asnf9148ff],
    .fe-export-button[b-asnf9148ff] {
        width: 100%;
    }

    .fe-progress-row[b-asnf9148ff] {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .fe-progress-row strong[b-asnf9148ff],
    .fe-progress-row > span[b-asnf9148ff] {
        grid-column: auto;
    }

    .fe-dashboard-card[b-asnf9148ff] {
        min-height: 86px;
        grid-template-columns: 38px minmax(0, 1fr);
        padding: 14px;
    }

    .fe-dashboard-icon[b-asnf9148ff],
    .fe-empty-icon[b-asnf9148ff] {
        width: 38px;
        height: 38px;
    }

    .fe-export-card[b-asnf9148ff] {
        grid-template-columns: 24px minmax(0, 1fr);
        min-height: 0;
    }

    .fe-status-badge[b-asnf9148ff] {
        width: max-content;
        max-width: 100%;
        padding-inline: 12px;
    }

    .fe-empty-state h4[b-asnf9148ff] {
        font-size: var(--fs-body-1);
    }
}
/* _content/eLipsOnline/Components/Pages/Facturatie/OfferteDetail.razor.rz.scp.css */
.rv-title[b-efeedy8huu] {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
    padding: 5px 0;
}

.rv-title-icon[b-efeedy8huu] {
    width: 45px;
    height: 45px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 5px;
    background: var(--color-primary-50);
    color: var(--color-primary-700);
}

.rv-title-icon[b-efeedy8huu]  .k-svg-icon {
    width: 25px !important;
    height: 25px !important;
}

.rv-title-main[b-efeedy8huu] {
    color: var(--color-secondary-700);
    font-size: var(--fs-h4);
    margin-bottom: 5px;
}

.rv-title-sub[b-efeedy8huu] {
    color: var(--color-gray-500);
    font-size: var(--fs-body-2);
    font-weight: 400;
    line-height: 1.25;
}

.offerte-popup-body[b-efeedy8huu] {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 1rem;
    align-items: center;
    padding: .25rem;
}

.offerte-form-row[b-efeedy8huu] {
    display: contents;
}

.offerte-popup-body[b-efeedy8huu]  .k-input,
.offerte-popup-body[b-efeedy8huu]  .k-picker,
.offerte-popup-body[b-efeedy8huu]  .k-dropdownlist,
.offerte-popup-body[b-efeedy8huu]  .k-numerictextbox {
    width: 100%;
    min-width: 0;
}

.offerte-checkbox[b-efeedy8huu] {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.offerte-checkbox label[b-efeedy8huu] {
    margin: 0;
}

.offerte-option-item[b-efeedy8huu] {
    display: flex;
    align-items: center;
    gap: 8px;
}

@media (max-width: 600px) {
    .offerte-popup-body[b-efeedy8huu] {
        grid-template-columns: 1fr;
        gap: .5rem;
    }

    .offerte-popup-body .txt-label:not(:first-child)[b-efeedy8huu] {
        margin-top: .5rem;
    }
}
/* _content/eLipsOnline/Components/Pages/Facturatie/OffertePage.razor.rz.scp.css */
[b-iw28j030dm] .main-pane {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    min-width: 0;
    padding: 0;
    overflow: hidden;
    background-color: var(--color-gray-50);
}

[b-iw28j030dm] .oo-card {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background-color: white;
    padding: 0;
    border-radius: 5px;
    border: 1px solid var(--color-gray-200);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

[b-iw28j030dm] .subgrid-panel {
    height: 100%;
    min-height: 0;
    min-width: 0;
    padding: 0;
    box-sizing: border-box;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

[b-iw28j030dm] .subgrid-panel>* {
    flex: 1 1 auto;
    min-height: 0;
}

[b-iw28j030dm] .nested-splitter-host .k-splitter,
[b-iw28j030dm] .nested-splitter-host .k-pane {
    background-color: var(--color-gray-50);
}

[b-iw28j030dm] .kaart-locatie-card {
    background-color: white;
    border: 1px solid var(--color-gray-200);
    border-radius: 6px;
    padding: 12px;
    transition: all 0.2s ease;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    user-select: none;
    -webkit-user-select: none;
}

[b-iw28j030dm] .kaart-locatie-card:hover {
    border-color: var(--color-primary);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
}

[b-iw28j030dm] .sortable-drag {
    transition: none !important;
    opacity: 1 !important;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15) !important;
    transform: scale(1.02);
    z-index: 1000;
    border-color: var(--color-primary);
    cursor: grabbing !important;
}

[b-iw28j030dm] .sortable-ghost {
    opacity: 0.3 !important;
    background-color: rgba(0, 149, 218, 0.05) !important;
    border: 2px dashed var(--color-primary) !important;
    box-shadow: none !important;
}

.offerte-regel-window-mode[b-iw28j030dm] {
    height: 100% !important;
    min-height: 0;
}

.offerte-regel-window-mode #floating-regels-panel[b-iw28j030dm],
.offerte-regel-window-mode > div[style*="position: fixed"][b-iw28j030dm] {
    display: none !important;
}

.offerte-regel-window-mode .oo-nav-toolbar[b-iw28j030dm] {
    flex: 0 0 auto;
    padding: 10px 14px !important;
    gap: 16px !important;
    box-shadow: none !important;
}

.offerte-regel-saas-layout[b-iw28j030dm] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(340px, 1.05fr) minmax(300px, .95fr);
    gap: 14px;
    padding: 0 14px 14px;
    overflow: hidden;
    background: var(--color-gray-50);
}

.offerte-regel-route-card[b-iw28j030dm],
.offerte-regel-calculation-card[b-iw28j030dm] {
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    background: white;
    border: 1px solid var(--color-gray-200);
    border-radius: 7px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .08), 0 4px 12px rgba(0, 0, 0, .04);
}

.offerte-regel-route-card[b-iw28j030dm] {
    display: grid;
    grid-template-columns: minmax(420px, 1fr) minmax(440px, 1.15fr);
    overflow: visible;
}

.offerte-regel-route-column[b-iw28j030dm],
.offerte-regel-map-column[b-iw28j030dm] {
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.offerte-regel-route-column[b-iw28j030dm] {
    position: relative;
    z-index: 20;
    padding: 0;
    overflow: visible;
    border-right: 1px solid var(--color-gray-200);
}

.offerte-regel-route-column[b-iw28j030dm]  .kaart-panel {
    height: 100%;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.offerte-regel-route-column[b-iw28j030dm]  .kaart-stop-list {
    min-height: 0;
}

.offerte-regel-map-column[b-iw28j030dm] {
    position: relative;
    z-index: 1;
}

.offerte-regel-map-column[b-iw28j030dm]  .kaart-panel {
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.offerte-regel-map-column[b-iw28j030dm]  .kaart-map,
.offerte-regel-map-column[b-iw28j030dm]  #map {
    height: 100%;
    min-height: 0;
}

.offerte-regel-route-column[b-iw28j030dm]  .search-results-list {
    z-index: 5000;
    max-height: min(520px, 65vh);
    overflow-y: auto;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .18), 0 3px 10px rgba(15, 23, 42, .08);
}

.offerte-regel-map-controls[b-iw28j030dm] {
    position: absolute;
    z-index: 1000;
    top: 14px;
    left: 14px;
}

.offerte-regel-calculation-card[b-iw28j030dm] {
    display: grid;
    grid-template-rows: auto auto minmax(150px, 1fr);
}

.offerte-regel-card-header[b-iw28j030dm] {
    padding: 16px 18px 10px;
}

.offerte-regel-card-subtitle[b-iw28j030dm] {
    display: block;
    margin-top: 3px;
    color: var(--color-gray-500);
    font-size: 12px;
}

.offerte-regel-calculation-form[b-iw28j030dm] {
    display: grid;
    grid-template-columns: minmax(190px, 1.5fr) minmax(130px, .8fr) auto minmax(190px, 1.4fr) 90px minmax(130px, .8fr);
    gap: 10px 12px;
    align-items: end;
    padding: 0 18px 14px;
    border-bottom: 1px solid var(--color-gray-200);
}

.offerte-regel-field[b-iw28j030dm] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.offerte-regel-field--note[b-iw28j030dm] {
    grid-column: span 3;
}

.offerte-regel-check-field[b-iw28j030dm] {
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 36px;
    white-space: nowrap;
}

.offerte-regel-check-field label[b-iw28j030dm] {
    margin: 0;
}

.offerte-regel-calculation-actions[b-iw28j030dm] {
    grid-column: span 2;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.offerte-regel-calculation-grid[b-iw28j030dm] {
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.offerte-regel-calculation-grid[b-iw28j030dm]  .k-grid {
    border: 0;
}

@media (max-width: 1300px) {
    .offerte-regel-calculation-form[b-iw28j030dm] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .offerte-regel-check-field[b-iw28j030dm] {
        align-self: end;
    }
}

@media (max-width: 1050px) {
    .offerte-regel-saas-layout[b-iw28j030dm] {
        display: flex;
        flex-direction: column;
        overflow-y: auto;
    }

    .offerte-regel-route-card[b-iw28j030dm] {
        min-height: 720px;
        grid-template-columns: 1fr;
        grid-template-rows: minmax(360px, 1fr) minmax(340px, 1fr);
    }

    .offerte-regel-route-column[b-iw28j030dm] {
        border-right: 0;
        border-bottom: 1px solid var(--color-gray-200);
    }

    .offerte-regel-calculation-card[b-iw28j030dm] {
        min-height: 620px;
    }
}

@media (max-width: 700px) {
    .offerte-regel-calculation-form[b-iw28j030dm] {
        grid-template-columns: 1fr;
    }

    .offerte-regel-field--note[b-iw28j030dm],
    .offerte-regel-calculation-actions[b-iw28j030dm] {
        grid-column: auto;
    }
}
/* _content/eLipsOnline/Components/Pages/Facturatie/OfferteRegelDetail.razor.rz.scp.css */
.offerte-regel-window[b-xenqnkb6yo]  .k-window-content {
    flex: 1 1 auto;
    height: auto;
    min-height: 0;
    padding: 0;
    overflow: hidden;
}

.offerte-regel-window[b-xenqnkb6yo]  .k-window-footer {
    padding: 8px 10px;
}

.offerte-regel-actions[b-xenqnkb6yo] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.offerte-regel-actions__right[b-xenqnkb6yo] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

.offerte-regel-title[b-xenqnkb6yo] {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0;
    padding: 4px 0;
}

.offerte-regel-title__icon[b-xenqnkb6yo] {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    color: var(--color-primary-700);
    background: var(--color-primary-50);
    border-radius: 6px;
}

.offerte-regel-title__main[b-xenqnkb6yo] {
    color: var(--color-secondary-700);
    font-size: var(--fs-h4);
}

.offerte-regel-title__sub[b-xenqnkb6yo] {
    margin-top: 3px;
    color: var(--color-gray-500);
    font-size: var(--fs-body-2);
    font-weight: 400;
}

.offerte-regel-workspace[b-xenqnkb6yo] {
    height: 100%;
    max-height: 100%;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(300px, 400px) minmax(0, 1fr);
    overflow: hidden;
    background: var(--color-gray-50);
}

.offerte-regel-detail-panel[b-xenqnkb6yo] {
    min-width: 0;
    min-height: 0;
    height: 100%;
    max-height: 100%;
    display: block;
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.offerte-regel-detail-heading h5[b-xenqnkb6yo] {
    margin: 0;
}

.offerte-regel-detail-heading[b-xenqnkb6yo] {
    padding: 16px 20px 16px;
}

.offerte-regel-route-summary[b-xenqnkb6yo] {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.offerte-regel-list-heading[b-xenqnkb6yo] {
    width: 100%;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.offerte-regel-list-heading > strong[b-xenqnkb6yo] {
    min-width: 0;
}

.offerte-regel-route-summary > span[b-xenqnkb6yo] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.offerte-regel-route-summary[b-xenqnkb6yo]  .k-svg-icon {
    flex: 0 0 auto;
    width: 13px;
    height: 13px;
}

.offerte-regel-editor-host[b-xenqnkb6yo] {
    display: block;
    width: 100%;
    height: auto;
    min-height: max-content;
    overflow: visible;
}

.offerte-regel-saas-layout[b-xenqnkb6yo] {
    flex: none;
    width: 100%;
    height: auto;
    min-height: 850px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
    padding: 0 20px 20px;
    overflow: visible;
}

.offerte-regel-route-card[b-xenqnkb6yo],
.offerte-regel-calculation-card[b-xenqnkb6yo] {
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    background: var(--white);
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .08), 0 4px 12px rgba(0, 0, 0, .04);
}

.offerte-regel-route-card[b-xenqnkb6yo] {
    position: relative;
    z-index: 40;
    display: grid;
    grid-template-columns: minmax(420px, 1fr) minmax(440px, 1.15fr);
    grid-template-rows: 400px auto;
    flex: 0 0 auto;
    height: auto;
    overflow: visible;
    min-height: 400px;
    transition: min-height 160ms ease;
}

.offerte-regel-route-card.has-expanded-route-info[b-xenqnkb6yo] {
    min-height: 0;
    height: auto;
    overflow: visible;
}

.offerte-regel-route-column[b-xenqnkb6yo],
.offerte-regel-map-column[b-xenqnkb6yo] {
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.offerte-regel-route-column[b-xenqnkb6yo] {
    position: relative;
    z-index: 20;
    display: flex;
    flex-direction: column;
    overflow: visible;
    border-right: 1px solid var(--color-gray-200);
}

/* Inlined route-stops panel (formerly KaartOfferteLocatiesPanel). */
.kaart-stops[b-xenqnkb6yo] {
    position: relative;
    z-index: 10;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: visible;
}

.kaart-panel-header[b-xenqnkb6yo] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 15px 20px 0;
}

    .kaart-panel-header .gb-title[b-xenqnkb6yo] {
        display: flex;
        align-items: center;
        gap: 10px;
    }

.kaart-search[b-xenqnkb6yo] {
    position: relative;
    z-index: 100;
    flex: 0 0 auto;
    padding: 12px 20px 16px;
    border-bottom: 1px solid var(--color-gray-200);
}

.kaart-search-field[b-xenqnkb6yo] {
    position: relative;
    display: block;
    width: 100%;
}

    .kaart-search-field[b-xenqnkb6yo]  .k-svg-icon {
        position: absolute;
        z-index: 2;
        top: 50%;
        left: 12px;
        width: 16px;
        height: 16px;
        margin: 0;
        color: var(--color-gray-500);
        transform: translateY(-50%);
        pointer-events: none;
    }

    .kaart-search-field[b-xenqnkb6yo]  .k-textbox,
    .kaart-search-field[b-xenqnkb6yo]  .k-input {
        width: 100%;
        height: 36px;
    }

    .kaart-search-field[b-xenqnkb6yo]  input {
        padding-left: 38px;
        font-size: 14px;
    }

.search-results-list[b-xenqnkb6yo] {
    position: absolute;
    z-index: 999999;
    top: calc(100% - 8px);
    left: 14px;
    right: 14px;
    max-height: min(520px, 65vh);
    padding: 12px 10px;
    margin: 0;
    overflow-y: auto;
    list-style: none;
    background: var(--white);
    border: 1px solid var(--color-gray-200);
    border-radius: 7px;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .18);
}

.search-results-heading[b-xenqnkb6yo] {
    padding: 5px 8px 8px;
    color: var(--color-gray-500);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .06em;
    line-height: 1;
    text-transform: uppercase;
}

.search-results-heading--locations[b-xenqnkb6yo] {
    margin-top: 9px;
    padding-top: 15px;
    border-top: 1px solid var(--color-gray-200);
}

.search-result-item[b-xenqnkb6yo] {
    min-height: 54px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 12px 8px;
    border-bottom: 1px solid var(--color-gray-100);
    border-radius: 6px;
    cursor: pointer;
}

    .search-result-item:last-child[b-xenqnkb6yo] {
        border-bottom: 0;
    }

    .search-result-item:hover[b-xenqnkb6yo] {
        background: var(--color-gray-100);
    }

.search-result-item--best[b-xenqnkb6yo] {
    background: var(--color-primary-50);
    border: 0;
}

.search-result-item.active-item[b-xenqnkb6yo] {
    background: var(--color-primary-50) !important;
    border: 1px solid var(--color-primary-500) !important;
    outline: 2px solid var(--color-primary-600) !important;
    outline-offset: -2px;
}

.search-result-icon[b-xenqnkb6yo] {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary-700);
    background: var(--white);
    border: 1px solid var(--color-gray-200);
    border-radius: 6px;
}

.search-result-copy[b-xenqnkb6yo] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.result-title[b-xenqnkb6yo],
.result-subtitle[b-xenqnkb6yo] {
    display: block;
    overflow: hidden;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.result-title[b-xenqnkb6yo] {
    color: var(--color-secondary-700);
    font-size: 14px;
    font-weight: 600;
}

.result-subtitle[b-xenqnkb6yo] {
    color: var(--color-gray-500);
    font-size: 12px;
}

.kaart-stop-list[b-xenqnkb6yo] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px;
    overflow-y: auto;
    background: var(--color-gray-30);
}

.route-timeline-item[b-xenqnkb6yo] {
    position: relative;
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
}

    .route-timeline-item[b-xenqnkb6yo]::before {
        content: "";
        position: absolute;
        z-index: 0;
        top: 50%;
        left: 12px;
        width: 1.5px;
        height: calc(100% + 8px);
        background: var(--color-gray-200);
    }

    .route-timeline-item:last-of-type[b-xenqnkb6yo]::before {
        display: none;
    }

.route-timeline-index[b-xenqnkb6yo] {
    z-index: 1;
    width: 23px;
    height: 23px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: center;
    color: white;
    background: var(--color-primary-700);
    border: 1px solid var(--color-primary-700);
    border-radius: 50%;
    font-size: 11px;
    font-weight: 600;
}

.offerte-route-stop[b-xenqnkb6yo] {
    min-height: 44px;
    display: grid;
    grid-template-columns: 16px 32px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 10px;
    background: var(--white);
    border: 1px solid var(--color-gray-200);
    border-radius: 6px;
    cursor: pointer;
}

    .offerte-route-stop:hover[b-xenqnkb6yo] {
        background: var(--color-selected-bg);
        border-color: var(--color-selected-border);
        box-shadow: 0 2px 8px rgba(0, 0, 0, .06);
    }

.drag-handle[b-xenqnkb6yo] {
    color: var(--color-gray-400);
    font-size: 17px;
    line-height: 1;
    cursor: grab;
}

.route-stop-flag[b-xenqnkb6yo] {
    width: 30px;
    height: 30px;
    overflow: hidden;
    background: var(--color-gray-50);
    border: 1px solid var(--color-gray-100);
    border-radius: 50%;
}

    .route-stop-flag img[b-xenqnkb6yo] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.kaart-stop-copy[b-xenqnkb6yo] {
    min-width: 0;
    padding-left: 4px;
}

.kaart-stop-name[b-xenqnkb6yo],
.kaart-stop-address[b-xenqnkb6yo] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kaart-stop-name[b-xenqnkb6yo] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 500;
}

.kaart-stop-address[b-xenqnkb6yo] {
    margin-top: 3px;
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
}

.kaart-stop-actions[b-xenqnkb6yo] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.offerte-regel-map-column[b-xenqnkb6yo] {
    position: relative;
    z-index: 1;
}

    .offerte-regel-route-column[b-xenqnkb6yo]  .kaart-panel,
    .offerte-regel-map-column[b-xenqnkb6yo]  .kaart-panel {
        height: 100%;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .offerte-regel-route-column[b-xenqnkb6yo]  .kaart-panel {
        flex: 1 1 auto;
        height: auto;
    }

    .offerte-regel-map-column[b-xenqnkb6yo]  .kaart-map,
    .offerte-regel-map-column[b-xenqnkb6yo]  #map {
        height: 100%;
        min-height: 0;
    }

.offerte-regel-route-column[b-xenqnkb6yo]  .search-results-list {
    z-index: 5000;
    max-height: min(520px, 65vh);
    overflow-y: auto;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .18);
}

.offerte-regel-map-controls[b-xenqnkb6yo] {
    position: absolute;
    z-index: 1000;
    top: 14px;
    left: 14px;
}

.offerte-route-info[b-xenqnkb6yo] {
    position: relative;
    z-index: 15;
    flex: 0 0 auto;
    background: var(--white);
    border-top: 1px solid var(--color-gray-200);
}

.offerte-route-info-strip[b-xenqnkb6yo] {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr)) 24px;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    color: inherit;
    text-align: left;
    background: var(--color-gray-30, #fafbfc);
    border: 0;
    cursor: pointer;
}

    .offerte-route-info-strip:disabled[b-xenqnkb6yo] {
        cursor: default;
        opacity: .7;
    }

.offerte-route-info-metric[b-xenqnkb6yo] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

    .offerte-route-info-metric small[b-xenqnkb6yo] {
        color: var(--color-gray-500);
        font-size: 10px;
        text-transform: uppercase;
        letter-spacing: .03em;
    }

    .offerte-route-info-metric strong[b-xenqnkb6yo] {
        overflow: hidden;
        color: var(--color-secondary-700);
        font-size: var(--fs-body-3);
        font-weight: 600;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.offerte-route-info-strip > .k-svg-icon[b-xenqnkb6yo] {
    justify-self: end;
    width: 14px;
    height: 14px;
    color: var(--color-gray-500);
}

.offerte-route-info-details[b-xenqnkb6yo] {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(220px, .75fr);
    gap: 16px;
    padding: 14px 16px 16px;
    border-top: 1px solid var(--color-gray-200);
}

    .offerte-route-info-details section[b-xenqnkb6yo] {
        min-width: 0;
    }

    .offerte-route-info-details header[b-xenqnkb6yo] {
        display: flex;
        align-items: center;
        gap: 8px;
        margin-bottom: 10px;
        color: var(--color-secondary-700);
        font-size: var(--fs-body-3);
    }

        .offerte-route-info-details header .k-svg-icon[b-xenqnkb6yo] {
            width: 14px;
            height: 14px;
            color: var(--color-primary-700);
        }

.offerte-route-country-list[b-xenqnkb6yo] {
    max-height: 155px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    overflow-y: auto;
}

.offerte-route-country[b-xenqnkb6yo] {
    display: grid;
    grid-template-columns: 25px minmax(0, 1fr) auto;
    align-items: center;
    gap: 9px;
    padding: 8px 10px;
    background: var(--color-gray-30, #fafbfc);
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
}

    .offerte-route-country img[b-xenqnkb6yo] {
        width: 24px;
        height: 24px;
        object-fit: cover;
        border-radius: 50%;
        box-shadow: 0 0 0 1px var(--color-gray-200);
    }

    .offerte-route-country > span[b-xenqnkb6yo] {
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 2px;
    }

    .offerte-route-country strong[b-xenqnkb6yo] {
        color: var(--color-secondary-700);
        font-size: var(--fs-caption);
    }

    .offerte-route-country small[b-xenqnkb6yo] {
        color: var(--color-gray-500);
        font-size: 10px;
    }

.offerte-route-country-toll[b-xenqnkb6yo] {
    align-items: flex-end;
    text-align: right;
}

.offerte-route-emission-grid[b-xenqnkb6yo] {
    display: grid;
    gap: 7px;
}

    .offerte-route-emission-grid > span[b-xenqnkb6yo] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 9px 10px;
        background: var(--color-primary-50);
        border-radius: 5px;
    }

    .offerte-route-emission-grid small[b-xenqnkb6yo] {
        color: var(--color-gray-600);
        font-size: var(--fs-caption);
    }

    .offerte-route-emission-grid strong[b-xenqnkb6yo] {
        color: var(--color-primary-800);
        font-size: var(--fs-body-3);
    }

/* Route results use the same panels and isolated CSS as KaartPTVPage. */
.offerte-route-info[b-xenqnkb6yo] {
    display: none;
}

.offerte-route-results[b-xenqnkb6yo] {
    grid-column: 1 / -1;
    min-width: 0;
    min-height: 0;
    height: auto;
    align-self: stretch;
    overflow: hidden;
    background: var(--white);
    border-top: 1px solid var(--color-gray-200);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.offerte-route-results-summary[b-xenqnkb6yo] {
    position: relative;
    cursor: pointer;
}

    .offerte-route-results-summary[b-xenqnkb6yo]  .kaart-panel {
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .offerte-route-results-summary[b-xenqnkb6yo]  .kaart-summary-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

.offerte-route-results-toggle[b-xenqnkb6yo] {
    position: absolute;
    top: 10px;
    right: 16px;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    color: var(--color-gray-500);
    background: transparent;
    border: 0;
    border-radius: 5px;
}

    .offerte-route-results-toggle:hover[b-xenqnkb6yo] {
        color: var(--color-primary-700);
        background: var(--color-primary-50);
    }

    .offerte-route-results-toggle[b-xenqnkb6yo]  .k-svg-icon {
        width: 17px;
        height: 17px;
    }

.offerte-route-results-expanded[b-xenqnkb6yo] {
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(260px, .8fr);
    align-items: stretch;
    overflow: hidden;
    border-top: 1px solid var(--color-gray-200);
}

    .offerte-route-results-expanded > *[b-xenqnkb6yo] {
        min-width: 0;
    }

    .offerte-route-results-expanded[b-xenqnkb6yo]  .kaart-panel {
        height: 100%;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .offerte-route-results-expanded[b-xenqnkb6yo]  .kaart-countries-panel {
        border-right: 1px solid var(--color-gray-200);
    }

.offerte-route-distance-panel[b-xenqnkb6yo],
.offerte-route-detail-panel[b-xenqnkb6yo] {
    min-width: 0;
    background: transparent;
}

.offerte-route-distance-panel[b-xenqnkb6yo] {
    padding: 0 16px 12px;
}

.offerte-route-panel-header[b-xenqnkb6yo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 11px 0 8px;
    color: var(--color-secondary-700);
    font-weight: 500;
}

.offerte-route-detail-panel > .offerte-route-panel-header[b-xenqnkb6yo] {
    padding-inline: 16px;
}

.offerte-route-panel-header .gb-title[b-xenqnkb6yo] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.offerte-route-panel-header .kaart-count[b-xenqnkb6yo] {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 3px 10px;
    color: var(--color-primary-700);
    background: var(--color-primary-50);
    border-radius: 999px;
    font-size: 10px;
    font-weight: 600;
}

.offerte-route-distance-grid[b-xenqnkb6yo] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    margin: 0;
    padding: 8px 0;
    background: var(--color-gray-30);
    border: 0;
    border-radius: 5px;
}

.offerte-route-distance-metric[b-xenqnkb6yo] {
    min-width: 0;
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    padding: 2px 14px;
    background: transparent;
    border: 0;
    border-right: 1px solid var(--color-gray-200);
    border-radius: 0;
}

    .offerte-route-distance-metric:last-child[b-xenqnkb6yo] {
        border-right: 0;
    }

    .offerte-route-distance-metric[b-xenqnkb6yo]  > .k-svg-icon {
        width: 18px;
        height: 18px;
        color: var(--color-gray-500);
    }

    .offerte-route-distance-metric > span[b-xenqnkb6yo] {
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 1px;
    }

        .offerte-route-distance-metric > span small[b-xenqnkb6yo] {
            color: var(--color-gray-500);
            font-size: var(--fs-caption);
            line-height: 1.2;
        }

        .offerte-route-distance-metric > span strong[b-xenqnkb6yo] {
            overflow: hidden;
            color: var(--color-secondary-700);
            font-size: var(--fs-body-2);
            font-weight: 550;
            line-height: 1.25;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

.offerte-route-detail-panel[b-xenqnkb6yo] {
    padding-bottom: 12px;
}

.offerte-route-countries-panel[b-xenqnkb6yo] {
    border-right: 1px solid var(--color-gray-200);
}

.offerte-route-country-cards[b-xenqnkb6yo] {
    display: grid;
    gap: 10px;
    padding: 0 16px;
}

.offerte-route-country-card[b-xenqnkb6yo] {
    overflow: hidden;
    background: var(--white);
    border: 1px solid var(--color-gray-200);
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
}

    .offerte-route-country-card summary[b-xenqnkb6yo] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        padding: 10px 12px;
        cursor: pointer;
        list-style: none;
    }

        .offerte-route-country-card summary[b-xenqnkb6yo]::-webkit-details-marker {
            display: none;
        }

        .offerte-route-country-card summary > .k-svg-icon[b-xenqnkb6yo] {
            width: 13px;
            height: 13px;
            color: var(--color-gray-500);
            transition: transform 150ms ease;
        }

    .offerte-route-country-card:not([open]) summary > .k-svg-icon[b-xenqnkb6yo] {
        transform: rotate(180deg);
    }

.offerte-route-country-heading[b-xenqnkb6yo] {
    min-width: 0;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
}

    .offerte-route-country-heading img[b-xenqnkb6yo] {
        width: 24px;
        height: 24px;
        object-fit: cover;
        border-radius: 50%;
        box-shadow: 0 0 0 1px var(--color-gray-200);
    }

    .offerte-route-country-heading strong[b-xenqnkb6yo] {
        overflow: hidden;
        color: var(--color-secondary-700);
        font-size: var(--fs-caption);
        font-weight: 600;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .offerte-route-country-heading small[b-xenqnkb6yo] {
        padding: 2px 7px;
        color: var(--color-gray-500);
        background: var(--color-gray-100);
        border-radius: 999px;
        font-size: 9px;
    }

.offerte-route-country-metrics[b-xenqnkb6yo] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 15px 10px;
    padding: 10px 15px 10px;
    background: var(--white);
    border-top: 1px solid var(--color-gray-200);
}

    .offerte-route-country-metrics > span[b-xenqnkb6yo] {
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 3px;
    }

    .offerte-route-country-metrics strong[b-xenqnkb6yo] {
        color: var(--color-secondary-700);
        font-size: var(--fs-body-2);
        font-weight: 550;
    }

    .offerte-route-country-metrics small[b-xenqnkb6yo] {
        color: var(--color-gray-500);
        font-size: var(--fs-caption);
    }

.offerte-route-emissions-list[b-xenqnkb6yo] {
    display: grid;
    gap: 0;
    padding: 0;
    margin: 0 16px;
    overflow: hidden;
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
}

.offerte-route-emission[b-xenqnkb6yo] {
    min-width: 0;
    padding: 11px 13px;
    border: 0;
    border-radius: 0;
    margin: 3px 0;
    background: var(--color-gray-30);
}

    .offerte-route-emission:last-child[b-xenqnkb6yo] {
        border-bottom: 0;
    }

    .offerte-route-emission > span:not(.offerte-route-emission-icon)[b-xenqnkb6yo] {
        display: flex;
        flex-direction: column;
        gap: 4px;
    }

    .offerte-route-emission small[b-xenqnkb6yo] {
        color: var(--color-gray-500);
        font-size: var(--fs-caption);
    }

    .offerte-route-emission strong[b-xenqnkb6yo] {
        color: var(--color-secondary-700);
        font-size: var(--fs-body-2);
        font-weight: 550;
    }

.offerte-route-emission--co2[b-xenqnkb6yo] {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    align-items: center;
    gap: 9px;
    background: var(--white);
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
}

.offerte-route-emission-icon[b-xenqnkb6yo] {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    color: var(--color-success-700);
    background: var(--color-success-50);
    border-radius: 5px;
}

    .offerte-route-emission-icon .k-svg-icon[b-xenqnkb6yo] {
        width: 16px;
        height: 16px;
    }

.offerte-route-emission--co2 strong[b-xenqnkb6yo] {
    color: var(--color-success-700);
}

.offerte-regel-calculation-card[b-xenqnkb6yo] {
    position: relative;
    z-index: 1;
    flex: 0 0 auto;
    min-height: 350px;
    display: flex;
    flex-direction: column;
    overflow: visible;
    padding: 20px;
    transition: min-height 160ms ease;
}

.offerte-regel-calculation-card.has-open-form[b-xenqnkb6yo] {
    min-height: 570px;
}

.offerte-regel-card-header[b-xenqnkb6yo] {
    position: relative;
    z-index: 30;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 0 0 15px;
}

.offerte-regel-card-subtitle[b-xenqnkb6yo] {
    display: block;
    margin-top: 3px;
    color: var(--color-gray-500);
    font-size: 12px;
}

.offerte-regel-add-menu[b-xenqnkb6yo] {
    position: relative;
    flex: 0 0 auto;
}

.offerte-regel-add-trigger[b-xenqnkb6yo] {
    color: var(--color-primary-700);
    border-color: var(--color-primary-300);
}

    .offerte-regel-add-trigger[b-xenqnkb6yo]  .k-button-text {
        display: flex;
        align-items: center;
        gap: 7px;
    }

.offerte-regel-add-options[b-xenqnkb6yo] {
    position: absolute;
    z-index: 5000;
    top: calc(100% + 6px);
    right: 0;
    width: 270px;
    padding: 6px;
    background: var(--white);
    border: 1px solid var(--color-gray-200);
    border-radius: 7px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

    .offerte-regel-add-options button[b-xenqnkb6yo] {
        width: 100%;
        display: grid;
        grid-template-columns: 28px minmax(0, 1fr);
        align-items: center;
        gap: 0px;
        padding: 10px;
        color: var(--color-gray-800);
        text-align: left;
        background: transparent;
        border: 0;
        border-radius: 5px;
        cursor: pointer;
    }

    .offerte-regel-add-options button[b-xenqnkb6yo] {
        position: relative;
        border: 0;
        border-radius: 5px;
    }

        .offerte-regel-add-options button:not(:last-child)[b-xenqnkb6yo]::after {
            content: "";
            position: absolute;
            right: 5px;
            bottom: 0;
            left: 5px;
            height: 1px;
            background: var(--color-gray-200);
            
        }

        .offerte-regel-add-options button:hover[b-xenqnkb6yo] {
            background: var(--color-gray-50);
        }

        .offerte-regel-add-options button > .k-svg-icon[b-xenqnkb6yo] {
            color: var(--color-primary-700);
        }

        .offerte-regel-add-options button[b-xenqnkb6yo]  .k-svg-icon {
            width: 15px;
            height: 15px;
        }

    .offerte-regel-add-options strong[b-xenqnkb6yo] {
        font-size: var(--fs-body-3);
        font-weight: 450;
    }

.offerte-regel-calculation-form[b-xenqnkb6yo] {
    position: relative;
    z-index: 20;
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin: 0 0 14px;
    padding: 16px;
    background: var(--color-gray-30);
    border: 1px solid var(--color-gray-200);
    border-radius: 7px;
}

.offerte-regel-calculation-fields[b-xenqnkb6yo] {
    min-width: 0;
    display: grid;
    align-items: center;
    gap: 12px;
}

.offerte-regel-calculation-fields--manual[b-xenqnkb6yo] {
    grid-template-columns: minmax(220px, 1.5fr) 90px minmax(150px, .8fr) minmax(140px, .8fr) auto;
}

.offerte-regel-calculation-fields--manual .offerte-regel-calculation-actions[b-xenqnkb6yo] {
    grid-column: auto;
    align-self: end;
    padding-top: 0;
}

.offerte-regel-calculation-fields--contract[b-xenqnkb6yo] {
    grid-template-columns: minmax(200px, 1.2fr) minmax(150px, .7fr) 90px auto minmax(180px, 1fr) auto;
}

.offerte-regel-calculation-header[b-xenqnkb6yo] {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
}

.offerte-regel-form-intro[b-xenqnkb6yo] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding-bottom: 4px;
}

    .offerte-regel-form-intro strong[b-xenqnkb6yo] {
        color: var(--color-secondary-700);
        font-size: var(--fs-body-2);
        font-weight: 550;
    }

    .offerte-regel-form-intro span[b-xenqnkb6yo] {
        color: var(--color-gray-500);
        font-size: var(--fs-caption);
    }

[b-xenqnkb6yo] .offerte-regel-calculation-close-btn.k-button {
    min-width: 26px;
    width: 26px;
    height: 26px;
    padding: 0;
    color: var(--color-gray-600);
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

[b-xenqnkb6yo] .offerte-regel-calculation-close-btn.k-button:hover {
    color: var(--color-secondary-700);
    background: var(--color-gray-100) !important;
}

[b-xenqnkb6yo] .offerte-regel-calculation-close-btn .k-svg-icon {
    width: 13px;
    height: 13px;
}

.offerte-regel-field[b-xenqnkb6yo] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.offerte-regel-check-field[b-xenqnkb6yo] {
    display: flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap;
    margin-top: 15px;
}

    .offerte-regel-check-field label[b-xenqnkb6yo] {
        margin: 0;
    }

.offerte-regel-calculation-actions[b-xenqnkb6yo] {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 4px;
}

    .offerte-regel-calculation-actions[b-xenqnkb6yo]  .k-button {
        flex: 0 0 auto;
        white-space: nowrap;
    }

.offerte-regel-calculation-fields--contract .offerte-regel-calculation-actions[b-xenqnkb6yo] {
    grid-column: auto;
    align-self: end;
    padding-top: 0;
}

.offerte-regel-calculation-grid[b-xenqnkb6yo] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 260px;
    overflow: visible;
}

    .offerte-regel-calculation-grid[b-xenqnkb6yo]  .k-grid {
        border-radius: 5px;
        border: 1px solid var(--color-gray-200);
    }

.offerte-regel-grid-toolbar[b-xenqnkb6yo] {
    width: 100%;
}

.offerte-regel-toolbar-menu[b-xenqnkb6yo] {
    position: relative;
}

.offerte-regel-toolbar-popover[b-xenqnkb6yo] {
    position: absolute;
    z-index: 6000;
    top: calc(100% + 6px);
    right: 0;
    width: 260px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

    .offerte-regel-toolbar-popover label[b-xenqnkb6yo] {
        display: flex;
        align-items: center;
        gap: 9px;
        color: var(--color-secondary-700);
        font-size: var(--fs-body-3);
    }

.tussenstop-badge[b-xenqnkb6yo] {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-height: 20px;
    padding: 3px 8px;
    border-radius: 7px;
    background: var(--color-primary-50);
    color: var(--color-primary-700);
    font-size: 12px;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
    margin-top: 3px;
}

@media (max-width: 900px) {
    .offerte-regel-workspace[b-xenqnkb6yo] {
        grid-template-columns: 1fr;
        overflow-y: auto;
    }

    .detail-list-panel[b-xenqnkb6yo] {
        max-height: 260px;
        border-right: 0;
        border-bottom: 1px solid var(--color-gray-200);
    }

    .offerte-regel-detail-panel[b-xenqnkb6yo] {
        min-height: 0;
    }

    .offerte-regel-route-card[b-xenqnkb6yo] { grid-template-columns: 1fr; grid-template-rows: 420px 420px auto; }
    .offerte-regel-route-card.has-expanded-route-info[b-xenqnkb6yo] { grid-template-rows: 420px 420px auto; }
    .offerte-route-results-expanded[b-xenqnkb6yo] { grid-template-columns: 1fr; }
    .offerte-route-results-summary[b-xenqnkb6yo]  .kaart-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .offerte-route-results-expanded[b-xenqnkb6yo]  .kaart-countries-panel { border-right: 0; border-bottom: 1px solid var(--color-gray-200); }
    .offerte-route-countries-panel[b-xenqnkb6yo] { border-right: 0; border-bottom: 1px solid var(--color-gray-200); }
    .offerte-route-distance-grid[b-xenqnkb6yo] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .offerte-regel-calculation-fields--manual[b-xenqnkb6yo],
    .offerte-regel-calculation-fields--contract[b-xenqnkb6yo] { grid-template-columns: repeat(2, minmax(0, 1fr)); }

    .offerte-regel-calculation-fields--manual .offerte-regel-calculation-actions[b-xenqnkb6yo] {
        grid-column: 1 / -1;
    }

    .offerte-regel-calculation-fields--contract .offerte-regel-calculation-actions[b-xenqnkb6yo] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 600px) {
    .offerte-regel-title__sub[b-xenqnkb6yo] { display: none; }
    .offerte-regel-workspace[b-xenqnkb6yo] { display: flex; flex-direction: column; }
    .detail-list-panel[b-xenqnkb6yo] { max-height: 220px; }
    .offerte-regel-detail-heading[b-xenqnkb6yo] { padding-inline: 12px; }
    .offerte-regel-saas-layout[b-xenqnkb6yo] { min-height: 0; padding: 0 10px 15px; }
    .offerte-regel-calculation-card[b-xenqnkb6yo] { padding: 14px; }
    .offerte-route-info-strip[b-xenqnkb6yo] { grid-template-columns: repeat(2, minmax(0, 1fr)) 20px; }
    .offerte-route-info-strip > .k-svg-icon[b-xenqnkb6yo] { grid-column: 3; grid-row: 1 / span 2; }
    .offerte-route-distance-grid[b-xenqnkb6yo] { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 8px 0; }
    .offerte-route-distance-metric:nth-child(2)[b-xenqnkb6yo] { border-right: 0; }
    .offerte-route-distance-metric:nth-child(-n + 2)[b-xenqnkb6yo] { margin-bottom: 8px; }
    .offerte-route-country-metrics[b-xenqnkb6yo] { grid-template-columns: repeat(2, minmax(0, 1fr)); padding-inline: 10px; }
    .offerte-route-panel-header[b-xenqnkb6yo],
    .offerte-route-country-cards[b-xenqnkb6yo] { padding-inline: 12px; }
    .offerte-route-emissions-list[b-xenqnkb6yo] { margin-inline: 12px; padding-inline: 0; }
    .offerte-regel-card-header[b-xenqnkb6yo] { align-items: flex-start; flex-direction: column; }
    .offerte-regel-add-menu[b-xenqnkb6yo],
    [b-xenqnkb6yo] .offerte-regel-add-trigger.k-button { width: 100%; }
    .offerte-regel-add-options[b-xenqnkb6yo] { right: auto; left: 0; width: 100%; }
    .offerte-regel-calculation-form[b-xenqnkb6yo] { padding: 14px; }
    .offerte-regel-calculation-fields--manual[b-xenqnkb6yo],
    .offerte-regel-calculation-fields--contract[b-xenqnkb6yo] { grid-template-columns: 1fr; }
    .offerte-regel-calculation-actions[b-xenqnkb6yo],
    .offerte-regel-calculation-fields--contract .offerte-regel-calculation-actions[b-xenqnkb6yo] { grid-column: 1; }
    .offerte-regel-calculation-fields--manual .offerte-regel-calculation-actions[b-xenqnkb6yo] { grid-column: 1; }
    .offerte-regel-calculation-actions[b-xenqnkb6yo] { flex-direction: column-reverse; align-items: stretch; }
    .offerte-regel-calculation-actions[b-xenqnkb6yo]  .k-button { width: 100%; }
    .offerte-regel-grid-toolbar[b-xenqnkb6yo] { gap: 8px; }
    .offerte-regel-toolbar-popover[b-xenqnkb6yo] { position: fixed; right: 12px; left: 12px; width: auto; }
}
/* _content/eLipsOnline/Components/Pages/Facturatie/Offertes.razor.rz.scp.css */
.offertes-workspace[b-wcymr9pza2] {
    --ink: #111827;
    --muted: var(--color-gray-500);
    --line: var(--color-gray-100);
    box-sizing: border-box;
    display: block;
    width: 100%;
    height: calc(100vh - 40px);
    min-height: 0;
    overflow: hidden;
    color: var(--ink);
    background: var(--color-gray-50);
}

.offertes-workspace[b-wcymr9pza2]  .offertes-outer-splitter {
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    border: 0;
}

.offertes-workspace[b-wcymr9pza2]  .offertes-outer-splitter > .k-pane,
.offertes-workspace[b-wcymr9pza2]  .offertes-outer-splitter > .k-splitter > .k-pane {
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    background: var(--color-gray-50);
}

.offertes-workspace *[b-wcymr9pza2],
.offertes-workspace *[b-wcymr9pza2]::before,
.offertes-workspace *[b-wcymr9pza2]::after {
    box-sizing: border-box;
}

.offertes-sidebar[b-wcymr9pza2] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    height: 100%;
    padding: 20px 20px 0;
    overflow: hidden;
    background: var(--white);
    border-right: 1px solid var(--color-gray-200);
}

.sidebar-header[b-wcymr9pza2],
.card-topline[b-wcymr9pza2],
.card-meta[b-wcymr9pza2],
.relatie-meta[b-wcymr9pza2],
.title-row[b-wcymr9pza2],
.detail-meta[b-wcymr9pza2],
.section-toolbar[b-wcymr9pza2],
.stop-details-header[b-wcymr9pza2] {
    display: flex;
    align-items: center;
}

.sidebar-header[b-wcymr9pza2] {
    flex: 0 0 auto;
    justify-content: space-between;
    margin-bottom: 15px;
    align-items: flex-start;
}

.sidebar-header h3[b-wcymr9pza2] {
    margin: 0;
    color: var(--color-secondary-700);
    font-weight: 500;
}

.sidebar-header span[b-wcymr9pza2] {
    color: var(--color-gray-400);
    font-size: 11px;
    white-space: nowrap;
    margin-right: 5px;
}

.sidebar-header p[b-wcymr9pza2] {
    color: var(--color-gray-400);
    font-size: var(--fs-caption);
    margin-top: 4px;
    padding: 0;
}

.sidebar-actions[b-wcymr9pza2] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: 1fr auto auto;
    grid-template-areas: "status vestiging edit new";
    gap: 5px;
    margin-bottom: 12px;
}

.sidebar-action[b-wcymr9pza2] {
    min-width: 0;
}

.sidebar-action--status[b-wcymr9pza2] { grid-area: status; }
.sidebar-action--vestiging[b-wcymr9pza2] { grid-area: vestiging; }
.sidebar-action--edit[b-wcymr9pza2] { grid-area: edit; }
.sidebar-action--new[b-wcymr9pza2] { grid-area: new; }

.sidebar-actions[b-wcymr9pza2]  .k-picker {
    width: 100%;
}

.sidebar-action--edit[b-wcymr9pza2]  .k-button,
.sidebar-action--new[b-wcymr9pza2]  .k-button {
    width: 100%;
}

.search-field[b-wcymr9pza2] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    height: 36px;
    margin-bottom: 25px;
    padding: 0 12px;
    color: var(--color-gray-500);
    border: 1px solid var(--color-gray-200);
    border-radius: 4px;
}

.search-field[b-wcymr9pza2]  .k-textbox,
.search-field[b-wcymr9pza2]  .k-input {
    width: 100%;
    height: 33px;
    border: 0;
    box-shadow: none;
}

.search-field[b-wcymr9pza2]  input {
    padding-left: 10px;
    color: #111827;
    font-size: var(--fs-body-3);
}

.list-summary[b-wcymr9pza2] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
    font-size: var(--fs-body-3);
    color: var(--color-secondary-700);
    font-weight: 500;
}

.list-summary[b-wcymr9pza2]  .k-button {
   background: none;
   margin: 0;
   color: var(--color-primary-700);
   border: none;
   padding: 0;
   font-weight: 500;
   font-size: var(--fs-body-3);
}

.list-summary span[b-wcymr9pza2] {
    background: var(--blue-light);
    color: var(--color-primary-700);
    padding: 2px 10px;
    border-radius: 99px;
}

.offertes-scroll[b-wcymr9pza2] {
    flex: 1 1 auto;
    min-height: 0;
    margin-right: -22px;
    padding: 0 18px 14px 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.offerte-list-card[b-wcymr9pza2] {
    position: relative;
    width: 100%;
    color: inherit;
    min-height: 105px;
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    margin: 3px 3px 14px 3px;
    padding: 14px 16px;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    background: var(--white);
    text-align: left;
    cursor: pointer;
    transition: all .18s ease;
}

    .offerte-list-card:hover[b-wcymr9pza2] {
        border-color: var(--color-selected-border);
        transform: translateY(-1px);
        box-shadow: 0 6px 16px rgba(0, 149, 218, .02);
    }

    .offerte-list-card.is-selected[b-wcymr9pza2] {
        border-color: var(--color-selected-border);
        box-shadow: 0 8px 24px rgba(0, 149, 218, .02);
        padding: 14px 14px 14px 20px;
    }

        .offerte-list-card.is-selected[b-wcymr9pza2]::before {
            content: "";
            position: absolute;
            left: -1px;
            top: -1px;
            bottom: -1px;
            width: 5px;
            background: var(--color-primary-700);
            border-radius: 15px 0 0 15px;
        }


.card-topline[b-wcymr9pza2] {
    justify-content: space-between;
}

.offerte-number[b-wcymr9pza2] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-2);
    font-weight: 600;
}

.relation-name[b-wcymr9pza2] {
    margin-top: 3px;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 500;
}

.contact-name[b-wcymr9pza2],
.card-meta[b-wcymr9pza2] {
    color: var(--color-gray-600);
    font-size: var(--fs-body-3);
}

.contact-name[b-wcymr9pza2] { margin-top: 2px; }
.card-meta[b-wcymr9pza2] { gap: 10px; margin-top: 5px; font-size: var(--fs-caption); }
.regel-count[b-wcymr9pza2] { margin-left: auto; margin-top: 5px; font-size: var(--fs-caption); color: var(--color-gray-500); }


.relatie-meta__amount[b-wcymr9pza2] {
    margin-left: auto;
    margin-top: 6px;
    color: var(--color-secondary-700);
    font-weight: 500;
    font-size: var(--fs-caption);
}

.user-code[b-wcymr9pza2] {
    display: flex;
    align-items: center;
    gap: 3px;
    margin-top: 10px;
    font-size: var(--fs-caption);
}

    .user-code[b-wcymr9pza2]  .k-svg-icon svg { 
        width: 12px;
        height: 12px;
    }

.sidebar-state[b-wcymr9pza2] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 44px 15px;
    color: var(--color-gray-500);
    text-align: center;
}

.offerte-detail[b-wcymr9pza2] {
    box-sizing: border-box;
    min-width: 0;
    min-height: 0;
    height: 100%;
    padding: 20px 20px 20px 20px;
    overflow: hidden;
    background-color: var(--color-gray-50);
}

.detail-empty[b-wcymr9pza2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: var(--color-gray-500);
}

.detail-empty h2[b-wcymr9pza2] {
    margin: 0 0 4px;
    color: var(--color-secondary-700);
}

.detail-empty p[b-wcymr9pza2] { margin: 0; }

.offerte-empty[b-wcymr9pza2] {
    flex: 1 1 auto;
    width: 100%;
    min-height: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 24px;
    color: var(--color-gray-500);
    text-align: center;
}

.offerte-empty--detail[b-wcymr9pza2] {
    height: 100%;
    min-height: 0;
}

.offerte-empty--sidebar[b-wcymr9pza2] {
    min-height: 260px;
    padding: 20px 16px;
}

.offerte-empty__visual[b-wcymr9pza2] {
    width: 220px;
    height: 96px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.offerte-empty--sidebar .offerte-empty__visual[b-wcymr9pza2] {
    width: 160px;
    height: 72px;
}

.offerte-empty__visual img[b-wcymr9pza2] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.offerte-empty__text[b-wcymr9pza2] {
    max-width: 340px;
    display: grid;
    gap: 6px;
}

.offerte-empty__text strong[b-wcymr9pza2] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-2);
    font-weight: 600;
    line-height: 1.2;
}

.offerte-empty__text span[b-wcymr9pza2] {
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
    line-height: 1.4;
}

.offerte-detail[b-wcymr9pza2]  .offerte-detail-splitter,
.offerte-detail[b-wcymr9pza2]  .offerte-detail-splitter > .k-splitter {
    min-width: 0;
    min-height: 0;
    height: 100%;
    overflow: hidden;
    border: 0;
    background: transparent;
}

.offerte-detail[b-wcymr9pza2]  .offerte-detail-splitter .k-pane {
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.offerte-top-pane[b-wcymr9pza2],
.regel-bottom-pane[b-wcymr9pza2] {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    width: calc(100% - 16px);
    height: calc(100% - 16px);
    margin: 8px;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    background: var(--white);
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .05), 0 4px 12px rgba(0, 0, 0, .04);
}

.detail-header[b-wcymr9pza2] {
    flex: 0 0 auto;
    display: flex;
    justify-content: space-between;
    gap: 30px;
    padding: 18px 24px 14px;
}

.title-row[b-wcymr9pza2] { gap: 20px; margin-top: 5px; align-items: baseline;}
.title-row h2[b-wcymr9pza2] { margin: 0; font-size: var(--fs-h4); font-weight: 500;  color: var(--color-secondary-700); }
.title-row span[b-wcymr9pza2] { color: var(--color-secondary-700); font-size: var(--fs-h4);  font-weight: 500;}

.title-row[b-wcymr9pza2]  .offerte-header-edit {
    min-width: 0;
    padding: 0 11px;
    color: var(--color-primary-700);
    box-shadow: none;
    background: none;
    border: none;
    font-size: var(--fs-body-3);
    font-weight: 400;
}

.title-row[b-wcymr9pza2]  .offerte-header-edit:hover {
    color: var(--color-primary-900);
}

.title-row[b-wcymr9pza2]  .offerte-header-edit .k-svg-icon {
    width: 13px;
    height: 13px;
    margin-right: 3px;
}

.detail-meta[b-wcymr9pza2] { gap: 24px; margin-top: 10px; color: var(--color-gray-500); font-size: var(--fs-caption); }

.detail-meta span[b-wcymr9pza2] { display: flex; align-items: center; gap: 7px; }
.detail-meta span[b-wcymr9pza2]  .k-svg-icon { width: 12px; height: 12px; }

.optional-panel[b-wcymr9pza2] {
    flex: 0 1 470px;
    min-height: 72px;
    padding: 10px 13px;
    background: var(--color-gray-30);
    border-radius: 7px;
}

.optional-panel > span:first-child[b-wcymr9pza2] {
    display: block;
    margin-bottom: 8px;
    font-size: var(--fs-body-3);
    color: var(--color-secondary-700);
    font-weight: 500;
}

.option-pill[b-wcymr9pza2] {
    display: inline-block;
    min-width: 60px;
    margin: 0 5px 4px 0;
    padding: 1px 10px;
    color: var(--color-primary-700);
    font-size: var(--fs-caption);
    text-align: center;
    background: var(--color-primary-50);
    border-radius: 999px;
    font-weight: 500;
}

.optional-panel small[b-wcymr9pza2] { color: var(--color-gray-500); }

.route-display[b-wcymr9pza2] {
    display: flex;
    align-items: center;
    gap: 7px;
}

    .route-display[b-wcymr9pza2]  .k-svg-icon {
        flex: 0 0 auto;
        width: 14px;
        height: 14px;
    }

.regels-overview[b-wcymr9pza2] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 7px 24px 20px;
}

.section-toolbar[b-wcymr9pza2] {
    flex: 0 0 auto;
    margin-bottom: 10px;
    gap: 6px;
}

.section-toolbar h3[b-wcymr9pza2] {
    margin: 0;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-2);
}

.grid-status[b-wcymr9pza2],
.afspraak-badge[b-wcymr9pza2] {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 0 9px;
    color: var(--color-primary-700);
    background: #eef5ff;
    border-radius: 999px;
    font-size: var(--fs-caption);
    font-weight: 600;
}

.inline-empty[b-wcymr9pza2],
.regel-detail-empty[b-wcymr9pza2] {
    display: grid;
    flex: 1 1 auto;
    place-items: center;
    min-height: 0;
    padding: 24px;
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
}

.regel-detail-header[b-wcymr9pza2] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 14px 20px;
    border-bottom: 1px solid var(--color-gray-200);
}

.regel-detail-header > div[b-wcymr9pza2] {
    display: flex;
    align-items: center;
    gap: 24px;
    min-width: 0;
}

.regel-detail-header span[b-wcymr9pza2] {
    color: var(--color-primary-700);
    font-size: var(--fs-body-3);
    font-weight: 600;
}

.regel-route-display[b-wcymr9pza2] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    color: var(--color-secondary-700);
    font-size: var(--fs-h5);
    font-weight: 550;
    line-height: 1.35;
}

    .regel-route-display p[b-wcymr9pza2] {
        overflow-wrap: anywhere;
        margin: 0;
        font-size: var(--fs-h6);
    }

    .regel-route-display[b-wcymr9pza2]  .k-svg-icon {
        flex: 0 0 auto;
        width: 15px;
        height: 15px;
        color: var(--color-secondary-700);
    }

.afspraak-badge[b-wcymr9pza2] {
    flex: 0 0 auto;
    min-height: 26px;
    border-radius: 5px;
}

.stop-master-detail[b-wcymr9pza2] {
    flex: 1 1 auto;
    display: grid;
    grid-template-columns: minmax(320px, 38%) minmax(0, 1fr);
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.stops-timeline[b-wcymr9pza2] {
    position: relative;
    min-height: 0;
    padding: 14px;
    overflow-x: hidden;
    overflow-y: auto;
    background-color: var(--color-gray-30);
    overscroll-behavior: contain;
}

.stops-timeline[b-wcymr9pza2]::before {
    content: "";
    position: absolute;
    top: 42px;
    bottom: 42px;
    left: 27px;
    width: 2px;
    background: linear-gradient(#bfdbfe, #dbeafe 45%, #e2e8f0);
}

.stop-card[b-wcymr9pza2] {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    width: 100%;
    min-height: 78px;
    margin-bottom: 2px;
    padding: 4px 0;
    color: inherit;
    text-align: left;
    background: transparent;
    border: 0;
    border-radius: 10px;
    box-shadow: none;
    cursor: pointer;
}

.stop-card-content[b-wcymr9pza2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-width: 0;
    min-height: 70px;
    padding: 11px 14px;
    background: var(--white);
    border: 1px solid var(--color-gray-200);
    border-radius: 10px;
    transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
    box-shadow: rgba(15, 23, 42, 0.04) 0px 1px 2px;
}

.stop-card:last-child[b-wcymr9pza2] {
    margin-bottom: 0;
}

.stop-card:hover .stop-card-content[b-wcymr9pza2] {
    background: rgba(255, 255, 255, .62);
}

.stop-card.is-active .stop-card-content[b-wcymr9pza2] {
    background: var(--color-selected-bg);
    border-color: var(--color-selected-border);
}

.stop-node[b-wcymr9pza2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    color: #fff;
    font-size: var(--fs-caption);
    font-weight: 650;
    border-radius: 50%;
    box-shadow: 0 0 0 4px var(--color-primary-30);
}

.stop-node.start[b-wcymr9pza2] { background: var(--color-primary-700); }
.stop-node.middle[b-wcymr9pza2] { background: var(--color-primary-700); }
.stop-node.end[b-wcymr9pza2] { background: var(--color-primary-700); }

.stop-country-flag[b-wcymr9pza2] {
    flex: 0 0 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    overflow: hidden;
}

.stop-country-flag img[b-wcymr9pza2] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.stop-main[b-wcymr9pza2] {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.stop-copy[b-wcymr9pza2] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
}

.stop-copy strong[b-wcymr9pza2] {
    max-width: 100%;
    margin: 5px 0 2px;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 600;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.stop-copy small[b-wcymr9pza2] {
    max-width: 100%;
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.stop-label[b-wcymr9pza2] {
    padding: 3px 7px;
    color: #2b75d6;
    font-size: 8px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .035em;
    background: #e9f1ff;
    border-radius: 999px;
}

.stop-label.start[b-wcymr9pza2] { color: #13a864; background: #dff8eb; }
.stop-label.end[b-wcymr9pza2] { color: #dc2626; background: #fee8e8; }

.stop-status[b-wcymr9pza2] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 5px;
    color: var(--color-gray-400);
    font-size: var(--fs-caption);
    line-height: 1.1;
}

.stop-details[b-wcymr9pza2] {
    min-width: 0;
    min-height: 0;
    overflow-y: auto;
    background: var(--white);
    border-left: 1px solid var(--color-gray-200);
}

.stop-details-header[b-wcymr9pza2] {
    position: sticky;
    top: 0;
    z-index: 1;
    gap: 12px;
    min-height: 56px;
    padding: 0 18px;
    background: var(--white);
    font-size: var(--fs-body-1);
    color: var(--color-secondary-700);
    font-weight: 550;
    border-bottom: 1px solid var(--color-gray-200);
}

.stop-detail-grid[b-wcymr9pza2] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 34px;
    padding: 20px;
}

.stop-detail-grid > span[b-wcymr9pza2] {
    display: grid;
    grid-template-columns: 115px minmax(0, 1fr);
    gap: 10px;
    min-width: 0;
}

.stop-detail-grid small[b-wcymr9pza2] {
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
}

.stop-detail-grid strong[b-wcymr9pza2] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 500;
    overflow-wrap: anywhere;
}

.stop-detail-grid .grid-status-badge[b-wcymr9pza2] {
    width: fit-content;
    min-width: 0;
    justify-self: start;
    padding-inline: 10px;
}

@media (max-width: 1250px) {
    .sidebar-actions[b-wcymr9pza2] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        grid-template-areas:
            "status vestiging"
            "edit new";
    }
    .detail-meta[b-wcymr9pza2] { gap: 24px; }
    .stop-master-detail[b-wcymr9pza2] { grid-template-columns: 320px minmax(0, 1fr); }
    .stop-detail-grid[b-wcymr9pza2] { grid-template-columns: 1fr; }
}

/* Compact desktop / small laptop */
@media (max-width: 1020px) {
    .offertes-workspace[b-wcymr9pza2] {
        height: auto;
        min-height: calc(100vh - 40px);
        overflow: visible;
    }

    .offertes-workspace[b-wcymr9pza2]  .offertes-outer-splitter {
        display: flex !important;
        flex-direction: column !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
    }

    .offertes-workspace[b-wcymr9pza2]  .offertes-outer-splitter > .k-pane {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        height: auto !important;
        overflow: visible !important;
    }

    .offertes-workspace[b-wcymr9pza2]  .offertes-outer-splitter > .k-pane:first-child {
        flex: 0 0 460px !important;
        height: 460px !important;
    }

    .offertes-workspace[b-wcymr9pza2]  .offertes-outer-splitter > .k-pane:last-child {
        flex: 0 0 auto !important;
        height: auto !important;
        overflow: visible !important;
    }

    .offertes-workspace[b-wcymr9pza2]  .offertes-outer-splitter > .k-splitbar {
        display: none !important;
    }

    .offertes-sidebar[b-wcymr9pza2] {
        width: calc(100% - 32px);
        height: calc(100% - 32px);
        margin: 16px;
        padding: 20px 20px 0;
        border: 1px solid var(--color-gray-200);
    }

    .sidebar-actions[b-wcymr9pza2] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 42px minmax(100px, auto);
        grid-template-areas: "status vestiging edit new";
    }

    .search-field[b-wcymr9pza2] {
        margin-bottom: 16px;
    }

    .list-summary[b-wcymr9pza2] {
        margin-bottom: 12px;
    }

    .offertes-scroll[b-wcymr9pza2] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-content: start;
        gap: 12px;
        margin-right: -20px;
        padding-right: 16px;
    }

    .offerte-list-card[b-wcymr9pza2] {
        min-width: 0;
        margin: 0;
    }

    .offerte-detail[b-wcymr9pza2] {
        height: auto;
        padding: 0 16px 16px;
        overflow: visible;
    }

    .offerte-page-card[b-wcymr9pza2] {
        height: auto;
        min-height: 0;
        padding: 20px 20px 20px;
        overflow: visible;
        overscroll-behavior: auto;
    }

    .offerte-top-pane[b-wcymr9pza2],
    .regel-bottom-pane[b-wcymr9pza2] {
        width: calc(100% - 12px);
        height: calc(100% - 12px);
        margin: 6px;
    }

    .detail-header[b-wcymr9pza2] {
        gap: 20px;
        padding-inline: 20px;
    }

    .optional-panel[b-wcymr9pza2] {
        flex-basis: 340px;
    }

    .regels-overview[b-wcymr9pza2] {
        padding-inline: 20px;
    }
}

/* Tablet */
@media (max-width: 768px) {
    .offertes-workspace[b-wcymr9pza2]  .offertes-outer-splitter {
        min-height: 0 !important;
    }

    .offertes-workspace[b-wcymr9pza2]  .offertes-outer-splitter > .k-pane:first-child {
        flex-basis: 500px !important;
        height: 500px !important;
    }

    .offertes-workspace[b-wcymr9pza2]  .offertes-outer-splitter > .k-pane:last-child {
        flex-basis: auto !important;
        height: auto !important;
    }

    .sidebar-header[b-wcymr9pza2] {
        align-items: flex-start;
        gap: 12px;
    }

    .sidebar-header > div:last-child[b-wcymr9pza2] {
        flex-wrap: wrap;
        justify-content: flex-end;
    }

    .sidebar-actions[b-wcymr9pza2] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        grid-template-areas:
            "status vestiging"
            "edit new";
    }

    .detail-header[b-wcymr9pza2] {
        flex-direction: column;
        gap: 14px;
    }

    .title-row[b-wcymr9pza2],
    .detail-meta[b-wcymr9pza2] {
        flex-wrap: wrap;
    }

    .title-row[b-wcymr9pza2] {
        gap: 10px 16px;
    }

    .detail-meta[b-wcymr9pza2] {
        gap: 10px 18px;
    }

    .optional-panel[b-wcymr9pza2] {
        flex: 0 0 auto;
        width: 100%;
        min-height: 60px;
    }

    .regel-detail-header[b-wcymr9pza2] {
        align-items: flex-start;
    }

    .regel-detail-header > div[b-wcymr9pza2] {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .stop-master-detail[b-wcymr9pza2] {
        grid-template-columns: minmax(260px, 42%) minmax(0, 1fr);
    }

    .stop-card-content[b-wcymr9pza2] {
        padding-inline: 11px;
    }

    .stop-main[b-wcymr9pza2] {
        gap: 8px;
    }

    .stop-status[b-wcymr9pza2] {
        margin-left: 8px;
    }

    .stop-detail-grid[b-wcymr9pza2] {
        gap: 16px;
        padding: 16px;
    }

    .stop-detail-grid > span[b-wcymr9pza2] {
        grid-template-columns: 105px minmax(0, 1fr);
    }
}

/* Mobile */
@media (max-width: 600px) {
    .offertes-workspace[b-wcymr9pza2]  .offertes-outer-splitter {
        min-height: 0 !important;
    }

    .offertes-workspace[b-wcymr9pza2]  .offertes-outer-splitter > .k-pane:first-child {
        flex-basis: 540px !important;
        height: 540px !important;
    }

    .offertes-workspace[b-wcymr9pza2]  .offertes-outer-splitter > .k-pane:last-child {
        flex-basis: auto !important;
        height: auto !important;
    }

    .offertes-sidebar[b-wcymr9pza2] {
        width: calc(100% - 24px);
        height: calc(100% - 24px);
        margin: 12px;
        padding: 15px 14px;
    }

    .sidebar-actions[b-wcymr9pza2] {
        grid-template-columns: 42px minmax(0, 1fr);
        grid-template-areas:
            "status status"
            "vestiging vestiging"
            "edit new";
    }

    .sidebar-header[b-wcymr9pza2] {
        margin-bottom: 14px;
    }

    .sidebar-header h3[b-wcymr9pza2] {
        margin: 0;
        font-size: var(--fs-body-1);
    }

    .sidebar-header span[b-wcymr9pza2] {
        white-space: normal;
        text-align: right;
    }

    .search-field[b-wcymr9pza2] {
        margin-bottom: 14px;
    }

    .offertes-scroll[b-wcymr9pza2] {
        grid-template-columns: 1fr;
        margin-right: -14px;
        padding-right: 10px;
    }

    .offerte-list-card[b-wcymr9pza2] {
        min-height: 96px;
        padding: 12px;
    }

    .card-meta[b-wcymr9pza2] {
        flex-wrap: wrap;
        gap: 4px 7px;
    }

    .offerte-detail[b-wcymr9pza2] {
        padding: 0 12px 12px;
    }

    .offerte-top-pane[b-wcymr9pza2],
    .regel-bottom-pane[b-wcymr9pza2] {
        width: calc(100% - 8px);
        height: calc(100% - 8px);
        margin: 4px;
    }

    .detail-header[b-wcymr9pza2],
    .regels-overview[b-wcymr9pza2] {
        padding-left: 14px;
        padding-right: 14px;
    }

    .detail-header[b-wcymr9pza2] {
        padding-top: 14px;
    }

    .title-row h2[b-wcymr9pza2],
    .title-row span[b-wcymr9pza2] {
        font-size: var(--fs-body-1);
    }

    .title-row[b-wcymr9pza2]  .offerte-header-edit {
        padding-inline: 4px;
    }

    .regels-overview[b-wcymr9pza2] {
        padding-bottom: 14px;
    }

    .regel-detail-header[b-wcymr9pza2] {
        padding: 12px 14px;
    }

    .regel-route-display[b-wcymr9pza2] {
        gap: 5px;
        font-size: var(--fs-body-2);
    }

    .regel-route-display p[b-wcymr9pza2] {
        font-size: var(--fs-body-3);
    }

    .stop-master-detail[b-wcymr9pza2] {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: minmax(250px, 44%) minmax(0, 1fr);
    }

    .stops-timeline[b-wcymr9pza2] {
        padding: 10px;
        border-bottom: 1px solid var(--color-gray-200);
    }

    .stops-timeline[b-wcymr9pza2]::before {
        top: 38px;
        bottom: 38px;
        left: 23px;
    }

    .stop-card[b-wcymr9pza2] {
        grid-template-columns: 26px minmax(0, 1fr);
        gap: 8px;
        min-height: 70px;
    }

    .stop-card-content[b-wcymr9pza2] {
        min-height: 62px;
        padding: 9px 10px;
    }

    .stop-country-flag[b-wcymr9pza2] {
        flex-basis: 20px;
        width: 20px;
        height: 20px;
    }

    .stop-details[b-wcymr9pza2] {
        border-top: 1px solid var(--color-gray-200);
        border-left: 0;
    }

    .stop-details-header[b-wcymr9pza2] {
        min-height: 48px;
        padding-inline: 14px;
    }

    .stop-detail-grid[b-wcymr9pza2] {
        grid-template-columns: 1fr;
        gap: 14px;
        padding: 14px;
    }

    .offerte-empty[b-wcymr9pza2] {
        padding: 18px;
    }

    .offerte-empty__visual[b-wcymr9pza2] {
        width: 170px;
        height: 76px;
    }
}

@media (max-width: 420px) {
    .sidebar-header[b-wcymr9pza2] {
        flex-direction: column;
    }

    .sidebar-header > div:last-child[b-wcymr9pza2] {
        width: 100%;
        justify-content: space-between;
    }

    .sidebar-header span[b-wcymr9pza2] {
        text-align: left;
    }

    .relatie-meta[b-wcymr9pza2] {
        flex-wrap: wrap;
    }

    .regel-detail-header[b-wcymr9pza2] {
        flex-direction: column;
        gap: 8px;
    }

    .stop-status[b-wcymr9pza2] {
        font-size: 10px;
    }

    .stop-detail-grid > span[b-wcymr9pza2] {
        grid-template-columns: 1fr;
        gap: 4px;
    }
}

/* Offerte detail page */
.offerte-page-card[b-wcymr9pza2] {
    width: 100%;
    height: 100%;
    min-width: 0;
    padding: 20px 25px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: auto;
    background: var(--white);
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .06), 0 10px 28px rgba(15, 23, 42, .05);
}

.offerte-page-header[b-wcymr9pza2],
.offerte-page-title[b-wcymr9pza2],
.offerte-rule-section-title[b-wcymr9pza2],
.offerte-rule-route[b-wcymr9pza2],
.offerte-rule-content-header[b-wcymr9pza2],
.offerte-calculation-summary > div[b-wcymr9pza2] {
    display: flex;
    align-items: center;
}

.offerte-rule-edit[b-wcymr9pza2] {
    margin-left: 10px;
}

.offerte-page-header[b-wcymr9pza2] {
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 27px;
}

.offerte-page-title[b-wcymr9pza2] {
    min-width: 0;
    gap: 16px;
}

.offerte-page-title h2[b-wcymr9pza2] {
    margin: 0;
    color: var(--color-secondary-700);
    font-size: var(--fs-h3);
    font-weight: 500;
    line-height: 1.2;
}

.offerte-page-edit[b-wcymr9pza2]  .k-button,
.offerte-page-header[b-wcymr9pza2]  .offerte-page-edit {
    min-width: 0;
    padding: 5px 9px;
    color: var(--color-primary-700);
    background: transparent;
    border: 0;
    box-shadow: none;
}

    .offerte-page-header[b-wcymr9pza2]  .offerte-page-edit .k-svg-icon {
        width: 13px !important;
        height: 13px !important;
        min-width: 12px;
    }

    .offerte-page-header[b-wcymr9pza2]  .offerte-page-edit .k-button-text {
        display: inline-flex;
        align-items: center;
        gap: 7px;
    }

    .offerte-page-header[b-wcymr9pza2]  .offerte-page-edit .k-button-text:hover {
        color: var(--color-primary-900);
    }

.offerte-summary-grid[b-wcymr9pza2] {
    display: grid;
    grid-template-columns: minmax(90px, .8fr) minmax(180px, 1.45fr) repeat(3, minmax(110px, 1fr));
    gap: 18px 28px;
    margin-bottom: 20px;
}

.summary-field[b-wcymr9pza2] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
}

.summary-field small[b-wcymr9pza2] {
    color: var(--color-gray-400);
    font-size: var(--fs-caption);
    line-height: 1.2;
    display: flex;
    align-items: center;
    gap: 5px;
}
.summary-field small[b-wcymr9pza2]  .k-svg-icon {
    width: 11px;
    height: 11px;
}

.summary-field strong[b-wcymr9pza2] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 500;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.summary-field .summary-field--accent[b-wcymr9pza2],
.summary-field--accent[b-wcymr9pza2] {
    color: var(--color-primary-700);
}

.transport-info-panel[b-wcymr9pza2] {
    padding: 15px 18px 17px;
    background: var(--color-gray-30);
    border-radius: 7px;
}

.transport-info-panel h3[b-wcymr9pza2] {
    margin: 0 0 14px;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 600;
}

.transport-info-grid[b-wcymr9pza2] {
    display: grid;
    grid-template-columns: repeat(5, minmax(90px, 1fr)) minmax(150px, 1.7fr);
    gap: 16px 24px;
}

.offerte-page-divider[b-wcymr9pza2] {
    height: 1px;
    margin: 28px 0 26px;
    background: var(--color-gray-100);
}

.offerte-rule-section-title[b-wcymr9pza2] {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: 13px;
}

.offerte-rule-section-title h3[b-wcymr9pza2] {
    margin: 0;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-1);
    font-weight: 500;
}

.offerte-rule-list[b-wcymr9pza2] {
    display: grid;
    gap: 14px;
}

.offerte-rule-card[b-wcymr9pza2] {
    min-width: 0;
    overflow: hidden;
    background: var(--white);
    border: 1px solid var(--color-gray-200);
    border-radius: 7px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.offerte-rule-header[b-wcymr9pza2] {
    display: grid;
    grid-template-columns: 46px minmax(220px, 1fr) 130px 100px 38px 32px;
    align-items: center;
    gap: 12px;
    min-height: 68px;
    padding: 14px 14px;
    cursor: pointer;
}

.offerte-rule-header:hover[b-wcymr9pza2] {
    background: var(--color-selected-bg-soft);
}

.offerte-rule-icon[b-wcymr9pza2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    color: var(--color-primary-700);
    background: var(--color-primary-50);
    border-radius: 5px;
}

.offerte-rule-icon[b-wcymr9pza2]  .k-svg-icon {
    width: 19px;
    height: 19px;
}

.offerte-rule-heading[b-wcymr9pza2] {
    min-width: 0;
}

.offerte-rule-heading > strong[b-wcymr9pza2] {
    display: block;
    margin-bottom: 5px;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-2);
    font-weight: 600;
    overflow-wrap: anywhere;
}

.offerte-rule-route[b-wcymr9pza2] {
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
}

.offerte-rule-route > span[b-wcymr9pza2] {
    min-width: 0;
    overflow-wrap: anywhere;
}

.offerte-rule-route small[b-wcymr9pza2] {
    flex: 0 0 auto;
    padding: 2px 8px;
    color: var(--color-gray-500);
    font-size: 12px;
    line-height: 1.2;
    background: var(--color-gray-100);
    border-radius: 999px;
}

    .offerte-rule-route[b-wcymr9pza2]  .k-svg-icon {
        flex: 0 0 auto;
        width: 13px;
        height: 13px;
    }

.offerte-rule-amount[b-wcymr9pza2] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.offerte-rule-amount small[b-wcymr9pza2] {
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
}

.offerte-rule-amount strong[b-wcymr9pza2] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-2);
    font-weight: 500;
}

.offerte-rule-toggle[b-wcymr9pza2] {
    width: 34px;
    min-width: 34px;
    height: 34px;
}

.offerte-rule-toggle[b-wcymr9pza2]  .k-button {
    width: 100%;
    min-width: 0;
    height: 100%;
    padding: 0;
    color: var(--color-gray-500);
    border: 1px solid var(--color-gray-200);
    background: transparent;
    box-shadow: none;
}

.offerte-rule-toggle[b-wcymr9pza2]  .k-button {
    border-color: transparent;
}

.offerte-rule-content[b-wcymr9pza2] {
    display: grid;
    grid-template-columns: minmax(310px, 42%) minmax(0, 1fr);
    min-width: 0;
    border-top: 1px solid var(--color-gray-200);
}

.offerte-route-column[b-wcymr9pza2],
.offerte-calculation-column[b-wcymr9pza2] {
    min-width: 0;
    padding: 16px 18px 18px;
}

.offerte-route-column[b-wcymr9pza2] {
    border-right: 1px solid var(--color-gray-200);
    background-color: var(--color-gray-30);
}

.offerte-rule-content-header[b-wcymr9pza2] {
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.offerte-route-column h4[b-wcymr9pza2],
.offerte-calculation-column h4[b-wcymr9pza2] {
    margin: 0;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-2);
    font-weight: 550;
}

.offerte-calculation-column > h4[b-wcymr9pza2] {
    margin-bottom: 14px;
}

.offerte-open-map[b-wcymr9pza2]  .k-button,
.offerte-rule-content-header[b-wcymr9pza2]  .offerte-open-map {
    min-height: 28px;
    padding: 3px 10px;
    color: var(--color-secondary-700);
    font-size: var(--fs-caption);
    font-weight: 450;
    background: var(--white);
    border: 1px solid var(--color-gray-200);
    box-shadow: none;
}

    .offerte-rule-content-header[b-wcymr9pza2]  .offerte-open-map .k-button-text {
        display: flex;
        align-items: center;
        gap: 5px;
    }

    .offerte-rule-content-header[b-wcymr9pza2]  .offerte-open-map .k-button-text .k-svg-icon {
        width: 13px;
        height: 13px;
    }

.offerte-card-timeline[b-wcymr9pza2] {
    position: relative;
    display: grid;
    gap: 10px;
    padding-left: 48px;
}

.offerte-card-timeline[b-wcymr9pza2]::before {
    content: "";
    position: absolute;
    top: 28px;
    bottom: 28px;
    left: 12px;
    width: 1px;
    background: var(--color-gray-300);
}

.offerte-card-stop[b-wcymr9pza2] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 58px;
    padding: 9px 12px;
    background: var(--white);
    border: 1px solid var(--color-gray-200);
    border-radius: 6px;
}

.offerte-card-stop-node[b-wcymr9pza2] {
    position: absolute;
    left: -48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 23px;
    height: 23px;
    color: var(--color-primary-700);
    font-size: 11px;
    font-weight: 600;
    background: var(--white);
    border: 1px solid var(--color-primary-700);
    border-radius: 50%;
}

.offerte-card-stop-main[b-wcymr9pza2] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.offerte-card-stop-main > img[b-wcymr9pza2] {
    flex: 0 0 26px;
    width: 26px;
    height: 26px;
    object-fit: cover;
    border-radius: 50%;
    box-shadow: 0 0 0 1px var(--color-gray-200);
}

.offerte-card-stop-main > span[b-wcymr9pza2] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.offerte-card-stop-main strong[b-wcymr9pza2] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 500;
    overflow-wrap: anywhere;
}

.offerte-card-stop-main small[b-wcymr9pza2],
.offerte-card-stop time[b-wcymr9pza2] {
    color: var(--color-gray-400);
    font-size: var(--fs-caption);
}

.offerte-add-stops[b-wcymr9pza2]  .k-button,
.offerte-route-column[b-wcymr9pza2]  .offerte-add-stops {
    display: flex;
    min-width: 0;
    margin: 14px auto 0;
    padding: 4px 8px;
    color: var(--color-primary-700);
    font-size: var(--fs-caption);
    background: transparent;
    border: 0;
    box-shadow: none;
}

.offerte-calculation-grid[b-wcymr9pza2] {
    height: 208px;
    min-width: 0;
    margin-bottom: 12px;
}

.offerte-calculation-grid[b-wcymr9pza2]  .offerte-voorcalculatie-grid {
    border-color: var(--color-gray-200);
    font-size: var(--fs-caption);
}

.offerte-calculation-grid[b-wcymr9pza2]  .k-grid-header {
    color: var(--color-gray-500);
    background: var(--color-gray-30);
}

.offerte-calculation-summary[b-wcymr9pza2] {
    display: grid;
    gap: 9px;
    padding-top: 12px;
    border-top: 1px dashed var(--color-gray-200);
}

.offerte-calculation-summary > div[b-wcymr9pza2] {
    justify-content: space-between;
    gap: 20px;
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
}

.offerte-calculation-summary strong[b-wcymr9pza2] {
    color: var(--color-secondary-700);
    font-weight: 500;
}

.offerte-calculation-total[b-wcymr9pza2] {
    font-size: var(--fs-body-3) !important;
}

.offerte-calculation-total strong[b-wcymr9pza2] {
    font-size: var(--fs-body-1);
    font-weight: 600;
}

.offerte-route-empty[b-wcymr9pza2],
.offerte-rules-empty[b-wcymr9pza2] {
    display: grid;
    place-items: center;
    min-height: 100px;
    padding: 20px;
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
    text-align: center;
    background: var(--color-gray-30);
    border: 1px dashed var(--color-gray-300);
    border-radius: 7px;
}

@media (max-width: 1250px) {
    .offerte-page-card[b-wcymr9pza2] {
        padding: 24px;
    }

    .offerte-summary-grid[b-wcymr9pza2] {
        grid-template-columns: repeat(3, minmax(120px, 1fr));
    }

    .transport-info-grid[b-wcymr9pza2] {
        grid-template-columns: repeat(3, minmax(120px, 1fr));
    }

    .offerte-rule-header[b-wcymr9pza2] {
        grid-template-columns: 42px minmax(180px, 1fr) 115px 92px 36px 30px;
        gap: 9px;
        padding-inline: 11px;
    }

    .offerte-rule-content[b-wcymr9pza2] {
        grid-template-columns: minmax(280px, 39%) minmax(0, 1fr);
    }
}

@media (max-width: 900px) {
    .offerte-rule-header[b-wcymr9pza2] {
        grid-template-columns: 42px minmax(0, 1fr) auto 36px 30px;
    }

    .offerte-rule-amount[b-wcymr9pza2] {
        grid-column: 2;
        grid-row: 2;
        flex-direction: row;
        align-items: center;
    }

    .offerte-rule-header > .grid-status-badge[b-wcymr9pza2] {
        grid-column: 3;
    }

    .offerte-rule-content[b-wcymr9pza2] {
        grid-template-columns: 1fr;
    }

    .offerte-route-column[b-wcymr9pza2] {
        border-right: 0;
        border-bottom: 1px solid var(--color-gray-200);
    }
}

@media (max-width: 768px) {
    .offerte-page-card[b-wcymr9pza2] {
        padding: 20px 18px 26px;
    }

    .offerte-summary-grid[b-wcymr9pza2],
    .transport-info-grid[b-wcymr9pza2] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px 20px;
    }

    .transport-options-field[b-wcymr9pza2] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 600px) {
    .offerte-page-card[b-wcymr9pza2] {
        padding: 17px 14px 22px;
        border-radius: 6px;
    }

    .offerte-page-header[b-wcymr9pza2] {
        align-items: flex-start;
        margin-bottom: 20px;
    }

    .offerte-page-title[b-wcymr9pza2] {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .offerte-page-title h2[b-wcymr9pza2] {
        font-size: var(--fs-h5);
    }

    .offerte-summary-grid[b-wcymr9pza2],
    .transport-info-grid[b-wcymr9pza2] {
        grid-template-columns: 1fr 1fr;
        gap: 14px 16px;
    }

    .summary-field--wide[b-wcymr9pza2],
    .transport-options-field[b-wcymr9pza2] {
        grid-column: 1 / -1;
    }

    .transport-info-panel[b-wcymr9pza2] {
        padding: 14px;
    }

    .offerte-page-divider[b-wcymr9pza2] {
        margin: 22px 0;
    }

    .offerte-rule-header[b-wcymr9pza2] {
        grid-template-columns: 36px minmax(0, 1fr) 32px;
        gap: 8px;
        min-height: 0;
        padding: 12px 10px;
    }

    .offerte-rule-icon[b-wcymr9pza2] {
        grid-column: 1;
        grid-row: 1;
        width: 32px;
        height: 32px;
    }

    .offerte-rule-heading[b-wcymr9pza2] {
        grid-column: 2;
        grid-row: 1;
    }

    .offerte-rule-toggle[b-wcymr9pza2] {
        grid-column: 3;
        grid-row: 1;
    }

    .offerte-rule-amount[b-wcymr9pza2] {
        grid-column: 2;
        grid-row: 2;
    }

    .offerte-rule-header > .grid-status-badge[b-wcymr9pza2] {
        grid-column: 2;
        grid-row: 3;
        justify-self: start;
    }

    .offerte-rule-edit[b-wcymr9pza2] {
        grid-column: 3;
        grid-row: 2;
    }

    .offerte-route-column[b-wcymr9pza2],
    .offerte-calculation-column[b-wcymr9pza2] {
        padding: 14px 12px 16px;
    }

    .offerte-card-timeline[b-wcymr9pza2] {
        padding-left: 38px;
    }

    .offerte-card-stop-node[b-wcymr9pza2] {
        left: -38px;
    }

    .offerte-card-stop[b-wcymr9pza2] {
        grid-template-columns: 1fr;
    }

    .offerte-card-stop time[b-wcymr9pza2] {
        padding-left: 36px;
    }

    .offerte-calculation-grid[b-wcymr9pza2] {
        height: 230px;
    }
}

/* Natural page flow on compact screens: only the offerte list keeps its own scroll. */
@media (max-width: 1020px) {
    .offerte-detail[b-wcymr9pza2] {
        height: auto;
        min-height: 0;
        overflow: visible;
    }

    .offerte-page-card[b-wcymr9pza2] {
        height: auto;
        min-height: 0;
        padding-right: 20px;
        padding-left: 20px;
        overflow: visible;
        overscroll-behavior: auto;
        scrollbar-gutter: auto;
    }
}

@media (max-width: 768px) {
    .offerte-page-card[b-wcymr9pza2] {
        padding-right: 18px;
        padding-left: 18px;
    }
}

@media (max-width: 600px) {
    .offerte-page-card[b-wcymr9pza2] {
        padding-right: 14px;
        padding-left: 14px;
    }
}

@media (max-width: 420px) {
    .offerte-summary-grid[b-wcymr9pza2],
    .transport-info-grid[b-wcymr9pza2] {
        grid-template-columns: 1fr;
    }

    .summary-field--wide[b-wcymr9pza2],
    .transport-options-field[b-wcymr9pza2] {
        grid-column: auto;
    }
}

.offerte-actions-menu[b-wcymr9pza2] {
    position: relative;
}

.offerte-empty-card[b-wcymr9pza2] {
    display: flex;
    flex-direction: column;
    background: var(--white);
}

.offerte-empty-card__placeholder[b-wcymr9pza2] {
    flex: 1 1 auto;
    min-height: 280px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 32px;
    border: 1px dashed var(--color-gray-300);
    border-radius: 8px;
    color: var(--color-gray-500);
    background: var(--white);
    text-align: center;
}

    .offerte-empty-card__placeholder > .offerte-empty__text[b-wcymr9pza2] {
        max-width: 420px;
        display: grid;
        gap: 6px;
    }

    .offerte-empty-card__placeholder strong[b-wcymr9pza2] {
        color: var(--color-secondary-700);
        font-size: var(--fs-h5);
        font-weight: 600;
    }

    .offerte-empty-card__placeholder span[b-wcymr9pza2] {
        line-height: 1.5;
    }

.offerte-actions-dropdown[b-wcymr9pza2] {
    position: absolute;
    z-index: 1000;
    top: calc(100% + 6px);
    right: 0;
    width: 190px;
    padding: 6px;
    border: 1px solid var(--color-gray-200);
    border-radius: 7px;
    background: white;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .04);
}

    .offerte-actions-dropdown button[b-wcymr9pza2] {
        width: 100%;
        display: flex;
        align-items: center;
        gap: 9px;
        padding: 9px 10px;
        border: 0;
        border-radius: 5px;
        color: var(--color-secondary-700);
        background: transparent;
        text-align: left;
    }

        .offerte-actions-dropdown button:hover[b-wcymr9pza2] {
            background: var(--color-gray-50);
        }

        .offerte-actions-dropdown button.is-danger[b-wcymr9pza2] {
            color: var(--color-danger-700);
        }

.offerte-rule-edit[b-wcymr9pza2] {
    display: flex;
    align-items: center;
    justify-self: end;
    gap: 5px;
    margin-left: 0;
    white-space: nowrap;
}

.offerte-rule-header[b-wcymr9pza2] {
    grid-template-columns: 46px minmax(220px, 1fr) 130px max-content max-content 32px !important;
}

    .offerte-rule-header > .grid-status-badge[b-wcymr9pza2] {
        justify-self: end;
        white-space: nowrap;
    }

@media (max-width: 1250px) {
    .offerte-rule-header[b-wcymr9pza2] {
        grid-template-columns: 42px minmax(180px, 1fr) 115px max-content max-content 30px !important;
    }
}

@media (max-width: 900px) {
    .offerte-rule-header[b-wcymr9pza2] {
        grid-template-columns: 42px minmax(0, 1fr) auto auto 30px !important;
    }
}

@media (max-width: 600px) {
    .offerte-rule-header[b-wcymr9pza2] {
        grid-template-columns: 36px minmax(0, 1fr) auto !important;
    }

    .offerte-rule-edit[b-wcymr9pza2] {
        grid-column: 3;
        grid-row: 2;
    }
}
/* _content/eLipsOnline/Components/Pages/GridLayoutEditor.razor.rz.scp.css */
.grid-layout-editor-host[b-i3i523isl5] {
    display: contents;
}

    [b-i3i523isl5] .grid-layout-editor-host .k-window-titlebar {
        border-bottom: none;
    }

.grid-title[b-i3i523isl5] {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-bottom: 7px;
}

.grid-title strong[b-i3i523isl5] {
    color: var(--color-secondary-700);
    font-weight: 550;
}

.grid-name-label[b-i3i523isl5] {
    display: flex;
    align-content: center;
    align-items: center;
    gap: 10px;
    color: var(--color-primary-700);
    font-weight: 500;
    padding: 0 0 15px 0;
}

.grid-name-label h4[b-i3i523isl5] {
   margin: 0;
}

.grid-column-title h2[b-i3i523isl5] {
    line-height: 1.2;
    margin: 0 0 8px;
}

.grid-column-title p[b-i3i523isl5] {
    line-height: 1.45;
    margin: 0;
    font-weight: 400;
}

.grid-column-window-content[b-i3i523isl5] {
    display: flex;
    flex: 1;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    padding: 15px 15px 20px 25px;
    background-color: var(--color-gray-50);
}

.grid-column-editor[b-i3i523isl5] {
    display: grid;
    flex: 1;
    grid-template-columns: minmax(260px, 1fr) 56px minmax(260px, 1fr) 56px;
    gap: 14px;
    align-items: stretch;
    min-height: 0;
}

.column-card[b-i3i523isl5] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    padding: 16px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

[b-i3i523isl5] .gridLayoutPopup {
    flex: 1 1 0;
    min-height: 0;
    overflow: hidden;
}

[b-i3i523isl5] .gridLayoutPopup .k-grid-aria-root,
[b-i3i523isl5] .gridLayoutPopup .k-grid-container {
    height: 100%;
    min-height: 0;
}

[b-i3i523isl5] .gridLayoutPopup .k-grid-content {
    height: 100%;
    min-height: 0;
    overflow-y: auto;
}

[b-i3i523isl5] .gridLayoutPopup .k-grid-norecords {
    height: 100%;
}

[b-i3i523isl5] .gridLayoutPopup .k-grid-norecords-template {
    height: 100%;
    padding: 0;
    width: 100%;
}

.column-card-header[b-i3i523isl5] {
    align-items: center;
    display: flex;
    justify-content: space-between;
    flex: 0 0 auto;
    margin-bottom: 5px;
}

.colum-card-description[b-i3i523isl5] {
    margin-bottom: 15px;
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
    font-weight: 350;
}

.column-count[b-i3i523isl5] {
    background: var(--color-gray-100);
    border-radius: 6px;
    color: #6b7280;
    font-size: var(--fs-body-3);
    font-weight: 500;
    line-height: 1;
    padding: 7px 10px;
}

.column-count--active[b-i3i523isl5] {
    background: var(--color-primary-50);
    color: var(--color-primary-700);
}

[b-i3i523isl5] .column-search {
    border-color: #dfe3e8;
    border-radius: 4px;
    box-shadow: none;
    color: #111827;
    flex: 0 0 auto;
    font-size: .95rem;
    height: 38px;
    margin-bottom: 12px;
}

[b-i3i523isl5] .column-search .k-input-inner {
    padding-inline: 10px;
}

[b-i3i523isl5] .column-search .k-input-prefix {
    color: #6b7280;
    padding-left: 12px;
}

.column-drag-handle[b-i3i523isl5] {
    color: #9ca3af;
    cursor: grab;
    font-size: 20px;
    line-height: 1;
    vertical-align: middle;
}

[b-i3i523isl5] .gridLayoutPopup .k-checkbox {
    border-color: #d1d5db;
    border-radius: 4px;
    height: 18px;
    width: 18px;
}

[b-i3i523isl5] .gridLayoutPopup .k-checkbox:checked,
[b-i3i523isl5] .gridLayoutPopup .k-checkbox.k-checked {
    background-color: #0ea5d7;
    border-color: #0ea5d7;
}

.column-action-bar[b-i3i523isl5] {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: center;
}

[b-i3i523isl5] .column-action-btn {
    background-color: white;
    border: 1px solid var(--color-gray-200);
    border-radius: 6px;
    height: 38px;
    padding: 0;
    width: 38px;
}

[b-i3i523isl5] .column-action-icon {
    color: var(--color-primary-700);
    height: 18px;
    width: 18px;
}

[b-i3i523isl5] .column-action-icon svg {
    fill: currentColor;
}

[b-i3i523isl5] .column-action-btn.k-disabled .column-action-icon,
[b-i3i523isl5] .column-action-btn:disabled .column-action-icon {
    color: var(--color-gray-400);
}

.payment-window-actions[b-i3i523isl5] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}


@media (max-width: 980px) {
    [b-i3i523isl5] .grid-column-window {
        height: calc(100vh - 24px) !important;
        width: calc(100vw - 24px) !important;
    }

    .grid-column-editor[b-i3i523isl5] {
        grid-template-columns: 1fr;
        overflow-y: auto;
    }

    .column-action-bar[b-i3i523isl5] {
        flex-direction: row;
    }
}
/* _content/eLipsOnline/Components/Pages/InboekSchermen/ContainerInboek - Copy.razor.rz.scp.css */

/* dropzone style */
.drop-zone[b-otutbomx7b] {
    margin-top:-10px;
    margin-left:-10px;
    max-height: 130px; /* vaste hoogte */
    min-height:130px;
    overflow-y: auto;
    min-width: 250px;
    max-width:250px;
    border: 2px dashed #bbb;
    border-radius: 6px;
    padding: 20px;
    text-align: center;
    color: #666;
    font-size: 0.9rem;
    cursor: pointer;
    background: #fafafa;
}

.drop-zone.hover[b-otutbomx7b]
{
        border-color: #007bff;
        color: #007bff;
        background: #f0f8ff;
}

.remove-button[b-otutbomx7b] {
    background-color: #9c1818; /* Red background */
    border: none;
    color: white;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    border-radius: 30%; /* Circular button */
    width: 25px; /* Fixed width */
    height: 20px; /* Fixed height */
    line-height: 20px; /* Match the height to vertically center the '-' */
    padding: 0; /* Reset padding */
    font-weight: bold;
}

    .remove-button:hover[b-otutbomx7b] {
        background-color: #601515; /* Darker shade of red */
    }
/* _content/eLipsOnline/Components/Pages/InboekSchermen/ContainerInboek.razor.rz.scp.css */
.inboek-page[b-786gqsaaei] {
    --inboek-gap: clamp(0.3rem, 0.7vw, 0.7rem);
    --inboek-page-padding: 16px;
    --inboek-border: 1px solid var(--color-gray-200);
    --inboek-bottom-bg: #d9d9d9;
    --inboek-button-bg: #555;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    color: var(--text-primary, #050505);
    background: var(--color-gray-50);
}

.inboek-header[b-786gqsaaei] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 10px var(--inboek-page-padding) 0.5rem;
}

.inboek-title[b-786gqsaaei] {
    margin: 0;
}

.inboek-header-actions[b-786gqsaaei] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.inboek-upper[b-786gqsaaei] {
    padding: 0 var(--inboek-page-padding) 0.5rem;
    /*    background: #fff;*/
}

.upper-grid[b-786gqsaaei] {
    display: grid;
    grid-template-columns: minmax(390px, 1.55fr) minmax(470px, 1.45fr) minmax(170px, 0.58fr);
    /*    grid-template-columns: minmax(320px, 1.2fr) minmax(500px, 1.7fr);*/
    gap: var(--inboek-gap);
    align-items: stretch;
}

.wire-group[b-786gqsaaei],
.wire-field[b-786gqsaaei] {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.wire-field[b-786gqsaaei] {
    display: flex;
    flex-direction: column;
}

    .wire-field .wire-box[b-786gqsaaei] {
        flex: 1 1 auto;
    }

.order-grid[b-786gqsaaei],
.extra-grid[b-786gqsaaei],
.container-grid[b-786gqsaaei],
.container-row[b-786gqsaaei] {
    display: grid;
    gap: var(--inboek-gap);
    min-width: 0;
}

.order-grid[b-786gqsaaei] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    height: 100%;
}

.container-grid[b-786gqsaaei] {
    grid-template-rows: max-content max-content;
    align-content: space-between;
    height: 100%;
}

.container-row-top[b-786gqsaaei] {
    /*    grid-template-columns: minmax(0, 0.65fr) repeat(2, minmax(0, 1fr));*/
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.container-row-bottom[b-786gqsaaei] {
    /*    grid-template-columns: repeat(4, minmax(0, 1fr));*/
    /*    grid-template-columns: 1fr 1fr 1.5fr;*/
    /*    grid-template-columns: 0.8fr 0.8fr 1.7fr;*/
    /*    grid-template-columns: repeat(3, minmax(0, 1fr));*/
    grid-template-columns: 1.2fr 1fr 0.8fr;
}

.extra-grid[b-786gqsaaei] {
    grid-template-rows: repeat(2, minmax(0, 1fr));
}

.wire-box[b-786gqsaaei],
.wire-panel[b-786gqsaaei] {
    min-width: 0;
    min-height: 11rem;
    display: flex;
    border: var(--inboek-border);
    border-radius: 5px;
    background: var(--white);
    line-height: 1;
}

.wire-box-tall[b-786gqsaaei] {
    min-height: clamp(18rem, 30vh, 25rem);
}

.wire-attachments-group[b-786gqsaaei],
.wire-attachments-field[b-786gqsaaei] {
    height: 100%;
    min-height: 0;
}

.wire-attachments-panel[b-786gqsaaei] {
    min-height: 0;
    overflow: hidden;
}

.inboek-lower[b-786gqsaaei] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    padding: 0.5rem var(--inboek-page-padding) 1rem;
    background: var(--color-gray-50);
}

.lower-grid[b-786gqsaaei] {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(350px, 20%);
    gap: 10px;
    align-items: stretch;
}

.activities-column[b-786gqsaaei],
.side-column[b-786gqsaaei] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.activities-toolbar[b-786gqsaaei] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 10px;
}

    .activities-toolbar .wire-button[b-786gqsaaei] {
        flex: 0 0 auto;
    }

.side-column[b-786gqsaaei] {
    min-height: 0;
}

.side-panel[b-786gqsaaei] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.action-bar[b-786gqsaaei] {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
}

.wire-panel[b-786gqsaaei] {
    flex: 1 1 auto;
    min-height: clamp(14rem, 32vh, 28rem);
}


.wire-button[b-786gqsaaei] {
    border: 0;
    padding: 0.45rem 1.2rem;
    color: #fff;
    background: var(--inboek-button-bg);
    font: inherit;
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
}

    .wire-button:hover[b-786gqsaaei],
    .wire-button:focus-visible[b-786gqsaaei] {
        background: #333;
    }

@media (max-width: 1199.98px) {
    .upper-grid[b-786gqsaaei] {
        grid-template-columns: 1fr;
    }

    .order-grid[b-786gqsaaei] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .container-row-top[b-786gqsaaei],
    .container-row-bottom[b-786gqsaaei] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .wire-box-tall[b-786gqsaaei],
    .extra-grid[b-786gqsaaei] {
        min-height: 17rem;
    }

    .inboek-lower[b-786gqsaaei] {
        flex: 0 0 auto;
        min-height: auto;
    }

    .lower-grid[b-786gqsaaei] {
        grid-template-columns: 1fr;
    }

    .side-column[b-786gqsaaei],
    .activity-panel[b-786gqsaaei],
    .side-panel[b-786gqsaaei] {
        min-height: 18rem;
    }
}

@media (max-width: 575.98px) {
    .inboek-title[b-786gqsaaei] {
        margin-inline: 0.85rem;
    }

    .inboek-upper[b-786gqsaaei],
    .inboek-lower[b-786gqsaaei] {
        padding-inline: 0.85rem;
    }

    .order-grid[b-786gqsaaei],
    .container-row-top[b-786gqsaaei],
    .container-row-bottom[b-786gqsaaei] {
        grid-template-columns: 1fr;
    }

    .extra-grid[b-786gqsaaei],
    .container-grid[b-786gqsaaei] {
        grid-template-rows: none;
    }

    .wire-box[b-786gqsaaei],
    .wire-box-tall[b-786gqsaaei],
    .wire-panel[b-786gqsaaei],
    .side-panel[b-786gqsaaei] {
        min-height: 12rem;
    }

    .action-bar[b-786gqsaaei] {
        flex-direction: column;
    }

    .wire-button[b-786gqsaaei] {
        width: 100%;
    }
}

/* Form box */
.profile-dd .form-box .checkbox-box-xs[b-786gqsaaei] {
    box-shadow: none!important;
}

.form-row-temp[b-786gqsaaei] {
    align-items: center;
}

.temp-fields[b-786gqsaaei] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.35rem;
    min-width: 0;
}

.temp-field[b-786gqsaaei] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.12rem;
}

.temp-field-label[b-786gqsaaei] {
    color: var(--color-gray-500);
    font-size: 0.65rem;
    font-weight: 500;
    line-height: 1;
}


.form-control[b-786gqsaaei] {
    width: 100%;
    min-width: 0;
    height: 1.8rem;
    border: 1px solid #ddd;
    border-radius: 3px;
    padding: 0.25rem 0.45rem;
    font: inherit;
}

.checkbox-box[b-786gqsaaei] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.6rem;
    padding: 0.7rem 1rem;
    font-size: 0.9rem;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.checkbox-box-xs[b-786gqsaaei] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.6rem;
    font-size: 0.9rem;
    padding-bottom: 10px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.checkbox-row[b-786gqsaaei] {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    margin: 0;
    line-height: 1.2;
}

    .checkbox-row input[b-786gqsaaei] {
        width: 1rem;
        height: 1rem;
    }

.temp-inputs[b-786gqsaaei] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
    min-width: 0;
}

.side-panel-content[b-786gqsaaei] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0.75rem;
    padding: 10px;
    min-height: 0;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.side-toolbar[b-786gqsaaei] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.side-toolbar-buttons[b-786gqsaaei] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
}

.side-toolbar-search[b-786gqsaaei] {
    min-width: 0;
}

.side-toolbar-delete[b-786gqsaaei] {
    margin-left: auto;
}

.side-panel-body[b-786gqsaaei] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding-right: 4px;
}

.container-empty-state[b-786gqsaaei] {
    min-height: 8rem;
    height: 100%;
    display: grid;
    place-items: center;
    padding: 1.5rem;
    border: 1px dashed var(--color-gray-300);
    border-radius: 6px;
    background: var(--color-gray-30);
    text-align: center;
}

@media (max-width: 2000px) {
    .side-toolbar-buttons[b-786gqsaaei] {
        flex-wrap: wrap;
    }

    .side-toolbar-search[b-786gqsaaei] {
        flex: 1 1 100%;
        width: 100%;
    }
}

.activity-item[b-786gqsaaei] {
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--color-gray-200);
    border-left: 3px solid var(--color-primary-700);
    border-radius: 5px;
    background: var(--white);
}

.activity-timeline-item[b-786gqsaaei] {
    position: relative;
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 0.75rem;
    margin-bottom: 0.65rem;
}

.activity-timeline-rail[b-786gqsaaei] {
    position: relative;
    display: grid;
    grid-template-rows: auto auto auto 1fr auto;
    justify-items: center;
    align-items: start;
    gap: 0.35rem;
    min-height: 7rem;
    padding: 0.35rem 0 0.15rem;
    border-radius: 6px;
}

.activity-timeline-rail[b-786gqsaaei]::before {
    content: "";
    position: absolute;
    top: 3.55rem;
    bottom: -0.9rem;
    left: 50%;
    width: 2px;
    background: var(--color-gray-300, #c7cdd2);
    transform: translateX(-50%);
}

.activity-timeline-item:last-child .activity-timeline-rail[b-786gqsaaei]::before {
    bottom: 0.8rem;
}

.activity-timeline-date[b-786gqsaaei] {
    position: relative;
    z-index: 2;
    min-width: 2.5rem;
    padding: 0.2rem 0.45rem;
    border: 1px solid color-mix(in srgb, var(--color-primary-700) 18%, transparent);
    border-radius: 999px;
    color: var(--color-primary-700);
    background: color-mix(in srgb, var(--color-primary-700) 8%, var(--white));
    font-weight: 600;
    font-size: var(--fs-caption);
    line-height: 1.1;
    text-align: center;
}

.activity-timeline-time[b-786gqsaaei] {
    position: relative;
    z-index: 1;
    align-self: start;
    padding: 0.1rem 0.3rem;
    font-size: var(--fs-caption);
    color: var(--color-gray-600);
    border-radius: 3px;
    background: var(--white);
    white-space: nowrap;
}

.activity-timeline-time-end[b-786gqsaaei] {
    align-self: end;
    margin-bottom: 0.15rem;
}

.activity-timeline-marker[b-786gqsaaei] {
    position: relative;
    z-index: 1;
    display: inline-flex;
    width: 25px;
    height: 25px;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    color: white;
    background: var(--color-primary-700);
    font-weight: 600;
    box-shadow: 0 0 0 3px var(--white), 0 2px 6px rgba(0, 0, 0, 0.12);
}

.activity-div[b-786gqsaaei] {
    min-width: 0;
}

.activity-primary[b-786gqsaaei] {
    display: grid;
    grid-template-columns: minmax(8rem, 0.8fr) minmax(8.5rem, 0.8fr) minmax(15rem, 1.6fr) auto;
    grid-template-areas: "main time location actions";
    align-items: start;
    gap: 1rem;
    min-width: 0;
    padding: 16px;
}

.activity-cell[b-786gqsaaei] {
    min-width: 0;
}

.activity-cell-order[b-786gqsaaei] {
    grid-area: order;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.55rem;
}

.activity-order[b-786gqsaaei] {
    text-align: center;
    background-color: #eee;
    font-weight: 500;
}

.activity-cell-main[b-786gqsaaei] {
    grid-area: main;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.activity-cell-time[b-786gqsaaei] {
    grid-area: time;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.activity-time-row[b-786gqsaaei] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
    min-width: 0;
}

.activity-time-row .time-input[b-786gqsaaei] {
    width: 100%;
    min-width: 0;
}

.activity-cell-location[b-786gqsaaei] {
    grid-area: location;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    align-items: stretch;
}

.activity-cell-notes[b-786gqsaaei] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.2rem;
    min-width: 0;
    margin: 0;
    border-top: 1px solid var(--color-gray-200);
    background-color: var(--color-gray-30);
    padding: 10px 16px 16px;
}

.activity-cell-notes label[b-786gqsaaei] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.activity-cell-notes label span[b-786gqsaaei] {
    font-size: var(--fs-caption);
    color: var(--color-gray-800);
    font-weight: 450;
    padding-bottom: 4px;
}

.activity-div[b-786gqsaaei]  .k-textarea,
.activity-div[b-786gqsaaei]  .k-input,
.activity-div[b-786gqsaaei]  .k-picker,
.activity-div[b-786gqsaaei]  .k-dropdownlist,
.activity-div[b-786gqsaaei]  .k-combobox {
    width: 100%;
    max-width: 100%;
}

.activity-actions[b-786gqsaaei] {
    grid-area: actions;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.5rem;
    justify-content: flex-end;
    align-self: start;
}

.activity-actions-row[b-786gqsaaei] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
}

.activities-column[b-786gqsaaei] {
    min-height: 0;
}

.activity-panel[b-786gqsaaei] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 10px 0 16px 0px;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.activity-panel .activities-toolbar[b-786gqsaaei] {
    padding-right: 16px;
    padding-left: 16px;
}

.activity-sortable[b-786gqsaaei] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding-right: 16px;
    box-sizing: border-box;
}

.activity-empty-state[b-786gqsaaei] {
    min-height: 13rem;
    height: 100%;
    margin-left: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 2rem;
    border: 1px dashed var(--color-gray-300);
    border-radius: 6px;
    background: var(--color-gray-30);
    text-align: center;
}

.activity-empty-state-icon[b-786gqsaaei] {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    color: var(--color-primary-700);
    background: color-mix(in srgb, var(--color-primary-700) 9%, var(--white));
}

.activity-empty-state-content[b-786gqsaaei] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.activity-empty-state-title[b-786gqsaaei] {
    font-weight: 600;
}

.activity-empty-state-text[b-786gqsaaei] {
    max-width: 325px;
    color: var(--color-gray-500);
}

.badge-container[b-786gqsaaei] {
    position: relative;
    display: inline-flex;
}

.badge[b-786gqsaaei] {
    position: absolute;
    top: -0.45rem;
    right: -0.45rem;
    min-width: 1.1rem;
    height: 1.1rem;
    border-radius: 999px;
    background: #dc3545;
    color: #fff;
    font-size: 0.75rem;
    line-height: 1.1rem;
    text-align: center;
}

@media (max-width: 1199.98px) {
    .activity-primary[b-786gqsaaei] {
        grid-template-columns: minmax(11rem, 1fr) minmax(9rem, 0.9fr) auto;
        grid-template-areas:
            "main time actions"
            "location location actions";
    }
}

@media (max-width: 767.98px) {
    .activity-timeline-item[b-786gqsaaei] {
        grid-template-columns: 60px minmax(0, 1fr);
        gap: 0.4rem;
    }

    .activity-primary[b-786gqsaaei] {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "main actions"
            "time actions"
            "location actions";
    }

    .activity-cell-notes[b-786gqsaaei] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {
    .activity-primary[b-786gqsaaei] {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
            "main"
            "time"
            "location"
            "actions";
    }
    
    .activity-actions[b-786gqsaaei] {
        width: 100%;
        justify-content: flex-end;
    }
}

.container-card[b-786gqsaaei] {
    position: relative;
    margin-bottom: 0.5rem;
    border: 1px solid var(--color-gray-200, #dadfe2);
    border-radius: 5px;
    background: #fff;
    cursor: pointer;
    overflow: hidden;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.container-card:hover[b-786gqsaaei] {
    border-color: var(--color-gray-300, #c8d0d8);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.container-card:focus-visible[b-786gqsaaei] {
    outline: 2px solid var(--kendo-color-primary, #0d6efd);
    outline-offset: 2px;
}

.container-card-header[b-786gqsaaei] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem;
}

.container-card-summary[b-786gqsaaei] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.container-card-icon[b-786gqsaaei] {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 5px;
    color: var(--white, #fff);
    background: var(--color-primary-500, #0ea5e9);
}

.container-title[b-786gqsaaei] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
    flex: 1 1 auto;
}

.container-title p[b-786gqsaaei] {
    color: var(--color-secondary-700);
    margin: 0;
    padding: 0;
    font-size: var(--fs-body-3);
    font-weight: 600;
}

.container-title span[b-786gqsaaei] {
    color: var(--color-gray-500);
     font-size: var(--fs-caption);
}

.container-actions[b-786gqsaaei] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex: 0 0 auto;
}

.selected-container[b-786gqsaaei] {
    border-color: var(--color-selected-border);
    background: var(--color-selected-bg);
}

.time-input[b-786gqsaaei] {
    width: 90px;
    height: 32px;
    box-sizing: border-box;
    border: 1px solid var(--kendo-color-border, #d1d5db);
    border-radius: 4px;
    padding: 0 0.5rem;
    background-color: var(--kendo-color-surface, #fff);
    color: var(--kendo-color-on-app-surface, #1f2937);
    font: inherit;
    font-size: 0.875rem;
    line-height: 1.4;
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

    .time-input:hover[b-786gqsaaei] {
        border-color: var(--kendo-color-border-alt, #b8bec8);
    }

    .time-input:focus[b-786gqsaaei],
    .time-input:focus-visible[b-786gqsaaei] {
        border-color: var(--kendo-color-primary, #0d6efd);
        box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-primary, #0d6efd) 20%, transparent);
    }

    .time-input:disabled[b-786gqsaaei],
    .time-input[readonly][b-786gqsaaei] {
        background-color: var(--kendo-color-surface-alt, #f3f4f6);
        color: var(--kendo-color-disabled-text, #9ca3af);
        cursor: not-allowed;
    }

.container-activities[b-786gqsaaei] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0;
    padding: 0.75rem;
    border-top: 1px solid var(--color-gray-200, #dadfe2);
    border-radius: 0;
    background: var(--color-gray-50);
}

.container-activities[b-786gqsaaei]::before {
    content: "";
    position: absolute;
    top: 1.25rem;
    bottom: 1.25rem;
    left: 1.25rem;
    border-left: 1px dashed var(--color-gray-300);
}

.activity-row[b-786gqsaaei] {
    position: relative;
    display: grid;
    grid-template-columns: 1rem minmax(0, 1fr);
    align-items: center;
    gap: 10px;
}

.activity-row__timeline[b-786gqsaaei] {
    position: relative;
    z-index: 1;
    display: grid;
    place-items: center;
}

.activity-row__marker[b-786gqsaaei] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--color-primary-500, #0ea5e9);
}

.activity-row__content[b-786gqsaaei] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-width: 0;
    padding: 8px 10px;
    border: 1px solid var(--color-gray-200, #dadfe2);
    border-radius: 5px;
    background: var(--white, #fff);
}

.activity-row__details[b-786gqsaaei],
.activity-row__schedule[b-786gqsaaei] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.activity-row__type[b-786gqsaaei] {
    color: var(--color-secondary-700);
    font-size: var(--fs-caption);
    font-weight: 500;
}

.activity-row__date[b-786gqsaaei] {
    display: flex;
    align-items: center;
    gap: 4px;
    color: var(--color-gray-500);
    font-size: 12px;
    white-space: nowrap;
}

.activity-row__date[b-786gqsaaei]  .k-svg-icon svg {
    width: 12px;
    height: 12px;
}

.activity-row__meta[b-786gqsaaei] {
    color: var(--color-gray-500);
    font-size: 12px;
}

.activity-empty[b-786gqsaaei] {
    padding: 12px;
    border-radius: 6px;
    background: var(--color-gray-50);
    color: var(--color-gray-500);
    font-size: 13px;
    text-align: center;
}

.required-label[b-786gqsaaei]::after {
    content: "*";
    margin-left: 4px;
    color: var(--color-danger-500);
    font-weight: 700;
}

.lading-badge[b-786gqsaaei] {
    position: absolute;
    top: -7px;
    right: -7px;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: var(--color-primary-700);
    color: white;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    z-index: 10;
    transition: all 0.2s ease;
}

.form-row-split[b-786gqsaaei] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.35rem;
    min-width: 0;
}

@media (max-width: 575.98px) {
    .form-row-split[b-786gqsaaei] {
        grid-template-columns: 1fr;
    }
}

.optional-elements-box[b-786gqsaaei] {
    max-height: 11rem;
    min-height: 0;
    overflow: hidden;
}

@media (min-width: 1200px) {
    .container-row-bottom[b-786gqsaaei] {
        height: 11.25rem;
    }

    .container-row-bottom > .wire-field[b-786gqsaaei],
    .container-row-bottom > .wire-field > .wire-box[b-786gqsaaei] {
        height: 100%;
        min-height: 0;
    }

    .container-row-bottom .optional-elements-box[b-786gqsaaei] {
        max-height: none;
    }
}

.activity-details-toggle[b-786gqsaaei] {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    color: var(--color-gray-500);
    background: transparent;
    cursor: pointer;
}

[b-786gqsaaei] .activity-details-chevron {
    display: inline-flex;
    transform: rotate(0deg);
    transform-origin: center;
    transition: transform 0.2s ease;
}

[b-786gqsaaei] .activity-details-chevron.is-open {
    transform: rotate(180deg);
}

.optional-elements-list[b-786gqsaaei] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    padding-right: 4px;
    width: 100%;
}

/* _content/eLipsOnline/Components/Pages/InboekSchermen/ContainerInboekSecondDesign.razor.rz.scp.css */
.inboek-page[b-3mt9ik8xfu] {
    --inboek-gap: clamp(0.3rem, 0.7vw, 0.7rem);
    --inboek-page-padding: 16px;
    --inboek-border: 1px solid var(--color-gray-200);
    --inboek-bottom-bg: #d9d9d9;
    --inboek-button-bg: #555;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    color: var(--text-primary, #050505);
    background: #fff;
}

.inboek-header[b-3mt9ik8xfu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 10px var(--inboek-page-padding) 0.5rem;
}

.inboek-title[b-3mt9ik8xfu] {
    margin: 0;
}

.inboek-header-actions[b-3mt9ik8xfu] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.inboek-upper[b-3mt9ik8xfu] {
    padding: 0 var(--inboek-page-padding) 16px;
    background: #fff;
}

.upper-grid[b-3mt9ik8xfu] {
    display: grid;
    grid-template-columns: minmax(390px, 1.55fr) minmax(470px, 1.45fr) minmax(170px, 0.58fr);
    /*    grid-template-columns: minmax(320px, 1.2fr) minmax(500px, 1.7fr);*/
    gap: var(--inboek-gap);
    align-items: stretch;
}

.wire-group[b-3mt9ik8xfu],
.wire-field[b-3mt9ik8xfu] {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.wire-field[b-3mt9ik8xfu] {
    display: flex;
    flex-direction: column;
}

    .wire-field legend[b-3mt9ik8xfu] {
        width: auto;
        margin: 0 0 -0.6rem 2rem;
        padding: 0 0.9rem;
        float: none;
        position: relative;
        z-index: 1;
        background: #fff;
        font-size: var(--fs-caption);
        color: var(--color-gray-400);
        line-height: 1.2;
        font-weight: 300;
    }

    .wire-field .wire-box[b-3mt9ik8xfu] {
        flex: 1 1 auto;
    }

.order-grid[b-3mt9ik8xfu],
.extra-grid[b-3mt9ik8xfu],
.container-grid[b-3mt9ik8xfu],
.container-row[b-3mt9ik8xfu] {
    display: grid;
    gap: var(--inboek-gap);
    min-width: 0;
}

.order-grid[b-3mt9ik8xfu] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    height: 100%;
}

.container-grid[b-3mt9ik8xfu] {
    grid-template-rows: minmax(0, 1.2fr) minmax(0, 1fr);
    height: 100%;
}

.container-row-top[b-3mt9ik8xfu] {
    /*    grid-template-columns: minmax(0, 0.65fr) repeat(2, minmax(0, 1fr));*/
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.container-row-bottom[b-3mt9ik8xfu] {
    /*    grid-template-columns: repeat(4, minmax(0, 1fr));*/
    /*    grid-template-columns: 1fr 1fr 1.5fr;*/
    /*    grid-template-columns: 0.8fr 0.8fr 1.7fr;*/
    /*    grid-template-columns: repeat(3, minmax(0, 1fr));*/
    grid-template-columns: 1fr 1fr 0.9fr;
}

.extra-grid[b-3mt9ik8xfu] {
    grid-template-rows: repeat(2, minmax(0, 1fr));
}

.wire-box[b-3mt9ik8xfu],
.wire-panel[b-3mt9ik8xfu] {
    min-width: 0;
    min-height: 11rem;
    display: flex;
    border: var(--inboek-border);
    border-radius: 5px;
    background: #fff;
    line-height: 1;
}

.wire-box-tall[b-3mt9ik8xfu] {
    min-height: clamp(18rem, 30vh, 25rem);
}

.wire-attachments-group[b-3mt9ik8xfu],
.wire-attachments-field[b-3mt9ik8xfu] {
    height: 100%;
    min-height: 0;
}

.wire-attachments-panel[b-3mt9ik8xfu] {
    min-height: 0;
    overflow: hidden;
}

.inboek-lower[b-3mt9ik8xfu] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    padding: 1rem var(--inboek-page-padding) 1rem;
    background: var(--color-gray-50);
}

.lower-grid[b-3mt9ik8xfu] {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 18%);
    gap: 10px;
    align-items: stretch;
}

.activities-column[b-3mt9ik8xfu],
.side-column[b-3mt9ik8xfu] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
}

.activities-toolbar[b-3mt9ik8xfu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

    .activities-toolbar .wire-button[b-3mt9ik8xfu] {
        flex: 0 0 auto;
    }

.side-column[b-3mt9ik8xfu] {
    min-height: 0;
}

.side-panel[b-3mt9ik8xfu] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.action-bar[b-3mt9ik8xfu] {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
}

.wire-panel[b-3mt9ik8xfu] {
    flex: 1 1 auto;
    min-height: clamp(14rem, 32vh, 28rem);
}


.wire-button[b-3mt9ik8xfu] {
    border: 0;
    padding: 0.45rem 1.2rem;
    color: #fff;
    background: var(--inboek-button-bg);
    font: inherit;
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
}

    .wire-button:hover[b-3mt9ik8xfu],
    .wire-button:focus-visible[b-3mt9ik8xfu] {
        background: #333;
    }

@media (max-width: 1199.98px) {
    .upper-grid[b-3mt9ik8xfu] {
        grid-template-columns: 1fr;
    }

    .order-grid[b-3mt9ik8xfu] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .container-row-top[b-3mt9ik8xfu],
    .container-row-bottom[b-3mt9ik8xfu] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .wire-box-tall[b-3mt9ik8xfu],
    .extra-grid[b-3mt9ik8xfu] {
        min-height: 17rem;
    }

    .inboek-lower[b-3mt9ik8xfu] {
        flex: 0 0 auto;
        min-height: auto;
    }

    .lower-grid[b-3mt9ik8xfu] {
        grid-template-columns: 1fr;
    }

    .side-column[b-3mt9ik8xfu],
    .activity-panel[b-3mt9ik8xfu],
    .side-panel[b-3mt9ik8xfu] {
        min-height: 18rem;
    }
}

@media (max-width: 575.98px) {
    .inboek-title[b-3mt9ik8xfu] {
        margin-inline: 0.85rem;
    }

    .inboek-upper[b-3mt9ik8xfu],
    .inboek-lower[b-3mt9ik8xfu] {
        padding-inline: 0.85rem;
    }

    .order-grid[b-3mt9ik8xfu],
    .container-row-top[b-3mt9ik8xfu],
    .container-row-bottom[b-3mt9ik8xfu] {
        grid-template-columns: 1fr;
    }

    .extra-grid[b-3mt9ik8xfu],
    .container-grid[b-3mt9ik8xfu] {
        grid-template-rows: none;
    }

    .wire-box[b-3mt9ik8xfu],
    .wire-box-tall[b-3mt9ik8xfu],
    .wire-panel[b-3mt9ik8xfu],
    .side-panel[b-3mt9ik8xfu] {
        min-height: 12rem;
    }

    .action-bar[b-3mt9ik8xfu] {
        flex-direction: column;
    }

    .wire-button[b-3mt9ik8xfu] {
        width: 100%;
    }
}

/* Form box */
.form-box[b-3mt9ik8xfu] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0.3rem;
    padding: 1rem;
    font-size: 0.9rem;
}

.form-box-xs[b-3mt9ik8xfu] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0.3rem;
    padding: 1rem 0.5rem;
    font-size: 0.9rem;
}

.form-row[b-3mt9ik8xfu] {
    display: grid;
    grid-template-columns: minmax(5rem, 0.75fr) minmax(0, 1.5fr);
    align-items: center;
    gap: 0.35rem;
}

    .form-row label[b-3mt9ik8xfu], .form-row-xs[b-3mt9ik8xfu], .form-row-xl label[b-3mt9ik8xfu] {
        margin: 0;
        font-weight: 500;
        line-height: 1.1;
        font-size: var(--fs-body-2)
    }

.form-row-xs[b-3mt9ik8xfu] {
    display: grid;
    grid-template-columns: minmax(6rem, 0.9fr) minmax(0, 1.4fr);
    align-items: center;
    gap: 0.3rem;
}

.form-row-xl[b-3mt9ik8xfu] {
    display: grid;
    grid-template-columns: minmax(3.5rem, 0.6fr) minmax(0, 1.8fr);
    align-items: center;
    gap: 0.3rem;
}


.form-control[b-3mt9ik8xfu] {
    width: 100%;
    min-width: 0;
    height: 1.8rem;
    border: 1px solid #ddd;
    border-radius: 3px;
    padding: 0.25rem 0.45rem;
    font: inherit;
}

.checkbox-box[b-3mt9ik8xfu] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.6rem;
    padding: 1rem;
    font-size: 0.9rem;
}

.optional-elements-box[b-3mt9ik8xfu] {
    max-height: 11rem;
    min-height: 0;
    overflow-y: auto;
}

.checkbox-box-xs[b-3mt9ik8xfu] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.6rem;
    font-size: 0.9rem;
    padding-bottom: 10px;
}

.checkbox-row[b-3mt9ik8xfu] {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    margin: 0;
    line-height: 1.2;
}

    .checkbox-row input[b-3mt9ik8xfu] {
        width: 1rem;
        height: 1rem;
    }

.temp-inputs[b-3mt9ik8xfu] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
    min-width: 0;
}

.side-panel-content[b-3mt9ik8xfu] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0.75rem;
    padding: 10px;
    min-height: 0;
    overflow: hidden;
}

.side-toolbar[b-3mt9ik8xfu] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.side-toolbar-buttons[b-3mt9ik8xfu] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
}

.side-toolbar-search[b-3mt9ik8xfu] {
    min-width: 0;
}

.side-panel-body[b-3mt9ik8xfu] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding-right: 4px;
}

@media (max-width: 2000px) {
    .side-toolbar-buttons[b-3mt9ik8xfu] {
        flex-wrap: wrap;
    }

    .side-toolbar-search[b-3mt9ik8xfu] {
        flex: 1 1 100%;
        width: 100%;
    }
}

.activity-item[b-3mt9ik8xfu] {
    margin-bottom: 0.5rem;
    padding: 0.5rem;
    border: 1px solid var(--color-gray-200, #dadfe2);
    border-radius: 5px;
    background: #fff;
}

.activity-div[b-3mt9ik8xfu] {
    display: grid;
    grid-template-columns: 30px minmax(8rem, 0.8fr) minmax(8.5rem, 0.8fr) minmax(15rem, 1.3fr) minmax(18rem, 1.35fr) auto;
    grid-template-areas: "order main time location notes actions";
    align-items: stretch;
    gap: 0.75rem;
    min-width: 0;
}

.activity-cell[b-3mt9ik8xfu] {
    min-width: 0;
}

.activity-cell-order[b-3mt9ik8xfu] {
    grid-area: order;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.55rem;
}

.activity-order[b-3mt9ik8xfu] {
    text-align: center;
    background-color: #eee;
    font-weight: 500;
}

.activity-cell-main[b-3mt9ik8xfu] {
    grid-area: main;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.activity-cell-time[b-3mt9ik8xfu] {
    grid-area: time;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.activity-time-row[b-3mt9ik8xfu] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
    min-width: 0;
}

.activity-time-row .time-input[b-3mt9ik8xfu] {
    width: 100%;
    min-width: 0;
}

.activity-cell-location[b-3mt9ik8xfu] {
    grid-area: location;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    align-items: stretch;
}

.activity-location-summary[b-3mt9ik8xfu] {
    padding: 2px 0px;
    border-radius: 4px;
/*    background: var(--color-gray-50);*/
    color: var(--color-gray-500);
    font-size: 11px;
    line-height: 1.25;
}

.activity-location-name[b-3mt9ik8xfu] {
    color: var(--color-gray-600, #1f2937);
    font-weight: 600;
}

.activity-location-address[b-3mt9ik8xfu] {
    margin-top: 0.1rem;
}

.activity-cell-notes[b-3mt9ik8xfu] {
    grid-area: notes;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
    min-width: 0;
}

.activity-div[b-3mt9ik8xfu]  .k-textarea,
.activity-div[b-3mt9ik8xfu]  .k-input,
.activity-div[b-3mt9ik8xfu]  .k-picker,
.activity-div[b-3mt9ik8xfu]  .k-dropdownlist,
.activity-div[b-3mt9ik8xfu]  .k-combobox {
    width: 100%;
    max-width: 100%;
}

.activity-actions[b-3mt9ik8xfu] {
    grid-area: actions;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    justify-content: flex-end;
    align-self: center;
}

.activities-column[b-3mt9ik8xfu] {
    min-height: 0;
}

.activity-panel[b-3mt9ik8xfu] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 10px;
    overflow: hidden;
}

.activity-sortable[b-3mt9ik8xfu] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

.drag-handle[b-3mt9ik8xfu] {
    width: 30px;
    height: 30px;
    border: 0;
    background: transparent;
    cursor: move;
    padding: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-gray-500);
}

.badge-container[b-3mt9ik8xfu] {
    position: relative;
    display: inline-flex;
}

.badge[b-3mt9ik8xfu] {
    position: absolute;
    top: -0.45rem;
    right: -0.45rem;
    min-width: 1.1rem;
    height: 1.1rem;
    border-radius: 999px;
    background: #dc3545;
    color: #fff;
    font-size: 0.75rem;
    line-height: 1.1rem;
    text-align: center;
}

@media (max-width: 1199.98px) {
    .activity-div[b-3mt9ik8xfu] {
        grid-template-columns: 36px minmax(11rem, 1fr) minmax(9rem, 0.9fr) auto;
        grid-template-areas:
            "order main time actions"
            "order location notes actions";
    }
}

@media (max-width: 767.98px) {
    .activity-div[b-3mt9ik8xfu] {
        grid-template-columns: 36px minmax(0, 1fr) auto;
        grid-template-areas:
            "order main actions"
            "order time actions"
            "order location actions"
            "notes notes notes";
    }

    .activity-cell-notes[b-3mt9ik8xfu] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {
    .activity-div[b-3mt9ik8xfu] {
        grid-template-columns: 36px minmax(0, 1fr);
        grid-template-areas:
            "order main"
            "order time"
            "order location"
            "notes notes"
            "actions actions";
    }
    
    .activity-actions[b-3mt9ik8xfu] {
        width: 100%;
        justify-content: flex-end;
    }
}

.container-card[b-3mt9ik8xfu] {
    position: relative;
    margin-bottom: 0.5rem;
    padding: 0.5rem;
    border: 1px solid var(--color-gray-200, #dadfe2);
    border-radius: 5px;
    background: #fff;
}

.container-card-header[b-3mt9ik8xfu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.container-title[b-3mt9ik8xfu] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
    flex: 1 1 auto;
}

.container-actions[b-3mt9ik8xfu] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex: 0 0 auto;
}

.selected-container[b-3mt9ik8xfu] {
    border-color: var(--kendo-color-primary, #0d6efd);
    background: color-mix(in srgb, var(--kendo-color-primary, #0d6efd) 8%, #fff);
}

.time-input[b-3mt9ik8xfu] {
    width: 90px;
    height: 32px;
    box-sizing: border-box;
    border: 1px solid var(--kendo-color-border, #d1d5db);
    border-radius: 4px;
    padding: 0 0.5rem;
    background-color: var(--kendo-color-surface, #fff);
    color: var(--kendo-color-on-app-surface, #1f2937);
    font: inherit;
    font-size: 0.875rem;
    line-height: 1.4;
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

    .time-input:hover[b-3mt9ik8xfu] {
        border-color: var(--kendo-color-border-alt, #b8bec8);
    }

    .time-input:focus[b-3mt9ik8xfu],
    .time-input:focus-visible[b-3mt9ik8xfu] {
        border-color: var(--kendo-color-primary, #0d6efd);
        box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-primary, #0d6efd) 20%, transparent);
    }

    .time-input:disabled[b-3mt9ik8xfu],
    .time-input[readonly][b-3mt9ik8xfu] {
        background-color: var(--kendo-color-surface-alt, #f3f4f6);
        color: var(--kendo-color-disabled-text, #9ca3af);
        cursor: not-allowed;
    }

.container-activities[b-3mt9ik8xfu] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 15px 0 5px 0;
    border-radius: 8px;
    background: #fff;
}

.activity-row[b-3mt9ik8xfu] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 6px;
    background: var(--color-gray-50);
}

.activity-row__marker[b-3mt9ik8xfu] {
    width: 8px;
    height: 8px;
    margin-top: 7px;
    border-radius: 50%;
    background: var(--color-gray-400);
    flex: 0 0 auto;
}

.activity-row__content[b-3mt9ik8xfu] {
    min-width: 0;
    flex: 1;
}

.activity-row__main[b-3mt9ik8xfu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.activity-row__type[b-3mt9ik8xfu] {
    color: var(--color-gray-800);
    font-size: 13px;
    font-weight: 600;
}

.activity-row__date[b-3mt9ik8xfu] {
    color: var(--color-gray-500);
    font-size: 12px;
    white-space: nowrap;
}

.activity-row__meta[b-3mt9ik8xfu] {
    margin-top: 2px;
    color: var(--color-gray-500);
    font-size: 12px;
}

.activity-empty[b-3mt9ik8xfu] {
    padding: 12px;
    border-radius: 6px;
    background: var(--color-gray-50);
    color: var(--color-gray-500);
    font-size: 13px;
    text-align: center;
}

.required-label[b-3mt9ik8xfu]::after {
    content: "*";
    margin-left: 4px;
    color: var(--color-danger-500);
    font-weight: 700;
}

.lading-badge[b-3mt9ik8xfu] {
    position: absolute;
    top: -7px;
    right: -7px;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: var(--color-primary-700);
    color: white;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    z-index: 10;
    transition: all 0.2s ease;
}

/* Kaart Dummy CSS */
.fake-map[b-3mt9ik8xfu] {
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 20px 0px;
}

.fake-map-toolbar[b-3mt9ik8xfu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.fake-map-canvas[b-3mt9ik8xfu] {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    border: 1px solid var(--color-gray-200, #dadfe2);
    border-radius: 6px;
    background: linear-gradient(90deg, rgba(255,255,255,0.45) 1px, transparent 1px), linear-gradient(0deg, rgba(255,255,255,0.45) 1px, transparent 1px), #d8ead8;
    background-size: 42px 42px;
}

.fake-map-road[b-3mt9ik8xfu] {
    position: absolute;
    background: #fff;
    border: 1px solid #c9d3dc;
    box-shadow: 0 1px 2px rgba(0,0,0,0.08);
}

.fake-map-road-a[b-3mt9ik8xfu] {
    width: 120%;
    height: 42px;
    left: -10%;
    top: 45%;
    transform: rotate(-8deg);
}

.fake-map-road-b[b-3mt9ik8xfu] {
    width: 44px;
    height: 120%;
    left: 34%;
    top: -10%;
    transform: rotate(12deg);
}

.fake-map-road-c[b-3mt9ik8xfu] {
    width: 90%;
    height: 34px;
    left: 20%;
    top: 20%;
    transform: rotate(20deg);
}

.fake-map-marker[b-3mt9ik8xfu] {
    position: absolute;
    left: 52%;
    top: 48%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 999px;
    color: #fff;
    background: var(--kendo-color-primary, #0d6efd);
    transform: translate(-50%, -50%);
    box-shadow: 0 8px 18px rgba(0,0,0,0.25);
}

.fake-map-label[b-3mt9ik8xfu] {
    position: absolute;
    left: calc(52% + 1.75rem);
    top: calc(48% - 0.6rem);
    padding: 0.35rem 0.55rem;
    border: 1px solid var(--color-gray-200, #dadfe2);
    border-radius: 4px;
    background: #fff;
    font-size: 0.85rem;
}

.form-row-split[b-3mt9ik8xfu] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.35rem;
    min-width: 0;
}

@media (max-width: 575.98px) {
    .form-row-split[b-3mt9ik8xfu] {
        grid-template-columns: 1fr;
    }
}

/* _content/eLipsOnline/Components/Pages/InboekSchermen/ContainerInboekSnel.razor.rz.scp.css */
.inboek-page[b-mkrk5ptfd7] {
    --inboek-gap: clamp(0.3rem, 0.7vw, 0.7rem);
    --inboek-page-padding: 16px;
    --inboek-border: 1px solid var(--color-gray-200);
    --inboek-bottom-bg: #d9d9d9;
    --inboek-button-bg: #555;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    color: var(--text-primary, #050505);
    background: var(--color-gray-50);
}

.inboek-header[b-mkrk5ptfd7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 10px var(--inboek-page-padding) 0.5rem;
}

.inboek-title[b-mkrk5ptfd7] {
    margin: 0;
}

.inboek-header-actions[b-mkrk5ptfd7] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.inboek-upper[b-mkrk5ptfd7] {
    padding: 0 var(--inboek-page-padding) 0.5rem;
    /*    background: #fff;*/
}

.upper-grid[b-mkrk5ptfd7] {
    display: grid;
    grid-template-columns: minmax(390px, 1.55fr) minmax(470px, 1.45fr) minmax(170px, 0.58fr);
    /*    grid-template-columns: minmax(320px, 1.2fr) minmax(500px, 1.7fr);*/
    gap: var(--inboek-gap);
    align-items: stretch;
}

.wire-group[b-mkrk5ptfd7],
.wire-field[b-mkrk5ptfd7] {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.wire-field[b-mkrk5ptfd7] {
    display: flex;
    flex-direction: column;
}

    .wire-field .wire-box[b-mkrk5ptfd7] {
        flex: 1 1 auto;
    }

.order-grid[b-mkrk5ptfd7],
.extra-grid[b-mkrk5ptfd7],
.container-grid[b-mkrk5ptfd7],
.container-row[b-mkrk5ptfd7] {
    display: grid;
    gap: var(--inboek-gap);
    min-width: 0;
}

.order-grid[b-mkrk5ptfd7] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    height: 100%;
}

.container-grid[b-mkrk5ptfd7] {
    grid-template-rows: minmax(0, 1.2fr) minmax(0, 1fr);
    height: 100%;
}

.container-row-top[b-mkrk5ptfd7] {
    /*    grid-template-columns: minmax(0, 0.65fr) repeat(2, minmax(0, 1fr));*/
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.container-row-bottom[b-mkrk5ptfd7] {
    /*    grid-template-columns: repeat(4, minmax(0, 1fr));*/
    /*    grid-template-columns: 1fr 1fr 1.5fr;*/
    /*    grid-template-columns: 0.8fr 0.8fr 1.7fr;*/
    /*    grid-template-columns: repeat(3, minmax(0, 1fr));*/
    grid-template-columns: 1.2fr 1fr 0.8fr;
}

.extra-grid[b-mkrk5ptfd7] {
    grid-template-rows: repeat(2, minmax(0, 1fr));
}

.wire-box[b-mkrk5ptfd7],
.wire-panel[b-mkrk5ptfd7] {
    min-width: 0;
    min-height: 11rem;
    display: flex;
    border: var(--inboek-border);
    border-radius: 5px;
    background: #fff;
    line-height: 1;
}

.wire-box-tall[b-mkrk5ptfd7] {
    min-height: clamp(18rem, 30vh, 25rem);
}

.wire-attachments-group[b-mkrk5ptfd7],
.wire-attachments-field[b-mkrk5ptfd7] {
    height: 100%;
    min-height: 0;
}

.wire-attachments-panel[b-mkrk5ptfd7] {
    min-height: 0;
    overflow: hidden;
}

.inboek-lower[b-mkrk5ptfd7] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    padding: 0.5rem var(--inboek-page-padding) 1rem;
    background: var(--color-gray-50);
}

.lower-grid[b-mkrk5ptfd7] {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 18%);
    gap: 10px;
    align-items: stretch;
}

.activities-column[b-mkrk5ptfd7],
.side-column[b-mkrk5ptfd7] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.activities-toolbar[b-mkrk5ptfd7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

    .activities-toolbar .wire-button[b-mkrk5ptfd7] {
        flex: 0 0 auto;
    }

.side-column[b-mkrk5ptfd7] {
    min-height: 0;
}

.side-panel[b-mkrk5ptfd7] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.action-bar[b-mkrk5ptfd7] {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
}

.wire-panel[b-mkrk5ptfd7] {
    flex: 1 1 auto;
    min-height: clamp(14rem, 32vh, 28rem);
}


.wire-button[b-mkrk5ptfd7] {
    border: 0;
    padding: 0.45rem 1.2rem;
    color: #fff;
    background: var(--inboek-button-bg);
    font: inherit;
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
}

    .wire-button:hover[b-mkrk5ptfd7],
    .wire-button:focus-visible[b-mkrk5ptfd7] {
        background: #333;
    }

@media (max-width: 1199.98px) {
    .upper-grid[b-mkrk5ptfd7] {
        grid-template-columns: 1fr;
    }

    .order-grid[b-mkrk5ptfd7] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .container-row-top[b-mkrk5ptfd7],
    .container-row-bottom[b-mkrk5ptfd7] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .wire-box-tall[b-mkrk5ptfd7],
    .extra-grid[b-mkrk5ptfd7] {
        min-height: 17rem;
    }

    .inboek-lower[b-mkrk5ptfd7] {
        flex: 0 0 auto;
        min-height: auto;
    }

    .lower-grid[b-mkrk5ptfd7] {
        grid-template-columns: 1fr;
    }

    .side-column[b-mkrk5ptfd7],
    .activity-panel[b-mkrk5ptfd7],
    .side-panel[b-mkrk5ptfd7] {
        min-height: 18rem;
    }
}

@media (max-width: 575.98px) {
    .inboek-title[b-mkrk5ptfd7] {
        margin-inline: 0.85rem;
    }

    .inboek-upper[b-mkrk5ptfd7],
    .inboek-lower[b-mkrk5ptfd7] {
        padding-inline: 0.85rem;
    }

    .order-grid[b-mkrk5ptfd7],
    .container-row-top[b-mkrk5ptfd7],
    .container-row-bottom[b-mkrk5ptfd7] {
        grid-template-columns: 1fr;
    }

    .extra-grid[b-mkrk5ptfd7],
    .container-grid[b-mkrk5ptfd7] {
        grid-template-rows: none;
    }

    .wire-box[b-mkrk5ptfd7],
    .wire-box-tall[b-mkrk5ptfd7],
    .wire-panel[b-mkrk5ptfd7],
    .side-panel[b-mkrk5ptfd7] {
        min-height: 12rem;
    }

    .action-bar[b-mkrk5ptfd7] {
        flex-direction: column;
    }

    .wire-button[b-mkrk5ptfd7] {
        width: 100%;
    }
}

/* Form box */
.profile-dd .form-box .checkbox-box-xs[b-mkrk5ptfd7] {
    box-shadow: none!important;
}

.form-row-temp[b-mkrk5ptfd7] {
    align-items: center;
}

.temp-fields[b-mkrk5ptfd7] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.35rem;
    min-width: 0;
}

.temp-field[b-mkrk5ptfd7] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.12rem;
}

.temp-field-label[b-mkrk5ptfd7] {
    color: var(--color-gray-500);
    font-size: 0.65rem;
    font-weight: 500;
    line-height: 1;
}


.form-control[b-mkrk5ptfd7] {
    width: 100%;
    min-width: 0;
    height: 1.8rem;
    border: 1px solid #ddd;
    border-radius: 3px;
    padding: 0.25rem 0.45rem;
    font: inherit;
}

.checkbox-box[b-mkrk5ptfd7] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.6rem;
    padding: 0.7rem 1rem;
    font-size: 0.9rem;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.checkbox-box-xs[b-mkrk5ptfd7] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.6rem;
    font-size: 0.9rem;
    padding-bottom: 10px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.checkbox-row[b-mkrk5ptfd7] {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    margin: 0;
    line-height: 1.2;
}

    .checkbox-row input[b-mkrk5ptfd7] {
        width: 1rem;
        height: 1rem;
    }

.temp-inputs[b-mkrk5ptfd7] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
    min-width: 0;
}

.side-panel-content[b-mkrk5ptfd7] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0.75rem;
    padding: 10px;
    min-height: 0;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.side-toolbar[b-mkrk5ptfd7] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.side-toolbar-buttons[b-mkrk5ptfd7] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
}

.side-toolbar-search[b-mkrk5ptfd7] {
    min-width: 0;
}

.side-panel-body[b-mkrk5ptfd7] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding-right: 4px;
}

@media (max-width: 2000px) {
    .side-toolbar-buttons[b-mkrk5ptfd7] {
        flex-wrap: wrap;
    }

    .side-toolbar-search[b-mkrk5ptfd7] {
        flex: 1 1 100%;
        width: 100%;
    }
}

.activity-item[b-mkrk5ptfd7] {
    margin-bottom: 0.5rem;
    padding: 0.5rem;
    border: 1px solid var(--color-gray-200, #dadfe2);
    border-radius: 5px;
    background: #fff;
}

.activity-div[b-mkrk5ptfd7] {
    display: grid;
    grid-template-columns: 30px minmax(8rem, 0.8fr) minmax(8.5rem, 0.8fr) minmax(15rem, 1.3fr) minmax(18rem, 1.35fr) auto;
    grid-template-areas: "order main time location notes actions";
    align-items: stretch;
    gap: 0.75rem;
    min-width: 0;
}

.activity-cell[b-mkrk5ptfd7] {
    min-width: 0;
}

.activity-cell-order[b-mkrk5ptfd7] {
    grid-area: order;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.55rem;
}

.activity-order[b-mkrk5ptfd7] {
    text-align: center;
    background-color: #eee;
    font-weight: 500;
}

.activity-cell-main[b-mkrk5ptfd7] {
    grid-area: main;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.activity-cell-time[b-mkrk5ptfd7] {
    grid-area: time;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.activity-time-row[b-mkrk5ptfd7] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
    min-width: 0;
}

.activity-time-row .time-input[b-mkrk5ptfd7] {
    width: 100%;
    min-width: 0;
}

.activity-cell-location[b-mkrk5ptfd7] {
    grid-area: location;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    align-items: stretch;
}

.activity-cell-notes[b-mkrk5ptfd7] {
    grid-area: notes;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
    min-width: 0;
}

.activity-div[b-mkrk5ptfd7]  .k-textarea,
.activity-div[b-mkrk5ptfd7]  .k-input,
.activity-div[b-mkrk5ptfd7]  .k-picker,
.activity-div[b-mkrk5ptfd7]  .k-dropdownlist,
.activity-div[b-mkrk5ptfd7]  .k-combobox {
    width: 100%;
    max-width: 100%;
}

.activity-actions[b-mkrk5ptfd7] {
    grid-area: actions;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    justify-content: flex-end;
    align-self: center;
}

.activities-column[b-mkrk5ptfd7] {
    min-height: 0;
}

.activity-panel[b-mkrk5ptfd7] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 10px;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.activity-sortable[b-mkrk5ptfd7] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

.drag-handle[b-mkrk5ptfd7] {
    width: 30px;
    height: 30px;
    border: 0;
    background: transparent;
    cursor: move;
    padding: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-gray-500);
}

.badge-container[b-mkrk5ptfd7] {
    position: relative;
    display: inline-flex;
}

.badge[b-mkrk5ptfd7] {
    position: absolute;
    top: -0.45rem;
    right: -0.45rem;
    min-width: 1.1rem;
    height: 1.1rem;
    border-radius: 999px;
    background: #dc3545;
    color: #fff;
    font-size: 0.75rem;
    line-height: 1.1rem;
    text-align: center;
}

@media (max-width: 1199.98px) {
    .activity-div[b-mkrk5ptfd7] {
        grid-template-columns: 36px minmax(11rem, 1fr) minmax(9rem, 0.9fr) auto;
        grid-template-areas:
            "order main time actions"
            "order location notes actions";
    }
}

@media (max-width: 767.98px) {
    .activity-div[b-mkrk5ptfd7] {
        grid-template-columns: 36px minmax(0, 1fr) auto;
        grid-template-areas:
            "order main actions"
            "order time actions"
            "order location actions"
            "notes notes notes";
    }

    .activity-cell-notes[b-mkrk5ptfd7] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {
    .activity-div[b-mkrk5ptfd7] {
        grid-template-columns: 36px minmax(0, 1fr);
        grid-template-areas:
            "order main"
            "order time"
            "order location"
            "notes notes"
            "actions actions";
    }
    
    .activity-actions[b-mkrk5ptfd7] {
        width: 100%;
        justify-content: flex-end;
    }
}

.container-card[b-mkrk5ptfd7] {
    position: relative;
    margin-bottom: 0.5rem;
    padding: 0.5rem;
    border: 1px solid var(--color-gray-200, #dadfe2);
    border-radius: 5px;
    background: #fff;
}

.container-card-header[b-mkrk5ptfd7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.container-title[b-mkrk5ptfd7] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
    flex: 1 1 auto;
}

.container-actions[b-mkrk5ptfd7] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex: 0 0 auto;
}

.selected-container[b-mkrk5ptfd7] {
    border-color: var(--kendo-color-primary, #0d6efd);
    background: color-mix(in srgb, var(--kendo-color-primary, #0d6efd) 8%, #fff);
}

.time-input[b-mkrk5ptfd7] {
    width: 90px;
    height: 32px;
    box-sizing: border-box;
    border: 1px solid var(--kendo-color-border, #d1d5db);
    border-radius: 4px;
    padding: 0 0.5rem;
    background-color: var(--kendo-color-surface, #fff);
    color: var(--kendo-color-on-app-surface, #1f2937);
    font: inherit;
    font-size: 0.875rem;
    line-height: 1.4;
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

    .time-input:hover[b-mkrk5ptfd7] {
        border-color: var(--kendo-color-border-alt, #b8bec8);
    }

    .time-input:focus[b-mkrk5ptfd7],
    .time-input:focus-visible[b-mkrk5ptfd7] {
        border-color: var(--kendo-color-primary, #0d6efd);
        box-shadow: 0 0 0 2px color-mix(in srgb, var(--kendo-color-primary, #0d6efd) 20%, transparent);
    }

    .time-input:disabled[b-mkrk5ptfd7],
    .time-input[readonly][b-mkrk5ptfd7] {
        background-color: var(--kendo-color-surface-alt, #f3f4f6);
        color: var(--kendo-color-disabled-text, #9ca3af);
        cursor: not-allowed;
    }

.container-activities[b-mkrk5ptfd7] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 15px 0 5px 0;
    border-radius: 8px;
    background: #fff;
}

.activity-row[b-mkrk5ptfd7] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 6px;
    background: var(--color-gray-50);
}

.activity-row__marker[b-mkrk5ptfd7] {
    width: 8px;
    height: 8px;
    margin-top: 7px;
    border-radius: 50%;
    background: var(--color-gray-400);
    flex: 0 0 auto;
}

.activity-row__content[b-mkrk5ptfd7] {
    min-width: 0;
    flex: 1;
}

.activity-row__main[b-mkrk5ptfd7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.activity-row__type[b-mkrk5ptfd7] {
    color: var(--color-gray-800);
    font-size: 13px;
    font-weight: 600;
}

.activity-row__date[b-mkrk5ptfd7] {
    color: var(--color-gray-500);
    font-size: 12px;
    white-space: nowrap;
}

.activity-row__meta[b-mkrk5ptfd7] {
    margin-top: 2px;
    color: var(--color-gray-500);
    font-size: 12px;
}

.activity-empty[b-mkrk5ptfd7] {
    padding: 12px;
    border-radius: 6px;
    background: var(--color-gray-50);
    color: var(--color-gray-500);
    font-size: 13px;
    text-align: center;
}

.required-label[b-mkrk5ptfd7]::after {
    content: "*";
    margin-left: 4px;
    color: var(--color-danger-500);
    font-weight: 700;
}

.lading-badge[b-mkrk5ptfd7] {
    position: absolute;
    top: -7px;
    right: -7px;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: var(--color-primary-700);
    color: white;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    z-index: 10;
    transition: all 0.2s ease;
}

/* Kaart Dummy CSS */
.fake-map[b-mkrk5ptfd7] {
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 20px 0px;
}

.fake-map-toolbar[b-mkrk5ptfd7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.fake-map-canvas[b-mkrk5ptfd7] {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    border: 1px solid var(--color-gray-200, #dadfe2);
    border-radius: 6px;
    background: linear-gradient(90deg, rgba(255,255,255,0.45) 1px, transparent 1px), linear-gradient(0deg, rgba(255,255,255,0.45) 1px, transparent 1px), #d8ead8;
    background-size: 42px 42px;
}

.fake-map-road[b-mkrk5ptfd7] {
    position: absolute;
    background: #fff;
    border: 1px solid #c9d3dc;
    box-shadow: 0 1px 2px rgba(0,0,0,0.08);
}

.fake-map-road-a[b-mkrk5ptfd7] {
    width: 120%;
    height: 42px;
    left: -10%;
    top: 45%;
    transform: rotate(-8deg);
}

.fake-map-road-b[b-mkrk5ptfd7] {
    width: 44px;
    height: 120%;
    left: 34%;
    top: -10%;
    transform: rotate(12deg);
}

.fake-map-road-c[b-mkrk5ptfd7] {
    width: 90%;
    height: 34px;
    left: 20%;
    top: 20%;
    transform: rotate(20deg);
}

.fake-map-marker[b-mkrk5ptfd7] {
    position: absolute;
    left: 52%;
    top: 48%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 999px;
    color: #fff;
    background: var(--kendo-color-primary, #0d6efd);
    transform: translate(-50%, -50%);
    box-shadow: 0 8px 18px rgba(0,0,0,0.25);
}

.fake-map-label[b-mkrk5ptfd7] {
    position: absolute;
    left: calc(52% + 1.75rem);
    top: calc(48% - 0.6rem);
    padding: 0.35rem 0.55rem;
    border: 1px solid var(--color-gray-200, #dadfe2);
    border-radius: 4px;
    background: #fff;
    font-size: 0.85rem;
}

.form-row-split[b-mkrk5ptfd7] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.35rem;
    min-width: 0;
}

@media (max-width: 575.98px) {
    .form-row-split[b-mkrk5ptfd7] {
        grid-template-columns: 1fr;
    }
}

.optional-elements-box[b-mkrk5ptfd7] {
    max-height: 11.6rem;
    min-height: 0;
    overflow: hidden;
}

.optional-elements-list[b-mkrk5ptfd7] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    padding-right: 4px;
    width: 100%;
}
/* _content/eLipsOnline/Components/Pages/Login.razor.rz.scp.css */
.login-intro[b-njzlaa9uqo] {
    margin-bottom: 42px;
}

.login-intro h1[b-njzlaa9uqo] {
    margin: 0 0 14px;
    color: var(--color-secondary-700);
    font-size: var(--fs-display-2);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: 0;
}

.login-intro span[b-njzlaa9uqo] {
    color: var(--color-primary-700);
}

.login-intro p[b-njzlaa9uqo] {
    margin: 0;
    color: #5d6b8f;
    font-size: 17px;
    line-height: 1.35;
}

.login-form-card[b-njzlaa9uqo]  .login-form {
    display: grid;
    gap: 24px;
}

.login-field[b-njzlaa9uqo] {
    display: grid;
    gap: 12px;
}

.login-field label[b-njzlaa9uqo] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-2);
    font-weight: 600;
    line-height: 1;
}

.login-input-wrap[b-njzlaa9uqo] {
    height: 56px;
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid #d7dfed;
    border-radius: 10px;
    background: #ffffff;
    color: var(--color-gray-800);
    padding: 0 18px 0 14px;
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

.login-input-wrap:focus-within[b-njzlaa9uqo] {
    border-color: #2367e8;
    box-shadow: 0 0 0 4px rgba(35, 103, 232, 0.12);
}

.login-input-icon[b-njzlaa9uqo] {
    width: 35px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    background: var(--color-gray-50);
    color: var(--color-gray-600);
    font-size: 27px;
}

.login-input-wrap[b-njzlaa9uqo]  .login-input {
    width: 100%;
    min-width: 0;
    height: 100%;
    border: 0;
    background: transparent;
    color: var(--color-gray-800);
    font-size: var(--fs-body-1);
    font-weight: 500;
    line-height: 1;
    outline: none;
    padding: 0 10px;
}

.login-input-wrap[b-njzlaa9uqo]  .login-input::placeholder {
    color: #9aa7bf;
    font-weight: 400;
    font-size: var(--fs-body-2);
}

.login-options[b-njzlaa9uqo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-top: -4px;
    font-size: var(--fs-body-3);
}

.login-remember[b-njzlaa9uqo] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    color: var(--color-secondary-700);
    cursor: pointer;
    font-size: var(--fs-body-3);
    font-weight: 600;
    line-height: 1;
}

.login-options a[b-njzlaa9uqo],
.login-create-account a[b-njzlaa9uqo] {
    color: var(--color-primary-700);
    font-weight: 600;
    text-decoration: none;
}

.login-options a:hover[b-njzlaa9uqo],
.login-create-account a:hover[b-njzlaa9uqo] {
    text-decoration: underline;
}

.login-submit[b-njzlaa9uqo] {
    width: 100%;
    height: 58px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    border: 0;
    border-radius: 10px;
    background: var(--color-primary-700);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
    color: #ffffff;
    cursor: pointer;
    font-size: var(--fs-body-1);
    font-weight: 700;
    line-height: 1;
    margin-top: 6px;
    transition: background-color 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

.login-submit[b-njzlaa9uqo]  .k-svg-icon {
    position: absolute;
    right: 20px;
    width: 20px;
    height: 20px;
}

.login-submit:hover[b-njzlaa9uqo] {
    background: var(--color-primary-500);
}

.login-submit:active[b-njzlaa9uqo] {
    transform: translateY(1px);
}

.login-form-card[b-njzlaa9uqo]  .login-validation,
.login-error[b-njzlaa9uqo] {
    margin: 0;
    border-radius: 10px;
    background: #fff1f1;
    color: #bd1f1f;
    font-size: var(--fs-body-3);
    line-height: 1.35;
    padding: 12px 14px;
}

.login-form-card[b-njzlaa9uqo]  .login-validation:empty {
    display: none;
}

.login-form-card[b-njzlaa9uqo]  .login-validation li {
    margin-left: 16px;
}

.login-create-account[b-njzlaa9uqo] {
    margin: 28px 0 0;
    color: #5d6b8f;
    font-size: var(--fs-body-3);
    line-height: 1.3;
    text-align: center;
}

@media (max-width: 1140px) {
    .login-intro h1[b-njzlaa9uqo] {
        margin-top: 30px;
    }
}

@media (max-width: 600px) {
    .login-intro[b-njzlaa9uqo] {
        margin-bottom: 34px;
    }

    .login-intro h1[b-njzlaa9uqo] {
        font-size: 30px;
        margin-top: 20px;
    }

    .login-intro p[b-njzlaa9uqo] {
        font-size: 15px;
    }

    .login-options[b-njzlaa9uqo] {
        align-items: flex-start;
        flex-direction: column;
        gap: 14px;
    }
}
/* _content/eLipsOnline/Components/Pages/Order/OrderSearch.razor.rz.scp.css */
.os-page[b-c480pqk1w2] {
    position: relative;
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    width: 100%;
    height: calc(100vh - 40px);
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    background: var(--color-gray-50);
}

.os-sidebar-backdrop[b-c480pqk1w2] {
    display: none;
}

.os-page *[b-c480pqk1w2],
.os-page *[b-c480pqk1w2]::before,
.os-page *[b-c480pqk1w2]::after {
    box-sizing: border-box;
}

.os-page[b-c480pqk1w2]  .os-content-splitter,
.os-page[b-c480pqk1w2]  .os-lower-splitter {
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    border: 0;
}

.os-primary-workspace[b-c480pqk1w2] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    width: 100%;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    padding: 3px 0 6px 6px;
}

.os-page[b-c480pqk1w2]  .os-content-splitter > .k-pane,
.os-page[b-c480pqk1w2]  .os-lower-splitter > .k-pane {
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    background: var(--color-gray-50);
}

.os-sidebar[b-c480pqk1w2] {
    display: flex;
    flex-direction: column;
    flex: 0 0 360px;
    width: 360px;
    height: 100%;
    min-width: 0;
    min-height: 0;
    margin: 0 0 0 3px;
    padding: 14px 18px 25px 22px;
    overflow: hidden;
    background: var(--white);
    border: 0;
    border-left: 1px solid var(--color-gray-200);
    border-radius: 0;
    box-shadow: none;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.os-sidebar-header[b-c480pqk1w2] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 0 22px;
}

.os-sidebar-header h3[b-c480pqk1w2] {
    margin: 0;
    font-size: 16px;
    font-weight: 650;
}

.os-sidebar-title-row[b-c480pqk1w2] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.os-sidebar-count[b-c480pqk1w2] {
    padding: 2px 6px;
    color: var(--color-primary-700, #175cd3);
    border-radius: 4px;
    background: var(--color-primary-50, #eff8ff);
    font-size: 10px;
    font-weight: 600;
}

.os-sidebar-header p[b-c480pqk1w2] {
    max-width: 190px;
    margin: 6px 12px 0 0;
    color: var(--color-gray-400, #98a2b3);
    font-size: 12px;
    line-height: 1.35;
}

.rv-title-sub[b-c480pqk1w2] {
    margin-top: 10px;
}

.os-pane-toggle[b-c480pqk1w2] {
    display: inline-flex;
    flex: 0 0 36px;
    align-items: center;
    justify-content: center;
    width: 36px;
    min-width: 36px;
    height: 36px;
    padding: 0;
    color: var(--color-gray-700, #344054);
    border: 0;
    border-radius: 4px;
    background: transparent;
    font: inherit;
    cursor: pointer;
}

.os-pane-toggle:hover[b-c480pqk1w2],
.os-pane-toggle:focus-visible[b-c480pqk1w2] {
    outline: none;
    color: var(--color-primary-700, #175cd3);
    background: var(--color-selected-bg-soft, #eff8ff);
}

.os-pane-toggle[b-c480pqk1w2]  .k-svg-icon {
    width: 19px;
    height: 19px;
}

.os-search[b-c480pqk1w2] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 7px;
    height: 36px;
    margin-bottom: 18px;
    padding: 0 9px;
    color: #8792a2;
    border: 1px solid #d9dee7;
    border-radius: 5px;
}

.os-search[b-c480pqk1w2]  .k-input,
.os-search[b-c480pqk1w2]  .k-textbox {
    width: 100%;
    border: 0;
    box-shadow: none;
    background: transparent;
}

.os-filter-list[b-c480pqk1w2] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.os-filter[b-c480pqk1w2] {
    flex: 0 0 auto;
    min-width: 0;
}

.os-filter label[b-c480pqk1w2] {
    display: block;
    margin: 0 0 6px;
    color: var(--color-secondary-700);
    font-size: var(--fs-caption);
    font-weight: 475;
}

.os-filter[b-c480pqk1w2]  .k-input,
.os-filter[b-c480pqk1w2]  .k-textbox,
.os-filter[b-c480pqk1w2]  .k-combobox {
    width: 100%;
}

.os-filter-actions[b-c480pqk1w2] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    margin: 0 -18px -14px;
    padding: 14px 18px 10px;
}

.os-filter-actions .btn[b-c480pqk1w2] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.os-content[b-c480pqk1w2] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: auto;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    background: var(--color-gray-50);
}

.os-search-header[b-c480pqk1w2] {
    flex: 0 0 auto;
    width: 100%;
    padding: 10px 16px 8px 12px;
    border-bottom: 0;
    background: transparent;
}

.os-search-header h3[b-c480pqk1w2] {
    margin: 0;
}

.os-search-title-row[b-c480pqk1w2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 10px;
}

.os-search-topline[b-c480pqk1w2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 28px;
    margin-bottom: 6px;
}

.os-search-actions[b-c480pqk1w2] {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.os-search--main[b-c480pqk1w2] {
    flex: 1 1 auto;
    width: auto;
    height: 46px;
    margin-bottom: 0;
    border: 0;
}

.os-search-shell[b-c480pqk1w2] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 2px 10px 2px 10px;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    background: var(--white);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.os-search-button[b-c480pqk1w2] {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 7px;
    height: 38px;
    padding: 0 18px;
    color: #fff;
    border: 1px solid var(--color-primary-700, #175cd3);
    border-radius: 6px;
    background: var(--color-primary-700, #175cd3);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.os-search-button:hover[b-c480pqk1w2],
.os-search-button:focus-visible[b-c480pqk1w2] {
    outline: none;
    border-color: var(--color-primary-800, #1849a9);
    background: var(--color-primary-800, #1849a9);
}

.os-search-button:disabled[b-c480pqk1w2] {
    opacity: .6;
    cursor: default;
}

.os-filter-toggle[b-c480pqk1w2] {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 7px;
    height: 38px;
    padding: 0 15px;
    color: var(--color-gray-700, #344054);
    border: 1px solid var(--color-gray-200, #e4e7ec);
    border-radius: 6px;
    background: var(--color-gray-50, #f9fafb);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.os-filter-toggle:hover[b-c480pqk1w2],
.os-filter-toggle:focus-visible[b-c480pqk1w2],
.os-filter-toggle.is-active[b-c480pqk1w2] {
    outline: none;
    color: var(--color-primary-700, #175cd3);
    border-color: var(--color-primary-300, #84caff);
    background: var(--color-primary-50, #eff8ff);
}

.os-filter-count[b-c480pqk1w2] {
    display: inline-flex;
    min-width: 19px;
    height: 19px;
    padding: 0 5px;
    align-items: center;
    justify-content: center;
    color: #fff;
    border-radius: 99px;
    background: var(--color-primary-700, #175cd3);
    font-size: 10px;
}

.os-active-filters[b-c480pqk1w2] {
    flex-basis: 100%;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    min-width: 0;
    padding: 10px 0px 0;
    margin-bottom: 2px;
}

.os-filter-chip[b-c480pqk1w2] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    border-radius: 999px;
    background: var(--color-primary-50);
    color: var(--color-primary-700, #175cd3);
    font-size: var(--fs-caption);
    white-space: nowrap;
    border: 1px solid var(--color-selected-border);
}

.os-filter-chip__remove[b-c480pqk1w2] {
    width: 16px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: currentColor;
    cursor: pointer;
}

.os-filter-chip__remove:hover[b-c480pqk1w2] {
    background: rgba(0, 102, 255, .12);
}

.os-filter-chip__remove[b-c480pqk1w2]  .k-svg-icon {
    width: 10px;
    height: 10px;
}

.os-clear-filters[b-c480pqk1w2] {
    border: 0;
    background: transparent;
    color: var(--color-secondary-700);
    font-size: var(--fs-caption);
    font-weight: 450;
    cursor: pointer;
    margin-left: 5px;
}

.os-clear-filters:hover[b-c480pqk1w2] {
    border: 0;
    background: transparent;
    color: var(--color-primary-700);
}

.os-results-workspace[b-c480pqk1w2] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.os-pane[b-c480pqk1w2] {
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    padding: 10px 16px 10px 12px;
    overflow: hidden;
}

.os-pane--orders[b-c480pqk1w2] {
    padding-bottom: 8px;
}

.os-pane--lower[b-c480pqk1w2] {
    padding-top: 8px;
}

.os-pane--left[b-c480pqk1w2] {
    padding-right: 6px;
}

.os-pane--right[b-c480pqk1w2] {
    padding-left: 6px;
}

.os-panel[b-c480pqk1w2] {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    background: var(--white);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.os-panel-header[b-c480pqk1w2] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 54px;
    padding: 10px 14px;
    border-bottom: 1px solid #e5e7eb;
}

.os-panel-header h2[b-c480pqk1w2] {
    display: inline;
    margin: 0 8px 0 0;
    color: #172033;
    font-size: 16px;
    font-weight: 650;
}

.os-panel-header span[b-c480pqk1w2] {
    color: #778196;
    font-size: 12px;
}

.os-grid-wrap[b-c480pqk1w2],
.os-child-grid[b-c480pqk1w2] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.os-grid-wrap[b-c480pqk1w2]  .k-grid,
.os-child-grid[b-c480pqk1w2]  .k-grid {
    width: 100%;
    height: 100%;
    min-height: 0;
    border: 0;
}

.os-grid-wrap[b-c480pqk1w2]  .k-grid-content,
.os-child-grid[b-c480pqk1w2]  .k-grid-content {
    min-height: 0;
    overflow: auto;
}

.os-state[b-c480pqk1w2] {
    display: flex;
    height: 100%;
    min-height: 0;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    color: #788397;
}

.os-empty[b-c480pqk1w2] {
    width: 100%;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 32px;
    text-align: center;
}

.os-empty__visual[b-c480pqk1w2] {
    width: 240px;
    height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.os-empty__visual img[b-c480pqk1w2] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.os-empty__text[b-c480pqk1w2] {
    max-width: 430px;
    display: grid;
    gap: 7px;
}

.os-empty__title[b-c480pqk1w2] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-2);
    font-weight: 600;
    line-height: 1.25;
}

.os-empty__description[b-c480pqk1w2] {
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
    line-height: 1.5;
}

.os-empty-compact[b-c480pqk1w2] {
    height: calc(100% - 24px);
    min-height: 120px;
    margin: 12px;
    padding: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    border: 1px dashed var(--color-gray-300);
    border-radius: 8px;
    background: var(--color-gray-30);
    color: var(--color-gray-500);
    text-align: left;
}

.os-empty-compact__icon[b-c480pqk1w2] {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 10px;
    background: var(--white);
    border: 1px solid var(--color-gray-200);
    color: var(--color-primary-700);
}

.os-empty-compact__icon[b-c480pqk1w2]  .k-svg-icon {
    width: 18px;
    height: 18px;
}

.os-empty-compact__text[b-c480pqk1w2] {
    max-width: 360px;
    display: grid;
    gap: 4px;
}

.os-empty-compact__title[b-c480pqk1w2] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 600;
    line-height: 1.3;
}

.os-empty-compact__description[b-c480pqk1w2] {
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
    line-height: 1.4;
}

@media (max-width: 1024px) {
    .os-page[b-c480pqk1w2] {
        height: auto;
        min-height: calc(100vh - 40px);
        overflow-x: hidden;
        overflow-y: auto;
    }

    .os-primary-workspace[b-c480pqk1w2],
    .os-content[b-c480pqk1w2] {
        height: auto;
        overflow: visible;
    }

    .os-results-workspace[b-c480pqk1w2] {
        flex: 0 0 1160px;
        height: 1160px;
        overflow: hidden;
    }

    .os-page[b-c480pqk1w2]  .os-content-splitter {
        display: grid;
        grid-template-rows: minmax(0, 440px) minmax(0, 720px);
        grid-template-columns: minmax(0, 1fr);
    }

    .os-page[b-c480pqk1w2]  .os-content-splitter > .k-pane {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        flex-basis: auto !important;
    }

    .os-page[b-c480pqk1w2]  .os-content-splitter > .k-splitbar {
        display: none;
    }

    .os-page[b-c480pqk1w2]  .os-lower-splitter {
        display: grid;
        grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
        grid-template-columns: minmax(0, 1fr);
    }

    .os-page[b-c480pqk1w2]  .os-lower-splitter > .k-pane {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        flex-basis: auto !important;
    }

    .os-page[b-c480pqk1w2]  .os-lower-splitter > .k-splitbar {
        display: none;
    }

    .os-pane--lower.os-pane--left[b-c480pqk1w2] {
        padding-right: 16px;
        padding-bottom: 4px;
    }

    .os-pane--lower.os-pane--right[b-c480pqk1w2] {
        padding-top: 4px;
        padding-left: 12px;
    }
}

@media (max-width: 1024px) {
    .os-page.filters-open .os-primary-workspace[b-c480pqk1w2] {
        width: 100%;
    }

    .os-sidebar-backdrop[b-c480pqk1w2] {
        position: fixed;
        z-index: 40;
        top: 40px;
        right: 0;
        bottom: 0;
        left: 0;
        display: block;
        width: 100%;
        height: 100%;
        padding: 0;
        border: 0;
        background: rgba(15, 23, 42, .28);
        backdrop-filter: blur(1px);
        cursor: default;
    }

    .os-sidebar[b-c480pqk1w2] {
        position: fixed;
        z-index: 50;
        top: 40px;
        right: 0;
        bottom: 0;
        width: min(380px, calc(100% - 48px));
        max-width: 100%;
        height: calc(100vh - 40px);
        margin: 0;
        flex-basis: auto;
        border-left: 1px solid var(--color-gray-200);
        box-shadow: -12px 0 32px rgba(15, 23, 42, .14);
        animation: os-sidebar-enter-b-c480pqk1w2 .18s ease-out;
    }

    .os-search-header[b-c480pqk1w2] {
        padding-right: 12px;
    }
}

@media (max-width: 768px) {
    .os-primary-workspace[b-c480pqk1w2] {
        padding-left: 0;
    }

    .os-search-header[b-c480pqk1w2] {
        padding: 8px;
    }

    .os-search-title-row[b-c480pqk1w2] {
        gap: 10px;
        margin-bottom: 8px;
    }

    .os-search-title-row h3[b-c480pqk1w2] {
        font-size: var(--fs-h5);
    }

    .os-search-shell[b-c480pqk1w2] {
        padding-right: 6px;
        padding-left: 6px;
    }

    .os-search--main[b-c480pqk1w2] {
        min-width: 0;
    }

    .os-pane[b-c480pqk1w2] {
        padding-right: 8px;
        padding-left: 8px;
    }

    .os-pane--lower.os-pane--left[b-c480pqk1w2],
    .os-pane--lower.os-pane--right[b-c480pqk1w2] {
        padding-right: 8px;
        padding-left: 8px;
    }

    .os-active-filters[b-c480pqk1w2] {
        padding-right: 0;
        padding-left: 0;
    }

    .os-empty[b-c480pqk1w2] {
        padding: 24px 18px;
    }

    .os-empty__visual[b-c480pqk1w2] {
        width: 190px;
        height: 88px;
    }

    .os-empty-compact[b-c480pqk1w2] {
        margin: 8px;
        height: calc(100% - 16px);
        padding: 16px;
    }
}

@media (max-width: 600px) {
    .os-sidebar[b-c480pqk1w2] {
        width: calc(100% - 16px);
        padding: 14px 16px 20px;
    }

    .os-search-title-row .btn[b-c480pqk1w2],
    .os-search-shell > .btn[b-c480pqk1w2] {
        padding-right: 10px;
        padding-left: 10px;
    }

    .os-filter-chip[b-c480pqk1w2] {
        max-width: 100%;
    }

    .os-filter-chip > span:first-child[b-c480pqk1w2] {
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .os-empty-compact[b-c480pqk1w2] {
        flex-direction: column;
        text-align: center;
    }
}

@keyframes os-sidebar-enter-b-c480pqk1w2 {
    from {
        opacity: 0;
        transform: translateX(20px);
    }

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

.os-pager[b-c480pqk1w2] {
    flex: 0 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    color: #667085;
    border-top: 1px solid #e5e7eb;
    font-size: 13px;
}

.os-pager div[b-c480pqk1w2] {
    display: flex;
    gap: 6px;
}
/* _content/eLipsOnline/Components/Pages/OverzichtSchermen/Kalender.razor.rz.scp.css */
.kalender-page[b-mwh6kzwvf9] {
    --kalender-accent: #2f7df4;
    --kalender-border: #e8ebf0;
    --kalender-muted: #7c8594;
    --kalender-text: #182230;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    min-height: 0;
    color: var(--kalender-text);
    background: var(--color-gray-50);
}

.kalender-header[b-mwh6kzwvf9] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    gap: 22px;
    align-items: center;
    margin-bottom: 10px;
}

    .kalender-header h3[b-mwh6kzwvf9] {
        margin: 0;
    }

.kalender-scheduler-heading[b-mwh6kzwvf9] {
    display: flex;
    flex: 0 0 auto;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 0 0 12px;
}

    .kalender-scheduler-heading h3[b-mwh6kzwvf9] {
        margin: 0;
        text-transform: capitalize;
    }

.kalender-header-actions[b-mwh6kzwvf9],
.kalender-view-buttons[b-mwh6kzwvf9] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.kalender-layout[b-mwh6kzwvf9] {
    flex: 1 1 auto;
    width: 100%;
    height: 100%;
    min-height: 0;
}

.kalender-scheduler-card[b-mwh6kzwvf9] {
    min-height: 0;
    height: 100%;
    border: 1px solid var(--color-gray-200);
    border-radius: 7px;
    background: var(--white);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.kalender-sidebar[b-mwh6kzwvf9] {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    padding: 18px 22px;
    overflow: auto;
    border-radius: 0;
    background: var(--white);
    box-shadow: none;
    border-right: 1px solid var(--color-gray-200);
}

.kalender-sidebar-title[b-mwh6kzwvf9] {
    flex: 0 0 auto;
    margin: 0 0 2px;
}

.kalender-sidebar-desc[b-mwh6kzwvf9] {
    margin: 0 0 18px;
    font-size: var(--fs-caption);
    color: var(--color-gray-500);
    font-weight: 400;
}

.kalender-desktop-splitter[b-mwh6kzwvf9] {
    border: 0;
    border-radius: 0;
    background: var(--white);
    box-shadow: none;
    overflow: hidden;
}

.kalender-desktop-splitter[b-mwh6kzwvf9]  .k-pane {
    min-width: 0;
    overflow: hidden;
}

.kalender-desktop-splitter[b-mwh6kzwvf9]  .k-splitbar {
    border-color: var(--color-gray-200);
    background: var(--color-gray-50);
}

.kalender-scheduler-pane[b-mwh6kzwvf9] {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    padding: 16px 18px;
    background: var(--color-gray-50);
}

.kalender-scheduler-pane > .kalender-scheduler-card[b-mwh6kzwvf9] {
    flex: 1 1 auto;
    height: auto;
}

.kalender-view-buttons[b-mwh6kzwvf9] {
    gap: 2px;
    justify-content: center;
    margin-bottom: 10px;
    padding: 4px;
    border: 1px solid var(--color-gray-100);
    border-radius: 8px;
    background: var(--color-gray-30);
}

.kalender-view-buttons[b-mwh6kzwvf9]  .k-button {
    flex: 1 1 0;
    min-width: 0;
    min-height: 28px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    box-shadow: none;
    color: var(--color-gray-500);
}

.kalender-view-buttons[b-mwh6kzwvf9]  .kalender-view-button.is-active {
    background: var(--color-primary-700) !important;
    color: #fff !important;
    box-shadow: 0 2px 6px rgb(47 125 244 / 25%);
}

.kalender-view-buttons[b-mwh6kzwvf9]  .k-svg-icon {
    color: currentColor;
}

.kalender-date-picker[b-mwh6kzwvf9] {
    padding-bottom: 15px;
    border-bottom: 1px solid var(--color-gray-200);
}

.kalender-date-picker[b-mwh6kzwvf9]  .k-calendar,
.kalender-date-picker[b-mwh6kzwvf9]  .k-calendar-view {
    width: 100%;
}

.kalender-date-picker[b-mwh6kzwvf9]  .k-calendar {
    border: 0;
    background: transparent;
    box-shadow: none;
}

.kalender-date-picker[b-mwh6kzwvf9]  .k-calendar-header,
.kalender-date-picker[b-mwh6kzwvf9]  .k-calendar-navigation {
    padding-inline: 0;
}

.kalender-date-picker[b-mwh6kzwvf9]  .k-calendar-title {
    font-weight: 650;
}

.kalender-date-picker[b-mwh6kzwvf9]  .k-calendar-td {
    border-radius: 7px;
}

.kalender-date-picker[b-mwh6kzwvf9]  .k-selected .k-link {
    border-radius: 7px;
    background: var(--color-primary-700);
}

.kalender-categories[b-mwh6kzwvf9] {
    padding: 22px 7px 14px;
    border-bottom: 1px solid var(--color-gray-200);
}

.kalender-categories h3[b-mwh6kzwvf9] {
    margin: 0 0 12px;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-1);
    font-weight: 550;
}

.kalender-category[b-mwh6kzwvf9] {
    margin-bottom: 10px;
    gap: 10px;
}

.kalender-category > span:last-child[b-mwh6kzwvf9] {
    display: inline-flex;
    align-items: center;
    line-height: 1;
    font-size: var(--fs-body-2-5);
    color: var(--color-gray-800);
}

.kalender-category:hover[b-mwh6kzwvf9] {
    color: var(--kalender-text);
}

.kalender-category-dot[b-mwh6kzwvf9] {
    align-self: center;
    width: 8px;
    height: 8px;
    flex: 0 0 8px;
    border-radius: 50%;
    background: #94a3b8;
}

.category-barge[b-mwh6kzwvf9] { background: var(--green); }
.category-medewerkers[b-mwh6kzwvf9] { background: var(--blue); }
.category-trailer[b-mwh6kzwvf9] { background: var(--orange); }
.category-train[b-mwh6kzwvf9] { background: var(--cyan); }
.category-truck[b-mwh6kzwvf9] { background: var(--purple); }
.category-documenten[b-mwh6kzwvf9] { background: var(--lime); }

.kalender-empty-icon[b-mwh6kzwvf9] {
    display: inline-grid;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    place-items: center;
    border-radius: 9px;
    color: #16a34a;
    background: #dcfce7;
    font-size: 14px;
    font-weight: 700;
}

.kalender-selection-summary[b-mwh6kzwvf9] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 150px;
    margin-top: 18px;
    padding: 16px;
    border: 1px solid var(--color-gray-200);
    border-radius: 8px;
    background: var(--color-gray-30);
    overflow: visible;
}

.kalender-selection-empty[b-mwh6kzwvf9] {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    justify-content: center;
    gap: 11px;
}

.kalender-selection-empty-icon[b-mwh6kzwvf9] {
    display: inline-grid;
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    place-items: center;
    border-radius: 9px;
    color: var(--kalender-accent);
    background: var(--white);
    box-shadow: inset 0 0 0 1px rgb(47 125 244 / 16%);
    font-size: 13px;
    font-weight: 700;
    font-family: serif;
    font-style: italic;
}

.kalender-selection-empty h3[b-mwh6kzwvf9],
.kalender-selection-empty p[b-mwh6kzwvf9] {
    margin: 0;
}

.kalender-selection-empty h3[b-mwh6kzwvf9] {
    color: var(--color-gray-600);
    font-size: 12px;
    font-weight: 550;
}

.kalender-selection-empty p[b-mwh6kzwvf9] {
    margin-top: 3px;
    color: var(--color-gray-400);
    font-size: 10.5px;
    line-height: 1.4;
}

.kalender-selection-header[b-mwh6kzwvf9] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}

.kalender-selection-heading[b-mwh6kzwvf9] {
    min-width: 0;
}

.kalender-selection-label[b-mwh6kzwvf9] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 5px;
}

.kalender-selection-eyebrow[b-mwh6kzwvf9] {
    display: block;
    color: var(--color-gray-600);
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.kalender-selection-header h3[b-mwh6kzwvf9] {
    display: -webkit-box;
    overflow: hidden;
    margin: 0;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 550;
    line-height: 1.3;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.kalender-selection-marker[b-mwh6kzwvf9] {
    width: 9px;
    height: 9px;
    flex: 0 0 9px;
    border-radius: 50%;
}

.kalender-selection-details[b-mwh6kzwvf9] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px 14px;
    margin: 0;
}

.kalender-selection-details div[b-mwh6kzwvf9] {
    min-width: 0;
}

.kalender-selection-details dt[b-mwh6kzwvf9] {
    margin-bottom: 2px;
    color: var(--color-gray-500);
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
}

.kalender-selection-details dd[b-mwh6kzwvf9] {
    overflow: hidden;
    margin: 0;
    font-size: var(--fs-caption);
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kalender-selection-summary[b-mwh6kzwvf9]  .kalender-selection-edit {
    padding: 5px;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: var(--kalender-muted);
    box-shadow: none;
    font-size: 10px;
}

.kalender-selection-summary[b-mwh6kzwvf9]  .kalender-selection-edit:hover {
    background: #fff;
    color: var(--kalender-accent);
}

/* Selected appointment card */
.kalender-selection-summary[b-mwh6kzwvf9] {
    --selection-category-color: var(--color-gray-200);
    padding: 0;
    border-inline-start: 4px solid var(--selection-category-color);
    background: var(--color-gray-30);
    overflow: hidden;
}

.kalender-selection-summary.selection-category-barge[b-mwh6kzwvf9] {
    --selection-category-color: var(--green);
}

.kalender-selection-summary.selection-category-medewerkers[b-mwh6kzwvf9] {
    --selection-category-color: var(--blue);
}

.kalender-selection-summary.selection-category-trailer[b-mwh6kzwvf9] {
    --selection-category-color: var(--orange);
}

.kalender-selection-summary.selection-category-train[b-mwh6kzwvf9] {
    --selection-category-color: var(--cyan);
}

.kalender-selection-summary.selection-category-truck[b-mwh6kzwvf9] {
    --selection-category-color: var(--purple);
}

.kalender-selection-summary.selection-category-documenten[b-mwh6kzwvf9] {
    --selection-category-color: var(--lime);
}

.kalender-selection-summary[class*="selection-category-"][b-mwh6kzwvf9] {
    flex: 0 0 auto;
    min-height: 170px;
}

.kalender-selection-empty[b-mwh6kzwvf9] {
    padding: 16px;
}

.kalender-selection-header[b-mwh6kzwvf9] {
    align-items: center;
    margin: 0;
    padding: 10px 14px;
    border-bottom: 1px solid var(--color-gray-200);
    background: var(--white);
}

.kalender-selection-header-main[b-mwh6kzwvf9] {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 10px;
}

.kalender-selection-header h3[b-mwh6kzwvf9] {
    display: block;
    flex: 0 0 auto;
    margin: 0;
    overflow: visible;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    line-height: 1.25;
}

.kalender-selection-tag[b-mwh6kzwvf9] {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: 6px;
    padding: 5px 9px;
    overflow: hidden;
    border-radius: 999px;
    color: var(--selection-category-color);
    background: color-mix(in srgb, var(--selection-category-color) 10%, white);
    font-size: 11px;
    font-weight: 550;
    line-height: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kalender-selection-marker[b-mwh6kzwvf9] {
    width: 5px;
    height: 5px;
    flex: 0 0 5px;
    background: var(--selection-category-color);
}

.kalender-selection-body[b-mwh6kzwvf9] {
    padding: 12px 14px;
    background-color: var(--color-gray-30);
}

.kalender-selection-title[b-mwh6kzwvf9] {
    display: -webkit-box;
    margin: 2px 0 5px;
    overflow: hidden;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-2-5);
    font-weight: 550;
    line-height: 1.35;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.kalender-selection-details[b-mwh6kzwvf9] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.kalender-selection-details .kalender-selection-detail-row[b-mwh6kzwvf9] {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    min-height: 30px;
    border-bottom: 1px solid var(--color-gray-200);
}

.kalender-selection-details .kalender-selection-detail-row:last-child[b-mwh6kzwvf9] {
    border-bottom: 0;
}

.kalender-selection-detail-icon[b-mwh6kzwvf9] {
    display: inline-grid;
    width: 20px;
    height: 20px;
    place-items: center;
    color: var(--color-gray-500);
}

.kalender-selection-detail-icon[b-mwh6kzwvf9]  .k-svg-icon {
    width: 15px;
    height: 15px;
}

.kalender-selection-code-icon[b-mwh6kzwvf9] {
    border: 1.5px solid currentColor;
    border-radius: 5px;
    font-size: 14px;
    font-weight: 700;
}

.kalender-selection-details .kalender-selection-detail-row dt[b-mwh6kzwvf9] {
    margin: 0;
    color: var(--color-gray-500);
    font-size: 12px;
    font-weight: 500;
    text-transform: none;
}

.kalender-selection-details .kalender-selection-detail-row dd[b-mwh6kzwvf9] {
    max-width: 145px;
    color: var(--color-gray-800);
    text-align: right;
}

.kalender-selection-summary[b-mwh6kzwvf9]  .kalender-selection-edit {
    width: 25px;
    min-width: 20px;
    height: 20px;
    min-height: 20px;
    color: var(--color-gray-500);
}

.kalender-scheduler-card[b-mwh6kzwvf9] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
}

#appointmentScheduler[b-mwh6kzwvf9] {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
}

#appointmentScheduler[b-mwh6kzwvf9]  .k-scheduler {
    height: 100%;
    border: 0;
    background: #fff;
}

#appointmentScheduler[b-mwh6kzwvf9]  .k-scheduler-toolbar {
    padding: 12px 14px;
    border-color: var(--color-gray-200);
    background: var(--white);
}

#appointmentScheduler[b-mwh6kzwvf9]  .kalender-scheduler-range {
    text-transform: capitalize;
}

#appointmentScheduler[b-mwh6kzwvf9]  .kalender-scheduler-range .attachment-title {
    margin: 0;
    color: inherit;
    line-height: 1.2;
}

#appointmentScheduler[b-mwh6kzwvf9]  .kalender-toolbar-views {
    display: inline-flex;
    gap: 2px;
    padding: 3px;
    border: 1px solid var(--color-gray-200);
    border-radius: 7px;
    background: var(--color-gray-30);
}

#appointmentScheduler[b-mwh6kzwvf9]  .kalender-toolbar-view {
    min-height: 28px;
    padding-inline: 10px;
    border: 0;
    border-radius: 5px;
    background: transparent;
    color: var(--color-gray-600);
    box-shadow: none;
    font-size: 11.5px;
}

#appointmentScheduler[b-mwh6kzwvf9]  .kalender-toolbar-view.is-active {
    background: var(--color-primary-700);
    color: var(--white);
}

#appointmentScheduler[b-mwh6kzwvf9]  .k-scheduler-footer {
    display: none;
}

#appointmentScheduler[b-mwh6kzwvf9]  .k-scheduler-layout,
#appointmentScheduler[b-mwh6kzwvf9]  .k-scheduler-header,
#appointmentScheduler[b-mwh6kzwvf9]  .k-scheduler-content,
#appointmentScheduler[b-mwh6kzwvf9]  .k-scheduler-table td,
#appointmentScheduler[b-mwh6kzwvf9]  .k-scheduler-table th {
    border-color: var(--color-gray-200);
}

#appointmentScheduler[b-mwh6kzwvf9]  .k-scheduler-header th {
    color: #344054;
    background: var(--white);
    font-weight: 600;
}

#appointmentScheduler[b-mwh6kzwvf9]  .k-scheduler-times {
    color: var(--kalender-muted);
    background: #fbfcfd;
}

#appointmentScheduler[b-mwh6kzwvf9]  .k-nonwork-hour {
    background: var(--color-gray-50);
}

#appointmentScheduler[b-mwh6kzwvf9]  .k-event {
    border: 0;
    border-radius: 5px;
    box-shadow: 0 1px 3px rgb(15 23 42 / 12%);
}

    #appointmentScheduler[b-mwh6kzwvf9]  .k-event.appointment-truck {
        background: var(--purple-light);
        color: var(--purple);
        box-shadow: inset 4px 0 var(--purple), 0 1px 3px rgb(15 23 42 / 12%);
    }

    #appointmentScheduler[b-mwh6kzwvf9]  .k-event.appointment-trailer {
        background: var(--orange-light);
        color: var(--orange);
        box-shadow: inset 4px 0 var(--orange), 0 1px 3px rgb(15 23 42 / 12%);
    }

    #appointmentScheduler[b-mwh6kzwvf9]  .k-event.appointment-medewerker {
        background: var(--blue-light);
        color: var(--blue);
        box-shadow: inset 4px 0 var(--blue), 0 1px 3px rgb(15 23 42 / 12%);
    }

    #appointmentScheduler[b-mwh6kzwvf9]  .k-event.appointment-barge {
        background: var(--green-light);
        color: var(--green);
        box-shadow: inset 4px 0 var(--green), 0 1px 3px rgb(15 23 42 / 12%);
    }

    #appointmentScheduler[b-mwh6kzwvf9]  .k-event.appointment-train {
        background: var(--blue-light);
        color: var(--cyan);
        box-shadow: inset 4px 0 var(--cyan), 0 1px 3px rgb(15 23 42 / 12%);
    }

    #appointmentScheduler[b-mwh6kzwvf9]  .k-event.appointment-document {
        background: var(--color-gray-30);
        color: var(--color-gray-500);
        box-shadow: inset 4px 0 var(--color-gray-500), 0 1px 3px rgb(15 23 42 / 12%);
    }

    #appointmentScheduler[b-mwh6kzwvf9]  .k-event.appointment-default {
        background: var(--color-primary-50);
        color: var(--color-primary-700);
        box-shadow: inset 4px 0 var(--color-primary-700), 0 1px 3px rgb(15 23 42 / 12%);
    }

#appointmentScheduler[b-mwh6kzwvf9]  .k-event.appointment-inactive {
    opacity: 0.55;
    filter: grayscale(35%);
}

#appointmentScheduler[b-mwh6kzwvf9]  .k-event.appointment-selected,
#appointmentScheduler[b-mwh6kzwvf9]  .k-event.k-selected,
#appointmentScheduler[b-mwh6kzwvf9]  .k-event.k-focus {
    z-index: 2;
    outline-offset: 1px;
}

#appointmentScheduler[b-mwh6kzwvf9]  .k-event.appointment-selected .appointment-content,
#appointmentScheduler[b-mwh6kzwvf9]  .k-event.k-selected .appointment-content,
#appointmentScheduler[b-mwh6kzwvf9]  .k-event.k-focus .appointment-content {
    font-weight: 700;
}

#appointmentScheduler[b-mwh6kzwvf9]  .k-event .appointment-content {
    color: inherit;
    font-weight: 500;
    padding-left: 10px;
    font-size: var(--fs-body-3);
}

.appointment-content[b-mwh6kzwvf9] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.appointment-code[b-mwh6kzwvf9] {
    overflow: hidden;
    font-size: var(--fs-body-3);
    font-weight: 550;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.appointment-title[b-mwh6kzwvf9] {
    overflow: hidden;
    font-size: var(--fs-caption);
    line-height: 1.3;
    text-overflow: ellipsis;
}

.month-appointment .appointment-content-month[b-mwh6kzwvf9] {
    display: block;
    width: 100%;
    overflow: hidden;
    padding-left: 4px;
    line-height: 1;
    white-space: nowrap;
}

.appointment-month-text[b-mwh6kzwvf9] {
    display: block;
    overflow: hidden;
    font-size: var(--fs-body-3);
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: -3px;
}

.appointment-month-text strong[b-mwh6kzwvf9] {
    font-weight: 700;
}

#appointmentScheduler[b-mwh6kzwvf9]  .k-event.nonActiveSchedulerItem {
    opacity: 0.65;
    filter: grayscale(45%);
    outline: 1px dashed var(--color-gray-500);
    outline-offset: -1px;
}

#appointmentScheduler[b-mwh6kzwvf9]  .k-event.nonActiveSchedulerItem {
    background: var(--color-gray-100) !important;
    color: var(--color-gray-600) !important;
    border-color: var(--color-gray-300) !important;
    box-shadow: inset 4px 0 var(--color-gray-400), 0 1px 3px rgb(15 23 42 / 10%) !important;
    opacity: 0.75;
    filter: grayscale(100%);
}

@media (max-width: 1200px) {
    .kalender-header[b-mwh6kzwvf9],
    .kalender-layout[b-mwh6kzwvf9] {
        grid-template-columns: 260px minmax(0, 1fr);
        gap: 16px;
    }

    .kalender-sidebar[b-mwh6kzwvf9] {
        padding-inline: 14px;
    }

    .kalender-selection-summary[b-mwh6kzwvf9] {
        padding: 0;
    }
}

@media (max-width: 960px) {
    .kalender-page[b-mwh6kzwvf9] {
        height: 100%;
        min-height: 0;
        padding-bottom: 32px;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-gutter: stable;
    }

    .kalender-header[b-mwh6kzwvf9] {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }

.kalender-scheduler-heading[b-mwh6kzwvf9] {
        width: 100%;
    }

    .kalender-layout[b-mwh6kzwvf9] {
        grid-template-columns: 1fr;
        gap: 16px;
        height: auto;
        min-height: 0;
        padding-bottom: 16px;
    }

    .kalender-sidebar[b-mwh6kzwvf9] {
        display: grid;
        grid-template-columns: minmax(260px, 1fr) minmax(220px, .8fr);
        grid-template-rows: auto auto auto;
        align-items: start;
        gap: 18px;
        height: max-content;
        min-height: max-content;
        overflow: visible;
    }

    .kalender-view-buttons[b-mwh6kzwvf9] {
        grid-column: 1 / -1;
        margin-bottom: 0;
    }

    .kalender-date-picker[b-mwh6kzwvf9] {
        align-self: stretch;
        min-height: 300px;
        padding: 0 18px 0 0;
        border-right: 1px solid var(--color-gray-200);
        border-bottom: 0;
    }

    .kalender-categories[b-mwh6kzwvf9] {
        padding: 4px 0 0;
        border-bottom: 0;
    }

    .kalender-selection-summary[b-mwh6kzwvf9] {
        flex: none;
        grid-column: 1 / -1;
        margin-top: 0;
        min-height: 150px;
    }

    .kalender-scheduler-card[b-mwh6kzwvf9],
    #appointmentScheduler[b-mwh6kzwvf9] {
        height: clamp(620px, 72vh, 820px);
    }
}

@media (max-width: 700px) {
    .kalender-page[b-mwh6kzwvf9] {
        padding: 10px 10px 32px;
    }

    .kalender-header[b-mwh6kzwvf9] {
        margin-bottom: 8px;
    }

    .kalender-scheduler-heading[b-mwh6kzwvf9] {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .kalender-header-actions[b-mwh6kzwvf9],
    .kalender-header-actions[b-mwh6kzwvf9]  .k-button {
        width: 100%;
    }

    .kalender-sidebar[b-mwh6kzwvf9] {
        display: flex;
        flex-direction: column;
        gap: 0;
        height: max-content;
        min-height: max-content;
        padding: 14px;
        overflow: visible;
    }

    .kalender-date-picker[b-mwh6kzwvf9] {
        width: 100%;
        min-height: 300px;
        padding: 0 0 16px;
        border-right: 0;
        border-bottom: 1px solid var(--color-gray-200);
    }

    .kalender-categories[b-mwh6kzwvf9] {
        width: 100%;
        padding: 16px 4px 8px;
        border-bottom: 1px solid var(--color-gray-200);
    }

    .kalender-selection-summary[b-mwh6kzwvf9] {
        flex: none;
        width: 100%;
        min-height: 170px;
        margin-top: 16px;
    }

    .kalender-scheduler-card[b-mwh6kzwvf9] {
        max-width: 100%;
        margin-bottom: 4px;
        overflow-x: auto;
        overflow-y: hidden;
    }

    #appointmentScheduler[b-mwh6kzwvf9] {
        min-width: 680px;
    }

    #appointmentScheduler[b-mwh6kzwvf9]  .k-scheduler-toolbar {
        position: sticky;
        left: 0;
        z-index: 3;
        min-width: min(680px, 100vw);
    }
}

@media (max-width: 480px) {
    .kalender-view-buttons[b-mwh6kzwvf9]  .k-button {
        padding-inline: 6px;
        font-size: 12px;
    }

    .kalender-selection-details[b-mwh6kzwvf9] {
        grid-template-columns: 1fr;
        gap: 9px;
    }

    .kalender-selection-empty[b-mwh6kzwvf9] {
        align-items: flex-start;
        flex-direction: column;
    }

    #appointmentScheduler[b-mwh6kzwvf9]  .k-scheduler-toolbar {
        flex-wrap: wrap;
        gap: 6px;
    }
}

/* Responsive layout overrides */
@media (max-width: 1100px) {
    .kalender-page[b-mwh6kzwvf9] {
        height: 100%;
        min-height: 0;
        padding: 14px 14px 30px;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-gutter: stable;
    }

    .kalender-header[b-mwh6kzwvf9] {
        display: block;
        margin-bottom: 10px;
    }

    .kalender-compact-header[b-mwh6kzwvf9] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px;
        width: 100%;
    }

    .kalender-compact-header h3[b-mwh6kzwvf9] {
        flex: 1 1 auto;
        min-width: 0;
    }

    .kalender-compact-header .kalender-header-actions[b-mwh6kzwvf9] {
        flex: 0 0 auto;
    }

    .kalender-compact-controls[b-mwh6kzwvf9] {
        display: flex;
        align-items: center;
        gap: 8px;
        width: 100%;
        margin-bottom: 10px;
        padding: 8px;
        border: 1px solid var(--color-gray-200);
        border-radius: 7px;
        background: var(--white);
        box-shadow: 0 1px 2px rgb(15 23 42 / 5%);
    }

    .kalender-compact-views[b-mwh6kzwvf9] {
        display: flex;
        flex: 1 1 auto;
        gap: 2px;
        padding: 3px;
        border: 1px solid var(--color-gray-100);
        border-radius: 7px;
        background: var(--color-gray-30);
    }

    .kalender-compact-views[b-mwh6kzwvf9]  .k-button {
        flex: 1 1 0;
        min-width: 0;
        border: 0;
        border-radius: 5px;
        background: transparent;
        color: var(--color-gray-600);
        box-shadow: none;
    }

.kalender-compact-views[b-mwh6kzwvf9]  .kalender-view-button.is-active {
        background: var(--color-primary-700);
        color: var(--white);
    }

    .kalender-scheduler-heading[b-mwh6kzwvf9] {
        width: 100%;
    }

    .kalender-layout[b-mwh6kzwvf9] {
        display: flex;
        flex: none;
        flex-direction: column;
        gap: 16px;
        width: 100%;
        height: auto;
        min-height: 0;
        padding-bottom: 18px;
    }

    .kalender-desktop-splitter[b-mwh6kzwvf9] {
        height: auto !important;
        overflow: visible;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    .kalender-desktop-splitter[b-mwh6kzwvf9]  .k-pane {
        overflow: visible;
    }

    [b-mwh6kzwvf9] .k-pane.kalender-sidebar-pane {
        display: none !important;
        width: 0 !important;
        min-width: 0 !important;
        max-width: 0 !important;
        flex: 0 0 0 !important;
        overflow: hidden !important;
    }

    [b-mwh6kzwvf9] .k-pane.kalender-sidebar-pane + .k-splitbar {
        display: none !important;
        width: 0 !important;
        flex: 0 0 0 !important;
    }

    .kalender-scheduler-pane[b-mwh6kzwvf9] {
        height: auto;
        padding: 0;
        background: transparent;
    }

    .kalender-sidebar[b-mwh6kzwvf9] {
        display: flex;
        flex: none;
        flex-direction: column;
        gap: 0;
        width: 100%;
        height: fit-content;
        min-height: 0;
        padding: 16px;
        overflow: hidden;
    }

    .kalender-view-buttons[b-mwh6kzwvf9] {
        width: 100%;
        margin: 0 0 14px;
    }

    .kalender-date-picker[b-mwh6kzwvf9] {
        display: block;
        position: relative;
        flex: none;
        width: 100%;
        min-width: 0;
        height: auto;
        min-height: 310px;
        padding: 0 0 16px;
        border-right: 0;
        border-bottom: 1px solid var(--color-gray-200);
        overflow: visible;
    }

    .kalender-date-picker[b-mwh6kzwvf9]  .k-calendar,
    .kalender-date-picker[b-mwh6kzwvf9]  .k-calendar-view {
        position: relative;
        width: 100%;
        height: auto;
        min-height: 280px;
    }

    .kalender-categories[b-mwh6kzwvf9] {
        display: grid;
        flex: none;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 4px 16px;
        width: 100%;
        min-width: 0;
        padding: 16px 4px 12px;
        border-right: 0;
        border-bottom: 1px solid var(--color-gray-200);
    }

    .kalender-categories h3[b-mwh6kzwvf9] {
        grid-column: 1 / -1;
        margin-bottom: 6px;
    }

    .kalender-category[b-mwh6kzwvf9] {
        min-width: 0;
        margin-bottom: 8px;
    }

    .kalender-selection-summary[b-mwh6kzwvf9] {
        flex: none;
        width: 100%;
        min-height: 175px;
        margin: 14px 0 0;
        overflow: hidden;
    }

    .kalender-scheduler-card[b-mwh6kzwvf9],
    #appointmentScheduler[b-mwh6kzwvf9] {
        flex: none;
        width: 100%;
        height: clamp(620px, 72vh, 820px);
    }

    .kalender-scheduler-card[b-mwh6kzwvf9] {
        position: relative;
        clear: both;
    }

}

.kalender-view-label-short[b-mwh6kzwvf9] {
    display: none;
}

.kalender-filter-backdrop[b-mwh6kzwvf9] {
    position: fixed;
    z-index: 9998;
    inset: 0;
    background: transparent;
}

[b-mwh6kzwvf9] .kalender-filter-popup {
    z-index: 9999;
    margin-top: 6px;
    border: 1px solid var(--color-gray-200);
    border-radius: 10px;
    background: var(--white);
    box-shadow: 0 14px 36px rgb(15 23 42 / 16%);
    max-width: calc(100vw - 20px);
}

[b-mwh6kzwvf9] .kalender-filter-popup-content {
    padding: 14px;
}

[b-mwh6kzwvf9] .kalender-filter-popup-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--color-gray-200);
}

[b-mwh6kzwvf9] .kalender-filter-popup-header strong,
[b-mwh6kzwvf9] .kalender-filter-popup-header span {
    display: block;
}

[b-mwh6kzwvf9] .kalender-filter-close {
    width: 18px;
    min-width: 18px;
    height: 18px;
    padding: 0;
}

[b-mwh6kzwvf9] .kalender-filter-options {
    display: grid;
    gap: 2px;
    padding-top: 10px;
}

[b-mwh6kzwvf9] .kalender-date-popup {
    z-index: 9999;
    margin-top: 6px;
    border: 1px solid var(--color-gray-200);
    border-radius: 10px;
    background: var(--white);
    box-shadow: 0 14px 36px rgb(15 23 42 / 16%);
    max-width: calc(100vw - 20px);
}

[b-mwh6kzwvf9] .kalender-date-popup-content {
    padding: 10px;
}

[b-mwh6kzwvf9] .kalender-date-popup-content .k-calendar,
[b-mwh6kzwvf9] .kalender-date-popup-content .k-calendar-view {
    width: 100%;
    border: 0;
}

@media (max-width: 820px) {
    .kalender-scheduler-card[b-mwh6kzwvf9] {
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-gutter: stable;
    }

    #appointmentScheduler.scheduler-view-day[b-mwh6kzwvf9] {
        min-width: 100%;
    }

    #appointmentScheduler.scheduler-view-week[b-mwh6kzwvf9],
    #appointmentScheduler.scheduler-view-month[b-mwh6kzwvf9] {
        min-width: 760px;
    }

    #appointmentScheduler[b-mwh6kzwvf9]  .k-scheduler-toolbar {
        position: sticky;
        left: 0;
        z-index: 3;
    }
}

@media (max-width: 620px) {
    .kalender-page[b-mwh6kzwvf9] {
        padding: 10px 10px 28px;
    }

    .kalender-header[b-mwh6kzwvf9] {
        margin-bottom: 8px;
    }

    .kalender-scheduler-heading[b-mwh6kzwvf9] {
        align-items: stretch;
        flex-direction: column;
        gap: 8px;
    }

    .kalender-header-actions[b-mwh6kzwvf9],
    .kalender-header-actions[b-mwh6kzwvf9]  .k-button {
        width: 100%;
    }

    .kalender-compact-header .kalender-header-actions[b-mwh6kzwvf9],
    .kalender-compact-header .kalender-header-actions[b-mwh6kzwvf9]  .k-button {
        width: auto;
    }

    .kalender-compact-controls[b-mwh6kzwvf9] {
        gap: 4px;
        padding: 4px;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .kalender-compact-controls[b-mwh6kzwvf9]::-webkit-scrollbar {
        display: none;
    }

    .kalender-compact-views[b-mwh6kzwvf9] {
        min-width: 132px;
    }

    .kalender-compact-controls[b-mwh6kzwvf9]  .k-button {
        padding-inline: 7px;
        white-space: nowrap;
        font-size: 11px;
    }

    .kalender-compact-views .kalender-view-label-full[b-mwh6kzwvf9] {
        display: none;
    }

    .kalender-compact-views .kalender-view-label-short[b-mwh6kzwvf9] {
        display: inline;
    }

    .kalender-sidebar[b-mwh6kzwvf9] {
        padding: 12px;
    }

    .kalender-view-buttons[b-mwh6kzwvf9] {
        margin-bottom: 14px;
    }

    .kalender-date-picker[b-mwh6kzwvf9] {
        width: 100%;
        min-height: 290px;
        padding: 0 0 14px;
        border-right: 0;
        border-bottom: 1px solid var(--color-gray-200);
    }

    .kalender-categories[b-mwh6kzwvf9] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding: 16px 4px 8px;
        border-right: 0;
        border-bottom: 1px solid var(--color-gray-200);
    }

    .kalender-category[b-mwh6kzwvf9] {
        min-height: 28px;
        margin-bottom: 5px;
    }

    .kalender-selection-summary[b-mwh6kzwvf9] {
        width: 100%;
        min-height: 175px;
        margin-top: 14px;
    }

    .kalender-selection-details[b-mwh6kzwvf9] {
        gap: 10px 12px;
    }

    .kalender-scheduler-card[b-mwh6kzwvf9],
    #appointmentScheduler[b-mwh6kzwvf9] {
        height: clamp(560px, 72vh, 700px);
    }

    #appointmentScheduler.scheduler-view-week[b-mwh6kzwvf9],
    #appointmentScheduler.scheduler-view-month[b-mwh6kzwvf9] {
        min-width: 700px;
    }

    #appointmentScheduler[b-mwh6kzwvf9]  .k-scheduler-toolbar {
        flex-wrap: nowrap;
        gap: 6px;
        padding: 8px 10px;
    }

    #appointmentScheduler[b-mwh6kzwvf9]  .k-scheduler-toolbar > * {
        flex: 0 0 auto;
    }

    #appointmentScheduler[b-mwh6kzwvf9]  .k-scheduler-toolbar .k-spacer {
        flex: 1 1 auto;
    }
}

@media (max-width: 420px) {
    .kalender-page[b-mwh6kzwvf9] {
        padding-inline: 8px;
    }

    .kalender-sidebar[b-mwh6kzwvf9] {
        padding: 10px;
    }

    .kalender-view-buttons[b-mwh6kzwvf9]  .k-button {
        min-height: 36px;
        padding-inline: 5px;
        font-size: 12px;
    }

    .kalender-selection-summary[b-mwh6kzwvf9] {
        padding: 13px;
    }

    .kalender-selection-details[b-mwh6kzwvf9] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .kalender-categories[b-mwh6kzwvf9] {
        grid-template-columns: 1fr;
    }

    #appointmentScheduler.scheduler-view-week[b-mwh6kzwvf9],
    #appointmentScheduler.scheduler-view-month[b-mwh6kzwvf9] {
        min-width: 660px;
    }
}
/* _content/eLipsOnline/Components/Pages/OverzichtSchermen/OrderOverzicht - Copy.razor.rz.scp.css */
.sidebar.resizing[b-h5wi2rfbv2],
.right-sidebar.resizing[b-h5wi2rfbv2] {
    transition: none !important;
}

.layout-container[b-h5wi2rfbv2] {
    display: flex;
    height: calc(100vh - 100px);
    overflow: hidden;
}

/* Basisstijl voor beide sidebars */
.sidebar[b-h5wi2rfbv2],
.right-sidebar[b-h5wi2rfbv2] {
    transition: width 0.3s ease;
    overflow-y: auto;
    position: relative;
    padding: 1rem;
    min-width: 0px;
    max-width: 600px;
}

/* Linker sidebar */
.sidebar[b-h5wi2rfbv2] {
    width: 300px;
    background-color: #f5f5f5;
    border-right: 1px solid #ccc;
}

    .sidebar.collapsed[b-h5wi2rfbv2] {
        width: 40px !important;
        padding: 0;
        min-width: 0 !important;
        overflow: hidden;
        border-right: 1px solid #ccc;
    }
/* Rechter sidebar */
.right-sidebar[b-h5wi2rfbv2] {
    width: 300px;
    background-color: #f9f9f9;
    border-left: 1px solid #ccc;
}

    .right-sidebar.collapsed[b-h5wi2rfbv2] {
        width: 40px !important; /* nog smaller dan links */
        padding: 0; /* volledig weg */
        min-width: 0 !important; /* override de min-width van 200px */
        overflow: hidden; /* verberg alles */
        border-left: 1px solid #ccc; /* behoud visuele rand */
    }

/* Toggle button */
.toggle-button[b-h5wi2rfbv2] {
    background: #0078d7;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    padding: 4px 6px;
    position: absolute;
    top: 10px;
    z-index: 10;
}

/* Zet de linkerknop rechts tegen de main-content aan */
.sidebar .toggle-button[b-h5wi2rfbv2] {
    right: 10px;
}

/* Zet de rechterknop links tegen de main-content aan */
.right-sidebar .toggle-button[b-h5wi2rfbv2] {
    left: 10px;
}

/* Middengebied */
.main-content[b-h5wi2rfbv2] {
    flex: 1;
    overflow-y: auto;
    padding: 1rem;
}

/* Checkbox styling (optioneel, voor consistentie) */
input[type="checkbox"][b-h5wi2rfbv2] {
    margin-right: 6px;
}

.resizer-left[b-h5wi2rfbv2],
.resizer-right[b-h5wi2rfbv2] {
    width: 5px;
    cursor: ew-resize;
    background-color: transparent;
    position: relative;
    z-index: 5;
}

    .resizer-left:hover[b-h5wi2rfbv2],
    .resizer-right:hover[b-h5wi2rfbv2] {
        background-color: rgba(0, 0, 0, 0.1);
    }


.spinner[b-h5wi2rfbv2] {
    border: 4px solid #f3f3f3;
    border-top: 4px solid #3498db;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    animation: spin-b-h5wi2rfbv2 1s linear infinite;
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
}

@keyframes spin-b-h5wi2rfbv2 {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}


.right-stack[b-h5wi2rfbv2] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden; /* belangrijk: laat children scrollen, niet de container */
}
.subgrid-panel[b-h5wi2rfbv2] {
    border-bottom: 5px solid #ddd; /* grijze scheidingslijn onder elk panel */
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: auto !important; /* paneel zelf scrolt niet */
}

.subgrid-toolbar[b-h5wi2rfbv2] {
    display: flex;
    gap: 8px;
    margin: 4px 0 8px;
    flex-wrap: wrap;
}
/* _content/eLipsOnline/Components/Pages/OverzichtSchermen/OrderOverzicht.razor.rz.scp.css */
.page-body[b-ypvz1xdx6v] {
    height: 100%;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.splitter-host[b-ypvz1xdx6v] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    height: 100%;
}

.main-pane[b-ypvz1xdx6v] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    min-width: 0;
    padding: 12px 5px 12px 12px;
    overflow: hidden;
/*    border-right: 1px solid var(--color-gray-100);*/
    background-color: var(--color-gray-50);
}

.oo-card-title[b-ypvz1xdx6v] { 
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 0 0 8px;
}

.oo-card-title h3[b-ypvz1xdx6v] { margin: 0; }

.oo-title-actions[b-ypvz1xdx6v] {
    display: flex;
    align-items: center;
    gap: 0px;
    margin-left: auto;
}

.oo-last-updated[b-ypvz1xdx6v] {
    color: var(--color-gray-400);
    font-size: 11px;
    white-space: nowrap;
    margin-right: 5px;
}

[b-ypvz1xdx6v] .oo-title-icon-button {
    width: 28px;
    height: 28px;
    min-width: 28px;
    border: 0;
    background: transparent;
    color: var(--color-gray-700);
    padding: 4px;
}

[b-ypvz1xdx6v] .oo-title-icon-button:hover {
    background: var(--color-gray-50);
}

[b-ypvz1xdx6v] .oo-title-icon-button .k-svg-icon {
    width: 16px;
    height: 16px;
}

[b-ypvz1xdx6v] .oo-settings-popup {
    padding: 6px;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12);
}

.oo-settings-option[b-ypvz1xdx6v] {
    min-height: 36px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
}

    .oo-settings-option span[b-ypvz1xdx6v] {
        display: flex;
        align-items: center;
        line-height: 16px;
    }

[b-ypvz1xdx6v] .oo-settings-option .k-checkbox {
    flex: 0 0 auto;
    margin: 0;
}

.oo-settings-option:hover[b-ypvz1xdx6v] {
    background: var(--color-gray-50);
}

.oo-kpi-grid[b-ypvz1xdx6v] {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: repeat(5, minmax(120px, 1fr));
    gap: 12px;
    margin: 10px 0 15px;
}

.oo-kpi-card[b-ypvz1xdx6v] {
    min-width: 0;
    min-height: 54px;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: center;
    gap: 20px;
    padding: 13px 15px;
    background: var(--white);
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.03);
}

.oo-kpi-icon[b-ypvz1xdx6v] {
    width: 35px;
    height: 35px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    color: #fff;
}

[b-ypvz1xdx6v] .oo-kpi-icon .k-svg-icon { width: 17px; height: 17px; }
.oo-kpi-icon--planning[b-ypvz1xdx6v] { background: var(--color-gray-400); }
.oo-kpi-icon--handling[b-ypvz1xdx6v] { background: var(--orange); }
.oo-kpi-icon--invoice[b-ypvz1xdx6v] { background: var(--pink); }
.oo-kpi-icon--settle[b-ypvz1xdx6v] { background:var(--purple); }
.oo-kpi-icon--export[b-ypvz1xdx6v] { background: var(--blue); }

.oo-kpi-copy[b-ypvz1xdx6v] { 
    display: flex; 
    min-width: 0; 
    flex-direction: 
    column; gap: 2px; 
}
    .oo-kpi-copy strong[b-ypvz1xdx6v] {
        color: var(--color-gray-800);
        font-size: var(--fs-h4);
        line-height: 1;
        font-weight: 600;
    }

.oo-kpi-copy span[b-ypvz1xdx6v] { 
    color: var(--color-gray-400); 
    font-size: var(--fs-caption); 
    white-space: nowrap; 
    overflow: hidden; 
    text-overflow: ellipsis; 

}

.grid-host[b-ypvz1xdx6v] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.oo-nav-toolbar[b-ypvz1xdx6v] {
    padding: 0px 0px 15px 0;
    gap: 12px;
    background-color: var(--white);
/*    padding: 16px;*/
}

.oo-nav-group[b-ypvz1xdx6v] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 0 0 auto;
}

.oo-nav-label[b-ypvz1xdx6v] {
    font-size: var(--fs-caption);
    color: #8f8f8f;
    line-height: 1;
    padding-left: 0px;
    white-space: nowrap;
}

.oo-nav-group-body[b-ypvz1xdx6v] {
    min-height: 32px;
    gap: 4px;
}

.nested-splitter-layout[b-ypvz1xdx6v] {
    height: 100%;
    min-height: 0;
    display: flex;
    overflow: hidden;
}

.nested-splitter-host[b-ypvz1xdx6v] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    background-color: var(--color-gray-50);
}

.subgrid-panel[b-ypvz1xdx6v] {
    height: 100%;
    min-height: 0;
    min-width: 0;
    padding: 3px;
    box-sizing: border-box;
    overflow: hidden;
    display: flex;
    flex-direction: column;
/*    background: #fff;*/
/*    border: 1px solid var(--color-gray-100);*/
/*    border-radius: 5px;*/
/*    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);*/
}

    .subgrid-panel > *[b-ypvz1xdx6v] {
        flex: 1 1 auto;
        min-height: 0;
    }

.subgrid-panel[b-ypvz1xdx6v]  .grid-rounded {
    width: 100%;
    height: 100% !important;
    margin: 0;
    box-sizing: border-box;
}

.unpinned-panel[b-ypvz1xdx6v] {
    width: 39px;
    flex: 0 0 39px;
    background: var(--kendo-color-surface, #fafafa);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    padding: 6px 4px;
    gap: 6px;
}

.page-body[b-ypvz1xdx6v] {
    height: 100%;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.page-body-content[b-ypvz1xdx6v] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    display: flex;
    overflow: hidden;
}

.splitter-host[b-ypvz1xdx6v] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    height: 100%;
}

.oo-card[b-ypvz1xdx6v] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background-color: var(--white);
    padding: 20px;
    border-radius: 5px;
    border: 1px solid var(--color-gray-200);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.nested-splitter-host[b-ypvz1xdx6v] {
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    padding: 10px 10px 10px 0px;
}

.unpinned-panel[b-ypvz1xdx6v] {
    width: 39px;
    flex: 0 0 39px;
    height: 100%;
    background: var(--white);
    border-left: 1px solid var(--color-gray-100);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    padding: 6px 4px;
    gap: 6px;
    overflow-y: auto;
}

[b-ypvz1xdx6v] .nested-splitter-host .k-splitter,
[b-ypvz1xdx6v] .nested-splitter-host .k-pane {
    background-color: var(--color-gray-50);
}
.order-details-window__content[b-ypvz1xdx6v] {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.order-details-window__content[b-ypvz1xdx6v]  .split-page {
    height: 100%;
    min-height: 0;
}

.oo-grid-toolbar__filters[b-ypvz1xdx6v] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    min-width: 0;
}

.oo-grid-toolbar[b-ypvz1xdx6v] { align-items: flex-start; }
.oo-grid-toolbar__filters[b-ypvz1xdx6v] { flex: 1 1 auto; }
.oo-grid-toolbar__actions[b-ypvz1xdx6v] { align-self: flex-start; }

/* Tablet/mobile: stack the complete overview vertically. */
@media (max-width: 1200px) {
    .page-body[b-ypvz1xdx6v],
    .page-body-content[b-ypvz1xdx6v],
    .splitter-host[b-ypvz1xdx6v] {
        height: auto;
        min-height: 100%;
        overflow: visible;
    }

    .page-body-content[b-ypvz1xdx6v] {
        display: block;
    }
    /* The main order pane and optional detail pane are placed below each other. */
    .splitter-host[b-ypvz1xdx6v]  > .k-splitter {
        height: auto !important;
        display: flex;
        flex-direction: column;
        overflow: visible;
    }

        .splitter-host[b-ypvz1xdx6v]  > .k-splitter > .k-pane {
            width: 100% !important;
            height: auto !important;
            flex: 0 0 auto !important;
            overflow: visible;
        }

        .splitter-host[b-ypvz1xdx6v]  > .k-splitter > .k-splitbar {
            display: none;
        }

    .main-pane[b-ypvz1xdx6v] {
        height: auto;
        min-height: 0;
        padding: 10px;
        overflow: visible;
    }

    .oo-card[b-ypvz1xdx6v] {
        height: auto;
        overflow: visible;
        padding: 16px;
    }

    .oo-card-title[b-ypvz1xdx6v] {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .oo-title-actions[b-ypvz1xdx6v] {
        width: 100%;
        margin-left: 0;
        justify-content: flex-start;
    }

    .oo-last-updated[b-ypvz1xdx6v] {
        margin-right: auto;
    }

    .oo-kpi-grid[b-ypvz1xdx6v] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .oo-kpi-card[b-ypvz1xdx6v] {
        width: 100%;
        grid-template-columns: 35px minmax(0, 1fr);
        gap: 14px;
    }

    .oo-status-chips[b-ypvz1xdx6v] {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
    }

    .oo-status-chips-label[b-ypvz1xdx6v] {
        margin: 0 4px 0 0;
    }

    .oo-status-chip[b-ypvz1xdx6v] {
        width: auto;
    }

    .oo-nav-toolbar[b-ypvz1xdx6v] {
        flex-direction: column;
        align-items: stretch !important;
    }

    .oo-nav-group[b-ypvz1xdx6v],
    .oo-nav-group-body[b-ypvz1xdx6v] {
        width: 100%;
    }

    .oo-grid-toolbar[b-ypvz1xdx6v] {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: start;
        gap: 10px;
    }

    .oo-grid-toolbar__filters[b-ypvz1xdx6v] {
        width: 100%;
        display: grid;
        grid-column: 1 / -1;
        grid-row: 2;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: center;
        gap: 10px;
    }

        .oo-grid-toolbar__filters .oo-grid-filter[b-ypvz1xdx6v] {
            width: 100%;
            min-width: 0;
        }

        .oo-grid-toolbar__filters .oo-nav-group-body[b-ypvz1xdx6v],
        .oo-grid-toolbar__filters[b-ypvz1xdx6v]  .k-datepicker {
            width: 100% !important;
        }

    .oo-search-row[b-ypvz1xdx6v] {
        width: 100%;
        grid-column: 1 / -1;
    }

    .oo-grid-filter--search[b-ypvz1xdx6v] {
        grid-column: 1 / -1;
    }

        .oo-grid-filter--search[b-ypvz1xdx6v]  .k-grid-search {
            width: min(100%, 565px);
        }

    .oo-grid-toolbar__actions[b-ypvz1xdx6v] {
        grid-column: 2;
        grid-row: 1;
        align-self: start;
        justify-self: end;
    }

    .grid-host[b-ypvz1xdx6v] {
        min-height: 520px;
        overflow-x: auto;
    }

    .nested-splitter-layout[b-ypvz1xdx6v] {
        height: auto;
        min-height: 0;
        overflow: visible;
    }

    .nested-splitter-host[b-ypvz1xdx6v] {
        height: auto;
        min-height: 0;
        padding: 10px;
        overflow: visible;
    }

    .nested-splitter-host[b-ypvz1xdx6v]  > .k-splitter {
        display: flex;
        flex-direction: column;
        gap: 12px;
        height: auto !important;
        overflow: visible;
    }

    .nested-splitter-host[b-ypvz1xdx6v]  > .k-splitter > .k-pane {
        width: 100% !important;
        height: 230px !important;
        min-height: 230px !important;
        flex: 0 0 230px !important;
        overflow: hidden;
    }

    .nested-splitter-host[b-ypvz1xdx6v]  > .k-splitter > .k-splitbar {
        display: none;
    }

    .subgrid-panel[b-ypvz1xdx6v] {
        height: 230px;
        min-height: 0;
    }

    .unpinned-panel[b-ypvz1xdx6v] {
        height: auto;
        min-height: 0;
    }
}

.oo-search-row[b-ypvz1xdx6v] {
    display: flex;
    flex: 1 1 340px;
    align-items: center;
    gap: 8px;
    min-width: 240px;
}

.oo-search-row[b-ypvz1xdx6v]  > .k-textbox { flex: 1 1 auto; width: auto !important; min-width: 180px; }
[b-ypvz1xdx6v] .oo-search-popup { max-width: calc(100vw - 24px); }

[b-ypvz1xdx6v] .oo-more-filters-button {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    background: var(--white);
}

    [b-ypvz1xdx6v] .oo-more-filters-button:hover,
    [b-ypvz1xdx6v] .oo-more-filters-button.is-open {
        border-color: var(--color-selected-border);
        background: var(--color-primary-50);
        color: var(--color-primary-700);
    }

.oo-search-popup-card[b-ypvz1xdx6v] {
    background: var(--white);
    border-radius: 5px;
    border: 1px solid var(--color-gray-200);
}

.oo-search-popup__header[b-ypvz1xdx6v] {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 0px 0px 10px;
    border-bottom: 1px solid var(--color-gray-200);
    padding: 14px 20px;
}

.oo-search-popup__header-icon[b-ypvz1xdx6v] {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
    border-radius: 5px;
    background: var(--color-primary-50);
    color: var(--color-primary-700);
}

.oo-search-popup_title[b-ypvz1xdx6v] {
    color: var(--color-gray-800);
    font-weight: 600;
    font-size: var(--fs-body-2);
    margin-bottom: 2px;
}

.oo-search-popup__hint[b-ypvz1xdx6v] {
    color: var(--color-gray-400);
    font-size: var(--fs-caption);
}

.oo-search-popup__grid[b-ypvz1xdx6v] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    padding: 14px 20px;
}

.oo-search-popup__label[b-ypvz1xdx6v] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin: 0;
    color: var(--color-secondary-700);
    font-size: var(--fs-caption);
    font-weight: 500;
}

.oo-search-popup__label--wide[b-ypvz1xdx6v] {
    grid-column: 1 / -1;
}

.oo-search-popup__actions[b-ypvz1xdx6v] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    padding: 7px 20px 14px;
}

    .oo-search-popup__actions[b-ypvz1xdx6v]  .filters-clear-btn {
        display: flex;
        align-items: center;
        gap: 8px;
        border: 0;
        background: none;
        color: var(--color-primary-700);
        font-weight: 500;
        font-size: var(--fs-body-3);
        padding-left: 0;
    }

    .oo-search-popup__actions[b-ypvz1xdx6v]  .filters-clear-btn .k-svg-icon {
       width: 12px;
       height: 12px;
    }

.oo-active-filters[b-ypvz1xdx6v] {
    flex-basis: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
    margin-bottom: 2px;
}

.oo-active-filter[b-ypvz1xdx6v] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 9px;
    border-radius: 999px;
    background: var(--color-selected-bg);
    color: var(--color-primary-700);
    font-size: var(--fs-caption);
}

.oo-active-filter__remove[b-ypvz1xdx6v] {
    width: 16px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: currentColor;
    cursor: pointer;
}

    .oo-active-filter__remove:hover[b-ypvz1xdx6v] {
        background: rgba(0, 102, 255, .12);
    }

    .oo-active-filter__remove[b-ypvz1xdx6v]  .k-svg-icon {
        width: 10px;
        height: 10px;
    }

.oo-clear-filters[b-ypvz1xdx6v] {
    border: 0;
    background: transparent;
    color: var(--color-secondary-700);
    font-size: var(--fs-caption);
    cursor: pointer;
    font-weight: 450;
}
.oo-clear-filters:hover[b-ypvz1xdx6v] {
    border: 0;
    background: transparent;
    color: var(--color-primary-700);
}


@media (max-width: 600px) {
    .main-pane[b-ypvz1xdx6v] {
        padding: 6px;
    }

    .oo-card[b-ypvz1xdx6v] {
        padding: 12px;
    }

    .oo-title-actions[b-ypvz1xdx6v] {
        flex-wrap: wrap;
    }

    .oo-grid-toolbar[b-ypvz1xdx6v] {
        grid-template-columns: minmax(0, 1fr);
    }

    .oo-grid-toolbar__filters[b-ypvz1xdx6v] {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        grid-row: 2;
    }

    .oo-grid-filter--search[b-ypvz1xdx6v] {
        grid-column: 1;
    }

    .oo-grid-toolbar__filters .oo-grid-filter[b-ypvz1xdx6v],
    .oo-grid-toolbar__filters .oo-nav-group-body[b-ypvz1xdx6v],
    .oo-grid-toolbar__filters[b-ypvz1xdx6v]  .k-datepicker,
    .oo-grid-toolbar__filters[b-ypvz1xdx6v]  .k-combobox,
    .oo-grid-filter--search[b-ypvz1xdx6v]  .k-grid-search {
        width: 100% !important;
    }

    .oo-grid-toolbar__actions[b-ypvz1xdx6v] {
        grid-column: 1;
        grid-row: 1;
        justify-self: end;
        margin-bottom: 2px;
    }

    .oo-search-row[b-ypvz1xdx6v] { width: 100%; min-width: 0; flex-wrap: nowrap; }
    .oo-search-row[b-ypvz1xdx6v]  .k-textbox { width: auto !important; min-width: 0; flex: 1 1 auto; }
    .oo-search-row[b-ypvz1xdx6v]  .oo-more-filters-button { width: auto; flex: 0 0 auto; justify-content: center; }
    .oo-search-popup__grid[b-ypvz1xdx6v] { grid-template-columns: 1fr; }
    .oo-search-popup__label--wide[b-ypvz1xdx6v] { grid-column: auto; }
    .oo-search-popup__header[b-ypvz1xdx6v],
    .oo-search-popup__grid[b-ypvz1xdx6v],
    .oo-search-popup__actions[b-ypvz1xdx6v] { padding-left: 14px; padding-right: 14px; }
    .oo-active-filters[b-ypvz1xdx6v] { width: 100%; }
}
/* _content/eLipsOnline/Components/Pages/OverzichtSchermen/TruckPlanning.razor.rz.scp.css */
.truck-planning-page[b-b6wjv6lazf] {
    --planning-gap: 7px;
    --planning-surface: var(--white, #fff);
    display: flex;
    flex-direction: column;
    gap: var(--planning-gap);
    height: calc(100vh - 24px);
    min-height: 720px;
    overflow: hidden;
    background-color: var(--color-gray-50, #f9fafb);
}

.planning-layout[b-b6wjv6lazf] {
    position: relative;
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    background-color: var(--color-gray-50, #f9fafb);
}

.planning-layout[b-b6wjv6lazf]  .planning-main-splitter {
    min-width: 0;
    flex: 1 1 auto;
    height: 100% !important;
    border: 0;
    overflow: visible;
    background-color: var(--color-gray-50, #f9fafb) !important;
}

.planning-layout[b-b6wjv6lazf]  .planning-main-splitter > .k-splitter-pane {
    min-width: 0;
    overflow: visible;
    border: 0;
    background: transparent;
}

/* Telerik applies its surface color to .k-pane, so override that generated layer too. */
.planning-layout[b-b6wjv6lazf]  .k-splitter-flex .k-pane {
    background-color: var(--color-gray-50, #f9fafb) !important;
}

.planning-layout[b-b6wjv6lazf]  .planning-main-splitter > .k-splitbar {
    border: 0;
    background: transparent;
    width: 5px;
}

/* Pane visibility is controlled exclusively by our custom header button. */
.planning-layout[b-b6wjv6lazf]  .planning-main-splitter > .k-splitbar .k-collapse-prev,
.planning-layout[b-b6wjv6lazf]  .planning-main-splitter > .k-splitbar .k-collapse-next,
.planning-layout[b-b6wjv6lazf]  .planning-main-splitter > .k-splitbar .k-expand-prev,
.planning-layout[b-b6wjv6lazf]  .planning-main-splitter > .k-splitbar .k-expand-next,
.planning-layout[b-b6wjv6lazf]  .planning-main-splitter > .k-splitbar .k-splitbar-toggle {
    display: none !important;
}

.planning-center-content[b-b6wjv6lazf],
.planning-scheduler[b-b6wjv6lazf],
.planning-rit-details[b-b6wjv6lazf],
.planning-right-panel[b-b6wjv6lazf],
.planning-right-content[b-b6wjv6lazf] {
    height: 100%;
    min-height: 0;
}

.planning-center-content[b-b6wjv6lazf] {
    background-color: var(--color-gray-50, #f9fafb);
}

.planning-center-content[b-b6wjv6lazf]  .planning-center-splitter {
    height: 100% !important;
    border: 0;
    overflow: visible;
    background-color: var(--color-gray-50, #f9fafb) !important;
}

    .planning-center-content[b-b6wjv6lazf]  .planning-center-splitter > .k-splitter-pane {
        min-width: 0;
        overflow: visible;
        border: 0;
        background: transparent;
    }

    .planning-center-content[b-b6wjv6lazf]  .planning-center-splitter .k-splitbar {
       height: 5px;
    }

.planning-center-content[b-b6wjv6lazf]  .planning-center-splitter > .k-splitbar-horizontal {
    height: 0;
    min-height: 0;
    border: 0;
    background: transparent;
}

.planning-scheduler[b-b6wjv6lazf],
.planning-rit-details[b-b6wjv6lazf] {
    overflow: hidden;
}

.planning-card[b-b6wjv6lazf] {
    box-sizing: border-box;
    overflow: hidden;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    background: var(--white);
    box-shadow: 0 1px 3px rgba(16, 24, 40, 0.08), 0 5px 14px rgba(16, 24, 40, 0.08);
}

.planning-card--scheduler[b-b6wjv6lazf] {
    width: calc(100% - 17px);
    height: calc(100% - 10px);
    margin: 5px 5px 5px 12px;
}

.planning-card--bottom[b-b6wjv6lazf] {
    width: calc(100% - 17px);
    height: calc(100% - 17px);
    margin: 5px 5px 12px 12px;
}

.planning-card--right[b-b6wjv6lazf] {
    width: calc(100% - 17px);
    height: calc(100% - 17px);
    margin: 5px 12px 12px 5px;
}

.planning-rit-details[b-b6wjv6lazf]  .k-tabstrip-content {
    padding: 0;
    height: 100%;
    min-height: 0;
    border: 0;
}

.planning-rit-details[b-b6wjv6lazf]  .k-tabstrip,
.planning-rit-details[b-b6wjv6lazf]  .k-tabstrip-items-wrapper,
.planning-rit-details[b-b6wjv6lazf]  .k-tabstrip-content > .k-animation-container,
.planning-rit-details[b-b6wjv6lazf]  .k-tabstrip-content > .k-animation-container > .k-child-animation-container,
.planning-rit-details[b-b6wjv6lazf]  .k-tabstrip-content .k-tabstrip-content {
    min-height: 0;
}

.planning-rit-details[b-b6wjv6lazf]  .k-tabstrip {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.planning-rit-details[b-b6wjv6lazf]  .k-tabstrip-content,
.planning-rit-details[b-b6wjv6lazf]  .k-tabstrip-content > .k-animation-container,
.planning-rit-details[b-b6wjv6lazf]  .k-tabstrip-content > .k-animation-container > .k-child-animation-container {
    flex: 1 1 auto;
    height: 100%;
}

.planning-rit-tab-content[b-b6wjv6lazf] {
    height: 100%;
    min-height: 0;
}

.planning-activiteiten-content[b-b6wjv6lazf] {
    display: flex;
    overflow: hidden;
}

.planning-activiteiten-grid[b-b6wjv6lazf],
.planning-activiteiten-map[b-b6wjv6lazf] {
    min-width: 0;
    min-height: 0;
}

.planning-activiteiten-grid[b-b6wjv6lazf] {
    flex: 1 1 65%;
    height: 100%;
    overflow: hidden;
}

.planning-activiteiten-grid[b-b6wjv6lazf]  .k-grid {
    height: 100% !important;
}

.planning-activiteiten-map[b-b6wjv6lazf] {
    flex: 0 0 33%;
    height: 100%;
    border-left: 1px solid var(--color-gray-200, #e5e7eb);
}

.planning-map-panel[b-b6wjv6lazf],
#truckPlanningMap[b-b6wjv6lazf] {
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
}

.planning-map-panel[b-b6wjv6lazf] {
    position: relative;
    overflow: hidden;
}

.planning-scheduler[b-b6wjv6lazf]  .k-scheduler {
    border: 0;
    border-radius: inherit;
}

.planning-scheduler[b-b6wjv6lazf]  .k-scheduler-toolbar {
    display: flex !important;
    min-height: 46px;
    padding: 6px 10px 6px 20px;
    border-bottom: 1px solid var(--color-gray-200, #e4e7ec);
    background: var(--white) !important;
}

/* Keep the custom resource header and the scheduler's top-left corner white. */
.planning-scheduler[b-b6wjv6lazf]  .k-scheduler-toolbar .k-toolbar,
.planning-scheduler[b-b6wjv6lazf]  .k-scheduler-toolbar .k-toolbar-item:first-child,
.planning-scheduler[b-b6wjv6lazf]  .k-scheduler-head .k-scheduler-row:first-child .k-side-cell,
.planning-scheduler[b-b6wjv6lazf]  .k-scheduler-head .k-scheduler-row:first-child .k-resource-cell {
    background-color: var(--white) !important;
}

.planning-resource-title[b-b6wjv6lazf] {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 10px;
    color: var(--color-secondary-700);
    font-size: var(--fs-h6);
    line-height: 1;
    white-space: nowrap;
    font-weight: 500;
}

.planning-resource-count[b-b6wjv6lazf] {
    font-size: var(--fs-caption);
    font-weight: 600;
    background-color: var(--color-primary-50);
    color: var(--color-primary-700);
    padding: 5px;
    border-radius: 999px;
}

.planning-resource-toolbar-actions[b-b6wjv6lazf] {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    align-items: center;
    gap: 8px;
}

.planning-scheduler[b-b6wjv6lazf]  .planning-resource-search .k-input-prefix {
    color: var(--color-gray-500, #667085);
}

.planning-scheduler[b-b6wjv6lazf]  .k-scheduler-table,
.planning-scheduler[b-b6wjv6lazf]  .k-scheduler-table th,
.planning-scheduler[b-b6wjv6lazf]  .k-scheduler-table td,
.planning-scheduler[b-b6wjv6lazf]  .k-scheduler-layout,
.planning-scheduler[b-b6wjv6lazf]  .k-scheduler-header,
.planning-scheduler[b-b6wjv6lazf]  .k-scheduler-content,
.planning-scheduler[b-b6wjv6lazf]  .k-scheduler-cell,
.planning-scheduler[b-b6wjv6lazf]  .k-slot-cell {
    border-color: var(--color-gray-200, #e4e7ec) !important;
}

/* Scheduler appointment card */
.planning-scheduler[b-b6wjv6lazf]  .k-event:has(.truck-planning-item) {
    height: 76px !important;
    min-height: 76px;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: var(--color-gray-900, #101828) !important;
    box-shadow: none !important;
}

.truck-planning-item[b-b6wjv6lazf] {
    container-type: inline-size;
    display: grid;
    position: absolute;
    inset: 0;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    width: 100%;
    height: 100%;
    padding: 10px 14px;
    overflow: hidden;
    border: 1px solid var(--color-selected-border);
    border-radius: 5px;
    background: var(--color-selected-bg-soft);
    color: var(--color-gray-900, #101828);
    box-sizing: border-box;
    cursor: grab;
}

.truck-planning-item.is-completed[b-b6wjv6lazf] {
    border-color: var(--color-success-500, #3bb273);
    background: var(--color-success-30);
}

    .truck-planning-item.is-completed .planning-card-icon[b-b6wjv6lazf] {
        background: var(--green-light);
        color: var(--color-success-700, #2a9d5b);
    }

.truck-planning-item.is-selected[b-b6wjv6lazf] {
    border: 2px solid var(--color-primary-700, #2f7df4);
    background: var(--color-selected-bg, #f3f7fd);
    color: var(--color-gray-900, #101828);
    box-shadow: 0 3px 10px rgb(47 125 244 / 14%);
}

.truck-planning-item.is-selected .planning-card-icon[b-b6wjv6lazf] {
    background: var(--color-primary-700, #2f7df4);
    color: #fff;
}

html[data-theme="dark"] .truck-planning-item.is-selected[b-b6wjv6lazf] {
    border-color: var(--color-primary-500, #36a5d9);
    background: var(--color-selected-bg, #17354a);
    color: var(--color-gray-900, #f5f7fa);
}

.truck-planning-item.is-completed.is-selected[b-b6wjv6lazf] {
    border-color: var(--color-success-700);
}

.truck-planning-item.is-completed.is-selected .planning-card-icon[b-b6wjv6lazf] {
    background: var(--color-success-700, #2a9d5b);
    color: #fff;
}

.truck-planning-item.is-cancelled[b-b6wjv6lazf] {
    border-color: var(--color-danger-500, #f43f5e);
    background: color-mix(in srgb, var(--color-danger-500, #f43f5e) 7%, var(--white, #fff));
}

.truck-planning-item.is-cancelled .planning-card-icon[b-b6wjv6lazf] {
    background: color-mix(in srgb, var(--color-danger-500, #f43f5e) 14%, var(--white, #fff));
    color: var(--color-danger-700, #be123c);
}

.truck-planning-item.is-cancelled.is-selected[b-b6wjv6lazf] {
    border-color: var(--color-danger-700, #be123c);
    box-shadow: 0 3px 10px rgb(244 63 94 / 18%);
}

.truck-planning-item.is-cancelled.is-selected .planning-card-icon[b-b6wjv6lazf] {
    background: var(--color-danger-700, #be123c);
    color: #fff;
}

.planning-card-icon[b-b6wjv6lazf] {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border-radius: 6px;
    background: var(--color-primary-50);
    color: var(--color-primary-700);
}

.planning-card-icon[b-b6wjv6lazf]  .k-svg-icon {
    width: 17px;
    height: 17px;
}

.planning-card-content[b-b6wjv6lazf],
.planning-card-resources[b-b6wjv6lazf] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.planning-card-content[b-b6wjv6lazf] {
    gap: 4px;
}

.planning-card-title[b-b6wjv6lazf],
.planning-card-route[b-b6wjv6lazf],
.planning-card-container[b-b6wjv6lazf],
.planning-card-resources span[b-b6wjv6lazf] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.planning-card-title[b-b6wjv6lazf] {
    font-size: var(--fs-body-2-5);
    font-weight: 550;
    line-height: 1.15;
    color: var(--color-secondary-700);
}

.planning-card-route[b-b6wjv6lazf],
.planning-card-container[b-b6wjv6lazf],
.planning-card-resources[b-b6wjv6lazf] {
    font-size: 12px;
    line-height: 1.3;
}

.planning-card-route[b-b6wjv6lazf] {
    font-size: 11px;
    color: var(--color-gray-600);
}

.planning-card-container[b-b6wjv6lazf] {
    color: var(--color-gray-700);
    display: flex;
    align-items: center;
    gap: 5px;
}

.planning-card-container[b-b6wjv6lazf]  .k-svg-icon {
    width: 12px;
    height: 12px;
}

.planning-card-resources[b-b6wjv6lazf] {
    max-width: 120px;
    align-items: flex-end;
    gap: 7px;
    padding: 6px 10px;
    border-radius: 5px;
    text-align: right;
    color: var(--color-secondary-700);
    font-weight: 500;
}

.planning-card-driver[b-b6wjv6lazf], .planning-card-truck[b-b6wjv6lazf] {
    display: flex;
    align-items: center;
    gap: 7px;
}

.planning-card-driver[b-b6wjv6lazf]  .k-svg-icon, .planning-card-truck[b-b6wjv6lazf]  .k-svg-icon {
    width: 12px;
    height: 12px;
}

@container (max-width: 360px) {
    .planning-card-resources[b-b6wjv6lazf] {
        display: none;
    }
}

@container (max-width: 230px) {
    .truck-planning-item[b-b6wjv6lazf] {
        gap: 8px;
        padding: 8px 10px;
    }

    .planning-card-icon[b-b6wjv6lazf] {
        width: 30px;
        height: 30px;
    }

    .planning-card-icon[b-b6wjv6lazf]  .k-svg-icon {
        width: 18px;
        height: 18px;
    }

    .planning-card-title[b-b6wjv6lazf] {
        font-size: 13px;
    }

    .planning-card-container[b-b6wjv6lazf] {
        display: none;
    }
}

.planning-resource-header[b-b6wjv6lazf] {
    display: flex;
    align-items: center;
    gap: 20px;
    width: 250px;
    min-height: 78px;
    padding-left: 5px;
    text-align: left;
}

.planning-scheduler[b-b6wjv6lazf]  .k-scheduler-layout-flex .k-resource-cell {
    background: var(--color-gray-30);
}

.planning-resource-image[b-b6wjv6lazf] {
    display: grid;
    flex: 0 0 55px;
    width: 55px;
    height: 55px;
    overflow: hidden;
    padding: 3px;
    place-items: center;
    border-radius: 8px;
    background: var(--color-gray-100);
    color: var(--color-gray-500);
}

.planning-resource-image img[b-b6wjv6lazf] {
    width: 100%;
    height: 100%;
    padding: 3px;
    object-fit: contain;
    object-position: center;
}

.planning-resource-image[b-b6wjv6lazf]  .k-svg-icon {
    width: 23px;
    height: 23px;
}

.planning-resource-details[b-b6wjv6lazf] {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    line-height: 1.2;
}

.planning-resource-code[b-b6wjv6lazf],
.planning-resource-type[b-b6wjv6lazf] {
    max-width: 122px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.planning-resource-code[b-b6wjv6lazf] {
    color: var(--color-secondary-700, #003b70);
    font-size: var(--fs-body-2-5);
    font-weight: 600;
}

.planning-resource-type[b-b6wjv6lazf] {
    margin-top: 6px;
    color: var(--color-gray-500, #667085);
    font-size: 12px;
    font-weight: 500;
}

.planning-resource-status[b-b6wjv6lazf] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 6px;
    color: var(--color-gray-500, #475467);
    font-size: 11px;
    font-weight: 400;
    max-width: 145px;
    line-height: 1.25;
}

.planning-resource-status-text[b-b6wjv6lazf] {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.planning-resource-status-dot[b-b6wjv6lazf] {
    flex: 0 0 7px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--color-success-500, #12b76a);
    box-shadow: 0 0 0 2px color-mix(
        in srgb,
        var(--color-success-500, #12b76a) 18%,
        var(--white, #fff)
    );
}

.planning-resource-status.is-unavailable[b-b6wjv6lazf] {
    color: var(--color-danger-700, #be123c);
}

.planning-resource-status.is-unavailable .planning-resource-status-dot[b-b6wjv6lazf] {
    background: var(--color-danger-500, #f43f5e);
    box-shadow: 0 0 0 2px color-mix(
        in srgb,
        var(--color-danger-500, #f43f5e) 18%,
        var(--white, #fff)
    );
}

.planning-right-panel[b-b6wjv6lazf] {
    position: relative;
    display: flex;
    flex-direction: column;
}

.panel-header[b-b6wjv6lazf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 15px;
    border-bottom: 1px solid var(--color-gray-200);
}

.panel-title-text[b-b6wjv6lazf] {
    font-size: var(--fs-h5);
    color: var(--color-secondary-700);
    font-weight: 450;
}

.planning-right-content[b-b6wjv6lazf] {
    flex: 1 1 auto;
    overflow: hidden;
}

.planning-right-content[b-b6wjv6lazf]  .k-tabstrip {
    display: flex;
    min-height: 0;
    flex-direction: column;
    height: 100%;
    border: 0;
}

.planning-right-content[b-b6wjv6lazf]  .k-tabstrip-content {
    flex: 1 1 auto;
    height: auto !important;
    min-height: 0;
    overflow: hidden;
    padding: 0;
    border: 0;
}

.planning-right-content[b-b6wjv6lazf]  .k-tabstrip-content > .k-animation-container,
.planning-right-content[b-b6wjv6lazf]  .k-child-animation-container {
    height: 100%;
    min-height: 0;
    padding: 0;
    border: 0;
}

.planning-right-content[b-b6wjv6lazf]  .k-tabstrip-items-wrapper {
    flex: 0 0 auto;
    padding: 0 2px;
    border-bottom: 1px solid var(--color-gray-200, #e4e7ec);
}

.planning-right-content[b-b6wjv6lazf]  .k-tabstrip-items-start {
    gap: 4px;
    padding: 0;
}

.planning-right-content[b-b6wjv6lazf]  .k-tabstrip-items .k-tabstrip-item,
.planning-right-content[b-b6wjv6lazf]  .k-tabstrip-items .k-item {
    position: relative;
    margin: 0;
    border: 0;
    background: transparent;
    color: var(--color-gray-600, #475467);
    font-size: 14px;
    font-weight: 600;
}

.planning-right-content[b-b6wjv6lazf]  .k-tabstrip-items .k-link {
    padding: 12px 12px 12px;
}

.planning-right-content[b-b6wjv6lazf]  .k-tabstrip-items .k-tabstrip-item::after,
.planning-right-content[b-b6wjv6lazf]  .k-tabstrip-items .k-item::after {
    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;
    height: 2px;
    border-radius: 2px 2px 0 0;
    background: transparent;
    content: "";
}

.planning-right-content[b-b6wjv6lazf]  .k-tabstrip-items .k-tabstrip-item.k-active,
.planning-right-content[b-b6wjv6lazf]  .k-tabstrip-items .k-item.k-active {
    color: var(--color-primary-700, #175cd3);
}

.planning-right-content[b-b6wjv6lazf]  .k-tabstrip-items .k-tabstrip-item.k-active::after,
.planning-right-content[b-b6wjv6lazf]  .k-tabstrip-items .k-item.k-active::after {
    background: var(--color-primary-600, #1570ef);
}

    .planning-right-content[b-b6wjv6lazf]  .planning-orders-list .k-table-tbody
    .k-table-row.k-selected > .k-table-td:not(.k-group-cell),
    .planning-right-content[b-b6wjv6lazf]  .planning-orders-list .k-table-list
    .k-table-row.k-selected:not(.k-group-cell) {
        background-color: var(--white);
    }

.planning-resource-tab[b-b6wjv6lazf] {
    display: flex;
    height: 100%;
    min-height: 0;
    flex-direction: column;
    overflow: hidden;
}

.planning-resource-tab-search[b-b6wjv6lazf] {
    flex: 0 0 auto;
    padding: 16px 16px 6px;
}

.planning-resource-tab-search[b-b6wjv6lazf]  .k-input {
    width: 100%;
}

.planning-resource-list-scroll[b-b6wjv6lazf] {
    flex: 1 1 auto;
    min-height: 0;
    padding-bottom: 8px;
    overflow-y: auto;
    box-sizing: border-box;
}

.planning-list-empty-state[b-b6wjv6lazf] {
    display: flex;
    min-height: 220px;
    padding: 40px 24px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--color-gray-500, #667085);
    text-align: center;
    box-sizing: border-box;
}

.planning-list-empty-icon[b-b6wjv6lazf] {
    display: grid;
    width: 44px;
    height: 44px;
    margin-bottom: 12px;
    place-items: center;
    border-radius: 50%;
    background: var(--color-gray-50, #f9fafb);
    color: var(--color-gray-500, #667085);
    box-shadow: 0 0 0 1px var(--color-gray-200, #e4e7ec);
}

.planning-list-empty-icon[b-b6wjv6lazf]  .k-svg-icon {
    width: 21px;
    height: 21px;
}

.planning-list-empty-state strong[b-b6wjv6lazf] {
    margin-bottom: 4px;
    color: var(--color-gray-800, #1d2939);
    font-size: 14px;
    font-weight: 600;
}

.planning-list-empty-state > span:last-child[b-b6wjv6lazf] {
    max-width: 260px;
    font-size: 12px;
    line-height: 1.45;
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-chauffeurs-list {
    height: auto;
    border: 0;
    background: transparent;
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-chauffeurs-list .k-grid-header {
    display: none;
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-chauffeurs-list .k-grid-content {
    padding: 0px 12px 10px;
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-chauffeurs-list .k-table {
    border-spacing: 0 8px;
}

    .planning-resource-tab[b-b6wjv6lazf]  .planning-chauffeurs-list tbody tr,
    .planning-resource-tab[b-b6wjv6lazf]  .planning-chauffeurs-list tbody tr:hover {
        background: transparent;
        box-shadow: 0 1px 2px rgba(15, 23, 42, 0.02);
    }

.planning-resource-tab[b-b6wjv6lazf]  .planning-chauffeurs-list tbody td {
    padding: 0;
    border-top: 1px solid var(--color-gray-200, #e4e7ec);
    border-bottom: 1px solid var(--color-gray-200, #e4e7ec);
    background: var(--white, #fff);
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-chauffeurs-list tbody td:first-child {
    width: 38px;
    min-width: 38px;
    border-left: 1px solid var(--color-gray-200, #e4e7ec);
    border-radius: 5px 0 0 5px;
    color: var(--color-gray-500, #667085);
    background: var(--color-gray-50);
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-chauffeurs-list tbody td:last-child {
    border-right: 1px solid var(--color-gray-200, #e4e7ec);
    border-radius: 0 5px 5px 0;
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-chauffeurs-list tbody tr:last-child td {
    border-bottom-width: 1px !important;
    border-bottom-style: solid !important;
    border-bottom-color: var(--color-gray-200, #e4e7ec);
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-chauffeurs-list tbody tr.k-selected td,
.planning-resource-tab[b-b6wjv6lazf]  .planning-vehicles-list tbody tr.k-selected td {
    border-color: var(--color-selected-border, #97bcf1);
    background: var(--color-selected-bg-v2, var(--color-selected-bg, #f3f7fd));
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-chauffeurs-list tbody tr.k-selected td:first-child,
.planning-resource-tab[b-b6wjv6lazf]  .planning-vehicles-list tbody tr.k-selected td:first-child {
    background: var(--color-gray-50, #f9fafb) !important;
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-chauffeurs-list tbody tr:hover td,
.planning-resource-tab[b-b6wjv6lazf]  .planning-vehicles-list tbody tr:hover td {
    border-top-color: var(--color-selected-border, #97bcf1);
    border-bottom-color: var(--color-selected-border, #97bcf1);
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-chauffeurs-list tbody tr:hover td:first-child,
.planning-resource-tab[b-b6wjv6lazf]  .planning-vehicles-list tbody tr:hover td:first-child {
    border-left-color: var(--color-selected-border, #97bcf1);
    background: var(--color-gray-50, #f9fafb);
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-chauffeurs-list tbody tr:hover td:last-child,
.planning-resource-tab[b-b6wjv6lazf]  .planning-vehicles-list tbody tr:hover td:last-child {
    border-right-color: var(--color-selected-border, #97bcf1);
}

.planning-chauffeur-card[b-b6wjv6lazf] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 64px;
    padding: 12px 14px 12px 12px;
}

.planning-chauffeur-icon[b-b6wjv6lazf] {
    display: flex;
    flex: 0 0 42px;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    overflow: hidden;
    border-radius: 50%;
    background: var(--color-primary-50, #eff8ff);
}

    .planning-chauffeur-icon img[b-b6wjv6lazf] {
        width: 100%;
        height: 100%;
        object-fit: contain;
        padding: 2px 2px -2px 2px;
    }

.planning-chauffeur-details[b-b6wjv6lazf] {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 1px;
}

.planning-chauffeur-details strong[b-b6wjv6lazf] {
    overflow: hidden;
    color: var(--color-secondary-700, #344054);
    font-size: var(--fs-body-3);
    font-weight: 550;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.planning-chauffeur-details span[b-b6wjv6lazf] {
    overflow: hidden;
    color: var(--color-gray-600, #475467);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-vehicles-list {
    height: auto;
    border: 0;
    background: transparent;
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-vehicles-list .k-grid-header {
    display: none;
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-vehicles-list .k-grid-content {
    padding: 0px 12px 10px;
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-vehicles-list .k-table {
    border-spacing: 0 8px;
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-vehicles-list tbody tr,
.planning-resource-tab[b-b6wjv6lazf]  .planning-vehicles-list tbody tr:hover {
    background: transparent;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.02);
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-vehicles-list tbody td {
    padding: 0;
    border-top: 1px solid var(--color-gray-200, #e4e7ec);
    border-bottom: 1px solid var(--color-gray-200, #e4e7ec);
    background: var(--white, #fff);
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-vehicles-list tbody td:first-child {
    width: 38px;
    min-width: 38px;
    border-left: 1px solid var(--color-gray-200, #e4e7ec);
    border-radius: 5px 0 0 5px;
    color: var(--color-gray-500, #667085);
    background: var(--color-gray-50);
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-vehicles-list tbody td:last-child {
    border-right: 1px solid var(--color-gray-200, #e4e7ec);
    border-radius: 0 5px 5px 0;
}

.planning-resource-tab[b-b6wjv6lazf]  .planning-vehicles-list tbody tr:last-child td {
    border-bottom-width: 1px !important;
    border-bottom-style: solid !important;
    border-bottom-color: var(--color-gray-200, #e4e7ec);
}

.planning-vehicle-card[b-b6wjv6lazf] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 68px;
    padding: 10px 14px 10px 12px;
}

.planning-vehicle-icon[b-b6wjv6lazf] {
    display: flex;
    flex: 0 0 42px;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    overflow: hidden;
    border-radius: 50%;
    background: var(--color-primary-50, #eff8ff);
}

.planning-vehicle-icon img[b-b6wjv6lazf] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 0 3px;
}

.planning-vehicle-details[b-b6wjv6lazf] {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 2px;
}

.planning-vehicle-details strong[b-b6wjv6lazf] {
    overflow: hidden;
    color: var(--color-secondary-700, #344054);
    font-size: var(--fs-body-2);
    font-weight: 550;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.planning-vehicle-details span[b-b6wjv6lazf] {
    overflow: hidden;
    color: var(--color-gray-600, #475467);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.planning-chauffeur-details .planning-resource-card-badge[b-b6wjv6lazf],
.planning-vehicle-details .planning-resource-card-badge[b-b6wjv6lazf] {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    max-width: 180px;
    padding: 2px 10px;
    overflow: hidden;
    border-radius: 999px;
    background: var(--color-primary-50, #eff8ff);
    color: var(--color-primary-700, #175cd3);
    font-size: 11px;
    font-weight: 500;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.planning-chauffeur-details[b-b6wjv6lazf],
.planning-vehicle-details[b-b6wjv6lazf] {
    display: grid;
    min-width: 0;
    flex: 1 1 auto;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 12px;
    row-gap: 3px;
}

.planning-chauffeur-details .planning-resource-card-badge[b-b6wjv6lazf],
.planning-vehicle-details .planning-resource-card-badge[b-b6wjv6lazf] {
    align-self: center;
    justify-self: end;
}

.planning-chauffeur-details .planning-resource-status[b-b6wjv6lazf],
.planning-vehicle-details .planning-resource-status[b-b6wjv6lazf] {
    grid-column: 1 / -1;
    max-width: 230px;
    margin-top: 0;
    color: var(--color-gray-500, #667085);
    line-height: 1.25;
}

.planning-chauffeur-details .planning-resource-status.is-unavailable[b-b6wjv6lazf],
.planning-vehicle-details .planning-resource-status.is-unavailable[b-b6wjv6lazf] {
    color: var(--color-danger-700, #be123c);
}

.planning-chauffeur-details .planning-resource-status-text[b-b6wjv6lazf],
.planning-vehicle-details .planning-resource-status-text[b-b6wjv6lazf] {
    color: inherit;
}

.planning-tab-title[b-b6wjv6lazf] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 450;
}

.planning-tab-count[b-b6wjv6lazf] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background-color: var(--color-gray-100, #f2f4f7);
    color: var(--color-gray-600, #475467);
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
}

.planning-right-content[b-b6wjv6lazf]  .k-tabstrip-item.k-active .planning-tab-count {
    background-color: var(--color-primary-50);
    color: var(--color-primary-700, #175cd3);
}

.planning-orders-tab[b-b6wjv6lazf] {
    display: flex;
    height: 100%;
    min-height: 0;
    flex-direction: column;
}

.planning-orders-search[b-b6wjv6lazf] {
    flex: 0 0 auto;
    padding: 16px 16px 6px;
}

.planning-orders-search[b-b6wjv6lazf]  .k-input {
    width: 100%;
}

.planning-order-date-filters[b-b6wjv6lazf] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    width: 100%;
    margin-top: 13px;
}

.planning-orders-scroll[b-b6wjv6lazf] {
    flex: 1 1 auto;
    min-height: 0;
    padding-bottom: 8px;
    overflow-y: auto;
    box-sizing: border-box;
}

.planning-right-content[b-b6wjv6lazf]  .planning-orders-list {
    height: auto;
    border: 0;
    background: transparent;
}

.planning-right-content[b-b6wjv6lazf]  .planning-orders-list .k-grid-header {
    display: none;
}

.planning-right-content[b-b6wjv6lazf]  .planning-orders-list .k-grid-content {
    padding: 0;
    overflow: visible;
    background: transparent;
}

.planning-right-content[b-b6wjv6lazf]  .planning-orders-list .k-grid-content table {
    width: calc(100% - 32px);
    margin: 0 16px;
    border-collapse: separate;
    border-spacing: 0 10px;
}

    .planning-right-content[b-b6wjv6lazf]  .planning-orders-list tbody tr,
    .planning-right-content[b-b6wjv6lazf]  .planning-orders-list tbody tr:hover,
    .planning-right-content[b-b6wjv6lazf]  .planning-orders-list tbody tr.k-selected {
        background: transparent;
        box-shadow: 0 1px 2px rgba(15, 23, 42, 0.02);
    }

.planning-right-content[b-b6wjv6lazf]  .planning-orders-list tbody td {
    padding: 0;
    border-top: 1px solid var(--color-gray-200, #e4e7ec);
    border-bottom: 1px solid var(--color-gray-200, #e4e7ec);
    background: var(--white, #fff);
}

.planning-right-content[b-b6wjv6lazf]  .planning-orders-list tbody td:first-child {
    position: relative;
    z-index: 2;
    width: 36px;
    min-width: 36px;
    border-left: 1px solid var(--color-gray-200, #e4e7ec);
    border-radius: 5px 0 0 5px;
    background: var(--color-gray-50);
}

.planning-right-content[b-b6wjv6lazf]  .planning-orders-list tbody td:last-child {
    border-right: 1px solid var(--color-gray-200, #e4e7ec);
    border-radius: 0 5px 5px 0;
}

/* Telerik removes the final grid row border; these rows are standalone cards. */
.planning-right-content[b-b6wjv6lazf]  .planning-orders-list tbody tr:last-child td {
    border-bottom-width: 1px !important;
    border-bottom-style: solid !important;
    border-bottom-color: var(--color-gray-200, #e4e7ec);
}

.planning-right-content[b-b6wjv6lazf]  .planning-orders-list .k-grid-norecords td,
.planning-right-content[b-b6wjv6lazf]  .planning-orders-list .k-grid-norecords .k-table-td {
    padding: 8px 12px;
    border-right: 1px solid var(--color-gray-200, #e4e7ec);
    border-left: 1px solid var(--color-gray-200, #e4e7ec);
    border-radius: 5px;
    background: var(--color-gray-50, #f9fafb);
}

.planning-order-card[b-b6wjv6lazf] {
    margin: 0;
    padding: 15px 16px 17px 16px;
    border: 0;
    background: transparent;
}

.planning-right-content[b-b6wjv6lazf]  .planning-orders-list tbody tr.k-selected td {
    border-color: var(--color-selected-border);
    background: var(--color-selected-bg-v2);
}

.planning-right-content[b-b6wjv6lazf]  .planning-orders-list tbody tr.k-selected td:first-child {
    background-color: var(--color-gray-50, #f9fafb) !important;
}

.planning-right-content[b-b6wjv6lazf]  .planning-orders-list tbody tr:hover td {
    border-top-width: 1px;
    border-bottom-width: 1px;
    border-top-color: var(--color-selected-border, #84adff);
    border-bottom-color: var(--color-selected-border, #84adff);
}

.planning-right-content[b-b6wjv6lazf]  .planning-orders-list tbody tr:hover td:first-child {
    border-left-width: 1px;
    border-left-color: var(--color-selected-border, #84adff);
    background: var(--color-gray-50, #f9fafb);
}

.planning-right-content[b-b6wjv6lazf]  .planning-orders-list tbody tr:hover td:last-child {
    border-right-width: 1px;
    border-right-color: var(--color-selected-border, #84adff);
}

.planning-order-card-header[b-b6wjv6lazf],
.planning-order-card-summary[b-b6wjv6lazf],
.planning-order-activity-row[b-b6wjv6lazf] {
    display: grid;
    align-items: center;
}

.planning-order-card-header[b-b6wjv6lazf] {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
}

.planning-order-card-title[b-b6wjv6lazf] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-2);
    font-weight: 550;
}

.planning-order-card-carrier[b-b6wjv6lazf] {
    max-width: 120px;
    overflow: hidden;
    padding: 2px 10px;
    border-radius: 999px;
    background: var(--color-primary-50, #eff8ff);
    color: var(--color-primary-600, #1570ef);
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: var(--fs-caption);
}

.planning-order-card-summary[b-b6wjv6lazf] {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    margin-top: 4px;
    color: var(--color-gray-700);
    font-size: var(--fs-caption);
}

.planning-order-card-date[b-b6wjv6lazf] {
    color: var(--color-gray-600);
    font-weight: 450;
    white-space: nowrap;
    font-size: var(--fs-caption);
}

.planning-order-card-container[b-b6wjv6lazf], .planning-order-card-referentie[b-b6wjv6lazf] {
    display: flex;
    gap: 7px;
    align-items: center;
    color: var(--color-gray-700);
    font-size: 13px;
}

    .planning-order-card-container[b-b6wjv6lazf]  .k-svg-icon, .planning-order-card-referentie[b-b6wjv6lazf]  .k-svg-icon {
        width: 13px;
        height: 13px;
        color: var(--color-gray-500);
    }

.planning-order-card-container[b-b6wjv6lazf] {
    margin-top: 4px;
}

.planning-order-card-activities[b-b6wjv6lazf] {
    margin-top: 15px;
    padding: 3px 12px;
    border-radius: 8px;
    background: var(--color-gray-50);
}

.planning-order-activity-row[b-b6wjv6lazf] {
    grid-template-columns: minmax(72px, .8fr) minmax(90px, 1fr) auto;
    gap: 10px;
    min-height: 27px;
    color: var(--color-gray-900);
    font-size: var(--fs-caption);
}

    .planning-order-activity-row:first-child[b-b6wjv6lazf] {
        border-bottom: 1px solid var(--color-gray-200);
    }

.planning-order-activity-code[b-b6wjv6lazf],
.planning-order-activity-location[b-b6wjv6lazf] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.planning-order-activity-code[b-b6wjv6lazf] {
    color: var(--color-primary-700);
    font-weight: 450;
}

.planning-order-activity-time[b-b6wjv6lazf] {
    white-space: nowrap;
}

.planning-order-more-activities[b-b6wjv6lazf],
.planning-order-no-activities[b-b6wjv6lazf] {
    color: var(--color-gray-700, #344054);
    font-size: 12px;
}

.planning-order-more-activities[b-b6wjv6lazf] {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--color-secondary-700);
    
}

.planning-order-more-activities-dot[b-b6wjv6lazf] {
    display: inline-block;
    flex: 0 0 5px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: var(--color-primary-700);
}

/*.truck-planning-nav-header {
    flex: 0 0 auto;
    padding: 8px 14px;
    margin: 12px 12px 0 12px;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    background: var(--white);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}*/

.truck-planning-nav-header[b-b6wjv6lazf] {
    flex: 0 0 auto;
    padding: 10px 14px;
    border-bottom: 1px solid var(--color-gray-200);
    background: var(--white);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03), 0 4px 12px rgba(0, 0, 0, 0.03);
}

.pv-nav-toolbar[b-b6wjv6lazf],
.pv-nav-section[b-b6wjv6lazf],
.pv-nav-actions[b-b6wjv6lazf],
.planning-view-buttons[b-b6wjv6lazf],
.planning-period-controls[b-b6wjv6lazf],
.planning-resource-picker[b-b6wjv6lazf],
.planning-view-switch[b-b6wjv6lazf] {
    display: flex;
    align-items: center;
}

.pv-nav-date[b-b6wjv6lazf] {
    gap: 3px;
}

.pv-nav-toolbar[b-b6wjv6lazf] {
    gap: 10px;
    flex-wrap: wrap;
}

.planning-period-controls[b-b6wjv6lazf] {
    gap: 8px;
}

.planning-resource-picker[b-b6wjv6lazf] {
    gap: 8px;
}

.pv-nav-actions[b-b6wjv6lazf] {
    gap: 8px;
    margin-left: auto;
    flex-wrap: wrap;
}

.planning-view-switch[b-b6wjv6lazf] {
    display: inline-flex;
}

        .planning-view-switch[b-b6wjv6lazf]  .planning-view-button:first-child {
            border-radius: 5px 0 0 5px;
        }

        .planning-view-switch[b-b6wjv6lazf]  .planning-view-button:last-child {
            margin-left: -1px;
            border-radius: 0 5px 5px 0;
        }

    .planning-view-switch[b-b6wjv6lazf]  .planning-view-button.is-active {
        z-index: 1;
        background: var(--color-primary-50);
        color: var(--color-primary-700);
    }


        .planning-view-switch[b-b6wjv6lazf]  .planning-view-button.is-active:hover {
            background: var(--color-primary-50);
            color: var(--color-primary-700);
        }

.planning-resource-picker[b-b6wjv6lazf] {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.planning-resource-switch[b-b6wjv6lazf] {
    display: inline-flex;
}

        .planning-resource-switch[b-b6wjv6lazf]  .planning-resource-button:first-child {
            border-radius: 5px 0 0 5px;
        }

        .planning-resource-switch[b-b6wjv6lazf]  .planning-resource-button:last-child {
            margin-left: -1px;
            border-radius: 0 5px 5px 0;
        }

    .planning-resource-switch[b-b6wjv6lazf]  .planning-resource-button.is-active {
        z-index: 1;
        background: var(--color-primary-50);
        color: var(--color-primary-700);
    }

        .planning-resource-switch[b-b6wjv6lazf]  .planning-resource-button.is-active:hover {
            background: var(--color-primary-50);
            color: var(--color-primary-700);
        }

.planning-navbar-divider[b-b6wjv6lazf] {
    width: 1px;
    height: 28px;
    margin: 0 8px;
    background: var(--color-gray-200);
}

.planning-right-rail[b-b6wjv6lazf] {
    display: flex;
    flex: 0 0 50px;
    order: 2;
    align-self: stretch;
    width: 50px;
    margin: 5px 8px 12px 5px;
    padding: 6px;
    flex-direction: column;
    align-items: center;
    border: 1px solid var(--color-gray-200, #e4e7ec);
    border-radius: 5px;
    background: var(--white, #fff);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.planning-right-rail-nav[b-b6wjv6lazf] {
    display: flex;
    width: 100%;
    margin-top: 6px;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.planning-right-rail-item[b-b6wjv6lazf],
.planning-right-rail-open[b-b6wjv6lazf],
.panel-header[b-b6wjv6lazf]  .planning-right-rail-open {
    display: inline-flex;
    width: 36px;
    min-width: 36px;
    height: 36px;
    padding: 0;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--color-gray-700, #344054);
    font: inherit;
    cursor: pointer;
}

.planning-right-rail-item[b-b6wjv6lazf] {
    width: 36px;
    height: 72px;
    margin: 0;
    padding: 10px 0 9px;
    flex-direction: column;
    gap: 7px;
    border-bottom: 1px solid var(--color-gray-200, #e4e7ec);
    border-radius: 0;
}

.planning-right-rail-item:last-child[b-b6wjv6lazf] {
    border-bottom: 0;
}

.planning-right-rail-item[b-b6wjv6lazf]  .k-svg-icon,
.planning-right-rail-open[b-b6wjv6lazf]  .k-svg-icon,
.panel-header[b-b6wjv6lazf]  .planning-right-rail-open .k-svg-icon {
    width: 19px;
    height: 19px;
}

.planning-right-rail-count[b-b6wjv6lazf] {
    display: inline-flex;
    min-width: 22px;
    height: 20px;
    padding: 0 6px;
    margin: 0;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: var(--color-primary-50, #eff8ff);
    color: var(--color-primary-700, #175cd3);
    font-size: 11px;
    font-weight: 600;
    line-height: 20px;
    text-align: center;
}

.planning-right-rail-open[b-b6wjv6lazf],
.panel-header[b-b6wjv6lazf]  .planning-right-rail-open {
    flex: 0 0 36px;
    background: none;
}

.panel-header[b-b6wjv6lazf]  .planning-right-rail-open {
    margin-left: auto;
}

.planning-right-rail-item:hover[b-b6wjv6lazf],
.planning-right-rail-item:focus-visible[b-b6wjv6lazf],
.planning-right-rail-open:hover[b-b6wjv6lazf],
.planning-right-rail-open:focus-visible[b-b6wjv6lazf],
.panel-header[b-b6wjv6lazf]  .planning-right-rail-open:hover,
.panel-header[b-b6wjv6lazf]  .planning-right-rail-open:focus-visible {
    outline: none;
    background: var(--color-selected-bg-soft);
    color: var(--color-primary-700, #175cd3);
}

.planning-no-selection[b-b6wjv6lazf] {
    display: flex;
    box-sizing: border-box;
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    min-height: 180px;
    margin: 10px;
    padding: 32px;
    align-items: center;
    justify-content: center;
    border: 1px dashed var(--color-gray-200);
    border-radius: 5px;
    background: var(--color-gray-30);
    color: var(--color-gray-600, #475467);
    text-align: center;
}

.planning-no-selection-content[b-b6wjv6lazf] {
    display: flex;
    max-width: 430px;
    flex-direction: column;
    align-items: center;
}

.planning-no-selection-icon[b-b6wjv6lazf] {
    display: inline-grid;
    width: 48px;
    height: 48px;
    margin-bottom: 14px;
    place-items: center;
    border-radius: 12px;
    background: var(--color-primary-50, #eff8ff);
    color: var(--color-primary-700, #175cd3);
}

.planning-no-selection-icon[b-b6wjv6lazf]  .k-svg-icon {
    width: 22px;
    height: 22px;
}

.planning-no-selection-content strong[b-b6wjv6lazf] {
    margin-bottom: 6px;
    color: var(--color-secondary-700, #101828);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.3;
}

.planning-no-selection-content > span:last-child[b-b6wjv6lazf] {
    color: var(--color-gray-500, #667085);
    font-size: 12px;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .truck-planning-page[b-b6wjv6lazf] {
        height: auto;
        min-height: calc(100vh - 16px);
        overflow: visible;
        padding: 8px;
    }

    .planning-layout[b-b6wjv6lazf] { min-height: 720px; }

    .pv-nav-actions[b-b6wjv6lazf] {
        width: 100%;
        margin-left: 0;
    }
}

@media (max-width: 1500px) {
    .pv-nav-toolbar[b-b6wjv6lazf] {
        gap: 6px;
    }

    .planning-resource-picker[b-b6wjv6lazf] {
        margin-left: 0;
    }

}

.truck-planning-item.is-absence[b-b6wjv6lazf] {
    display: block;
    padding: 10px 12px;
    border: 1px dashed var(--color-gray-300, #d4d4d8);
    border-radius: 6px;
    background:
        repeating-linear-gradient(
            -45deg,
            transparent 0,
            transparent 11px,
            color-mix(in srgb, var(--color-gray-500, #71717a) 6%, transparent) 11px,
            color-mix(in srgb, var(--color-gray-500, #71717a) 6%, transparent) 12px,
            transparent 12px,
            transparent 22px
        ),
        color-mix(in srgb, var(--color-gray-500, #71717a) 3%, var(--white, #fff));
    color: var(--color-gray-900, #18181b);
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--color-white, #fff) 70%, transparent),
                0 1px 2px rgb(16 24 40 / 5%);
    cursor: not-allowed;
}

.planning-absence-content[b-b6wjv6lazf] {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 7px;
}

.planning-absence-heading[b-b6wjv6lazf] {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 8px;
}

.planning-absence-reason[b-b6wjv6lazf] {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    color: var(--color-gray-600);
    font-size: var(--fs-body-3);
    font-weight: 600;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.planning-absence-badge[b-b6wjv6lazf] {
    flex: 0 0 auto;
    margin-left: auto;
    padding: 1px 7px;
    border: 1px solid var(--color-gray-200, #e5e7eb);
    border-radius: 999px;
    background: var(--color-gray-100, #f4f4f5);
    color: var(--color-gray-700, #3f3f46);
    font-size: 10px;
    font-weight: 600;
    line-height: 15px;
    letter-spacing: 0.01em;
}

.planning-absence-period[b-b6wjv6lazf] {
    display: flex;
    min-width: 0;
    align-items: center;
    overflow: hidden;
    color: var(--color-gray-600, #52525b);
    font-size: 11px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@container (max-width: 220px) {
    .truck-planning-item.is-absence[b-b6wjv6lazf] {
        padding-inline: 9px;
    }

    .planning-absence-badge[b-b6wjv6lazf] {
        display: none;
    }
}
/* _content/eLipsOnline/Components/Pages/Stamgegevens/Popups/AfstandModelPopup.razor.rz.scp.css */
[b-9qh5elnuhv] .afstand-form {
    background: var(--color-gray-50);
}

[b-9qh5elnuhv] .afstand-form.k-form,
[b-9qh5elnuhv] .afstand-form .k-form {
    background: var(--color-gray-50);
}

.afstand-window-body[b-9qh5elnuhv] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 26px;
    padding: 28px 30px 20px;
    background: var(--color-gray-50);
    box-sizing: border-box;
}

.afstand-land-row[b-9qh5elnuhv] {
    display: grid;
    grid-template-columns: minmax(250px, 0.9fr) 110px minmax(260px, 2fr);
    column-gap: 12px;
    align-items: center;
}

.afstand-land-label[b-9qh5elnuhv] {
    grid-column: 2;
    margin: 0;
    font-weight: 600;
    color: var(--color-gray-800);
}

.afstand-land-field[b-9qh5elnuhv] {
    grid-column: 3;
    min-width: 0;
}

    .afstand-land-field[b-9qh5elnuhv]  .k-input,
    .afstand-land-field[b-9qh5elnuhv]  .k-picker {
        width: 100%;
    }

.afstand-matrix[b-9qh5elnuhv] {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(250px, 0.9fr) repeat(3, minmax(170px, 1fr));
    gap: 12px;
    align-items: center;
}

.afstand-readonly-field[b-9qh5elnuhv] {
    min-height: 30px;
    display: flex;
    align-items: center;
    padding: 4px 8px;
    border: 1px solid var(--color-gray-200);
    border-radius: 4px;
    background: #fff;
    color: var(--color-gray-700);
    font-size: 0.875rem;
    box-sizing: border-box;
}

.afstand-matrix-head[b-9qh5elnuhv] {
    color: var(--color-gray-700);
    font-size: 0.92rem;
    font-weight: 600;
}

.afstand-row-label[b-9qh5elnuhv] {
    min-width: 0;
    color: var(--color-gray-800);
    font-size: 0.95rem;
    line-height: 1.25;
}

.afstand-matrix[b-9qh5elnuhv]  .k-numerictextbox,
.afstand-matrix[b-9qh5elnuhv]  .k-input {
    width: 100%;
}

.afstand-delete-body[b-9qh5elnuhv] {
    gap: 10px;
}

    .afstand-delete-body p[b-9qh5elnuhv] {
        margin: 0;
        color: var(--color-gray-900);
        font-size: 0.95rem;
    }

.afstand-delete-meta[b-9qh5elnuhv] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    color: var(--color-gray-600);
    font-size: 0.85rem;
}

.afstand-window-footer[b-9qh5elnuhv] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

@media (max-width: 720px) {
    .afstand-land-row[b-9qh5elnuhv],
    .afstand-matrix[b-9qh5elnuhv] {
        grid-template-columns: 1fr;
    }

    .afstand-land-label[b-9qh5elnuhv],
    .afstand-land-field[b-9qh5elnuhv] {
        grid-column: auto;
    }
}
/* _content/eLipsOnline/Components/Pages/Stamgegevens/Popups/MessageBoordcomputerSMS.razor.rz.scp.css */
.wa-send-btn[b-7cbra0xfh7] {
    background-color: #25D366;
    border-color: #25D366;
    color: white;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

    .wa-send-btn:hover[b-7cbra0xfh7] {
        background-color: #1ebe5d;
        border-color: #1ebe5d;
    }


.whatsapp-dialog[b-7cbra0xfh7] {
    border-radius: 12px;
    overflow: hidden;
}


.wa-header[b-7cbra0xfh7] {
    margin-top: -15px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    background: #e6f7ed;
    border-radius: 8px;
}

.wa-title[b-7cbra0xfh7] {
    margin: 0;
    font-weight: 600;
}

.wa-inputLarge[b-7cbra0xfh7] {
    height: 280px;
    min-height: 100px;
    max-height: 280px;
}


.wa-input:focus[b-7cbra0xfh7] {
    box-shadow: 0 0 0 0.2rem rgba(37, 211, 102, 0.15);
}

.wa-inputLarge:focus[b-7cbra0xfh7] {
    box-shadow: 0 0 0 0.2rem rgba(37, 211, 102, 0.15);
}
/* _content/eLipsOnline/Components/Pages/Stamgegevens/Popups/VoertuigPopup.razor.rz.scp.css */
.dialog-body-full[b-p4jf9v5jom] {
    min-height: 0;
    overflow: hidden;
    background-color: var(--color-gray-50);
}

.content-shell[b-p4jf9v5jom] {
    min-height: 0;
}

.content-layout[b-p4jf9v5jom] {
    display: grid;
    grid-template-columns: 270px 1fr;
    gap: 16px;
    height: calc(100vh - 140px);
    min-height: 0;
    overflow: hidden;
}

.content-content[b-p4jf9v5jom] {
    height: 100%;
    overflow-y: auto;
    min-height: 0;
    padding: 0 12px 100px 12px;
}

.content-nav[b-p4jf9v5jom] {
    min-height: 0;
    overflow: hidden;
    padding-top: 20px;
}

.content-section[b-p4jf9v5jom] {
    padding: 25px;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    margin-bottom: 24px;
    background-color: white;
}

.container-type-panel[b-p4jf9v5jom] {
    width: 100%;
}

.container-type-grid[b-p4jf9v5jom] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
}

.container-type-option[b-p4jf9v5jom] {
    min-width: 0;
    min-height: 44px;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid var(--color-gray-200);
    border-radius: 6px;
    background: #fff;
    color: var(--color-gray-900);
    cursor: pointer;
    transition: border-color 120ms ease, background-color 120ms ease, box-shadow 120ms ease;
}

.container-type-option:hover[b-p4jf9v5jom] {
    border-color: var(--color-gray-300);
    background: var(--color-gray-50);
}

    .container-type-option.is-selected[b-p4jf9v5jom] {
        border-color: var( --color-selected-border);
        background: var(--color-selected-bg);
    }

.container-type-option__text[b-p4jf9v5jom] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 500;
}

.content-nav__button[b-p4jf9v5jom] {
    text-align: left !important;
    padding: 10px 12px !important;
    border: 1px solid #ccc !important;
    background: white !important;
    cursor: pointer !important;
}

/* Tablet en kleiner */
@media (max-width: 991.98px) {
    .content-layout[b-p4jf9v5jom] {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .content-nav[b-p4jf9v5jom] {
        display: none;
    }

    .content-content[b-p4jf9v5jom] {
        width: 100%;
    }
}
/* _content/eLipsOnline/Components/Pages/Stamgegevens/Popups/VoertuigPopupFirst.razor.rz.scp.css */
.content-layout[b-4uaqr09y7q] {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 16px;
    height: 65vh;
    border: 1px solid var(--color-gray-100);
    border-radius: 5px;
    background-color: var(--color-gray-50);
}

.content-nav[b-4uaqr09y7q] {
    min-height: 0;
}

.content-content[b-4uaqr09y7q] {
    overflow: auto;
    padding: 12px;
}

.content-section[b-4uaqr09y7q] {
    padding: 25px;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    margin-bottom: 24px;
    background-color: white;
}

.content-nav__button[b-4uaqr09y7q] {
    text-align: left!important;
    padding: 10px 12px!important;
    border: 1px solid #ccc!important;
    background: white!important;
    cursor: pointer!important;
}

/* Tablet en kleiner */
@media (max-width: 991.98px) {
    .content-layout[b-4uaqr09y7q] {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .content-nav[b-4uaqr09y7q] {
        display: none;
    }

    .content-content[b-4uaqr09y7q] {
        width: 100%;
    }
}
/* _content/eLipsOnline/Components/Pages/Stamgegevens/Popups/WhatsappDialog.razor.rz.scp.css */
.whatsapp-dialog[b-52wzuh421z] {
    border-radius: 12px;
    overflow: hidden;
    scrollbar-color: #25D366 #f1f1f1;
}

.wa-accent-bar[b-52wzuh421z] {
    height: 4px;
    background: linear-gradient(90deg, #25D366, #128C7E);
}

.wa-header[b-52wzuh421z] {
    margin-top:-15px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    background: #e6f7ed;
    border-radius: 8px;
}

.wa-title[b-52wzuh421z] {
    margin: 0;
    font-weight: 600;
}

.wa-icon[b-52wzuh421z] {
    color: #25D366;
}

.wa-inputLarge[b-52wzuh421z]{
    height:270px;
    min-height:100px;
    max-height:270px;
}

.wa-input:focus[b-52wzuh421z] {
    border-color: #25D366;
    box-shadow: 0 0 0 0.2rem rgba(37, 211, 102, 0.15);
}

.wa-inputLarge:focus[b-52wzuh421z] {
    border-color: #25D366;
    box-shadow: 0 0 0 0.2rem rgba(37, 211, 102, 0.15);
}

.wa-send-btn[b-52wzuh421z] {
    background-color: #25D366;
    border-color: #25D366;
    color: white;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

    .wa-send-btn:hover[b-52wzuh421z] {
        background-color: #1ebe5d;
        border-color: #1ebe5d;
    }
/* _content/eLipsOnline/Components/Pages/Stamgegevens/Popups/WhatsappTemplateDialog.razor.rz.scp.css */
.template-layout[b-zp3xdfsz86] {
    display: flex;
    gap: 20px;
    height: 100%;
}
/* LINKER LIJST */
.template-fields[b-zp3xdfsz86] {
    width: 280px;
    border-right: 1px solid #ddd;
    padding-right: 10px;
    overflow-y: auto;
    max-height: 650px; /* voorkomt dat hele dialog scrollt */
}
.template-field-item[b-zp3xdfsz86] {
    padding: 6px;
    cursor: pointer;
    border-radius: 4px;
}

    .template-field-item:hover[b-zp3xdfsz86] {
        background: #e6f7ed;
    }


/* RECHTER CONTENT */
.template-content[b-zp3xdfsz86] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.template-actions[b-zp3xdfsz86] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}


.template-content textarea[b-zp3xdfsz86] {
    resize: none;
}

    /* GROTE BLOKKEN */
    .template-content textarea.header[b-zp3xdfsz86],
    .template-content textarea.body[b-zp3xdfsz86],
    .template-content textarea.footer[b-zp3xdfsz86] {
        height: 120px;
    }

    /* BODY extra groot */
    .template-content textarea.body[b-zp3xdfsz86] {
        height: 200px;
    }

    /* KLEINE BLOKKEN */
    .template-content textarea.small[b-zp3xdfsz86] {
        height: 70px;
    }

.dropwrap[b-zp3xdfsz86] {
    position: relative;
}



.template-field-item[b-zp3xdfsz86] {
    padding: 6px;
    margin-bottom: 4px;
    background: #f5f5f5;
    cursor: grab;
}

    .template-field-item.dragging[b-zp3xdfsz86] {
        background: #d0e7ff;
        border: 1px solid #0078d4;
    }

.drag-ghost[b-zp3xdfsz86] {
    position: fixed;
    pointer-events: none;
    background: #0078d4;
    color: white;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    z-index: 9999;
}



/* _content/eLipsOnline/Components/Pages/Stamgegevens/Stamgegevens.razor.rz.scp.css */
.stamgegevens-layout[b-xfc6bzmc5w] {
    display: grid;
    grid-template-columns: 340px 1fr;
    overflow: hidden;
    transition: grid-template-columns 420ms cubic-bezier(.22, 1, .36, 1);
    background-color: var(--color-gray-50);
}

    .stamgegevens-layout.is-collapsed[b-xfc6bzmc5w] {
        grid-template-columns: 65px 1fr;
    }

.stamgegevens-sidebar[b-xfc6bzmc5w] {
    padding-top: 1vh;
    overflow-y: auto;
    min-height: 0;
    border-right: 1px solid var(--color-gray-200);
    background-color: var(--white);
}

.stamgegevens-content[b-xfc6bzmc5w] {
    overflow-y: hidden;
    min-height: 0;
    padding: 20px;
    padding-top: 1vh;
    background-color: var(--white);
    margin: 20px;
    border-radius: 10px;
    border: 1px solid var(--color-gray-200);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

/*FILTER BAR*/
.stam-topbar[b-xfc6bzmc5w] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-4, 16px);
    margin-bottom: var(--space-4, 16px);
}

.stam-topbar__left[b-xfc6bzmc5w] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.stam-title[b-xfc6bzmc5w] {
    padding: 8px 0 15px 0;
    margin: 0;
}

.stam-filter[b-xfc6bzmc5w] {
    display: grid;
    gap: 6px;
    max-width: 220px;
}

.stam-filter__label[b-xfc6bzmc5w] {
    font-size: var(--font-xs, 12px);
    color: var(--txt-600, #666);
}

.stam-topbar__actions[b-xfc6bzmc5w] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.icon[b-xfc6bzmc5w] {
    width: 18px;
    height: 18px;
    stroke: currentColor;
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.btn-icon.danger[b-xfc6bzmc5w] {
    color: #d11;
}

.stam-empty[b-xfc6bzmc5w] {
    padding: var(--space-5, 24px);
    color: var(--txt-600, #666);
}

.default-text[b-xfc6bzmc5w] {
    color: var(--color-gray-400);
    padding-top: 10px;
}

.empty-state[b-xfc6bzmc5w] {
    height: calc(100% - 110px);
    min-height: 520px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 0px 24px 50px;
/*    background-color: var(--color-gray-50);*/
    border: 1px dashed var(--color-gray-100);
    border-radius: 5px;
}

.empty-state__image[b-xfc6bzmc5w] {
    width: 280px;
    max-width: 60%;
    margin-bottom: 30px;
}

    .empty-state__image img[b-xfc6bzmc5w] {
        width: 100%;
        height: auto;
        display: block;
        opacity: .95;
    }

.empty-state h4[b-xfc6bzmc5w] {
    margin: 0 0 12px;
    font-weight: 700;
}

.empty-state p[b-xfc6bzmc5w] {
    max-width: 520px;
    margin: 0;
    color: var(--color-gray-500);
    font-size: var(--fs-body-2);
    line-height: 1.55;
}

.empty-state__hint[b-xfc6bzmc5w] {
    margin-top: 30px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 22px;
    border-radius: 999px;
    background: #e8f5ff;
    color: #008ee6;
    font-weight: 600;
    font-size: .92rem;
}

.empty-state__hint-icon[b-xfc6bzmc5w] {
    width: 22px;
    height: 22px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid currentColor;
    font-size: .8rem;
}
/* _content/eLipsOnline/Components/Pages/Stamgegevens/StamgegevensSidebar.razor.rz.scp.css */

.stam-nav[b-wpk8z4jkd7] {
    padding-right: 18px;
    padding-left: 18px;
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}

.stam-nav__header[b-wpk8z4jkd7] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 10px 0px 18px 0px;
}

.stam-nav-header-title[b-wpk8z4jkd7] {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.stam-nav-header-title span[b-wpk8z4jkd7] {
    font-size: var(--fs-caption);
    color: var(--color-gray-500);
}

.stam-nav-header-title h3[b-wpk8z4jkd7] {
   margin: 0;
}

.collapse-btn[b-wpk8z4jkd7] {
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 6px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

    .collapse-btn:hover[b-wpk8z4jkd7] {
        background: rgba(0,0,0,0.05);
    }

.collapse-icon[b-wpk8z4jkd7] {
    width: 18px;
    height: 18px;
    fill: currentColor;
    transition: transform 260ms cubic-bezier(.4, 0, .2, 1);
    transform: rotate(180deg);
}

.stam-nav.is-collapsed .collapse-icon[b-wpk8z4jkd7] {
    transform: rotate(360deg);
}

/* Groups */
.stam-nav__groups[b-wpk8z4jkd7] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: var(--fs-body-2);
}

.stam-group__btn[b-wpk8z4jkd7] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 0;
    background: transparent;
    padding: 10px 10px;
    border-radius: 10px;
    cursor: pointer;
    text-align: left;
    color: var(--color-gray-700);
}

    .stam-group__btn.is-active-category[b-wpk8z4jkd7] {
        background: var(--color-gray-50);
        font-weight: 500;
        color: var(--color-gray-800);
    }

    .stam-group__btn:hover[b-wpk8z4jkd7] {
        background: var(--color-gray-100);
    }

.stam-group__left[b-wpk8z4jkd7] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.stam-group__label[b-wpk8z4jkd7] {
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.stam-icoon[b-wpk8z4jkd7] {
    font-size: 16px;
    opacity: 0.85;
}

/* Submenu */
.stam-sub[b-wpk8z4jkd7] {
    list-style: none;
    margin: 6px 0 2px 0;
    padding: 0 0 0 28px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.stam-sub__item[b-wpk8z4jkd7] {
    width: 100%;
    border: 0;
    background: transparent;
    padding: 7px 10px;
    border-radius: 8px;
    cursor: pointer;
    text-align: left;
    color: var(--color-gray-600);
}

    .stam-sub__item:hover[b-wpk8z4jkd7] {
        background: var(--surface-hover, rgba(0,0,0,0.04));
        color: var(--txt-900, #111);
    }

    .stam-sub__item.is-active[b-wpk8z4jkd7] {
        background: var(--color-selected-bg);
        color: var(--color-primary-700);
        font-weight: 500;
    }

.stam-group__icon[b-wpk8z4jkd7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.stam-svg[b-wpk8z4jkd7] {
    width: 16px;
    height: 16px;
    fill: currentColor;
    transition: color 0.15s ease;
}

/* Chevron rotation */
.stam-chevron[b-wpk8z4jkd7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
}

.stam-chevron__svg[b-wpk8z4jkd7] {
    width: 12px;
    height: 18px;
    fill: currentColor;
    transform: rotate(0deg);
    transition: transform 180ms ease;
}

.stam-group__btn.is-open .stam-chevron__svg[b-wpk8z4jkd7] {
    transform: rotate(-180deg);
}

.stam-subwrap[b-wpk8z4jkd7] {
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    transform: translateY(-2px);
    transition: max-height 320ms cubic-bezier(.4, 0, .2, 1), opacity 220ms ease, transform 220ms ease;
}

    .stam-subwrap.is-open[b-wpk8z4jkd7] {
        max-height: 60vh;
        opacity: 1;
        transform: translateY(0);
    }

@media (prefers-reduced-motion: reduce) {
    .stam-chevron__svg[b-wpk8z4jkd7],
    .stam-subwrap[b-wpk8z4jkd7] {
        transition: none;
    }
}

.stam-nav.is-collapsed .stam-group__btn[b-wpk8z4jkd7] {
    justify-content: center;
    padding: 10px 0;
}

.stam-nav.is-collapsed .stam-group__left[b-wpk8z4jkd7] {
    gap: 0;
}

.stam-nav.is-collapsed .stam-chevron[b-wpk8z4jkd7] {
    display: none;
}

.stam-group__label[b-wpk8z4jkd7] {
    transition: opacity 180ms ease, transform 240ms cubic-bezier(.22, 1, .36, 1);
    opacity: 1;
    transform: translateX(0);
}

.stam-nav.is-collapsed .stam-group__label[b-wpk8z4jkd7] {
    opacity: 0;
    transform: translateX(-6px);
    pointer-events: none;
}

.stam-nav__title[b-wpk8z4jkd7] {
    transition: opacity 180ms ease, transform 240ms cubic-bezier(.22, 1, .36, 1);
    opacity: 1;
    transform: translateX(0);
}

.stam-nav.is-collapsed .stam-nav__title[b-wpk8z4jkd7] {
    opacity: 0;
    transform: translateX(-6px);
    pointer-events: none;
}

.stam-group__icon[b-wpk8z4jkd7] {
    transition: transform 240ms cubic-bezier(.22, 1, .36, 1);
}

.stam-nav.is-collapsed .stam-group__icon[b-wpk8z4jkd7] {
    transform: translateX(1px);
}
/* _content/eLipsOnline/Components/Pages/TotpProcess.razor.rz.scp.css */
.totp-card[b-vtfwpj59mj] {
    color: var(--color-secondary-700);
}

.totp-icon[b-vtfwpj59mj] {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #eef5ff;
    color: var(--color-primary-700);
    margin-bottom: 28px;
}

.totp-icon .material-symbols-rounded[b-vtfwpj59mj] {
    font-size: 28px;
}

.totp-intro[b-vtfwpj59mj] {
    margin-bottom: 32px;
}

    .totp-intro h1[b-vtfwpj59mj] {
        margin: 0 0 18px;
        color: var(--color-secondary-700);
        font-size: var(--fs-display-2);
        font-weight: 700;
        line-height: 1.1;
        letter-spacing: 0;
    }

.totp-intro h2[b-vtfwpj59mj] {
    margin: 0 0 14px;
    color: var(--color-gray-500);
    font-size: 20px;
    font-weight: 600;
    line-height: 1.2;
}

.totp-intro p[b-vtfwpj59mj] {
    margin: 0 0 8px;
    color: var(--color-gray-500);
    font-size: 16px;
    line-height: 1.45;
}

.totp-card[b-vtfwpj59mj]  .totp-form {
    display: grid;
    gap: 24px;
}

.totp-inputs[b-vtfwpj59mj] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 18px;
    margin: 0;
}

.totp-inputs[b-vtfwpj59mj]  .totp-digit-input {
    width: 100%;
    aspect-ratio: 1 / 1;
    min-height: 64px;
    border: 1px solid #d3dceb;
    border-radius: 10px;
    background: #ffffff;
    color: var(--color-secondary-700);
    font-size: 28px;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    outline: none;
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

.totp-inputs[b-vtfwpj59mj]  .totp-digit-input:focus {
    border-color: var(--color-primary-700);
    box-shadow: 0 0 0 3px rgba(35, 103, 232, 0.14);
}

.totp-help[b-vtfwpj59mj] {
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #dce5f5;
    border-radius: 8px;
    background: #f7faff;
    font-size: var(--fs-body-3);
    line-height: 1.35;
    padding: 13px 16px;
    color: var(--color-primary-700);
}

    .totp-help .k-svg-icon > svg[b-vtfwpj59mj] {
        fill: var(--color-primary-700);
    }

    .totp-help span[b-vtfwpj59mj] {
        color: var(--color-gray-500);
    }

.totp-help strong[b-vtfwpj59mj] {
    color: var(--color-primary-700);
}

.totp-error[b-vtfwpj59mj] {
    border-radius: 10px;
    background: #fff1f1;
    color: #bd1f1f;
    font-size: var(--fs-body-3);
    line-height: 1.35;
    padding: 12px 14px;
}

.totp-verify-button[b-vtfwpj59mj],
.totp-regenerate-button[b-vtfwpj59mj] {
    width: 100%;
    height: 54px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    border-radius: 8px;
    cursor: pointer;
    font-size: var(--fs-body-1);
    font-weight: 600;
    line-height: 1;
    transition: background-color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.totp-verify-button[b-vtfwpj59mj] {
    border: 0;
    background: var(--color-primary-700);
    color: #ffffff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.totp-verify-button[b-vtfwpj59mj]  .k-svg-icon:last-child {
    position: absolute;
    right: 20px;
    width: 20px;
    height: 20px;
}

.totp-verify-button:hover[b-vtfwpj59mj] {
    background: var(--color-primary-500);
}

.totp-regenerate-button[b-vtfwpj59mj] {
    margin-top: 14px;
    border: 1px solid #8896b5;
    background: #ffffff;
    color: var(--color-secondary-700);
}

.totp-regenerate-button:hover[b-vtfwpj59mj] {
    border-color: var(--color-primary-700);
    color: var(--color-primary-700);
}

.totp-verify-button:active[b-vtfwpj59mj],
.totp-regenerate-button:active[b-vtfwpj59mj] {
    transform: translateY(1px);
}

@media (max-width: 1440px) {
    .totp-icon[b-vtfwpj59mj] { 
        margin-top: 20px;
    }
}

@media (max-width: 600px) {
    .totp-icon[b-vtfwpj59mj] {
        margin-top: 20px;
    }

    .totp-intro h1[b-vtfwpj59mj] {
        font-size: 28px;
    }

    .totp-inputs[b-vtfwpj59mj] {
        gap: 8px;
    }

    .totp-inputs[b-vtfwpj59mj]  .totp-digit-input {
        min-height: 46px;
        border-radius: 8px;
        font-size: 22px;
    }

    .totp-help[b-vtfwpj59mj] {
        align-items: flex-start;
    }
}
/* _content/eLipsOnline/Components/Planning/Kaart/KaartAfstandenPanel.razor.rz.scp.css */
.kaart-panel[b-aa33hjmq91] {
    --kaart-surface: var(--white);
    --kaart-border: var(--color-gray-200);
    --kaart-muted: var(--color-gray-500);
    --kaart-text: var(--color-gray-800);
    min-width: 0;
    min-height: 0;
    background: var(--kaart-surface);
}

.kaart-summary[b-aa33hjmq91] {
    flex: 0 0 auto;
}

.kaart-panel-header-summary[b-aa33hjmq91] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 15px 15px 12px;
}

.kaart-summary-grid[b-aa33hjmq91] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 0 15px 17px;
}

.kaart-metric[b-aa33hjmq91] {
    min-width: 0;
    padding: 11px;
    background: var(--white);
    border: 1px solid var(--kaart-border, #e5e7eb);
    border-radius: 6px;
}

.kaart-metric-label[b-aa33hjmq91] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 5px;
    color: var(--kaart-muted, #6b7280);
    font-size: 12px;
}

.kaart-metric-label[b-aa33hjmq91]  .k-svg-icon {
    width: 14px;
    height: 14px;
}

.kaart-metric strong[b-aa33hjmq91] {
    display: block;
    margin-top: 6px;
    color: var(--kaart-text, #111827);
    font-size: 14px;
    font-weight: 600;
}
/* _content/eLipsOnline/Components/Planning/Kaart/KaartEmissiesPanel.razor.rz.scp.css */
.kaart-panel[b-9wkb9mi8t0] {
    --kaart-surface: var(--white);
    --kaart-border: var(--color-gray-200);
    --kaart-muted: var(--color-gray-500);
    --kaart-text: var(--color-gray-800);
    min-width: 0;
    min-height: 0;
    background: var(--kaart-surface);
}

.kaart-summary[b-9wkb9mi8t0] {
    flex: 0 0 auto;
}

.kaart-panel-header-summary[b-9wkb9mi8t0] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 15px 15px 12px;
}

.kaart-count[b-9wkb9mi8t0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 24px;
    padding: 0 13px;
    color: var(--color-primary-700, #005691);
    background: var(--color-primary-50, #e6f3fa);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 500;
}

.kaart-summary-grid[b-9wkb9mi8t0] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 0 15px 17px;
}

.kaart-emissions-grid[b-9wkb9mi8t0] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.kaart-metric[b-9wkb9mi8t0] {
    min-width: 0;
    padding: 11px;
    background: var(--white);
    border: 1px solid var(--kaart-border, #e5e7eb);
    border-radius: 6px;
}

.kaart-metric-green[b-9wkb9mi8t0] {
    background: var(--white);
    border: 1px solid var(--kaart-border, #e5e7eb);
}

.kaart-metric-green strong[b-9wkb9mi8t0] {
    color: var(--color-success-700, #107c41);
}

.kaart-metric-label[b-9wkb9mi8t0] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 5px;
    color: var(--kaart-muted, #6b7280);
    font-size: 12px;
}

.kaart-metric-label[b-9wkb9mi8t0]  .k-svg-icon {
    width: 14px;
    height: 14px;
}

.kaart-metric strong[b-9wkb9mi8t0] {
    display: block;
    margin-top: 6px;
    color: var(--kaart-text, #111827);
    font-size: 14px;
    font-weight: 600;
}

.kaart-emissions-co2[b-9wkb9mi8t0] {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    align-items: center;
    gap: 14px;
    padding: 12px;
}

.kaart-emissions-co2-icon[b-9wkb9mi8t0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    color: white;
    background: var(--color-success-700, #107c41);
    border-radius: 5px;
}

.kaart-emissions-co2-icon[b-9wkb9mi8t0]  .k-svg-icon {
    width: 20px;
    height: 20px;
}

.kaart-emissions-co2-icon[b-9wkb9mi8t0]  .k-svg-icon svg {
    fill: currentColor;
}

.kaart-emissions-co2-copy[b-9wkb9mi8t0] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.kaart-emissions-co2-copy .kaart-metric-label[b-9wkb9mi8t0] {
    color: var(--color-gray-500, #6b7280);
    font-size: 12px;
}

.kaart-emissions-co2-copy strong[b-9wkb9mi8t0] {
    margin-top: 0;
    color: var(--color-success-700, #107c41);
    font-size: 16px;
    font-weight: 600;
    line-height: 1.05;
}
/* _content/eLipsOnline/Components/Planning/Kaart/KaartInfoPanel.razor.rz.scp.css */
.kaart-info-panel-container[b-p10y4occxi] {
    height: 100%;
    width: 100%;
    overflow-y: auto;
    padding: 0;
    background-color: var(--color-gray-50, #f9fafb);
    --kaart-surface: var(--white);
    --kaart-border: var(--color-gray-200);
    --kaart-muted: var(--color-gray-500);
    --kaart-text: var(--color-gray-800);
    border-left: 1px solid var(--color-gray-200);
}

.kaart-insights[b-p10y4occxi] {
    width: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: visible;
}
/* _content/eLipsOnline/Components/Planning/Kaart/KaartLandenPanel.razor.rz.scp.css */
.kaart-panel[b-pmpb1o4grw] {
    --kaart-surface: var(--white);
    --kaart-border: var(--color-gray-200);
    --kaart-muted: var(--color-gray-500);
    --kaart-text: var(--color-gray-800);
    min-width: 0;
    min-height: 0;
    background: var(--kaart-surface);
    border-top: 1px solid var(--kaart-border);
    border-bottom: 1px solid var(--kaart-border);
}

.kaart-summary[b-pmpb1o4grw] {
    flex: 0 0 auto;
}

.kaart-countries-panel[b-pmpb1o4grw] {
    flex: 1 1 280px;
    min-height: 180px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.kaart-panel-header-summary[b-pmpb1o4grw] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 15px 15px 12px;
}

.kaart-count[b-pmpb1o4grw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 24px;
    padding: 0 13px;
    color: var(--color-primary-700, #005691);
    background: var(--color-primary-50, #e6f3fa);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
}

.kaart-countries-scroll[b-pmpb1o4grw] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 0 12px 12px;
    overflow-y: auto;
}

.kaart-country-card[b-pmpb1o4grw] {
    flex: 0 0 auto;
    background: var(--white);
    border: 1px solid var(--kaart-border, #e5e7eb);
    border-radius: 6px;
    overflow: hidden;
}

.kaart-country-summary[b-pmpb1o4grw] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 12px;
    cursor: pointer;
    list-style: none;
}

.kaart-country-summary[b-pmpb1o4grw]::-webkit-details-marker {
    display: none;
}

.kaart-country-heading[b-pmpb1o4grw] {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) auto 18px;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.kaart-country-heading > strong[b-pmpb1o4grw] {
    overflow: hidden;
    color: var(--kaart-text, #111827);
    font-size: 14px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kaart-country-flag[b-pmpb1o4grw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 25px;
    overflow: hidden;
    color: var(--color-primary-700, #005691);
    background: var(--color-primary-50, #e6f3fa);
    border-radius: 50%;
    font-size: 11px;
    font-weight: 700;
}

.kaart-country-flag img[b-pmpb1o4grw] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.kaart-country-code[b-pmpb1o4grw] {
    min-width: 30px;
    padding: 3px 8px;
    color: var(--color-primary-700, #005691);
    background: var(--color-primary-50, #e6f3fa);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    text-align: center;
}

.kaart-country-chevron[b-pmpb1o4grw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-gray-600, #4b5563);
    transform: rotate(180deg);
    transition: transform .15s ease;
}

.kaart-country-chevron[b-pmpb1o4grw]  .k-svg-icon {
    width: 14px;
    height: 14px;
}

.kaart-country-card[open] .kaart-country-chevron[b-pmpb1o4grw] {
    transform: rotate(0deg);
}

.kaart-country-metrics[b-pmpb1o4grw] {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.kaart-country-details[b-pmpb1o4grw] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 20px;
    row-gap: 14px;
    padding: 12px;
    background: var(--color-gray-30, #f8f9fa);
    border-top: 1px solid var(--color-gray-100, #f3f4f6);
}

.kaart-country-metric[b-pmpb1o4grw] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.kaart-country-metric strong[b-pmpb1o4grw] {
    overflow: hidden;
    color: var(--kaart-text, #111827);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kaart-country-metric small[b-pmpb1o4grw] {
    overflow: hidden;
    color: var(--color-gray-500, #6b7280);
    font-size: 12px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kaart-countries-empty[b-pmpb1o4grw] {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    justify-content: center;
    min-height: 100px;
    padding: 18px;
    color: var(--color-gray-400, #9ca3af);
    font-size: 12px;
    line-height: 1.45;
    text-align: center;
    background-color: var(--color-gray-30, #f8f9fa);
    border-radius: 5px;
    border: 1px dashed var(--color-gray-200, #e5e7eb);
    font-weight: 350;
}

@media (max-width: 1020px) {
    .kaart-countries-panel[b-pmpb1o4grw] {
        flex: 0 0 auto;
        min-height: 0;
        height: auto;
        overflow: visible;
    }

    .kaart-countries-scroll[b-pmpb1o4grw] {
        flex: 0 0 auto;
        min-height: 0;
        height: auto;
        overflow-y: visible;
    }
}
/* _content/eLipsOnline/Components/Planning/Kaart/KaartLocatiesPanel.razor.rz.scp.css */
.kaart-panel[b-av36576o9j] {
    --kaart-surface: #ffffff;
    --kaart-border: var(--color-gray-200, #e5e7eb);
    --kaart-muted: #6b7280;
    --kaart-text: #111827;
    min-width: 0;
    min-height: 0;
    background: var(--kaart-surface);
    border: 1px solid var(--kaart-border);
    border-radius: 7px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .05), 0 4px 12px rgba(0, 0, 0, .04);
}

.kaart-stops[b-av36576o9j] {
    position: relative;
    z-index: 10;
    display: flex;
    flex-direction: column;
    overflow: visible;
    height: 100%;
}

.kaart-panel-header[b-av36576o9j] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 20px 20px 12px;
}

.gb-title[b-av36576o9j] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.gb-title-icon[b-av36576o9j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    color: var(--color-primary-700, #005691);
    background: var(--color-primary-50, #e6f3fa);
    border-radius: 6px;
}

.gb-title-icon[b-av36576o9j]  .k-svg-icon {
    width: 16px;
    height: 16px;
}

.attachment-title[b-av36576o9j] {
    margin: 0;
    color: var(--color-secondary-700, #111827);
    font-size: var(--fs-h6, 16px);
    font-weight: 600;
}

.kaart-count[b-av36576o9j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 24px;
    padding: 0 13px;
    color: var(--color-primary-700, #005691);
    background: var(--color-primary-50, #e6f3fa);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
}

.kaart-search[b-av36576o9j] {
    position: relative;
    flex: 0 0 auto;
    padding: 5px 20px 12px;
}

.kaart-search-field[b-av36576o9j] {
    position: relative;
    display: block;
    width: 100%;
}

.kaart-search-field[b-av36576o9j]  .k-svg-icon {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 12px;
    width: 16px;
    height: 16px;
    color: var(--color-gray-500, #6b7280);
    transform: translateY(-50%);
    pointer-events: none;
}

.kaart-search-field[b-av36576o9j]  .k-textbox,
.kaart-search-field[b-av36576o9j]  .k-input {
    width: 100%;
    height: 36px;
}

.kaart-search-field[b-av36576o9j]  input {
    padding-left: 38px;
    color: var(--kaart-text, #111827);
    font-size: 14px;
}

.kaart-search-field[b-av36576o9j]  input::placeholder {
    color: var(--color-gray-500, #6b7280);
}

.search-results-list[b-av36576o9j] {
    position: absolute;
    z-index: 1000;
    top: calc(100% - 8px);
    left: 14px;
    right: 14px;
    max-height: 440px;
    padding: 12px 10px;
    margin: 0;
    overflow-y: auto;
    list-style: none;
    background: white;
    border: 1px solid var(--kaart-border, #e5e7eb);
    border-radius: 7px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.search-results-heading[b-av36576o9j] {
    padding: 5px 8px 8px;
    color: var(--color-gray-500, #6b7280);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .06em;
    line-height: 1;
    text-transform: uppercase;
}

.search-results-heading--locations[b-av36576o9j] {
    margin-top: 9px;
    padding-top: 15px;
    border-top: 1px solid var(--color-gray-200, #e5e7eb);
}

.search-result-item[b-av36576o9j] {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-height: 54px;
    padding: 12px 8px;
    border-bottom: 1px solid var(--color-gray-100, #f3f4f6);
    cursor: pointer;
    transition: background-color .15s ease;
}

.search-result-item:last-child[b-av36576o9j] {
    border-bottom: 0;
}

.search-result-item--best[b-av36576o9j] {
    grid-template-columns: 38px minmax(0, 1fr);
    background: color-mix(in srgb, var(--blue, #005691) 7%, white);
    border: 0;
    border-radius: 6px;
}

.search-result-item:hover[b-av36576o9j] {
    background: var(--color-gray-100, #f3f4f6);
    border-radius: 6px;
}

.search-result-item.active-item[b-av36576o9j] {
    background: var(--color-primary-50, #e6f3fa) !important;
    border: 1px solid var(--color-primary-500, #0077c8) !important;
    outline: 2px solid var(--color-primary-600, #005691) !important;
    outline-offset: -2px;
    border-radius: 6px;
    box-shadow: 0 0 0 2px rgba(0, 86, 145, 0.15);
}

.search-result-item--best:hover[b-av36576o9j] {
    background: color-mix(in srgb, var(--blue, #005691) 12%, white);
}

.search-result-item--best.active-item[b-av36576o9j] {
    background: color-mix(in srgb, var(--blue, #005691) 18%, white) !important;
    border: 1px solid var(--color-primary-500, #0077c8) !important;
    outline: 2px solid var(--color-primary-600, #005691) !important;
    outline-offset: -2px;
}

.search-result-icon[b-av36576o9j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    color: var(--color-primary-700, #005691);
    background: white;
    border: 1px solid var(--color-gray-200, #e5e7eb);
    border-radius: 6px;
}

.search-result-icon[b-av36576o9j]  .k-svg-icon {
    width: 18px;
    height: 18px;
}

.search-result-copy[b-av36576o9j] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.result-title[b-av36576o9j] {
    display: block;
    overflow: hidden;
    color: var(--kaart-text, #111827);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.result-subtitle[b-av36576o9j] {
    display: block;
    overflow: hidden;
    color: var(--kaart-muted, #6b7280);
    font-size: 12px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kaart-stop-list[b-av36576o9j] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 0 20px 12px;
    overflow-y: auto;
}

.kaart-action-section[b-av36576o9j] {
    padding: 10px 15px 15px;
    width: 100%;
}

[b-av36576o9j] .kaart-action-section .btn-full {
    position: relative;
    width: 100%;
    justify-content: center;
    text-align: center;
}

[b-av36576o9j] .kaart-action-section .btn-full .k-svg-icon {
    position: absolute;
    right: 12px;
}

.kaart-stop-hint[b-av36576o9j] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 36px;
    padding: 8px 20px;
    color: var(--color-gray-600, #4b5563);
    background: var(--color-gray-50, #f9fafb);
    border-top: 1px solid var(--color-gray-200, #e5e7eb);
    border-radius: 0 0 7px 7px;
    font-size: 12px;
    line-height: 1.35;
}

.kaart-stop-hint-icon[b-av36576o9j] {
    flex: 0 0 auto;
    color: var(--color-gray-400, #9ca3af);
    font-size: 15px;
    line-height: 1;
}

.kaart-stop[b-av36576o9j] {
    display: grid;
    grid-template-columns: 15px 26px minmax(0,1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 15px 10px;
    background: white;
    border: 1px solid var(--kaart-border, #e5e7eb);
    border-radius: 6px;
    transition: border-color .15s ease, box-shadow .15s ease;
    cursor: pointer;
}

.kaart-stop:hover[b-av36576o9j] {
    border-color: var(--color-primary-500, #0077c8);
    background-color: var(--color-primary-50, #e6f3fa);
}

.drag-handle[b-av36576o9j] {
    color: var(--color-gray-400, #9ca3af);
    font-size: 17px;
    line-height: 1;
    cursor: grab;
}

.volgorde-indicator[b-av36576o9j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 24px;
    height: 24px;
    color: white;
    background: var(--color-primary-700, #005691);
    border: 1px solid var(--color-primary-700, #005691);
    border-radius: 50%;
    font-size: 12px;
    font-weight: 600;
}

.kaart-stop-copy[b-av36576o9j] {
    min-width: 0;
    padding-left: 5px;
}

.kaart-stop-name[b-av36576o9j], .kaart-stop-address[b-av36576o9j] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kaart-stop-name[b-av36576o9j] {
    color: var(--color-secondary-700, #111827);
    font-size: 14px;
    font-weight: 600;
}

.kaart-stop-address[b-av36576o9j] {
    margin-top: 3px;
    color: var(--kaart-muted, #6b7280);
    font-size: 12px;
}

.kaart-stop-actions[b-av36576o9j] {
    display: flex;
    gap: 5px;
}

[b-av36576o9j] .kaart-stop-actions .k-button {
    width: 28px;
    height: 28px;
    padding: 5px;
    border-radius: 4px;
}

.attachment-empty[b-av36576o9j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 24px;
    text-align: center;
}

.attachment-empty__visual img[b-av36576o9j] {
    max-width: 120px;
    height: auto;
    margin-bottom: 12px;
}

.attachment-empty__title[b-av36576o9j] {
    display: block;
    font-weight: 600;
    color: var(--color-secondary-700, #111827);
    font-size: 14px;
    margin-bottom: 4px;
}

.attachment-empty__description[b-av36576o9j] {
    display: block;
    color: var(--color-gray-500, #6b7280);
    font-size: 12px;
}
/* _content/eLipsOnline/Components/Planning/Kaart/KaartMapPanel.razor.rz.scp.css */
.kaart-panel[b-alegwd1dk5] {
    --kaart-surface: #ffffff;
    --kaart-border: var(--color-gray-200, #e5e7eb);
    --kaart-muted: #6b7280;
    --kaart-text: #111827;
    min-width: 0;
    min-height: 0;
    background: var(--kaart-surface);
}

.kaart-map[b-alegwd1dk5] {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.kaart-container[b-alegwd1dk5],
#map[b-alegwd1dk5],
.kaart-map > div:first-child[b-alegwd1dk5] {
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    flex: 1 1 auto;
}

@keyframes highlight-pulse-b-alegwd1dk5 {
    0%, 100% {
        transform: scale(1);
        filter: brightness(1);
    }

    50% {
        transform: scale(1.3) translateY(-15px);
        filter: brightness(1.35) drop-shadow(0 0 12px rgba(0,149,218,.9));
    }
}

[b-alegwd1dk5] .marker-highlight {
    z-index: 9999 !important;
}

[b-alegwd1dk5] .marker-highlight svg {
    animation: highlight-pulse-b-alegwd1dk5 .7s ease-in-out infinite;
    transform-origin: bottom center;
}
/* _content/eLipsOnline/Components/Planning/Kaart/KaartOfferteLocatiesPanel.razor.rz.scp.css */
.kaart-panel[b-7oaytjacqe] {
    --kaart-surface: #ffffff;
    --kaart-border: var(--color-gray-200, #e5e7eb);
    --kaart-muted: #6b7280;
    --kaart-text: #111827;
    min-width: 0;
    min-height: 0;
}

.kaart-stops[b-7oaytjacqe] {
    position: relative;
    z-index: 10;
    display: flex;
    flex-direction: column;
    overflow: visible;
    height: 100%;
}

.kaart-search[b-7oaytjacqe] {
    z-index: 100;
}

.search-results-list[b-7oaytjacqe] {
    z-index: 5000;
}

.kaart-panel-header[b-7oaytjacqe] {
    flex: 0 0 auto;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 15px 20px 0;
}

.kaart-panel-header span[b-7oaytjacqe] {
    font-size: var(--fs-caption);
    color: var(--color-gray-500);
    padding: 2px 0 0 0px;
}

@media (max-width: 600px) {
    .kaart-panel-header[b-7oaytjacqe] {
        align-items: flex-start;
        flex-direction: column;
    }
}

.route-panel-title[b-7oaytjacqe] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.route-panel-title__mark[b-7oaytjacqe] {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    margin-top: 1px;
    background: var(--color-primary-50, #eef8fd);
    border-radius: 50%;
}

.route-panel-subtitle[b-7oaytjacqe] {
    display: block;
    margin-top: 4px;
    color: var(--color-gray-500, #6b7280);
    font-size: 11px;
    line-height: 1.25;
}

.kaart-count[b-7oaytjacqe] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 24px;
    padding: 0 13px;
    color: var(--color-primary-700, #005691);
    background: var(--color-primary-50, #e6f3fa);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
}

.kaart-search[b-7oaytjacqe] {
    position: relative;
    flex: 0 0 auto;
    padding: 12px 20px 16px;
    border-bottom: 1px solid var(--color-gray-200);
}

.kaart-search-field[b-7oaytjacqe] {
    position: relative;
    display: block;
    width: 100%;
}

.kaart-search-field[b-7oaytjacqe]  .k-svg-icon {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 12px;
    width: 16px;
    height: 16px;
    color: var(--color-gray-500, #6b7280);
    transform: translateY(-50%);
    pointer-events: none;
}

.kaart-search-field[b-7oaytjacqe]  .k-textbox,
.kaart-search-field[b-7oaytjacqe]  .k-input {
    width: 100%;
    height: 36px;
}

.kaart-search-field[b-7oaytjacqe]  input {
    padding-left: 38px;
    color: var(--kaart-text, #111827);
    font-size: 14px;
}

.kaart-search-field[b-7oaytjacqe]  input::placeholder {
    color: var(--color-gray-500, #6b7280);
}

.search-results-list[b-7oaytjacqe] {
    position: absolute;
    z-index: 999999;
    top: calc(100% - 8px);
    left: 14px;
    right: 14px;
    max-height: 440px;
    padding: 12px 10px;
    margin: 0;
    overflow-y: auto;
    list-style: none;
    background: white;
    border: 1px solid var(--kaart-border, #e5e7eb);
    border-radius: 7px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04), 0 1px 3px rgba(0, 0, 0, 0.04);
}

.search-results-heading[b-7oaytjacqe] {
    padding: 5px 8px 8px;
    color: var(--color-gray-500, #6b7280);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .06em;
    line-height: 1;
    text-transform: uppercase;
}

.search-results-heading--locations[b-7oaytjacqe] {
    margin-top: 9px;
    padding-top: 15px;
    border-top: 1px solid var(--color-gray-200, #e5e7eb);
}

.search-result-item[b-7oaytjacqe] {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-height: 54px;
    padding: 12px 8px;
    border-bottom: 1px solid var(--color-gray-100, #f3f4f6);
    cursor: pointer;
    transition: all .15s ease;
    border-radius: 6px;
}

.search-result-item:last-child[b-7oaytjacqe] {
    border-bottom: 0;
}

.search-result-item--best[b-7oaytjacqe] {
    grid-template-columns: 38px minmax(0, 1fr);
    background: color-mix(in srgb, var(--blue, #005691) 7%, white);
    border: 0;
    border-radius: 6px;
}

.search-result-item:hover[b-7oaytjacqe] {
    background: var(--color-gray-100, #f3f4f6);
    border-radius: 6px;
}

.search-result-item.active-item[b-7oaytjacqe] {
    background: var(--color-primary-50, #e6f3fa) !important;
    border: 1px solid var(--color-primary-500, #0077c8) !important;
    outline: 2px solid var(--color-primary-600, #005691) !important;
    outline-offset: -2px;
    border-radius: 6px;
    box-shadow: 0 0 0 2px rgba(0, 86, 145, 0.15);
}

.search-result-item--best:hover[b-7oaytjacqe] {
    background: color-mix(in srgb, var(--blue, #005691) 12%, white);
}

.search-result-item--best.active-item[b-7oaytjacqe] {
    background: color-mix(in srgb, var(--blue, #005691) 18%, white) !important;
    border: 1px solid var(--color-primary-500, #0077c8) !important;
    outline: 2px solid var(--color-primary-600, #005691) !important;
    outline-offset: -2px;
}

.search-result-icon[b-7oaytjacqe] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    color: var(--color-primary-700, #005691);
    background: white;
    border: 1px solid var(--color-gray-200, #e5e7eb);
    border-radius: 6px;
}

.search-result-icon[b-7oaytjacqe]  .k-svg-icon {
    width: 18px;
    height: 18px;
}

.search-result-copy[b-7oaytjacqe] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.result-title[b-7oaytjacqe] {
    display: block;
    overflow: hidden;
    color: var(--kaart-text, #111827);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.result-subtitle[b-7oaytjacqe] {
    display: block;
    overflow: hidden;
    color: var(--kaart-muted, #6b7280);
    font-size: 12px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kaart-stop-list[b-7oaytjacqe] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px 12px 12px;
    overflow-y: auto;
}

.kaart-action-section[b-7oaytjacqe] {
    padding: 10px 15px 15px;
    width: 100%;
}

[b-7oaytjacqe] .kaart-action-section .btn-full {
    position: relative;
    width: 100%;
    justify-content: center;
    text-align: center;
}

[b-7oaytjacqe] .kaart-action-section .btn-full .k-svg-icon {
    position: absolute;
    right: 12px;
}

.offerte-route-card-list[b-7oaytjacqe] {
    background-color: var(--color-gray-30);
}

.route-timeline-item[b-7oaytjacqe] {
    position: relative;
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
}

.route-timeline-item[b-7oaytjacqe]::before {
    content: "";
    position: absolute;
    z-index: 0;
    top: 50%;
    left: 12px;
    width: 1px;
    height: calc(100% + 8px);
    background: var(--color-gray-300, #d1d5db);
}

.route-timeline-item:last-of-type[b-7oaytjacqe]::before {
    display: none;
}

.route-timeline-index[b-7oaytjacqe] {
    z-index: 1;
    width: 23px;
    height: 23px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: center;
    color: var(--color-primary-600, #008fd3);
    background: white;
    border: 1px solid var(--color-primary-500, #0095da);
    border-radius: 50%;
    font-size: 11px;
    font-weight: 600;
}

.offerte-route-stop[b-7oaytjacqe] {
    display: grid;
    grid-template-columns: 16px 32px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    padding: 10px 10px;
    background: white;
    border: 1px solid var(--kaart-border);
    border-radius: 6px;
    cursor: pointer;
    transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
}

.offerte-route-stop:hover[b-7oaytjacqe] {
    background: var(--color-selected-bg);
    border-color: var(--color-selected-border);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .06);
}

.drag-handle[b-7oaytjacqe] {
    color: var(--color-gray-400);
    font-size: 17px;
    line-height: 1;
    cursor: grab;
}

.drag-handle:active[b-7oaytjacqe] {
    cursor: grabbing;
}

.route-stop-flag[b-7oaytjacqe] {
    width: 30px;
    height: 30px;
    overflow: hidden;
    background: var(--color-gray-50);
    border: 1px solid var(--color-gray-100);
    border-radius: 50%;
}

.route-stop-flag img[b-7oaytjacqe] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.kaart-stop-copy[b-7oaytjacqe] {
    min-width: 0;
    padding-left: 4px;
}

.kaart-stop-name[b-7oaytjacqe],
.kaart-stop-address[b-7oaytjacqe] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kaart-stop-name[b-7oaytjacqe] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 500;
}

.kaart-stop-address[b-7oaytjacqe] {
    min-width: 0;
    margin-top: 3px;
    color: var(--kaart-muted);
    font-size: var(--fs-caption, 12px);
}

.kaart-stop-actions[b-7oaytjacqe] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.sortable-drag[b-7oaytjacqe] {
    opacity: 1 !important;
    border-color: var(--color-primary-500) !important;
    box-shadow: 0 12px 24px rgba(0, 0, 0, .15) !important;
}

.sortable-ghost[b-7oaytjacqe] {
    opacity: .3 !important;
    background: var(--color-primary-50) !important;
    border: 2px dashed var(--color-primary-500) !important;
}
/* _content/eLipsOnline/Components/Planning/Kaart/KaartPage.razor.rz.scp.css */
/* Removed duplicate .page-body definition */

.splitter-host[b-n6hod1mxwu] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    height: 100%;
}

.main-pane[b-n6hod1mxwu] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    min-width: 0;
    padding: 12px 5px 12px 12px;
    overflow: hidden;
    /*    border-right: 1px solid var(--color-gray-100);*/
    background-color: var(--color-gray-50);
}

.oo-card-title[b-n6hod1mxwu] {
    padding: 5px 0px 25px 00px;
}

.grid-host[b-n6hod1mxwu] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.oo-nav-toolbar[b-n6hod1mxwu] {
    padding: 0px 0px 15px 0;
    gap: 12px;
    background-color: white;
    /*    padding: 16px;*/
}

.oo-nav-group[b-n6hod1mxwu] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 0 0 auto;
}

.oo-nav-label[b-n6hod1mxwu] {
    font-size: var(--fs-caption);
    color: #8f8f8f;
    line-height: 1;
    padding-left: 0px;
    white-space: nowrap;
}

.oo-nav-group-body[b-n6hod1mxwu] {
    min-height: 32px;
    gap: 4px;
}

.nested-splitter-layout[b-n6hod1mxwu] {
    height: 100%;
    min-height: 0;
    display: flex;
    overflow: hidden;
}

.nested-splitter-host[b-n6hod1mxwu] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    background-color: var(--color-gray-50);
}

.subgrid-panel[b-n6hod1mxwu] {
    height: 100%;
    min-height: 0;
    min-width: 0;
    padding: 3px;
    box-sizing: border-box;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    /*    background: #fff;*/
    /*    border: 1px solid var(--color-gray-100);*/
    /*    border-radius: 5px;*/
    /*    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);*/
}

.subgrid-panel>*[b-n6hod1mxwu] {
    flex: 1 1 auto;
    min-height: 0;
}

.subgrid-panel[b-n6hod1mxwu]  .grid-rounded {
    width: 100%;
    height: 100% !important;
    margin: 0;
    box-sizing: border-box;
}

.unpinned-panel[b-n6hod1mxwu] {
    width: 39px;
    flex: 0 0 39px;
    background: var(--kendo-color-surface, #fafafa);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    padding: 6px 4px;
    gap: 6px;
}

.page-body[b-n6hod1mxwu] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

.page-body-content[b-n6hod1mxwu] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    display: flex;
    overflow: hidden;
}

.splitter-host[b-n6hod1mxwu] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    height: 100%;
}

.oo-card[b-n6hod1mxwu] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background-color: white;
    padding: 20px;
    border-radius: 5px;
    border: 1px solid var(--color-gray-200);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.nested-splitter-host[b-n6hod1mxwu] {
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    padding: 10px 10px 10px 0px;
}

.unpinned-panel[b-n6hod1mxwu] {
    width: 39px;
    flex: 0 0 39px;
    height: 100%;
    background: white;
    border-left: 1px solid var(--color-gray-100);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    padding: 6px 4px;
    gap: 6px;
    overflow-y: auto;
}

[b-n6hod1mxwu] .nested-splitter-host .k-splitter,
[b-n6hod1mxwu] .nested-splitter-host .k-pane {
    background-color: var(--color-gray-50);
}

.order-details-window__content[b-n6hod1mxwu] {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.order-details-window__content[b-n6hod1mxwu]  .split-page {
    height: 100%;
    min-height: 0;
}

/* Extracted from KaartPage.razor */
.search-results-list[b-n6hod1mxwu] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-shadow: 0px 8px 15px rgba(75, 72, 72, 0.1);
    list-style: none;
    margin: 5px 0 0 0;
    padding: 0;
    max-height: 600px;
    overflow-y: auto;
    z-index: 1000;
}

.search-results-list li[b-n6hod1mxwu] {
    padding: 10px;
    border-bottom: 1px solid #f0f0f0;
    cursor: pointer;
    text-align: left;
}

.search-results-list li:hover[b-n6hod1mxwu],
.search-results-list li.active-item[b-n6hod1mxwu] {
    background-color: #f8f9fa;
}

.search-results-list .result-title[b-n6hod1mxwu] {
    font-weight: 600;
    font-size: 14px;
    color: #333;
}

.search-results-list .result-subtitle[b-n6hod1mxwu] {
    font-size: 12px;
    color: #777;
}

[b-n6hod1mxwu] .square-btn {
    width: 85px;
    height: 85px;
    border-radius: 0;
    border: none;
    background-color: transparent;
}

[b-n6hod1mxwu] .square-btn.k-disabled,
[b-n6hod1mxwu] .square-btn.k-disabled * {
    cursor: not-allowed !important;
    pointer-events: auto !important;
}

[b-n6hod1mxwu] .square-btn.k-disabled {
    opacity: 0.6;
}

[b-n6hod1mxwu]::selection {
    background: #6078EA;
    color: white;
    text-shadow: none;
}

[b-n6hod1mxwu]::-webkit-selection {
    background: #6078EA;
    color: white;
    text-shadow: none;
}

.search-wrapper[b-n6hod1mxwu] {
    font-family: 'Montserrat', 'Helvetica', sans-serif;
    position: relative;
    width: 100%;
    padding: 0;
    background-color: white;
    color: #4B4848;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    overflow: visible;
}

.field-container[b-n6hod1mxwu] {
    position: relative;
    padding: 0;
    margin: 0;
    border: 0;
    width: 85%;
    max-width: 70%;
    height: 40px;
}

.icons-container[b-n6hod1mxwu] {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 10px;
    width: 35px;
    height: 35px;
    overflow: hidden;
}

.icon-close[b-n6hod1mxwu] {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 75%;
    height: 75%;
    opacity: 0;
    cursor: pointer;
    transform: translateX(-200%);
    border-radius: 50%;
    transition: opacity 0.25s ease, transform 0.43s cubic-bezier(0.694, 0.048, 0.335, 1.000);
}

.icon-close .x-up[b-n6hod1mxwu] {
    position: relative;
    width: 100%;
    height: 50%;
}

.icon-close .x-up[b-n6hod1mxwu]:before {
    content: "";
    position: absolute;
    bottom: 2px;
    left: 3px;
    width: 50%;
    height: 2px;
    background-color: #6078EA;
    transform: rotate(45deg);
}

.icon-close .x-up[b-n6hod1mxwu]:after {
    content: "";
    position: absolute;
    bottom: 2px;
    right: 0px;
    width: 50%;
    height: 2px;
    background-color: #6078EA;
    transform: rotate(-45deg);
}

.icon-close .x-down[b-n6hod1mxwu] {
    position: relative;
    width: 100%;
    height: 50%;
}

.icon-close .x-down[b-n6hod1mxwu]:before {
    content: "";
    position: absolute;
    top: 5px;
    left: 4px;
    width: 50%;
    height: 2px;
    background-color: #6078EA;
    transform: rotate(-45deg);
}

.icon-close .x-down[b-n6hod1mxwu]:after {
    content: "";
    position: absolute;
    top: 5px;
    right: 1px;
    width: 50%;
    height: 2px;
    background-color: #6078EA;
    transform: rotate(45deg);
}

.icon-search[b-n6hod1mxwu] {
    position: relative;
    top: 5px;
    left: 8px;
    width: 50%;
    height: 50%;
    opacity: 1;
    border-radius: 50%;
    border: 3px solid #c7d0f7;
    transition: opacity 0.25s ease, transform 0.43s cubic-bezier(0.694, 0.048, 0.335, 1.000);
}

.icon-search[b-n6hod1mxwu]:after {
    content: "";
    position: absolute;
    bottom: -9px;
    right: -2px;
    width: 4px;
    border-radius: 3px;
    transform: rotate(-45deg);
    height: 10px;
    background-color: #c7d0f7;
}

.field[b-n6hod1mxwu] {
    border: 0;
    width: 100%;
    height: 100%;
    padding: 10px 50px 10px 20px;
    background: white;
    border-radius: 3px;
    box-shadow: 0px 8px 15px rgba(75, 72, 72, 0.1);
    transition: all 0.4s ease;
    box-sizing: border-box;
}

.field:focus[b-n6hod1mxwu] {
    outline: none;
    box-shadow: 0px 9px 20px rgba(75, 72, 72, 0.3);
}

.search-wrapper.is-type .icons-container .icon-close[b-n6hod1mxwu] {
    opacity: 1;
    transform: translateX(0);
}

.search-wrapper.is-type .icons-container .icon-search[b-n6hod1mxwu] {
    opacity: 0;
    transform: translateX(200%);
}

[b-n6hod1mxwu] .square-btn:hover {
    background-color: var(--color-gray-100);
}

[b-n6hod1mxwu] .square-btn .k-button-text {
    display: block;
    width: 100%;
    white-space: normal;
}

[b-n6hod1mxwu] .square-btn .k-svg-icon {
    width: 32px;
    height: 32px;
}

[b-n6hod1mxwu] .square-btn span.btn-label {
    font-size: 13px;
    font-weight: 500;
    text-align: center;
    line-height: 1.15;
    display: block;
}

@keyframes highlight-pulse-b-n6hod1mxwu {
    0% {
        transform: scale(1);
        filter: brightness(1) drop-shadow(0 0 0 rgba(0, 149, 218, 0));
    }

    50% {
        transform: scale(1.3) translateY(-15px);
        filter: brightness(1.4) drop-shadow(0 0 15px rgba(0, 149, 218, 1));
    }

    100% {
        transform: scale(1);
        filter: brightness(1) drop-shadow(0 0 0 rgba(0, 149, 218, 0));
    }
}

[b-n6hod1mxwu] .marker-highlight {
    z-index: 9999 !important;
}

[b-n6hod1mxwu] .marker-highlight svg {
    animation: highlight-pulse-b-n6hod1mxwu 0.7s ease-in-out infinite;
    transform-origin: bottom center;
}

/* Extracted from KaartPage.razor */
.kaart-locatie-card[b-n6hod1mxwu] {
    background-color: white;
    border: 1px solid var(--color-gray-200);
    border-radius: 6px;
    padding: 12px;
    transition: all 0.2s ease;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    user-select: none;
    -webkit-user-select: none;
}

.kaart-locatie-card:hover[b-n6hod1mxwu] {
    border-color: var(--color-primary);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
}

/* SortableJS Classes */
[b-n6hod1mxwu] .sortable-drag {
    transition: none !important;
    opacity: 1 !important;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15) !important;
    transform: scale(1.02);
    z-index: 1000;
    border-color: var(--color-primary);
    cursor: grabbing !important;
}

[b-n6hod1mxwu] .sortable-ghost {
    opacity: 0.3 !important;
    background-color: rgba(0, 149, 218, 0.05) !important;
    border: 2px dashed var(--color-primary) !important;
    box-shadow: none !important;
}
/* _content/eLipsOnline/Components/Planning/Kaart/KaartPTVPage.razor.rz.scp.css */
.kaart-page[b-pz94yggfvo] {
    --kaart-surface: #ffffff;
    --kaart-border: var(--color-gray-200);
    --kaart-muted: #6b7280;
    --kaart-text: #111827;
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    background: var(--color-gray-50);
}

.kaart-header[b-pz94yggfvo] {
    position: relative;
    z-index: 20;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 14px 20px 14px;
    background: var(--kaart-surface);
    border-bottom: 1px solid var(--kaart-border);
}

.kaart-heading[b-pz94yggfvo] {
    min-width: 0;
}

.kaart-heading h1[b-pz94yggfvo] {
    margin: 0;
    color: var(--color-secondary-700);
    font-size: var(--fs-h3);
    font-weight: 500;
    line-height: 1.15;
}

.kaart-heading p[b-pz94yggfvo] {
    margin: 3px 0 0;
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
}

.rv-title[b-pz94yggfvo] {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
    padding: 5px 0;
}

.rv-title-icon[b-pz94yggfvo] {
    width: 45px;
    height: 45px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 5px;
    background: var(--color-primary-50);
    color: var(--color-primary-700);
}

    .rv-title-icon[b-pz94yggfvo]  .k-svg-icon {
        width: 25px !important;
        height: 25px !important;
    }

.rv-title-main[b-pz94yggfvo] {
    color: var(--color-secondary-700);
    font-size: var(--fs-h4);
    margin-bottom: 5px;
}

.rv-title-sub[b-pz94yggfvo] {
    margin-top: 0px;
    color: var(--color-gray-500);
    font-size: var(--fs-body-2);
    font-weight: 400;
    line-height: 1.25;
}

.kaart-toolbar[b-pz94yggfvo] {
    display: flex;
    align-items: flex-end;
    gap: 10px;
}

.kaart-toolbar-group[b-pz94yggfvo] {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.kaart-toolbar-label[b-pz94yggfvo] {
    color: #8f8f8f;
    font-size: var(--fs-caption);
    line-height: 1;
}

.kaart-toolbar-actions[b-pz94yggfvo] {
    display: flex;
    align-items: center;
    gap: 6px;
}

[b-pz94yggfvo] .kaart-action-btn {
    height: 34px;
    border-radius: 5px;
}

[b-pz94yggfvo] .kaart-action-btn .k-svg-icon {
    width: 16px;
    height: 16px;
}

[b-pz94yggfvo] .kaart-action-btn--primary {
    color: white;
    background: var(--blue);
    border-color: var(--blue);
}

[b-pz94yggfvo] .kaart-action-btn--primary:hover {
    color: white;
    filter: brightness(.96);
}

[b-pz94yggfvo] .kaart-action-btn.k-disabled, [b-pz94yggfvo] .kaart-action-btn.k-disabled * {
    cursor: not-allowed !important;
    pointer-events: auto !important;
}

.kaart-workspace[b-pz94yggfvo] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(350px, 420px) minmax(500px, 1fr) minmax(350px, 420px);
    gap: 12px;
    padding: 12px;
    overflow: hidden;
}

.kaart-panel[b-pz94yggfvo] {
    min-width: 0;
    min-height: 0;
    background: var(--kaart-surface);
    border: 1px solid var(--kaart-border);
    border-radius: 7px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .05), 0 4px 12px rgba(0, 0, 0, .04);
}

.kaart-stops[b-pz94yggfvo] {
    position: relative;
    z-index: 10;
    display: flex;
    flex-direction: column;
    overflow: visible;
}

.kaart-panel-header[b-pz94yggfvo] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 20px 20px 12px;
}

.kaart-panel-header-summary[b-pz94yggfvo] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 15px 15px 12px;
}

.kaart-panel-title[b-pz94yggfvo] {
    margin: 0;
    color: var(--color-secondary-700);
    font-size: var(--fs-h5);
    font-weight: 500;
}

.kaart-panel-title-summary[b-pz94yggfvo] {
    margin: 0;
}

.kaart-count[b-pz94yggfvo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 24px;
    padding: 0 13px;
    color: var(--color-primary-700);
    background: var(--color-primary-50);
    border-radius: 999px;
    font-size: var(--fs-caption);
    font-weight: 6500;
}

.kaart-search[b-pz94yggfvo] {
    position: relative;
    flex: 0 0 auto;
    padding: 5px 20px 12px;
}

.kaart-search-field[b-pz94yggfvo] {
    position: relative;
    display: block;
    width: 100%;
}

.kaart-search-field[b-pz94yggfvo]  .k-svg-icon {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 12px;
    width: 16px;
    height: 16px;
    color: var(--color-gray-500);
    transform: translateY(-50%);
    pointer-events: none;
}

.kaart-search-field[b-pz94yggfvo]  .k-textbox,
.kaart-search-field[b-pz94yggfvo]  .k-input {
    width: 100%;
    height: 36px;
}

.kaart-search-field[b-pz94yggfvo]  input {
    padding-left: 38px;
    color: var(--kaart-text);
    font-size: var(--fs-body-3);
}

.kaart-search-field[b-pz94yggfvo]  input::placeholder {
    color: var(--color-gray-500);
}

.search-results-list[b-pz94yggfvo] {
    position: absolute;
    z-index: 1000;
    top: calc(100% - 8px);
    left: 14px;
    right: 14px;
    max-height: 440px;
    padding: 12px 10px;
    margin: 0;
    overflow-y: auto;
    list-style: none;
    background: white;
    border: 1px solid var(--kaart-border);
    border-radius: 7px;
    /*    box-shadow: 0 12px 28px rgba(17, 24, 39, .14);*/
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.search-results-heading[b-pz94yggfvo] {
    padding: 5px 8px 8px;
    color: var(--color-gray-500);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .06em;
    line-height: 1;
    text-transform: uppercase;
}

.search-results-heading--locations[b-pz94yggfvo] {
    margin-top: 9px;
    padding-top: 15px;
    border-top: 1px solid var(--color-gray-200);
}

.search-result-item[b-pz94yggfvo] {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-height: 54px;
    padding: 12px 8px;
    border-bottom: 1px solid var(--color-gray-100);
    cursor: pointer;
    transition: background-color .15s ease;
}

.search-result-item:last-child[b-pz94yggfvo] {
    border-bottom: 0;
}

.search-result-item--best[b-pz94yggfvo] {
    grid-template-columns: 38px minmax(0, 1fr);
    background: color-mix(in srgb, var(--blue) 7%, white);
    border: 0;
    border-radius: 6px;
}

.search-result-item:hover[b-pz94yggfvo],
.search-result-item.active-item[b-pz94yggfvo] {
    background: var(--color-gray-100);
    border-radius: 6px;
}

.search-result-item--best:hover[b-pz94yggfvo],
.search-result-item--best.active-item[b-pz94yggfvo] {
    background: color-mix(in srgb, var(--blue) 12%, white);
}

.search-result-icon[b-pz94yggfvo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    color: var(--color-primary-700);
    background: white;
    border: 1px solid var(--color-gray-200);
    border-radius: 6px;
}

.search-result-icon[b-pz94yggfvo]  .k-svg-icon {
    width: 18px;
    height: 18px;
}

.search-result-copy[b-pz94yggfvo] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.result-title[b-pz94yggfvo] {
    display: block;
    overflow: hidden;
    color: var(--kaart-text);
    font-size: var(--fs-body-3);
    font-weight: 600;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.result-subtitle[b-pz94yggfvo] {
    display: block;
    overflow: hidden;
    color: var(--kaart-muted);
    font-size: var(--fs-caption);
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kaart-stop-list[b-pz94yggfvo] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 0 20px 12px;
    overflow-y: auto;
}

.kaart-action-section[b-pz94yggfvo] {
    padding: 10px 15px 15px;
    width: 100%;
}

[b-pz94yggfvo] .kaart-action-section .btn-full {
    position: relative;
    width: 100%;
    justify-content: center;
    text-align: center;
}

    [b-pz94yggfvo] .kaart-action-section .btn-full .k-svg-icon {
        position: absolute;
        right: 12px;
    }


.kaart-stop-hint[b-pz94yggfvo] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 36px;
    padding: 8px 20px;
    color: var(--color-gray-600);
    background: var(--color-gray-50);
    border-top: 1px solid var(--color-gray-200);
    border-radius: 0 0 7px 7px;
    font-size: var(--fs-caption);
    line-height: 1.35;
}

.kaart-stop-hint-icon[b-pz94yggfvo] {
    flex: 0 0 auto;
    color: var(--color-gray-400);
    font-size: 15px;
    line-height: 1;
}

.kaart-stop[b-pz94yggfvo] {
    display: grid;
    grid-template-columns: 15px 26px minmax(0,1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 15px 10px;
    background: white;
    border: 1px solid var(--kaart-border);
    border-radius: 6px;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.kaart-stop:hover[b-pz94yggfvo] {
    border-color: var(--color-selected-border);
    background-color: var(--color-selected-bg);
}

.drag-handle[b-pz94yggfvo] {
    color: var(--color-gray-400);
    font-size: 17px;
    line-height: 1;
    cursor: grab;
}

.volgorde-indicator[b-pz94yggfvo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 24px;
    height: 24px;
/*    color: var(--blue);
    background: color-mix(in srgb, var(--blue) 10%, white);
    border: 1px solid color-mix(in srgb, var(--blue) 25%, white);*/
    color: white;
    background: var(--color-primary-700);
    border: 1px solid var(--blue);
    border-radius: 50%;
    font-size: var(--fs-caption);
    font-weight: 600;
}

.kaart-stop-copy[b-pz94yggfvo] {
    min-width: 0;
    padding-left: 5px;
}

.kaart-stop-name[b-pz94yggfvo], .kaart-stop-address[b-pz94yggfvo] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kaart-stop-name[b-pz94yggfvo] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 600;
}

.kaart-stop-address[b-pz94yggfvo] {
    margin-top: 3px;
    color: var(--kaart-muted);
    font-size: var(--fs-caption);
}

.kaart-stop-actions[b-pz94yggfvo] {
    display: flex;
    gap: 5px;
}

[b-pz94yggfvo] .kaart-stop-actions .k-button {
    width: 28px;
    height: 28px;
    padding: 5px;
    border-radius: 4px;
}

.kaart-empty[b-pz94yggfvo] {
    display: flex;
    flex: 1;
    min-height: 150px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 24px;
    color: var(--kaart-muted);
    text-align: center;
}

.kaart-empty strong[b-pz94yggfvo] {
    margin-bottom: 5px;
    color: #374151;
    font-size: var(--fs-body-3);
}

.kaart-empty span[b-pz94yggfvo] {
    font-size: var(--fs-caption);
    line-height: 1.45;
}

.kaart-map[b-pz94yggfvo] {
    position: relative;
    overflow: hidden;
}

#map[b-pz94yggfvo] {
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
}

.kaart-insights[b-pz94yggfvo] {
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    overflow: hidden;
}

.kaart-summary[b-pz94yggfvo] {
    flex: 0 0 auto;
}

.kaart-countries-panel[b-pz94yggfvo] {
    flex: 1 1 280px;
    min-height: 180px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.kaart-countries-scroll[b-pz94yggfvo] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 0 12px 12px;
    overflow-y: auto;
}

.kaart-country-card[b-pz94yggfvo] {
    flex: 0 0 auto;
    background: white;
    border: 1px solid var(--color-gray-200);
    border-radius: 6px;
    overflow: hidden;
}

.kaart-country-summary[b-pz94yggfvo] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 12px;
    cursor: pointer;
    list-style: none;
}

.kaart-country-summary[b-pz94yggfvo]::-webkit-details-marker {
    display: none;
}

.kaart-country-heading[b-pz94yggfvo] {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) auto 18px;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.kaart-country-heading > strong[b-pz94yggfvo] {
    overflow: hidden;
    color: var(--kaart-text);
    font-size: var(--fs-body-3);
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kaart-country-flag[b-pz94yggfvo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 25px;
    overflow: hidden;
    color: var(--color-primary-700);
    background: var(--color-primary-50);
    border-radius: 50%;
    font-size: var(--fs-caption);
    font-weight: 700;
}

.kaart-country-flag img[b-pz94yggfvo] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.kaart-country-code[b-pz94yggfvo] {
    min-width: 30px;
    padding: 3px 8px;
    color: var(--color-primary-700);
    background: var(--color-primary-50);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    text-align: center;
}

.kaart-country-chevron[b-pz94yggfvo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-gray-600);
    transform: rotate(180deg);
    transition: transform .15s ease;
}

.kaart-country-chevron[b-pz94yggfvo]  .k-svg-icon {
    width: 14px;
    height: 14px;
}

.kaart-country-card[open] .kaart-country-chevron[b-pz94yggfvo] {
    transform: rotate(0deg);
}

/*.kaart-country-metrics,
.kaart-country-details {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}*/

.kaart-country-metrics[b-pz94yggfvo] {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.kaart-country-details[b-pz94yggfvo] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 20px;
    row-gap: 14px;
}

.kaart-country-metric[b-pz94yggfvo] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.kaart-country-metric strong[b-pz94yggfvo] {
    overflow: hidden;
    color: var(--kaart-text);
    font-size: var(--fs-body-3);
    font-weight: 650;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kaart-country-metric small[b-pz94yggfvo] {
    overflow: hidden;
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kaart-country-details[b-pz94yggfvo] {
    padding: 12px;
    background: var(--color-gray-30);
    border-top: 1px solid var(--color-gray-100);
}

.kaart-countries-empty[b-pz94yggfvo] {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    justify-content: center;
    min-height: 100px;
    padding: 18px;
    color: var(--color-gray-400);
    font-size: var(--fs-caption);
    line-height: 1.45;
    text-align: center;
    background-color: var(--color-gray-30);
    border-radius: 5px;
    border: 1px dashed var(--color-gray-200);
}

.kaart-countries-empty span[b-pz94yggfvo] {
    width: 200px;
}

.kaart-summary-grid[b-pz94yggfvo] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 0 15px 17px;
}

.kaart-metric[b-pz94yggfvo] {
    min-width: 0;
    padding: 11px;
    background: white;
    border: 1px solid var(--color-gray-200);
    border-radius: 6px;
}

.kaart-metric-label[b-pz94yggfvo] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 5px;
    color: var(--kaart-muted);
    font-size: var(--fs-caption);
}

    .kaart-metric-label[b-pz94yggfvo]  .k-svg-icon svg {
       width: 14px;
       height: 14px;
    }

.kaart-metric strong[b-pz94yggfvo] {
    display: block;
    margin-top: 6px;
    color: var(--kaart-text);
    font-size: var(--fs-body-2);
    font-weight: 550;
}

.kaart-metric-green[b-pz94yggfvo] {
    background: white;
    border: 1px solid var(--color-gray-200);
}

    .kaart-metric-green strong[b-pz94yggfvo] {
        color: var(--color-success-700);
    }

.kaart-details[b-pz94yggfvo] {
    flex: 1 1 auto;
    min-height: 240px;
    overflow: hidden;
}

.kaart-details-scroll[b-pz94yggfvo] {
    height: 100%;
    overflow-y: auto;
}

[b-pz94yggfvo] .kaart-details .k-panelbar {
    border: 0;
}

[b-pz94yggfvo] .kaart-details .k-panelbar-item {
    border-bottom: 1px solid var(--color-gray-100);
}

[b-pz94yggfvo] .kaart-details .k-link {
    padding: 13px 14px;
    color: #374151;
    background: white;
    font-size: var(--fs-body-3);
    font-weight: 650;
}

.kaart-data-grid[b-pz94yggfvo] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 4px 12px 14px;
}

.kaart-data-grid--three[b-pz94yggfvo] {
    grid-template-columns: repeat(3, 1fr);
}

.kaart-data-item[b-pz94yggfvo] {
    min-width: 0;
    padding: 10px;
    background: var(--color-gray-50);
    border-radius: 5px;
}

.kaart-data-item span[b-pz94yggfvo] {
    display: block;
    color: var(--kaart-muted);
    font-size: 10px;
    line-height: 1.25;
}

.kaart-data-item strong[b-pz94yggfvo] {
    display: block;
    margin-top: 5px;
    color: var(--kaart-text);
    font-size: var(--fs-caption);
    font-weight: 650;
    overflow-wrap: anywhere;
}

.kaart-country-list[b-pz94yggfvo] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 4px 12px 14px;
}

.kaart-country[b-pz94yggfvo] {
    padding: 11px;
    border: 1px solid var(--kaart-border);
    border-radius: 6px;
}

.kaart-country-title[b-pz94yggfvo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 9px;
    color: var(--kaart-text);
    font-size: var(--fs-body-3);
    font-weight: 650;
}

[b-pz94yggfvo] .sortable-drag {
    opacity: 1 !important;
    box-shadow: 0 12px 24px rgba(0, 0, 0, .15) !important;
    transform: scale(1.02);
    z-index: 1000;
    cursor: grabbing !important;
}

[b-pz94yggfvo] .sortable-ghost {
    opacity: .3 !important;
    background: color-mix(in srgb, var(--blue) 7%, white) !important;
    border: 2px dashed var(--blue) !important;
}

.kaart-emissions-grid[b-pz94yggfvo] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.kaart-emissions-co2[b-pz94yggfvo] {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    align-items: center;
    gap: 14px;
    padding: 12px;
}

.kaart-emissions-co2-icon[b-pz94yggfvo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    color: white;
    background: var(--color-success-700);
    border-radius: 5px;
}

    .kaart-emissions-co2-icon[b-pz94yggfvo]  .k-svg-icon {
        width: 20px;
        height: 20px;
    }

        .kaart-emissions-co2-icon[b-pz94yggfvo]  .k-svg-icon svg {
            fill: currentColor;
        }

.kaart-emissions-co2-copy[b-pz94yggfvo] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

    .kaart-emissions-co2-copy .kaart-metric-label[b-pz94yggfvo] {
        color: var(--color-gray-500);
        font-size: var(--fs-caption);
    }

    .kaart-emissions-co2-copy strong[b-pz94yggfvo] {
        margin-top: 0;
        color: var(--color-success-700);
        font-size: var(--fs-body-2);
        line-height: 1.05;
    }

@keyframes highlight-pulse-b-pz94yggfvo {
    0%, 100% {
        transform: scale(1);
        filter: brightness(1);
    }

    50% {
        transform: scale(1.3) translateY(-15px);
        filter: brightness(1.35) drop-shadow(0 0 12px rgba(0,149,218,.9));
    }
}

[b-pz94yggfvo] .marker-highlight {
    z-index: 9999 !important;
}

[b-pz94yggfvo] .marker-highlight svg {
    animation: highlight-pulse-b-pz94yggfvo .7s ease-in-out infinite;
    transform-origin: bottom center;
}

@media (max-width: 1250px) {
    .kaart-page[b-pz94yggfvo] {
        overflow-y: auto;
    }

    .kaart-workspace[b-pz94yggfvo] {
        flex: 0 0 auto;
        display: flex;
        flex-direction: column;
        min-height: 0;
        padding-bottom: 24px;
        overflow: visible;
    }

    .kaart-stops[b-pz94yggfvo] {
        min-height: 420px;
    }

    .kaart-map[b-pz94yggfvo] {
        min-height: 560px;
    }

    .kaart-insights[b-pz94yggfvo] {
        min-height: 0;
        overflow: visible;
    }

    .kaart-countries-panel[b-pz94yggfvo] {
        flex: 0 0 auto;
        min-height: 0;
        overflow: visible;
    }

    .kaart-countries-scroll[b-pz94yggfvo] {
        flex: 0 0 auto;
        overflow-y: visible;
    }
}

@media (max-width: 720px) {
    .kaart-header[b-pz94yggfvo] {
        align-items: flex-start;
        flex-direction: column;
    }

    .kaart-toolbar[b-pz94yggfvo] {
        width: 100%;
        flex-wrap: wrap;
    }

    .kaart-workspace[b-pz94yggfvo] {
        min-height: auto;
    }

    .kaart-stops[b-pz94yggfvo] {
        min-height: 360px;
    }

    .kaart-map[b-pz94yggfvo] {
        min-height: 520px;
    }

    .kaart-details[b-pz94yggfvo] {
        min-height: 360px;
    }
}

/* _content/eLipsOnline/Components/Planning/PlanningVerkenner - Copy.razor.rz.scp.css */

body[b-a7we8seogm] {
    overflow: hidden;
    padding: 0;
    margin: 0;
}

.content[b-a7we8seogm] {
    padding-top: 0;
}

.top-row[b-bjaewfqzbd][b-a7we8seogm], article[b-bjaewfqzbd][b-a7we8seogm] {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.rz-button[b-a7we8seogm] {
    padding: 1px;
    margin: 0;
    font-weight: 550
}

.rz-tabview-panels[b-a7we8seogm] {
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    box-shadow: none !important;
    gap: 0;
}

.grid-top[b-a7we8seogm] {
    flex: 1 1 auto;
    overflow: auto;
}

.grid-bottom[b-a7we8seogm] {
    flex: 0 0 auto;
    height: 700px; /* Fixed height like Dock: Bottom */
    overflow: auto;
}

.tab-content-fill[b-a7we8seogm] {
    padding: 0;
    margin: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.rz-tabview-panel[b-a7we8seogm],
.rz-tabs-content[b-a7we8seogm] {
    padding-top: 0 !important;
    margin-top: 0 !important;
    padding: 0;
    margin: 0;
    gap: 0;
}

ul[role=tablist][b-a7we8seogm] {
    flex-wrap: wrap;
}

.tab-content-wrapper[b-a7we8seogm] {
    display: flex;
    flex-direction: column;
    height: 100%; /* fill the entire tab */
}

.rz-splitter-bar[b-a7we8seogm] {
    font-size: 26px;
}

/* Vertical splitters (panels side-by-side) */
.rz-splitter-vertical > .rz-splitter-bar[b-a7we8seogm] {
    height: 16px; /* Thickness of the vertical bar */
}

/* Horizontal splitters (panels stacked) */
.rz-splitter-horizontal > .rz-splitter-bar[b-a7we8seogm] {
    width: 16px;
}

.table-cell-edited[b-a7we8seogm] {
    position: relative;
}

    .table-cell-edited[b-a7we8seogm]::after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        width: 0;
        height: 0;
        border-top: 10px solid red;
        border-left: 10px solid transparent;
    }

.rz-grid-table tr:hover[b-a7we8seogm] {
    background-color: #f0f8ff; /* light blue, change to your color */
    cursor: pointer; /* optional: shows clickable hand cursor */
}

.rz-data-grid-data[b-a7we8seogm] {
    overflow: hidden;
    margin: 0;
}

.rz-datatable-data[b-a7we8seogm] {
    margin: 0;
}

/* Remove padding inside each cell */
.rz-data-row > td[b-a7we8seogm] {
    padding: 4px !important;
}

.rz-grid-table thead[b-a7we8seogm] {
    padding: 0;
    margin: 0;
}

.rz-navigation-item-link[b-a7we8seogm] {
    padding: 4px !important;
}

.menu-separator[b-a7we8seogm] {
    padding: 0 !important;
    margin: 0 !important;
    height: 2px !important;
    min-height: 0 !important;
    line-height: 1 !important;
    font-size: 0 !important;
    color: transparent !important;
    background: transparent !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
    pointer-events: none;
    position: relative;
}

    .menu-separator[b-a7we8seogm]::before {
        content: "";
        display: block;
        width: 100%;
        height: 1px;
        background: #444;
        margin: 0;
    }

.rz-navigation-item-wrapper[b-a7we8seogm] {
    padding: 0 !important;
}

.menu-separator .rz-navigation-item-wrapper[b-a7we8seogm],
.menu-separator .rz-navigation-item-link[b-a7we8seogm] {
    height: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
}

.menu-separator .rz-navigation-item-text[b-a7we8seogm] {
    display: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.rz-button-lg .rzi[b-a7we8seogm] {
    font-size: 2.5rem; /* Make the icons bigger in a large button */
}

.icon-under-text .stack-col[b-a7we8seogm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

/* De splitter moet zelf niet groter worden dan viewport */
.pv-splitter[b-a7we8seogm] {
    height: 90vh;
    min-height: 0;
}

/* RadzenTabs moet hoogte krijgen + flex gedrag */
.pv-tabs[b-a7we8seogm] {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

    /* Radzen interne wrappers moeten ook "afknijpbaar" zijn */
    .pv-tabs .rz-tabview[b-a7we8seogm],
    .pv-tabs .rz-tabview-panels[b-a7we8seogm],
    .pv-tabs .rz-tabview-panel[b-a7we8seogm] {
        height: 100%;
        min-height: 0;
    }

/* Dit is je eigen container IN elk tab-item */
.pv-tab-body[b-a7we8seogm] {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden; /* belangrijk: hier stopt het "naar beneden groeien" */
}

    /* Als je DynamicEditableGrid intern een RadzenDataGrid rendert: */
    .pv-tab-body .rz-data-grid[b-a7we8seogm] {
        height: 100%;
        min-height: 0;
    }

        /* Vaak nodig zodat de grid body zelf scrolt */
        .pv-tab-body .rz-data-grid .rz-grid-table-wrapper[b-a7we8seogm],
        .pv-tab-body .rz-data-grid .rz-data-grid-data[b-a7we8seogm] {
            overflow: auto;
        }

/* _content/eLipsOnline/Components/Planning/PlanningVerkenner.razor.rz.scp.css */

/* Collapsed NAV */

.pv-nav[b-pqye2sicnq], .pv-nav-expanded[b-pqye2sicnq] {
    width: 100%;
    background-color: var(--color-gray-50);
    border-bottom: 1px solid #e8e8e8;
    overflow-y: hidden;
    overflow-x: hidden;
}

.pv-nav-toolbar[b-pqye2sicnq] {
    padding: 8px 10px 10px 6px;
    gap: 12px;
}

.pv-nav-toolbar-expanded[b-pqye2sicnq] {
    padding: 8px 10px 10px 15px;
    gap: 30px;
}

.pv-nav-group[b-pqye2sicnq] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 0 0 auto;
}

.pv-nav-label[b-pqye2sicnq] {
    font-size: var(--fs-caption);
    color: #8f8f8f;
    line-height: 1;
    padding-left: 0px;
    white-space: nowrap;
}

.pv-nav-group-body[b-pqye2sicnq] {
    min-height: 32px;
    gap: 4px;
}

.profile-dd[b-pqye2sicnq] {
    padding: 16px;
}






/* =========================
   Planning Navigation Expanded
   ========================= */
.pv-layout[b-pqye2sicnq] {
    display: grid;
    grid-template-columns: minmax(420px, 1fr) minmax(420px, 1fr);
    gap: 0;
    width: 100%;
    border-bottom: 1px solid var(--color-gray-100);
    padding-bottom: 13px;
}

.pv-block[b-pqye2sicnq] {
    min-width: 0;
    padding: 7px 12px 0 12px;
    background: #fff;
}

.pv-block-grid--top[b-pqye2sicnq] {
    display: grid;
    grid-template-columns: minmax(220px, 1.1fr) minmax(220px, 1.4fr) auto;
    gap: 12px;
    align-items: end;
}

.pv-item-date .pv-nav-group-body[b-pqye2sicnq] {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 8px;
    align-items: center;
}

.pv-filter-grid[b-pqye2sicnq] {
    display: grid;
    grid-template-columns: repeat(4, minmax(120px, 1fr));
    gap: 12px;
    align-items: end;
}

.pv-nav-group[b-pqye2sicnq] {
    min-width: 0;
}

.pv-nav-label[b-pqye2sicnq] {
    margin-bottom: 2px;
    white-space: nowrap;
}

.pv-nav-group-body[b-pqye2sicnq] {
    width: 100%;
}

.pv-nav-group .k-input[b-pqye2sicnq],
.pv-nav-group .k-picker[b-pqye2sicnq],
.pv-nav-group .k-combobox[b-pqye2sicnq],
.pv-nav-group .k-textbox[b-pqye2sicnq],
.pv-nav-group .k-dateinput[b-pqye2sicnq],
.pv-nav-group .k-datepicker[b-pqye2sicnq] {
    width: 100%;
}

.pv-button-row-with-action[b-pqye2sicnq] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
}

    .pv-button-row-with-action .pv-button-row--stretch[b-pqye2sicnq] {
        flex: 1 1 auto;
        min-width: 0;
    }

.pv-button-row--stretch[b-pqye2sicnq] {
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    width: 100%;
    min-width: 0;
}

    .pv-button-row--stretch .k-button[b-pqye2sicnq],
    .pv-button-row--stretch .pv-stretch-btn[b-pqye2sicnq] {
        flex: 1 1 0;
        min-width: 0;
        width: auto;
        justify-content: center;
    }

    .pv-button-row--stretch .k-button-text[b-pqye2sicnq] {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.pv-icon-btn[b-pqye2sicnq] {
    flex: 0 0 auto;
    width: auto;
    padding: 6px 8px;
}

@media (max-width: 1500px) {
    .pv-filter-grid[b-pqye2sicnq] {
        grid-template-columns: repeat(2, minmax(140px, 1fr));
    }
}

@media (max-width: 1200px) {
    .pv-layout[b-pqye2sicnq] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .pv-block-grid--top[b-pqye2sicnq],
    .pv-filter-grid[b-pqye2sicnq] {
        grid-template-columns: 1fr;
    }
}

.pv-nav-shell[b-pqye2sicnq],
.pv-layout-shell[b-pqye2sicnq] {
    overflow: hidden;
    will-change: height, opacity;
}

.pv-nav-shell[b-pqye2sicnq],
.pv-layout-shell[b-pqye2sicnq] {
    opacity: 1;
}

.btn-icon svg[b-pqye2sicnq] {
    transition: transform 240ms ease;
}

.is-rotated[b-pqye2sicnq] {
    transform: rotate(180deg);
}


.page-layout[b-pqye2sicnq] {
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.page-header[b-pqye2sicnq] {
    flex: 0 0 auto;
}

.page-body[b-pqye2sicnq] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}



.page-layout[b-pqye2sicnq],
.page-body[b-pqye2sicnq],
.page-body-shell[b-pqye2sicnq],
.splitter-host[b-pqye2sicnq] {
    min-width: 0;
    min-height: 0;
}

.page-body-shell[b-pqye2sicnq] {
    height: 100%;
    display: flex;
    overflow: hidden;
}

.left-rail[b-pqye2sicnq], .right-rail[b-pqye2sicnq] {
    width: 43px;
    min-width: 43px;
    flex: 0 0 43px;
    background: var(--color-gray-100);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    overflow: hidden;
}

.splitter-host[b-pqye2sicnq] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

.rail-btn[b-pqye2sicnq] {
    width: 43px;
    height: 43px;
    padding: 0;
    border: 0;
    border-bottom: 1px solid var(--color-gray-200);
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

    .rail-btn:hover[b-pqye2sicnq] {
        background: var(--color-gray-50);
    }

    .rail-btn.active[b-pqye2sicnq] {
        background: var(--color-white);
    }

.rail-btn-icon[b-pqye2sicnq] {
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-gray-600);
}

    .rail-btn-icon svg[b-pqye2sicnq] {
        width: 18px;
        height: 18px;
    }

.side-pane-content[b-pqye2sicnq] {
    height: 100%;
    min-height: 0;
    min-width: 0;
    overflow: hidden;
    background: #fff;
    display: flex;
    flex-direction: column;
}

.pane-content[b-pqye2sicnq] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
    box-sizing: border-box;
}

    .pane-content h2[b-pqye2sicnq] {
        flex: 0 0 auto;
        margin: 0 0 12px 0;
    }

.pane-grid-wrap[b-pqye2sicnq] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    overflow: hidden;
}

    .pane-grid-wrap .k-grid[b-pqye2sicnq] {
        height: 100%;
    }

.pane-content h2[b-pqye2sicnq] {
    font-size: var(--fs-body-1);
    padding: 10px 5px 0px 10px;
}

.main-pane[b-pqye2sicnq] {
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    min-width: 0;
    box-sizing: border-box;
}

.main-pane-section[b-pqye2sicnq] {
    height: 100%;
    min-height: 0;
    min-width: 0;
    overflow: hidden!important;
    box-sizing: border-box;
}

/* Kaart Window */
.planning-map-layout[b-pqye2sicnq] {
    display: grid;
    grid-template-rows: minmax(360px, 70%) minmax(0, 1fr);
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    background: var(--color-gray-50, #f9fafb);
    border-right: 1px solid var(--color-gray-200);
    border-left: 1px solid var(--color-gray-200);
}

.planning-map-section[b-pqye2sicnq] {
    position: relative;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    border-bottom: 1px solid var(--color-gray-200, #e5e7eb);
}

.planning-map-info-section[b-pqye2sicnq] {
    min-width: 0;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
}

    .planning-map-info-section[b-pqye2sicnq]  .kaart-info-panel-container {
        width: 100%;
        height: auto;
        min-height: 100%;
        overflow: visible;
        border-left: 0;
    }

    .planning-map-info-section[b-pqye2sicnq]  .kaart-countries-panel {
        flex: 0 0 auto;
        min-height: 0;
        height: auto;
        overflow: visible;
    }

    .planning-map-info-section[b-pqye2sicnq]  .kaart-countries-scroll {
        flex: 0 0 auto;
        min-height: 0;
        height: auto;
        overflow: visible;
    }
/* _content/eLipsOnline/Components/Planning/PlanningVerkennerOld.razor.rz.scp.css */

body[b-d9nx6kb179] {
    overflow: hidden;
    padding: 0;
    margin: 0;
}

.content[b-d9nx6kb179] {
    padding-top: 0;
}

.top-row[b-bjaewfqzbd][b-d9nx6kb179], article[b-bjaewfqzbd][b-d9nx6kb179] {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.rz-button[b-d9nx6kb179] {
    padding: 1px;
    margin: 0;
    font-weight: 550
}

.rz-tabview-panels[b-d9nx6kb179] {
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    box-shadow: none !important;
    gap: 0;
}

.grid-top[b-d9nx6kb179] {
    flex: 1 1 auto;
    overflow: auto;
}

.grid-bottom[b-d9nx6kb179] {
    flex: 0 0 auto;
    height: 700px; /* Fixed height like Dock: Bottom */
    overflow: auto;
}

.tab-content-fill[b-d9nx6kb179] {
    padding: 0;
    margin: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.rz-tabview-panel[b-d9nx6kb179],
.rz-tabs-content[b-d9nx6kb179] {
    padding-top: 0 !important;
    margin-top: 0 !important;
    padding: 0;
    margin: 0;
    gap: 0;
}

ul[role=tablist][b-d9nx6kb179] {
    flex-wrap: wrap;
}

.tab-content-wrapper[b-d9nx6kb179] {
    display: flex;
    flex-direction: column;
    height: 100%; /* fill the entire tab */
}

.rz-splitter-bar[b-d9nx6kb179] {
    font-size: 26px;
}

/* Vertical splitters (panels side-by-side) */
.rz-splitter-vertical > .rz-splitter-bar[b-d9nx6kb179] {
    height: 16px; /* Thickness of the vertical bar */
}

/* Horizontal splitters (panels stacked) */
.rz-splitter-horizontal > .rz-splitter-bar[b-d9nx6kb179] {
    width: 16px;
}

.table-cell-edited[b-d9nx6kb179] {
    position: relative;
}

    .table-cell-edited[b-d9nx6kb179]::after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        width: 0;
        height: 0;
        border-top: 10px solid red;
        border-left: 10px solid transparent;
    }

.rz-grid-table tr:hover[b-d9nx6kb179] {
    background-color: #f0f8ff; /* light blue, change to your color */
    cursor: pointer; /* optional: shows clickable hand cursor */
}

.rz-data-grid-data[b-d9nx6kb179] {
    overflow: hidden;
    margin: 0;
}

.rz-datatable-data[b-d9nx6kb179] {
    margin: 0;
}

/* Remove padding inside each cell */
.rz-data-row > td[b-d9nx6kb179] {
    padding: 4px !important;
}

.rz-grid-table thead[b-d9nx6kb179] {
    padding: 0;
    margin: 0;
}

.rz-navigation-item-link[b-d9nx6kb179] {
    padding: 4px !important;
}

.menu-separator[b-d9nx6kb179] {
    padding: 0 !important;
    margin: 0 !important;
    height: 2px !important;
    min-height: 0 !important;
    line-height: 1 !important;
    font-size: 0 !important;
    color: transparent !important;
    background: transparent !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
    pointer-events: none;
    position: relative;
}

    .menu-separator[b-d9nx6kb179]::before {
        content: "";
        display: block;
        width: 100%;
        height: 1px;
        background: #444;
        margin: 0;
    }

.rz-navigation-item-wrapper[b-d9nx6kb179] {
    padding: 0 !important;
}

.menu-separator .rz-navigation-item-wrapper[b-d9nx6kb179],
.menu-separator .rz-navigation-item-link[b-d9nx6kb179] {
    height: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
}

.menu-separator .rz-navigation-item-text[b-d9nx6kb179] {
    display: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.rz-button-lg .rzi[b-d9nx6kb179] {
    font-size: 2.5rem; /* Make the icons bigger in a large button */
}

.icon-under-text .stack-col[b-d9nx6kb179] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

/* De splitter moet zelf niet groter worden dan viewport */
.pv-splitter[b-d9nx6kb179] {
    height: 90vh;
    min-height: 0;
}

/* RadzenTabs moet hoogte krijgen + flex gedrag */
.pv-tabs[b-d9nx6kb179] {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

    /* Radzen interne wrappers moeten ook "afknijpbaar" zijn */
    .pv-tabs .rz-tabview[b-d9nx6kb179],
    .pv-tabs .rz-tabview-panels[b-d9nx6kb179],
    .pv-tabs .rz-tabview-panel[b-d9nx6kb179] {
        height: 100%;
        min-height: 0;
    }

/* Dit is je eigen container IN elk tab-item */
.pv-tab-body[b-d9nx6kb179] {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden; /* belangrijk: hier stopt het "naar beneden groeien" */
}

    /* Als je DynamicEditableGrid intern een RadzenDataGrid rendert: */
    .pv-tab-body .rz-data-grid[b-d9nx6kb179] {
        height: 100%;
        min-height: 0;
    }

        /* Vaak nodig zodat de grid body zelf scrolt */
        .pv-tab-body .rz-data-grid .rz-grid-table-wrapper[b-d9nx6kb179],
        .pv-tab-body .rz-data-grid .rz-data-grid-data[b-d9nx6kb179] {
            overflow: auto;
        }

/* _content/eLipsOnline/Components/Planning/TruckPlanningTest.razor.rz.scp.css */
.planning-test-layout[b-p7kaftl1gx] {
    display: flex;
    gap: 20px;
    width: 100%;
}

.unplanned-panel[b-p7kaftl1gx] {
    width: 250px;
    flex-shrink: 0;
}

.unplanned-order[b-p7kaftl1gx] {
    padding: 12px;
    margin-bottom: 8px;
    border: 1px solid #dcdcdc;
    border-radius: 6px;
    background: white;
    cursor: grab;
    user-select: none;
}

    .unplanned-order:hover[b-p7kaftl1gx] {
        background: #f8f9fa;
    }

    .unplanned-order:active[b-p7kaftl1gx] {
        cursor: grabbing;
    }

.scheduler-drop-zone[b-p7kaftl1gx] {
    flex: 1;
    min-width: 0;
}

.drop-result[b-p7kaftl1gx] {
    margin-top: 16px;
    padding: 10px 14px;
    border: 1px solid #ddd;
    border-radius: 6px;
    background: #fafafa;
}
/* _content/eLipsOnline/Components/SmallComponents/ChooseExtraTourPoint.razor.rz.scp.css */
.exttp-dialog[b-00b8fwj2wa] {
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* === MOMENT RIJ === */
.moment-grid[b-00b8fwj2wa] {
    display: grid;
    grid-template-columns: auto 120px 100px;
    align-items:  baseline;
    gap: 12px;
}

/* === DATUM RIJ === */
.date-grid[b-00b8fwj2wa] {
    display: grid;
    grid-template-columns: 100px 200px 130px 130px 120px 70px;
    align-items: center;
    gap: 8px;
}

.double-grid[b-00b8fwj2wa] {
    display: grid;
    grid-template-columns:100px 250px;
    align-items: center;
    gap: 8px;
}

.double-grid-wide[b-00b8fwj2wa] {
    display: grid;
    grid-template-columns: 100px auto;
    align-items: center;
    gap: 8px;
}

/* compacte telerik inputs */
.compact .k-input-inner[b-00b8fwj2wa] {
    padding: 2px 6px !important;
    height: 26px !important;
    font-size: 13px;
}

.compact.k-input[b-00b8fwj2wa],
.compact.k-picker[b-00b8fwj2wa] {
    height: 28px !important;
}

/* kleine textbox */
.small-input[b-00b8fwj2wa] {
    width: 70px;
}

/* footer rechts */
.dialog-footer[b-00b8fwj2wa] {
    margin-top: 15px;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    border-top: 1px solid #ddd;
    padding-top: 8px;
}


.tp-main-grid[b-00b8fwj2wa] {
    display: grid;
    grid-template-columns: 40% 40%;
    gap: 20px;
    align-items: start;
}

.tp-left[b-00b8fwj2wa] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.tp-right[b-00b8fwj2wa] {
    display: flex;
}

.locatie-card[b-00b8fwj2wa] {
    margin-top:30px;
    width: 100%;
    height:  auto;
    border: 1px solid #9fb3c8;
    border-radius: 4px;
    background: #f3f6fb;
    padding: 10px;
}

.locatie-title[b-00b8fwj2wa] {
    background: #7f98b5;
    color: white;
    font-weight: 700;
    padding: 6px 8px;
    margin: -10px -10px 8px -10px;
    border-radius: 4px 4px 0 0;
}

.locatie-line[b-00b8fwj2wa] {
    font-size: 15px;
    color: #1a3f7a;
    margin-bottom: 4px;
}
/* _content/eLipsOnline/Components/SmallComponents/ComboAutoComplete.razor.rz.scp.css */
.comboac-wrapper[b-92lcoqivez] {
    position: relative;
    display: inline-flex;
    align-items: stretch;
    width: 100%;
}

.comboac-input[b-92lcoqivez] {
    flex: 1;
    min-width: 0;
    padding: 6px 8px;
    border: 1px solid #dadfe2;
    border-right: 0;
    font-size: 14px;
}

.comboac-toggle[b-92lcoqivez] {
    border: 1px solid #dadfe2;
    background: #f8f9fa;
    padding: 0 8px;
    cursor: pointer;
}

.comboac-panel[b-92lcoqivez] {
    position: absolute;
    z-index: 1000;
    top: calc(100% + 2px);
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #dadfe2;
    max-height: 240px;
    overflow: auto;
    box-shadow: 0 6px 18px rgba(0,0,0,.08);
}

.comboac-item[b-92lcoqivez] {
    padding: 6px 8px;
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    white-space: nowrap;
}

    .comboac-item:hover[b-92lcoqivez],
    .comboac-item.active[b-92lcoqivez] {
        background: #eef6ff;
    }
/* _content/eLipsOnline/Components/SmallComponents/ComboAutoCompleteGrid.razor.rz.scp.css */
.comboac-wrapper[b-g784levtne] {
    position: relative; /* laat staan */
    display: inline-block; /* ← aangepast (was inline-flex) */
    width: 100%;
}

/* gridpanel: geen wijziging behalve min-width iets flexibeler maken als je wilt */
.comboac-gridpanel[b-g784levtne] {
    position: fixed !important;
    top: var(--combo-top);
    left: var(--combo-left);
    width: var(--combo-width);
    z-index: 999999;
}

    .comboac-gridpanel:focus-within[b-g784levtne] {
        border-color: #0078d7;
        box-shadow: 0 0 0 3px rgba(0,120,215,.2);
    }

.comboac-input-color[b-g784levtne] {
    background-color: #EDFFFF;
    width: 100%;
    box-sizing: border-box;
    padding: 6px 48px 6px 8px; /* ← aangepast: ruimte rechts voor X en ▼ */
    border: 1px solid #dadfe2;
    font-size: 14px;
    border-radius: 4px; /* ← optioneel, Radzen-stijl */
    outline: none;
}

    .comboac-input-color:focus[b-g784levtne] {
        border-color: #0078d7;
        box-shadow: 0 0 0 3px rgba(0,120,215,.2);
    }

/* --- INPUT veld --- */
.comboac-input[b-g784levtne] {
    width: 100%;
    box-sizing: border-box;
    padding: 6px 48px 6px 8px; /* ← aangepast: ruimte rechts voor X en ▼ */
    border: 1px solid #dadfe2;
    font-size: 14px;
    border-radius: 4px; /* ← optioneel, Radzen-stijl */
    outline: none;
}

    .comboac-input:focus[b-g784levtne] {
        border-color: #0078d7;
        box-shadow: 0 0 0 3px rgba(0,120,215,.2);
    }

/* --- CLEAR knop (✖) --- */
.comboac-clear[b-g784levtne] {
    position: absolute; /* ← nieuw */
    right: 33px; /* ← nieuw (ruimte voor ▼) */
    top: 50%;
    transform: translateY(-50%);
    border: none;
    background: transparent;
    cursor: pointer;
    color: #888;
    font-size: 16px; /* ← groter icoon */
    padding: 0;
    line-height: 1;
    transition: color 0.2s, opacity 0.2s;
}

    .comboac-clear:hover[b-g784levtne] {
        color: #d00;
    }

    .comboac-clear.hidden[b-g784levtne] {
        display: none; /* verberg alleen als leeg */
    }

/* --- TOGGLE knop (▼) --- */
.comboac-toggle[b-g784levtne] {
    position: absolute; /* ← nieuw */
    right: 10px; /* ← nieuw */
    top: 50%;
    transform: translateY(-50%);
    border: none; /* ← aangepast (was rand, nu in input) */
    background: transparent; /* ← aangepast */
    color: #555;
    font-size: 20px; /* ← groter pijltje */
    cursor: pointer;
    padding: 0;
}

/* panel, item en highlight ongewijzigd */
.comboac-panel[b-g784levtne] {
    position: absolute;
    z-index: 1000;
    top: calc(100% + 2px);
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #dadfe2;
    overflow: auto;
    box-shadow: 0 6px 18px rgba(0,0,0,.08);
}

.comboac-item[b-g784levtne] {
    padding: 6px 8px;
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    white-space: nowrap;
}

    .comboac-item:hover[b-g784levtne],
    .comboac-item.active[b-g784levtne] {
        background: #eef6ff;
    }

/* highlight (ongewijzigd) */
.comboac-highlight[b-g784levtne] {
    background-color: #eef6ff !important;
}

.rz-state-highlight .rz-data-row[b-g784levtne] {
    background-color: #e6f0ff !important;
}
/* _content/eLipsOnline/Components/SmallComponents/ContractTypeDialog.razor.rz.scp.css */


.contract-type-window[b-tt59ii3bux]  .k-window-content {
    padding: 0;
    background: #fff;
}

.rv-title[b-tt59ii3bux] {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
    padding: 5px 0;
}

.rv-title-icon[b-tt59ii3bux] {
    width: 45px;
    height: 45px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 5px;
    background: var(--color-primary-50);
    color: var(--color-primary-700);
}

    .rv-title-icon[b-tt59ii3bux]  .k-svg-icon {
        width: 25px !important;
        height: 25px !important;
    }

.rv-title-main[b-tt59ii3bux] {
    color: var(--color-secondary-700);
    font-size: var(--fs-h4);
    margin-bottom: 5px;
}

.rv-title-sub[b-tt59ii3bux] {
    margin-top: 0px;
    color: var(--color-gray-500);
    font-size: var(--fs-body-2);
    font-weight: 400;
    line-height: 1.25;
}

.ctd-title[b-tt59ii3bux] {
    display: flex;
    align-items: center;
    gap: 20px;
}

.ctd-option-icon[b-tt59ii3bux] {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    background: var(--color-primary-50);
    color: var(--color-primary-700);
}

.ctd-title-icon[b-tt59ii3bux] {
    width: 58px;
    height: 58px;
    border-radius: 10px;
}

.ctd-content[b-tt59ii3bux] {
    padding: 20px;
}

.ctd-content h5[b-tt59ii3bux] {
    margin: 0 0 8px;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-1);
    font-weight: 500;
}

.ctd-content > p[b-tt59ii3bux] {
    margin: 0;
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
}

.ctd-options[b-tt59ii3bux] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    margin-top: 20px;
}

.ctd-option[b-tt59ii3bux] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 28px 20px;
    border: 1px solid var(--color-gray-200);
    border-radius: 10px;
    background: #fff;
    color: inherit;
    font: inherit;
    text-align: center;
    cursor: pointer;
}

.ctd-option:hover[b-tt59ii3bux],
.ctd-option:focus-visible[b-tt59ii3bux] {
    border-color: var(--color-selected-border);
    background-color: var(--color-selected-bg)
}

.ctd-option-icon[b-tt59ii3bux] {
    width: 60px;
    height: 60px;
    margin-bottom: 28px;
    border-radius: 10px;
}

.ctd-option-icon[b-tt59ii3bux]  .k-svg-icon {
    width: 28px;
    height: 28px;
}

.ctd-option-icon--staffel[b-tt59ii3bux] {
    background: #fff2e6;
    color: #e66f00;
}

.ctd-option-icon--toeslag[b-tt59ii3bux] {
    background: #f0e0ff;
    color: #8e4ae8;
}

.ctd-option strong[b-tt59ii3bux] {
    margin-bottom: 7px;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-1);
    font-weight: 550;
}

.ctd-option > span:last-child[b-tt59ii3bux] {
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
}

.ctd-footer[b-tt59ii3bux] {
    display: flex;
    justify-content: flex-end;
}

@media (max-width: 760px) {
    .contract-type-window[b-tt59ii3bux]  .k-window-titlebar {
        min-height: 100px;
        padding: 20px;
    }

    .contract-type-window[b-tt59ii3bux]  .k-window-action[title="Minimize"] {
        display: none;
    }

    .ctd-title[b-tt59ii3bux] {
        gap: 14px;
    }

    .ctd-title-icon[b-tt59ii3bux] {
        width: 48px;
        height: 48px;
    }

    .ctd-content[b-tt59ii3bux] {
        max-height: calc(100vh - 230px);
        padding: 24px 20px 30px;
        overflow-y: auto;
    }

    .ctd-options[b-tt59ii3bux] {
        grid-template-columns: 1fr;
        gap: 14px;
        margin-top: 24px;
    }

    .ctd-option[b-tt59ii3bux] {
        min-height: 150px;
    }

    .ctd-option-icon[b-tt59ii3bux] {
        width: 56px;
        height: 56px;
        margin-bottom: 16px;
    }

    .contract-type-window[b-tt59ii3bux]  .k-window-footer {
        padding: 16px 20px;
    }
}
/* _content/eLipsOnline/Components/SmallComponents/Facturatie/FactuurGrid.razor.rz.scp.css */
.popup-backdrop[b-tkv89m8ib2] {
    position: fixed;
    inset: 0;
    background: transparent;
    z-index: 9999;
}

.fo-grid-footer-total[b-tkv89m8ib2] {
    display: block;
    text-align: right;
    font-variant-numeric: tabular-nums;
}
/* _content/eLipsOnline/Components/SmallComponents/Facturatie/FactuurRegelGrid.razor.rz.scp.css */
.fr-grid-actions[b-v7vxblfe96] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.fr-grid-action-group[b-v7vxblfe96] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.popup-backdrop[b-v7vxblfe96] {
    position: fixed;
    inset: 0;
    background: transparent;
    z-index: 9999;
}
/* _content/eLipsOnline/Components/SmallComponents/LadingPopup.razor.rz.scp.css */
.lading-popup[b-1s4iyhsuhe] {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(300px, 400px) minmax(0, 1fr);
    overflow: hidden;
    background: var(--color-gray-50);
}

.lading-window[b-1s4iyhsuhe]  .k-window-content {
    height: 100%;
    min-height: 0;
    padding: 0;
    overflow: hidden;
}

.lading-window[b-1s4iyhsuhe]  .k-window-footer {
    padding: 8px 10px;
}

.lading-list-panel[b-1s4iyhsuhe],
.lading-detail-panel[b-1s4iyhsuhe] {
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: #fff;
}

.lading-detail-panel[b-1s4iyhsuhe] {
    overflow: hidden;
}

.lading-detail-header[b-1s4iyhsuhe] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
/*    border-bottom: 1px solid var(--color-gray-200);*/
    gap: 12px;
/*    padding: 10px 20px;*/
}

.lading-links[b-1s4iyhsuhe] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 28px;
}

.lading-link-button[b-1s4iyhsuhe] {
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.lading-link-button:hover[b-1s4iyhsuhe] {
    color: var(--color-primary-700);
}

.lading-panel-title[b-1s4iyhsuhe] {
    color: var(--color-gray-800);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
}

.lading-panel-subtitle[b-1s4iyhsuhe] {
    margin-top: 3px;
    color: var(--color-gray-500);
    font-size: 12px;
    line-height: 1.2;
}

.lading-form[b-1s4iyhsuhe] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    overflow: hidden;
}

    .lading-form[b-1s4iyhsuhe],
    .lading-form[b-1s4iyhsuhe]  form {
        height: 100%;
        min-height: 0;
    }

        .lading-form[b-1s4iyhsuhe]  form {
            display: flex;
            flex-direction: column;
        }

    .lading-form[b-1s4iyhsuhe]  .k-form-fieldset {
        flex: 1 1 auto;
        min-height: 0;
        display: flex;
        flex-direction: column;
        margin: 0;
        padding: 0;
        border: 0;
        overflow: hidden;
    }

    .lading-form[b-1s4iyhsuhe]  .k-form-legend,
    .lading-form[b-1s4iyhsuhe]  .k-form-buttons {
        display: none;
    }

.lading-form-body[b-1s4iyhsuhe] {
    flex: 1 1 auto;
    min-height: 0;
/*    padding: 12px 16px 0;*/
    overflow: hidden;
    background-color: var(--color-gray-50);
    border-radius: 0;
}

.lading-step-layout[b-1s4iyhsuhe] {
    height: 100%;
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 14px;
    overflow: hidden;
}

.lading-step-nav[b-1s4iyhsuhe] {
    min-height: 0;
    overflow: hidden;
    padding: 20px 0 0 25px;
}

.lading-step-content[b-1s4iyhsuhe] {
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow-y: auto;
    padding: 20px 12px 25px 5px;
}

.lading-section-grid[b-1s4iyhsuhe] {
    display: grid;
    width: min(100%, 900px);
    grid-template-columns: 1fr;
    gap: 20px;
    align-items: start;
}

.lading-field-section[b-1s4iyhsuhe] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 20px;
    border: 1px solid var(--color-gray-200);
    border-radius: 6px;
    background: var(--white);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

    .lading-field-section h4[b-1s4iyhsuhe] {
        margin: 0;
    }

.lading-core-fields[b-1s4iyhsuhe] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.lading-field-stack[b-1s4iyhsuhe],
.lading-form-grid[b-1s4iyhsuhe] {
    display: grid;
    gap: 12px;
    min-height: 0;
}

.lading-form-row[b-1s4iyhsuhe] {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    align-items: center;
    gap: 20px;
    min-width: 0;
}

.lading-panel-heading[b-1s4iyhsuhe] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

    .lading-panel-heading h4[b-1s4iyhsuhe] {
        margin: 0;
    }

.lading-checks[b-1s4iyhsuhe] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 42px;
    padding-top: 8px;
}

.check-field[b-1s4iyhsuhe] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.lading-t1-check[b-1s4iyhsuhe] {
    padding-top: 0;
}

.lading-split-fields[b-1s4iyhsuhe] {
    display: grid;
    gap: 12px;
    min-width: 0;
}

.lading-split-fields--value[b-1s4iyhsuhe] {
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 8px 12px;
}

.lading-check-row[b-1s4iyhsuhe] {
    min-height: 32px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-top: 10px;
}

    .lading-check-row .txt-label[b-1s4iyhsuhe] {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        margin: 0;
        white-space: nowrap;
    }

.lading-check-label[b-1s4iyhsuhe] {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
}

.lading-form[b-1s4iyhsuhe]  .k-floating-label-container {
    width: 100%;
}

.lading-form[b-1s4iyhsuhe]  .k-input,
.lading-form[b-1s4iyhsuhe]  .k-picker,
.lading-form[b-1s4iyhsuhe]  .k-numerictextbox,
.lading-form[b-1s4iyhsuhe]  .k-dropdownlist,
.lading-form[b-1s4iyhsuhe]  .k-combobox {
    min-height: 32px;
}

.required-label[b-1s4iyhsuhe]::after {
    content: "*";
    margin-left: 4px;
    color: var(--color-danger-500, #dc3545);
    font-weight: 700;
}

.lading-window-footer[b-1s4iyhsuhe] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    width: 100%;
}

.lading-window-footer__left[b-1s4iyhsuhe],
.lading-window-footer__right[b-1s4iyhsuhe] {
    display: flex;
    align-items: center;
    gap: 10px;
}

@media (max-width: 1100px) {
    .lading-window[b-1s4iyhsuhe] {
        width: 90vw !important;
        max-width: 90vw !important;
        height: 90dvh !important;
        max-height: 90dvh !important;
    }

    .lading-popup[b-1s4iyhsuhe] {
        grid-template-columns: minmax(0, 1fr);
    }

    .lading-popup > .detail-list-panel[b-1s4iyhsuhe] {
        display: none;
    }

    .lading-step-layout[b-1s4iyhsuhe] {
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
    }

    .lading-step-nav[b-1s4iyhsuhe] {
        display: none;
    }

    .lading-step-content[b-1s4iyhsuhe] {
        height: 100%;
        overflow-y: auto;
        padding: 18px 16px 24px;
    }

    .lading-section-grid[b-1s4iyhsuhe] {
        width: 100%;
    }

    .lading-field-section[b-1s4iyhsuhe] {
        gap: 18px;
        padding: 20px;
    }

    .lading-form-row[b-1s4iyhsuhe] {
        grid-template-columns: 150px minmax(0, 1fr);
        gap: 16px;
    }

    .lading-links[b-1s4iyhsuhe] {
        gap: 16px;
    }
}

@media (max-width: 800px) {
    .lading-window[b-1s4iyhsuhe]  .k-window-content {
        overflow: hidden;
    }

    .lading-popup[b-1s4iyhsuhe] {
        grid-template-columns: 1fr;
        grid-template-rows: minmax(0, 1fr);
        height: 100%;
        min-height: 0;
        overflow: hidden;
    }

    .lading-detail-panel[b-1s4iyhsuhe],
    .lading-form[b-1s4iyhsuhe],
    .lading-form[b-1s4iyhsuhe]  form,
    .lading-form[b-1s4iyhsuhe]  .k-form-fieldset,
    .lading-form-body[b-1s4iyhsuhe],
    .lading-step-layout[b-1s4iyhsuhe] {
        min-height: 0;
        height: 100%;
        overflow: hidden;
    }

    .lading-step-content[b-1s4iyhsuhe] {
        height: 100%;
        min-height: 0;
        padding: 14px;
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    .lading-form-row[b-1s4iyhsuhe],
    .lading-split-fields--value[b-1s4iyhsuhe] {
        grid-template-columns: 1fr;
        gap: 7px;
    }

    .lading-field-section[b-1s4iyhsuhe] {
        gap: 16px;
        padding: 18px;
    }

    .lading-section-grid[b-1s4iyhsuhe] {
        gap: 14px;
    }

    .lading-checks[b-1s4iyhsuhe],
    .lading-panel-heading[b-1s4iyhsuhe] {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

    .lading-checks[b-1s4iyhsuhe] {
        gap: 14px;
    }

    .lading-window-footer[b-1s4iyhsuhe] {
        justify-content: flex-end;
    }

    .lading-window-footer__right[b-1s4iyhsuhe] {
        justify-content: flex-end;
        width: 100%;
    }
}

@media (max-width: 600px) {
    .lading-window[b-1s4iyhsuhe] {
        width: 90vw !important;
        max-width: 90vw !important;
        height: 90dvh !important;
        max-height: 90dvh !important;
    }

    .lading-window[b-1s4iyhsuhe]  .k-window-titlebar {
        padding-inline: 12px;
    }

    .lading-window[b-1s4iyhsuhe]  .k-window-footer {
        padding: 8px 10px max(8px, env(safe-area-inset-bottom));
    }

    .lading-popup[b-1s4iyhsuhe] {
        grid-template-rows: minmax(0, 1fr);
    }

    .lading-detail-header[b-1s4iyhsuhe] {
        display: none;
    }

    .lading-step-content[b-1s4iyhsuhe] {
        padding: 12px 10px 18px;
    }

    .lading-field-section[b-1s4iyhsuhe] {
        gap: 14px;
        padding: 16px 14px;
    }

    .lading-field-stack[b-1s4iyhsuhe],
    .lading-form-grid[b-1s4iyhsuhe] {
        gap: 11px;
    }

    .lading-window-footer__right[b-1s4iyhsuhe] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }

    .lading-window-footer__right[b-1s4iyhsuhe]  .k-button {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 380px) {
    .lading-field-section[b-1s4iyhsuhe] {
        padding-inline: 12px;
    }
}
/* _content/eLipsOnline/Components/SmallComponents/MainLogin.razor.rz.scp.css */
.login-page[b-ysr2p5wljv] {
    min-height: 100vh;
    min-height: 100svh;
    background: var(--color-gray-50);
    color: var(--color-secondary-700);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: clamp(10px, 1.5vw, 20px);
    font-family: Arial, Helvetica, sans-serif;
}

.login-shell[b-ysr2p5wljv] {
    width: min(100%, 1540px);
    min-height: min(88vh, 820px);
    display: grid;
    grid-template-columns: minmax(520px, 0.92fr) minmax(520px, 1fr);
    overflow: hidden;
    border: 1px solid var(--color-gray-200);
    border-radius: 15px;
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.login-story[b-ysr2p5wljv] {
    position: relative;
    min-height: 760px;
    overflow: hidden;
    background: #eaf2ff;
}

.login-story[b-ysr2p5wljv]::after {
    content: "";
    position: absolute;
    inset: 0;
/*    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(239, 247, 255, 0.84) 47%, rgba(214, 230, 250, 0.28) 72%, rgba(10, 49, 112, 0.25) 100%);*/
    pointer-events: none;
}

.login-story-image[b-ysr2p5wljv] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.login-story-content[b-ysr2p5wljv] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.login-brand[b-ysr2p5wljv] {
    position: absolute;
    top: 55px;
    left: 65px;
    display: flex;
    align-items: center;
    z-index: 10;
}

    .login-brand img[b-ysr2p5wljv] {
        height: 65px;
        width: auto;
        object-fit: contain;
        display: block;
    }

.login-product-badge[b-ysr2p5wljv] {
    width: max-content;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-top: 55px;
    border-radius: 10px;
    background: rgba(222, 235, 255, 0.92);
    color: var(--color-primary-700);
    font-size: var(--fs-body-3);
    font-weight: 700;
    line-height: 1;
    padding: 10px 16px;
}

.login-story-copy[b-ysr2p5wljv] {
    max-width: 520px;
    margin-top: 24px;
}

.login-story-copy h2[b-ysr2p5wljv] {
    margin: 0;
    color: #06143d;
    font-size: var(--fs-display-3);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: 0;
}

.login-story-copy h2 span[b-ysr2p5wljv] {
    color: var(--color-primary-700);
}

.login-story-copy p[b-ysr2p5wljv] {
    max-width: 470px;
    margin: 26px 0 0;
    color: #435277;
    font-size: 17px;
    line-height: 1.55;
}

.login-content[b-ysr2p5wljv] {
    margin-left: -20px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
    position: relative;
    min-height: 760px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    padding: clamp(42px, 6vw, 90px);
    border-bottom-left-radius: 15px;
    border-top-left-radius: 15px;
}

.login-content[b-ysr2p5wljv]  .login-form-card,
.login-content[b-ysr2p5wljv]  .totp-card {
    width: min(100%, 560px);
}

.login-content-header[b-ysr2p5wljv] {
    position: absolute;
    top: clamp(32px, 4vw, 58px);
    left: clamp(32px, 4vw, 58px);
    right: clamp(32px, 4vw, 58px);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 24px;
}

.login-mobile-brand[b-ysr2p5wljv] {
    display: none;
    align-items: center;
}

.login-mobile-brand img[b-ysr2p5wljv] {
    width: auto;
    height: 44px;
    max-width: 180px;
    object-fit: contain;
}

.login-language[b-ysr2p5wljv] {
    height: 40px;
    display: inline-flex;
    align-items: center;
    gap: 3px;
    border: 1px solid var(--color-gray-100);
    border-radius: 10px;
    background: #ffffff;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 600;
    padding: 0 14px;
}

.login-language .material-symbols-rounded[b-ysr2p5wljv] {
    font-size: 18px;
}

.login-language span[b-ysr2p5wljv] {
    padding-right: 5px;
}

.login-footer[b-ysr2p5wljv] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
    line-height: 1.35;
    padding: 22px 12px 0;
    text-align: center;
}

.login-footer a[b-ysr2p5wljv] {
    color: var(--color-gray-500);
    text-decoration: none;
}

.login-footer a:hover[b-ysr2p5wljv] {
    color: var(--color-primary-700);
    text-decoration: underline;
}

@media (max-width: 1140px) {
    .login-page[b-ysr2p5wljv] {
        position: relative;
        background: url("Images/elipsonlinebg.png") center / cover no-repeat;
    }

    .login-shell[b-ysr2p5wljv] {
        position: relative;
        z-index: 1;
        width: min(100%, 620px);
        min-height: auto;
        display: block;
    }

    .login-story[b-ysr2p5wljv] {
        display: none;
    }

    .login-content[b-ysr2p5wljv] {
        margin-left: 0;
        box-shadow: none;
        min-height: auto;
        padding: 88px 34px 46px;
        background: rgba(255, 255, 255, 0.94);
    }

    .login-content-header[b-ysr2p5wljv] {
        justify-content: space-between;
    }

    .login-mobile-brand[b-ysr2p5wljv] {
        display: flex;
    }

    .login-footer[b-ysr2p5wljv] {
        color: white;
    }

        .login-footer a[b-ysr2p5wljv] {
            color: white;
        }
}

@media (max-width: 600px) {
    .login-page[b-ysr2p5wljv] {
        justify-content: flex-start;
        padding: 18px;
        background-position: center bottom;
    }

    .login-shell[b-ysr2p5wljv] {
        width: 100%;
        min-height: auto;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    .login-content[b-ysr2p5wljv] {
        min-height: auto;
        align-items: flex-start;
        border-radius: 15px;
        background: rgba(255, 255, 255, 0.94);
        box-shadow: 0 10px 36px rgba(20, 38, 76, 0.16);
        padding: 84px 22px 34px;
    }

    .login-content-header[b-ysr2p5wljv] {
        top: 24px;
        right: 22px;
        left: 22px;
    }

    .login-mobile-brand img[b-ysr2p5wljv] {
        height: 38px;
        max-width: 150px;
    }

    .login-language[b-ysr2p5wljv] {
        height: 40px;
    }

    .login-footer[b-ysr2p5wljv] {
        display: none;
    }
}
/* _content/eLipsOnline/Components/SmallComponents/MultiReportSelectDialog.razor.rz.scp.css */
.mrs-title[b-qx4bv2zea5] {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
    padding: 5px 0;
}

.mrs-title-icon[b-qx4bv2zea5] {
    width: 45px;
    height: 45px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 5px;
    background: var(--color-primary-50);
    color: var(--color-primary-700);
}

    .mrs-title-icon[b-qx4bv2zea5]  .k-svg-icon {
        width: 22px !important;
        height: 22px !important;
    }

.mrs-title-main[b-qx4bv2zea5] {
    color: var(--color-secondary-700);
    font-size: var(--fs-h4);
    margin-bottom: 5px;
}

.mrs-title-sub[b-qx4bv2zea5] {
    margin-top: 0;
    color: var(--color-gray-500);
    font-size: var(--fs-body-2);
    font-weight: 400;
    line-height: 1.25;
}

.mrs-content[b-qx4bv2zea5] {
    padding: 25px;
}

.mrs-intro[b-qx4bv2zea5] {
    margin: 0 0 25px;
    color: var(--color-gray-500);
    font-size: var(--fs-body-2);
}

.mrs-report-list[b-qx4bv2zea5] {
    display: grid;
    gap: 15px;
}

.mrs-report-card[b-qx4bv2zea5] {
    display: flex;
    align-items: center;
    gap: 15px;
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    background: #fff;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

    .mrs-report-card:hover[b-qx4bv2zea5] {
        border-color: var(--color-primary-700);
        background: var(--color-primary-50);
    }

    .mrs-report-card.is-selected[b-qx4bv2zea5] {
        border-color: var(--color-primary-700);
        background: var(--color-primary-50);
    }

.mrs-report-copy[b-qx4bv2zea5] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

    .mrs-report-copy strong[b-qx4bv2zea5] {
        overflow: hidden;
        color: var(--color-secondary-700);
        font-size: var(--fs-body-2);
        font-weight: 600;
        line-height: 1.25;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .mrs-report-copy span[b-qx4bv2zea5] {
        overflow: hidden;
        color: var(--color-gray-500);
        font-size: var(--fs-body-3);
        line-height: 1.25;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.mrs-selection-count[b-qx4bv2zea5] {
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
    margin-left: 10px;
}

.mrs-empty-state[b-qx4bv2zea5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 220px;
    padding: 30px;
    border: 1px dashed var(--color-gray-200);
    border-radius: 5px;
    background: var(--color-gray-50);
    color: var(--color-gray-500);
    text-align: center;
}

    .mrs-empty-state[b-qx4bv2zea5]  .k-svg-icon {
        width: 32px;
        height: 32px;
        color: var(--color-primary-700);
    }

    .mrs-empty-state h5[b-qx4bv2zea5] {
        margin: 0;
        color: var(--color-secondary-700);
        font-size: var(--fs-body-1);
        font-weight: 600;
    }

    .mrs-empty-state p[b-qx4bv2zea5] {
        margin: 0;
        font-size: var(--fs-body-3);
    }

@media (max-width: 760px) {
    .multi-report-select-window[b-qx4bv2zea5]  .k-window {
        width: calc(100vw - 24px) !important;
    }

    .multi-report-select-window[b-qx4bv2zea5]  .k-window-titlebar {
        min-height: 96px;
        padding: 20px;
    }

    .mrs-title[b-qx4bv2zea5] {
        gap: 14px;
    }

    .mrs-title-icon[b-qx4bv2zea5] {
        width: 48px;
        height: 48px;
    }

    .mrs-title-main[b-qx4bv2zea5] {
        font-size: 20px;
    }

    .mrs-title-sub[b-qx4bv2zea5] {
        font-size: 15px;
    }

    .mrs-content[b-qx4bv2zea5] {
        padding: 20px;
    }

    .multi-report-select-window[b-qx4bv2zea5]  .bottom-actionbar,
    .multi-report-select-window[b-qx4bv2zea5]  .bottom-actionbar__right {
        flex-direction: column;
        align-items: stretch;
    }

    .multi-report-select-window[b-qx4bv2zea5]  .btn {
        width: 100%;
    }
}
/* _content/eLipsOnline/Components/SmallComponents/Planning/PlanningNav.razor.rz.scp.css */
/* Collapsed NAV */

.pv-nav[b-334o5u79qn], .pv-nav-expanded[b-334o5u79qn] {
    width: 100%;
    background-color: white;
    overflow-y: hidden;
    overflow-x: hidden;
}

.pv-nav-toolbar[b-334o5u79qn] {
    padding: 5px 5px 6px 5px;
    gap: 12px;
    border-bottom: 1px solid var(--color-gray-200);
}

.pv-nav-toolbar-expanded[b-334o5u79qn] {
    padding: 8px 10px 10px 15px;
    gap: 30px;
}

.pv-nav-group[b-334o5u79qn] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 0 0 auto;
}

.pv-nav-label[b-334o5u79qn] {
    font-size: var(--fs-caption);
    color: #8f8f8f;
    line-height: 1;
    padding-left: 0px;
    white-space: nowrap;
}

.pv-nav-group-body[b-334o5u79qn] {
    min-height: 32px;
    gap: 4px;
}

.profile-dd[b-334o5u79qn] {
    padding: 16px;
}

.filter-badge[b-334o5u79qn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 6px;
    border-radius: 50px;
    background-color: var(--color-gray-100);
    color: var(--color-gray-600);
    font-size: 12px;
    font-weight: 600;
}




/* =========================
   Planning Navigation Expanded
   ========================= */
.pv-layout[b-334o5u79qn] {
    display: grid;
    grid-template-columns: minmax(420px, 1fr) minmax(420px, 1fr);
    gap: 0;
    width: 100%;
    padding-bottom: 13px;
    border-bottom: 1px solid var(--color-gray-200);
}

.pv-block[b-334o5u79qn] {
    min-width: 0;
    padding: 7px 12px 0 12px;
    background: #fff;
}

.pv-block-grid--top[b-334o5u79qn] {
    display: grid;
    grid-template-columns: minmax(220px, 1.1fr) minmax(220px, 1.4fr) auto;
    gap: 12px;
    align-items: end;
}

.pv-item-date .pv-nav-group-body[b-334o5u79qn] {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 8px;
    align-items: center;
}

.pv-filter-grid[b-334o5u79qn] {
    display: grid;
    grid-template-columns: repeat(4, minmax(120px, 1fr));
    gap: 12px;
    align-items: end;
}

.pv-nav-group[b-334o5u79qn] {
    min-width: 0;
}

.pv-nav-label[b-334o5u79qn] {
    margin-bottom: 2px;
    white-space: nowrap;
}

.pv-nav-group-body[b-334o5u79qn] {
    width: 100%;
}

.pv-nav-group .k-input[b-334o5u79qn],
.pv-nav-group .k-picker[b-334o5u79qn],
.pv-nav-group .k-combobox[b-334o5u79qn],
.pv-nav-group .k-textbox[b-334o5u79qn],
.pv-nav-group .k-dateinput[b-334o5u79qn],
.pv-nav-group .k-datepicker[b-334o5u79qn] {
    width: 100%;
}

.pv-button-row-with-action[b-334o5u79qn] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
}

    .pv-button-row-with-action .pv-button-row--stretch[b-334o5u79qn] {
        flex: 1 1 auto;
        min-width: 0;
    }

.pv-button-row--stretch[b-334o5u79qn] {
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    width: 100%;
    min-width: 0;
}

    .pv-button-row--stretch .k-button[b-334o5u79qn],
    .pv-button-row--stretch .pv-stretch-btn[b-334o5u79qn] {
        flex: 1 1 0;
        min-width: 0;
        width: auto;
        justify-content: center;
    }

    .pv-button-row--stretch .k-button-text[b-334o5u79qn] {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.pv-icon-btn[b-334o5u79qn] {
    flex: 0 0 auto;
    width: auto;
    padding: 6px 8px;
}

@media (max-width: 1500px) {
    .pv-filter-grid[b-334o5u79qn] {
        grid-template-columns: repeat(2, minmax(140px, 1fr));
    }
}

@media (max-width: 1200px) {
    .pv-layout[b-334o5u79qn] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .pv-block-grid--top[b-334o5u79qn],
    .pv-filter-grid[b-334o5u79qn] {
        grid-template-columns: 1fr;
    }
}

.pv-nav-shell[b-334o5u79qn],
.pv-layout-shell[b-334o5u79qn] {
    overflow: hidden;
    will-change: height, opacity;
    transition: height 320ms cubic-bezier(0.22, 1, 0.36, 1), opacity 220ms ease, transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.pv-nav-shell[b-334o5u79qn],
.pv-layout-shell[b-334o5u79qn] {
    opacity: 1;
}

.is-hidden[b-334o5u79qn] {
    display: none;
    height: 0 !important;
    opacity: 0;
    transform: translateY(-8px);
    pointer-events: none;
}

.is-visible[b-334o5u79qn] {
    display: block;
    height: auto;
    opacity: 1;
    transform: translateY(0);
}

.btn-icon svg[b-334o5u79qn] {
    transition: transform 240ms ease;
}

.is-rotated[b-334o5u79qn] {
    transform: rotate(180deg);
}


.page-layout[b-334o5u79qn] {
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.page-header[b-334o5u79qn] {
    flex: 0 0 auto;
}

.page-body[b-334o5u79qn] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.divider[b-334o5u79qn] {
    margin: 0 5px;
}
/* _content/eLipsOnline/Components/SmallComponents/ReportDialog.razor.rz.scp.css */
.report-viewer-window[b-z38zsn9rtp],
.report-viewer-window[b-z38zsn9rtp]  .k-window {
    display: flex;
    flex-direction: column;
}

.report-viewer-window .k-window-content[b-z38zsn9rtp],
.report-viewer-window[b-z38zsn9rtp]  .k-window-content {
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    padding: 0 !important;
    overflow: hidden !important;
    background: #fff;
    box-sizing: border-box;
}

.report-viewer-window .k-window-content:first-child[b-z38zsn9rtp],
.report-viewer-window .k-window-content:last-child[b-z38zsn9rtp],
.report-viewer-window[b-z38zsn9rtp]  .k-window-content:first-child,
.report-viewer-window[b-z38zsn9rtp]  .k-window-content:last-child {
    padding-block: 0 !important;
    padding: 0;
    padding-inline: 0 !important;
}

.report-viewer-window .k-window-titlebar[b-z38zsn9rtp],
.report-viewer-window[b-z38zsn9rtp]  .k-window-titlebar {
    border-bottom: 1px solid var(--color-gray-200);
    background: #fff;
}

.rv-title[b-z38zsn9rtp] {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
    padding: 5px 0;
}

.rv-title-icon[b-z38zsn9rtp] {
    width: 45px;
    height: 45px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 5px;
    background: var(--color-primary-50);
    color: var(--color-primary-700);
}

    .rv-title-icon[b-z38zsn9rtp]  .k-svg-icon {
        width: 25px !important;
        height: 25px !important;
    }

.rv-title-main[b-z38zsn9rtp] {
    color: var(--color-secondary-700);
    font-size: var(--fs-h4);
    margin-bottom: 5px;
}

.rv-title-sub[b-z38zsn9rtp] {
    margin-top: 0px;
    color: var(--color-gray-500);
    font-size: var(--fs-body-2);
    font-weight: 400;
    line-height: 1.25;
}

.rv-content[b-z38zsn9rtp] {
    position: relative;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 0;
    margin: 0;
    overflow: hidden;
    background: #fff;
}

.rv-content[b-z38zsn9rtp]  .k-pdf-viewer,
[b-z38zsn9rtp] .report-viewer-window .k-pdf-viewer {
    height: 100%;
    min-height: 0;
    border: 0;
    margin: 0;
    background: #fff;
    border: none;
}

.rv-content[b-z38zsn9rtp]  .k-pdf-viewer .k-pdf-viewer-pages,
[b-z38zsn9rtp] .report-viewer-window .k-pdf-viewer .k-pdf-viewer-pages {
    margin: 0;
}

.rv-loading[b-z38zsn9rtp] {
    min-height: 360px;
    height: 100%;
    display: flex;
    flex-direction: column;
    background: #fff;
    margin-top: -20px;
}

.rv-progress[b-z38zsn9rtp] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 28px;
    width: min(460px, 88%);
    margin-top: 4px;
}

.rv-progress-track[b-z38zsn9rtp] {
    width: 100%;
    height: 6px;
    overflow: hidden;
    border-radius: 999px;
    background: #eaf1ff;
}

.rv-progress-bar[b-z38zsn9rtp] {
    height: 100%;
    border-radius: 999px;
    transition: width .18s ease;
}

.rv-progress-value[b-z38zsn9rtp] {
    flex: 0 0 auto;
    color: #3b82f6;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
}

.rv-progress-blue[b-z38zsn9rtp] {
    background: #1d5bd8;
}

.rv-progress-orange[b-z38zsn9rtp] {
    background: #f59e0b;
}

.rv-progress-green[b-z38zsn9rtp] {
    background: #16a34a;
}

.rv-loading-body[b-z38zsn9rtp],
.rv-download[b-z38zsn9rtp],
.rv-error[b-z38zsn9rtp] {
    flex: 1;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px;
}

.rv-loading-body[b-z38zsn9rtp] {
    flex-direction: column;
    gap: 18px;
    color: #475569;
    padding-top: 18px;
}

.rv-loading-copy[b-z38zsn9rtp] {
    display: grid;
    gap: 8px;
    text-align: center;
}

.rv-loading-copy h3[b-z38zsn9rtp] {
    margin: 0;
    color: var(--color-secondary-700);
    font-weight: 600;
    line-height: 1.2;
}

.rv-loading-copy p[b-z38zsn9rtp] {
    margin: 0;
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
    font-weight: 400;
    line-height: 1.45;
}

.rv-loading-art[b-z38zsn9rtp] {
    width: 200px;
    height: 200px;
    display: grid;
    place-items: center;
    margin-bottom: 10px;
}

.rv-loading-image[b-z38zsn9rtp] {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.rv-loading-note[b-z38zsn9rtp] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: auto;
    margin-top: 22px;
    padding: 14px 18px;
    border-radius: 5px;
    background: var(--color-primary-50);
    color: var(--color-primary-700);
    font-size: var(--fs-body-3);
    font-weight: 400;
    line-height: 1.35;
}

.rv-loading-note .material-symbols-rounded[b-z38zsn9rtp] {
    color: #2f7df4;
    font-size: 20px;
}

.rv-download[b-z38zsn9rtp] {
    gap: 18px;
    background: #fff;
}

.rv-download-text[b-z38zsn9rtp] {
    display: grid;
    gap: 4px;
    min-width: 0;
    color: #475569;
}

.rv-download-text strong[b-z38zsn9rtp] {
    color: #132238;
    font-size: 18px;
}

.rv-download-text span[b-z38zsn9rtp] {
    font-size: 14px;
}

.rv-download[b-z38zsn9rtp]  .btn {
    min-height: 44px;
    gap: 8px;
    border-radius: 6px;
    font-weight: 700;
}

.rv-error[b-z38zsn9rtp] {
    gap: 12px;
    color: #b42318;
    background: #fff;
    font-size: 16px;
    font-weight: 700;
}

.rv-error .material-symbols-rounded[b-z38zsn9rtp] {
    font-size: 28px;
}

.rv-hr[b-z38zsn9rtp] {
    border-bottom: 1px solid var(--color-gray-200);
    width: 30vw;
}

@media (max-width: 820px) {
    .report-viewer-window[b-z38zsn9rtp],
    .report-viewer-window[b-z38zsn9rtp]  .k-window {
        width: calc(100vw - 24px) !important;
        height: calc(100vh - 24px) !important;
        min-width: 0 !important;
    }

    [b-z38zsn9rtp] .report-viewer-window .k-window-titlebar,
    .report-viewer-window[b-z38zsn9rtp]  .k-window-titlebar {
        padding: 14px 18px;
    }

    .rv-download[b-z38zsn9rtp] {
        flex-direction: column;
        text-align: center;
    }

    .rv-loading-art[b-z38zsn9rtp] {
        width: 130px;
        height: 130px;
    }

    .rv-loading-copy h3[b-z38zsn9rtp] {
        font-size: 21px;
    }
}
/* _content/eLipsOnline/Components/SmallComponents/ReportEmailDialog.razor.rz.scp.css */
.report-email-window[b-4czdj6g0sr],
.report-email-window[b-4czdj6g0sr]  .k-window {
    display: flex;
    flex-direction: column;
    max-width: calc(100dvw - 24px);
    max-height: calc(100dvh - 24px);
}

.report-email-window .k-window-content[b-4czdj6g0sr],
.report-email-window[b-4czdj6g0sr]  .k-window-content {
    flex: 1 1 auto;
    min-height: 0;
    padding: 0 !important;
    overflow: hidden !important;
    background: var(--color-gray-50);
}

.report-email-window .k-window-content:first-child[b-4czdj6g0sr],
.report-email-window .k-window-content:last-child[b-4czdj6g0sr],
.report-email-window[b-4czdj6g0sr]  .k-window-content:first-child,
.report-email-window[b-4czdj6g0sr]  .k-window-content:last-child {
    padding: 0 !important;
    padding-block: 0 !important;
    padding-inline: 0 !important;
}

.rem-window-title[b-4czdj6g0sr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    width: 100%;
    min-width: 0;
}

.rem-title-send-button[b-4czdj6g0sr] {
    flex: 0 0 auto;
    min-height: 38px;
    height: 38px;
    padding: 0 14px;
    margin-right: 10px;
    line-height: 1;
}

.rem-title[b-4czdj6g0sr] {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0;
    padding: 5px 0;
}

.rem-title-icon[b-4czdj6g0sr] {
    width: 45px;
    height: 45px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 5px;
    background: var(--color-primary-50);
    color: var(--color-primary-700);
}

.rem-title-icon[b-4czdj6g0sr]  .k-svg-icon {
    width: 22px !important;
    height: 22px !important;
}

.rem-title-main[b-4czdj6g0sr] {
    margin: 0 0 5px;
    color: var(--color-secondary-700);
    font-size: var(--fs-h4);
}

.rem-title-sub[b-4czdj6g0sr] {
    margin: 0;
    color: var(--color-gray-500);
    font-size: var(--fs-body-2);
    font-weight: 400;
    line-height: 1.25;
}

.rem-shell[b-4czdj6g0sr] {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    overflow: hidden;
    background: var(--color-gray-50);
}

.rem-compose-actions[b-4czdj6g0sr] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-width: 0;
    padding: 15px 18px 0px;
}

.rem-compose-title[b-4czdj6g0sr] {
    margin: 0;
    color: var(--color-secondary-700);
    font-size: var(--fs-h5);
    font-weight: 600;
}

.rem-compose-subtitle[b-4czdj6g0sr] {
    margin-top: 4px;
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
}

.rem-workspace[b-4czdj6g0sr] {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(280px, .8fr) minmax(360px, .95fr) minmax(420px, 1.05fr);
    grid-template-areas: "sidebar message preview";
    gap: 12px;
    padding: 14px;
    overflow: hidden;
}

.rem-sidebar[b-4czdj6g0sr] {
    grid-area: sidebar;
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, auto) minmax(320px, 1fr);
    gap: 12px;
    overflow: hidden;
}

.rem-panel[b-4czdj6g0sr],
.rem-message-panel[b-4czdj6g0sr],
.rem-preview-card[b-4czdj6g0sr] {
    min-width: 0;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
}

.rem-address-panel[b-4czdj6g0sr] {
    max-height: 255px;
    min-height: 0;
    padding: 16px 0 16px 16px;
    overflow: auto;
    scrollbar-gutter: stable;
}

/*.rem-section-title {
    margin-bottom: 14px;
}*/

.rem-section-title .attachment-title[b-4czdj6g0sr] {
    margin: 0;
}

.rem-field-grid[b-4czdj6g0sr] {
    display: grid;
    grid-template-columns: 84px minmax(0, 1fr);
    align-items: center;
    gap: 10px 12px;
}

.rem-field-grid label[b-4czdj6g0sr],
.rem-field label[b-4czdj6g0sr] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 600;
}

.rem-field-grid[b-4czdj6g0sr]  .k-input,
.rem-field-grid[b-4czdj6g0sr]  .k-picker,
.rem-field-grid[b-4czdj6g0sr]  .k-multiselect,
.rem-field[b-4czdj6g0sr]  .k-input,
.rem-field[b-4czdj6g0sr]  .k-picker {
    min-width: 0;
    border-color: var(--color-gray-200);
    border-radius: 5px;
}

.rem-attachments-panel[b-4czdj6g0sr] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 16px;
    overflow: hidden;
}

.rem-attachments-header[b-4czdj6g0sr] {
    display: grid;
    gap: 12px;
    flex: 0 0 auto;
}

.rem-file-select[b-4czdj6g0sr]  .k-upload {
    border: 0;
    background: transparent;
}

.rem-file-select[b-4czdj6g0sr]  .k-dropzone {
    min-height: 46px;
    display: flex;
    align-items: center;
    border: 1px dashed var(--color-gray-200);
    border-radius: 5px;
    background: var(--color-gray-50);
    padding: 10px;
}

.rem-file-select[b-4czdj6g0sr]  .k-upload-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.rem-file-select[b-4czdj6g0sr]  .k-upload-files,
.rem-file-select[b-4czdj6g0sr]  .k-upload-status {
    display: none;
}

.rem-attachments-list[b-4czdj6g0sr] {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    overflow: auto;
    display: grid;
    align-content: start;
    gap: 24px;
    margin-top: 5px;
    padding-right: 4px;
}

.rem-attachment-section[b-4czdj6g0sr] {
    display: grid;
    gap: 12px;
}

.rem-attachment-section-title[b-4czdj6g0sr] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.rem-attachment-section-title h6[b-4czdj6g0sr] {
    margin: 0;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-2);
    font-weight: 650;
}

.rem-attachment-section-title span[b-4czdj6g0sr] {
    min-width: 23px;
    height: 23px;
    display: inline-grid;
    place-items: center;
    border-radius: 50%;
    color: var(--color-primary-700);
    background: var(--color-primary-50);
    font-size: 13px;
    font-weight: 700;
}

.rem-attachment-cards[b-4czdj6g0sr] {
    display: grid;
    gap: 10px;
}

.rem-attachment-card[b-4czdj6g0sr] {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 44px;
    padding: 10px 12px;
    border: 1px solid var(--color-gray-200);
    border-radius: 5px;
    background: #fff;
}

.rem-attachment-file-icon[b-4czdj6g0sr] {
    width: 34px;
    height: 34px;
    object-fit: contain;
}

.rem-attachment-card-copy[b-4czdj6g0sr] {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.rem-attachment-card-copy strong[b-4czdj6g0sr],
.rem-attachment-card-copy span[b-4czdj6g0sr] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rem-attachment-card-copy strong[b-4czdj6g0sr] {
    color: var(--color-secondary-700);
    font-size: var(--fs-caption);
    font-weight: 650;
}

.rem-attachment-card-copy span[b-4czdj6g0sr] {
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
    font-weight: 500;
}

.rem-delete-button[b-4czdj6g0sr] {
    min-width: 36px;
    width: 36px;
    height: 36px;
    padding: 0;
}

.rem-attachments-empty[b-4czdj6g0sr] {
    padding: 16px;
    border: 1px dashed var(--color-gray-200);
    border-radius: 5px;
    color: var(--color-gray-500);
    background: var(--color-gray-50);
    font-size: var(--fs-body-3);
    text-align: center;
}

.rem-message-panel[b-4czdj6g0sr] {
    grid-area: message;
    min-height: 0;
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    gap: 12px;
    padding: 16px;
    overflow: hidden;
}

.rem-field[b-4czdj6g0sr] {
    min-width: 0;
    display: grid;
    gap: 7px;
}

.rem-body-field[b-4czdj6g0sr] {
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.rem-body-field[b-4czdj6g0sr]  .k-editor {
    flex: 1 1 auto;
    min-height: 0;
    height: auto !important;
}

.rem-body-field[b-4czdj6g0sr]  .k-editor-toolbar,
.rem-body-field[b-4czdj6g0sr]  .k-toolbar {
    min-width: 0;
    flex-wrap: wrap;
}

.rem-body-field[b-4czdj6g0sr]  .k-editor .k-editor-content,
.rem-body-field[b-4czdj6g0sr]  .k-editor .k-iframe {
    min-height: 0;
}

.rem-preview-card[b-4czdj6g0sr] {
    grid-area: preview;
    min-height: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.rem-report-tabstrip[b-4czdj6g0sr] {
    min-width: 0;
    min-height: 0;
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    height: 100%;
    max-height: 100%;
    overflow: hidden;
}

.rem-preview-frame-wrap[b-4czdj6g0sr] {
    flex: 1 1 0;
    min-height: 0;
    min-width: 0;
    height: 100%;
    display: flex;
    overflow: hidden;
    background: #27313d;
}

.rem-preview-frame-wrap[b-4czdj6g0sr]  .k-pdf-viewer {
    height: 100%;
}

.rem-loading[b-4czdj6g0sr],
.rem-empty-state[b-4czdj6g0sr] {
    min-height: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 32px;
    text-align: center;
}

.rem-loading-art[b-4czdj6g0sr],
.rem-empty-image[b-4czdj6g0sr] {
    width: 150px;
    height: 150px;
    object-fit: contain;
}

.rem-loading-image[b-4czdj6g0sr] {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.rem-loading-copy h4[b-4czdj6g0sr],
.rem-empty-state h4[b-4czdj6g0sr] {
    margin: 0;
    color: var(--color-secondary-700);
    font-weight: 700;
}

.rem-loading-copy p[b-4czdj6g0sr],
.rem-empty-state p[b-4czdj6g0sr] {
    margin: 0;
    color: var(--color-gray-500);
    font-size: var(--fs-body-3);
}

.rem-progress[b-4czdj6g0sr] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    width: min(420px, 88%);
}

.rem-progress-track[b-4czdj6g0sr] {
    width: 100%;
    height: 6px;
    overflow: hidden;
    border-radius: 999px;
    background: #eaf1ff;
}

.rem-progress-bar[b-4czdj6g0sr] {
    height: 100%;
    border-radius: 999px;
    transition: width .18s ease;
}

.rem-progress-blue[b-4czdj6g0sr] {
    background: #1d5bd8;
}

.rem-progress-orange[b-4czdj6g0sr] {
    background: #f59e0b;
}

.rem-progress-green[b-4czdj6g0sr] {
    background: #16a34a;
}

@media (max-width: 1300px) {
    .report-email-window[b-4czdj6g0sr],
    .report-email-window[b-4czdj6g0sr]  .k-window {
        width: calc(100dvw - 24px) !important;
        height: calc(100dvh - 24px) !important;
        min-width: 0 !important;
    }

    .report-email-window .k-window-content[b-4czdj6g0sr],
    .report-email-window[b-4czdj6g0sr]  .k-window-content {
        overflow: auto !important;
    }

    .rem-shell[b-4czdj6g0sr] {
        height: auto;
        min-height: 100%;
        overflow: visible;
    }

    .rem-workspace[b-4czdj6g0sr] {
        height: auto;
        min-height: 100%;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
        padding: 12px;
        overflow: visible;
    }

    .rem-workspace > *[b-4czdj6g0sr] {
        width: 100%;
        flex: 0 0 auto;
    }

    .rem-sidebar[b-4czdj6g0sr] {
        order: 1;
        width: 100%;
        grid-template-rows: auto minmax(260px, auto);
        overflow: visible;
    }

    .rem-address-panel[b-4czdj6g0sr] {
        max-height: none;
        padding-right: 16px;
    }

    .rem-attachments-panel[b-4czdj6g0sr],
    .rem-attachments-list[b-4czdj6g0sr] {
        overflow: visible;
    }

    .rem-message-panel[b-4czdj6g0sr] {
        order: 2;
        width: 100%;
        min-height: clamp(460px, 62dvh, 620px);
    }

    .rem-preview-card[b-4czdj6g0sr] {
        order: 3;
        width: 100%;
        height: clamp(420px, 58dvh, 720px);
    }
}

@media (max-width: 1180px) {
    .rem-message-panel[b-4czdj6g0sr] {
        min-height: clamp(440px, 62dvh, 600px);
    }

    .rem-preview-card[b-4czdj6g0sr] {
        height: clamp(410px, 60dvh, 680px);
    }
}

@media (max-width: 820px) {
    .report-email-window[b-4czdj6g0sr],
    .report-email-window[b-4czdj6g0sr]  .k-window {
        width: calc(100dvw - 16px) !important;
        height: calc(100dvh - 16px) !important;
        max-width: calc(100dvw - 16px);
        max-height: calc(100dvh - 16px);
    }

    .report-email-window[b-4czdj6g0sr]  .k-window-titlebar {
        padding: 10px 12px;
    }

    .rem-window-title[b-4czdj6g0sr] {
        gap: 10px;
    }

    .rem-title[b-4czdj6g0sr] {
        gap: 10px;
    }

    .rem-title-icon[b-4czdj6g0sr] {
        width: 38px;
        height: 38px;
    }

    .rem-title-main[b-4czdj6g0sr] {
        font-size: 19px;
    }

    .rem-title-sub[b-4czdj6g0sr] {
        font-size: 13px;
    }

    .rem-title-send-button[b-4czdj6g0sr] {
        height: 36px;
        min-height: 36px;
        padding-inline: 12px;
        margin-right: 4px;
    }

    .rem-compose-actions[b-4czdj6g0sr] {
        align-items: stretch;
        flex-direction: column;
        padding: 14px 18px;
    }

    .rem-compose-actions[b-4czdj6g0sr]  .btn {
        width: 100%;
    }

    .rem-workspace[b-4czdj6g0sr] {
        grid-template-columns: minmax(0, 1fr);
        padding: 12px;
    }

    .rem-sidebar[b-4czdj6g0sr] {
        order: 1;
        overflow: visible;
    }

    .rem-message-panel[b-4czdj6g0sr] {
        order: 2;
        min-height: clamp(420px, 64dvh, 580px);
    }

    .rem-attachments-panel[b-4czdj6g0sr],
    .rem-attachments-list[b-4czdj6g0sr] {
        overflow: visible;
    }

    .rem-preview-card[b-4czdj6g0sr] {
        order: 3;
        height: clamp(420px, 68dvh, 620px);
    }
}

@media (max-width: 560px) {
    .report-email-window[b-4czdj6g0sr],
    .report-email-window[b-4czdj6g0sr]  .k-window {
        width: 100vw !important;
        height: 100dvh !important;
        max-width: 100vw;
        max-height: 100dvh !important;
        border-radius: 0;
    }

    .report-email-window[b-4czdj6g0sr]  .k-window-titlebar {
        padding: 8px 10px;
    }

    .report-email-window[b-4czdj6g0sr]  .k-window-actions > .k-button:first-child {
        display: none;
    }

    .rem-window-title[b-4czdj6g0sr] {
        gap: 8px;
    }

    .rem-title[b-4czdj6g0sr] {
        gap: 8px;
    }

    .rem-title-icon[b-4czdj6g0sr] {
        width: 34px;
        height: 34px;
    }

    .rem-title-icon[b-4czdj6g0sr]  .k-svg-icon {
        width: 18px !important;
        height: 18px !important;
    }

    .rem-title-main[b-4czdj6g0sr] {
        margin-bottom: 0;
        font-size: 17px;
    }

    .rem-title-sub[b-4czdj6g0sr] {
        display: none;
    }

    .rem-title-send-button[b-4czdj6g0sr] {
        min-width: 42px;
        height: 34px;
        min-height: 34px;
        padding-inline: 10px;
        font-size: 13px;
    }

    .rem-workspace[b-4czdj6g0sr] {
        gap: 10px;
        padding: 10px;
    }

    .rem-panel[b-4czdj6g0sr],
    .rem-message-panel[b-4czdj6g0sr],
    .rem-preview-card[b-4czdj6g0sr] {
        border-radius: 4px;
    }

    .rem-address-panel[b-4czdj6g0sr],
    .rem-attachments-panel[b-4czdj6g0sr],
    .rem-message-panel[b-4czdj6g0sr] {
        padding: 12px;
    }

    .rem-field-grid[b-4czdj6g0sr] {
        grid-template-columns: minmax(0, 1fr);
        gap: 7px;
    }

    .rem-message-panel[b-4czdj6g0sr] {
        min-height: clamp(390px, 62dvh, 520px);
    }

    .rem-preview-card[b-4czdj6g0sr] {
        height: clamp(380px, 72dvh, 560px);
    }

    .rem-loading[b-4czdj6g0sr],
    .rem-empty-state[b-4czdj6g0sr] {
        padding: 20px;
    }

    .rem-loading-art[b-4czdj6g0sr],
    .rem-empty-image[b-4czdj6g0sr] {
        width: 120px;
        height: 120px;
    }

    .rem-progress[b-4czdj6g0sr] {
        width: 100%;
        gap: 14px;
    }

    .rem-attachment-card[b-4czdj6g0sr] {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .rem-delete-button[b-4czdj6g0sr] {
        grid-column: 1 / -1;
        justify-self: end;
    }
}
/* _content/eLipsOnline/Components/SmallComponents/ReportExporteerDialog.razor.rz.scp.css */
.report-export-window[b-yjbr8ygpta],
.report-export-window[b-yjbr8ygpta]  .k-window {
    display: flex;
    flex-direction: column;
}

.report-export-window .k-window-content[b-yjbr8ygpta],
.report-export-window[b-yjbr8ygpta]  .k-window-content {
    min-height: 0;
    padding: 0 !important;
    overflow: hidden !important;
    background: #fff;
    box-sizing: border-box;
}

.report-export-window .k-window-content:first-child[b-yjbr8ygpta],
.report-export-window .k-window-content:last-child[b-yjbr8ygpta],
.report-export-window[b-yjbr8ygpta]  .k-window-content:first-child,
.report-export-window[b-yjbr8ygpta]  .k-window-content:last-child {
    padding-block: 0 !important;
    padding-inline: 0 !important;
}

.report-export-window .k-window-titlebar[b-yjbr8ygpta],
.report-export-window[b-yjbr8ygpta]  .k-window-titlebar {
    border-bottom: 1px solid var(--color-gray-200);
    background: #fff;
}

.rxd-title[b-yjbr8ygpta] {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
    padding: 5px 0;
}

.rxd-title-icon[b-yjbr8ygpta] {
    width: 45px;
    height: 45px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 5px;
    background: var(--color-primary-50);
    color: var(--color-primary-700);
}

    .rxd-title-icon[b-yjbr8ygpta]  .k-svg-icon {
        width: 25px !important;
        height: 25px !important;
    }

.rxd-title-main[b-yjbr8ygpta] {
    color: var(--color-secondary-700);
    font-size: var(--fs-h4);
    margin-bottom: 5px;
}

.rxd-title-sub[b-yjbr8ygpta] {
    margin-top: 0;
    color: var(--color-gray-500);
    font-size: var(--fs-body-2);
    font-weight: 400;
    line-height: 1.25;
}

.rxd-content[b-yjbr8ygpta] {
    min-height: 440px;
    display: flex;
    flex-direction: column;
    padding: 0;
    margin: 0;
    overflow: hidden;
    background: #fff;
}

.rxd-state[b-yjbr8ygpta] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 34px;
    color: var(--color-gray-500);
    text-align: center;
}

.rxd-loading-art[b-yjbr8ygpta] {
    width: 170px;
    height: 170px;
    display: grid;
    place-items: center;
    margin-bottom: 4px;
}

.rxd-loading-image[b-yjbr8ygpta] {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.rxd-copy[b-yjbr8ygpta] {
    display: grid;
    gap: 8px;
    max-width: 460px;
}

    .rxd-copy h3[b-yjbr8ygpta] {
        margin: 0;
        color: var(--color-secondary-700);
        font-weight: 600;
        line-height: 1.2;
    }

    .rxd-copy p[b-yjbr8ygpta] {
        margin: 0;
        color: var(--color-gray-500);
        font-size: var(--fs-body-3);
        font-weight: 400;
        line-height: 1.45;
    }

.rxd-progress[b-yjbr8ygpta] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 28px;
    width: min(420px, 88%);
    margin-top: 4px;
}

.rxd-progress-track[b-yjbr8ygpta] {
    width: 100%;
    height: 6px;
    overflow: hidden;
    border-radius: 999px;
    background: #eaf1ff;
}

.rxd-progress-bar[b-yjbr8ygpta] {
    height: 100%;
    border-radius: 999px;
    transition: width .18s ease;
}

.rxd-progress-value[b-yjbr8ygpta] {
    flex: 0 0 auto;
    color: #3b82f6;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
}

.rxd-progress-blue[b-yjbr8ygpta] {
    background: #1d5bd8;
}

.rxd-progress-orange[b-yjbr8ygpta] {
    background: #f59e0b;
}

.rxd-progress-green[b-yjbr8ygpta] {
    background: #16a34a;
}

.rxd-note[b-yjbr8ygpta] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: min(520px, 100%);
    margin-top: 12px;
    padding: 14px 18px;
    border-radius: 5px;
    background: var(--color-primary-50);
    color: var(--color-primary-700);
    font-size: var(--fs-body-3);
    font-weight: 400;
    line-height: 1.35;
    text-align: left;
}

    .rxd-note[b-yjbr8ygpta]  .k-svg-icon {
        flex: 0 0 auto;
        color: var(--color-primary-700);
    }

@media (max-width: 760px) {
    .report-export-window[b-yjbr8ygpta],
    .report-export-window[b-yjbr8ygpta]  .k-window {
        width: calc(100vw - 24px) !important;
        min-width: 0 !important;
    }

    .report-export-window[b-yjbr8ygpta]  .k-window-titlebar {
        padding: 14px 18px;
    }

    .rxd-title[b-yjbr8ygpta] {
        gap: 14px;
    }

    .rxd-title-icon[b-yjbr8ygpta] {
        width: 48px;
        height: 48px;
    }

    .rxd-title-main[b-yjbr8ygpta] {
        font-size: 20px;
    }

    .rxd-title-sub[b-yjbr8ygpta] {
        font-size: 15px;
    }

    .rxd-content[b-yjbr8ygpta] {
        min-height: 420px;
    }

    .rxd-state[b-yjbr8ygpta] {
        padding: 26px 20px;
    }

    .rxd-loading-art[b-yjbr8ygpta] {
        width: 130px;
        height: 130px;
    }

    .rxd-progress[b-yjbr8ygpta] {
        gap: 16px;
        width: 100%;
    }

    .report-export-window[b-yjbr8ygpta]  .bottom-actionbar,
    .report-export-window[b-yjbr8ygpta]  .bottom-actionbar__right {
        flex-direction: column;
        align-items: stretch;
    }

    .report-export-window[b-yjbr8ygpta]  .btn {
        width: 100%;
    }
}
/* _content/eLipsOnline/Components/SmallComponents/ReportParametersDialog.razor.rz.scp.css */
.rpd-title[b-qwxxoxlmm1] {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
    padding: 5px 0;
}

.rpd-title-icon[b-qwxxoxlmm1] {
    width: 45px;
    height: 45px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 5px;
    background: var(--color-primary-50);
    color: var(--color-primary-700);
}

    .rpd-title-icon[b-qwxxoxlmm1]  .k-svg-icon {
        width: 22px!important;
        height: 22px!important;
    }

.rpd-title-main[b-qwxxoxlmm1] {
    color: var(--color-secondary-700);
    font-size: var(--fs-h4);
    margin-bottom: 5px;
}

.rpd-title-sub[b-qwxxoxlmm1] {
    margin-top: 0px;
    color: var(--color-gray-500);
    font-size: var(--fs-body-2);
    font-weight: 400;
    line-height: 1.25;
}

.rpd-content[b-qwxxoxlmm1] {
    padding: 25px;
}

.rpd-intro[b-qwxxoxlmm1] {
    margin: 0 0 25px;
    color: var(--color-gray-500);
    font-size: var(--fs-body-2);
}

.rpd-field-list[b-qwxxoxlmm1] {
    display: grid;
    gap: 25px;
}

.rpd-field-card[b-qwxxoxlmm1] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.rpd-label[b-qwxxoxlmm1] {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-2);
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.25;
}

.rpd-required-dot[b-qwxxoxlmm1] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #0ea5e9;
}

.rpd-note[b-qwxxoxlmm1] {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 26px;
    padding: 16px 16px;
    border-radius: 8px;
    background: var(--color-primary-50);
    color: var(--color-primary-700);
    font-size: var(--fs-body-3);
    line-height: 1.4;
}

.rpd-note .material-symbols-rounded[b-qwxxoxlmm1] {
    color: #0b73e8;
    font-size: 22px;
}

.rpd-reset[b-qwxxoxlmm1] {
    color: #475569;
}

.rpd-reset .material-symbols-rounded[b-qwxxoxlmm1],
.rpd-footer-actions .material-symbols-rounded[b-qwxxoxlmm1] {
    font-size: 22px;
}

@media (max-width: 760px) {
    .report-parameters-window[b-qwxxoxlmm1]  .k-window {
        width: calc(100vw - 24px) !important;
    }

    .report-parameters-window[b-qwxxoxlmm1]  .k-window-titlebar {
        min-height: 96px;
        padding: 20px;
    }

    .rpd-title[b-qwxxoxlmm1] {
        gap: 14px;
    }

    .rpd-title-icon[b-qwxxoxlmm1] {
        width: 48px;
        height: 48px;
    }

    .rpd-title-main[b-qwxxoxlmm1] {
        font-size: 20px;
    }

    .rpd-title-sub[b-qwxxoxlmm1] {
        font-size: 15px;
    }

    .rpd-content[b-qwxxoxlmm1],
    .rpd-footer[b-qwxxoxlmm1] {
        padding: 20px;
    }

    .rpd-footer[b-qwxxoxlmm1],
    .rpd-footer-actions[b-qwxxoxlmm1] {
        flex-direction: column;
        align-items: stretch;
    }

    .rpd-footer[b-qwxxoxlmm1]  .btn {
        width: 100%;
    }
}
/* _content/eLipsOnline/Components/SmallComponents/RitBijlagenGrid.razor.rz.scp.css */
.bijlagen-card-view[b-8aezu5zorx] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: 100%;
}

.bijlagen-cards[b-8aezu5zorx] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 340px));
    grid-auto-rows: max-content;
    align-content: start;
    flex: 1 1 auto;
    min-height: 0;
    gap: 14px;
    padding: 12px;
    overflow-x: hidden;
    overflow-y: auto;
}

.bijlagen-card[b-8aezu5zorx] {
    display: flex;
    flex-direction: column;
    min-width: 0;
/*    min-height: 220px;*/
    padding: 0;
    overflow: hidden;
    color: inherit;
    text-align: left;
    background: var(--color-gray-30);
    border: 1px solid var(--color-gray-200);
    border-radius: 14px;
    cursor: pointer;
}

.bijlagen-card:hover[b-8aezu5zorx] {
    border-color: var(--color-selected-border);
}

.bijlagen-card.is-selected[b-8aezu5zorx] {
    background: var(--color-selected-bg);
    border-color: var(--color-selected-border);
}

.bijlagen-card__header[b-8aezu5zorx] {
    display: grid;
    grid-template-columns: 35px minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    padding: 12px 12px 10px;
    border-bottom: 1px solid var(--color-gray-200);
    background-color: var(--white);
}

.bijlagen-card__icon[b-8aezu5zorx] {
    width: 35px;
    height: 35px;
    object-fit: contain;
}

.bijlagen-card__extension[b-8aezu5zorx] {
    min-width: 60px;
    padding: 6px 10px;
    color: var(--color-primary-700);
    font-size: 11px;
    font-weight: 550;
    line-height: 1;
    text-align: center;
    background: var(--color-primary-50);
    border-radius: 999px;
}

.bijlagen-card__name[b-8aezu5zorx] {
    display: -webkit-box;
    margin: 4px 0 0;
    overflow: hidden;
    font-size: var(--fs-body-3);
    font-weight: 600;
    line-height: 1.3;
    overflow-wrap: anywhere;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.bijlagen-card__details[b-8aezu5zorx] {
    margin: 0px;
    padding: 8px 18px 8px;
}

.bijlagen-card__detail-row[b-8aezu5zorx] {
    display: grid;
    grid-template-columns: 130px minmax(0, 1fr);
    gap: 16px;
    padding: 4px 0;
    border-bottom: 0;
}

.bijlagen-card__detail-row:last-child[b-8aezu5zorx] {
    padding-bottom: 0;
    border-bottom: 0;
}

.bijlagen-card__detail-row dt[b-8aezu5zorx],
.bijlagen-card__detail-row dd[b-8aezu5zorx] {
    min-width: 0;
    margin: 0;
}

.bijlagen-card__detail-row dt[b-8aezu5zorx] {
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
    font-weight: 500;
}

.bijlagen-card__detail-row dd[b-8aezu5zorx] {
    color: var(--color-gray-700);
    font-size: var(--fs-body-3);
    font-weight: 500;
}

.bijlagen-card__footer[b-8aezu5zorx] {
    display: flex;
    justify-content: flex-end;
    margin-top: auto;
    padding: 5px 10px;
    border-top: 1px solid var(--color-gray-200);
    background-color: var(--white);
}

.bijlagen-card__location[b-8aezu5zorx] {
    display: flex;
    align-items: center;
    gap: 3px;
    color: var(--color-primary-700);
    overflow-wrap: anywhere;
    font-size: var(--fs-caption);
    text-decoration: none;
}

    .bijlagen-card__location:hover[b-8aezu5zorx] {
        text-decoration-thickness: 2px;
        text-decoration: underline;
    }

.bijlagen-card__location[b-8aezu5zorx]  .k-svg-icon svg {
    width: 13px;
    height: 13px;
}

.bijlagen-card__location--empty[b-8aezu5zorx] {
    color: var(--color-gray-400);
    text-decoration: none;
}

.bijlagen-card__location.is-copied[b-8aezu5zorx] {
    color: var(--color-success-700);
}

.bijlagen-card__location:focus[b-8aezu5zorx],
.bijlagen-card__location:focus-visible[b-8aezu5zorx] {
    outline: none;
    box-shadow: none;
}

.bijlagen-empty[b-8aezu5zorx] {
    padding: 24px;
    color: var(--kendo-color-subtle, #666);
    text-align: center;
}

/* Tablet */
@media (max-width: 1024px) {
    .bijlagen-cards[b-8aezu5zorx] {
        grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
        gap: 12px;
        padding: 10px;
    }

    .bijlagen-card[b-8aezu5zorx] {
        width: 100%;
    }
}

/* Mobile */
@media (max-width: 600px) {
    .bijlagen-card-view > .gb-toolbar[b-8aezu5zorx] {
        flex-wrap: wrap;
        gap: 6px;
    }

    .bijlagen-cards[b-8aezu5zorx] {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
        padding: 8px;
    }

    .bijlagen-card[b-8aezu5zorx] {
        min-height: 220px;
        border-radius: 10px;
    }

    .bijlagen-card__header[b-8aezu5zorx] {
        gap: 10px;
        padding: 10px;
    }

    .bijlagen-card__details[b-8aezu5zorx] {
        padding: 8px 12px;
    }

    .bijlagen-card__detail-row[b-8aezu5zorx] {
        grid-template-columns: minmax(90px, 38%) minmax(0, 1fr);
        gap: 10px;
    }

    .bijlagen-card__footer[b-8aezu5zorx] {
        min-height: 40px;
        padding: 8px 10px;
    }

    .bijlagen-card__location[b-8aezu5zorx] {
        min-height: 24px;
    }
}

/* Small mobile */
@media (max-width: 400px) {
    .bijlagen-card__header[b-8aezu5zorx] {
        grid-template-columns: 35px minmax(0, 1fr);
    }

    .bijlagen-card__extension[b-8aezu5zorx] {
        grid-column: 2;
        width: fit-content;
        min-width: 52px;
        padding: 5px 8px;
    }

    .bijlagen-card__detail-row[b-8aezu5zorx] {
        grid-template-columns: minmax(82px, 38%) minmax(0, 1fr);
    }

    .bijlagen-card__footer[b-8aezu5zorx] {
        justify-content: stretch;
    }

    .bijlagen-card__location[b-8aezu5zorx] {
        justify-content: center;
        width: 100%;
    }
}
/* _content/eLipsOnline/Components/SmallComponents/RitTePlannenRegelsTreeList.razor.rz.scp.css */
.main-pane[b-ibto2mrjjw] {
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    min-width: 0;
    box-sizing: border-box;
}

.main-pane-section[b-ibto2mrjjw] {
    height: 100%;
    min-height: 0;
    min-width: 0;
    overflow: auto;
    box-sizing: border-box;
}
/* _content/eLipsOnline/Components/SmallComponents/ShowLoading.razor.rz.scp.css */
.loading-state[b-b3jveqqeoz] {
    display: flex;
    align-items: center;
    gap: 1rem;
    min-height: 5.25rem;
    padding: 1.1rem 1.25rem;
    color: var(--text-primary, #0f172a);
    background: var(--white, #fff);
}

.loading-state-spinner[b-b3jveqqeoz] {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 50%;
    color: var(--kendo-color-primary, #0d6efd);
    background: var(--color-primary-50, #eff6ff);
}

.loading-state-copy[b-b3jveqqeoz] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 0;
    line-height: 1.25;
}

.loading-state-copy strong[b-b3jveqqeoz] {
    font-size: 1rem;
    font-weight: 650;
}

.loading-state-copy span[b-b3jveqqeoz] {
    color: var(--color-gray-600, #64748b);
    font-size: 0.875rem;
}
/* _content/eLipsOnline/Components/SmallComponents/Voormeld/SearchTarDialog.razor.rz.scp.css */
.search-tar-title[b-cv355p2hvg] {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.search-tar-title-icon[b-cv355p2hvg] {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 6px;
    background: var(--color-primary-50);
    color: var(--color-primary-700);
}

    .search-tar-title-icon[b-cv355p2hvg]  .k-svg-icon {
        width: 18px;
        height: 18px;
    }

.search-tar-content[b-cv355p2hvg] {
    box-sizing: border-box;
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 10px;
    padding: 18px;
    background: var(--color-gray-50);
    color: #111827;
}

.search-tar-intro[b-cv355p2hvg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-width: 0;
    color: var(--color-gray-600);
    font-size: var(--fs-body-3);
    font-weight: 500;
    margin-bottom: 10px;
}

.search-tar-intro span[b-cv355p2hvg] {
    min-width: 0;
}

.search-tar-intro strong[b-cv355p2hvg] {
    flex: 0 0 auto;
    color: var(--color-primary-700);
    font-size: var(--fs-body-3);
    font-weight: 500;
}

.search-tar-grid-card[b-cv355p2hvg] {
    min-height: 0;
    overflow: hidden;
    border-radius: 6px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 8px 20px rgba(15, 39, 66, 0.05);
}

.search-tar-host[b-cv355p2hvg]  .search-tar-window .k-window-content {
    padding: 0;
    background: var(--color-gray-50);
    overflow: hidden;
}

.search-tar-host[b-cv355p2hvg]  .search-tar-window .k-window-titlebar {
    border-bottom-color: #e5e7eb;
}

.search-tar-host[b-cv355p2hvg]  .search-tar-window .k-window-actions .k-button {
    border-radius: 4px;
}

.search-tar-host[b-cv355p2hvg]  .search-tar-window .k-grid {
    height: 100%;
    border: 0;
    background: #fff;
}

@media (max-width: 768px) {
    .search-tar-content[b-cv355p2hvg] {
        padding: 12px;
    }

    .search-tar-intro[b-cv355p2hvg] {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }
}
/* _content/eLipsOnline/Components/SmallComponents/Voormeld/VoormeldVerzendenDialog.razor.rz.scp.css */
.rv-title[b-3tuxqd51i9] {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
    padding: 5px 0;
}

.rv-title-icon[b-3tuxqd51i9] {
    width: 45px;
    height: 45px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 5px;
    background: var(--color-primary-50);
    color: var(--color-primary-700);
}

    .rv-title-icon[b-3tuxqd51i9]  .k-svg-icon {
        width: 25px !important;
        height: 25px !important;
    }

.rv-title-main[b-3tuxqd51i9] {
    color: var(--color-secondary-700);
    font-size: var(--fs-h4);
    margin-bottom: 5px;
}

.rv-title-sub[b-3tuxqd51i9] {
    margin-top: 0px;
    color: var(--color-gray-500);
    font-size: var(--fs-body-2);
    font-weight: 400;
    line-height: 1.25;
}

.voormeld-window .k-window-content[b-3tuxqd51i9] {
    padding: 0;
    background: var(--color-gray-50);
    overflow: auto;
}

.voormeld-form-shell[b-3tuxqd51i9] {
    width: 100%;
    height: auto;
    min-height: 0;
    overflow: visible;
}

.voormeld-form-shell[b-3tuxqd51i9]  .k-form,
.voormeld-form-shell[b-3tuxqd51i9]  .k-form-fieldset {
    width: 100%;
    height: auto !important;
    min-height: 0;
    max-height: none;
    margin: 0;
    padding: 0;
    border: 0;
    display: block;
}

.voormeld-form-shell[b-3tuxqd51i9]  .k-form-legend,
.voormeld-form-shell[b-3tuxqd51i9]  .k-form-buttons {
    display: none;
}

.voormeld-window .k-input[b-3tuxqd51i9],
.voormeld-window .k-picker[b-3tuxqd51i9],
.voormeld-window .k-multicolumncombobox[b-3tuxqd51i9] {
    border-color: #dfe3e8;
    border-radius: 4px;
}

.voormeld-page[b-3tuxqd51i9] {
    box-sizing: border-box;
    height: auto;
    max-height: none;
    min-height: 0;
    display: grid;
    grid-template-columns: 320px minmax(0, 1fr);
    align-items: stretch;
    background: var(--color-gray-50);
    color: #111827;
    overflow: visible;
}

.voormeld-sidebar[b-3tuxqd51i9] {
    width: auto;
    height: 100%;
    max-height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    gap: 22px;
    align-self: stretch;
    padding: 28px 18px 16px;
    background: var(--white);
    border-right: 1px solid var(--color-gray-200);
    overflow: hidden;
}

.voormeld-logo-box[b-3tuxqd51i9] {
    display: grid;
    align-content: start;
    justify-items: center;
    gap: 16px;
}

    .voormeld-logo-box img[b-3tuxqd51i9] {
        width: min(200px, 100%);
        max-height: 70px;
        object-fit: contain;
        border-radius: 4px;
    }

    .voormeld-logo-box span[b-3tuxqd51i9] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 104px;
        height: 24px;
        padding: 0 16px;
        border-radius: 999px;
        background: var(--color-primary-700);
        color: white;
        font-size: var(--fs-caption);
        font-weight: 600;
        line-height: 1;
        text-align: center;
        text-transform: uppercase;
    }

.voormeld-sidebar-meta[b-3tuxqd51i9] {
    display: grid;
    gap: 16px;
    padding: 4px 8px 30px;
    border-bottom: 1px solid var(--color-gray-200);
}

    .voormeld-sidebar-meta div[b-3tuxqd51i9],
    .voormeld-history-list div[b-3tuxqd51i9],
    .voormeld-sidebar-footer[b-3tuxqd51i9] {
        display: flex;
        justify-content: space-between;
        gap: 12px;
        min-width: 0;
    }

    .voormeld-sidebar-meta span[b-3tuxqd51i9],
    .voormeld-history-list span[b-3tuxqd51i9],
    .voormeld-sidebar-footer[b-3tuxqd51i9] {
        color: var(--color-gray-400);
        font-size: var(--fs-body-3);
    }

    .voormeld-sidebar-meta strong[b-3tuxqd51i9],
    .voormeld-history-list strong[b-3tuxqd51i9] {
        color: var(--color-secondary-700);
        font-size: var(--fs-body-3);
        font-weight: 600;
        text-align: right;
        word-break: break-word;
    }

.voormeld-history-panel[b-3tuxqd51i9] {
    position: relative;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 15px;
    overflow: hidden;
}

    .voormeld-history-heading[b-3tuxqd51i9],
    .voormeld-panel-heading h6[b-3tuxqd51i9] {
        margin: 0;
        font-size: var(--fs-body-2);
        font-weight: 500;
        color: var(--color-secondary-700);
    }

    .voormeld-history-heading[b-3tuxqd51i9] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        cursor: default;
    }

.voormeld-history-toggle[b-3tuxqd51i9] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.voormeld-history-content[b-3tuxqd51i9] {
    min-height: 0;
    display: grid;
    overflow: auto;
}

.voormeld-history-empty[b-3tuxqd51i9] {
    min-height: 0;
    display: grid;
    place-items: center;
    padding: 18px 10px;
    border: 1px dashed var(--color-gray-200);
    border-radius: 6px;
    background-color: var(--color-gray-50);
}

    .voormeld-history-empty .attachment-empty[b-3tuxqd51i9] {
        margin: 0;
        max-width: 100%;
    }

    .voormeld-history-empty .attachment-empty__visual[b-3tuxqd51i9] {
        width: 130px;
        height: 104px;
    }

    .voormeld-history-empty .attachment-empty__description[b-3tuxqd51i9] {
        max-width: 190px;
    }

.voormeld-history-list[b-3tuxqd51i9] {
    min-height: 0;
    display: grid;
    align-content: start;
    gap: 10px;
    padding: 12px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    overflow: auto;
}

    .voormeld-history-list label[b-3tuxqd51i9] {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 12px;
    }

.voormeld-sidebar-footer[b-3tuxqd51i9] {
    flex-direction: column;
    justify-content: flex-start;
    padding: 10px 8px 0;
    border-top: 1px solid #e5e7eb;
}

.voormeld-main[b-3tuxqd51i9] {
    container-type: inline-size;
    min-width: 0;
    height: auto;
    min-height: 0;
    display: grid;
    grid-template-rows: auto auto auto;
    align-content: start;
    gap: 14px;
    padding: 16px;
    overflow: visible;
}

.voormeld-panel[b-3tuxqd51i9] {
    min-width: 0;
    min-height: 0;
    background: var(--white);
    border: 1px solid var(--color-gray-200);
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
    padding: 16px 18px;
}

.voormeld-top-grid[b-3tuxqd51i9] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    min-width: 0;
}

.voormeld-top-grid--without-lading[b-3tuxqd51i9] {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: stretch;
}

.voormeld-top-grid--without-lading > .voormeld-panel[b-3tuxqd51i9] {
    height: 100%;
}

    .voormeld-panel > .gb-title:not(.voormeld-aanvraag-title)[b-3tuxqd51i9] {
        width: max-content;
        max-width: 100%;
        align-self: start;
        padding-right: 0;
    }

    .voormeld-panel > .gb-title:not(.voormeld-aanvraag-title) .attachment-title[b-3tuxqd51i9] {
        margin: 0;
        line-height: 1.2;
        white-space: nowrap;
    }

.voormeld-panel-heading[b-3tuxqd51i9] {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 14px;
}

.voormeld-step[b-3tuxqd51i9] {
    display: grid;
    place-items: center;
    width: 22px;
    height: 22px;
    border-radius: 999px;
    background: #dff0ff;
    color: #1d9bf0;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
}

.voormeld-location-grid[b-3tuxqd51i9] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 28px;
    align-items: start;
}

.voormeld-location-grid--without-lading[b-3tuxqd51i9] {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
}

.voormeld-field-group[b-3tuxqd51i9] {
    display: grid;
    gap: 7px;
    min-width: 0;
}

.voormeld-field-group label[b-3tuxqd51i9] {
    font-size: var(--fs-body-3);
    font-weight: 600;
    color: var(--color-secondary-700);
}

.voormeld-checkbox-label--disabled[b-3tuxqd51i9] {
    color: var(--color-gray-400);
}

.voormeld-help[b-3tuxqd51i9] {
    color: #6b7280;
    font-size: var(--fs-caption);
    font-style: italic;
}

.voormeld-radio-list[b-3tuxqd51i9] {
    display: grid;
    gap: 12px;
    align-content: start;
}

.voormeld-radio-row[b-3tuxqd51i9] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    font-size: 12px;
}

    .voormeld-radio-row input[type="radio"][b-3tuxqd51i9] {
        width: 14px;
        height: 14px;
        accent-color: #0ea5d7;
    }

.voormeld-richting-label[b-3tuxqd51i9] {
    color: var(--color-secondary-700);
    font-size: var(--fs-body-2);
    font-weight: 400;
}

.voormeld-richting-label--disabled[b-3tuxqd51i9] {
    color: var(--color-gray-400);
}

.voormeld-richting-radio[b-3tuxqd51i9]  .k-radio-item:has(.voormeld-richting-label--disabled) {
    cursor: not-allowed;
}

    .voormeld-richting-radio[b-3tuxqd51i9]  .k-radio-item:has(.voormeld-richting-label--disabled) .k-radio {
        opacity: .45;
    }

.voormeld-aanvraag-title[b-3tuxqd51i9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.voormeld-aanvraag-title-main[b-3tuxqd51i9],
.voormeld-pollen-switch[b-3tuxqd51i9] {
    display: flex;
    align-items: center;
    min-width: 0;
}

.voormeld-aanvraag-title-main[b-3tuxqd51i9] {
    gap: 10px;
}

.voormeld-pollen-switch[b-3tuxqd51i9] {
    gap: 10px;
    margin-left: auto;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 500;
    white-space: nowrap;
}

.voormeld-pollen-switch--disabled[b-3tuxqd51i9] {
    color: var(--color-gray-400);
}

.voormeld-pollen-switch[b-3tuxqd51i9]  .k-switch, .voormeld-pollen-switch[b-3tuxqd51i9]  .k-switch .k-switch-track {
    height: 25px;
    width: 80px;
}

.voormeld-request-grid[b-3tuxqd51i9] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    align-items: start;
}

.voormeld-request-grid.voormeld-request-grid--single[b-3tuxqd51i9] {
    grid-template-columns: minmax(280px, 360px);
    grid-auto-rows: auto;
    align-items: start;
}

.voormeld-request-grid--mpet.voormeld-request-grid--single[b-3tuxqd51i9] {
    grid-template-columns: minmax(0, 1fr);
}

.voormeld-option-tile[b-3tuxqd51i9] {
    box-sizing: border-box;
    min-width: 0;
    min-height: 50px;
    display: grid;
    align-content: start;
    gap: 12px;
    margin: 0;
    padding: 14px 18px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    background: #fff;
    color: var(--color-secondary-700);
    font-size: var(--fs-body-3);
    font-weight: 600;
    text-align: left;
    cursor: pointer;
}

.voormeld-option-tile--with-body[b-3tuxqd51i9] {
    min-height: 135px;
}

.voormeld-option-tile--selected[b-3tuxqd51i9] {
    border-color: var(--color-selected-border);
    background: var(--color-selected-bg);
}

.voormeld-option-tile--disabled[b-3tuxqd51i9] {
    color: var(--color-gray-400);
    cursor: default;
    opacity: .72;
}

.voormeld-option-header[b-3tuxqd51i9] {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
    margin: 0;
    cursor: inherit;
}

    .voormeld-option-header input[b-3tuxqd51i9] {
        width: 15px;
        height: 15px;
        accent-color: var(--color-primary-600);
        flex: 0 0 auto;
    }

    .voormeld-option-header span[b-3tuxqd51i9] {
        min-width: 0;
        overflow-wrap: anywhere;
        font-size: var(--fs-body-2-5);
    }

.voormeld-option-tile--disabled .voormeld-option-header input[b-3tuxqd51i9] {
    opacity: .45;
}

.voormeld-option-body[b-3tuxqd51i9] {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.voormeld-option-body--mpet-timeslot[b-3tuxqd51i9] {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
}

.voormeld-timeslot-field[b-3tuxqd51i9] {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.voormeld-timeslot-field > label[b-3tuxqd51i9] {
    color: var(--color-gray-600);
    font-size: var(--fs-caption);
    font-weight: 500;
}

    .voormeld-option-body .k-input[b-3tuxqd51i9],
    .voormeld-option-body .k-picker[b-3tuxqd51i9],
    .voormeld-option-body .k-textbox[b-3tuxqd51i9] {
        width: 100%;
        min-width: 0;
    }

    .voormeld-option-body > .k-button[b-3tuxqd51i9] {
        width: 100%;
        min-width: 0;
        height: 28px;
    }

.voormeld-timeslot-picker-wrap[b-3tuxqd51i9] {
    min-width: 0;
    width: 100%;
}

.voormeld-timeslot-picker-wrap[b-3tuxqd51i9]  .voormeld-timeslot-picker,
.voormeld-timeslot-picker-wrap[b-3tuxqd51i9]  .k-picker,
.voormeld-timeslot-picker-wrap[b-3tuxqd51i9]  .k-input {
    width: 100% !important;
    min-width: 0;
    display: flex;
    align-items: center;
}

    .voormeld-timeslot-picker-wrap[b-3tuxqd51i9]  .k-input-inner {
        flex: 1 1 auto;
        width: auto;
        min-width: 0;
        text-align: left;
    }

    .voormeld-timeslot-picker-wrap[b-3tuxqd51i9]  .k-input-button {
        flex: 0 0 auto;
        margin-left: auto;
    }

    .voormeld-timeslot-picker-wrap[b-3tuxqd51i9]  .k-input-button .k-button {
        width: auto;
        min-width: 0;
        height: 100%;
    }

.voormeld-action-date[b-3tuxqd51i9] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 5px 0 0 0;
    color: #374151;
    font-size: 11px;
    line-height: 1.25;
    white-space: normal;
    cursor: pointer;
}

    .voormeld-action-date input[b-3tuxqd51i9] {
        width: 15px;
        height: 15px;
    }

    .voormeld-action-date span[b-3tuxqd51i9] {
        font-size: var(--fs-caption);
        font-weight: 450;
    }

.voormeld-bottom-grid[b-3tuxqd51i9] {
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(330px, .60fr) minmax(0, 1fr);
    gap: 18px;
    align-items: stretch;
}

.voormeld-bottom-grid--single[b-3tuxqd51i9] {
    grid-template-columns: 1fr;
    align-items: start;
}

.voormeld-details-panel[b-3tuxqd51i9],
.voormeld-grid-panel[b-3tuxqd51i9],
.voormeld-drive-through-panel[b-3tuxqd51i9] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
}

.voormeld-containers-stack[b-3tuxqd51i9] {
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    gap: 18px;
    min-width: 0;
    min-height: 0;
    height: 100%;
}

.voormeld-containers-stack--split[b-3tuxqd51i9] {
    grid-template-rows: repeat(2, minmax(0, 1fr));
}

.voormeld-containers-header[b-3tuxqd51i9],
.voormeld-containers-title[b-3tuxqd51i9] {
    display: flex;
    align-items: center;
    min-width: 0;
}

.voormeld-panel > .voormeld-containers-header.gb-title[b-3tuxqd51i9] {
    width: 100%;
    max-width: none;
    align-self: stretch;
    justify-content: space-between;
    gap: 16px;
}

.voormeld-containers-title[b-3tuxqd51i9] {
    gap: 10px;
}

.voormeld-containers-title .attachment-title[b-3tuxqd51i9] {
    margin: 0;
}

.voormeld-containers-selected[b-3tuxqd51i9] {
    flex: 0 0 auto;
    margin-left: auto;
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
    font-weight: 500;
}

.voormeld-drive-through-list[b-3tuxqd51i9] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 0;
    overflow: auto;
}

.voormeld-drive-through-header[b-3tuxqd51i9],
.voormeld-drive-through-title[b-3tuxqd51i9] {
    display: flex;
    align-items: center;
    min-width: 0;
}

.voormeld-drive-through-header[b-3tuxqd51i9] {
    justify-content: space-between;
    gap: 16px;
}

.voormeld-panel > .voormeld-drive-through-header.gb-title[b-3tuxqd51i9] {
    width: 100%;
    max-width: none;
    align-self: stretch;
}

.voormeld-drive-through-title[b-3tuxqd51i9] {
    gap: 10px;
}

.voormeld-drive-through-add[b-3tuxqd51i9] {
    flex: 0 0 auto;
    margin-left: auto;
}

.voormeld-drive-through-title .attachment-title[b-3tuxqd51i9] {
    margin: 0;
}

.voormeld-drive-through-row[b-3tuxqd51i9] {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    padding: 6px;
    border: 1px solid var(--color-gray-200);
    border-radius: 6px;
    background: var(--color-gray-30);
}

.voormeld-drive-through-index[b-3tuxqd51i9] {
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    background: var(--color-primary-700);
    color: white;
    font-size: var(--fs-caption);
    font-weight: 500;
}

.voormeld-drive-through-empty[b-3tuxqd51i9] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    min-height: 110px;
    height: 100%;
    padding: 18px;
    border: 1px dashed var(--color-gray-300);
    border-radius: 6px;
    background: var(--color-gray-50);
    color: var(--color-secondary-700);
    text-align: left;
}

.voormeld-drive-through-empty-icon[b-3tuxqd51i9] {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 42px;
    height: 42px;
    border-radius: 999px;
    background: #dff0ff;
    color: #1d9bf0;
}

.voormeld-drive-through-empty > div:last-child[b-3tuxqd51i9] {
    display: grid;
    gap: 4px;
}

.voormeld-drive-through-empty strong[b-3tuxqd51i9] {
    font-size: var(--fs-body-2);
}

.voormeld-drive-through-empty span[b-3tuxqd51i9] {
    color: var(--color-gray-500);
    font-size: var(--fs-caption);
}

.voormeld-details-panel[b-3tuxqd51i9] {
    align-self: stretch;
    grid-template-rows: auto minmax(0, 1fr);
}

.voormeld-details-grid[b-3tuxqd51i9] {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 10px 18px;
    align-content: start;
    align-items: center;
    min-width: 0;
    margin-bottom: 10px;
}

.voormeld-grid-panel[b-3tuxqd51i9] {
    align-self: stretch;
    contain: size layout;
    min-height: 0;
    overflow: hidden;
}

    .voormeld-grid-panel[b-3tuxqd51i9]  .k-grid {
        width: 100% !important;
        height: 100% !important;
        min-height: 0;
/*        border-width: 0;*/
        border-radius: 5px;
    }

    .voormeld-grid-panel[b-3tuxqd51i9]  .k-grid-header {
        background: #f3f4f6;
    }

.voormeld-grid-panel[b-3tuxqd51i9]  .k-grid-content {
    min-height: 0;
    overflow: auto;
}

.voormeld-actions[b-3tuxqd51i9] {
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 2px 0 0;
}

.voormeld-actions-right[b-3tuxqd51i9] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.activity-button[b-3tuxqd51i9] {
    min-width: 112px;
    font-weight: 800;
}

.activity-button--secondary[b-3tuxqd51i9] {
    color: #111827;
    border-color: #e5e7eb;
    background: #fff;
}

@media (max-width: 1280px) {
    .voormeld-request-grid[b-3tuxqd51i9] {
        grid-template-columns: repeat(2, minmax(220px, 1fr));
    }

}

@media (min-width: 981px) and (max-width: 1440px) {
    .voormeld-request-grid[b-3tuxqd51i9] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: 1fr;
        align-items: stretch;
    }

    .voormeld-option-tile--type-1[b-3tuxqd51i9] {
        order: 1;
    }

    .voormeld-option-tile--type-4[b-3tuxqd51i9] {
        order: 2;
    }

    .voormeld-option-tile--type-2[b-3tuxqd51i9] {
        order: 3;
    }

    .voormeld-option-tile--type-3[b-3tuxqd51i9] {
        order: 4;
    }

    .voormeld-option-tile[b-3tuxqd51i9],
    .voormeld-option-tile--with-body[b-3tuxqd51i9] {
        height: 100%;
        min-height: 135px;
    }

    .voormeld-bottom-grid[b-3tuxqd51i9] {
        grid-template-columns: 1fr;
    }

    .voormeld-details-panel[b-3tuxqd51i9],
    .voormeld-grid-panel[b-3tuxqd51i9],
    .voormeld-drive-through-panel[b-3tuxqd51i9],
    .voormeld-containers-stack[b-3tuxqd51i9] {
        width: 100%;
    }

    .voormeld-grid-panel[b-3tuxqd51i9] {
        min-height: 280px;
    }

}

@media (max-width: 980px) {
    .voormeld-page[b-3tuxqd51i9] {
        grid-template-columns: 1fr;
        overflow: auto;
    }

    .voormeld-sidebar[b-3tuxqd51i9],
    .voormeld-main[b-3tuxqd51i9] {
        overflow: visible;
    }

    .voormeld-sidebar[b-3tuxqd51i9] {
        width: 100%;
        height: auto;
        grid-template-rows: auto auto auto;
        gap: 16px;
        padding: 18px 16px 0;
        border-right: 0;
        border-bottom: 0;
        background: var(--color-gray-50);
    }

    .voormeld-main[b-3tuxqd51i9] {
        height: auto;
        max-height: none;
        padding: 14px 16px 12px;
    }

    .voormeld-location-grid[b-3tuxqd51i9],
    .voormeld-top-grid[b-3tuxqd51i9],
    .voormeld-request-grid[b-3tuxqd51i9],
    .voormeld-bottom-grid[b-3tuxqd51i9] {
        grid-template-columns: 1fr;
    }

    .voormeld-logo-box[b-3tuxqd51i9] {
        grid-template-columns: auto minmax(0, 1fr);
        justify-items: start;
        align-items: center;
        gap: 14px;
        padding: 16px 18px;
        border: 1px solid #e5e7eb;
        border-radius: 6px;
        background: #fff;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
    }

        .voormeld-logo-box img[b-3tuxqd51i9] {
            width: min(150px, 40vw);
        }

        .voormeld-logo-box span[b-3tuxqd51i9] {
            justify-self: end;
        }

    .voormeld-sidebar-meta[b-3tuxqd51i9] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px;
        padding: 14px 18px;
        border: 1px solid var(--color-gray-200);
        border-radius: 6px;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
    }

        .voormeld-sidebar-meta div[b-3tuxqd51i9] {
            display: grid;
            justify-content: stretch;
            gap: 4px;
        }

        .voormeld-sidebar-meta strong[b-3tuxqd51i9] {
            text-align: left;
        }

    .voormeld-history-panel[b-3tuxqd51i9] {
        padding: 0;
        border: 1px solid #e5e7eb;
        border-radius: 6px;
        background: #fff;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 12px rgba(0, 0, 0, 0.04);
        overflow: hidden;
    }

    .voormeld-history-heading[b-3tuxqd51i9] {
        min-height: 52px;
        margin-top: 0;
        padding: 0 18px;
        cursor: pointer;
    }

        .voormeld-history-heading[b-3tuxqd51i9]::after {
            content: "";
            width: 9px;
            height: 9px;
            border-right: 2px solid var(--color-gray-400);
            border-bottom: 2px solid var(--color-gray-400);
            transform: rotate(45deg);
            transition: transform .16s ease;
        }

    .voormeld-history-content[b-3tuxqd51i9] {
        display: none;
        padding: 0 18px 18px;
    }

    .voormeld-history-toggle:checked + .voormeld-history-heading[b-3tuxqd51i9]::after {
        transform: rotate(225deg);
    }

    .voormeld-history-toggle:checked + .voormeld-history-heading + .voormeld-history-content[b-3tuxqd51i9] {
        display: grid;
    }

    .voormeld-history-empty[b-3tuxqd51i9] {
        min-height: 220px;
    }

    .voormeld-option-tile[b-3tuxqd51i9],
    .voormeld-option-tile--with-body[b-3tuxqd51i9] {
        min-height: 0;
    }

    .voormeld-grid-panel[b-3tuxqd51i9] {
        min-height: 280px;
    }

}

@media (max-width: 640px) {
    .rv-title[b-3tuxqd51i9] {
        gap: 12px;
    }

    .rv-title-icon[b-3tuxqd51i9] {
        width: 38px;
        height: 38px;
    }

    .rv-title-main[b-3tuxqd51i9] {
        font-size: var(--fs-h5);
    }

    .rv-title-sub[b-3tuxqd51i9] {
        display: none;
    }

    .voormeld-sidebar[b-3tuxqd51i9],
    .voormeld-main[b-3tuxqd51i9] {
        padding: 12px;
    }

    .voormeld-details-grid[b-3tuxqd51i9] {
        grid-template-columns: 1fr;
    }

    .voormeld-logo-box[b-3tuxqd51i9] {
        grid-template-columns: 1fr;
        justify-items: center;
    }

        .voormeld-logo-box img[b-3tuxqd51i9] {
            width: min(160px, 100%);
        }

        .voormeld-logo-box span[b-3tuxqd51i9] {
            justify-self: center;
        }

    .voormeld-sidebar-meta[b-3tuxqd51i9] {
        grid-template-columns: 1fr;
    }

        .voormeld-sidebar-meta div[b-3tuxqd51i9] {
            display: flex;
        }

    .voormeld-aanvraag-title[b-3tuxqd51i9] {
        align-items: flex-start;
        flex-direction: column;
    }

    .voormeld-pollen-switch[b-3tuxqd51i9] {
        margin-left: 0;
    }

    .voormeld-actions[b-3tuxqd51i9] {
        align-items: stretch;
        flex-direction: column-reverse;
    }

        .voormeld-actions-right[b-3tuxqd51i9],
        .voormeld-actions .k-button[b-3tuxqd51i9] {
            width: 100%;
        }

    .voormeld-panel[b-3tuxqd51i9] {
        padding: 14px;
    }

}