@charset "UTF-8";
/* Fonts
---------------------------------------------------------------- */
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap");
/* Config
---------------------------------------------------------------- */
* {
  --primary-color-hs: 218deg 72%;
  --primary-color-l: 35%;
  --secondary-color-hs: 55deg 100%;
  --secondary-color-l: 50%;
  --success-color-hs: 122deg 40%;
  --success-color-l: 50%;
  --warning-color-hs: 45deg 100%;
  --warning-color-l: 51%;
  --error-color-hs: 0deg 95%;
  --error-color-l: 55%;
  --blue-color-hs: 210deg 100%;
  --blue-color-l: 50%;
  --app-logo-width: unset;
  --app-logo-ratio: unset;
  --body-font: "IBM Plex Sans Condensed";
  --headline-font: "IBM Plex Sans Condensed";
  --headline-font-weight: 700;
  --headline-text-transform: none;
  --headline-letter-spacing: -.03em;
  --headline-color: currentColor;
  --button-font: "IBM Plex Sans Condensed";
  --button-font-weight: 700;
  --button-text-transform: none;
  --button-letter-spacing: 0;
  --menu-font: "IBM Plex Sans Condensed";
  --menu-font-weight: bold;
  --menu-text-transform: none;
  --menu-letter-spacing: 0;
  --menu-font-size: 16px;
  --menu-2nd-font: "IBM Plex Sans Condensed";
  --menu-2nd-font-weight: normal;
  --menu-2nd-text-transform: none;
  --menu-2nd-letter-spacing: 0;
  --menu-2nd-font-size: 14px;
  --scrollbar-thick: 6px;
  --scrollbar-radius: 6px;
  --scrollbar-bg: var(--theme-color-5);
  --scrollbar-thumb-bg: var(--theme-color-15);
  --scrollbar-thumb-hover-bg: var(--primary-color);
  --scrollbar-light-bg: var(--white-color-10);
  --scrollbar-light-thumb-bg: var(--white-color-30);
  --app-layout-padding: 1em 1em .5em;
  --app-layout-grid-rows: auto 1fr auto;
  --app-layout-grid-columns: 3.5em 1fr;
  --app-layout-grid-areas: "nav-sidebar app-header" "nav-sidebar app-main" "nav-sidebar app-footer";
  --app-layout-gap: .5em 1em;
  --nav-sidebar-width: 3em;
  --nav-sidebar-hover-width: 12em;
  --nav-sidebar-position: fixed;
  --nav-sidebar-inset: 0 auto 0 0;
  --nav-sidebar-bg: #345ba0;
  --nav-sidebar-color: var(--white-color);
  --nav-sidebar-padding: .75em;
  --app-sidebar-width: clamp(15vw,20em,25vw);
  --app-sidebar-bg: var(--theme-bg);
  --app-sidebar-shadow: -.5em 0 2em var(--theme-color-10);
  --app-sidebar-color: var(--theme-color);
  --app-sidebar-radius: 0;
  --app-sidebar-padding: 4em 1.25em 1.5em 1.5em;
  --header-gap: .25em 1em;
  --header-grid-rows: auto;
  --header-grid-columns: 1fr 1fr;
  --header-grid-areas: "head-top-left head-top-right";
  --footer-gap: .25em 1em;
  --footer-grid-rows: auto;
  --footer-grid-columns: 1fr 1fr;
  --footer-grid-areas: "foot-left foot-right";
  --tabs-width: 7vw;
  --tabs-min-width: 7em;
  --tabs-max-width: 20em;
  --tabs-max-width: 200px;
  --tabs-gap: .25em;
  --tabs-padding: .5em 1em;
  --tabs-radius: .25em;
  --tabs-font-size: .875em;
  --tabs-line-bg: transparent;
  --tabs-line-color: var(--theme-color);
  --tabs-line-border: 1px solid var(--theme-color-10);
  --tabs-line-hover-bg: var(--theme-color-5);
  --tabs-line-hover-color: var(--theme-color);
  --tabs-line-hover-border: var(--theme-color-20);
  --tabs-line-active-bg: var(--primary-color);
  --tabs-line-active-color: var(--white-color);
  --tabs-line-active-border: var(--primary-color);
  --tabs-fill-bg: transparent;
  --tabs-fill-color: var(--theme-color-50);
  --tabs-fill-border: 1px solid transparent;
  --tabs-fill-hover-bg: var(--theme-color-5);
  --tabs-fill-hover-color: var(--theme-color);
  --tabs-fill-hover-border: transparent;
  --tabs-fill-active-bg: var(--primary-color-20);
  --tabs-fill-active-color: var(--primary-color);
  --tabs-fill-active-border: transparent;
  --tabs-clear-color: var(--theme-color-60);
  --tabs-clear-border: 1px solid transparent;
  --tabs-clear-hover-bg: var(--theme-color-5);
  --tabs-clear-hover-color: var(--theme-color);
  --tabs-clear-hover-border: transparent;
  --tabs-clear-active-bg: unset;
  --tabs-clear-active-color: var(--theme-color);
  --tabs-clear-active-border: transparent;
  --tabs-close-icon: "";
  --tabs-close-family: remixicon;
  --tabs-close-size: 1rem;
  --tabs-close-width: 1.25em;
  --tabs-close-bg: var(--theme-color-20);
  --tabs-close-color: var(--white-color);
  --tabs-close-hover-bg: var(--theme-color);
  --tabs-close-hover-color: var(--white-color);
  --tabs-close-radius: var(--b-radius);
  --accordion-headline-size: 1em;
  --accordion-headline-weight: bold;
  --accordion-icon-family: remixicon;
  --accordion-icon-size: 1.375em;
  --accordion-icon-inactive: "";
  --accordion-icon-active: "";
  --accordion-icon-opacity-inactive: .2;
  --accordion-icon-opacity-active: 1;
  --accordion-content-font-size: .875em;
  --accordion-line-gap: .5em;
  --accordion-line-bg: var(--theme-bg);
  --accordion-line-color: var(--theme-color);
  --accordion-line-border: 1px solid var(--theme-color-10);
  --accordion-line-radius: var(--b-radius);
  --accordion-line-padding: .5em;
  --accordion-line-hover-bg: var(--theme-color-5);
  --accordion-line-hover-color: var(--theme-color);
  --accordion-line-hover-border: var(--theme-color-20);
  --accordion-line-active-bg: var(--theme-bg);
  --accordion-line-active-color: var(--primary-color);
  --accordion-line-active-border: var(--primary-color);
  --accordion-line-inner-gap: .5em;
  --accordion-fill-gap: 0;
  --accordion-fill-bg: var(--theme-bg);
  --accordion-fill-color: var(--theme-color);
  --accordion-fill-border: 1px solid trasnparent;
  --accordion-fill-radius: var(--b-radius);
  --accordion-fill-padding: .5em;
  --accordion-fill-hover-bg: var(--theme-color-5);
  --accordion-fill-hover-color: var(--theme-color);
  --accordion-fill-active-bg: var(--theme-color-10);
  --accordion-fill-active-color: var(--theme-color);
  --accordion-fill-inner-gap: 0;
  --accordion-clear-gap: 0;
  --accordion-clear-color: var(--theme-color-60);
  --accordion-clear-border: 1px solid trasnparent;
  --accordion-clear-radius: var(--b-radius);
  --accordion-clear-padding: .5em;
  --accordion-clear-hover-bg: var(--theme-color-5);
  --accordion-clear-hover-color: var(--theme-color);
  --accordion-clear-active-color: var(--theme-color);
  --accordion-clear-inner-gap: 0;
  --message-bg: unset;
  --message-color: inherit;
  --message-border: 1px solid;
  --message-radius: var(--b-radius);
  --message-padding: 1em 1.5em;
  --message-content-font-size: .875em;
  --message-close-icon-family: remixicon;
  --message-close-icon-size: 1.375em;
  --message-close-icon: "";
  --message-info-bg: var(--theme-color-5);
  --message-info-color: var(--theme-color);
  --message-info-title-color: var(--theme-color);
  --message-info-border: 1px solid var(--theme-color-20);
  --message-info-shadow: 0 .25em .5em var(--theme-color-10);
  --message-success-bg: var(--success-color-20);
  --message-success-color: var(--theme-color);
  --message-success-title-color: var(--success-color);
  --message-success-border: 1px solid var(--success-color);
  --message-success-shadow: 0 .25em .5em var(--success-color-50);
  --message-warning-bg: var(--warning-color);
  --message-warning-color: var(--theme-color);
  --message-warning-title-color: var(--theme-color);
  --message-warning-border: 1px solid transparet;
  --message-warning-shadow: 0 .25em .5em var(--theme-color-20);
  --message-error-bg: var(--error-color);
  --message-error-color: var(--white-color);
  --message-error-title-color: var(--white-color);
  --message-error-border: 1px solid transparent;
  --message-error-shadow: 0 .25em .5em var(--theme-color-20);
  --modal-backdrop-bg: var(--black-color-70);
  --modal-backdrop-padding: 1em;
  --modal-content-max-width: 42em;
  --modal-content-radius: var(--b-radius);
  --modal-head-bg: var(--white-color);
  --modal-head-color: var(--gray-color);
  --modal-head-border: 1px solid var(--gray-color-10);
  --modal-head-padding: 1em 1.5em;
  --modal-body-bg: var(--white-color);
  --modal-body-color: var(--gray-color);
  --modal-body-padding: 1em 1.5em;
  --modal-foot-bg: var(--white-color);
  --modal-foot-color: var(--gray-color);
  --modal-foot-border: 1px solid var(--gray-color-10);
  --modal-foot-padding: 1em 1.5em;
  --modal-foot-gap: .25em;
  --modal-close-icon-family: remixicon;
  --modal-close-icon-size: 1.375em;
  --modal-close-icon: "";
  --modal-transparent-color: var(--white-color);
  --modal-title-icon-bg: var(--theme-color-10);
  --modal-title-icon-color: var(--primary-color);
  --modal-title-icon-radius: var(--b-radius);
  --modal-title-icon-width: 1.75em;
  --modal-title-icon-aspect-ratio: 1/1;
  --modal-title-icon-margin: 0 .5rem 0 0;
  --modal-title-icon-size: 1.2em;
  --modal-title-title-line-height: 1.2;
  --main-top-padding: 1.5em;
  --main-bottom-padding: 4em;
  --main-gap: 2em;
  --button-radius: var(--b-radius);
  --button-font-size: .875em;
  --button-padding: .675em 1.5em;
  --button-padding-vertical: 1.125em 1.5em;
  --button-padding-ico-only: 0;
  --button-width-ico-only: 2.875em;
  --button-headline-width-ico-only: 2.285em;
  --button-hover-shadow: 0 .25em 1.5em var(--black-color-15);
  --button-disabled-opacity: .4;
  --button-stroke-width: 2px;
  --form-grid-gap: .75em 1em;
  --form-inline-rows-max-width: 20em;
  --form-control-margin: .75em;
  --field-font: var(--body-font);
  --field-placeholder-color: var(--theme-color-40);
  --field-border-radius: var(--b-radius);
  --field-border: 2px;
  --field-color: var(--theme-color);
  --field-bg: var(--theme-color-5);
  --field-inline-label-width: 10em;
  --field-border-color: transparent;
  --field-outline-color: var(--theme-color-10);
  --field-label-color: var(--theme-color-10);
  --field-font-size: .875em;
  --field-padding: .675em 1em;
  --field-label-font-size: var(--field-font-size);
  --field-prefix-suffix-bg: var(--theme-color-10);
  --field-disabled-opacity: .4;
  --field-padding-select: .675em 1.5em .675em 1em;
  --field-padding-date: .675em .375em .675em 1em;
  --field-padding-file: .375em 1em .375em .375em;
  --field-padding-password: .75em 2em .75em 1em;
  --field-password-icon-family: remixicon;
  --field-password-icon-show: "";
  --field-password-icon-hide: "";
  --field-padding-search: .75em 2em .75em 1em;
  --field-hover-border: var(--theme-color-10);
  --field-hover-active-border: var(--theme-color-20);
  --field-active-shadow: var(--theme-color-10);
  --field-error-border-color: var(--primary-color-60);
  --field-error-hover-border: var(--primary-color);
  --field-error-active-shadow: var(--primary-color-20);
  --field-error-label-color: var(--error-color);
  --field-notification-holder-bg: none;
  --field-notification-holder-color: currentColor;
  --field-notification-holder-padding: 1em;
  --field-notification-holder-radius: var(--b-radius);
  --field-notification-holder-border: 2px solid var(--secondary-color);
  --field-notification-holder-size: .875em;
  --field-success-holder-bg: var(--white-color);
  --field-success-holder-color: var(--primary-color);
  --field-success-holder-padding: 1em;
  --field-success-holder-radius: var(--b-radius);
  --field-success-holder-border: 2px solid var(--primary-color-30);
  --field-success-holder-size: .875em;
  --field-check-icon: "";
  --field-check-family: "remixicon";
  --field-radio-icon: "";
  --field-radio-family: "remixicon";
  --field-check-radius: 50%;
  --select-dropdown-bg: var(--theme-bg);
  --select-dropdown-color: var(--theme-color);
  --select-dropdown-border: none;
  --select-dropdown-radius: var(--b-radius);
  --select-dropdown-padding: 0;
  --select-dropdown-shadow: 0 .5em 1em var(--theme-color-20);
  --select-dropdown-list-font-size: .875em;
  --select-dropdown-list-radius: var(--b-radius);
  --select-dropdown-list-padding: .375em .75em;
  --select-dropdown-list-hover-bg: var(--theme-color-20);
  --select-dropdown-list-hover-color: var(--theme-color);
  --select-dropdown-list-selected-bg: var(--theme-color-10);
  --select-dropdown-list-selected-color: var(--theme-color);
  --nav-pills-bg: var(--field-bg);
  --nav-pills-color: var(--field-color);
  --nav-pills-border: var(--field-border);
  --nav-pills-border-color: var(--field-border-color);
  --nav-pills-padding: 0;
  --nav-pills-li-padding: 0;
  --nav-pills-li-border: 2px solid var(--theme-bg);
  --nav-pills-radius: 2em;
  --nav-pills-font-size: var(--field-font-size);
  --nav-pills-outline-bg: var(--theme-bg);
  --nav-pills-outline-color: var(--field-outline-color);
  --nav-pills-li-outline-border: 2px solid var(--theme-color-5);
  --nav-pill-padding: .675em .875em;
  --nav-pill-ico-only-padding: .375em;
  --nav-pill-ico-only-width: 1.75em;
  --nav-pill-bg: none;
  --nav-pill-color: inherit;
  --nav-pill-hover-bg: var(--primary-color);
  --nav-pill-hover-color: var(--white-color);
  --headline-size: 1.125em;
  --headline-icon-bg: var(--secondary-color);
  --headline-icon-color: var(--primary-color);
  --headline-icon-radius: 50%;
  --headline-icon-width: 1.75em;
  --headline-icon-aspect-ratio: 1/1;
  --headline-icon-margin: 0 .5rem 0 0;
  --headline-icon-size: calc(var(--headline-size) * 1.2);
  --headline-title-line-height: 1.2;
  --headline-title-font: var(--headline-font);
  --app-login-bg: url(../img/bgn-login.webp), var(--gray-color);
  --app-login-logo-image: none;
  --app-login-head-bg: linear-gradient(105deg, var(--primary-color), var(--secondary-color));
  --app-login-head-radius: var(--b-radius) var(--b-radius) 0 0;
  --app-login-head-color: var(--white-color);
  --app-login-main-bg: var(--white-color);
  --app-login-foot-bg: var(--white-color);
  --app-login-foot-radius: 0 0 var(--b-radius) var(--b-radius);
  --main-menu-gap: .5em;
  --main-menu-l1-size: .875em;
  --main-menu-l1-gap: 0;
  --main-menu-l1-padding: 1em 1em;
  --main-menu-l1-border: 0;
  --main-menu-l1-radius: 50%;
  --main-menu-l1-bg: transparent;
  --main-menu-l1-color: var(--white-color-50);
  --main-menu-l1-hover-bg: var(--secondary-color);
  --main-menu-l1-hover-color: var(--primary-color);
  --main-menu-l1-hover-border: 0;
  --main-menu-l1-active-bg: var(--white-color);
  --main-menu-l1-active-color: var(--primary-color);
  --main-menu-l1-active-border: 0;
  --main-menu-l1-icon-transform: scale(1.5);
  --main-menu-l1-icon-hover-transform: scale(1.75);
  --main-menu-l1-tip-bg: var(--white-color);
  --main-menu-l1-tip-color: var(--black-color);
  --main-menu-l1-tip-size: .875em;
  --main-menu-l1-tip-radius: var(--b-radius-sm) 3em 3em 3em;
  --main-menu-l1-tip-shadow: 0 .5em 1em var(--black-color-20);
  --main-menu-l2-inset: 100% auto auto 0;
  --main-menu-l2-inset-reverse: 100% 0 auto auto;
  --main-menu-l2-size: .875em;
  --main-menu-l2-bg: var(--theme-bg);
  --main-menu-l2-color: var(--theme-color);
  --main-menu-l2-hover-bg: var(--theme-color-5);
  --main-menu-l2-hover-color: var(--primary-color);
  --main-menu-l2-radius: var(--b-radius);
  --main-menu-l2-shadow: 0 .5em 1em var(--black-color-20);
  --main-menu-l2-padding: .5em;
  --main-menu-l2-gap: .125em;
  --main-menu-l2-link-radius: var(--b-radius-sm);
  --main-menu-cols-width: 13em;
  --main-menu-cols-height: 24em;
  --app-theme-switch-size: 1.5em;
  --app-theme-switch-color: currentColor;
  --theme-switch-color-hover: var(--primary-color);
  --app-menu-trigger-font: remixicon;
  --app-menu-trigger-icon-open: "";
  --app-menu-trigger-icon-close: "";
  --app-menu-trigger-size: 1.5em;
  --app-menu-trigger-width: 1em;
  --app-menu-trigger-color: var(--theme-color);
  --app-menu-resp-drawer-bg: var(--theme-bg);
  --app-menu-resp-drawer-color: var(--theme-color);
  --app-menu-resp-drawer-padding: 3.5em 1em 1.5em 1.5em;
  --app-menu-resp-drawer-scrollbar-padding: .5em;
  --app-menu-resp-drawer-shadow: 0 .5em 1.5em var(--black-color-20);
  --app-menu-resp-drawer-radius: var(--b-radius-md);
  --datatable-font-size: .875em;
  --datatable-gap: .5em 1em;
  --datatable-top-margin: 1em;
  --datatable-bottom-margin: 1em;
  --datatable-loader-width: 46px;
  --datatable-loader-dot-size: 5px;
  --datatable-th-bg: var(--theme-bg);
  --datatable-th-color: var(--theme-color-70);
  --datatable-th-border: 2px solid var(--primary-color-darker-10);
  --datatable-th-padding: .5rem .75rem;
  --datatable-th-padding-sticky: calc(.5rem + 2px) .75rem calc(.5rem + 1px);
  --datatable-td-border: 1px solid var(--theme-color-10);
  --datatable-td-padding: .5rem .75rem;
  --datatable-td-odd-shadow: inset 0 0 0 9999px var(--theme-color-3);
  --datatable-td-odd-hover-shadow: inset 0 0 0 9999px var(--theme-color-6);
  --datatable-td-odd-sort-shadow: inset 0 0 0 9999px var(--theme-color-6);
  --datatable-td-odd-sort-hover-shadow: inset 0 0 0 9999px var(--theme-color-9);
  --datatable-tr-hover-bg: var(--theme-color-3);
  --datatable-tr-odd-bg: var(--theme-color-3);
  --datatable-tr-odd-hover-bg: var(--theme-color-5);
  --datatable-td-even-shadow: inset 0 0 0 9999px transparent;
  --datatable-td-even-sort-shadow: inset 0 0 0 9999px var(--theme-color-3);
  --datatable-td-even-hover-shadow: inset 0 0 0 9999px var(--theme-color-7);
  --datatable-td-even-sort-hover-shadow: inset 0 0 0 9999px var(--theme-color-10);
  --datatable-tr-even-bg: transparent;
  --datatable-tr-even-hover-bg: var(--theme-color-5);
  --datatable-foot-bottom: 3.9em;
  --datatable-options-bottom: 0;
  --datatable-pagination-bg: unset;
  --datatable-pagination-color: var(--theme-color);
  --datatable-pagination-border: 1px solid var(--theme-color-10);
  --datatable-pagination-radius: var(--b-radius-sm);
  --datatable-pagination-hover-bg: var(--theme-color-5);
  --datatable-pagination-hover-color: var(--theme-color);
  --datatable-pagination-hover-border: 1px solid var(--theme-color-20);
  --datatable-pagination-current-bg: var(--primary-color);
  --datatable-pagination-current-color: var(--white-color);
  --datatable-pagination-current-border: 1px solid transparent;
  --datatable-pagination-padding: .375em .75em;
  --datatable-pagination-prev-next-font: remixicon;
  --datatable-pagination-prev-next-padding: .375em .5em;
  --datatable-pagination-prev-icon: "";
  --datatable-pagination-next-icon: "";
  --datatable-pagination-first-icon: "";
  --datatable-pagination-last-icon: "";
  --address-book-nav-bg: var(--theme-color-5);
  --address-book-nav-color: var(--theme-color);
  --address-book-nav-radius: var(--b-radius);
  --address-book-nav-padding: .25em;
  --address-book-nav-gap: 0;
  --address-book-nav-item-padding: .25em .5em;
  --address-book-nav-item-radius: var(--b-radius);
  --address-book-nav-item-bg: transparent;
  --address-book-nav-item-color: var(--theme-color);
  --address-book-nav-item-other-color: var(--theme-color-40);
  --address-book-nav-item-hover-bg: var(--theme-color-20);
  --address-book-nav-item-hover-color: var(--theme-color);
  --address-book-list-gap: .75em;
  --address-book-letter-size: 1.25em;
  --address-book-letter-weight: bold;
  --address-book-letter-bg: var(--theme-bg);
  --address-book-letter-color: var(--primary-color);
  --address-book-letter-padding: .25em 0 .5em;
  --card-contact-bg: var(--theme-bg);
  --card-contact-hover-bg: var(--theme-color-5);
  --card-contact-color: var(--theme-color);
  --card-contact-hover-color: var(--primary-color);
  --card-contact-padding: .5em .75em;
  --card-contact-border: 1px solid var(--theme-color-10);
  --card-contact-hover-border: 1px solid var(--primary-color);
  --card-contact-radius: var(--b-radius);
  --card-info-title-size: 1.375em;
  --card-info-primary-size: 1em;
  --card-info-primary-color: var(--theme-color);
  --card-info-secondary-size: .875em;
  --card-info-secondary-color: var(--theme-color-50);
  --card-info-icon-family: remixicon;
  --card-info-icon-phone: "";
  --card-info-icon-map: "";
  --card-info-icon-mail: "";
  --card-info-icon-code: "";
}

