.nowrapFL {
    white-space: nowrap;
}
.card-panel {
    margin: .5rem 7px 1rem 7px !important;
}
.card-panel-table {
    margin: .5rem 7px 1rem 7px !important;
    -webkit-transition: -webkit-box-shadow .25s;
    transition: -webkit-box-shadow .25s;
    transition: box-shadow .25s;
    transition: box-shadow .25s, -webkit-box-shadow .25s;
    padding: 24px;
    margin: 0.5rem 0 1rem 0;
    border-radius: 2px;
    background-color: #fff;
    overflow-x: auto;
}
.campoSwitch {
    padding: 5px;
}
    .campoSwitch > .switch {
        /*height: 3rem;*/
        margin-right: 30px;
        /*padding: 10px;*/
        /*width: 100%;
        margin-left: auto;
        left: auto;
        right: auto;
        float: left;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding: 0 .75rem;
        min-height: 1px;*/
    }
        .campoSwitch > .switch > span {
            width: 66.6666666667%;
            margin-left: auto;
            left: auto;
            right: auto;
            float: left;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            padding: 0 .75rem;
            min-height: 1px;
            white-space: nowrap;
        }
        .campoSwitch > .switch > label {
            width: 16.6666666667%;
            margin-left: auto;
            left: auto;
            right: auto;
            float: right;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            padding: 0 .75rem;
            min-height: 1px;
            z-index: 1;
            position: relative;
        }
    .campoSwitch .helper-text {
        height: 20px !important;
        position: absolute;
        top: 25px;
    }
    .campoSwitch .helper-text.error {
        color: #d32f2f !important;
    }
.switch label .lever {
    position: absolute !important;
}
/*.input-field.col label {
    z-index: -1;
}*/
.input-field .tituloFotos {
    position: sticky;
}
.input-field .fotos {
    /* height: 10rem; */
    height: 215px;
    padding: 10px;
    width: 100%;
    display: flex;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    overflow-y: hidden;
}
    .input-field .fotos .imagen {
        width: 7rem;
        height: 7rem;
        margin: 10px;
        background-color: white;
        border-radius: 5px;
        border: 1px solid #9e9e9d;
        flex-shrink: 0;
        scroll-snap-align: start;
        text-align: -webkit-center;
        line-height: 10rem;
        cursor: pointer;
    }
    .input-field .fotos .imagen img {
        max-width: 7rem;
        max-height: 7rem;
    }
        .input-field .fotos .imagen i {
            color: var(--color-texto-secundario);
        }
    .input-field .fotos .imagen:hover {
    }

table.responsive-table tfoot th {
    white-space: nowrap !important;
}

@media only screen and (max-width: 600px) {
    #toast-container {
        min-width: 94%;
        right: 3%;
        bottom: 60px;
    }
}

@media only screen and (min-width: 601px) and (max-width: 992px) {
    #toast-container {
        left: inherit;
        bottom: inherit;
        top: 4px !important;
        right: 75px !important;
        max-width: 90%;
    }
}

@media only screen and (min-width: 993px) {
    #toast-container {
        top: 4px !important;
        right: 75px !important;
        max-width: 86%;
    }
}

@media only screen and (max-width: 992px) {
    table.responsive-table th {
        height: 56px;
    }
    table.responsive-table tfoot th:empty {
       display:none;
       visibility:hidden;
    }
/*    table.responsive-table td:first-child {
        height: 100px;
    }*/
}
.container {
    width: 90% !important;
    max-width: initial !important;
}

@media only screen and (min-width: 993px) {
    .container {
        width: 90% !important;
    }
}

@media only screen and (min-width: 601px) {
    .container {
        width: 90% !important;
    }
}
.contenido-general .content > .row {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}
    .contenido-general .content > .row p {
        margin: 0px;
    }

.collapsible {
    border-top: 1px solid var(--color-fondo-secundario);
    border-right: 1px solid var(--color-fondo-secundario);
    border-left: 1px solid var(--color-fondo-secundario);
}
.collapsible-header {
    background-color: var(--color-fondo-principal);
    border-bottom: 1px solid var(--color-separadores);
}
.collapsible-body {
    border-bottom: 2px solid var(--color-principal-hover);
    background-color: var(--color-fondo-secundario);
}
.card-panel {
    background-color: var(--color-fondo-principal);
}
.card-panel-table {
    background-color: var(--color-fondo-principal);
}
table.striped > tbody > tr > td {
    vertical-align: middle;
}
.content table {
    border-collapse: collapse;
}
    .content table thead {
        position: sticky;
        top: -20px;
        z-index: 2;
        background-color: white;
    }
    .tfoot {
        position: sticky;
        bottom: -20px;
        z-index: 3;
        background-color: white;
        padding: 0px;
    }
    .tfoot-table {
        position: sticky;
        bottom: -5px;
        z-index: 3;
        background-color: white;
    }
    .content table tfoot{
        position: sticky;
        bottom: -6px;
        z-index: 1;
        background-color: white;
    }
    /* .content table tfoot tr{
        background-color: white;
    } */

        .tfoot .row,
        .content table tfoot .row {
            margin-bottom: initial;
        }
.fixed-title {
    position: sticky;
    top: -1px;
    z-index: 2;
    background-color: var(--color-fondo-principal);
}
.fixed-title2 {
    position: sticky;
    top: 134px;
    z-index: 1;
    background-color: var(--color-fondo-principal);
}
#NlistaDeProductos table {
    border-collapse: collapse;
}

    #NlistaDeProductos table thead {
        position: sticky;
        top: 0px;
        z-index: 2;
        background-color: var(--color-fondo-secundario);
    }
