/* Fuente */

@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');

/* Elementos generales */

* {
    font-family: "Lato", sans-serif;
}

textarea{
    resize: none;
}
/*---------------------------------------------------------*/
/*------------ Css added by Codemeg Designer ------------*/
/*-------------------------------------------------------*/
#myTableDetalleTickets_length label,
#myTableDetalleTickets_filter label,
table#myTableDetalleTickets thead,
table#myTableDetalleTickets tbody,
#myTableDetalleTickets_info,
#myTableDetalleTickets_previous,
#myTableDetalleTickets_next,
#myTableDetalleTickets_paginate span a,
#myTableDetalleTickets_length label,
#tablaTicketsCaja_length label,
#tablaTicketsCaja_filter label,
table#tablaTicketsCaja thead,
table#tablaTicketsCaja tbody,
#tablaTicketsCaja_info,
#tablaTicketsCaja_previous,
#tablaTicketsCaja_next,
#tablaTicketsCaja_paginate span a {
    color: black !important;
}

#contenedorTituloPrincipal h1 {
    color: #3388cc;
}

#cobro_ticket {
    background-color: rgb(91, 176, 210);
    color: white;
}

img#close:hover {
    cursor: pointer;
}

#tablaServicios_filter,
#tablaProductos_filter,
#tablaMarcas_filter,
#tablaClientes_filter,
#tablaEmpleados_filter,
#tablaTickets_filter,
#tablaFamilias_filter,
#tablaZonas_filter {
    margin-right: 1em;
    margin-top: 1em;
}

#tablaServicios_filter label,
#tablaServicios_filter label input,
#tablaProductos_filter label,
#tablaProductos_filter label input,
#tablaMarcas_filter label,
#tablaMarcas_filter label input,
#tablaClientes_filter label,
#tablaClientes_filter label input,
#tablaEmpleados_filter label,
#tablaEmpleados_filter label input,
#tablaTickets_filter label,
#tablaTickets_filter label input,
#tablaFamilias_filter label,
#tablaFamilias_filter label input,
#tablaZonas_filter label,
#tablaZonas_filter label input {
    color: white;
}

a.fc-event {
    width: 102% !important;
}

#myTableDetalleTickets_length label select,
#myTableDetalleTickets_filter label select,
#tablaTicketsCaja_length label select,
#tablaTicketsCaja_filter label select {
    color: white;

    background-color: #334651 !important;
}

body {
    font-size: 1em;
    line-height: 1.3;
}

a,
label {
    color: black;
}

#tablaServicios thead,
#tablaProductos thead,
#tablaClientes thead,
#tablaEmpleados thead,
#tablaFamilias thead,
#tablaZonas thead,
#tablaGrupos thead,
#tablaSubGrupos thead,
#tablaTickets thead {
    color: white !important;
}

.dropdown-content-gleevi {
    transform: translate3d(5px, 50px, 0px) !important;
}

a:hover {
    color: #5f522e;
}



#volver:hover {
    background-color: darkred;
}

/* #volver:hover,
#nuevoRegistro:hover {
    transform: translateY(-3px);
    box-shadow: 0 0.375em 0.75em rgba(0, 0, 0, 0.4);
} */



#nuevoRegistro:hover {
    background-color: #388e3c;
}





#contenedorTituloPrincipal {
    display: flex;
    align-items: center;
    padding: 0.625em 0.938em;
    background-color: rgba(255, 255, 255, 0.7);
    border-radius: 0.5em;
    margin-bottom: 1.25em;
}

#contenedorTituloPrincipal h1 {
    flex-grow: 1;
    margin-right: 0.938em;
    color: black;
}

#contenedorTituloPrincipal h1 {
    color: black;
}

#volver {
    display: flex;
    align-items: center;
    justify-content: center;
}

#volver img {
    width: 1.2em;
    height: 1.25em;
    margin-right: 0.5em;
    margin-bottom: 0.5em;
}

#nuevoRegistro {
    display: flex;
    align-items: center;
    justify-content: center;
}

#nuevoRegistro img {
    width: 1.5em;
    height: 1.5em;
    margin-right: 0.5em;
    margin-bottom: 0.3em;

}

#liFamilia,
#liZona {
    color: black;
    background-color: transparent;
}

#liFamilia.active,
#liZona.active {
    color: white;
    background-color: var(--main-section-color);
}

#main-menu {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
}

#tituloPrincipal {
    font-weight: 100;
}

#tituloPrincipal a {
    float: right;
    margin-top: 7px;
}

.tituloModal button {
    float: right;
    margin-top: 7px;
}

.tituloModal a {
    float: right;
    margin-top: 7px;
}

.ui-content {
    color: #000000;
    font-family: Helvetica;
    padding-top: 0em;
    padding: 1em;
}

/* Navbar container */
.navbar-gleevi {
    overflow: hidden;
    background-color: var(--main-section-color);
    font-family: Arial;
}

/* Links inside the navbar */
.navbar-gleevi a {
    float: left;
    font-size: 16px;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

/* The dropdown container */
.dropdown-gleevi {
    float: left;
    overflow: hidden;
}

/* Dropdown button */
.dropdown-gleevi .dropbtn-gleevi {
    font-size: 16px;
    border: none;
    outline: none;
    color: white;
    padding: 14px 16px;
    margin-top: 30px;
    background-color: inherit;
    font-family: inherit;
    /* Important for vertical align on mobile phones */
    margin: 0;
    /* Important for vertical align on mobile phones */
}

/* Add a red background color to navbar links on hover */
.navbar-gleevi a:hover,
.dropdown-gleevi:hover .dropbtn-gleevi {
    background-color: #4d5e65;
}

/* Dropdown content (hidden by default) */
.dropdown-content-gleevi {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content-gleevi a {
    float: none;
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
}

/* Add a grey background color to dropdown links on hover */
.dropdown-content-gleevi a:hover {
    background-color: #ddd;
}

/* Show the dropdown menu on hover */
.dropdown-gleevi:hover .dropdown-content-gleevi {
    display: block;
    top: auto;
    margin-left: 0px;
    margin-top: 0px;
}



body {
    background: var(--main-background-color);
}

.kt-portlet_img a {
    display: block;
}

.kt-portlet_img a img {
    max-width: 100%;
}

.kt-portlet_img {
    padding: 5px;
}

.kt-portlet_img img {
    width: 100%;
}

.Inicial {
    display: none;
}

.product_image {
    position: relative;
    margin-bottom: 13px;
    padding-top: 90%;
    background-size: cover;
    background-position: center center;
}

.product_image .descount_tag {
    position: absolute;
    top: 20px;
    left: 0;
    background: #8e7a38;
    padding: 2px 15px;
    color: #fff;
    font-weight: 500;
}

.kt-portlet_img .kt-portlet__head-title {
    font-size: 13px;
    position: relative;
    text-align: center;
    margin: 0 0 7px;
}

.kt-portlet_img h3.kt-portlet__head-title {
    font-size: 13px;
    text-align: left;
}

.kt-portletfijo {
    line-height: 1.25em;
    height: 3.75em;
    /* height is 2x line-height, so two lines will display */
    overflow: hidden;
    /* prevents extra lines from being visible */
}

.kt-portlet_img h4.kt-portlet__head-title {
    font-size: 16px;
    text-align: left;
}

.kt-header__topbar .kt-header__topbar-item.kt-header__topbar-item--user .kt-header__topbar-user img {
    border-radius: 50%;
    overflow: hidden;
    margin-right: 7px;
}

.kt-portlet_img .kt-portlet__head-title span {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 18px;
}

.kt-portlet_img p {
    margin: 0;
}

.kt-portlet_img p .product_number {
    background: #8e7a38;
    color: #fff;
    padding: 1px 10px;
    font-size: 10px;
    font-weight: 500;
}

.product_list .kt-portlet {
    margin-bottom: 20px;
}

.product_list_favorite {
    margin-left: 0.5rem;
    padding-top: 2rem;
}

.kt-header__topbar .kt-header__topbar-item.kt-header__topbar-item--user .kt-header__topbar-user img {
    border-radius: 50%;
    overflow: hidden;
    margin-right: 6px;
}

.product-overlay {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    overflow: hidden;
    z-index: 1000;
    background: rgba(0, 0, 0, 0.1);
    -webkit-animation: kt-animate-fade-in .3s linear 1;
    animation: kt-animate-fade-in .3s linear 1;
    opacity: 0;
    visibility: hidden;
}

.open-prodcut-details .product-overlay {
    opacity: 1;
    visibility: visible;
}

.kt-offcanvas-panel {
    transition: all 300ms;
}

.kt-offcanvas-panel-product-details ul.nav.nav-pills {
    display: flex;
    align-items: center;
}

.kt-offcanvas-panel-product-details ul.nav.nav-pills li.nav-item {
    margin: 0;
    width: 62px;
    padding: 5px;
    text-align: center;
    margin-left: 10px;
}

.kt-offcanvas-panel-product-details ul.nav.nav-pills li span {
    display: block;
    text-align: center;
}

.kt-offcanvas-panel-product-details ul.nav.nav-pills li span i {
    font-size: 22px;
}

.cart-product-list ul {
    padding: 0;
    margin: 0;
}

.cart-product-list ul li {
    display: block;
}

.tt-procut-name h3.kt-portlet__head-title {
    font-size: 14px;
    position: relative;
    padding-right: 100px;
}

.tt-dlt-sec {
    background: #eee;
    padding: 15px 20px;
    font-weight: 500;
    font-size: 14px;
    margin-bottom: 20px;
}

.tt-procut-name h3.kt-portlet__head-title span.price_right {
    position: absolute;
    top: 0;
    right: 0;
}

.tt-dlt-sec p {
    margin: 0;
}

.cart-product-list ul li+li {
    border-top: 1px solid #ddd;
    padding-top: 12px;
}

.tt-procut-name h3.kt-portlet__head-title em {
    font-style: normal;
    padding-left: 5px;
    color: #111110;
}

.tif_bottom {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: #231f18;
    color: #fff;
    font-size: 14px;
    text-transform: capitalize;
}

.tif_bottom .tb-inner {
    display: flex;
    padding: 15px 20px;
    align-items: center;
}

.tif_bottom .tb-inner .tbi-left,
.tif_bottom .tb-inner .tbi-right {
    width: 50%;
}

.tif_bottom .tb-inner .tbi-right {
    text-align: right;
}

.tbi-right span {
    display: block;
}

.kt-offcanvas-panel-product-details {
    padding-top: 76px;
}

.kt-offcanvas-panel-product-details .kt-offcanvas-panel__nav {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: 0;
    padding: 13px 20px 9px;
}

.kt-offcanvas-panel-product-details .kt-offcanvas-panel__body {
    height: 100%;
    padding: 0 0 75px;
}

.kt-offcanvas-panel-product-details .kt-offcanvas-panel__body .tab-content {
    padding: 20px;
    max-height: 100%;
    overflow: auto;
}

.kt-offcanvas-panel-product-details ul.nav.nav-pills li.nav-item a {
    cursor: pointer;
}

h2.main-head {
    font-size: 22px;
    margin: 10px 0 0;
}

.kt-aside__brand-logo a {
    display: block;
    padding: 10px 0;
}

.kt-aside--minimize .kt-aside,
.kt-aside--fixed.kt-aside--minimize-hover .kt-aside {
    width: 78px !important;
}

.kt-aside--minimizing .kt-aside .kt-aside-menu .kt-menu__nav {
    width: auto;
}

.kt-aside--minimizing .kt-aside .kt-aside-menu .kt-menu__nav {
    width: auto;
}

.kt-aside-menu .kt-menu__nav>.kt-menu__item>.kt-menu__link i {
    display: inline-block !important;
    text-align: center;
    font-size: 30px !important;
}

.kt-aside--minimize .kt-aside-menu .kt-menu__nav>.kt-menu__item>.kt-menu__link .kt-menu__link-text,
.kt-aside-menu .kt-menu__nav>.kt-menu__item.kt-menu__item--here>.kt-menu__link .kt-menu__link-text {
    display: block;
    padding-top: 7px;
    font-size: 11px !important;
}

.kt-aside-menu .kt-menu__nav>.kt-menu__item>.kt-menu__link {
    padding: 15px 5px;
    display: block;
    text-align: center;
}

.kt-aside-menu,
.kt-aside__brand {
    background-color: #231f18;
}

.kt-aside-menu .kt-menu__nav>.kt-menu__item.kt-menu__item--here>.kt-menu__heading,
.kt-aside-menu .kt-menu__nav>.kt-menu__item.kt-menu__item--here>.kt-menu__link {
    background-color: #25211a;
}

.kt-aside {
    background-color: #231f18;
}

.kt-header .kt-header__topbar .kt-header__topbar-item .kt-header__topbar-icon i,
.kt-header .kt-header__topbar .kt-header__topbar-item.kt-header__topbar-item--user .kt-header__topbar-user .kt-header__topbar-welcome {}

.kt-header .kt-header__topbar .kt-header__topbar-item.kt-header__topbar-item--user .kt-header__topbar-user .kt-header__topbar-username {
    color: #6d501e;
}

.kt-badge.kt-badge--brand {
    background: var(--main-section-color);
    font-size: 10px;
    color: black;
}

.kt-header .kt-header__topbar .kt-header__topbar-item:hover .kt-header__topbar-icon i,
.kt-header .kt-header__topbar .kt-header__topbar-item.show .kt-header__topbar-icon i {
    color: #7b5a20;
}

.kt-header .kt-header__topbar .kt-header__topbar-item:hover .kt-header__topbar-icon,
.kt-header .kt-header__topbar .kt-header__topbar-item.show .kt-header__topbar-icon,
.kt-header .kt-header__topbar .kt-header__topbar-item:hover.kt-header__topbar-item--user .kt-header__topbar-user,
.kt-header .kt-header__topbar .kt-header__topbar-item.show.kt-header__topbar-item--user .kt-header__topbar-user {
    background-color: #f3eee6;
}

.btn.btn-label-brand {
    background-color: rgb(243, 238, 230);
    color: #6e5221;
}

.kt-header__top-left-id {
    position: absolute;
    top: 0;
    left: 160px;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.kt-header__top-left-id a {
    display: block;
    font-weight: 500;
    padding: 5px 14px;
    border-radius: 3px;
    transition: all 300ms;
}

.kt-header__top-left-id a:hover {
    background-color: #f3eee6;
    color: #725625;
}


.kt-quick-search.kt-quick-search--dropdown .kt-quick-search__wrapper {
    background: #fff;
    margin: 0;
    padding: 10px 15px;
}

.kt-quick-search.kt-quick-search--result-compact .kt-quick-search__result .kt-quick-search__section {}

.kt-quick-search .kt-quick-search__result {}

.kt-quick-search .kt-quick-search__result .kt-quick-search__item .kt-quick-search__item-wrapper .kt-quick-search__item-title:hover {}

.kt-quick-search .kt-quick-search__result .kt-quick-search__item .kt-quick-search__item-wrapper .kt-quick-search__item-title,
.form-control {
    color: #231f18;
}

.kt-quick-search .kt-quick-search__result .kt-quick-search__item .kt-quick-search__item-wrapper .kt-quick-search__item-desc {
    color: #716e63;
}

.kt-quick-search .kt-quick-search__result .kt-quick-search__category {
    color: #75673e;
}


.kt-quick-search.kt-quick-search--result-compact .kt-quick-search__result .kt-quick-search__item .kt-quick-search__item-img.kt-quick-search__item-img--file,
.kt-quick-search.kt-quick-search--result-compact .kt-quick-search__result .kt-quick-search__item .kt-quick-search__item-img {}

.kt-quick-search.kt-quick-search--dropdown {
    padding-top: 18px;
    border-right: 1px solid #ddd;
}

.kt-header__topbar-item.notification .dropdown-menu {
    top: 100% !important;
    left: initial !important;
    right: -20px !important;
    transform: translate(0, 0) !important;
}

.kt-spinner.kt-spinner--brand:before {
    border-color: var(--main-section-color);
    border-right-color: transparent;
}

.kt-quick-search .kt-quick-search__form .input-group {
    width: 230px
}

.kt-nav .kt-nav__item>.kt-nav__link .kt-nav__link-icon,
.kt-nav .kt-nav__item>.kt-nav__link .kt-nav__link-text {
    color: #ab9e76;
}

.kt-nav .kt-nav__item.active>.kt-nav__link .kt-nav__link-icon,
.kt-nav .kt-nav__item.active>.kt-nav__link .kt-nav__link-text,
.kt-nav .kt-nav__item.active>.kt-nav__link .kt-nav__link-arrow,
.kt-nav .kt-nav__item:hover:not(.kt-nav__item--disabled):not(.kt-nav__item--sub)>.kt-nav__link .kt-nav__link-icon,
.kt-nav .kt-nav__item:hover:not(.kt-nav__item--disabled):not(.kt-nav__item--sub)>.kt-nav__link .kt-nav__link-text,
.kt-nav .kt-nav__item:hover:not(.kt-nav__item--disabled):not(.kt-nav__item--sub)>.kt-nav__link .kt-nav__link-arrow {
    color: #634716;
}

.kt-nav .kt-nav__item.active>.kt-nav__link,
.kt-nav .kt-nav__item:hover:not(.kt-nav__item--disabled):not(.kt-nav__item--sub)>.kt-nav__link {
    background-color: #f3eee6;
}

.kt-label-font-color-2 {
    color: #826f2d !important;
}

.kt-header__topbar-item.dropdown.article-menu {
    align-items: center;
    margin-left: 10px;
}

.article-menu .kt-header__topbar-user {
    padding: 15px 20px;
    display: block;
    height: 50px;
    border-radius: 40px;
}

.article-menu .kt-header__topbar-user:hover {
    background: #f3eee6;
}

.kt-header__topbar-item.dropdown.article-menu {
    align-items: center;
    margin-left: 10px;
}

.article-menu .kt-header__topbar-user {
    padding: 15px 20px;
    display: block;
    height: 50px;
    border-radius: 40px;
}

.article-menu .kt-notification {
    margin: 0 !important;
    height: auto !important;
}



.main-seperator {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    padding-bottom: 10px;
    margin-bottom: 25px;
}

.single-icon {
    font-size: 16px;
}

.single-icon-big {
    font-size: 24px;
}

.left-icon {
    left: 10px;
}

.right-icon {
    margin-top: 3px;
}

.single-icon label {
    display: block;
    position: relative;
    margin: 0;
}

.single-icon label input[type="checkbox"] {
    position: absolute;
    top: 0;
    left: 0;
    cursor: pointer;
    width: 100%;
    height: 100%;
    opacity: 0;
}

.single-icon label input[type="checkbox"]~span {
    color: #988b64;
    cursor: pointer;
    transition: all 300ms;
}

.single-icon i {
    text-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
}

.single-icon label input[type="checkbox"]:checked~span {
    color: #f33;
}

.favourite-share-icons {
    position: absolute;
    top: 8px;
    right: 8px;
}

.protion_bnrs {
    position: absolute;
    top: 8px;
    left: 0;
    width: 70px;
}

.protion_bnrs span {
    display: inline-block;
    padding: 5px 10px;
    font-weight: 500;
    color: #fff;
}

.protion_bnrs span+span {
    margin-top: 8px;
}

.price_bnrs {
    position: absolute;
    top: 140px;
    left: 80px;
    width: 70px;
}

.price_bnrs span {
    display: inline-block;
    padding: 5px 10px;
    font-weight: 500;
    color: #000;
    width: max-content;
    font-size: 14px;
}

.favorite {
    opacity: 0;
    transition: all 300ms;
    display: block;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    height: 30px;
    background: url(../media/icons/CorazonDoradoSVG.svg) no-repeat;
    padding-left: 25px;
}

.kt-portlet_img:hover .favorite {
    opacity: 1;
}

.single-icon label input[type="checkbox"]:checked~.favorite {
    background: url(../media/icons/CorazonRojoSVG.svg) no-repeat !important;
    opacity: 0.5;
}

.kt-portlet_img:hover .single-icon label input[type="checkbox"]:checked~.favorite {
    opacity: 1;
}

.share {
    opacity: 0;
    transition: all 300ms;
    display: block;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    height: 30px;
    background: url(../media/icons/Compartir.png) no-repeat;
    padding-left: 25px;
}

.kt-portlet_img:hover .share {
    opacity: 1;
}

.redes {
    width: 100px;
    margin: 10px;
    display: inline-flex;
}

.stock_bnrs {
    position: absolute;
    top: 45%;
    left: 75%;
    width: 40px;
}

.price_bnrs span+span {
    margin-top: 8px;
}

.price {
    font-size: 15px;
}

.price_strike {
    font-size: 10px;
    text-decoration: line-through;
}

.discount_per {
    background: #e99a76;
}

.new_product {
    background: #54b4cf;
}

.single-icon label input[type="checkbox"]:checked .kt-portlet_img .heartGold {
    display: none;
}

.single-icon label input[type="checkbox"]:checked .kt-portlet_img .heartRed {
    width: 30px;
    float: right;
}

.kt-portlet_img .heartGold {
    width: 30px;
    float: right;
}

.kt-portlet_img .heartRed {
    display: none;
}

.Oxcoins {
    color: #92ca4b;
    font-size: 20px;
    font-weight: 700;
    margin-left: 15px;
}

.atributo_talla {
    font-size: 17px;
    border: 1px solid black;
    padding: 2px 4px 2px 4px;
    width: max-content;
    text-align: center;
}

.atributo_talla_select {
    background-color: #54b4cf;
}

.atributo_ {
    margin-right: 14px;
}

.FPago {
    font-size: 20px;
}

.error {
    color: red;
    font-size: 13px;
}

.LabelFPago {
    font-size: 18px;
}

.atributo_color {
    color: white;
    background-color: white;
    font-size: 17px;
    padding: 2px 4px 2px 4px;
    width: max-content;
    text-align: center;
    opacity: 0.75;
    border-bottom: 2px solid gray;
}

.atributo_color_select {
    border: 2px dashed black;
}

.owl-prev,
.owl-next {
    position: absolute;
    top: 45%;
    transform: translateY(-45%);
}

span.button.owl-next {
    font-size: 20px;
}

.owl-prev {
    left: -2rem;
}

.owl-next {
    right: -2rem;
}

.owl-theme .owl-dots .owl-dot span {
    width: 20px;
    height: 20px;
}

.kt-link {
    cursor: pointer;
}

@media screen and (min-width: 1025px) and (max-width: 1260px) {
    .kt-header__top-left-id {
        display: none;
    }
}

@media screen and (min-width: 1025px) {
    .kt-offcanvas-panel--right .kt-offcanvas-panel.kt-offcanvas-panel-product-details {
        width: 320px !important;
        right: 0 !important;
    }

    .mobile-menu {
        display: none;
    }

    #kt_wrapper,
    #kt_header {}

    .open-prodcut-details .product-overlay,
    .kt-offcanvas-panel-product-details .kt-offcanvas-panel__close {
        display: none;
    }
}

@media screen and (max-width: 1024px) {
    .kt-offcanvas-panel .kt-offcanvas-panel__body .kt-offcanvas-panel__content {
        padding: 0;
        margin: 0;
    }

    .kt-offcanvas-panel-product-details {
        padding-top: 85px;
    }

    .desktop-menu {
        display: none;
    }

    .kt-header-mobile {
        background-color: #231f18;
    }

    .kt-header-mobile .kt-header-mobile__toolbar .kt-header-mobile__toolbar-topbar-toggler i {
        color: var(--main-section-color)
    }

    .kt-header-mobile .kt-header-mobile__toolbar .kt-header-mobile__toolbar-toggler span,
    .kt-header-mobile .kt-header-mobile__toolbar .kt-header-mobile__toolbar-toggler span::before,
    .kt-header-mobile .kt-header-mobile__toolbar .kt-header-mobile__toolbar-toggler span::after {
        background: var(--main-section-color);
    }

    .kt-quick-search.kt-quick-search--dropdown {
        padding-top: 9px;
    }

    .article-menu .kt-header__topbar-user {
        padding: 9px 20px;
        height: 35px;
    }
}

@media screen and (max-width: 1024px) {
    .kt-offcanvas-panel--right .kt-offcanvas-panel.kt-offcanvas-panel-product-details {
        width: 280px !important;
    }

    .kt-offcanvas-panel-product-details ul.nav.nav-pills li.nav-item {
        width: 45px;
    }

    .kt-header__top-left-id {
        left: 5px
    }

    .kt-aside-close {
        background-color: #f3eee6;
    }

}

@media screen and (max-width: 500px) {
    .kt-offcanvas-panel-product-details ul.nav.nav-pills li {
        display: none;
    }

    .kt-offcanvas-panel-product-details ul.nav.nav-pills li.nav-item {
        display: block;
        width: 75px;
    }

    .kt-portlet_img {
        padding: 3px;
    }

    .kt-portlet_img .kt-portlet__head-title {
        margin: 0 0 10px;
    }

    .kt-header__top-left-id a {
        padding: 5px;
        font-size: 10px;
    }

    .kt-header__top-left-id {
        display: none;
    }
}

.promo[type="checkbox"]:not(old)+label {
    background: url("../media/icons/promoo_grey.svg") no-repeat 0 0;
    cursor: pointer;
    padding-left: 20px;
    color: white;
}

.promo[type="checkbox"]:not(old):checked+label {
    background: url("../media/icons/promoo.svg") no-repeat 0 0;
    color: white;
}

.place[type="checkbox"]:not(old)+label {
    background: url("../media/icons/place_grey.svg") no-repeat 0 0;
    cursor: pointer;
    padding-left: 10px;
    color: white;
}

.place[type="checkbox"]:not(old):checked+label {
    background: url("../media/icons/place.svg") no-repeat 0 0;
    color: white;
}

.price-tag[type="checkbox"]:not(old)+label {
    background: url("../media/icons/price-tag_grey.svg") no-repeat 0 0;
    cursor: pointer;
    padding-left: 20px;
    color: white;
}

.price-tag[type="checkbox"]:not(old):checked+label {
    background: url("../media/icons/price-tag.svg") no-repeat 0 0;
    color: white;
}

#usuariosAgenda {
    border-radius: 5px;
}

#AgendaModal {
    overflow-y: hidden !important;
    width: 100% !important;
}

.agenda {
    min-width: 75% !important;
    padding-top: 0px !important;
    margin-top: 0px !important;
}



.fc-event {
    cursor: pointer;
}

.fc-timegrid-event {
    width: 70% !important;
    display: inline-flex !important;
}

/*
    .fc-scroller-liquid-absolute{
        overflow: inherit !important;
    }*/

.imagenTicket {
    width: 15px !important;
    border-radius: 2px;
    position: relative;
    top: 0;
    bottom: 0;
    left: 70%;
    height: 100%;
    cursor: pointer !important;
    margin-left: 5px !important;
}

.imagenTicketPopover {
    width: 20px !important;
    border-radius: 2px;
    top: 0;
    bottom: 0;
    height: 100%;
    cursor: pointer !important;

}

.fc-timegrid-more-link {
    right: -3% !important;
}

#bannerTicket {
    position: absolute;
    bottom: 70px;
}

