/* SaleGo UI Runtime Shell — Phase 3 */
:root{
  --sg-shell-top-h: 72px;
  --sg-shell-side-w: 280px;
  --sg-shell-side-collapsed-w: 84px;
  --sg-shell-content-max: none;
  --sg-shell-section-gap: 18px;
  --sg-shell-page-pad-x: 18px;
  --sg-shell-page-pad-y: 18px;
  --sg-shell-shell-gap: 0px;
  --sg-shell-radius: 18px;
  --sg-shell-top-gap: 14px;
  --sg-shell-card-gap: 12px;
  --sg-shell-pagehead-gap: 8px;
  --sg-shell-content-width: minmax(0, 1fr);
  --sg-shell-sidebar-pad: 14px;
  --sg-shell-sidebar-brand-pad: 12px;
  --sg-shell-sidebar-quick-gap: 12px;
  --sg-shell-sidebar-nav-gap: 10px;
  --sg-shell-sidebar-sticky-top: 0px;
  --sg-shell-sidebar-scrollbar-w: 10px;
  --sg-shell-top-radius: 18px;
  --sg-shell-content-radius: 18px;
  --sg-shell-mobile-drawer-w: min(88vw, 320px);
}

.sg-body{
  background: var(--sg-app-bg);
  color: var(--sg-text);
  font: 400 var(--sg-font-size-body)/var(--sg-line-height-body) var(--sg-font-family);
}

.sg-admin{
  min-height:100vh;
  display:grid;
  grid-template-columns: var(--sg-shell-side-w) var(--sg-shell-content-width);
  gap:var(--sg-shell-shell-gap);
  background:
    radial-gradient(circle at top right, color-mix(in srgb, var(--sg-primary-soft) 92%, transparent) 0, transparent 34%),
    linear-gradient(180deg, color-mix(in srgb, var(--sg-surface-muted) 78%, transparent), transparent 28%),
    var(--sg-app-bg);
}

.sg-side{
  width:var(--sg-shell-side-w);
  min-width:var(--sg-shell-side-w);
  min-height:100vh;
  position:sticky;
  top:var(--sg-shell-sidebar-sticky-top);
  align-self:start;
  padding:var(--sg-shell-sidebar-pad);
  overflow-y:auto;
}

.sg-side-brand{padding:var(--sg-shell-sidebar-brand-pad);}
.sg-side-quick{margin-top:var(--sg-shell-sidebar-quick-gap);}
.sg-side-navwrap{margin-top:var(--sg-shell-sidebar-nav-gap);padding-right:4px;}

.sg-top{
  min-height:var(--sg-shell-top-h);
  padding:14px var(--sg-shell-page-pad-x);
  position:sticky;
  top:0;
  z-index:var(--sg-z-topbar,24);
}

.sg-main{
  min-width:0;
  display:grid;
  grid-template-rows:auto 1fr;
}

.sg-content{
  max-width:var(--sg-shell-content-max);
  min-width:0;
  padding:var(--sg-shell-page-pad-y) var(--sg-shell-page-pad-x) calc(var(--sg-shell-page-pad-y) + 8px);
}

.sg-content > *, .sg-page, .sg-page > *{min-width:0;}
.sg-pagehead,.sg-toolbar,.sg-section{min-width:0;}

.sg-page{display:grid;gap:var(--sg-shell-section-gap);}
.sg-pagehead{display:grid;gap:var(--sg-shell-pagehead-gap);margin:0 0 var(--sg-shell-section-gap);}
.sg-pagehead-title{margin:0;font-size:clamp(22px,2vw,28px);line-height:1.15;font-weight:800;color:var(--sg-text);}
.sg-pagehead-subtitle{margin:0;color:var(--sg-muted);line-height:1.65;}
.sg-toolbar{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 var(--sg-shell-section-gap);}
.sg-section{display:grid;gap:12px;margin:0 0 var(--sg-shell-section-gap);}
.sg-breadcrumb{color:var(--sg-shell-breadcrumb-fg);}
.sg-breadcrumb strong,.sg-breadcrumb [aria-current="page"]{color:var(--sg-shell-breadcrumb-current);}

.sg-admin.is-collapsed{grid-template-columns:var(--sg-shell-side-collapsed-w) var(--sg-shell-content-width);}
.sg-admin.is-collapsed .sg-side{width:var(--sg-shell-side-collapsed-w);min-width:var(--sg-shell-side-collapsed-w);}

@media (max-width: 1279px){
  :root{
    --sg-shell-side-w:268px;
    --sg-shell-page-pad-x:16px;
    --sg-shell-top-h:68px;
  }
}

@media (max-width: 991px){
  :root{
    --sg-shell-top-h:64px;
    --sg-shell-page-pad-x:14px;
    --sg-shell-page-pad-y:16px;
    --sg-shell-section-gap:16px;
    --sg-shell-mobile-drawer-w:min(92vw,320px);
  }
  .sg-admin{grid-template-columns:1fr;}
  .sg-main{min-width:0;}
  .sg-side{
    position:fixed;
    top:0;
    left:0;
    width:var(--sg-shell-mobile-drawer-w);
    min-width:var(--sg-shell-mobile-drawer-w);
    z-index:calc(var(--sg-z-modal,1200) - 10);
  }
  .sg-top,.sg-content{padding-inline:var(--sg-shell-page-pad-x);}
}

@media (max-width: 640px){
  :root{
    --sg-shell-top-h:60px;
    --sg-shell-page-pad-x:12px;
    --sg-shell-page-pad-y:14px;
    --sg-shell-section-gap:14px;
    --sg-shell-side-collapsed-w:80px;
  }
}


/* PATCH26A — shell-level sticky guarantee for tablet/mobile */
@media (max-width: 991px){
  .sg-admin,
  .sg-main,
  .sg-content{
    overflow:visible !important;
  }
  .sg-main{
    display:block !important;
    min-width:0 !important;
  }
  .sg-top,
  header.sg-top[data-role="shell-topbar"]{
    position:-webkit-sticky !important;
    position:sticky !important;
    top:0 !important;
    inset-block-start:0 !important;
    z-index:var(--sg-z-topbar,84) !important;
  }
}
