/*@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap');*/
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
/*@import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');*/
/*@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');*/
/*@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');*/
/*@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');*/
/*@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&family=Quicksand:wght@300..700&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');*/
/*@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Nunito:ital,wght@0,200..1000;1,200..1000&family=Quicksand:wght@300..700&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');*/

:root {
    --bs-font-sans-serif: 'Inter', sans-serif;
    --dxbl-pager-active-page-btn-bg: #4264A1 !important;
    --bs-primary: rgb(30, 45, 72) !important;   
    --bs-primary-rgb: rgb(30, 45, 72) !important;
    --dxbl-pager-active-page-btn-bg: rgb(30, 45, 72) !important;
    --dxbl-btn-disabled-bg: rgb(30, 45, 72) !important;
    --dxbl-btn-bg: rgb(30, 45, 72) !important;
    --dxbl-image-color: #e9f1f8 !important;
    --dxbl-btn-focus-shadow-color: rgba(30, 45, 7, 0.5);
    --dxbl-btn-hover-background: #e9f1f8 !important;
}


html, body {
    height: 100%;
}

body {
    display: flex !important;
    flex-direction: column;
}

/*app {
    display: block;
    height: 100%;
}
*/
main {
    flex: 1; /* Allow the main content to grow and push the footer to the bottom */
}

/*.header-logo {
    flex-shrink: 1;
    background-color: currentColor;
    -webkit-mask: url('../images/logo-ceprem.png');
    mask: url('../images/logo-ceprem.svg');*/
    /*-webkit-mask-position: center;
    mask-position: center;*/
    /*-webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    width: 600px;
    height: 64px;
    margin-top: -16px;
    margin-right: 0;
    color: #e9f1f8;
}*/
.header-logo {
    flex-shrink: 1;
    width: 156px;
    height: 50px;
    margin-top: -16px;
    margin-right: -13px;
    background: url('/images/logo-ceprem.png') no-repeat center/contain;
    /* Remove background-color, mask, and color properties */
}

.header-logo-frontpage {
    margin: 0;
    height: 128px;
    margin: auto;
}

.header-logo:hover {
    color: #c4def5
}

#blazor-error-ui {
    background: inherit;
    bottom: 0;
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 100001;
}

#container-window-template-component {
    background-color: rgb(252, 252, 252);
}

.d-break {
    width: 100%;
    display: block;
}

#top-bar, dxbl-menu-item, dxbl-btn dxbl-btn-text-none, .dxbl-menu-nav {
    background-color: #4264A1 !important;
    color: #e9f1f8 !important;
}

/*.dxbl-menu-dropdown-item :hover {
    background-color: #e9f1f8 !important;
    color: #4264A1 !important;
}*/

.dxbl-menu-item-text {
    /*    font-size: 1.15rem;
    background-color: #e9f1f8 !important;
    */
}

/*.dxbl-menu-item-text:hover {
    background-color: transparent !important;
    color: red !important;
}
*/
/*.dxbl-menu-item-text-container:hover {
    background-color: #e9f1f8 !important;
    color: red !important;
}
*/
.account-button {
    background-color: #4264A1 !important;
    color: #e9f1f8 !important;
    border-color: #e9f1f8 !important;
}

    .account-button:hover {
        color: #4264A1 !important;
        background-color: #e9f1f8 !important;
    }

.theme-button {
    display: none;
}

.dxbl-grid-filter-menu-funnel-btn {
    color: #e9f1f8;
}

.xaf-toolbar-item-icon:not(:disabled) {
    color: #4264A1 !important;
}

.xaf-toolbar-item-icon:disabled {
    color: var(--dxbl-btn-disabled-image-color, var(--dxbl-image-disabled-color, currentcolor));
    opacity: var(--dxbl-btn-disabled-image-color, var(--dxbl-image-disabled-color, 0.4));
    opacity: var(--dxbl-btn-disabled-image-color, var(--dxbl-image-disabled-color, 0data.4));
}

.card-header {
    background-color: #4264A1 !important;
    color: #e9f1f8 !important;
}

.dxbl-image {
    /*filter: invert(15%) sepia(19%) saturate(1609%) hue-rotate(179deg) brightness(80%) contrast(92%) !important;*/
}

.dxbl-toolbar-btn {
    border-radius: 5px !important;
}

.dxbl-menu-dropdown-item {
    border-radius: 0 !important;
}