.bannerTicketImg {
    height: 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: 15% !important;
    margin-bottom: 2px;
    cursor: pointer;
}

.bannerHeaderImg {
    height: 100% !important;
    width: 100% !important;
    max-width: 50% !important;
}

#bannerTicketText {
    margin-bottom: 0px !important;
}

#bannerHeaderImg2 {
    border-left: 2px solid white;
}

#bannerHeader {
    display: none;
    border-bottom: 1px solid black;
    background-color: white;
}

#divEstetica {
    margin-top: -2% !important;
}

#productButtons {
    margin-left: 50% !important;
}

@media screen and (min-width: 300px) and (max-width: 1400px) {
    #productButtons {
        margin-left: 35% !important;
    }
}

#headerButtons {
    padding: 0 10px;
    min-height: 70px;
}

#headerButtonStats {
    padding: 0 10px;
    min-height: 70px;
    margin-left: 1rem;
}

.lista_estetica {
    padding: 1rem 1rem;
}

.bloque {
    display: block !important;
}

#tabla_estadistica {
    width: 100%;
    margin: 1rem 1rem;
}

#tabla_estadistica th:hover {
    cursor: pointer;
}

.lista_estetica:hover {
    cursor: pointer;
}

.nav-item {
    cursor: pointer;
}

.product_image {
    cursor: pointer;
}

.date_estadistica {
    margin-left: 1rem !important;
}

.chartjs-render-monitor {
    font-family: dosis;
}

#logoEprox {
    cursor: pointer;
}

#observaciones {
    height: 100px !important;
}

.ticket-top {
    margin: 0 0 0 0 !important;
}

.paddingTicket {
    left: 0px !important;
    padding: 5px 20px 5px 20px !important;
}

.paddingTicket2 {
    left: 0px !important;
    padding: 0px 20px 5px 20px !important;
}

.paddingTicketTop {
    padding: 1.5rem !important;
}

.padding0 {
    padding: 0px !important;
}

.paddingLeft0 {
    padding-left: 0px !important;
}

.paddingTop0 {
    padding-top: 0px !important;
}

.titulo_barcode {
    min-height: 80px !important;
}

.barcode-footer {
    border-top: 0px !important;
}

.barcodePosition {
    position: relative !important;
    left: -0.7rem !important;
    top: -1rem !important;
}

.marginLeft14 {
    margin-left: 1.4rem !important;
}

.marginRight3 {
    right: -3rem !important;
}

.AgendaLeft {
    left: -7% !important;
}

.ticketMobile {
    display: block !important;
}

.marginRight4 {
    right: -4rem !important;
}


.width12 {
    width: 12rem !important;
}

.marginLeft0 {
    margin-left: 0px !important;
}

.nav-link {
    padding: 0.75rem 1.25rem 0.75rem 1.25rem !important;
}

.articuloEstadistica {
    cursor: pointer;
}


.lista_estetica {
    margin-right: 0.5rem;
}

.kt-portlet_img {
    padding: 0px !important;
}

#estetica {
    margin-left: 2rem !important;
}


.imgSalonEstetica {
    cursor: pointer;
}

.barcodeContentHeight {
    height: 32%;
}

.menuTicketMobile {
    right: 0 !important;
}

.headerButtonsRight {
    margin-top: -7rem !important;
}

.botonesTicket {
    cursor: pointer;
}

@media screen and (min-width: 1810px) {
    #ClienteTab {
        width: 40.5rem !important;
    }
}

@media screen and (max-width: 1760px) {
    #ClienteTab {
        width: 30rem !important;
    }
}

@media screen and (min-width: 1760px) and (max-width: 1810px) {
    #ClienteTab {
        width: 35rem !important;
    }
}

.ClientesModal {
    width: 25% !important;
    left: 20rem !important;
}

#botonesListaProductos {
    width: 90%;
}

#ClienteTab {
    box-shadow: 0px 0px 40px 0px rgb(82 63 105 / 10%);
    padding: 0px 0px 0px 0px !important;
}


.clienteSel {
    padding: 5px 20px 5px 20px !important;
}

.clientesHead {
    min-height: 0px !important;
    padding: 1.5rem !important;
}

#EventoModal {
    overflow-y: scroll !important;
}

#servicioEvento {
    display: flex !important;
    padding-left: 10px !important;
}

#articulosAgenda {
    padding-left: 10px !important;
    cursor: pointer;
}

#articulosAgendaFinal {
    padding-left: 10px !important;
}

#servicioEventoSubheader2 {
    padding-left: 10px !important;
}

.btn-eprox-success {
    background-color: #47996b !important; /*Color Previo: #E4E6EF*/
    border-color: var(--main-section-color);
    color: white;
}

.btn-eprox-success:hover {
    /* background-color: #B5B5C3 !important; */
    color: black;
}

.fc-Usuarios-button {
    background-color: var(--main-section-color) !important;
    border-color: var(--main-section-color) !important;
}

.fc-prev-button {
    background-color: var(--main-section-color) !important;
    border-color: var(--main-section-color) !important;
}

.fc-timegrid-more-link {
    background-color: #e3d29f !important;
    border-color: #e3d29f !important;
}

/*#usuariosAgenda {
        background-color:#f5ecd0 !important;
        border-color:#f5ecd0 !important;
    }*/


.fc-next-button {
    background-color: var(--main-section-color) !important;
    border-color: var(--main-section-color) !important;
}

.fc-today-button {
    background-color: var(--main-section-color) !important;
    border-color: var(--main-section-color) !important;
}

#Familias {
    margin-top: 2rem !important;
}

#FamiliasServicios {
    margin-top: 2rem !important;
}

#listaClientes {
    margin-top: 0.6rem;
    width: 20rem;
    text-align: right;
    border: 1px solid var(--main-section-color);
    border-radius: 5px;
    position: relative;
    background-color: white;
    padding-bottom: 1rem;
}

#busquedaClientes {
    left: -24rem;
    position: fixed;
    width: 100%;
    z-index: 9999999;
    display: none;
    flex-direction: row-reverse;
    text-align: right;
}

#panel_estadistica {
    width: 100%;
}

.data-box {
    background: #fff;
    box-shadow: 1px 1px 5px 0px #00000061;
    display: flex;
    padding: 10px;
}

.loginModal {
    position: absolute;
    float: left;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.gridCaja {
    background-color: #FFFFFF;
    border: 1px solid black;
    padding: 1em;
}

#tablaCaja {
    padding: 0.5em;
}



#modalOlvidoPassword {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 99999;
    overflow-y: auto;
}

/* Cuerpo del modal */
#ClienteTab {
    background-color: #ffffff;
    border-radius: 10px;
    width: 400px;
    max-width: 90%;
    margin: 5% auto;
    padding: 2rem;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
    position: relative;
    animation: fadeIn 0.3s ease;
}


.clientesHead {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid var(--main-section-color);
    margin-bottom: 1rem;
    padding-bottom: 1rem;
}


.clientesHead h3 {
    font-size: 1.5rem;
    color: black;
    margin: 0;
}


#cerrarModalOlvido {
    font-size: 2rem;
    color: var(--main-section-color);
    cursor: pointer;
}

#cerrarModalOlvido:hover {
    color: darkred;
}


.clienteSel {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.clienteSel label {
    font-weight: bold;
    color: #555;
    font-size: 14px;
}

.clienteSel input {
    padding: 0.75rem;
    font-size: 14px;
    border: 1px solid #ddd;
    border-radius: 5px;
    width: 100%;
}


input.error {
    border: 1px solid red;
}


.mensaje-error {
    color: red;
    font-size: 12px;
    margin-top: -8px;
}


.acciones-modal {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    margin-top: 2rem;
}


#alertaModal {
    margin-bottom: 1rem;
}


@keyframes fadeIn {
    from {
        opacity: 0;
        transform: scale(0.9);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}




:root {
    --main-color: #ff974b;
    --main-color-texto: #ff974b;
    --main-btn-color: #ff974b;
    --main-btn-color-borde: #8c532a;
    --main-font: "Helvetica";
    --main-confirmarbg: rgb(50, 116, 164);
    --main-confirmarbr: rgb(122, 196, 251);
    --main-btn-confirmarbg: #b5d4f2;
    --main-btn-confirmarbr: #4b5b6b;
    --main-head-editbg: #786251;
    --main-frm-nuevo: #4bff60;
    --main-frm-baja: rgb(252, 146, 146);
    --main-frm-editar: rgb(65, 61, 59);
    --main-tab-contenido: #5a534d;
    --main-tab-contenido-nuevo: rgb(53, 64, 53);
    --main-contenedor-central: #b86d2e;
    --main-main-btn: #fbd2b4;
    --main-row-select: #f8c396;
    --main-pie-pagina: #ff974b4d;
    --main-background-color: white;
    --main-text-color: white;
    --main-title-color: rgba(255, 255, 255, 0.9);
    --main-section-color: #85a1ac;
    --main-gradient: linear-gradient(107deg, #607d9600, #607d96 9.66%, #607d96 89.5%, #607d9600 97.9%);
}

@font-face {
    font-family: 'dotsfont';
    src: url('font/dotsfont.eot');
    src: url('font/dotsfont.eot?#iefix') format('embedded-opentype'),
        url('font/dotsfont.woff') format('woff'),
        url('font/dotsfont.ttf') format('truetype'),
        url('font/dotsfont.svg#dotsfontregular') format('svg');
}

@keyframes flickerAnimation {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-o-keyframes flickerAnimation {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-moz-keyframes flickerAnimation {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes flickerAnimation {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.animate-flicker {
    -webkit-animation: flickerAnimation 1s infinite;
    -moz-animation: flickerAnimation 1s infinite;
    -o-animation: flickerAnimation 1s infinite;
    animation: flickerAnimation 1s infinite;
}



/* Basic styles */
.rwd-example .ui-body,
.rwd-example2 .ui-body,
.rwd-example3 .ui-body,
.rwd-example4 .ui-body,
.rwd-example5 .ui-body,
.rwd-example6 .ui-body {
    text-align: left;
}

.rwd-example p {
    color: #cbc9c9;
    font-size: 14px;
}

.rwd-example2 p {
    color: #777;
    line-height: 140%
}

.rwd-example3 p {
    color: #777;
    line-height: 140%
}

/* Basic styles */
.rwd-example4 {
    width: 50%;
    float: left;
}

.rwd-example4 p {
    color: #fff;
    line-height: 100%
}

.rwd-example5 {
    width: 50%;
    float: left;
}

.rwd-example5 p {
    color: #fff;
    line-height: 100%
}

/* Stack all blocks to start */
.rwd-example .ui-block-a,
.rwd-example .ui-block-b,
.rwd-example .ui-block-c,
.rwd-example2 .ui-block-a,
.rwd-example2 .ui-block-b,
.rwd-example2 .ui-block-c,
.rwd-example3 .ui-block-a,
.rwd-example3 .ui-block-b,
.rwd-example3 .ui-block-c,
.rwd-example4 .ui-block-a,
.rwd-example4 .ui-block-b,
.rwd-example4 .ui-block-c,
.rwd-example5 .ui-block-a,
.rwd-example5 .ui-block-b,
.rwd-example5 .ui-block-c,
.rwd-example6 .ui-block-a,
.rwd-example6 .ui-block-b,
.rwd-example6 .ui-block-c {
    width: 100%;
    float: none;
}

/* Collapsing borders */
.rwd-example>div+div .ui-body,
.rwd-example2>div+div .ui-body,
.rwd-example3>div+div .ui-body,
.rwd-example4>div+div .ui-body,
.rwd-example6>div+div .ui-body {
    border-top-width: 0;
}


@media all and (min-width: 42em) {

    table#myTableEmpleados td:nth-child(4)~td,
    table#myTableEmpleados th:nth-child(4)~th {
        display: table-cell;
    }

    table#myTableServicios td:nth-child(4)~td,
    table#myTableServicios th:nth-child(4)~th {
        display: table-cell;
    }

    table#myTableArticulos td:nth-child(4)~td,
    table#myTableArticulos th:nth-child(4)~th {
        display: table-cell;
    }

    div#rwd-clientes {
        display: unset;
    }

    div.titulo h1 img {
        width: auto;
    }

    div#pie_pagina {
        position: fixed;
        bottom: 0px;
    }
}

/* 1st breakpoint - Float B and C, leave A full width on top */
@media all and (min-width: 42em) {
    .rwd-example {
        overflow: hidden;
        /* Use this or a "clearfix" to give the container height */
    }

    .rwd-example .ui-body {
        min-height: 14em;
    }

    .rwd-example .ui-block-b,
    .rwd-example .ui-block-c {
        float: left;
        width: 100%;
    }

    .rwd-example .ui-block-b p,
    .rwd-example .ui-block-c p {
        font-size: .8em;
    }

    .rwd-example>div+div .ui-body {
        border-top-width: 1px;
    }

    .rwd-example>div:first-child .ui-body {
        border-bottom-width: 0;
    }

    .rwd-example>div:last-child .ui-body {
        border-left-width: 0;
    }

    .rwd-example2 {
        overflow: hidden;
        /* Use this or a "clearfix" to give the container height */
    }

    .rwd-example2 .ui-body {
        min-height: 14em;
    }

    .rwd-example2 .ui-block-b,
    .rwd-example2 .ui-block-c {
        float: left;
        width: 100%;
    }

    .rwd-example2 .ui-block-b p,
    .rwd-example2 .ui-block-c p {
        font-size: .8em;
    }

    .rwd-example2>div+div .ui-body {
        border-top-width: 1px;
    }

    .rwd-example2>div:first-child .ui-body {
        border-bottom-width: 0;
    }

    .rwd-example2>div:last-child .ui-body {
        border-left-width: 0;
    }

    .rwd-example3 {
        overflow: hidden;
        /* Use this or a "clearfix" to give the container height */
    }

    .rwd-example3 .ui-body {
        min-height: 14em;
    }

    .rwd-example3 .ui-block-b,
    .rwd-example3 .ui-block-c {
        float: left;
        width: 100%;
    }

    .rwd-example3 .ui-block-b p,
    .rwd-example3 .ui-block-c p {
        font-size: .8em;
    }

    .rwd-example3>div+div .ui-body {
        border-top-width: 1px;
    }

    .rwd-example3>div:first-child .ui-body {
        border-bottom-width: 0;
    }

    .rwd-example3>div:last-child .ui-body {
        border-left-width: 0;
    }

    .rwd-example4 {
        overflow: hidden;
        /* Use this or a "clearfix" to give the container height */
    }

    .rwd-example4 .ui-block-b,
    .rwd-example4 .ui-block-c {
        float: left;
        width: 100%;
    }

    .rwd-example4 .ui-block-b p,
    .rwd-example4 .ui-block-c p {
        font-size: .8em;
    }

    .rwd-example4>div+div .ui-body {
        border-top-width: 1px;
    }


    a#btn_zona {
        width: 10.5%;
    }

    a#btn_servicio {
        width: 13%;
        height: 3em;
        white-space: normal;
        border-width: 2px;
    }

    a#btn_servicio.btn-imagen {

        height: 12em;

    }

    a#btn_zona,
    a#btn_servicio,
    a#btn_artser {
        font-size: 12px;
        margin: .446em;
    }

    a#btn_deuda {
        width: 18%;
        height: 4em;
        white-space: normal;
        background-color: red;
        border-color: red;
        color: white;
    }

    a#btn_sesion {
        width: 18%;
        height: 4em;
        white-space: normal;
        padding-top: 0.2em;
        padding-bottom: 1.2em;
    }

    a#btn_regalo {
        width: 18%;
        height: 4em;
        white-space: normal;
        padding-top: 0.2em;
        padding-bottom: 1.2em;
    }

    a#btn_itinerario {
        width: 18%;
        height: 4em;
        white-space: normal;
        padding-top: 0.2em;
        padding-bottom: 1.2em;
    }

    a#btn_pack {
        border-color: var(--main-section-color);
        height: auto;
        font-size: revert;
    }

    a#btn_empleado {
        width: 16%;
        font-size: 12px
    }

    a#btn_usuario {
        width: 16%;
        font-size: 12px;
        margin: .446em;
    }

    a.formapago {
        height: 50px;
        width: 80px;
        white-space: normal;
    }

    div#opciones-cobro>a {
        height: 30px;
        width: 70px;
        white-space: normal;
    }
}

/* 2nd breakpoint - Float all, 50/25/25 */
@media all and (min-width: 55em) {
    .rwd-example .ui-body {
        min-height: 18em;
    }

    .rwd-example .ui-block-a,
    .rwd-example .ui-block-c {
        float: left;
        width: 39.95%;
    }

    .rwd-example .ui-block-b,
    .rwd-example .ui-block-c {
        float: left;
        width: 29.925%;
    }

    .rwd-example>div:first-child .ui-body {
        border-bottom-width: 1px;
    }

    .rwd-example>div+div .ui-body {
        border-left-width: 0;
    }

    .rwd-example2 .ui-body {
        min-height: 18em;
    }

    .rwd-example2 .ui-block-a,
    .rwd-example2 .ui-block-c {
        float: left;
        width: 49.95%;
    }

    .rwd-example2 .ui-block-b,
    .rwd-example2 .ui-block-c {
        float: left;
        width: 49.95%;
    }

    .rwd-example2>div:first-child .ui-body {
        border-bottom-width: 1px;
    }

    .rwd-example2>div+div .ui-body {
        border-left-width: 0;
    }

    .rwd-example3 .ui-body {
        min-height: 18em;
    }

    .rwd-example3 .ui-block-a,
    .rwd-example3 .ui-block-c {
        float: left;
        width: 60%;
    }

    .rwd-example3 .ui-block-b,
    .rwd-example3 .ui-block-c {
        float: left;
        width: 40%;
    }

    .rwd-example3>div:first-child .ui-body {
        border-bottom-width: 1px;
    }

    .rwd-example3>div+div .ui-body {
        border-left-width: 0;
    }



    .rwd-example4 .ui-block-a {
        float: left;
        width: 70.00%;
    }

    .rwd-example4 .ui-block-b {
        float: left;
        width: 30.00%;
    }

    .rwd-example4 .ui-block-c {
        float: left;
        width: 100.00%;
    }

    .rwd-example4>div+div .ui-body {
        border-left-width: 0;
    }

    .rwd-example5 .ui-body {
        font-size: 125%;
    }

    @media (max-width: 1024px) {
        .rwd-example5 .ui-body {
            font-size: 85%;
        }

        /* Tamaño botones */
        .sorting_disabled {
            font-size: 13px !important;
        }
    }

    .rwd-example5 .ui-block-a {
        float: left;
        width: 100.00%;
    }

    .rwd-example5>div:first-child .ui-body {
        /*
        padding-left: 1px;
        padding-right: 1px;
        */
        padding: 0.4em 1em;
    }

    .rwd-example6 .ui-body {
        min-height: 8em;
    }

    .rwd-example6 .ui-body {
        font-size: 125%;
    }

    .rwd-example6 .ui-block-a {
        float: left;
        width: 20.00%;
    }

    .rwd-example6 .ui-block-b {
        float: left;
        width: 60.00%;
    }

    .rwd-example6 .ui-block-c {
        float: left;
        width: 20.00%;
    }

    .rwd-example6>div:first-child .ui-body {
        border-bottom-width: 1px;
    }

    .rwd-example6>div+div .ui-body {
        border-left-width: 0;
        height: 17em;
    }

    a#btn_zona {
        width: 14.5%;
    }

    a#btn_servicio {
        width: 17.7%;
        height: 5em;
        white-space: normal;
        padding: 0.1em;
    }

    a#btn_servicio.btn-imagen {

        height: 12em;

    }

    table#myTableTickets.dataTable tbody td.selected:nth-child(2),
    table#myTableTickets.dataTable tbody td.selected:nth-last-child(2) {
        font-size: 1.2em;
    }

    a#btn_zona,
    a#btn_servicio,
    a#btn_artser,
    a#btn_deuda,
    a#btn_sesion,
    a#btn_pack,
    a#btn_itineario,
    a#btn_regalo {
        font-size: 10px;
        margin: 2px;
    }

    a#btn_deuda {
        width: 17.7%;
        height: 5em;
        white-space: normal;
        padding: 0.1em;
        background-color: red;
        border-color: red;
        color: white;
        word-break: keep-all;
    }

    a#btn_deuda p {
        margin-top: 0px !important;
        font-size: 1em !important;
    }

    a#btn_sesion {
        width: 17.7%;
        height: 5em;
        white-space: normal;
        padding: 0.1em;
        padding-top: 0.2em;
    }

    a#btn_regalo {
        width: 17.7%;
        height: 5em;
        white-space: normal;
        padding: 0.1em;
        padding-top: 0.2em;
    }

    a#btn_itineario {
        width: 17.7%;
        height: 5em;
        white-space: normal;
        padding: 0.1em;
        padding-top: 0.2em;
    }

    a#btn_pack {
        width: 17.7%;
        white-space: normal;
        padding: 0.1em;
    }

    a#btn_empleado {
        width: 15%;
        font-size: 10px;
    }

    a#btn_usuario {
        width: 15%;
        font-size: 10px;
        margin: 4px;
        height: 2em;
    }

    a.formapago {
        height: 50px;
        width: 80px;
        white-space: normal;
        padding-left: 2px;
        padding-right: 2px;
        margin-left: 2px;
        margin-right: 2px;
    }

    div#opciones-cobro>a {
        height: 30px;
        width: 70px;
        white-space: normal;
        padding-left: 2px;
        padding-right: 2px;
        margin-left: 2px;
        margin-right: 2px;
    }

    a#btn_empleado img {
        width: 30px;
    }

    a#btn_empleado p {
        width: 49%;
        font-size: 9px;
    }

    a#btn_usuario img {
        width: 30px;
    }

    a#btn_usuario p {
        width: 49%;
        font-size: 9px;
    }

    div#barra_opciones>a {
        width: 10%;
        white-space: normal;
        padding-left: 5px;
        padding-right: 5px;
    }

    div#contenedorPagoCombinado {
        width: 80%;
    }

    .derecha {
        font-size: 12px;
    }

    .ui-btn.main-btn {
        width: 65px;
        margin: 0px;
    }

    span.selectcabecera {
        width: auto;
    }

    table#myTableCierreFamilias {
        font-size: 10px;
        line-height: 1.1em;
    }

    table#myTableCierreFamilias.dataTable tbody td {
        padding: 5px 4px;
    }

    table#myTableCierreZonas,
    table#myTableCierreDetalle {
        font-size: 10px;
    }

    table#myTableCierreAdicional {
        line-height: 1.1em;
    }

    div#barra_opciones_cierre a,
    div#barra_opciones_cierregastos a {
        padding-left: 0em;
        padding-right: 0px;
    }

    a.ui-btn.moneda,
    a.ui-btn.billete {
        padding: 0em 1em;
        margin-top: 2px;
        margin-bottom: 2px;
    }

    p.importe-cobro {
        border-style: solid;
        border-radius: 10px;
        margin-left: 1em;
        margin-top: 0em;
        font-size: 1.5em;
        margin-right: 1em;
        margin-bottom: 5px;
    }

    p.lblcobro {
        margin-top: 5px;
        margin-bottom: 5px;
    }
}

