html, body{min-height:100vh;}
body{
    font-family:'Open Sans', sans-serif;font-size:15px;
    background-color:var(--bs-gray-100);
    
    --bs-border-color-translucent: rgba(0, 0, 0, 0.07);
    --ss-main-height: 40px;
}

.btn, .btn:hover {color:var(--bs-white)}
.btn.bg-light {color:var(--bs-black)}
.bi::before {color:var(--bs-blue);}
.bi.text-success::before {color:var(--bs-green);}
.bi.text-warning::before {color:var(--bs-yellow);}
.bi.text-danger::before {color:var(--bs-red);}
.bi.text-muted::before {color:var(--bs-gray-400);}
.btn .bi::before {color:var(--bs-white); font-size: 1.2rem}

.navbar {background-color:var(--bs-white);border-bottom: var(--bs-border-width) var(--bs-border-style) var(--bs-gray-300);box-shadow: 1px 1px 5px rgb(57 57 57 / 15%);}

.content{padding-top:90px;}

.ajax-link, .cursor-pointer {cursor:pointer;}

.card {margin-bottom:8px;box-shadow:1px 1px 5px rgb(57 57 57 / 15%);/*--bs-card-cap-bg: #FFF;*/}

.list-actions {margin:1rem 0;}
.list-actions li {margin-bottom:0.4rem;}
.list-actions li .btn-block {display:block;width:100%;color:var(--bs-white)}

.titlebox {margin-bottom:10px;}
.titlebox h4 {font-size: 2rem;}

form .hidden {display:none;}

.dashboard-list-item .card-body{height:450px;overflow-y:scroll;}
.dashboard-list-item .table-responsive{min-height:0;}

.dropdown-submenu {position: relative;}
.dropdown-submenu > a:after {display: inline-block;margin-left: 0.255em;vertical-align: 0.155em;content: "";border-top: 0.3em solid;border-right: 0.3em solid transparent;border-bottom: 0;border-left: 0.3em solid transparent;}
.dropdown-submenu .dropdown-menu{padding: 12px 10px !important;box-shadow: none !important;border: 0px none;}

#mainnav .navbar-nav > .nav-item.dropdown > ul {max-height: 80vh;overflow-y: scroll;}

.navbar-nav .dropdown-menu {padding:20px;margin:0;}
.navbar-nav .dropdown-menu::-webkit-scrollbar {-webkit-appearance: none;width: 4px;}
.navbar-nav .dropdown-menu::-webkit-scrollbar-thumb {border-radius: 4px;}
.navbar-nav .dropdown-menu .nav-item{margin-bottom:10px;}
.navbar-nav .dropdown-menu .nav-item:last-of-type{margin-bottom:0;}
.navbar-nav .dropdown-menu .nav-link{margin-right:0;text-transform:none;white-space:nowrap;}

.header .dropdown-submenu ul.open-nav {display:block;position: relative;overflow-y: visible;}

.header .navbar{height:70px;padding:15px 25px 15px 75px;}

.navbar-expand-lg .navbar-nav .nav-link{padding:0;}

.navbar-nav .nav-link{font-size:16px;letter-spacing:0.03em;text-transform:uppercase;font-weight:400;margin-right:30px;display:inline-block;position:relative;}
.navbar-nav .nav-link.active{border-bottom-width:2px;border-bottom-color:var(--bs-blue);;border-style: solid;}
.navbar-nav .nav-link.active::before{content:"";height:3px;display:block;position:absolute;bottom:-23px;left:0;right:0;}

.navbar-brand{position:absolute;top:50%;transform:translateY(-50%);left:12px;}
.navbar-brand .logo{width:38px;}

.list-attributes li {width: 33%; display:inline-block;}

.input-with-icon {position:relative;}
.input-with-icon > .input-group-addon{position:absolute;top:50%;transform:translateY(-50%);left:15px;font-size:20px;}
.input-with-icon > .form-control{padding-left:48px;}

.form-control {background-color:var(--bs-gray-100);}
.form-control-feedback.fa{font-size: 20px;}
.form-control-feedback.fa:before{line-height: 34px;}
.form-control-feedback {bottom: 9px;right: 28px;position: absolute;}
.form-control:disabled {background-color:var(--bs-gray-100)}
.form-control.text-muted {cursor:not-allowed;}

