:root {
  --primary-color: #472652;
  --primary-color-dark: #2E1336;
  --secondary-color: #2BD687;
  --secondary-color-dark: #2BBE7A;
  --danger-color: #FF003B;
  --danger-color-dark: #990024;
  --warning-color: #FF9223;
  --warning-color-dark: #995815;
  --invert-color: #E1E6EC;
  --invert-color-dark: #C8C8C8;
  --hover-color: #2BD6871A;
  --background-color: #EFEEED;
  --white-base: #FFFFFF;
  --grey-base: #989898;
}

@font-face {
  font-family: "source_sans_prolight";
  font-style: normal;
  font-weight: normal;
  font-display: auto;
  src: url("fonts/sourcesanspro-light-webfont.woff2") format("woff2");
}

@font-face {
  font-family: "source_sans_proregular";
  font-style: normal;
  font-weight: normal;
  font-display: auto;
  src: url("fonts/sourcesanspro-regular-webfont.woff2") format("woff2");
}

@font-face {
  font-family: "source_sans_prosemibold";
  font-style: normal;
  font-weight: normal;
  font-display: auto;
  src: url("fonts/sourcesanspro-semibold-webfont.woff2") format("woff2");
}

@font-face {
  font-family: "source_sans_probold";
  font-style: normal;
  font-weight: normal;
  font-display: auto;
  src: url("fonts/sourcesanspro-bold-webfont.woff2") format("woff2");
}

@font-face {
  font-family: "HelveticaNeue";
  src: url("fonts/HelveticaNeue.woff") format("woff");
}

@font-face {
  font-family: "halisa-condensed-bold";
  font-weight: normal;
  font-style: normal;
  font-display: auto;
  src: url("fonts/Halisa-CondensedBold.otf") format("opentype");
}

body, input, select, textarea {
    font-family: "source_sans_proregular", "sans-serif" !important;
}

.sttor {
    background: var(--background-color);
}

/* -- Page Content Begin ---------------------------------- */
.sttor section > div.main-content {
    background: var(--background-color);
    margin-left: 240px;
    min-height: 750px;
}

.sttor .page-content .breadcrumb li a {
    color: var(--primary-color);
}

.sttor div.page-content.layout--bo.page-thin {
    background: var(--background-color);
    margin-top: 0;
    height: 100%;
    padding: 0;
}

