/* PERSONALIZACIÓN */

:root {
    --primary-color: #214265;
    --secondary-color: #3498DB;
    --third-color: #39aafa;
    --fourth-color: #94bcc5;
    --fifth-color: #e0efff;
    --sixth-color: #1e4f8a;
    --seventh-color: #dddddd;
    --alert-background: white;
    --alert-background-hover: red;
    --alert-color: red;
    --alert-color-hover: white;
    --text-color: white;
}

.cajanegro .ui-panel-titlebar, .cajanegro .ui-datatable-header, .cajanegro .ui-paginator-bottom, .cajanegrocelda {
    background: linear-gradient(to right, var(--primary-color) 80%, darkgray) !important
}
.cajanegro-box {
    background: darkgray;
}
.cajanegrorojo .ui-panel-titlebar, .cajanegrorojo .ui-datatable-header, .cajanegrorojo .ui-paginator-bottom, .cajanegrorojocelda {
    background: linear-gradient(to right, var(--primary-color) 80%, darkred) !important;
}
.cajanegrorojo-box {
    background: darkred;
}
.cajablancorojo .ui-panel-titlebar, .cajablancorojo .ui-datatable-header, .cajablancorojo .ui-paginator-bottom, .cajablancorojocelda {
    background: linear-gradient(to right, var(--primary-color) 80%, red) !important;
}
.cajablancorojo-box {
    background: red;
}
.cajanegroazul .ui-panel-titlebar, .cajanegroazul .ui-datatable-header, .cajanegroazul .ui-paginator-bottom, .cajanegroazulcelda {
    background: linear-gradient(to right, var(--primary-color) 80%, blue) !important;
}
.cajanegroazul-box {
    background: blue;
}
.cajablancoazul .ui-panel-titlebar, .cajablancoazul .ui-datatable-header, .cajablancoazul .ui-paginator-bottom, .cajablancoazulcelda {
    background: linear-gradient(to right, var(--primary-color) 80%, deepskyblue) !important;
}
.cajablancoazul-box {
    background: deepskyblue;
}
.cajanegroverde .ui-panel-titlebar, .cajanegroverde .ui-datatable-header, .cajanegroverde .ui-paginator-bottom, .cajanegroverdecelda {
    background: linear-gradient(to right, var(--primary-color) 80%, darkgreen) !important;
}
.cajanegroverde-box {
    background: darkgreen;
}
.cajablancoverde .ui-panel-titlebar, .cajablancoverde .ui-datatable-header, .cajablancoverde .ui-paginator-bottom, .cajablancoverdecelda {
    background: linear-gradient(to right, var(--primary-color) 80%, lime) !important;
}
.cajablancoverde-box {
    background: lime;
}
.cajanegroamarillo .ui-panel-titlebar, .cajanegroamarillo .ui-datatable-header, .cajanegroamarillo .ui-paginator-bottom, .cajanegroamarillocelda {
    background: linear-gradient(to right, var(--primary-color) 80%, darkgoldenrod) !important;
}
.cajanegroamarillo-box {
    background: darkgoldenrod;
}
.cajablancoamarillo .ui-panel-titlebar, .cajablancoamarillo .ui-datatable-header, .cajablancoamarillo .ui-paginator-bottom, cajablancoamarillocelda {
    background: linear-gradient(to right, var(--primary-color) 80%, yellow) !important;
}
.cajablancoamarillo-box {
    background: yellow;
}
.cajanegronaranja .ui-panel-titlebar, .cajanegronaranja .ui-datatable-header, .cajanegronaranja .ui-paginator-bottom, cajanegronaranjacelda {
    background: linear-gradient(to right, var(--primary-color) 70%, orangered) !important;
}
.cajanegronaranja-box {
    background: orangered;
}
.cajablanconaranja .ui-panel-titlebar, .cajablanconaranja .ui-datatable-header, .cajablanconaranja .ui-paginator-bottom, cajablanconaranjacelda {
    background: linear-gradient(to right, var(--primary-color) 70%, orange) !important;
}
.cajablanconaranja-box {
    background: orange;
}

