/*****
CSS Universal 
*****/

/* @font-face {
    font-family: 'Helvetica Neue, Medium';
    src: url('../font/HelveticaNeue\ Medium.ttf');
} */

/* * {
    font-family: 'Helvetica Neue, Medium';
} */

* {
     font-family: -apple-system, BlinkMacSystemFont, 
            "SF Pro Display", 
            "Helvetica Neue", 
            Arial, sans-serif;
}

* hr {
    color: #F0F0F0;
    margin: 0.75rem 0 1.5rem 0;
}

* a {
    text-decoration: none !important;
}

table a {
    text-decoration: underline;
    color:#4b4949;
}

* li, * ul {
    list-style: none;
}

th:first-child,
td:first-child {
    text-align: center;
    padding: 0 0.75rem 0 1.2rem !important;
}

tr:nth-child(2) th:first-child {
    padding: 0 0.75rem 2rem 1.2rem !important;
}

tr:nth-child(2) th:last-child {
    padding: 0 1.2rem 2rem 0rem !important;
}

* tbody tr:nth-child(odd) {
    background-color: #F4F4F4;
}

* tbody tr:nth-child(even) {
    background-color: #ffffff;
}

tbody tr:last-child td:first-child{
    border-bottom-left-radius: 1rem;
}

tbody tr:last-child td:last-child {
    border-bottom-right-radius: 1rem;
}

* td {
    color: #4b4949;
    font-size: 0.90rem !important;
    padding: 2rem 0.75rem;
    word-break: break-all;
    white-space: pre-line;
}

* th {
    font-size: 1rem;
    color: #000;
    padding: 0 0.75rem 0.1rem;
    text-align: start;
}

tr:nth-child(1) th {
    cursor: pointer;
}

tr:nth-child(2) th{
    padding: 0 1.25rem 2rem 0.3rem !important;
}

table p {
    margin: 0 !important;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0;
}
/*****
placeholder
*****/
::placeholder {
    font-size: 0.85rem;
    font-style: italic;
}

/*****
index.php
*****/
.body-index {
    overflow: hidden;
    margin: 0;
    padding: 0;
}

.login {
    height: 100vh;
    background: url(../img/background.jpg) no-repeat;
    background-size: cover;
    
    justify-content: center;
    align-items: center;
    display: flex;
    flex-direction: column;
    
}

.login h1,
.login p {
    margin: 0.75rem;
    color: #ffffff;
    text-align: center;
}

.mantenimiento {
    filter: grayscale(0.65);
    height: 100vh;
    background: url(../img/background.jpg) no-repeat;
    background-size: cover;
    justify-content: center;
    align-items: center;
    display: flex;
    flex-direction: column;
}


.body-index header,
.body-index footer{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.body-index header {
    padding: 0;
}

.logo1{
    width: 5rem;
    margin: 0 0 4rem;
    position: absolute;
    top: 4rem;
}

.mantenimiento .logo1 {
    opacity: 0.5;
}

.mantenimiento .footer-index {
    opacity: 0.5;
}

.formulario-index {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0;
    gap: 1.25rem;
}

.formulario-index h1 {
    font-size: 2.3rem;
}

.formulario-index input,
.formulario-index button{
    background-color: #fff;
    border: none;
    border-radius: 3.125rem;
    height: 2.60rem;
    line-height: 1.875rem;
    width: 18rem;
    margin: 0;
    padding: 0rem 0.75rem;
    font-size: 1rem;
    text-align: center;
    box-shadow: 0 0 0.313rem rgba(0,0,0,0.2);
    transition: all .17s ease;
}

.formulario-index button[type="submit"] {
    background: #C40000 !important;
    color: white;
    width: 19.75rem;
    cursor: pointer;
}

a.passForgot {
    display: flex;
    flex-direction: row;
    color: white;
    font-size: 0.95rem;
    transition: all .17s ease;
    margin: 0;
    gap: 0.35rem;
    align-items: center;
}

.login a img {
    rotate: 45deg;
    margin: 0.15rem 0 0;
    height: 0.75rem;
    filter: invert(41%) sepia(1%) saturate(4940%) hue-rotate(28deg) brightness(1000%) contrast(100%);
}

.footer-index{
    margin: 0rem auto;
    position: absolute;
    bottom: 2rem;
}

.footer-index .logo2 {
    width: 12rem;
    
}

/* Animacion botones y link (index)*/
/* .formulario-index input:hover {
    background-color: #ffffff;    
    font-weight: 600;
    box-shadow: 0 0 0.313rem rgba(0,0,0,0.8);
}*/

.formulario-index button:hover[type="submit"] {
    background-color: #fa1e1e;    
    text-decoration: underline;
    /* box-shadow: 0 0 0.313rem rgba(0,0,0,0.8); */
}

.formulario-index a.passForgot:hover {
    text-decoration: underline !important;
} 

/* Mantenimiento */

.contenedor-mantenimiento {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1.5rem;
    align-items: center;
    width: 44rem;
    height: 24rem;
    border-radius: 1.5rem;
    background: #ffffff;
    color: #6E6E6E;
    margin: 7rem 0 7rem;
}

.contenedor-mantenimiento h2 {
    color: #000 !important;
    width: 21rem;
    text-align: center;
    margin: 0;
}

.contenedor-mantenimiento p {
    width: 35rem;
    margin: 0;
    text-align: center;

}

.contenedor-mantenimiento img {
    width: 3rem;
    height: 3rem;
}

.mant-img {
    width: 5.75rem;
    height: 5.75rem;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background: #EAEAEA;
}

/*****
.body-panel
*****/
.body-panel {
    /*border: 1px solid red; */   
    background: #E5E5E5;
    /*Flexbox*/
    margin: 0;
    display: flex;
    gap: 2rem;
}


/*****
sidebar.php
*****/
.simple {
    font-size: 0.7rem;
    font-weight: 600;
    color: #37568A ;
}

.sidebar {
    /*border: 1px solid red;*/
    display: flex;
    flex-direction: column;
    position: fixed;
    height: 100%;
    top: 0;
    left: 0;
    overflow-y: auto;
    background-color: #ffffff;
    width: 17rem;
    z-index: 1008;
    transition: all 0.35s ease;
}

.contenedor-logo { 
    padding: 3.5rem 0 3rem; 
    text-align: center;
}

.logo-nuevo{
    width: 10.5rem !important;
    margin: 0 1.1rem 0 0;
}

.sidebar-dashboard {
    width: 6.25rem;
}

#dashboard a {
    margin: 0 0 0 0.3rem;
}

.sidebar-dashboard,
.dropdowns {
    margin: 0 0 1.25rem 2rem;
    display: flex;
    flex-direction: column;
    transition: all 0.35s ease;
}

.sidebar-dashboard a {
    color: #4b4b4b;
}

.dropdown { 
    margin: 0 0 0.5rem;
}

.sidebar ul {
    padding: 0 0 0 1.4rem;
    margin: 0;
}

.sidebar button {
    background: none;
    border: none;
    cursor: pointer;
    color: #0A1B39;
    display: flex;
    align-items: flex-start;
    flex-direction: row;
    font-size: 1rem;
    font-weight: 0;
    margin: 0 0 0.5rem;
}

.sidebar .arrow {
    width: 0.7rem;
    transition: transform 0.3s ease;
}

.sidebar .arrow-prox {
    width: 0.7rem;
    transition: transform 0.3s ease;
}

.side .arrow-prox:nth-child(4){
    position: absolute;
    right: -2rem;
}

.dropdown-toggle.rotar .arrow {
    transform: rotate(-90deg);
}

.sidebar span {
    text-align: start;
    color: #4b4b4b;
    margin: 0 0.3rem 0 0;
}

li{
    font-size: 0.85rem;
    margin: 0.35rem 0 1rem 0.35rem;
}

li a {
    color: #5e5e5e ;
}

.sidebar-dashboard img {
    height: 0.9rem;
    margin: 0 0.21rem 0 0; 
}

.sidebar button:hover {
    color: #37568A;
}

.item {
    color: #888888;
}

.item:hover{
    text-decoration: underline !important;
}

.boton,
.dashboard {
    border: 0;
    font-size: 1.1rem;
    color: #888888;
}

.notificaciones-icon {
    filter: brightness(1);
}

/*****
* header-contenido
*****/
.header-contenido {
    /*border: 1px solid red;*/
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100vh;
}

/*****
* header - panel.php
*****/
.body-panel header {
    display: flex;
    flex-direction: row;
}

.titulo-boton {
    padding: 3.5rem 2rem 0;
    display: flex;
    flex-direction: row;
    position: sticky;
    width: 100%;
    justify-content: space-between;
    align-items: center;
    text-align: center;
    z-index: 1002;
    transition: all 0.35s ease;
}

.titulo-boton h1 {
    color: #37568A;
    font-weight: 600;
    margin: 0;
}

