/*
 * Copyright (C) 2009 - 2019 Dynamia Soluciones IT S.A.S - NIT 900302344-1
 * Colombia - South America
 * All Rights Reserved.
 *
 * DynamiaTools is free software: you can redistribute it and/or modify it
 * under the terms of the GNU Lesser General Public License (LGPL v3) as
 * published by the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 *
 * DynamiaTools is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU Lesser General Public License for more details.
 *
 * You should have received a copy of the GNU Lesser General Public License
 * along with DynamiaTools.  If not, see <https://www.gnu.org/licenses/>.
 */

.form-zcontrol {
    display: block;
    line-height: 1.5;
    width: 100%;
    box-sizing: border-box;
}

.form-zcontrol .z-combobox-readonly, .entitypickerbox .z-combobox-readonly {
    background-color: var(--dt-white);
}

.form-zcontrol input, input.form-zcontrol {
    padding: var(--dt-padding-2) var(--dt-padding-3);
    height: 34px;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    -webkit-border-radius: 0px !important;
    -moz-border-radius: 0px !important;
    border-radius: 0px !important;
    box-shadow: none;
}

.entitypickerbox, .decimalbox-calc {
    display: flex;
    line-height: 1.42857143;
    flex: 1;
}


.entitypickerbox input, .decimalbox-calc input {
    flex: 1 !important;
    padding: 6px 12px;
    height: 34px;
    font-size: 14px;
    -webkit-border-radius: 0px !important;
    -moz-border-radius: 0px !important;
    border-radius: 0px !important;
    box-shadow: none;
}

.zcontrol input {
    padding: 6px 12px;
    height: 34px;
    font-size: 14px;
    -webkit-border-radius: 0px !important;
    -moz-border-radius: 0px !important;
    border-radius: 0px !important;
    box-shadow: none;
}

.form-zcontrol input:focus, .entitypickerbox input:focus, .decimalbox-calc input:focus {
    border-color: var(--dt-primary-light) !important;
    box-shadow: none;
}

.form-zcontrol a, .entitypickerbox a, .decimalbox-calc a {
    height: 34px;
    line-height: 30px;
}

.entitypickerbox .z-bandbox {
    display: inline-flex;
    flex: 1;
}

.entitypickerbox .z-combobox-button {
    border-radius: 0;
}

.entitypickerbox .entitypickerbox-button, .decimalbox-calc .decimalbox-calc-button {
    color: var(--dt-white);
    background: var(--dt-primary);
    border-color: var(--dt-primary);
    border-bottom-right-radius: 6px;
    border-top-right-radius: 6px;
    width: 30px;
    right: 0;
    text-align: center;
    font-size: 18px;
    line-height: 2;
}

.entitypickerbox .z-bandbox-button {
    right: 0;
    border-radius: 0;
    border-left: 0;
}

.entitypickerbox .z-bandbox-icon::before {
    content: '\f0d7'
}

.entitypickerbox-popup {
    padding: 0;
}

.form-zcontrol .z-bandbox-popup {
    width: auto !important;
}

.form-zcontrol .z-timebox-button, .form-zcontrol .z-spinner-button, .form-zcontrol .z-doublespinner-button {
    height: 34px !important;
}

.form-zcontrol .z-timebox-button a, .form-zcontrol .z-spinner-button a, .form-zcontrol .z-doublespinner-button a {
    line-height: 15px;
}

.form-zcontrol.z-label {
    display: block;
    border: 1px solid #eeeeee;
    min-height: 36px;
    line-height: 36px;
    padding-left: 6px;
    padding-right: 6px;

}

.form-zcontrol .z-spinner-icon .z-spinner-down,
.form-zcontrol .z-spinner-icon .z-spinner-up {
    height: 16px !important;
    line-height: normal !important;
}

.form-group .conv-zero.z-label,
.form-group .conv-positive.z-label,
.form-group .conv-negative.z-label {
    font-weight: bold;
    color: gray;
    border: 1px solid silver;
    text-align: right;
    display: block;
    height: 36px;
    line-height: 36px;
    padding-left: 6px;
    padding-right: 6px;
}

