/* Styles for Sub-navigation Tabs - Folder Tab Style */

.process-subnav {
    /* Remove background and bottom border from the container */
    /* background-color: #f1f1f1; */
    /* border-bottom: 1px solid #ccc; */
    padding: 0 10px;
    /* Adjust padding */
    margin-bottom: 0;
    /* Remove bottom margin, tabs sit on the line */
    border-bottom: 1px solid #ccc;
    /* Add the bottom line for tabs to sit on */
    margin-top: 0px;
    /* Remove space above the tabs */
    /* Add some space above the tabs */
}

.process-subnav ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
}

.process-subnav li {
    margin-right: 3px;
    /* Small gap between tabs */
    margin-bottom: -1px;
    /* Overlap the container's bottom border */
    position: relative;
    /* Needed for z-index or pseudo-elements if used later */
}

.process-subnav li a {
    display: block;
    padding: 5px 18px;
    /* Reduced top/bottom padding */
    text-decoration: none;
    color: #007bff;
    /* Link color */
    background-color: #e9ecef;
    /* Light grey background for inactive tabs */
    border: 1px solid #ccc;
    border-bottom: none;
    /* Remove bottom border initially */
    border-radius: 5px 5px 0 0;
    /* Rounded top corners */
    transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
}

.process-subnav li a:hover {
    background-color: #dee2e6;
    /* Slightly darker hover */
    color: #0056b3;
    text-decoration: none;
}

/* Style for the active tab */
.process-subnav li.active a {
    color: #495057;
    /* Darker text for active tab */
    background-color: #ffffff;
    /* White background to merge with content area */
    border: 1px solid #ccc;
    border-bottom-color: #ffffff;
    /* White bottom border to blend */
    font-weight: bold;
    position: relative;
    /* Ensure it's above the bottom border */
    z-index: 2;
}