/* Next Big Domain 0.64.0
   Focused correction: preserve the approved hero dashboard contrast and turn the
   workspace left rail into a true full-height application column with persistent navigation. */

/* --------------------------------------------------------------------------
   HERO: keep the product panel clearly visible.
   0.63 blended too much of the dashboard into white. The approved reference
   has a light office scene behind a fully legible dark application rail.
   -------------------------------------------------------------------------- */
@media (min-width:1121px){
  .nbd-ref-hero{
    min-height:660px!important;
    background:#fff!important;
  }
  .nbd-ref-hero-bg{
    background:
      linear-gradient(90deg,rgba(255,255,255,.995) 0%,rgba(255,255,255,.985) 35%,rgba(255,255,255,.72) 48%,rgba(255,255,255,.10) 72%,rgba(255,255,255,0) 100%),
      url('brand/nbd-saas-ambient.webp') center/cover no-repeat!important;
  }
  .nbd-ref-hero-grid{
    min-height:660px!important;
    padding:54px 0 38px!important;
  }
  .nbd-ref-hero-copy{
    width:min(45.5%,680px)!important;
    max-width:680px!important;
    padding-top:20px!important;
  }
  .nbd-ref-dashboard-shot--reference{
    top:0!important;
    bottom:0!important;
    right:clamp(-150px,calc((1510px - 100vw)/2),-18px)!important;
    width:min(57vw,1060px)!important;
    height:100%!important;
    overflow:hidden!important;
  }
  .nbd-ref-hero-product-image{
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    object-fit:cover!important;
    object-position:right center!important;
    transform:none!important;
    filter:none!important;
    /* Only feather the first few percent of the photograph. The dark dashboard
       rail begins after this transition and therefore remains fully legible. */
    -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.72) 4%,#000 8%,#000 100%)!important;
    mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.72) 4%,#000 8%,#000 100%)!important;
  }
  .nbd-ref-dashboard-shot--reference::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    z-index:2!important;
    inset:0 auto 0 0!important;
    width:7%!important;
    background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.46) 38%,rgba(255,255,255,0) 100%)!important;
    pointer-events:none!important;
  }
}

@media (min-width:1121px) and (max-width:1380px){
  .nbd-ref-hero-copy{width:min(46.5%,620px)!important}
  .nbd-ref-dashboard-shot--reference{width:min(58vw,920px)!important;right:-34px!important}
  .nbd-ref-hero-product-image{object-position:72% center!important}
}

/* --------------------------------------------------------------------------
   WORKSPACE: full-height dark rail + persistent inner menu.
   The aside itself now stretches to the full height of the app content. Only
   its inner stack is sticky. This gives a continuous navy application rail all
   the way down the page AND keeps navigation in view while content scrolls.
   -------------------------------------------------------------------------- */
