/* ==========================================================================
  CONEXION INMOBILIARIA INTRANET - CONSOLIDATED STYLES
   ========================================================================== */


/* --- lOGIN--- */


/* Contenedor principal con imagen de fondo inmobiliaria */
.login-page-wrapper {
    background: url('../img/fondo-login-intra.jpg') no-repeat center center;
    background-size: cover;
    position: relative;
    min-height: 100vh;
}

/* Capa oscura para dar legibilidad */
.login-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 0, 0, 0.75);
    z-index: 1;
}

.login-card {
    position: relative;
    z-index: 2; 
    padding: 1rem; 
    width: 100%;
    max-width: 450px;
}

.login-card p {

    font-size: 1.3em;

}

.login-logo {
    max-width: 200px;
    height: auto;
}

/* Personalización de los campos de Ultimate Member */
.um-custom-container .um-field-label {
    color: #e99800 !important; 
    font-weight: 500 !important;
    font-size: 0.9rem !important;
}

.um-custom-container input[type=text], 
.um-custom-container input[type=password] {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #fff !important;
    border-radius: 10px !important;
    padding: 12px 15px !important;
}

.um-custom-container input:focus {
    border-color: #cbb27c !important;
    background: rgba(255, 255, 255, 0.1) !important;
}

/* Botón de Acceso */
.um-custom-container .um-button {
    background-color: #e99800 !important;
    color: #fff !important;
    border-radius: 10px !important;
    padding: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    transition: all 0.3s ease !important;
}

.um-custom-container .um-button:hover {
    color: #000!important;
    background-color: #fff !important;
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(203, 178, 124, 0.3) !important;
}



/* intranet */


.logo-img_ini {
  
    margin: 0 auto;
    height: auto;
}



.logo-img_ini  { 
   width: 250px;
   height: auto;
   margin: 5px auto;
   display: block;
 }

 .logo-img {

    display: none;
 }



.intranet-ini .bg-dark {

    background-color: transparent!important;
}

h2.wpdt-c {
    
    display: none;
}