.btn-fullwidth{
    width:100%;
}
.hiddendiv {
    overflow: hidden;
    max-height: 90vh;
}
.tfoot-table {
    margin: .5rem 7px -1rem 8px !important;
}

.material-tooltip {
    border-radius: 10px;
}
/* .input-field>label {
    z-index: -1;
} */

.contenido-general .alert.alert-success {
    position: absolute;
    top: 45px;
    left: 75px;
    color: var(--color-texto-secundario);
}
.contenido-general .alert.alert-error {
    position: absolute;
    top: 45px;
    left: 75px;
    color: var(--color-texto-secundario);
}
:root {
    --heightcreensaver: 144px;
    --widthcreensaver: 144px;
}
#modal_IdleTime_BackGround {
    top:0px;
    left:0px;
    margin: 0px;
    padding: 0px;
    position: absolute;
    background-color: #000000bb;
    width: 100vw;
    height: 100vh;
    z-index: 99999998;
}

#modal_IdleTime {
    margin: 0px;
    padding: 0px;
    top:0px;
    left:0px;
    position: absolute;
    z-index: 99999999;
}
    #modal_IdleTime.publicidad {
        height: 100vh;
        width: 100vw;
/*        top: 5vh;
        left: 5vw;
        background: white;
        border-radius: 5px;
*/
        overflow:hidden;
    }
img.screensaver, div.screensaver {
    width: var(--widthcreensaver);
    height: var(--heightcreensaver);
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}
.x.screensaver {
    animation: xscreensaver 13s linear infinite alternate;
}

.y.screensaver {
    animation: yscreensaver 7s linear infinite alternate;
}

.publicidad {
/*    top: 2vh;
    left: 2vh;
    width: 96vw;
    height: 96vh;*/
}

@keyframes xscreensaver {
    100% {
        transform: translateX( calc(100vw - var(--widthcreensaver)) );
    }
}

@keyframes yscreensaver {
    100% {
        transform: translateY( calc(100vh - var(--heightcreensaver)) );
    }
}

/*INICIO DARKMODE*/

@media (prefers-color-scheme: dark) {
    body {
        --color-base: #121212;
        --color-base-menu: #212121;
        --color-fondo-importante: #505050;
        --color-fondo-principal: #383838;
        --color-fondo-secundario: #030409;
        --color-separadores: #5d5d5d;
        --color-desactivado: rgba(255, 255, 255, 0.38);
        --color-desactivado-texto: rgba(255, 255, 255, 0.38);
        --color-texto-principal: rgba(255, 255, 255, 0.87);
        --color-texto-secundario: rgba(255, 255, 255, 0.60);
        --color-waves: rgba(255, 255, 255, 0.4);

        --color-boton-desactivado: #5f5f5f;
        --color-boton-texto-desactivado: #7a7a7a;

        --color-principal-table-hover: rgba(var(--secundario), 0.3);
        /*--color-p-l: #383838;*/
    }

    /*body {
        background-color: var(--color-base-dark) !important;
    }*/

    /*.btn-flat {
        color: #fff !important;
    }*/

    input {
        color: #fff !important;
    }

    .fewLinesLogo {
        background-image: url('../images/Logo_AzulGrisClaro.png') !important;
    }

    .logoFewLinesChico {
        background-image: url('../images/Logo_AzulGrisClaro.png') !important;
    }

    .switch label .lever {
        background-color: rgba(255,255,255,0.38);
    }
    /*    .container.content {
        background-color: var(--color-fondo-importante) !important;
    }*/

    .grey-text.text-darken-4 {
        color: var(--color-texto-secundario) !important;
    }

    textarea.materialize-textarea {
        color: var(--color-texto-principal);
    }

    .modal {
        background-color: var(--color-fondo-importante);
    }

    .datepicker-table td.is-outside-current-month, .datepicker-table td.is-disabled {
        color: var(--color-desactivado-texto);
    }
    .conSaldo td:nth-child(5),
    .conSaldo td:nth-child(6) {
        color: #e53935;
    }
    .qrImageMode {
        filter: brightness(30%) contrast(140%);
    }
    .content table thead {
        background-color: var(--color-fondo-principal);
    }
    .tfoot, 
        .content table tfoot{
            background-color: var(--color-fondo-importante);
    }
    .ms-container .ms-selectable, .ms-container .ms-selection {
        background: rgb(0 0 0 / 20%);
        color: #555555;
        float: left;
        width: 45%;
    }
    .ms-container .ms-selectable li.ms-elem-selectable, .ms-container .ms-selection li.ms-elem-selection {
        border-bottom: 1px #eee solid;
        padding: 2px 10px;
        color: #fff;
        font-size: 14px;
    }
    .modal .modal-footer {
        border-radius: 0 0 2px 2px;
        background-color: transparent;
        padding: 4px 6px;
        height: 56px;
        width: 100%;
        text-align: right;
    }
}

