/* BLUEFLOW Sidebar Navigation v3
   Progressive disclosure + role-based menu for merchant usability. */
#app .side.bf-simple-nav-ready > .nav{display:none!important}
#app .side.bf-simple-nav-ready > #settingsLaunch{display:none!important}

.bf-simple-nav{display:flex;flex-direction:column;gap:7px;margin:10px 0 0;padding:0 8px 12px;min-width:0}
.bfnav-role{display:flex;align-items:center;gap:6px;padding:3px 10px 7px;color:#7a96ad;font-size:10.5px;line-height:1.2;white-space:nowrap;overflow:hidden}
.bfnav-role b{color:#4e6f89;font-weight:800;overflow:hidden;text-overflow:ellipsis}

.bfnav-group{border:1px solid transparent;border-radius:16px;overflow:hidden;background:transparent;transition:background .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease}
.bfnav-group.open,.bfnav-group.active{background:#fff;border-color:#e0ebf5;box-shadow:0 5px 16px rgba(31,79,114,.045)}
.bfnav-group.open{transform:translateY(-1px)}

.bfnav-item,.bfnav-group-btn{width:100%;min-height:44px;border:1px solid transparent;border-radius:14px;background:transparent;color:#597792;display:flex;align-items:center;gap:11px;padding:7px 10px;text-align:left;font:750 13px/1.25 inherit;cursor:pointer;transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease,box-shadow .16s ease;position:relative;-webkit-tap-highlight-color:transparent}
.bfnav-item:hover,.bfnav-group-btn:hover{background:#f1f8fe;color:#234c6c;transform:translateX(1px)}
.bfnav-item:active,.bfnav-group-btn:active{transform:scale(.985)}
.bfnav-icon{width:34px;height:34px;flex:0 0 34px;border-radius:11px;display:grid;place-items:center;background:#f1f6fa;color:#6686a0;transition:background .16s ease,color .16s ease,transform .18s ease,box-shadow .18s ease}
.bfnav-icon svg{width:18px;height:18px;display:block}
.bfnav-label{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.bfnav-item.on,.bfnav-settings.on{background:#e7f3ff;border-color:#d2eaff;color:#0879dc;box-shadow:0 5px 14px rgba(22,139,255,.055);animation:bfNavSelect .2s cubic-bezier(.2,.78,.24,1)}
.bfnav-item.on .bfnav-icon,.bfnav-settings.on .bfnav-icon{background:#fff;color:#168bff;box-shadow:0 4px 12px rgba(22,139,255,.09);transform:scale(1.03)}

.bfnav-group.active>.bfnav-group-btn,.bfnav-group.open>.bfnav-group-btn{background:transparent;border-color:transparent;color:#0879dc}
.bfnav-group.active>.bfnav-group-btn .bfnav-icon,.bfnav-group.open>.bfnav-group-btn .bfnav-icon{background:#e6f3ff;color:#168bff;box-shadow:none;transform:scale(1.03)}
.bfnav-group.open>.bfnav-group-btn:hover{background:#f4f9fd}

.bfnav-chevron{font-size:21px;line-height:1;color:#9ab0c1;transform:rotate(0deg);transition:transform .2s cubic-bezier(.2,.78,.24,1),color .16s ease;margin-right:2px}
.bfnav-group.open>.bfnav-group-btn .bfnav-chevron{transform:rotate(90deg);color:#168bff}

.bfnav-sub{display:flex;max-height:0;opacity:0;overflow:hidden;pointer-events:none;margin:0 6px;padding:0;gap:2px;flex-direction:column;transform:translateY(-5px);transition:max-height .24s cubic-bezier(.2,.78,.24,1),opacity .16s ease,transform .2s ease,padding .2s ease}
.bfnav-group.open>.bfnav-sub{max-height:260px;opacity:1;pointer-events:auto;padding:0 0 7px;transform:translateY(0)}
.bfnav-subitem{min-height:39px;border-radius:11px;padding:5px 9px;font-size:13px;font-weight:750;gap:9px}
.bfnav-subitem .bfnav-icon{width:27px;height:27px;flex-basis:27px;border-radius:9px;background:#f0f4f7}
.bfnav-subitem .bfnav-icon svg{width:15px;height:15px}
.bfnav-subitem:hover{background:#f0f7fd}
.bfnav-subitem.on{background:#e5f3ff;border-color:transparent;color:#0879dc;box-shadow:none}
.bfnav-subitem.on .bfnav-icon{background:#fff;color:#168bff;box-shadow:0 3px 9px rgba(22,139,255,.07)}
.bfnav-badge{min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:#168bff;color:#fff;display:inline-grid;place-items:center;font-size:10px;font-weight:900;line-height:1}
.bfnav-settings{margin-top:4px;border-top-color:#e4eef5;border-radius:14px}

@keyframes bfNavSelect{0%{transform:scale(.985);opacity:.82}65%{transform:scale(1.012)}100%{transform:none;opacity:1}}

/* Keep the workspace card visually separate from navigation. */
#app .side.bf-simple-nav-ready .bf-workspace-card,
#app .side.bf-simple-nav-ready .biz{margin-bottom:4px}

html[data-theme="dark"] .bfnav-role{color:#7690a6}
html[data-theme="dark"] .bfnav-role b{color:#a9bfd1}
html[data-theme="dark"] .bfnav-group.open,html[data-theme="dark"] .bfnav-group.active{background:#101d2c;border-color:#2a4256;box-shadow:none}
html[data-theme="dark"] .bfnav-item,html[data-theme="dark"] .bfnav-group-btn{color:#aac0d2}
html[data-theme="dark"] .bfnav-item:hover,html[data-theme="dark"] .bfnav-group-btn:hover{background:#14283a;color:#e6f1fa}
html[data-theme="dark"] .bfnav-icon{background:#172a3b;color:#8eabc1}
html[data-theme="dark"] .bfnav-item.on,html[data-theme="dark"] .bfnav-settings.on{background:#15324d;border-color:#294b67;color:#8bd0ff;box-shadow:none}
html[data-theme="dark"] .bfnav-item.on .bfnav-icon,html[data-theme="dark"] .bfnav-settings.on .bfnav-icon{background:#1a3a58;color:#8dd1ff;box-shadow:none}
html[data-theme="dark"] .bfnav-group.active>.bfnav-group-btn,html[data-theme="dark"] .bfnav-group.open>.bfnav-group-btn{color:#8bd0ff}
html[data-theme="dark"] .bfnav-group.active>.bfnav-group-btn .bfnav-icon,html[data-theme="dark"] .bfnav-group.open>.bfnav-group-btn .bfnav-icon{background:#173654;color:#8dd1ff}
html[data-theme="dark"] .bfnav-group.open>.bfnav-group-btn:hover{background:#14283a}
html[data-theme="dark"] .bfnav-subitem .bfnav-icon{background:#172638}
html[data-theme="dark"] .bfnav-subitem.on{background:#15324d;border-color:transparent;color:#8bd0ff}
html[data-theme="dark"] .bfnav-subitem.on .bfnav-icon{background:#1a3a58;color:#8dd1ff;box-shadow:none}
html[data-theme="dark"] .bfnav-settings{border-top-color:#233e53}

@media(max-width:900px){
  .bf-simple-nav{padding-left:6px;padding-right:6px}
  .bfnav-role{display:none}
  .bfnav-item,.bfnav-group-btn{min-height:42px;padding:6px 8px}
  .bfnav-group.open{transform:none}
}
@media(prefers-reduced-motion:reduce){
  .bfnav-group,.bfnav-item,.bfnav-group-btn,.bfnav-icon,.bfnav-chevron,.bfnav-sub{transition:none!important;animation:none!important;transform:none!important}
}