form :disabled, .bootstrap-select.disabled, .bootstrap-select .disabled {
  cursor:not-allowed;
}

.table {margin-bottom:0px;}

.table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th {vertical-align:top;}
.table>thead>tr>td, .table>tbody>tr>td, .table>tfoot>tr>td {vertical-align:middle;}

.grid-wrapper {width:100%;}
.grid-wrapper .table-responsive {height: calc(100vh - 265px);}
.grid-wrapper .column-filter-inner {margin:0px;}
.grid-wrapper .column-filter-inner .field-title {display:block;margin-bottom:6px;}

.reverse{transform: rotate(180deg);}

.footer{margin:0;}

.grow { transition: all .2s ease-in-out; }
.grow:hover { transform: scale(1.2);}

.grow-image { transition: all .2s ease-in-out; }
.grow-image:hover { transform: scale(8);}

.loader {display:none;position:absolute;justify-content: center;   align-items: center;z-index:20;background-color:rgba(255,255,255,0.5);}
.loader.active {left:0;right:0;top:0;bottom:0;display: flex;}

.ck-editor__editable {height: 300px;}

.tab-content .form-group {margin-top:0.5rem;}
.tab-content .form-group .mb-2 {margin:0px !important;}
.tab-content .form-group .form-control {font-size:1rem;}

.tab-content .title-wrapper .title {display: inline-block;padding: 0.5rem 1rem;transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;border-bottom:2px solid var(--bs-blue);}
.tab-content .title-wrapper .title, .tab-content .nav.nav-tabs > li > .nav-link.active {font-weight:600;}

.nav-pills {box-shadow:1px 1px 5px rgba(57,57,57, 0.15);}
.nav-pills li {background-color:var(--bs-white);--bs-nav-link-padding-y:1rem;}

