@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,700);
@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,400italic);
@import url('https://fonts.googleapis.com/css?family=Montserrat');
@import url('https://fonts.googleapis.com/css?family=Nunito+Sans');
@import url('https://fonts.googleapis.com/css?family=Muli');
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

:root {
    --print-page-width: 210mm;
    --bs-body-bg: #fff;
    --bs-body-color: #303030;
    --bs-body-font-family: Inter,Source Sans Pro,sans-serif;
    --content-font-family: "Font Awesome 5 Pro";
    --bs-body-font-size: 13px;
    --box-shadow: 0 0px 10px 0 rgba(0, 0, 0, 0.05);
    --button-border-color: #ced4da;
    --base-border-color: #dadada;
    --base-border-radius: 6px;
    --input-border-color: #e5e5e5;
    --input-border-active-color: #2da5da;
    --input-border-hover-color: #8dc9e5;
    --input-border-error-color: crimson;
    --input-disabled-color: #707070;
    --menu-panel-transition: .2s cubic-bezier(.35, 0, .25, 1);
    --top-navbar-bg: #fff;
    --bg-color-red: #BD1B1B;
    --bg-color-tyrkys: #2BB0B0;
    --bg-color-green: #32A95E;
    --bg-color-light: #E3E4E8;
    --bg-color-grey: #898B90;
    --bg-color-black: #0F1722;
    --bg-color-disabled: #f6f7fa;
    --text-color-menu-active: #0560fa;
    --bg-color-menu: #FFFFFF;
    --bg-color-menu-light: #102540;
    --bg-color-menu-active: transparent;
    --bg-grid-header: #e2e8f1;
    --bg-icon-wrapper: aliceblue;
    --bg-modal: #fafafa;
    --menu-text-color: #303030;
    --menu-font-size: 14px;
    --menu-icon-font-size: 16px;
    /**/
    /* Base colors */
    /**/
    --text-color-blue: #0084E4;
    --bg-color-blue: aliceblue;
    --text-color-dev-blue: #6d9dc6;
    --text-color-placeholder: #bbb;
    --bg-color-dev-blue: #f0f8ff;
    --bg-btn-secondary: #f5f5f5;
    --bg-btn-hover: #dfe1e5;
    /**/
    /* Bootstrap */
    --bs-border-color: var(--base-border-color);
    --bs-border-radius: var(--base-border-radius);
    --bs-border-radius-sm: var(--base-border-radius);
    --bs-border-radius-lg: var(--base-border-radius);
    --bs-btn-hover-bg: var(--text-color-menu-active);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-border-color: var(--text-color-menu-active);
    --bs-primary-rgb: 13,110,253;
    --bs-card-cap-bg: transparent;
    --dxbl-menu-item-hover-bg: #f3f5f9;
    --bs-body-lighter-bg: #f3f5f9;
    --bs-body-bg: #ffffff;
    --dxbl-text-edit-btn-hover-bg: var(--bg-btn-hover);
    --dxbl-btn-hover-background: var(--bg-btn-hover);
    /*--bs-blue: #0d6efd;
    --bs-indigo: #6610f2;
    --bs-purple: #6f42c1;
    --bs-pink: #d63384;
    --bs-red: #dc3545;
    --bs-orange: #fd7e14;
    --bs-yellow: #ffc107;
    --bs-green: #198754;
    --bs-teal: #20c997;
    --bs-cyan: #0dcaf0;
    --bs-white: #fff;
    --bs-gray: #6c757d;
    --bs-gray-dark: #343a40;
    --bs-primary: #0d6efd;
    --bs-secondary: #6c757d;
    --bs-success: #198754;
    --bs-info: #0dcaf0;
    --bs-warning: #ffc107;
    --bs-danger: #dc3545;
    --bs-light: #f8f9fa;
    --bs-dark: #212529;
    --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));*/
    /* DevExpress */
    /* --bs-primary: #5f368d;
    --bs-secondary: #888;
    --bs-success: #28a745;
    --bs-info: #00a9e6;
    --bs-warning: #ffc107;
    --bs-danger: #dc3545;
    --bs-light: #ececec;
    --bs-dark: #212529;*/
    /**/
    /* Scroll bar */
    /**/
    --color-scroll: #7BA8CC;
    --color-scroll-lighten: color-mix(in srgb, var(--color-scroll) 44%, white);
    /**/
    /* Base sizes */
    /**/
    --top-menu-height: 70px;
    --left-panel-width: 255px;
    --left-panel-inner-width: 290px;
    --left-panel-slim-width: 90px;
    /**/
    /* slide-panel */
    /**/
    --slidepanel-width-right: 320px;
    --slidepanel-width-left: 320px;
    --slidepanel-width-top: 320px;
    --slidepanel-width-bottom: 320px;
    --slidepanel-margin-top: var(--top-menu-height);
    --slidepanel-margin-left: var(--left-panel-width);
    --slidepanel-border-radius: 20px;
    /**/
    --bg-warning: #ffe5b5;
    --bg-restriction: #ffb5b5;
    --dxbl-btn-active-background: #ffffff;
}

