@media screen and (min-width: 640px) {
    .hideonlargescreen {
        display: none !important;
    }

    .label-text {
        font-weight: bold;
		display: flex !important;
		flex-wrap: wrap !important;
		align-content: center !important;
		justify-content: end !important
        
    }
}

@media screen and (max-width: 640px) {
    .hideonsmallscreen {
        display: none !important;
    }

    .label-text {
        font-weight: bold;
		display: flex !important;
		flex-wrap: wrap !important;
		align-content: center !important;
		justify-content: end !important
    }
}

/* Background de pantalla completa */
html, body {
    background: url("/javax.faces.resource/images/fondogris.png.xhtml?ln=default") no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    font-family: Verdana, sans-serif;
    font-size: 12px;
    line-height: 1.5;
}

.ui-widget .styleButton {
	font-size: 1.2em;
    color: #1165A5;
    border-radius: 20px;
}


.ui-widget .styleBoletinButton {
    font-size: 1.1em;
    color: #1165A5 !important;
    background-color: #f2f2f2 !important; /* gris claro */
    border: 1px solid #d0d0d0 !important; /* borde gris suave */
    border-radius: 20px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); /* sombra sutil */
    transition: all 0.2s ease-in-out;
    padding: 6px 16px;
    cursor: pointer;
}

.ui-widget .styleBoletinButton:hover {
    background-color: #e6e6e6 !important; /* un poco más oscuro al hover */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15); /* leve aumento de sombra */
}


.mostrarButton {
    color: #1165A5;
    border-radius: 20px;
}

.alignTop {
    vertical-align: top;
}

.contenedor-principal.ui-panel.ui-widget {
    margin: 5px;
    background-color: #eeeeee;
}

.contenedor-secundario {
    margin: 10px;
}

/* FORMATO GENERAL */
.centered {
    display: block;
    margin: auto;
}

.centered-margin {
    margin: auto;
}

.centered-block {
    display: block;
    margin: auto;
}

.centered-text {
    display: block;
    text-align: center;
}

.right-text {
    display: block;
    text-align: right;
}

.left-text {
    display: block;
    text-align: left;
}

.bold-text {
    font-weight: bold;
}

.borderlessgrid.ui-panelgrid > * > tr, .borderlessgrid.ui-panelgrid .ui-panelgrid-cell {
    border: none;
    background: transparent;
}

.marginlessgrid.ui-panelgrid > * > tr, .marginlessgrid.ui-panelgrid .ui-panelgrid-cell {
    border: none;
    margin: 0;
    padding: 0;
}

.borderlesspanel.ui-panel {
    border: none;
}

.marginlesspanel.ui-panel {
    border: none;
    margin: 0;
    padding: 0;
}

.ui-panel .ui-panel-content {
    padding: 1em 1em;
}

.panel-secundario {
	width: 98%;
	margin: 0 auto;
	margin-bottom: 10px;
}

/* FORMATO DE TEXTO */
.containertitle {
    font-size: 22px !important;
    display: block;
    padding: 5px;
    padding-left: 10px;
}

.containersubtitle {
    font-size: 18px !important;
    display: block;
    padding: 5px;
}

.containerpaneltitle {
    font-size: 16px !important;
    display: block;
    padding: 5px;
}

.container {
    font-size: 18px !important;
    display: block;
    padding: 5px;
}


.w-10-5 {
    flex: 0 0 87.5%; /* (10.5 / 12) * 100 */
    max-width: 87.5%;
}

.w-1-5 {
    flex: 0 0 12.5%; /* (1.5 / 12) * 100 */
    max-width: 12.5%;
}

.w-10-3 {
    flex: 0 0 85.833333333%;
    max-width: 85.833333333%;
}

.w-1-7 {
    flex: 0 0 14.16666666%;
    max-width: 14.16666666%;
}

/* Definición de anchos responsivos */
@media screen and (min-width: 1920px) {
    /* Pantallas grandes - menú un poco más ancho */
    .w-1-7 {
        flex: 0 0 16%;
        max-width: 16%;
    }

    .w-10-3 {
        flex: 0 0 84%;
        max-width: 84%;
    }
}

