:root {
    --bs-primary: #4D4DD2 !important;
    --shipmate-blue-5: #dfdff6;
    --shipmate-blue-10: #EDEDFA;
    --shipmate-blue-20: #DADAFB;
    --shipmate-blue-30: #B2B2F7;
    --shipmate-blue-40: #7272E8;
    --shipmate-blue-50: #4D4DD2;
    --shipmate-blue-60: #2424B5;
    --shipmate-blue-70: #0E0E82;
    --shipmate-blue-80: #050556;
    --shipmate-blue-90: #020229;
    --grey-10: #F9F9F9;
    --grey-20: #F0F0F0;
    --grey-30: #E0E0E0;
    --grey-40: #BFBFBF;
    --grey-50: #A3A3A3;
    --grey-60: #7A7A7A;
    --grey-70: #616161;
    --grey-80: #474747;
    --grey-90: #292929;
    --green-10: #E8F5E9;
    --green-20: #C8E6C9;
    --green-30: #A5D6A7;
    --green-40: #81C784;
    --green-50: #4CAF50;
    --green-60: #43A047;
    --green-70: #2E7D32;
    --green-80: #1B5E20;
    --green-90: #103713;
    --yellow-10: #FFFCEB;
    --yellow-20: #FFF7D0;
    --yellow-30: #FFEEA2;
    --yellow-40: #FFD551;
    --yellow-50: #FFC218;
    --yellow-60: #DBA011;
    --yellow-70: #B7800C;
    --yellow-80: #7A4E04;
    --yellow-90: #4A2F02;
    --red-10: #FFEBEE;
    --red-20: #FFCDD2;
    --red-30: #FF99A3;
    --red-40: #FF6675;
    --red-50: #FF3352;
    --red-60: #DB0021;
    --red-70: #9E0018;
    --red-80: #6B0010;
    --red-90: #3D0009;
    --kendo-appbar-border-width: 1px;
}

:root {
    --kendo-border-radius-md: 0.145rem;
    --sbnt-primary-5: #e5dafc;
    --sbnt-primary-10: #CBB4F8;
    --sbnt-primary-20: #BA9BF8;
    --sbnt-primary-30: #A982F7;
    --sbnt-primary-40: #9B69F7;
    --sbnt-primary-50: #8A4FF8;
    --sbnt-primary-60: #7934F9;
    --sbnt-primary-70: #6C19FA;
    --sbnt-primary-80: #5C02F7;
    --sbnt-primary-90: #5200E0;
    --sbnt-primary-100: #5500E2;
    --sbnt-primary-110: #5A00E0;
    --sbnt-primary-120: #5000C7;
    --sbnt-primary-130: #4500AD;
    --sbnt-primary-140: #3E0094;
    --sbnt-primary-150: #33007A;
    --sbnt-primary-160: #280061;
    --sbnt-primary-170: #1F0047;
    --sbnt-primary-180: #14002E;
    --sbnt-primary-190: #090014;
    --sbnt-primary-200: #000000;
    --sbnt-primary-210: #000000;
    --sbnt-primary-220: #000000;
    --kendo-neutral-10: #F7F7F7;
    --kendo-neutral-20: #EBEBEB;
    --kendo-neutral-30: #DEDEDE;
    --kendo-neutral-40: #D1D1D1;
    --kendo-neutral-50: #C4C4C4;
    --kendo-neutral-60: #B7B6B9;
    --kendo-neutral-70: #ABA7AE;
    --kendo-neutral-80: #9E98A4;
    --kendo-neutral-90: #90899A;
    --kendo-neutral-100: #91899A;
    --kendo-neutral-110: #91899A;
    --kendo-neutral-120: #847891;
    --kendo-neutral-130: #776986;
    --kendo-neutral-140: #6B5C7A;
    --kendo-neutral-150: #5E4F6D;
    --kendo-neutral-160: #524360;
    --kendo-neutral-170: #453753;
    --kendo-neutral-180: #392C44;
    --kendo-neutral-190: #2C2136;
    --kendo-neutral-200: #1F1727;
    --kendo-neutral-210: #120D17;
    --kendo-neutral-220: #050407;
    --kendo-tertiary-100: #00B7E1;
    --kendo-error-100: #f58791;
    --kendo-success-100: #03ad91ff;
    --kendo-warning-100: #FFBC3C;
    --kendo-info-100: #0060FF;
    --kendo-body-bg: #ffffff;
    --kendo-series-a-100: #79ABC1;
    --kendo-series-b-100: #8D2F00;
    --kendo-series-c-100: #ffb900;
    --kendo-series-d-100: #409BBC;
    --kendo-series-e-100: #9D89B3;
    --kendo-series-f-100: #006765;
    --kendo-box-shadow-depth-1: 0px 0.3px 0.9px 0 #0000001a,0px 1.6px 3.6px 0 #00000021;
    --kendo-box-shadow-depth-2: 0px 0.6px 1.8px 0 #0000001a,0px 3.2px 7.2px 0 #00000021;
    --kendo-box-shadow-depth-3: 0px 0.9px 2.7px 0 #0000001a,0px 4.8px 10.8px 0 #00000021;
    --kendo-box-shadow-depth-4: 0px 1.2px 3.6px 0 #0000001a,0px 6.4px 14.4px 0 #00000021;
    --kendo-border-radius-md: var(--kendo-border-radius-md);
    --kendo-font-family: Roboto,"Segoe UI",-apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif;
    --kendo-font-size: 12px;
    --kendo-font-weight: 400;
    --kendo-font-weight-bold: 700;
    --kendo-line-height: 1.3285714286;
    --kendo-form-label-color: var(--kendo-neutral-160, inherit);
}