.boton-estado-turno{
    color: white !important;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    display: inline-block;
    vertical-align: middle;
    font-size: 8px;

}

.ui-button-text-only .ui-button-text {
    padding: 0 !important;
}





.seleccionado {
    border-color: #008000 !important;
    background-color: goldenrod !important;
}

.sobreturno {
    border-color: #008000 !important;
    background-color: goldenrod !important;
}

.turno_estado_A, .turno_estado_A.ui-state-hover {
    font-weight: bold !important;
}

.turno_estado_E, .turno_estado_E.ui-state-hover {
    color: red;
    text-decoration: none !important;
    font-weight: bold;
}

.turno_estado_I, .turno_estado_I.ui-state-hover {
    color: green;
    text-decoration: none;
}

.turno_estado_O, .turno_estado_O.ui-state-hover {
    color: grey;
    text-decoration: line-through;
}

.turno_estado_U, .turno_estado_U.ui-state-hover {
    color: orange;
    text-decoration: none !important;
    font-weight: bold;
}


.cama_ocupada {
    color: grey;
}
.aplicacion_estado_D {
    color: red;
}

.aplicacion_estado_P {
    color: goldenrod;
}

.aplicacion_estado_A {
    color: green;
}

.aplicacion_estado_N {
    text-decoration: line-through;
    color: red;
}

.aplicacion_estado_S {
    text-decoration: line-through;
    color: darkgray;
}

.aplicacion_estado_R {
    text-decoration: line-through;
    color: lightgray;
}

.aplicacion_estado_F {
    color: black;
}


.ocupado {
    border-color: lightcoral !important;
    background-color: lightcoral !important;
}

.simultaneo-disponible {
    border-color: #008e0c !important;
    background-color: #008e0c !important;
}

.simultaneo-completo {
    border-color: lightcoral !important;
    background-color: lightcoral !important;
    text-decoration: line-through !important;
}

.superpuesto {
    border-color: red !important;
    background: linear-gradient(to right, red, lightcoral);
}

.disponible {
    border-color: #3A87AD !important;
    background-color: #3A87AD !important;
}

.reservado {
    border-color: #05d4be !important;
    background-color: #05d4be !important;
}

.azul {
    border-color: blue !important;
    background-color: blue !important;
    color: white !important;
}
.row-hover:hover .azul {
    border-color: royalblue !important;
    background-color: royalblue !important;
}
.azulsuperpuesto {
    border-color: blue !important;
    background: linear-gradient(to right, red, blue);
}

.cian {
    color: black !important;
    border-color: cyan !important;
    background-color: cyan !important;
}

.row-hover:hover .cian {
    border-color: #63c0ba !important;
    background-color: #63c0ba !important;
}

.ciansuperpuesto {
    color: black !important;
    border-color: cyan !important;
    background: linear-gradient(to right, red, cyan);
}

.rojo {
    border-color: red !important;
    background-color: red !important;
    color: white !important;
}
.rojosecundario {
    background: white !important;
    border-color: red !important;
    color: red !important;
}
.verde {
    border-color: green !important;
    background-color: green !important;
    color: white !important;
}
.verdesecundario {
    background: white !important;
    border-color: green !important;
    color: green !important;
}
.verdesuperpuesto {
    border-color: green !important;
    background: linear-gradient(to right, red, green);
}
.gold {
    border-color: goldenrod !important;
    background-color: goldenrod !important;
    color: white !important;
}
.goldsecundario {
    background: white !important;
    border-color: goldenrod !important;
    color: goldenrod !important;
}

.lima {
    border-color: limegreen !important;
    background-color: limegreen !important;
}
.limasuperpuesto {
    border-color: limegreen !important;
    background: linear-gradient(to right, red, limegreen);
}

