#tablaCuposEtapas table {
    /* Ensure the table takes full width */
    table-layout: fixed;
}

#tablaCuposEtapas tr {
    display: flex;
    /* Use flexbox for layout */
    flex-direction: row;
    /* Default is row layout */
}

#tablaCuposEtapas td {
    flex: 1;
    /* Allow equal width for cells */
}

#form\\:recaudoactualinfo {
    width: 100%;
    border-collapse: collapse;
    table-layout: auto;
    overflow-x: auto;
}

@media (max-width: 600px) {
    #tablaCuposEtapas tr {
        flex-direction: column;
        /* Stack cells vertically on small screens */
    }

    #tablaCuposEtapas td {
        flex: none;
        /* Adjust flex for stacked layout */
        width: 100%;
        /* Ensure cells take full width */
    }
}

.formRecaudodo3{
    overflow: auto;
}

#form\:carteraVolver {
    position: absolute;
    right: 0;
    margin-right: calc((100vw - 100%) / 2); 
  }

/* Responsive design */
@media screen and (max-width: 768px) {
    #form\\:recaudoactualinfo {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }

    #form\\:recaudoactualinfo tbody tr {
        display: flex;
        flex-wrap: wrap;
    }

    #form\\:recaudoactualinfo tbody tr td {
        flex: 1 1 50%;
        display: inline-block;
        box-sizing: border-box;
    }

    .p_menuprincipal {
        height: min-content;
    }

    div .p_pnlIngreso,
    #out_container {
        position: fixed;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    .p_menu {
        display: flex;
        flex-direction: column;
        /* Stack items vertically */
        align-items: flex-start;
        /* Align items to the start */
        justify-content: space-around;
        /* Distribute menu items evenly */
    }

    .ui-menu-list {
        list-style-type: none;
        /* Remove bullet points */
        padding: 0;
        margin: 0;
    }

    .ui-menuitem {
        display: inline-block;
        /* Show menu items in a line */
        display: block;
        /* Stack items as block elements */
        margin: 5px 0;
        /* Space between items */
        width: 100%;
        /* Make items full width */
    }

    /* Style the links */
    .ui-menuitem-link {
        text-decoration: none;
        padding: 10px 15px;
        display: inline-block;
        /* Make the clickable area larger */
        width: 100%;
        /* Make links full width */
        text-align: left;
        /* Align text to the left */
    }

    .topBarDivRoles {
        width: fit-content;
    }


    .userProfileDiv {
        display: flex;
    }

    .logoutDiv {
        display: flex;
    }

}