.holiday {
    background-color: red !important;
    color: white !important;
    border-radius: 50%;
}

/* Tooltip (por si quieres estilos personalizados) */
.has-tooltip:hover {
    cursor: pointer;
    text-decoration: underline;
}

.filtro-seleccionado {

    -webkit-box-shadow: 0px 0px 6px 1px rgba(43,138,255,1);
    -moz-box-shadow: 0px 0px 6px 1px rgba(43,138,255,1);
    box-shadow: 0px 0px 6px 1px rgb(24, 255, 53);

    display: block;
    background-color: #b6ff9b;
    border-radius: 5px;
    margin: 1px;
    padding: 0 3px;
}

.tabla-configuracion-vista thead th {
    background-color: #eee;
    text-align: center;
}

.borde-gris{
    border:1px solid #dee2e6 !important;
}

.fondo-gris{background-color: #eef}
.fondo-anarajando{background-color: #fff4ee
}
.celda-filtro-utilizado{background-color: #c9ffc5 !important;}
.celda-filtro-no-utilizado{background-color: #f4f4f4 !important;}
.font-size-09rem{font-size: 0.9rem !important;}

div.pestania-listado li.nav-item a.active{
    color: #ff0000 !important;
    font-weight: bold;
}
.pointer{cursor:pointer;}

.error-validacion{
    border: 1px solid #ff6c79 !important;
    padding: 0.3rem;
    border-radius: 0.25rem;

}

.tabla-no-padding td {padding:0 !important;}
.tabla-padding-1 td {padding:1px !important;}
.tabla-padding-1-x td {padding:0 1px !important;}

.truncated-text {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.div-con-texto-truncado-cuadro-mando {
    font-size:0.8rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 350px;
}

.table-fixed {
    table-layout: fixed; /* Fija el ancho de las columnas */
    width: 100%;
}

.full-height {
    height: calc(100vh - 260px); /* Ajusta 200px según sea necesario */
    overflow-y: auto;
}

thead th{
    z-index: 3;
}

.sticky-col {
    position: -webkit-sticky;
    position: sticky;
    background-color: white;
    border:1px solid #dee2e6 !important;
    z-index: 2;
}

/*Tabla analítica RRHH*/

.tabla-analitica-rrhh thead th {
    position: sticky;
    top: 0;
    background: white;
    z-index: 5;
}

.tabla-analitica-rrhh {
    border-collapse: separate;
    border-spacing: 0;
}

.tabla-analitica-rrhh th,
.tabla-analitica-rrhh td {
    background-clip: padding-box;
}

/* sticky thead header general */
.tabla-analitica-rrhh thead {
    position: sticky;
    top: 0;
    z-index: 1;
}

/* sticky celdas del thead */
.tabla-analitica-rrhh th.sticky-col {
    position: sticky;
    top: 0;
    background: white;
    z-index: 4;
}

/* sticky celdas del tbody */
.tabla-analitica-rrhh td.sticky-col {
    position: sticky;
    background: white;
    z-index: 3;
}

/* Left offsets */
.tabla-analitica-rrhh th.sticky-col-1,
.tabla-analitica-rrhh td.sticky-col-1 { left: 0px; }
.tabla-analitica-rrhh th.sticky-col-2,
.tabla-analitica-rrhh td.sticky-col-2 { left: 200px; }
.tabla-analitica-rrhh th.sticky-col-3,
.tabla-analitica-rrhh td.sticky-col-3 { left: 280px; }
.tabla-analitica-rrhh th.sticky-col-4,
.tabla-analitica-rrhh td.sticky-col-4 { left: 360px; }
.tabla-analitica-rrhh th.sticky-col-5,
.tabla-analitica-rrhh td.sticky-col-5 { left: 442px; }
.tabla-analitica-rrhh th.sticky-col-6,
.tabla-analitica-rrhh td.sticky-col-6 { left: 540px; }


/***********************************************************************************************/
/* Fijar cabecera */
.tabla-analitica-rrhh thead th {
    position: sticky;
    top: 0;
    background: white;
    z-index: -10;
}

/* Fijar columnas: define posición sticky y desplazamiento a la izquierda acumulado */
.tabla-analitica-rrhh .col-sticky-1 {
    position: sticky;
    left: 0;
    background: white;
    z-index: 11;
}



/***********************************************************************************************/
/*Tabla coste proyecto*/
#tabla-coste-proyecto td:nth-child(-n+2),
#tabla-coste-proyecto th:nth-child(-n+3) {
    position: sticky;
    left: 0;
    background: white;
    z-index: 2;
}
#tabla-coste-proyecto td:nth-child(2),
#tabla-coste-proyecto th:nth-child(3) {
    left: 448px; /* Ajusta este valor al ancho de la primera columna */
    z-index: 2;
}

/* Sticky vertical para todas las celdas de thead */
#tabla-cuadro-mando thead tr td {
    position: sticky;
    top: 0;
    background: white;
    z-index: 3;
}

/* Sticky horizontal para las primeras 5 columnas */
#tabla-cuadro-mando td:nth-child(-n+5),
#tabla-cuadro-mando thead td:nth-child(-n+5) {
    position: sticky;
    background-color: white;
    z-index: 2;
}