@media screen and (min-width: 1280px) and (max-width: 1919px) {
    /* Pantallas medianas - tamaño estándar */
    .w-1-7 {
        flex: 0 0 14.16666666%;
        max-width: 14.16666666%;
    }

    .w-10-3 {
        flex: 0 0 85.833333333%;
        max-width: 85.833333333%;
    }
}

@media screen and (max-width: 1279px) {
    /* Pantallas pequeñas - menú un poco más estrecho */
    .w-1-7 {
        flex: 0 0 18%;
        max-width: 18%;
    }

    .w-10-3 {
        flex: 0 0 82%;
        max-width: 82%;
    }
}



/* DATATABLE */

/* bordes impares en tablas de color blanco. */
.ui-datatable-odd {
    background: #ffffff;
}

/* PANEL GRID */
.ui-panelgrid td, .ui-panelgrid tr {
    background: transparent;
    border-style: none !important
}

/* SECCIONES ESPECIFICAS */

.pageFooter {
    background: #1165A5;
    border-top: 1px solid #d9e0e3; /* Una línea clara muy fina arriba */
}

.footerText {
	color: white;
	display: block;
}

/* header del layout principal */
.pageHeader {
    width: 100%;
    background: #1165A5;
    color: #eeeeee;
    padding: 0px;
    height: 52px;
}

html .pageHeader .mainMenuColumn {
    padding: 0;

}

html .pageHeader .mainMenuLogo {
    padding: 0;
    width: 215px;
    background-color: #222222;
}

.ui-datatable .operaciones {
    width: auto;
    margin: auto;
}

.ui-datatable .operacionesPanelGrid {
    width: inherit;
    margin: auto;
}

.operacionesPanelGrid.ui-panelgrid > * > tr, .operacionesPanelGrid.ui-panelgrid .ui-panelgrid-cell {
    padding: 2px 4px;
}

a.ui-commandlink {
	text-decoration: none;
}

div.divTableNovedades table.tableNovedades td div {
    max-height: 80px !important;
    overflow-y: auto !important;
}

.topTableCells {
    display: table-cell;
    vertical-align: top;
}

/* Overlay modals centrados  */
.centeredFixed {
    position: fixed !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
}

@media (max-width: 768px) {
    .w-full {
        width: 100% !important;
    }
}

/* Elimina borde y fondo del contenido del overlay */
.ui-overlaypanel.centeredFixed {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.ui-overlaypanel.centeredFixed .ui-overlaypanel-content {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}


div.panelFlotante {
    position: absolute;
    z-index: 99;
}

div.ui-dialog {
    position: absolute;
}

/* GLOBAL THEME OVERRIDES */
/* Achicamos el padding de los titulos de dialogos */
.ui-dialog .ui-dialog-titlebar {
    padding: .2em .4em .2em 1em;
}

/* Quitamos el margen en los titulos, con el padding alcanza */
.ui-dialog .ui-dialog-title {
    margin: 0;
}

/* Achicamos la letra de los input fields */
.ui-inputfield, .ui-widget-content .ui-inputfield, .ui-widget-header .ui-inputfield {
    /*font-size: 10px;*/
    font-weight: normal;
}

.ui-state-default, .ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
    /*font-size: 12px;*/
    font-weight: normal;
    margin-top: 0px;
}

/* Quitamos padding de los elementos del header de los tabs */
.ui-tabs .ui-tabs-nav li {
    padding: 0;
}

/* Aseguramos que el font-size de las tabs no se achique */
.ui-tabs .ui-tabs-nav li a {
    /*font-size: 12px;*/

}

/* Quitamos el padding de los tab view */
.ui-tabs {
    padding: 0;
}

.ui-tabs .ui-tabs-panel {
    padding: 0;
}

/* Quitamos padding del header de los tabs */
.ui-tabs.ui-tabs-top > .ui-tabs-nav {
    padding: 0;
}

.ui-panel.ui-widget {
    padding: 10px;
    border-radius: 20px;
}