@media all and (min-width: 65em) {
    a#btn_deuda {
        width: 17.7%;
        height: 5em;
        white-space: normal;
        padding: 0.1em;
        background-color: red;
        border-color: red;
        color: white;
    }

    a#btn_deuda p {
        margin-top: 0.5em !important;
        font-size: 1.5em !important;
    }
}

@media all and (min-width: 70em) {
    div#barra_opciones>a {
        width: 11%;
        display: flex;
        justify-content: center;
        align-items: center;

        & img {
            margin-right: 5px;
        }
    }

    a#btn_deuda {
        width: 17.7%;
        height: 5em;
        white-space: normal;
        padding: 0.1em;
        background-color: red;
        border-color: red;
        color: white;
    }
}

/* 3rd breakpoint - Bump up font size at very wide screens PC*/
@media all and (min-width: 90em) {

    .rwd-example .ui-body,
    .rwd-example2 .ui-body {
        font-size: 125%;
    }

    .rwd-example .ui-block-a,
    .rwd-example .ui-block-c {
        float: left;
        width: 33.33%;
    }

    .rwd-example .ui-block-b,
    .rwd-example .ui-block-c {
        float: left;
        width: 33.33%;
    }

    .rwd-example2 .ui-block-a,
    .rwd-example2 .ui-block-b,
    .rwd-example2 .ui-block-c {
        float: left;
        width: 49.95%;
    }

    .rwd-example3 .ui-body {
        font-size: 125%;
    }

    .rwd-example3 .ui-block-a,
    .rwd-example3 .ui-block-c {
        float: left;
        width: 60.00%;
    }

    .rwd-example3 .ui-block-b,
    .rwd-example3 .ui-block-c {
        float: left;
        width: 40.00%;
    }

    .rwd-example4 .ui-body {
        min-height: 6em;
    }

    .rwd-example4 .ui-body {
        min-height: 10em;
    }


    .rwd-example4 .ui-body {
        font-size: 100%;
    }

    .rwd-example4 .ui-block-a {
        float: left;
        width: 70.00%;
    }

    .rwd-example4 .ui-block-b {
        float: left;
        width: 30.00%;
    }

    .rwd-example4 .ui-block-c {
        float: left;
        width: 100.00%;
    }

    .rwd-example5 .ui-body {
        font-size: 100%;
    }

    .rwd-example5 .ui-block-a {
        float: left;
        width: 100.00%;
    }

    .rwd-example5>div:first-child .ui-body {
        padding: .4em 1em;
    }

    a#btn_zona {
        width: 13.5%;
    }

    a#btn_servicio {
        width: 12.9%;
        height: 7em;
        white-space: normal;
        padding: .7em 1em;
    }

    a#btn_familia {
        font-size: 12px;
        border-width: 2px;
    }

    table#myTableTickets.dataTable tbody td.selected:nth-child(2) p.nombrecli,
    table#myTableTickets.dataTable tbody td.selected:nth-last-child(2) {
        font-size: 1.5em;
    }

    a#btn_zona,
    a#btn_artser {
        font-size: 12px;
        margin: .446em;
    }

    a#btn_servicio,
    a#btn_deuda,
    a#btn_sesion,
    a#btn_pack,
    a#btn_itinerario,
    a#btn_regalo {
        font-size: 10px;
        margin: .246em;
        padding-left: 0px;
        padding-right: 0px;
        padding-top: 0.7em;
    }

    a#btn_deuda {
        width: 12.9%;
        height: 7em;
        white-space: normal;
        background-color: red;
        border-color: #ff000080;
        color: white;
        border-width: 2px;
        padding-bottom: 1.2em;
    }

    a#btn_sesion {
        width: 12.9%;
        height: 7em;
        white-space: normal;
        padding-bottom: 1.2em;
        border-width: 2px;
    }

    a#btn_regalo {
        width: 12.9%;
        height: 7em;
        white-space: normal;
        padding-bottom: 1.2em;
        border-width: 2px;
    }

    a#btn_itinerario {
        width: 12.9%;
        height: 7em;
        white-space: normal;
        padding-bottom: 1.2em;
        border-width: 2px;
    }

    a#btn_pack {
        background-color: #ffffff;
        border-color: #ffffff;
        color: #232323;
        border: 1px solid var(--main-section-color);
        font-size: revert;
        height: auto;
    }

    a#btn_pack.btn-imagen {
        height: 12em;
    }

    a#btn_empleado {
        width: 18%;
        font-size: 12px;
    }

    a#btn_usuario {
        width: 20%;
        font-size: 12px;
        margin: 1px .146em 1px 0.146em;
        height: 2em;
    }

    a.formapago {
        height: 50px;
        width: 80px;
        white-space: normal;
        margin: .446em;
        padding: .7em 1em;
    }

    a.ui-btn.moneda,
    a.ui-btn.billete {
        padding: .3em 1em;
        margin: .446em;
    }

    a.btn_grupo {
        font-size: 12px;
        margin: 2px;
        width: 12%;
        white-space: normal;
        height: 2em;
    }

    a.btn_subgrupo {
        font-size: 12px;
        margin: 2px;
        width: 12%;
        white-space: normal;
        height: 2em;
    }

    a#btn_empleado img {
        width: 37px;
    }

    a#btn_empleado p {
        width: 60%;
        font-size: 11px;
    }

    a#btn_usuario img {
        width: 37px;
    }

    a#btn_usuario p {
        width: 60%;
        font-size: 11px;
    }

    div#barra_opciones>a {
        width: 12%;
    }

    div#contenedorPagoCombinado {
        width: 60%;
    }

    .derecha {
        font-size: 14px;
    }

    .ui-btn.main-btn {
        width: 70px;
        margin: .446em;
    }

    span.selectcabecera {
        width: auto;
        min-width: 3em;
    }

    table#myTableCierreFamilias {
        font-size: 12px;
        line-height: 1em;
    }

    table#myTableCierreFamilias.dataTable tbody td {
        padding: 5px 4px;
    }

    table#myTableCierreZonas,
    table#myTableCierreDetalle {
        font-size: 12px;
    }

    table#myTableCierreAdicional {
        line-height: 1em;
    }

    p.importe-cobro {
        border-style: solid;
        border-radius: 10px;
        margin-left: 1em;
        margin-top: 0em;
        font-size: 1.5em;
        margin-right: 1em;
        margin-bottom: 1em;
    }

    p.lblcobro {
        margin-top: 1em;
        margin-bottom: 1em;
    }
}

.negrita {
    font-weight: bold;
    color: rgb(228, 228, 228);
}

.negrita2 {
    font-weight: bold;
    color: rgb(0, 0, 0);
}

.negrita-grande {
    font-weight: bold;
    font-size: 14px;
}

.ui-content {
    color: var(--main-title-color);
    font-family: var(--main-font);
    padding-top: 0em;
}

.ui-page-theme-a {
    text-shadow: none;
    background-color: var(--main-background-color);
    color: white;
}

.ui-overlay-a {
    text-shadow: none;
    background-color: var(--main-background-color);
    color: var(--main-text-color);
}

.ui-btn {
    text-shadow: none;
}

.ui-body-d {
    background-color: white;
    border-radius: 5px;
    margin: 5px;
    background-color: rgba(133, 161, 172, 0.1);
}

.dataTable caption {
    color: var(--main-color) !important;
    font-size: 1.2em;
    text-align: left;
    margin-left: 1em;
    margin-top: 1em;
    margin-bottom: 1em;
}

.titulo h1 {
    text-align: left;
    border-bottom: 1px solid var(--main-color);
    font-weight: 100;
}

.titulo h1 img {
    vertical-align: middle;
    margin-right: 0.5em;
}

.titulo h3 {
    text-align: right;
    margin-top: -1em;
    font-weight: normal;
    font-size: 14px;
}

.titulo h1 a {
    float: right;
    margin-top: 7px;
    background-color: var(--main-color);
    border-color: var(--main-color);
}

p.titulo {
    text-align: center;
    font-weight: bold;
    font-size: 2em;
    margin: 0em;
}

.negativo {
    color: #f95c5c;
}

.positivo {
    color: #24bf24;
}

.dt-right {
    text-align: right;
}

.ui-mobile {
    background-color: var(--main-background-color);
}

.ponerfechas {
    text-align: center;
    position: absolute;
    bottom: 0;
}

.ponerfechas h2 {
    font-size: 1em;
    font-weight: normal;
}

table[class*="dataTable"] td a {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-right: 4px;
    margin-left: 0px;
}

div#editarservicio {
    background-color: var(--main-frm-editar);
    width: 95%;
    max-width: 1000px;
    height: auto;
    display: none;
    border-radius: 15px;
    border: var(--main-color) solid 2px;
    min-height: 650px;
    max-height: 650px;
}

div#contenidoeditarservicio {
    margin: 1em;
}

div#contenidoeditarservicio>p:not(div.jqte_editor p):not(table#myTableFicheroPacksDetalle p):not(p.info):not(.nuevo):not(.baja) {
    color: var(--main-color) !important;
    border-bottom: var(--main-color) solid 1px;
    font-weight: 100;
}

div#contenidoeditarservicio>p:not(.jqte_editor):not(.nuevo):not(.info) {
    color: var(--main-color) !important;
    border-bottom: var(--main-color) solid 1px;
    font-weight: 100;
}

div#editarservicio_edicion {
    background-color: var(--main-frm-editar);
    width: 99%;
    max-width: 1000px;
    height: auto;
    display: none;
    border-radius: 15px;
    border: var(--main-color) solid 2px;
}

div#contenidoeditarservicio_edicion {
    margin: 1em;
}

div#contenidoeditarservicio_edicion>p:not(div.jqte_editor p) {
    color: #fff !important;
    border-bottom: var(--main-color) solid 1px;
}

div#contenidoeditarservicio_edicion>p:not(.jqte_editor) {
    color: #fff !important;
    border-bottom: var(--main-color) solid 1px;
}

.ui-field-contain {
    margin: 0.5em 0;
}

.rwd-example4 p {
    text-align: center;
    margin: 0px;
}

.rwd-example5 p {
    text-align: center;
    margin: 0px;
}

.oculto {
    display: none;
}

a#btn_zona.seleccionado,
a#btn_familia.seleccionado,
a.btn_grupo.seleccionado,
a.btn_subgrupo.seleccionado,
a#btn_artser.seleccionado,
a#btn_grupo.seleccionado,
a#btn_subgrupo.seleccionado,
a#btn_familia.seleccionado {
    border-width: 2px;
    background-clip: inherit;
    color: white;
    white-space: break-spaces;
    background-color: var(--main-section-color);
}

a.btn_empleado.seleccionado {
    border-width: 1px;
    border-color: white;
    background-color: var(--main-section-color);
    color: white;
}

a#btn_usuario.seleccionado {
    border-width: 1px;
    border-color: white;
    background-color: #9c714d;
    color: white;
}

a#btn_artser {
    float: right;
    background-color: white;
}

div#caja_servicios {
    overflow-y: auto;

}

div#caja_familias {
    text-align: center;
    overflow-y: auto;
    max-height: 180px;
}

div#caja_empleados {
    text-align: center;
    max-height: 90px;
}

.ui-mini {
    font-size: 12px;
}

div#contenedorhm {
    width: 100%;
    text-align: center;
    overflow: hidden;
}

@media(device-width: 768px) and (device-height: 1024px) {
    ::-webkit-scrollbar {
        -webkit-appearance: none;
        width: 10px;
    }

    ::-webkit-scrollbar-thumb {
        border-radius: 4px;
        background-color: rgba(0, 0, 0, .5);
        border: 2px solid white;
        -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5);
    }

    ::-webkit-scrollbar-track {
        background-color: #fff;
        border-radius: 4px;
    }

    ::-webkit-scrollbar-thumb:hover {
        background: rgba(0, 0, 0, 0.4);
    }

    ::-webkit-scrollbar-thumb:window-inactive {
        background: rgba(0, 0, 0, 0.5);
    }

    a.ui-btn.moneda,
    a.ui-btn.billete {
        padding: .3em 1em;
    }
}

a#btneditardetalleticket,
a#btneditarticket {
    margin: 0px auto;
    font-size: 16px;
}

div#editardetalleticket {
    background-color: rgba(89, 62, 57, 1);
    width: auto;
    height: auto;
    border-radius: 5px;
    display: none;
}

div#editarticket {
    background-color: rgba(89, 62, 57, 1);
    width: auto;
    height: auto;
    border-radius: 5px;
    display: none;
}

div#message,
div#message_edicion {
    background-color: var(--main-confirmarbg);
    width: 400px;
    height: 210px;
    border-radius: 5px;
    display: none;
}

div#seleccionempleado,
div#seleccionempleadocomisiones {
    background-color: rgba(50, 79, 164, 1);
    width: 600px;
    height: auto;
    border-radius: 10px;
    display: none;
    border: 1px solid var(--main-confirmarbr);
    padding: 1em;
}

div#contenidoeditardetalleticket .ui-btn {
    margin: 10px auto;
}

div#contenidoeditardetalleticket {
    margin: 10px;
}

div#contenidoeditarticket .ui-btn {
    margin: 10px auto;
}

div#contenidoeditarticket {
    margin: 10px;
}

div#cajabusqueda,
div#cajabusqueda-consumo {
    background-color: rgb(83, 78, 70);
    width: 600px;
    max-height: 600px;
    border-radius: 5px;
    display: none;
}

div#cajabusqueda .ui-btn,
div#cajabusqueda-consumo .ui-btn {
    margin: 10px auto;
}

div#cajabusqueda,
div#cajabusqueda-consumo {
    margin: 10px;
}

div#contenedorvh,
div#contenedorvm {
    float: left;
    width: 50%;
    display: flex;
}

table#myTableTickets.dataTable tbody td {
    padding: 3px 10px;
}

table#myTableTickets.dataTable tbody td.selected,
table#myTableTickets.dataTable tbody td.selected p.nombrecli {
    font-weight: bold;
}

table#myTableTickets.dataTable tbody td.selected p.nombrecli {
    font-size: 16px;
}

div#busquedaclientes,
div#gestioncobro,
div#veragenda,
div#nointernet,
div#esperaconexion {
    background-color: var(--main-background-color);
    width: 100%;
    height: 100%;
    display: none;
}

div#contenidobusquedaclientes {
    margin: 10px;
}

div#agendahorario {
    background-color: rgb(27, 96, 140);
    width: 600px;
    height: auto;
    border-radius: 5px;
    display: none;
    border: rgb(39, 132, 191) solid 1px;
}

div#nuevanotaagenda {
    background-color: var(--main-background-color);
    width: 600px;
    height: auto;
    border-radius: 5px;
    display: none;
    border: rgb(39, 132, 191) solid 1px;
}

div#nuevacitaagenda {
    background-color: var(--main-background-color);
    width: 600px;
    height: auto;
    border-radius: 0px;
    display: none;
    border: var(--main-background-color) solid 1px;
}

div#busquedaagenda {
    background-color: rgb(27, 96, 140);
    max-width: 750px;
    height: auto;
    border-radius: 5px;
    display: none;
    width: 98%;
    border: rgb(39, 132, 191) solid 1px;
}

div#smscontrol {
    background-color: rgb(27, 96, 140);
    width: 95%;
    max-width: 1000px;
    height: 95%;
    max-height: 670px;
    border-radius: 10px;
    display: none;
    border: rgb(39, 132, 191) solid 1px;
}

div#contenidonuevacitaagenda,
div#contenedorbusquedaagenda,
div#contenidonuevanotaagenda,
div#contenedoragendahorario {
    margin: 16px;
}

a#btn_servicio.bono {
    border-color: white;
    background-image: url("../img/fondobtnbono.png");
}

a#btn_servicio.btn-regalo {
    border-color: white;
    background-image: url("../img/fondobtnregalo.png");
}

p.lbltop {
    margin-top: -1em;
    margin-left: -2em;
    margin-right: -2em;
    padding-bottom: 0.1em;
    padding-top: 0.6em;
    font-size: .8em;
    color: #e0e2e4;
    background: var(--main-section-color);
}

p.lblmiddle {
    margin-left: -2em;
    margin-right: -2em;
    font-size: .8em;
    color: #e0e2e4;
    padding-top: 3px;
    padding-bottom: 3px;
    background: var(--main-section-color);
}

a#btn_sesion>span {
    position: absolute;
    bottom: 0px;
    left: 0px;
    color: #d2cdcd;
    width: 100%;
    background-color: #6f4d2c;
}

a#btn_regalo {
    background-color: deepskyblue;
}

a#btn_regalo>span {
    position: absolute;
    bottom: 0px;
    left: 0px;
    color: #d2cdcd;
    width: 100%;
    background-color: #077ca4;
    min-height: 2em;
    max-height: 2.3em;
}

a#btn_deuda>span {
    position: absolute;
    bottom: 0px;
    left: 0px;
    color: #d2cdcd;
    width: 100%;
    background-color: #b31b14;
}

a#btn_itinerario {
    background-image: url('../img/itinerario.jpg');
    border-color: #14bdea;
}

a#btn_itinerario>span {
    position: absolute;
    bottom: 0px;
    left: 0px;
    color: #d2cdcd;
    width: 100%;
    background-color: #2c4c6f;
}

a#btn_servicio>span,
a#btn_pack>span {
    position: absolute;
    bottom: 0px;
    left: 0px;
    color: #d2cdcd;
    width: 100%;
    background-color: #3e3e3ee3;
    font-weight: lighter;
    font-size: 11px
}

table#myTableTickets.dataTable tbody td.tarjetapuntos p.nombrecli {
    text-decoration: underline dotted;
    padding-bottom: 3px;
}

td.deuda {
    color: #f21414;
    font-weight: bold;
}

button#btn_Selempleado {
    width: 18%;
    font-size: 12px;
    margin: .446em;
    white-space: normal;
    height: 4em;
    line-height: 11px;
}

/*
div#barra_opciones>a {

}
*/
div#info {
    height: 1em;
}

div.fechahora {
    text-align: center;
    font-size: 14px;
}

div#contenidomessage,
div#contenidomessage_edicion,
div#contenidoeditarticket,
div#contenidoeditardetalleticket,
div#contenidoseleccionempleado,
div#contenidoseleccionempleadocomisiones,
div#contenidobusquedaclientes {
    background-color: transparent;
}

div#contenidomessage>button.message_close,
div#contenidomessage_edicion>button.message_edicion_close {
    bottom: 0px;
    position: absolute;
    margin: 0px auto;
}

div#contenidomessagetexto,
div#contenidomessagetexto_edicion {
    margin: 10px;
    text-align: center;
    font-size: 1.2em;
}

div#myTableCajaClientes_wrapper .dataTables_scroll .dataTables_scrollHead {
    display: none;
}

.ui-navbar>ul[class*="ui-grid-"]>li[class*="ui-block-"] {
    width: auto;
    border: 1px solid #c5c5c5;
}

div.ui-tabs .ui-widget-content.ui-tabs-panel {
    background: var(--main-tab-contenido);
    padding-bottom: 0px;
    padding-top: 0px;
}

div#etiquetasguardadas {
    background: #2b4a65;
    padding-bottom: 0px;
    padding-top: 0px;
}

div.ui-tabs.nuevo .ui-widget-content.ui-tabs-panel {
    background: var(--main-tab-contenido-nuevo);
    padding-bottom: 0px;
    padding-top: 0px;
}

div#myTableCajaClientes_info {
    display: none;
}

div#filtrosservicios .ui-mini {
    font-size: 11px;
}

input.mediano {
    width: 7em;
}

input.normal {
    width: 8em;
}

form#form-edicion input,
form#form-edicion select,
form#form-edicion option,
form#form-edicion_edicion input,
form#form-edicion_edicion select,
form#form-edicion_edicion option,
form#form-edicion-central input,
form#form-edicion-central select,
form#form-edicion-central option {
    font-size: 12px;
}

form#form-edicion .ui-field-contain>label,
form#form-edicion_edicion .ui-field-contain>label,
form#form-edicion-central .ui-field-contain>label {
    width: 12%;
}

form#form-edicion div.masespacio .ui-field-contain>label,
form#form-edicion_edicion .ui-field-contain>label,
form#form-edicion-central .ui-field-contain>label {
    width: 14%;
}

form#form-edicion div[class*="ui-grid-a"] div.ui-block-a.ui-block-especial .ui-field-contain>label {
    width: 19%;
}

form#form-edicion div[class*="ui-grid-a"] div.ui-block-b.ui-block-especial .ui-field-contain>label {
    width: 30%;
}

form#form-edicion div[class*="ui-grid-a"] .ui-field-contain>label,
form#form-edicion_edicion div[class*="ui-grid-a"] .ui-field-contain>label {
    width: 26%;
}

form#form-edicion div[class*="ui-grid-b"] div[class*="ui-block-a"] .ui-field-contain>label,
form#form-edicion_edicion div[class*="ui-grid-b"] div[class*="ui-block-a"] .ui-field-contain>label {
    width: 40%;
}

form#form-edicion div[class*="ui-grid-b"] div[class*="ui-block-b"] .ui-field-contain>label,
form#form-edicion_edicion div[class*="ui-grid-b"] div[class*="ui-block-b"] .ui-field-contain>label,
form#form-edicion div[class*="ui-grid-b"] div[class*="ui-block-c"] .ui-field-contain>label,
form#form-edicion_edicion div[class*="ui-grid-b"] div[class*="ui-block-c"] .ui-field-contain>label {
    width: 30%;
}

form#form-edicion div[class*="ui-block-"] .ui-field-contain,
form#form-edicion_edicion div[class*="ui-block-"] .ui-field-contain {
    margin-bottom: 0em;
    margin-top: 0em;
}

form#form-edicion div.widthreducido,
form#form-edicion_edicion div.widthreducido {
    width: 14%;
}

form#form-edicion div.widthmas,
form#form-edicion_edicion div.widthmas {
    width: 22%;
}

form#form-edicion div.widthmasmas,
form#form-edicion_edicion div.widthmasmas {
    width: 25%;
}

form#form-edicion div[class*="ui-block-"]:last-child .ui-field-contain.widthauto2,
form#form-edicion_edicion div[class*="ui-block-"] .ui-field-contain.widthauto2 {
    margin: 0.5em 0;
}

form#form-edicion div[class*="ui-block-b"]:last-child .ui-field-contain.widthauto2,
form#form-edicion_edicion div[class*="ui-block-b"] .ui-field-contain.widthauto2 {
    margin-top: 0em;
    margin-bottom: 0.5em;
}

form#form-edicion ul[class*="ui-grid-"]>li[class*="ui-block-"]>label,
form#form-edicion_edicion ul[class*="ui-grid-"]>li[class*="ui-block-"]>label {
    margin: 0px;
}

form#form-edicion .ui-field-contain>label~[class*="ui-input"],
form#form-edicion_edicion .ui-field-contain>label~[class*="ui-input"],
form#form-edicion-central .ui-field-contain>label~[class*="ui-input"] {
    width: auto;
}

form#form-edicion .ui-field-contain>label~[class*="ui-select"],
form#form-edicion_edicion .ui-field-contain>label~[class*="ui-select"] {
    width: auto;
}

form#form-edicion div[class*="ui-block-"] .ui-field-contain>label~[class*="ui-select"],
form#form-edicion_edicion div[class*="ui-block-"] .ui-field-contain>label~[class*="ui-select"] {
    max-width: 11.4em;
    margin-right: 0px;
}

form#form-edicion div[class*="ui-block-"]>label~[class*="ui-select"],
form#form-edicion_edicion div[class*="ui-block-"]>label~[class*="ui-select"] {
    max-width: 13em;
    margin-right: 0px;
}