/* Sticky en ambos ejes para thead + columnas 1-5 */
#tabla-cuadro-mando thead td:nth-child(1) {
    left: 0;
    top: 0;
    z-index: 5;
}
#tabla-cuadro-mando thead td:nth-child(2) {
    left: 350px;
    top: 0;
    z-index: 5;
}
#tabla-cuadro-mando thead td:nth-child(3) {
    left: 469px;
    top: 0;
    z-index: 5;
}
#tabla-cuadro-mando thead td:nth-child(4) {
    left: 568px;
    top: 0;
    z-index: 5;
}
#tabla-cuadro-mando thead td:nth-child(5) {
    left: 687px;
    top: 0;
    z-index: 5;
}

/* Sticky horizontal para tbody (solo columnas) */
#tabla-cuadro-mando tbody td:nth-child(1) {
    left: 0;
    z-index: 1;
}
#tabla-cuadro-mando tbody td:nth-child(2) {
    left: 350px;
    z-index: 1;
    width: 120px;
}
#tabla-cuadro-mando tbody td:nth-child(3) {
    left: 469px;
    z-index: 1;
    width: 100px;
}
#tabla-cuadro-mando tbody td:nth-child(4) {
    left: 568px;
    z-index: 1;
    width: 120px;
}
#tabla-cuadro-mando tbody td:nth-child(5) {
    left: 687px;
    z-index: 1;
    width: 100px;
}


/* Evita rarezas con sticky en tablas */
#tabla-balance-proyecto{
    border-collapse: separate;
    border-spacing: 0;
}

/* Anchos centralizados (ajústalos si cambian) */
:root{
    --sticky-col-1: 250px; /* Proyecto */
    --sticky-col-2: 120px; /* Concepto */
}

/* Cabecera ya es sticky por tu thead; aquí solo subimos capas en las intersecciones */
#tabla-balance-proyecto thead *{
    background: #fff;
    z-index: 4;
}

/* Columna 1 fija (tanto en thead como en tbody) */
#tabla-balance-proyecto .sticky-col-1{
    position: sticky;
    left: 0;
    min-width: var(--sticky-col-1);
    max-width: var(--sticky-col-1);
    background: #fff;
    z-index: 3;
    box-shadow: 2px 0 0 #e9ecef; /* sutil separador opcional */
}

/* Columna 2 fija (desplazada el ancho de la primera) */
#tabla-balance-proyecto .sticky-col-2{
    position: sticky;
    left: var(--sticky-col-1);
    min-width: var(--sticky-col-2);
    max-width: var(--sticky-col-2);
    background: #fff;
    z-index: 3;
    box-shadow: 2px 0 0 #e9ecef;
}

