/* Style for the tab buttons */
.portfolio-tabs {
    display: flex;
    justify-content: center;
    gap: 10px; /* Space between buttons */
}

.tab-button {
    background-color: transparent; /* Flat background */
    color: #f2f2f2; /* Default text color */
    border: 2px solid transparent; /* No border visible by default */
    padding: 10px 20px; /* Space inside buttons */
    font-size: 16px;
    cursor: pointer; /* Pointer cursor on hover */
    text-transform: uppercase;
    transition: all 0.3s ease; /* Smooth transition for hover and active states */
}

.tab-button:hover {
    color: #fff; /* White text color on hover */
    background-color: #333; /* Dark background on hover */
    border-color: #333; /* Border color on hover */
}

.tab-button.active {
    color: #fff; /* White text color for the active button */
    background-color: #333; /* Dark background for active button */
    border-color: #333; /* Border color for active button */
}