/* Custom Tabs for Search / Circular Shared Layout */
#searchtab {
    border-bottom: 0;
    margin-bottom: 0;
    gap: 0;
    padding-bottom: 0;
    margin-top: -5px;
    background-color: transparent !important;
}

#searchtab .nav-item {
    padding: 0;
    margin: 0;
    overflow: visible; /* Important for overlapping */
}

#searchtab .nav-link {
    border: none;
    
    /* SVG Background Style - Dark Gray Gradient for Inactive */
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='555' height='44' viewBox='0 0 555 44' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 1C3.6863 1 1 3.68629 1 7V37C1 40.3137 3.68629 43 7 43H547C551.810 42.9997 554.664 37.6221 551.969 33.6377L531.673 3.6377C530.557 1.9884 528.696 1.00013 526.704 1H7Z' fill='url(%23paint1_linear)' stroke='black' stroke-width='2'/%3E%3Cdefs%3E%3ClinearGradient id='paint1_linear' x1='277.5' y1='2' x2='277.5' y2='42' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0.35' stop-color='%231E1E1E'/%3E%3Cstop offset='1' stop-color='black'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E");
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-color: transparent !important;
    
    color: #999; /* Inactive text color */
    text-align: center;
    font-weight: normal;
    position: relative;
    padding: 0 40px 0 20px; /* Padding for shape */
    height: 44px;
    line-height: 44px; /* Vertically center */
    width: 100%;
    
    /* Remove old shape/border */
    border-radius: 0;
    transform: none;
    clip-path: none;
    
    margin-right: -30px; /* Stronger overlap for前後感 */
    z-index: 1;
}


#searchtab .nav-link span {
    /* Reset text transform */
    transform: none;
    display: inline-block;
    width: 100%;
}

/* Fix first tab alignment */
#searchtab .nav-item:first-child .nav-link {
   margin-left: 0;
   z-index: 10;
}

#searchtab .nav-item:last-child .nav-link {
    margin-left: 0; 
    z-index: 5;
}

/* Active State */
#searchtab .nav-link.active {
    color: #fff;
    /* Red SVG for active state */
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='555' height='44' viewBox='0 0 555 44' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 1C3.6863 1 1 3.68629 1 7V37C1 40.3137 3.68629 43 7 43H547C551.810 42.9997 554.664 37.6221 551.969 33.6377L531.673 3.6377C530.557 1.9884 528.696 1.00013 526.704 1H7Z' fill='url(%23paint0_linear)' stroke='black' stroke-width='2'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear' x1='277.5' y1='2' x2='277.5' y2='42' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0.35' stop-color='%237B0205'/%3E%3Cstop offset='1' stop-color='black'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E");
    z-index: 20;
}

#searchtab .nav-link:hover {
    color: #fff;
}

#searchtab-tabContent {
    background-color: #000 !important;
    border: none;
    color: #fff;
    margin-top: -1px; /* Remove gap */
}