form#form-edicion div[class*="ui-grid-a"] div[class*="ui-block-"] .ui-field-contain>label~[class*="ui-select"],
form#form-edicion_edicion div[class*="ui-grid-a"] div[class*="ui-block-"] .ui-field-contain>label~[class*="ui-select"] {
    max-width: initial;
}

form#form-edicion div[class*="ui-block-"].widthreducido>label~[class*="ui-select"],
form#form-edicion_edicion div[class*="ui-block-"].widthreducido>label~[class*="ui-select"] {
    max-width: 10em;
    margin-right: 0px;
}

form#form-edicion div[class*="ui-block-"] .ui-field-contain>label.max-width~[class*="ui-select"] {
    max-width: initial;
}

form#form-edicion .ui-field-contain>label.max-width,
form#form-edicion_edicion .ui-field-contain>label.max-width,
form#form-edicion-central .ui-field-contain>label.max-width {
    max-width: initial;
    width: 9em;
}

form#form-edicion .ui-body,
form#form-edicion_edicion .ui-body {
    padding: 0;
    margin: 0px;
}

form#form-edicion label,
form#form-edicion_edicion label {
    font-size: 14px;
}

div#botonera_edicion,
div#botonera_edicion_edicion {
    position: absolute;
    top: 0px;
    right: 0px;
    margin-top: -4px;
    margin-right: 8px;
}

div#botonera_edicion>button.ui-icon-check,
div#botonera_edicion_edicion>button.ui-icon-check {
    background-color: #4bff60;
    border-color: #226836;
}

button#submit_editar,
button#submit_editar_edicion,
button#editar_nuevo,
button#editar_nuevo_edicion {
    background-color: #4bff60;
    border-color: #226836;
}

button#cerrar_editar,
button#cerrar_editar_edicion {
    background-color: #ff1b1b;
    border-color: #682222;
}

div#editarconfirmar {
    background-color: var(--main-confirmarbg);
    width: 300px;
    height: 210px;
    border-radius: 10px;
    display: none;
    border: 1px solid var(--main-confirmarbr);
    padding: 1em;
}

.pwd-recovery-modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.4);
}

.pwd-recovery-modal-content {
    background-color: #fefefe;
    margin: 15% auto;
    padding: 20px;
    border: 1px solid #888;
    width: 80%;
    max-width: 500px;
    border-radius: 5px;
    position: relative;
}

.pwd-recovery-close-btn {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
    position: absolute;
    right: 10px;
    top: 5px;
}

.pwd-recovery-close-btn:hover,
.pwd-recovery-close-btn:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.pwd-recovery-title {
    font-size: 1.5rem;
    font-weight: bold;
    margin-bottom: 20px;
}

.pwd-recovery-form-step {
    transition: all 0.3s ease;
}

.pwd-recovery-form-actions {
    margin-top: 20px;
    text-align: center;
}

div#opcionexterna,
div#opcionexterna2,
div#opcionauxbc,
div#cajabusqueda,
div#opcionexterna_editar {
    background-color: var(--main-confirmarbg);
    width: auto;
    height: auto;
    border-radius: 10px;
    display: none;
    border: 1px solid var(--main-confirmarbr);
    padding: 1em;
}

div#botonera_editarconfirmar {
    text-align: center;
    position: absolute;
    bottom: 1em;
    width: 100%;
    left: 0px;
}

div#contenidoeditarconfirmar {
    text-align: center;
    background-color: transparent;
}

div#comisionesconfirmar {
    background-color: rgba(164, 50, 50, 0.9);
    width: 200px;
    height: 210px;
    border-radius: 5px;
    display: none;
}

div#botonera_comisionesconfirmar {
    text-align: center;
    position: absolute;
    bottom: 0px;
    width: 100%;
}

div#contenidocomisionesconfirmar {
    text-align: center;
    background-color: transparent;
}

a#nuevoregistro {
    background-color: #4bff60;
    border-color: #226836;
}

a#eliminarregistro {
    background-color: #ff1b1b;
    border-color: #682222;
}

a#bajaregistro {
    background-color: #1b5eff;
    border-color: #222f68;
}

div#eliminarconfirmar {
    background-color: var(--main-confirmarbg);
    width: 400px;
    height: 210px;
    border-radius: 5px;
    display: none;
}

div#botonera_eliminarconfirmar {
    text-align: center;
    position: absolute;
    bottom: 0px;
    width: 100%;
}

div#contenidoeliminarconfirmar {
    text-align: center;
    background-color: transparent;
}

div#tecnicoeliminar,
div#esteticaeliminar,
div#descuentoeliminar,
div#vinculararticulos {
    background-color: rgba(164, 50, 50, 0.9);
    width: 400px;
    height: 210px;
    border-radius: 5px;
    display: none;
}

div#botoneratecnicoeliminar,
div#botoneraesteticaeliminar,
div#botoneradescuentoeliminar,
div#botoneravinculararticulos {
    text-align: center;
    position: absolute;
    bottom: 0px;
    width: 100%;
}

div#contenidotecnicoeliminar,
div#contenidoesteticaeliminar,
div#contenidodescuentoeliminar,
div#contenidovinculararticulos {
    text-align: center;
    background-color: transparent;
}

table.dataTable.no-footer.ver-bajas thead {
    border-style: solid;
    border-color: #841a1a;
    border-radius: 5px;
    background-color: #841a1a;
}

@media all and (max-width: 930px) {
    div#filtrosservicios {
        margin-bottom: 0px;
    }
}

@media all and (min-width: 950px) {
    div#filtrosservicios {
        margin-bottom: -2em;
    }
}

.ui-controlgroup-label {
    padding: 0px;
}

div.ui-slider {
    margin: 0em 0;
}

.ui-select.ui-btn-inline.ui-mini {
    margin-top: 0em;
    margin-left: 0em;
}

div[class*="ui-block-"]>div.ui-input-text {
    margin-left: 0em;
    margin-top: 0em;
    display: inline-block;
}

.ui-input-text.ui-state-disabled,
select.ui-state-disabled {
    color: #fff !important;
    opacity: 1;
    background-color: #413e3e;
}

div#formulario_entrada {
    width: 200px;
    border-style: solid;
    border-width: 6px;
    border-radius: 15px;
    padding: 3em;
    border-color: var(--main-color);
    margin-top: -200px;
    margin-left: -150px;
    position: absolute;
    top: 50%;
    left: 50%;
    height: 270px;
    background-color: #000000b3;
}

.ui-page-principal {
    position: absolute;
    background-image: url("../img/fondoprincipal.jpg");
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

div#pie_pagina {
    width: 100%;
    background-color: var(--main-pie-pagina);
    color: #bcb9b9;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: var(--main-color);
}

.derecha {
    float: right;
    margin-right: 1em;
}

.izquierda {
    float: left;
    margin-left: 1em;
}

div#foto-edicion {
    width: 100px;
    height: 100px;
    background-color: #353535;
    float: right;
    position: absolute;
    right: 2%;
    top: 52px;
    padding: 0.5em;
    z-index: 9;
}

.img-foto-edicion {
    width: inherit;
    height: inherit;
}

.oculto {
    display: none;
}

a#eliminar_foto {
    width: 100px;
    margin: 0px;
    padding: 0px;
    margin-top: 10px;
    margin-left: -5px;
    padding-right: 10px;
}

a#ui-btn-NUEVAFAMILIA,
a#ui-btn-NUEVOGRUPO,
a#ui-btn-NUEVOSUBGRUPO,
a#ui-btn-BUSCARCLI,
a#ui-btn-GESTIONCONOCIDO,
a#ui-btn-GESTIONTIPOCLIENTE,
a.boton-externo.ui-btn,
a.boton-externo2.ui-btn,
a#ui-btn-RECOMENDADOS {
    background-color: #d8cbbc !important;
    margin-right: 0px;
}

div.nopadding.ui-tabs-panel {
    padding: 0em;
}

.ui-grid-a>.ui-block-a.ui-block-especial {
    width: 66.5%;
}

.ui-grid-a>.ui-block-b.ui-block-especial {
    width: 33.5%;
}

.widthauto>div.ui-input-text,
label.widthauto,
input.widthauto,
.widthauto2>div.ui-input-text,
label.widthauto,
input.widthauto2 {
    width: auto;
}

form#form-edicion div[class*="ui-grid-a"] .ui-field-contain.widthauto>label,
form#form-edicion div[class*="ui-grid-a"] .ui-field-contain.widthauto2>label {
    width: 54%;
}

.widmedio>div.ui-input-text,
label.widthmedio,
input.widthmedio {
    width: 50%;
}

.widthfull>div.ui-input-text,
label.widthfull,
input.widthfull {
    width: 100%;
}

div#contenido_gestionexterna .ui-btn {
    background-color: white;
    border-style: none;
}

div.input-oculto>div.ui-input-text {
    display: none;
}

div#lista_familias {
    overflow-y: auto;
    max-height: 485px;
}

.fondo-transparente.ui-btn {
    background: none;
    border: none;
    color: white;
}

.fondo-transparente.ui-btn:hover {
    background: none;
    border: none;
    color: white;
}

.centrado {
    text-align: center;
}

.ui-mini .ui-controlgroup-label {
    font-size: 14px;
    padding: 0;
}

.alertify .ajs-body .ajs-content .ajs-input {
    display: block;
    width: 100%;
    padding: 8px;
    margin: 4px;
    border-radius: 2px;
    border: 1px solid #CCC;
}

.ui-cal .ui-cal-event.ocupado .details {
    background: repeating-linear-gradient(45deg, #ffffff80, #606dbc33 10px, #ffffff4d 10px, #4652984d 20px);
}

.ui-cal .ui-cal-event.ocupado {
    opacity: 0.7;
}

.ui-cal .ui-cal-event.ocupado.selected {
    opacity: 1;
}

div#botonera-agenda-btn>.ui-btn {
    z-index: 1;
    margin: 0;
    padding-top: 20px;
}

div#botonera-agenda-btn>.ui-btn::after {
    top: .0625em;
}

div#botonera-agenda-btn {
    display: inline;
}

input#datepicker {
    z-index: 1;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    margin-top: -1em;
    background: none;
    border: none;
    color: white;
}

.ui-btn-inline>span#liveclockagenda {
    position: absolute;
    left: 0px;
    bottom: -1.1em;
    color: var(--main-color);
    font-size: 18px;
    width: 100%;
    font-weight: bold;
}

label.ui-mini {
    font-size: 12px;
}

.primera-visita {
    background-image: url("../img/firstvisit.svg");
    height: 24px;
    width: 24px;
    position: absolute;
    z-index: 1;
    right: 26px;
    top: -7px;
}

.empleado-bloqueado {
    background-image: url("../img/confirmado.svg");
    height: 24px;
    width: 24px;
    position: absolute;
    z-index: 1;
    right: 0px;
    top: -5px;
}

.cita-cumplida {
    background-image: url("../img/smiling.svg");
    height: 20px;
    width: 20px;
    position: absolute;
    z-index: 999999;
    right: 2px;
    bottom: 2px;
}

.no-presentado {
    background-image: url("../img/broken-heart.svg");
    height: 20px;
    width: 20px;
    position: absolute;
    z-index: 2;
    right: 2px;
    bottom: 2px;
}

.ui-cal .ui-cal-event p.title.hora-bloqueada {
    color: red;
    font-size: 12px;
}

div#linea-tiempo,
div#linea-tiempo2 {
    background-color: #745337;
    width: 100%;
    position: absolute;
    right: 0px;
}

.calendario-laboral {
    float: left;
    margin: 0em 1em 1em 1em;
    text-align: right;
}

.calendario-laboral th {
    font-size: 12px;
    min-width: 3em;
    background-color: #7b6951;
    color: white;
    text-align: center;
    border-radius: 2px;
    font-weight: normal;
}

.ui-slider-switch.ui-mini .ui-slider-handle {
    height: 24px;
}

.ui-slider-switch.ui-mini .ui-slider-label {
    font-size: 13px;
}

.calendario-laboral td {
    border-style: solid;
    border-width: 1px;
    border-color: #787777;
    padding-right: 0.2em;
}

.calendario-laboral td.calendario-laboral-vacio {
    border-color: #454343;
}

.calendario-laboral td.calendario-laboral-domingo {
    background-color: #5895ff;
}

.calendario-laboral td.calendario-laboral-sabado {
    background-color: #4977bc;
}

div.ui-field-contain.widthnoauto>div.ui-select {
    max-width: 14em;
}

button.ui-btn.red,
button.ui-btn.red span {
    background-color: #ff5858;
    border-color: #020101;
    color: white;
    overflow: visible;
}

button.ui-btn.orange,
button.ui-btn.orange span {
    background-color: #ffb058;
    border-color: #020101;
    color: white;
    overflow: visible;
}

button.ui-btn.lightblue,
button.ui-btn.lightblue span {
    background-color: #51bfdd;
    border-color: #020101;
    color: white;
    overflow: visible;
}

button.ui-btn.pink,
button.ui-btn.pink span,
.ui-page-theme-a a.ui-btn.pink,
a.ui-btn.pink span {
    background-color: #ff58fd;
    border-color: #020101;
    color: white;
    overflow: visible;
}

button.ui-btn.yellow,
button.ui-btn.yellow span {
    background-color: #d5cd70;
    border-color: #020101;
    color: white;
    overflow: visible;
}

button.ui-btn.green,
button.ui-btn.green span {
    background-color: #6ec34e;
    border-color: #020101;
    color: white;
    overflow: visible;
}

button.ui-btn.violet,
button.ui-btn.violet span {
    background-color: #9f58bf;
    border-color: #020101;
    color: white;
    overflow: visible;
}

button.ui-turno.ui-btn {
    border-width: 2px;
    overflow: visible;
    background-color: #716e6e;
    padding-top: 13px;
    color: white;
}

button.ui-turno.ui-btn span {
    top: -8px;
    left: 6px;
    background-color: #504c4c;
    overflow: visible;
    position: absolute;
    border-style: none;
    border-radius: 15px;
}

button.ui-incidencia {
    border-width: 2px;
}

button.ui-incidencia.selected,
td.updating,
table.updating,
tr.updating,
button.ui-turno.selected {
    border-color: white;
    text-decoration: blink;
    -webkit-animation-name: blinker;
    -webkit-animation-duration: 0.6s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-direction: alternate;
}

a.filtered {
    -webkit-animation: 3s rotate linear infinite;
    animation: 3s rotate linear infinite;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    background-color: yellow !important;
}

@-webkit-keyframes blinker {
    from {
        opacity: 1.0;
    }

    to {
        opacity: 0.5;
    }
}

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes rotate {
    from {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
    }
}

.calendario-laboral td.incidencias-festivo {
    background-color: #ff5858;
}

.calendario-laboral td.incidencias-vacaciones {
    background-color: #ffb058;
}

.calendario-laboral td.incidencias-libre {
    background-color: #51bfdd;
}

.calendario-laboral td.incidencias-formacion {
    background-color: #ff58fd;
}

.calendario-laboral td.incidencias-maternidad {
    background-color: #d5cd70;
}

.calendario-laboral td.incidencias-baja {
    background-color: #6ec34e;
}

.calendario-laboral td.incidencias-otros {
    background-color: #9f58bf;
}

button.ui-incidencia span {
    position: absolute;
    top: -7px;
    right: -10px;
    border-style: none;
    border-radius: 10px;
    padding: 3px;
    min-width: 16px;
}

div.menu-grid {
    background-color: #505050;
    padding-left: 1em;
    margin-bottom: 1em;
    border-radius: 5px;
}

div.ui-cal-label-resource span {
    position: absolute;
    bottom: 0px;
    right: 0px;
    font-size: 2.5em;
    color: #ffffff80;
    width: 100%;
    text-align: center;
    z-index: 0;
}

div.ui-cal-label-resource div.empleado-porcentaje {
    position: absolute;
    bottom: 0px;
    right: 0px;
    font-size: 2.5em;
    color: #ffffff80;
    width: 100%;
    text-align: center;
    z-index: 0;
    background-color: #2321204d;
    height: 0%;
}

.ui-cal .ui-cal-event.ui-cal-incidencia {
    border-color: red;
    border-style: solid;
    border-width: 3px;
    margin-left: -3px;
}

.ui-cal .ui-cal-event.ui-dragging-start {
    border-color: #7b8183;
    border-style: solid;
    border-width: 3px;
    margin-left: -3px;
}

.ui-btn.nomarginleft,
div.nomarginleft .ui-select {
    margin-left: 0px;
}

div#info_cliente {
    font-size: 14px;
}

a#varios_hombre {
    background-image: url("./images/icons-png/man.png");
    background-repeat: no-repeat;
    background-position: center;
    height: 3em;
    margin: 0px;
    width: 100%;
    margin-right: 3px;
}

a#inwait_varios_hombre {
    background-image: url("./images/icons-png/man.png");
    background-repeat: no-repeat;
    background-position: center;
    height: 1.3em;
    margin: 0px;
    width: 50px;
}

a#varios_mujer {
    background-image: url("./images/icons-png/woman.png");
    background-repeat: no-repeat;
    background-position: center;
    height: 3em;
    margin: 0px;
    width: 100%;
    margin-left: 3px;
}

a#inwait_varios_mujer {
    background-image: url("./images/icons-png/woman.png");
    background-repeat: no-repeat;
    background-position: center;
    height: 1.3em;
    margin: 0px;
    width: 50px;
}

a#inwait_clientes {
    height: 1.3em;
    margin: 0px;
    font-size: 12px;
    width: 100px;
}

a#inwait_pasaragenda {
    height: 1.3em;
    margin: 0px;
    font-size: 12px;
    width: 186px;
}

a#inout {
    background-image: url("../img/inout.png");
    background-repeat: no-repeat;
    background-position: center;
    height: 2em;
    margin: 0px;
    width: 3em;
    padding: 1em;
}

a#inout.inoutactiva {
    background-color: #faff00;
}

.ui-btn.moneda>img {
    height: 60px;
}

.ui-btn.moneda.peque>img {
    height: 50px;
}

.ui-btn.tarjetacredito>img {
    height: 80px;
    width: 120px;
}

a.calculadora {
    font-size: 1.5em;
    width: 15px;
    margin: 5px;
}

div#formaspago {
    margin-right: 1em;
    text-align: center;
    background-color: var(--main-section-color);
}

div#formaspago>p,
div#opciones-cobro>p {
    text-align: center;
    background: var(--main-gradient);
}

div#opciones-cobro {
    text-align: center;
    background-color: var(--main-section-color);
}

a.ui-btn.moneda,
a.ui-btn.billete,
a.ui-btn.tarjetacredito {
    background-color: #3f25144d;
}

a.ui-btn.formapago.selected {
    font-size: 14px;
    background-color: #4580c3;
    color: white;
}

a.ui-btn.tarjetacredito.selected {
    background-color: #fff600;
    color: white;
}

span#spanformapago {
    position: absolute;
    font-size: 10em;
    opacity: 0.2;
    left: 0px;
}

div#caja_grupos {
    max-height: 8em;
    overflow: auto;
}

div#nav-panel {
    background-color: #334651b3;
}

div#gestioncobrotabs {
    background-color: var(--main-section-color);

}

div#gestioncobrotabs1,
div#gestioncobrotabs2 {
    padding: 0px 0px 0px 5px;
}

div.nomargin>div.ui-input-text {
    margin: 0px;
    width: 99%;
    margin-bottom: 1em;
}

div.nomarginall>div.ui-input-text,
div.nomarginall>div.ui-checkbox,
div.nomarginall>div.ui-select {
    margin: 0px;
}

.ui-navbar li:last-child .ui-btn {
    margin-right: 0px;
}

div#cobro_variostickets {
    background-color: rgba(50, 79, 164, 0.9);
    width: 600px;
    height: auto;
    border-radius: 5px;
    display: none;
}

div#contenidocobro_variostickets {
    padding: 1em;
}

div#contenidocobro_variostickets2 {
    position: relative;
    bottom: 0px;
    width: 100%;
    text-align: center;
}

div#contenidocobro_variostickets .ui-controlgroup-controls .ui-btn>span {
    color: white;
    float: right;
    margin-left: 2em;
}

div#contenidocobro_variostickets .ui-controlgroup-controls .ui-checkbox:hover>.ui-btn>span {
    color: black;
}

.ui-mobile .ui-btn-icon-top.activado::after {
    color: yellow;
}

.amarillo {
    color: yellow !important;
}

.ui-keyboard {
    background-color: #495e72;
}

.ui-keyboard-preview-wrapper {
    padding: 0.5em;
}

.ui-navbar li .ui-btn {
    border: 0px;
}

a.btn_empleado img {
    position: absolute;
    top: 0px;
    left: 0px;
    border-radius: 6px;
    border: 2px solid #e18115;
}

a.btn_empleado p {
    position: absolute;
    top: 4px;
    right: 0px;
    white-space: normal;
    color: #333;
}

a.btn_empleado.seleccionado p {
    color: white;
}

a.btn_empleado.seleccionado img {
    border: 2px solid #8f5a1f;
}

a#btn_usuario img {
    position: absolute;
    top: 0px;
    left: 0px;
    border-radius: 6px;
    border: 2px solid #e18115;
}

a#btn_usuario p {
    position: absolute;
    top: 4px;
    right: 0px;
    height: 3em;
    white-space: normal;
    color: #333;
}

a#btn_usuario.seleccionado p {
    color: white;
}

a#btn_usuario.seleccionado img {
    border: 2px solid #8f5a1f;
}

table#myTableTickets.dataTable tbody td p {
    text-align: left;
    color: rgb(151, 185, 201);
}

table#myTableTickets.dataTable tbody td.selected p {
    color: rgb(75, 94, 104);
    font-weight: normal;
}

table#myTableTickets.dataTable tbody td p.obs_cli {
    width: 150%;
    display: none;
}

table#myTableTickets.dataTable tbody td.selected p.obs_cli {
    color: #934a0d;
    width: 100%;
    margin-left: -57px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    display: block;
}

.ui-datepicker {
    z-index: 600097 !important
}

table.dataTable.fichero thead {
    background-color: #2b4a65;
    color: white;
}

table.dataTable.fichero tfoot {
    background-color: #2b4a65;
    font-weight: bold;
    color: white;
}

.ui-tabs .ui-tabs-nav li.ui-tabs-active {
    margin-bottom: 0px;
}

div#contenedorPagoCombinado {
    background-color: var(--main-section-color);
    ;
    padding-left: 5%;
    border-radius: 15px;
    padding-bottom: 2%;
    margin: 0px auto;
    margin-right: 0px;
    padding-right: 15px;
}

div#contenedorPagoCombinado label {
    margin: 2px 0px 0px 0px;
}

div#botonera-historicotickets {
    position: fixed;
    bottom: 0px;
    width: 95%;
}

div#botonera-historicopedidos {
    position: fixed;
    bottom: 0px;
    width: 95%;
}

div#historicotickets-loading,
div#historicotickets-loading2,
div#historicotickets-loading3 {
    text-align: center;
    font-size: 2em;
    position: absolute;
    width: 100%;
    z-index: 1;
    color: var(--main-color);
}

div.tabla-loading {
    text-align: center;
    font-size: 2em;
    position: absolute;
    width: 50%;
    z-index: 1;
    color: var(--main-color);
}

div#opcionesmesas {
    background-color: rgba(81, 75, 71, 1);
    width: auto;
    max-width: 800px;
    height: auto;
    display: none;
    border-radius: 15px;
    border: var(--main-color) solid 2px;
}

div#contenidoopcionesmesas {
    margin: 1em;
    background: transparent;
}

div#cambiarpassword {
    background-color: rgba(81, 75, 71, 1);
    width: auto;
    max-width: 800px;
    height: auto;
    display: none;
    border-radius: 15px;
    border: var(--main-color) solid 2px;
}

div#contenidocambiarpassword {
    margin: 1em;
    background: transparent;
}

div#editartickethistorico {
    background-color: rgba(81, 75, 71, 1);
    width: 95%;
    max-width: 800px;
    height: 500px;
    display: none;
    border-radius: 15px;
    border: var(--main-color) solid 2px;
}

div#contenidoeditartickethistorico {
    margin: 1em;
}

div#contenidoeditartickethistorico p {
    color: var(--main-color) !important;
    border-bottom: var(--main-color) solid 1px;
    font-weight: bold;
}

div#botonera-verdetalleticket {
    position: absolute;
    bottom: 0px;
    margin-right: 1em;
}

div#botonera-verdetalleticket label {
    font-size: 10px;
}

.dataTables_length {
    margin-left: 1em;
}

.ui-tabs-panel .dataTables_wrapper.no-footer {
    margin-bottom: 1em;
}

div#nombre_caja span {
    color: var(--main-color);
}

