@font-face {
    font-family: 'PitagonSans-Bold';
    src: url("/javax.faces.resource/fonts/PitagonSans-Bold.woff2.xhtml") format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'PitagonSans-SemiBold';
    src: url("/javax.faces.resource/fonts/PitagonSans-SemiBold.woff2.xhtml") format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'PitagonSans-Medium';
    src: url("/javax.faces.resource/fonts/PitagonSans-Medium.woff2.xhtml") format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'PitagonSans-Regular';
    src: url("/javax.faces.resource/fonts/PitagonSans-Regular.woff2.xhtml") format('woff2');
    font-weight: normal;
    font-style: normal;
}

:root{
    --naranja: #F7A01E;
    --caffeLato: #C7B299;
    --caffeGreen: #827D6E;
    --ceniza: #F4F4F4;
    --grayBlack: #323232;
}
*{
    margin: 0;
    padding: 0;
}

html{
    height: 100%;
}

body{
    font-family: 'PitagonSans-Regular', sans-serif;
    color: var(--text-color);
}
body .ui-widget{
    font-family: 'PitagonSans-Regular', sans-serif;
}

/* ------------------------ FONTS PERSONALICE ------------------------------- */
.font-pitagonSans-Medium{
    font-family: 'PitagonSans-Medium', sans-serif !important;
}
.font-pitagonSans-SemiBold{
    font-family: 'PitagonSans-SemiBold', sans-serif !important;
}
.font-pitagonSans-Bold{
    font-family: 'PitagonSans-Bold', sans-serif !important;
}


/* ------------------------ BACKGROUND PRIMARY ------------------------------- */

.bg-principal{
    background: var(--ceniza) !important;
}

.bg-menu{
    background: var(--grayBlack) !important;
}

.bg-caffeLato{
    background: var(--caffeLato) !important;
}
.bg-caffeGreen{
    background: var(--caffeGreen) !important;
}
.bg-grayBlack{
    background: var(--grayBlack) !important;
}

/* ------------------------ TEXT COLORS ------------------------------- */
.color-orange{
    color: var(--naranja) !important;
}
.color-caffeGreen{
    color: var(--caffeGreen) !important;
}
.color-caffeLato{
    color: var(--caffeLato) !important;
}
.color-ceniza{
    color: var(--ceniza) !important;
}
.color-grayBlack{
    color: var(--grayBlack) !important;
}

/* ------------------------ SCROLL BAR PERSONALICE ------------------------------- */

.custom-scroll-panel {
    overflow: auto;
    scrollbar-width: none; /* Oculta la barra de desplazamiento por defecto en Firefox */
    -ms-overflow-style: none; /* Oculta la barra de desplazamiento por defecto en IE y Edge */
}

/* Mostrar barra de desplazamiento al pasar el puntero */
.custom-scroll-panel:hover {
    scrollbar-width: thin; /* Firefox */
    scrollbar-color: #888 var(--grayBlack); /* Firefox */
    -ms-overflow-style: -ms-autohiding-scrollbar; /* IE y Edge */
}

/* WebKit browsers (Chrome, Safari) */
.custom-scroll-panel::-webkit-scrollbar {
    width: 0; /* Oculta la barra de desplazamiento por defecto */
    height: 0;
    transition: width 0.3s, height 0.3s; /* Transición para suavizar el cambio de ancho/alto */
}

.custom-scroll-panel:hover::-webkit-scrollbar {
    width: 12px; /* Muestra la barra de desplazamiento al pasar el puntero */
    height: 12px;
}

.custom-scroll-panel::-webkit-scrollbar-track {
    background: var(--grayBlack);
}

.custom-scroll-panel::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 10px;
}

.custom-scroll-panel::-webkit-scrollbar-thumb:hover {
    background: var(--ceniza);
}

/* Media query para pantallas de 992px o menos */
@media (max-width: 991px) {
    .custom-scroll-panel {
        scrollbar-width: thin !important; /* Firefox */
        scrollbar-color: #888 var(--grayBlack) !important; /* Firefox */
        -ms-overflow-style: -ms-autohiding-scrollbar !important; /* IE y Edge */
    }

    .custom-scroll-panel::-webkit-scrollbar {
        width: 12px !important; /* WebKit browsers */
        height: 12px !important;
    }
}




#loader {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    z-index: 9999;
    transition: opacity 0.5s ease, visibility 0.5s ease;
    opacity: 1;
    visibility: visible;
}

/* Cuando se oculta el loader */
#loader .hidden {
    opacity: 0;
    visibility: hidden;
}

/* Estilos para el contenido */
body #content{
    opacity: 0;
    transition: opacity 0.5s ease;
}

body .loaded {
    opacity: 1 !important;
}



