/**
    This file adjusts things so that Tabler looks cool and is used always,
    regardless of skin color applied and dark/light mode used
*/

/* menu adjustement */
.force-visibility{
    visibility: visible!important;
}

header .navbar-overlap:after {
    height:0px!important;
}

#mobile-menu .nav-item{
    border-top: solid 1px;
    margin:0px!important;
    border-color: grey;
}

#mobile-menu .dropdown-toggle{
    font-weight: bold;
    text-transform: uppercase;
    color: #003456;
}

.navbar-nav .nav-item {
    padding-left:8px;
    padding-right:8px;
}

.navbar-expand-lg .nav-item.active {
    background-color: var(--tblr-quaternary);
}

.navbar-vertical {
    background-color:var(--tblr-quaternary) ;
}

.sidebar .nav-dropdown-items .nav-dropdown {
    padding-left: 0.8rem;
}
.sidebar .nav-dropdown-items .nav-dropdown:not(.open) > a {
    font-weight: normal!important;
}

.dropdown-header {
    font-size: 0.690rem;
    color:var(--tblr-primary);
    margin-top:5px;
    padding-top:10px;
    padding-bottom:10px;
    background-color:var(--tblr-quaternary);
    border-top: solid 1px lightgrey;
    border-bottom: solid 1px lightgrey;
}

.dropdown-item {
    padding-left: 20px;
    line-height:1.0;
}

.custom-dropdown-header{
    height:43px;
    overflow: hidden;
}

.custom-dropdown-header:hover{
    height:100%;
}

/* body adjustement */

.page-body {
    margin:16px;
}

/* breadcrumbs adjustement */

.breadcrumbs {
    background-color:var(--tblr-quaternary);
    padding-top:15px;
    padding-bottom:15px;
    min-height:50px;
}

/* crud adjustemnts */

.header-operation{
    background-color: white;
    padding-top: 16px;
    padding-bottom: 16px;
    border-bottom: solid 1px #94A3B8;
    border-radius: 3px 3px 0px 0px;
    margin-bottom: 0px!important;
}

[section=before_content]{
    --tblr-gutter-x: inherit!important;
    background-color:white;
    padding-top:1rem;
    padding-bottom:1rem;
    flex-wrap:nowrap;
    position:relative;
}

[section=before_content] h3{
    width:fit-content;
}

[bp-section=crud-operation-list], [bp-section=crud-operation-create], [bp-section=crud-operation-form], [bp-section=crud-operation-reoder], [bp-section=crud-operation-show], [bp-section=crud-operation-update]{
    --tblr-gutter-x: inherit!important;
    background-color:white;
    padding-top:1rem;
    padding-bottom:1rem;
    border-radius: 0px 0px 3px 3px;
    box-shadow: 0 1rem 1rem rgba(0,0,0,.15)!important;
}

/* crud list adjustemnts */

.navbar-filters {
    min-height: 25px;
    border-radius: 0;
    margin-top: 16px!important;
    border-top: solid 1px #94A3B8;
    border-bottom: solid 1px #94A3B8;
    background-color:rgb(245, 245, 245)!important;
}

.navbar-filters .navbar-nav > .active > a:hover,.navbar-filters li > a:active, .navbar-filters .navbar-nav > .active > a {
    background-color:transparent;
}

#crudTable thead{
    background-color: rgb(223, 222, 222);
    border:solid 1px rgb(153, 153, 153);
}

.table thead tr th {
    background-color:#e5e7eb;
    font-size:12px;
    color:black;
}

#bottom_buttons {
    padding-top: 16px;
    padding-bottom: 16px;
}

td a.btn.btn-sm.btn-link:hover{
    background-color:var(--tblr-primary);
    color:#fff;
}

table.dataTable thead>tr>th.sorting:before, table.dataTable thead>tr>th.sorting:after {
    opacity: .750!important;
}

#crudTable_wrapper{
    margin-top:16px;
}

#crudTable_wrapper td, #crudTable_wrapper th {
    border-right: solid 1px var(--tblr-gray-300);
}

/* crud nav-tabs adjustemnts */

.nav-tabs {
    border-radius: 3px 3px 0px 0px;
}

.nav-tabs .nav-link{
    color:var(--tblr-navbar-color);
    padding-top:15px;
    padding-bottom:15px;
}