/* Achicamos el padding de los panels */
.ui-panel .ui-panel-content {
    padding: 5px;
}

/* Quitamos el scroll de los dialogos con la class disable-scroll, no se puede cambiar inline por eso esta class */
.disable-scroll .ui-dialog-content {
    overflow: hidden !important;
}

.disabled-link {
    pointer-events: none;
    opacity: 0.5;
    cursor: default;
}

/* Achicamos la letra de los combo box */
.ui-selectcheckboxmenu-panel .ui-selectcheckboxmenu-list-item label {
    /*font-size: 12px;*/

}

/* Quitamos el highlight de los elementos seleccionados en tablas o arboles */
.ui-widget-content .no-highlight .ui-state-highlight, .ui-widget-header .no-highlight .ui-state-highlight {
    background: #fcfdfd;
    border-color: #a6c9e2;
}

.ui-state-highlight .no-highlight {
    background: #fcfdfd;
    border-color: #a6c9e2;
}

.ui-widget-content.ui-datatable-even.ui-datatable-selectable,
.ui-widget-content.ui-datatable-odd.ui-datatable-selectable {
    background: #fcfdfd;
    border-color: #a6c9e2;
}


.filtros-panel {
    display: flex;
    flex-wrap: wrap;      /* permite que bajen de línea */
    justify-content: center; /* centra horizontalmente */
    gap: 1rem;            /* espacio entre filtros */
}



/*******************************************************************************/

/*.ui-commandlink.ui-widget.fa.fa-globe.global-search,*/
/*.fa.fa-globe.global-search {*/
/*    text-decoration: none;*/
/*    font-size: 16px;*/
/*    margin-right: 5px;*/
/*}*/

/* Achicamos el padding left de los elementos del arbol para ahorrar espacio horizontal */
/*.ui-tree .ui-treenode-children {*/
/*    padding-left: 2px;*/
/*}*/

/*.ui-commandlink .ui-widget .fa .global-search,*/
/*.fa .global-search {*/
/*    margin-left: 5px;*/
/*    margin-right: 5px;*/
/*    text-decoration: none;*/
/*    font-size: 16px;*/
/*}*/

/*.ui-tree.ui-widget.ui-widget-content.disable-scroll ul {*/
/*    overflow: unset;*/
/*}*/

/* Formularios de downstream y upstream */
.FormTable input {
    width: 100px;
    text-align: right;
}

.FormTable td {
    width: 100px;
}

.FormMonthColumn input {
    width: 50px;
    text-align: center;
}

.FormYearColumn input {
    width: 50px;
    text-align: center;
}

.FormMonthColumn td {
    width: 50px;
}

.FormYearColumn td {
    width: 50px;
}

/* Iconos de edicion */
.ui-datatable table tbody tr td .ui-row-editor .ui-icon-pencil {
    background: none !important;
    display: inline-block;
    font: normal normal normal 16px/1 FontAwesome;
    font-size: 16px;
    font-size: inherit;
    text-rendering: auto;
    text-indent: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-right: 5px;
}

.ui-datatable table tbody tr td .ui-row-editor .ui-icon-pencil:before {
    content: "\f044";
}

.ui-datatable table tbody tr td .ui-row-editor .ui-icon-check {
    background: none !important;
    display: inline-block;
    font: normal normal normal 16px/1 FontAwesome;
    font-size: 16px;
    font-size: inherit;
    text-rendering: auto;
    text-indent: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-right: 5px;
}

.ui-datatable table tbody tr td .ui-row-editor .ui-icon-check:before {
    content: "\f058";
}

.ui-datatable table tbody tr td .ui-row-editor .ui-icon-close {
    background: none !important;
    display: inline-block;
    font: normal normal normal 16px/1 FontAwesome;
    font-size: 16px;
    font-size: inherit;
    text-rendering: auto;
    text-indent: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-right: 5px;
}

.ui-datatable table tbody tr td .ui-row-editor .ui-icon-close:before {
    content: "\f057";
}

