/* ******** THEME SETTINGS ******** */
/**
   Layering
 */
:root {
    --z-index-contentLoadingOverlay    : 1;
    --z-index-footer                   : 1;
    --z-index-sideMenu                 : 3;
    --z-index-sideMenu-mobile          : 130;
    --z-index-mainContainer            : 6;
    --z-index-gmTooltipArrowSide       : 97;
    --z-index-gmTooltipSide            : 98;
    --z-index-infoboxTooltipArrow      : 99;
    --z-index-infoboxTooltip           : 100;
    --z-index-stickyListHeader         : 101;
    --z-index-wizard-steps             : 102;
    --z-index-aside-hover              : 135;
    --z-index-navigation               : 140;
    --z-index-navigation-is-sticky     : 142;
    --z-index-filterDropDown           : 150;
    --z-index-context-menu             : 150;
    --z-index-daily-order-context-menu : 150;
    --z-index-dialog-backdrop          : 160;
    --z-index-dialog                   : 161;
    --z-index-gmTooltipArrow           : 200;
    --z-index-gmTooltip-error          : 201;
    --z-index-selectLanguage           : 300;
    --z-index-jqueryUiDialog           : 400;
    --z-index-jqueryUiDialogOverlay    : 399;
    --z-index-gmTooltip                : 500;
    
    --z-index-loginPopup               : 11111;
    --z-index-errorDialog              : 22222;
}

/**
   Brand colors
 */
:root {
    --brand-color-1               : #876f3b;
    --brand-color-1-lighter       : #af904d;
    --brand-color-1-middle-darker : #544625;
    --brand-color-1-darker        : #3b311a;
    --brand-color-2               : #b19453;
    --brand-color-2-lighter       : #ceac60;
    --brand-color-2-darker        : color-mix(in oklab, var(--button-bg-color) 100%, black 10%);
}

/**
  Colors
 */
:root {
    --blue-dark-color       : #2e7380;
    --blue-color            : #46b2c5;
    --blue-middle-color     : #b3d2d7;
    --blue-light-color      : #e6f6ff;
    --green-color           : #79cc6b;
    --green-color-rgb       : 121, 207, 107;
    --yellow-color          : #f8e56d;
    --orange-color          : #fca507;
    --red-color             : #d73939;
    --red-light-color       : #ff8d8d;
    --brown-pastel-color    : #ba704f;
    --turquoise-color       : #17594a;
    --turquoise-light-color : #26a187;
    --blue-pastel-color     : #9babb8;
    --corall-color          : #e4847a;
    --pink-color            : #e01e84;
    --purple-color          : #c758d0;
    --honey-color           : #eeb51d;
    --buttercup-color       : #f5c559;
    --pinapple-color        : #f3e915;
    --gold-color            : var(--main-gold-color);
    --black-color           : #000;
}


