/* Desktop page-top navigation only. Reference: production after-sales .tk-page-tabs.
   Existing DOM, icons, routing, active state and permissions stay with each renderer. */
@media (min-width: 769px) {
  :root {
    --wnc-top-tab-primary: #2563eb;
    --wnc-top-tab-text: #1e3a8a;
    --wnc-top-tab-line: #dbeafe;
    --wnc-top-tab-hover: #eff6ff;
  }
  html body :is(#tickets-container .tk-page-tabs,
  #finance-primary-nav,
  #wallet-nav-bar > div,
  .fov-tabs,
  .fps-tabs,
  .fao-funds-tabs,
  .sf-mode-tabs,
  .org-tab-bar,
  .ctv-category-nav,
  .mh-merchant-tabs,
  .dm-tabs,
  .platform-tabs,
  .rov-center-tabs,
  .reno-tabs,
  .sales-tabs,
  .sp-tabs,
  .cs-primary-tabs,
  #dimTabs) {
    display: flex !important; align-items: center !important; flex-wrap: nowrap !important;
    gap: 6px !important; min-height: 36px !important; height: 36px !important;
    padding: 0 !important; border: 0 !important; border-radius: 0 !important;
    background: transparent !important; box-shadow: none !important;
    max-width: 100%; min-width: 0; overflow-x: auto !important; overflow-y: hidden !important;
    scrollbar-width: none;
  }
  html body :is(#tickets-container .tk-page-tabs,
  #finance-primary-nav,
  #wallet-nav-bar > div,
  .fov-tabs,
  .fps-tabs,
  .fao-funds-tabs,
  .sf-mode-tabs,
  .org-tab-bar,
  .ctv-category-nav,
  .mh-merchant-tabs,
  .dm-tabs,
  .platform-tabs,
  .rov-center-tabs,
  .reno-tabs,
  .sales-tabs,
  .sp-tabs,
  .cs-primary-tabs,
  #dimTabs)::-webkit-scrollbar { display: none; }
  html body :is(#tickets-container .tk-page-tabs > .tk-page-tab,
  #finance-primary-nav > .finance-tab-btn,
  #wallet-nav-bar > div > [data-funds-tab],
  .fov-tabs > button,
  .fps-tabs > button,
  .fao-funds-tabs > button,
  .sf-mode-tabs > .sf-mode-tab,
  .org-tab-bar > .org-tab-item,
  .ctv-category-nav > .ctv-category-tab,
  .mh-merchant-tabs > .mh-tab,
  .dm-tabs > .dm-tab,
  .platform-tabs > .pt-tab,
  .rov-center-tabs > button,
  .reno-tabs > button,
  .sales-tabs > .st-tab,
  .sp-tabs > .sp-tab,
  .cs-primary-tabs > .top-tab,
  #dimTabs > .dim-tab) {
    box-sizing: border-box !important; display: inline-flex;
    flex: 0 0 auto !important; align-items: center !important; justify-content: center !important;
    height: 36px !important; min-height: 36px !important; max-height: 36px !important;
    width: auto !important; min-width: 0 !important; margin: 0 !important;
    padding: 0 14px !important; gap: 7px !important;
    border: 1px solid var(--wnc-top-tab-line) !important; border-radius: 9px !important;
    background: #fff !important; background-image: none !important;
    color: var(--wnc-top-tab-text) !important;
    font-family: inherit !important; font-size: 12.5px !important; font-weight: 600 !important;
    line-height: 1 !important; white-space: nowrap !important; text-decoration: none !important;
    box-shadow: none !important; cursor: pointer; transform: none !important;
    transition: background-color .15s, border-color .15s, color .15s !important;
  }
  /* Existing page-level rules use two IDs; preserve the same spacing there. */
  html body #app #page-houses .sf-mode-tabs,
  html body #app #page-house-intake .sf-mode-tabs,
  html body #app #page-vacant .sf-mode-tabs,
  html body #app #page-finance #finance-primary-nav { gap: 6px !important; }
  html body :is(#tickets-container .tk-page-tabs > .tk-page-tab,
  #finance-primary-nav > .finance-tab-btn,
  #wallet-nav-bar > div > [data-funds-tab],
  .fov-tabs > button,
  .fps-tabs > button,
  .fao-funds-tabs > button,
  .sf-mode-tabs > .sf-mode-tab,
  .org-tab-bar > .org-tab-item,
  .ctv-category-nav > .ctv-category-tab,
  .mh-merchant-tabs > .mh-tab,
  .dm-tabs > .dm-tab,
  .platform-tabs > .pt-tab,
  .rov-center-tabs > button,
  .reno-tabs > button,
  .sales-tabs > .st-tab,
  .sp-tabs > .sp-tab,
  .cs-primary-tabs > .top-tab,
  #dimTabs > .dim-tab):hover { background: var(--wnc-top-tab-hover) !important; }
  html body :is(#tickets-container .tk-page-tabs > .tk-page-tab,
  #finance-primary-nav > .finance-tab-btn,
  #wallet-nav-bar > div > [data-funds-tab],
  .fov-tabs > button,
  .fps-tabs > button,
  .fao-funds-tabs > button,
  .sf-mode-tabs > .sf-mode-tab,
  .org-tab-bar > .org-tab-item,
  .ctv-category-nav > .ctv-category-tab,
  .mh-merchant-tabs > .mh-tab,
  .dm-tabs > .dm-tab,
  .platform-tabs > .pt-tab,
  .rov-center-tabs > button,
  .reno-tabs > button,
  .sales-tabs > .st-tab,
  .sp-tabs > .sp-tab,
  .cs-primary-tabs > .top-tab,
  #dimTabs > .dim-tab):is(.active,.on,.act,.selected,.is-active,.fd-current,[aria-selected="true"],[aria-current="page"],[style*="background:var(--primary)"],[style*="background: var(--primary)"]),
  html body :is(#tickets-container .tk-page-tabs > .tk-page-tab,
  #finance-primary-nav > .finance-tab-btn,
  #wallet-nav-bar > div > [data-funds-tab],
  .fov-tabs > button,
  .fps-tabs > button,
  .fao-funds-tabs > button,
  .sf-mode-tabs > .sf-mode-tab,
  .org-tab-bar > .org-tab-item,
  .ctv-category-nav > .ctv-category-tab,
  .mh-merchant-tabs > .mh-tab,
  .dm-tabs > .dm-tab,
  .platform-tabs > .pt-tab,
  .rov-center-tabs > button,
  .reno-tabs > button,
  .sales-tabs > .st-tab,
  .sp-tabs > .sp-tab,
  .cs-primary-tabs > .top-tab,
  #dimTabs > .dim-tab):is(.active,.on,.act,.selected,.is-active,.fd-current,[aria-selected="true"],[aria-current="page"],[style*="background:var(--primary)"],[style*="background: var(--primary)"]):hover {
    background: var(--wnc-top-tab-primary) !important; border-color: var(--wnc-top-tab-primary) !important;
    color: #fff !important; box-shadow: none !important;
  }
  html body :is(#tickets-container .tk-page-tabs > .tk-page-tab,
  #finance-primary-nav > .finance-tab-btn,
  #wallet-nav-bar > div > [data-funds-tab],
  .fov-tabs > button,
  .fps-tabs > button,
  .fao-funds-tabs > button,
  .sf-mode-tabs > .sf-mode-tab,
  .org-tab-bar > .org-tab-item,
  .ctv-category-nav > .ctv-category-tab,
  .mh-merchant-tabs > .mh-tab,
  .dm-tabs > .dm-tab,
  .platform-tabs > .pt-tab,
  .rov-center-tabs > button,
  .reno-tabs > button,
  .sales-tabs > .st-tab,
  .sp-tabs > .sp-tab,
  .cs-primary-tabs > .top-tab,
  #dimTabs > .dim-tab):focus-visible { outline: 2px solid #93c5fd; outline-offset: -3px; }
  html body :is(#tickets-container .tk-page-tabs > .tk-page-tab,
  #finance-primary-nav > .finance-tab-btn,
  #wallet-nav-bar > div > [data-funds-tab],
  .fov-tabs > button,
  .fps-tabs > button,
  .fao-funds-tabs > button,
  .sf-mode-tabs > .sf-mode-tab,
  .org-tab-bar > .org-tab-item,
  .ctv-category-nav > .ctv-category-tab,
  .mh-merchant-tabs > .mh-tab,
  .dm-tabs > .dm-tab,
  .platform-tabs > .pt-tab,
  .rov-center-tabs > button,
  .reno-tabs > button,
  .sales-tabs > .st-tab,
  .sp-tabs > .sp-tab,
  .cs-primary-tabs > .top-tab,
  #dimTabs > .dim-tab)::after { display: none !important; content: none !important; }
  html body :is(#tickets-container .tk-page-tabs > .tk-page-tab,
  #finance-primary-nav > .finance-tab-btn,
  #wallet-nav-bar > div > [data-funds-tab],
  .fov-tabs > button,
  .fps-tabs > button,
  .fao-funds-tabs > button,
  .sf-mode-tabs > .sf-mode-tab,
  .org-tab-bar > .org-tab-item,
  .ctv-category-nav > .ctv-category-tab,
  .mh-merchant-tabs > .mh-tab,
  .dm-tabs > .dm-tab,
  .platform-tabs > .pt-tab,
  .rov-center-tabs > button,
  .reno-tabs > button,
  .sales-tabs > .st-tab,
  .sp-tabs > .sp-tab,
  .cs-primary-tabs > .top-tab,
  #dimTabs > .dim-tab) svg { width: 18px !important; height: 18px !important; flex-shrink: 0; color: inherit !important; }
  html body :is(#tickets-container .tk-page-tabs > .tk-page-tab,
  #finance-primary-nav > .finance-tab-btn,
  #wallet-nav-bar > div > [data-funds-tab],
  .fov-tabs > button,
  .fps-tabs > button,
  .fao-funds-tabs > button,
  .sf-mode-tabs > .sf-mode-tab,
  .org-tab-bar > .org-tab-item,
  .ctv-category-nav > .ctv-category-tab,
  .mh-merchant-tabs > .mh-tab,
  .dm-tabs > .dm-tab,
  .platform-tabs > .pt-tab,
  .rov-center-tabs > button,
  .reno-tabs > button,
  .sales-tabs > .st-tab,
  .sp-tabs > .sp-tab,
  .cs-primary-tabs > .top-tab,
  #dimTabs > .dim-tab) > :is(i,[class*="icon"],.dt-ico) { font-size: 18px !important; color: inherit !important; }
  html body :is(#tickets-container .tk-page-tabs > .tk-page-tab,
  #finance-primary-nav > .finance-tab-btn,
  #wallet-nav-bar > div > [data-funds-tab],
  .fov-tabs > button,
  .fps-tabs > button,
  .fao-funds-tabs > button,
  .sf-mode-tabs > .sf-mode-tab,
  .org-tab-bar > .org-tab-item,
  .ctv-category-nav > .ctv-category-tab,
  .mh-merchant-tabs > .mh-tab,
  .dm-tabs > .dm-tab,
  .platform-tabs > .pt-tab,
  .rov-center-tabs > button,
  .reno-tabs > button,
  .sales-tabs > .st-tab,
  .sp-tabs > .sp-tab,
  .cs-primary-tabs > .top-tab,
  #dimTabs > .dim-tab) > :is(span:not(.pool-count):not([class*="badge"]),.finance-tab-label) { color: inherit !important; }
}

/* Unified desktop line icons. Original icons remain available to mobile. */
.wnc-top-tab-icon{display:none}
@media(min-width:769px){
 html body :is(#app #main-area,#cs-shared-header,.sp-content) [data-wnc-top-icon]{
   min-width:108px!important;width:auto!important;gap:7px!important;padding:0 14px!important;
 }
 html body :is(#app #main-area,#cs-shared-header,.sp-content) [data-wnc-top-icon] .wnc-top-tab-native-icon{display:none!important}
 html body :is(#app #main-area,#cs-shared-header,.sp-content) [data-wnc-top-icon] > svg.wnc-top-tab-icon{
   display:block!important;width:18px!important;height:18px!important;min-width:18px!important;
   flex:0 0 18px!important;color:inherit!important;fill:none!important;stroke:currentColor!important;
   background:transparent!important;opacity:1!important;pointer-events:none!important;
 }
}

@media(min-width:769px){html body #app #main-area #finance-primary-nav > .finance-tab-btn[data-wnc-top-icon]{min-width:108px!important}}