/* Si además es cabecera + columna fija, sube un poco más la capa */
#tabla-balance-proyecto thead .sticky-col-1,
#tabla-balance-proyecto thead .sticky-col-2{
    z-index: 6;
}

#head-configurar-presupuestos {
    position: sticky;
    top: 0;
    background: white;
    z-index: 2;
}

.fondo-celda-gris-claro{
    background-color: #f6faff !important;
}

.fondo-celda-verde{
    background-color: #e6ffe6 !important;
}
.fondo-celda-azul{
    background-color: #e6f1ff !important;
}

.tabla-costes {
    border-collapse: separate; /* O usa collapse si prefieres bordes combinados */
    border-spacing: 1px; /* Ajusta el espacio entre celdas */
    border: 1px solid #eee; /* Define un borde visible */
}

.tabla-costes th, .tabla-costes td {
    border: 1px solid #eee; /* Asegúrate de que las celdas también tengan bordes */
}

.tabla-costes th,
.tabla-costes td {
    white-space: nowrap; /* evita que el contenido se divida en varias líneas */
}

.tabla-costes th.sticky-col,
.tabla-costes td.sticky-col {
    position: sticky;
    left: 0;
    background: #ccc; /* o el color de fondo que uses */
    z-index: 2; /* asegura que estén encima del resto */
    width: 150px;
}

.tabla-costes th.sticky-col-2,
.tabla-costes td.sticky-col-2 {
    left: 200px; /* ajusta según el ancho de la primera columna */
    z-index: 3;
}

.tabla-costes th.sticky-col-3,
.tabla-costes td.sticky-col-3 {
    left: 281px; /* ajusta según el ancho acumulado */
    z-index: 4;
}

.tabla-costes th:first-child,
.tabla-costes td:first-child { z-index: 5; }

.form-control-xs {
    min-height: calc(1.2em + .2rem + calc(var(--bs-border-width) * 2));
    padding: .08rem .2rem;
    font-size: .85rem;
    border-radius: var(--bs-border-radius-sm);
}

.div-tabla-responsive-coste-proyecto{
    max-height: 80vh; overflow-y: auto;
}
#tabla-costes-proyecto{
    font-size: 0.9rem !important; position: relative;
}

/*
##### TABLA ANALÍTICA RRHH EXTENDIDA #####
*/

/* Contenedor con scroll */
.div-tabla-scroll{
    position: relative;
    overflow-x: auto;
    overflow-y: auto;
    max-height: calc(100vh - 200px);
}

/* === Tabla principal === */
.tabla-analitica-rrhh-extendida{
    /* Vars específicas */
    --sticky-col-1-width: 250px;
    --thead-r1-height: 27px; /* ajusta a tu alto real */
    --z-row1: 40;            /* z-index fila 1 cabecera */
    --z-row2: 39;            /* z-index fila 2 cabecera */
    --z-col:  38;            /* z-index 1ª columna */
    --z-corner: 50;          /* z-index celdas esquina (top+left) */

    border-collapse: separate;
    border-spacing: 0;
    width: max-content;
    position: relative;      /* stacking context propio */
}

/* ====== CABECERA PEGADA (solo thead DIRECTO de la tabla principal) ====== */

/* Fila 1 del thead (años) */
.tabla-analitica-rrhh-extendida > thead > tr:nth-child(1) > *{
    position: sticky;
    top: 0;
    background: #fff;
    z-index: var(--z-row1);
}

/* Fila 2 del thead (meses + "Profesional") */
.tabla-analitica-rrhh-extendida > thead > tr:nth-child(2) > *{
    position: sticky;
    top: var(--thead-r1-height);
    background: #fff;
    z-index: var(--z-row2);
}