button[data-action-name="Nuevo"] {
    color: #e9f1f8 !important;
    background-color: #4264A1 !important;
    padding: 5px 25px 5px 15px !important;
    fill: #e9f1f8;
}

    button[data-action-name="Nuevo"]:hover {
        background-color: #6988c0 !important;
    }

button[data-action-name="Enviar Postulación"] {
    color: #e9f1f8 !important;
    background-color: #4264A1 !important;
}



button[data-action-name="Eliminar"] {
    color: red !important;
}

button[data-action-name="Si"] {
    background-color: #4264A1 !important;
    color: white !important;
}

    button[data-action-name="Si"]:hover {
        background-color: #4264A1 !important;
        color: white !important;
    }

.navigate-back-icon-container {
    background-color: #4264A1 !important;
    color: #e9f1f8 !important;
}

.dashboard-portafolio-listview .dxbl-fl-ctrl {
    margin-top: 0 !important;
}

.custom-dashboard-item {
    border: solid 1px #e9f1f8 !important;
    border-radius: 15px !important;
    padding: 10px;
    display: block;
    cursor: pointer;
    /*max-width: 300px;*/
    /*background-color: #F5F5FF;*/
}

    .custom-dashboard-item:hover {
        color: #e9f1f8;
        background-color: #4264A1;
        border-radius: 15px !important;
    }

    .custom-dashboard-item .ct-icon-box-text {
        font-size: 1.05rem;
        font-weight: 500;
    } 

    .custom-dashboard-item .ct-icon-box-text-additional {
        font-size: 1.1rem;
        font-weight: 600;
    }
    /*.custom-dashboard-item .ct-icon-box-text {*/
    /*color: var(--dxbl-grid-color);*/
    /*color: #16366f;
}*/
    .custom-dashboard-item:hover .ct-icon-box-text {
        /*color: var(--dxbl-grid-color);*/
        color: #e9f1f8;
    }


.dxbl-fl-ctrl .card-portafolio ~ * {
    /* Styles for siblings following container-x when it's the first child */
    background-color: #e9f1f8 !important;
    border-radius: 15px !important;
}

.dxbl-fl-ctrl:has(.card-portafolio) { /* Target parent with child */
    background-color: #e9f1f8; /* Set your background color here */
    border-radius: 15px !important;
}
/*.card-portafolio {
    background-color: #e9f1f8;*/
/*max-width: 300px;*    /*background-color: #F5F5FF;*/ /*/*/
/*background-color: #F5F5FF;*/
/*}*/

.footer {
    background-color: #4264A1;
    color: #e9f1f8;
}

.home-panel {
    max-width: 1024px;
    margin: 10px auto;
}

.xaf-caption-icon, .xaf-context-menu-item-icon, .xaf-nav-menu-item-icon, .xaf-toolbar-item-icon, .xaf-layout-tab-icon, .xaf-layout-group-icon, .xaf-combobox-icon {
    max-width: 24px;
    max-height: 24px;
    width: 24px;
    height: 24px;
}

.xaf-view-caption-lg {
    padding-top: 8px;
}

.onlyform {
    /*max-width: 500px;*/
    margin: 0 auto;
}

.header-especialidad {
    font-size: 1.3rem;
        
}

.tree-empty-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
    margin: auto;
    padding: 10px;
}

.ceprem-title a {
    text-decoration: none;
}

/*.postulacion-resumen {
    margin-top: auto !important;
    margin-bottom: auto !important;
}
*/
.texto-condiciones-postulacion {
    margin-left: 1.5rem !important;
}

    .texto-condiciones-postulacion ul li {
        margin-bottom: 1rem !important;
    }

.dxbl-fl-ctrl.dxbl-fl-ctrl-nc > .postulacion-resumen {
    /*margin-top: -5px !important;*/
    padding-top: 6px;
}

.loading-image {
    width: 64px;
    height: 64px;
}


.ceprem-title {
    font-size: 1.5rem;
    font-weight: 600;
    text-decoration: none;
}

li.llamado-actividad-base > .dxbl-treeview-item-content > .dxbl-treeview-item-container {
    font-size: 1.2rem;
    font-weight: 600 !important;
}

.xaf-caption-icon, .xaf-context-menu-item-icon, .xaf-nav-menu-item-icon, .xaf-toolbar-item-icon, .xaf-layout-tab-icon, .xaf-layout-group-icon, .xaf-combobox-icon {
    max-width: 20px !important;
    max-height: 20px !important;
    width: 20px !important;
    height: 20px !important;
}