.dropdown-toggle-user {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    text-align: center;
    align-items: center;
    border: none;
    width: 20rem;
    background: #B8C8D0;
    border-radius: 1.75rem;
    height: 3rem;
}

.boton-header.bordear button {
    border-radius: 0;
    border-top-left-radius: 1.5rem;
    border-top-right-radius: 1.5rem;
}

.boton-header .arrow {
    width: 0.8rem;
    margin: 0 0.5rem 0 0;
    transition: transform 0.3s ease;
}

.dropdown-toggle-user img {
    transform: rotate(270deg);
}

.dropdown-toggle-user.rotar img:nth-child(2) {
    transform: rotate(360deg);
}

.user-arrow {
    display: flex;
    flex-direction: row;
}

.boton-header ul{
    position: absolute;
    display: flex;
    flex-direction: column;
    width: 20rem;
    justify-content: center;
    align-items: end;
    background: #B8C8D0;
    margin: 0;
    padding: 1.5rem 0;
    border-radius: 0 0 1.5rem 1.5rem;
}

.boton-header li {
    margin: 1rem 0;
    padding: 0 2rem 0 0;
}

.boton-header .item {
    color: #000;
    font-size: 0.9rem;
}

.boton-header .item:hover {
    text-decoration: underline;
}

.boton-header .salto {
    margin: 0 2rem !important;
    width: 10rem;
    border: none;
    border-bottom: 0.1rem solid #000;
}

.imagen-boton {
    /*border: 1px solid red;*/
    height: 2rem;
    width: 2rem;
    justify-content: center;
    display: flex;
    flex-direction: column;
    color: #888888;
    border-color: #888888;
    border-radius: 100%;
    margin: 0 0 0 0.2rem;
    background: #ffffff;
    font-size: small;
    border-width: 0.122rem;
    transform: rotate(90deg);
}

.centro-de-ayuda {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.25rem;
}

.centro-de-ayuda img {
    rotate: 45deg;
    margin: 0.15rem 0 0;
    height: 0.75rem;
}

.cerrar-sesion {
    /* display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.25rem; */
    color: #C40000 !important;
}

/* .cerrar-sesion img {
    rotate: 45deg;
    margin: 0.15rem 0 0;
    height: 0.75rem;
    filter: invert(25%) sepia(100%) saturate(5000%) hue-rotate(355deg) brightness(65%) contrast(160%);
} */

.imagen-boton img {
    filter: invert(31%) sepia(14%) saturate(4940%) hue-rotate(170deg) brightness(65%) contrast(95%) grayscale(1);
}

.boton-header p {
    margin: 0;
}

.boton-header .usuario {
    margin: 0 0.5rem 0 0;

}

.boton-header-despliegue .item {
    color: #000;
}

/*****
contenedor extension - panel.php
*****/
.extension {
    /*border: 0.1px solid red;*/
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    transition: all 0.35s ease;
    margin: 4rem 0 0;
}

.contenedores {
    background: #ffffff;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 0.313rem;
    color: #717171;
}

/*Tablas de extension*/
.contenedores-mis-paneles,
.contenedores-movimientos,
.contenedores-mis-avisos,
.contenedores-mis-usuarios,
.contenedores-mis-invitados,
.contenedores-configuraciones,
.contenedores-nfcs-locales {
    width: 73rem;
    display: flex;
    flex-direction: column;
    padding-bottom: 1.3rem;
}

.contenedores-mis-paneles table,
.contenedores-mis-usuarios table {
    padding: 1.5rem 0 0;
}

/*  width: 73rem; */
table {
    border-radius: 1.5rem;
    border-spacing: 0px;
    background: #ffffff;
    margin: 2rem 0;
    padding: 1rem 0 0;
    box-shadow: rgba(0, 0, 0, 0.08) 0px 2px 10px
}

table p {
    padding: 0 0 0 0.15rem;
    margin: 0 0 0.2rem;
    font-weight: 600;
    text-align: start;
}

label{
    font-size: 0.85rem;
}

table th div {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 0 0 0.25rem 0;
}

table th div div{
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    height: 0.5rem;
    padding: 0 0.5rem 0 0;
}

table th div div img {
    filter: invert(31%) sepia(14%) saturate(4940%) hue-rotate(170deg) brightness(65%) contrast(95%);
    width: 0.4rem;
    height: 0.25rem;
}

/* Estilo de inputs y select en tablas */
th input,
th select {
    height: 1.75rem;
    border: none;
    border-radius: 0.75rem;
    background: #F2F2F2;
    font-size: 0.85rem;
    font-style: italic;
    padding: 0 0 0 0.5rem;
}

/*****
dashboard.php
*****/
.contenedores-dashboard {
    /*border: 1px solid red;*/
    width: 64rem;
    display: flex;
    flex-direction: column;    
}

.contenedores-dashboard i {
    font-size: 1.1rem;
    margin: 0 0 0 2.35rem;
}

.contendores {
    gap: 1.5rem;
}

.dropdown-accesos {
    /*border: 1px solid red;*/
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    margin: 0 0 0.5rem 0;
}

.dropdown-accesos button{
    display: flex;
    flex-direction: row;
    border: none;
    background: none;
    padding: 0 1.5rem 0 0;
    color: #717171;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.dropdown-accesos button img {
    width: 0.8rem;
    margin: 0 0 0 0.5rem;
}

.contenedor-fila1,
.contenedor-fila2,
.contenedor-fila3 {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
}

