/* FRONTLINE_MENU_CLEAN_CSS_V6 */
/* Single clean stylesheet for the shared Frontline AI menu. No appended override stack. */

:root{
  --fl-menu-blue:#1678ff;
  --fl-menu-blue-soft:#58b8ff;
  --fl-menu-text:#f3f7ff;
  --fl-menu-muted:#aebed4;
  --fl-menu-line:rgba(102,160,255,.26);
  --fl-menu-line-strong:rgba(102,170,255,.58);
}

/* Homepage must not be pushed sideways. */
body.frontline-menu-mounted.frontline-home-page{
  padding-left:0 !important;
}

/* Inner pages keep clear of fixed sidebar. */
body.frontline-menu-mounted:not(.frontline-home-page){
  padding-left:332px !important;
  padding-top:0 !important;
}

.frontlineMenuSidebar,
.frontlineMenuSidebar *,
.frontlineMenuMobileTop,
.frontlineMenuMobileTop *{
  box-sizing:border-box !important;
}

.frontlineMenuSidebar{
  position:fixed !important;
  left:18px !important;
  top:18px !important;
  bottom:18px !important;
  width:292px !important;
  max-width:292px !important;
  padding:22px 20px !important;
  z-index:9999 !important;

  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;

  color:#fff !important;
  border:1px solid var(--fl-menu-line) !important;
  border-radius:26px !important;
  background:
    radial-gradient(circle at 20% 10%,rgba(44,124,255,.17),transparent 35%),
    linear-gradient(180deg,rgba(4,12,28,.96),rgba(1,6,17,.94)) !important;
  backdrop-filter:blur(22px) !important;
  box-shadow:
    0 32px 100px rgba(0,0,0,.42),
    inset 0 1px 0 rgba(255,255,255,.08) !important;
}

/* Brand */
.frontlineMenuBrand{
  display:flex !important;
  align-items:center !important;
  gap:13px !important;
  padding:7px 2px 18px !important;
  margin:0 2px 12px !important;
  color:#fff !important;
  text-decoration:none !important;
  border-bottom:1px solid rgba(255,255,255,.11) !important;
}

.frontlineMenuBrandMark{
  width:52px !important;
  height:52px !important;
  min-width:52px !important;
  max-width:52px !important;
  border-radius:17px !important;
  object-fit:cover !important;
  border:1px solid rgba(255,255,255,.24) !important;
  box-shadow:0 0 30px rgba(55,156,255,.26) !important;
}

.frontlineMenuLogo{
  font-family:Sora,Inter,Arial,sans-serif !important;
  font-size:20px !important;
  line-height:1 !important;
  font-weight:900 !important;
  letter-spacing:-.045em !important;
  color:#f4f8ff !important;
  white-space:nowrap !important;
}

.frontlineMenuBrand span{
  display:block !important;
  margin-top:7px !important;
  font-family:Sora,Inter,Arial,sans-serif !important;
  font-size:10px !important;
  font-weight:900 !important;
  letter-spacing:.2em !important;
  text-transform:uppercase !important;
  color:#6eb8ff !important;
  white-space:nowrap !important;
}

/* Nav */
.frontlineMenuNav{
  display:grid !important;
  gap:5px !important;
  padding:3px 0 12px !important;
}

.frontlineMenuItem{
  position:relative !important;
  display:grid !important;
  grid-template-columns:38px minmax(0,1fr) auto 10px !important;
  align-items:center !important;
  gap:8px !important;

  height:49px !important;
  min-height:49px !important;
  padding:6px 10px !important;
  border-radius:17px !important;

  color:var(--fl-menu-text) !important;
  text-decoration:none !important;
  font-family:Sora,Inter,Arial,sans-serif !important;
  font-size:13px !important;
  line-height:1.05 !important;
  font-weight:900 !important;

  border:1px solid transparent !important;
  overflow:hidden !important;
  transition:
    transform .18s ease,
    border-color .18s ease,
    background .18s ease,
    box-shadow .18s ease !important;
}

.frontlineMenuIcon{
  width:32px !important;
  height:32px !important;
  min-width:32px !important;
  max-width:32px !important;
  display:block !important;
  border-radius:11px !important;

  background-image:var(--fl-icon) !important;
  background-position:center !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;

  opacity:.84 !important;
  filter:saturate(.85) brightness(.95) !important;
  box-shadow:0 0 12px rgba(34,112,255,.14) !important;
}

.frontlineMenuLabel{
  display:block !important;
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  letter-spacing:-.01em !important;
}

.frontlineMenuMeta{
  display:block !important;
  max-width:58px !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  text-align:right !important;

  color:#68b3ff !important;
  font-size:10.5px !important;
  font-weight:900 !important;
}

.frontlineMenuArrow{
  display:block !important;
  color:#a6bddb !important;
  font-size:21px !important;
  line-height:1 !important;
  font-weight:300 !important;
  text-align:right !important;
}

.frontlineMenuItem:hover,
.frontlineMenuItem.active{
  color:#fff !important;
  background:linear-gradient(90deg,rgba(23,108,255,.24),rgba(23,108,255,.07)) !important;
  border-color:rgba(88,166,255,.56) !important;
  box-shadow:
    0 0 28px rgba(22,100,255,.24),
    inset 0 1px 0 rgba(255,255,255,.1) !important;
  transform:translateX(2px) !important;
}