.postulacion-resumen {
    margin-top: 0 !important;
}

    .postulacion-resumen > .dxbl-fl-ctrl {
        margin-top: 7px !important;
    }

.invalid.validation-invalid.dxbl-text-edit {
    background-color: #ff0000;
    background-color: rgba(255,0,0,.05);
}

.postulacion-porcentaje {
    margin-top: 5px;
    font-weight: 600;
    font-size: 1.4rem;
}

.listview-html-cell {
    margin: auto;
    text-align: center;
}

.files-supported-message label {
    font-size: 0.75rem;
    font-weight: 400;
    color: red;
    margin-top: -5px;
}

.title-beta {
    font-size: 0.85rem;
    font-weight: 500;
}

.dxbl-grid-group-row {
    font-weight: 600;
}

.loading-container {
    display: flex;
    justify-content: center; /* Center horizontally */
    align-items: center; /* Center vertically */
    width: 100%;
}

.dxbl-toolbar .dxbl-btn-group.dxbl-toolbar-btn-ellipsis button.dxbl-btn-secondary.dxbl-btn-last {
    background-color: #4264A1;
    color: #e9f1f8;
    border-color: #e9f1f8 !important;
    padding: 8px 9px 7px 9px;
}

    .dxbl-toolbar .dxbl-btn-group.dxbl-toolbar-btn-ellipsis button.dxbl-btn-secondary.dxbl-btn-last :hover {
        background-color: #e9f1f8;
        color: #4264A1;
    }

.header-left-side {
    background-color: #4264A1;
}

.btn-hamburger {
    background-color: #4264A1;
    color: #e9f1f8;
    margin-right: 10px;
}

    .btn-hamburger :focus {
        background-color: #4264A1;
        color: #e9f1f8;
        margin-right: 10px;
    }

.dxbl-accordion-items-container .dxbl-navigation-filter {
    color: #e9f1f8;
}

.header-logo {
    margin-top: 1px;
}



/* Ensure the toolbar buttons within logon-toolbar are displayed using flex */
/*.logon-toolbar .dxbl-btn-toolbar {
    display: flex !important;
    width: 100% !important;
}*/

/* Make the left button take all the available space */
/*.logon-toolbar .full-width-button {
    flex-grow: 1 !important;
    text-align: center !important;
}*/

/* Ensure the reset password button has a fixed width */
/*.logon-toolbar .dxbl-btn-group:not(.dxbl-btn-group-first):not(.dxbl-toolbar-hidden-item):has(.full-width-button) {*/
.logon-toolbar .dxbl-btn-group:has(.logon-reset-password) {
    width: 32px !important; /* or 24px if you prefer */
    padding: 0 !important;
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-shrink: 0 !important; /*Prevent the button from shrinking */
}

/* Ensure the button groups align correctly */
/*.logon-toolbar .dxbl-btn-group {
    display: flex !important;
    align-items: center !important;
}*/
/*

.logon-toolbar .dxbl-btn-group-first {
    flex-grow: 1 !important;
    display: flex !important;
    align-items: center !important;
}

.logon-toolbar .dxbl-toolbar-group {
    display: flex !important;
    align-items: center !important;
}*/
/* Prevent ellipsis item from taking space */
.logon-toolbar .dxbl-toolbar-hidden-item {
    flex-grow: 0 !important;
    flex-shrink: 0 !important;
    width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    display: none !important;
}

.header-right-side,
.xaf-sidebar {
    background-color: #4264A1;
    color: #e9f1f8;
}

    .xaf-sidebar .dxbl-expandable-container {
        background-color: #4264A1;
    }

        .xaf-sidebar .dxbl-expandable-container .xaf-nav-link {
            color: #e9f1f8;
        }

.postulacionactividad-instruccciones-field .dxbl-fl-ctrl .listview-html-cell {
    font-size: 0.8rem;
    font-style: italic;
    margin-top: -10px;
    margin-left: 5px;
    font-weight: 500;
    text-align: left;
    color: #4264A1;
    font-weight: 600;
}

.postulacionactividad-etiqueta-creditos-field .dxbl-fl-ctrl .listview-html-cell {
    font-size: 0.6rem;
    margin-top: -10px;
    margin-left: 5px;
    font-weight: 400;
    text-align: left;
    color: #4264A1;
    
}