@media (prefers-color-scheme: light) and (prefers-color-scheme: no-preference) {
    /*input {
        color: #000 !important;
    }*/
}
:root {
    --color-base: #f0f0f0;
    --color-base-menu: #fafafa;

    --color-fondo-importante: #e1e1e1; /* #e8e8e8; */
    --color-fondo-principal: #fff;
    --color-fondo-secundario: #ebedf8;/*#e8eaf6;*/
    --color-separadores: #d9d9d9;
    --color-desactivado: rgba(0, 0, 0, 0.38);
    --color-desactivado-texto: rgba(0, 0, 0, 0.38);
    --color-texto-principal: rgba(0, 0, 0, 0.87);
    --color-texto-secundario: rgba(0, 0, 0, 0.60);
    --color-waves: rgba(0, 0, 0, 0.4);
    /*--color-p-l: #fff;*/

    --color-boton-desactivado: #DFDFDF;
    --color-boton-texto-desactivado: #9F9F9F;
    --color-waves-s-l: rgba(0, 0, 0, 0.4);
    --principal: 63, 81, 181;
    --secundario: 255, 152, 0;
    --color-principal: rgb(var(--principal));
    --color-principal-hover: rgba(var(--principal), 0.8);
    --color-principal-table-hover: rgba(var(--principal), 0.2);
    --color-principal-desactivado: rgba(var(--principal), 0.6);
    --color-principal-texto: #fff;
    --color-secundario: rgb(var(--secundario));
    --color-secundario-light: rgba(var(--secundario), 0.7);
}
.card-panel {
    background-color: var(--color-fondo-principal) !important;
}
.modal {
    background-color: var(--color-fondo-principal);
}
.modal .modal-footer {
    background-color: var(--color-fondo-principal);
}
.select-box {
    border: 1px solid #ccc;
    background: #212121;
}
.select-elem{
    color: #FFFFFFCC;
}
.btn.disabled, .disabled.btn-large, .disabled.btn-small, .btn-floating.disabled, .btn-large.disabled, .btn-small.disabled, .btn-flat.disabled, .btn:disabled, .btn-large:disabled, .btn-small:disabled, .btn-floating:disabled, .btn-large:disabled, .btn-small:disabled, .btn-flat:disabled, .btn[disabled], .btn-large[disabled], .btn-small[disabled], .btn-floating[disabled], .btn-large[disabled], .btn-small[disabled], .btn-flat[disabled] {
    background-color: var(--color-boton-desactivado) !important;
    color: var(--color-boton-texto-desactivado) !important;
}
.btn.disabled i, .disabled.btn-large i, .disabled.btn-small i, .btn-floating.disabled i, .btn-large.disabled i, .btn-small.disabled i, .btn-flat.disabled i, .btn:disabled i, .btn-large:disabled i, .btn-small:disabled i, .btn-floating:disabled i, .btn-large:disabled i, .btn-small:disabled i, .btn-flat:disabled i, .btn[disabled] i, .btn-large[disabled] i, .btn-small[disabled] i, .btn-floating[disabled] i, .btn-large[disabled] i, .btn-small[disabled] i, .btn-flat[disabled] i {
    color: var(--color-boton-texto-desactivado) !important;
}
@media (prefers-color-scheme: dark) {
    .cyan.lighten-4 {
        background-color: #00606460 !important;
    }
    .orange.lighten-4 {
        background-color: #e6510060 !important;
    }
    .brown.lighten-4 {
        background-color: #3e272360 !important;
    }
    .blue.lighten-4 {
        background-color: #0d47a160 !important;
    }
    .light-green.lighten-4 {
        background-color: #33691e60 !important;
    }
}
/*PASAR TODOS LOS ELEMENTOS A ESTE CSS CON UN ESTILO QUE HAGA REFERENCIA AL TEMA EN EL BODY DEL HTML PRINCIPAL*/
.my-class .bar {
    background: var(--color-secundario);
    height: 2px;
}

.action_swipe button {
    background-color: var(--color-principal) !important;
    color: var(--color-principal-texto) !important;
}
.waves-effect .waves-ripple {
    background-color: var(--color-waves) !important;
}
table.striped > tbody > tr:nth-child(odd) {
    background-color: var(--color-fondo-importante) !important;
}
[type="checkbox"]:checked:disabled + span:before {
    border-right: 2px solid var(--color-desactivado) !important;
    border-bottom: 2px solid var(--color-desactivado) !important;
}
[type="checkbox"]:not(:checked):disabled + span:not(.lever):before {
    background-color: var(--color-desactivado) !important;
}
tr.mouseover,
table.highlight > tbody > tr:hover {
    /*background-color: rgba(242,242,242,0.5) !important;*/
    background-color: var(--color-principal-table-hover) !important;
}

[type="checkbox"].filled-in:checked + span:not(.lever):after {
    border: 2px solid var(--color-principal) !important;
    background-color: var(--color-principal) !important;
}

.ms-container .ms-list.ms-focus {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px var(--color-principal) !important;
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px var(--color-principal) !important;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px var(--color-principal) !important;
}

.ms-container .ms-selectable li.ms-hover,
.ms-container .ms-selection li.ms-hover {
    background-color: var(--color-secundario) !important;
}
.dropdown-content li > a, .dropdown-content li > span {
    color: var(--color-texto-principal) !important;
}
.select-dropdown.dropdown-content li.selected {
    background-color: var(--color-secundario) !important;
}
.dropdown-content {
    background-color: var(--color-fondo-importante) !important;
}
.select-wrapper input.select-dropdown:focus {
    border-bottom: 1px solid var(--color-principal) !important;
    -webkit-box-shadow: 0 1px 0 0 var(--color-principal) !important;
    box-shadow: 0 1px 0 0 var(--color-principal) !important;
}
input:not([type]):focus:not([readonly]),
input[type=text]:not(.browser-default):focus:not([readonly]),
input[type=password]:not(.browser-default):focus:not([readonly]),
input[type=email]:not(.browser-default):focus:not([readonly]),
input[type=url]:not(.browser-default):focus:not([readonly]),
input[type=time]:not(.browser-default):focus:not([readonly]),
input[type=date]:not(.browser-default):focus:not([readonly]),
input[type=datetime]:not(.browser-default):focus:not([readonly]),
input[type=datetime-local]:not(.browser-default):focus:not([readonly]),
input[type=tel]:not(.browser-default):focus:not([readonly]),
input[type=number]:not(.browser-default):focus:not([readonly]),
input[type=search]:not(.browser-default):focus:not([readonly]),
textarea.materialize-textarea:focus:not([readonly]),
div.search:focus
{
    border-bottom: 1px solid var(--color-principal) !important;
    -webkit-box-shadow: 0 1px 0 0 var(--color-principal) !important;
    box-shadow: 0 1px 0 0 var(--color-principal) !important;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--color-principal) !important;
}

