body {
    padding-top: 50px;
    padding-bottom: 20px;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default 
input,
select,
textarea {
    max-width: 280px;
}*/

table.dataTable tbody tr.selected{background-color:#B0BED9}
.pd-grid [class^=col-] {
   
    padding-bottom: 15px;
}

.grid-formulario [class^=col-] {
    min-height: 60px;
}

.grid-etiquetas [class^=col-] {
    min-height: 40px;
}


.material-switch-null > input[type="checkbox"] + label::after {
    background: #949ba2 !important;
}

.truncate {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    max-width: 100%;
}
.text-success {
    color: #50bb52 !important;
}
.text-danger {
    color: #db524b !important;
}
.text-warning {
    color: #dc9823 !important;
}
.count-info .label {
    line-height: 12px !important;
    padding: 2px 5px !important;
    position: absolute !important;
    left: 30px !important;
    top: -5px !important;
}
.btn-xl >.label-lg{
    font-size: 55%;
    line-height: 10px !important;
    padding: 7px 10px !important;
    position: absolute !important;
    right: 0px !important;
    top: -10px !important;
}



i.page-header-icon {
    color: var(--main-color);
}

ul.luna-nav i.fa, ul.luna-nav i.far, ul.luna-nav i.fal {
    font-size: large;
}
.color-primary {
    color: var(--main-color);
}

.alerta-principal {
    font-size: 27px;
    align-content: center;
    width: 100%;
    color: var(--inverse-color);
}

.btn-group-xl > .btn, .btn-xl {
    padding: 20px 16px !important;
    font-size: 20px !important;
    line-height: 1.3333333 !important;
    border-radius: 9px !important;
}

.btn-xl  .badge{
    margin-left: 2rem;
    color: white !important;
    min-width: 40px;
    padding: 5px 9px;
    border:none
}
.bade-warning {
    background-color: #f0ad4e !important;
}
.bade-info {
    background-color: #00bcd4 !important;
}
.bade-success {
    background-color: #5cb85c !important;
}
.bade-danger {
    background-color: #f44336 !important;
}

/*COMEDOR*/
.comedor{
    min-width:200px;
    float:left;
    width: 100%;
}
.comedor-titulo {
    text-align: center;
    color: #607d8b;
    margin-top:15px;
    margin-bottom: 15px;
}
.timeRSR {
    color: #dc9823;
    font-weight: bold;
}
.comedor-contenido {
    width: fit-content;
    margin: auto;
}
.comedor-fila{
    height:35px;
}
.comedor-silla {
    width: 25px;
    height: 25px;
    /* background-color: #9E9E9E; */
    float: left;
    line-height: 25px;
    text-align: center;
    outline: none;
    margin: 5px;
    padding: 5px;
    border-radius: 5px;
}
.comedor-silla-apartada {
    color: #dc9823;
}
.comedor-silla-reservada {
    color: #56c0e0;
}
.comedor-silla-asignada {
    color: #4caf50;
}
.pnlScan {
    min-height: 290px;
    display: flex;
    align-items: center;
    /*justify-content: center*/
}
.scanContenido {
    text-transform: uppercase;
    font-weight: bold;
    color: #9E9E9E;
    text-align: justify;
    width: 100%;
    font-size:2em;
}
    .scanContenido > .alert {
        padding-top: 30px;
        padding-bottom: 30px;
        font-size: 2em;
        text-align:center;
    }
    .scanContenido i{
        margin: 15px;
    }
/*.scanContenido .text-default {
    color: #949ba2;
    font-size: 3rem;
    text-align: justify;
    text-transform: none;
}*/
.scanPreview {
    border-radius: 5px;
    height: auto;
    margin-bottom: 2%;
    margin-top: 2%;
    width:100%;
    max-width:600px;
}
.comedor-ind {
    padding: 15px;
    /*margin-bottom: 20px;*/
    border: 1px solid transparent;
    border-radius: 4px;
}
.comedor-ind h4 {
    margin-top: 0;
    color: rgb(148, 155, 162);
}

.comedor-full {
    border-radius: 5px;
    padding: 25px 30px;
    border: #f7af3e 2px solid;
    font-weight: bold;
}
#divMenuComedor .panel {
    height: 300px;
    overflow-y: hidden
}
#divMenuComedor .panel .panel-body {
    height: 100%;
    overflow: auto;
}

#divMenuComedor li {
    font-size: 10px;
    padding: 8px 15px;
}

#divMenuComedor li.active {
    background-color: var(--main-color);
    border-color: var(--main-color-light);    
    font-weight:bold;
    font-size: 12px;
}

#MainMenu .list-group-submenu  > ul {
    max-height:350px;
    overflow-y:auto;
}
.notificacion-item {
    cursor:default;
}
.notificacion-item, .notificacion-item a {
    background-color: var(--secondary-color);
    padding:10px 0px;
}


    .notificacion-item:hover, .notificacion-item:focus,
    .notificacion-item:hover a, .notificacion-item:focus a {
        background-color: var(--primary-color);
    }

