/* MPMH_FRONTCONV053 — CAUSE/BRAND DIRECTORY ONE-ROW CONTROL CONVERGENCE
   Late presentation owner only. FRONTCONV052 repaired the shared directory toolbar's real geometry;
   this pass intentionally collapses the FRONTCONV045 VIEW / ORDER / SORT BY row wrappers into one
   invariant-height sticky rail. The underlying controls, sort semantics, routes, table logic, card
   identity, tracking, Signal behavior and data authority are unchanged. If the rail is narrower
   than its content, it scrolls horizontally instead of wrapping and changing sticky height. */

:root{
  --fc053-blue:#071c2c;
  --fc053-line:rgba(126,199,238,.28);
  --fc053-line-soft:rgba(126,199,238,.15);
  --fc053-sky:#72c9f1;
  --fc053-green:#16f19b;
  --fc053-muted:#8d9ba6;
}

@media(min-width:981px){
  html.mpmh-frontconv053 body #publicShell #shellMain .brands-discovery-panel
  .brand-sort-strip.mpmh240-directory-controls.mpmh045-control-deck,
  html.mpmh-frontconv053 body #publicShell #shellMain .causes-discovery-panel
  .cause-sort-strip.mpmh240-directory-controls.mpmh045-control-deck{
    position:sticky!important;
    top:0!important;
    z-index:24!important;
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    align-content:center!important;
    justify-content:flex-start!important;
    gap:0!important;
    width:100%!important;
    height:40px!important;
    min-height:40px!important;
    max-height:40px!important;
    margin:0 0 8px!important;
    padding:0 14px!important;
    box-sizing:border-box!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    overscroll-behavior-x:contain!important;
    scrollbar-width:none!important;
    -ms-overflow-style:none!important;
    background:var(--fc053-blue)!important;
    background-image:none!important;
    border-top:1px solid var(--fc053-line-soft)!important;
    border-right:0!important;
    border-bottom:1px solid var(--fc053-line)!important;
    border-left:0!important;
    border-radius:0!important;
    box-shadow:0 3px 8px rgba(0,0,0,.12)!important;
    white-space:nowrap!important;
  }
  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck::-webkit-scrollbar{
    width:0!important;
    height:0!important;
    display:none!important;
  }

  /* Flatten the historical primary/secondary wrappers without removing their
     semantics from markup. Their direct children become one flex-row sequence. */
  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck .mpmh045-control-row,
  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck .mpmh045-control-row-primary,
  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck .mpmh045-control-row-secondary{
    display:contents!important;
    position:static!important;
    inset:auto!important;
    transform:none!important;
    translate:none!important;
    width:auto!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck .mpmh045-control-group,
  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck .mpmh045-control-route{
    position:static!important;
    inset:auto!important;
    transform:none!important;
    translate:none!important;
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:flex-start!important;
    flex:0 0 auto!important;
    gap:4px!important;
    width:auto!important;
    height:34px!important;
    min-width:0!important;
    min-height:34px!important;
    max-height:34px!important;
    margin:0!important;
    padding:0 12px!important;
    overflow:visible!important;
    background:transparent!important;
    border-top:0!important;
    border-right:0!important;
    border-bottom:0!important;
    border-left:1px solid var(--fc053-line-soft)!important;
    box-shadow:none!important;
  }
  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck .mpmh045-view-group{
    padding-left:0!important;
    border-left:0!important;
  }
  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck .mpmh045-order-group,
  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck .mpmh045-sort-group{
    flex:0 0 auto!important;
  }
  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck .mpmh045-control-route{
    margin-left:auto!important;
    padding-right:0!important;
  }

  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck .mpmh045-control-label{
    position:static!important;
    transform:none!important;
    translate:none!important;
    display:inline-flex!important;
    align-items:center!important;
    flex:0 0 auto!important;
    width:auto!important;
    height:34px!important;
    min-width:0!important;
    min-height:34px!important;
    margin:0 2px 0 0!important;
    padding:0!important;
    color:var(--fc053-sky)!important;
    font-size:8.5px!important;
    line-height:1!important;
    font-weight:900!important;
    letter-spacing:.105em!important;
    text-transform:uppercase!important;
    white-space:nowrap!important;
    opacity:1!important;
    visibility:visible!important;
  }

  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck .mpmh240-view-selector,
  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck .mpmh240-sort-options{
    position:static!important;
    inset:auto!important;
    transform:none!important;
    translate:none!important;
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:0!important;
    flex:0 0 auto!important;
    width:auto!important;
    height:34px!important;
    min-width:0!important;
    min-height:34px!important;
    max-height:34px!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    opacity:1!important;
    visibility:visible!important;
    clip:auto!important;
    clip-path:none!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }

  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck .mpmh240-toolbar-option{
    position:relative!important;
    inset:auto!important;
    transform:none!important;
    translate:none!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex:0 0 auto!important;
    width:auto!important;
    height:30px!important;
    min-width:0!important;
    min-height:30px!important;
    max-height:30px!important;
    margin:0!important;
    padding:0 9px!important;
    box-sizing:border-box!important;
    overflow:visible!important;
    color:var(--fc053-muted)!important;
    font-size:9px!important;
    line-height:1!important;
    font-weight:800!important;
    letter-spacing:.03em!important;
    white-space:nowrap!important;
    text-indent:0!important;
    opacity:1!important;
    visibility:visible!important;
    clip:auto!important;
    clip-path:none!important;
    background:transparent!important;
    background-image:none!important;
    border-top:0!important;
    border-right:0!important;
    border-bottom:0!important;
    border-left:1px solid rgba(126,199,238,.12)!important;
    border-radius:0!important;
    box-shadow:none!important;
    outline-offset:-2px!important;
  }
  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck .mpmh240-toolbar-option:first-child{
    border-left:0!important;
  }
  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck .mpmh240-toolbar-option:not(.active):hover,
  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck .mpmh240-toolbar-option:not(.active):focus-visible{
    color:var(--fc053-sky)!important;
    background:rgba(114,201,241,.045)!important;
    outline:1px solid rgba(114,201,241,.32)!important;
  }
  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck .mpmh240-toolbar-option.active,
  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck .mpmh240-toolbar-option[aria-pressed="true"]{
    color:var(--fc053-green)!important;
    background:rgba(22,241,155,.025)!important;
  }

  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck .mpmh292-brand-category-route{
    padding-left:11px!important;
    padding-right:0!important;
    color:var(--fc053-sky)!important;
  }
}

/* Tablet/mobile keep the prior responsive contract rather than forcing a
   desktop-density rail into a viewport where the existing mobile controls own. */
@media(max-width:980px){
  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck{
    scrollbar-width:none!important;
  }
  html.mpmh-frontconv053 body #publicShell #shellMain .mpmh045-control-deck::-webkit-scrollbar{
    display:none!important;
  }
}