.amarillo {
    border-color: yellow !important;
    background-color: yellow !important;
    color: black !important;
}
.row-hover:hover .amarillo {
    border-color: gold !important;
    background-color: gold !important;
}

.amarillosuperpuesto {
    border-color: yellow !important;
    background: linear-gradient(to right, red, yellow);
    color: black !important;
}

.marron {
    border-color: brown !important;
    background-color: brown !important;
    color: white !important;
}
.marronsuperpuesto {
    border-color: brown !important;
    background: linear-gradient(to right, red, brown);
}
.negro {
    border-color: darkslategray !important;
    background-color: darkslategray !important;
    color: white !important;
    padding: 2px 4px 2px 4px !important;
}
.negrosuperpuesto {
    border-color: darkslategray !important;
    background: linear-gradient(to right, red, darkslategray);
}

.magenta {
    border-color: magenta !important;
    background-color: magenta !important;
}
.magentasuperpuesto {
    border-color: red !important;
    background: linear-gradient(to right, red, magenta);
}

.naranja {
    border-color: darkorange !important;
    background-color: darkorange !important;
}
.naranjasuperpuesto {
    border-color: darkorange !important;
    background: linear-gradient(to right, red, darkorange);
}

.bordo {
    border-color: indianred !important;
    background-color: indianred !important;
    color: white !important;
}
.bordosuperpuesto {
    border-color: indianred !important;
    background: linear-gradient(to right, red, indianred);
}



.cartel {
    padding: 1px 4px 1px 4px !important;
    text-align: center !important;
}

.no-laborable {
    border-color: #b8b8b8 !important;
    background-color: #b8b8b8 !important;
}

.no-laborable:hover {
    background-color: darkgray !important;
    color: darkgray;
}

.eliminar-no-laborable {
    border-color: #a94442 !important;
    background-color: #c9302c !important;
}

.eliminar-no-laborable:hover {
    background-color: #e60000 !important;
    color: #e60000;
}

.eliminar-turno, .ui-button-text-icon-left.eliminar-turno {
    border-color: #a94442 !important;
    color: red !important;
}

.eliminar-turno:hover, .ui-button-text-icon-left.eliminar-turno:hover  {
    background-color: red !important;
    color: white !important;
}

.botonheaderliquidacion {
    background: transparent !important;
    color: black !important;
    border-color: transparent !important;
    font-size: 1.2em !important;
    font-weight: bold !important;
}

.botonnoliquida {
    background: red !important;
    color: white !important;
    border-color: darkred !important;
    font-weight: bold !important;
}

.Anulado {
    color: #CCCCCC;
}

.Generado {
    color: #003fff;
}

.facturar {
    background: #2cbf2c !important;
}

.facturar:hover {
    background: limegreen !important;
    border-color: green !important;
}


.marcado {
    background: lightcoral !important;
}


.diferencia {
    color: white !important;
    background: #ff8800 !important;
}
.diferencia:hover {
    background: #ffc400 !important;
}

.botonrojoblanco, .pagar, .cobrar {
    color: white !important;
    background: #bb0000 !important;
}
.botonrojoblanco:hover, .pagar:hover, .cobrar:hover {
    background: red !important;
}

.whatsapp {
    background: #25D366 !important;
    color: white !important;
}
.whatsapp:hover {
    background: #4bd325 !important;
    filter: brightness(1.1) !important;
}

.skeleton {
    background: linear-gradient(90deg, #eeeeee 25%, #dddddd 50%, #eeeeee 75%);
    background-size: 200% 100%;
    animation: skeleton-loading 1.5s infinite;
    border-radius: 4px;
    height: 1.5rem;
    margin-bottom: 0.5rem;
}

@keyframes skeleton-loading {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

.practicado-nofacturable {
    background-color: #f7e7e7;
}

.ui-fieldset-content {
    word-break: break-all !important;
    white-space: normal !important;
    width: 100% !important;
}