[data-bs-theme=light] div.tab-container ul li.nav-item .active{
    background-color:var(--tblr-quaternary)!important;
    border-bottom: solid 2px;
}

/* crud tab-content form adjustemnts */

[data-bs-theme=light] div.tab-container div.tab-content{
    background-color: var(--tblr-quaternary)!important;
    border:solid 1px #94A3B8!important;
    border-radius: 0px 0px 3px 3px;
}

.tab-content .form-control{
    border-color:#94A3B8;
}

form .select2.select2-container{
    border:1px solid #94A3B8!important;
}

.tab-content .EasyMDEContainer .CodeMirror{
    border:1px solid #94A3B8!important;
}

.tab-content .editor-toolbar{
    border-color:#94A3B8!important;
}

.container-repeatable-elements .controls {
    position:relative!important;
    left: 0px!important;
    display: block!important;
    width: 100%!important;
}

.container-repeatable-elements .controls button.close.delete-element{
    background-color:#94a3b86b;
    border-radius: 3px 3px 3px 3px;
    border: solid 1px #94a3b86b;
    position:absolute;
    top:8px;
    right:2px;
}

[bp-field-type="checklist"] .row{
    background-color:#fff;
    border:1px solid #94A3B8!important;
    margin:0px 5px 0px 0px;
}

[bp-field-type="checklist_create_checked"] .row{
    background-color:#fff;
    border:1px solid #94A3B8!important;
    margin:0px 5px 0px 0px;
}

[bp-field-type="repeatable"] .repeatable-element{
    background-color:rgba(243, 241, 241, 0.904)!important;
    padding:0px!important;
    border:1px solid #94A3B8!important;
}

form .select2-container--bootstrap .select2-selection--single{
    min-height:34px;
}

/* crud table ajustement */
[bp-section="crud-operation-update"] .table thead {
    background-color: rgb(223, 222, 222);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: black;
    font-size: 12px;
    border-right: solid 1px var(--tblr-gray-300);
    border-top:solid 1px var(--tblr-gray-300);
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    height: 45px;
    vertical-align:middle;
}

[bp-section="crud-operation-update"] .table thead th {
    border-right: solid 1px var(--tblr-gray-300);
    border-left: solid 1px var(--tblr-gray-300);
    border-bottom: solid 1px grey;
    margin:0px;
}

[bp-section="crud-operation-update"] .table tbody td {
    border-right: solid 1px var(--tblr-gray-300);
    border-left: solid 1px var(--tblr-gray-300);
}

[data-bs-theme=light] tbody {
    background-color: rgba(243, 241, 241, 0.904)!important;
}

/* card custom*/

.card{
    background-color: var(--tblr-quaternary);
    height: 100%;
}

.card-header{
    padding:0.5rem;
}

.card-body{
    padding:0.5rem;
}

.card-footer{
    background-color: var(--tblr-quaternary);
}

/* EasyMDEContainer custom*/
.ck.ck-editor__main>.ck-editor__editable{
    height:200px;
}

.avatar-custom {
    --tblr-avatar-shadow: inset var(--tblr-border-color-translucent) 0 0 0 0px;
    --tblr-avatar-bg: none;
}

.lf-gold {
    color: #bda25a;
}

.lf-blue {
    color: #1c355e;
}

.lf-beige {
    color: #f5f1ee;
}

.lf-pink {
    color: #f7cee0;
}

.lf-green {
    color: #22C373;
}

.lf-red {
    color: #DD493C;
}

.lf-orange {
    color: #FF9A00;
}

.lf-gold-hover {
    color: #c9b379;
}

.lf-grey {
    color: #f3f3f3;
}

#datepicker-week-container .datepicker-days table tbody td:hover,
#datepicker-week-container .datepicker-days table tbody tr:hover
{
    background-color: #b4b6ba !important;
}

#datepicker-week-container .datepicker-days tr.active,
#datepicker-week-container .datepicker-days td.active
{
    background-color: #b2c5e9 !important;
    color: black;
}

.top-widget {
  min-height: 110px;
  background-color:white;
  margin-right: calc(-.5 * var(--tblr-gutter-x));
  margin-left: calc(-.5 * var(--tblr-gutter-x));
  padding:10px;

  .card {
    height: auto;
  }
}