.sttor div.page-content.layout--bo.page-thin .panel {
    display: flex;
    flex-flow: column;
    background: transparent;
    border-radius: 0;
    border: none;
    margin-bottom: 0;
    min-height: 100%;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.sttor div.page-content.layout--bo.page-thin .panel .panel-body {
    flex: 1;
    background: #fff;
    height: 100%;
    width: 100%;
}

.sttor div.page-content.layout--bo.page-thin .panel .panel-header.panel-header-sttor {
    display: flex;
    flex-flow: row;
    align-items: center;
    background-color: transparent;
    padding: 10px 15px 6px 10px;
    height: 65px;
}

.sttor div.page-content.layout--bo.page-thin .panel .panel-header.panel-header-sttor > h3 {
    flex: 1;
    margin: 0;
    margin-left: 15px;
}

.sttor div.page-content.layout--bo.page-thin .panel .panel-header.panel-header-sttor > h3 > span {
    font-family: "halisa-condensed-bold";
    color: var(--primary-color);
    font-size: 40px;
}

.sttor div.page-content.layout--bo.page-thin .panel .panel-header.panel-header-sttor > .btn {
    align-self: flex-end;
    height: 25px;
    margin: 0;
    margin-bottom: 5px;
}

                
.sttor div.page-content.layout--bo.page-thin .panel .panel-header.bg-primary {
    background-color: var(--primary-color) !important;
    color: var(--white-base) !important;
    font-family: "source_sans_prosemibold";
    font-size: 16px;
}

.sttor div.page-content.layout--bo.page-thin .panel .panel-header > .panel-title {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-content: center;
    width: 100%;
    height: 100%;
    font-family: "source_sans_prosemibold";
}

.sttor div.page-content.layout--bo.page-thin .panel .panel-header > .panel-title > span:first-child {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.sttor div.page-content.layout--bo.page-thin .panel .panel-header > .panel-title > span:first-child > a[role="button"] {
    margin-left: 10px;
}

.sttor div.page-content.layout--bo.page-thin .panel .panel-header > .panel-title > span:first-child > a[role="button"]:first-child {
    margin-left: 15px;
}
/* -- Page Content End ---------------------------------- */

/* -- Layer-Box Begin ---------------------------------- */
.sttor .layer-box > .panel > .layer-content > div > .layer-content-box {
    margin-bottom: 20px;
}
/* -- Layer-Box End ---------------------------------- */

/* -- Form-Control Begin ---------------------------------- */
.sttor .form-control {
    font-size: 14px !important;
}

.sttor .form-control + input {
    padding: 8px 12px 7px;
}

.sttor input.form-control {
    padding: 8px 12px 7px;
}
/* -- Form-Control End ---------------------------------- */

/* -- Item Begin ---------------------------------- */
.sttor .sttor-item-price-level {
    height: 140px;
    overflow-y: auto;
}

.sttor .item-cost__control-btn .item-cost-edit__button {
    color: var(--secondary-color);
}

.sttor .item-cost__control-btn .item-cost-delete__button {
    color: var(--danger-color);
}
/* -- Item End ---------------------------------- */

/* -- Span Begin ----------------------- */
.sttor .span-danger {
    color: var(--danger-color);
}

.sttor .span-warning {
    color: var(--warning-color);
}

.sttor .span-danger,
.sttor .span-warning {
    font-size: 0.7em;
    font-style: italic;
}
.sttor .span-danger > i.fa-asterisk,
.sttor .span-warning > i.fa-asterisk {
    vertical-align: text-top;
    font-size: 6px;
}


.sttor .control-label .span-danger > i.fa-asterisk,
.sttor .control-label .span-warning > i.fa-asterisk {
    vertical-align: top;
}

.sttor .has-error .help-block {
    color: var(--danger-color) !important;
}
/* -- Span Begin ----------------------- */
    
/* -- UI-Select Begin ----------------------- */
.sttor .has-error .ui-select-container,
.sttor .has-error .form-control {
    border-color: var(--danger-color) !important;
    color: #555 !important;
}

.sttor .has-error .ui-select-container .ui-select-dropdown,
.sttor .has-error .form-control .ui-select-dropdown {
    color: #000 !important;
}
/* -- UI-Select ----------------------- */

/* -- Button Begin ----------------------- */
.sttor .btn {
    transition: unset;
}

.sttor .btn-small-square {
    max-height: 30px;
    padding: 6px 7px;
    width: 30px;
}

.sttor .btn-small-square > i,
.sttor .btn-small-square i.fa {
    font-size: 13px;
}

    
.sttor .btn i:has(+ span) {
    margin-right: 5px;
}

.sttor .btn-primary,
.sttor .btn-primary:active {
    background-color: var(--primary-color);
    border-color: var(--invert-color);
    color: var(--white-base);
}

.sttor .btn-primary > i,
.sttor .btn-primary:active > i,
.sttor .btn-primary > span > i,
.sttor .btn-primary:active > span > i,
.sttor .btn-primary > i.fa,
.sttor .btn-primary:active > i.fa,
.sttor .btn-primary > span > i.fa,
.sttor .btn-primary:active > span > i.fa  {
    color: var(--secondary-color) !important;
}

.sttor .btn-primary:hover {
    background-color: var(--primary-color-dark);
    border-color: var(--invert-color);
    color: var(--white-base);
}

.sttor .btn-success,
.sttor .btn-success:active {
    background-color: var(--secondary-color);
    border-color: var(--invert-color-dark);
    color: var(--white-base);
}

.sttor .btn-success > i,
.sttor .btn-success:active > i,
.sttor .btn-success > span > i,
.sttor .btn-success:active > span > i,
.sttor .btn-success > i.fa,
.sttor .btn-success:active > i.fa,
.sttor .btn-success > span > i.fa,
.sttor .btn-success:active > span > i.fa  {
    color: var(--white-base) !important;
}

.sttor .btn-success:hover {
    background-color: var(--secondary-color-dark);
    border-color: var(--invert-color-dark);
    color: var(--white-base);
}

.sttor .btn-danger,
.sttor .btn-danger:active {
    background-color: var(--danger-color);
    border-color: var(--invert-color);
    color: var(--white-base);
}

.sttor .btn-danger > i,
.sttor .btn-danger:active > i,
.sttor .btn-danger > span > i,
.sttor .btn-danger:active > span > i,
.sttor .btn-danger > i.fa,
.sttor .btn-danger:active > i.fa,
.sttor .btn-danger > span > i.fa,
.sttor .btn-danger:active > span > i.fa  {
    color: var(--white-base) !important;
}

.sttor .btn-danger:hover {
    background-color: #990023;
    border-color: var(--invert-color);
    color: var(--white-base);
}

.sttor .btn-invert,
.sttor .btn-invert:active {
    background-color: var(--invert-color);
    border-color: var(--invert-color-dark);
    color: #2C2F34;
}

.sttor .btn-invert > i,
.sttor .btn-invert:active > i,
.sttor .btn-invert > span > i,
.sttor .btn-invert:active > span > i,
.sttor .btn-invert > i.fa,
.sttor .btn-invert:active > i.fa,
.sttor .btn-invert > span > i.fa,
.sttor .btn-invert:active > span > i.fa  {
    color: #2C2F34 !important;
}

.sttor .btn-invert:hover {
    background-color: #E3E2E2;
    border-color: var(--invert-color-dark);
    color: #2C2F34;
}

.sttor .btn.input-group-addon {
    border-color: #ABACAE;
}

.sttor .btn-primary, .sttor .btn-primary:active, .sttor .btn-primary:hover,
.sttor .btn-success, .sttor .btn-success:active, .sttor .btn-success:hover,
.sttor .btn-danger, .sttor .btn-danger:active, .sttor .btn-danger:hover,
.sttor .btn-invert, .sttor .btn-invert:active, .sttor .btn-invert:hover {
    background-image: none;
    background-repeat: unset;
    filter: none;
}

.sttor .btn-primary:disabled, .sttor .btn-primary[disabled],
.sttor .btn-success:disabled, .sttor .btn-success[disabled],
.sttor .btn-danger:disabled, .sttor .btn-danger[disabled],
.sttor .btn-invert:disabled, .sttor .btn-invert[disabled] {
    opacity: 0.4;
}

.sttor .btn.btn-link.btn-success > i.fa,
.sttor .btn.btn-link.btn-success:active > i.fa {
    color: var(--secondary-color) !important;
}

.sttor .btn.btn-linkbtn-success:hover > i.fa {
    color: var(--secondary-color-dark) !important;
}

.sttor .btn.btn-link.btn-danger > i.fa,
.sttor .btn.btn-link.btn-danger:active > i.fa {
    color: var(--danger-color) !important;
}

.sttor .btn.btn-link.btn-danger:hover > i.fa {
    color: var(--danger-color-dark) !important;
}

.sttor a[role="button"] {
    cursor: pointer;
    border: none;
    background-color: transparent;
}

.sttor a[role="button"].invert {
    color: var(--white-base);
}

.sttor a[role="button"].success {
    color: var(--secondary-color);
}

.sttor a[role="button"].icon-button {
    font-size: 16px;
}
/* -- Button End ----------------------- */

/* -- Select Begin ----------------------- */
.sttor .select2 .select2-drop .select2-results .ui-select-choices-row:hover {
    background-color: var(--hover-color);
    background: var(--hover-color);
}
.sttor .select2 .select2-drop .select2-results .select2-highlighted,
.sttor .select2 .select2-drop .select2-results .select2-highlighted:hover {
    background-color: var(--primary-color);
    background: var(--primary-color);
    color: var(--white-base);
}
.sttor .select2 .select2-drop .select2-results .select2-disabled {
    opacity: 0.3;
}

.sttor .select2 .select2-drop .select2-results .select2-disabled .select2-result-label {
    background-color: inherit;
    background: inherit;
}
.sttor .select2.select2-container-multi .select2-choices li.select2-search-choice {
    background: var(--primary-color) !important;
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color-dark) !important;
    color: var(--white-base);
}

.sttor .select2.select2-container-multi .select2-choices li.select2-search-choice:hover {
    background: var(--primary-color-dark) !important;
    background-color: var(--primary-color-dark) !important;
    border-color: var(--primary-color) !important;
    color: var(--white-base);
}

.sttor .ui-select-container.ui-select-bootstrap.dropdown .ui-select-choices.ui-select-choices-content.ui-select-dropdown .ui-select-choices-row:not(.active):hover>span {
    background-color: var(--hover-color);
    background: var(--hover-color);
}

.sttor .ui-select-container.ui-select-bootstrap.dropdown .ui-select-choices.ui-select-choices-content.ui-select-dropdown .ui-select-choices-row.active>span {
    background-color: var(--primary-color);
    background: var(--primary-color);
}


/* -- Select End -------------------------- */
/* -- Dropdown Begin ---------------------- */
.sttor .dropdown > .btn-group i.fa {
    margin-right: 5px;
}
.sttor .btn-group > .dropdown-menu > li > a:hover,
.sttor .dropdown > .btn-group > .dropdown-menu > li:hover {
    background-color: var(--hover-color) !important;
    background: var(--hover-color) !important;
}
/* -- Dropdown End -------------------------- */


/* -- Grid-Box Begin ---------------------- */
.sttor .grid-box {
    border: 1px solid var(--primary-color-dark);
}

.sttor .grid-box-title {
    background-color: var(--primary-color-dark);
}

.sttor .grid-box-title input.form-control {
    font-weight: 100;
}

.sttor .grid-box-title .dropdown-toggle.btn-sm {
    min-width: unset;
}

.sttor .grid-box-title .btn.btn-dark.btn-xs.btn-square {
    background-color: var(--primary-color-dark);
}
/* -- Grid-Box End -------------------------- */


/* -- Calender Begin ---------------------- */
.sttor .dropdown-menu-list .rg-range-picker .rg-range-picker-box .rg-range-picker-calendars .clean-calendar > table thead tr:first-child {
    background-color: var(--primary-color);
    background: var(--primary-color);
}

.sttor .dropdown-menu-list .rg-range-picker .rg-range-picker-box .rg-range-picker-calendars .clean-calendar > table .btn-success {
    background-color: var(--secondary-color);
}

.sttor .dropdown-menu-list .rg-range-picker .rg-range-picker-box .rg-range-picker-calendars .clean-calendar > table span.text-info {
    color: var(--primary-color);
}
/* -- Calender En ------------------------ */

/* -- UI-Grid Begin ---------------------- */
.sttor .ui-grid .ui-grid-icon-plus-squared,
.sttor .ui-grid .ui-grid-icon-minus-squared,
.sttor .ui-grid .ui-grid-icon-ok {
    color: var(--primary-color);
}

.sttor .ui-grid .ui-grid-render-container.ui-grid-render-container-body .ui-grid-row.ui-grid-row-selected>[ui-grid-row]>.ui-grid-cell {
    background: var(--hover-color) !important;
    background-color: var(--hover-color) !important;
}
/* -- UI-Grid End -------------------------- */

    
/* -- Toggle Begin ---------------------- */
.sttor .cswitch :checked + i,
.sttor .cswitch.danger :checked + i,
.sttor .cswitch.warning :checked + i,
.sttor .cswitch.primary :checked + i {
    border-color: var(--invert-color-dark);
    background: var(--white-base);
}

.sttor .cswitch :not(:checked) + i,
.sttor .cswitch.danger :not(:checked) + i,
.sttor .cswitch.warning :not(:checked) + i,
.sttor .cswitch.primary :not(:checked) + i {
    border-color: var(--invert-color-dark);
    background: var(--white-base);
}

.sttor .cswitch :not(:checked) + i::before {
    border-color: var(--primary-color-dark);
    background: var(--primary-color);
}
.sttor .cswitch :checked + i::before {
    padding-right: 0;
    padding-left: 25px;
    border-color: var(--secondary-color-dark);
    background: var(--secondary-color);
}
.sttor .cswitch.danger :checked + i::before {
    border-color: var(--danger-color-dark);
    background: var(--danger-color);
}
.sttor .cswitch.warning :checked + i::before {
    border-color: var(--warning-color-dark);
    background: var(--warning-color);
}
.sttor .cswitchprimary :checked + i::before {
    border-color: var(--primary-color-dark);
    background: var(--primary-color);
}

.sttor .cswitch-d :checked + i,
.sttor .cswitch-d.danger :checked + i,
.sttor .cswitch-d.warning :checked + i,
.sttor .cswitch-d.primary :checked + i {
    border-color: var(--invert-color-dark) !important;
    background: var(--white-base) !important;
    opacity: 0.4;
    cursor: default;
}

.sttor .cswitch-d :not(:checked) + i,
.sttor .cswitch-d.danger :not(:checked) + i,
.sttor .cswitch-d.warning :not(:checked) + i,
.sttor .cswitch-d.primary :not(:checked) + i {
    border-color: var(--invert-color-dark) !important;
    background: var(--white-base) !important;
    opacity: 0.4;
    cursor: default;
}
/* -- Toggle En ------------------------ */

/* iCheck plugin Square Begin ----------------------------------- */
.sttor .icheckbox_square-primary,
.sttor .iradio_square-primary {
    display: inline-block;
    vertical-align: middle;
    width: 22px;
    height: 22px;
    background: url(icheck-primary.png) no-repeat;
    border: none;
    cursor: pointer;
}

.sttor .icheckbox_square-primary {
    border: 1px solid #ABACAE;
}

.sttor #import-header .icheckbox_square-primary {
    top: 0 !important;
}

