/* One isolated global header across the brand site, stores and standalone pages. */
:root { --site-header-space: 96px; }
#site-header, #sh-drawer {
  box-sizing: border-box;
  --sh-text: #f5f3ff; --sh-muted: #bdb7de; --sh-bg: rgba(255,255,255,.055);
  --sh-panel: #211b2cf5; --sh-border: #ffffff24; --sh-hover: #ffffff0d;
  --sh-accent: #e69d79; --sh-gradient: linear-gradient(105deg,#ffb088,#8ff2dd);
  color: var(--sh-text); font: 500 14px/1.5 system-ui, -apple-system, "Segoe UI", Tahoma, sans-serif;
  letter-spacing: normal; text-align: start;
}
html.light-mode #site-header, html[data-theme="light"] #site-header,
html.light-mode #sh-drawer, html[data-theme="light"] #sh-drawer {
  --sh-text: #221b36; --sh-muted: #625875; --sh-bg: rgba(255,255,255,.74);
  --sh-panel: #fffcfff7; --sh-border: #4c335625; --sh-hover: #7052990b; --sh-accent: #a75228; --sh-gradient: linear-gradient(105deg,#a83c09,#087462);
}
#site-header *, #sh-drawer *, #site-header *::before, #site-header *::after, #sh-drawer *::before, #sh-drawer *::after { box-sizing: border-box; }
#site-header { position: fixed; top: 16px !important; inset-inline: 0; width: calc(100% - 48px) !important; max-width: 1180px !important; height: 64px; margin: 0 auto !important; padding: 0; z-index: 10010; border: 1px solid var(--sh-border) !important; border-radius: 999px !important; background: var(--sh-bg) !important; backdrop-filter: blur(16px) !important; -webkit-backdrop-filter: blur(16px); transform: none; }
.site-header-space { display: block; width: 100%; height: var(--site-header-space); min-height: var(--site-header-space); flex: 0 0 var(--site-header-space); pointer-events: none; }
#site-header .site-header__inner { width: 100%; max-width: 1180px; height: 62px; min-height: 62px !important; padding: 8px 18px !important; margin: 0 auto; display: flex; align-items: center; gap: 10px !important; }
#site-header .site-header__start, #site-header .site-header__end { display: flex; align-items: center; gap: 8px; min-width: 0; }
#site-header .site-header__end { margin-inline-start: auto; flex-shrink: 0; }
#site-header a, #sh-drawer a { text-decoration: none; text-transform: none; }
#site-header .sh-brand { display: inline-flex; align-items: center; gap: 8px; padding: 0; color: var(--sh-text); white-space: nowrap; }
#site-header .sh-brand__logo { width: 28px !important; height: 28px !important; min-width: 28px; border-radius: 9px !important; object-fit: cover; border: 1px solid var(--sh-border); }
#site-header .sh-brand__name, #sh-drawer .sh-brand__name { font: 800 16px/1.2 system-ui,sans-serif !important; background: none; color: var(--sh-text) !important; }
#site-header .sh-badge { padding: 3px 8px; margin: 0; border-radius: 20px; background: var(--sh-hover); border: 1px solid var(--sh-border); color: var(--sh-accent); font-size: 10px; font-weight: 700; }
#site-header .sh-nav { margin-inline-start: 4px; }
#site-header .sh-menu { display: flex; align-items: center; gap: 2px; list-style: none; margin: 0; padding: 0; }
#site-header .sh-item { position: relative; margin: 0; padding: 0; }
#site-header .sh-link { display: inline-flex; align-items: center; gap: 4px; padding: 9px 10px !important; margin: 0; min-height: 36px; border: 0; border-radius: 10px; background: transparent; color: var(--sh-text); font: 600 13px/1.5 system-ui,"Segoe UI",Tahoma,sans-serif; font-size: 13px !important; letter-spacing: normal; white-space: nowrap; cursor: pointer; }
#site-header .sh-link:hover, #site-header .sh-link.is-active, #site-header .sh-item.is-open > .sh-link { background: var(--sh-hover); }
#site-header .sh-link--cta { background: var(--sh-gradient); color: #201107 !important; }
#site-header .sh-link--cta:hover { background: var(--sh-gradient); filter: brightness(1.1); }
#site-header .sh-drop { position: absolute; top: calc(100% + 8px); inset-inline-start: 0; min-width: 300px; max-width: min(360px,calc(100vw - 24px)); padding: 8px; border-radius: 16px; background: var(--sh-panel) !important; color: var(--sh-text) !important; border: 1px solid var(--sh-border); box-shadow: 0 16px 40px #0003; backdrop-filter: blur(24px); opacity: 0; visibility: hidden; transform: translateY(-6px); display: grid; gap: 2px; }
#site-header .sh-item.is-open > .sh-drop { opacity: 1; visibility: visible; transform: none; }
#site-header .sh-drop__link { display: grid; gap: 2px; padding: 10px 12px; margin: 0; color: var(--sh-text); border-radius: 10px; font-size: 14px; }
#site-header .sh-drop__link:hover { background: var(--sh-hover); }
#site-header .sh-drop__title { font-weight: 700; }
#site-header .sh-drop__desc { color: var(--sh-muted); font-size: 12px; }
#site-header .sh-util, #site-header .sh-back, #sh-drawer .sh-util { display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: auto; min-width: 38px; height: 38px; min-height: 38px; padding: 0 10px; margin: 0; border: 1px solid var(--sh-border); border-radius: 10px; background: var(--sh-hover); color: var(--sh-text) !important; font: 600 13px/1.2 system-ui,"Segoe UI",Tahoma,sans-serif; cursor: pointer; }
#site-header svg, #sh-drawer svg { flex-shrink: 0; vertical-align: middle; }
#site-header button::before, #site-header button::after { content: none; }
#site-header .sh-burger { display: none; }
#site-header :focus-visible, #sh-drawer :focus-visible { outline: 3px solid #bc87dc; outline-offset: 3px; }
#sh-drawer { position: fixed; inset: 0; z-index: 10020; background: #08041490; margin: 0; padding: 0; }
#sh-drawer[hidden] { display: none !important; }
#sh-drawer .sh-drawer__panel { position: absolute; top: 0; bottom: 0; inset-inline-end: 0; width: min(88vw,360px); overflow-y: auto; padding: 16px; background: var(--sh-panel) !important; color: var(--sh-text) !important; border-inline-start: 1px solid var(--sh-border); display: flex; flex-direction: column; gap: 4px; }
#sh-drawer .sh-drawer__head { display: flex; align-items: center; justify-content: space-between; margin: 0 0 12px; }
#sh-drawer .sh-drawer__link, #sh-drawer summary, #sh-drawer .sh-drawer__group a { display: flex; align-items: center; gap: 8px; padding: 12px; margin: 0; border-radius: 10px; color: var(--sh-text); font: 600 14px/1.5 system-ui,"Segoe UI",Tahoma,sans-serif; cursor: pointer; list-style: none; }
#sh-drawer summary { justify-content: space-between; }
#sh-drawer summary::-webkit-details-marker { display: none; }
#sh-drawer .sh-drawer__group a { padding-inline-start: 24px; color: var(--sh-muted); font-weight: 500; }
#sh-drawer a:hover, #sh-drawer summary:hover { background: var(--sh-hover); }
#site-header[dir="rtl"] .sh-back svg { transform: scaleX(-1); }
@media (min-width:1181px) and (hover:hover) { #site-header .sh-item--drop:not(.is-dismissed):hover > .sh-drop { opacity: 1; visibility: visible; transform: none; } }
@media (max-width:1180px) { #site-header .sh-nav { display: none; } #site-header .sh-burger { display: inline-flex; } #site-header .sh-lang span { display: none; } }
@media (max-width:760px) { :root { --site-header-space: 80px; } #site-header { top: 8px !important; width: calc(100% - 24px) !important; border-radius: 24px !important; } #site-header .site-header__inner { padding: 8px 12px !important; } }
@media (max-width:480px) { #site-header .sh-badge { display: none; } #site-header .site-header__inner { gap: 8px; } }
/* Full-height store/demo applications reserve the same global navigation row. */
body[data-site-shell="legacy"] { flex-direction: column; }
body[data-site-shell="legacy"] > .site-header-space { align-self: stretch; }
body[data-site-shell="legacy"] > .profile-container { align-self: center; }
body.site-store-workspace, body.site-store-glass { flex-direction: column; justify-content: flex-start; min-height: 100dvh; height: 100dvh; }
.site-store-workspace .os-window { height: calc(100dvh - var(--site-header-space)); min-height: 0; flex: 1; }
.site-store-glass .app-container { height: calc(100dvh - var(--site-header-space) - 20px); min-height: 0; margin: 10px auto; flex: 1; }
.orbit-body .orbit-nav { top: calc(var(--site-header-space) + 24px); }
.orbit-body .orbit-stage { top: var(--site-header-space); height: calc(100svh - var(--site-header-space)); }
body.site-erp-demo { display: flex; flex-direction: column; height: 100dvh; }
.site-erp-demo .bc-app { height: auto; min-height: 0; flex: 1; }
.adm-body .adm-topbar { inset-block-start: var(--site-header-space); }
.adm-body .adm-sidebar { inset-block-start: calc(var(--site-header-space) + var(--topbar-h)); }
.adm-body .adm-login, .adm-body .adm-boot { min-height: calc(100dvh - var(--site-header-space)); }
@media print { #site-header, #sh-drawer, .site-header-space { display: none !important; } }
