@scope (.native-shell) {
/* Account-selected rail material, independent of light/dark page surfaces.
   --app-color-ink is the selected hue's existing white-label contrast shade. */
:scope[data-app-color] .sb {
  --sb-card-color:var(--app-color-ink);
  --sb-icon-detail:var(--sb-card-color);
  --sb-icon-halo:radial-gradient(circle,rgba(255,255,255,.45) 0%,rgba(255,255,255,.12) 42%,transparent 72%);
  --c-bg:var(--sb-card-color);
  --c-text:#fff;--c-text-medium:#fff;--c-text-muted:#fff;--c-text-soft:#fff;--c-text-dim:#fff;
  --c-hover:rgba(255,255,255,.1);--c-active:transparent;--c-divider:transparent;
  --c-rail-active:#fff;--c-foot-hover:rgba(255,255,255,.1);
  --c-collapse-btn-bg:transparent;--c-collapse-btn-border:transparent;--c-collapse-btn-text:#fff;--c-collapse-btn-hover-bg:rgba(255,255,255,.12);
  --logo-filter:invert(1) brightness(2);
  background:linear-gradient(180deg,var(--sb-card-color),color-mix(in srgb,var(--sb-card-color) 72%,#000));
  border:0;border-radius:var(--ollira-frame-radius,12px);
  box-shadow:0 1px 3px rgba(0,0,0,.15),0 5px 14px rgba(0,0,0,.06);
}
:scope[data-app-color="gray"] .sb {
  --sb-card-color:#000;background:#000;
}
:scope[data-app-color] .sb .nav .item {
  --sb-icon-accent:var(--app-theme-accent,#94a8c8);
  --sb-icon-detail:color-mix(in srgb,var(--sb-icon-accent) 72%,#000);
  --sb-icon-halo:radial-gradient(circle,var(--sb-icon-accent) 0%,color-mix(in srgb,var(--sb-icon-accent) 82%,transparent) 34%,transparent 76%);
  position:relative;min-height:44px;color:#fff;
}
/* Module identity is stable when the account changes the rail's theme color. */
:scope[data-app-color] .sb .nav .item[data-key="home"] {
  --sb-icon-detail:#f36cde;
  --sb-icon-halo:radial-gradient(circle at 28% 65%,rgba(255,144,42,.9),transparent 58%),radial-gradient(circle at 65% 28%,var(--app-theme-a-9500,rgba(33,161,255,.95)),transparent 58%),radial-gradient(circle at 68% 68%,rgba(163,36,255,.95),transparent 58%),radial-gradient(circle at 40% 80%,rgba(255,74,203,.85),transparent 58%);
}
:scope[data-app-color] .sb .nav .item[data-key="notif"] { --sb-icon-accent:#f6bf4f; }
:scope[data-app-color] .sb .nav .item[data-key="appts"] { --sb-icon-accent:var(--app-theme-accent,#1b9ff3); }
:scope[data-app-color] .sb .nav .item[data-key="clients"] { --sb-icon-accent:#f267ad; }
:scope[data-app-color] .sb .nav .item[data-key="team"] { --sb-icon-accent:var(--app-theme-accent,#5c73ff); }
:scope[data-app-color] .sb .nav .item[data-key="cashier"] { --sb-icon-accent:#39cf8d; }
:scope[data-app-color] .sb .nav .item[data-key="stock"] { --sb-icon-accent:#ff9845; }
:scope[data-app-color] .sb .nav .item[data-key="services"] { --sb-icon-accent:#c9db54; }
:scope[data-app-color] .sb .nav .item[data-key="reports"] { --sb-icon-accent:#c457ed; }
:scope[data-app-color] .sb .nav .item[data-key="marketing"] { --sb-icon-accent:#ff656c; }
:scope[data-app-color] .sb .nav .item[data-key="settings"] { --sb-icon-accent:var(--app-theme-accent,#94a8c8); }
:scope[data-app-color] .sb .nav .item[data-key="integrations"] { --sb-icon-accent:var(--app-theme-accent,#2dc3de); }
:scope[data-app-color] .sb .nav .item.on { font-weight:600;background:transparent; }
:scope[data-app-color] .sb .nav .item:hover { background:var(--c-hover); }
:scope[data-app-color] .sb .sb-nav-icon { display:inline-flex;position:relative;align-items:center;justify-content:center;flex:0 0 22px;width:22px;height:22px;isolation:isolate; }
:scope[data-app-color] .sb .nav .item .ic { width:22px;height:22px;opacity:.82; }
/* Fade within a circle so the layered colors cannot reveal square corners. */
:scope[data-app-color] .sb .sb-nav-icon::before { content:"";position:absolute;width:40px;height:40px;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;background:var(--sb-icon-halo);filter:blur(4px);mask-image:radial-gradient(circle closest-side,#000 45%,rgba(0,0,0,.9) 65%,transparent 100%);opacity:0;z-index:-1;pointer-events:none; }
/* Neon belongs only to an actually black rail, including custom #000000. */
:scope[data-app-color][data-app-sidebar-black] .sb .item.on .sb-nav-icon::before { opacity:1; }
:scope[data-app-color] .sb .item.on .ic { opacity:1;stroke-width:1.75; }
:scope[data-app-color] .sb .sb-icon-fill { display:none; }
:scope[data-app-color] .sb .item.on .sb-icon-fill { display:inline;fill:currentColor;stroke:none; }
:scope[data-app-color] .sb .item.on .ic > .sb-icon-detail { stroke:var(--sb-icon-detail);fill:none; }
:scope[data-app-color]:not([data-app-sidebar-black]) .sb .item.on .ic > .sb-icon-detail { stroke:var(--sb-card-color); }
:scope[data-app-color] .sb .item.on .ic > .sb-icon-cutout { fill:var(--sb-card-color); }
/* Remove the heart silhouette from the person so the rail/black-rail halo shows through. */
:scope[data-app-color] .sb .item.on[data-key="clients"] .sb-client-person { mask:var(--sb-client-heart-mask); }
:scope[data-app-color] .sb .item.on[data-key="clients"] .ic > path:last-child { fill:currentColor;stroke:none; }
:scope[data-app-color] .sb .item.on[data-key="notif"] .ic > path:first-child { fill:currentColor; }
:scope[data-app-color] .sb.collapsed .nav .item,
:scope[data-app-color][data-app-sidebar-collapsed="true"] .sb.expanded .nav .item { justify-content:center;padding-inline:0; }
:scope[data-app-color] .sb .foot { border-radius:0 0 var(--ollira-frame-radius,12px) var(--ollira-frame-radius,12px); }
/* Popovers are surfaces of the page theme. Rail-white ink must stop at their
   boundary, including branch rows and submenu flyouts. */
:scope[data-app-color] .sb :is(.user-popup,.flyout) {
  --c-text:var(--ds-color-text);--c-text-medium:var(--ds-color-text);--c-text-muted:var(--ds-color-text-secondary);--c-text-soft:var(--ds-color-text-secondary);--c-text-dim:var(--ds-color-text-secondary);
  --c-hover:var(--ds-color-bg-subtle);--c-rail-active:var(--ds-color-interactive);
}
@media (max-width:900px) {
  :scope[data-app-color] .sb { border-radius:var(--ollira-frame-radius,12px);height:calc(100dvh - var(--ollira-frame-outer,6px)*2);max-height:calc(100dvh - var(--ollira-frame-outer,6px)*2); }
  :scope[data-app-color] .sb .nav .item { justify-content:center;padding-inline:0; }
}
@media (prefers-contrast:more) {
  :scope[data-app-color] .sb .nav .item .ic { opacity:1; }
}
:scope[data-app-color][data-app-contrast="high"] .sb .nav .item .ic { opacity:1; }
/* The service editor's locked frame may also contain a support-access banner. */
:scope.is-service-editor-workspace .ollira-stage > .sb,
:scope[data-workspace-ui]:not([data-workspace-ui="calendar"]) .ollira-stage > .sb {
  align-self:stretch;height:100%;max-height:100%;top:0;
}

}