.sttor .icheckbox_square-primary {
    background-position: 0 0;
}
.sttor .icheckbox_square-primary.hover {
    background-position: -24px 0;
}
.sttor .icheckbox_square-primary.checked {
    background-position: -48px 0;
}
.sttor .icheckbox_square-primary.disabled {
    background-position: -72px 0;
    cursor: default;
}
.sttor .icheckbox_square-primary.checked.disabled {
    background-position: -96px 0;
}

.sttor .iradio_square-primary {
    background-position: -120px 0;
}
.sttor .iradio_square-primary.hover {
    background-position: -144px 0;
}
.sttor .iradio_square-primary.checked {
    background-position: -168px 0;
}
.sttor .iradio_square-primary.disabled {
    background-position: -192px 0;
    cursor: default;
}
.sttor .iradio_square-primary.checked.disabled {
    background-position: -216px 0;
}

.sttor .icheckbox_square-primary.disabled,
.sttor .icheckbox_square-primary.checked.disabled,
.sttor .iradio_square-primary.disabled,
.sttor .iradio_square-primary.checked.disabled {
    background-color: var(--invert-color-dark) !important;
    opacity: 0.3 !important;
}

@media (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25) {
    .sttor .icheckbox_square-primary,
    .sttor .iradio_square-primary {
        background-image: url(icheck-primary@2x.png);
        -webkit-background-size: 240px 24px;
        background-size: 240px 24px;
    }
}
/* iCheck plugin Square End ----------------------------------- */

