/* vSAFE-27R9S — Public supplier logo + notification overlay/scroll repair */

/* Company logo replaces the initials on public Supplier cards/profile hero. */
.sf-public-company-avatar{
  position:relative;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 auto;
  overflow:hidden!important;
  box-sizing:border-box;
  background:#fff!important;
  color:#08245c!important;
  border:1px solid rgba(217,231,245,.95)!important;
  box-shadow:0 12px 30px rgba(7,26,51,.14)!important;
}
.sf-public-company-avatar img{
  display:block;
  width:100%!important;
  height:100%!important;
  padding:7px;
  box-sizing:border-box;
  object-fit:contain!important;
  object-position:center!important;
  background:#fff!important;
}
.sf-public-company-avatar__fallback{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  font:850 24px/1 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  color:#fff;
  background:linear-gradient(135deg,#08245c 0%,#126dff 64%,#20c7ff 100%);
}
.sf-public-company-avatar__fallback[hidden]{display:none!important}
.supplier-profile-avatar{
  width:72px!important;
  height:72px!important;
  min-width:72px!important;
  border-radius:19px!important;
  border:2px solid rgba(255,255,255,.72)!important;
}
.supplier-directory-avatar{
  width:58px!important;
  height:58px!important;
  min-width:58px!important;
  border-radius:16px!important;
}

/* Keep navigation and the notification panel above every public hero/banner. */
body.public-context .topline{position:relative;z-index:12000}
body.public-context .navbar,
body.public-context .premium-navbar{
  position:relative!important;
  z-index:12010!important;
  overflow:visible!important;
  isolation:isolate;
}
body.public-context .navbar .nav-inner,
body.public-context .premium-navbar .nav-inner,
body.public-context .navbar .nav-actions,
body.public-context .premium-navbar .nav-actions{
  position:relative!important;
  overflow:visible!important;
}
body.public-context .top-notification,
body.dashboard-context .top-notification{
  position:relative!important;
  z-index:12040!important;
}
body.public-context .top-notification-panel,
body.dashboard-context .top-notification-panel{
  z-index:12060!important;
  overflow:hidden!important;
  max-height:min(560px,calc(100vh - 96px))!important;
  isolation:isolate;
}
body.public-context .top-notification-list,
body.dashboard-context .top-notification-list{
  display:block!important;
  max-height:min(390px,calc(100vh - 245px))!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:#b9c8db transparent;
  -webkit-overflow-scrolling:touch;
}
body.public-context .top-notification-list::-webkit-scrollbar,
body.dashboard-context .top-notification-list::-webkit-scrollbar{width:8px}
body.public-context .top-notification-list::-webkit-scrollbar-thumb,
body.dashboard-context .top-notification-list::-webkit-scrollbar-thumb{
  background:#c7d4e4;
  border-radius:999px;
  border:2px solid #fff;
}
body.public-context .top-notification-panel .top-notification-head,
body.public-context .top-notification-panel .top-notification-foot,
body.dashboard-context .top-notification-panel .top-notification-head,
body.dashboard-context .top-notification-panel .top-notification-foot{
  position:relative;
  z-index:2;
  background:#fff;
}
body.public-context .page-hero,
body.public-context .supplier-hero-premium,
body.public-context main,
body.public-context .section{
  position:relative;
  z-index:1;
}

/* Public-page bell uses the same usable dropdown behavior as the dashboard. */
body.public-context .top-notification-panel{
  right:0!important;
  top:calc(100% + 12px)!important;
  width:min(380px,calc(100vw - 24px))!important;
  border-radius:20px!important;
  box-shadow:0 26px 72px rgba(7,26,51,.28)!important;
}
body.public-context .top-notification-item{
  min-width:0;
}
body.public-context .top-notification-item div{
  min-width:0;
}

@media (max-width:760px){
  .supplier-profile-avatar{
    width:64px!important;
    height:64px!important;
    min-width:64px!important;
    border-radius:17px!important;
  }
  body.public-context .top-notification-panel,
  body.dashboard-context .top-notification-panel{
    position:fixed!important;
    top:74px!important;
    right:12px!important;
    left:auto!important;
    width:min(390px,calc(100vw - 24px))!important;
    max-height:calc(100vh - 88px)!important;
  }
  body.public-context .top-notification-panel:before,
  body.dashboard-context .top-notification-panel:before{display:none!important}
  body.public-context .top-notification-list,
  body.dashboard-context .top-notification-list{
    max-height:calc(100vh - 245px)!important;
  }
}