/* Estilos para los botones en la parte inferior del formulario */
.kt-login-v1__actions {
    display: flex;
    width: 90%;
    flex-wrap: wrap;
    justify-content: space-between;
}

.login-btn {
    box-shadow: 0px 0px 5px black;
    background-color: white;
    width: 30%;
    font-size: large;
}

.signup-btn {
    box-shadow: 0px 0px 5px black;
    background-color: white;
    width: 30%;
    font-size: large;
}

.forgot-pwd {
    color: white;
    width: 100%;
    margin-top: 10px;
    font-size: 15pt;
    text-align: right;
}

/* Estilos para el modal de registro */
.signup-modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.6);
}

.signup-modal-content {
    background-color: white;
    margin: 10% auto;
    padding: 20px;
    border-radius: 5px;
    width: 50%;
    max-width: 500px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    position: relative;
}

.signup-title {
    font-size: 1.5em;
    font-weight: bold;
    margin-bottom: 20px;
    text-align: center;
}

.signup-close-btn {
    position: absolute;
    right: 15px;
    top: 10px;
    font-size: 24px;
    font-weight: bold;
    cursor: pointer;
}

.signup-form-action {
    margin-top: 20px;
    text-align: center;
}

@media screen and (max-width: 768px) {
    .signup-modal-content {
        width: 90%;
        margin: 20% auto;
    }

    .kt-login-v1__actions {
        flex-direction: column;
    }

    .login-btn,
    .signup-btn {
        width: 100%;
        margin-bottom: 10px;
    }
}

div#myTableCierreCobros_wrapper,
div#myTableCierrePagos_wrapper,
div#myTableCierreAdicional_wrapper,
div#myTableCierreLiquido_wrapper {
    margin-left: 1em;
}

.dataTable caption.integrado {
    font-size: 1.3em;
    text-align: center;
    background-color: #2b4a65;
    font-family: var(--main-font);
    margin: 0px;
    font-weight: bold;
    padding-top: 10px;
}

tr.destacado {
    font-weight: bold;
    background-color: #cfd4db !important;
}

tr.destacado2 {
    background-color: #cfd4db !important;
}

div#myTableCierreDetalle_wrapper,
div#myTableCierreZonas_wrapper,
div#myTableCierreFamilias_wrapper,
div#myTableCierreLiquido_wrapper,
div#myTableCierreCobros_wrapper,
div#myTableCierrePagos_wrapper,
div#myTableCierreAdicional_wrapper {
    line-height: 0.5em;
}

div#cierre_cambios {
    background-color: var(--main-background-color);
    width: 100%;
    height: 100%;
    border-radius: 5px;
    display: none;
}

.div_aviso {
    position: fixed;
    z-index: 1;
    background-color: var(--main-background-color);
    width: 100%;
    height: 100%;
    text-align: center;
}

.contenido_div_aviso {
    background-color: #2b4a65;
    width: 60%;
    margin: 0px auto;
    border-radius: 15px;
    padding: 1em;
}

.ui-btn.main-btn {
    background: linear-gradient(var(--main-main-btn), var(--main-color));
    border-radius: 15px;
    border-color: var(--main-color);
}

.ui-btn.main-btn>span {
    margin-top: 8px;
    margin-bottom: 8px;
    display: block;
}

div#contenedor_main_btn {
    background-color: var(--main-contenedor-central);
    padding: 1em;
    text-align: center;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

a#opciones_cambiarcaja>span {
    background-color: rgba(0, 0, 0, .3);
    border: 3px rgba(0, 0, 0, .3);
    border-radius: 5px;
    margin-left: -0.5em;
    margin-right: -0.5em;
    margin-top: -0.5em;
    display: block;
    margin-bottom: 1em;
}

.extragrande {
    text-align: center;
    font-size: 2em;
    font-weight: 100;
}

.grande {
    text-align: center;
    font-size: 2em;
    font-weight: normal;
}

.pie-izda {
    margin: 0px 0px 0px 10px;
}

#editarServicioButton {
    position: absolute;
    right: auto;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
}
#borrarServicioButton {
    position: absolute;
    right: auto;
    left: 105px;
    top: 50%;
    transform: translateY(-50%);
}
#editarProductoButton {
    position: absolute;
    right: auto;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
}
#borrarProductoButton {
    position: absolute;
    right: auto;
    left: 105px;
    top: 50%;
    transform: translateY(-50%);
}
#editarMarcaButton {
    position: absolute;
    right: auto;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
}
#borrarMarcaButton {
    position: absolute;
    right: auto;
    left: 105px;
    top: 50%;
    transform: translateY(-50%);
}

#editarClienteButton {
    position: absolute;
    right: auto;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
}
#borrarClienteButton {
    position: absolute;
    right: auto;
    left: 105px;
    top: 50%;
    transform: translateY(-50%);
}

#editarFamilia {
    position: absolute;
    right: auto;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
}
#borrarFamilia {
    position: absolute;
    right: auto;
    left: 105px;
    top: 50%;
    transform: translateY(-50%);
}
#editarProveedorButton {
    position: absolute;
    right: auto;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
}
#borrarProveedorButton {
    position: absolute;
    right: auto;
    left: 105px;
    top: 50%;
    transform: translateY(-50%);
}
#editarEmpleadoButton {
    position: absolute;
    right: auto;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
}
#borrarEmpleadoButton {
    position: absolute;
    right: auto;
    left: 105px;
    top: 50%;
    transform: translateY(-50%);
}

.modal-close {
    cursor: pointer;
}

.modal-footer {
    position: relative;
}

div#pie_pagina a {
    font-weight: normal;
    color: #bcb9b9;
    text-decoration: none;
}

destacar {
    color: var(--main-color-texto);
}

destacarsi {
    color: lightgreen;
}

destacarno {
    color: red;
}

destacarmas {
    color: var(--main-color-texto);
    font-size: large;
}

blanco {
    color: var(--main-title-color);
}

rojo {
    color: rgba(255, 100, 100, 0.9);
    font-weight: 100;
}

verde {
    color: rgb(15, 244, 162);
    font-weight: 100;
    font-size: 12px;
}

grande {
    font-size: large;
}

alto {
    font-size: 20px;
}

negrita {
    color: var(--main-color-texto);
}

div#cambiarcajahistorico,
div#cambiarfphistorico {
    background-color: rgba(81, 75, 71, 1);
    width: 25%;
    max-width: 800px;
    height: auto;
    display: none;
    border-radius: 15px;
    border: var(--main-color) solid 2px;
}

div#contenidocambiarcajahistorico,
div#contenidocambiarfphistorico {
    margin: 1em;
}

a.ui-btn.btn_agenda_familia,
a.ui-btn.btn_inwait_familia {
    min-width: 71px;
    width: 85%;
    font-size: 10px;
    padding: .7em 0.5em;
    background-color: #92d0f2;
    border-color: #43606f;
}

a.ui-btn.btn_agenda_familia2,
a.ui-btn.btn_agenda_familia_nuevacita {
    min-width: 69px;
    width: 16%;
    font-size: 10px;
    padding: .7em 0.5em;
    background-color: #92d0f2;
    border-color: #43606f;
}

a.ui-btn.btn_agenda_grupo,
a.ui-btn.btn_inwait_grupo {
    min-width: 71px;
    width: 85%;
    font-size: 10px;
    padding: .7em 0.5em;
    background-color: #92d0f2;
    border-color: #43606f;
}

a.ui-btn.btn_agenda_servicio,
a.ui-btn.btn_inwait_servicio {
    min-width: 100px;
    width: 85%;
    font-size: 10px;
    padding: 0em 0.5em 1em;
    background-color: #92d0f2;
    border-color: #43606f;
    height: 2em;
    white-space: normal;
}

pre.details.precita-cumplida {
    text-decoration: line-through #fff6 double;
}

legend.fondo-transparente {
    color: var(--main-color);
    font-weight: bold;
}

form#form-edicion div[class*="margin-fieldset ui-block-"] .ui-field-contain,
form#form-edicion_edicion div[class*="margin-fieldset ui-block-"] .ui-field-contain {
    margin: 0.5em 0;
}

span.parametro {
    margin: 0em 2% 0 8px;
    position: absolute;
    color: #e7cba2;
    font-weight: bold;
}

span.parametroinfo {
    font-size: 12px;
    margin: 1.5em 2% 0 8px;
    position: absolute;
    color: #a2917b;
    line-height: 11px;
}

div#botonera_editarconfirmar .ui-btn,
div#contenidomessage .ui-btn,
div#botonera_eliminarconfirmar .ui-btn {
    background-color: var(--main-btn-confirmarbg);
    border-color: var(--main-btn-confirmarbr);
}

p.titulogrid {
    text-align: center;
    color: var(--main-color);
    margin: 0px;
    font-weight: bold;
}

.loadergrid {
    color: #fff9;
    font-size: 20px;
    margin: 100px auto;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    position: relative;
    text-indent: -9999em;
    -webkit-animation: load4 1.3s infinite linear;
    animation: load4 1.3s infinite linear;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}

#DatosCli1 {
    padding-top: 1em;
}

#DatosCli1 .row {
    padding-top: 1em;
}


#DatosCli1.DatosCli1 {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5em;
    width: 100%;
    margin-top: 1em;
    justify-content: center;
}

#PrimeraColumna,
#SegundaColumna,
#TerceraColumna,
#CuartaColumna {
    position: static;
    left: auto;
    top: auto;
    width: auto;
    height: auto;
    padding-top: 0;
}




#PrimeraColumna,
#SegundaColumna,
#TerceraColumna,
#CuartaColumna {
    flex: 1 1 12.5em;
    min-width: 12.5em;
    max-width: 18.75em;
}

.SegundaColumna {
    padding-left: 5em;
}

.TerceraColumna {
    margin-left: -4.5em
}


@-webkit-keyframes load4 {

    0%,
    100% {
        box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
    }

    12.5% {
        box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }

    25% {
        box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }

    37.5% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }

    50% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }

    62.5% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
    }

    75% {
        box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
    }

    87.5% {
        box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
    }
}

@keyframes load4 {

    0%,
    100% {
        box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
    }

    12.5% {
        box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }

    25% {
        box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }

    37.5% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }

    50% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }

    62.5% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
    }

    75% {
        box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
    }

    87.5% {
        box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
    }
}

div.nomargin>div.ui-btn-inline>div.ui-input-text,
div.nomargin>a {
    margin-top: 0px;
    margin-bottom: 0px;
}

table.dataTable.display tbody tr.semana {
    background-color: #d9b3a3;
    font-weight: bold;
}

table.dataTable.display tbody tr.semana2 {
    background-color: #d4f5b6;
    font-weight: bold;
}

table.dataTable.display tbody tr.semana3 {
    background-color: #c2f1cc;
    font-weight: bold;
}

.dt-buttons {
    display: none;
}

.topfixed {
    padding: 0px;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}

.topfixed-contenido {
    padding: 0em 1em 0em 1em;
}

a.ui-btn.btn_agenda_familia.seleccionado,
a.ui-btn.btn_agenda_familia_nuevacita.seleccionado,
a.ui-btn.btn_inwait_familia.seleccionado {
    color: #f5fb0d;
    background-color: #31576c;
}

span#contenidonuevacitaagenda-nombrecliente,
span.destacar {
    color: var(--main-color);
}

div#familias-empleadoservicios,
div#grupos-empleadoservicios {
    overflow-y: scroll;
}

div#contenidoeditarservicio p.info {
    color: #bbecf9 !important;
    border: none;
    font-weight: 100;
    margin-bottom: 0px;
    font-size: 14px;
}

div#grupos-empleadoservicios label,
div#familias-empleadoservicios label {
    font-size: 12px;
}

div#myTableComisionesDetalle_wrapper {
    padding-right: 1em;
    line-height: 1.5;
}

div#myTableComisionesResumen_wrapper {
    line-height: 1;
}

div#nav-panelcomisiones,
div#nav-panelopciones {
    background-color: #334651e6;
    color: white;
}

div#nav-panelcomisiones label,
div#nav-panelopciones label {
    font-size: 14px;
    font-weight: 100;
}

div#nav-panelcomisiones p,
div#nav-panelopciones p {
    text-align: center;
    font-size: 27px;
    color: var(--main-color);
    margin-top: 0px;
}

div#nav-panelcomisiones .ui-slider {
    display: block;
    margin: 0px auto;
}

div#nav-panelcomisiones .ui-select {
    max-width: 175px;
}

.deuda-atrasada {
    color: red;
}

table.dataTable thead th,
table.dataTable thead td {
    padding: 8px 12px;
}

table.dataTable thead th:nth-child(1) {
    border-radius: 5px 0px 0px 0px;
}

table.dataTable thead th:last-child {
    border-radius: 0px 5px 0px 0px;
}

table.dataTable thead th.dt-right,
table.dataTable thead td.dt-right {
    text-align: center;
}

table#myTableHistoricoCierreLiquido {
    font-size: 12px;
    font-family: "courier new";
    line-height: 0.2;
    white-space: pre-wrap;
    max-width: 300px;
}

div#div-cierre-detalle {
    padding: 1em;
}

div.nomargin .ui-input-search {
    margin-top: 0px;
    margin-right: 1em;
}

.dataTable caption.destacado {
    text-align: center;
    font-weight: bold;
    margin: 0.1em;
}

div.ui-btn.filtered {
    background-color: #fbdeb9;
}

p.nomargin {
    margin: 0px auto;
}

.aviso {
    color: red;
    font-weight: bold;
}

.circlegreen {
    border-radius: 50%;
    width: 12px;
    height: 12px;
    background-image: -moz-radial-gradient(45px 45px 45deg, circle cover, green 0%, green 100%, lightgreen 95%);
    background-image: -webkit-radial-gradient(45px 45px, circle cover, green, lightgreen);
    background-image: radial-gradient(45px 45px 45deg, circle cover, green 0%, green 100%, lightgreen 95%);
}

.circlered {
    border-radius: 50%;
    width: 12px;
    height: 12px;
    background-image: -moz-radial-gradient(45px 45px 45deg, circle cover, red 0%, red 100%, #f9b0b0 95%);
    background-image: -webkit-radial-gradient(45px 45px, circle cover, red, #f9b0b0);
    background-image: radial-gradient(45px 45px 45deg, circle cover, red 0%, red 100%, #f9b0b0 95%);
}

div#botoneraaux {
    width: 140px;
}

table#myTableImprimirTicket {
    font-size: 12px;
    font-family: "courier new";
    white-space: pre-wrap;
    max-width: 300px;
}

tr.nuevo,
button.destacado {
    font-weight: bold;
    background-color: yellow !important;
}

div#editardetclub {
    background-color: rgba(81, 75, 71, 1);
    width: 95%;
    max-width: 800px;
    height: 500px;
    display: none;
    border-radius: 15px;
    border: var(--main-color) solid 2px;
}

div#contenidoeditardetclub {
    margin: 1em;
}

table#myTableFicheroPacksDetalle p {
    border: none;
    color: blue !important;
    font-style: oblique;
    margin: 0px;
}

div.selectsinmargenizdo>div.ui-mini {
    margin-left: 0px;
}

tr.pack {
    font-weight: bold;
}

div#listados-loading {
    text-align: center;
    font-size: 2em;
    position: absolute;
    width: 100%;
    z-index: 1;
    color: var(--main-color);
    height: 100%;
    background: var(--main-background-color) none repeat scroll 0% 0%;
}

div#listados-loading2 {
    text-align: center;
    font-size: 2em;
    position: absolute;
    width: 100%;
    z-index: 1;
    color: var(--main-color);
    height: 100%;
    background: var(--main-background-color) none repeat scroll 0% 0%;
}

.dt-print-view>h1 {
    text-align: center;
}

form#form-pedidos .ui-field-contain>label {
    width: auto;
    min-width: 4em;
}

form#form-pedidos .ui-field-contain>div.ui-input-text,
form#form-vtos .ui-field-contain>div.ui-input-text {
    width: auto;
}

form#form-pedidos .ui-input-text input,
form#form-pedidos .ui-input-search input {
    padding-top: 0px;
    padding-bottom: 0px;
    min-height: 1.8em;
}

form#form-pedidos .ui-select div {
    padding-top: 6px;
    padding-bottom: 6px;
}

form#form-vtos .ui-field-contain>label {
    width: 10em;
    min-width: 4em;
}

td.modificado {
    font-weight: bold;
    color: #4f4fcc;

}

div#select-tipo-button,
div#select-tipo2-button,
div#select-tipo3-button {
    background-color: #13eded;
}

td.pendiente {
    font-weight: bold;
    color: red;
}

div#editarservicio.nuevo,
div#editarservicio_edicion.nuevo {
    border: var(--main-frm-nuevo) solid 2px;
    background-color: rgb(71, 81, 72);
}

div#editarservicio.nuevo div#contenidoeditarservicio p.nuevo,
div#editarservicio_edicion.nuevo>div#contenidoeditarservicio_edicion p {
    color: var(--main-frm-nuevo) !important;
    border-bottom: var(--main-frm-nuevo) solid 1px;
}

div#editarservicio.nuevo .ui-widget-header,
div#editarservicio_edicion.nuevo .ui-widget-header,
div#editarservicio.nuevo .ui-tabs.ui-widget-content,
div#editarservicio_edicion.nuevo .ui-tabs.ui-widget-content {
    background: #69a273;
}

div#editarservicio.nuevo .ui-widget.ui-widget-content,
div#editarservicio_edicion.nuevo .ui-widget.ui-widget-content {
    border: 1px solid #69a273;
}

div#editarservicio.baja,
div#editarservicio_edicion.baja {
    border: var(--main-frm-baja) solid 2px;
    background-color: rgb(150, 72, 72);
}

div#editarservicio.baja div#contenidoeditarservicio p.baja,
div#editarservicio_edicion.baja>div#contenidoeditarservicio_edicion p {
    color: var(--main-frm-baja) !important;
    border-bottom: var(--main-frm-baja) solid 1px;
}

span.canjeadopuntos {
    font-weight: bold;
    color: blue;
}

a#btn_servicio.ui-itinerario {
    padding: 0.5em;
    border-width: 3px;
    background-color: #cce4e9;
    border-radius: 5px;
    width: 100px;
}

a#btn_servicio.ui-itinerario.ui-itinerario-opcional {
    padding: 0.5em;
    border-width: 3px;
    background-color: #f4eb09;
    border-radius: 5px;
    width: 100px;
}

a#btn_servicio.ui-packopt {
    padding: 0.5em;
    border-width: 3px;
    background-color: #f0f522;
    border-radius: 5px;
    width: 100px;
}

a#btn_servicio.ui-packopt.btn-imagen,
a#btn_servicio.ui-itinerario.btn-imagen {

    height: 10em;
    width: 6em;
}

a#btn_servicio.ui-packopt.btn-imagen>span,
a#btn_servicio.ui-itinerario.btn-imagen>span {

    height: 2.5em;
    white-space: normal;
}

a#btn_pack.itinerario {
    background-image: url('../img/fondobtnitinerario.png');
    background-size: cover;
}

a.btn_empleado.salida {
    background-color: gray;
    color: white;
}

div#claveacceso {
    background-color: rgb(83, 78, 70);
    width: 430px;
    max-height: 600px;
    border-radius: 5px;
    display: none;
    margin: 10px;
    border: 2px solid var(--main-color);
}

div#claveacceso .ui-btn {
    font-size: 1.3em;
    margin: 2px;
}

a#btn_exposicion,
a#btn_comensal {
    width: 2em;
}

div#tiempoexposicion,
div#comensales {
    background-color: var(--main-confirmarbg);
    border-radius: 5px;
    display: none;
    border: 2px solid var(--main-confirmarbr);
    padding: 1em;
}

span.exposicion {
    float: right;
    color: #864e26;
}

span.exposicionicon {
    float: right;
    color: #cb7639;
}

table.dataTable.display tbody tr.titulo {
    text-align: center;
    font-weight: bold;
    font-size: 1.5em;
    color: gray;
}

table.dataTable.display tbody tr.vacia {
    display: none;
}

div#cierre_detallegastos {
    background-color: rgba(50, 79, 164, 1);
    width: 600px;
    height: auto;
    border-radius: 5px;
    display: none;
}

div#objetos-mesa {
    background-color: rgba(50, 44, 40, 1);
    width: auto;
    height: auto;
    border-radius: 5px;
    display: none;
    border: rgb(83, 81, 80) 5px solid;
    padding: 10px;
}

div#mesas-caja {
    background-color: rgba(50, 44, 40, 1);
    width: 99%;
    height: 98%;
    border-radius: 5px;
    display: none;
    border: rgb(83, 81, 80) 5px solid;
    padding: 0px;
    margin: 0px;
}

div#mesa-obs {
    mix-blend-mode: difference;
    font-size: 12px;
    white-space: normal;
    text-overflow: ellipsis;
    overflow: hidden;
    line-height: 1em;
}

div#mesa-obscli {
    mix-blend-mode: difference;
    font-size: 10px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

a#btn_servicio>span.servicio_cantidad,
a#btn_pack>span.servicio_cantidad {
    position: absolute;
    top: 50%;
    width: 33px;
    height: 20px;
    font-size: 16px;
    border-radius: 0px 0px 5px 0px;
    background-color: rgba(7, 237, 7, 0.79);
    color: black;
}

div#contenidocierredetallegastos {
    background-color: rgba(50, 79, 164, 1);
}

span.span-turno {
    position: absolute;
    margin-left: -40px;
    margin-top: -5px;

}

span.calendario_horas {
    position: absolute;
    display: block;
}

div.ui-cal-time.notrabajo {
    background-color: darkgray;
}

span.stock {
    color: #edea22;
}

span#img-online {
    font-size: 15px;
    height: 24px;
    width: 24px;
    position: absolute;
    z-index: 1;
    right: 78px;
    top: -7px;
}

span#img-llamado {
    font-size: 15px;
    height: 24px;
    width: 24px;
    position: absolute;
    z-index: 1;
    left: 30px;
    top: -7px;
}

span#img-confirmado {
    font-size: 15px;
    height: 24px;
    width: 24px;
    position: absolute;
    z-index: 1;
    left: 48px;
    top: -7px;
}

span#img-sentado {
    font-size: 15px;
    height: 24px;
    width: 24px;
    position: absolute;
    z-index: 1;
    left: 67px;
    top: -7px;
}

div#bloqueopantalla {
    background-color: rgba(81, 75, 71, 1);
    width: 100%;
    height: 100%;
}

div#divbloqueo {
    background-color: rgba(81, 75, 71, 1);
    width: 100%;
    height: 100%;
}

td.preciofijado {
    font-weight: bold;
    color: fuchsia;
}

td.preciomodificado {
    font-weight: bold;
    color: blue;
}

span.preciofijado {
    display: block;
    font-size: 8px;
    color: #b084b9;
}

tr.ticket-bloqueado,
tr.articulo-bloqueado,
tr.articulo-bloqueado td:nth-child(3) {
    background-color: #a389a8 !important;
}

span.tarjetaprepago.glyphicons-lock {
    float: right;
    color: red;
}

span.tarjetaprepago.glyphicons-unlock {
    float: right;
    color: lightgreen;
}

tr.tarjeta-bloqueada {
    background-color: #ec6a6a !important;
}

tr.nuevo_cliente {
    background-color: #f4e795 !important;
}

tr.destacado3 {
    color: blue;
}

tr.destacado4 {
    color: green;
    font-weight: bold;
}

tr.destacadoerror {
    color: red;
}

tr.destacadoerror2 td {
    background-color: rgb(237, 205, 205) !important;
}

a.canvasjs-chart-credit {
    visibility: hidden;
}

table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled {
    background-image: none !important;
}

div#contenedor-controlproduccion2 table.dataTable tbody th,
div#contenedor-controlproduccion2 table.dataTable tbody td {
    padding: 2px 10px;
}

div#contenedor-controlproduccion2 table.dataTable thead th,
div#contenedor-controlproduccion2 table.dataTable thead td {
    padding: 4px 10px;
}

div#contenedor-controlproduccion2 div.ui-body-d {
    margin: 2px;
}

.dataTables_wrapper .dataTables_processing {
    color: #343437;
    font-size: 2em;
}

span#img-sms {
    background-image: url("../img/message.svg");
    height: 26px;
    width: 24px;
    position: absolute;
    z-index: 9999;
    right: 50px;
    top: -14px;
}

tr.lineatecnica {
    background: linear-gradient(180deg, rgba(2, 0, 36, 1) 0%, rgba(248, 195, 150, 1) 0%, rgba(255, 255, 255, 1) 100%);
}

a.btn-tallacolor {
    width: 10em;
    white-space: break-spaces;
    height: 4em;
}