/* Light theme config
---------------------------------------------------------------- */
html.light-theme-on {
  --theme-bg-hs: 0deg 0%;
  --theme-bg-l: 100%;
  --theme-color-hs: 0deg 0%;
  --theme-color-l: 24%;
  --field-select-arrow: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIiA/Pgo8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHZlcnNpb249IjEuMSIgd2lkdGg9IjEyODAiIGhlaWdodD0iMTA4MCIgdmlld0JveD0iMCAwIDEyODAgMTA4MCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxkZXNjPkNyZWF0ZWQgd2l0aCBGYWJyaWMuanMgNS4yLjQ8L2Rlc2M+CjxkZWZzPgo8L2RlZnM+CjxnIHRyYW5zZm9ybT0ibWF0cml4KDEgMCAwIDEgNjQwIDU0MCkiIGlkPSJjZTc0NjFjOS03NDY4LTQ5MTktOGY2Yy03OWMxZGRlYzZmYWIiICA+CjxyZWN0IHN0eWxlPSJzdHJva2U6IG5vbmU7IHN0cm9rZS13aWR0aDogMTsgc3Ryb2tlLWRhc2hhcnJheTogbm9uZTsgc3Ryb2tlLWxpbmVjYXA6IGJ1dHQ7IHN0cm9rZS1kYXNob2Zmc2V0OiAwOyBzdHJva2UtbGluZWpvaW46IG1pdGVyOyBzdHJva2UtbWl0ZXJsaW1pdDogNDsgZmlsbDogcmdiKDI1NSwyNTUsMjU1KTsgZmlsbC1ydWxlOiBub256ZXJvOyBvcGFjaXR5OiAxOyB2aXNpYmlsaXR5OiBoaWRkZW47IiB2ZWN0b3ItZWZmZWN0PSJub24tc2NhbGluZy1zdHJva2UiICB4PSItNjQwIiB5PSItNTQwIiByeD0iMCIgcnk9IjAiIHdpZHRoPSIxMjgwIiBoZWlnaHQ9IjEwODAiIC8+CjwvZz4KPGcgdHJhbnNmb3JtPSJtYXRyaXgoSW5maW5pdHkgTmFOIE5hTiBJbmZpbml0eSAwIDApIiBpZD0iZWI0ZDVmZTctZWEwOS00MjczLTk3ZmQtODUwYjg2OTRlYWJmIiAgPgo8L2c+CjxnIHRyYW5zZm9ybT0ibWF0cml4KDQyLjE5IDAgMCA0Mi4xOSA2NDAgNTQwKSIgID4KPGcgc3R5bGU9IiIgdmVjdG9yLWVmZmVjdD0ibm9uLXNjYWxpbmctc3Ryb2tlIiAgID4KCQk8ZyB0cmFuc2Zvcm09Im1hdHJpeCgxIDAgMCAxIDAgMCkiICA+CjxwYXRoIHN0eWxlPSJzdHJva2U6IG5vbmU7IHN0cm9rZS13aWR0aDogMTsgc3Ryb2tlLWRhc2hhcnJheTogbm9uZTsgc3Ryb2tlLWxpbmVjYXA6IGJ1dHQ7IHN0cm9rZS1kYXNob2Zmc2V0OiAwOyBzdHJva2UtbGluZWpvaW46IG1pdGVyOyBzdHJva2UtbWl0ZXJsaW1pdDogNDsgZmlsbDogbm9uZTsgZmlsbC1ydWxlOiBub256ZXJvOyBvcGFjaXR5OiAxOyIgdmVjdG9yLWVmZmVjdD0ibm9uLXNjYWxpbmctc3Ryb2tlIiAgdHJhbnNmb3JtPSIgdHJhbnNsYXRlKC0xMiwgLTEyKSIgZD0iTSAwIDAgTCAyNCAwIEwgMjQgMjQgTCAwIDI0IHoiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgLz4KPC9nPgoJCTxnIHRyYW5zZm9ybT0ibWF0cml4KDEgMCAwIDEgMCAwLjExKSIgID4KPHBhdGggc3R5bGU9InN0cm9rZTogbm9uZTsgc3Ryb2tlLXdpZHRoOiAxOyBzdHJva2UtZGFzaGFycmF5OiBub25lOyBzdHJva2UtbGluZWNhcDogYnV0dDsgc3Ryb2tlLWRhc2hvZmZzZXQ6IDA7IHN0cm9rZS1saW5lam9pbjogbWl0ZXI7IHN0cm9rZS1taXRlcmxpbWl0OiA0OyBmaWxsOiByZ2IoMCwwLDApOyBmaWxsLXJ1bGU6IG5vbnplcm87IG9wYWNpdHk6IDE7IiB2ZWN0b3ItZWZmZWN0PSJub24tc2NhbGluZy1zdHJva2UiICB0cmFuc2Zvcm09IiB0cmFuc2xhdGUoLTEyLCAtMTIuMTEpIiBkPSJNIDEyIDEzLjE3MiBMIDE2Ljk1IDguMjIyMDAwMDAwMDAwMDAxIEwgMTguMzY0IDkuNjM2MDAwMDAwMDAwMDAxIEwgMTIgMTYgTCA1LjYzNiA5LjYzNiBMIDcuMDUgOC4yMjIgeiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiAvPgo8L2c+CjwvZz4KPC9nPgo8L3N2Zz4=");
  --field-calendar-icon: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0iY3VycmVudENvbG9yIj48cGF0aCBkPSJNOSAxVjNIMTVWMUgxN1YzSDIxQzIxLjU1MjMgMyAyMiAzLjQ0NzcyIDIyIDRWMjBDMjIgMjAuNTUyMyAyMS41NTIzIDIxIDIxIDIxSDNDMi40NDc3MiAyMSAyIDIwLjU1MjMgMiAyMFY0QzIgMy40NDc3MiAyLjQ0NzcyIDMgMyAzSDdWMUg5Wk0yMCAxMUg0VjE5SDIwVjExWk03IDVINFY5SDIwVjVIMTdWN0gxNVY1SDlWN0g3VjVaIj48L3BhdGg+PC9zdmc+");
  --field-search-icon: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0iY3VycmVudENvbG9yIj48cGF0aCBkPSJNMTguMDMxIDE2LjYxNjhMMjIuMzEzNyAyMC44OTk1TDIwLjg5OTUgMjIuMzEzN0wxNi42MTY4IDE4LjAzMUMxNS4wNzY5IDE5LjI2MyAxMy4xMjQgMjAgMTEgMjBDNi4wMzIgMjAgMiAxNS45NjggMiAxMUMyIDYuMDMyIDYuMDMyIDIgMTEgMkMxNS45NjggMiAyMCA2LjAzMiAyMCAxMUMyMCAxMy4xMjQgMTkuMjYzIDE1LjA3NjkgMTguMDMxIDE2LjYxNjhaTTE2LjAyNDcgMTUuODc0OEMxNy4yNDc1IDE0LjYxNDYgMTggMTIuODk1NiAxOCAxMUMxOCA3LjEzMjUgMTQuODY3NSA0IDExIDRDNy4xMzI1IDQgNCA3LjEzMjUgNCAxMUM0IDE0Ljg2NzUgNy4xMzI1IDE4IDExIDE4QzEyLjg5NTYgMTggMTQuNjE0NiAxNy4yNDc1IDE1Ljg3NDggMTYuMDI0N0wxNi4wMjQ3IDE1Ljg3NDhaIj48L3BhdGg+PC9zdmc+");
  --field-reset-search-icon: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0iY3VycmVudENvbG9yIj48cGF0aCBkPSJNMTEuOTk5NyAxMC41ODY1TDE2Ljk0OTUgNS42MzY3MkwxOC4zNjM3IDcuMDUwOTNMMTMuNDEzOSAxMi4wMDA3TDE4LjM2MzcgMTYuOTUwNEwxNi45NDk1IDE4LjM2NDZMMTEuOTk5NyAxMy40MTQ5TDcuMDQ5OTYgMTguMzY0Nkw1LjYzNTc0IDE2Ljk1MDRMMTAuNTg1NSAxMi4wMDA3TDUuNjM1NzQgNy4wNTA5M0w3LjA0OTk2IDUuNjM2NzJMMTEuOTk5NyAxMC41ODY1WiI+PC9wYXRoPjwvc3ZnPg==");
  --app-myoffice-logo-image: url(../img/myoffice-logo-dark.webp) no-repeat;
  --main-menu-l1-backdrop-bg: var(--black-color-50);
  --app-menu-resp-l2-shadow: 0 0 0 1px var(--black-color-10) inset;
}

/* Variables
---------------------------------------------------------------- */
* {
  --primary-color-hsl: var(--primary-color-hs) var(--primary-color-l);
  --primary-color: hsl(var(--primary-color-hs) var(--primary-color-l));
  --secondary-color-hsl: var(--secondary-color-hs) var(--secondary-color-l);
  --secondary-color: hsl(var(--secondary-color-hs) var(--secondary-color-l));
  --theme-bg-hsl: var(--theme-bg-hs) var(--theme-bg-l);
  --theme-bg: hsl(var(--theme-bg-hs) var(--theme-bg-l));
  --theme-color-hsl: var(--theme-color-hs) var(--theme-color-l);
  --theme-color: hsl(var(--theme-color-hs) var(--theme-color-l));
  --white-color-hsl: 0deg 100% 100%;
  --white-color: hsl(var(--white-color-hsl));
  --gray-color-hsl: 0deg 0% 9%;
  --gray-color: hsl(var(--gray-color-hsl));
  --black-color-hsl: 0deg 0% 0%;
  --black-color: hsl(var(--black-color-hsl));
  --success-color-hsl: var(--success-color-hs) var(--success-color-l);
  --success-color: hsl(var(--success-color-hs) var(--success-color-l));
  --warning-color-hsl: var(--warning-color-hs) var(--warning-color-l);
  --warning-color: hsl(var(--warning-color-hs) var(--warning-color-l));
  --error-color-hsl: var(--error-color-hs) var(--error-color-l);
  --error-color: hsl(var(--error-color-hs) var(--error-color-l));
  --blue-color-hsl: var(--blue-color-hs) var(--blue-color-l);
  --blue-color: hsl(var(--blue-color-hs) var(--blue-color-l));
  --primary-color-2: hsl(var(--primary-color-hsl) / calc(2 * 1%));
  --secondary-color-2: hsl(var(--secondary-color-hsl) / calc(2 * 1%));
  --theme-bg-2: hsl(var(--theme-bg-hsl) / calc(2 * 1%));
  --theme-color-2: hsl(var(--theme-color-hsl) / calc(2 * 1%));
  --white-color-2: hsl(var(--white-color-hsl) / calc(2 * 1%));
  --gray-color-2: hsl(var(--gray-color-hsl) / calc(2 * 1%));
  --black-color-2: hsl(var(--black-color-hsl) / calc(2 * 1%));
  --success-color-2: hsl(var(--success-color-hsl) / calc(2 * 1%));
  --warning-color-2: hsl(var(--warning-color-hsl) / calc(2 * 1%));
  --error-color-2: hsl(var(--error-color-hsl) / calc(2 * 1%));
  --blue-color-2: hsl(var(--blue-color-hsl) / calc(2 * 1%));
  --primary-color-3: hsl(var(--primary-color-hsl) / calc(3 * 1%));
  --secondary-color-3: hsl(var(--secondary-color-hsl) / calc(3 * 1%));
  --theme-bg-3: hsl(var(--theme-bg-hsl) / calc(3 * 1%));
  --theme-color-3: hsl(var(--theme-color-hsl) / calc(3 * 1%));
  --white-color-3: hsl(var(--white-color-hsl) / calc(3 * 1%));
  --gray-color-3: hsl(var(--gray-color-hsl) / calc(3 * 1%));
  --black-color-3: hsl(var(--black-color-hsl) / calc(3 * 1%));
  --success-color-3: hsl(var(--success-color-hsl) / calc(3 * 1%));
  --warning-color-3: hsl(var(--warning-color-hsl) / calc(3 * 1%));
  --error-color-3: hsl(var(--error-color-hsl) / calc(3 * 1%));
  --blue-color-3: hsl(var(--blue-color-hsl) / calc(3 * 1%));
  --primary-color-4: hsl(var(--primary-color-hsl) / calc(4 * 1%));
  --secondary-color-4: hsl(var(--secondary-color-hsl) / calc(4 * 1%));
  --theme-bg-4: hsl(var(--theme-bg-hsl) / calc(4 * 1%));
  --theme-color-4: hsl(var(--theme-color-hsl) / calc(4 * 1%));
  --white-color-4: hsl(var(--white-color-hsl) / calc(4 * 1%));
  --gray-color-4: hsl(var(--gray-color-hsl) / calc(4 * 1%));
  --black-color-4: hsl(var(--black-color-hsl) / calc(4 * 1%));
  --success-color-4: hsl(var(--success-color-hsl) / calc(4 * 1%));
  --warning-color-4: hsl(var(--warning-color-hsl) / calc(4 * 1%));
  --error-color-4: hsl(var(--error-color-hsl) / calc(4 * 1%));
  --blue-color-4: hsl(var(--blue-color-hsl) / calc(4 * 1%));
  --primary-color-5: hsl(var(--primary-color-hsl) / calc(5 * 1%));
  --secondary-color-5: hsl(var(--secondary-color-hsl) / calc(5 * 1%));
  --theme-bg-5: hsl(var(--theme-bg-hsl) / calc(5 * 1%));
  --theme-color-5: hsl(var(--theme-color-hsl) / calc(5 * 1%));
  --white-color-5: hsl(var(--white-color-hsl) / calc(5 * 1%));
  --gray-color-5: hsl(var(--gray-color-hsl) / calc(5 * 1%));
  --black-color-5: hsl(var(--black-color-hsl) / calc(5 * 1%));
  --success-color-5: hsl(var(--success-color-hsl) / calc(5 * 1%));
  --warning-color-5: hsl(var(--warning-color-hsl) / calc(5 * 1%));
  --error-color-5: hsl(var(--error-color-hsl) / calc(5 * 1%));
  --blue-color-5: hsl(var(--blue-color-hsl) / calc(5 * 1%));
  --primary-color-6: hsl(var(--primary-color-hsl) / calc(6 * 1%));
  --secondary-color-6: hsl(var(--secondary-color-hsl) / calc(6 * 1%));
  --theme-bg-6: hsl(var(--theme-bg-hsl) / calc(6 * 1%));
  --theme-color-6: hsl(var(--theme-color-hsl) / calc(6 * 1%));
  --white-color-6: hsl(var(--white-color-hsl) / calc(6 * 1%));
  --gray-color-6: hsl(var(--gray-color-hsl) / calc(6 * 1%));
  --black-color-6: hsl(var(--black-color-hsl) / calc(6 * 1%));
  --success-color-6: hsl(var(--success-color-hsl) / calc(6 * 1%));
  --warning-color-6: hsl(var(--warning-color-hsl) / calc(6 * 1%));
  --error-color-6: hsl(var(--error-color-hsl) / calc(6 * 1%));
  --blue-color-6: hsl(var(--blue-color-hsl) / calc(6 * 1%));
  --primary-color-7: hsl(var(--primary-color-hsl) / calc(7 * 1%));
  --secondary-color-7: hsl(var(--secondary-color-hsl) / calc(7 * 1%));
  --theme-bg-7: hsl(var(--theme-bg-hsl) / calc(7 * 1%));
  --theme-color-7: hsl(var(--theme-color-hsl) / calc(7 * 1%));
  --white-color-7: hsl(var(--white-color-hsl) / calc(7 * 1%));
  --gray-color-7: hsl(var(--gray-color-hsl) / calc(7 * 1%));
  --black-color-7: hsl(var(--black-color-hsl) / calc(7 * 1%));
  --success-color-7: hsl(var(--success-color-hsl) / calc(7 * 1%));
  --warning-color-7: hsl(var(--warning-color-hsl) / calc(7 * 1%));
  --error-color-7: hsl(var(--error-color-hsl) / calc(7 * 1%));
  --blue-color-7: hsl(var(--blue-color-hsl) / calc(7 * 1%));
  --primary-color-8: hsl(var(--primary-color-hsl) / calc(8 * 1%));
  --secondary-color-8: hsl(var(--secondary-color-hsl) / calc(8 * 1%));
  --theme-bg-8: hsl(var(--theme-bg-hsl) / calc(8 * 1%));
  --theme-color-8: hsl(var(--theme-color-hsl) / calc(8 * 1%));
  --white-color-8: hsl(var(--white-color-hsl) / calc(8 * 1%));
  --gray-color-8: hsl(var(--gray-color-hsl) / calc(8 * 1%));
  --black-color-8: hsl(var(--black-color-hsl) / calc(8 * 1%));
  --success-color-8: hsl(var(--success-color-hsl) / calc(8 * 1%));
  --warning-color-8: hsl(var(--warning-color-hsl) / calc(8 * 1%));
  --error-color-8: hsl(var(--error-color-hsl) / calc(8 * 1%));
  --blue-color-8: hsl(var(--blue-color-hsl) / calc(8 * 1%));
  --primary-color-9: hsl(var(--primary-color-hsl) / calc(9 * 1%));
  --secondary-color-9: hsl(var(--secondary-color-hsl) / calc(9 * 1%));
  --theme-bg-9: hsl(var(--theme-bg-hsl) / calc(9 * 1%));
  --theme-color-9: hsl(var(--theme-color-hsl) / calc(9 * 1%));
  --white-color-9: hsl(var(--white-color-hsl) / calc(9 * 1%));
  --gray-color-9: hsl(var(--gray-color-hsl) / calc(9 * 1%));
  --black-color-9: hsl(var(--black-color-hsl) / calc(9 * 1%));
  --success-color-9: hsl(var(--success-color-hsl) / calc(9 * 1%));
  --warning-color-9: hsl(var(--warning-color-hsl) / calc(9 * 1%));
  --error-color-9: hsl(var(--error-color-hsl) / calc(9 * 1%));
  --blue-color-9: hsl(var(--blue-color-hsl) / calc(9 * 1%));
  --primary-color-10: hsl(var(--primary-color-hsl) / calc(10 * 1%));
  --secondary-color-10: hsl(var(--secondary-color-hsl) / calc(10 * 1%));
  --theme-bg-10: hsl(var(--theme-bg-hsl) / calc(10 * 1%));
  --theme-color-10: hsl(var(--theme-color-hsl) / calc(10 * 1%));
  --white-color-10: hsl(var(--white-color-hsl) / calc(10 * 1%));
  --gray-color-10: hsl(var(--gray-color-hsl) / calc(10 * 1%));
  --black-color-10: hsl(var(--black-color-hsl) / calc(10 * 1%));
  --success-color-10: hsl(var(--success-color-hsl) / calc(10 * 1%));
  --warning-color-10: hsl(var(--warning-color-hsl) / calc(10 * 1%));
  --error-color-10: hsl(var(--error-color-hsl) / calc(10 * 1%));
  --blue-color-10: hsl(var(--blue-color-hsl) / calc(10 * 1%));
  --primary-color-15: hsl(var(--primary-color-hsl) / calc(15 * 1%));
  --secondary-color-15: hsl(var(--secondary-color-hsl) / calc(15 * 1%));
  --theme-bg-15: hsl(var(--theme-bg-hsl) / calc(15 * 1%));
  --theme-color-15: hsl(var(--theme-color-hsl) / calc(15 * 1%));
  --white-color-15: hsl(var(--white-color-hsl) / calc(15 * 1%));
  --gray-color-15: hsl(var(--gray-color-hsl) / calc(15 * 1%));
  --black-color-15: hsl(var(--black-color-hsl) / calc(15 * 1%));
  --success-color-15: hsl(var(--success-color-hsl) / calc(15 * 1%));
  --warning-color-15: hsl(var(--warning-color-hsl) / calc(15 * 1%));
  --error-color-15: hsl(var(--error-color-hsl) / calc(15 * 1%));
  --blue-color-15: hsl(var(--blue-color-hsl) / calc(15 * 1%));
  --primary-color-20: hsl(var(--primary-color-hsl) / calc(20 * 1%));
  --secondary-color-20: hsl(var(--secondary-color-hsl) / calc(20 * 1%));
  --theme-bg-20: hsl(var(--theme-bg-hsl) / calc(20 * 1%));
  --theme-color-20: hsl(var(--theme-color-hsl) / calc(20 * 1%));
  --white-color-20: hsl(var(--white-color-hsl) / calc(20 * 1%));
  --gray-color-20: hsl(var(--gray-color-hsl) / calc(20 * 1%));
  --black-color-20: hsl(var(--black-color-hsl) / calc(20 * 1%));
  --success-color-20: hsl(var(--success-color-hsl) / calc(20 * 1%));
  --warning-color-20: hsl(var(--warning-color-hsl) / calc(20 * 1%));
  --error-color-20: hsl(var(--error-color-hsl) / calc(20 * 1%));
  --blue-color-20: hsl(var(--blue-color-hsl) / calc(20 * 1%));
  --primary-color-25: hsl(var(--primary-color-hsl) / calc(25 * 1%));
  --secondary-color-25: hsl(var(--secondary-color-hsl) / calc(25 * 1%));
  --theme-bg-25: hsl(var(--theme-bg-hsl) / calc(25 * 1%));
  --theme-color-25: hsl(var(--theme-color-hsl) / calc(25 * 1%));
  --white-color-25: hsl(var(--white-color-hsl) / calc(25 * 1%));
  --gray-color-25: hsl(var(--gray-color-hsl) / calc(25 * 1%));
  --black-color-25: hsl(var(--black-color-hsl) / calc(25 * 1%));
  --success-color-25: hsl(var(--success-color-hsl) / calc(25 * 1%));
  --warning-color-25: hsl(var(--warning-color-hsl) / calc(25 * 1%));
  --error-color-25: hsl(var(--error-color-hsl) / calc(25 * 1%));
  --blue-color-25: hsl(var(--blue-color-hsl) / calc(25 * 1%));
  --primary-color-30: hsl(var(--primary-color-hsl) / calc(30 * 1%));
  --secondary-color-30: hsl(var(--secondary-color-hsl) / calc(30 * 1%));
  --theme-bg-30: hsl(var(--theme-bg-hsl) / calc(30 * 1%));
  --theme-color-30: hsl(var(--theme-color-hsl) / calc(30 * 1%));
  --white-color-30: hsl(var(--white-color-hsl) / calc(30 * 1%));
  --gray-color-30: hsl(var(--gray-color-hsl) / calc(30 * 1%));
  --black-color-30: hsl(var(--black-color-hsl) / calc(30 * 1%));
  --success-color-30: hsl(var(--success-color-hsl) / calc(30 * 1%));
  --warning-color-30: hsl(var(--warning-color-hsl) / calc(30 * 1%));
  --error-color-30: hsl(var(--error-color-hsl) / calc(30 * 1%));
  --blue-color-30: hsl(var(--blue-color-hsl) / calc(30 * 1%));
  --primary-color-35: hsl(var(--primary-color-hsl) / calc(35 * 1%));
  --secondary-color-35: hsl(var(--secondary-color-hsl) / calc(35 * 1%));
  --theme-bg-35: hsl(var(--theme-bg-hsl) / calc(35 * 1%));
  --theme-color-35: hsl(var(--theme-color-hsl) / calc(35 * 1%));
  --white-color-35: hsl(var(--white-color-hsl) / calc(35 * 1%));
  --gray-color-35: hsl(var(--gray-color-hsl) / calc(35 * 1%));
  --black-color-35: hsl(var(--black-color-hsl) / calc(35 * 1%));
  --success-color-35: hsl(var(--success-color-hsl) / calc(35 * 1%));
  --warning-color-35: hsl(var(--warning-color-hsl) / calc(35 * 1%));
  --error-color-35: hsl(var(--error-color-hsl) / calc(35 * 1%));
  --blue-color-35: hsl(var(--blue-color-hsl) / calc(35 * 1%));
  --primary-color-40: hsl(var(--primary-color-hsl) / calc(40 * 1%));
  --secondary-color-40: hsl(var(--secondary-color-hsl) / calc(40 * 1%));
  --theme-bg-40: hsl(var(--theme-bg-hsl) / calc(40 * 1%));
  --theme-color-40: hsl(var(--theme-color-hsl) / calc(40 * 1%));
  --white-color-40: hsl(var(--white-color-hsl) / calc(40 * 1%));
  --gray-color-40: hsl(var(--gray-color-hsl) / calc(40 * 1%));
  --black-color-40: hsl(var(--black-color-hsl) / calc(40 * 1%));
  --success-color-40: hsl(var(--success-color-hsl) / calc(40 * 1%));
  --warning-color-40: hsl(var(--warning-color-hsl) / calc(40 * 1%));
  --error-color-40: hsl(var(--error-color-hsl) / calc(40 * 1%));
  --blue-color-40: hsl(var(--blue-color-hsl) / calc(40 * 1%));
  --primary-color-45: hsl(var(--primary-color-hsl) / calc(45 * 1%));
  --secondary-color-45: hsl(var(--secondary-color-hsl) / calc(45 * 1%));
  --theme-bg-45: hsl(var(--theme-bg-hsl) / calc(45 * 1%));
  --theme-color-45: hsl(var(--theme-color-hsl) / calc(45 * 1%));
  --white-color-45: hsl(var(--white-color-hsl) / calc(45 * 1%));
  --gray-color-45: hsl(var(--gray-color-hsl) / calc(45 * 1%));
  --black-color-45: hsl(var(--black-color-hsl) / calc(45 * 1%));
  --success-color-45: hsl(var(--success-color-hsl) / calc(45 * 1%));
  --warning-color-45: hsl(var(--warning-color-hsl) / calc(45 * 1%));
  --error-color-45: hsl(var(--error-color-hsl) / calc(45 * 1%));
  --blue-color-45: hsl(var(--blue-color-hsl) / calc(45 * 1%));
  --primary-color-50: hsl(var(--primary-color-hsl) / calc(50 * 1%));
  --secondary-color-50: hsl(var(--secondary-color-hsl) / calc(50 * 1%));
  --theme-bg-50: hsl(var(--theme-bg-hsl) / calc(50 * 1%));
  --theme-color-50: hsl(var(--theme-color-hsl) / calc(50 * 1%));
  --white-color-50: hsl(var(--white-color-hsl) / calc(50 * 1%));
  --gray-color-50: hsl(var(--gray-color-hsl) / calc(50 * 1%));
  --black-color-50: hsl(var(--black-color-hsl) / calc(50 * 1%));
  --success-color-50: hsl(var(--success-color-hsl) / calc(50 * 1%));
  --warning-color-50: hsl(var(--warning-color-hsl) / calc(50 * 1%));
  --error-color-50: hsl(var(--error-color-hsl) / calc(50 * 1%));
  --blue-color-50: hsl(var(--blue-color-hsl) / calc(50 * 1%));
  --primary-color-55: hsl(var(--primary-color-hsl) / calc(55 * 1%));
  --secondary-color-55: hsl(var(--secondary-color-hsl) / calc(55 * 1%));
  --theme-bg-55: hsl(var(--theme-bg-hsl) / calc(55 * 1%));
  --theme-color-55: hsl(var(--theme-color-hsl) / calc(55 * 1%));
  --white-color-55: hsl(var(--white-color-hsl) / calc(55 * 1%));
  --gray-color-55: hsl(var(--gray-color-hsl) / calc(55 * 1%));
  --black-color-55: hsl(var(--black-color-hsl) / calc(55 * 1%));
  --success-color-55: hsl(var(--success-color-hsl) / calc(55 * 1%));
  --warning-color-55: hsl(var(--warning-color-hsl) / calc(55 * 1%));
  --error-color-55: hsl(var(--error-color-hsl) / calc(55 * 1%));
  --blue-color-55: hsl(var(--blue-color-hsl) / calc(55 * 1%));
  --primary-color-60: hsl(var(--primary-color-hsl) / calc(60 * 1%));
  --secondary-color-60: hsl(var(--secondary-color-hsl) / calc(60 * 1%));
  --theme-bg-60: hsl(var(--theme-bg-hsl) / calc(60 * 1%));
  --theme-color-60: hsl(var(--theme-color-hsl) / calc(60 * 1%));
  --white-color-60: hsl(var(--white-color-hsl) / calc(60 * 1%));
  --gray-color-60: hsl(var(--gray-color-hsl) / calc(60 * 1%));
  --black-color-60: hsl(var(--black-color-hsl) / calc(60 * 1%));
  --success-color-60: hsl(var(--success-color-hsl) / calc(60 * 1%));
  --warning-color-60: hsl(var(--warning-color-hsl) / calc(60 * 1%));
  --error-color-60: hsl(var(--error-color-hsl) / calc(60 * 1%));
  --blue-color-60: hsl(var(--blue-color-hsl) / calc(60 * 1%));
  --primary-color-65: hsl(var(--primary-color-hsl) / calc(65 * 1%));
  --secondary-color-65: hsl(var(--secondary-color-hsl) / calc(65 * 1%));
  --theme-bg-65: hsl(var(--theme-bg-hsl) / calc(65 * 1%));
  --theme-color-65: hsl(var(--theme-color-hsl) / calc(65 * 1%));
  --white-color-65: hsl(var(--white-color-hsl) / calc(65 * 1%));
  --gray-color-65: hsl(var(--gray-color-hsl) / calc(65 * 1%));
  --black-color-65: hsl(var(--black-color-hsl) / calc(65 * 1%));
  --success-color-65: hsl(var(--success-color-hsl) / calc(65 * 1%));
  --warning-color-65: hsl(var(--warning-color-hsl) / calc(65 * 1%));
  --error-color-65: hsl(var(--error-color-hsl) / calc(65 * 1%));
  --blue-color-65: hsl(var(--blue-color-hsl) / calc(65 * 1%));
  --primary-color-70: hsl(var(--primary-color-hsl) / calc(70 * 1%));
  --secondary-color-70: hsl(var(--secondary-color-hsl) / calc(70 * 1%));
  --theme-bg-70: hsl(var(--theme-bg-hsl) / calc(70 * 1%));
  --theme-color-70: hsl(var(--theme-color-hsl) / calc(70 * 1%));
  --white-color-70: hsl(var(--white-color-hsl) / calc(70 * 1%));
  --gray-color-70: hsl(var(--gray-color-hsl) / calc(70 * 1%));
  --black-color-70: hsl(var(--black-color-hsl) / calc(70 * 1%));
  --success-color-70: hsl(var(--success-color-hsl) / calc(70 * 1%));
  --warning-color-70: hsl(var(--warning-color-hsl) / calc(70 * 1%));
  --error-color-70: hsl(var(--error-color-hsl) / calc(70 * 1%));
  --blue-color-70: hsl(var(--blue-color-hsl) / calc(70 * 1%));
  --primary-color-75: hsl(var(--primary-color-hsl) / calc(75 * 1%));
  --secondary-color-75: hsl(var(--secondary-color-hsl) / calc(75 * 1%));
  --theme-bg-75: hsl(var(--theme-bg-hsl) / calc(75 * 1%));
  --theme-color-75: hsl(var(--theme-color-hsl) / calc(75 * 1%));
  --white-color-75: hsl(var(--white-color-hsl) / calc(75 * 1%));
  --gray-color-75: hsl(var(--gray-color-hsl) / calc(75 * 1%));
  --black-color-75: hsl(var(--black-color-hsl) / calc(75 * 1%));
  --success-color-75: hsl(var(--success-color-hsl) / calc(75 * 1%));
  --warning-color-75: hsl(var(--warning-color-hsl) / calc(75 * 1%));
  --error-color-75: hsl(var(--error-color-hsl) / calc(75 * 1%));
  --blue-color-75: hsl(var(--blue-color-hsl) / calc(75 * 1%));
  --primary-color-80: hsl(var(--primary-color-hsl) / calc(80 * 1%));
  --secondary-color-80: hsl(var(--secondary-color-hsl) / calc(80 * 1%));
  --theme-bg-80: hsl(var(--theme-bg-hsl) / calc(80 * 1%));
  --theme-color-80: hsl(var(--theme-color-hsl) / calc(80 * 1%));
  --white-color-80: hsl(var(--white-color-hsl) / calc(80 * 1%));
  --gray-color-80: hsl(var(--gray-color-hsl) / calc(80 * 1%));
  --black-color-80: hsl(var(--black-color-hsl) / calc(80 * 1%));
  --success-color-80: hsl(var(--success-color-hsl) / calc(80 * 1%));
  --warning-color-80: hsl(var(--warning-color-hsl) / calc(80 * 1%));
  --error-color-80: hsl(var(--error-color-hsl) / calc(80 * 1%));
  --blue-color-80: hsl(var(--blue-color-hsl) / calc(80 * 1%));
  --primary-color-85: hsl(var(--primary-color-hsl) / calc(85 * 1%));
  --secondary-color-85: hsl(var(--secondary-color-hsl) / calc(85 * 1%));
  --theme-bg-85: hsl(var(--theme-bg-hsl) / calc(85 * 1%));
  --theme-color-85: hsl(var(--theme-color-hsl) / calc(85 * 1%));
  --white-color-85: hsl(var(--white-color-hsl) / calc(85 * 1%));
  --gray-color-85: hsl(var(--gray-color-hsl) / calc(85 * 1%));
  --black-color-85: hsl(var(--black-color-hsl) / calc(85 * 1%));
  --success-color-85: hsl(var(--success-color-hsl) / calc(85 * 1%));
  --warning-color-85: hsl(var(--warning-color-hsl) / calc(85 * 1%));
  --error-color-85: hsl(var(--error-color-hsl) / calc(85 * 1%));
  --blue-color-85: hsl(var(--blue-color-hsl) / calc(85 * 1%));
  --primary-color-90: hsl(var(--primary-color-hsl) / calc(90 * 1%));
  --secondary-color-90: hsl(var(--secondary-color-hsl) / calc(90 * 1%));
  --theme-bg-90: hsl(var(--theme-bg-hsl) / calc(90 * 1%));
  --theme-color-90: hsl(var(--theme-color-hsl) / calc(90 * 1%));
  --white-color-90: hsl(var(--white-color-hsl) / calc(90 * 1%));
  --gray-color-90: hsl(var(--gray-color-hsl) / calc(90 * 1%));
  --black-color-90: hsl(var(--black-color-hsl) / calc(90 * 1%));
  --success-color-90: hsl(var(--success-color-hsl) / calc(90 * 1%));
  --warning-color-90: hsl(var(--warning-color-hsl) / calc(90 * 1%));
  --error-color-90: hsl(var(--error-color-hsl) / calc(90 * 1%));
  --blue-color-90: hsl(var(--blue-color-hsl) / calc(90 * 1%));
  --primary-color-95: hsl(var(--primary-color-hsl) / calc(95 * 1%));
  --secondary-color-95: hsl(var(--secondary-color-hsl) / calc(95 * 1%));
  --theme-bg-95: hsl(var(--theme-bg-hsl) / calc(95 * 1%));
  --theme-color-95: hsl(var(--theme-color-hsl) / calc(95 * 1%));
  --white-color-95: hsl(var(--white-color-hsl) / calc(95 * 1%));
  --gray-color-95: hsl(var(--gray-color-hsl) / calc(95 * 1%));
  --black-color-95: hsl(var(--black-color-hsl) / calc(95 * 1%));
  --success-color-95: hsl(var(--success-color-hsl) / calc(95 * 1%));
  --warning-color-95: hsl(var(--warning-color-hsl) / calc(95 * 1%));
  --error-color-95: hsl(var(--error-color-hsl) / calc(95 * 1%));
  --blue-color-95: hsl(var(--blue-color-hsl) / calc(95 * 1%));
  --primary-color-darker-5: hsl(var(--primary-color-hs) calc(var(--primary-color-l) - (5 * 1%)));
  --secondary-color-darker-5: hsl(var(--secondary-color-hs) calc(var(--secondary-color-l) - (5 * 1%)));
  --primary-color-darker-10: hsl(var(--primary-color-hs) calc(var(--primary-color-l) - (10 * 1%)));
  --secondary-color-darker-10: hsl(var(--secondary-color-hs) calc(var(--secondary-color-l) - (10 * 1%)));
  --primary-color-darker-15: hsl(var(--primary-color-hs) calc(var(--primary-color-l) - (15 * 1%)));
  --secondary-color-darker-15: hsl(var(--secondary-color-hs) calc(var(--secondary-color-l) - (15 * 1%)));
  --primary-color-darker-20: hsl(var(--primary-color-hs) calc(var(--primary-color-l) - (20 * 1%)));
  --secondary-color-darker-20: hsl(var(--secondary-color-hs) calc(var(--secondary-color-l) - (20 * 1%)));
  --primary-color-darker-25: hsl(var(--primary-color-hs) calc(var(--primary-color-l) - (25 * 1%)));
  --secondary-color-darker-25: hsl(var(--secondary-color-hs) calc(var(--secondary-color-l) - (25 * 1%)));
  --primary-color-darker-30: hsl(var(--primary-color-hs) calc(var(--primary-color-l) - (30 * 1%)));
  --secondary-color-darker-30: hsl(var(--secondary-color-hs) calc(var(--secondary-color-l) - (30 * 1%)));
  --primary-color-lighter-5: hsl(var(--primary-color-hs) calc(var(--primary-color-l) + (5 * 1%)));
  --secondary-color-lighter-5: hsl(var(--secondary-color-hs) calc(var(--secondary-color-l) + (5 * 1%)));
  --primary-color-lighter-10: hsl(var(--primary-color-hs) calc(var(--primary-color-l) + (10 * 1%)));
  --secondary-color-lighter-10: hsl(var(--secondary-color-hs) calc(var(--secondary-color-l) + (10 * 1%)));
  --primary-color-lighter-15: hsl(var(--primary-color-hs) calc(var(--primary-color-l) + (15 * 1%)));
  --secondary-color-lighter-15: hsl(var(--secondary-color-hs) calc(var(--secondary-color-l) + (15 * 1%)));
  --primary-color-lighter-20: hsl(var(--primary-color-hs) calc(var(--primary-color-l) + (20 * 1%)));
  --secondary-color-lighter-20: hsl(var(--secondary-color-hs) calc(var(--secondary-color-l) + (20 * 1%)));
  --primary-color-lighter-25: hsl(var(--primary-color-hs) calc(var(--primary-color-l) + (25 * 1%)));
  --secondary-color-lighter-25: hsl(var(--secondary-color-hs) calc(var(--secondary-color-l) + (25 * 1%)));
  --primary-color-lighter-30: hsl(var(--primary-color-hs) calc(var(--primary-color-l) + (30 * 1%)));
  --secondary-color-lighter-30: hsl(var(--secondary-color-hs) calc(var(--secondary-color-l) + (30 * 1%)));
  --base-font: var(--body-font), Arial, Helvetica, sans-serif;
  --h-font: var(--headline-font), Arial, Helvetica, sans-serif;
  --b-font: var(--button-font), Arial, Helvetica, sans-serif;
  --m-font: var(--menu-font), Arial, Helvetica, sans-serif;
  --m2-font: var(--menu-2nd-font), Arial, Helvetica, sans-serif;
  --b-radius-xs: 2px;
  --b-radius-sm: 4px;
  --b-radius: 6px;
  --b-radius-md: 8px;
  --b-radius-lg: 12px;
  --b-radius-xl: 16px;
  --i-size-xs: 12px;
  --i-size-sm: .875rem;
  --i-size: 1rem;
  --i-size-md: 1.125rem;
  --i-size-lg: 1.125rem;
  --i-size-xl: 1.5rem;
  --i-size-hg: 1.75rem;
  --i-size-xh: 2.25rem;
  --desktop-x-padding: 1.5em;
  --b-shad-xs: 0 3px 5px;
  --b-shad-sm: 0 3px 15px;
  --b-shad: 0 5px 25px;
  --b-shad-md: 0 8px 35px;
  --b-shad-xl: 0 12px 45px;
}