:root {
    --base-font-size                  : 16;
/ / DO NOT MODIFY;
    --font-size                       : 16;
    --footer-arrow-height             : 2.125rem;
    --aside-open-width                : 18.75rem;
    --aside-closed-width              : 4.2rem;
    --aside-anim-duration             : 0.2s;
    --animation-duration              : 0.3s;
    --animation-duration-fast         : 0.2s;
    --animation-duration-ultra-fast   : 0.1s;
    --animation-duration-slow         : 0.5s;
    --body-font-stack                 : 'Dm Sans', Roboto, Lato, 'Open Sans', Arial, sans-serif;
    --heading-font-stack              : var(--body-font-stack);
    --error-color                     : var(--red-color);
    --select-arrow-bg-color           : #cff0c9;
    --select-arrow-bottom-image       : linear-gradient(45deg, var(--green-color) 50%, transparent 50%),
    linear-gradient(135deg, transparent 50%, var(--green-color) 50%),
    radial-gradient(var(--select-arrow-bg-color) 70%, transparent 72%);
    --select-arrow-top-image          : linear-gradient(45deg, transparent 50%, var(--green-color) 50%),
    linear-gradient(135deg, var(--green-color) 50%, transparent 50%),
    radial-gradient(var(--select-arrow-bg-color) 70%, transparent 72%);
    --backtotop-bg-color              : var(--brand-color-1-darker);
    --nav-height                      : 3.8rem;
    --body-bg-color                   : #f4f6f9;
    --box-bg-color                    : #fff;
    --box-bg-color-alpha              : #ffffff80;
    --box-alert-bg-color              : #f8f3d6;
    --box-alert-border-color          : #dad08d;
    --box-alert-bottom-border-color   : #dbcf7c;
    --box-alert-text-color            : #967132;
    --box-warning-bg-color            : #ffe4c7;
    --box-warning-border-color        : #e5d3b2;
    --box-warning-bottom-border-color : #e6a843;
    --box-shadow                      : 0 0.125rem 0.25rem rgba(0, 0, 0, 0.25);
    --box-hover-shadow                : 0 0.125rem 0.25rem rgba(0, 0, 0, 0.35);
    --box-info-bg-color               : #fffcdc;
    --box-info-border-color           : #bab25b;
    --box-info-bottom-border-color    : #d2c256;
    --box-left-border-color           : #e6e6e6;
    --button-bg-color                 : var(--brand-color-2);
    --button-hover-color              : color-mix(in oklab, var(--button-bg-color) 100%, black 15%);
    --input-bg-color                  : #f7f8fa;
    --input-padding-vertical          : 0.625rem;
    --input-padding-horizontal        : 0.75rem;
    --button-padding-horizontal       : 2rem;
    --button-padding-vertical         : 0.625rem;
    --button-padding                  : var(--button-padding-vertical) var(--button-padding-horizontal);
    --input-padding                   : var(--input-padding-vertical) var(--input-padding-horizontal);
    --input-radio-color               : #f2f2f2;
    --input-focus-color               : var(--blue-color);
    --navbar-bg-color                 : var(--brand-color-1);
    --title-bg-color                  : #e9e9e9;
    --asidemenu-blue-border           : #3c929f;
    --box-border-color                : #c0c0c0;
    --error-border-color              : #ff3636;
    --title-border-color              : #c7c7c7;
    --box-border-focused-color        : #a9a9a9;
    --aside-menu-color                : var(--blue-color);
    --heading-color                   : var(--blue-color);
    --default-border-radius           : 0.625rem;
    --default-box-gap                 : 2rem;
    --default-box-padding             : 1.25rem;
    --line-color                      : #ebedf1;
    --header-bg-color                 : var(--box-bg-color);
    --header-hover-color              : var(--brand-color-1-darker);
    --form-element-disabled-bg-color  : #fafafa;
    --box-error-bg-color              : #fae0e0;
    --box-error-hr-color              : #f37878;
    --box-error-line-bg-color         : #ff8181;
    --main-gold-color                 : #b19453;
    --bar-gold-color                  : #b19453;
    --light-gold-color                : #fff2db;
    --box-hover-bg-color              : #d9f3d6;
    --controlmenu-hover-color         : #000;
    --wizard-inactive-bullet          : #c0c0c0;
    --wizard-inactive-desc-color      : #979797;
    --wizard-inactive-label-color     : #838383;
    --wizard-active-label-color       : var(--blue-color);
    --wizard-done-label-color         : var(--green-color);
    --arrow-light-bg-color            : var(--light-text-color);
    --default-link-color              : var(--blue-color);
    --menu-selected-color             : var(--brand-color-2-lighter);
    --login-popup-start-color         : var(--brand-color-1-darker);
    --login-popup-end-color           : var(--brand-color-1-lighter);
    --footer-link-color               : #ffffff;
    --footer-heading-color            : var(--light-text-color);
    --footer-backtotop-color          : var(--nav-link-color);
    --footer-copyright-color          : var(--light-text-color);
    --footer-contact-bg-color         : var(--brand-color-1-lighter);
    --footer-sidebar-bg-color         : color-mix(in oklab, var(--footer-contact-bg-color) 100%, black 20%);
    --footer-copyright-bg-color       : color-mix(in oklab, var(--footer-sidebar-bg-color) 100%, black 30%);
    --calendar-head-color             : var(--brand-color-1);
    --list-table-summarize-bg-color   : #45423d;
    --body-text-color                 : #3a414e;
    --lighter-text-color              : #868686;
    --light-text-color                : #fff;
    --require-text-color              : #f00;
    --dialog-shadow                   : 0 0 0.625rem rgba(0, 0, 0, 0.2);
    --dialog-shadow-bigger            : 0 0 1.825rem rgba(0, 0, 0, 0.4);
    --solid-button-bg-color           : #565656;
    --solid-button-bg-hover-color     : #474747;
    --sidemenu-color                  : var(--brand-color-1-middle-darker);
    --sidemenu-border-right-color     : var(--text-color-120);
    --button-cancel-bg-color          : #a0a0a0;
    --button-cancel-hover-bg-color    : #777;
    --tooltip-bg-color                : #a08f65;
    --tooltip-text-color              : #fff;
    --tooltip-offset                  : 0.9375rem;
    --tooltip-anim-offset             : 0.625rem;
    --tooltip-border-width            : 0.625rem;
    --box-success-bg-color            : #d9f3d6;
    --pie-inactive-bg-color           : #e7e7e7;
    --list-hover-color                : #fffff3;
    --list-open-color                 : #fffed6;
    --darker-balance-bg-color         : #f8f8cf;
    --darkest-balance-bg-color        : #e9e9b7;
    --darker-gray-bg-color            : #e7e7e7;
    --half-darker-gray-bg-color       : #f6f6f6;
    --light-gray-bg-color             : #eaeaea;
    --bg-color-120                    : #d7d7d7;
    --bg-color-110                    : #dddddd;
    --bg-color-100                    : var(--darker-gray-bg-color);
    --bg-color-80                     : var(--light-gray-bg-color);
    --bg-color-60                     : #f0f0f0;
    --bg-color-40                     : var(--half-darker-gray-bg-color);
    --bg-color-20                     : #f7f7f7;
    --bg-color-10                     : #fcfcfc;
    --text-color-120                  : #2f3149;
    --text-color                      : var(--body-text-color);
    --text-color-90                   : #5c5c5c;
    --text-color-80                   : var(--lighter-text-color);
    --text-color-60                   : #afafaf;
    --text-color-50                   : #c7c7c7;
    --text-color-40                   : #d2d2d2;
    --text-color-30                   : #e0e0e0;
    --text-color-20                   : #edecec;
    --startpage-pattern               : url('../../images/layout_v4/bg.webp') no-repeat left -100px;
    --orange-box-bg                   : linear-gradient(
        to bottom,
        var(--box-warning-bottom-border-color) 0,
        var(--box-warning-bottom-border-color) 7px,
        transparent 8px,
        transparent 100%);
    --warning-box-bg                  : linear-gradient(
        to bottom,
        var(--box-warning-bg-color) 0%,
        var(--box-warning-bg-color) calc(100% - 8px),
        var(--box-warning-bottom-border-color) calc(100% - 7px),
        var(--box-warning-bottom-border-color) 100%
    );
    
    --wizard-bg-color                 : var(--footer-contact-bg-color);
    --heading-1-color                 : var(--body-text-color);
    --heading-2-color                 : var(--blue-color);
    --heading-3-color                 : var(--body-text-color);
    --header-link-color               : var(--brand-color-1);
    --nav-link-color                  : var(--light-text-color);
    --loginbox-text-color             : var(--body-text-color);
    --loginbox-bg-color               : var(--box-bg-color);
}