/* Esquinas (celdas sticky de la 1ª columna dentro del thead) por encima de todo */
.tabla-analitica-rrhh-extendida > thead > tr:nth-child(1) > .sticky-col,
.tabla-analitica-rrhh-extendida > thead > tr:nth-child(2) > .sticky-col{
    z-index: var(--z-corner);
}

/* ====== PRIMERA COLUMNA PEGADA (thead y tbody) ====== */
.tabla-analitica-rrhh-extendida .sticky-col{
    position: sticky;
    left: 0;
    background: #fff;
    z-index: var(--z-col);
    width: var(--sticky-col-1-width);
    min-width: var(--sticky-col-1-width);
    max-width: var(--sticky-col-1-width);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    box-shadow: 2px 0 0 rgba(0,0,0,0.05);
}

/* ====== TABLAS ANIDADAS (no pegadas, y debajo del header) ====== */
.tabla-analitica-rrhh-extendida tbody td,
.tabla-analitica-rrhh-extendida tbody td *{
    position: relative;
    z-index: 0; /* asegura ir por debajo de la cabecera */
}

.tabla-analitica-rrhh-extendida tbody td > table{
    width: 100%;
    border-collapse: collapse;
}

/* Por si alguna regla global intentara hacer sticky en thead internos */
.tabla-analitica-rrhh-extendida tbody td > table thead *{
    position: static !important;
    top: auto !important;
    z-index: auto !important;
}

/* Bordes opcionales */
.tabla-analitica-rrhh-extendida th,
.tabla-analitica-rrhh-extendida td{
    border: 1px solid #ddd;
}


/*
##### FIN TABLA ANALÍTICA RRHH EXTENDIDA #####
*/

/* Estilos para Select2 y hacer que los selectores ocupen el 100% de su ancho */
.select2-container {
    width: 100% !important;
}
.select2-selection {
    width: 100% !important;
}

.livewire-loader {
    position: fixed;
    inset: 0; /* Cubre todo el viewport, reemplaza top/left/width/height */
    background-color: rgba(255, 255, 255, 0.7);

    display: flex;
    justify-content: center;
    align-items: center;

    z-index: 99999;
}

/* Estilos para el spinner de Bootstrap */
.livewire-loader .spinner-border {
    width: 4rem;  /* Tamaño del spinner */
    height: 4rem; /* Tamaño del spinner */
    color: #007bff; /* Color del spinner (ej. azul primario de Bootstrap) */

    position: fixed;
    left: 50%;
    top: 50%;

    /* --- CAMBIO CLAVE ADICIONAL AQUÍ --- */
    margin: auto; /* Asegura que el spinner se centre dentro del contenedor flex */
}

.fondo-celda-success{background-color: #d4edda !important;}
.fondo-celda-warning{background-color: #fff3cd !important;}
.fondo-celda-danger{background-color: #f8d7da !important;}
.fondo-celda-primary{background-color: #e2f1ff !important;}

.placeholder-claro::placeholder {
    color: #e0e0e0; /* gris muy claro */
    opacity: 0.8;
}

.highlight {
    background-color: yellow
}

.borde-derecho-separador{border-right:1px solid #ccc;}
.borde-inferior-separador{border-bottom:1px solid #ccc;}


.h-80{height: 80% !important;}
.h-90{height: 90% !important;}

.w-5{width: 5% !important;}
.w-10{width: 10% !important;}
.w-15{width: 15% !important;}
.w-20{width: 20% !important;}
.w-25{width: 25% !important;}
.w-30{width: 30% !important;}
.w-35{width: 35% !important;}
.w-40{width: 40% !important;}
.w-45{width: 45% !important;}
.w-50{width: 50% !important;}
.w-60{width: 60% !important;}
.w-70{width: 70% !important;}
.w-80{width: 80% !important;}
.w-90{width: 90% !important;}

.w-60px{width: 60px !important;}
.w-70px{width: 70px !important;}
.w-75px{width: 75px !important;}
.w-80px{width: 80px !important;}
.w-100px{width: 100px !important;}
.w-200px{width: 200px !important;}