::-webkit-scrollbar-thumb:active {
    background: var(--color-principal) !important;
}

[contenteditable="true"]:active,
[contenteditable="true"]:focus {
    outline: none;
    border-bottom: 2px solid var(--color-principal);
}

.input-field .prefix.active {
    color: var(--color-principal);
}
.input-field > label:not(.label-icon).active,
input:not([type]):focus:not([readonly]) + label,
input[type=text]:not(.browser-default):focus:not([readonly]) + label,
input[type=password]:not(.browser-default):focus:not([readonly]) + label,
input[type=email]:not(.browser-default):focus:not([readonly]) + label,
input[type=url]:not(.browser-default):focus:not([readonly]) + label,
input[type=time]:not(.browser-default):focus:not([readonly]) + label,
input[type=date]:not(.browser-default):focus:not([readonly]) + label,
input[type=datetime]:not(.browser-default):focus:not([readonly]) + label,
input[type=datetime-local]:not(.browser-default):focus:not([readonly]) + label,
input[type=tel]:not(.browser-default):focus:not([readonly]) + label,
input[type=number]:not(.browser-default):focus:not([readonly]) + label,
input[type=search]:not(.browser-default):focus:not([readonly]) + label,
textarea.materialize-textarea:focus:not([readonly]) + label {
    color: var(--color-desactivado-texto);
}
input:not([type]):disabled, input:not([type])[readonly="readonly"], input[type=text]:not(.browser-default):disabled, input[type=text]:not(.browser-default)[readonly="readonly"], input[type=password]:not(.browser-default):disabled, input[type=password]:not(.browser-default)[readonly="readonly"], input[type=email]:not(.browser-default):disabled, input[type=email]:not(.browser-default)[readonly="readonly"], input[type=url]:not(.browser-default):disabled, input[type=url]:not(.browser-default)[readonly="readonly"], input[type=time]:not(.browser-default):disabled, input[type=time]:not(.browser-default)[readonly="readonly"], input[type=date]:not(.browser-default):disabled, input[type=date]:not(.browser-default)[readonly="readonly"], input[type=datetime]:not(.browser-default):disabled, input[type=datetime]:not(.browser-default)[readonly="readonly"], input[type=datetime-local]:not(.browser-default):disabled, input[type=datetime-local]:not(.browser-default)[readonly="readonly"], input[type=tel]:not(.browser-default):disabled, input[type=tel]:not(.browser-default)[readonly="readonly"], input[type=number]:not(.browser-default):disabled, input[type=number]:not(.browser-default)[readonly="readonly"], input[type=search]:not(.browser-default):disabled, input[type=search]:not(.browser-default)[readonly="readonly"], textarea.materialize-textarea:disabled, textarea.materialize-textarea[readonly="readonly"] {
    color: var(--color-desactivado-texto) !important;
    border-bottom: 1px dotted var(--color-desactivado) !important;
}
.select-wrapper .caret {
    fill: var(--color-texto-secundario) !important;
}
.input-field .helper-text.field-validation-error {
    color: #d32f2f;
}
.input-field .helper-text {
    color: var(--color-desactivado-texto);
}
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, textarea:-webkit-autofill, textarea:-webkit-autofill:hover, textarea:-webkit-autofill:focus, select:-webkit-autofill, select:-webkit-autofill:hover, select:-webkit-autofill:focus {
    -webkit-animation-name: autofill;
    -webkit-animation-fill-mode: both;
}

@keyframes autofill {
    to {
        color: var(--color-texto-principal);
        background: transparent;
    }
}

.switch span {
    color: #9e9e9e;
}
/*.switch label input[type=checkbox]:checked + .lever:after {
    background-color: #26a69a; 
}
.switch label input[type=checkbox]:checked + .lever {
    background-color: #84c7c1; 
}
    .switch label .lever:before {
        background-color: rgba(38,166,154,0.15);
    }*/

    .switch label input[type=checkbox]:checked + .lever {
        background-color: rgba(var(--principal), 0.4);
    }

        .switch label input[type=checkbox]:checked + .lever:after {
            background-color: var(--color-principal); /*#311b92;*/ /*color boton ACTIVE*/
        }

input[type=checkbox]:checked:not(:disabled) ~ .lever:active::before,
input[type=checkbox]:checked:not(:disabled).tabbed:focus ~ .lever::before {
    background-color: rgba(var(--principal), 0.4);/*color de wave ACTIVE*/
}

[type="checkbox"]:checked + span:not(.lever):before {
    border-right: 2px solid var(--color-principal);
    border-bottom: 2px solid var(--color-principal);
}
table a {
    text-decoration: none;
    color: var(--color-texto-principal);
}
.datepicker-table td.is-selected {
    background-color: var(--color-principal) !important;
    color: #fff;
}
.datepicker-date-display {
/*    -webkit-box-flex: 1;
    -webkit-flex: 1 auto;
    -ms-flex: 1 auto;
    flex: 1 auto;*/
    background-color: var(--color-principal) !important;
/*    color: #fff;
    padding: 20px 22px;
    font-weight: 500;*/
}
.btn-floating.btn-flat i {
    color: var(--color-texto-secundario) !important;
}
.btn-floating.btn-flat:hover i {
    color: #fff !important;
}