.notificacion-item > .row {
    margin-left:unset;
    margin-right:unset;
}

.notificacion-item > .row > div {
    display:inline-block;
    vertical-align: middle;
    float:none;
}


#Menu-Notificacion > ul{
    line-height:0px;
}

#Menu-Notificacion a.list-group-item {
    font-size: larger;
    border-radius: unset;
    padding: 0px;
    /*padding-left:0px;*/
    /*padding-right:0px;*/
}

#MainMenu .dropdown .list-group-submenu {
    margin-left: 40px;
    background-color: var(--secondary-color);
}
#MainMenu .nav-side-menu li {
    line-height: 35px;
    color: white;
}
#linkNotificaciones span.label, .point-alert span.label {
    position: absolute;
    top: 5px;
    left: 5px;
    min-width: 10px;
    min-height: 10px;
    border-radius: 5px;
}
#MainMenu .nav-side-menu li > a:hover,#MainMenu .nav-side-menu li > a:focus {
    color: white;
}
#MainMenu .nav-side-menu li a > span {
    display:inline-block;
    background-color:var(--primary-color)
}
#MainMenu .nav-side-menu li a > div > span.badge {
    background: var(--secondary-color);
    color: white;
    margin-left: 20px;
    height:fit-content;
}
#MainMenu .nav-side-menu li a > div  {
    
}
#MainMenu .nav-side-menu li a > span > i {
    padding: 15px;
    font-size:medium;
}

#linkNotificaciones > div {
    font-size: medium;
    height:46px;
    display: flex;
    width: 100%;
    padding: 15px;
    top: 0;
    position: absolute;
    margin-left: 40px;
    background-color: var(--main-color);
    align-items:center;
}


#MainMenu .nav-side-menu li:first-child > a > span,#MenuDefault > a{
    border-top-left-radius:10px;
}

#MainMenu .nav-side-menu li:last-child > a > span,#MenuDefault > a{
    border-bottom-left-radius:10px;
}

#MenuDefault > a {
}

.panel-heading .collapse-arrow > i {
    transition: transform ease-in 0.2s;
}

.panel-heading > [aria-expanded="true"] .collapse-arrow > i {
    transform: rotate(90deg);
    transition: transform ease-in 0.2s;
}

.bg-transparent{
    background-color:transparent !important;
}
.userSSS {
    margin-right:5px;
    cursor:pointer;
}
/*XXS*/
@media (max-width: 500px) {
    .scanContenido{
        font-size:1em;
    }
    .pnlScan{
        min-height: 200px;
    }
    .comedor-silla i {
        width: 15px;
        height: 15px;
        font-size: 10px;
    }
    .comedor-silla {
        width: 15px;
        height: 15px;
    }


}

/*XS*/
@media (min-width: 500px) {
    .comedor-silla i{
        width: 23px;
        height: 23px;
        font-size: 1.8rem;
    }
    .scanContenido .alert{
        font-size: 1em;
    }
}

/*SM*/
@media (min-width: 768px) {
    .comedor-silla i{
        width: 23px;
        height: 23px;
        font-size: 1.8rem;
    }
    .scanContenido .alert {
        font-size: 1em;
    }
}
/*MD*/
@media (min-width: 992px) {
    .comedor-silla i {
        width: 28px;
        height: 28px;
        font-size: 2.2rem;
    }
}
/*LG*/
@media (min-width: 1200px) {
    .comedor-silla i{
        width: 30px;
        height: 30px;
        font-size: 2.6rem;
    }
}

@media (max-width: 1024px) {
    .navTitulos {
       font-size :0;
    }
}


    /**************************/


    /*******GRAFICAS*****/


.pnlGraf {
    min-height: 350px;
    height: auto;
    width: 100%;
}

.amcharts-amexport-item {
    background-color: var(--main-color-dark);
}

.amcharts-amexport-label {
    color: white
}

.amcharts-amexport-label:hover {
    color: white
}

.amcharts-amexport-item:hover, .amcharts-amexport-item.active {
    color: white;
    background-color: var(--main-color-dark);
    opacity: 1;
}


.dashboard-filled {
    background-color: var(--dashboard-filled) !important;
    border: var(--dashboard-border) !important;
}
.dashboard-filled .dshLeyenda{
    cursor:pointer;
    background-color: var(--dashboard-legend) !important;
    color: var(--dashboard-color) !important;
}
.dshLeyenda i {
    color: var(--dashboard-color) !important;
}

.dshLeyenda i:hover {
    color: var(--dashboard-color) !important;
}
    /********************/


.mobile-buttons {
    float:left;
    padding: 10px 0px;
}
    .mobile-buttons a {
        color: #fff;
    }
    .mobile-buttons a:hover {
        color: var(--navbar-right-li-a);
    }