.dark-theme {
    --base-border-color: #202020;
    --input-border-color: #404040;
    --text-color-placeholder: #666;
    --menu-text-color: #dddddd;
    --bs-body-color: #dddddd;
    --bs-border-color: var(--base-border-color);
    --bs-body-bg: #000000;
    --bs-body-lighter-bg: #161618;
    --bg-color-menu: #000000;
    --bg-grid-header: #1e1e20;
    --bs-gray-900: #fff;
    --bg-icon-wrapper: #1e1e20;
    --bg-modal: #101010;
    --bg-color-disabled: #161616;
    --dxbl-menu-item-hover-bg: #1e1e20;
    --bg-warning: #755b2b;
    --bg-restriction: #752b2b;
    --bg-btn-hover: #2a2a2c;
    --dxbl-text-edit-btn-hover-bg: var(--bg-btn-hover);
    --dxbl-btn-hover-background: var(--bg-btn-hover);
    --dxbl-btn-active-background: #0560fa;
    --bs-emphasis-color: #ababab;
    --color-scroll: #666;
    --color-scroll-lighten: color-mix(in srgb, var(--color-scroll) 84%, white);
    --bs-light-rgb: rgba(110, 110, 110, 1);
}

.dark-theme .dxbl-btn-light {
    --bs-light: #656565;
}

    .dark-theme .dxbl-btn-secondary {
        --bs-gray-300: var(--bs-secondary);
    }

.card {
    --bs-card-cap-color: var(--menu-text-color);
    --bs-card-bg: var(--bs-body-bg);
    --bs-card-border-color: var(--base-border-color);
    --bs-card-border-radius: var(--base-border-radius);
    --bs-card-inner-border-radius: calc(var(var(--base-border-radius)) -(var(--bs-border-width)));
    --bs-card-cap-padding-x: 5px;
    --bs-card-cap-padding-y: 10px;
}

.accordion {
    /* --bs-accordion-border-color: green;
    --bs-accordion-btn-focus-border-color: green;
    --bs-accordion-btn-focus-box-shadow: green;*/
}

.btn {
    /*--bs-btn-color: var(--bs-body-color);*/
}

.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #0560fa;
    --bs-btn-border-color: #0560fa;
}

.btn-secondary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #0560fa;
    --bs-btn-border-color: var(--button-border-color);
}

.btn-outline-secondary {
    --bs-btn-border-color: var(--button-border-color);
}

.btn-light {
    --bs-btn-active-bg: #e9e9e9;
    --bs-btn-bg: none;
    /*--bs-btn-border-color: var(--button-border-color);*/
}

.dark-theme .btn-light {
    --bs-btn-color: var(--dxbl-btn-color);
    --bs-btn-active-bg: #0560fa;
    --bs-btn-active-color: white;
}

.dxbl-grid {
    --dxbl-grid-selection-color: #ffffff;
    --dxbl-grid-selection-bg: #89bbe3;
    --dxbl-grid-text-cell-padding-x: 0.65rem;
    --dxbl-grid-text-cell-padding-y: 0.7rem;
    --dxbl-grid-header-color: var(--bs-body-color);
    --dxbl-grid-color: #333;
    --dxbl-grid-font-size: 13px;
    --dxbl-grid-fixed-column-border-color: var(--base-border-color);
}

.dark-theme .dxbl-grid {
    --dxbl-grid-color: #dddddd;
    --dxbl-grid-selection-bg: var(--text-color-menu-active);
}

.dxbl-grid-header-content {
    --dxbl-grid-header-font-weight: 700;
}

.dxbl-text-edit {
    --dxbl-text-edit-border-width: 0px;
    --dxbl-text-edit-border-radius: var(--base-border-radius);
    --dxbl-text-edit-padding-y: 8px;
    --dxbl-text-edit-padding-x: 16px;
    --dxbl-btn-font-size: 11px;
    --dxbl-text-edit-btn-padding-x: 10px;
    --dxbl-text-edit-disabled-bg: var(--bg-color-disabled);
    --dxbl-text-edit-disabled-color: var(--input-disabled-color);
    --dxbl-text-edit-btn-image-color: var(--menu-text-color);
    --dxbl-text-edit-btn-disabled-color: transparent;
    --dxbl-text-edit-btn-disabled-bg: var(--bg-color-disabled);
}

.dark-theme .dxbl-text-edit {
    /*--dxbl-text-edit-disabled-bg: transparent;*/
}

.dxbl-scroll-viewer {
    /*--dxbl-scroll-viewer-hor-scroll-bar-height: 0.2rem;*/
    /*--dxbl-scroll-viewer-hor-scroll-bar-hover-height: 0.5rem;*/
    /*--dxbl-scroll-viewer-vert-scroll-bar-width: 0.2rem;*/
    /*--dxbl-scroll-viewer-vert-scroll-bar-hover-width: 0.5rem;*/
}