.rightMenuButtonLite,
.leftMenuButtonLite {
    position: relative;
    cursor: pointer;
    display: inline-block;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    z-index: 1;
    width: 56px;
    height: 56px;
    padding: 0;
    border-radius: 50%;
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}
    .rightMenuButtonLite:hover,
    .leftMenuButtonLite:hover {
        -webkit-box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%), 0 1px 5px 0 rgb(0 0 0 / 20%);
        box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%), 0 1px 5px 0 rgb(0 0 0 / 20%);
    }


    .rightMenuButtonLite:focus, .rightMenuButtonLite,
    .leftMenuButtonLite:focus, .leftMenuButtonLite {
        background-color: #0000 !important;
        color: var(--color-principal) !important;
    }
        .rightMenuButtonLite i {
            color: var(--color-principal) !important;
        }
        .leftMenuButtonLite .nav-icon:after, .leftMenuButtonLite .nav-icon:before, .leftMenuButtonLite .nav-icon div {
            background-color: var(--color-principal) !important;
        }
    /*.leftMenuButton:focus, .leftMenuButton {
        background-color: var(--color-principal);
        color: var(--color-principal-texto);
    }*/
        .leftMenuButtonLite:before {
            border-radius: 0;
        }
.rightMenuButton,
.leftMenuButton {
    position: relative;
    cursor: pointer;
    display: inline-block;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    z-index: 1;
    width: 56px;
    height: 56px;
    padding: 0;
    border-radius: 50%;
    outline: 0;
    -webkit-box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%), 0 1px 5px 0 rgb(0 0 0 / 20%);
    box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%), 0 1px 5px 0 rgb(0 0 0 / 20%);
}
    .rightMenuButton:hover,
    .leftMenuButton:hover {
        background-color: var(--color-principal-hover) !important;
        color: var(--color-principal-hover) !important;
        -webkit-box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.3);
        box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.3);
    }

    .rightMenuButton:focus, .rightMenuButton,
    .leftMenuButton:focus, .leftMenuButton {
        background-color: var(--color-principal) !important;
        color: var(--color-principal-texto) !important;
    }
    .leftMenuButton:before {
        border-radius: 0;
    }


.rightMenuButtonLite:hover::after {
    color: var(--color-principal) !important;
}

.rightMenuButton::after,
.rightMenuButton:hover::after {
    color: #FFF !important;
}
.toast .toast-action {
    color: var(--color-secundario);
}

[type="radio"]:checked + span:after, [type="radio"].with-gap:checked + span:after {
    background-color: var(--color-principal) !important;
}

[type="radio"]:checked + span:after, [type="radio"].with-gap:checked + span:before, [type="radio"].with-gap:checked + span:after {
    border: 2px solid var(--color-principal) !important;
}
blockquote {
    border-left: 5px solid var(--color-secundario);
}
.nav-icon {
    margin: 17px 13px;

}

    .nav-icon:after,
    .nav-icon:before,
    .nav-icon div {
        background-color: #fff;
        border-radius: 3px;
        content: '';
        display: block;
        height: 4px;
        width: 30px;
        margin: 6px 0;
        transition: all .2s ease-in-out;
    }
    .nav-icon.active:before {
        transform: translateY(10px) rotate(135deg);
    }

    .nav-icon.active:after {
        transform: translateY(-10px) rotate(-135deg);
    }

    .nav-icon.active div {
        transform: scale(0);
    }
.leftMenu {
    position: fixed;
    padding: 10px;
    top: 0px;
    left: 0px;
    z-index: 2000;
}
    .leftMenu .buttons.ocultar {
        visibility: hidden;
        display: none;
    }

    /*.leftMenu.active {
        z-index: 2000;
    }*/
    .leftMenu.active .buttons {
        pointer-events: auto;
        -webkit-clip-path: circle(3000px at 40px 40px);
        clip-path: circle(3000px at 40px 40px);
    }


    .leftMenu .buttons {
        pointer-events: none;
        margin: 50px 0px;
        user-select: none;
        overflow: auto;
        position: fixed;
        top: 0px;
        left: 0px;
        height: 100vh;
        width: 100%;
        flex-direction: column;
        list-style: none;
        margin: 0px;
        background-color: var(--color-base-menu);
        /*background-color: var(--color-base);*/
        /*espacio a la izquierda del menu en el celular*/
        /*padding: 15px 15px 15px 65px;*/
        padding: 15px 15px 100px 15px;
        /*padding: 30px 5px 0px 5px;*/
        -webkit-clip-path: circle(0px at 40px 40px);
        clip-path: circle(0px at 40px 40px);
        transition: all .3s ease;
        /*text-align: center;*/
    }