table.dataTable.display tbody tr.odd.devolucionregalo,
table.dataTable.display tbody tr.even.devolucionregalo {
    color: white;
}

span.accesorapido {
    font-size: 12px;
    font-weight: 300;
    color: white;
    position: absolute;
    right: 2px;
    bottom: 0px;
}

tr.printerscreen {
    display: none;
}

table.dataTable tbody tr.group {
    color: white;
}

span.ui-icon-check-off {
    color: grey;
}

span.ui-icon-check-on {
    color: blue;
}

.tablist-left {
    width: 25%;
    display: inline-block;
}

.ui-tabs-panel.tablist-content {
    width: 60%;
    display: inline-block;
    vertical-align: top;
    margin-left: 5%;
}

a#btn_servicio.bonoregalo>span {
    color: yellow;
}

.ui-checkbox>label.ui-btn {
    font-weight: 100;
}

div#myTableHistoricoVisitas_wrapper thead th {
    font-weight: 100;
}

.ui-radio>label.ui-btn {
    font-weight: 100;
}

.ui-page-theme-a .ui-btn-blue {
    background-color: rgb(110, 187, 231);
    border-color: blue;
}

.ui-page-theme-a .ui-btn-green,
.ui-page-theme-a .ui-btn.ui-icon-save {
    background-color: rgb(159, 213, 156);
    border-color: green;
}

.ui-page-theme-a .ui-btn.ui-icon-power,
.ui-page-theme-a .ui-btn.ui-icon-logoff {
    background-color: #e9435e !important;
    border-color: red;
}

div#myTableEtiquetasGuardadas_wrapper {
    margin: 0px;
}

a.ui-btn.ui-icon-alert {
    background-color: red;
}

div#opcionesmenuprincipal .ui-btn.ui-btn-a {
    background-color: var(--main-background-color);
    border-color: transparent;
    color: white;

}

div#contenedor-tab-mobile,
div#nuevacitainicial-familias {
    display: none;
}

label.infoservicio {
    font-size: 16px !important;
    font-weight: 100;
    margin: 1em;
    line-height: 1.5em;
}

verde {
    color: rgb(15, 244, 15);
}

h3 {
    font-weight: 500;
    margin-block-start: 0.5em;
    margin-block-end: 0.5em;
}

.suelo-comedor {
    background:
        radial-gradient(black 15%, transparent 16%) 0 0,
        radial-gradient(black 15%, transparent 16%) 8px 8px,
        radial-gradient(rgba(255, 255, 255, .1) 15%, transparent 20%) 0 1px,
        radial-gradient(rgba(255, 255, 255, .1) 15%, transparent 20%) 8px 9px;
    background-color: #282828;
    background-size: 16px 16px;
}

.suelo-terraza {
    background: linear-gradient(45deg, #dca 12%, transparent 0, transparent 88%, #dca 0),
        linear-gradient(135deg, transparent 37%, #a85 0, #a85 63%, transparent 0),
        linear-gradient(45deg, transparent 37%, #dca 0, #dca 63%, transparent 0) #753;
    background-size: 25px 25px;
}

div.ui-cal-time.destacado {
    background-color: rgb(226, 198, 174);
}

div#botonera-historicotickets-botones .ui-btn {
    width: 100px;
    white-space: break-spaces;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    height: 2.5em;
    margin: 1px;
}

div#nuevareserva {

    height: 90%;
}

div#contenidonuevareserva {

    height: 100%;
}

/* div.search-result-item:hover {
    background-color: #1a237e;
}

div.search-result-item {
    margin-bottom: 0.625em;
    padding-bottom: 0.625em;
    color: white;
    transition: background-color 0.2s;
    cursor: pointer;
} */

@media all and (max-width: 1100px) {

    .sm-blue a,
    .sm-blue a:hover,
    .sm-blue a:focus,
    .sm-blue a:active {
        font-size: 14px !important;
    }
}

@media all and (max-width: 42em) {

    table.dataTable tbody th,
    table.dataTable tbody td {
        padding: 5px 5px;
    }

    table.dataTable thead th,
    table.dataTable thead td {
        padding: 5px 5px;
    }

    div#rwd-clientes {
        display: none;
    }

    div#editartickethistorico {
        background-color: rgba(81, 75, 71, 1);
        width: 98%;
        max-width: 800px;
        height: 500px;
        display: none;
        border-radius: 15px;
        border: var(--main-color) solid 2px;
    }

    div#botonera-verdetalleticket {
        position: absolute;
        bottom: 0px;
        margin-right: 0em;
        width: 93%;
        margin-bottom: 1em;
    }

    div#selectorempresabusquedadiv {
        position: initial !important;
    }

    div#busquedaclientes_extrabtn {
        display: none !important;
    }

    div#myTableBuscaragenda_wrapper th:nth-last-child(1),
    table#myTableBuscaragenda td:nth-last-child(1),
    table#myTableBuscaragenda th:nth-last-child(1) {
        display: none;
    }

    table#myTableFicheroArticulos td:nth-child(1),
    table#myTableFicheroArticulos td:nth-child(2),
    table#myTableFicheroArticulos td:nth-child(3),
    table#myTableFicheroArticulos td:nth-child(8),
    table#myTableFicheroArticulos td:nth-child(6),
    table#myTableFicheroArticulos th:nth-child(1),
    table#myTableFicheroArticulos th:nth-child(2),
    table#myTableFicheroArticulos th:nth-child(3),
    table#myTableFicheroArticulos th:nth-child(5),
    table#myTableFicheroArticulos th:nth-child(8) {
        display: none;
    }

    table#myTableFicheroServicios td:nth-child(1),
    table#myTableFicheroServicios td:nth-child(4),
    table#myTableFicheroServicios td:nth-child(5),
    table#myTableFicheroServicios td:nth-child(6),
    table#myTableFicheroServicios td:nth-child(7),
    table#myTableFicheroServicios td:nth-child(8),
    table#myTableFicheroServicios td:nth-child(9),
    table#myTableFicheroServicios th:nth-child(1),
    table#myTableFicheroServicios th:nth-child(4),
    table#myTableFicheroServicios th:nth-child(5),
    table#myTableFicheroServicios th:nth-child(6),
    table#myTableFicheroServicios th:nth-child(7),
    table#myTableFicheroServicios th:nth-child(8),
    table#myTableFicheroServicios th:nth-child(9) {
        display: none;
    }

    table#myTableFicheroClientes td:nth-child(1),
    table#myTableFicheroClientes td:nth-child(3),
    table#myTableFicheroClientes td:nth-child(4),
    table#myTableFicheroClientes td:nth-child(5),
    table#myTableFicheroClientes td:nth-child(6),
    table#myTableFicheroClientes td:nth-child(7),
    table#myTableFicheroClientes td:nth-child(8),
    table#myTableFicheroClientes th:nth-child(1),
    table#myTableFicheroClientes th:nth-child(3),
    table#myTableFicheroClientes th:nth-child(4),
    table#myTableFicheroClientes th:nth-child(5),
    table#myTableFicheroClientes th:nth-child(6),
    table#myTableFicheroClientes th:nth-child(7),
    table#myTableFicheroClientes th:nth-child(8) {
        display: none;
    }

    table#myTableFicheroEmpleados td:nth-child(2),
    table#myTableFicheroEmpleados td:nth-child(3),
    table#myTableFicheroEmpleados td:nth-child(4),
    table#myTableFicheroEmpleados td:nth-child(5),
    table#myTableFicheroEmpleados td:nth-child(6),
    table#myTableFicheroEmpleados th:nth-child(2),
    table#myTableFicheroEmpleados th:nth-child(3),
    table#myTableFicheroEmpleados th:nth-child(4),
    table#myTableFicheroEmpleados th:nth-child(5),
    table#myTableFicheroEmpleados th:nth-child(6) {
        display: none;
    }

    table#myTableFicheroProveedores td:nth-child(2),
    table#myTableFicheroProveedores td:nth-child(3),
    table#myTableFicheroProveedores td:nth-child(4),
    table#myTableFicheroProveedores td:nth-child(5),
    table#myTableFicheroProveedores td:nth-child(6),
    table#myTableFicheroProveedores th:nth-child(2),
    table#myTableFicheroProveedores th:nth-child(3),
    table#myTableFicheroProveedores th:nth-child(4),
    table#myTableFicheroProveedores th:nth-child(5),
    table#myTableFicheroProveedores th:nth-child(6) {
        display: none;
    }

    table#myTableFicheroBonos td:nth-child(2),
    table#myTableFicheroBonos td:nth-child(3),
    table#myTableFicheroBonos th:nth-child(2),
    table#myTableFicheroBonos th:nth-child(3) {
        display: none;
    }

    table#myTableFicheroPromociones td:nth-child(2),
    table#myTableFicheroPromociones td:nth-child(3),
    table#myTableFicheroPromociones td:nth-child(4),
    table#myTableFicheroPromociones td:nth-child(5),
    table#myTableFicheroPromociones td:nth-child(6),
    table#myTableFicheroPromociones td:nth-child(7),
    table#myTableFicheroPromociones td:nth-child(8),
    table#myTableFicheroPromociones th:nth-child(2),
    table#myTableFicheroPromociones th:nth-child(3),
    table#myTableFicheroPromociones th:nth-child(4),
    table#myTableFicheroPromociones th:nth-child(5),
    table#myTableFicheroPromociones th:nth-child(6),
    table#myTableFicheroPromociones th:nth-child(7),
    table#myTableFicheroPromociones th:nth-child(8) {
        display: none;
    }

    table#myTableFicheroPacks td:nth-child(3),
    table#myTableFicheroPacks td:nth-child(4),
    table#myTableFicheroPacks td:nth-child(5),
    table#myTableFicheroPacks th:nth-child(3),
    table#myTableFicheroPacks th:nth-child(4),
    table#myTableFicheroPacks th:nth-child(5) {
        display: none;
    }

    div#myTableChequesRegalo_wrapper th:nth-child(4),
    div#myTableChequesRegalo_wrapper th:nth-child(5),
    div#myTableChequesRegalo_wrapper th:nth-child(6),
    table#myTableChequesRegalo td:nth-child(4),
    table#myTableChequesRegalo td:nth-child(5),
    table#myTableChequesRegalo td:nth-child(6),
    table#myTableChequesRegalo th:nth-child(4),
    table#myTableChequesRegalo th:nth-child(5),
    table#myTableChequesRegalo th:nth-child(6) {
        display: none;
    }

    div#myTableHistoricoClientes_wrapper th:nth-child(4),
    div#myTableHistoricoClientes_wrapper th:nth-child(5),
    div#myTableHistoricoClientes_wrapper th:nth-child(6),
    div#myTableHistoricoClientes_wrapper th:nth-child(7),
    table#myTableHistoricoClientes td:nth-child(4),
    table#myTableHistoricoClientes td:nth-child(5),
    table#myTableHistoricoClientes td:nth-child(6),
    table#myTableHistoricoClientes td:nth-child(7),
    table#myTableHistoricoClientes th:nth-child(4),
    table#myTableHistoricoClientes th:nth-child(5),
    table#myTableHistoricoClientes th:nth-child(6),
    table#myTableHistoricoClientes th:nth-child(7) {
        display: none;
    }

    div#myTableHistoricoUniversales_wrapper th:nth-child(3),
    div#myTableHistoricoUniversales_wrapper th:nth-child(4),
    div#myTableHistoricoUniversales_wrapper th:nth-child(5),
    div#myTableHistoricoUniversales_wrapper th:nth-child(6),
    table#myTableHistoricoUniversales td:nth-child(3),
    table#myTableHistoricoUniversales td:nth-child(4),
    table#myTableHistoricoUniversales td:nth-child(5),
    table#myTableHistoricoUniversales td:nth-child(6),
    table#myTableHistoricoUniversales th:nth-child(3),
    table#myTableHistoricoUniversales th:nth-child(4),
    table#myTableHistoricoUniversales th:nth-child(5),
    table#myTableHistoricoUniversales th:nth-child(6) {
        display: none;
    }

    div#myTableHistoricoTickets_wrapper th:nth-child(1),
    div#myTableHistoricoTickets_wrapper th:nth-child(4),
    div#myTableHistoricoTickets_wrapper th:nth-child(5),
    div#myTableHistoricoTickets_wrapper th:nth-child(7),
    div#myTableHistoricoTickets_wrapper th:nth-child(8),
    div#myTableHistoricoTickets_wrapper th:nth-child(9),
    table#myTableHistoricoTickets td:nth-child(1),
    table#myTableHistoricoTickets td:nth-child(4),
    table#myTableHistoricoTickets td:nth-child(5),
    table#myTableHistoricoTickets td:nth-child(7),
    table#myTableHistoricoTickets td:nth-child(8),
    table#myTableHistoricoTickets td:nth-child(9),
    table#myTableHistoricoTickets th:nth-child(1),
    table#myTableHistoricoTickets th:nth-child(4),
    table#myTableHistoricoTickets th:nth-child(5),
    table#myTableHistoricoTickets th:nth-child(7),
    table#myTableHistoricoTickets th:nth-child(8),
    table#myTableHistoricoTickets th:nth-child(9) {
        display: none;
    }

    div#myTableDetalleTicket_wrapper th:nth-child(4),
    div#myTableDetalleTicket_wrapper th:nth-child(5),
    table#myTableDetalleTicket td:nth-child(4),
    table#myTableDetalleTicket td:nth-child(5),
    table#myTableDetalleTicket th:nth-child(4),
    table#myTableDetalleTicket th:nth-child(5) {
        display: none;
    }

    div#myTableHistoricoCierres_wrapper th:nth-child(4),
    div#myTableHistoricoCierres_wrapper th:nth-child(5),
    div#myTableHistoricoCierres_wrapper th:nth-child(6),
    table#myTableHistoricoCierres td:nth-child(4),
    table#myTableHistoricoCierres td:nth-child(5),
    table#myTableHistoricoCierres td:nth-child(6),
    table#myTableHistoricoCierres th:nth-child(4),
    table#myTableHistoricoCierres th:nth-child(5),
    table#myTableHistoricoCierres th:nth-child(6) {
        display: none;
    }


    div#myTableNuevaCita_wrapper th:nth-child(2),
    table#myTableNuevaCita td:nth-child(2),
    table#myTableNuevaCita th:nth-child(2) {
        display: none;
    }

    .fechas .ui-select {
        display: block;
    }

    div#pie_pagina {
        display: block;

    }

    nav#main-nav,
    div#contenedorcalculadora {
        display: none;
    }

    div.titulo h1 img {
        width: 100px;
        display: block;
    }

    .ui-grid-a>.ui-block-a:not(.widthfull),
    .ui-grid-a>.ui-block-b:not(.widthfull) {

        width: 100% !important;
    }

    .ui-grid-b>.ui-block-a:not(.widthfijo),
    .ui-grid-b>.ui-block-b:not(.widthfijo),
    .ui-grid-b>.ui-block-c:not(.widthfijo) {

        width: 100% !important;
    }

    .ui-grid-c>.ui-block-a,
    .ui-grid-c>.ui-block-b,
    .ui-grid-c>.ui-block-c,
    .ui-grid-c>.ui-block-d {
        width: 100% !important;
    }

    .ui-grid-d>.ui-block-a,
    .ui-grid-d>.ui-block-b,
    .ui-grid-d>.ui-block-c,
    .ui-grid-d>.ui-block-d,
    .ui-grid-d>.ui-block-e {
        width: 100% !important;
    }

    a#verdetalleticket_editar,
    a#verdetalleticket_eliminar,
    a#verdetalleticket_rectificativa {
        width: 131px;
    }

    div#editarservicio {
        background-color: var(--main-frm-editar);
        width: 99%;
        max-width: 1000px;
        height: auto;
        display: none;
        border-radius: 15px;
        border: var(--main-color) solid 2px;
        min-height: 99% !important;
        max-height: initial !important;
    }

    div#editarservicio_wrapper {
        max-height: fit-content;

    }

    div#editarservicio_edicion_wrapper {
        max-height: fit-content;

    }

    form#form-edicion .ui-field-contain>label,
    form#form-edicion_edicion .ui-field-contain>label {
        width: 100%;
    }

    div[class*="ui-grid-"] {
        margin-left: 0 !important;
        margin-top: 0 !important;
    }

    div#botonera_edicion,
    div#botonera_edicion_edicion {
        position: absolute;
        top: 0px;
        z-index: 10;
    }

    div#foto-edicion {

        float: right;
        position: relative;
        right: initial;
        top: initial;
        width: 65px;
        height: 65px;
        margin-top: 0px !important;
        margin-right: 0px !important;
    }

    a#eliminar_foto {
        width: 65px;
        font-size: 14px !important;
    }

    .ui-navbar ul {
        display: grid;
    }

    .ui-cal-timeline2 {
        display: none;
    }

    div#div_selectorcaja {
        right: 0px !important;
        top: 60px !important;
    }

    div.titulo h1 {
        font-size: 20px;
        max-height: 3em !important;
    }

    div.titulo {
        line-height: 40px;
    }

    .extragrande {
        margin-top: 0px;
        font-size: 2em;
    }

    form#form-edicion div[class*="ui-grid-b"] div[class*="ui-block-a"] .ui-field-contain>label,
    form#form-edicion_edicion div[class*="ui-grid-b"] div[class*="ui-block-a"] .ui-field-contain>label {
        width: 100%;
    }

    form#form-edicion div[class*="ui-grid-b"] div[class*="ui-block-b"] .ui-field-contain>label,
    form#form-edicion_edicion div[class*="ui-grid-b"] div[class*="ui-block-b"] .ui-field-contain>label,
    form#form-edicion div[class*="ui-grid-b"] div[class*="ui-block-c"] .ui-field-contain>label,
    form#form-edicion_edicion div[class*="ui-grid-b"] div[class*="ui-block-c"] .ui-field-contain>label {
        width: 100%;
    }

    form#form-edicion div[class*="ui-grid-a"] .ui-field-contain>label,
    form#form-edicion_edicion div[class*="ui-grid-a"] .ui-field-contain>label {
        width: 100%;
    }

    form#form-edicion label,
    form#form-edicion_edicion label {
        width: 100% !important;
        position: relative !important;
        text-align: left !important;
    }

    .ui-grid-a>.ui-block-a.ui-block-especial {
        width: 100%;
    }

    form#form-edicion .ui-body,
    form#form-edicion_edicion .ui-body {
        margin-left: 0;
        margin-right: 0;
    }

    div#botonera_edicion button#editar_primero,
    #botonera_edicion_edicion button#editar_primero {
        display: none;
    }

    div#botonera_edicion button#editar_anterior,
    #botonera_edicion_edicion button#editar_anterior {
        display: none;
    }

    div#botonera_edicion button#editar_siguiente,
    #botonera_edicion_edicion button#editar_siguiente {
        display: none;
    }

    div#botonera_edicion button#editar_ultimo,
    #botonera_edicion_edicion button#editar_ultimo {
        display: none;
    }

    .ui-widget.ui-widget-content {
        border: 0px;
        padding: 1px;
    }

    .ui-widget.ui-widget-content>.ui-navbar {
        display: none;
    }

    div.ui-tabs .ui-widget-content.ui-tabs-panel {
        margin: 0px;
        padding-left: 3px;
        padding-right: 1px;
    }

    div#contenedor-tab-mobile {
        display: initial;
    }

    span.tab-mobile {
        font-size: 16px;
    }

    div[class*="ui-grid-"] .ui-field-contain {
        display: table;
        padding-top: 0px;
    }

    div[class*="ui-grid-"] div[class*="ui-block-"] {
        padding-top: 5px;
    }

    div.ui-field-contain textarea {
        width: 100% !important;
    }

    div.dataTables_length {
        text-align: right !important;
    }

    div.dataTables_filter {
        text-align: left !important;
    }

    a#btnetiquetas,
    a#btnetiquetasguardarimprimir {
        display: none;
    }

    div#filtrosservicios .ui-mini {
        width: 100%;
    }

    a#borrartodos {
        display: none !important;
    }

    blanco {
        display: block;
    }

    div.selectsinmargenizdo {
        display: contents;
    }

    a#btnnuevo_promesa {
        position: relative !important;
        display: block;
        margin: 0 !important;
        width: 150px;
    }

    div#opcionexterna {
        height: 95% !important;
        max-width: 90% !important;
        width: 90% !important;
        display: inline-table !important;
    }

    a#btn-print,
    a#btn-pdf,
    a#btn-excel {
        display: none;
    }

    div#botonera-historicotickets-botones {
        display: none;
    }

    div#info-historicotickets p {
        margin: 0px;
    }

    div#selector-fp-historico {
        display: none;
    }

    div#selector-fechas-historico,
    div#selector-fecha {
        display: inline-block;
    }

    div#nombre_caja p {
        margin: 0;
    }

    div#verdetalle-ticket-formasdepago,
    a#verdetalleticket_primero,
    a#verdetalleticket_ultimo,
    a#verdetalleticket_cambiarempleado,
    a#verdetalleticket_compartirempleado {
        display: none;
    }

    form#form-edicion input,
    form#form-edicion select,
    form#form-edicion option,
    form#form-edicion_edicion input,
    form#form-edicion_edicion select,
    form#form-edicion_edicion option {
        font-size: 16px !important;
    }

    form#form-edicion label,
    form#form-edicion_edicion label {
        font-size: 16px !important;
    }

    .ui-body .ui-btn {
        font-size: 16px !important;
    }

    a#ui-btn-GESTIONGRUPOPUNTOS {
        margin-top: -5px !important;
    }

    .ui-field-contain {
        border: none;
        margin: 0;
    }

    div#contenedor-cierre div[class*="ui-block-"] {
        width: 100% !important;
    }

    div#myTableCierreDetalle_wrapper,
    div#myTableCierreZonas_wrapper,
    div#myTableCierreFamilias_wrapper,
    div#myTableCierreLiquido_wrapper,
    div#myTableCierreCobros_wrapper,
    div#myTableCierrePagos_wrapper,
    div#myTableCierreAdicional_wrapper {
        line-height: 1em;
        margin-left: 0;
    }

    div#contenedor-cierre {
        overflow-y: auto !important;
    }

    div#myTableHistoricoTickets_wrapper {
        line-height: 1em;
    }

    div#myTablePedidosRecibidosDetalle_wrapper,
    div#myTablePedidosRecibidosVtos_wrapper,
    div#contenedor-historicoticketsdetalle {
        display: none;
    }

    div#botonera-historicopedidos {
        width: auto;
        position: relative;

    }

    div#botonera-agenda-btn>.ui-btn:not(.btn-salir):not(.btn-diaanterior):not(.btn-diasiguiente) {
        display: none;
    }

    div#botonera-agenda>div.ui-btn-inline {
        width: 17em !important;
    }

    div#botonera-agenda-btn>.btn-diaanterior,
    div#botonera-agenda-btn>.btn-diasiguiente,
    div#botonera-agenda-btn>.btn-bloquear {
        width: 18px;
    }

    div#contenidobusquedaclientes>.rwd-example6>.ui-block-a {
        display: none;
    }

    div#contenidobusquedaclientes>.rwd-example6>.ui-block-c>.ui-body>.ui-btn {
        width: 32%;
        display: inline;
    }

    div#busquedaclientes-tabs {
        display: none;
    }

    div#contenedor-busquedaclientes>div#myTableCajaClientes_wrapper>div.dataTables_scroll>div.dataTables_scrollBody {
        max-height: 430px !important;
        min-height: 430px !important;
    }

    div#contenidobusquedaclientes>.rwd-example6>.ui-block-c>.ui-body>button#busquedaclientes_nota {
        width: 65%;

    }

    .ui-cal-week .ui-cal-timeline {
        width: 40px !important;
    }

    .ui-cal-week .ui-cal-dateline,
    .ui-cal .ui-cal-resourceline {
        left: 40px !important;
    }

    .ui-cal-week .ui-cal-wrapper {
        left: 41px !important;
    }

    div.ui-cal-dateline-fill>span.glyphicons,
    div.ui-cal-resourceline-fill>span.glyphicons {
        margin-left: -3px !important;
    }

    div#contenidonuevacitaagenda>div.ui-grid-a>div.ui-block-a>div.ui-grid-b {
        display: none;
    }

    div#nuevacitainicial-familias {
        display: block;
        background-color: rgb(85, 84, 84);
    }

    a.ui-btn.btn_agenda_servicio {
        width: 27%;
    }

    div#contenidoopcionesagenda-contenido {
        width: auto !important;
    }

    div#contenedorbotonesopcionesagenda {
        text-align: center;
    }

    div.ui-checkbox>label {
        font-size: 16px;
    }

    p#contenidonuevacitaagenda-titulo {
        height: 1em;
        overflow: hidden;
    }

    div#nuevanotaagenda {
        width: 99% !important;
    }

    div.rwd-example4,
    div.rwd-example5 {
        width: 100% !important;
    }

    div.rwd-example4>div.ui-block-a>div.ui-body-d,
    a#inout {
        display: none;
    }

    div.rwd-example4>div.ui-block-a>div.rwd-example>div.ui-block-a {
        width: 100% !important;
    }

    a#btn_clientes {
        width: 20%;
        display: inline-block;
        height: 21px;
    }

    div#contenedorhm {
        width: auto;
        display: inline-flex;
    }

    div#barra_opciones-contenedor {
        width: 100% !important;
        margin: 0 !important;
    }

    div#cajazonasfamilias {
        display: none;
        width: 90%;
    }



    a#citas_agenda2,
    a#citas_agendaonline,
    a#opciones_veragenda,
    a#cobrorapido_ticket,
    a#cobro_ticket,
    a#opciones_cambiarcaja,
    a#abrircajon_ticket,
    a#test_busqueda,
    a#caja_resposicion,
    a#caja_resposicionultima,
    a#btn_opcionesnavpanel,
    a#busquedaclientes_veragenda,
    a#busquedaclientes_telefonos,
    a#btn_opcionesnavpanel2 {
        display: none !important;
    }

    a#anadir_ticket {
        display: initial !important;
    }

    a#btn_anadir,
    a#btn_opcionesnavpanel2 {
        display: inline-block !important;
    }

    div#nav-panel-contenedor {
        display: none;
    }

    div#nav-panel-contenedor2 {
        display: initial !important;
    }

    a#btn_bloquear {
        display: inline-block !important;
    }

    div#barra_opciones .ui-btn {
        width: 23% !important;
        padding: 5px 2px 5px 2px;
        line-height: 40px;
        vertical-align: middle;
    }

    a#ver_todos_clientes {
        left: initial !important;
        right: 0px;
    }

    a#opciones_cambiarcaja {
        height: 59px !important;
    }

    div#contenedorbtnclientes-contenedor {
        text-align: center;
        margin-top: 5px;
    }

    a#varios_hombre,
    a#varios_mujer {
        width: 60px !important;
    }

    div#contenedorvh,
    div#contenedorvm {
        width: auto !important;
    }

    div#caja_zonas a.zona {

        font-size: 11px !important;
        margin: 2px;
    }

    div#caja_familias a.familia {

        font-size: 11px !important;
        margin: 2px;
    }

    div#caja_servicios a.ui-btn {

        font-size: 12px !important;
        height: 6em;
        margin: 2px;
        white-space: normal;
    }

    div#caja_servicios a.ui-btn.btn-imagen {

        height: 12em;

    }

    div#seleccionempleado {
        width: auto !important;
    }

    div#contenidoseleccionempleado .empleado {
        width: 30% !important;
    }

    a#btn_usuario {
        width: 25%;
        font-size: 10px;
        margin: 4px;
        height: 2em;
    }

    a#btn_usuario img {
        width: 30px;
    }

    a#btn_usuario p {
        width: 49%;
        font-size: 9px;
    }

    a#btn_servicio>span,
    a#btn_pack>span {
        background-color: rgba(62, 62, 62, 1);
    }

    div#caja_grupos .btn_grupo,
    div#caja_subgrupos .btn_subgrupo {
        font-size: 13px !important;
    }

    div#nav-panel a#opciones_veragenda,
    div#nav-panel a#citas_agenda,
    div#nav-panel a#cobrorapido_ticket,
    div#nav-panel a#test_busqueda,
    div#nav-panel a#cobro_ticket {
        width: 34%;
        display: inline-block !important;
    }

    div#nav-panel a#consumo_interno,
    div#nav-panel a#cambiar_usuario {
        width: 34%;
        display: inline-block !important;
    }

    div#contenidoagendacaja .ui-cal-dateline {
        width: 100%;
    }

    div.fechahora {
        margin-top: 5px;
    }

    div#busquedaclientes-btn-contenedor .ui-btn {
        width: 32% !important;
        padding-top: 29px;
        padding-bottom: 0px;
        display: inline-block;
        font-size: 12px !important;
    }

    div#busquedaclientes-btn-contenedor button#busquedaclientes_nota {
        width: 60% !important;
    }

    div#busquedaclientes-btn-contenedor {
        text-align: center;
    }

    a.ui-btn.moneda,
    a.ui-btn.billete {
        padding: 0em 1em;
        margin-top: 2px;
        margin-bottom: 2px;
        width: 30%;
    }

    p.importe-cobro {
        border-style: solid;
        border-radius: 10px;
        margin-left: 0em;
        margin-top: 0em;
        font-size: 16px;
        margin-right: 0em;
        margin-bottom: 5px;
    }

    p.lblcobro {
        margin-top: 5px;
        margin-bottom: 5px;
        font-size: 13px;
    }

    div#contenidogestioncobro>div.ui-grid-b>div[class*="ui-block-"] {
        width: 33% !important;
    }

    div#contenedorEF,
    div#gestioncobropie {
        display: none !important;
    }

    span#spanformapago {
        font-size: 7em;
    }

    div#contenedorTA {
        position: absolute;
    }

    div#contenedorcalculadora .calculadora {
        margin: 1px;
    }

    div#contenedorFPCombinado div[class*="ui-block-"] {
        width: 33% !important;
    }

    div#contenedorFPCombinado div.ui-block-d {
        margin-top: 3em;
        width: 50% !important;
    }

    div#contenedorFPCombinado {
        position: absolute;
        z-index: 1;
    }

    div#opciones-cobro {
        position: absolute;
        bottom: 0;
    }

    div#keyboard_keyboard button.ui-keyboard-button:not(.ui-keyboard-accept):not(.ui-keyboard-cancel) {
        display: none;
    }

    div#keyboard_totallinea_keyboard button.ui-keyboard-button:not(.ui-keyboard-accept):not(.ui-keyboard-cancel) {
        display: none;
    }

    div#keyboard_cantidad_keyboard button.ui-keyboard-button:not(.ui-keyboard-accept):not(.ui-keyboard-cancel) {
        display: none;
    }

    div#keyboard_descuento_keyboard button.ui-keyboard-button:not(.ui-keyboard-accept):not(.ui-keyboard-cancel) {
        display: none;
    }

    div#calendariolaboral-cabecera>div.ui-grid-c>div.ui-block-a,
    div#calendariolaboral-cabecera>div.ui-grid-c>div.ui-block-b {
        width: 50% !important;
    }

    div#contenedor-controlproduccion2,
    div#contenedor-controlproduccion {
        height: auto !important;
    }

    div#selectores-opciones .ui-select {
        display: block;
    }

    div.multiple-collapsible>div.ui-collapsible-content {
        border: 0;
        margin-left: 2em;
    }

    div#selectores-opciones {
        float: initial !important;
    }

    div#contenedor-grafico {
        display: block !important;
        overflow-x: auto;
    }

    div#contenedor-grafico>div {
        height: auto !important;
    }

    div#contenedor-grafico-circular>div {
        width: 50% !important;
    }

    div.ui-tabs>div.ui-tabs-panel {
        height: auto !important;
        min-height: 500px;
    }

    div#keyboard_keyboard {
        left: 0px !important;
        width: 100% !important;
    }

    .ui-keyboard-button-endrow {
        display: none;
    }

    a#btn_artser {
        float: none !important;
    }

    div#nuevacitaagenda {
        width: 100% !important;
    }

    div#contenidonuevacitaagenda div.widthauto {
        display: inline-block;
    }

    div#nuevacitaagenda {
        height: 100%;
    }

    div#nuevareserva {
        width: 100% !important;
        height: 100%;
    }

    div#contenidonuevareserva {
        width: 91% !important;
        height: 95%;
    }

    div#divdatepickernuevacitainicial {
        position: initial !important;
    }

    div#contenidoopcionesagenda .ui-controlgroup,
    div#contenidoopcionesagenda .ui-block-b {
        margin: 0;
    }

    div#agendahorario {
        width: auto !important;
    }

    div#barra_opciones_cierre div[class*="ui-block-"] {
        width: 24% !important;
    }

    a#cierre_cierre {
        width: 86%;
    }

    div#barra_opciones_cierregastos div[class*="ui-block-"] {
        width: 48% !important;
    }

    div#cierre_detallegastos {
        width: 100% !important;
    }

    a.main-btn {
        width: 50px;
    }

    div#tecnicoselectorfamilia {
        position: initial !important;
    }

    a#ui-btn-imprimir-tecnico {
        display: none;
    }

    form#form-edicion div[class*="ui-block-"] .ui-field-contain>label~[class*="ui-select"],
    form#form-edicion_edicion div[class*="ui-block-"] .ui-field-contain>label~[class*="ui-select"] {
        max-width: 100%;
        margin-right: 0px;
    }

    div#nuevacita-ultimosservicios {
        display: none !important;
    }

    p#contenidonuevacitaagenda-titulo {
        position: absolute;
        top: 0px;
        right: 0px;
        width: 200px;
        height: 3em;
    }

    p#msg-tiendaonline {
        position: absolute;
        bottom: 0px;
    }

    div#cajas_empleado div.ui-body div.ui-grid-c,
    div#cajas_empleado div.ui-body div.ui-grid-b {
        overflow: auto;
    }

    div#contenido-myTableClienteBonos {
        margin-left: 0px !important;
    }

    div#divbusquedaclientes-global {
        display: none;
    }

    div#contenidoagendacaja div#div_selectorcaja .ui-select div#select-empresa-caja-button span {
        display: none;
    }

    div#contenidoagendacaja div#div_selectorcaja,
    div#comboempresaagenda {
        display: none;
    }

    div#nuevacitaagenda {
        position: fixed !important;
        top: 0px;
        left: 0px;
    }

    div#select-empleadobloqueado-button {
        width: 4em;
    }

    div#select-empleado-button {
        width: 4em;
    }

    div#contenidonuevanotaagenda .rwd-example3 .ui-grid-a .ui-block-a {
        display: inline-block;
        width: 60% !important;
    }

    div#contenidonuevanotaagenda .rwd-example3 .ui-grid-a .ui-block-b {
        display: inline;
    }

    div#nuevanotaagenda {
        height: 99.5%;
    }

    button#nuevanota-buscarcliente2 {
        display: initial !important;
    }

    button#nuevanota-buscarcliente {
        display: none !important;
    }

    div#contenedorbotonesnuevanota {
        position: absolute;
        bottom: 0px;
    }

    div#contenedor-nuevanota-buscarcliente {
        margin: 0px !important;
    }

    div#contenedor-nuevanota-buscarcliente .ui-field-contain,
    div#contenedor-nuevanota-buscarcliente .ui-field-contain>label {
        display: inline;
    }

    div#contenido-familias-notaagenda {
        margin-top: 1em;
    }

    div#busquedaclientes-btn-contenedor-ui-body {
        position: absolute;
        bottom: 0px;
    }

    div#contenido-familias-notaagenda-botones {
        height: 10em !important;
    }

    .nomargin {
        margin: 0px !important;
    }

    form.tripleselector {
        padding-top: 10px;
    }

    form.tripleselector div#select-caja-button {
        width: 100px;
        padding-left: 0.2em;
        padding-right: 1.8em;
    }

    form.tripleselector div#select-tipo-button {
        width: 100px;
        padding-left: 0.2em;
        padding-right: 1.8em;
    }

    form.tripleselector div#select-proveedor-button {
        width: 100px;
        padding-left: 0.2em;
        padding-right: 1.8em;
    }

    div#botonera-historicopedidos {
        margin: 0px;
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .ui-content {

        padding-left: 5px;
        padding-right: 5px;
    }

    div#filtrosservicios.tripleselector div.ui-select {
        width: 100px;
    }

    a#ui-btn-eliminartodosap {
        width: 100px !important;
    }

    form.fechas:not(.tripleselector) div#select-caja-button {
        width: 150px;
        padding-left: 0.2em;
        padding-right: 1.8em;
    }

    form.fechas:not(.tripleselector) div#select-choice-mini-button {
        width: 150px;
        padding-left: 0.2em;
        padding-right: 1.8em;
    }
}