.login-container {background-color:#FFF;}
.login-container .form-group {
  margin-bottom:20px;
}
.grid-wrapper .card-body {padding:0;}
.grid-wrapper .table .position-sticky {z-index:20;}
.grid-wrapper .table .position-sticky th {background-color:#F8F8F8;}
.grid-wrapper .table .panel-action {padding:0px 3px;}
.grid-wrapper .table tr:hover .quickedit-action {display:inline-block !important;}
.grid-wrapper .table tr:hover .quickedit-action ::before {color:var(--bs-gray-400);}

.grid-wrapper .table td .quickedit-container {position:absolute;left:0;width:300px;z-index:10;background-color: #FFF;padding: 10px;border: 1px solid #DDD;box-shadow: 1px 1px 5px rgb(57 57 57 / 15%);}
.grid-wrapper .table td .quickedit-container select {margin-bottom:4px;}

.grid-wrapper .table td:first-child, .grid-wrapper .table th:first-child {padding-left:0.6rem;}
.grid-wrapper .table td:last-child, .grid-wrapper .table th:last-child {padding-right:1rem;}

.grid-wrapper .table td:last-child, .grid-wrapper .table th:last-child {
    position: sticky;
    right: 0;
    padding-left: 10px;
    z-index: 3;
    text-align: center;
}

.grid-wrapper .table td:last-child a {margin-right: 4px;}

div:not(.ajax-wrapper-select) > .grid-outer-wrapper .grid-wrapper .table td:first-child, div:not(.ajax-wrapper-select) > .grid-outer-wrapper .grid-wrapper .table th:first-child {
    position: sticky;
    left: 0;
    padding-right: 10px;
    z-index: 4;
    text-align: center;
}

.grid-wrapper .table td:last-child {background-color: var(--bs-gray-100);}

.grid-wrapper .table td:nth-last-child(2) .quickedit-container {left:auto;right:0;}
.grid-wrapper .table td:nth-last-child(3) .quickedit-container {left:auto;right:0;}
.grid-wrapper .table td:hover .quickedit-action ::before {color:var(--bs-blue);}

.grid-wrapper .open-only.position-absolute {top:0;left:0;width:350px;margin:-5px -10px;padding:5px 10px;z-index: 20;background-color:#F8F8F8;-webkit-box-shadow: 5px 5px 5px -1px rgba(0,0,0,0.25);-moz-box-shadow: 5px 5px 5px -1px rgba(0,0,0,0.25);box-shadow: 5px 5px 5px -1px rgba(0,0,0,0.25);}
.grid-wrapper .column-filter-wrapper-a-right .open-only.position-absolute {left:auto;right:0;}
.grid-wrapper .grid-reset-link{position:absolute;top: -7px;right: -2px;color:#E9553D;cursor:pointer;}

.action-output-wrapper {position:absolute;z-index:40;right: 0px;top: 27px;padding:4px;border-radius:4px;box-shadow:3px 3px 3px rgba(57,57,57,.15);background-color:#fff;width:250px;}
.action-output-wrapper a {font-size:14px;color:#fff}
.action-output-wrapper a.nav-link {color: #000;}
.action-output-wrapper ul {max-height:176px;overflow-y:auto;}
.action-output-wrapper ul li {margin: 10px;}

.titlebox .bi-caret-down-fill::before {font-size:0.8rem;}

.checkbox-wrapper {position:relative;}
.checkbox-wrapper input.inizialized {position:absolute;opacity:0;}
.checkbox-wrapper.bi-check-square::before {color:var(--bs-success)}
.checkbox-wrapper.disabled {cursor:not-allowed}
.checkbox-wrapper.disabled::before {background-color:#EFEFEF;}


.tree {}
.tree ul ul li {padding-left:10px;}
.tree .categoryscroller{list-style:none;margin-top:5px;}

.tree .navigation-node ul.list-inline > li.list-group-item{margin-bottom:5px;border:none;}
.tree .navigation-node ul.list-inline > li.list-group-item label{margin-bottom:0;}

.sidebar .nav-item a.active i{color:#FFF;}

.multicheckbox .checkbox-wrapper {float: left;padding-right: 5px;  }

.action-wrapper {padding:0px 5px;}
.action-wrapper .page-size-selector p {font-weight:bold;margin-bottom:0.5rem;}
.action-wrapper .page-size-selector {border-bottom:1px solid #666;padding-bottom:10px;margin-bottom:5px;}
.action-wrapper .page-size-selector:last-child {border-bottom:0px none;}
.action-wrapper .btn-group {width:100%;margin-top:4px;}
.action-wrapper .btn-group span {margin-right:1px;}
.action-wrapper .btn-group span:last-child {margin-right:4px;}

.pagination-wrapper .pagination {margin:8px 0px;}

.tree-container {border-left: 1px solid #AEAEAE;margin-left:10px;padding:5px 15px;}
.tree-container h6 {margin:0px;}

.profiler-table td, .profiler-table th {background-color: inherit;}

#modals .modal-xl {max-width:calc(100vw - 300px);height:calc(100vh - 60px);overflow-y:auto;overflow-x:hidden;}
#modals .modal-xl .modal-content {min-height:100%;}
#modals .modal-body {background-color: var(--bs-gray-100);}
#modals .modal-header {padding:0px}

.input-group-append .btn {height: 40px;}
.input-group-append .btn.btn-light {border: 2px solid #EEE; border-left:0px none;}

.edit .navigation.tree > .card {box-shadow:none;margin:0px;padding:0px;border: 0px none;}

.ss-content .ss-search input:focus {box-shadow:none;border:0px none;}

form .titlebox.pos-fixed .buttons {position:fixed;right:0;background-color:var(--bs-gray-100);z-index:10;padding:10px;border:1px solid: var(--bs-card-border-color);}

#category_tree_wrapper .col-3 {resize:horizontal;overflow:auto;}

.multi-upload-field ul {max-height:100px;overflow-y:auto;padding-bottom:0px;}

.size-0 th, .size-0 .table td{font-size:10px;}
.size-1 th, .size-1 .table td{font-size:12px;}
.size-2 th, .size-2 .table td{font-size:14px;}

#category_tree_wrapper .card.category-tree-card .card-body {overflow-x:none; overflow-y:auto;height:calc(100vh - 221px); width:100%;}
#category_tree_wrapper .card.category-tree-card .card-body .intent {width:27px;text-align:center;display:inline-block;}
#category_tree_wrapper .card.category-tree-card .card-body ul {margin-left:5px;}
#category_tree_wrapper .card.category-tree-card .card-body ul ul {padding-left: 17px;margin-left: 8px;border-left: 1px dotted #DDD;}
#category_tree_wrapper .card.category-tree-card .card-body li.dragover-upper {border-top: 2px solid #CCC}
#category_tree_wrapper .card.category-tree-card .card-body li.dragover-under {border-bottom: 2px solid #CCC}
#category_tree_wrapper .card.category-tree-card .card-body li[draggable=true] {cursor:row-resize;}
#category_tree_wrapper li > span.nobr {white-space: nowrap;}

#category_tree_wrapper .card.category-tree-card .vertical-resizer {top:0px;bottom:0px;right:-12px;width:10px;cursor:ew-resize;z-index:10;}

#category_tree_wrapper .card.category-tree-card .tree-config-options {top:40px;right:20px;background-color:var(--bs-gray-100);z-index:10;border:1px solid: var(--bs-card-border-color);cursor:pointer;}
#category_tree_wrapper .card.category-tree-card .tree-config-options i::before {font-size:1.7rem;opacity:.5;}
#category_tree_wrapper .card.category-tree-card .tree-config-options li.enabled i::before {color:var(--bs-green);opacity:1;}
#category_tree_wrapper .card.category-edit-card {overflow-y:auto;height:calc(100vh - 153px); width:100%;display:flex;}
#category_tree_wrapper .card.category-edit-card .back-button {display:none;}
#category_tree_wrapper .card.category-edit-card .save-and-continue {display:none;}

.edit-renderer #category_tree_wrapper .card.category-tree-card .card-body{height:calc(100vh - 353px);}
.edit-renderer #category_tree_wrapper .card.category-tree-card .card-body .node-hidden{height:0px;padding: 0px !important;}
.edit-renderer #category_tree_wrapper .card.category-tree-card .card-body li {overflow:hidden;  transition: all 0.5s ease-out allow-discrete;}

#toasts {position: fixed; bottom: 10px; right: 10px;width:400px;overflow-y:auto;overflow-x:none;max-height:40vh;z-index:3}
#toasts .toast {width:100%;}

#message_center_toggle {position: fixed; bottom: 20px; right: 20px;z-index:2;border-radius: 50%; padding-top: 12px;box-shadow:0px 0px 33px 18px #FFF}
#message_center_toggle .bi::before {font-size:20px;}

#messagecenter_wrapper .headline {border-bottom: 1px solid var(--bs-gray-200)}
#messagecenter_wrapper .card.message-card {height: calc(100vh - 293px)}
#messagecenter_wrapper .tab-content {height: 100%;}
#messagecenter_wrapper .tab-content .tab-pane {height:calc(100% - 40px);overflow-y:scroll;}
#messagecenter_wrapper .card.message-box button {width:77px}
#messagecenter_wrapper .card.message-box button i::before {font-size:230%}

#messagecenter_wrapper .message-card .badge {padding:10px;margin:10px;border-radius:3px;font-size:110%;font-weight:normal;white-space:normal}
#messagecenter_wrapper .message-card .message .badge {max-width:80%}
#messagecenter_wrapper .message-card .text-end .badge {text-align:right;}
#messagecenter_wrapper .message-card .text-start .badge {text-align:left;}
#messagecenter_wrapper .text-bg-light-success {background-color: var(--bs-success-bg-subtle);color:#000}
#messagecenter_wrapper .user-list-wrapper .user-list li a {color:#444;}
#messagecenter_wrapper .user-list-wrapper .user-list li a::before  {position:absolute;top:40%;font-size:0.7rem;}
#messagecenter_wrapper .user-list-wrapper .user-list li a.status-darkgray::before {color:#666;}
#messagecenter_wrapper .user-list-wrapper .user-list li a.status-success::before {color:var(--bs-green);}
#messagecenter_wrapper .user-list-wrapper .user-list li a.status-warning::before {color:var(--bs-yellow);}
#messagecenter_wrapper .user-list-wrapper .user-list li a.status-danger::before {color:var(--bs-red);}
#messagecenter_wrapper .user-list-wrapper .user-list li a {position:relative;}
#messagecenter_wrapper .user-list-wrapper .user-list li a > * {margin-left:30px;}

/* darkmode fix */
[data-bs-theme=dark] .navbar {background-color: var(--bs-gray-800);border-color:#000;}
[data-bs-theme=dark] body {background-color: var(--bs-gray-900);}
[data-bs-theme=dark] .nav-tabs .nav-link, [data-bs-theme=dark] .card {background-color: var(--bs-gray-800);}
[data-bs-theme=dark] .form-control {border-color: var(--bs-gray-700);background-color:var(--bs-gray-900);}
[data-bs-theme=dark] .nav-pills > li {background-color:var(--bs-gray-800);}
[data-bs-theme=dark] .grid-wrapper .table .position-sticky th {background-color:var(--bs-gray-700);}
[data-bs-theme=dark] .table > :not(caption) > * > * {background-color:var(--bs-gray-800);}
[data-bs-theme=dark] .grid-wrapper .open-only.position-absolute {background-color:var(--bs-gray-700);}
[data-bs-theme=dark] .form-control.bg-white {background-color:var(--bs-gray-800) !important;}
[data-bs-theme=dark] .grid-wrapper .table td .quickedit-container {background-color:var(--bs-gray-800) !important;border-color:var(--bs-gray-900);}
[data-bs-theme=dark] .ss-content .ss-search input {background-color:var(--bs-gray-900);}
[data-bs-theme=dark] .ss-content .ss-option  {color:#CCC;}
[data-bs-theme=dark] .list-group-item {background-color:var(--bs-gray-800)}
[data-bs-theme=dark] .action-output-wrapper {background-color:var(--bs-gray-900);}
[data-bs-theme=dark] .action-output-wrapper .nav-link {color:var(--bs-gray-200);}
[data-bs-theme=dark] .input-group-append .btn.btn-light {background-color:var(--bs-gray-900);border-color:var(--bs-gray-700);color:var(--bs-gray-800) !important;}
[data-bs-theme=dark] .btn.back-button {background-color: var(--bs-gray-900) !important;color:var(--bs-gray-400) !important;}
[data-bs-theme=dark] form .titlebox.pos-fixed .buttons {background-color: var(--bs-gray-900);}
[data-bs-theme=dark] #category_tree_wrapper .card.category-tree-card .tree-config-options {background-color:var(--bs-gray-900);}
[data-bs-theme=dark] .grid-wrapper .table td:last-child {background-color: var(--bs-gray-900);}
[data-bs-theme=dark] #modals .modal-body {background-color: var(--bs-gray-900);}
[data-bs-theme=dark] #message_center_toggle {box-shadow:0px 0px 33px 18px var(--bs-gray-900)}



[data-bs-theme=dark] {
  --ck-color-base-foreground: #dee2e6;
  --ck-color-base-background: #212529;
  --ck-color-text: #dee2e6;
  --ck-color-button-default-hover-background: #212529;
  --ck-color-base-border:#343a40;
  --ck-focus-ring: 1px solid #6c757d;
  --ck-color-button-on-color: var(--bs-blue);
}

@media (max-width: 992px) {

}

@media (max-width: 768px) {
  .navbar-toggler{float:right;}
  .navbar-collapse{padding:20px;left:0;right:0;position:absolute;max-height:70vh;overflow-y:scroll;}
  .navbar-collapse .col-sm-12{padding:0;}
  .navbar-nav .dropdown-menu{box-shadow:none;}
  .navbar-nav .nav-link{margin-right:0;}
  .navbar-expand-lg .navbar-nav .nav-link{padding:10px 0;}
  .navbar-expand-lg .navbar-nav .dropdown-menu{padding:20px 10px;}
  .navbar-expand-lg .navbar-nav .dropdown-menu .nav-link{padding:0;}
  .navbar-nav .nav-link.active::before{bottom:0;}

  .table-responsive{min-height:0;}
}

@media (max-width: 576px) {
  h1, .h1{font-size:28px;}
  .titlebox h1{margin-bottom:10px;display:block !important;}
  .buttons.text-right.d-inline.pull-right{float:none;display:block !important;}
  .buttons.text-right.d-inline.pull-right .panel-action{display:block !important;width:100%;}
}