.dxbl-tabs {
    --dxbl-tabs-bottom-border-width: 1px;
}

.dxbl-pager {
    --dxbl-pager-active-page-btn-bg: var(--dxbl-grid-selection-bg);
}

.dxbl-modal {
    --dxbl-popup-bg: var(--bg-modal);
    --dxbl-popup-header-bg: var(--bg-modal);
    --dxbl-popup-footer-bg: var(--bg-modal);
}

.dxbl-listbox {
    --dxbl-listbox-item-selected-bg: #89bbe3;
    --dxbl-listbox-validation-valid-color: #dee2e6;
    --dxbl-listbox-item-selected-hover-bg: var(--dxbl-menu-item-hover-bg);
    --dxbl-listbox-item-hover-bg: var(--dxbl-menu-item-hover-bg);
    --dxbl-listbox-border-radius: var(--base-border-radius);
    --dxbl-listbox-item-border-color: var(--base-border-color);
}

.dark-theme .dxbl-listbox {
    --dxbl-listbox-item-selected-bg: var(--text-color-menu-active);
}

.dxbl-toolbar {
    --dxbl-toolbar-title-font-size: 14px;
    --dxbl-toolbar-btn-border-radius: var(--base-border-radius);
    --dxbl-toolbar-btn-padding-x: 10px;
}

.dxbl-btn {
    --dxbl-btn-padding-x: 10px;
    --dxbl-btn-padding-y: 8px;
    --dxbl-btn-border-radius: var(--base-border-radius);
    --dxbl-btn-toolbar-item-spacing: 8px;
    --dxbl-btn-font-size: 13px;
    --dxbl-btn-hover-border-color: var(--input-border-color);
    --dxbl-btn-hover-bg: var(--bg-btn-hover);
}

    .dxbl-btn.dxbl-lg {
        --dxbl-btn-padding-x: 10px;
        --dxbl-btn-padding-y: 7.2px;
        --dxbl-btn-border-radius: var(--base-border-radius);
        border: 1px solid var(--input-border-color);
    }

.dxbl-menu-bar .dxbl-image {
    margin: 0;
    font-size: 16px;
}

.dxbl-treeview {
    /*--dxbl-treeview-item-selection-bg: 0084e4;*/
}

.dxbl-menu {
    --dxbl-menu-bg: transparent;
    --dxbl-menu-top-left-border-radius: var(--base-border-radius);
    --dxbl-menu-bottom-left-border-radius: var(--base-border-radius);
    --dxbl-menu-top-right-border-radius: var(--base-border-radius);
    --dxbl-menu-bottom-right-border-radius: var(--base-border-radius);
    --dxbl-menu-item-disabled-opacity: 40%;
}

    .dxbl-menu.dxbl-menu-horizontal {
        --dxbl-menu-item-font-size: 14px;
        --dxbl-menu-item-padding-y: 9px;
        --dxbl-menu-title-padding-y: 9px;
        --dxbl-menu-item-line-height: 17px;
        --dxbl-menu-hamburger-btn-padding-y: 0.669rem;
    }

.dxbl-itemlist-dropdown {
    max-height: 300px; /*must have top menu*/
}

.dxbl-checkbox {
    --dxbl-checkbox-check-element-unchecked-border-width: 1px;
}

.dxbl-text-edit.dxbl-disabled > *,
.dxbl-text-edit:disabled > * {
    --dxbl-text-edit-disabled-opacity: 1;
}

.dropdown-menu {
    --bs-dropdown-link-active-bg: #89bbe3;
    --bs-dropdown-link-hover-bg: var(--dxbl-text-edit-btn-hover-bg);
}

/* Colors */
.text-color-red {
    color: var(--bg-color-red);
}

.text-color-tyrkys {
    color: var(--bg-color-tyrkys);
}

.text-color-green {
    color: var(--bg-color-green);
}

.text-color-blue {
    color: var(--text-color-blue);
}

.text-color-light {
    color: var(--bg-color-light);
}

.text-color-grey {
    color: var(--bg-color-grey);
}

.bg-color-red {
    background-color: var(--bg-color-red);
}

.bg-color-tyrkys {
    background-color: var(--bg-color-tyrkys);
}

.bg-color-green {
    background-color: var(--bg-color-green);
}

.bg-color-blue {
    background-color: var(--bg-color-blue);
}

.bg-color-light {
    background-color: var(--bg-color-light);
}

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

.bg-color-menu {
    background-color: var(--bg-color-menu);
}

.bg-color-black {
    background-color: var(--bg-color-black);
}

.bg-header {
    background-color: var(--bs-body-lighter-bg);
}

.btn-none {
    border-color: var(--input-border-color);
}

.base-border {
    border: 1px solid var(--base-border-color);
}

:root {
    --base-value: 50%;
    --min-value: 100px;
    --max-value: 1000px;
    --final-value: max(var(--min-value), min(var(--avg-value), var(--base-value)));
}