@media (max-width: 1024px) { /*CENTRAR EN DISPOSITIVOS MEDIANOS Y MAS CHICOS*/
    .leftMenu .buttons {
        text-align: center;
        padding: 40px 80px 40px 80px;
    }

        .leftMenu .buttons .button {
            margin: 5px;
            padding: 10px;
            width: 240px;
            height: 100px;
            border-radius: 8px;
            transition: all 0.2s ease;
            display: inline-block;
            -webkit-flex-direction: column;
        }
            .botonMenu .icono,
            .leftMenu .buttons .button .icono {
                text-align: left;
                position: absolute;
            }

            .leftMenu .buttons .button .titulo {
                font-size: 12pt;
                font-weight: 700;
                text-align: left;
                /*height: 55px;*/
                line-height: 18pt;
                margin-left: 50px;
            }

            .leftMenu .buttons .button .descripcion {
                font-size: 10pt;
                margin-left: 50px;
                text-align: left;
                overflow: hidden;
                text-overflow: ellipsis;
                /*display: flex;*/
                justify-content: center;
                align-items: center;
                -webkit-line-clamp: 4;
                -webkit-box-orient: vertical;
                color: var(--color-texto-secundario);
                font-weight: 400;
            }
}
/*fin*/
@media (min-width: 1025px) {
    .leftMenu .buttons {
        text-align: center;
        padding: 40px 80px 40px 80px;
    }
        .leftMenu .buttons .button {
            margin: 5px;
            padding: 10px;
            width: 240px;
            height: 190px;
            border-radius: 8px;
            transition: all 0.2s ease;
            display: inline-block;
            -webkit-flex-direction: column;
        }
            .leftMenu .buttons .button .icono {
                text-align: center;
            }
            .leftMenu .buttons .button .titulo {
                font-size: 18pt;
                font-weight: 700;
                text-align: center;
                height: 55px;
                line-height: 18pt;
                display: flex;
                justify-content: center;
                align-items: center;
            }

            .leftMenu .buttons .button .descripcion {
                font-size: 10pt;
                text-align: center;
                overflow: hidden;
                text-overflow: ellipsis;
                display: flex;
                height: 70px;
                justify-content: center;
                align-items: center;
                -webkit-line-clamp: 4;
                -webkit-box-orient: vertical;
                color: var(--color-texto-secundario);
                font-weight: 400;
            }
}
/*fin*/

        .leftMenu .buttons .button.waves-effect .waves-ripple {
            background-color: var(--color-waves);
        }

        .leftMenu .buttons .button:hover {
            /*background-color: var(--color-base);*/
            -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
            box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
        }

            .leftMenu .buttons .button .icono i {
                font-size: 30pt;
                color: var(--color-texto-principal);
                /*font-weight: bold;*/
            }

    .leftMenu .buttons .title {
        /*margin: 0px 0px 0px 60px;*/
        font-size: 2em;
        text-align: center;
        color: var(--color-texto-secundario);
    }

    .leftMenu .buttons .card-panel {
        width: 100%;
        height: 150px;
    }
        .leftMenu .buttons .card-panel span {
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
        }


.leftMenu .circle-fix {
    width: 50px;
    height: 50px;
    padding: 13px 14px;
}

.leftMenu .buttons a {
    color: var(--color-texto-principal);
    text-decoration: none;
}

/*botones mas chicos al usar el estilo menuchico?*/
.menuchico .leftMenu .buttons {
    text-align: left;
    padding: 40px 80px 40px 80px;
}

    .menuchico .leftMenu .buttons .button {
        margin: 0px;
        padding: 5px;
        width: 240px;
        height: 100px;
        border-radius: 8px;
        transition: all 0.2s ease;
        display: inline-block;
        -webkit-flex-direction: column;
    }

        .menuchico .botonMenu .icono,
        .menuchico .leftMenu .buttons .button .icono {
            text-align: left;
            position: absolute;
            padding-top: 20px;
        }

        .menuchico .leftMenu .buttons .button .titulo {
            font-size: 12pt;
            float: left;
            width: 190px;
            text-align: left;
            height: auto;
            margin-left: 40px;
            justify-content: left;
            padding: 5px 0 0 5px;
        }

        .menuchico .leftMenu .buttons .button .descripcion {
            font-size: 10pt;
            float: left;
            width: 200px;
            text-align: left;
            height: auto;
            margin-left: 40px;
            justify-content: left;
            padding: 0 0 0 5px;
            overflow: hidden;
            text-overflow: ellipsis;
            justify-content: flex-start;
            align-items: flex-start;
            color: var(--color-texto-secundario);
            font-weight: 400;
        }
/*fin menuchico*/
.fewLinesLogo {
    background-image: url('/images/Logo_AzulGrisOscuro.png');
    width: 100%;
    height: 15vh;
    max-height: 100px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    margin-top: 50px;
    margin-bottom: 25px;
}

.logoFewLinesChico {
    background-image: url(/images/Logo_AzulGrisOscuro.png);
    width: 100%;
    height: 35px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    bottom: 15px;
    position: fixed;
    z-index: 499;
}

/*FIN DARKMODE*/
.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Opera and Firefox */
}

body {
    padding: 0px;
    margin: 0px;
    background-color: var(--color-base);
    color: var(--color-texto-principal);
}
.btn-floating:focus,
.btn-floating {
    background-color: var(--color-principal);
    color: var(--color-principal-texto);
}
    .btn-floating:hover {
        background-color: var(--color-principal-hover);
    }

.btn:focus,
.btn {
    background-color: var(--color-principal);
    color: var(--color-principal-texto);
}

    .btn:hover {
        background-color: var(--color-principal-hover);
    }

.btn-secondary {
    background-color: var(--color-secundario) !important;
    color: var(--color-principal-texto) !important;
}

    .btn-secondary:hover {
        background-color: var(--color-secundario-light) !important;
    }
    
.btn-flat {
    background-color: transparent;
    color: var(--color-texto-principal);
}

    .btn-flat:focus {
        background-color: var(--color-principal);
        color: var(--color-principal-texto);
    }

    .btn-flat:hover {
        background-color: var(--color-principal-hover);
        color: var(--color-principal-texto);
    }

.rightMenu {
    position: fixed;
    padding: 10px !important;
    bottom: inherit !important;
    top: 0px;
    right: 0px;
    z-index: 2000;
}
    .rightMenu ul {
        padding: 10px !important;
        top: 70px;
    }
.rightAdds {
    position: fixed;
    padding: 10px !important;
    bottom: 0px;
    right: 0px;
    z-index: 500;
}
    .rightAdds ul {
        padding-top: 10px;
    }
    