.contenedor-usuario {
    background: #105680 !important;
    color: #e6e8e9 !important;
    height: 7rem;
    width: 18rem !important;
    border-radius: 1.5rem;
    justify-content: center;
    justify-items: center;
    margin: 0.5rem;
    padding: 1.2rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.titulo-gestor {
    font-size: 0.7rem;
    margin: 0;
}

.contenedor-usuario p {
    font-size: 0.9rem;
    margin: 0;
}

.dashboard-nombre {
    font-size: 0.9rem;
}

.dashboard-bienvenido {
    font-size: 1.2rem;
    font-weight: 600;
}

.dashboard-fecha {
    font-size: 0.8rem;
}

.dashboard-contenedor-imagen {
    display: flex;
    justify-content: start;
    align-items: center;
    margin: 1rem 0 0 0;
    color:#4b4b4b;
}

.dashboard-borde-imagen {
    height: 1.75rem;
    width: 1.75rem;
    display: flex;
    border-radius: 0.4rem;
    top: 0;
    justify-content: center;
    align-items: center;
    background: #105680;
    margin: 0 0.75rem 0 0;
}

.dashboard-borde-imagen img {
    fill: #ffffff;
    color: #ffffff;
    opacity: 1;
    filter: brightness(200%);
}

.dashboard-borde-imagen .nfc_icon {
    height: 1.2rem;
    width: 1.2rem;
}

.dashboard-borde-imagen .edificio-icono {
    height: 1rem;
    width: 1rem;
}

.dashboard-borde-imagen .duo-icono {
    height: 1.3rem;
    width: 1.3rem;
}

.dashboard-borde-imagen .persona-icono {
    height: 1.5rem;
    width: 1.5rem;
}

.dashboard-borde-imagen .grupo-icono {
    height: 1.5rem;
    width: 1.5rem;
}

.dashboard-borde-imagen .suspendido-icono {
    height: 1.2rem;
    width: 1.2rem;
}

.contenedor-fila1 .contenedores,
.contenedor-fila2 .contenedores,
.contenedor-fila3 .contenedores {
    height: 7rem !important;
    width: 18rem !important;
    border-radius: 1.5rem;
    /* justify-content: center; */
    gap: 1.7rem;
    padding: 1.2rem;
    margin: 0.5rem 0.5rem 0.5rem 0.5rem;
    display: flex;
    flex-direction: column;
}

h6 {
    font-size: 1rem;
    margin: 0 0 0.25rem;
}

.contenedores-contenido {
    text-align: center;
}

.contenedores-contenido img{
    height: 1.5rem;
    width: 1.5rem;
    margin: 0 0 1.5rem;
    padding: 0;
    text-align: end;
    /* filter: invert(31%) sepia(14%) saturate(4940%) hue-rotate(180deg) brightness(45%) contrast(95%); */
}

.contenedores p{
    font-size: 2.2rem;
    font-weight: 500;
    margin: 1rem 0 0rem 2.5rem;
    width: 15rem;
}

.contenedores h6 {
    margin: 0;
}

/*****
nuevo-panel.php
*****/
.contenedores-nuevo-panel,
.contenedores-editar-panel,
.contenedores-nuevo-usuario,
.contenedores-nuevo-invitado,
.contenedores-nuevo-aviso,
.contenedores-configuraciones,
.contenedores-nfcs-locales {
    width: 55rem;
    display: flex;
    flex-direction: row;
    gap: 2.5rem;
}

.contenedores-nuevo-panel .primera-columna,
.contenedores-nuevo-panel .segunda-columna,
.contenedores-editar-panel .primera-columna,
.contenedores-editar-panel .primera-columna,
.contenedores-nuevo-usuario .primera-columna,
.contenedores-nuevo-usuario .segunda-columna,
.contenedores-nuevo-invitado .primera-columna,
.contenedores-nuevo-invitado .segunda-columna,
.contenedores-nuevo-aviso .primera-columna,
.contenedores-nuevo-aviso .segunda-columna,
.contenedores-configuraciones .primera-columna,
.contenedores-configuraciones .segunda-columna {
    width: 26.25rem;
}


.contenedores-nfcs-locales .columna-centrada {
    width: 50rem;
}

.contenedores-nuevo-panel .contenedores,
.contenedores-nuevo-usuario .contenedores,
.contenedores-nuevo-invitado .contenedores,
.contenedores-nuevo-aviso .contenedores,
.contenedores-configuraciones .contenedores {
    display: flex;
    flex-direction: column;
    padding: 2.65rem 2.65rem 2.2rem;
    margin: 0 0 2.5rem;
    border-radius: 1.5rem;
    color: #4b4949;
}

.contenedores-nfcs-locales .contenedores {
    display: flex;
    flex-direction: column;
    padding: 2.65rem 2.65rem 2.2rem;
    margin: 0 0 2.5rem;
    border-radius: 1.5rem;
    color: #4b4949;
    align-items: center;
}

.contenedores-nuevo-panel .contenedores h5,
.contenedores-nuevo-usuario .contenedores h5,
.contenedores-nuevo-invitado .contenedores h5,
.contenedores-configuraciones .contenedores h5,
.contenedores-nuevo-aviso .contenedores h5,
.contenedores-nfcs-locales .contenedores h5 {
    margin: 0 0 2rem;
    font-size: 1.55rem;
    font-weight: 500;
    color: #000;
}

.contenedores-nuevo-panel h6,
.contenedores-nuevo-usuario h6,
.contenedores-nuevo-invitado h6,
.contenedores-nuevo-aviso h6,
.contenedores-nfcs-locales h6 {
    color: #000;
    margin: 0 0 0.75rem !important;
    font-size: 1rem;
}

.contenedores-nuevo-panel .contenedores input,
.contenedores-nuevo-panel .contenedores select,
.contenedores-nuevo-panel .contenedores button,
.contenedores-nuevo-usuario .contenedores input,
.contenedores-nuevo-usuario .contenedores select,
.contenedores-nuevo-usuario .contenedores button,
.contenedores-nuevo-invitado .contenedores input,
.contenedores-nuevo-invitado .contenedores select,
.contenedores-nuevo-invitado .contenedores button,
.contenedores-nuevo-aviso .contenedores input,
.contenedores-nuevo-aviso .contenedores select,
.contenedores-nuevo-aviso .contenedores button,
.contenedores-configuraciones .contenedores input,
.contenedores-configuraciones .contenedores select,
.contenedores-configuraciones .contenedores button,
.contenedores-nfcs-locales .contenedores input[type="text"],
.contenedores-nfcs-locales .contenedores select,
.contenedores-nfcs-locales .contenedores button,
.contenedores-nuevo-invitado .contenedores input,
.contenedores-nuevo-invitado .contenedores select,
.contenedores-nuevo-invitado .contenedores button {
    padding: 0.5rem;
    height: 1.7rem;
    margin: 0.75rem 0 1.25rem;
    font-size: 0.85rem;
    font-style: italic;
    border-radius: 0.5rem;
    border: none;
    background: #F0F0F0;
    color: #4b4949; 
}

.contenedores-nfcs-locales .contenedores input[type="file"] {
    padding: 0.5rem;
    height: 1.7rem;
    margin: 0.75rem 0 1.25rem;
    font-size: 0.85rem;
    font-style: italic;
    border-radius: 0.5rem;
    border: none;
    background: #F0F0F0;
    color: #4b4949;
    align-items: center;
    align-content: center;
}

.contenedores-nuevo-panel .contenedores select,
.contenedores-nuevo-usuario .contenedores select,
.contenedores-nuevo-invitado .contenedores select,
.contenedores-nuevo-aviso .contenedores select,
.contenedores-nuevo-panel .contenedores input[type="number"],
.contenedores-nuevo-usuario .contenedores input[type="number"],
.contenedores-nuevo-invitado .contenedores input[type="number"],
.contenedores-nuevo-aviso .contenedores input[type="number"],
.contenedores-nuevo-panel .contenedores button,
.contenedores-nuevo-usuario .contenedores button,
.contenedores-nuevo-invitado .contenedores button,
.contenedores-configuraciones .contenedores select,
.contenedores-configuraciones .contenedores button,
.contenedores-nfcs-locales .contenedores select,
.contenedores-nfcs-locales .contenedores button {
    height: 2.7rem !important;
}

.contenedores-nuevo-panel .contenedores input[type="number"],
.contenedores-nuevo-usuario .contenedores input[type="number"],
.contenedores-nuevo-invitado .contenedores input[type="number"],
.contenedores-nuevo-aviso .contenedores input[type="number"] {
    padding: 0 0 0 0.5rem;
}

.contenedores-nuevo-panel .password,
.contenedores-nuevo-usuario .password{
    width: 16.5rem;
}

.contenedor-contrasenya {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    text-align: center;
    gap: 1rem;
}

#adminPasswordCuenta {
    width: 20rem !important;
}

.contrasenya-aleotoria{
    display: flex;
    flex-direction: column;
    background: #F0F0F0;
    border-radius: 0.5rem;
    height: 3.5rem;
    width: 3.5rem;
    justify-content: center;
    align-items: center;
    margin: 0.75rem 0 1.25rem;
    cursor: pointer;
}

.contrasenya-aleotoria img{
    height: 1.35rem;
    width: 1.35rem;
    opacity: 0.6;
}

.activacion-segundos {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.activacion-segundos input {
    width: 4rem;
    text-align: center;
    height: 2.35rem;
    padding: 0 !important;
}

.activacion-segundos label {
    margin: 0.75rem 0 1.25rem 0.5rem;
}

.autoencender {
    background: #5B97BA !important;
    color: #ffffff !important;
    font-style: normal !important;
    font-size: 0.95rem !important;
    margin: 1rem 0 !important;
    height: 2.5rem;
    
}

.abrir-puerta {
    background: #1d7e37 !important;
    color: #ffffff !important;
    font-style: normal !important;
    font-size: 0.95rem !important;
    margin: 0.5rem 0 !important;
    height: 2.5rem;
    
}

.reiniciar-dispositivo {
    background: #c73636 !important;
    color: #ffffff !important;
    font-style: normal !important;
    font-size: 0.95rem !important;
    margin: 1rem 0 !important;
    height: 2.5rem;
    
}

.contenedor-labels {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.contenedor-inputs {
    display: flex;
    flex-direction: row;
    width: auto;
    height: 4.75rem;
    gap: 1.5rem;
    justify-content: space-between;
}


#codigoLlamada {
    width: 7.5rem !important;
}

#numColumnas {
    width: 8.25rem !important;
}

.contenedor-inputs-paneles {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 1.5rem;
}

.contenedor-inputs-paneles .codigo-llamada {
    width: 6rem;
    text-align: start;
}

.contenedor-select-eliminar {
    display: flex;
    flex-direction: column;
    width: 12.5rem;
    position: relative;
    top: 0.75rem;
}


.contenedor-select-eliminar-reles {
    display: flex;
    flex-direction: column;
    position: relative;
    top: 0.75rem;
}


#contenedorReles .contenedor-select-eliminar {
    display: flex;
    flex-direction: column;
    width: 100%;
    top: 0.75rem;
    margin: 0;
}

.contenedor-inputs-paneles select {
    width: 12.5rem !important;
    margin: 0 !important;
}

#contenedorReles .contenedor-select-eliminar select {
    margin: 0;
}

#contenedorReles .contenedor-select-eliminar select option:nth-child(1){
    text-align: center;
}

#idRele {
    text-align: center;
}

.contenedor-apertura-sos {
    display: flex;
    flex-direction: column;
    margin: 0rem 0 1rem;
}

.contenedor-emergencia {
    display: flex;
    flex-direction: column;
    margin: 0rem 0 1rem;
}

.contenedor-input-eliminar {
    display: flex;
    flex-direction: column;
    margin: 0rem 0 1rem;
}

.contenedor-input-eliminar input {
    margin: 0 !important;
}

select:disabled {
    opacity: 0.45;
    filter: grayscale(100%);
    cursor: not-allowed;
}

a.item.disabled {
    opacity: 0.45;
    cursor: not-allowed;
    pointer-events: none;   /* bloquea clic */
    filter: grayscale(100%);
    text-decoration: none;
}