.form-group .conv-positive {
    color: var(--dt-primary) !important;
}

.form-group .conv-negative {
    color: var(--dt-danger) !important;
}

.z-checkbox-content {
    font-family: inherit !important;
    font-weight: inherit !important;
    font-size: inherit !important;
    padding-left: 3px;
}

.form-group .z-radiogroup {
    display: block;
}

.spacer, .spacer-top {
    margin-top: 40px;
}

.spacer-bottom {
    margin-bottom: 40px;
}

.pd0 {
    padding: 0 !important;
}

.pd5 {
    padding: 5px !important;
}

.pd10 {
    padding: 10px !important;
}

.pd20 {
    padding: 20px !important;
}

.mg0 {
    margin: 0 !important;
}

.mg5 {
    margin: 5px !important;
}

.mg10 {
    margin: 10px !important;
}

.mg20 {
    margin: 20px !important;
}

.width100 .crudview-body,
.width100 .crudview-header,
.width100 .actiontb-container,
.width100 .z-north,
.width100 .z-north-body,
.width100 .z-center,
.width100 .z-center-body,
.width100 .z-south,
.width100 .z-south-body,
.width100 .z-listbox-header,
.width100 .z-listbox-body,
.width100 .z-listbox-footer {
    width: 100% !important;
}

.noselect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.panel {
    -moz-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);
    border-radius: 0px;
    border: none;
    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);
    margin-bottom: 20px;
}

.panel .panel-body {
    padding: 20px;
}

.panel .panel-body p {
    margin: 0px;
}

.panel .panel-body p + p {
    margin-top: 15px;
}

.panel-heading {
    border-radius: 0;
    border: none !important;
    padding: 6px 10px;
}

.panel-default > .panel-heading {
    background-color: var(--dt-background);
    border-bottom: none;
    color: var(--dt-text-secondary);
}