/* -- Bootstrap Table Begin ---------------------- */
.sttor .table.table-hover>tbody>tr:hover>td {
    background-color: var(--hover-color);
}

.sttor .table.table-hover>tbody>tr:hover>td .form-control {
    border-color: #ABACAE;
}
/* Bootstrap Table End ----------------------------------- */

/* -- AG-Grid Begin ---------------------- */
.sttor .ag-theme-balham {
    font-family: source_sans_proregular, sans-serif;
    font-size: 13px;
}

.sttor .ag-theme-balham .ag-row.ag-row-hover,
.sttor .ag-theme-fresh .ag-row.ag-row-hover {
    background-color: var(--hover-color);
}

.sttor .ag-theme-balham .ag-row.ag-row-selected,
.sttor .ag-theme-fresh .ag-row.ag-row-selected {
    background-color: var(--hover-color);
    border-bottom-color: #D9DDE0;
}
/* -- AG-Grid En ------------------------ */

/* -- Input Begin ---------------------- */
.sttor .input-group > span.bgcol-white {
    color: var(--primary-color);
}
/* -- Input En ------------------------ */
    
/* --Modal Begin ---------------------- */
.sttor .modal > .modal-dialog.modal-lg,
.sttor .modal > .modal-dialog.modal-md  {
    margin-top: 5%;
}