#eliminarAcceso {
    background: none;
    color: #D50000;
    font-style: normal;
    padding: 0;
    margin: 0.25rem 0;
    text-align: start;
    font-size: 0.8rem;
    position: relative;
    cursor: pointer;
    width: fit-content;
    height: 1rem !important;
}

#eliminarAcceso:hover {
    text-decoration: underline;
}

#eliminarRele {
    background: none;
    color: #D50000;
    font-style: normal;
    padding: 0;
    margin: 0;
    text-align: start;
    font-size: 0.8rem;
    position: relative;
    cursor: pointer;
    width: fit-content;
    height: 1rem !important;
    bottom: 0.85rem;
}

#eliminarRele:hover {
    text-decoration: underline;
}

#eliminarTag {
    background: none;
    color: #D50000;
    font-style: normal;
    padding: 0;
    margin: 0.25rem 0 0;
    text-align: start;
    font-size: 0.8rem;
    position: relative;
    cursor: pointer;
    width: fit-content;
    height: 1rem !important;
}


#eliminarDestinatarios {
    background: none;
    color: #D50000;
    font-style: normal;
    padding: 0;
    margin: 0.25rem 0 0;
    text-align: start;
    font-size: 0.8rem;
    position: relative;
    cursor: pointer;
    width: fit-content;
    height: 1rem !important;
}

#eliminarTag:hover {
    text-decoration: underline;
}

.relesNuevos {
    display: flex;
    flex-direction: column;
}

.permisos-configuracion {
    display: flex;
    flex-direction: column;
    padding: 1rem 0 0 0rem;
}

.permisos-configuracion-sangria {
    display: flex;
    flex-direction: column;
    padding: 1rem 0 0 3rem;
}

.contenedor-inputs select {
    width: 100%;
    height: 2.35rem;
}

.contenedor-inputs input {
    width: 12.5rem;
}

.numero-repuesto,
.fecha-alta,
.version-firmware {
    text-align: center;
}

.titulo-h5-h6 h5{
    margin: 0 !important;
}

.titulo-h5-h6 h6{
    color: #4b4949;
    margin: 0 0 2rem !important;
}

.anyadir-mas {
    background: none !important;
    font-size: 1.15rem !important;
    font-style: normal !important;
    color: #105680 !important;
    margin: 0.5rem 0 0 !important;
    font-weight: 600;
    text-decoration: underline;
    display: flex;
    justify-content: flex-start;
    cursor: pointer;
    width: fit-content;
}

.contenedores-botones {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin: 0 0 2.5rem;

}

.boton-guardar,
.boton-guardar-enviar,
.boton-eliminar,
.boton-cancelar,
.consultar-movimientos {
    display: flex;
    font-size: 1rem;
    height: 2.75rem;
    width: 26.25rem;
    border: none;
    border-radius: 0.5rem;
    background: #105680;
    color: #ffffff;
    text-align: center;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    margin: 0;
}

.delete-nfc-button {
    display: flex;
    font-size: 1rem;
    height: 2.75rem;
    width: 26.25rem;
    border: none;
    border-radius: 0rem;
    background: #ffffff00;
    color: #ffffff00;
    text-align: center;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    margin: 0;
}

.boton-guardar:hover,
.boton-guardar-enviar:hover,
.boton-eliminar:hover {
    box-shadow: 0 0 0.313rem rgba(0, 0, 0, 0.3);
    text-decoration: underline;
}

.boton-eliminar {
    background: #D50000;
}

.boton-cancelar {
    background: #000000;
}

.abrebox-ia {
    background: linear-gradient(135deg, #2C8D4B, #0055A5);
    border-radius: 0.9rem;
    padding: 8px 12px;
    font-size: 1.3rem;
    color: white;
    font-family: -apple-system, BlinkMacSystemFont, 
        "SF Pro Display", 
        "Helvetica Neue", 
        Arial, sans-serif;
    width: 20rem;
    height: 3.15rem;
    box-shadow: none;
    border: none;
    outline: none;
    appearance: none;
    margin-bottom: 20px;
    cursor: pointer;
}


.imagen-contacto {
    height: 5rem !important;
    width: 5rem !important;
    border-radius: 1.3rem;
    cursor: pointer;
}

#contenedorReles {
    display: flex;
    flex-direction: column;
}

.mensaje-error {
    margin:-1rem 0 1rem 0;
    padding: 0;
    font-size: 0.9rem;
}

/*****
mis-paneles.php
*****/
.seleccionar-buscar-input {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin: 0;
}

.contenedores-mis-paneles .seleccionar-buscar-input {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.buscar,
.generar-pdf,
.eliminar {
    width: 12rem;
    height: 2.4rem;
    border: none;
    border-radius: 1.2rem;
    background: #105680;
    color: #ffffff !important;
    margin: 0;
    transition: all .17s ease;
    cursor: pointer;
    font-size: 0.95rem;
}

.buscar:hover,
.generar-pdf:hover,
.abrebox-ia:hover,
.eliminar:hover {  
    box-shadow: 0 0 0.313rem rgba(0, 0, 0, 0.3);
    text-decoration: underline;
}

.input-buscar {
    width: 21rem;
    height: 2.4rem;
    border: none;
    border-radius: 1.2rem;
    padding: 0 1rem;
    box-shadow: rgba(0, 0, 0, 0.08) 0px 2px 10px;
    font-size: 1.15rem;
    font-weight: 500;
    color: rgb(51, 51, 51);
}


/*****
movimientos.php
*****/
.consultar-movimiento-color {
    color: #ffffff;
}

.from-to {
    display: flex;
    flex-direction: row;
}

#from,
#to {
    width: 7rem;
}

.seleccionar-panel {
    width: 20rem;
    height: 2.3rem;
    border-radius: 1.2rem;
    padding: 0 1rem;
    background: #E5E5E5;
    border-color: #707070;
    color: #4b4949;
    margin: 0 0.5rem 0 0;
}

.contenedores-movimientos tr td:nth-child(2) {
    padding: 0.9rem 0.75rem 0.9rem 1.5rem;
}

.contenedores-movimientos td {
    padding: 0.9rem 0.75rem;
}

.contenedores-movimientos td img {
    height: 4.5rem;
    width: 4.5rem;
    border-radius: 0.5rem;
    background-color: #eeeeee;
}

.eliminar {
    background: #D50000;
    margin: 0 0 0 1rem;
}

.hora-movimientos {
    width: 6rem;
}

.columna-movimientos {
    width: 8.5rem;
}

.columna-apartamento {
    width: 8rem;
}
/*****
nuevo-usuario.php
*****/
.titulo-directorio-contacto {
    display: flex;
    flex-direction: column;
    margin: 0 0 0.75rem;
}

.titulo-directorio-contacto  h5{
    margin: 0 !important;
}

.contenedor-contacto {
    display: flex;
    flex-direction: row;
    gap: 2rem;
}

.contenedores-contacto {
    display: flex;
    flex-direction: column;
    width: 45%;
}

.usuario-foto-texto {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    margin: 0 0 1.5rem;
}

/*                  REVISAR                 */
.editar-eliminar-foto {
    display: flex;
    flex-direction: row !important;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin: 0.25rem 0 0 0;
}

.editar-eliminar-foto img {
    filter: invert(25%) sepia(100%) saturate(5000%) hue-rotate(355deg) brightness(65%) contrast(160%);
    margin: 0;
}

.usuario-foto-texto .editar-eliminar-foto button {
    font-size: 0.85rem;
    color: #2088F0;
    cursor: pointer;
    background: none;
    margin: 0;
    padding: 0;
    height: auto !important;
    font-style: normal;
}

.usuario-foto-texto .editar-eliminar-foto button:hover {
    text-decoration: underline;
}

.usuario-foto-texto .editar-eliminar-foto .trash-icon {
    height: 1rem;
    width: 1rem;
}

.usuario-foto-texto div input {
    display: none;
}


.usuario-foto-texto p {
    margin: 0;
    font-size: 0.90rem;
    padding: 0 0 1.5rem
}
.acceso-1,
.acceso-2 {
    width: 14rem;
    height: 2.45rem;
    text-align: start !important;
    padding: 0 0 0 0.5rem !important;
}

.nombre-apellido-contacto {
    text-align: start !important;
}

.contenedor-inputs input {
    margin: 0.75rem 0 2.5rem !important;
}

.panel-acceso {
    width: 10rem !important;
}

.escal-bloque,
.apart-contacto{
    width: 8.5rem;
}

.contenedores-nuevo-usuario .contenedor-inputs {
    margin: 0rem !important;
}

#contenedorTag {
    display: flex;
    flex-direction: column;
}

#altaUsuario {
    text-align: center;
}

/* #observacion {
    margin: 0.75rem 0 0 0;
    resize: none;
    /*form-sizing: content;*/           /*Para un futuro, funcionará, no requerirá max-height*/
   /* min-height: 1.8rem;
    max-height: 8.5rem;
    border-radius: 0.4rem;
    border: none;
    color: #4b4949;
    background-color: #F0F0F0;
    overflow: hidden;
    padding: 0.5rem 0.5rem 0 0.5rem;
} */