.panel-title {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 0;
    margin-top: 0;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.panel-sub-title {
    margin-bottom: 3px;
    color: var(--dt-text-secondary);
    margin-top: -3px;
}

.panel-footer {
    background: var(--dt-background);
    border-top: 0;
}

.panel-default .panel-sub-title {
    color: inherit;
}

.panel-color .panel-title {
    color: var(--dt-white);
}

.panel-primary > .panel-heading {
    background-color: var(--dt-primary);
}

.panel-success > .panel-heading {
    background-color: var(--dt-success);
}

.panel-info > .panel-heading {
    background-color: var(--dt-info);
}

.panel-warning > .panel-heading {
    background-color: var(--dt-warning);
}

.panel-danger > .panel-heading {
    background-color: var(--dt-danger);
}

.panel-purple > .panel-heading {
    background-color: #7266ba;
}

.panel-pink > .panel-heading {
    background-color: #f76397;
}

.panel-inverse > .panel-heading {
    background-color: var(--dt-neutral-dark);
}

.panel-border {
    border-radius: 3px;
}

.panel-border .panel-heading {
    background-color: var(--dt-white);
    border-top: 3px solid #ccc !important;
    border-radius: 3px;
    padding: 10px 20px 0px;
}

.panel-border .panel-body {
    padding: 15px 20px 20px 20px;
}

.panel-border.panel-primary .panel-heading {
    border-color: var(--dt-primary) !important;
    color: var(--dt-primary) !important;
}

.panel-border.panel-success .panel-heading {
    border-color: var(--dt-success) !important;
    color: var(--dt-success) !important;
}

.panel-border.panel-info .panel-heading {
    border-color: var(--dt-info) !important;
    color: var(--dt-info) !important;
}

.panel-border.panel-warning .panel-heading {
    border-color: var(--dt-warning) !important;
    color: var(--dt-warning) !important;
}

.panel-border.panel-danger .panel-heading {
    border-color: var(--dt-danger) !important;
    color: var(--dt-danger) !important;
}

.panel-border.panel-purple .panel-heading {
    border-color: #7266ba !important;
    color: #7266ba !important;
}

.panel-border.panel-pink .panel-heading {
    border-color: #f76397 !important;
    color: #f76397 !important;
}

.panel-border.panel-inverse .panel-heading {
    border-color: var(--dt-neutral-dark) !important;
    color: var(--dt-neutral-dark) !important;
}

.btn-group-sm > .btn, .btn-sm {
    padding: 5px 10px !important;
    font-size: 12px;
}


@media (max-width: 767px) {
    .hidden-xs {
        display: none !important;
    }
}

@media (max-width: 991px) and (min-width: 768px) {
    .hidden-sm {
        display: none !important;
    }
}

.panel-title input {
    height: 31px;
}

.m-b-0 {
    margin-bottom: 0;
}

.m-t-0 {
    margin-top: 0;
}

.noscroll {
    overflow: hidden;
}

.pull-right {
    float: right;
}

.pull-left {
    float: left;
}

.dark-mode, .dark-mode .bg-body-tertiary {
    --bs-body-bg: var(--dt-background-dark);
    --dt-border-color: #3a3f4f;
    --dt-boder-input-color: #6c757d;
    background-color: var(--dt-background-dark) !important;
}


.dark-mode .bg-body, .dark-mode body {
    background: var(--dt-background-dark) !important;
}

.dark-mode .sidebar-brand {
    background: var(--dt-background-dark-hover) !important;
}


.dark-mode .table-view .z-listheader-hover,
.dark-mode .tree-view .z-treecol-hover {
    background: var(--dt-primary-dark) !important;
}

.dark-mode .table-view .z-listheader-content,
.dark-mode .tree-view .z-treecol-content,
.dark-mode .z-listheader-content,
.dark-mode .z-treecol-content {
    color: var(--dt-text-primary-dark) !important;
}

.dark-mode .app-header .fa, .dark-mode .app-header .fas {
    color: var(--dt-text-primary-dark);
}


.dark-mode.login-page, .dark-mode .register-page, .dark-mode .card, .dark-mode .panel,
.dark-mode .z-tabpanel, .dark-mode .pageContent .z-window-content, .dark-mode .z-window,
.dark-mode .z-tabs, .dark-mode .z-toolbar.z-toolbar-tabs, .dark-mode .z-tabbox,
.dark-mode .actiontb {
    background: var(--dt-background-dark) !important;
}

.dark-mode .crudview-header {
    background: var(--dt-background-dark) !important;
}

.dark-mode .z-tab-selected .z-tab-button {
    color: var(--dt-primary);
}

.dark-mode .card {
    border-color: var(--dt-border-color) !important;
}

.dark-mode .z-tabbox {
    border-color: var(--dt-border-color);
}

.dark-mode input, .dark-mode textarea {
    background: var(--dt-background-dark) !important;
    border-color: var(--dt-boder-input-color);
    color: var(--dt-text-primary-dark);
}

.dark-mode input:focus, .dark-mode textarea:focus {
    color: var(--dt-text-primary-dark);
}

.dark-mode .z-textbox-inplace,
.dark-mode .z-decimalbox-inplace,
.dark-mode .z-intbox-inplace,
.dark-mode .z-longbox-inplace,
.dark-mode .z-doublebox-inplace {
    border-color: transparent !important;
}

.dark-mode ::placeholder, .dark-mode ::-webkit-input-placeholder {
    color: var(--dt-text-secondary) !important;
}

.dark-mode .input-group-text {
    color: var(--dt-text-primary-dark);
    background-color: var(--dt-background-dark);
    border-color: var(--dt-background-dark);
}

.dark-mode .z-window {
    border-color: var(--dt-background-dark);
}

.dark-mode .z-label, .dark-mode .form-view-lbl, .dark-mode label {
    color: var(--dt-text-primary-dark);
}

.dark-mode .bg-body-secondary {
    background-color: var(--dt-background-dark) !important;
}

.dark-mode .tabpage.z-tab-selected {
    background-color: var(--dt-background-dark) !important;
    border-color: var(--dt-background-dark) !important;
    box-shadow: none !important;
}

.dark-mode .tabpage.z-tab {
    background-color: var(--dt-background-dark) !important;
}

.dark-mode .tabpage .z-tab-text {
    color: var(--dt-text-primary-dark);
}

.dark-mode .tabpage.z-tab-selected .z-tab-text {
    color: var(--dt-primary);
}

.dark-mode .btn.btn-default, .dark-mode .z-toolbarbutton {
    background-color: var(--dt-background-dark);
    color: var(--dt-text-primary-dark);
}

.dark-mode .btn.btn-default:hover, .dark-mode .z-toolbarbutton:hover {
    background-color: var(--dt-background-dark);
    color: var(--dt-text-primary-dark);
}


.dark-mode .crudview .table-view .z-listheader,
.dark-mode .crudview .table-view .z-listbox-header,
.dark-mode .crudview .tree-view .z-treecol,
.dark-mode .crudview .tree-view .z-tree-header,
.dark-mode .z-listheader,
.dark-mode .z-listbox-header,
.dark-mode .z-listhead-bar,
.dark-mode .z-treecol,
.dark-mode .z-tree-header,
.dark-mode .z-listbox-footer,
.dark-mode .z-listfooter {
    background: var(--dt-background-dark) !important;
    border-left: 1px solid var(--dt-background-dark);
    border-color: var(--dt-background-dark);
}

.dark-mode .crudview .table-view .z-listheader:hover,
.dark-mode .crudview .table-view .z-listbox-header:hover,
.dark-mode .crudview .tree-view .z-treecol:hover,
.dark-mode .crudview .tree-view .z-tree-header:hover {
    background: var(--dt-background-dark) !important;
    border-left: 1px solid var(--dt-background-dark) !important;
}

.dark-mode .z-listbox,
.dark-mode .table-view .z-listbox-body,
.dark-mode .tree-view .z-tree-body,
.dark-mode .z-tree {
    background: var(--dt-background-dark);
    border-color: var(--dt-border-color);
}

.dark-mode .z-listbox .z-listcell, .dark-mode .z-listitem .z-listcell, .dark-mode .z-treerow .z-treecell {
    background: var(--dt-background-dark);
    border-color: var(--dt-border-color);
}


.dark-mode .z-listitem-selected .z-listcell,
.dark-mode .z-treerow-selected .z-treecell {
    background: var(--dt-primary);
}

.dark-mode .z-listcell-content, .dark-mode .z-listgroup-content, .dark-mode .z-listgroupfoot-content, .dark-mode .z-listfooter-content {
    color: var(--dt-text-primary-dark);
}

.dark-mode .z-listitem-selected .z-listcell .z-listcell-content,
.dark-mode .z-listitem-selected .z-listcell .z-listcell-content .z-label,
.dark-mode .z-treerow-selected .z-treecell .z-treecell-content,
.dark-mode .z-treerow-selected .z-treecell .z-treecell-content .z-label {
    color: var(--dt-text-primary-dark) !important;
}


.dark-mode .multi-view .multi-view-tab, .dark-mode .z-tab {
    background: var(--dt-background-dark);
    border-color: var(--dt-background-dark) !important;;
}

.dark-mode .multi-view .multi-view-tab .z-tab-text, .dark-mode .z-tab-text {
    color: var(--dt-text-primary-dark);
}

.dark-mode .multi-view .multi-view-tab.z-tab-selected {
    background: var(--dt-background-dark) !important;
    border-color: var(--dt-background-dark) !important;
}

.dark-mode .multi-view .multi-view-tab.z-tab-selected .z-tab-text,
.dark-mode .z-tab-selected .z-tab-text {
    color: var(--dt-primary);
}

.dark-mode .z-menupopup,
.dark-mode .z-combobox-popup, .dark-mode .z-bandbox-popup, .dark-mode .z-datebox-popup, .dark-mode .z-timebox-popup {
    background: var(--dt-background-dark);
    border-color: var(--dt-background-dark);
}

.dark-mode .z-menupopup .z-menu-content, .dark-mode .z-menupopup .z-menuitem-content {
    background: var(--dt-background-dark);
    border-color: var(--dt-background-dark);;
    color: var(--dt-text-primary-dark);
}

.dark-mode .z-menuitem-content {
    color: var(--dt-text-primary-dark);
}

.dark-mode .z-menuitem-content:hover, .dark-mode .z-caption-content, .dark-mode .z-tree-icon {
    color: var(--dt-text-primary-dark);
}

.dark-mode .z-menupopup .z-menuseparator {
    color: var(--dt-background-dark);
}

.dark-mode .z-window-content {
    background: var(--dt-background-dark);
}


.dark-mode .z-east-splitter, .dark-mode .z-west-splitter, .dark-mode .z-north-splitter, .dark-mode .z-south-splitter {
    background: var(--dt-background-dark);
}

.dark-mode .z-north, .dark-mode .z-south, .dark-mode .z-west, .dark-mode .z-center, .dark-mode .z-east {
    border-color: var(--dt-background-dark);
    background: var(--dt-background-dark);
}

.dark-mode .z-tree-icon i {
    color: var(--dt-background-dark) !important;
}

.dark-mode .z-treecell-content i {
    color: var(--dt-text-primary-dark);
}

.dark-mode .z-north-header, .dark-mode .z-south-header,
.dark-mode .z-west-header, .dark-mode .z-center-header, .dark-mode .z-east-header {
    background: var(--dt-background-dark);
    color: var(--dt-text-primary-dark);
}

.dark-mode .z-east-title, .dark-mode .z-west-title, .dark-mode .z-north-title, .dark-mode .z-south-title,
.dark-mode .z-window-header, .dark-mode .z-window-icon {
    color: var(--dt-text-primary-dark);
}

.dark-mode .z-north-collapsed,
.dark-mode .z-south-collapsed,
.dark-mode .z-west-collapsed,
.dark-mode .z-center-collapsed,
.dark-mode .z-east-collapsed {
    background: var(--dt-primary);
}

.dark-mode .user-menu, .dark-mode .user-menu a.nav-link,
.dark-mode .user-menu p, .dark-mode .user-menu small {
    color: var(--dt-text-primary-dark);
}


.dark-mode .user-menu .user-header {
    background-color: var(--dt-background-dark) !important;
}

.dark-mode .user-menu .user-footer {
    background-color: var(--dt-background-dark) !important;
}

.dark-mode .navbar-nav .nav-link.active, .dark-mode .navbar-nav .nav-link.show {
    color: var(--dt-text-primary-dark);;
}

.dark-mode .modal-dialog {
    --bs-modal-bg: var(--dt-background-dark);
    --bs-modal-color: var(--dt-text-primary-dark);

}

.dark-mode .z-bandbox-button,
.dark-mode .z-combobox-button {
    background-color: var(--dt-background-dark);
    color: var(--dt-text-primary-dark);
    border-color: var(--dt-boder-input-color);
}


.dark-mode .z-comboitem, .dark-mode .z-comboitem a, .dark-mode .z-comboitem a:visited {
    color: var(--dt-text-primary-dark);
}

.dark-mode .z-comboitem:hover {
    background-color: var(--dt-primary);
}

.dark-mode .z-menu-content, .dark-mode .z-menuitem-content {
    background-color: var(--dt-background-dark);
}

.dark-mode .z-menu-text {
    color: var(--dt-text-primary-dark);
}

.dark-mode .z-menubar {
    background-color: var(--dt-background-dark);
    border-color: var(--dt-background-dark);
}

.dark-mode .z-menubar-horizontal li {
    margin-top: 0;
}

.dark-mode .z-menu-icon {
    color: var(--dt-text-primary-dark);
}

.dark-mode .z-paging {
    background-color: var(--dt-background-dark);
}

.dark-mode .z-paging-icon, .dark-mode .z-paging-text, .dark-mode .z-paging-info {
    color: var(--dt-text-primary-dark);
}

.dark-mode ::-webkit-scrollbar-track {
    background: var(--dt-background-dark);
}

.dark-mode .z-grid .z-row-inner, .dark-mode .z-grid .z-cell {
    background: var(--dt-background-dark) !important;
}

.dark-mode .panel-default > .panel-heading {
    background-color: var(--dt-background-dark);
}

.dark-mode .z-calendar-weekday {
    color: var(--dt-text-primary-dark);
}

.dark-mode .z-tab-icon {
    color: var(--dt-text-primary-dark);
}