html.layout_v3 {
    --base-font-size : 13;
}

html.layout_v3 {
    --input-bg-color : #fff;
}

html.dark {
    --body-bg-color                   : #202022;
    --box-bg-color                    : #28272d;
    --box-bg-color-alpha              : #28272ddd;
    --body-text-color                 : #dbe0f1;
    --input-bg-color                  : #383844;
    --line-color                      : #38373c;
    --box-border-color                : #525057;
    --navbar-bg-color                 : var(--brand-color-2);
    --main-gold-color                 : #ceac61;
    --blue-color                      : #4ea3b0;
    --asidemenu-blue-border           : #337983;
    --sidemenu-border-right-color     : var(--box-border-color);
    --light-text-color                : #000;
    --text-color-120                  : #d8d7dd;
    --text-color                      : var(--body-text-color);
    --text-color-80                   : var(--lighter-text-color);
    --text-color-60                   : #777;
    --text-color-50                   : #707070;
    --text-color-40                   : #626262;
    --footer-heading-color            : #fff;
    --footer-backtotop-color          : var(--nav-link-color);
    --footer-copyright-color          : var(--footer-link-color);
    --footer-contact-bg-color         : var(--brand-color-1-lighter);
    --footer-sidebar-bg-color         : color-mix(in oklab, var(--footer-contact-bg-color) 100%, black 20%);
    --footer-copyright-bg-color       : color-mix(in oklab, var(--footer-sidebar-bg-color) 100%, black 30%);
    --blue-light-color                : #96d3f8;
    --box-hover-bg-color              : #333742;
    --backtotop-bg-color              : var(--brand-color-1-darker);
    --input-radio-color               : var(--body-bg-color);
    --box-left-border-color           : var(--box-hover-bg-color);
    --box-warning-bg-color            : #fcae5b;
    --box-warning-bottom-border-color : #bd6200;
    --list-hover-color                : #222528;
    --list-open-color                 : #1f2123;
    --select-arrow-bg-color           : #6da164;
    --require-text-color              : #ff2b2b;
    --darker-balance-bg-color         : #26262f;
    --darker-gray-bg-color            : #383844;
    --half-darker-gray-bg-color       : #2c2c36;
    --light-gray-bg-color             : #302f36;
    --title-bg-color                  : var(--list-open-color);
    --title-border-color              : var(--line-color);
    --bg-color-120                    : #4e4e5f;
    --bg-color-100                    : var(--darker-gray-bg-color);
    --bg-color-80                     : var(--half-darker-gray-bg-color);
    --bg-color-60                     : var(--light-gray-bg-color);
    --bg-color-40                     : #1e1e21;
    --bg-color-20                     : #161618;
    --light-gold-color                : var(--footer-copyright-bg-color);
    --wizard-bg-color                 : color-mix(in oklab, var(--body-bg-color) 100%, black 20%);
    --heading-1-color                 : var(--body-text-color);
    --heading-2-color                 : var(--blue-color);
    --heading-3-color                 : var(--body-text-color);
    --header-link-color               : var(--brand-color-1-lighter);
    --nav-link-color                  : #fff;
}