.sttor .modal > .modal-dialog .modal-content .modal-header > button.close {
    color: var(--primary-color);
    opacity: 1;
}

.sttor .modal > .modal-dialog .modal-content .modal-header h4,
.sttor .modal > .modal-dialog .modal-content .modal-header .modal-title {
    font-family: 'source_sans_proregular';
    color: var(--primary-color);
    font-size: 16px;
}
/* -- Modal En ------------------------ */
    
/* -- Flash Begin ---------------------- */
.sttor .flash-dock {
    bottom: -20px;
    right: 0;
}

.sttor .flash-dock div.alert.alert-success {
    background-color: var(--secondary-color) !important;
    border-color: var(--secondary-color-dark) !important;
    color: var(--white-base) !important;
}
.sttor .flash-dock div.alert.alert-warning {
    background-color: var(--warning-color) !important;
    border-color: var(--warning-color-dark) !important;
    color: var(--white-base) !important;
}
.sttor .flash-dock div.alert.alert-danger {
    background-color: var(--danger-color) !important;
    border-color: var(--danger-color-dark) !important;
    color: var(--white-base) !important;
}

.sttor .flash-dock div.alert.alert-dismissable .close, &.alert-dismissible .close {
    color: var(--white-base);
    text-shadow: none;
    opacity: 1;
}
/* -- Flash En ------------------------ */