@media (min-width:1121px){
  body .nbdm-workspace .nbdm-workspace-layout{
    align-items:stretch!important;
    overflow:visible!important;
    background:#f7f9fc!important;
    border:1px solid #d8e3ef!important;
    border-radius:22px!important;
    box-shadow:0 26px 70px rgba(24,63,105,.10)!important;
  }
  body .nbdm-workspace .nbdm-workspace-sidebar{
    position:relative!important;
    top:auto!important;
    align-self:stretch!important;
    min-height:100%!important;
    max-height:none!important;
    height:auto!important;
    overflow:visible!important;
    padding:0!important;
    border:0!important;
    border-radius:22px 0 0 22px!important;
    background:linear-gradient(180deg,#071d35 0%,#071a30 100%)!important;
    box-shadow:none!important;
  }
  body .nbdm-workspace .nbdm-workspace-sidebar-inner{
    position:sticky!important;
    top:calc(var(--wp-admin--admin-bar--height,0px) + 14px)!important;
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    max-height:calc(100dvh - var(--wp-admin--admin-bar--height,0px) - 28px)!important;
    padding:20px 14px 18px!important;
    overflow:hidden!important;
  }
  body .nbdm-workspace .nbdm-workspace-sidebar-inner .nbdm-app-brand{
    flex:0 0 auto!important;
    height:40px!important;
    margin:0 9px 12px!important;
  }
  body .nbdm-workspace .nbdm-workspace-sidebar-inner .nbdm-app-brand img{
    width:174px!important;
    max-height:32px!important;
  }
  body .nbdm-workspace .nbdm-workspace-sidebar-inner .nbdm-workspace-nav{
    flex:0 1 auto!important;
    min-height:0!important;
    display:grid!important;
    align-content:start!important;
    gap:10px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding:0 2px 4px 0!important;
    scrollbar-width:thin!important;
    scrollbar-color:rgba(164,193,220,.30) transparent!important;
  }
  body .nbdm-workspace .nbdm-workspace-sidebar-inner .nbdm-workspace-nav::-webkit-scrollbar{width:4px!important}
  body .nbdm-workspace .nbdm-workspace-sidebar-inner .nbdm-workspace-nav::-webkit-scrollbar-thumb{background:rgba(164,193,220,.30)!important;border-radius:999px!important}
  body .nbdm-workspace .nbdm-nav-group{gap:2px!important}
  body .nbdm-workspace .nbdm-nav-group h2{
    margin:0 10px 4px!important;
    font-size:8.5px!important;
    line-height:1.2!important;
  }
  body .nbdm-workspace .nbdm-workspace-nav a{
    min-height:38px!important;
    padding:6px 11px!important;
    gap:11px!important;
    border-radius:9px!important;
    font-size:12.5px!important;
    line-height:1.15!important;
  }
  body .nbdm-workspace .nbdm-workspace-nav a svg{
    width:17px!important;
    height:17px!important;
    flex-basis:17px!important;
  }
  body .nbdm-workspace .nbdm-workspace-content{
    min-height:max(790px,100%)!important;
    border:0!important;
    border-radius:0 22px 22px 0!important;
    background:#f7f9fc!important;
    box-shadow:none!important;
  }
  body .nbdm-workspace .nbdm-app-toolbar{
    top:calc(var(--wp-admin--admin-bar--height,0px) + 14px)!important;
    border-radius:0 22px 0 0!important;
  }
}

/* Most laptops are not tall enough for the earlier generous menu spacing.
   Keep every destination visible before resorting to the rail's own scrollbar. */
@media (min-width:1121px) and (max-height:900px){
  body .nbdm-workspace .nbdm-workspace-sidebar-inner{padding-top:13px!important;padding-bottom:12px!important}
  body .nbdm-workspace .nbdm-workspace-sidebar-inner .nbdm-app-brand{height:34px!important;margin-bottom:7px!important}
  body .nbdm-workspace .nbdm-workspace-sidebar-inner .nbdm-app-brand img{width:158px!important;max-height:28px!important}
  body .nbdm-workspace .nbdm-workspace-sidebar-inner .nbdm-workspace-nav{gap:6px!important}
  body .nbdm-workspace .nbdm-nav-group h2{margin-bottom:2px!important;font-size:8px!important}
  body .nbdm-workspace .nbdm-workspace-nav a{min-height:34px!important;padding:5px 10px!important;font-size:12px!important}
  body .nbdm-workspace .nbdm-workspace-nav a svg{width:16px!important;height:16px!important;flex-basis:16px!important}
}

@media (min-width:1121px) and (max-height:740px){
  body .nbdm-workspace .nbdm-workspace-sidebar-inner{padding-top:9px!important;padding-bottom:8px!important}
  body .nbdm-workspace .nbdm-workspace-sidebar-inner .nbdm-app-brand{height:30px!important;margin-bottom:4px!important}
  body .nbdm-workspace .nbdm-workspace-sidebar-inner .nbdm-app-brand img{width:146px!important;max-height:25px!important}
  body .nbdm-workspace .nbdm-workspace-sidebar-inner .nbdm-workspace-nav{gap:3px!important}
  body .nbdm-workspace .nbdm-nav-group h2{margin-bottom:1px!important;font-size:7.5px!important}
  body .nbdm-workspace .nbdm-workspace-nav a{min-height:31px!important;padding:4px 9px!important;font-size:11.5px!important}
  body .nbdm-workspace .nbdm-workspace-nav a svg{width:15px!important;height:15px!important;flex-basis:15px!important}
}

/* Tablet/mobile revert to the compact responsive navigation and do not inherit
   the desktop sticky-inner behaviour. */
@media (max-width:1120px){
  body .nbdm-workspace .nbdm-workspace-sidebar-inner{
    position:static!important;
    top:auto!important;
    display:block!important;
    max-height:none!important;
    padding:0!important;
    overflow:visible!important;
  }
  body .nbdm-workspace .nbdm-workspace-sidebar-inner .nbdm-workspace-nav{overflow:visible!important}
}