.ui-panelgrid-content {
    align-items: center;
}

.ui-datatable-odd {
    background: none repeat scroll 0 0 #F2F5F9;
}

.align-top-panel td {
    vertical-align: top;
}

.contenedor-destacado .ui-widget-content {
    background: #edf0f5 !important;
}

.contenedor-destacado .ui-panel .ui-panel-content {
    margin: 25px 2px;
    background: #edf0f5 !important;
}

.contenedor-transparente div {
    background: clear;
}

.titulo h1 {
    margin-left: 15px;
    margin-right: 15px;
    margin: 10 10 .5em 0;
    border-bottom: 1px solid #d5d5d5;
    padding: .1em;
    font-size: 1.5em;
}

.titulo-pagina {
    font-weight: 400;
    border-bottom: .11em solid #a0a0ad;
    padding: 1rem;
    font-size: 1.5em;
}

.detalle {
    margin-left: 15px;
    margin-right: 15px;
    margin: 10 10 .5em 0;
    padding: .1em;
    font-size: 14px;
}

.right-text {
    display: block;
    text-align: right;
}



#todo\:resultadoLazyTable.ui-datatable .ui-datatable-header {
    border-bottom: 0 none;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    overflow: hidden;
}

#todo\:resultadoLazyTable.ui-datatable .ui-datatable-header, .ui-datatable .ui-datatable-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;

}

#pozosNoConvencionalesForm\:pozosTable.ui-datatable .ui-datatable-header {
    border-bottom: 0 none;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    overflow: hidden;
}

#pozosNoConvencionalesForm\:pozosTable.ui-datatable .ui-datatable-header, .ui-datatable .ui-datatable-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;

}

#formCTG\:plantasTable.ui-datatable .ui-datatable-header {
    border-bottom: 0 none;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    overflow: hidden;
}

#formCTG\:plantasTable.ui-datatable .ui-datatable-header, .ui-datatable .ui-datatable-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;

}

/* Estilos específicos para la tabla de resultados  de boletin*/
.tabla-boletin {
    border-radius: 20px 20px 0 0;
    overflow: hidden;
    font-size: 14px;
    text-align: center;
    font-family: Arial, Verdana, sans-serif;
}

.tabla-boletin tbody tr:last-child {
    background: #9a9ec3;

}

/* Estilos específicos para la tabla de resultados  de boletin*/
.tabla-otro-boletin {
    border-radius: 20px 20px 0 0;
    overflow: hidden;

}

.tabla-boletin-resultados{
    padding: 3px 3px 3px 10px;
    border-radius: 0 0 20px 20px;
    overflow: hidden;
}




/* Estilos específicos para la tabla de resultados */
.tabla-resultados {
    border-radius: 20px;
    overflow: hidden;
    text-align: center;
    font-family: Arial, Verdana, sans-serif;
    border-collapse: separate !important; /* asegura que no “coma” los radios */
}


.tabla-resultados .ui-datatable .ui-datatable-header {
    border-top-right-radius: 10px !important;
    border-top-left-radius: 10px !important;
}

.tabla-resultados .ui-paginator {
    border-radius: 0 !important;
}

.tabla-resultados tbody tr:last-child td:first-child {
    border-bottom-left-radius: 20px;
    overflow: hidden;

}

.tabla-resultados tbody tr:last-child td:last-child {
    border-bottom-right-radius: 20px;
    overflow: hidden;

}