:root {
    --kendo-font-family: Roboto, "Helvetica Neue", "Segoe UI", -apple-system, BlinkMacSystemFont, sans-serif !important;
    --kendo-font-size: 0.8125rem !important;
    --INTERNAL--kendo-input-font-size: 0.875rem !important;
    --kendo-grid-header-font-weight: 600;
    --kendo-table-header-font-weight: 600;
    --kendo-form-label-margin-bottom: 0;
    --kendo-window-border-width: 5px 1px 1px;
    --kendo-window-border-radius: 5px;
    --kendo-tabstrip-content-padding-x: 0;
    --kendo-grid-border: var(--grey-30,#E0E0E0);
    --kendo-tabstrip-content-padding-y: 0;
    --kendo-grid-border: var(--grey-30,#E0E0E0);
    --kendo-component-border: var(--grey-20,#F0F0F0);
}

.k-multiselect, .k-clear-value {
    --INTERNAL--kendo-input-icon-size: calc(var(--kendo-icon-size, 1rem) + 0.33rem* 2) !important;
}

.k-popup.k-multiselect-popup {
    height: auto !important;
    max-height: 45vh !important;
}

:root {
    --kendo-color-primary-subtle: var(--sbnt-primary-5,#e5dafc) !important;
    --kendo-color-primary-subtle-hover: var(--sbnt-primary-10,#0078d4) !important;
    --kendo-color-primary-subtle-active: var(--sbnt-primary-20,#BA9BF8) !important;
    --kendo-color-primary: var(--sbnt-primary-100,#0078d4) !important;
    --kendo-color-primary-hover: var(--sbnt-primary-110,#0078d4) !important;
    --kendo-color-primary-active: var(--sbnt-primary-120,#0078d4) !important;
    --kendo-color-primary-emphasis: var(--sbnt-primary-140,#0078d4) !important;
    --kendo-color-primary-on-subtle: var(--sbnt-primary-150,#0078d4) !important;
    --kendo-color-on-primary: #ffffff !important;
    --kendo-color-primary-on-surface: var(--sbnt-primary-100,#0078d4) !important;
    --kendo-color-secondary: var(--sbnt-primary-10,#0078d4) !important;
    --kendo-color-secondary-hover: var(--sbnt-primary-20,#BA9BF8) !important;
    --kendo-color-secondary-active: var(--sbnt-primary-30,#A982F7) !important;
    --kendo-color-secondary-emphasis: var(--sbnt-primary-30,#A982F7) !important;
    --kendo-color-secondary-on-subtle: var(--sbnt-primary-80,#5C02F7) !important;
    --kendo-color-on-secondary: var(--sbnt-primary-100,#0078d4) !important;
    --kendo-color-secondary-on-surface: var(--sbnt-primary-120,#0078d4) !important;
    --kendo-color-tertiary-subtle: var(--sbnt-primary-5,#0078d4) !important;
    --kendo-color-tertiary-subtle-hover: var(--sbnt-primary-10,#0078d4) !important;
    --kendo-color-tertiary-subtle-active: var(--sbnt-primary-20,#0078d4) !important;
    --kendo-color-tertiary: var(--sbnt-primary-100,#0078d4) !important;
    --kendo-color-tertiary-hover: var(--sbnt-primary-110,#0078d4) !important;
    --kendo-color-tertiary-active: var(--sbnt-primary-120,#0078d4) !important;
    --kendo-color-tertiary-emphasis: var(--sbnt-primary-140,#0078d4) !important;
    --kendo-color-tertiary-on-subtle: var(--sbnt-primary-150,#0078d4) !important;
    --kendo-color-on-tertiary: #ffffff !important;
    --kendo-color-tertiary-on-surface: var(--sbnt-primary-100,#0078d4) !important;
    --kendo-color-border: var(--grey-40,#BFBFBF) !important;
    --kendo-color-border-alt: var(--grey-50,#A3A3A3) !important;
    --kendo-color-base-subtle: var(--grey-10,#F9F9F9) !important;
    --kendo-color-base-subtle-hover: var(--grey-20,#F0F0F0) !important;
    --kendo-color-base-subtle-active: var(--grey-30,#E0E0E0) !important;
    --kendo-color-app-surface: #ffffff;
    --kendo-color-on-app-surface: var(--grey-80,#474747) !important;
    --kendo-color-subtle: var(--grey50,#A3A3A3) !important;
    --kendo-color-surface: var(--grey-20,#F0F0F0) !important;
    --kendo-color-surface-alt: #ffffff;
    --kendo-button-flat-dark-hover-bg: var(--grey-10,#F9F9F9);
    --kendo-tabstrip-item-selected-text: var(--sbnt-primary-120,#0078d4);
    --kendo-tabstrip-content-bg: transparent;
    --kendo-card-border: var(--grey-30,#E0E0E0);
}

:root {
    --kendo-input-solid-disabled-bg: #ffffff;
    --kendo-button-solid-base-disabled-bg: inherit;
    --kendo-input-solid-disabled-border: var( --kendo-input-solid-border, var(--kendo-neutral-40, inherit) );
    --kendo-input-solid-disabled-text: var(--kendo-color-on-app-surface, #323130);
    --kendo-splitbar-selected-bg: var(--kendo-color-surface, #faf9f8);
    --kendo-splitbar-selected-text: var(--sbnt-primary-80,#5C02F7);
}
/*==Switch==*/
:root {
    --kendo-switch-md-thumb-width: 14px;
    --kendo-switch-md-thumb-height: 14px;
    --kendo-switch-md-width: 28px;
    --kendo-switch-sm-width: 22px;
}
/*==Button=*/
:root {
    --kendo-button-focus-outline: var(--grey-10,#F9F9F9);
    --kendo-button-focus-outline-width: 0px;
    --kendo-menu-item-focus-outline-width: 0px;
    --kendo-button-sm-padding-x: var(--kendo-spacing-2, 0.5rem);
    --kendo-button-md-padding-x: var(--kendo-spacing-3, 0.75rem);
}
/*==ButtonGroup=*/
.k-button-group .k-button-solid-primary {
    --kendo-color-primary: var(--kendo-neutral-10, #F7F7F7) !important;
    --kendo-color-primary-hover: var(--sbnt-primary-10,#CBB4F8) !important;
    --kendo-color-primary-active: var(--sbnt-primary-40,#9B69F7) !important;
    --kendo-color-primary-emphasis: var(--sbnt-primary-50,#8A4FF8) !important;
    --kendo-color-on-primary: var(--grey-160,#474747);
    --kendo-button-selected-text: #ffffff !important;
    --kendo-button-selected-bg: var(--sbnt-primary-40,#9B69F7) !important;
    --kendo-button-selected-border: var(--sbnt-primary-40,#9B69F7) !important;
}
/*==Grid==*/
.k-grid:not(.fullscreen) {
    --kendo-grid-header-border-width-x: 1px;
    --kendo-grid-cell-border-width-x: 1px;
    --kendo-grid-filter-cell-padding-y-sm: 0.04rem;
    --kendo-grid-filter-cell-padding-x-sm: 0.15rem;
    --kendo-pager-sm-padding-y: 0.04rem;
    --kendo-pager-sm-padding-x: 0.15rem;
    --kendo-toolbar-sm-padding-y: 0rem;
}
.k-grid:not(.fullscreen) .k-toolbar-md {
    --kendo-toolbar-md-padding-x: var(--kendo-spacing-1, 0.25rem);
    --kendo-toolbar-md-padding-y: var(--kendo-spacing-1, 0.25rem);
}
.k-grid .k-table-td.k-grid-edit-cell { vertical-align:top;}
.k-filter.custom-filter .k-filter-container {
    --kendo-filter-bottom-margin: var(--kendo-spacing-0);
}
.k-filter.custom-filter .k-toolbar-md {
    --kendo-toolbar-md-padding-x:var(--kendo-spacing-1\.5, 0.125rem);
    --kendo-toolbar-md-padding-y:var(--kendo-spacing-1\.5, 0.125rem);
}
.k-grid:not(.fullscreen) .k-button {
    --kendo-icon-button-sm-padding-y: 0;
    --kendo-icon-button-sm-padding-x: 0;
}

    .k-grid:not(.fullscreen) .k-filtercell .k-input-button {
        --INTERNAL--kendo-input-padding-y: 0;
        --INTERNAL--kendo-input-button-padding-y: 0;
        --INTERNAL--kendo-input-button-padding-x: 0;
        --kendo-input-button-width: auto;
    }

    .k-grid:not(.fullscreen) .k-filtercell .k-input-inner {
        --INTERNAL--kendo-input-padding-y: 0;
    }

.k-grid:not(.fullscreen) {
    --kendo-component-border: var(--grey-30,#E0E0E0);
    --INTERNAL--kendo-button-padding-x: 0.2rem;
    --INTERNAL--kendo-button-padding-y: 0rem;
    --kendo-grid-cell-padding-y-sm: var(--kendo-spacing-0\.5,0.125rem);
    --kendo-table-size-font-size: var(--kendo-font-size-sm,12px);
}

.k-grid.k-treelist {
    --INTERNAL--kendo-grid-header-padding-y: var(--kendo-spacing-0\.5,0.125rem);
}

.k-grid .k-treelist-toggle {
    padding: 0;
}

.k-grid:not(.fullscreen) .k-button {
    --INTERNAL--kendo-button-padding-x: 0.125rem;
    --INTERNAL--kendo-button-padding-y: 0rem;
    --kendo-border-radius-md: 0.125rem;
    --kendo-button-spacing: 0.125rem;
    --kendo-button-font-weight: var(--kendo-font-weight-medium);
}

.k-grid.fullscreen {
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh !important;
    width: 100vw !important;
    max-width: 100%;
    max-height: 100%;
    border: 0 none;
    z-index: 2;
}
.k-grid .k-detail-row.k-table-row {
    background: var(--grey-20);
}
.k-checkbox-label {
    font-size: var(--kendo-font-size-sm,12px);
}
.k-d-grid.k-form-layout .k-form-field-wrap .k-checkbox-wrap {
    margin-top: 0.35rem;
}

.k-grid-content {
    --kendo-component-border: var(--grey-20,#F0F0F0);
}

.k-master-row:last-child td, .k-master-row:last-child .k-table-td {
    border-block-end-width: var(--kendo-grid-border-width, 1px) !important;
}

.k-pager .k-picker .k-input-button {
    --INTERNAL--kendo-input-button-padding-y: 0rem;
}

.k-pager .k-input-inner {
    --INTERNAL--kendo-input-padding-y: 0;
    --INTERNAL--kendo-input-padding-x: 0;
}

.k-pager .k-input {
    --kendo-pager-input-width: 3rem;
}
/*==Menu==*/
:root {
    --kendo-menu-popup-item-padding-y-md: 0.3rem;
    --kendo-menu-item-padding-y: 0.2rem;
}

.k-appbar {
    --kendo-menu-item-padding-y: 0 .125rem;
}
/*==scheduler==*/
:root {
    --kendo-scheduler-event-border: var(--sbnt-primary-60);
    --kendo-scheduler-event-bg: var(--sbnt-primary-60);
    --kendo-scheduler-event-selected-border: var(--sbnt-primary-70);
    --kendo-scheduler-event-selected-bg: var(--sbnt-primary-70);
}
/*==tabstrip==*/
:root {
    --kendo-tabstrip-item-padding-y: 0.5rem;
}

.k-tabstrip-items-wrapper .k-item {
    --kendo-tabstrip-item-text: var(--grey-70,#616161);
    --kendo-tabstrip-item-bg: transparent;
    --kendo-tabstrip-item-selected-bg: transparent;
    --kendo-tabstrip-item-selected-text: var(--kendo-color-primary-on-subtle);
    --kendo-tabstrip-item-hover-text: var(--kendo-color-primary-on-subtle);
    --kendo-tabstrip-item-focus-shadow: none;
}

.k-tabstrip-items-wrapper .k-tabstrip-items {
    gap: 0;
}

.k-tabstrip-items-wrapper .k-item.k-tab-on-top::after {
    top: auto;
    border-bottom-width: 1px;
}
/*==Radio==*/
:root {
    --INTERNAL--kendo-radio-width: var(--kendo-spacing-4, 1rem);
    --INTERNAL--kendo-radio-height: var(--kendo-spacing-4, 1rem);
}

.k-window.k-centered {
    --kendo-window-border-radius: var(--kendo-border-radius-md,0.25rem);
}

.k-window.rightFix {
    --kendo-window-border-radius: 0;
    --kendo-window-border-width: 0px;
}

.k-window-title {
    --kendo-window-titlebar-text: var(--kendo-neutral-150);
}

.k-editor .k-toolbar {
    --kendo-toolbar-md-padding-y: var(--kendo-spacing-1, 0.25rem);
    --kendo-toolbar-md-padding-x: var(--kendo-spacing-1, 0.25rem);
}

    .k-editor .k-toolbar .k-upload .k-dropzone {
        --kendo-upload-dropzone-padding-y: var(--kendo-spacing-0, 0.5rem)
    }

.chart-container .k-card-title {
    --kendo-card-title-font-weight: var(--kendo-font-weight-bold,600);
}
/*==Card==*/
.k-card.k-card-secondary {
    --INTERNAL--kendo-card-bg: var(--grey-10,#F9F9F9);
    --kendo-card-border-width: 1px;
}

.bg-grey-10 {
    background-color: var(--grey-10,#F9F9F9);
}

.bg-grey-20 {
    background-color: var(--grey-20,#F0F0F0);
}
/*==Daterangepicker==*/
.k-daterangepicker .k-floating-label {
    --kendo-floating-label-font-size: var(--kendo-font-size, inherit);
    --kendo-floating-label-font-weight: var(--kendo-font-weight, inherit);
    --kendo-floating-label-text: var(--grey-60,inherit);
}



* {
    margin: 0;
    padding: 0;
    scrollbar-width: thin;
}

html body {
    background: var(--grey-10);
    font-family: var(--kendo-card-font-family, var(--kendo-font-family, inherit));
}

.overflow-auto::-webkit-scrollbar, .overflowy-auto::-webkit-scrollbar, .overflowy-scroll::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

.overflow-auto::-webkit-scrollbar-thumb, .overflowy-auto::-webkit-scrollbar-thumb, .overflowy-scroll::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background-color: var(--grey-30);
}

    .overflow-auto::-webkit-scrollbar-thumb:hover, .overflowy-auto::-webkit-scrollbar-thumb:hover, .overflowy-scroll::-webkit-scrollbar-thumb:hover {
        background-color: var(--grey-40);
    }

h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
    margin: 0;
    word-wrap: break-word;
}


.start-auto {
    left: auto !important;
}

.rightFix {
    top: 0 !important;
    right: 0 !important;
    left: auto !important;
    transform: translateY(0) !important;
}

.mainWrap {
    height: calc(100vh - 78px);
}

label:empty {
    display: inline;
}

.k-appbar.k-appbar-base {
    background-color: #ffffff;
    padding-block: 0;
    flex-shrink: 0;
    flex-basis: 44px
}

.k-menu-bar, .k-menu, .k-tabstrip, .k-grid {
    font-size: 14px;
}

.k-appbar .k-menu:not(.k-context-menu) {
    background-color: #ffffff;
    border-color: #ffffff;
}

.k-appbar h5 {
    font-weight: bolder;
}

.k-window.userPop {
    left: auto !important;
    right: 20px;
    --kendo-window-border-width: 0;
}

.k-window-title {
    align-items: center;
}

.k-popup {
    border-radius: 0px !important;
}

.k-window.k-dialog .k-actions.k-actions-stretched > * {
    flex: 0 0 0%;
}

.k-dialog .k-dialog-title > .k-svg-icon {
    --kendo-icon-size: 1.5rem;
}

.k-disabled, .k-disabled * {
    --kendo-form-label-color: var(--kendo-neutral-70, inherit);
}

.k-card.bordered {
    --kendo-card-border-width: 1px;
    --INTERNAL--kendo-card-shadow: none;
}

.k-card {
    flex-shrink: 0;
}

.footer-tab {
    background: #ffffff;
    border-top: 1px solid var(--grey-30);
    height: 32px;
    --kendo-tabstrip-item-padding-y: 0.4rem;
}

    .footer-tab .k-tabstrip-content {
        display: none !important;
    }

    .footer-tab .k-tabstrip-items-wrapper .k-item.k-active {
        border-color: var(--grey-30);
        color: var(--shipmate-blue-60);
        background-color: var(--grey-10);
        margin-bottom: 0px !important;
        margin-top: -1px;
        border-top-color: transparent;
    }
    .footer-tab .k-tabstrip-bottom > .k-tabstrip-items-wrapper .k-item::after {
        border-bottom-color: transparent !important;
    }
    .footer-tab .k-tabstrip-items-wrapper .k-item {
        color: var(--grey-50);
    }

.k-tabstrip-content, .k-tabstrip > .k-content {
    display: flex;
}

.field-label {
    color: var(--grey-80);
    font-size: 12px;
    font-weight: 500;
}

.round {
    width: 8px;
    height: 8px;
    border-radius: 4px;
    display: inline-block;
}

.k-header .k-cell-inner > .k-link {
    align-items: center;
    justify-content: center;
}

.k-tabstrip-content.k-content.k-active {
    overflow: visible;
}

.k-tabstrip-items .k-item:first-child {
    border-start-start-radius: 0.15rem;
    border-end-start-radius: 0.15rem;
}

.k-tabstrip-items .k-item:last-child {
    border-end-end-radius: 0.15rem;
    border-start-end-radius: 0.15rem;
}

/*.k-tabstrip-top > .k-tabstrip-items-wrapper .k-item::after {
    display: none !important;
}*/

.footer-tab .k-tabstrip-items-wrapper .k-item:active:hover,
.footer-tab .k-tabstrip-items-wrapper .k-item:active.k-hover,
.footer-tab .k-tabstrip-items-wrapper .k-item.k-active:hover,
.footer-tab .k-tabstrip-items-wrapper .k-item.k-active.k-hover,
.footer-tab .k-tabstrip-items-wrapper .k-item.k-selected:hover,
.footer-tab .k-tabstrip-items-wrapper .k-item.k-selected.k-hover {
    background-color: var(--grey-20, inherit);
}

.footer-tab .k-tabstrip-items-wrapper .k-item.k-tab-on-top::after {
    top: 0;
}

.footer-tab .k-tabstrip-content {
    display: none !important;
}

.k-grid-norecords {
}

.k-grid .k-table-td.k-command-cell {
    text-align: center;
}

.badge.subHead {
    background: var(--shipmate-blue-30);
    color: var(--shipmate-blue-60);
    font-weight: 500;
    font-size: 0.8em;
    border-radius: 0;
}

.bg-grey10 {
    background-color: var(--grey-10);
}

aside .k-grid.k-treelist td, aside .k-grid.k-treelist .k-table-td {
    text-overflow: clip;
}

.imageFullView {
    max-width: 100%;
    max-height: 100%;
}

.asideTree .k-grid-content {
    height: calc(100vh - 225px);
}

.k-treelist.k-grid td, .k-treelist.k-grid .k-table-td {
    padding-block: 0;
    /*border-block-end-width: 0px;*/
    --INTERNAL--kendo-grid-cell-padding-x: 0.5rem;
}

.k-loader-container-overlay {
    background-color: #ffffff !important;
}

.k-window.end-fix {
    transform: none !important;
}

.k-window-content .k-validation-summary {
    display: none !important;
}

.zindex-1 {
    z-index: 1 !important;
}

.k-panelbar .k-panelbar-toggle {
    position: absolute !important;
    margin-inline-start: -23px !important;
}

.k-link .action-area {
    display: none;
}

.k-link:hover .action-area {
    display: inline-flex;
}

.lds-ripple {
    display: inline-block;
    position: relative;
    width: 72px;
    height: 72px;
}

.customUpload.k-upload {
    display: flex;
    height: 100%;
    width: 100%;
    border: 3px dashed;
    border-radius: 10px;
}

    .customUpload.k-upload .telerik-blazor.k-dropzone {
        flex: 1 1 auto;
        display: flex;
        flex-direction: column;
    }

    .customUpload.k-upload .k-upload-files {
        display: none !important;
    }

.customUpload-sm.k-upload .k-upload-files {
    display: none !important;
}

.lds-ripple div {
    position: absolute;
    border: 4px solid var(--shipmate-blue-50);
    opacity: 1;
    border-radius: 50%;
    animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}

    .lds-ripple div:nth-child(2) {
        animation-delay: -0.5s;
    }

.k-stepper.rating .k-step-indicator {
    border-color: transparent;
    color: var(--kendo-stepper-indicator-bg, var(--kendo-neutral-100, initial));
    background-color: transparent;
}

.k-stepper.rating .k-step-current .k-step-indicator,
.k-stepper.rating .k-step-current:hover .k-step-indicator,
.k-stepper.rating .k-step-current.k-hover .k-step-indicator,
.k-stepper.rating .k-step-current.k-step-hover .k-step-indicator,
.k-stepper.rating .k-step:hover .k-step-indicator,
.k-stepper.rating .k-step.k-hover .k-step-indicator,
.k-stepper.rating .k-step-done .k-step-indicator {
    border-color: transparent;
    color: var(--kendo-stepper-indicator-current-border, var(--yellow-50, inherit));
    background-color: transparent;
}

.k-stepper.rating .k-step-indicator-icon {
    width: 1.3rem;
    height: 1.3rem;
}

.k-stepper.rating .k-progressbar {
    display: none;
}

@keyframes lds-ripple {
    0% {
        top: 36px;
        left: 36px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 36px;
        left: 36px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 36px;
        left: 36px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 72px;
        height: 72px;
        opacity: 0;
    }
}

.flex-1 {
    flex: 1 !important;
}

.flex-2 {
    flex: 2 !important;
}

.flex-3 {
    flex: 3 !important;
}
/* CUSTOMIZE */
body .k-loader-container {
    z-index: 20001;
}

body .k-grid-container .k-loader-container {
    z-index: 1;
}

.k-menu-group .k-menu-link {
    font-size: var(--kendo-font-size-sm,12px);
    cursor: pointer;
}

.k-textbox.k-input .k-input-prefix {
    max-width: 110px;
}

.k-textbox .k-input-prefix > *, .k-textbox .k-input-suffix > * {
    flex-shrink: 1;
}

.k-panelbar > .k-panelbar-header {
    border-width: 1px;
    --kendo-panelbar-header-padding-y: 0.5rem !important;
}

.k-input:focus::after, .k-input.k-focus::after, .k-input:focus-within::after, .k-picker:focus::after, .k-picker.k-focus::after, .k-picker:focus-within::after {
    --kendo-input-focus-border-width: 0px;
}

.overflowy-auto {
    overflow-y: auto !important;
}

.overflowy-scroll {
    overflow-y: scroll !important;
}

.overflowx-hidden {
    overflow-x: hidden !important;
}

.k-label.k-form-label, .k-form-field .k-form-label {
    font-size: var(--kendo-font-size-sm, 11px);
    font-weight: var(--kendo-font-weight-bold, 700);
    color: var(--kendo-neutral-160, initial);
}
.flex-row > .k-label.k-form-label, .flex-row > .k-form-field .k-form-label{
    white-space:nowrap; 
}
.k-form-field .k-form-label + .k-form-field-wrap .asterisk {
    position: relative;
    left: -7px;
    top: -19px;
    height: 0;
}

.k-disabled.k-input .k-clear-value {
    display: none;
}

#blazor-error-ui {
    background: lightyellow;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    z-index: 1000;
}

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

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

.k-window.k-dialog {
    --kendo-window-border-radius: 0.25rem;
    --kendo-window-border: var(--shipmate-blue-30);
    --kendo-dialog-border-width: 1px;
    border-width: 1px;
}

button:focus:not(:focus-visible) {
    box-shadow: 0px 2px 6px #5500e2ab;
}

.k-button-solid-light:focus:not(:focus-visible), .k-button-solid-base:focus:not(:focus-visible) {
    box-shadow: 0px 2px 6px #c3bcbc;
}

.k-button-flat:focus:not(:focus-visible) {
    box-shadow: 0px 2px 6px transparent;
}

.k-dialog .k-actions-horizontal {
    justify-content: end;
}

.k-actions-horizontal.k-window-actions {
    flex-flow: row-reverse wrap;
}

.k-notification-group.sbnt-notification {
    margin-top: 10px;
    z-index: 20002;
    --kendo-notification-font-size: var(--kendo-font-size-lg,20px);
    --kendo-notification-padding-x: var(--kendo-spacing-5, 1rem);
    --kendo-notification-padding-y: var(--kendo-spacing-3, 0.75rem);
    --kendo-notification-box-shadow: var(--kendo-box-shadow-depth-4, none);
}

    .k-notification-group.sbnt-notification .k-notification-success {
        --kendo-notification-success-text: #ffffff;
        --kendo-notification-success-bg: var(--kendo-color-success, #dff6dd);
        --kendo-notification-success-border: var(--kendo-color-success, #dff6dd);
    }

    .k-notification-group.sbnt-notification .k-notification {
        min-width: 400px;
    }

.k-notification-status.k-icon {
    width: 1.8rem;
    height: 1.8rem;
}

.k-upload.k-upload-async.custom {
    display: flex;
    flex: 1 1 auto;
    flex-flow: column;
}

    .k-upload.k-upload-async.custom .k-dropzone {
        display: flex;
        flex-flow: column;
        flex: 1 1 auto;
        align-items: center;
        justify-content: center;
    }

        .k-upload.k-upload-async.custom .k-dropzone .k-dropzone-hint {
            flex: none;
        }

.textEditorWrap {
    overflow: hidden;
    position: relative;
}

    .textEditorWrap .button-area {
        position: absolute;
        right: 0;
        top: 0;
        display: flex;
        justify-content: center;
        gap: 0.5rem;
        transition: all 300ms ease-in-out;
        opacity: .5;
    }

    .textEditorWrap:hover .button-area {
        opacity: 1;
    }

.k-loader-segment {
    --kendo-loader-lg-segment-size: var(--kendo-spacing-2,0.5rem);
}

.k-loader-canvas {
    --kendo-loader-lg-spinner-3-width: calc(calc(calc(var( --kendo-spacing-3, .75rem) * 4) * 0.866) - var(--kendo-spacing-2));
    --kendo-loader-lg-spinner-3-height: calc(calc(calc(var( --kendo-spacing-3, .75rem) * 4) * 0.866) - var(--kendo-spacing-2));
}

.text-primary-100 {
    color: var(--sbnt-primary-100,#5500E2);
}

.text-danger-30 {
    color: var(--red-30,#FF99A3);
}

.text-info-30 {
    color: var(--kendo-info-30, #b6d8ff);
}

.text-primary-30 {
    color: var(--sbnt-primary-30,#A982F7);
}

.text-series-a {
    color: var(--kendo-series-a-100, #79ABC1);
}

.text-series-b {
    color: var(--kendo-series-b-100, #8D2F00);
}

.text-series-c {
    color: var(--kendo-series-c-100, #ffb900);
}

.text-series-d {
    color: var(--kendo-series-d-100, #409BBC);
}

.text-series-e {
    color: var(--kendo-series-e-100, #9D89B3);
}

.text-series-f {
    color: var(--kendo-series-f-100, #006765);
}
/*======Dashboard=====*/
.chart-container {
    display: grid;
    grid-template-rows: repeat(2,1fr);
    background-color: transparent !important;
    padding: 0 !important;
}

    .chart-container .k-chart {
        border-width: 0px;
    }

/*==Role Badges==*/
.role-badge {
    padding: 2px 5px;
    display: flex;
    gap: 4px;
    color: var(--role-cl,#292929);
    background: var(--role-bg,#BFBFBF);
    border: 1px solid var(--role-br,#616161);
    border-radius: 4px;
    align-items: center;
    cursor: grab;
}
td.k-table-td .role-badge {
    cursor: initial;
}
.role-badge.dragging {
    cursor: grabbing;
}
    .role-badge .code {
        font-size: 1rem;
        font-weight: var(--kendo-font-weight-bold);
    }
    .role-badge .name {
        font-size: 0.8rem;
    }
.role-card {
    min-height:120px;
    width:170px;
}
    .role-card.users { 
        min-height: 120px;
        height: 100%;
        width: auto;
    }
    .role-card.allowdrop {
        opacity:0.8;
        border-style:dashed;
        border-width:2px; 
        box-shadow:var(--kendo-box-shadow-depth-4);
    }
    .role-card .role-badge {
        transform: scale(0.9);
        cursor: initial;
    }
    .role-card.allowdrop .role-badge {
        transform: scale(0.7);
    }
    .role-card.max-content .roles-list .role-badge {
        padding: 1px 5px;
        line-height: 1.2;
    }
    .role-card.users .roles-list {
        max-height:200px; overflow-y:auto;
        width:100%; padding-top:5px;
    }
    .role-group {
        display: flex;
        gap: -10px;
        align-items: center;
    }
    .role-group .role-badge {
        margin-left: -5px;
        padding: 1px 5px;
        line-height: 1.2;
    }
    .role-group .role-badge:first-child { margin-left:0px; }
    
.role-badge.user {
    --role-bg: #EBEBEB;
    --role-br: #E0E0E0;
    --role-cl: #242424;
}
.k-list-ul .role-badge.user {
    --role-bg: transparent;
    --role-br: transparent; 
    width:100%;
    cursor:grab;
}
.role-badge.user > .name {
    word-break: break-all;
}
.custom-btn-group.selector .k-button {
    --INTERNAL--kendo-button-padding-x: 0.25rem;
    --INTERNAL--kendo-button-padding-y: 0.125rem;
    border-radius: 0.25rem !important;
    --INTERNAL--kendo-button-font-size: var(--kendo-font-size);
    --kendo-button-font-weight: var(--kendo-font-weight);
}
.k-button-group.custom-btn-group.selector > .k-button + .k-button {
    margin-inline-start: 0px !important;
}
.k-grid:not(.fullscreen) .custom-btn-group .k-button, .k-grid.fullscreen .custom-btn-group .k-button {
    --INTERNAL--kendo-button-padding-x: 0.25rem;
    --INTERNAL--kendo-button-padding-y: 0.125rem;
    border-radius: 0.25rem !important;
}

.custom-filter {}
    .custom-filter .k-filter-container .k-filter-group-main > .k-filter-toolbar,
    .custom-filter .k-filter-container .k-filter-group-main .k-filter-toolbar:after,
    .custom-filter .k-filter-container .k-filter-group-main .k-filter-toolbar::before { display:none; }
    .custom-filter.k-filter .k-filter-container .k-filter-lines, .custom-filter.k-filter .k-filter-container .k-filter-item {
        padding-inline-start: 0 !important;
    }
    .custom-filter .k-filter-container .k-filter-toolbar .k-filter-field,
    .custom-filter .k-filter-container .k-toolbar > .k-button.k-toolbar-button {
        display: none;
    }
    .custom-filter .k-filter-container .k-filter-toolbar .k-filter-value.k-toolbar-item .k-textbox { min-width:250px; }
    .custom-filter .k-filter-container .k-filter-toolbar .k-filter-operator.k-toolbar-item {
        width: 110px;
    }
    .custom-filter .k-input-button {
        --INTERNAL--kendo-input-button-padding-y: 0.25rem;
    }
    .custom-filter .k-input-inner {
        --INTERNAL--kendo-input-padding-x :0.25rem;
        --INTERNAL--kendo-input-padding-y:0.25rem ;
    }
.grid-auto-col-3 {
    display: grid;
    grid-template-columns: repeat(3, 33%);
}
.user-pool aside {
    height: calc(100vh - 267px);
}

.user-pool .k-list aside .k-list-item:hover {
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
    z-index: 1;
} 
.user-pool section {
    height: calc(100vh - 205px);
}
    .user-pool section .k-tilelayout .k-tilelayout-item > * {
        --kendo-card-body-padding-x: 0.5rem;
        --kendo-card-body-padding-y: 0.5rem;
        --kendo-card-header-padding-x: 0.5rem;
        --kendo-card-header-padding-y: 0.5rem;
    }
    .user-pool section .k-tilelayout .k-tilelayout-item-header.k-card-header .k-card-title {
        font-size: var(--kendo-font-size-sm, inherit);
    }

/*====== Login Page =====*/
.login-background {
    background: #DAEAFF;
    background-size: cover;
    background-repeat: no-repeat;
}

.login-card {
    background: linear-gradient(to bottom, white, #EDF6FF);
    padding: 10px;
    border-radius: 0.75rem;
    transition-duration: 500ms;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
    border: 1px solid transparent;
}

    .login-card:hover {
        box-shadow: 0 0 30px 10px rgba(0, 119, 255, 0.2);
        border-color: #93c5fd;
    }