/* Default tab button styling */
.components-tab-panel__tabs-item {
    border: 2px solid transparent;
    background-color: #f8f8f8;
    color: #333;
    padding: 0;
    border-radius: 5px;
    font-size: 18px;
    transition: all 0.3s ease;
    margin: 5px;
    height: 32px!important;
    width: 32px!important;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Active tab styling */
.components-tab-panel__tabs-item.active-tab {
    border: 2px solid #007cba; /* Blue border for active tab */
    background-color: #e7f5ff; /* Light blue background */
    color: #007cba; /* Change text color */
    font-weight: bold;
}

/* Hover effect for better UX */
.components-tab-panel__tabs-item:hover {
    border: 2px solid #005f8d; /* Darker blue border */
    background-color: #f0faff; /* Lighter blue background */
    color: #005f8d;
    cursor: pointer;
}