.card_swipe_parent {
    /*background-color: var(--color-s-l) !important;*/
    width: 320px;
    margin: auto;
    top: 5px;
}
.card {
    background-color: var(--color-fondo-principal);
}
.card-content {
    /*background-color: var(--color-s-l) !important;*/
}
/*.card-action {
    background-color: var(--color-principal) !important;
    color: var(--color-principal-texto) !important;
    font-weight: 400;
}*/
.card .card-action a:not(.btn):not(.btn-large):not(.btn-small):not(.btn-large):not(.btn-floating) {
    color: var(--color-principal-texto) !important;
    font-weight: 400;
}
.card .card-action {
    display: inherit !important;
    padding: 0px;
    white-space: nowrap;
}
.contenido-general .card .card-content > span {
    font-weight: 400 !important;
    font-size: 3rem !important;
    margin: 2.8rem 0 1.68rem 0 !important;
}
.card_swipe_parent {
    position: relative;
    overflow: hidden;
    height: 380px;
}
.card_swipe {
    position: absolute;
    width: 320px;
    transition: all 0.4s;
    top: 0px;
    bottom: 0px;
    margin: 0px;
    padding: 15px;
}
    .card_swipe .card-title {
        line-height: 60px !important;
    }
.action_swipe {
    position: absolute !important;
    bottom: 0px;
    left: 0px;
    right: 0px;
}
    .action_swipe button {
        width:50%;
    }
    .card_swipe:nth-of-type(1) {
        left: -320px;
    }

    .card_swipe:nth-of-type(2) {
        left: 320px;
    }
    .card_swipe.active {
        left: 0px;
    }


/*
@for $i from 0 through 1{
   input[type=radio]:nth-of-type(#{$i + 1}):checked {
      ~ .tabs .tab:nth-of-type(#{$i + 1}){
         box-shadow:inset (6 * $i) + -3px 2px 5px rgba(0, 0, 0, 0.25);
         color:#3F4C7F;
         .text{ transform:scale(0.9); }
      }
      
      ~ .pages{
         transform:translateX(-100% * $i);
         
         .page:nth-of-type(#{$i + 1}){
            .input { 
               opacity:1; 
               transform:translateX(0%); 
               transition:all 0.5s;
               @for $i from 1 through 5{
                  &:nth-child(#{$i}) { 
                     transition-delay:0.2s*$i
                  }
               }
            }
         }
      }
   }
}
    */

.container {
    position: absolute;
    margin-top: 70px;
    top: 0px;
    bottom: 60px;/*140px;*//*65px;*/
    right: 0px;
    left: 0px;
    overflow: auto;
}
    .container.content {
        -webkit-transition: -webkit-box-shadow .25s;
        transition: -webkit-box-shadow .25s;
        transition: box-shadow .25s;
        transition: box-shadow .25s, -webkit-box-shadow .25s;
        padding: 5px;
        /*            margin: 0.5rem 0 1rem 0;*/
        border-radius: 2px;
        background-color: var(--color-fondo-principal);
        -webkit-box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%), 0 1px 5px 0 rgb(0 0 0 / 20%);
        box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%), 0 1px 5px 0 rgb(0 0 0 / 20%);
    }
/*        .container.content table td:first-child:not(.search) {
            align-content: center;
            text-align: center;
        }*/
    .container.buscador {
        margin-top: 37px;
        padding: 10px;
        z-index: 11;
        position: absolute;
        height: 56px;
        overflow: hidden;
    }
        .container.buscador .input-field {
            margin-top: 0px;
            margin-bottom: 0px;
        }
    .container.conTotal {
        bottom: 240px;
    }

    .container.Total {
        position: absolute;
        bottom: 50px;
        right: 0px;
        left: 0px;
        overflow: auto;
        max-height: 180px;
        margin-top: inherit;
        top: inherit;
    }
    .container.title {
        position: relative;
        margin: 0px;
        padding: 0px 80px;
        width: 100vw !important;
        height: 50px;
        overflow: visible;
        text-align: center;
        background-color: transparent;
        color: var(--color-texto-secundario);
        z-index: 10;
    }
        .container.title h3 {
            margin: 15px 0px 0px 0px;
        }
/*    .container .title {
        position: fixed;
        top: 0px;
        left: 0px;
        margin-top: 0px;
        right: 0px;
        height: 80px;
        text-align: center;
        padding-top: 14px;
        -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
        box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
        background-color: var(--color-base);
        color: var(--color-texto-secundario);
        z-index: 10;
    }*/
.registrosHorarios {
    max-height: 700px;
    overflow: auto;
}

.logo img {
    max-width: 120px;
}
.logo {
    bottom: 15px;
    position: fixed;
    width: 100%;
    text-align: center;
    z-index:499;
}

.impresionPDF {
    z-index: -1;
    visibility: hidden;
    width: 200px;
    height: 200px;
    position: fixed;
    left: 0px;
    bottom: 0px;
}

::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

::-webkit-scrollbar-button {
    width: 0px;
    height: 0px;
}

::-webkit-scrollbar-thumb {
    background: #646464;
    border: 0px none #006be1;
    border-radius: 50px;
}

    ::-webkit-scrollbar-thumb:hover {
        background: #646464;
    }

    ::-webkit-scrollbar-thumb:active {
        background: #646464;
    }

::-webkit-scrollbar-track {
    background: transparent;
    border: 0px none #ffffff;
    border-radius: 50px;
}

    ::-webkit-scrollbar-track:hover {
        background: #c8c8c8;
    }

    ::-webkit-scrollbar-track:active {
        background: #c8c8c8;
    }

::-webkit-scrollbar-corner {
    background: transparent;
}

#NlistaDeProductos {
    display:none;
}
#NlistaDeProductosShort {
    display: block;
    overflow: auto;
    max-height: 500px;
    margin: 0 20px 0 20px;
}
    #NlistaDeProductos.active {
        display: block;
        z-index: 10;
        background-color: var(--color-fondo-secundario);
        position: absolute;
        top: -5px;
        width: 90vw;
        height: calc(100vh - 130px);
        margin: 75px 5vw 65px 5vw;
        overflow: auto;
        border-radius: 5px;
    }