#observacion {
    margin: 0.75rem 0 0 0;
    resize: none; /* No permite redimensionar */
    min-height: 1.8rem; /* Altura de 1 línea */
    height: 6.5rem; /* Altura de 4 líneas */
    max-height: 6.5rem; /* Máximo 4 líneas */
    overflow-y: auto; /* Scroll si se pasa de 4 líneas */
    border-radius: 0.4rem;
    border: none;
    color: #4b4949;
    background-color: #F0F0F0;
    padding: 0.5rem;
    font-family: inherit;
    font-size: 0.85rem;
    line-height: 1.4; /* Altura de línea consistente */
}



.stats-box {
    background: #ffffff;
    padding: 5px 20px 10px;
    border-radius: 1.5rem;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);
    max-width: 20.5rem;
    margin-top: 20px;
    line-height: 1.4em;
}

.stats-box h3 {
    font-size: 1.05em;
    font-weight: 500;
    margin-bottom: 20px;
    color: #333;
}

.stat-item {
    background: #F2F2F2;
    padding: 8px 12px;
    border-radius: 1.5rem;
    margin-bottom: 8px;
    font-size: 0.95em;
    color: #333;
}


/*****
mis-usuarios.php
*****/
table input,
table select {
    width: 100%;
}

table .licencia-usuario {
    width: 7rem;
}

table input[type="checkbox"] {
    width: 0.8rem;
}

.codigo-usuario,
.buscar-codigo-usuario {
    width: 6rem;
}

/*****
nuevo-invitado.php
*****/
.codigo-pin-invitado {
    text-align: center;
    font-size: 1.5rem !important;
    height: 2.4rem;
}

.codigo-pin-invitado::placeholder {
    font-size: 1.5rem !important;
    font-weight: 600;
}

.notificacion-uso,
.acceso-auxiliar-permiso {
    width: 4rem !important;
}

.email-notificacion-uso,
.acceso-auxiliar-invitado {
    width: 15rem !important;
}

/*****
mis-invitados.php
*****/
.admin-invitados,
.email-usuarios,
.sub-email-usuarios,
.paneles-usuarios {
    max-width: 9rem;
}



/*****
configuraciones.php
*****/
.contenedores-configuraciones .boton-guardar {
    margin: 0 0 2.5rem !important;
}

.contenedores-configuraciones p {
    padding: 0 0 0.5rem;
}

.proximamente {
    margin: 0 !important;
    padding: 0 !important;
}

#cargando {
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 17rem !important;
    height: auto !important;
    width: auto !important;
    background-color: #E5E5E5;
    z-index: 1000;
}

#cargando_usuarios {
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    inset: 0;
    background-color: #E5E5E5;
    z-index: 999999;
}

#cargando_accesos {
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    inset: 0;
    background-color: #E5E5E5;
    z-index: 999999;
}

.spinner {
    border: 0.5rem solid #fff;
    border-top: 0.5rem solid #37568A;
    border-radius: 50%;
    width: 2rem;
    height: 2rem;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.contenido {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 0 0 0 18rem;
    /* IMPORTANTE
    flex-direction: row;
    justify-content: center;
    align-items: center;
    */
    /*border: 1px solid blue;*/
}

/* .selected,
.selected span {
    text-decoration: underline !important;
} */

/*****
* Modals
*****/
.no-scroll {
    overflow: hidden;
}

.modal-pdf {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    justify-content: center;
    align-items: center;
    z-index: 90000;
}

.modal-imagen {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    justify-content: center;
    align-items: center;
    z-index: 9000;
}

.modal-sin-imagen {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    justify-content: center;
    align-items: center;
    z-index: 9000;
}

.modal-sin-imagen button {
    padding: 1rem 1.25rem 0 0;
    text-align: end;
}

.modal-selected {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    justify-content: center;
    align-items: center;
    z-index: 9000;
}

.modal-no-selected {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    justify-content: center;
    align-items: center;
    z-index: 9000;
}

.modal-contenedor {
    display: flex;
    flex-direction: column;
    background-color: #fff;
    padding: 1rem 0;
    border-radius: 0.6rem;
    box-shadow: 0 0.2rem 1rem rgba(0, 0, 0, 0.1);
    text-align: center;
    width: 31.5rem;
}

.modal-contenedor p {
    margin: 0 0 0 1rem;   
    font-size: 1.05rem;
    color: #616060;
    text-align: start;
}

.modal-contenedor hr {
    margin: 1.5rem 0 0;
}

.modal-contenedor div {
    display: flex;
    flex-direction: row;
    justify-content: end;
    gap: 0.5rem;
    margin: 1rem 1rem 0 0;
}

.boton-modal {
    font-size: 1.05rem;
    color: #0470b4;
    border: none;
    cursor: pointer;
    margin: 0;
    background: none;
}

/*
nuevo-inForm.php
*/
.contenedor-opcional {
    margin: 0 0 0.25rem;
}

.contenedor-opcional h5{
    margin: 0 !important;
}

/*
nuevo-aviso.php
*/
#descripcionAviso {
    margin: 0.75rem 0 0 0;
    resize: none;
    /*form-sizing: content;*/           /*Para un futuro, funcionará, no requerirá max-height*/
    min-height: 5rem;
    max-height: 10.45rem;
    border-radius: 0.4rem;
    border: none;
    color: #4b4949;
    background-color: #F0F0F0;
    overflow: hidden;
    padding: 0.5rem 0.5rem 0 0.5rem;
    font-family: inherit;
    font-size: 0.85rem;
    line-height: 1.4; /* Altura de línea consistente */
}


.contenedor-select-eliminar {
    display: flex;
    flex-direction: column;
    margin: 0 0 1.5rem;
}


.activacion-segundos {
    display: flex;
    align-items: center;
    gap: 8px;
}

.btn-increment,
.btn-decrement {
    width: 32px;
    height: 32px;
    background-color: #007bff;
    color: white;
    border: none;
    border-radius: 4px;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.2s;
}

.btn-increment:hover,
.btn-decrement:hover {
    background-color: #0056b3;
}


#tag1 {
    margin: 0;
}

/* #contenedorTag .nuevoTag:nth-child(1) input {
    margin: 0 !important;
    width: 20rem;
} */


#contenedorTag .nuevoTag input {
    width: 20rem;
    margin: 0 !important;
}

.nuevoTag input{
    margin: 0.5rem 0 0 !important;
}

.contenedores-nuevo-aviso .contenedor-select-eliminar {
    display: flex;
    flex-direction: column;
    margin: 0.75rem 0 1rem;
}


#conexionPantalla {
    margin: 1rem 0 0.25rem 0 !important;
    padding: 0.5rem 0.5rem 0.5rem 0.25rem;
}

.destinatarios {
    margin: 1rem 0 0.25rem 0 !important;
    padding: 0.5rem 0.5rem 0.5rem 0.25rem;
}

.finalizacion-aviso {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
    gap: 2rem;
}

.finalizacion-aviso input {
    width: 45%;
}
/*
ease
*/

.titulo-boton {
    transition: all 0.35s ease;
}

.extension {
    transition: all 0.35s ease;
}

.header-contenido {
    margin: 0;
}

@media (min-width: 1050px) and (max-width: 1099px) {
    .titulo-boton {
        justify-content: space-between;
        transition: all 0.35s ease;
        position: absolute;
        padding: 3.5rem 0 0;
    }

    .sidebar {
        transition: all 0.35s ease;
        position: fixed;
        height: 100%;
        width: 16rem;
    }

    .contenido {
        transition: all 0.35s ease;
        padding: 0 5rem 0 18rem;
    }

    .contenedores-mis-paneles,
    .contenedores-mis-invitados,
    .contenedores-movimientos,
    .contenedores-mis-usuarios {
        padding: 0 0 0 7rem;
    }

    .extension {
        margin: 10rem 0 0 0;
    }
}

@media (min-width: 1100px) and (max-width: 1149px) {
    .titulo-boton {
        padding: 3.5rem 0 0;
        transition: all 0.35s ease;
    }

    .sidebar {
        transition: all 0.35s ease;
        position: fixed;
        height: 100%;
    }

    .contenido {
        transition: all 0.35s ease;
        padding: 0 4rem 0 20rem;
    }

    .extension { 
        padding: 0 0 0 1.5rem;
    }
}

@media (min-width: 1150px) and (max-width: 1199px) {
    .titulo-boton {
        padding: 3.5rem 0 0;
        transition: all 0.35s ease;
    }

    .sidebar {
        transition: all 0.35s ease;
        position: fixed;
        height: 100%;
    }

    .contenido {
        transition: all 0.35s ease;
        padding: 0 2rem 0 18rem;
    }
}