@media all and (max-height: 30em) {
    div#botonera-historicotickets {
        display: none;
    }
}

a#btn_familia>div {
    display: flex;
    height: 3em;
    align-items: center;
    justify-content: center;
}

a.btn_grupo>div {
    display: flex;
    height: 2em;
    align-items: center;
    justify-content: center;
}

a.btn_subgrupo>div {
    display: flex;
    height: 2em;
    align-items: center;
    justify-content: center;
}

div.mesa-reservada td.contenido-mesa,
td.contenido-mesa.mesa-reservada {
    background-color: rgb(231, 210, 18) !important
}

div.mesa-ocupada td.contenido-mesa,
td.contenido-mesa.mesa-ocupada {
    background-color: rgb(79, 205, 74) !important;
}

div.mesa-bloqueada td.contenido-mesa,
td.contenido-mesa.mesa-bloqueada {
    background-color: rgb(200, 0, 0) !important;
}

a.btn-invitacion {
    background-color: red !important;
}

a.obs-option {
    color: white;
    font-size: 12px;
    width: 6em;
    height: 5em;
    white-space: normal;
}

a#btn-ingrediente {
    font-size: 13px;
    width: 20%;
    border: rgb(125, 85, 45) solid 5px;
    border-radius: 10px;
    line-break: anywhere;
}

a#btn-ingrediente.seleccionado {
    border-color: yellow;
}

span.comensales {
    color: rgb(43, 150, 21);
    font-size: 14px;
    display: block;
}

div.mesa-separada td.contenido-mesa {
    border-style: double;
}

div#contenidonuevareserva div.ui-input-text {
    display: inline-block;
}

a#btn_pack_opt_can {
    width: 2em;
    border: 3px solid;
}

p.obsinfo {
    margin: 0px;
}

span#importe-propina {
    position: absolute;
    bottom: 10px;
    right: 10px;
    font-size: 16px;
    color: white;
}

span#importe-propinacombi {
    position: absolute;
    bottom: 0px;
    right: 2px;
    font-size: 16px;
    color: white;
}

a.btn_empleado.online {
    border-color: yellow !important;
    color: yellow !important;
}

a.familia-foto:not(.seleccionado) div {
    background-color: rgba(204, 204, 204, 0.30);
}

a.familia-foto:not(.seleccionado) span {
    text-shadow: 1px 1px 0 rgb(224, 224, 224),
        -1px -1px 0 rgb(224, 224, 224),
        1px -1px 0 rgb(224, 224, 224),
        -1px 1px 0 rgb(224, 224, 224),
        1px 1px 0 rgb(224, 224, 224);
    color: black;
    font-size: 12px;
}

tr.inwait {
    font-weight: bold;
}

tr.inwaitdet {
    font-size: 10px;
}

div#divdatepickernuevacitainicial .ui-input-text {
    background-color: var(--main-background-color);
    color: white;
    border: none;
    box-shadow: none;
}

.ui-mobile label,
div.ui-controlgroup-label {
    font-weight: 500;
}

span.nopresentado {
    color: red !important;
    font-weight: bold;
}

span.citasonline {
    color: yellow !important;
}

a#btn_servicio:hover,
a#btn_deuda:hover {
    box-shadow: 0px 0px 5px 5px rgb(220, 214, 182);
    -webkit-box-shadow: 0px 0px 5px 5px rgb(220, 214, 182);
}

@media all and (min-width: 43em) and (max-width: 47em) {

    div#botonera-agenda-btn>.btn-agendasms,
    div#botonera-agenda-btn>.btn-agendaimpr,
    div#botonera-agenda-btn>.btn-copiar,
    div#botonera-agenda-btn>.btn-veragenda,
    div#botonera-agenda-btn>.btn-inwait,
    div#botonera-agenda-btn>.btn-incidencias {
        display: none;
    }

}

@media all and (min-width: 47em) and (max-width: 55em) {

    div#botonera-agenda-btn>.btn-agendasms,
    div#botonera-agenda-btn>.btn-agendaimpr,
    div#botonera-agenda-btn>.btn-copiar,
    div#botonera-agenda-btn>.btn-veragenda,
    div#botonera-agenda-btn>.btn-inwait,
    div#botonera-agenda-btn>.btn-incidencias {
        display: none;
    }

}

@media all and (min-width: 55em) and (max-width: 65em) {

    div#botonera-agenda-btn>.btn-agendasms,
    div#botonera-agenda-btn>.btn-agendaimpr {
        display: none;
    }

}

@media all and (max-width: 380px) {
    div#botonera-agenda-btn>.ui-btn:not(.btn-salir):not(.btn-diaanterior):not(.btn-diasiguiente) {
        display: none;
    }
}

@media all and (max-width: 320px) {
    div#botonera-agenda-btn>.ui-btn:not(.btn-salir) {
        display: none;
    }

}

@media all and (max-width: 1130px) {
    div#botonera-agenda-btn>.btn-inwait {
        display: none;
    }

    div#botonera-agenda-btn>.btn-incidencias {
        display: none;
    }

    div#contenidoagendacaja div#div_selectorcaja {
        right: 0px !important;
        top: 0px !important;
        width: 108px !important;
    }

    div#contenidoagendacaja div#div_selectorcaja .ui-select {
        max-width: 100px;
    }

    div#contenidoagendacaja div#div_selectorcaja .ui-select div#select-empresa-caja-button {
        padding-top: 4px;
        padding-bottom: 4px;
        padding-left: 4px;
    }

    div#contenidoagendacaja div#div_selectorcaja .ui-select div#select-empresa-caja-button span {
        white-space: break-spaces;
        height: 36px;
        font-size: 10px;
    }
}

div#div_whatsapp .emojionearea-editor {
    height: 268px !important;
    max-height: 268px !important;
}

div#div_whatsapp>div.emojionearea-search .ui-input-text {
    margin: 0px;
}

div.emojionearea-search .ui-input-text {
    margin: 0px;
}

a.btn-parcial {
    width: 45px;
}

table#myTableDatosTiendaOnline tbody tr.noencontrado {
    background-color: rgb(252, 160, 160) !important;
}

table#myTableDatosTiendaOnline tbody tr.stockdiferente {
    background-color: rgb(162, 168, 245) !important;
}

div#select-caja-button span {
    color: #333;
}

.ui-tabs {
    padding: 0;
}

.ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor,
.ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor,
.ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor {
    font-weight: 100;
}

.ui-tabs .ui-tabs-panel {
    padding: 0.5em 0.5em;
}

.ui-widget.ui-widget-content {
    border: 1px solid #ee9945;
}

.ui-widget-header {
    background: #ffd2b4;
}

.ui-widget-content {
    border: 1px solid #ee9945;
}

.ui-widget-content {
    background: #ffd2b4;
}

.tox-statusbar__branding {
    display: none;
}

div.tox.tox-tinymce {
    margin: .446em;
}

.alertify .ajs-footer .ajs-buttons.ajs-primary .ajs-button {
    padding: 1em;
}

p.titulopantalla {
    text-align: center;
    font-weight: 100;
    font-size: 20px;
    margin-top: -16px;
    background-color: rgba(0, 0, 0, 0.35);
    margin-left: -16px;
    margin-right: -16px;
    padding: 0.5em;
    border-radius: 10px 10px 0 0;
}

div#keyboard_descuento_keyboard .ui-keyboard-button,
div#keyboard_totallinea_keyboard .ui-keyboard-button,
div#keyboard_cantidad_keyboard .ui-keyboard-button,
div#keyboard_importegasto_keyboard .ui-keyboard-button {
    min-width: 4em;
    height: 3em;
    line-height: 3em;
}

div#keyboard_descuento_keyboard .ui-keyboard-accept,
div#keyboard_totallinea_keyboard .ui-keyboard-accept,
div#keyboard_cantidad_keyboard .ui-keyboard-accept,
div#keyboard_importegasto_keyboard .ui-keyboard-accept {
    margin-top: 1em;
}

div#keyboard_descuento_keyboard .ui-keyboard-preview,
div#keyboard_totallinea_keyboard .ui-keyboard-preview,
div#keyboard_cantidad_keyboard .ui-keyboard-preview,
div#keyboard_importegasto_keyboard .ui-keyboard-preview {
    text-align: right;
    background-color: rgb(68, 68, 68);
    color: white;
    font-size: 2em;
}

div#keyboard_descuento_keyboard,
div#keyboard_totallinea_keyboard,
div#keyboard_cantidad_keyboard,
div#keyboard_importegasto_keyboard {
    width: 260px;
}

div#contenido-iconos-nfo {
    border: 1px solid var(--main-color);
    border-radius: 10px;
}

.clienteintracomunitario {
    color: rgb(255, 0, 174);
}

.ui-page-theme-a a.boton-externo2.ui-btn,
.ui-group-theme-a a.boton-externo2.ui-btn:visited {
    background-color: rgb(231, 225, 218);
}

.subtabs,
.subtabs>.ui-navbar>.ui-widget-header {
    background: #b3a59b;
}

.subtabs {
    border-color: #b3a59b;
}

div#TABhistoricovisitas,
div#TABtecnicos {
    padding: 0px;
}

.recomendacion-linea {
    background-color: rgb(94, 92, 92);
    color: yellow;
    text-align: center;
}

.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
    padding: .5em 1em;
    font-size: 12px;
}

span#contenidonuevacitaagenda-obs {
    position: absolute;
    top: 3em;
    font-size: 13px;
    color: cadetblue;
    width: 47%;
    max-height: 1em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

form#form-edicion>.ui-body>.ui-tabs:not(.altonormal)>.ui-tabs-panel,
form#form-edicion_edicion>.ui-body>.ui-tabs:not(.altonormal)>.ui-tabs-panel {
    min-height: 540px;
}

p#titulo_edicion>span,
p#titulo_edicion_edicion>span {
    position: absolute;
    right: 18px;
    font-size: 12px;
    top: 36px;
    color: rgb(187, 117, 38);
}

a#btn_pack {
    background-color: #ffffff;
    border-color: #ffffff;
    color: #000000;
    border: 1px solid var(--main-section-color);
    font-size: revert;
    height: auto;
    padding-bottom: 13px;
    min-height: 50px;
    line-height: 14px;
}

.ticketSeleccionado {
    background-color: #e187b8 !important;
    font-size: initial;
}

@media (max-width: 1024px) {

    .ticketSeleccionado,
    .lineaTicketSeleccionado {
        font-size: 1.2em;
    }
}

.kt-header .kt-header__topbar .kt-header__topbar-item .kt-header__topbar-icon i,
.kt-header .kt-header__topbar .kt-header__topbar-item.kt-header__topbar-item--user .kt-header__topbar-user .kt-header__topbar-welcome {
    color: #111110;
}

.nav-pills .nav-item .nav-link:active,
.nav-pills .nav-item .nav-link.active,
.nav-pills .nav-item .nav-link.active:hover {
    background-color: var(--main-section-color);
}

.kt-aside-close>i {
    color: var(--main-section-color);
}

#tablaServicios_wrapper,
#tablaProductos_wrapper,
#tablaClientes_wrapper,
#tablaEmpleados_wrapper,
#tablaZonas_wrapper,
#tablaFamilias_wrapper,
#tablaGrupos_wrapper,
#tablaSubGrupos_wrapper,
#tablaTickets_wrapper,
#tablaMarcas_wrapper {
    background-color: var(--main-section-color);
}

.fc .fc-timegrid-slot-label {
    color: white !important;
}

.fc .fc-non-business {
    background: rgba(68, 68, 68, 0.3) !important;
}

.fc-event {
    overflow: hidden;
    border: 2px solid white !important;
    border-radius: 6px !important;
    box-shadow: 0px 5px 5px #888 !important;
    padding: 5px;
}

.fc-event-main {
    width: 99%;
    /* border: 1px solid white;
    margin: auto auto;
    height: 99%;
    border-radius: 6px; */
}

.agenda input,
.agenda select {
    cursor: pointer;
}

.fechaAgenda {
    display: inline-block;
    width: fit-content !important;
    font-weight: bold;
}

.fechaAgenda::first-letter {
    text-transform: uppercase;
}

.fechaAgenda::-webkit-first-letter {
    text-transform: uppercase;
}

img {
    height: auto;
    width: 20%;
}

.underbtn {
    display: inline-block;
    width: 20%;
    color: var(--main-section-color);
    font-size: 2vw;
}

.mainunderbtn {
    display: inline-block;
    width: 15%;
    color: var(--main-section-color);
    font-size: 2vw;
}

button {
    background-color: #47a386;
    border: 0;
    border-radius: 5px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    color: #fff;
    font-size: 14px;
    padding: 10px 25px;
    /*z-index: 10;*/
}