/* Reset all styles
---------------------------------------------------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font-family: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

div {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

/* HTML
---------------------------------------------------------------- */
html {
  scroll-behavior: smooth;
  background: var(--theme-bg, var(--white-color));
  color: var(--theme-color, var(--gray-color));
  height: 100dvh;
}

/* Body
---------------------------------------------------------------- */
body {
  font-family: var(--base-font);
  line-height: 1.5;
  overflow: hidden;
}

@-webkit-keyframes preloader-spin {
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@keyframes preloader-spin {
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
/* Paragraphs and font sizes
---------------------------------------------------------------- */
.t-size-xs {
  font-size: 0.75rem;
}

.t-size-sm {
  font-size: 0.875rem;
}

.t-size-md {
  font-size: 1.125rem;
}

.t-size-lg {
  font-size: 1.25rem;
}

.t-size-xl {
  font-size: 1.5rem;
}

.t-size-hg {
  font-size: 1.75rem;
}

.app-header {
  grid-area: app-header;
  gap: var(--header-gap);
  -ms-grid-rows: var(--header-grid-rows);
  grid-template-rows: var(--header-grid-rows);
  -ms-grid-columns: var(--header-grid-columns);
  grid-template-columns: var(--header-grid-columns);
      grid-template-areas: var(--header-grid-areas);
  display: -ms-grid;
  display: grid;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding-bottom: 1em;
  border-bottom: 2px solid var(--theme-color-10);
}
.app-header .app-header-top-left {
  grid-area: head-top-left;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: 1em;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
.app-header .app-header-top-right {
  grid-area: head-top-right;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 1em;
  -ms-grid-column-align: end;
      justify-self: end;
}
.app-header .app-header-bottom-left {
  grid-area: head-bottom-left;
}
.app-header .app-header-bottom-right {
  grid-area: head-bottom-right;
}
.app-header .app-options {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1em;
  padding: 0 0 0 1em;
  border-left: 1px solid var(--theme-color-10);
}

.app-client-id {
  font-size: 0.875em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  line-height: 1.2;
  border-left: var(--client-logo-border);
  padding-left: 1em;
}

.app-user-store {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5em;
  margin: 0;
  border-right: 1px solid var(--theme-color-10);
  -ms-flex-item-align: stretch;
      -ms-grid-row-align: stretch;
      align-self: stretch;
  padding-right: 1em;
}

.app-clock {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 1.25em;
  gap: 0.125em;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  line-height: 1.2;
}
.app-clock .app-clock-hours,
.app-clock .app-clock-mins,
.app-clock .app-clock-secs {
  font-weight: bold;
}
.app-clock:before {
  font-family: remixicon;
  content: "\ea1b";
  line-height: 1;
  margin-right: 0.25em;
  color: var(--primary-color);
}

.app-logo {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-box-pack: stretch;
      -ms-flex-pack: stretch;
          justify-content: stretch;
}
.app-logo .app-logo-link {
  text-decoration: none;
  text-transform: uppercase;
  font-weight: 300;
  font-size: 1.25em;
}

.client-logo {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0.75em;
}
.client-logo .client-logo-image {
  display: var(--client-logo-display);
  width: var(--client-logo-width);
  aspect-ratio: var(--client-logo-ratio);
  background: var(--client-logo-image);
  background-size: contain;
}
.client-logo .client-name {
  display: var(--client-name-display);
  font-size: var(--client-name-size);
  font-weight: var(--client-name-weight);
  letter-spacing: -0.03em;
  color: inherit;
  line-height: 1;
  white-space: nowrap;
}

@media (max-width: 767px) {
  .client-logo:has(.client-logo-image) .client-name {
    font-size: calc(var(--client-name-size) * 0.75);
  }
}
.app-footer {
  grid-area: app-footer;
  gap: var(--footer-gap);
  -ms-grid-rows: var(--footer-grid-rows);
  grid-template-rows: var(--footer-grid-rows);
  -ms-grid-columns: var(--footer-grid-columns);
  grid-template-columns: var(--footer-grid-columns);
      grid-template-areas: var(--footer-grid-areas);
  display: -ms-grid;
  display: grid;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.app-footer .app-footer-left {
  grid-area: foot-left;
}
.app-footer .app-footer-right {
  grid-area: foot-right;
  justify-self: flex-end;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.app-footer .app-footer-right .app-logo {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 0.5em;
}
.app-footer .app-footer-right .app-logo .app-logo-link {
  width: calc(var(--app-logo-width) / 1.5);
}
.app-footer .app-footer-right .app-logo .app-version {
  font-size: 0.75em;
  color: var(--theme-color-50);
}

.app-copyright {
  font-size: 0.75em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25em;
}
.app-copyright .app-myoffice-logo {
  font-weight: bold;
  color: transparent !important;
  background: var(--app-myoffice-logo-image);
  background-size: contain;
  display: inline-block;
  text-decoration: none;
  width: 9em;
  text-align: center;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  white-space: nowrap;
  aspect-ratio: 424/108;
  margin: 0;
}

.app-layout.layout-login {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: auto 0 35em;
  grid-template-columns: auto 35em;
  -ms-grid-rows: 1fr 0 clamp(10em, 62dvh, 30em) 0 1fr;
  grid-template-rows: 1fr clamp(10em, 62dvh, 30em) 1fr;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
  background: var(--app-login-bg);
  background-position: center;
  background-size: cover, auto;
  background-repeat: no-repeat, repeat;
  background-blend-mode: soft-light;
  gap: 0;
  padding: 1em 4em;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.app-layout.layout-login > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}

.app-layout.layout-login > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}

.app-layout.layout-login > *:nth-child(3) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}

.app-layout.layout-login > *:nth-child(4) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
}

.app-layout.layout-login > *:nth-child(5) {
  -ms-grid-row: 5;
  -ms-grid-column: 1;
}

.app-layout.layout-login > *:nth-child(6) {
  -ms-grid-row: 5;
  -ms-grid-column: 3;
}
.app-layout.layout-login .app-header {
  width: 100%;
  background: var(--app-login-head-bg);
  border-radius: var(--app-login-head-radius);
  color: var(--app-login-head-color);
  padding: 1.5em 2em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-shadow: 0 0.3125em 1.5em -0.625em var(--gray-color-20);
          box-shadow: 0 0.3125em 1.5em -0.625em var(--gray-color-20);
  z-index: 2;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-item-align: end;
      -ms-grid-row-align: end;
      align-self: end;
}
.app-layout.layout-login .app-header .app-header-top-left {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.app-layout.layout-login .app-header .app-header-bottom-left,
.app-layout.layout-login .app-header .app-header-bottom-right {
  display: none;
}
.app-layout.layout-login .app-header .app-logo .app-logo-link {
  background: var(--app-login-logo-image);
  background-size: contain;
}
.app-layout.layout-login .app-header .client-logo {
  border-color: var(--white-color-20);
}
.app-layout.layout-login .app-header .client-logo .client-logo-image {
  background: var(--client-login-logo-image);
  background-size: contain;
  width: calc(var(--client-logo-width) * 1.4);
}
.app-layout.layout-login .app-main {
  width: 100%;
  background: var(--app-login-main-bg);
  padding: 1em 3em;
  z-index: 1;
  font-size: 1.125em;
  -ms-flex-item-align: stretch;
      -ms-grid-row-align: stretch;
      align-self: stretch;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.app-layout.layout-login .app-footer {
  width: 100%;
  background: var(--app-login-foot-bg);
  border-radius: var(--app-login-foot-radius);
  padding: 1.5em 2em;
  z-index: 2;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  justify-items: center;
  -ms-grid-row-align: start;
      align-self: start;
}
.app-layout.layout-login .app-footer .app-copyright {
  color: var(--white-color);
}
.app-layout.layout-login .app-footer .app-copyright .app-myoffice-logo {
  --app-myoffice-logo-image: url(../img/myoffice-logo-light.webp) no-repeat;
}
.app-layout.layout-login .layout-login-side {
  width: 100%;
  max-width: 40em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-shadow: 0 1em 2em var(--theme-color-20);
          box-shadow: 0 1em 2em var(--theme-color-20);
  overflow: hidden;
  border-radius: var(--b-radius);
}

@media (max-width: 680px) {
  .app-layout.layout-login {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: 1em;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .app-layout.layout-login .app-main {
    padding: 2em;
  }
}
.app-layout {
  padding: var(--app-layout-padding);
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: var(--app-layout-grid-rows);
  grid-template-rows: var(--app-layout-grid-rows);
  -ms-grid-columns: var(--app-layout-grid-columns);
  grid-template-columns: var(--app-layout-grid-columns);
      grid-template-areas: var(--app-layout-grid-areas);
  container: app-layout-container/inline-size;
  gap: var(--app-layout-gap);
  height: 100dvh;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-box-pack: stretch;
      -ms-flex-pack: stretch;
          justify-content: stretch;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

a {
  color: var(--primary-color);
}
a:hover {
  color: var(--primary-color-lighter-10);
}

.app-main {
  grid-area: app-main;
  overflow-y: auto;
  padding-right: 0.25em;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.app-main::-webkit-scrollbar {
  width: var(--scrollbar-thick);
  background: var(--scrollbar-bg);
  border-radius: var(--scrollbar-thick);
}
.app-main::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb-bg);
  border-radius: var(--scrollbar-thick);
  -webkit-transition: 200ms ease background-color;
  transition: 200ms ease background-color;
}
.app-main::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover-bg);
}
.app-main p:not(:last-child) {
  margin-bottom: 1em;
}

@media (max-width: 1024px) {
  .app-layout:not(.layout-login):after {
    content: "Poštovani, aplikacija radi samo na širini ekrana većoj od 1024px. \aMolimo Vas, povećajte prozor aplikacije da biste mogli da radite sa svim podacima.";
    white-space: pre-wrap;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    text-align: center;
    font-size: 1.25em;
    width: 100%;
    height: 100%;
    color: var(--primary-color);
    position: fixed;
    inset: 0;
    padding: 0 4em;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  .app-layout:not(.layout-login) .app-main {
    display: none;
  }
}
@media (max-width: 767px) {
  .app-layout:not(.layout-login) .app-header {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .app-layout:not(.layout-login) .app-header .app-header-top-right {
    display: none;
  }
}
@media (max-width: 575px) {
  .app-layout:not(.layout-login) .app-header {
    display: none;
  }
}
.nav-sidebar {
  grid-area: nav-sidebar;
  width: var(--nav-sidebar-width);
  position: var(--nav-sidebar-position);
  inset: var(--nav-sidebar-inset);
  background: var(--nav-sidebar-bg);
  color: var(--nav-sidebar-color);
  padding: var(--nav-sidebar-padding);
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
  z-index: 10;
}

.app-sidebar {
  position: fixed;
  inset: 0 0 0 auto;
  width: 60%;
  max-width: 1000px;
  grid-area: app-sidebar;
  background: var(--app-sidebar-bg);
  color: var(--app-sidebar-color);
  border-radius: var(--app-sidebar-radius);
  padding: var(--app-sidebar-padding);
  -webkit-box-shadow: none;
          box-shadow: none;
  z-index: 3;
  -webkit-transform: translateX(100%);
          transform: translateX(100%);
  -webkit-transition: 500ms ease all;
  transition: 500ms ease all;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.app-sidebar.sidebar-show {
  -webkit-box-shadow: var(--app-sidebar-shadow);
          box-shadow: var(--app-sidebar-shadow);
  -webkit-transform: translateX(0);
          transform: translateX(0);
}
.app-sidebar .sidebar-content {
  overflow-y: auto;
  width: 100%;
  padding-right: 0.25em;
}
.app-sidebar .sidebar-content::-webkit-scrollbar {
  width: var(--scrollbar-thick);
  background: var(--scrollbar-bg);
  border-radius: var(--scrollbar-thick);
}
.app-sidebar .sidebar-content::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb-bg);
  border-radius: var(--scrollbar-thick);
  -webkit-transition: 200ms ease background-color;
  transition: 200ms ease background-color;
}
.app-sidebar .sidebar-content::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover-bg);
}
.app-sidebar .sidebar-title {
  position: absolute;
  inset: 0.75rem 3.5rem auto 1.5rem;
  font-weight: bold;
  font-size: 1.25em;
  color: var(--theme-color-70);
  border-bottom: 2px solid var(--theme-color-20);
  font-weight: normal;
}
.app-sidebar .sidebar-title strong {
  color: var(--theme-color);
}
.app-sidebar .sidebar-close {
  position: absolute;
  inset: 0.5em 0.5em auto auto;
  cursor: pointer;
  line-height: 1;
  font-size: 1.5em;
}
.app-sidebar .sidebar-close:before {
  content: "\eb99";
  font-family: remixicon;
  background: var(--primary-color);
  color: var(--white-color);
  border-radius: var(--b-radius-sm);
  line-height: inherit;
  font-size: 1em;
  padding: 0.125em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-transition: 300ms ease all;
  transition: 300ms ease all;
}
.app-sidebar .sidebar-close:hover:before {
  background: var(--primary-color-20);
  color: var(--primary-color);
}
.app-sidebar .sidebar-close span {
  display: none;
}

.app-overlay {
  background: var(--black-color-70);
  position: fixed;
  inset: 0;
  z-index: 1;
  opacity: 0;
  pointer-events: none;
  -webkit-transition: 500ms ease all;
  transition: 500ms ease all;
}
.app-overlay.overlay-show {
  opacity: 1;
  pointer-events: initial;
}

@media (max-width: 1024px) {
  .app-sidebar,
  .app-overlay {
    display: none;
  }
}
.app-main-tabs {
  grid-area: app-main-tabs;
  overflow: hidden;
}

.app-tab-container {
  display: none;
  height: -webkit-fill-available;
}
.app-tab-container.app-container-active {
  display: block;
  position: relative;
}

@media (max-width: 575px) {
  * {
    --app-layout-grid-rows: auto 1fr;
    --app-layout-grid-areas: "app-header" "app-main";
  }
  .app-layout:not(.layout-login) .app-footer {
    display: none !important;
  }
}
.app-headline-container {
  container: headline-container/inline-size;
}

.app-headline {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 0.625em;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  font-size: var(--headline-size);
}
.app-headline .headline-icon {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
  background: var(--headline-icon-bg);
  color: var(--headline-icon-color);
  border-radius: var(--headline-icon-radius);
  width: var(--headline-icon-width);
  aspect-ratio: var(--headline-icon-aspect-ratio);
  margin: var(--headline-icon-margin);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-size: var(--headline-icon-size);
  grid-area: headline-icon;
}
.app-headline .headline-icon i {
  line-height: 1;
}
.app-headline .headline-icon i:before {
  line-height: inherit;
}
.app-headline .headline-title {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
  font-family: var(--headline-title-font);
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  font-size: var(--headline-size);
  grid-area: headline-title;
  line-height: var(--headline-title-line-height);
}
.app-headline .headline-buttons {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
  -ms-grid-column-span: 3;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  font-size: 1rem;
  grid-area: headline-buttons;
  margin-left: 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25em;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.app-headline .headline-buttons .btn:has(i:only-child) {
  width: var(--button-headline-width-ico-only);
}
.app-headline.headline-xs {
  font-size: calc(var(--headline-size) * 0.75);
}
.app-headline.headline-sm {
  font-size: calc(var(--headline-size) * 0.875);
}
.app-headline.headline-md {
  font-size: calc(var(--headline-size) * 1.125);
}
.app-headline.headline-lg {
  font-size: calc(var(--headline-size) * 1.25);
}
.app-headline.headline-xl {
  font-size: calc(var(--headline-size) * 1.375);
}

@container headline-container (max-width: 40em) {
  .app-headline {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: auto 0 1fr;
    grid-template-columns: auto 1fr;
    gap: 0.5em 0;
    -ms-grid-rows: auto 0.5em auto;
        grid-template-areas: "headline-icon headline-title" "headline-buttons headline-buttons";
  }
  .app-headline .headline-buttons {
    margin-left: 0;
    margin-right: 1rem;
  }
}
.app-main-menu .app-main-menu-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1em;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 100%;
  z-index: 10;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-transition: 200ms ease opacity;
  transition: 200ms ease opacity;
}
.app-main-menu ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: var(--main-menu-gap);
}
.app-main-menu ul > li:last-child .app-submenu {
  inset: var(--main-menu-l2-inset-reverse);
}
.app-main-menu ul li {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.app-main-menu ul li .menu-l1 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: var(--main-menu-l1-gap);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--main-menu-l1-size);
  padding: var(--main-menu-l1-padding);
  border: var(--main-menu-l1-border);
  border-radius: var(--main-menu-l1-radius);
  background: var(--main-menu-l1-bg);
  color: var(--main-menu-l1-color);
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  text-decoration: none;
  cursor: pointer;
}
.app-main-menu ul li .menu-l1 i {
  -webkit-transform: var(--main-menu-l1-icon-transform);
          transform: var(--main-menu-l1-icon-transform);
  -webkit-transition: 200ms ease transform;
  transition: 200ms ease transform;
}
.app-main-menu ul li .app-submenu {
  pointer-events: none;
  opacity: 0;
  position: absolute;
  inset: var(--main-menu-l2-inset);
  background: var(--main-menu-l2-bg);
  color: var(--main-menu-l2-color);
  border-radius: var(--main-menu-l2-radius);
  -webkit-box-shadow: var(--main-menu-l2-shadow);
          box-shadow: var(--main-menu-l2-shadow);
  font-size: var(--main-menu-l2-size);
  padding: var(--main-menu-l2-padding);
  z-index: 2;
  -webkit-transition: 150ms ease all;
  transition: 150ms ease all;
  width: 20em;
  border-top: 2px solid var(--main-menu-l2-bg);
}
.app-main-menu ul li .app-submenu ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: var(--main-menu-l2-gap);
}
.app-main-menu ul li .app-submenu ul li {
  width: 100%;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.app-main-menu ul li .app-submenu ul li[data-state=disabled] {
  pointer-events: none;
  opacity: 0.3;
}
.app-main-menu ul li .app-submenu ul li a {
  display: block;
  padding: 0.25em 0.5em;
  color: currentColor;
  border-radius: var(--main-menu-l2-link-radius);
  text-decoration: none;
  -webkit-transition: 150ms ease all;
  transition: 150ms ease all;
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.app-main-menu ul li .app-submenu ul li a:hover, .app-main-menu ul li .app-submenu ul li a:focus-within {
  background: var(--main-menu-l2-hover-bg);
  color: var(--main-menu-l2-hover-color);
}
.app-main-menu ul li .app-submenu ul li.menu-form .form-container {
  padding: 0.25em 0.5em;
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.app-main-menu .app-menu {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 100%;
  height: 100%;
}
.app-main-menu .app-menu::-webkit-scrollbar {
  width: var(--scrollbar-thick);
  background: var(--scrollbar-bg);
  border-radius: var(--scrollbar-thick);
}
.app-main-menu .app-menu::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb-bg);
  border-radius: var(--scrollbar-thick);
  -webkit-transition: 200ms ease background-color;
  transition: 200ms ease background-color;
}
.app-main-menu .app-menu::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover-bg);
}
.app-main-menu .app-menu > li {
  width: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.app-main-menu .app-menu > li .menu-l1 {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: relative;
}
.app-main-menu .app-menu > li .menu-l1 i {
  line-height: 1;
}
.app-main-menu .app-menu > li .menu-l1 span {
  position: absolute;
  inset: 0 auto 0 calc(100% + 0.25em);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 1em 1.5em 1em 1em;
  background: var(--main-menu-l1-tip-bg);
  color: var(--main-menu-l1-tip-color);
  font-size: var(--main-menu-l1-tip-size);
  white-space: nowrap;
  border-radius: var(--main-menu-l1-tip-radius);
  opacity: 0;
  pointer-events: none;
  -webkit-transform: translate(2em, 50%);
          transform: translate(2em, 50%);
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
  -webkit-box-shadow: var(--main-menu-l1-tip-shadow);
          box-shadow: var(--main-menu-l1-tip-shadow);
}
.app-main-menu .app-menu > li.menu-on .menu-l1 {
  background: var(--main-menu-l1-active-bg);
  color: var(--main-menu-l1-active-color);
  border: var(--main-menu-l1-active-border);
}
.app-main-menu .app-menu > li.menu-on .app-submenu {
  display: block;
}
.app-main-menu .app-menu > li:hover .menu-l1, .app-main-menu .app-menu > li:focus-within .menu-l1 {
  background: var(--main-menu-l1-hover-bg);
  color: var(--main-menu-l1-hover-color);
  border: var(--main-menu-l1-hover-border);
}
.app-main-menu .app-menu > li:hover .menu-l1 i, .app-main-menu .app-menu > li:focus-within .menu-l1 i {
  -webkit-transform: var(--main-menu-l1-icon-hover-transform);
          transform: var(--main-menu-l1-icon-hover-transform);
}
.app-main-menu .app-menu > li:hover .menu-l1 span, .app-main-menu .app-menu > li:focus-within .menu-l1 span {
  opacity: 1;
  pointer-events: initial;
  -webkit-transform: translate(0, 50%);
          transform: translate(0, 50%);
}
.app-main-menu .app-menu > li:hover .app-submenu, .app-main-menu .app-menu > li:focus-within .app-submenu {
  opacity: 1;
  pointer-events: initial;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
.app-main-menu .app-menu li .app-submenu {
  position: relative;
  width: 100%;
  inset: unset;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: none;
  opacity: 1;
  pointer-events: initial;
  -webkit-box-shadow: var(--app-menu-resp-l2-shadow);
          box-shadow: var(--app-menu-resp-l2-shadow);
}
.app-main-menu .app-menu li .app-submenu ul {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-orient: vertical !important;
  -webkit-box-direction: normal !important;
      -ms-flex-direction: column !important;
          flex-direction: column !important;
  width: 100% !important;
}
.app-main-menu .app-menu li .app-submenu ul li {
  width: auto !important;
  max-height: unset;
}
.app-main-menu .app-menu li .app-submenu ul li ul {
  max-height: unset;
}

@media (min-width: 1040px) and (max-width: 1309px) {
  * {
    --main-menu-l1-padding: .5em 1em;
  }
}
input.form-control,
textarea.form-control,
select.form-control,
.form-label {
  font-family: var(--field-font);
  font-size: var(--field-font-size);
  background-color: var(--field-bg);
  border: var(--field-border) solid var(--field-border-color);
  color: var(--field-color);
  line-height: 1.5;
  padding: var(--field-padding);
  border-radius: var(--field-border-radius);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transition: 300ms ease all;
  transition: 300ms ease all;
  outline: 0;
}
input.form-control.form-xs,
textarea.form-control.form-xs,
select.form-control.form-xs,
.form-label.form-xs {
  font-size: calc(var(--field-font-size) * 0.75);
}
input.form-control.form-sm,
textarea.form-control.form-sm,
select.form-control.form-sm,
.form-label.form-sm {
  font-size: calc(var(--field-font-size) * 0.875);
}
input.form-control.form-md,
textarea.form-control.form-md,
select.form-control.form-md,
.form-label.form-md {
  font-size: calc(var(--field-font-size) * 1.125);
}
input.form-control.form-lg,
textarea.form-control.form-lg,
select.form-control.form-lg,
.form-label.form-lg {
  font-size: calc(var(--field-font-size) * 1.25);
}
input.form-control.form-xl,
textarea.form-control.form-xl,
select.form-control.form-xl,
.form-label.form-xl {
  font-size: calc(var(--field-font-size) * 1.375);
}
input.form-control.form-hg,
textarea.form-control.form-hg,
select.form-control.form-hg,
.form-label.form-hg {
  font-size: calc(var(--field-font-size) * 1.5);
}
input.form-control::-webkit-input-placeholder, textarea.form-control::-webkit-input-placeholder, select.form-control::-webkit-input-placeholder, .form-label::-webkit-input-placeholder {
  color: var(--field-placeholder-color);
}
input.form-control::-moz-placeholder, textarea.form-control::-moz-placeholder, select.form-control::-moz-placeholder, .form-label::-moz-placeholder {
  color: var(--field-placeholder-color);
}
input.form-control:-ms-input-placeholder, textarea.form-control:-ms-input-placeholder, select.form-control:-ms-input-placeholder, .form-label:-ms-input-placeholder {
  color: var(--field-placeholder-color);
}
input.form-control::-ms-input-placeholder, textarea.form-control::-ms-input-placeholder, select.form-control::-ms-input-placeholder, .form-label::-ms-input-placeholder {
  color: var(--field-placeholder-color);
}
input.form-control::placeholder,
textarea.form-control::placeholder,
select.form-control::placeholder,
.form-label::placeholder {
  color: var(--field-placeholder-color);
}
input.form-control:hover,
textarea.form-control:hover,
select.form-control:hover,
.form-label:hover {
  border-color: var(--field-hover-border);
}
input.form-control:focus, input.form-control:active,
textarea.form-control:focus,
textarea.form-control:active,
select.form-control:focus,
select.form-control:active,
.form-label:focus,
.form-label:active {
  border-color: var(--field-hover-active-border);
  -webkit-box-shadow: 0 0.25em 0.75em var(--field-active-shadow);
          box-shadow: 0 0.25em 0.75em var(--field-active-shadow);
}
input.form-control.disabled, input.form-controldisabled,
textarea.form-control.disabled,
textarea.form-controldisabled,
select.form-control.disabled,
select.form-controldisabled,
.form-label.disabled,
.form-labeldisabled {
  pointer-events: none;
  opacity: var(--field-disabled-opacity);
}
input.form-control.disabled.disabled-but-full-opacity, input.form-controldisabled.disabled-but-full-opacity,
textarea.form-control.disabled.disabled-but-full-opacity,
textarea.form-controldisabled.disabled-but-full-opacity,
select.form-control.disabled.disabled-but-full-opacity,
select.form-controldisabled.disabled-but-full-opacity,
.form-label.disabled.disabled-but-full-opacity,
.form-labeldisabled.disabled-but-full-opacity {
  opacity: 1;
}

input.form-outline,
textarea.form-outline,
select.form-outline {
  background: var(--theme-bg);
  border-color: var(--field-outline-color);
}

select.form-control:not(.select2-hidden-accessible) {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-image: var(--field-select-arrow);
  background-repeat: no-repeat;
  background-position: 100% center;
  background-size: 1.875em 1.5em;
  padding: var(--field-padding-select) !important;
}

.form-label {
  background: transparent;
  border-color: transparent;
  border-bottom-color: var(--field-label-color);
  padding-left: 0;
  padding-right: 0;
  border-radius: 0;
  display: block;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.form-label:hover, .form-label:active, .form-label:focus {
  border-left-color: transparent;
  border-top-color: transparent;
  border-right-color: transparent;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.form-label.label-no-border {
  border-bottom-color: transparent;
}
.form-label.label-bold {
  font-weight: bold;
}

input[type=date].form-control,
input[type=month].form-control,
input[type=year].form-control {
  padding: var(--field-padding-date);
}
input[type=date].form-control::-webkit-inner-spin-button, input[type=date].form-control::-webkit-calendar-picker-indicator,
input[type=month].form-control::-webkit-inner-spin-button,
input[type=month].form-control::-webkit-calendar-picker-indicator,
input[type=year].form-control::-webkit-inner-spin-button,
input[type=year].form-control::-webkit-calendar-picker-indicator {
  background-image: var(--field-calendar-icon);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 1.125em;
  cursor: pointer;
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
}
input[type=date].form-control::-webkit-inner-spin-button:hover, input[type=date].form-control::-webkit-calendar-picker-indicator:hover,
input[type=month].form-control::-webkit-inner-spin-button:hover,
input[type=month].form-control::-webkit-calendar-picker-indicator:hover,
input[type=year].form-control::-webkit-inner-spin-button:hover,
input[type=year].form-control::-webkit-calendar-picker-indicator:hover {
  opacity: 0.5;
}

input[type=search].form-control::-webkit-search-cancel-button {
  position: relative;
  -webkit-appearance: none;
  height: 1em;
  width: 1em;
  background-image: var(--field-reset-search-icon);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 1.125em;
  cursor: pointer;
  margin-left: 0.5em;
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
}
input[type=search].form-control::-webkit-search-cancel-button:hover {
  opacity: 0.5;
}

input[type=file].form-control {
  padding: var(--field-padding-file);
}
input[type=file].form-control::-webkit-file-upload-button {
  font-family: var(--button-font);
  font-weight: var(--button-font-weight);
  text-transform: var(--button-text-transform);
  letter-spacing: var(--button-letter-spacing);
  text-decoration: none;
  border-radius: var(--button-radius);
  line-height: 1;
  padding: 0.97em 1em;
  display: -webkit-inline-box;
  display: inline-flex;
  -webkit-box-align: center;
          align-items: center;
  -webkit-box-pack: center;
          justify-content: center;
  -webkit-transition: 700ms ease all;
  transition: 700ms ease all;
  border: 0;
  font-size: calc(var(--button-font-size) * 0.875);
  cursor: pointer;
  background: var(--primary-color);
  color: var(--white-color);
}
input[type=file].form-control::file-selector-button {
  font-family: var(--button-font);
  font-weight: var(--button-font-weight);
  text-transform: var(--button-text-transform);
  letter-spacing: var(--button-letter-spacing);
  text-decoration: none;
  border-radius: var(--button-radius);
  line-height: 1;
  padding: 0.97em 1em;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: 700ms ease all;
  transition: 700ms ease all;
  border: 0;
  font-size: calc(var(--button-font-size) * 0.875);
  cursor: pointer;
  background: var(--primary-color);
  color: var(--white-color);
}
input[type=file].form-control::-webkit-file-upload-button:hover {
  background: var(--primary-color-lighter-10);
}
input[type=file].form-control::file-selector-button:hover {
  background: var(--primary-color-lighter-10);
}

input[type=checkbox],
input[type=radio] {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  border: 0;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  width: 1em;
  height: 1em;
  position: relative;
  margin: 0;
  font-size: 1.5em;
  cursor: pointer;
}
input[type=checkbox]:before, input[type=checkbox]:after,
input[type=radio]:before,
input[type=radio]:after {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  line-height: 1;
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-family: remixicon;
}
input[type=checkbox]:before,
input[type=radio]:before {
  content: "";
  width: 1em;
  height: 1em;
  background: var(--field-bg);
  border-radius: 50%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
input[type=checkbox]:after,
input[type=radio]:after {
  inset: 0;
  opacity: 0;
  position: absolute;
  font-size: 0.8em;
}
input[type=checkbox]:checked:before,
input[type=radio]:checked:before {
  background: var(--primary-color) !important;
}
input[type=checkbox]:checked:after,
input[type=radio]:checked:after {
  color: var(--white-color);
  opacity: 1;
}
input[type=checkbox].form-outline:before,
input[type=radio].form-outline:before {
  outline-color: var(--field-border-color);
  background-color: var(--white-color);
}
input[type=checkbox]:checked:after,
input[type=radio]:checked:after {
  opacity: 1;
}
input[type=checkbox]:hover:not(:checked):before,
input[type=radio]:hover:not(:checked):before {
  outline-color: var(--field-hover-border);
  -webkit-box-shadow: none;
          box-shadow: none;
}
input[type=checkbox]:focus:before,
input[type=radio]:focus:before {
  outline-color: var(--field-hover-active-border);
  -webkit-box-shadow: 0 0 0 0.3em var(--field-active-shadow);
          box-shadow: 0 0 0 0.3em var(--field-active-shadow);
}
input[type=checkbox]:focus:hover:before,
input[type=radio]:focus:hover:before {
  outline-color: var(--field-hover-active-border);
}
input[type=checkbox]:focus:not(:checked):before,
input[type=radio]:focus:not(:checked):before {
  -webkit-box-shadow: none;
          box-shadow: none;
}
input[type=checkbox].error:before,
input[type=radio].error:before {
  outline-color: var(--field-error-border-color);
}
input[type=checkbox].error:hover:before,
input[type=radio].error:hover:before {
  outline-color: var(--field-error-hover-border);
}
input[type=checkbox].form-xs,
input[type=radio].form-xs {
  font-size: 1em;
}
input[type=checkbox].form-sm,
input[type=radio].form-sm {
  font-size: 1.25em;
}
input[type=checkbox].form-md,
input[type=radio].form-md {
  font-size: 1.5em;
}
input[type=checkbox].form-lg,
input[type=radio].form-lg {
  font-size: 1.75em;
}
input[type=checkbox].form-xl,
input[type=radio].form-xl {
  font-size: 2em;
}
input[type=checkbox].form-hg,
input[type=radio].form-hg {
  font-size: 2.5em;
}

input[type=checkbox]:after,
input[type=radio].form-as-checkbox:after {
  content: var(--field-check-icon);
  font-family: remixicon;
}

input[type=radio]:after {
  content: var(--field-radio-icon);
  font-family: remixicon;
  font-size: 0.5em;
}
input[type=radio].form-as-checkbox:after {
  font-size: 0.8em;
}

.nav-pills {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.nav-pills ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: var(--nav-pills-bg);
  color: var(--nav-pills-color);
  padding: var(--nav-pills-padding);
  border: var(--nav-pills-border) solid var(--nav-pills-border-color);
  border-radius: var(--nav-pills-radius);
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  line-height: 1.2;
  font-size: var(--nav-pills-font-size);
}
.nav-pills ul li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-top: var(--nav-pills-li-padding);
  padding-bottom: var(--nav-pills-li-padding);
}
.nav-pills ul li:not(:last-child) {
  border-right: var(--nav-pills-li-border);
}
.nav-pills ul li:first-child a {
  border-top-left-radius: var(--nav-pills-radius);
  border-bottom-left-radius: var(--nav-pills-radius);
}
.nav-pills ul li:last-child a {
  border-top-right-radius: var(--nav-pills-radius);
  border-bottom-right-radius: var(--nav-pills-radius);
}
.nav-pills ul li a {
  color: inherit;
  text-decoration: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0.75em;
  padding: var(--nav-pill-padding);
  background: var(--nav-pill-bg);
  color: var(--nav-pill-color);
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
}
.nav-pills ul li a i {
  line-height: 1;
  -webkit-transform: scale(1.5);
          transform: scale(1.5);
  -webkit-transition: 300ms ease transform;
  transition: 300ms ease transform;
}
.nav-pills ul li a i:before {
  line-height: inherit;
}
.nav-pills ul li a:has(i:only-child) {
  width: var(--nav-pill-ico-only-width);
  padding: var(--nav-pill-ico-only-padding);
  aspect-ratio: 1/1;
}
.nav-pills ul li a:hover {
  background: var(--nav-pill-hover-bg);
  color: var(--nav-pill-hover-color);
}
.nav-pills.form-xs ul {
  font-size: calc(var(--field-font-size) * 0.75);
}
.nav-pills.form-sm ul {
  font-size: calc(var(--field-font-size) * 0.875);
}
.nav-pills.form-md ul {
  font-size: calc(var(--field-font-size) * 1.125);
}
.nav-pills.form-lg ul {
  font-size: calc(var(--field-font-size) * 1.25);
}
.nav-pills.form-xl ul {
  font-size: calc(var(--field-font-size) * 1.375);
}
.nav-pills.form-hg ul {
  font-size: calc(var(--field-font-size) * 1.5);
}
.nav-pills.form-outline ul {
  background: var(--nav-pills-outline-bg);
  border-color: var(--nav-pills-outline-color);
}
.nav-pills.form-outline ul li:not(:last-child) {
  border-right: var(--nav-pills-li-outline-border);
}

.form-container {
  container: form-container/inline-size;
}

.form-wrapper {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  gap: var(--form-grid-gap);
}
.form-wrapper[data-cols="2"] {
  -ms-grid-columns: 1fr 1fr;
  grid-template-columns: 1fr 1fr;
}
.form-wrapper[data-cols="3"] {
  -ms-grid-columns: 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr;
}
.form-wrapper[data-cols="4"] {
  -ms-grid-columns: 1fr 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr 1fr;
}
.form-wrapper[data-cols="5"] {
  -ms-grid-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
.form-wrapper[data-cols="6"] {
  -ms-grid-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}
.form-wrapper.inline-rows {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.form-wrapper.inline-rows .form-row {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  max-width: var(--form-inline-rows-max-width);
}
.form-wrapper .form-row {
  -ms-flex-item-align: end;
      -ms-grid-row-align: end;
      align-self: end;
  container: form-row/inline-size;
}
.form-wrapper .form-row.form-align-start {
  -ms-flex-item-align: start;
      -ms-grid-row-align: start;
      align-self: start;
}
.form-wrapper .form-row.form-align-stretch {
  -ms-flex-item-align: stretch;
      -ms-grid-row-align: stretch;
      align-self: stretch;
}
.form-wrapper .form-row[data-colspan="2"] {
  -ms-grid-column-span: 2;
  grid-column: span 2;
}
.form-wrapper .form-row[data-colspan="3"] {
  -ms-grid-column-span: 3;
  grid-column: span 3;
}
.form-wrapper .form-row[data-colspan="4"] {
  -ms-grid-column-span: 4;
  grid-column: span 4;
}
.form-wrapper .form-row[data-colspan="5"] {
  -ms-grid-column-span: 5;
  grid-column: span 5;
}
.form-wrapper .form-row[data-colspan="6"] {
  -ms-grid-column-span: 6;
  grid-column: span 6;
}
.form-wrapper .form-row .single-control {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.25em;
}
.form-wrapper .form-row .single-control label {
  font-size: var(--field-label-font-size);
}
.form-wrapper .form-row .single-control.control-full-height {
  height: 100%;
}
.form-wrapper .form-row .single-control.control-inline {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.form-wrapper .form-row .single-control.control-inline label {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 var(--field-inline-label-width);
          flex: 0 0 var(--field-inline-label-width);
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
}
.form-wrapper .form-row .single-control.control-inline label.form-crb {
  -webkit-box-flex: unset;
      -ms-flex: unset;
          flex: unset;
}
.form-wrapper .form-row .single-control.control-inline label.form-crb:not(:last-child) {
  margin-right: 1em;
}
.form-wrapper .form-row .single-control.control-inline.control-crbs, .form-wrapper .form-row .single-control.control-inline.control-buttons {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.form-wrapper .form-row .single-control.control-buttons.buttons-align-left {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.form-wrapper .form-row .single-control.control-buttons.buttons-align-right {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.form-wrapper .form-row .single-control.control-buttons.buttons-align-center {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.form-wrapper .form-row .single-control.control-inline.control-buttons.buttons-align-left {
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}
.form-wrapper .form-row .single-control.control-inline.control-buttons.buttons-align-right {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.form-wrapper .form-row .single-control.control-inline.control-buttons.buttons-align-center {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.form-wrapper .form-row .single-control + .single-control {
  margin-top: var(--form-control-margin);
}
.form-wrapper .form-row .single-control-holder {
  width: 100%;
}
.form-wrapper .form-row .single-control-holder > .form-control {
  width: 100%;
}
.form-wrapper .form-row .single-control-holder.control-with-buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.form-wrapper .form-row .single-control-holder.control-with-buttons .form-control {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  width: unset;
}
.form-wrapper .form-row .single-control-holder.control-with-buttons .btn {
  margin-left: 0.5rem;
}
.form-wrapper .form-row .single-control-holder.control-password {
  position: relative;
  isolation: isolate;
}
.form-wrapper .form-row .single-control-holder.control-password .form-control {
  padding: var(--field-padding-password);
}
.form-wrapper .form-row .single-control-holder.control-password .password-show {
  position: absolute;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  inset: 0 0 0 auto;
  padding: 0 0.5em;
  cursor: pointer;
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
}
.form-wrapper .form-row .single-control-holder.control-password .password-show:before {
  font-family: var(--field-password-icon-family);
  content: var(--field-password-icon-show);
  line-height: 1;
  font-size: 1.125em;
}
.form-wrapper .form-row .single-control-holder.control-password .password-show.shown:before {
  content: var(--field-password-icon-hide);
}
.form-wrapper .form-row .single-control-holder.control-password .password-show:hover {
  opacity: 0.5;
}
.form-wrapper .form-row .form-prefix,
.form-wrapper .form-row .form-suffix {
  font-family: var(--field-font);
  font-size: var(--field-font-size);
  background-color: var(--field-prefix-suffix-bg);
  border: var(--field-border) solid var(--field-border-color);
  color: var(--field-color);
  line-height: 1.5;
  padding: var(--field-padding);
  border-radius: var(--field-border-radius);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transition: 300ms ease all;
  transition: 300ms ease all;
  outline: 0;
  pointer-events: none;
}
.form-wrapper .form-row .form-prefix.form-xs,
.form-wrapper .form-row .form-suffix.form-xs {
  font-size: calc(var(--field-font-size) * 0.75);
}
.form-wrapper .form-row .form-prefix.form-sm,
.form-wrapper .form-row .form-suffix.form-sm {
  font-size: calc(var(--field-font-size) * 0.875);
}
.form-wrapper .form-row .form-prefix.form-md,
.form-wrapper .form-row .form-suffix.form-md {
  font-size: calc(var(--field-font-size) * 1.125);
}
.form-wrapper .form-row .form-prefix.form-lg,
.form-wrapper .form-row .form-suffix.form-lg {
  font-size: calc(var(--field-font-size) * 1.25);
}
.form-wrapper .form-row .form-prefix.form-xl,
.form-wrapper .form-row .form-suffix.form-xl {
  font-size: calc(var(--field-font-size) * 1.375);
}
.form-wrapper .form-row .form-prefix.form-hg,
.form-wrapper .form-row .form-suffix.form-hg {
  font-size: calc(var(--field-font-size) * 1.5);
}
.form-wrapper .form-row .form-prefix::-webkit-input-placeholder, .form-wrapper .form-row .form-suffix::-webkit-input-placeholder {
  color: var(--field-placeholder-color);
}
.form-wrapper .form-row .form-prefix::-moz-placeholder, .form-wrapper .form-row .form-suffix::-moz-placeholder {
  color: var(--field-placeholder-color);
}
.form-wrapper .form-row .form-prefix:-ms-input-placeholder, .form-wrapper .form-row .form-suffix:-ms-input-placeholder {
  color: var(--field-placeholder-color);
}
.form-wrapper .form-row .form-prefix::-ms-input-placeholder, .form-wrapper .form-row .form-suffix::-ms-input-placeholder {
  color: var(--field-placeholder-color);
}
.form-wrapper .form-row .form-prefix::placeholder,
.form-wrapper .form-row .form-suffix::placeholder {
  color: var(--field-placeholder-color);
}
.form-wrapper .form-row .form-prefix:hover,
.form-wrapper .form-row .form-suffix:hover {
  border-color: var(--field-hover-border);
}
.form-wrapper .form-row .form-prefix:focus, .form-wrapper .form-row .form-prefix:active,
.form-wrapper .form-row .form-suffix:focus,
.form-wrapper .form-row .form-suffix:active {
  border-color: var(--field-hover-active-border);
  -webkit-box-shadow: 0 0.25em 0.75em var(--field-active-shadow);
          box-shadow: 0 0.25em 0.75em var(--field-active-shadow);
}
.form-wrapper .form-row .form-prefix.form-control,
.form-wrapper .form-row .form-suffix.form-control {
  pointer-events: initial;
}
.form-wrapper .form-row .form-prefix {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.form-wrapper .form-row .form-suffix {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.form-wrapper .form-row .form-suffix.form-outline,
.form-wrapper .form-row .form-prefix.form-outline {
  background-color: var(--theme-bg);
  border-color: var(--field-outline-color);
}
.form-wrapper .form-row .form-suffix.form-outline:hover,
.form-wrapper .form-row .form-prefix.form-outline:hover {
  border-color: var(--field-hover-border);
}
.form-wrapper .form-row .form-suffix.form-outline:focus, .form-wrapper .form-row .form-suffix.form-outline:active,
.form-wrapper .form-row .form-prefix.form-outline:focus,
.form-wrapper .form-row .form-prefix.form-outline:active {
  border-color: var(--field-hover-active-border);
  -webkit-box-shadow: 0 0.25em 0.75em var(--field-active-shadow);
          box-shadow: 0 0.25em 0.75em var(--field-active-shadow);
}
.form-wrapper .form-row .control-prefix,
.form-wrapper .form-row .control-suffix {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
}
.form-wrapper .form-row .control-prefix .form-control,
.form-wrapper .form-row .control-suffix .form-control {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 100%;
          flex: 1 1 100%;
}
.form-wrapper .form-row .control-prefix .form-prefix {
  -webkit-box-ordinal-group: 0;
      -ms-flex-order: -1;
          order: -1;
}
.form-wrapper .form-row .control-prefix .form-control:not(.form-prefix) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-left: 0;
}
.form-wrapper .form-row .control-prefix .form-control.form-prefix {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}
.form-wrapper .form-row .control-suffix .form-suffix {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}
.form-wrapper .form-row .control-suffix .form-control:not(.form-suffix) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-right: 0;
}
.form-wrapper .form-row .control-suffix .form-control.form-suffix {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}
.form-wrapper .form-row .control-prefix.control-suffix .form-control.form-outline.form-prefix {
  border-right: var(--field-border) solid var(--field-outline-color);
}
.form-wrapper .form-row .control-prefix.control-suffix .form-control.form-outline.form-prefix:hover {
  border-color: var(--field-hover-border);
}
.form-wrapper .form-row .control-prefix.control-suffix .form-control.form-outline.form-prefix:focus, .form-wrapper .form-row .control-prefix.control-suffix .form-control.form-outline.form-prefix:active {
  border-color: var(--field-hover-active-border);
}
.form-wrapper .form-row .control-prefix.control-suffix .form-control.form-outline.form-suffix {
  border-left: var(--field-border) solid var(--field-outline-color);
}
.form-wrapper .form-row .control-prefix.control-suffix .form-control.form-outline.form-suffix:hover {
  border-color: var(--field-hover-border);
}
.form-wrapper .form-row .control-prefix.control-suffix .form-control.form-outline.form-suffix:focus, .form-wrapper .form-row .control-prefix.control-suffix .form-control.form-outline.form-suffix:active {
  border-color: var(--field-hover-active-border);
}
.form-wrapper .form-button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 1.5em;
  -webkit-transition: 300ms ease background-color, 300ms ease color;
  transition: 300ms ease background-color, 300ms ease color;
}
.form-wrapper .form-button .btn {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
}
.form-wrapper .form-button .btn.btn-cancel {
  max-width: 150px;
  margin-right: 0.75rem;
}
.form-wrapper .form-button.first-button {
  margin-top: 0;
  margin-bottom: 1.5em;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.form-wrapper .form-crb {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.form-wrapper .form-crb input[type=checkbox],
.form-wrapper .form-crb input[type=radio] {
  margin-right: 0.25em;
}
.form-wrapper .form-crb span {
  cursor: pointer;
  white-space: nowrap;
}

@container form-row (max-width: 28em) {
  .form-wrapper .form-row .single-control.control-inline {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .form-wrapper .form-row .single-control.control-inline label {
    -webkit-box-flex: unset;
        -ms-flex: unset;
            flex: unset;
    -ms-flex-item-align: start;
        -ms-grid-row-align: start;
        align-self: start;
  }
  .form-wrapper .form-row .single-control.control-inline.control-crbs {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
  }
}
@container form-container (max-width: 95em) {
  .form-wrapper[data-cols="4"] {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
  }
  .app-modal .form-wrapper[data-cols="4"] {
    -ms-grid-columns: 1fr 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
  .form-wrapper[data-cols="5"] {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .app-modal .form-wrapper[data-cols="5"] {
    -ms-grid-columns: 1fr 1fr 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  }
  .form-wrapper[data-cols="6"] {
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
  }
  .app-modal .form-wrapper[data-cols="6"] {
    -ms-grid-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  }
}
@container form-container (max-width: 65em) {
  :not(.app-modal) .form-wrapper[data-cols="3"] {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
  }
  .app-modal :not(.app-modal) .form-wrapper[data-cols="3"] {
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
  }
  :not(.app-modal) .form-wrapper[data-cols="6"] {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
  }
  .app-modal :not(.app-modal) .form-wrapper[data-cols="6"] {
    -ms-grid-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  }
}
@container form-container (max-width: 40em) {
  :not(.app-modal) .form-wrapper[data-cols="6"], :not(.app-modal) .form-wrapper[data-cols="5"], :not(.app-modal) .form-wrapper[data-cols="4"], :not(.app-modal) .form-wrapper[data-cols="3"], :not(.app-modal) .form-wrapper[data-cols="2"] {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .app-modal :not(.app-modal) .form-wrapper[data-cols="6"] {
    -ms-grid-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  }
  .app-modal :not(.app-modal) .form-wrapper[data-cols="5"] {
    -ms-grid-columns: 1fr 1fr 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  }
  .app-modal :not(.app-modal) .form-wrapper[data-cols="4"] {
    -ms-grid-columns: 1fr 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
  .app-modal :not(.app-modal) .form-wrapper[data-cols="3"] {
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
  }
  .app-modal :not(.app-modal) .form-wrapper[data-cols="2"] {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
  }
  :not(.app-modal) .form-wrapper .form-row[data-colspan="6"], :not(.app-modal) .form-wrapper .form-row[data-colspan="5"], :not(.app-modal) .form-wrapper .form-row[data-colspan="4"], :not(.app-modal) .form-wrapper .form-row[data-colspan="3"], :not(.app-modal) .form-wrapper .form-row[data-colspan="2"] {
    grid-column: unset;
  }
}
.form-options {
  display: -ms-grid;
  display: grid;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  position: fixed;
  inset: 4.375em 1.5em auto 1em;
  padding-bottom: 1em;
  background: var(--theme-bg);
  z-index: 1;
}
.form-options[data-form-cols="2"] {
  -ms-grid-columns: 1fr auto;
  grid-template-columns: 1fr auto;
}
.form-options[data-form-cols="3"] {
  -ms-grid-columns: 1fr auto auto;
  grid-template-columns: 1fr auto auto;
}

.form-control.control-select2.form-xs + .select2-container--default .select2-selection--single,
.form-control.control-select2.form-xs + .select2-container--default .select2-selection--multiple {
  font-size: calc(var(--field-font-size) * 0.75) !important;
}
.form-control.control-select2.form-sm + .select2-container--default .select2-selection--single,
.form-control.control-select2.form-sm + .select2-container--default .select2-selection--multiple {
  font-size: calc(var(--field-font-size) * 0.875) !important;
}
.form-control.control-select2.form-md + .select2-container--default .select2-selection--single,
.form-control.control-select2.form-md + .select2-container--default .select2-selection--multiple {
  font-size: calc(var(--field-font-size) * 1.125) !important;
}
.form-control.control-select2.form-lg + .select2-container--default .select2-selection--single,
.form-control.control-select2.form-lg + .select2-container--default .select2-selection--multiple {
  font-size: calc(var(--field-font-size) * 1.25) !important;
}
.form-control.control-select2.form-xl + .select2-container--default .select2-selection--single,
.form-control.control-select2.form-xl + .select2-container--default .select2-selection--multiple {
  font-size: calc(var(--field-font-size) * 1.375) !important;
}
.form-control.control-select2.form-hg + .select2-container--default .select2-selection--single,
.form-control.control-select2.form-hg + .select2-container--default .select2-selection--multiple {
  font-size: calc(var(--field-font-size) * 1.5) !important;
}
.form-control.control-select2.form-outline + .select2-container--default .select2-selection--single {
  background: var(--theme-bg) !important;
  border-color: var(--field-outline-color) !important;
}
.form-control.control-select2.form-outline + .select2-container--default:hover .select2-selection--single {
  border-color: var(--field-hover-border) !important;
}
.form-control.control-select2.form-outline + .select2-container--default.select2-container--open .select2-selection--single {
  border-color: var(--field-hover-active-border) !important;
  -webkit-box-shadow: 0 0.25em 0.75em var(--field-active-shadow) !important;
          box-shadow: 0 0.25em 0.75em var(--field-active-shadow) !important;
}
.form-control.control-select2.form-outline + .select2-container--default .select2-selection--multiple {
  background: var(--theme-bg) !important;
  border-color: var(--field-outline-color) !important;
}
.form-control.control-select2.form-outline + .select2-container--default:hover .select2-selection--multiple {
  border-color: var(--field-hover-border) !important;
}
.form-control.control-select2.form-outline + .select2-container--default.select2-container--open .select2-selection--multiple {
  border-color: var(--field-hover-active-border) !important;
  -webkit-box-shadow: 0 0.25em 0.75em var(--field-active-shadow) !important;
          box-shadow: 0 0.25em 0.75em var(--field-active-shadow) !important;
}

.form-control + .select2-container--default {
  width: 100% !important;
}

.select2-container--default .selection {
  display: block;
}
.select2-container--default .select2-selection--single {
  background-color: var(--field-bg) !important;
  border: var(--field-border) solid var(--field-border-color) !important;
  color: var(--field-color) !important;
  height: unset !important;
  border-radius: var(--field-border-radius) !important;
  padding: var(--field-padding-select) !important;
  font-family: var(--field-font) !important;
  font-size: var(--field-font-size) !important;
  -webkit-box-sizing: border-box !important;
          box-sizing: border-box !important;
  -webkit-transition: 300ms ease all;
  transition: 300ms ease all;
  outline: 0;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  padding: 0 !important;
  font-family: inherit;
  line-height: 1.5 !important;
}
.control-prefix .select2-container--default .select2-selection--single .select2-selection__rendered {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.control-suffix .select2-container--default .select2-selection--single .select2-selection__rendered {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 100% !important;
  inset: 0 0 0 auto !important;
  background-image: var(--field-select-arrow);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 1.75em 1.5em;
  width: 2em !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border: 0 !important;
  height: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  inset: 0 !important;
  width: 100% !important;
}
.select2-container--default:hover .select2-selection--single {
  border-color: var(--field-hover-border) !important;
}
.select2-container--default.select2-container--open .select2-selection--single {
  border-color: var(--field-hover-active-border) !important;
  -webkit-box-shadow: 0 0.25em 0.75em var(--field-active-shadow) !important;
          box-shadow: 0 0.25em 0.75em var(--field-active-shadow) !important;
}
.select2-container--default .select2-selection--multiple {
  background-color: var(--field-bg) !important;
  border: var(--field-border) solid var(--field-border-color) !important;
  color: var(--field-color) !important;
  border-radius: var(--field-border-radius) !important;
  -webkit-box-sizing: border-box !important;
          box-sizing: border-box !important;
  font-size: var(--field-font-size) !important;
  font-family: var(--field-font) !important;
  -webkit-transition: 300ms ease all !important;
  transition: 300ms ease all !important;
  outline: 0 !important;
  padding: var(--field-padding) !important;
  display: -webkit-inline-box !important;
  display: -ms-inline-flexbox !important;
  display: inline-flex !important;
  -ms-flex-wrap: wrap !important;
      flex-wrap: wrap !important;
  gap: 0.5em;
  width: 100%;
  min-height: 2.875em !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__rendered {
  display: -webkit-inline-box !important;
  display: -ms-inline-flexbox !important;
  display: inline-flex !important;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 0.25em;
}
.select2-container--default .select2-selection--multiple .select2-selection__rendered:empty {
  display: none !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
  margin: 0;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  padding: 0;
  border: 0;
  background: var(--theme-color-10);
  gap: 0.375em;
  line-height: 1.5em;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
.select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice .select2-selection__choice__remove {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 0;
  width: 1.25em;
  background: transparent;
  color: var(--theme-color-50);
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
  border: 0;
}
.select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice .select2-selection__choice__remove > span {
  display: none;
}
.select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice .select2-selection__choice__remove:before {
  content: "\eb99";
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-family: remixicon;
  font-size: 0.875em;
}
.select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice .select2-selection__choice__remove:hover {
  background: var(--primary-color);
  color: var(--white-color);
}
.select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice .select2-selection__choice__display {
  font-size: inherit;
  padding: 0 0 0 0.5em;
}
.select2-container--default .select2-selection--multiple .select2-search {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  max-width: 100%;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.select2-container--default .select2-selection--multiple .select2-search .select2-search__field {
  font-family: inherit;
  font-size: inherit;
  background: transparent;
  margin: 0;
  height: 1.5em;
  white-space: nowrap;
}
.select2-container--default:hover .select2-selection--multiple {
  border-color: var(--field-hover-border) !important;
}
.select2-container--default.select2-container--open .select2-selection--multiple {
  border-color: var(--field-hover-active-border) !important;
  -webkit-box-shadow: 0 0.25em 0.75em var(--field-active-shadow);
          box-shadow: 0 0.25em 0.75em var(--field-active-shadow);
}

.select2-container .select2-dropdown {
  background: var(--select-dropdown-bg);
  color: var(--select-dropdown-color);
  border: var(--select-dropdown-border);
  border-radius: var(--select-dropdown-radius) !important;
  padding: var(--select-dropdown-padding);
  -webkit-box-shadow: var(--select-dropdown-shadow);
          box-shadow: var(--select-dropdown-shadow);
  overflow: hidden;
}
.select2-container .select2-dropdown .select2-search {
  padding: 0.5em;
  position: relative;
}
.select2-container .select2-dropdown .select2-search .select2-search__field {
  font-family: var(--field-font);
  font-size: var(--field-font-size);
  background-color: var(--field-bg);
  border: var(--field-border) solid var(--field-border-color);
  color: var(--field-color);
  line-height: 1.5;
  padding: var(--field-padding-search);
  border-radius: var(--field-border-radius);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transition: 300ms ease all;
  transition: 300ms ease all;
  outline: 0;
}
.select2-container .select2-dropdown .select2-search .select2-search__field:hover {
  border-color: var(--field-hover-border);
}
.select2-container .select2-dropdown .select2-search .select2-search__field:focus, .select2-container .select2-dropdown .select2-search .select2-search__field:active {
  border-color: var(--field-hover-active-border);
  -webkit-box-shadow: 0 0.25em 0.75em var(--field-active-shadow);
          box-shadow: 0 0.25em 0.75em var(--field-active-shadow);
}
.select2-container .select2-dropdown .select2-search:after {
  content: "";
  display: block;
  background-image: var(--field-search-icon);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 1.125em;
  width: 2em;
  height: calc(100% - 1em);
  position: absolute;
  inset: 0.5em 0.5em 0.5em auto;
  pointer-events: none;
}
.select2-container .select2-dropdown .select2-results .select2-results__options {
  padding: 0 0.5em 0.5em;
}
.select2-container .select2-dropdown .select2-results .select2-results__options::-webkit-scrollbar {
  width: var(--scrollbar-thick);
  background: var(--scrollbar-bg);
  border-radius: var(--scrollbar-thick);
}
.select2-container .select2-dropdown .select2-results .select2-results__options::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb-bg);
  border-radius: var(--scrollbar-thick);
  -webkit-transition: 200ms ease background-color;
  transition: 200ms ease background-color;
}
.select2-container .select2-dropdown .select2-results .select2-results__options::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover-bg);
}
.select2-container .select2-dropdown .select2-results .select2-results__options .select2-results__option {
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
  font-size: var(--select-dropdown-list-font-size);
  border-radius: var(--select-dropdown-list-radius);
  padding: var(--select-dropdown-list-padding);
}
.select2-container .select2-dropdown .select2-results .select2-results__options .select2-results__option:not(:last-child) {
  margin-bottom: 0.25em;
}
.select2-container .select2-dropdown .select2-results .select2-results__options .select2-results__option.select2-results__option--selected {
  background: var(--select-dropdown-list-selected-bg);
  color: var(--select-dropdown-list-selected-color);
}
.select2-container .select2-dropdown .select2-results .select2-results__options .select2-results__option.select2-results__option--highlighted {
  background: var(--select-dropdown-list-hover-bg);
  color: var(--select-dropdown-list-hover-color);
}
.select2-container .select2-dropdown .select2-results:only-child .select2-results__options {
  padding-top: 0.5em;
}

.btn, .btn-like {
  font-family: var(--button-font);
  font-weight: var(--button-font-weight);
  text-transform: var(--button-text-transform);
  letter-spacing: var(--button-letter-spacing);
  text-decoration: none;
  border-radius: var(--button-radius);
  line-height: 1.5;
  padding: var(--button-padding);
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
  position: relative;
  overflow: hidden;
  border: 0;
  font-size: var(--button-font-size);
  cursor: pointer;
  isolation: isolate;
  gap: 1em;
}
.btn > *, .btn-like > * {
  z-index: 2;
}
.btn.btn-ac-left, .btn-like.btn-ac-left {
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}
.btn.btn-ac-right, .btn-like.btn-ac-right {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.btn.btn-inline-w, .btn-like.btn-inline-w {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  -ms-grid-column-align: start;
      justify-self: start;
  max-width: unset;
}
.btn.btn-full-w, .btn-like.btn-full-w {
  width: 100%;
}
.btn.btn-vertical, .btn-like.btn-vertical {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  text-align: center;
  padding: var(--button-padding-vertical);
}
.btn.btn-vertical.btn-ac-left, .btn-like.btn-vertical.btn-ac-left {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.btn.btn-vertical.btn-ac-right, .btn-like.btn-vertical.btn-ac-right {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.btn.btn-vertical > span.btn-note, .btn-like.btn-vertical > span.btn-note {
  margin-top: -0.5em;
}
.btn > i, .btn-like > i {
  font-weight: normal;
  line-height: 1;
  -webkit-transition: 300ms ease transform;
  transition: 300ms ease transform;
  -webkit-transform: scale(1.5);
          transform: scale(1.5);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.btn > i:before, .btn-like > i:before {
  line-height: inherit;
}
.btn > span.btn-note, .btn-like > span.btn-note {
  font-weight: normal;
  text-transform: none;
  opacity: 0.7;
  font-size: 0.9em;
}
.btn:has(i:only-child), .btn-like:has(i:only-child) {
  width: var(--button-width-ico-only);
  aspect-ratio: 1/1;
  padding: var(--button-padding-ico-only);
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.btn:has(i:only-child) i, .btn-like:has(i:only-child) i {
  margin: 0;
}
.btn:hover > i, .btn-like:hover > i {
  -webkit-transform: scale(1.75);
          transform: scale(1.75);
}
.btn.btn-primary, .btn-like.btn-primary {
  background: var(--primary-color);
  color: var(--white-color);
  border: var(--button-stroke-width) solid transparent;
}
.btn.btn-primary:hover, .btn-like.btn-primary:hover {
  background: var(--primary-color-lighter-10);
  -webkit-box-shadow: var(--button-hover-shadow);
          box-shadow: var(--button-hover-shadow);
}
.btn.btn-primary.btn-outline, .btn-like.btn-primary.btn-outline {
  background: transparent;
  color: var(--primary-color);
  border: var(--button-stroke-width) solid var(--primary-color);
}
.btn.btn-primary.btn-outline:hover, .btn-like.btn-primary.btn-outline:hover {
  color: var(--primary-color-darker-10);
  background: var(--primary-color-20);
  border: var(--button-stroke-width) solid transparent;
}
.btn.btn-secondary, .btn-like.btn-secondary {
  background: var(--secondary-color);
  color: var(--white-color);
  border: var(--button-stroke-width) solid transparent;
}
.btn.btn-secondary:hover, .btn-like.btn-secondary:hover {
  background: var(--secondary-color-lighter-10);
  -webkit-box-shadow: var(--button-hover-shadow);
          box-shadow: var(--button-hover-shadow);
}
.btn.btn-secondary.btn-outline, .btn-like.btn-secondary.btn-outline {
  background: transparent;
  color: var(--secondary-color);
  border: var(--button-stroke-width) solid var(--secondary-color);
}
.btn.btn-secondary.btn-outline:hover, .btn-like.btn-secondary.btn-outline:hover {
  color: var(--secondary-color-darker-10);
  background: var(--secondary-color-20);
  border: var(--button-stroke-width) solid transparent;
}
.btn.btn-dark, .btn-like.btn-dark {
  background: var(--theme-color-80);
  color: var(--theme-bg);
  border: var(--button-stroke-width) solid transparent;
}
.btn.btn-dark:hover, .btn-like.btn-dark:hover {
  background: var(--theme-color-70);
  -webkit-box-shadow: var(--button-hover-shadow);
          box-shadow: var(--button-hover-shadow);
}
.btn.btn-dark.btn-outline, .btn-like.btn-dark.btn-outline {
  background: transparent;
  color: var(--theme-color-80);
  border: var(--button-stroke-width) solid var(--theme-color-80);
}
.btn.btn-dark.btn-outline:hover, .btn-like.btn-dark.btn-outline:hover {
  color: var(--theme-color);
  background: var(--theme-color-20);
  border: var(--button-stroke-width) solid transparent;
}
.btn.btn-light, .btn-like.btn-light {
  background: var(--theme-color-5);
  color: var(--theme-color-60);
  border: var(--button-stroke-width) solid transparent;
}
.btn.btn-light:hover, .btn-like.btn-light:hover {
  background: var(--theme-color-15);
  -webkit-box-shadow: var(--button-hover-shadow);
          box-shadow: var(--button-hover-shadow);
}
.btn.btn-light.btn-outline, .btn-like.btn-light.btn-outline {
  background: transparent;
  color: var(--theme-color);
  border: var(--button-stroke-width) solid var(--theme-color-10);
  color: var(--theme-color-60);
}
.btn.btn-light.btn-outline:hover, .btn-like.btn-light.btn-outline:hover {
  color: var(--theme-color-80);
  background: var(--theme-color-10);
  border: var(--button-stroke-width) solid transparent;
}
.btn.btn-clean, .btn-like.btn-clean {
  padding: 0;
  background: transparent;
  overflow: visible;
  border: none;
}
.btn.btn-clean:hover, .btn-like.btn-clean:hover {
  -webkit-transform: none;
          transform: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.btn.btn-xs, .btn-like.btn-xs {
  font-size: calc(var(--field-font-size) * 0.75);
}
.btn.btn-sm, .btn-like.btn-sm {
  font-size: calc(var(--field-font-size) * 0.875);
}
.btn.btn-md, .btn-like.btn-md {
  font-size: calc(var(--field-font-size) * 1.125);
}
.btn.btn-lg, .btn-like.btn-lg {
  font-size: calc(var(--field-font-size) * 1.25);
}
.btn.btn-xl, .btn-like.btn-xl {
  font-size: calc(var(--field-font-size) * 1.375);
}
.btn.btn-hg, .btn-like.btn-hg {
  font-size: calc(var(--field-font-size) * 1.5);
}
.btn.disabled, .btndisabled, .btn-like.disabled, .btn-likedisabled {
  pointer-events: none;
  opacity: var(--button-disabled-opacity);
}

.btn-like {
  cursor: default;
}
.btn-like.btn-primary:hover {
  background: var(--primary-color);
  color: var(--white-color);
}
.btn-like.btn-primary.btn-outline:hover {
  background: transparent;
  color: var(--primary-color);
  border: var(--button-stroke-width) solid var(--primary-color);
}
.btn-like.btn-secondary:hover {
  background: var(--secondary-color);
  color: var(--white-color);
}
.btn-like.btn-secondary.btn-outline:hover {
  background: transparent;
  color: var(--secondary-color);
  -webkit-box-shadow: 0 0 0 var(--button-stroke-width) var(--secondary-color) inset;
          box-shadow: 0 0 0 var(--button-stroke-width) var(--secondary-color) inset;
}
.btn-like.btn-dark:hover {
  background: var(--theme-color-80);
  color: var(--theme-bg);
}
.btn-like.btn-dark.btn-outline:hover {
  background: transparent;
  color: var(--theme-color-80);
  -webkit-box-shadow: 0 0 0 var(--button-stroke-width) var(--theme-color-80) inset;
          box-shadow: 0 0 0 var(--button-stroke-width) var(--theme-color-80) inset;
}
.btn-like.btn-light:hover {
  background: var(--theme-color-5);
  color: var(--theme-color-60);
}
.btn-like.btn-light.btn-outline:hover {
  background: transparent;
  color: var(--theme-color);
  -webkit-box-shadow: 0 0 0 var(--button-stroke-width) var(--theme-color-10) inset;
          box-shadow: 0 0 0 var(--button-stroke-width) var(--theme-color-10) inset;
  color: var(--theme-color-60);
}

.table {
  width: 100%;
  font-size: var(--datatable-font-size);
  margin: 0 auto var(--datatable-bottom-margin);
}
.table:has(thead.sticky), .table:has(tfoot.sticky) {
  position: relative;
}
.table thead th {
  background: var(--datatable-th-bg);
  color: var(--datatable-th-color);
  border-top: 2px solid var(--theme-color-10);
  border-bottom: 1px solid var(--theme-color-10);
  padding: var(--datatable-th-padding);
  text-align: left;
}
.table thead.sticky {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--theme-bg);
}
.table thead.sticky tr th {
  -webkit-box-shadow: 0 2px 0 0 var(--theme-color-10) inset, 0 -1px 0 0 var(--theme-color-10) inset;
          box-shadow: 0 2px 0 0 var(--theme-color-10) inset, 0 -1px 0 0 var(--theme-color-10) inset;
  border: 0;
  padding: var(--datatable-th-padding-sticky);
}
.table tbody td {
  border-bottom: var(--datatable-td-border);
  padding: var(--datatable-td-padding);
}
.table tbody td.t-primary {
  color: var(--primary-color);
}
.table tbody td.t-size-xs {
  font-size: calc(var(--datatable-font-size) * 0.75);
}
.table tbody td.t-size-sm {
  font-size: calc(var(--datatable-font-size) * 0.875);
}
.table tbody td.t-size-md {
  font-size: calc(var(--datatable-font-size) * 1.25);
}
.table tbody td.t-size-lg {
  font-size: calc(var(--datatable-font-size) * 1.5);
}
.table tbody td.t-size-xl {
  font-size: calc(var(--datatable-font-size) * 2);
}
.table tbody td.t-size-hg {
  font-size: calc(var(--datatable-font-size) * 2.5);
}
.table tfoot.sticky {
  position: sticky;
  bottom: 0;
  z-index: 1;
  background: var(--theme-bg);
}
.table.table-hover tbody tr {
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
}
.table.table-hover tbody tr:hover {
  background: var(--datatable-tr-hover-bg);
}
.table.table-striped tbody tr:nth-child(odd) {
  background: var(--datatable-tr-odd-bg);
}
.table.table-striped tbody tr:nth-child(even) {
  background: var(--datatable-tr-even-bg);
}
.table.table-striped.table-hover tbody tr:nth-child(odd):hover {
  background: var(--datatable-tr-odd-hover-bg);
}
.table.table-striped.table-hover tbody tr:nth-child(even):hover {
  background: var(--datatable-tr-even-hover-bg);
}
.table thead th.t-a-left,
.table thead td.t-a-left,
.table tfoot th.t-a-left,
.table tfoot td.t-a-left,
.table tbody td.t-a-left {
  text-align: left;
}
.table thead th.t-a-right,
.table thead td.t-a-right,
.table tfoot th.t-a-right,
.table tfoot td.t-a-right,
.table tbody td.t-a-right {
  text-align: right;
}
.table thead th.t-a-center,
.table thead td.t-a-center,
.table tfoot th.t-a-center,
.table tfoot td.t-a-center,
.table tbody td.t-a-center {
  text-align: center;
}

.datatable-main-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  position: relative;
  height: -webkit-fill-available;
  gap: var(--datatable-gap);
}
.datatable-main-container .dataTables_wrapper {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  position: relative;
}

.dataTables_wrapper {
  font-size: var(--datatable-font-size);
  height: 100%;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  -ms-grid-rows: 1fr auto;
  grid-template-rows: 1fr auto;
      grid-template-areas: "dtt-table dtt-table dtt-table dtt-table dtt-table dtt-table" "dtt-search dtt-entries dtt-info dtt-pagination dtt-pagination dtt-pagination";
}
.dataTables_wrapper .dataTables_length {
  -ms-grid-row: 2;
  -ms-grid-column: 2;
  grid-area: dtt-entries;
  padding: 0.5em 1em 0.5em 0 !important;
  position: sticky;
  background: var(--theme-bg);
  bottom: var(--datatable-options-bottom);
}
.dataTables_wrapper .dataTables_length label {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5em;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}
.dataTables_wrapper .dataTables_length label select {
  font-family: var(--field-font);
  font-size: var(--field-font-size);
  background-color: var(--field-bg);
  border: var(--field-border) solid var(--field-border-color);
  color: var(--field-color);
  line-height: 1.5;
  padding: var(--field-padding);
  border-radius: var(--field-border-radius);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transition: 300ms ease all;
  transition: 300ms ease all;
  outline: 0;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-image: var(--field-select-arrow);
  background-repeat: no-repeat;
  background-position: 100% center;
  background-size: 1.875em 1.5em;
  padding: var(--field-padding-select) !important;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
}
.dataTables_wrapper .dataTables_length label select:hover {
  border-color: var(--field-hover-border);
}
.dataTables_wrapper .dataTables_length label select:focus, .dataTables_wrapper .dataTables_length label select:active {
  border-color: var(--field-hover-active-border);
  -webkit-box-shadow: 0 0.25em 0.75em var(--field-active-shadow);
          box-shadow: 0 0.25em 0.75em var(--field-active-shadow);
}
.dataTables_wrapper .dataTables_filter {
  -ms-grid-row: 2;
  -ms-grid-column: 1;
  grid-area: dtt-search;
  margin-top: 0 !important;
  padding: 0.5em 1em 0.5em 0 !important;
  position: sticky;
  background: var(--theme-bg);
  bottom: var(--datatable-options-bottom);
}
.dataTables_wrapper .dataTables_filter label {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5em;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}
.dataTables_wrapper .dataTables_filter label input {
  font-family: var(--field-font);
  font-size: var(--field-font-size);
  background-color: var(--field-bg);
  border: var(--field-border) solid var(--field-border-color);
  color: var(--field-color);
  line-height: 1.5;
  padding: var(--field-padding);
  border-radius: var(--field-border-radius);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transition: 300ms ease all;
  transition: 300ms ease all;
  outline: 0;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
}
.dataTables_wrapper .dataTables_filter label input:hover {
  border-color: var(--field-hover-border);
}
.dataTables_wrapper .dataTables_filter label input:focus, .dataTables_wrapper .dataTables_filter label input:active {
  border-color: var(--field-hover-active-border);
  -webkit-box-shadow: 0 0.25em 0.75em var(--field-active-shadow);
          box-shadow: 0 0.25em 0.75em var(--field-active-shadow);
}
.dataTables_wrapper .dataTables_filter label input::-webkit-search-cancel-button {
  position: relative;
  -webkit-appearance: none;
  height: 1em;
  width: 1em;
  background-image: var(--field-reset-search-icon);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 1.125em;
  cursor: pointer;
  margin-left: 0.5em;
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
}
.dataTables_wrapper .dataTables_filter label input::-webkit-search-cancel-button:hover {
  opacity: 0.5;
}
.dataTables_wrapper table.dataTable {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
  -ms-grid-column-span: 6;
  grid-area: dtt-table;
  -ms-grid-row-align: start;
      align-self: start;
  border-bottom: 0;
}
.dataTables_wrapper table.dataTable.no-footer {
  border-bottom: 0;
}
.dataTables_wrapper table.dataTable thead {
  position: sticky;
  top: 0;
}
.dataTables_wrapper table.dataTable thead th {
  border-bottom: var(--datatable-th-border);
}
.dataTables_wrapper table.dataTable thead th, .dataTables_wrapper table.dataTable thead td {
  padding: 0.5em 0.75em;
}
.dataTables_wrapper table.dataTable thead th.text-left, .dataTables_wrapper table.dataTable thead td.text-left {
  text-align: left;
}
.dataTables_wrapper table.dataTable thead th.text-center, .dataTables_wrapper table.dataTable thead td.text-center {
  text-align: center;
}
.dataTables_wrapper table.dataTable thead th.text-right, .dataTables_wrapper table.dataTable thead td.text-right {
  text-align: right;
}
.dataTables_wrapper table.dataTable thead th.sorting_asc, .dataTables_wrapper table.dataTable thead th.sorting_desc, .dataTables_wrapper table.dataTable thead td.sorting_asc, .dataTables_wrapper table.dataTable thead td.sorting_desc {
  text-decoration: underline;
}
.dataTables_wrapper table.dataTable thead th.sorting, .dataTables_wrapper table.dataTable thead th.sorting_asc, .dataTables_wrapper table.dataTable thead th.sorting_desc, .dataTables_wrapper table.dataTable thead th.sorting_asc_disabled, .dataTables_wrapper table.dataTable thead th.sorting_desc_disabled, .dataTables_wrapper table.dataTable thead td.sorting, .dataTables_wrapper table.dataTable thead td.sorting_asc, .dataTables_wrapper table.dataTable thead td.sorting_desc, .dataTables_wrapper table.dataTable thead td.sorting_asc_disabled, .dataTables_wrapper table.dataTable thead td.sorting_desc_disabled {
  cursor: pointer;
  position: relative;
  padding-right: 2em;
}
.dataTables_wrapper table.dataTable thead th.sorting:before, .dataTables_wrapper table.dataTable thead th.sorting:after, .dataTables_wrapper table.dataTable thead th.sorting_asc:before, .dataTables_wrapper table.dataTable thead th.sorting_asc:after, .dataTables_wrapper table.dataTable thead th.sorting_desc:before, .dataTables_wrapper table.dataTable thead th.sorting_desc:after, .dataTables_wrapper table.dataTable thead th.sorting_asc_disabled:before, .dataTables_wrapper table.dataTable thead th.sorting_asc_disabled:after, .dataTables_wrapper table.dataTable thead th.sorting_desc_disabled:before, .dataTables_wrapper table.dataTable thead th.sorting_desc_disabled:after, .dataTables_wrapper table.dataTable thead td.sorting:before, .dataTables_wrapper table.dataTable thead td.sorting:after, .dataTables_wrapper table.dataTable thead td.sorting_asc:before, .dataTables_wrapper table.dataTable thead td.sorting_asc:after, .dataTables_wrapper table.dataTable thead td.sorting_desc:before, .dataTables_wrapper table.dataTable thead td.sorting_desc:after, .dataTables_wrapper table.dataTable thead td.sorting_asc_disabled:before, .dataTables_wrapper table.dataTable thead td.sorting_asc_disabled:after, .dataTables_wrapper table.dataTable thead td.sorting_desc_disabled:before, .dataTables_wrapper table.dataTable thead td.sorting_desc_disabled:after {
  font-family: remixicon;
  color: var(--theme-color);
  position: absolute;
  display: block;
  opacity: 0.125;
  right: 0.5em;
  line-height: 0.875em;
  font-size: 1em;
}
.dataTables_wrapper table.dataTable thead th.sorting:before, .dataTables_wrapper table.dataTable thead th.sorting_asc:before, .dataTables_wrapper table.dataTable thead th.sorting_desc:before, .dataTables_wrapper table.dataTable thead th.sorting_asc_disabled:before, .dataTables_wrapper table.dataTable thead th.sorting_desc_disabled:before, .dataTables_wrapper table.dataTable thead td.sorting:before, .dataTables_wrapper table.dataTable thead td.sorting_asc:before, .dataTables_wrapper table.dataTable thead td.sorting_desc:before, .dataTables_wrapper table.dataTable thead td.sorting_asc_disabled:before, .dataTables_wrapper table.dataTable thead td.sorting_desc_disabled:before {
  bottom: 50%;
  content: "\ea78";
  content: "\ea78"/"";
}
.dataTables_wrapper table.dataTable thead th.sorting:after, .dataTables_wrapper table.dataTable thead th.sorting_asc:after, .dataTables_wrapper table.dataTable thead th.sorting_desc:after, .dataTables_wrapper table.dataTable thead th.sorting_asc_disabled:after, .dataTables_wrapper table.dataTable thead th.sorting_desc_disabled:after, .dataTables_wrapper table.dataTable thead td.sorting:after, .dataTables_wrapper table.dataTable thead td.sorting_asc:after, .dataTables_wrapper table.dataTable thead td.sorting_desc:after, .dataTables_wrapper table.dataTable thead td.sorting_asc_disabled:after, .dataTables_wrapper table.dataTable thead td.sorting_desc_disabled:after {
  top: 50%;
  content: "\ea4e";
  content: "\ea4e"/"";
}
.dataTables_wrapper table.dataTable thead th.sorting.sorting_asc:before, .dataTables_wrapper table.dataTable thead th.sorting.sorting_desc:after, .dataTables_wrapper table.dataTable thead th.sorting_asc.sorting_asc:before, .dataTables_wrapper table.dataTable thead th.sorting_asc.sorting_desc:after, .dataTables_wrapper table.dataTable thead th.sorting_desc.sorting_asc:before, .dataTables_wrapper table.dataTable thead th.sorting_desc.sorting_desc:after, .dataTables_wrapper table.dataTable thead th.sorting_asc_disabled.sorting_asc:before, .dataTables_wrapper table.dataTable thead th.sorting_asc_disabled.sorting_desc:after, .dataTables_wrapper table.dataTable thead th.sorting_desc_disabled.sorting_asc:before, .dataTables_wrapper table.dataTable thead th.sorting_desc_disabled.sorting_desc:after, .dataTables_wrapper table.dataTable thead td.sorting.sorting_asc:before, .dataTables_wrapper table.dataTable thead td.sorting.sorting_desc:after, .dataTables_wrapper table.dataTable thead td.sorting_asc.sorting_asc:before, .dataTables_wrapper table.dataTable thead td.sorting_asc.sorting_desc:after, .dataTables_wrapper table.dataTable thead td.sorting_desc.sorting_asc:before, .dataTables_wrapper table.dataTable thead td.sorting_desc.sorting_desc:after, .dataTables_wrapper table.dataTable thead td.sorting_asc_disabled.sorting_asc:before, .dataTables_wrapper table.dataTable thead td.sorting_asc_disabled.sorting_desc:after, .dataTables_wrapper table.dataTable thead td.sorting_desc_disabled.sorting_asc:before, .dataTables_wrapper table.dataTable thead td.sorting_desc_disabled.sorting_desc:after {
  opacity: 0.6;
}
.dataTables_wrapper table.dataTable tfoot {
  position: sticky;
  bottom: var(--datatable-foot-bottom);
}
.dataTables_wrapper table.dataTable tfoot th {
  border-top: var(--datatable-th-border);
  border-bottom: var(--datatable-td-border);
}
.dataTables_wrapper table.dataTable tfoot th.text-left {
  text-align: left;
}
.dataTables_wrapper table.dataTable tfoot th.text-center {
  text-align: center;
}
.dataTables_wrapper table.dataTable tfoot th.text-right {
  text-align: right;
}
.dataTables_wrapper table.dataTable thead th, .dataTables_wrapper table.dataTable tfoot th {
  background: var(--datatable-th-bg);
  color: var(--datatable-th-color);
}
.dataTables_wrapper table.dataTable tbody td {
  padding: 0.5em 0.75em;
  border-top: var(--datatable-td-border);
}
.dataTables_wrapper table.dataTable tbody td.text-left {
  text-align: left;
}
.dataTables_wrapper table.dataTable tbody td.text-center {
  text-align: center;
}
.dataTables_wrapper table.dataTable tbody td.text-right {
  text-align: right;
}
.dataTables_wrapper table.dataTable tbody tr.odd td {
  -webkit-box-shadow: var(--datatable-td-odd-shadow);
          box-shadow: var(--datatable-td-odd-shadow);
  border-top: var(--datatable-td-border);
}
.dataTables_wrapper table.dataTable tbody tr.odd td.sorting_1 {
  -webkit-box-shadow: var(--datatable-td-odd-sort-shadow);
          box-shadow: var(--datatable-td-odd-sort-shadow);
}
.dataTables_wrapper table.dataTable tbody tr.odd:hover td {
  -webkit-box-shadow: var(--datatable-td-odd-hover-shadow);
          box-shadow: var(--datatable-td-odd-hover-shadow);
}
.dataTables_wrapper table.dataTable tbody tr.odd:hover td.sorting_1 {
  -webkit-box-shadow: var(--datatable-td-odd-sort-hover-shadow);
          box-shadow: var(--datatable-td-odd-sort-hover-shadow);
}
.dataTables_wrapper table.dataTable tbody tr.even td {
  -webkit-box-shadow: var(--datatable-td-even-shadow);
          box-shadow: var(--datatable-td-even-shadow);
  border-top: var(--datatable-td-border);
}
.dataTables_wrapper table.dataTable tbody tr.even td.sorting_1 {
  -webkit-box-shadow: var(--datatable-td-even-sort-shadow);
          box-shadow: var(--datatable-td-even-sort-shadow);
}
.dataTables_wrapper table.dataTable tbody tr.even:hover td {
  -webkit-box-shadow: var(--datatable-td-even-hover-shadow);
          box-shadow: var(--datatable-td-even-hover-shadow);
}
.dataTables_wrapper table.dataTable tbody tr.even:hover td.sorting_1 {
  -webkit-box-shadow: var(--datatable-td-even-sort-hover-shadow);
          box-shadow: var(--datatable-td-even-sort-hover-shadow);
}
.dataTables_wrapper .dataTables_info {
  -ms-grid-row: 2;
  -ms-grid-column: 3;
  grid-area: dtt-info;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  padding: 0.5em 0 !important;
  position: sticky;
  background: var(--theme-bg);
  bottom: var(--datatable-options-bottom);
}
.dataTables_wrapper .dataTables_paginate {
  -ms-grid-row: 2;
  -ms-grid-column: 4;
  -ms-grid-column-span: 3;
  grid-area: dtt-pagination;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5em;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  padding: 0.5em 0 !important;
  position: sticky;
  background: var(--theme-bg);
  bottom: var(--datatable-options-bottom);
  margin: 0 !important;
}
.dataTables_wrapper .dataTables_processing {
  margin-top: calc(var(--datatable-loader-width) / -2);
  margin-left: 0;
  padding: 0;
  width: unset;
  color: transparent !important;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.dataTables_wrapper .dataTables_processing > div:last-child {
  position: relative;
  width: var(--datatable-loader-width);
  height: var(--datatable-loader-width);
  margin: auto;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.dataTables_wrapper .dataTables_processing > div:last-child > div {
  position: absolute;
  width: var(--datatable-loader-width);
  height: var(--datatable-loader-width);
  opacity: 0;
  -webkit-transform: rotate(225deg);
          transform: rotate(225deg);
  -webkit-animation-iteration-count: infinite !important;
          animation-iteration-count: infinite !important;
  -webkit-animation-name: orbit !important;
          animation-name: orbit !important;
  -webkit-animation-duration: 5.5s !important;
          animation-duration: 5.5s !important;
  inset: unset !important;
  background: transparent !important;
  border-radius: 0 !important;
}
.dataTables_wrapper .dataTables_processing > div:last-child > div:after {
  content: "";
  position: absolute;
  width: var(--datatable-loader-dot-size);
  height: var(--datatable-loader-dot-size);
  border-radius: 50%;
  background: var(--primary-color);
}
.dataTables_wrapper .dataTables_processing > div:last-child > div:nth-child(1) {
  -webkit-animation-delay: 200ms;
          animation-delay: 200ms;
}
.dataTables_wrapper .dataTables_processing > div:last-child > div:nth-child(2) {
  -webkit-animation-delay: 500ms;
          animation-delay: 500ms;
}
.dataTables_wrapper .dataTables_processing > div:last-child > div:nth-child(3) {
  -webkit-animation-delay: 800ms;
          animation-delay: 800ms;
}
.dataTables_wrapper .dataTables_processing > div:last-child > div:nth-child(4) {
  -webkit-animation-delay: 1100ms;
          animation-delay: 1100ms;
}

.app-main .dataTables_wrapper .dataTables_paginate .paginate_button {
  margin: 0 !important;
  background: var(--datatable-pagination-bg) !important;
  color: var(--datatable-pagination-color) !important;
  border: var(--datatable-pagination-border) !important;
  border-radius: var(--datatable-pagination-radius) !important;
  padding: var(--datatable-pagination-padding) !important;
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
  -webkit-box-shadow: none !important;
          box-shadow: none !important;
  min-width: 2em !important;
}
.app-main .dataTables_wrapper .dataTables_paginate .paginate_button:hover, .app-main .dataTables_wrapper .dataTables_paginate .paginate_button:active {
  background: var(--datatable-pagination-hover-bg) !important;
  color: var(--datatable-pagination-hover-color) !important;
  border: var(--datatable-pagination-hover-border) !important;
}
.app-main .dataTables_wrapper .dataTables_paginate .paginate_button.current, .app-main .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover, .app-main .dataTables_wrapper .dataTables_paginate .paginate_button.current:active {
  background: var(--datatable-pagination-current-bg) !important;
  color: var(--datatable-pagination-current-color) !important;
  border: var(--datatable-pagination-current-border) !important;
}
.app-main .dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
  pointer-events: none;
  opacity: 0.3;
}
.app-main .dataTables_wrapper .dataTables_paginate .paginate_button.previous, .app-main .dataTables_wrapper .dataTables_paginate .paginate_button.next {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.75em;
}
.app-main .dataTables_wrapper .dataTables_paginate .paginate_button.previous:before {
  font-family: var(--datatable-pagination-prev-next-font);
  display: block;
  content: var(--datatable-pagination-prev-icon);
  -webkit-transform: scale(1.5);
          transform: scale(1.5);
}
.app-main .dataTables_wrapper .dataTables_paginate .paginate_button.next:after {
  font-family: var(--datatable-pagination-prev-next-font);
  display: block;
  content: var(--datatable-pagination-next-icon);
  -webkit-transform: scale(1.5);
          transform: scale(1.5);
}
.app-main .dataTables_wrapper .dataTables_paginate span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0.25em;
}
.app-main .dataTables_wrapper .dataTables_paginate span .ellipsis {
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
  padding: 0 0.5em !important;
  opacity: 0.5;
}

@media (max-width: 1199px) {
  .dataTables_wrapper {
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
    -ms-grid-rows: 1fr auto auto;
    grid-template-rows: 1fr auto auto;
        grid-template-areas: "dtt-table dtt-table dtt-table" "dtt-search dtt-search dtt-entries" "dtt-info dtt-pagination dtt-pagination";
  }
  .dataTables_wrapper table.dataTable tfoot {
    bottom: 7.3em;
  }
  .dataTables_wrapper .dataTables_filter,
  .dataTables_wrapper .dataTables_length {
    bottom: 3.375em;
  }
  .dataTables_wrapper .dataTables_length {
    -ms-grid-row: 2;
    -ms-grid-column: 3;
  }
  .dataTables_wrapper .dataTables_filter {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
  }
  .dataTables_wrapper table.dataTable {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
  .dataTables_wrapper .dataTables_info {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .dataTables_wrapper .dataTables_paginate {
    -ms-grid-row: 3;
    -ms-grid-column: 2;
    -ms-grid-column-span: 2;
  }
}
@media (max-width: 699px) {
  .dataTables_wrapper {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    -ms-grid-rows: 1fr auto auto;
    grid-template-rows: 1fr auto auto;
        grid-template-areas: "dtt-table dtt-table" "dtt-search dtt-entries" "dtt-info dtt-info" "dtt-pagination dtt-pagination";
  }
  .dataTables_wrapper table.dataTable tfoot {
    bottom: 8.75em;
  }
  .dataTables_wrapper .dataTables_filter,
  .dataTables_wrapper .dataTables_length {
    bottom: 4.875em;
  }
  .dataTables_wrapper .dataTables_info {
    bottom: 3.375em;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: 0 !important;
  }
  .dataTables_wrapper .dataTables_paginate {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .dataTables_wrapper .dataTables_length {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
  }
  .dataTables_wrapper .dataTables_filter {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
    -ms-grid-column-span: 1;
  }
  .dataTables_wrapper table.dataTable {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
  }
  .dataTables_wrapper .dataTables_info {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
  }
  .dataTables_wrapper .dataTables_paginate {
    -ms-grid-row: 4;
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
  }
}
.app-tabs nav ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: var(--tabs-gap);
}
.app-tabs nav ul::-webkit-scrollbar {
  background: var(--scrollbar-bg);
  border-radius: var(--scrollbar-thick);
}
.app-tabs nav ul::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb-bg);
  border-radius: var(--scrollbar-thick);
  -webkit-transition: 200ms ease background-color;
  transition: 200ms ease background-color;
}
.app-tabs nav ul::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover-bg);
}
.app-tabs nav ul li {
  gap: 0.5em;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: var(--tabs-padding);
  border-radius: var(--tabs-radius);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
  cursor: pointer;
}
.app-tabs nav ul li .app-tab-link {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  overflow: hidden;
  max-height: 1.5em;
  color: inherit;
  cursor: pointer;
}
.app-tabs nav ul li .app-tab-close {
  font-family: var(--tabs-close-family);
  font-size: 0;
  cursor: pointer;
}
.app-tabs nav ul li .app-tab-close:before {
  font-family: inherit;
  content: var(--tabs-close-icon);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: var(--tabs-close-width);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-size: var(--tabs-close-size);
  background: var(--tabs-close-bg);
  color: var(--tabs-close-color);
  border-radius: var(--tabs-close-radius);
  aspect-ratio: 1/1;
  line-height: 1;
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
}
.app-tabs nav ul li .app-tab-close:hover:before {
  background: var(--tabs-close-hover-bg);
  color: var(--tabs-close-hover-color);
}
.app-tabs nav ul li:hover {
  color: var(--tabs-hover-color);
  border-color: var(--tabs-hover-border);
}
.app-tabs[data-tabs-type=horizontal] nav ul {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  overflow-x: auto;
  padding-bottom: 0.25em;
}
.app-tabs[data-tabs-type=horizontal] nav ul::-webkit-scrollbar {
  height: var(--scrollbar-thick);
}
.app-tabs[data-tabs-type=horizontal] nav ul li {
  width: var(--tabs-width);
  -webkit-box-flex: 1;
      -ms-flex: 1 1 var(--tabs-width);
          flex: 1 1 var(--tabs-width);
  min-width: var(--tabs-min-width);
  max-width: var(--tabs-max-width);
}
.app-tabs[data-tabs-type=horizontal][data-tab-width=content-aware] nav ul li {
  width: unset;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  min-width: unset;
  max-width: unset;
}
.app-tabs[data-tabs-type=vertical] nav ul {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  overflow-y: auto;
  padding-right: 0.25em;
}
.app-tabs[data-tabs-type=vertical] nav ul::-webkit-scrollbar {
  width: var(--scrollbar-thick);
}
.app-tabs[data-tabs-style=line] li {
  background: var(--tabs-line-bg);
  color: var(--tabs-line-color);
  border: var(--tabs-line-border);
}
.app-tabs[data-tabs-style=line] li:hover {
  background: var(--tabs-line-hover-bg);
  color: var(--tabs-line-hover-color);
  border-color: var(--tabs-line-hover-border);
}
.app-tabs[data-tabs-style=line] li.app-tab-active, .app-tabs[data-tabs-style=line] li.app-tab-active:hover {
  background: var(--tabs-line-active-bg);
  color: var(--tabs-line-active-color);
  border-color: var(--tabs-line-active-border);
}
.app-tabs[data-tabs-style=line][data-tabs-type=horizontal] nav ul li {
  border-bottom: 0;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.app-tabs[data-tabs-style=fill] li {
  background: var(--tabs-fill-bg);
  color: var(--tabs-fill-color);
  border: var(--tabs-fill-border);
}
.app-tabs[data-tabs-style=fill] li:hover {
  background: var(--tabs-fill-hover-bg);
  color: var(--tabs-fill-hover-color);
  border-color: var(--tabs-fill-hover-border);
}
.app-tabs[data-tabs-style=fill] li.app-tab-active, .app-tabs[data-tabs-style=fill] li.app-tab-active:hover {
  background: var(--tabs-fill-active-bg);
  color: var(--tabs-fill-active-color);
  border-color: var(--tabs-fill-active-border);
}
.app-tabs[data-tabs-style=clear] li {
  color: var(--tabs-clear-color);
  border: var(--tabs-clear-border);
}
.app-tabs[data-tabs-style=clear] li:hover {
  background: var(--tabs-clear-hover-bg);
  color: var(--tabs-clear-hover-color);
  border-color: var(--tabs-clear-hover-border);
}
.app-tabs[data-tabs-style=clear] li.app-tab-active, .app-tabs[data-tabs-style=clear] li.app-tab-active:hover {
  font-weight: bold;
  background: var(--tabs-clear-active-bg);
  color: var(--tabs-clear-active-color);
  border-color: var(--tabs-clear-active-border);
}

.app-message {
  background: var(--message-bg);
  background: var(--message-color);
  margin-bottom: 1em;
  border: var(--message-border);
  border-radius: var(--message-radius);
  padding: var(--message-padding);
}
.app-message .message-sleeve .message-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1em;
}
.app-message .message-sleeve .message-title .message-headline {
  font-size: 1em;
  font-weight: bold;
}
.app-message .message-sleeve .message-title .message-headline:not(:only-child) {
  margin-bottom: 0.5em;
}
.app-message .message-sleeve .message-title .message-close {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
}
.app-message .message-sleeve .message-title .message-close span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  cursor: pointer;
}
.app-message .message-sleeve .message-title .message-close span:before {
  line-height: inherit;
  font-family: var(--message-close-icon-family);
  font-size: var(--message-close-icon-size);
  content: var(--message-close-icon);
}
.app-message .message-sleeve .message-title .message-close:hover {
  opacity: 0.5;
}
.app-message .message-sleeve .message-content {
  font-size: var(--message-content-font-size);
}
.app-message .message-sleeve .message-content > p:not(:last-child), .app-message .message-sleeve .message-content > ol:not(:last-child), .app-message .message-sleeve .message-content > ul:not(:last-child) {
  margin-bottom: 1em;
}
.app-message.message-info {
  background: var(--message-info-bg);
  color: var(--message-info-color);
  border: var(--message-info-border);
  -webkit-box-shadow: var(--message-info-shadow);
          box-shadow: var(--message-info-shadow);
}
.app-message.message-info .message-title {
  color: var(--message-info-title-color);
}
.app-message.message-success {
  background: var(--message-success-bg);
  color: var(--message-success-color);
  border: var(--message-success-border);
  -webkit-box-shadow: var(--message-success-shadow);
          box-shadow: var(--message-success-shadow);
}
.app-message.message-success .message-title {
  color: var(--message-success-title-color);
}
.app-message.message-warning {
  background: var(--message-warning-bg);
  color: var(--message-warning-color);
  border: var(--message-warning-border);
  -webkit-box-shadow: var(--message-warning-shadow);
          box-shadow: var(--message-warning-shadow);
}
.app-message.message-warning .message-title {
  color: var(--message-warning-title-color);
}
.app-message.message-error {
  background: var(--message-error-bg);
  color: var(--message-error-color);
  border: var(--message-error-border);
  -webkit-box-shadow: var(--message-error-shadow);
          box-shadow: var(--message-error-shadow);
}
.app-message.message-error .message-title {
  color: var(--message-error-title-color);
}

.disabled {
  opacity: 0.4;
}
.disabled * {
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.app-tabs {
  margin-bottom: 1rem;
  font-size: 0.875em;
}

.view-options {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1em;
  margin: 0 0 1em;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.view-options .filter-options,
.view-options .sort-options {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
}
.view-options > div:not(:only-child):nth-child(2) {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
}
.view-options .filter-buttons {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 100%;
          flex: 1 0 100%;
}

.filter-options,
.sort-options {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.5em;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.sort {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1em;
}
.sort label {
  font-size: 0.875em;
}
.search.search-date, .search.search-keyword, .search.search-category, .search.search-button {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 auto;
          flex: 1 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1em;
}
.search.search-date .form-control, .search.search-keyword .form-control, .search.search-category .form-control, .search.search-button .form-control {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 auto;
          flex: 1 0 auto;
}
.search label {
  font-size: 0.875em;
  width: 10em;
}

.cene-holder .table {
  max-width: 1130px;
  margin-left: 0;
}
.cene-holder .table .code {
  color: var(--theme-color-60);
  font-size: 0.875em;
}
.cene-holder .table .price.approved {
  color: var(--success-color);
}
.cene-holder .table .price.rejected {
  color: var(--error-color);
}
.cene-holder .table .status {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  clear: both;
  line-height: 1;
  padding: 0.5em;
  border-radius: 2em;
  font-size: 0.875em;
}
.cene-holder .table .status.on-hold {
  background: var(--white-color);
  color: var(--theme-color-50);
  -webkit-box-shadow: 0 0 0 1px var(--theme-color-20) inset;
          box-shadow: 0 0 0 1px var(--theme-color-20) inset;
}
.cene-holder .table .status.approved {
  background: var(--success-color);
  color: var(--white-color);
}
.cene-holder .table .status.rejected {
  background: var(--error-color);
  color: var(--white-color);
}

.displej-holder .table {
  max-width: 1130px;
  margin-left: 0;
}
.displej-holder .table .product {
  font-weight: bold;
  -webkit-transition: 200ms ease color;
  transition: 200ms ease color;
}
.displej-holder .table .product:hover {
  color: var(--primary-color);
  cursor: pointer;
}
.displej-holder .table .status {
  font-weight: bold;
}
.displej-holder .table .status.red {
  color: var(--error-color);
}
.displej-holder .table .status.green {
  color: var(--success-color);
}
.displej-holder .table .product-list {
  display: none;
}
.displej-holder .table .product-list:hover {
  background: transparent !important;
}
.displej-holder .table .product-list.show {
  display: table-row;
}
.displej-holder .table .product-list > td {
  padding: 0;
}
.displej-holder .table .product-list .table {
  margin-bottom: 0;
}
.displej-holder .table .product-list .table th:not(:first-child),
.displej-holder .table .product-list .table td:not(:first-child) {
  text-align: right;
}
.displej-holder .table .product-list .table tfoot tr, .displej-holder .table .product-list .table tfoot tr:hover {
  background: var(--primary-color);
  color: var(--white-color);
}
.displej-holder .table .product-list .table tfoot tr td, .displej-holder .table .product-list .table tfoot tr:hover td {
  font-weight: bold;
}
.displej-holder.table-striped tbody tr:nth-child(4n+1), .displej-holder.table-striped tbody tr:nth-child(4n+2) {
  background: var(--datatable-tr-odd-bg);
}
.displej-holder.table-striped tbody tr:nth-child(4n+3), .displej-holder.table-striped tbody tr:nth-child(4n+4) {
  background: var(--datatable-tr-even-bg);
}
.displej-holder.table-striped.table-hover tbody tr:nth-child(4n+1):hover, .displej-holder.table-striped.table-hover tbody tr:nth-child(4n+2):hover {
  background: var(--datatable-tr-odd-hover-bg);
}
.displej-holder.table-striped.table-hover tbody tr:nth-child(4n+3):hover, .displej-holder.table-striped.table-hover tbody tr:nth-child(4n+4):hover {
  background: var(--datatable-tr-even-hover-bg);
}

.segmentacija-holder .table {
  max-width: 1130px;
  margin-left: 0;
}
.segmentacija-holder .table .segment {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  clear: both;
  line-height: 1;
  width: 1.5em;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  aspect-ratio: 1/1;
  border-radius: 2em;
  line-height: 0;
}
.segmentacija-holder .table .segment.red {
  background: var(--error-color);
  color: var(--white-color);
}
.segmentacija-holder .table .segment.green {
  background: var(--success-color);
  color: var(--white-color);
}

.fokus-holder .table {
  max-width: 1130px;
  margin-left: 0;
}
.fokus-holder .table .code {
  color: var(--theme-color-60);
  font-size: 0.875em;
}
.fokus-holder .table .product-options .product-cat {
  font-size: 0.875em;
  color: var(--theme-color-60);
}
.fokus-holder .table .product-options .product-name {
  font-weight: bold;
}
.fokus-holder .table .trebuj {
  width: 150px;
}
.fokus-holder .table .fokus-trebuj {
  width: 11.5em;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 5em 0.5em 6em;
  grid-template-columns: 5em 6em;
  gap: 0.5em;
}
.fokus-holder .table .fokus-trebuj input::-webkit-inner-spin-button, .fokus-holder .table .fokus-trebuj input::-webkit-outer-spin-button {
  opacity: 1;
}

.arrived-products-holder .table .code {
  color: var(--theme-color-60);
  font-size: 0.875em;
}
.arrived-products-holder .table .distributor:not(:first-child) td {
  border-top: 2px solid var(--theme-color-10);
}
.arrived-products-holder .table .distributor td {
  border-bottom: 0;
}
.arrived-products-holder .table .distributor td .supplier-data {
  font-weight: bold;
}
.arrived-products-holder .table .product-list td {
  font-size: 0.875em;
  padding: 0.375rem 0.75rem;
}
.arrived-products-holder .table .product-list td.t-size-lg {
  font-size: 1.125em;
}
.arrived-products-holder .table .product-list:hover {
  background: transparent !important;
}
.arrived-products-holder .table .product-list .product-options .product-features {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25em;
  text-decoration: none;
  color: var(--theme-color-60);
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
  -webkit-box-flex: 1;
      -ms-flex: 1 0 100%;
          flex: 1 0 100%;
}
.arrived-products-holder .table .product-list .product-options .product-features i {
  font-size: 1.375em;
}
.arrived-products-holder .table .product-list .product-options .product-features:hover {
  color: var(--theme-color);
}
.arrived-products-holder .table .product-list .trebuj {
  text-align: right;
  font-size: 1em;
}
.arrived-products-holder .table .product-list .trebuj .note {
  color: var(--theme-color-60);
  font-size: 0.875em;
}
.arrived-products-holder .table .product-list .trebuj .arrive-trebuj {
  width: 11.5em;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 5em 0.5em 6em;
  grid-template-columns: 5em 6em;
  gap: 0.5em;
  margin-left: auto;
}
.arrived-products-holder .table .product-list .trebuj .arrive-trebuj input::-webkit-inner-spin-button, .arrived-products-holder .table .product-list .trebuj .arrive-trebuj input::-webkit-outer-spin-button {
  opacity: 1;
}
.arrived-products-holder .table.table-striped tbody tr.distributor {
  background: var(--datatable-tr-odd-bg);
}
.arrived-products-holder .table.table-striped tbody tr.product-list {
  background: var(--datatable-tr-even-bg);
}
.arrived-products-holder .table.table-striped.table-hover tbody tr:nth-child(4n+1):hover, .arrived-products-holder .table.table-striped.table-hover tbody tr:nth-child(4n+2):hover {
  background: var(--datatable-tr-odd-hover-bg);
}
.arrived-products-holder .table.table-striped.table-hover tbody tr:nth-child(4n+3):hover, .arrived-products-holder .table.table-striped.table-hover tbody tr:nth-child(4n+4):hover {
  background: var(--datatable-tr-even-hover-bg);
}

.delivery-holder .table {
  max-width: 1130px;
  margin-left: 0;
}
.delivery-holder .table .options {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  gap: 0.5em;
}
.delivery-holder .table .btn-showdetails i:before {
  -webkit-transition: 200ms ease transform;
  transition: 200ms ease transform;
}
.delivery-holder .table .btn-showdetails.show i:before {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
.delivery-holder .table .route-data {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1em;
}
.delivery-holder .table .route-data .note {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  clear: both;
  line-height: 1;
  padding: 0.5em 1em;
  border-radius: 2em;
}
.delivery-holder .table .route-data .note.success {
  background: var(--success-color);
  color: var(--white-color);
}
.delivery-holder .table .route-data .note.error {
  background: var(--primary-color);
  color: var(--white-color);
}
.delivery-holder .table .delivery-details {
  display: none;
}
.delivery-holder .table .delivery-details:hover {
  background: transparent !important;
}
.delivery-holder .table .delivery-details.show {
  display: table-row;
}
.delivery-holder .table .delivery-details > td {
  padding: 0;
  border: 0 !important;
}
.delivery-holder .table .delivery-details > td .table {
  margin: 0;
  border-top: 1px solid var(--primary-color);
  border-bottom: 4px solid var(--primary-color);
}
.delivery-holder .table .delivery-details > td .table tr {
  background: transparent !important;
}
.delivery-holder .table .delivery-details > td .table .product-options .product-cat {
  font-size: 0.875em;
  color: var(--theme-color-60);
}
.delivery-holder .table .delivery-details > td .table .product-options .product-name {
  font-weight: bold;
}
.delivery-holder .table .delivery-details > td .table .product-price {
  font-size: calc(var(--datatable-font-size) * 1.5);
  color: var(--primary-color);
  font-weight: bold;
}
.delivery-holder .table.table-striped tbody tr:nth-child(4n+1), .delivery-holder .table.table-striped tbody tr:nth-child(4n+2) {
  background: var(--datatable-tr-odd-bg);
}
.delivery-holder .table.table-striped tbody tr:nth-child(4n+3), .delivery-holder .table.table-striped tbody tr:nth-child(4n+4) {
  background: var(--datatable-tr-even-bg);
}
.delivery-holder .table.table-striped.table-hover tbody tr:nth-child(4n+1):hover, .delivery-holder .table.table-striped.table-hover tbody tr:nth-child(4n+2):hover {
  background: var(--datatable-tr-odd-hover-bg);
}
.delivery-holder .table.table-striped.table-hover tbody tr:nth-child(4n+3):hover, .delivery-holder .table.table-striped.table-hover tbody tr:nth-child(4n+4):hover {
  background: var(--datatable-tr-even-hover-bg);
}

.popis-holder h2 {
  margin-bottom: 0.5em;
}
.popis-holder .table {
  max-width: 1130px;
  margin-left: 0;
}
.popis-holder .table + h2 {
  margin-top: 2em;
}
.popis-holder .table .code {
  color: var(--theme-color-60);
  font-size: 0.875em;
}
.popis-holder .table .product-options .product-cat {
  font-size: 0.875em;
  color: var(--theme-color-60);
}
.popis-holder .table .product-options .product-name {
  font-weight: bold;
}

.pakovanje-transport-holder > h2 {
  margin-bottom: 0.5em;
  font-size: 1.5em;
  font-weight: normal;
}
.pakovanje-transport-holder > h2 strong {
  font-weight: bold;
}
.pakovanje-transport-holder .table {
  max-width: 800px;
  margin-left: 0;
}
.pakovanje-transport-holder .table + h2 {
  margin-top: 4em;
}
.pakovanje-transport-holder .table .code {
  color: var(--theme-color-60);
  font-size: 0.875em;
}
.pakovanje-transport-holder .table .options {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25em;
}
.pakovanje-transport-holder .table .options .reservation {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  clear: both;
  line-height: 1;
  padding: 0.25em 0.675em;
  border-radius: 2em;
  font-size: 0.875em;
}
.pakovanje-transport-holder .table .options .reservation.trebovanje {
  background: var(--success-color);
  color: var(--white-color);
}
.pakovanje-transport-holder .table .options .reservation.kupac {
  background: var(--primary-color);
  color: var(--white-color);
}
.pakovanje-transport-holder .table .product-options .product-cat {
  font-size: 0.875em;
  color: var(--theme-color-60);
}
.pakovanje-transport-holder .table .product-options .product-name {
  font-weight: bold;
}
.pakovanje-transport-holder .table .product-price {
  font-size: calc(var(--datatable-font-size) * 1.5);
  color: var(--primary-color);
  font-weight: bold;
}

.note-intro {
  max-width: 800px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.note-intro .note {
  font-size: 0.875em;
  margin-left: 1em;
  color: var(--theme-color-60);
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25em;
}
.note-intro .note i {
  font-size: 1.5em;
}
.note-intro .note.warning {
  color: var(--primary-color);
}

.lager-holder {
  --lager-table-odd-bg: #f8f8f8;
  --lager-table-even-bg: var(--white-color);
  position: relative;
  overflow: auto;
  width: 100%;
  height: calc((100dvh - 21em) / 2);
  border-bottom: var(--datatable-td-border);
}
.lager-holder + .lager-holder {
  margin-top: 2em;
}
.lager-holder::-webkit-scrollbar {
  width: var(--scrollbar-thick);
  height: var(--scrollbar-thick);
  background: var(--scrollbar-bg);
  border-radius: var(--scrollbar-thick);
}
.lager-holder::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb-bg);
  border-radius: var(--scrollbar-thick);
  -webkit-transition: 200ms ease background-color;
  transition: 200ms ease background-color;
}
.lager-holder::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover-bg);
}
.lager-holder .table {
  width: 100%;
  margin-bottom: 0;
}
.lager-holder .table thead.sticky {
  z-index: 2;
}
.lager-holder .table thead.sticky th {
  font-size: 0.75em;
  font-weight: normal;
  padding: calc(0.5em + 2px) 0.75rem calc(0.5em + 1px);
  letter-spacing: 0;
}
.lager-holder .table thead.sticky th.store {
  padding: 0.5rem 0.25rem;
  white-space: nowrap;
  width: 20px;
}
.lager-holder .table thead.sticky th.store.current {
  background: var(--primary-color-20);
}
.lager-holder .table tbody tr:last-child td {
  border-bottom: 0;
}
.lager-holder .table thead th,
.lager-holder .table tbody td {
  --td-code-width: 50px;
  --td-product-width: 250px;
  --td-price-width: 150px;
  --td-storage-width: 100px;
  vertical-align: middle;
}
.lager-holder .table thead th.current,
.lager-holder .table tbody td.current {
  background: var(--primary-color-20);
}
.lager-holder .table thead th.code, .lager-holder .table thead th.product, .lager-holder .table thead th.price, .lager-holder .table thead th.storage,
.lager-holder .table tbody td.code,
.lager-holder .table tbody td.product,
.lager-holder .table tbody td.price,
.lager-holder .table tbody td.storage {
  z-index: 1;
}
.lager-holder .table thead th.code,
.lager-holder .table tbody td.code {
  left: 0;
}
.lager-holder .table thead th.product,
.lager-holder .table tbody td.product {
  left: calc(var(--td-code-width) + 1.5rem);
}
.lager-holder .table thead th.price,
.lager-holder .table tbody td.price {
  left: calc(var(--td-code-width) + var(--td-product-width) + 3rem);
  text-align: right;
}
.lager-holder .table thead th.storage,
.lager-holder .table tbody td.storage {
  left: calc(var(--td-code-width) + var(--td-product-width) + var(--td-price-width) + 4.5rem);
  text-align: right;
}
.lager-holder .table thead th.quantity,
.lager-holder .table tbody td.quantity {
  text-align: right;
}
.lager-holder .table thead th.store,
.lager-holder .table tbody td.store {
  text-align: right;
  border-left: var(--datatable-td-border);
}
.lager-holder .table thead th.display,
.lager-holder .table tbody td.display {
  width: 40px;
  border-left: var(--datatable-td-border);
}
.lager-holder .table thead th.add-cart,
.lager-holder .table tbody td.add-cart {
  width: 100px;
  border-left: 0;
  text-align: center;
}
.lager-holder .table thead th.delete,
.lager-holder .table tbody td.delete {
  text-align: center;
  width: 100px;
  border-left: 0;
}
.lager-holder .table tbody td {
  border-left: var(--datatable-td-border);
  padding: 0.5rem 0.25rem;
}
.lager-holder .table tbody td.code, .lager-holder .table tbody td.product, .lager-holder .table tbody td.price, .lager-holder .table tbody td.quantity, .lager-holder .table tbody td.delete, .lager-holder .table tbody td.storage {
  border-left: 0;
  padding: var(--datatable-td-padding);
}
.lager-holder .table tbody td.code .product-code {
  width: 100%;
}
.lager-holder .table tbody td.product .product-options {
  width: 100%;
}
.lager-holder .table tbody td.price {
  text-align: right;
}
.lager-holder .table tbody td.price .price-options {
  width: 100%;
}
.lager-holder .table tbody td.storage .storage-options {
  width: 100%;
}
.lager-holder .table tbody td.display input {
  margin-left: auto;
  margin-right: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.lager-holder .table tbody td.add-cart .add-cart-options {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25em;
}
.lager-holder .table tbody td .product-code {
  font-size: 0.875em;
  color: var(--theme-color-60);
}
.lager-holder .table tbody td .product-code > a {
  color: inherit;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  border: 1px solid var(--theme-color-30);
  border-radius: var(--button-radius);
  padding: 0.375em 0.5em;
  text-decoration: none;
  -webkit-transition: 300ms ease all;
  transition: 300ms ease all;
  line-height: 1;
}
.lager-holder .table tbody td .product-code > a:hover {
  background: var(--theme-bg);
  color: var(--theme-color);
  border-color: var(--theme-color-60);
}
.lager-holder .table tbody td .product-options {
  font-size: 0.875em;
  line-height: 1.2;
  gap: 0.125em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.lager-holder .table tbody td .product-options .product-cat {
  color: var(--theme-color-60);
  -webkit-box-flex: 1;
      -ms-flex: 1 0 100%;
          flex: 1 0 100%;
}
.lager-holder .table tbody td .product-options .product-name {
  font-weight: bold;
  -webkit-box-flex: 1;
      -ms-flex: 1 0 100%;
          flex: 1 0 100%;
  font-size: 0.875rem;
}
.lager-holder .table tbody td .product-options .product-image {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.25em;
  text-decoration: none;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.lager-holder .table tbody td .product-options .product-image i {
  font-size: 1.5em;
}
.lager-holder .table tbody td .product-options .product-status {
  background: var(--error-color);
  color: var(--white-color);
  border-radius: 2em;
  padding: 0.0675em 0.75em;
  text-transform: uppercase;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.lager-holder .table tbody td .product-options .product-status.available {
  background: var(--success-color);
}
.lager-holder .table tbody td .product-options .product-focus {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  align-items: center;
  width: 1.5em;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background: var(--primary-color);
  font-size: 0.875em;
  color: var(--white-color);
  text-transform: uppercase;
  font-weight: bold;
  line-height: 0;
  margin-left: 1em;
}
.lager-holder .table tbody td .product-options .product-features {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.25em;
  text-decoration: none;
  color: var(--theme-color-60);
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
  -webkit-box-flex: 1;
      -ms-flex: 1 0 100%;
          flex: 1 0 100%;
}
.lager-holder .table tbody td .product-options .product-features i {
  font-size: 1.375em;
}
.lager-holder .table tbody td .product-options .product-features:hover {
  color: var(--theme-color);
}
.lager-holder .table tbody td .price-options {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0 0.5em;
}
.lager-holder .table tbody td .price-options .price {
  -webkit-box-flex: 1;
      -ms-flex: 1 0 100%;
          flex: 1 0 100%;
  font-weight: bold;
  -webkit-transition: 300ms ease all;
  transition: 300ms ease all;
  color: var(--primary-color);
}
.lager-holder .table tbody td .price-options .energy-class {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 0.0675em 0.375em;
  align-items: center;
  border-radius: var(--b-radius-sm);
  background: var(--warning-color);
  font-size: 0.875em;
}
.lager-holder .table tbody td .price-options .action {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 0.0675em 0.375em;
  align-items: center;
  border-radius: var(--b-radius-sm);
  background: var(--theme-color-10);
  font-size: 0.875em;
  color: var(--error-color);
  text-transform: uppercase;
  font-weight: bold;
}
.lager-holder .table tbody td .price-options .check {
  font-size: 1.5em;
  line-height: 0;
  color: var(--success-color);
}
.lager-holder .table tbody td .price-options .check i {
  line-height: inherit;
}
.lager-holder .table tbody td .price-options .items {
  font-size: 0.875em;
  color: var(--theme-color-60);
}
.lager-holder .table tbody td .quantity {
  font-weight: bold;
}
.lager-holder .table tbody td .storage-options {
  font-size: 0.875em;
  font-weight: bold;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.25em;
  line-height: 1.2;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
}
.lager-holder .table tbody td .storage-reserve {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0.25em 0.375em;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-decoration: none;
  color: inherit;
  background: var(--theme-color-10);
  border-radius: var(--b-radius-sm);
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
  line-height: 1;
}
.lager-holder .table tbody td .storage-reserve:hover {
  background: var(--theme-color-20);
}
.lager-holder .table tbody td .store {
  font-size: 0.875em;
  font-weight: bold;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: 1em 0.25em 1.5em 0.25em 1.5em;
  grid-template-rows: 1em 1.5em 1.5em;
  gap: 0.25em;
  line-height: 1.2;
  justify-items: end;
}
.lager-holder .table tbody td .red,
.lager-holder .table tbody td .green,
.lager-holder .table tbody td .blue {
  color: var(--white-color);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0.25em;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: var(--b-radius-sm);
  line-height: 1;
}
.lager-holder .table tbody td .red {
  background: var(--error-color);
}
.lager-holder .table tbody td .green {
  background: var(--success-color);
}
.lager-holder .table tbody td .blue {
  background: var(--blue-color);
}
.lager-holder .table.table-striped tbody tr:nth-child(odd) td.code, .lager-holder .table.table-striped tbody tr:nth-child(odd) td.product, .lager-holder .table.table-striped tbody tr:nth-child(odd) td.price, .lager-holder .table.table-striped tbody tr:nth-child(odd) td.storage {
  background: var(--lager-table-odd-bg);
}
.lager-holder .table.table-striped tbody tr:nth-child(even) td.code, .lager-holder .table.table-striped tbody tr:nth-child(even) td.product, .lager-holder .table.table-striped tbody tr:nth-child(even) td.price, .lager-holder .table.table-striped tbody tr:nth-child(even) td.storage {
  background: var(--lager-table-even-bg);
}

.product-popup-details h2 {
  font-size: 1.5em;
  font-weight: normal;
}
.product-popup-details h2 strong {
  font-weight: bold;
}
.product-popup-details div img {
  display: block;
  width: 100%;
}
.product-popup-details .desc {
  font-size: 0.875em;
}

.product-popup-reservations p strong {
  color: var(--primary-color);
}
.product-popup-reservations ul {
  font-size: 0.875em;
}
.product-popup-reservations ul li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 1em;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  color: var(--theme-color-60);
}
.product-popup-reservations ul li span {
  color: var(--theme-color);
}
.product-popup-reservations ul li span strong {
  color: var(--primary-color);
  font-size: 1.25em;
}
.product-popup-reservations ul li:not(:last-child) {
  padding-bottom: 0.375em;
  margin-bottom: 0.375em;
  border-bottom: 1px solid var(--theme-color-10);
}

.paging {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  gap: 0.3em;
}
.paging ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.25em;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  line-height: 1.5;
  font-size: 0.875rem;
}
.paging ul li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.paging ul li a {
  background: var(--datatable-pagination-bg);
  color: var(--datatable-pagination-color);
  border: var(--datatable-pagination-border);
  border-radius: var(--datatable-pagination-radius);
  padding: var(--datatable-pagination-padding) !important;
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
  text-decoration: none;
}
.paging ul li a:hover, .paging ul li a:active {
  background: var(--datatable-pagination-hover-bg) !important;
  color: var(--datatable-pagination-hover-color) !important;
  border: var(--datatable-pagination-hover-border) !important;
}
.paging ul li a.current, .paging ul li a.current:hover, .paging ul li a.current:active {
  background: var(--datatable-pagination-current-bg) !important;
  color: var(--datatable-pagination-current-color) !important;
  border: var(--datatable-pagination-current-border) !important;
}
.paging ul li a.disabled {
  pointer-events: none;
  opacity: 0.3;
}
.paging ul li a.prev, .paging ul li a.next, .paging ul li a.first, .paging ul li a.last {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.75em;
  padding: var(--datatable-pagination-prev-next-padding) !important;
}
.paging ul li a.prev span, .paging ul li a.next span, .paging ul li a.first span, .paging ul li a.last span {
  display: none;
}
.paging ul li a.prev:before, .paging ul li a.first:before, .paging ul li a.next:after, .paging ul li a.last:after {
  font-family: var(--datatable-pagination-prev-next-font);
  display: block;
  -webkit-transform: scale(1.5);
          transform: scale(1.5);
}
.paging ul li a.prev:before {
  content: var(--datatable-pagination-prev-icon);
}
.paging ul li a.next:after {
  content: var(--datatable-pagination-next-icon);
}
.paging ul li a.first:before {
  content: var(--datatable-pagination-first-icon);
}
.paging ul li a.last:after {
  content: var(--datatable-pagination-last-icon);
}
.paging .paging-status {
  line-height: 1;
  font-size: 0.75em;
  color: var(--theme-color-60);
  -ms-grid-column-align: end;
      justify-self: end;
}
.paging .paging-status strong {
  color: var(--theme-color-80);
}

.app-modal {
  position: fixed;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  -webkit-transition: 300ms ease all;
  transition: 300ms ease all;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  z-index: 10;
}
.app-modal.app-show-modal {
  opacity: 1;
  pointer-events: initial;
}
.app-modal .modal-backdrop {
  background: var(--modal-backdrop-bg);
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: var(--modal-backdrop-padding);
}
.app-modal .modal-backdrop .modal-content {
  width: 100%;
  max-width: var(--modal-content-max-width);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="10"] {
  max-width: 10em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="11"] {
  max-width: 11em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="12"] {
  max-width: 12em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="13"] {
  max-width: 13em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="14"] {
  max-width: 14em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="15"] {
  max-width: 15em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="16"] {
  max-width: 16em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="17"] {
  max-width: 17em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="18"] {
  max-width: 18em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="19"] {
  max-width: 19em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="20"] {
  max-width: 20em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="21"] {
  max-width: 21em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="22"] {
  max-width: 22em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="23"] {
  max-width: 23em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="24"] {
  max-width: 24em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="25"] {
  max-width: 25em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="26"] {
  max-width: 26em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="27"] {
  max-width: 27em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="28"] {
  max-width: 28em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="29"] {
  max-width: 29em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="30"] {
  max-width: 30em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="31"] {
  max-width: 31em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="32"] {
  max-width: 32em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="33"] {
  max-width: 33em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="34"] {
  max-width: 34em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="35"] {
  max-width: 35em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="36"] {
  max-width: 36em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="37"] {
  max-width: 37em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="38"] {
  max-width: 38em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="39"] {
  max-width: 39em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="40"] {
  max-width: 40em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="41"] {
  max-width: 41em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="42"] {
  max-width: 42em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="43"] {
  max-width: 43em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="44"] {
  max-width: 44em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="45"] {
  max-width: 45em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="46"] {
  max-width: 46em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="47"] {
  max-width: 47em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="48"] {
  max-width: 48em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="49"] {
  max-width: 49em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="50"] {
  max-width: 50em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="51"] {
  max-width: 51em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="52"] {
  max-width: 52em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="53"] {
  max-width: 53em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="54"] {
  max-width: 54em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="55"] {
  max-width: 55em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="56"] {
  max-width: 56em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="57"] {
  max-width: 57em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="58"] {
  max-width: 58em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="59"] {
  max-width: 59em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="60"] {
  max-width: 60em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="61"] {
  max-width: 61em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="62"] {
  max-width: 62em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="63"] {
  max-width: 63em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="64"] {
  max-width: 64em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="65"] {
  max-width: 65em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="66"] {
  max-width: 66em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="67"] {
  max-width: 67em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="68"] {
  max-width: 68em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="69"] {
  max-width: 69em;
}
.app-modal .modal-backdrop .modal-content[data-modal-width="70"] {
  max-width: 70em;
}
.app-modal .modal-backdrop .modal-content .modal-head {
  background: var(--modal-head-bg);
  color: var(--modal-head-color);
  border-top-left-radius: var(--modal-content-radius);
  border-top-right-radius: var(--modal-content-radius);
  border-bottom: var(--modal-head-border);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 1em;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  padding: var(--modal-head-padding);
}
.app-modal .modal-backdrop .modal-content .modal-head .modal-title {
  font-weight: bold;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.5em;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  line-height: var(--modal-title-title-line-height);
  font-size: 1.25em;
}
.app-modal .modal-backdrop .modal-content .modal-head .modal-title .modal-title-icon {
  line-height: 1;
  background: var(--modal-title-icon-bg);
  color: var(--modal-title-icon-color);
  border-radius: var(--modal-title-icon-radius);
  width: var(--modal-title-icon-width);
  aspect-ratio: var(--modal-title-icon-aspect-ratio);
  font-size: var(--modal-title-icon-size);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.app-modal .modal-backdrop .modal-content .modal-head .modal-title .modal-title-icon i {
  line-height: 1;
}
.app-modal .modal-backdrop .modal-content .modal-head .modal-title .modal-title-icon i:before {
  line-height: inherit;
}
.app-modal .modal-backdrop .modal-content .modal-head .modal-close {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  cursor: pointer;
  line-height: 1;
  opacity: 1;
  -webkit-transition: 200ms ease all;
  transition: 200ms ease all;
}
.app-modal .modal-backdrop .modal-content .modal-head .modal-close span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
}
.app-modal .modal-backdrop .modal-content .modal-head .modal-close span:after {
  font-family: var(--modal-close-icon-family);
  font-size: var(--modal-close-icon-size);
  content: var(--modal-close-icon);
}
.app-modal .modal-backdrop .modal-content .modal-head .modal-close:hover {
  opacity: 0.5;
}
.app-modal .modal-backdrop .modal-content .modal-body {
  background: var(--modal-body-bg);
  color: var(--modal-body-color);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: 1 1 auto;
          flex-direction: 1 1 auto;
  overflow-y: auto;
  padding: var(--modal-body-padding);
}
.app-modal .modal-backdrop .modal-content .modal-body::-webkit-scrollbar {
  width: var(--scrollbar-thick);
  background: var(--scrollbar-bg);
  border-radius: var(--scrollbar-thick);
}
.app-modal .modal-backdrop .modal-content .modal-body::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb-bg);
  border-radius: var(--scrollbar-thick);
  -webkit-transition: 200ms ease background-color;
  transition: 200ms ease background-color;
}
.app-modal .modal-backdrop .modal-content .modal-body::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover-bg);
}
.app-modal .modal-backdrop .modal-content .modal-foot {
  background: var(--modal-foot-bg);
  color: var(--modal-foot-color);
  padding: var(--modal-foot-padding);
  border-bottom-left-radius: var(--modal-content-radius);
  border-bottom-right-radius: var(--modal-content-radius);
  border-top: var(--modal-head-border);
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--modal-foot-gap);
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.app-modal .modal-backdrop .modal-content .modal-foot.foot-align-start {
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}
.app-modal .modal-backdrop .modal-content .modal-foot.foot-align-end {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.app-modal .modal-backdrop .modal-content .modal-foot.foot-align-center {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.app-modal .modal-backdrop .modal-content .modal-foot.foot-align-spaced {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.app-modal .modal-backdrop .modal-content.modal-content-center {
  text-align: center;
}
.app-modal .modal-backdrop .modal-content.modal-content-center .modal-content {
  text-align: inherit;
}
.app-modal[data-modal-style=transparent] .modal-backdrop {
  color: var(--modal-transparent-color);
}
.app-modal[data-modal-style=transparent] .modal-backdrop .modal-content {
  background: transparent;
}
.app-modal[data-modal-style=transparent] .modal-backdrop .modal-content .modal-head,
.app-modal[data-modal-style=transparent] .modal-backdrop .modal-content .modal-body,
.app-modal[data-modal-style=transparent] .modal-backdrop .modal-content .modal-foot {
  background: transparent;
  color: inherit;
  border: 0;
}
.app-modal[data-modal-style=transparent] .modal-backdrop .modal-content .modal-head .modal-title .modal-title-icon {
  background: var(--modal-transparent-color);
  color: var(--gray-color);
}
.app-modal[data-modal-style=top] .modal-backdrop {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.app-modal[data-modal-style=scrolling] .modal-backdrop {
  overflow-y: auto;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.app-modal[data-modal-style=scrolling] .modal-backdrop::-webkit-scrollbar {
  width: var(--scrollbar-thick);
  background: var(--scrollbar-light-bg);
  border-radius: var(--scrollbar-thick);
}
.app-modal[data-modal-style=scrolling] .modal-backdrop::-webkit-scrollbar-thumb {
  background: var(--scrollbar-light-thumb-bg);
  border-radius: var(--scrollbar-thick);
  -webkit-transition: 200ms ease background-color;
  transition: 200ms ease background-color;
}
.app-modal[data-modal-style=scrolling] .modal-backdrop::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover-bg);
}
.app-modal[data-modal-style=scrolling] .modal-backdrop .modal-content .modal-body {
  overflow-y: unset;
}
.app-modal[data-modal-style=fullscreen-scrollable] .modal-backdrop .modal-content {
  max-height: 100%;
}
.app-modal[data-modal-style=fullscreen] .modal-backdrop .modal-content {
  max-width: unset;
  max-height: 100%;
}

.preloader {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.preloader > div {
  position: relative;
  width: var(--datatable-loader-width);
  height: var(--datatable-loader-width);
  margin: auto;
}
.preloader > div > div {
  position: absolute;
  width: var(--datatable-loader-width);
  height: var(--datatable-loader-width);
  opacity: 0;
  -webkit-transform: rotate(225deg);
          transform: rotate(225deg);
  -webkit-animation: orbit 5.5s infinite;
          animation: orbit 5.5s infinite;
  inset: 0;
  background: transparent;
  border-radius: 0;
}
.preloader > div > div:after {
  left: 50%;
  content: "";
  position: absolute;
  width: var(--datatable-loader-dot-size);
  height: var(--datatable-loader-dot-size);
  border-radius: 50%;
  background: var(--primary-color);
}
.preloader > div > div:nth-child(1) {
  -webkit-animation-delay: 200ms;
          animation-delay: 200ms;
}
.preloader > div > div:nth-child(2) {
  -webkit-animation-delay: 500ms;
          animation-delay: 500ms;
}
.preloader > div > div:nth-child(3) {
  -webkit-animation-delay: 800ms;
          animation-delay: 800ms;
}
.preloader > div > div:nth-child(4) {
  -webkit-animation-delay: 1100ms;
          animation-delay: 1100ms;
}
.preloader.login-preloader {
  position: fixed;
  inset: 0;
  z-index: 10;
  pointer-events: none;
  -webkit-transition: 300ms ease all;
  transition: 300ms ease all;
  opacity: 0;
  background: var(--white-color-70);
}
.preloader.login-preloader.show-preloader {
  opacity: 1;
  pointer-events: initial;
}

@-webkit-keyframes orbit {
  0% {
    -webkit-transform: rotate(225deg);
            transform: rotate(225deg);
    opacity: 1;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  7% {
    -webkit-transform: rotate(345deg);
            transform: rotate(345deg);
    -webkit-animation-timing-function: linear;
            animation-timing-function: linear;
  }
  30% {
    -webkit-transform: rotate(455deg);
            transform: rotate(455deg);
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }
  39% {
    -webkit-transform: rotate(690deg);
            transform: rotate(690deg);
    -webkit-animation-timing-function: linear;
            animation-timing-function: linear;
  }
  70% {
    -webkit-transform: rotate(815deg);
            transform: rotate(815deg);
    opacity: 1;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  75% {
    -webkit-transform: rotate(945deg);
            transform: rotate(945deg);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  76% {
    -webkit-transform: rotate(945deg);
            transform: rotate(945deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(945deg);
            transform: rotate(945deg);
    opacity: 0;
  }
}

@keyframes orbit {
  0% {
    -webkit-transform: rotate(225deg);
            transform: rotate(225deg);
    opacity: 1;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  7% {
    -webkit-transform: rotate(345deg);
            transform: rotate(345deg);
    -webkit-animation-timing-function: linear;
            animation-timing-function: linear;
  }
  30% {
    -webkit-transform: rotate(455deg);
            transform: rotate(455deg);
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }
  39% {
    -webkit-transform: rotate(690deg);
            transform: rotate(690deg);
    -webkit-animation-timing-function: linear;
            animation-timing-function: linear;
  }
  70% {
    -webkit-transform: rotate(815deg);
            transform: rotate(815deg);
    opacity: 1;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  75% {
    -webkit-transform: rotate(945deg);
            transform: rotate(945deg);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  76% {
    -webkit-transform: rotate(945deg);
            transform: rotate(945deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(945deg);
            transform: rotate(945deg);
    opacity: 0;
  }
}