.shadow-box{
    box-shadow: 0 0.75rem 1.5rem rgba(18,38,63,.04);
}


.contenedor-imagen {
    width: 100%;
    height: 200px;
    position: relative; /* Para que el contenido flote sobre la imagen */
}

.contenedor-imagen img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.sticky-menu{
    background: transparent;
}
.scrolled{
    background-color: #fff !important;
}

.ir-arriba {
    display: none;
    cursor: pointer;
    color:#fff;
    border-radius: 10px;
    position: fixed;
    bottom:80px;
    right:30px;
    z-index: 9999;
}
.ir-arriba i{
    font-size: 20px;
}
.ir-arriba:hover, .ir-arriba:focus, .ir-arriba:active{
    color: #fff !important;
}

.w-full-all{
    width: 100%;
}

body .ui-progressbar .ui-progressbar-value{
    background: var(--orange-500);
}


@media screen and (min-width: 1920px) {
    .w-max-all{
        width: 1366px !important;
    }
}

.contentBars{
    top: 8px;
    transform: translateX(-58%) !important;
}

.borderFirst{
    border-left: 5px solid var(--orange-500);
    border-radius: 100%;
    height: 5rem;
    width: 5rem;
    transform: translateX(90%) !important;
}
.borderSecond{
    border-left: 5px solid var(--primary-500);
    border-radius: 100%;
    height: 4.7rem;
    width: 4.7rem;
    margin-left: 1px;
}

@media screen and (min-width: 767px){
    .contentBars{
        top: 8px !important;
    }

    .borderFirst{
        height: 5rem !important;
        width: 5rem !important;
    }
    .borderSecond{
        height: 4.7rem !important;
        width: 4.7rem !important;
    }
}

@media screen and (max-width: 767.9px){
    .contentBars{
        top: 0px !important;
    }
    .borderFirst{
        height: 4rem !important;
        width: 4rem !important;
    }
    .borderSecond{
        height: 3.7rem !important;
        width: 3.7rem !important;
    }
}

body .ui-paginator{
    border: none !important;
}


.scroll-bar-none .ui-scrollpanel-content{
    width: 100% !important;
    margin-left: 0 !important;
    left: 0 !important;
}
.scroll-bar-none .ui-scrollpanel-vbar{
    display: none !important;
}

.scroll-bar-h-full .ui-scrollpanel-content{
    height: 100%;
}


@media screen and (min-width: 850px) {
    .table-cell{
        display: table-cell !important;

    }
    body .ui-widget, body .ui-inputfield{
        font-size: 0.90rem;
    }
}
@media screen and (max-width: 850px) {
    .table-cell{
        display: none !important;
    }
    .scroll-bar-none .ui-scrollpanel-container{
        width: 100% !important;
    }
    body .ui-widget, body .ui-inputfield{
        font-size: 0.75rem;
    }
}
.sinHeader .ui-datatable thead th{
    background: #fff !important;
}
.sinHeader .ui-datatable .ui-datatable-header{
    background: #fff !important;
    border-radius: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

body .ui-paginator .ui-paginator-pages .ui-paginator-page.ui-state-active{
    background: var(--orange-50) !important;
}

body .ui-paginator .ui-paginator-pages .ui-paginator-page.ui-state-focus{
    box-shadow: 0 0 0 0 !important;
}

.sinHeader .ui-datatable .ui-datatable-data>tr .ui-row-toggler:focus{
    box-shadow: none !important;
}

.sinHeaderText .ui-datatable thead th{
    display: none !important;
}

.sinPaddin .ui-datatable .ui-datatable-data>tr>td{
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}


body .ui-growl .ui-growl-item-container.ui-growl-info{
    background: var(--orange-50) !important;
    border-color: var(--orange-500) !important;
    color: var(--orange-500) !important;
}

body .ui-growl .ui-growl-item-container.ui-growl-info .ui-growl-image{
    color: var(--orange-500) !important;
    margin-right: 10px;
    font-size: 1.5rem !important;
    width: auto !important;
    height: auto !important;
}
body .ui-growl-title, body .ui-growl-message{
    padding: 0 !important;
    width: auto !important;
}

body .ui-growl .ui-growl-item-container .ui-growl-item{
    display: flex;
    align-items: center;
    padding: 0.5rem 1rem !important;
}

body .ui-tabmenu .ui-tabmenu-nav{
    overflow-x: hidden;
    background: transparent !important;
}
body .ui-tabmenu .ui-tabmenu-nav .ui-tabmenuitem{
    background: transparent !important;
}

body .ui-overlaypanel .ui-overlaypanel-content{
    padding: 0 !important;
}

@media screen and (min-width: 1366px) {
    .w-max-content{
        max-width: 1366px;
    }
}

.loading-overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.loading-spinner {
    width: 50px;
    height: 50px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid var(--orange-500);
    border-radius: 50%;
    animation: spin 2s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
#dlggen .ui-dialog, #dlggen .ui-dialog-content {
    background: none!important;
}

.bg-degradado-black{
    background: linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0));
}