@media (min-width: 1200px) and (max-width: 1249px) {
    .titulo-boton {
        padding: 3.5rem 0rem 0 0rem;
        transition: all 0.35s ease;
    }

    .sidebar {
        transition: all 0.35s ease;
        position: fixed;
        height: 100%;
    }

    .contenido {
        transition: all 0.35s ease;
        padding: 0 2rem 0 21rem;
    }
}

@media (min-width: 1250px) and (max-width: 1299px) {
    .titulo-boton {
        padding: 3.5rem 0rem 0 0rem;
        transition: all 0.35s ease;
    }

    .sidebar {
        transition: all 0.35s ease;
        position: fixed;
        height: 100%;
    }

    .contenido {
        transition: all 0.35s ease;
        padding: 0 2rem 0 21rem;
    }
}

@media (min-width: 1300px) and (max-width: 1349px) {
    .titulo-boton {
        padding: 3.5rem 0 0;
        transition: all 0.35s ease;
    }

    .sidebar {
        transition: all 0.35s ease;
        position: fixed;
        height: 100%;
        width: 17rem;
    }

    .contenido {
        top: -1.6rem;
        transform: scale(0.925);
        transition: all 0.35s ease;
        position: relative;
        padding: 0 2rem 0 17rem;
    }
}

@media (min-width: 1350px) and (max-width: 1399px) {
    .titulo-boton {
        padding: 3.5rem 0 0;
        transition: all 0.35s ease;
    }

    .sidebar {
        transition: all 0.35s ease;
        position: fixed;
        height: 100%;
        width: 17rem;
    }

    .contenido {
        top: -1.6rem;
        transform: scale(0.925);
        transition: all 0.35s ease;
        position: relative;
        padding: 0 2rem 0 17rem;
    }
}

@media (min-width: 1400px) and (max-width: 1450px) {
    .titulo-boton {
        padding: 3.5rem 0 0;
        transition: all 0.35s ease;
    }

    .sidebar {
        transition: all 0.35s ease;
        position: fixed;
        height: 100%;
    }

    .contenido {
        top: -1.6rem;
        transform: scale(0.925);
        transition: all 0.35s ease;
        position: relative;
    }
}

@media (min-width: 1450px) and (max-width: 1500px) {
    .titulo-boton {
        padding: 3.5rem 0 0;
        transition: all 0.35s ease;
    }

    .sidebar {
        transition: all 0.35s ease;
        position: fixed;
    }

    .contenido {
        top: -1.5rem;
        transform: scale(0.925);
        transition: all 0.35s ease;
        position: relative;
    }
}

@media (min-height: 940px) and (max-height: 980px) {
    .contenedores-dashboard {
        margin: 6rem 0 0 0;
    }
}

@media (min-height: 980px) and (max-height: 1010px) {
    .contenedores-dashboard {
        margin: 6.9rem 0 0 0;
    }
}
    

@media (min-height: 1010px) and (max-height: 1050px) {
    .contenedores-dashboard {
        margin: 7.75rem 0 0 0;
    }
}
    
/* Aplica estilos solo cuando el selector muestra el placeholder */
#numSalida.placeholder::before {
    content: attr(data-placeholder);
    color: gray;
}

#dropdownContUser {
    display: none;
}

#usuarios th:nth-child(1),
#usuarios td:nth-child(1) {
    width: 2rem;  /* Columna 1: Checkbox o Código */
}

#usuarios th:nth-child(2),
#usuarios td:nth-child(2) {
    width: 5rem;  /* Código */
}

#usuarios th:nth-child(3),
#usuarios td:nth-child(3) {
    width: 8rem; /* Nombre */
}

#usuarios th:nth-child(4),
#usuarios td:nth-child(4) {
    width: 12rem; /* Apellidos */
}

#usuarios th:nth-child(5),
#usuarios td:nth-child(5) {
    width: 5rem;  /* Licencia */
}

#usuarios th:nth-child(6),
#usuarios td:nth-child(6) {
    width: 20rem; /* Email */
}

#usuarios th:nth-child(7),
#usuarios td:nth-child(7) {
    width: 20rem; /* Accesos */
}




#allaccesostable th:nth-child(1),
#allaccesostable td:nth-child(1) {
    width: 2rem;   /* Checkbox */
}

#allaccesostable th:nth-child(2),
#allaccesostable td:nth-child(2) {
    width: 18rem;  /* Nombre del panel */
}

#allaccesostable th:nth-child(3),
#allaccesostable td:nth-child(3) {
    width: 12rem;  /* Serial Number */
}

#allaccesostable th:nth-child(4),
#allaccesostable td:nth-child(4) {
    width: 25rem;  /* Dirección completa */
    overflow: hidden;
}



#tabla-movimientos th:nth-child(1),
#tabla-movimientos td:nth-child(1) {
    width: 2rem;   /* Checkbox */
}

#tabla-movimientos th:nth-child(2),
#tabla-movimientos td:nth-child(2) {
    width: 10rem;  /* Nombre del panel */
}

#tabla-movimientos th:nth-child(3),
#tabla-movimientos td:nth-child(3) {
    width: 18rem;  /* Serial Number */
}

#tabla-movimientos th:nth-child(4),
#tabla-movimientos td:nth-child(4) {
    width: 10rem;  /* Dirección completa */
}

#tabla-movimientos th:nth-child(5),
#tabla-movimientos td:nth-child(5) {
    width: 25rem;  /* Licencia */
}

#tabla-movimientos th:nth-child(6),
#tabla-movimientos td:nth-child(6) {
    width: 7rem; /* Email */
}

#tabla-movimientos th:nth-child(7),
#tabla-movimientos td:nth-child(7) {
    width: 7rem; /* Accesos */
}




#avisostabla th:nth-child(1),
#avisostabla td:nth-child(1) {
    width: 2rem;   /* Checkbox */
}

#avisostabla th:nth-child(2),
#avisostabla td:nth-child(2) {
    width: 10rem;  /* Nombre del panel */
}

#avisostabla th:nth-child(3),
#avisostabla td:nth-child(3) {
    width: 10rem;  /* Serial Number */
}

#avisostabla th:nth-child(4),
#avisostabla td:nth-child(4) {
    width: 25rem;  /* Dirección completa */
}

#avisostabla th:nth-child(5),
#avisostabla td:nth-child(5) {
    width: 15rem;  /* Licencia */
}

#avisostabla th:nth-child(6),
#avisostabla td:nth-child(6) {
    width: 20rem; /* Email */
}

#avisostabla th:nth-child(7),
#avisostabla td:nth-child(7) {
    width: 7rem; /* Accesos */
}



.rotate_image {
    transform: rotate(-90deg); /* Rota 180 grados */
}


@media print {
    /* Oculta solo lo que no quieres imprimir */
    .sidebar,
    .header,
    .footer,
    .menu,
    .nav,
    .topbar,
    #sidebar,
    #menu,
    #nav {
        display: none !important;
        visibility: hidden !important;
    }

    .contenido {
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    /* Esto asegura que ningún contenedor padre lo limite */
    .contenido * {
        max-width: 100% !important;
    }


     /* Fuerza impresión de colores de fondo */
    * {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

}





.switch {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
}

/* Mover visualmente el texto antes del slider */
.switch-text {
  order: -1; /* aparece antes del slider */
  font-size: 14px;
  color: #333;
}

/* Slider estilo iOS */
.slider_switch {
  position: relative;
  width: 50px;
  height: 28px;
  background-color: #ccc;
  border-radius: 28px;
  transition: background-color 0.3s;
}

.slider_switch::before {
  content: "";
  position: absolute;
  height: 22px;
  width: 22px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  border-radius: 50%;
  transition: transform 0.3s;
}

/* Checkbox activado */
.switch input:checked + .slider_switch {
  background-color: #105680;
}

.switch input:checked + .slider_switch::before {
  transform: translateX(22px);
}

/* Ocultar el checkbox real */
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}


/* ==================================
   SIDEBAR MODERNO - ESTILO MEJORADO linear-gradient(180deg, #1a1d29 0%, #0f1117 100%);
   ================================== */

.sidebar {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 0.85rem;        /* margen arriba */
    bottom: 0.85rem;     /* margen abajo */
    left: 0.85rem;       /* margen izquierdo */
    height: calc(100% - 2rem); /* ajusta la altura al top/bottom */
    overflow-y: auto;
    background: #fff; 
    width: 17rem;
    z-index: 1008;
    transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: 1.5rem;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 0.313rem;
}

/* Scrollbar personalizado */
.sidebar::-webkit-scrollbar {
    width: 6px;
}

.sidebar::-webkit-scrollbar-track {
    background: transparent;
}

.sidebar::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 3px;
}

.sidebar::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.3);
}

