/* Section navigation only. Profile tabs and page backgrounds keep their styles. */
html body.social-page :is(
 #socialGrid .generation-logo-workspace[data-generator-shell="stable"] [data-fixed-generation-tabs],
 #canalaiMusic .music-result-tabs,
 #canalaiSubscriptionTabs,
 #canalaiNotificationTabs,
 #canalaiMobileNotificationTabs
){
 --section-tab-text:#6b7280;
 --section-tab-active:#111827;
 --section-tab-line:#d1d5db;
 position:relative!important;
 align-items:stretch!important;
 flex-wrap:nowrap!important;
 border-bottom:0!important;
 box-shadow:inset 0 -1px 0 var(--section-tab-line)!important;
}

html.social-dark body.social-page :is(
 #socialGrid .generation-logo-workspace[data-generator-shell="stable"] [data-fixed-generation-tabs],
 #canalaiMusic .music-result-tabs,
 #canalaiSubscriptionTabs,
 #canalaiNotificationTabs,
 #canalaiMobileNotificationTabs
),
html body.social-page.social-dark :is(
 #socialGrid .generation-logo-workspace[data-generator-shell="stable"] [data-fixed-generation-tabs],
 #canalaiMusic .music-result-tabs,
 #canalaiSubscriptionTabs,
 #canalaiNotificationTabs,
 #canalaiMobileNotificationTabs
){
 --section-tab-text:#9ca3af;
 --section-tab-active:#f3f4f6;
 --section-tab-line:#343b45;
}

html body.social-page :is(
 #socialGrid .generation-logo-workspace[data-generator-shell="stable"] [data-fixed-generation-tabs],
 #canalaiMusic .music-result-tabs,
 #canalaiSubscriptionTabs,
 #canalaiNotificationTabs,
 #canalaiMobileNotificationTabs
) > button{
 position:relative;
 flex-shrink:0;
 align-self:stretch;
 color:var(--section-tab-text)!important;
 font-size:14px!important;
 font-weight:400!important;
 /* Move the label down 5px, keeping total padding and the underline in place. */
 padding-top:5px!important;
 padding-bottom:2px!important;
 border-bottom:0!important;
 background-color:transparent!important;
 background-image:none!important;
 box-shadow:none!important;
}

/* Music tabs originally use 2px above and 12px below the label. */
html body.social-page #canalaiMusic .music-result-tabs > button{
 padding-top:7px!important;
 padding-bottom:7px!important;
}

/* One underline replaces both legacy borders and the music-tab pseudo-element. */
html body.social-page :is(
 #socialGrid .generation-logo-workspace[data-generator-shell="stable"] [data-fixed-generation-tabs],
 #canalaiMusic .music-result-tabs,
 #canalaiSubscriptionTabs,
 #canalaiNotificationTabs,
 #canalaiMobileNotificationTabs
) > button::after{
 content:"";
 position:absolute;
 left:0;
 right:0;
 bottom:0;
 height:1px!important;
 background:transparent!important;
 pointer-events:none;
}

html body.social-page :is(
 #socialGrid .generation-logo-workspace[data-generator-shell="stable"] [data-fixed-generation-tabs],
 #canalaiMusic .music-result-tabs,
 #canalaiSubscriptionTabs,
 #canalaiNotificationTabs,
 #canalaiMobileNotificationTabs
) > button:is(.active,[aria-current="page"]){
 color:var(--section-tab-active)!important;
 font-weight:600!important;
}

html body.social-page :is(
 #socialGrid .generation-logo-workspace[data-generator-shell="stable"] [data-fixed-generation-tabs],
 #canalaiMusic .music-result-tabs,
 #canalaiSubscriptionTabs,
 #canalaiNotificationTabs,
 #canalaiMobileNotificationTabs
) > button:is(.active,[aria-current="page"])::after{
 background:var(--section-tab-active)!important;
}

html body.social-page :is(
 #socialGrid .generation-logo-workspace[data-generator-shell="stable"] [data-fixed-generation-tabs],
 #canalaiMusic .music-result-tabs,
 #canalaiSubscriptionTabs,
 #canalaiNotificationTabs,
 #canalaiMobileNotificationTabs
) > button:hover{
 color:var(--section-tab-active)!important;
}