.postulacion-validacion-titulo .listview-html-cell {
    color: #ff0000;
    text-align: left;
    font-weight: 500;
}
.password-recovery {
    font-size: 0.75rem;
}



/*button[data-action-name="Certificar"] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #4264a1;
    color: #e9f1f8;
    padding: 5px 25px 5px 25px;
}*/

/* Ensure the image and text are on separate lines */
/*button[data-action-name="Certificar"] img {
    display: block;
    margin: 0 auto;
}*/

@media (max-width: 567px) {
    /* Ensure the body or main container allows scrolling */
    html, body {
        overflow-y: auto; /* Enable vertical scroll */
        height: 100%; /* Ensure full height */
    }

    /* Adjust the footer behavior */
    footer {
        position: static !important; /* Remove sticky behavior */
        margin-top: auto !important; /* Allow it to be pushed down */
        overflow-y: auto !important; /* Enable vertical scroll */
    }

    /* Ensure the main content fills the remaining space */
    main {
        flex-grow: 1;
        overflow-y: auto !important; /* Ensure scrolling within the main content */
    }

    /* Adjust other containers as needed */
    .container, .content {
        height: auto; /* Ensure the content doesn't overflow */
        overflow-y: auto; /* Allow vertical scrolling */
    }

    .header-especialidad {
        font-size: 1.1rem;
    }

    .header-especialidad::before {
        content: "\A";
        white-space: pre;
    }

    .xaf-view-caption-lg {
        font-size: 1rem;
    }

    .ceprem-title {
        text-align: center;
    }

    
    @media (max-width: 575.98px) {
        body, .app {
            position: static;
            margin-top: -15px;
        }

        footer {
            margin-bottom: -15px;
            /*margin-top: -15px;*/
            /*}*/
        }
    }
}

/* Optional: add this in your site CSS for extra polish */
.logon-app-info {
    background-color: #4264A1;
    background-image: linear-gradient(rgba(66,100,161,0.8), rgba(66,100,161,0.5)), url("/images/login-background.jpg");
    /*background-image: url("/images/login-background.jpg");*/
    background-repeat: no-repeat, no-repeat;
    /*background-position: right 3em bottom 2em, center center;*/
    background-size: cover, cover;
    color: white;
    min-height: 400px;
    opacity: 0.95; /* Optional for slightly faded look */
    padding: 0;
}
/*.logon-app-info {
    background-image: linear-gradient(rgba(66,100,161,0.8), rgba(66,100,161,0.8)), url('/images/images/login-background.jpg');
    background-size: cover, cover;
    background-position: center, center;
    background-repeat: no-repeat, no-repeat;
    background-color: #4264A1;
    min-height: 100vh;
    width: 100%;
}*/


.header-link {
    display: flex;
    align-items: center;
    text-decoration: none; /* optional, remove underline */
    color: inherit;        /* optional, inherit text color */
}
@media (max-width: 767.98px) {
    .logon-app-info {
        display: none !important;
    }
}

/* Most robust way: Target the icon through its context */
    /*.dxbl-btn.dxbl-btn-text-secondary .dxbl-image {
        color: #AAB9D5 !important;
        color: rgba(66, 100, 161, .45) !important;*/ /* <-- replace with your desired color */
    /*}*/

.dxbl-treeview-item-content .dxbl-btn.dxbl-btn-text-secondary .dxbl-image {
    color: #AAB9D5 !important;
    color: rgba(66, 100, 161, .45) !important; /* or your preferred color */
}

.comentario-moderador .dxbl-fl-ctrl .listview-html-cell::before {
    font-family: "Font Awesome 5 Pro"; /* Or the appropriate version */
    font-weight: 900; /* 900 for solid, 400 for regular, etc. */
    content: "\f071"; /* Unicode for exclamation-triangle (alert) icon */
    margin-right: 0.4em;
    color: #ffae00; /* Alert color, adjust as needed */
    font-size: 1em;
    display: inline-block;
    vertical-align: middle;
}

.comentario-moderador .dxbl-fl-ctrl .listview-html-cell {
    color: #ff0000;
    text-align: left !important;
    padding: 0;
    margin: 0;
    font-size: 0.8rem;
    font-weight: 500;
}

.postulacion-condiciones .listview-html-cell {
    text-align: justify !important;
    line-height: 1.4rem;
}

div.account-main {
    z-index: 1051 !important;
}