/* Logo Container */
.contenedor-logo { 
    padding: 2rem 1.5rem;
    text-align: center;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.logo-nuevo {
    width: 10rem !important;
    filter: brightness(1.2);
    transition: transform 0.3s ease;
}

.logo-nuevo:hover {
    transform: scale(1.05);
}

/* Dashboard Button */
.sidebar-dashboard {
    margin: 1.5rem 1rem 0.5rem;
}

#dashboard {
    background: transparent;
    border: none;
    cursor: pointer;
    color: #0A1B39;
    display: flex;
    align-items: center;
    width: 100%;
    padding: 0.75rem 1rem;
    border-radius: 0.75rem;
    font-size: 1rem;
    font-weight: 500;
    transition: all 0.2s ease;
    position: relative;
}

#dashboard:hover {
    background: rgba(255, 255, 255, 0.05);
    color: #105680;
}

#dashboard.selected {
    background: #F0F0F0;
    color: #37568A;
    border: 1px solid #E6E7EC;
}

#dashboard.selected::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 60%;
    border-radius: 0 3px 3px 0;
}

#dashboard img {
    height: 1.1rem;
    margin-right: 0.75rem;
    filter: brightness(0.7);
}

#dashboard.selected img {
    filter: brightness(1.2);
}

#dashboard a {
    color: inherit;
    margin: 0;
}

/* Dropdowns Container */
.dropdowns {
    margin: 0.5rem 1rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.dropdown { 
    margin: 0;
}

/* Dropdown Toggle Buttons */
.dropdown-toggle {
    background: transparent;
    border: none;
    cursor: pointer;
    color: #9ca3af;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 0.75rem 1rem;
    font-size: 0.95rem;
    font-weight: 500;
    border-radius: 0.75rem;
    transition: all 0.2s ease;
    position: relative;
}

.dropdown-toggle:hover {
    background: rgba(255, 255, 255, 0.05);
    color: #ffffff;
}

.dropdown-toggle.selected {
    background: #F0F0F0;
    color: #000000;
    border: 1px solid #E6E7EC;
}

.dropdown-toggle.selected::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 60%;
    border-radius: 0 3px 3px 0;
}

/* Icons */
.sidebar .icon {
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    filter: brightness(0.7);
    transition: filter 0.2s ease;
}

.dropdown-toggle:hover .icon,
.dropdown-toggle.selected .icon {
    filter: brightness(1.2);
}

.dropdown-toggle .arrow {
    height: 1rem;             /* ajusta para que quede centrado con el texto */
    width: auto;
}

/* Span Text */
.sidebar span {
    flex: 1;
    text-align: start;
    color: inherit;
}

/* Arrow Icons */
.sidebar .arrow,
.sidebar .arrow-prox {
    width: 0.7rem;
    height: 0.7rem;
    transition: transform 0.3s ease;
    filter: brightness(0.7);
}

.dropdown-toggle.rotar .arrow {
    transform: rotate(180deg);
}

/* Dropdown Content */
.dropdown-content {
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.3s ease, opacity 0.3s ease;
    opacity: 0;
    padding: 0;
}

.dropdown-content.show {
    max-height: 500px;
    opacity: 1;
    padding: 0.25rem 0;
}

/* Lists */
.sidebar ul {
    padding: 0 0 0 1rem;
    margin: 0;
    list-style: none;
}

/* Sub-dropdown buttons */
.dropdown-content .dropdown-toggle {
    padding: 0.65rem 1rem;
    font-size: 0.9rem;
}

/* List Items / Links */
li {
    margin: 0.25rem 0;
}

li a.item {
    display: block;
    color: #485066;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border-radius: 0.75rem;
    font-size: 1rem;
    transition: all 0.2s ease;
    position: relative;
}

li a.item:hover {
    background: rgba(255, 255, 255, 0.05);
}

li a.item.selected {
    color: #37568A;
    font-weight: 500;
}

li a.item::before {
    content: '';
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    width: 6px;
    height: 6px;
    background: #D8DBE4;
    border-radius: 50%;
}


li a.item.selected::before {
    content: '';
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    width: 6px;
    height: 6px;
    background: #37568A;
    border-radius: 50%;
}

/* Badge "Próximamente" */
.simple {
    font-size: 0.65rem;
    font-weight: 600;
    color: #60a5fa;
    background: rgba(96, 165, 250, 0.15);
    padding: 0.2rem 0.5rem;
    border-radius: 0.35rem;
    margin-left: 0.5rem;
}

/* Disabled Items */
a.item.disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none;
    filter: grayscale(100%);
}

/* Notificaciones icon especial */
.notificaciones-icon {
    filter: brightness(0.7);
}

.dropdown-toggle:hover .notificaciones-icon,
.dropdown-toggle.selected .notificaciones-icon {
    filter: brightness(1.2);
}

/* Animaciones suaves */
@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.dropdown-content.show li {
    animation: slideIn 0.3s ease forwards;
}

/* Hover effects mejorados */
.dropdown-toggle:hover,
li a.item:hover {
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);
}

/* Focus states para accesibilidad */
.dropdown-toggle:focus,
li a.item:focus {
    outline: 2px solid rgba(96, 165, 250, 0.5);
    outline-offset: 2px;
}


.sidebar.collapsed {
    width: 4.5rem;
}

/* Ocultar textos */
.sidebar.collapsed span {
    display: none;
}

/* Centrar iconos */
.sidebar.collapsed button,
.sidebar.collapsed .dropdown-toggle {
    justify-content: center;
}

/* Ajustar iconos */
.sidebar.collapsed img.icon {
    margin: 0;
}

.sidebar.collapsed #dashboard img {
     margin: 0;
}

.sidebar.collapsed .arrow,
.sidebar.collapsed .arrow-prox {
    display: none;
}

/* Evitar dropdowns abiertos */
.sidebar.collapsed .dropdown-content {
    display: none !important;
}

.nserie {
    font-family: "SF Mono", ui-monospace, monospace;
    font-variant-numeric: slashed-zero;
}


.aviso-advertencia {
    margin-top: 0px;
    margin-bottom: 20px; /* ← Añadir esto */
    padding: 12px 15px;
    border-radius: 12px;
    background-color: #fff8e6;
}

.aviso-advertencia.aviso-critico {
    background-color: #fee;
}

.aviso-advertencia-contenido {
    display: flex;
    align-items: center;
    gap: 10px;
}

.aviso-icono {
    font-size: 20px;
    flex-shrink: 0;
}

.aviso-advertencia p {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: #5a5a5a;
}

.aviso-advertencia strong {
    color: #333;
}

.aviso-critico p {
    color: #6b3a3a;
}