.mobile-buttons .dropdown{ 
    display:inline;
}

.panel-b-accent h2 {
    color: var(--bg-acent-color) !important
}

.panel-b-accent .table > thead:first-child > tr:first-child > th {
    background-color: var(--bg-acent);
    color: var(--bg-acent-text-color) !important
}
.panel-b-accent tbody {
    color: var(--bg-acent-text-color) !important
}

.panel-b-accent .link {
    color: var(--bg-acent-link) !important
}

.panel-b-accent .text-primary {
    color: var(--bg-acent-text-primary) !important
}
.panel-b-accent .text-secondary {
    color: var(--bg-acent-text-secondary) !important
}

.summernote .note-editor {
    background-color: var(--form-control);
    border-radius: 4px;
    margin-bottom:0px;
}
.summernote .note-editor .note-editing-area .note-editable{
    color: white !important;
}
.has-error .summernote .note-editor, .has-error .summernote .note-editor.panel {
    border-color: #cb3029;
    border-style: solid;
    border-width: 1px;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}


.has-success .summernote .note-editor, .has-success .summernote .note-editor.panel {
    border-color: #50bb52;
    border-style: solid;
    border-width: 1px;
    border-width: 1px;
}

.summernote .table > tbody > tr > td {
    border-color: var(--main-color)!important;
}
.summernote .note-btn{
    background-image:none;
    background-color:var(--main-color)!important;
    color: #fff!important;
    border-color: var(--main-color) !important;
}
    .summernote .note-btn:hover, .summernote .note-btn:focus, .summernote .note-btn.active {
        background-color: transparent !important;
        color: var(--main-color) !important;
    }

.note-icon-menu-check:before {
    content: "\f115";
}

.column-container {
    display: flex;
    flex-direction: column;
}
.td-truncate {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}
    .notificacion-item .notificacion-media i.fa-envelope, .notificacion-item .notificacion-media i.fa-exclamation-square {
        cursor: pointer;
    }


/************************** INICIA ESTILOS PARA RELOJ CHECADOR ********************************/
.widget-rlu p {
    display: inline-block;
    line-height: 1em;
}
.fecha-rlu {
    font-family: arial;
    text-align: center;
    font-size: 1.5em;
    margin-bottom: 5px;
    background: var(--modal-header);
    padding: 20px;
    width: 100%;
    color:white;
}

.reloj-rlu {
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    width: 100%;
    padding: 20px;
    font-size: 4em;
    text-align: center;
    background: var(--modal-header);
    margin-bottom: 5px;
    color:white;
}

    .reloj-rlu .cajaSegundos-rlu {
        display: inline-block;
    }

    .reloj-rlu .ampm-rlu, .reloj-rlu .segundos-rlu {
        display: block;
        font-size: 2rem;
    }
/************************** TERMINA ESTILOS PARA RELOJ CHECADOR ********************************/

.dropdown-header {
    color: var(--main-color) !important;
    font-weight: bold;
}
.dropdown-menu .divider{
    opacity: 0.2
}

.loader > .loader-spin {
    border-left-color: var(--main-color);
    border-top-color: rgba( 169, 185, 193, 0.2);
    border-right-color: rgba( 169, 185, 193, 0.2);
    border-bottom-color: rgba( 169, 185, 193, 0.2);
}

.tooltip .tooltip-inner ul{
    list-style:decimal-leading-zero;
    padding-left:20px;
}
.tooltip .tooltip-inner ul li{
    text-align:left;
    font-size:11px;
}

.step.active > .step-trigger {
    background-color: var(--main-color)!important;
}
.step.active > .step-trigger > .bs-stepper-label {
    color: white !important;
}

.bs-stepper-circle {
    background-color: var(--steper-circle) !important;
}

.bs-stepper .step-trigger:hover {
    background-color: var(--steper-button-hover) !important;
}
.panel.panel-filled{
    color:var(--panel-filled-color);
}
.bootstrap-select > .dropdown-toggle {
    color: var(--form-control-color) !important;
}

.modal-content label {
    color: var(--modal-content-label-color);
}

.modal-content .control-label {
    color: var(--modal-content-label-control-color);
}

.modal-content .table-striped > tbody > tr:nth-of-type(even) {
    background-color: var(--table-striped-even);
}

.panel-filled .control-label {
    color: var(--ctrl-lbl);
}

.panel.panel-heading {
    border-top-left-radius: 3px;
}
.panel.panel-c-warning .panel-heading{
    border-top-left-radius:0px;
}

.aXML {
    color: var(--modal-content-label-color)
}

.table.dataTable tr.dtrg-group th {
    background-color: var(--table-group-th);
    text-align: center;
    zoom: 1.1;
}

.modal-content.modal-content-filled{
    background: var(--modal-content-filled)
}

.modal-content.modal-content-filled label.control-label{
    color: var(--modal-content-filled-label-control-color)
}