/*.responsive-table tr {
    border-bottom: 1px solid var(--color-p);
}*/
.responsive-table td {
    min-height: 46px !important;
    /*white-space: nowrap;*//* SE VE MAL EN PRODUCTOS CON DESCRIPCIONES LARGAS EN PRODUCTOS>INDEX */
}
    .responsive-table td [type="checkbox"] + span:not(.lever) {
        height: 13px;
        line-height: 13px;
    }

@media only screen and (max-width: 992px) {
    table.responsive-table th, table.responsive-table td {
        padding: 15px 5px;
    }
}

.container.title .clear {
    position: absolute;
    top: 5px;
    right: 20px;
}
    .container.title .clear i {
        color: var(--color-texto-principal);
    }
    .container.title .clear:hover i {
        color: #fff !important;
    }

.milisegundos {
    font-size: smaller;
}
.rotate180 {
    transform: rotate(180deg);
}
/*
.users {
    z-index: 1000;
    visibility: hidden;
    display: none;
    width: 100%;
    height: 100%;
    padding: 50px;
    position: fixed;
    overflow: auto;
}

    .users.active {
        visibility: visible;
        display: initial;
    }
*/
.bloqueado {
    opacity: 0.8;
    cursor: default;
}
[contenteditable=true]:empty:before {
    content: attr(placeholder);
    color: var(--color-texto-secundario);
}
[contenteditable=true]:empty:focus:before {
    content: attr(placeholder);
    color: var(--color-desactivado-texto);
}
.text-bolder {
    font-weight: bold;
}
.contadorDeNotificaciones {
    position: relative;
}
    .contadorDeNotificaciones:before {
        position: absolute;
        width: 20px;
        height: 20px;
        content: attr(data-before-content);
/*        top: 3px;*/
        right: -20px;
        /*    background-color: #96969666;*/
        border: solid 1px #96969666;
        /*    background-color: var(--color-secundario-light);*/
        color: var(--color-texto-secundario);
        border-radius: 15px;
        font-weight: 600;
        line-height: 18px;
        text-align: center;
        font-size: 12px;
        font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
        white-space: nowrap;
        overflow: hidden;
        /*    -webkit-transition: width .1s, height .1s, transform .1s;
    -moz-transition: width .1s, height .1s, transform .1s;
    -ms-transition: width .1s, height .1s, transform .1s;
    -o-transition: width .1s, height .1s, transform .1s;
    transition: width .1s, height .1s, transform .1s;
*/
    }
.muestraDeposito {
    position: relative;
}

    .muestraDeposito:before {
        position: absolute;
        padding: 3px;
        content: attr(data-before-content);
        top: 0px;
        left: 10px;
/*        background-color: #96969666;*/
/*        border: solid 1px #96969666;*/
        /*    background-color: var(--color-secundario-light);*/
        color: var(--color-texto-secundario);
        border-radius: 15px;
        font-weight: 600;
        line-height: 5px;
        text-align: center;
        font-size: 10px;
        font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
        white-space: nowrap;
        overflow: hidden;
        /*    -webkit-transition: width .1s, height .1s, transform .1s;
    -moz-transition: width .1s, height .1s, transform .1s;
    -ms-transition: width .1s, height .1s, transform .1s;
    -o-transition: width .1s, height .1s, transform .1s;
    transition: width .1s, height .1s, transform .1s;
*/
    }

    /* .EstadoAfip {
        position: fixed;
        left: 0;
        height: 20px;
        background-color: #4caf50;
        text-align: center;
        font-size: 10pt;
        transform: translateY(100%);
        transition: transform 0.5s ease-in-out;
        border-radius: 10px;
        padding: 2px 10px 30px 20px;
        left: -10px;
        bottom: 0;
    } */
    
    /* .EstadoAfip.alerta,
    .EstadoAfip.error {
        transform: translateY(30%);
    }
    
    .EstadoAfip.alerta {
        background-color: #ffeb3b;
    }
    
    .EstadoAfip.error {
        background-color: #f44336;
    } */

    /* .AlertaAfip .EstadoAfip {
        position: relative;
        padding-left: 25px;
    } */
    
    .AlertaAfip .EstadoAfip::before {
        content: "warning";
        font-family: "Material Icons";
        position: absolute;
        right: 5px;
        top: 20px;
        transform: translateY(-50%);
        color: #f9a825;
        font-size: 22pt;
    }
    .AlertaAfip .textoAlertaAfip {
        color: #f9a825;
        font-style: italic;
    }
    .ErrorAfip .EstadoAfip::before {
        content: "error";
        font-family: "Material Icons";
        position: absolute;
        right: 5px;
        top: 20px;
        transform: translateY(-50%);
        color: #e53935;
        font-size: 22pt;
    }
    .ErrorAfip .textoAlertaAfip {
        color: #e53935;
        font-style: italic;
    }
    
    /* .EstadoAfipBoton {
        overflow: visible;
    } */

    .AlertaAfip .EstadoAfipBoton::before {
        content: "cloud_alert";
        font-family: "Material Symbols Outlined";
        position: absolute;
        right: 0;
        top: 0;
        bottom: 0;
        left: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        color: rgba(255, 255, 255, 0.9);
        background-color: #f9a825;
        font-size: 19pt;
    }
    .ErrorAfip .EstadoAfipBoton::before {
        content: "cloud_off";
        font-family: "Material Icons";
        position: absolute;
        right: 0;
        top: 0;
        bottom: 0;
        left: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        color: rgba(255, 255, 255, 0.9);
        background-color: #e53935;
        font-size: 17pt;
    }