@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
html,
body {
    font-family: "Roboto", sans-serif;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

:root {
    --primary-color: #8B1A47;
    /* --secondary-color: #7A153D; */
    --secondary-color: #6B0029;
    --light-bg: #F2EBEF;
    --hover-bg: #F1E3EA;
    --disabled-bg:#EDE8EA;
    --bg-color-1: #FAF7F9;
    --bg-color-2: #F3DEE6;
    --input-label-color: #767676;
    --input-border-color: #D8C9D1;
    --divider-line-color: #E6E6E6;
    --cell-border-color: #F5F5F5;
    --row-inactive-bg: #F8F8F8;
    --row-inactive-color: #868686;
    --border-color-1: #EFEFEF;
    --font-color: #1A0A0F;
    --font-color-2: #8D8080;
    --font-color-3: #6B6B6B;
    --font-color-4: #7A6068;
    --font-color-5: #757171;
    --font-14: 14px;
    --font-15: 15px;
    --font-16: 16px;
    --font-18: 18px;
    --line-h-18: 18px;
    --line-h-20: 20px;
    --line-h-24: 24px;
}

body {
    color: var(--font-color);
}

.btn.primary-btn, 
.btn.secondary-btn {
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
    padding: 4px 16px;
    border-radius: 5px;
    border: 1px solid;
    transition: 0.4s all;
    height: 40px;
    min-width: 90px;
    align-content: center;
}

.btn.primary-btn {
    color: #ffffff !important;
    background: var(--primary-color);
    border-color: var(--primary-color);
}

.btn.primary-btn:is(:hover, :active) {
    background: var(--secondary-color);
    border-color: var(--secondary-color);
}

.btn.secondary-btn {
    color: var(--primary-color);
    background: #FFFFFF;
    border-color: var(--primary-color);
}

.btn.secondary-btn:is(:hover, :active) {
    color: var(--secondary-color);
    background: var(--bg-color-2);
    border-color: var(--secondary-color);
}

.font-14 {
    font-size: var(--font-14) !important;
    line-height: var(--line-h-18) !important;
}

.font-15 {
    font-size: var(--font-15) !important;
    line-height: var(--line-h-18) !important;
}

.link-btn {
    color: var(--primary-color);
    text-decoration: none;
    transition: 0.4s ease;
}

.link-btn:hover {
    color: var(--secondary-color);
}

.red-color-txt {
    color: #EE1616 !important;
}

.black-color-txt {
    color: var(--font-color) !important;
}

.page-title {
    font-size: 1.5rem;
    line-height: 1.875rem;
    color: var(--font-color);
    font-weight: 700;
    margin-bottom: 0.9375rem;
}

.sub-title, 
.table-wrapper .tr-head td {
    font-size: var(--font-15);
    line-height: var(--line-h-18);
    font-weight: 600;
}

.flex-btw,
.details-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.flex-end {
    justify-content: flex-end;
}

.select-dropdown:not(.tree-select, .select-daterange) .dropdown-item,
.select-dropdown:not(.tree-select, .select-daterange) .select-btn,
.document-item,
.flex-end,
.flex-center-g-5,
.flex-center-g-10,
.flex-center-g-15,
.action-btn-wrapper,
.role-header-wrapper {
    display: flex;
    align-items: center;
}

.select-dropdown:not(.tree-select, .select-daterange) .dropdown-item,
.select-dropdown:not(.tree-select, .select-daterange) .select-btn,
.document-item,
.flex-center-g-5 {
    gap: 5px;
}

.flex-center-g-10,
.role-header-wrapper {
    gap: 0.625rem;
}

.flex-center-g-15 {
    gap: 0.9375rem;
}

.mb-3x {
    margin-bottom: 3px !important;
}

.mt-10 {
    margin-top: 0.625rem !important;
}

.mb-15 {
    margin-bottom:  0.9375rem !important;
}

.width-0 {
    width: 0 !important;
}

.breadcrumb-wrapper>.breadcrumb {
    margin-bottom: 0.375rem;
    gap: 0.3125rem;
}

.breadcrumb-wrapper>.breadcrumb .breadcrumb-item {
    font-size: var(--font-14);
    line-height: var(--line-h-18);
    font-weight: 500;
    padding: 0;
    color: var(--font-color-4);
}

.breadcrumb-wrapper>.breadcrumb>.breadcrumb-item+.breadcrumb-item::before {
    content: '';
    display: inline-block;
    background: url(../images/common/arrow_right.svg) center / contain no-repeat;
    width: 7px;
    height: 10px;
    vertical-align: middle;
    margin-right: 0.3125rem;
    float: unset;
    padding: 0;
}

.edit-btn {
    background: url(../images/theme/edit_icon.svg) center/contain no-repeat;
    width: 16px;
    height: 16px;
    display: inline-block;
    border: 0;
}

.delete-btn {
    background: url(../images/theme/delete_icon.svg) center/contain no-repeat;
    width: 15px;
    height: 16px;
    border: 0;
}

.btn.action-btn {
    background: url(../images/theme/three_dots.svg) center no-repeat #FFFFFF !important;
    width: 26px;
    height: 20px;
    border-radius: 5px;
    border: 1px solid var(--primary-color) !important;
}

.save-btn {
    background: url(../images/theme/tick_primary_icon.svg) center/contain no-repeat;
    width: 12px;
    height: 11px;
    border: 0;
}

.cancel-btn {
    background: url(../images/theme/close_primary_icon.svg) center/contain no-repeat; 
    width: 11px;
    height: 11px; 
    border: 0;
}

.info-btn {
    background: url(../images/theme/info_icon.svg) center/contain no-repeat;
    width: 16px;
    height: 16px;
    border: 0;
    outline: 5px solid transparent !important;
    transition: 0.3s ease;
    border-radius: 50%;
}

.info-btn:hover {
    outline-color: var(--hover-bg) !important;
}

.btn.action-btn.size-40 {
    width: 40px;
    height: 40px;
}

.action-btn-wrapper {
    gap: 0.5rem;
}

.cancel-btn.size-15 {
    width: 15px;
    height: 15px;
}

.save-btn.size-15 {
    width: 15px;
    height: 14px;
}

.action-btn-divider {
    background: var(--divider-line-color);
    width: 1px;
    height: 14px;
}

.badge.custom-badge {
    font-size: 13px;
    line-height: 16px;
    font-weight: 400;
    color: var(--font-color);
    border-radius: 2px;
    padding: 2px 0.5rem;
    min-width: 70px;
}

.badge.custom-badge.rounded-badge {
    font-size: 12px;
    line-height: 14px;
    font-weight: 400;
    padding: 3px 0.5rem;
    border-radius: 10px;
}

.grid-wrapper.tabulator .custom-badge,
.table-wrapper .custom-badge {
    width: 115px;
    padding-inline: 0.375rem;
}

.badge.custom-badge.badge-bg-1 {
    background: #9EE992;
}

.badge.custom-badge.badge-bg-2 {
    background: #B8EDA5;
}

.badge.custom-badge.badge-bg-3 {
    background: #FB9A9A;
}

.badge.custom-badge.badge-bg-4 {
    background: #FEE68F;
}

.badge.custom-badge.badge-bg-5 {
    background: #FFD200;
}

.badge.custom-badge.badge-bg-6 {
    background: #67D076;
}

.badge.custom-badge.badge-bg-7 {
    background: #FF3B29;
    color: #FFFFFF;
}

.badge.custom-badge.badge-bg-8 {
    background: #FF7F00;
    color: #FFFFFF;
}

.badge.custom-badge.badge-bg-9 {
    background: #5E96B7;
    color: #FFFFFF;
}

.badge.custom-badge.badge-bg-10 {
    background: #BD80FF;
    color: #FFFFFF;
}

.badge.custom-badge.badge-bg-11 {
    background: #ACACAC;
    color: #FFFFFF;
}

.badge.custom-badge.badge-bg-12 {
    background: #F5D186;
    color: #773200;
}

.badge.custom-badge.badge-bg-13 {
    background: #FFCE9D;
}

.badge.custom-badge.badge-bg-14 {
    color: var(--font-color-2);
    background: #A6E7FF;
}

.content-wrapper pre {
    font-family: "Roboto", sans-serif;
    white-space: pre-wrap;
    overflow: visible;
    max-width: 100%;
    overflow-wrap: break-word;
    color: var(--font-color);
}

label.error, 
.error-txt {
    color: #EE1616 !important;
    font-size: 12px !important;
    line-height: 16px;
    font-weight: 400;
    font-style: italic;
    position: absolute;
    left: 0;
    top: 100%;
}

.error-txt.error-text-without-scroll {
    left: 1.25rem;
    bottom: calc(100% - 8px);
    top: unset;
}

.redborder,
.multiselect-wrapper:has(.multiselect-validation) .multiselect {
    border: 1px solid #EE1616 !important;
}

.input-wrapper:not(:has(.input-range)) {
    position: relative;
    line-height: 0;
}

.input-wrapper .form-label {
    font-size: 15px;
    line-height: 18px;
    font-weight: 400;
    color: var(--input-label-color);
    margin-bottom: 3px;
}

.input-wrapper :where(.form-control, .form-select), 
.multiselect-wrapper .multiselect,
.select-dropdown .btn.select-btn,
.grid-wrapper .tabulator-row .tabulator-cell.tabulator-editing input {
    font-size: 14px;
    line-height: 18px;
    font-weight: 400;
    padding: 4px 8px;
    color: var(--font-color);
    box-shadow: none !important;
    border: 1px solid var(--input-border-color);
    border-radius: 5px;
}

.input-wrapper :where(.form-control:not(textarea), .form-select), 
.multiselect-wrapper .multiselect {
    height: 32px;
}

.input-wrapper .form-control::placeholder {
    font-style: italic;
}

.input-wrapper :where(.form-control:not(.redborder):focus, .form-select:focus),
.multiselect-wrapper .multiselect:focus,
.input-group:has(*:focus)>*,
.select-dropdown .btn.select-btn:focus,
.contact-input:has(>.form-control:not(.redborder):focus)>.multiselect-wrapper .multiselect,
.contact-input:has(>.multiselect-wrapper .multiselect:focus)>.form-control:not(.redborder) {
    border-color: var(--primary-color) !important;
}

.input-wrapper .form-select, 
.multiselect-wrapper .multiselect, 
.select-dropdown .btn.select-btn {
    background: url(../images/theme/primary_down_arrow.svg) calc(100% - 8px) center no-repeat #ffffff;
    padding-right: 22px !important;
}

.input-wrapper :where(.form-select:disabled, .form-control:disabled) {
    background-color: var(--disabled-bg) !important;
    color: var(--font-color-2);
}

.input-wrapper textarea.form-control {
    padding-block: 12px;
}

.input-wrapper .input-group {
    flex-wrap: nowrap;
}

.input-wrapper .form-control.input-h-30 {
    height: 30px;
}

.input-wrapper .form-select.without-icon,
.multiselect-wrapper .without-icon+.btn-group .multiselect {
    background-image: none;
}

.fixed-placeholder,
.input-control-label {
    font-size: 13px;
    line-height: 18px;
    font-weight: 400;
    color: var(--font-color-2);
}

.input-control-label {
    padding: 0.25rem 0.75rem;
    display: grid;
    place-items: center;
}

.inpu-label-with-btn {
    margin-bottom: 3px;  
}

.fixed-placeholder:not(.placeholder-postion-start) + .form-control {
    padding-right: 30px;
}

.table-wrapper .fixed-placeholder:not(.placeholder-postion-start) + .form-control {
    padding-right: 28px;
}

.input-datepicker .input-group-addon,
.input-control-label {
    border: 1px solid var(--input-border-color);
    border-radius: 5px;
    flex-shrink: 0;
}

.input-without-label-wrapper {
    margin-top: 27px;  
}

.input-datepicker .input-group-addon {
    width: 32px;
}

.input-datepicker .input-group-addon {
    background: url(../images/theme/calendar_icon.svg) center/15px no-repeat #FFFFFF;
    cursor: pointer;
}

.input-datepicker:has(.is-invalid) .input-group-addon {
    border-color: var(--bs-form-invalid-border-color);
}

.time-picker-btn {
    background: url(../images/theme/clock_icon.svg) center/15px no-repeat; 
    width: 32px;
    height: 30px;  
    border: 1px solid var(--input-border-color);
    border-inline: 0;
}

.input-range {
    appearance: none;
    -webkit-appearance: none;
    width: 100%;
    height: 5px;
    border-radius: 3px;
    transition: background 0.5s ease;
}

.input-range::-webkit-slider-thumb {
    appearance: none;
    -webkit-appearance: none;
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 50%;
    background: var(--primary-color);
    cursor: pointer;
    box-shadow: 0px 2px 2px 0px #3A2F3518;
}

.input-range::-moz-range-thumb {
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 50%;
    background: var(--primary-color);
    cursor: pointer;
    box-shadow: 0px 2px 2px 0px #3A2F3518;
    border: 0;
}

.range-values {
    margin-top: 6px;
    font-size: 13px;
    line-height: 16px;
    letter-spacing: 0.01em;
    font-weight: 400;
    color: var(--font-color-2);
}

.time-picker-dropdown .dropdown-menu,
.ui-widget.ui-widget-content,
.dropdown-menu-scroll {
    max-height: 16rem;
    overflow-y: auto;
}

.time-picker-dropdown {
    line-height: 0;
}

.input-wrapper :where(.form-select:focus-visible, .form-control:focus-visible),
.multiselect-wrapper .multiselect:focus-visible,
.select-dropdown .btn.select-btn:focus-visible {
    outline: none;
}

.content-wrapper .form-control::placeholder,
.multiselect-wrapper .multiselect-container .multiselect-filter>input.multiselect-search::placeholder {
    color: var(--input-label-color);
}

.multiselect-wrapper .multiselect {
    padding-block: 2px !important;
}

.custom-check-wrapper,
.multiselect-wrapper:not(.single-selection) .multiselect .multiselect-selected-text,
.multiselect-wrapper .multiselect-container .dropdown-item .form-check,
.multiselect-wrapper .multiselect-container .multiselect-group {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.custom-check-wrapper .form-check-input,
.multiselect-wrapper .multiselect-container .dropdown-item .form-check .form-check-input {
    width: 17px;
    height: 17px;
    border: 0;
    margin: 0;
    background: url(../images/theme/checkbox_normal.svg) center/contain no-repeat;
    border-radius: 2px;
    box-shadow: none;
    flex-shrink: 0;
}

.custom-check-wrapper .form-check-input:checked,
.multiselect-wrapper .multiselect-container .dropdown-item .form-check .form-check-input:checked {
    background: url(../images/theme/checkbox_active.svg) center/contain no-repeat;   
}

.custom-check-wrapper .form-check-input.normal-disable-check:disabled {
    background: url(../images/theme/checkbox_disabled.svg) center/contain no-repeat;
    opacity: 1;
}

.multiselect-wrapper .multiselect-container {
    border-radius: 0 0 5px 5px;
    width: 100%;
    max-height: 17rem;
    min-width: 12.5rem;
    overflow-y: auto;
    overflow-x: hidden;
}

.multiselect-wrapper .multiselect-container:not(.multiselect-container-fixed)[data-popper-placement^="top-"] {
    transform: unset !important;
    inset: auto auto calc(100% + 2px) !important;
}

.multiselect-wrapper span.multiselect-native-select {
    display: block;
}

.multiselect-wrapper .multiselect-container .dropdown-item,
.multiselect-wrapper .multiselect-container .dropdown-item-text.multiselect-group {
    padding: 0.5rem 0.75rem; 
    color: var(--font-color) !important;
    transition: 0.3s all;
    font-weight: 400;
    font-size: var(--font-14);
    line-height: var(--line-h-18)
}

.multiselect-wrapper .multiselect-container .dropdown-item .form-check {
    margin-bottom: 0;
    padding: 0;
    min-height: auto;
}

.multiselect-wrapper .multiselect-container .dropdown-item.multiselect-group .form-check {
    display: flex !important;
    margin-left: 0;
    min-width: 0;
}

.multiselect-wrapper .dropdown-item .form-check-label {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.multiselect-wrapper .multiselect-container .multiselect-filter>input.multiselect-search {
    margin-left: 0;
    background: url(../images/common/search_icon.svg) calc(100% - 8px) center no-repeat;
    padding: 0.25rem 28px 0.25rem 0.75rem;
    height: 30px;
    box-shadow: 0px 0px 3.8px 0px #3A2F3518 !important;
    border: 0;
    border-radius: 5px;
}

.multiselect-wrapper .multiselect-container .multiselect-filter i,
.single-selection .multiselect-container .form-check-input,
.single-selection .multiselect-container .dropdown-item.disabled,
.multiselect-wrapper.multiselect-option-hide .multiselect-container .dropdown-item.disabled,
.grid-wrapper.tabulator .tabulator-table .tabulator-row .tabulator-cell.no-child .tabulator-data-tree-control {
    display: none !important;
}

.multiselect-wrapper .multiselect-container .multiselect-filter {
    padding: 0.625rem 0.75rem;
}

.multiselect-wrapper .multiselect-container .multiselect-filter {
    position: sticky;
    top: 1px;
    background: #ffffff;
    z-index: 1;
}

/* .selected-count {
    font-weight: 400;
    font-size: 12px;
    line-height: 25px;
    color: var(--text-color-4);
    border-radius: 50%;
    background: var(--bg-color-secondary);
    width: 25px;
    height: 25px;
    display: inline-block;
    text-align: center;
    flex-shrink: 0;
    margin-right: 6px;
} */

.multiselect-wrapper .multiselect-container .multiselect-group .dropdown-toggle::after,
.grid-wrapper.tabulator .tabulator-row .tabulator-cell .tabulator-data-tree-control :where(.tabulator-data-tree-control-expand, .tabulator-data-tree-control-collapse),
.grid-wrapper.tabulator .tabulator-row.tabulator-group .tabulator-arrow {
    background: url(../images/theme/primary_down_arrow_fill.svg) center/contain no-repeat;
    width: 11px;
    height: 7px;
}

.multiselect-wrapper .multiselect-container .multiselect-group .dropdown-toggle::after {
    border: 0;
    vertical-align: middle;
    transform: rotate(180deg) translateY(2px);
    transition: 0.2s ease;
}

.multiselect-wrapper .multiselect-container .multiselect-group.closed .dropdown-toggle::after {
    transform: rotate(0deg);
}

.multiselect-wrapper .multiselect-container .dropdown-item.multiselect-group-option-indented-full {
    padding-left: 54px;
}

.multiselect-wrapper .multiselect-container .dropdown-item.multiselect-group,
.multiselect-wrapper .multiselect-container .dropdown-item-text.multiselect-group,
.custom-dropdown.tree-select .dropdown-menu .dropdown-item:has(.input-search):hover,
.tree-select.dropdown-menu-outside .dropdown-item:has(.input-search):hover,
.tree-select .dropdown-menu-outside .dropdown-item:has(.input-search):hover {
    background: #FFFFFF !important;
}

.multiselect-wrapper:not(.single-selection) .multiselect .multiselect-selected-text {
    justify-content: space-between;
}

.multiselect-wrapper .multiselect:disabled {
    background-color: var(--disabled-bg);
}

.multiselect-wrapper .multiselect-container .dropdown-item-text.multiselect-group {
    font-weight: 500;
}

.multiselect-wrapper.single-selection .multiselect:disabled {
    color: var(--font-color-2);
}

.custom-dropdown .dropdown-menu, 
.dropdown-menu-outside,
.multiselect-wrapper .multiselect-container, 
.ui-widget.ui-widget-content {
    border: 0;
    padding: 0;
    box-shadow: 0px 1px 19px 0px #3A2F3518;
}

.custom-dropdown .dropdown-menu,
.custom-dropdown .dropdown-menu>*:last-child, 
.dropdown-menu-outside>*:last-child,
.dropdown-menu-outside,
.custom-dropdown .dropdown-menu>*:last-child>.dropdown-item,  
.ui-widget.ui-widget-content, 
.ui-widget.ui-widget-content .ui-menu-item:last-child .ui-menu-item-wrapper {
    border-radius: 0 0 0.3125rem 0.3125rem !important;
}

.custom-dropdown .dropdown-menu .dropdown-item,
.dropdown-menu-outside .dropdown-item {
    font-size: var(--font-14);
    line-height: var(--line-h-18);
    font-weight: 400;
    color: var(--font-color);
    padding: 0.5rem 0.75rem;
    transition: 0.4s ease;
}

.custom-dropdown:not(.manage-columns-dropdown) .dropdown-menu .dropdown-item:is(:focus, :hover, :active),
.dropdown-menu-outside .dropdown-item:is(:focus, :hover, :active),
.custom-dropdown:not(.manage-columns-dropdown) .dropdown-menu .dropdown-item.active,
.dropdown-menu-outside .dropdown-item.active,
.multiselect-wrapper .multiselect-container .dropdown-item:not(.multiselect-group):is(:focus, :hover, :active),
.multiselect-wrapper .multiselect-container .dropdown-item:not(.multiselect-group).active {
    background: var(--hover-bg) !important;
}

.ui-widget.ui-widget-content .ui-menu-item-wrapper {
    border: 0 !important;
    color: var(--font-color);
    font-family: "Roboto", sans-serif;
    margin: 0 !important;
    padding: 0.5rem 0.75rem;
}

.custom-scrollbar::-webkit-scrollbar,
.grid-wrapper.tabulator .tabulator-tableholder::-webkit-scrollbar {
    width: 0.5rem;
    height: 0.5rem;
}

.multiselect-wrapper .multiselect-container::-webkit-scrollbar,
.custom-dropdown .dropdown-menu::-webkit-scrollbar,
.dropdown-menu-outside::-webkit-scrollbar,
.ui-widget.ui-widget-content::-webkit-scrollbar,
.select-dropdown-container>.custom-scrollbar::-webkit-scrollbar,
.tree-select .jstree-wholerow-ul::-webkit-scrollbar {
	width: 0.3125rem;
    height: 0.3125rem;
}

.custom-scrollbar::-webkit-scrollbar-track,
.multiselect-wrapper .multiselect-container::-webkit-scrollbar-track,
.grid-wrapper.tabulator .tabulator-tableholder::-webkit-scrollbar-track,
.custom-dropdown .dropdown-menu::-webkit-scrollbar-track,
.dropdown-menu-outside::-webkit-scrollbar-track,
.tree-select .jstree-wholerow-ul::-webkit-scrollbar-track,
.ui-widget.ui-widget-content::-webkit-scrollbar-track {
    background: var(--divider-line-color);
}

.custom-scrollbar::-webkit-scrollbar-thumb,
.multiselect-wrapper .multiselect-container::-webkit-scrollbar-thumb,
.grid-wrapper.tabulator .tabulator-tableholder::-webkit-scrollbar-thumb,
.custom-dropdown .dropdown-menu::-webkit-scrollbar-thumb,
.dropdown-menu-outside::-webkit-scrollbar-thumb,
.tree-select .jstree-wholerow-ul::-webkit-scrollbar-thumb,
.ui-widget.ui-widget-content::-webkit-scrollbar-thumb {
    background: var(--primary-color);
    border-radius: 0.375rem;
}

.contact-input .multiselect-wrapper>select.form-select,
.contact-input .multiselect-wrapper .multiselect {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right: 0;
}

.contact-input .multiselect-wrapper .multiselect-container {
    min-width: 8.75rem;
    max-height: 15.75rem;
}

.contact-input .multiselect-wrapper .multiselect {
    width: 74px !important;
}

.contact-input .multiselect-wrapper .multiselect-container .no_data_display {
    padding-inline: 0.5rem;
}

.contact-input:has(>.form-control.redborder)>.multiselect-wrapper .multiselect {
    border-color: #EE1616 !important;
}

.custom-dropdown .dropdown-toggle::after {
    background: url(../images/theme/primary_down_arrow.svg) center no-repeat;
    width: 11px;
    height: 7px;
    vertical-align: middle;
    border: none;
    margin-left: 0.5rem;
}

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration,
.toast-wrapper.toast:not(.show) {
  display: none;
}

.input-wrapper.input-search:not(.input-search-border) .form-control {
    box-shadow: 0px 0px 3.8px 0px #3A2F3518 !important;
    border: unset;
}

.input-wrapper.input-search:not(.input-search-h-30) .form-control {
    padding-inline: 12px 34px;
}

.input-wrapper.input-search.input-search-h-30 .form-control {
    padding-right: 24px;
}

.input-search::after {
    content: '';
    background: url(../images/common/search_icon.svg) center/contain no-repeat;
    width: 17px;
    height: 17px;
    right: 12px;
}

.input-search.input-search-h-30::after {
    width: 14px;
    height: 14px;
    right: 8px;
}

.input-search::after,
.fixed-placeholder,
.input-info-wrapper {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
}

.fixed-placeholder:not(.placeholder-postion-start),
.input-info-wrapper {
    right: 8px;
}

.fixed-placeholder.placeholder-postion-start {
    left: 8px;
}

.fixed-placeholder {
    width: fit-content;
}

.check-label,
p,
.ui-widget.ui-widget-content .ui-menu-item-wrapper,
.input-info pre,
.input-info :where(p, li) {
    font-size: var(--font-14);
    line-height: var(--line-h-18);
    font-weight: 400;
}

.input-info-wrapper {
    z-index: 1;
    width: fit-content;
    line-height: 0;
}

.input-info-wrapper.postion-start {
    right: unset;
    left: 8px;
}

.input-wrapper:not(.input-with-infoicon-start):has(.input-info-wrapper.d-none) .form-control {
    padding-right: 8px;
}

.input-wrapper.input-with-infoicon-start:has(.input-info-wrapper.d-none) .form-control {
    padding-left: 8px;
}

.input-wrapper:has(.form-select:not(:disabled)) .input-info-wrapper {
    right: 24px;
}

.input-wrapper:not(.input-with-infoicon-start):has(.info-btn:not([style*="display: none;"])) .form-control {
    padding-right: 24px;
}

.input-wrapper:not(.input-with-infoicon-start):has(.info-btn:not([style*="display: none;"])) .form-select {
    padding-right: 54px;
}

.input-wrapper.input-with-infoicon-start:has(.info-btn:not([style*="display: none;"])) .form-control {
    padding-left: 22px;
}

.select-dropdown .btn.select-btn {
    min-width: 7.625rem;
    height: 32px;
    text-align: left;
}

.select-dropdown .dropdown-menu {
    width: 100%;
    min-width: 0;
}

.select-dropdown.view-mode-dropdown .dropdown-menu {
    width: auto;
    min-width: 100%;
}

.list-icon,
.map-icon,
.calendar-icon {
    width: 14px;
    height: 13px;
    display: inline-block;
    flex-shrink: 0;
}

.customer-icon,
.tile-icon,
.supplier-icon {
    width: 14px;
    height: 14px;
    display: inline-block;
    flex-shrink: 0;
}

.description-icon,
.project-stage-icon {
    width: 14px;
    height: 15px;
    display: inline-block;
    flex-shrink: 0;
}

.list-icon {
    background: url(../images/common/list_view_icon.svg) center/contain no-repeat;
}

.map-icon {
    background: url(../images/common/map_view_icon.svg) center/contain no-repeat;
}

.tree-icon {
    background: url(../images/common/tree_view_icon.svg) center/contain no-repeat;
    width: 15px;
    height: 14px;
    display: inline-block;
}

.tile-icon {
    background: url(../images/common/tile_view_icon.svg) center/contain no-repeat;
}

.description-icon {
    background: url(../images/common/description_icon.svg) center/contain no-repeat;
}

.project-stage-icon {
    background: url(../images/common/project_stage_icon.svg) center/contain no-repeat;
}

.customer-icon {
    background: url(../images/common/user_round_icon.svg) center/contain no-repeat;
}

.supplier-icon {
    background: url(../images/common/supplier_icon.svg) center/contain no-repeat;
}

.calendar-icon {
    background: url(../images/common/calendar_view_icon.svg) center/contain no-repeat;
}

.select-dropdown .dropdown-item.active .list-icon,
.select-dropdown .btn.select-btn .list-icon {
    background: url(../images/theme/list_view_active_icon.svg) center/contain no-repeat; 
}

.select-dropdown .dropdown-item.active .tree-icon,
.select-dropdown .btn.select-btn .tree-icon {
    background: url(../images/theme/tree_view_active_icon.svg) center/contain no-repeat; 
}

.select-dropdown .dropdown-item.active .map-icon,
.select-dropdown .btn.select-btn .map-icon {
    background: url(../images/theme/map_view_active_icon.svg) center/contain no-repeat; 
}

.select-dropdown .dropdown-item.active .tile-icon,
.select-dropdown .btn.select-btn .tile-icon {
    background: url(../images/theme/tile_view_active_icon.svg) center/contain no-repeat;
}

.select-dropdown .dropdown-item.active .description-icon,
.select-dropdown .btn.select-btn .description-icon {
    background: url(../images/theme/description_active_icon.svg) center/contain no-repeat;
}

.select-dropdown .dropdown-item.active .project-stage-icon,
.select-dropdown .btn.select-btn .project-stage-icon {
    background: url(../images/theme/project_stage_active_icon.svg) center/contain no-repeat;
}

.select-dropdown .dropdown-item.active .customer-icon,
.select-dropdown .btn.select-btn .customer-icon {
    background: url(../images/theme/user_round_active_icon.svg) center/contain no-repeat;
}

.select-dropdown .dropdown-item.active .supplier-icon,
.select-dropdown .btn.select-btn .supplier-icon {
    background: url(../images/theme/supplier_active_icon.svg) center/contain no-repeat;
}

.select-dropdown .dropdown-item.active .calendar-icon,
.select-dropdown .btn.select-btn .calendar-icon {
    background: url(../images/theme/calendar_view_active_icon.svg) center/contain no-repeat;
}

.tree-select .dropdown-item.link-btn {
    font-size: var(--font-15);
    font-weight: 500;
    color: var(--primary-color) !important;
}

.tree-select .jstree-default .jstree-icon.jstree-ocl {
    background: url(../images/theme/primary_down_arrow.svg) center/11px no-repeat !important;
    height: 36px !important;
    transition: 0.3s ease;
}

.tree-select .jstree-default>.jstree-no-dots .jstree-leaf>.jstree-ocl {
    visibility: hidden;
}

.tree-select .jstree-default .jstree-anchor {
    color: var(--font-color);
    font-weight: 400;
    font-size: var(--font-14);
    padding: 0 0 0 7px;
    line-height: 36px;
    height: 36px;
    text-overflow: ellipsis;
    overflow: hidden;
    width: calc(100% - 24px);
}

.tree-select .jstree-default .jstree-wholerow {
    height: 36px;
}

.tree-select .jstree-default>.jstree-no-dots .jstree-open>.jstree-ocl {
    transform: rotate(180deg);
}

.tree-select .jstree-wholerow-ul {
    width: 100%;
}

.select-dropdown.tree-select .jstree-wholerow-ul,
.dropdown-menu-outside.tree-select .jstree-wholerow-ul {
    padding-left: 6px;
    max-height: 13.625rem;
    overflow: auto;
}

.tree-select .jstree-default>.jstree-no-dots .jstree-node:not(.jstree-leaf)>.jstree-ocl + .jstree-anchor {
    font-weight: 500;
}

.tree-select .jstree-default .jstree-wholerow-clicked,
.tree-select .jstree-default .jstree-wholerow-hovered {
    background: var(--hover-bg);
}

.tree-select .jstree-default .jstree-search {
    font-style: normal;
}

.tree-select .jstree-default .jstree-anchor .jstree-icon.jstree-checkbox {
    background: url(../images/theme/checkbox_normal.svg) center/17px no-repeat;
    width: 17px;
    height: 36px;
    margin-right: 8px;
}

.tree-select .jstree-default .jstree-anchor.jstree-clicked .jstree-icon.jstree-checkbox {
    background: url(../images/theme/checkbox_active.svg) center/17px no-repeat;
}

.select-dropdown.tree-select .jstree-default .jstree-anchor,
.dropdown-menu-outside.tree-select .jstree-default .jstree-anchor {
    padding: 0 12px 0 0;
}

.tree-select.categories-filter-tree .jstree-default .jstree-wholerow-clicked, 
.tree-select.categories-filter-tree .jstree-default .jstree-wholerow-hovered {
    background: transparent;
}

.tree-select .jstree-default .jstree-leaf.inactive .jstree-anchor {
    color: var(--row-inactive-color);
    cursor: default;
}

.tree-select .jstree-default .jstree-leaf.inactive .jstree-wholerow {
    background: var(--row-inactive-bg);
    cursor: default;
}

.tree-select .dropdown-menu-outside {
    width: 100%;
    z-index: 20;
    background: #FFFFFF;
    min-width: 0;
}

.tree-select-btn {
    gap: 0.5rem;
}

.filter-wrapper {
    margin-bottom: 0.9375rem;
}

.filter-wrapper .input-wrapper:not(.filter-dropdown .input-wrapper) :where(.form-control:not(textarea), .form-select), 
.filter-wrapper .multiselect-wrapper .multiselect,
.filter-wrapper .select-dropdown .btn.select-btn {
    height: 40px;
}

.filter-wrapper .input-datepicker .input-group-addon {
    width: 40px;
    background-size: 16px;
}

.filter-wrapper .btn.secondary-btn, 
.filter-wrapper .btn.primary-btn,
.custom-dropdown:not(.nav-item) .dropdown-menu,
.dropdown-menu-outside {
    min-width: 7.5rem;
}

.spinner-wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.spinner-wrapper.fixed-spinner {
    position: fixed;
    width: 100%;
    height: 100svh;
    z-index: 9;
    display: grid;
    place-items: center;
}

.spinner {
    width: 4.5rem;
    height: 4.5rem;
    border: 7px solid var(--bg-color-2);
    border-bottom-color: var(--primary-color);
    border-radius: 50%;
    animation: rotation 1s linear infinite;
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.file-upload-btn {
    background: url(../images/theme/plus_icon.svg) center no-repeat #FFFFFF;
    border: 2px dashed var(--input-border-color);
    cursor: pointer;
}

.file-upload-btn,
.upload-item {
    width: 9.0625rem;
    height: 8.4375rem;
    border-radius: 5px;
}

.upload-items-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 0.625rem;
}

.btn.attachment-btn {
    padding-inline: 0.75rem;
    height: 32px;
    font-size: 15px;
    line-height: 20px
}

.btn.secondary-btn.attachment-btn {
    border: dashed 2px;
}

.attachment-btn::before,
.download-icon::before {
    content: '';
    display: inline-block;
    margin-right: 5px;
    flex-shrink: 0;
}

.attachment-btn::before {
    background: url(../images/theme/upload_icon.svg) center/contain no-repeat;
    width: 12px;
    height: 11px;
}

.primary-btn.attachment-btn::before {
    background: url(../images/common/upload_white_icon.svg) center/contain no-repeat;
    width: 13px;
    height: 13px;
}

.download-icon::before {
    background: url(../images/common/download_white_icon.svg) center/contain no-repeat;
    width: 14px;
    height: 14px;   
}

.document-item {
    border: 1px solid var(--input-border-color);
    border-radius: 5px;
    padding: 2px 0.5rem;
    min-width: 0;
    height: 32px;
}

.document-icon {
    width: 15px;
    height: 18px;
    flex-shrink: 0;
}

.pdf-icon {
    background: url(../images/common/pdf_icon.svg) center/contain no-repeat;
}

.img-icon {
    background: url(../images/common/img_icon.svg) center/contain no-repeat;
}

.excel-icon {
    background: url(../images/common/excel_icon.svg) center/contain no-repeat;
}

.doc-icon {
    background: url(../images/common/document_icon.svg) center/contain no-repeat;
}

.document-close {
    background: url(../images/common/close_white.svg) center/6px no-repeat #505050;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 0;
    transition: 0.4s ease;
    cursor: pointer;
    flex-shrink: 0;
}

.document-close:hover {
    background-color: var(--font-color-5);
}

.toggle-btn {
    width: 30px;
    height: 16px;
    background: #9F9F9F;
    position: relative; 
    transition: 0.4s;
    border-radius: 20px;
    cursor: pointer;
}

.toggle-btn::before {
    content: '';
    height: 12px;
    width: 12px;
    background: #FFFFFF;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 2px;
    transition: 0.4s;
    border-radius: 50%;
}

.toggle-btn:has(input:checked) {
    background: var(--primary-color);
}

.toggle-btn:has(input:checked)::before {
    transform: translate(14px, -50%);
}

.initial-add>.no-data-wrapper {
    border: 1px solid var(--divider-line-color);
    border-radius: 5px;
    min-height: 40vh;
    padding: 1.5rem;
    align-content: center;
    text-align: center;
    flex-grow: 1;
    color: var(--input-label-color);
}

.initial-add>.no-data-wrapper .btn {
    min-width: 9.375rem;
    margin-top: 12px;
}

.content-wrapper {
    background: var(--light-bg);
    padding: 1.25rem 1.5rem;
    min-height: calc(100svh - 55px);
}

.container-wrapper {
    min-height: calc(100svh - calc(55px + 2.5rem));
    display: flex;
    flex-direction: column;
}

.details-wrapper,
.tabulator.grid-wrapper {
    box-shadow: 0px 0px 12px -1px #3A2F3518;
    background: #FFFFFF;
    border-radius: 5px;
}

.details-header {
    background: var(--bg-color-2);
    gap: 0.9375rem;
    padding: 0.5rem 1rem;
}

.details-body,
.details-wrapper,
.tab-wrapper .tab-content {
    padding: 1rem;
}

.details-wrapper>.details-header:first-child,
.datepicker.datepicker-dropdown.datepicker-orient-top {
    border-radius: 5px 5px 0 0;
}

.footer-btn-wrapper {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.9375rem;
    margin-top: 2rem;
}

.input-info>p:first-child {
    color: var(--input-label-color);
}

.input-info>p:first-child {
    margin-bottom: 0.375rem;
    text-transform: uppercase;
}

.input-info :where(p, li) {
    word-wrap: break-word;
}

.input-info :where(ul, ol) {
    padding-left: 0.9375rem;
    margin-bottom: 0;
}

.input-info :where(ul, ol) li:not(:last-child) {
    margin-bottom: 2px;
}

.tab-wrapper .nav-tabs .nav-link {
    border: 0;
    margin: 0;
    color: var(--primary-color);
    padding:  0.625rem 1rem;
    font-weight: 400;
}

.tab-wrapper .nav-tabs .nav-link.active,
.multiselect-wrapper .multiselect-container .dropdown-item-text.multiselect-group {
    font-weight: 500;
}

.tab-wrapper .nav-tabs .nav-link::after {
    content: '';
    width: 0;
    height: 4px;
    background: var(--primary-color);
    transition: 0.5s ease;
    position: absolute;
    left: 0;
    bottom: 0;
}

.tab-wrapper .nav-tabs .nav-link.active::after {
    width: 100%;
}

.vertical-tab-wrapper .tab-content {
    padding: 1.25rem;
}

.vertical-tab-wrapper .nav-pills .nav-link {
    padding:  0.625rem 1rem;
    text-align: left;
    color: var(--font-color-5);
    border-radius: 0;
}

.vertical-tab-wrapper .nav-pills .nav-link.active {
   color: #FFFFFF;
   font-weight: 500;
   background: var(--primary-color); 
}

.vertical-tab-wrapper .nav-pills {
    box-shadow: 3px 3px 4px 0px #0000000D;
    padding-top: 1.25rem;
    width: 25%;
    max-width: 18.75rem;
    flex-shrink: 0;
}

.vertical-tab-wrapper .tab-content {
    flex-grow: 1;
    min-width: 0;
}

.modal.modal-wrapper .modal-content {
    border: 0;
    box-shadow: 0px 1px 19px 0px #3A2F3518;
    border-radius: 5px;
}

.modal.modal-wrapper .modal-header {
    border-bottom: 1px solid #CFCFCF;
    padding: 0.8125rem 1.25rem;
    justify-content: space-between;
    gap: 1.5rem;
}

.modal.modal-wrapper .modal-header .modal-title,
.offcanvas.sidebar-wrapper .offcanvas-header .offcanvas-title {
    font-size: var(--font-18);
    line-height: var(--line-h-24);
    font-weight: 700;
    color: var(--font-color);
}

.modal.modal-wrapper .modal-header .btn-close,
.offcanvas.sidebar-wrapper .offcanvas-header .btn-close {
    background: url(../images/common/close_icon.svg) center/contain no-repeat;
    width: 15px;
    height: 15px;
    opacity: 1;
    margin: 0;
    padding: 0;
    border-radius: 0;
    box-shadow: none;
}

.modal.modal-wrapper .modal-body {
    padding: 1.25rem 1.25rem 1.125rem;
}

.modal.modal-wrapper .modal-footer {
    border: 0;
    padding: 1.375rem 1.25rem 1.875rem;
    gap: 0.9375rem;
}

.modal.modal-wrapper .modal-footer>* {
    margin: 0;
}

.modal.modal-wrapper .modal-dialog {
    padding: 5svh 1.5rem;
    max-width: 930px;
}

.modal.modal-wrapper.without-modal-footer .modal-body {
    padding-bottom: 1.25rem;
}

.modal-wrapper :where(.details-header, .details-body),
.modal-wrapper .tab-wrapper:not(.tabs-border) .nav-tabs .nav-link,
.modal-wrapper .tab-wrapper:not(.tabs-border) .tab-content,
.modal-wrapper .tab-wrapper .tab-content .comments-tab {
    padding-inline: 1.25rem;
}

.modal.modal-wrapper.nested_modal {
    z-index: 1056;
}

.modal.modal-wrapper.add-unit-modal .modal-dialog {
    max-width: 548px;
}

.modal.modal-wrapper.confirmation-modal .modal-dialog {
    max-width: 430px;
}

.offcanvas.sidebar-wrapper {
    border: 0;
    box-shadow: 0px 1px 7px 2px #3A2F3518;
    max-width: 1130px;
    width: 80%;
}

.offcanvas.sidebar-wrapper .offcanvas-header {
   padding: 0.8125rem 1.25rem;
   border-bottom: 1px solid var(--divider-line-color);
   justify-content: space-between;
   gap: 1rem;
   position: relative;
   background: #FFFFFF;
}

.offcanvas.sidebar-wrapper .offcanvas-body {
    background: var(--light-bg);
    padding: 1rem 1.25rem;
}

.tooltip.tooltip-wrapper {
    opacity: 1;
}

.tooltip.tooltip-wrapper .tooltip-inner,
.custom-tooltip-content {
    background: #424242;
    border: 1px solid var(--border-color-1);
    border-radius: 2px;
    padding: 5px 8px;
    font: 400 13px/15px "Roboto", sans-serif;
}

.custom-tooltip-content {
    color: #FFFFFF;
    white-space: nowrap;
}

.datepicker-dropdown:before,
.datepicker-dropdown:after,
.tooltip-wrapper .tooltip-arrow::before,
.popover-wrapper.popover .popover-arrow::before,
.tabulator.grid-wrapper .tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-expand:after,
.tabulator.grid-wrapper .tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-collapse:after {
    content: none;
}

.datepicker.datepicker-dropdown {
    width: 17.5rem;
    box-shadow: 0px 1px 12.1px 0px #3A2F3518;
    background: #FFFFFF;
    border-radius: 0 0 5px 5px;
    border: 0;
    padding: 0;
}

.datepicker.datepicker-dropdown table {
    color: var(--font-color);
    width: 100%;
    table-layout: fixed;
}

.datepicker table thead tr:nth-child(2) {
    background: var(--primary-color);
    height: 2.1875rem;
}

.datepicker table thead tr:nth-child(2) th,
.datepicker table tr td.day.range:hover {
    border-radius: 0;
}

.datepicker .datepicker-switch {
    color: #FFFFFF;
    font-weight: 600;
}

.datepicker .datepicker-switch,
.datepicker .datepicker-days table thead tr:last-child th,
.datepicker .datepicker-days table tbody tr td,
.datepicker table tr td span,
.no-result-without-icon.no_data_display p,
.multiselect-container .no_data_display p,
.custom-dropdown .no_data_display p {
    font-size: var(--font-15);
    line-height: var(--line-h-18);
    letter-spacing: 0.01em;
}

.datepicker .datepicker-switch:hover {
    background: transparent;
}

.datepicker .prev,
.datepicker .next {
    color: transparent !important;
    background: url(../images/common/arrow_right_white.svg) center/7px no-repeat !important;
}

.datepicker .next.disabled, 
.datepicker .prev.disabled {
    visibility: visible !important;
    pointer-events: none;
    background: url(../images/common/arrow_disabled.svg) center/7px no-repeat !important;
}

.datepicker .prev {
    transform: scale(-1);
}

.datepicker .datepicker-months table thead tr:nth-child(2) th,
.datepicker .datepicker-years table thead tr:nth-child(2) th {
    min-width: 2.5rem;
}

.datepicker .datepicker-days table thead tr:last-child th {
    font-weight: 400;
    color: var(--font-color-5);
    height: 2.25rem;
}

.datepicker .datepicker-days table tbody tr td,
.datepicker table tr td span {
    color: var(--font-color) !important;
}

.datepicker .datepicker-days table tbody tr td {
    border-top: 1px solid #F2F2F2 !important;
    height: 2.5rem;
    padding: 2px;
}

.datepicker table tr td.new,
.datepicker table tr td.old {
    height: 0 !important;
    line-height: 0 !important;
    visibility: hidden;
    padding: 0 !important;
}

.datepicker .datepicker-days table tbody tr td {
    border-radius: 0;
    text-shadow: none !important;
}

.datepicker table td.day.today,
.datepicker table td.day.selected,
.datepicker table tr td span.focused,
.datepicker table tr td.active.active,
.datepicker table tr td span.active.active {
    border-radius: 50%;
}

.datepicker table tr td.day:not(.disabled,.range):hover,
.datepicker table tr td span:not(.new):not(.old):not(.disabled):hover,
.datepicker table tr td.day.range:hover,
.datepicker table tr td.range.today:hover:hover,
.datepicker table td.day.today,
.datepicker table td.day.selected,
.datepicker table tr td span.focused,
.datepicker table tr td.active.active,
.datepicker table tr td span.active.active,
.datepicker table tr td.range,
.datepicker table tr td.range.today,
.datepicker table tr td.range.today:hover {
    background: var(--hover-bg);
}

.datepicker table tr td.day:not(.disabled,.range):hover,
.datepicker table tr td span:not(.new):not(.old):not(.disabled):hover {
    border-radius: 50%;
}

.datepicker table tr td span.new:hover,
.datepicker table tr td span.old:hover {
    background: transparent;
}

.datepicker table tr td span {
    height: 2.5rem;
    line-height: 2.5rem !important;
    border-radius: 5px !important;
}

.datepicker table tr td.disabled, 
.datepicker table tr td.disabled:hover,
.datepicker table tr td span.disabled,
.datepicker table tr td span.disabled:hover,
.datepicker .datepicker-days table tbody tr td.disabled {
    color: #D6D6D6 !important;
    background: #FFFFFF !important;
}

.datepicker table tr td.range.today {
    border-color: transparent;
}

.datepicker table tr td.selected.range-start{
    border-radius: 5px 0 0 5px !important;
}

.datepicker table tr td.selected.range-end {
    border-radius: 0 5px 5px 0 !important;
}

.datepicker.datepicker-orient-top table thead tr:nth-child(2) th:first-child {
    border-top-left-radius: 5px;
}

.datepicker.datepicker-orient-top table thead tr:nth-child(2) th:last-child {
    border-top-right-radius: 5px;
}

/*-- grid style --*/

.grid-wrapper.tabulator {
    border: 0;
    height: auto !important;
}

.grid-wrapper.border-grid.tabulator,
.details-wrapper.border-wrapper,
.tabs-border {
    box-shadow: none;
    border: 1px solid var(--divider-line-color)
}

.grid-wrapper.tabulator .tabulator-header {
    background: #FFFFFF;
    border-bottom: 1px solid var(--divider-line-color);
    font-weight: 400;
    color: var(--input-label-color);
}

.grid-wrapper.tabulator .tabulator-header .tabulator-col {
    border-right: 0;
    background: #FFFFFF !important;
    text-transform: uppercase;
}

.grid-wrapper.tabulator .tabulator-header .tabulator-frozen.tabulator-frozen-right,
.grid-wrapper.tabulator .tabulator-row .tabulator-cell.tabulator-frozen.tabulator-frozen-right {
    border-left: 0;
}

.grid-wrapper.tabulator .tabulator-row.tabulator-row-even {
  background: #FFFFFF; 
}

.grid-wrapper .tabulator-row .tabulator-cell {
    border-right: 0;
    color: var(--font-color);
    padding: 4px 5px;
    min-height: 40px;
    cursor: default;
    border: 0;
}

.grid-wrapper.tabulator .tabulator-row .tabulator-cell:first-child,
.grid-wrapper.tabulator .tabulator-header .tabulator-col:first-child .tabulator-col-content {
    padding-left: 1rem;
}

.grid-wrapper.tabulator .tabulator-row:has(.tabulator-col-resize-handle) .tabulator-cell:nth-last-child(2),
.grid-wrapper.tabulator .tabulator-row:has(:not(.tabulator-col-resize-handle)) .tabulator-cell:last-child,
.grid-wrapper.tabulator .tabulator-header:has(.tabulator-col-resize-handle) .tabulator-col:nth-last-child(2) .tabulator-col-content,
.grid-wrapper.tabulator .tabulator-header:has(:not(.tabulator-col-resize-handle)) .tabulator-col:last-child .tabulator-col-content {
    padding-right: 1rem;
}

.grid-wrapper.tabulator .tabulator-table .tabulator-row:not(:last-child) {
    border-bottom: 1px solid var(--cell-border-color);
}

.grid-wrapper .tabulator-row.tabulator-selectable:hover,
.grid-wrapper .tabulator-row:has(.row-selection-check:checked) {
    background: var(--hover-bg) !important;
}

.grid-wrapper.tabulator .tabulator-header .tabulator-col .tabulator-col-content {
    padding: 2px 5px;
    align-content: center;
    min-height: 36px;
    height: 100%;
}

.grid-wrapper.tabulator .tabulator-header .tabulator-col.tabulator-sortable .tabulator-col-title {
    padding-right: 14px;
}

.grid-wrapper.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-sorter {
    right: 0;
}

.grid-wrapper.tabulator:not(.category-tree) .tabulator-tableholder {
    height: calc(100svh - calc(171px + 2.5rem)) !important;
}

.grid-with-total>.grid-wrapper.tabulator:not(.category-tree) .tabulator-tableholder:not(:has(.tabulator-placeholder-contents)),
.grid-with-total>.grid-wrapper.tabulator:not(.category-tree) .tabulator-tableholder {
    height: calc(100svh - calc(222px + 2.5rem)) !important;
}

.grid-wrapper.global-auditlog-grid.tabulator:not(.category-tree) .tabulator-tableholder {
    height: calc(100svh - calc(133px + 2.5rem)) !important;
}

.grid-wrapper.tabulator.list-without-breadcrumb:not(.category-tree) .tabulator-tableholder {
    height: calc(100svh - calc(145px + 2.5rem)) !important;
}

.grid-wrapper.tabulator.reorder_grid:not(.category-tree) .tabulator-tableholder {
    height: calc(100svh - calc(175px + 2.5rem)) !important;
}

.grid-wrapper .tabulator-row .tabulator-cell.cell-wrap,
.grid-wrapper.tabulator .tabulator-header .tabulator-col.cell-wrap .tabulator-col-content .tabulator-col-title {
    white-space: normal;
}

.grid-wrapper .tabulator-row .tabulator-cell.cell-truncate:not([style*="display: none;"]){
    display: inline-block !important;
    line-height: 32px;
}

.tabulator.grid-wrapper .tabulator-alert {
    background: transparent;
}

.grid-wrapper.tabulator .tabulator-tableholder .tabulator-placeholder .tabulator-placeholder-contents,
.no_data_display {
   padding: 1.5rem;
}

.grid-wrapper.tabulator .tabulator-tableholder .tabulator-placeholder .tabulator-placeholder-contents p,
.no_data_display p {
    font-size: 1.5rem;
    line-height: 1.75rem;
    font-weight: 400;
    color: var(--input-label-color);
}

.grid-wrapper.tabulator .tabulator-alert .tabulator-alert-msg.tabulator-alert-state-msg {
    border: 0;
    padding: 1.5rem;
}

.grid-wrapper .tabulator-row .tabulator-cell.tabulator-editing input {
    border: 1px solid var(--input-border-color) !important;
    border-radius: 5px;
    padding: 4px 12px !important;
    background: #FFFFFF;
    height: 30px !important;
}

.grid-wrapper .tabulator-row .tabulator-cell.tabulator-editing.text-end input {
    text-align: end;
}

.tabulator.grid-wrapper .tabulator-row .tabulator-cell .tabulator-data-tree-control {
    background: transparent;
    border: 0;
    margin-right: 10px;
}

.tabulator.grid-wrapper .tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-collapse {
    transform: rotate(-180deg);
}

.tabulator.grid-wrapper .tabulator-row .tabulator-cell .tabulator-data-tree-branch {
    visibility: hidden;
}

.tabulator.grid-wrapper .tabulator-row .tabulator-cell.tabulator-frozen.tabulator-frozen-left {
    border-right: 0;
}

.grid-wrapper .tabulator-row:has(.badge-bg-11) {
    background: var(--row-inactive-bg) !important;
}

.grid-wrapper .tabulator-row:has(.badge-bg-11) .tabulator-cell {
    color: var(--row-inactive-color)
}

.grid-wrapper.tabulator .tabulator-header .tabulator-col.cell-pr-0 .tabulator-col-content {
    padding-right: 0;
}

.tab-wrapper .grid-wrapper.border-grid.tabulator {
    border-width: 1px 0 0;
    border-radius: 0;
}

.tab-wrapper .grid-wrapper.tabulator:not(.category-tree) .tabulator-tableholder {
    height: calc(100svh - 282px) !important;
}

.grid-wrapper.tabulator .tabulator-row.tabulator-group {
    background: var(--bg-color-2);
    border: 0;
    border-bottom-color: #FFFFFF !important;
    padding: 10px 15px;
    font-size: var(--font-15);
    line-height: var(--line-h-18);
    font-weight: 500;
    color: var(--font-color);
    display: flex;
    align-items: center;
}

.grid-wrapper.tabulator .tabulator-row.tabulator-group>.grid-group-title {
    max-width: calc(100vw - 100px);
    min-width: 0;
}

.grid-wrapper.tabulator .tabulator-row.tabulator-group .tabulator-arrow {
    border: 0;
    transition: 0.3s ease;
    margin-right: 10px;
}

.grid-wrapper.tabulator .tabulator-row.tabulator-group.tabulator-group-visible .tabulator-arrow {
   transform: rotate(180deg);
}

.grid-wrapper.tabulator .tabulator-tableholder .tabulator-placeholder {
    width: auto !important;
}

.manage-columns-dropdown + .grid-wrapper.tabulator .tabulator-header .tabulator-headers>*:nth-last-child(2),
.manage-columns-dropdown + .grid-with-total .grid-wrapper.tabulator .tabulator-header .tabulator-headers>*:nth-last-child(2),
.grid-wrapper.tabulator .tabulator-header .tabulator-col.last-visible-column {
    padding-right: 18px;
}

.grid-with-total>.grid-wrapper.tabulator {
    box-shadow: none;
}

.grid-total-wrapper {
    padding: 14px 15px;
    border-top: 1px solid var(--cell-border-color);
}

.grid-wrapper .tabulator-row:has(.tabulator-col-resize-handle) .tabulator-cell.text-end,
.grid-wrapper .tabulator-row .tabulator-cell.curreny-cell {
    padding-right: 22px;
}

.manage-columns-dropdown + .grid-wrapper .tabulator-row:has(.tabulator-col-resize-handle)>*:nth-last-child(2):is(.tabulator-cell.text-end) {
    padding-right: 48px;
}

.grid-wrapper.tabulator .tabulator-footer {
    border-top: 1px solid var(--cell-border-color);
}

.grid-wrapper.tabulator .tabulator-footer .tabulator-calcs-holder {
    border: 0;
}

.grid-wrapper.tabulator .tabulator-footer .tabulator-calcs-holder .tabulator-row {
    background: #FFFFFF !important;
}

.grid-wrapper .tabulator-footer .tabulator-row .tabulator-cell {
    font-size: var(--font-18);
    line-height: var(--line-h-24);
    font-weight: 700;
    min-height: 50px;
}

.grid-wrapper.tabulator .tabulator-header .tabulator-col,
.grid-wrapper .tabulator-row .tabulator-cell,
.grid-wrapper .tabulator-row .tabulator-cell pre {
    font-size: var(--font-14);
    line-height: var(--line-h-18);
    font-weight: 400;
}

.grid-wrapper.tabulator .tabulator-table .tabulator-row.tabulator-tree-level-0 .category-name-column span {
    font-weight: 700;
}

/*-- grid style end --*/

.table-wrapper {
    width: 100%;
    background: #FFFFFF;
    border: 1px solid var(--divider-line-color);
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 5px;
}

.table-wrapper :where(th, td) {
    padding: 4px 5px;
    font-size: var(--font-14);
    line-height: var(--line-h-18);
}

.table-wrapper :where(tr td:first-child, tr th:first-child) {
    padding-left: 1rem;
}

.table-wrapper :where(tr td:last-child, tr th:last-child) {
    padding-right: 1rem;
}

.table-wrapper th {
    font-weight: 600;
    font-weight: 500;
    color: var(--input-label-color);
    height: 30px;  
    border-bottom: 1px solid var(--divider-line-color);
}

.table-wrapper td {
    font-weight: 400;
    color: var(--font-color);
}

.table-wrapper td:not(.add-tr-td) {
    height: 30px;
}

.table-wrapper tbody tr:not(:last-child) td,
.last-row-divider tr:last-child td,
.tree-select .dropdown-item.link-btn {
    border-bottom: 1px solid var(--cell-border-color);
}

.table-cell-divider :where(tr th:not(:last-child), tr td:not(:last-child)),
.cell-divider {
    border-right: 1px solid var(--divider-line-color);
}

.table-wrapper.table-form-wrapper td {
    padding: 4px 2px;
}

.table-wrapper.table-form-wrapper th {
    padding: 2px;
}

.table-wrapper.table-form-wrapper:not(.users-details-list) :where(tr td:first-child, tr th:first-child) {
    padding-left: 8px !important;
}

.table-wrapper.table-form-wrapper:not(.users-details-list) :where(tr td:last-child, tr th:last-child) {
    padding-right: 8px !important;
}

.table-wrapper tr td.add-tr-td {
    height: 35px;
}

.table-wrapper.hover-tr tr:hover td,
.table-wrapper.hover-td tr:not(.add-tr) td:not(:has(.link-btn)):hover,
.ui-widget.ui-widget-content .ui-menu-item-wrapper.ui-state-active,
.vertical-tab-wrapper .nav-pills .nav-link:not(.active):hover {
    background: var(--hover-bg);
}

.table-wrapper tr:not(.sub-total-tr) td.no-result-td {
    height: 7.5rem;
    text-align: center;
}

.table-wrapper tr:not(:hover) .hover-show-btn,
.table-wrapper td:not(:hover) .hover-show-btn-td,
.grid-wrapper .tabulator-row.tabulator-selectable:not(:hover) .hover-show-btn {
    visibility: hidden;
    transition: none;
}

.table-wrapper .table-header tr td {
    height: auto;
    font-weight: 500;
}

.table-wrapper tr td:has(.multiselect-wrapper) {
    max-width: 0;
}

.table-td-align-baseline>tbody>tr:not(.sub-total-tr, .total-tr)>td:not(.add-tr-td) {
    vertical-align: baseline;
}

.table-td-align-top>tbody>tr:not(.sub-total-tr, .total-tr)>td {
    vertical-align: top;
}

.table-tbody-divider tbody:not(:last-child) tr:last-child td,
.table-wrapper.table-tbody-divider tbody tr:not(.sub-total-tr, .total-tr) td[rowspan],
.tab-wrapper .nav-tabs {
    border-bottom: 1px solid var(--divider-line-color);
}

.table-wrapper tr.disable-tr td {
    background: var(--row-inactive-bg);
    color: var(--row-inactive-color);
}

.table-wrapper .input-wrapper :where(.form-control:not(textarea), .form-select), 
.table-wrapper .multiselect-wrapper .multiselect,
.table-wrapper .multiselect-wrapper .multiselect-container .multiselect-filter>input.multiselect-search,
.table-wrapper .time-picker-btn,
.table-wrapper .select-dropdown .btn.select-btn,
.table-wrapper .selection-btn-wrapper.toggle-btn-h-30,
.table-wrapper .document-item {
    height: 30px;
}

.table-wrapper .delete-btn.delete-with-bg {
    width: 30px;
    height: 30px;
}

.table-wrapper :where(.btn.btn-h-30) {
    height: 30px !important;
}

.table-wrapper.summary-list-wrapper td {
    font-size: var(--font-15);
}

.table-wrapper .total-tr td {
    font-size: var(--font-16);
    line-height: var(--line-h-20);
    font-weight: 700;
}

.table-wrapper .input-wrapper :where(.form-control, .form-select), 
.table-wrapper .multiselect-wrapper .multiselect, 
.table-wrapper .select-dropdown .btn.select-btn {
    padding-inline: 6px;
}

.table-wrapper .input-wrapper:not(.input-with-infoicon-start):has(.input-info-wrapper.d-none) .form-control,
.table-wrapper .input-wrapper:not(.input-with-infoicon-start):has(.info-btn.d-none) .form-control {
    padding-right: 6px;
}

.table-wrapper .input-wrapper.input-with-infoicon-start:has(.input-info-wrapper.d-none) .form-control {
    padding-left: 6px;
}

.table-wrapper .input-info-wrapper.postion-start,
.table-wrapper .fixed-placeholder.placeholder-postion-start {
    left: 6px;
}

.table-wrapper .input-info-wrapper,
.table-wrapper .fixed-placeholder:not(.placeholder-postion-start) {
    right: 6px;
}

.item-name-td {
    min-width: 8.75rem;
}

.input-td-w-90 {
    width: 90px;
    min-width: 90px;
}

.input-td-w-100 {
    width: 100px;
    min-width: 100px;
}

.discount-input {
    width: 60px;
    min-width: 100%;
}

.contact-person-list tr td:not(:last-child) {
    width: calc(90% / 4);
}

.login-main-wrapper {
    min-height: 100svh;
    background: var(--light-bg);
    align-content: center;
    padding: 1rem;
}

.login-input-wrapper {
    max-width: 550px;
    background: #FFFFFF;
    padding: 2rem;
    border-radius: 0.5rem;
    margin-inline: auto;
    box-shadow: 0 0 12px -1px #8B1A471A;
    box-shadow: 0 0 12px -1px #3A2F3518;
}

.company-logo {
    max-width: 20rem;
    display: block;
    margin: 0 auto 4rem;
}

.login-input-wrapper h1 {
    font-size: 2.5rem;
    line-height: 3rem;
    font-weight: 700;
    margin-bottom: 2rem;
}

.login-input-wrapper .input-wrapper .form-control {
    height: 2.8125rem;
    padding-inline: 29px 12px;
    background: var(--bg-color-1);
}

.login-input-wrapper .primary-btn {
    height: 2.8125rem;
}

.forgot-link {
    display: inline-block;
    margin-block: 0.625rem 2rem;
    font-weight: 500;
}

.show-pswd-btn.input-control-label {
    color: var(--primary-color);
    width: 62px;
    cursor: pointer;
    font-weight: 500;
    background: var(--bg-color-1);
}

.login-input-icon {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 6;
}

.user-icon,
.password-lock-icon {
    width: 13px;
    height: 12px;
}

.user-icon {
    background: url(../images/common/user_icon.svg) center/contain no-repeat;
}

.password-lock-icon {
    background: url(../images/common/password_lock_icon.svg) center/contain no-repeat; 
}

.login-input-wrapper .form-control:-webkit-autofill,
.login-input-wrapper .form-control:-webkit-autofill:is(:focus, :hover, :active) {
    transition: background-color 5000s ease-in-out 0s !important;
}

.menu-wrapper {
    position: sticky;
    top: 0;
    z-index: 99;
}

.menu-wrapper,
.menu-wrapper .offcanvas .offcanvas-header {
    background: var(--primary-color);
    box-shadow: 0px 1px 7px 0px #3A2F3518;
}

.menu-wrapper>.navbar {
    padding: 5px 1.5rem;
    height: 55px;
}

.menu-wrapper .navbar-brand {
    margin-right: 2.875rem;
}

.menu-logo {
    max-width: 6.875rem;
    height: auto;
}

.menu-wrapper>.navbar .navbar-nav:not(.profile-notification-nav) .nav-link,
.tab-wrapper .nav-tabs .nav-link,
.vertical-tab-wrapper .nav-pills .nav-link {
    font-size: var(--font-16);
    line-height: var(--line-h-20);
    position: relative;
    transition: 0.5s ease;
}

.menu-wrapper>.navbar .navbar-nav:not(.profile-notification-nav) .nav-link {
    font-weight: 400;
    font-weight: 500;
    color: #FFFFFFD9;
    letter-spacing: 0.01em;
    padding: 0.5rem 0.75rem;
}

.menu-wrapper>.navbar .navbar-nav:not(.profile-notification-nav) .nav-link:hover,
.menu-wrapper>.navbar .navbar-nav:not(.profile-notification-nav) .nav-link.active {
    color: #FFFFFF;
}

.menu-wrapper>.navbar.navbar-expand-lg .offcanvas .navbar-nav .nav-link::before {
    content: '';
    width: 0;
    height: 5px;
    background: #FFFFFF;
    position: absolute;
    left: 0;
    top: calc(100% + 5px);
    border-radius: 0.25rem 0.25rem 0 0;
    transition: 0.5s ease;
}

.menu-wrapper>.navbar.navbar-expand-lg .offcanvas .navbar-nav .nav-link.active::before {
    width: 100%;
}

.menu-wrapper .nav-item.custom-dropdown:not(.notifications-popup, :has(.profile-btn))>.dropdown-menu {
    max-height: 22.5rem;
    overflow-y: auto;
}

.profile-btn {
    background: #C99A2E;
    color: #FFFFFF;
    font-weight: 400 !important;
    font-size: var(--font-15) !important;
    padding: 3px !important;
    display: grid;
    place-items: center;
}

.profile-btn,
.profile-image {
    width: 2.125rem;
    height: 2.125rem;
    border-radius: 50%;
}

.module-selection-wrapper {
    background: var(--light-bg);
    min-height: calc(100svh - 55px);
    align-content: center;
    padding: 2.5rem 1.5rem;
}

.launchpad-card {
    padding: 1rem;
    background: #FFFFFF;
    border-radius: 0.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    border-left: 0.25rem solid var(--primary-color);
    text-decoration: none;
    box-shadow: 0 6px 18px -6px #3A2F3518;
    height: 100%;
    min-height: 5.9375rem;
    transition: 0.3s all;
}

.launchpad-card:hover {
    transform: translateX(0.25rem);
    border-left-width: 0.375rem;
    box-shadow: 0 12px 28px -10px #3A2F3526;
}

.module-icon {
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 0.375rem;
    flex-shrink: 0;
    background: var(--bg-color-2);
    background: var(--light-bg);
    align-content: center;
    text-align: center;
    transition: background 0.3s ease, color 0.3s ease;
}

.launchpad-card:hover .module-icon {
    background: linear-gradient(120deg, var(--secondary-color) 0%, var(--primary-color) 100%);
}

.module-icon>i {
    font-size: 1.5rem;
    color: #FFFFFF;
}

.launchpad-card:not(:hover) .module-icon>i {
    background: linear-gradient(120deg, var(--secondary-color) 0%, var(--primary-color) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.launchpad-card h4 {
    font-size: var(--font-18);
    line-height: var(--line-h-24);
    color: var(--font-color);
    font-weight: bold;
}

.launchpad-card p {
    color: var(--font-color-3);
}

.tabulator.category-tree .tabulator-tableholder {
    height: calc(100svh - calc(134px + 2.5rem)) !important;
}

.user-status-toggle {
    min-width: 85px;
}