.frontlineMenuItem:hover .frontlineMenuIcon,
.frontlineMenuItem.active .frontlineMenuIcon{
  opacity:1 !important;
  filter:saturate(1.12) brightness(1.06) !important;
  box-shadow:0 0 22px rgba(45,135,255,.34) !important;
}

/* Bottom CTA */
.frontlineMenuCta{
  position:relative !important;
  margin-top:auto !important;
  padding:14px 15px !important;
  border-radius:21px !important;
  border:1px solid var(--fl-menu-line-strong) !important;
  overflow:hidden !important;

  background:
    linear-gradient(180deg,rgba(9,28,68,.56),rgba(4,12,28,.86)),
    url("/assets/sidebar-cta-glow.png") center/cover no-repeat !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 22px 54px rgba(0,0,0,.24) !important;
}

.frontlineMenuCtaSpark{
  margin-bottom:6px !important;
  color:#78bcff !important;
  font-size:16px !important;
  line-height:1 !important;
  text-shadow:0 0 16px rgba(92,176,255,.8) !important;
}

.frontlineMenuCta b{
  display:block !important;
  font-family:Sora,Inter,Arial,sans-serif !important;
  font-size:16px !important;
  line-height:1.18 !important;
  font-weight:900 !important;
  letter-spacing:-.015em !important;
  color:#fff !important;
}

.frontlineMenuCta b span{
  color:#4fa8ff !important;
}

.frontlineMenuCta p{
  margin:7px 0 11px !important;
  color:#c6d3e6 !important;
  font-size:11.5px !important;
  line-height:1.3 !important;
}

.frontlineMenuButton{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  width:100% !important;
  min-height:39px !important;
  padding:0 14px !important;

  border-radius:13px !important;
  border:1px solid rgba(128,205,255,.86) !important;
  background:linear-gradient(135deg,#176cff,#3fb0ff) !important;
  box-shadow:
    0 0 24px rgba(35,124,255,.38),
    inset 0 1px 0 rgba(255,255,255,.22) !important;

  color:#fff !important;
  text-decoration:none !important;
  font-family:Sora,Inter,Arial,sans-serif !important;
  font-size:12.5px !important;
  font-weight:950 !important;
}

/* Shorter screens */
@media(max-height:820px){
  body.frontline-menu-mounted:not(.frontline-home-page){
    padding-left:324px !important;
  }

  .frontlineMenuSidebar{
    left:14px !important;
    top:12px !important;
    bottom:12px !important;
    width:286px !important;
    max-width:286px !important;
    padding:17px 16px !important;
  }

  .frontlineMenuBrand{
    padding-bottom:13px !important;
    margin-bottom:8px !important;
  }

  .frontlineMenuBrandMark{
    width:48px !important;
    height:48px !important;
    min-width:48px !important;
    max-width:48px !important;
  }

  .frontlineMenuLogo{
    font-size:19px !important;
  }

  .frontlineMenuNav{
    gap:3px !important;
    padding-bottom:8px !important;
  }

  .frontlineMenuItem{
    grid-template-columns:35px minmax(0,1fr) auto 10px !important;
    height:44px !important;
    min-height:44px !important;
    padding:5px 9px !important;
  }

  .frontlineMenuIcon{
    width:30px !important;
    height:30px !important;
    min-width:30px !important;
    max-width:30px !important;
  }

  .frontlineMenuMeta{
    max-width:54px !important;
    font-size:10px !important;
  }

  .frontlineMenuCta{
    padding:12px 13px !important;
  }

  .frontlineMenuCta p{
    margin:6px 0 9px !important;
    font-size:11px !important;
    line-height:1.28 !important;
  }

  .frontlineMenuButton{
    min-height:36px !important;
  }
}

@media(max-height:720px){
  .frontlineMenuCta p{
    display:none !important;
  }

  .frontlineMenuButton{
    margin-top:8px !important;
  }
}

/* Mobile */
.frontlineMenuMobileTop{
  display:none !important;
}

@media(max-width:1180px){
  body.frontline-menu-mounted.frontline-home-page,
  body.frontline-menu-mounted:not(.frontline-home-page){
    padding-left:0 !important;
    padding-top:76px !important;
  }

  .frontlineMenuSidebar{
    display:none !important;
  }

  .frontlineMenuMobileTop{
    display:flex !important;
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    z-index:9999 !important;
    align-items:center !important;
    justify-content:space-between !important;
    padding:14px 18px !important;
    background:rgba(2,6,16,.92) !important;
    backdrop-filter:blur(16px) !important;
    border-bottom:1px solid rgba(100,158,255,.25) !important;
  }

  .frontlineMenuMobileBrand{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    color:#fff !important;
    text-decoration:none !important;
    font-family:Sora,Inter,Arial,sans-serif !important;
    font-weight:900 !important;
  }

  .frontlineMenuMobileBrand img{
    width:48px !important;
    height:48px !important;
    border-radius:15px !important;
  }

  .frontlineMenuMobileCta{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:44px !important;
    padding:0 16px !important;
    border-radius:14px !important;
    background:linear-gradient(135deg,#176cff,#3fb0ff) !important;
    border:1px solid rgba(116,195,255,.72) !important;
    color:#fff !important;
    text-decoration:none !important;
    font-family:Sora,Inter,Arial,sans-serif !important;
    font-weight:900 !important;
  }
}