.aviso-critico strong {
    color: #c62828;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}

.fila-sin-resultados td {
    padding: 60px 20px !important;
    background: transparent !important;
    border: none !important;
}

.sin-resultados-contenedor {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.sin-resultados-icono {
    font-size: 48px;
    margin-bottom: 12px;
    opacity: 0.4;
}

.sin-resultados-titulo {
    font-size: 17px;
    font-weight: 600;
    color: #1d1d1f;
    margin: 0 0 6px 0;
    margin-bottom: 5px;
}

.sin-resultados-subtitulo {
    font-size: 14px;
    color: #6c6c6e;
    margin: 0;
    padding: 5px;
}


.contenedor-numero-usos input[type="number"] {
    width: 35%;
    margin-left: 0.75rem !important;
}


.contenedor-codigo-pin {
    display: flex;
    gap: 8px;
    align-items: center;
}

.contenedor-codigo-pin .codigo-pin-invitado {
    flex: 1;
    font-family: monospace;
    font-size: 1.2em;
    letter-spacing: 2px;
    text-align: center;
    background-color: #f5f5f5;
    cursor: default;
}

.boton-regenerar-pin {
    width: 60px;
    height: 40px;
    border: none;
    border-radius: 8px;
    background-color: var(--coral-cta, #ff6b6b);
    color: white;
    font-size: 1.4em;
    cursor: pointer;
    transition: background-color 0.2s, transform 0.1s;
}

.boton-regenerar-pin:hover {
    background-color: var(--coral-cta-hover, #ff5252);
}

.boton-regenerar-pin:active {
    transform: scale(0.95);
}


.estado-pill {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 0.85em;
    font-weight: 600;
    color: #fff;
}

.estado-activa {
    background-color: #28a745;   /* verde */
}

.estado-finalizada {
    background-color: #dc3545;   /* rojo */
}



/* Overlay - oculto por defecto */
/* Overlay - oculto por defecto */
.sidebar-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1007;
    pointer-events: none;
}

.sidebar-overlay.active {
    display: block;
    pointer-events: auto;
}

/* En escritorio, nunca mostrar */
@media (min-width: 1050px) {
    .sidebar-overlay {
        display: none !important;
        pointer-events: none !important;
    }
    
    .menu-toggle {
        display: none !important;
    }
}



/* ==================================
   RESPONSIVE — MÓVIL Y TABLET
   ================================== */

/* ===== TABLET + MÓVIL ===== */
@media (max-width: 1049px) {

    /* SIDEBAR */
    .sidebar {
        transform: translateX(-100%);
        width: 17rem;
        top: 0;
        bottom: 0;
        left: 0;
        border-radius: 0;
        height: 100%;
    }

    .sidebar.mobile-open {
        transform: translateX(0);
    }

    .sidebar-overlay {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,.5);
        z-index: 1007;
    }

    .sidebar-overlay.active {
        display: block;
    }

    /* CONTENIDO */
    .contenido {
        padding: 0 1rem;
        width: 100%;
    }

    .header-contenido {
        width: 100%;
    }

    /* HEADER */
    .titulo-boton {
        padding: 1.5rem 1rem 0;
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }

    .titulo-boton h1 {
        font-size: 1.5rem;
    }

    .dropdown-toggle-user {
        width: 100%;
        max-width: 20rem;
    }

    /* HAMBURGUESA */
    .menu-toggle {
        display: flex;
        position: fixed;
        top: 1rem;
        right: 1rem;
        z-index: 1010;
        background:#105680;
        border:none;
        border-radius:.75rem;
        width:3rem;
        height:3rem;
        align-items:center;
        justify-content:center;
        cursor:pointer;
        box-shadow:0 2px 10px rgba(0,0,0,.15);
    }

    .menu-toggle span,
    .menu-toggle span::before,
    .menu-toggle span::after {
        display:block;
        width:1.5rem;
        height:2px;
        background:#fff;
        position:relative;
        transition:.3s;
        content:'';
    }

    .contenedores-nuevo-panel .contenedores input,
    .contenedores-nuevo-panel .contenedores select,
    .contenedores-nuevo-panel .contenedores button,
    .contenedores-nuevo-usuario .contenedores input,
    .contenedores-nuevo-usuario .contenedores select,
    .contenedores-nuevo-usuario .contenedores button,
    .contenedores-nuevo-invitado .contenedores input,
    .contenedores-nuevo-invitado .contenedores select,
    .contenedores-nuevo-invitado .contenedores button,
    .contenedores-nuevo-aviso .contenedores input,
    .contenedores-nuevo-aviso .contenedores select,
    .contenedores-nuevo-aviso .contenedores button,
    .contenedores-configuraciones .contenedores input,
    .contenedores-configuraciones .contenedores select,
    .contenedores-configuraciones .contenedores button,
    .contenedores-nfcs-locales .contenedores input[type="text"],
    .contenedores-nfcs-locales .contenedores select,
    .contenedores-nfcs-locales .contenedores button,
    .contenedores-nuevo-invitado .contenedores input,
    .contenedores-nuevo-invitado .contenedores select,
    .contenedores-nuevo-invitado .contenedores button {
        padding: 0.5rem;
        height: 2.7rem;
        margin: 0.75rem 0 1.25rem;
        font-size: 0.85rem;
        font-style: italic;
        border-radius: 0.5rem;
        border: none;
        background: #F0F0F0;
        color: #4b4949; 
    }


    .menu-toggle span::before { top:-6px; position:absolute;}
    .menu-toggle span::after  { top: 6px; position:absolute;}

    .menu-toggle.active span { background:transparent; }
    .menu-toggle.active span::before { top:0; transform:rotate(45deg);}
    .menu-toggle.active span::after  { top:0; transform:rotate(-45deg);}

    /* EXTENSIÓN */
    .extension {
        margin-top:2rem;
        padding:0;
        width:100%;
    }

    /* TABLAS */
    .contenedores-mis-paneles,
    .contenedores-movimientos,
    .contenedores-mis-avisos,
    .contenedores-mis-usuarios,
    .contenedores-mis-invitados {
        width:100%;
        padding:0;
        overflow-x:auto;
    }

    table {
        min-width:600px;
        margin:1rem 0;
    }

    .contenedor-tablas {
        overflow-x:auto;
        -webkit-overflow-scrolling:touch;
    }

    /* BUSCADORES */
    .seleccionar-buscar-input {
        flex-direction:column;
        gap:1rem;
    }

    .stats-box {
        max-width:100%;
    }

    /* FORMULARIOS — estructura */
    .contenedores-nuevo-panel,
    .contenedores-editar-panel,
    .contenedores-nuevo-usuario,
    .contenedores-nuevo-invitado,
    .contenedores-nuevo-aviso,
    .contenedores-configuraciones {
        flex-direction:column;
        gap:0;
    }

    .contenedor-inputs,
    .contenedor-inputs-paneles,
    .finalizacion-aviso {
        flex-direction:column;
        gap:0;
        height:auto;
    }

    #cargando {
        left:0 !important;
    }
}


/* ===== TABLETS SOLO ===== */
@media (min-width:768px) and (max-width:1049px){

    .contenedor-fila1,
    .contenedor-fila2,
    .contenedor-fila3{
        flex-direction:row;
        flex-wrap:wrap;
    }

    .contenedor-usuario,
    .contenedor-fila1 .contenedores,
    .contenedor-fila2 .contenedores,
    .contenedor-fila3 .contenedores{
        width:calc(50% - 1rem);
    }
}


@media (max-width:768px){

    /* Base estable */
    *, *::before, *::after{
        box-sizing:border-box;
    }

    body{
        overflow-x:hidden;
    }

    /* ===== CONTENEDOR CENTRAL GLOBAL ===== */
    .extension,
    .contenido,
    .contenedores-dashboard{

        display:flex;
        flex-direction:column;
        align-items:center;
    }

    /* ===== TARJETAS ===== */
    .contenedores,
    .contenedor-usuario,
    .contenedores-mis-paneles,
    .contenedores-movimientos,
    .contenedores-mis-avisos,
    .contenedores-mis-usuarios,
    .contenedores-mis-invitados,
    .contenedores-configuraciones,
    .contenedores-nuevo-panel,
    .contenedores-editar-panel,
    .contenedores-nuevo-usuario,
    .contenedores-nuevo-invitado,
    .contenedores-nuevo-aviso,
    .modal-contenedor{

        width:85%;
        max-width:85%;
        margin:0 auto;
    }

    /* ===== FILAS DASHBOARD ===== */
    .contenedor-fila1,
    .contenedor-fila2,
    .contenedor-fila3{

        width:100%;
        display:flex;
        flex-direction:column;
        align-items:center;
    }

    /* ===== INPUTS (FIX REAL) ===== */
    .contenedor-inputs input,
    .contenedor-inputs select,
    input,
    select{

        width:100%;
        max-width:100%;
    }

    /* ===== BOTONES ===== */
    button,
    .boton-guardar,
    .boton-eliminar,
    .boton-cancelar,
    .buscar,
    .generar-pdf,
    .eliminar{

        width:100%;
        margin-top:0.75rem;
    }

}


/* ===== MÓVIL PEQUEÑO ===== */
@media (max-width:480px){

    .titulo-boton h1{
        font-size:1.25rem;
    }

    table{
        font-size:.8rem;
    }

    td{
        padding:1rem .5rem;
    }

    .contenedores-nuevo-panel .contenedores,
    .contenedores-nuevo-usuario .contenedores,
    .contenedores-nuevo-aviso .contenedores{
        padding:1.5rem;
    }
}

@media (max-width:768px){

    /* ===== CONTENEDOR BOTONES ===== */
    .contenedores-botones{
        width:85%;
        max-width:85%;
        margin: 0 0 2.5rem;
        display:flex;
        flex-direction:column;
        align-items:stretch;
        padding:0;
        box-sizing:border-box;
    }

    /* ===== BOTONES DENTRO ===== */
    .contenedores-botones button{
        width:100%;
        max-width:100%;
        max-width:100%;
        margin:0.5rem 0;
    }

    /* ===== BOTONES INTERNOS (eliminar acceso/tag/etc) ===== */
    .contenedor-select-eliminar button,
    .contenedor-inputs-paneles button,
    .contenedor-contacto button{
        width:auto;
        max-width:100%;
    }

    /* ===== OCULTAR PRIMER BLOQUE ===== */
    .segunda-columna > .contenedores-botones:first-child{
        display:none;
    }

}


/* ===== PRINT ===== */
@media print{

    body *{ visibility:hidden; }

    .contenedores-movimientos,
    .contenedores-movimientos *{
        visibility:visible;
    }

    .contenedores-movimientos{
        position:absolute;
        left:0;
        top:0;
        width:100%;
    }

    .seleccionar-buscar-input,
    .stats-box,
    .th-segundo,
    #checkboxPrincipal,
    .fila-seleccionada,
    th:first-child,
    td:first-child{
        display:none !important;
    }

    .tabla-movimientos{
        width:100%;
        border-collapse:collapse;
    }

    .tabla-movimientos th{
        background:#105680 !important;
        color:#fff !important;
        -webkit-print-color-adjust:exact;
        print-color-adjust:exact;
    }

    .tabla-movimientos td img{
        width:40px;
        height:40px;
        border-radius:6px;
    }
}