.modal-container {
    display: flex;
    background-color: rgba(0, 0, 0, 0.3);
    align-items: center;
    justify-content: center;
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    width: 100vw;
    transition: opacity 0.3s ease;
    z-index: 9;
}

#modal_container {
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: fixed;
}

.modal {
    background-color: rgba(0, 0, 0, 0.3);
    width: 100%;
    max-width: 100%;
    border-radius: 5px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    text-align: center;
    z-index: 9;
}

.modal h1 {
    margin: 0;
    z-index: 9;
}

.modal p {
    opacity: 0.7;
    font-size: 14px;
    z-index: 9;
}

.modal-white-block {
    background-color: white;
    height: 70%;
    width: 80%;
    margin: 0.5em auto;
    min-height: 90% !important;
    max-width: 100% !important;
}

.width5 {
    width: 5%;
    padding: 4px;
}

.fc-volverbtn-button {
    background-color: #e9435e !important;
}

.fc-cajabtn-button {
    background-color: #47996b !important;
}

.fc-cajabtn-button img {
    height: 1.25em;
    width: 1.25em;
    margin-right: 0.25em;
}

.fc-volverbtn-button img {
    height: 1.25em;
    width: 1.25em;
    margin-right: 0.25em;
}

td.numder {
    text-align: end;
}

.fc-toolbar-chunk {
    margin-top: 1%;
}

.btnsCaja {
    background-color: #ffffff;
    border-color: #ffffff;
    color: #000000;
    border: 1px solid var(--main-section-color);
    font-size: revert;
    height: auto;
    padding-bottom: 13px;
    min-height: 50px;
    line-height: 14px;
}

img.main-nav {
    width: 15% !important;
    height: auto !important;
}

th.sorting {
    font-size: 0.8vw;
}

@media (max-width: 1024px) {
    th.sorting {
        font-size: 1vw;
    }
}

@media (max-width: 768px) {
    th.sorting {
        font-size: 1.9vw;
    }
}

td.width5 {
    padding: 6px !important;
    width: 5%;
}

.divseleccionar {
    width: 15%;
    margin: auto;
}

.fc .fc-toolbar-title {
    text-transform: capitalize;
}

.fc-header-toolbar.fc-toolbar {
    padding: 0 10px;
}

.fc .fc-button:not(:disabled) {
    padding: 10px;
}

.fc .moving {
    --s: 20px;
    --t: 3px;
    --g: 5px;
    padding: calc(var(--g) + var(--t));
    outline: var(--t) solid #FFF;
    outline-offset: calc(-1*var(--t));
    -webkit-mask: conic-gradient(at var(--s) var(--s), #0000 75%, #000 0) 0 0/calc(100% - var(--s)) calc(100% - var(--s)), linear-gradient(#000 0 0) content-box;
    transition: .4s;
    cursor: pointer;
}

#barra_opciones a {
    width: 100px !important;
}

body::-webkit-scrollbar {
    width: 12px;
}

body::-webkit-scrollbar-track {
    background: rgba(133, 161, 172, 0.2);
}

.tituloEstadisticas {
    font-size: xx-large;
}

.parrafoEstadisticas {
    font-size: initial;
    text-shadow: 0px 0px 10px white;
}

.subTituloEstadisticas {
    font-weight: 400;
    font-size: large;
}

@media (max-width: 1165px) {
    .vanish {
        display: none;
    }
}



.saldos {
    display: flex;
    justify-content: space-between;
}

.saldos .form-group {
    text-align: left;
}

.dinero {
    display: flex;
    justify-content: space-between;
}

.dinero .form-group {
    text-align: left;
}

.ui-block-a td {
    cursor: pointer;
}

.form-group {
    margin-bottom: 0px !important;
}

form#kt_formLogin .form-group {
    margin-bottom: 2rem !important;
}

h3.tituloEstadisticas {
    font-weight: 300;
}

/* Empleados.php */

.schedule-container {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    padding: 15px;
}

.day-column {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.day-column h4 {
    text-align: center;
    margin-bottom: 15px;
    color: #464E5F;
}

.schedule-input {
    width: 100%;
    padding: 8px;
    margin-bottom: 10px;
}

/* Tienda.php */

.container-year {
    padding: 20px 20px 20px 0px;
    border-radius: 8px;
    margin: 20px 0;
}

.year-selector {
    margin-bottom: 20px;
}

.months-container {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.month {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 10px;
}

.month-header {
    text-align: center;
    font-weight: bold;
    padding: 5px;
    background: #f8f9fa;
    margin-bottom: 10px;
    background-color: #717171;
    color: white;
}

.week-header {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    text-align: center;
    font-weight: bold;
    background: #f1f1f1;
    padding: 5px 0;
}

.days-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
}

.day-cell {
    padding: 5px;
    text-align: center;
    border: 1px solid #eee;
    min-height: 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    /* Add cursor pointer */
    transition: all 0.1s ease;
    /* Smooth transition */
    justify-content: center;
}

.days-grid .selected {
    border: 2px solid #47a386;
    /* Use the same blue as your save button */
    background-color: #47a386;
    /* Light blue background */
    color: white;
}

.empty-cell {
    background-color: #f5f5f5;
}

.day-number {
    font-size: 0.9em;
    margin-bottom: 5px;
}

.day-checkbox {
    display: none;
}

.day-cell.festivo {
    background-color: #47a386;
    color: white;

}

.day-cell.vacacion {
    background-color: #f21414;
    color: white;
}

/* .day-cell:not(.festivo):hover {
    background-color: #f0f0f0;
} */

.save-button {
    margin-left: 10px;
    padding: 5px 15px;
    background-color: #007bff;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.save-button:hover {
    background-color: #0056b3;
}

td[role="gridcell"] {
    position: relative;
}

/* Estilos para la tabla de líneas de ticket */
#tablaHistorialTicketsLineas {
    width: 100% !important;
}

#tablaHistorialTicketsLineas th,
#tablaHistorialTicketsLineas td {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Estilos específicos para cada columna */
#tablaHistorialTicketsLineas th:nth-child(1),
#tablaHistorialTicketsLineas td:nth-child(1) {
    width: 5% !important;
    /* Unidades */
}

#tablaHistorialTicketsLineas th:nth-child(2),
#tablaHistorialTicketsLineas td:nth-child(2) {
    width: 50% !important;
    /* Descripción */
}

#tablaHistorialTicketsLineas th:nth-child(3),
#tablaHistorialTicketsLineas td:nth-child(3) {
    width: 20% !important;
    /* PVP */
}

#tablaHistorialTicketsLineas th:nth-child(4),
#tablaHistorialTicketsLineas td:nth-child(4) {
    width: 5% !important;
    /* Descuento */
}

#tablaHistorialTicketsLineas th:nth-child(5),
#tablaHistorialTicketsLineas td:nth-child(5) {
    width: 20% !important;
    /* Total */
}

#tablaHistorialTicketsLineas td:nth-child(2) {
    max-width: 0;
    text-overflow: ellipsis;
    overflow: hidden;
}

#kt_formLogin .form-group:nth-child(4) {
    margin-bottom: 0 !important;
}


#kt_formLogin .kt-login-v1__actions {
    margin-top: 0 !important;
}


#kt_formLogin .form-group:nth-child(4) {
    margin-bottom: -0.5em !important;
}


#kt_formLogin .kt-login-v1__actions {
    margin-top: 0 !important;
    position: relative;
    top: -0.5em;
}

#kt_formLogin .kt-login-v1__actions .kt-login-v1__forgot {
    display: block;
    margin-left: 0;
    margin-top: 1.5em;
}

.btn-empleado {
    color: #FFF !important;
    background-color: #6C27BD !important;
}

.btn-cliente {
    color: #FFF !important;
    background-color: #57C8D9 !important;
}

.btn-empleado:hover {
    background-color: #5C22A0 !important;
}

.btn-cliente:hover {
    border-color: #4BADBC !important;
    background-color: #4BADBC !important;
}

.dataTables_filter {
    float: left !important;
    margin: .3em 0 -.3em 1em !important;

    & input {
        background-color: white !important;
        color: black !important;
    }
}

#resumenEmpleado strong {
    margin-left: .75em
}

/* agenda */
/* Event Modal Styling */
.titulo-calendario {
    font-size: 14px;
    margin-top: 10px;
    margin-bottom: 0px;
    color: black;
}
#EventoModal {
  background-color: rgba(0, 0, 0, 0.7);
}

#EventoModal .modal-content {
  border-radius: 12px;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  border: none;
  overflow: hidden;
}

#EventoModal .kt-head {
  background: var(--main-section-color);
  padding: 15px 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

#EventoModal .kt-head__title {
  font-size: 1.25rem;
  font-weight: 600;
  margin: 0;
}

#EventoModal .modal-body {
  padding: 20px;
  background-color: #f8f9fa;
}

#EventoModal .form-group {
  margin-bottom: 1.2rem;
}

#EventoModal label {
  font-weight: 500;
  color: #495057;
  margin-bottom: 0.5rem;
  display: block;
}

#EventoModal .form-control {
  border-radius: 6px;
  border: 1px solid #ced4da;
  padding: 10px 12px;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  text-align: center;
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px !important;
}

#EventoModal .form-control:focus {
  border-color: var(--main-section-color);
  box-shadow: 0 0 0 0.2rem rgba(133, 161, 172, 0.25);
}

#EventoModal .row {
  margin-bottom: 1rem;
}

#EventoModal .colorisContainer {
  position: relative;
}

#EventoModal .clr-field {
  width: 50%;
}

#EventoModal .modal-footer {
  background-color: #f8f9fa;
  border-top: 1px solid #dee2e6;
  padding: 15px 20px;
}

#EventoModal .btn {
  padding: 8px 16px;
  border-radius: 6px;
  font-weight: 500;
  transition: all 0.2s ease;
}

#EventoModal .btn-eprox-success {
  background-color: #47996b !important;
  color: white;
}

#EventoModal .btn-eprox-success:hover {
  /* background-color: #6d8690 !important; */
  color: black;
}

#EventoModal .btn-danger {
  background-color: #dc3545;
}

#EventoModal .btn-danger:hover {
  background-color: #c82333;
}

#EventoModal .btn-secondary {
  background-color: #e9435e !important;
  color: white;
}

.btn-secondary:hover {
  color: black;
}
#EventoModal  #rowFecha input{
    margin: 0px;
    padding: 0px;
}
#EventoModal  #rowFecha select{
    padding: 4px;
}
/* Color picker improvements */
.coloris-wrapper {
  position: relative;
  width: 100%;
}

.coloris {
  width: 100% !important;
  padding-left: 40px !important;
}

.clr-field button {
  /* width: 30px !important;
  height: 30px !important;
  left: 5px !important;
  top: 50% !important; */
  transform: translateY(-50%) !important;
  border-radius: 4px !important;
}
/* Search Results Modal Styles */
#eventsModal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 9999;
    justify-content: center;
    align-items: center;
}

#eventsModal .modal-body {
    all: inherit;
    margin: 0px;
    padding: 0px;
}

p#eventsList {
    margin: 0px;
}

.search-results-container {
    width: 100%;
    background-color: white;
    max-width: 600px;
    max-height: 80vh;
    padding: 1.5rem;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
    animation: fadeIn 0.3s ease;
    overflow: hidden;
}

.search-results-container h4 {
    color: var(--main-section-color);
    border-bottom: 2px solid var(--main-section-color);
    padding-bottom: 0.75rem;
    margin-top: 0;
    margin-bottom: 1rem;
    font-size: 1.2rem;
}

.search-results-list {
    max-height: 60vh;
    overflow-y: auto;
}

.search-result-item {
    padding: 0.75rem;
    border-bottom: 1px solid #eee;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.search-result-item:hover {
    background-color: rgba(133, 161, 172, 0.1);
}

.search-result-item:last-child {
    border-bottom: none;
}

.result-date {
    margin-bottom: 0.5rem;
    color: #333;
}

.result-client,
.result-service,
.result-user,
.result-observations {
    margin-bottom: 0.25rem;
    font-size: 0.9rem;
    color: #555;
}

/* Animation for modal appearance */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: scale(0.9);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

/* Close button for the modal */
.close-modal {
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 1.5rem;
    color: var(--main-section-color);
    cursor: pointer;
    background: none;
    border: none;
}

.close-modal:hover {
    color: #333;
}

/* Highlight for selected event */
.highlighted-event {
    background-color: rgba(133, 161, 172, 0.3);
    border: 2px solid var(--main-section-color);
    animation: pulse 1.5s infinite;
}

@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(133, 161, 172, 0.7);
    }

    70% {
        box-shadow: 0 0 0 10px rgba(133, 161, 172, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(133, 161, 172, 0);
    }
}

/* Fin agenda */

/* Clases botones */

.abrir-caja { background-color: #5f7d89 !important; color: white !important; }
.cerrar-caja { background-color: #2a3941 !important; color: white !important; }
.salir { background-color: #333333 !important; color: white !important; }
.cobrar { background-color: #0d6efd !important; color: white !important; }
.cerrar { background-color: #999999 !important; color: white !important; }
.btn-agenda { background-color: #e65397 !important; color: white !important; }
.buscar, .fc-buscarbtn-button { background-color: #79a5b5 !important; color: white !important; }
.fc-moverbtn-button, .mover { background-color: #e6aa3b !important; color: white !important; }
.fc-copiarbtn-button { background-color: #f7c873 !important; color: white !important;}
.fc-cajabtn-button { background-color: #4b6470 !important; color: white !important; }
.btn-menu { background-color: #777777 !important; color: white !important; }
.crear { background-color: #53c68c !important; color: white !important; }
.volver, .fc-volverbtn-button { background-color: #7b9ba7 !important; color: white !important; }
.mov-caja { background-color: #aecbd7 !important; color: black !important; }
.borrar { background-color: #c0395b !important; color: white !important; }

.abrir-caja:hover {background-color: #4B636D !important;}
.cerrar-caja:hover {background-color: #3C525D !important;}
.salir:hover {background-color: #505050 !important;}
.cobrar:hover {background-color: #0B60DF !important;}
.cerrar:hover {background-color: #7C7C7C !important;}
.btn-agenda:hover {background-color: #C84884 !important;}
.buscar:hover, .fc-buscarbtn-button:hover  {background-color: #668B98 !important;}
.fc-moverbtn-button:hover, .mover:hover  {background-color: #C89434 !important;}
.fc-copiarbtn-button:hover  {background-color: #DAB267 !important;}
.fc-cajabtn-button:hover  {background-color: #384A53 !important;}
.btn-menu:hover {background-color: #5B5B5B !important;}
.crear:hover { background-color: #47AA79 !important; }
.volver:hover, .fc-volverbtn-button:hover {background-color: #718E99 !important;}
.mov-caja:hover {background-color: #96AFB9 !important;}
.borrar:hover {background-color: #A2314D !important;}

/*  estadisticas */
.economico table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 15px;
    min-width: 500px;
}

.economico table th, .economico table td {
    border: 1px solid var(--main-section-color);
    padding: 8px;
    text-align: right;
}

.economico table th:first-child, .economico table td:first-child {
    text-align: right;
}

.economico table th {
    background-color: var(--main-section-color);
    font-weight: bold;
}

.economico table tr:last-child {
    font-weight: bold;
}

.economico td {
    height: 20px;
    padding: 2px !important;
    width: calc(45%/3);
}

.economico .display td:first-child {
    width: calc(40% + 15%); /* Adjust percentages as needed */
}

#tablaMovimientosCaja > tbody > tr > td:first-child {
    width: 17.5% !important;
}


/*Estilos modal de busqueda agenda*/
/* Modal de búsqueda */
.search-modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    justify-content: center;
    align-items: center;
}

.search-modal-content {
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    width: 90%;
    max-width: 500px;
    max-height: 90vh;
    overflow: hidden;
    animation: modalFadeIn 0.3s ease-out;
}

@keyframes modalFadeIn {
    from {
        opacity: 0;
        transform: scale(0.9);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.search-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    background-color: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
}

.search-modal-header h3 {
    margin: 0;
    color: #333;
    font-size: 1.25rem;
    font-weight: 600;
}

.search-modal-close {
    cursor: pointer;
    font-size: 24px;
    font-weight: bold;
    color: #aaa;
    line-height: 1;
    transition: color 0.2s ease;
}

.search-modal-close:hover {
    color: #333;
}

.search-modal-body {
    padding: 20px;
}

.search-modal-body label {
    display: block;
    margin-bottom: 8px;
    color: #555;
    font-weight: 500;
}

.search-input {
    width: 100%;
    padding: 12px;
    border: 2px solid #dee2e6;
    border-radius: 6px;
    font-size: 16px;
    transition: border-color 0.2s ease;
    box-sizing: border-box;
}

.search-input:focus {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

.search-modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 20px;
    background-color: #f8f9fa;
    border-top: 1px solid #dee2e6;
}

.search-btn {
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    min-width: 80px;
}

.search-btn-primary {
    background-color: #007bff;
    color: white;
}

.search-btn-primary:hover {
    background-color: #0056b3;
    transform: translateY(-1px);
}

.search-btn-secondary {
    background-color: #6c757d;
    color: white;
}

.search-btn-secondary:hover {
    background-color: #545b62;
    transform: translateY(-1px);
}

.search-btn:active {
    transform: translateY(0);
}

/* Responsive */
@media (max-width: 768px) {
    .search-modal-content {
        width: 95%;
        margin: 20px;
    }

    .search-modal-header,
    .search-modal-body,
    .search-modal-footer {
        padding: 15px;
    }

    .search-modal-footer {
        flex-direction: column;
    }

    .search-btn {
        width: 100%;
    }
}

/* ==========================
   Panel de Fichajes (Admin)
   ========================== */

#panel-fichajes-admin {
    max-width: 1400px;
    margin: 0 auto;
}

#panel-fichajes-admin #contenedorTituloPrincipal{
    background-color: var(--main-section-color);
    box-shadow: 0 2px 4px rgb(0 0 0 / 38%);
    justify-content: space-between;
}

#panel-fichajes-admin #contenedorTituloPrincipal h1{
    color: white;
}

#panel-fichajes-admin #contenedorTituloPrincipal a {
    padding: 5px;
    border-radius: 5px;
    background-color: #7b9ba7;
    text-decoration: none;
}
/* Bloque de filtros */
#panel-fichajes-admin .controls {
    padding: 1.25em 1.5em;
    border-radius: 10px;
    box-shadow: 0 2px 4px rgb(0 0 0 / 38%);
    margin-bottom: 1.5em;
    background-color: var(--main-section-color);
}

#panel-fichajes-admin .form-group {
    display: flex;
    gap: 1.25em;
    align-items: flex-end;
    flex-wrap: wrap;
}

#panel-fichajes-admin .form-field {
    display: flex;
    flex-direction: column;
    min-width: 200px;
}

#panel-fichajes-admin .form-field label {
    margin-bottom: 4px;
    font-weight: 600;
    color: #555;
    font-size: 0.9rem;
    cursor: pointer;
}

#panel-fichajes-admin .form-field input,
#panel-fichajes-admin .form-field select {
    padding: 0.45em 0.7em;
    border-radius: 5px;
    border: 1px solid #ddd;
    font-size: 0.9rem;
    box-sizing: border-box;
    cursor: pointer;
}

#panel-fichajes-admin .form-field input:focus,
#panel-fichajes-admin .form-field select:focus {
    outline: none;
    border-color: var(--main-section-color);
    box-shadow: 0 0 0 2px rgba(133,161,172,0.25);
}

/* Botones de filtro */
#panel-fichajes-admin .form-group .ui-btn {
    margin-top: 1.35em;
    padding: 0.6em 1.4em;
    font-size: 0.9rem;
    cursor: pointer;
}

#panel-fichajes-admin .form-group .ui-btn:hover {
    filter: brightness(0.85);
}


/* Tarjetas de resumen */
#panel-fichajes-admin .summary-stats {
    display: flex;
    gap: 1em;
    margin-bottom: 1.5em;
    flex-wrap: wrap;
}

#panel-fichajes-admin .stat-card {
    background-color: #ffffff;
    padding: 0.9em 1.1em;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgb(0 0 0 / 38%);
    min-width: 160px;
    text-align: center;
    border: 1px solid rgba(0,0,0,0.04);
}

#panel-fichajes-admin .stat-value {
    font-size: 1.4em;
    font-weight: 700;
    color: var(--main-color);
}

#panel-fichajes-admin .stat-label {
    font-size: 0.8rem;
    color: #666;
    margin-top: 4px;
}

/* Tabla de fichajes */
#panel-fichajes-admin .table-container {
    border-radius: 10px;
    box-shadow: 0 2px 4px rgb(0 0 0 / 38%);
    overflow: hidden;
    margin-bottom: 1.5em;
}

#panel-fichajes-admin .table-header {
    background: var(--main-section-color);
    color: white;
    padding: 0.75em 1em;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    padding: 5px;
}

#panel-fichajes-admin .table-header h3 {
    margin: 0;
    font-size: 1rem;
}

#panel-fichajes-admin .table-wrapper {
    overflow-x: auto;
}

#panel-fichajes-admin table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.78rem;
}

#panel-fichajes-admin th,
#panel-fichajes-admin td {
    padding: 0.4em 0.35em;
    text-align: center;
    border-bottom: 1px solid #e0e0e0;
    vertical-align: middle;
}

#panel-fichajes-admin th {
    background-color: var(--main-section-color);
    color: #fff;
    font-weight: 600;
    font-size: 0.75rem;
    position: sticky;
    top: 0;
    z-index: 1;
}

#panel-fichajes-admin tr:nth-child(even) {
    background-color: rgba(133,161,172,0.05);
}

#panel-fichajes-admin tr:hover {
    background-color: rgba(133,161,172,0.12);
}

/* Columnas especiales */
#panel-fichajes-admin .checkbox-cell {
    width: 36px;
}

#panel-fichajes-admin .actions-cell {
    width: 90px;
}

/* Info empleado en la tabla */
#panel-fichajes-admin .employee-info {
    display: flex;
    align-items: center;
    gap: 0.5em;
    text-align: left;
}

#panel-fichajes-admin .employee-avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--main-section-color);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.8rem;
}

#panel-fichajes-admin .employee-name {
    font-weight: 600;
    color: #333;
}

/* Badges horarios */
#panel-fichajes-admin .time-badge {
    display: inline-block;
    padding: 0.2em 0.55em;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 600;
    margin: 1px;
}

#panel-fichajes-admin .time-programmed {
    background-color: #e3f2fd;
    color: #1976d2;
    border: 1px solid #bbdefb;
}

#panel-fichajes-admin .time-worked {
    background-color: #e8f5e8;
    color: #2e7d32;
    border: 1px solid #c8e6c9;
}

#panel-fichajes-admin .time-break {
    background-color: #fff3e0;
    color: #f57c00;
    border: 1px solid #ffcc02;
}

/* Estados */
#panel-fichajes-admin .status-confirmed {
    color: #4caf50;
    font-weight: 700;
}

#panel-fichajes-admin .status-pending {
    color: #ff9800;
    font-weight: 700;
}

#panel-fichajes-admin .duration-badge {
    background-color: #f5f5f5;
    padding: 0.25em 0.6em;
    border-radius: 8px;
    font-weight: 600;
}

/* Botones de acciones en la tabla */
#panel-fichajes-admin .btn-small {
    padding: 0.15em 0.4em;
    font-size: 0.68rem;
    margin: 1px;
}

#panel-fichajes-admin .btn-edit {
    background-color: #ffc107 !important;
    color: #000 !important;
}

#panel-fichajes-admin .btn-delete {
    background-color: #dc3545 !important;
    color: #fff !important;
}

/* Estados "sin datos" / "cargando" */
#panel-fichajes-admin .no-data,
#panel-fichajes-admin .loading {
    text-align: center;
    padding: 2.5em 1em;
    color: #555;
    font-style: italic;
}

#panel-fichajes-admin .loading {
    color: var(--main-section-color);
}

/* Responsive específico del panel */
@media (max-width: 1024px) {
    #panel-fichajes-admin table {
        font-size: 0.68rem;
    }

    #panel-fichajes-admin th,
    #panel-fichajes-admin td {
        padding: 0.3em 0.2em;
    }
}

.modal .dataTables_scrollHeadInner,
.modal .dataTables_scrollHeadInner table {
    width: 100% !important;
}

.modal .dataTables_scrollBody table {
    width: 100% !important;
}

.modal .dataTables_scrollHeadInner {
    width: 100% !important;
}

.modal .dataTables_scrollHeadInner table {
    width: 100% !important;
    margin: 0 !important;
}

.modal .dataTables_scrollBody table {
    width: 100% !important;
    margin: 0 !important;
}



}