.checkIncluir p\:column {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.checkIncluir label {
    margin-top: 2px;
}


.ui-panelgrid .ui-panelgrid-cell .nopadding {
    padding: 0px;
}

.ui-panelgrid .ui-panelgrid-cell .paddingleft {
    padding-left: 15px;
}

.ui-panelgrid .ui-panelgrid-cell .paddingbottom {
    padding-bottom: 15px;
}

.rangoFechasPanel {
    min-height: 35px;
}

.checkConsultaInicialPanel {
    min-height: 35px;
}

/* flecha de dropdown de combos */
.ui-fluid .ui-selectonemenu .ui-selectonemenu-trigger {
    width: 18px;
}

/* encabezado de paneles */
.ui-widget-header {
    font-size: 1.2em;
    color: #eeeeee;
    border-radius: 1rem !important;
    font-weight: normal;
    background: #1165A5 !important;
    /*background: -webkit-linear-gradient(top,red 0,black 100%);*/
}

/* div para ubicar botones a derecha de la pantalla */
.buttons-div {
    display: block;
    text-align: right;
    padding: 1em;
}

.productions-div {
    display: block;
    text-align: left;
    padding: 5px;
}

.toggable-datatable .ui-datatable-header {
    height: 36px
}

.no-header-datatable thead th {
    border: none !important;
    background: none !important;
}

.clean-link {
    text-decoration: none;
}

.novedad-badge-succes{
    padding: 3px;
    padding-left: 10px;
    padding-right: 10px;
    font-weight: bold;
    font-size: small;
    text-align: center;
    background-color: #C8E6C9 ;
    color: #256029;
}

.novedad-badge{
    padding: 3px;
    padding-left: 10px;
    padding-right: 10px;
    font-weight: bold;
    text-align: center;
    font-size: small;
    background-color: #FEEDAF;
    color: #8a5340;
}

.panel-grafico{
    padding: 0px;
}

/* Estilos para el panel grid principal */
.main-panel-grid.ui-panelgrid > * > tr,
.main-panel-grid.ui-panelgrid .ui-panelgrid-cell {
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
}

.main-panel-grid.ui-panelgrid {
    border: none !important;
    background: transparent !important;
}


.user-name-label{
    color: #222222;
    padding-top: 9px;
}

.panel-user-menu{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding-right: 4%;
    align-items: center;
}

body .ui-tabs.ui-tabs-top>.ui-tabs-nav li.ui-tabs-header.ui-state-active {
    border: 2px solid #dee2e6;
    border-bottom: 2px solid #12497e;
}

body .ui-tabs.ui-tabs-top>.ui-tabs-nav li.ui-tabs-header {
    top: 0;
    border-bottom: 2px solid #dee2e6;
}

.administracionAreasErrorConsistencia {
    background-color: rgb(244, 159, 159) !important;
}

/* COLORES */
.text-darkblue-iapg {
    color: #1165A5;
}

.bg-darkblue-iapg {
    background-color: #1165A5;
}

.bg-petroleo-iapg {
    background-color: #FFFFFF;
    border: 2px solid #5229e0;
    box-shadow: 0 8px 24px rgba(0,0,0,0.05);
}

.bg-petroleo-iapg:hover {
    box-shadow: 0 12px 28px rgba(82,41,224,0.15);
    transform: translateY(-2px);
    transition: all 0.2s ease;
}

.petroleo-title {
    color: #5229e0;
    font-size: 1.75rem;
    font-weight: 700;
}

/* Tablets / resoluciones medias */
@media (max-width: 1366px) {
    .petroleo-title {
        color: #5229e0;
        font-size: 1.2rem;
        font-weight: 700;
    }
}

/* Tablets / resoluciones medias */
@media (max-width: 1280px) {
    .petroleo-title {
        color: #5229e0;
        font-size: 1.15rem;
        font-weight: 700;
    }
}

.bg-gas-iapg {
    background-color: #FFFFFF;
    border: 2px solid #339675;
    box-shadow: 0 8px 24px rgba(0,0,0,0.05);
}

.bg-gas-iapg:hover {
    box-shadow: 0 12px 28px rgba(51, 150, 117, 0.25);
    transform: translateY(-2px);
    transition: all 0.2s ease;
}

.gas-title {
    color: #339675;
    font-size: 1.75rem;
    font-weight: 700;
}

/* Tablets / resoluciones medias */
@media (max-width: 1366px) {
    .gas-title {
        color: #339675;
        font-size: 1.2rem;
        font-weight: 700;
    }
}

/* Tablets / resoluciones medias */
@media (max-width: 1280px) {
    .gas-title {
        color: #339675;
        font-size: 1.15rem;
        font-weight: 700;
    }
}

.petroleo-value {
    color: #421fac;
    font-size: 2.25rem;
    font-weight: 700;
    line-height: 1.2;
}

.gas-value {
    color: #14620e;
    font-size: 2.25rem;
    font-weight: 700;
    line-height: 1.2;
}

.card-subtitle {
    color: #6B7280;
    font-size: 0.875rem;
}

.card-unit {
    color: #6B7280;
    font-size: 1rem;
    margin-left: 4px;
}





/* MENU */
.menu {
    z-index: 102;
    transition: all 0.3s ease;
    background-color: #1165A5;

    width: 100%;
}

/* Tamaño base del menú - adaptable por defecto */
.menu .ui-menu {
    width: 100%;
}

.menu .ui-tieredmenu {
    width: 100%;
}

/* Pantallas Full HD y mayores */
@media screen and (min-width: 1920px) {
    .menu ul li > a {
        font-size: 16px;
        padding: 7px !important;
    }

    .ui-menu .ui-menuitem-link .ui-menuitem-icon,
    .ui-menu .ui-submenu-icon {
        font-size: 1.2em;
        padding-right: 10px;
    }
}

/* Pantallas entre 1080p y Full HD */
@media screen and (min-width: 1366px) and (max-width: 1919px) {
    .menu ul li > a {
        font-size: 15px;
        padding: 6px !important;
    }

    .ui-menu .ui-menuitem-link .ui-menuitem-icon,
    .ui-menu .ui-submenu-icon {
        font-size: 1.1em;
        padding-right: 8px;
    }
}

/* Pantallas 720p y similares */
@media screen and (max-width: 1365px) {
    .menu ul li > a {
        font-size: 14px;
        padding: 5px !important;
    }

    .ui-menu .ui-menuitem-link .ui-menuitem-icon,
    .ui-menu .ui-submenu-icon {
        font-size: 1em;
        padding-right: 5px;
    }
}

/* Pantallas muy pequeñas */
@media screen and (max-width: 1024px) {
    .menu ul li > a {
        font-size: 13px;
        padding: 4px !important;
    }
}

/* Estilos base del menú */
.menu .ui-widget-content {
    background-color: #1165A5;
    border-radius: 10px;
}

.menu ul {
    list-style-type: none;
    box-sizing: border-box;
    border-radius: 10px;
    padding: 0;
    margin: 0;
    display: flex; /* Añade esta propiedad */
    flex-wrap: wrap; /* Añade esta propiedad para permitir la envoltura de elementos */
}


.menu ul li > a {
    position: relative;
    color: #dddddd;
    text-decoration: none;
    display: block;
    border-radius: 10px;
    border-top: 1px solid #12497e;
    transition: all 0.2s ease;
    flex-grow: 1;
}

.menu ul li > a:hover {
    color: #36a5cb;
    background: #12497e;
}

.menu ul li.active-menuitem > a {
    background-color: #06213e;
    color: #36a5cb;
}

.menu ul li.active-menuitem > ul {
    background-color: #12497e;
}

.menu .ui-menu .ui-menu-parent .ui-menu-child {
    min-width: 180px;
    width: auto;
}

/* Iconos del menú */
.ui-menu .ui-menuitem-link .ui-menuitem-icon,
.ui-menu .ui-submenu-icon {
    margin-top: -1px;
    vertical-align: middle;
}

/* Ajuste para el contenedor del menú */
.ui-menubar .ui-menu-child .ui-menuitem-link {
    width: 100%;
    box-sizing: border-box;
}

.whiteIcon .ui-icon {
    background-image: url("../../javax.faces.resource/images/ui-icons_ffffff_256x240.png.xhtml?ln=primefaces-omega");
    overflow: visible;
}

.login-body {
    background-image: none !important;
}
.mail-icon-wrapper {
    position: relative;
    display: inline-block;
}

.badge-sugerencias {
    position: absolute;
    top: -35px;
    right: 0;
    background-color: red;
    color: white;
    font-size: 12px;
    font-weight: bold;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: space-around;
    line-height: 1;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
}

.field {
    margin-bottom: 1rem;
}


.ui-selectonemenu-filter-container .ui-icon {
    display: none !important;
}


.ui-selectonemenu-filter-container .ui-inputfield {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='gray' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001l3.85 3.85a1 1 0 0 0 1.415-1.415l-3.85-3.85zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 8px center;
    background-size: 16px;
    padding-right: 30px;

}

/* Estilo para el panel del ColumnToggler */
.ui-columntoggler {
    border-radius: 10px;
}

/* Margen entre checkbox y label */
.ui-selectbooleancheckbox {
    margin-right: 8px;
}

/* Aplicar el mismo margen en cualquier contexto */
p\:column .ui-selectbooleancheckbox,
.ui-panelgrid .ui-selectbooleancheckbox {
    margin-right: 8px;
}

/* contenedor general */
.sipg-tour {
    border-radius: 10px;
    overflow: hidden;
    padding: 0;
    border: none;
    box-shadow: 0 12px 30px rgba(0,0,0,0.25);
    max-width: 340px;
}

/* header */
.sipg-tour .driver-popover-title {
    background: #1f5f94;
    color: white;
    font-weight: 600;
    font-size: 15px;
    padding: 10px 14px;
    margin: 0;
}

/* icono */
.sipg-tour .driver-popover-title i {
    margin-right: 6px;
}

/* descripcion */
.sipg-tour .driver-popover-description {
    padding: 14px;
    font-size: 13px;
    color: #374151;
    line-height: 1.4;
}

.sipg-tour .driver-popover-footer {
    padding: 10px 14px;
    border-top: 1px solid #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

/* botones base */
.sipg-tour .driver-popover-footer button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 14px;
    border-radius: 6px;
    font-size: 13px;
    border: none;
    cursor: pointer;
    transition: all .2s ease;
    line-height: 1.2;

    transform: none !important;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

/* boton siguiente */
.sipg-tour .driver-popover-next-btn {
    background: #2a7abe;
    color: white;
}

.sipg-tour .driver-popover-next-btn:hover {
    background: #1f5f94;
}

/* boton anterior */
.sipg-tour .driver-popover-prev-btn {
    background: #e5e7eb;
    color: #374151;
}

.sipg-tour .driver-popover-prev-btn:hover {
    background: #d1d5db;
}

/* progreso */
.sipg-tour .driver-popover-progress-text {
    font-size: 11px;
    color: #6b7280;
}

.sipg-tour .driver-highlighted-element {
    box-shadow: 0 0 0 4px rgba(42,122,190,0.5);
    border-radius: 6px;
}

.sipg-tour.driver-popover {
    max-width: 440px;
}

.sipg-tour.driver-popover:first-of-type {
    max-width: 420px;
}

/* intro */
.tour-intro {
    font-size: 14px;
    line-height: 1.5;
    max-width: 450px;
}

.tour-intro ul {
    margin-top: 8px;
    padding-left: 18px;
}

.tour-intro li {
    margin-bottom: 6px;
}

/* cierre */
.tour-end {
    text-align: center;
    font-size: 14px;
}

/* estado focus del botón siguiente */
.sipg-tour .driver-popover-next-btn:focus {
    background: #2a7abe;
    color: white;
    outline: none;
    box-shadow: 0 0 0 2px rgba(42,122,190,0.35);
}

/* estado activo (cuando se hace click) */
.sipg-tour .driver-popover-next-btn:active {
    background: #1f5f94;
}

.indicador-valor {
    font-weight: bold;
    font-size: 4em;
}

/* Tablets / resoluciones medias */
@media (max-width: 1366px) {
    .indicador-valor {
        font-size: 3em;
    }
}

/* 1280x720 y similares */
@media (max-width: 1280px) {
    .indicador-valor {
        font-size: 2.75em;
    }
}

/* pantallas chicas */

.indicador-card {
    padding: 1.5rem;
}

@media (max-width: 1280px) {
    .indicador-card {
        padding: 1rem;
    }
}