.accordion-button i { font-size:0.7em; margin-right:20px; color: #fb9f00; }

.accordion-body a { text-align:left;  }
.accordion-body a i {font-size:1.2em; margin-right:15px; color: #fff; }


.boton-atras a, .boton-atras span {
    color: white;  /* Cambia el color del texto a blanco */
    font-size: 14px;
}

.boton-atras span { font-size:12px; margin: 0 5px; }
.boton-atras a i { font-size:12px; margin: 0 5px 0 0; }

.boton-atras a.logout { color:orangered; }

.div-btn a {
    display: block;
    padding: 0.7em;
    border-bottom: 1px solid #fff;
    font-weight: 500;
}

.div-btn a i {  }

.um-page-login .intranet-ini::before {
    
}

.cont_intranet { padding:0; }
.cont_intranet  h1 { text-align: center; margin-bottom: 0.6em; color: #212529; font-weight: 500!important;}
.cont_intranet  h2 { text-align: center; margin-bottom: 0.6em; color: #fff; font-size:1.6em;  font-weight: 400!important; }
.cont_intranet  h3 { 
    text-align: center;
     margin: 1em auto 2em auto; 
     color:#fff;
     text-shadow: 1px 1px 6px rgba(5, 21, 39, 1);  
     font-size:1.4em;
     font-weight: 300;
    }

.intranet-ini {
    
    background-image: url('../img/fondo-intranet2.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed; /* Fija el fondo para que no cambie al hacer scroll */

}

.intranet-ini .head-int {
    background-color: transparent!important;
    
}

.img-bancos {
    margin: 3em auto;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(5px); /* Efecto cristal */
    border: 1px solid rgba(255, 255, 255, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2em 1em;
    border-radius: 10px;
    width: 85%;
}
.img-bancos img {
 
}
.intranet-ini .footer {

     background-color: transparent!important;
    
}

.site-intranet { 
   color: #FFF;
 }
/* Forzamos a que la intranet siempre ocupe todo el alto de la pantalla */
.site-intranet {
    min-height: 100vh; /* 100% del Viewport Height */
    display: flex;
    flex-direction: column;
    /* Si quieres que el listado se centre verticalmente cuando hay pocos items: */
    justify-content: flex-start; 
    padding-bottom: 50px; /* Espacio extra al final */
}

.site-intranet h1 { 

    font-size: 1.8em;

}


.single-listado-view h2 {

    font-size: 2em;
}

.single-listado-view h4 {

   color: #fff!important;
}


/* Aseguramos que el fondo cubra todo el contenedor */
.intranet-ini {
    min-height: 100vh;
    background-size: cover;
    background-attachment: fixed;
    background-position: center;
}

/* Botones Principales Dorados */
.btn_inicio_intranet {
    /* Gradiente para que se vea metálico/llamativo */
    background: linear-gradient(145deg, #e99800, #ffc107); 
    color: #fff !important;
    border: none;
    border-radius: 12px;
    padding: 1.2rem 2rem; /* Más amplios */
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-decoration: none;
    display: inline-block;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    
    /* Sombra para dar profundidad */
    box-shadow: 0 6px 15px rgba(233, 152, 0, 0.3);
}

.btn_inicio_intranet:hover {
    color: #000 !important;
    background: #fff;
    transform: translateY(-5px) scale(1.03); /* Efecto de levitación */
    box-shadow: 0 12px 25px rgba(255, 255, 255, 0.2);
}

/* Botón Logout (Más sutil pero elegante) */
.btn_logout_intranet {
    background: rgba(255, 69, 0, 0.1); /* Fondo muy tenue rojo */
    border: 2px solid orangered;
    border-radius: 12px;
    color: orangered !important;
    padding: 1.2rem 2rem;
    font-weight: 800;
    text-transform: uppercase;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s ease;
}

.btn_logout_intranet:hover {
    background-color: orangered;
    color: #fff !important;
    transform: translateY(-3px);
    box-shadow: 0 6px 15px rgba(255, 69, 0, 0.3);
}

/* Espaciado de íconos en botones */
.btn_inicio_intranet i, 
.btn_logout_intranet i {
    margin-right: 10px; /* Separa el ícono del texto */
    font-size: 1.1em;   /* Un poquito más grande que el texto */
    vertical-align: middle;
}

/* Efecto opcional: Que el ícono se mueva un poco al hacer hover */
.btn_inicio_intranet:hover i {
    transform: scale(1.2);
    transition: transform 0.3s ease;
}

/* Ajuste para el saludo que salía vacío en tu captura */
.welcome-title {
    font-size: 2.5rem;
    font-weight: 700;
    color: #fff;
    text-shadow: 2px 2px 10px rgba(0,0,0,0.5);
    margin-bottom: 0;
}

/* Header de la Intranet */
#masthead .navbar {
    z-index: 10;
}

.btn-header-logout {
    border: 1px solid rgba(255, 69, 0, 0.4);
    padding: 5px 12px;
    border-radius: 20px;
    transition: all 0.3s ease;
}

.btn-header-logout:hover {
    background: orangered;
    color: #fff !important;
    opacity: 1;
}

/* Ajuste para el botón_atras que viene de functions.php */
.boton-atras a {
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    padding: 5px 15px;
    border-radius: 20px;
    color: #fff !important;
    text-decoration: none;
    font-size: 0.9rem;
}

/* Contenedor de botones en el header */
.header-btn-wrapper .boton-atras a {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: #fff !important;
    padding: 6px 15px;
    border-radius: 20px;
    font-size: 0.85rem;
    text-decoration: none;
    transition: all 0.3s ease;
}

.header-btn-wrapper .boton-atras a:hover {
    background: rgba(255, 255, 255, 0.2);
    border-color: #fff;
}

/* Botón Salir unificado */
.btn-header-logout {
    background: rgba(255, 69, 0, 0.1);
    border: 1px solid rgba(255, 69, 0, 0.5);
    color: #fff !important;
    padding: 6px 15px;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s ease;
}

.btn-header-logout:hover {
    background: orangered;
    border-color: orangered;
    color: #fff !important;
    box-shadow: 0 0 10px rgba(255, 69, 0, 0.4);
}

/* El separador "|" */
/* Contenedor principal de la barra */
.navbar-intranet {
    background: rgba(255, 255, 255, 0.1); /* Efecto transparente */
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 50px;
    padding: 8px 25px;
    margin-bottom: 30px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

/* Caja de información del usuario */
.user-info-box {
    color: #fff;
    font-size: 14px;
}

.user-info-box i {
    color: #fbc02d;
    font-size: 18px;
    margin-right: 10px;
}

.user-name-text {
    font-weight: 600;
    text-transform: capitalize;
}

/* Caja de botones a la derecha */
.nav-actions-box {
    gap: 5px;
}

.nav-link-item {
    color: rgba(255, 255, 255, 0.8) !important;
    text-decoration: none !important;
    font-size: 12px;
    font-weight: 700;
    padding: 5px 10px;
    border-radius: 20px;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 5px;
}

.nav-link-item:hover {
    color: #fbc02d !important;
    background: rgba(255, 255, 255, 0.05);
}

/* Estilo especial para Salir */
.logout-link {
    background: rgba(220, 53, 69, 0.2);
    color: #ff6b6b !important;
}

.logout-link:hover {
    background: #dc3545;
    color: #fff !important;
}

/* Ajuste para el bloque del nombre del usuario junto al logout */
.user-pill {
    color: #fbc02d; /* El dorado que usamos */
    font-size: 13px;
    font-weight: 600;
    padding: 5px 12px;
    background: rgba(251, 192, 45, 0.05); /* Un toque de luz dorada de fondo */
    border-radius: 20px;
    border: 1px solid rgba(251, 192, 45, 0.1);
    margin-left: 10px;
}

.nav-user-right {
    gap: 8px; /* Espacio entre el nombre y el divisor/logout */
}

/* El divisor se verá más sutil */
.nav-divider {
    color: rgba(255, 255, 255, 0.15);
    font-weight: 300;
    margin: 0 5px;
}

/* Estilo para los botones de la izquierda */
.nav-actions-left {
    gap: 10px;
}

/* Para que en móviles no se rompa */
@media (max-width: 768px) {
    .navbar-intranet {
        flex-direction: column-reverse; /* El usuario arriba, navegación abajo */
        gap: 15px;
        border-radius: 20px;
    }
}
/* Divisores verticales */
.nav-divider {
    color: rgba(255, 255, 255, 0.2);
    font-weight: 100;
    margin: 0 5px;
}

/* Ajuste para móviles */
@media (max-width: 768px) {
    .navbar-intranet {
        flex-direction: column;
        border-radius: 15px;
        gap: 10px;
        padding: 15px;
    }
}

/* Contenedor del acordeón con efecto cristal */
.col-md-8 .accordion {
    background: rgba(255, 255, 255, 0.05) !important;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 15px;
    padding: 20px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
}

/* Ajuste del título para que no quede pegado arriba */
.listados h1 {
    margin-top: 40px;
    margin-bottom: 40px;
}

.restriccion-horaria {
    max-width: 800px;
    margin: 100px auto;
    text-align: center;
    background: rgba(255, 255, 255, 0.5); /* Blanco semi-transparente */
    border: 2px solid #ccc; /* Gris claro */
    padding: 40px;
    border-radius: 12px;
    font-family: sans-serif;
    box-shadow: 0 0 20px rgba(0,0,0,0.1); /* Sombra sutil */
    color: #333; /* Texto en gris oscuro */
}

.restriccion-horaria .icono-alerta {
    font-size: 100px;
    margin-bottom: 20px;
    display: block;
}

.restriccion-horaria p {
    font-size: 24px;
    line-height: 1.6;
    margin: 0;
}


.restriccion-horaria .btn-logout {
    display: inline-block;
    margin-top: 30px;
    padding: 12px 24px;
    background-color: #333;
    color: white;
    text-decoration: none;
    font-size: 18px;
    border-radius: 6px;
    transition: background-color 0.3s ease;
}

.restriccion-horaria .btn-logout:hover {
    background-color: #555;
}



/* Estilos generales del acordeón */
.accordion {
  background-color: transparent !important;
}

/* Quitar el fondo de cada item del acordeón */
.accordion-item {
  background-color: transparent !important;
  border: none;
}

/* Estilos del botón del acordeón */
.accordion-button {
  background-color: transparent !important;
  color: white !important;
  font-weight: bold;
  border-bottom: 1px solid #fff;
  box-shadow: none;
}

/* Cambiar el color del icono en el botón */
.accordion-button i {
  
}

/* Remover el fondo del botón al hacer hover o estar activo */
.accordion-button:not(.collapsed) {
  background-color: rgba(255, 255, 255, 0.1) !important;
  color: white !important;
}

/* Eliminar el borde del acordeón abierto */
.accordion-button:focus {
  box-shadow: none;
}

/* Estilos del cuerpo del acordeón */
.accordion-body {
  background-color: transparent !important;
  color: white;
}

/* Estilos para los enlaces dentro del acordeón */
.accordion-body a {
  color: #f0c040;
  text-decoration: none;
  font-weight: bold;
  display: block;
  
}

/* Cambiar color de los enlaces al pasar el mouse */
.accordion-body a:hover {
  color: #fff;
  text-decoration: none;
}

/* Estilos de los íconos dentro del body */
.accordion-body i {

}

.accordion-button::after {
  
}

/* --- Flechas de Acordeón Estilizadas --- */

/* 1. Flecha en Dorado (Estado Cerrado) */
.site-intranet .accordion-button::after {
    background-color: transparent !important; /* Quitamos el fondo cuadrado */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23e99800'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
    background-size: 1.25rem;
    transition: transform 0.3s ease-in-out;
}

/* 2. Flecha en Blanco (Estado Abierto) */
.site-intranet .accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;
}

/* 3. Ajuste de la línea blanca del acordeón (opcional) */
.site-intranet .accordion-button {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2) !important;
}

/* Ocultar el primer logo en la página de intranet */
.page-template-page-intranet .logo-img {
    display: none;
}

/* Mostrar el segundo logo solo en la página de intranet */
.page-template-page-intranet .logo-img_ini {
    display: block;
}

/* Asegurar que el primer logo se vea en otras páginas */
.logo-img {
    display: block;
}

/* Ocultar el segundo logo en otras páginas */
.logo-img_ini {
    display: none;
}

/* Contenedor de la tabla con efecto cristal */
.table-container-glass {
    background: rgba(255, 255, 255, 0.02);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 15px;
    padding: 20px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
    overflow-x: auto; /* Importante para móviles */
}

/* Personalización de wpDataTables */

/* 1. Encabezado de la tabla (Header) */
.wpdt-c .wpDataTablesWrapper table.wpDataTable thead th {
    background-color: rgba(233, 152, 0, 0.9) !important; /* Dorado */
    color: #000 !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    border: none !important;
    padding: 15px !important;
}

/* 2. Filas de la tabla */
.wpdt-c .wpDataTablesWrapper table.wpDataTable tr td {
    background-color: rgba(255, 255, 255, 0.05) !important;
    color: #fff !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    padding: 12px !important;
}

/* 3. Filas alternas (Cebra) */
.wpdt-c .wpDataTablesWrapper table.wpDataTable tr.odd td {
    background-color: rgba(255, 255, 255, 0.02) !important;
}

/* 4. Hover en filas */
.wpdt-c .wpDataTablesWrapper table.wpDataTable tr:hover td {
    background-color: rgba(233, 152, 0, 0.15) !important; /* Brillo dorado tenue */
    transition: background 0.3s ease;
}

/* 5. Buscador y paginación en blanco */
.wpdt-c .wpDataTablesWrapper .dataTables_filter label,
.wpdt-c .wpDataTablesWrapper .dataTables_length label,
.wpdt-c .wpDataTablesWrapper .dataTables_info {
    color: #fff !important;
}

.wpdt-c .wpDataTablesWrapper .dataTables_filter input {
    background: rgba(255, 255, 255, 0.1) !important;
    color: #fff !important;
    border-radius: 5px;
    border: 1px solid rgba(255, 255, 255, 0.3);
}

/* --- Ajustes de Lectura para wpDataTables --- */

/* 1. Reducir el tamaño de la fuente en toda la tabla */
.wpdt-c .wpDataTablesWrapper table.wpDataTable {
    font-size: 12px !important; /* Un tamaño de 12px o 13px suele ser el "sweet spot" para carteras */
}

/* 2. Forzar que el texto de las celdas NO se corte y haga salto de línea */
.wpdt-c .wpDataTablesWrapper table.wpDataTable td {
    white-space: normal !important;   /* Permite que el texto baje al siguiente renglón */
    line-height: 1.4 !important;      /* Da un poco de aire entre líneas de texto */
    vertical-align: middle !important; /* Centra el contenido verticalmente */
    word-break: break-word !important; /* Rompe palabras largas si es necesario */
}

/* 3. Ajuste específico para encabezados */
.wpdt-c .wpDataTablesWrapper table.wpDataTable thead th {
    font-size: 11px !important; /* Títulos un poco más pequeños para que no se amontonen */
    white-space: normal !important;
    vertical-align: bottom !important;
}


/* Contenedor de Galería con efecto Glassmorphism */
.gallery-container-glass {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(15px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 20px;
    padding: 30px;
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.3);
}

/* Ajuste para que las imágenes de Envira se vean mejor */
.envira-gallery-public {
    margin: 0 auto !important;
}

.envira-gallery-item img {
    border-radius: 10px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border: 2px solid transparent;
}

.envira-gallery-item img:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(233, 152, 0, 0.4);
    border-color: #e99800; /* Dorado en hover */
}

/* Estilo para los títulos internos (como el de "Logotipos varios colores") */
.gallery-container-glass h2, 
.gallery-container-glass h3 {
    color: #e99800 !important;
    font-size: 1.5rem;
    margin-top: 2rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid rgba(233, 152, 0, 0.3);
    padding-bottom: 10px;
}

  @media (max-width:560px) {

.wpDataTablesWrapper table.wpDataTable {

    width: auto!important;

}

.wpdt-c .wpDataTablesWrapper table.wpDataTable td {

word-break: keep-all!important;

}

}