/* VF_SHELL_SIDEBAR_LOGOS_V3
   Desktop navigation = fixed sidebar.
   Mobile navigation = bottom bar + dashboard service grid.
   Asset logos = local SVGs. */

:root{
  --vfp3-sidebar-width:252px;
  --vfp3-sidebar-gap:28px;
}

@media(min-width:931px){
  html body.vf-premium-ui .vf-sidebar,
  html body.vf-premium-ui .vfp-sidebar,
  html body.vf-dashboard-menu-active-v12 .vf-sidebar{
    display:flex !important;
    visibility:visible !important;
    opacity:1 !important;
    pointer-events:auto !important;
    transform:none !important;
  }

  html body.vf-premium-ui .vf-main,
  html body.vf-dashboard-menu-active-v12 .vf-main{
    margin-left:calc(var(--vfp3-sidebar-width) + var(--vfp3-sidebar-gap)) !important;
    width:auto !important;
    max-width:none !important;
  }

  html body.vf-premium-ui .vf-content,
  html body.vf-dashboard-menu-active-v12 .vf-content{
    width:100% !important;
    max-width:1560px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  /* The large service-button launcher is a MOBILE menu only.
     Desktop already has the permanent sidebar. */
  html body.vf-premium-ui .vf-dashboard-menu-v12,
  html body.vf-dashboard-menu-active-v12 .vf-dashboard-menu-v12{
    display:none !important;
  }

  html body.vf-premium-ui .vf-mobile-nav,
  html body.vf-premium-ui .vfp-mobile-nav,
  html body.vf-premium-ui .mobile-nav{
    display:none !important;
  }

  /* Legacy/custom pages that do not have .vf-main receive an explicit body offset. */
  html body.vf-premium-ui.vfp3-body-offset{
    padding-left:calc(var(--vfp3-sidebar-width) + var(--vfp3-sidebar-gap)) !important;
  }

  html body.vf-premium-ui.vfp3-body-offset .vf-topbar,
  html body.vf-premium-ui.vfp3-body-offset .vfp-topbar{
    width:auto !important;
    max-width:none !important;
  }
}

@media(max-width:930px){
  html body.vf-premium-ui,
  html body.vf-premium-ui.vfp3-body-offset{
    padding-left:0 !important;
  }

  html body.vf-premium-ui .vf-sidebar,
  html body.vf-premium-ui .vfp-sidebar{
    display:none !important;
  }

  html body.vf-premium-ui .vf-main{
    margin-left:0 !important;
  }

  /* Dashboard service buttons stay available on mobile. */
  html body.vf-premium-ui .vf-dashboard-menu-v12{
    display:block !important;
  }
}

/* ---------- Real local asset / network logos ---------- */

body.vf-premium-ui .vfp3-coin-logo{
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  flex:0 0 42px !important;
  display:block !important;
  object-fit:contain !important;
  border-radius:50% !important;
  background:#fff !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.95) inset,
    0 8px 18px rgba(35,48,84,.11) !important;
}

body.vf-premium-ui .asset-logo-wrap.vfp3-logo-holder,
body.vf-premium-ui .asset-icon.vfp3-logo-holder,
body.vf-premium-ui .coin-logo.vfp3-logo-holder{
  width:48px !important;
  height:48px !important;
  min-width:48px !important;
  flex:0 0 48px !important;
  display:grid !important;
  place-items:center !important;
  position:relative !important;
  overflow:visible !important;
  border-radius:16px !important;
  background:transparent !important;
  box-shadow:none !important;
  color:transparent !important;
  font-size:0 !important;
}

body.vf-premium-ui .asset-logo-wrap.vfp3-logo-holder .vfp3-coin-logo,
body.vf-premium-ui .asset-icon.vfp3-logo-holder .vfp3-coin-logo,
body.vf-premium-ui .coin-logo.vfp3-logo-holder .vfp3-coin-logo{
  grid-area:1/1;
}

body.vf-premium-ui .asset-logo-wrap.vfp3-logo-holder .network-badge{
  position:absolute !important;
  right:-5px !important;
  bottom:-4px !important;
  z-index:2 !important;
  color:#4d5872 !important;
  font-size:7px !important;
}

/* Hide legacy letter-only placeholder once a real logo is installed. */
body.vf-premium-ui .vfp3-logo-holder > .asset-logo-fallback,
body.vf-premium-ui .vfp3-logo-holder > .coin-letter,
body.vf-premium-ui .vfp3-logo-holder > .asset-letter{
  display:none !important;
}

@media(max-width:620px){
  body.vf-premium-ui .vfp3-coin-logo{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
  }

  body.vf-premium-ui .asset-logo-wrap.vfp3-logo-holder,
  body.vf-premium-ui .asset-icon.vfp3-logo-holder,
  body.vf-premium-ui .coin-logo.vfp3-logo-holder{
    width:46px !important;
    height:46px !important;
    min-width:46px !important;
  }
}