.contentVideo video{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.contextPlus{
    background:rgba(0,0,0,0.5);
}
.contextPlusExtraInterno{
    background:rgba(0,0,0,0.7);
}


.img-aspect{
    aspect-ratio: 21/9;
}

.fileBlock .ui-fileupload-simple{
    display: block !important;
}


/*--------------- Theme Naranja ------------------*/

body .ui-button{
    background: var(--orange-500) !important;
    border: 1px solid var(--orange-500) !important;
}

body .ui-inputfield.ui-state-focus{
    border-color: var(--orange-500) !important;
    box-shadow: 0 0 0 0.2rem var(--orange-50) !important;
}
body .ui-inputfield.ui-state-hover{
    border-color: var(--orange-500) !important;
}

body .ui-chkbox .ui-chkbox-box.ui-state-active{
    border-color: var(--orange-500) !important;
    background: var(--orange-500) !important;
}

body .ui-chkbox .ui-chkbox-box.ui-state-focus{
    box-shadow: 0 0 0 0.2rem var(--orange-50) !important;
}

body .ui-chkbox .ui-chkbox-box.ui-state-focus, body .ui-chkbox .ui-chkbox-box.ui-state-hover{
    border-color: var(--orange-500) !important;
}
body .ui-badge{
    background: var(--orange-500) !important;
}

body .ui-selectonemenu.ui-state-hover{
    border-color: var(--orange-500) !important;
}

body .ui-selectonemenu.ui-state-focus{
    box-shadow: 0 0 0 0.2rem var(--orange-50) !important;
    border-color: var(--orange-500) !important;
}
body .ui-selectonemenu-panel .ui-selectonemenu-items .ui-selectonemenu-item.ui-state-highlight{
    background: var(--orange-50) !important;
}

body .ui-accordion .ui-accordion-header:focus{
    box-shadow: none !important;
}

body .ui-toggleswitch.ui-toggleswitch-checked .ui-toggleswitch-slider{
    background: var(--orange-500) !important;
}
body .ui-toggleswitch.ui-toggleswitch-focus .ui-toggleswitch-slider{
    box-shadow: 0 0 0 0.2rem var(--orange-50) !important;
}


.pre .ui-accordion .ui-accordion-header{
    margin-top: 0.6rem;
    border-top: 1px solid var(--surface-border) !important;
    border-radius: 5px;
    background: transparent !important;
    display: flex;
    align-items: center;
}

.pre .ui-accordion .ui-accordion-header.ui-state-active:focus{
    color: var(--orange-500) !important;
    background: var(--orange-50) !important;
    border-color: var(--orange-500) !important;
}

.pre .ui-accordion .ui-accordion-content{
    border: none !important;

}


.conPre .ui-accordion .ui-accordion-header{
    border: none !important;
    background: transparent !important;
    display: flex;
    align-items: center;
    /*padding: 1rem 0.5rem !important;*/
    padding: .6rem 0.5rem !important;
    border-radius: 5px;
    display: flex;
    align-items: center;
}

.conPreSinPaddin .ui-accordion .ui-accordion-header{
    border: none !important;
    background: transparent !important;
    display: flex;
    align-items: center;
    padding: 0 !important;
    border-radius: 5px;
    display: flex;
    align-items: center;
}
.conPre .ui-accordion .ui-accordion-header:hover, .conPreSinPaddin .ui-accordion .ui-accordion-header:hover{
    background: var(--orange-50) !important;
}
.conPre .ui-accordion .ui-accordion-content, .conPreSinPaddin .ui-accordion .ui-accordion-content{
    margin-top: 5px !important;
    border-top: 1px solid var(--surface-border) !important;
    border-left: none !important;
    border-right:  none !important;
    border-bottom:  none !important;
    padding: .25rem 0 0 0 !important;
}


.conTop .ui-accordion .ui-accordion-header{
    border: none !important;
    background: transparent !important;
    display: flex;
    align-items: center;
    padding: 0 !important;
    border-radius: 5px;
}

.conTop .ui-accordion .ui-accordion-content{
    border: none !important;
    border-left: none !important;
    border-right:  none !important;
    border-bottom:  none !important;
    padding: 1rem 0 0 0 !important;
}

body .ui-slider .ui-slider-range{
    background: var(--orange-500);
}

body .ui-slider .ui-slider-handle{
    border: 2px solid var(--orange-500);
}

body .ui-slider .ui-slider-handle.ui-state-hover{
    border-color: var(--orange-500);
    background: var(--orange-500);
}