/* ==========================================================================
   ATHENA_SIDEBAR_STANDARD_V1_CSS
   Athena Sidebar Design Standard
   Version 1.0.0
   ========================================================================== */

:root{
  --athena-sidebar-width:248px;
  --athena-sidebar-tablet-width:76px;
  --athena-sidebar-mobile-width:268px;

  --athena-sidebar-bg-top:#081d39;
  --athena-sidebar-bg-mid:#092348;
  --athena-sidebar-bg-bottom:#061b37;

  --athena-sidebar-text:#eef4fb;
  --athena-sidebar-muted:#9eafc5;
  --athena-sidebar-dim:#758aa5;

  --athena-sidebar-gold:#f3c35d;
  --athena-sidebar-hover:rgba(255,255,255,.055);
  --athena-sidebar-active-a:rgba(55,92,139,.70);
  --athena-sidebar-active-b:rgba(22,49,85,.48);

  --athena-sidebar-row:38px;
  --athena-sidebar-subrow:32px;

  --athena-sidebar-font:13px;
  --athena-sidebar-subfont:12px;
  --athena-sidebar-heading:9px;

  --athena-sidebar-icon:18px;
  --athena-sidebar-subicon:16px;

  --athena-sidebar-radius:7px;
  --athena-sidebar-row-gap:2px;
  --athena-sidebar-section-gap:9px;

  --athena-sidebar-scrollbar:5px;
}

/* ==========================================================================
   CANONICAL SIDEBAR
   ========================================================================== */

.athena-sidebar{
  width:var(--athena-sidebar-width);
  color:var(--athena-sidebar-text);
  background:
    linear-gradient(
      180deg,
      var(--athena-sidebar-bg-top) 0%,
      var(--athena-sidebar-bg-mid) 54%,
      var(--athena-sidebar-bg-bottom) 100%
    );
}

.athena-sidebar-scroll{
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,.25) transparent;
}

.athena-sidebar-scroll::-webkit-scrollbar{
  width:var(--athena-sidebar-scrollbar);
}

.athena-sidebar-scroll::-webkit-scrollbar-track{
  background:transparent;
}

.athena-sidebar-scroll::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,.24);
  border-radius:999px;
}

.athena-sidebar-scroll::-webkit-scrollbar-thumb:hover{
  background:rgba(255,255,255,.38);
}

.athena-sidebar-section{
  margin-top:var(--athena-sidebar-section-gap);
}

.athena-sidebar-heading{
  min-height:22px;
  padding:7px 13px 4px;
  color:var(--athena-sidebar-dim);
  font-size:var(--athena-sidebar-heading);
  font-weight:800;
  letter-spacing:.14em;
  line-height:1;
  text-transform:uppercase;
}

.athena-sidebar-item-wrap{
  margin:0;
  padding:0;
}

.athena-sidebar-item{
  position:relative;
  min-height:var(--athena-sidebar-row);
  height:var(--athena-sidebar-row);

  display:flex;
  align-items:center;

  gap:10px;

  margin:var(--athena-sidebar-row-gap) 8px;
  padding:0 13px;

  border:0;
  border-radius:var(--athena-sidebar-radius);

  color:var(--athena-sidebar-text);
  background:transparent;

  font-size:var(--athena-sidebar-font);
  font-weight:500;
  line-height:1.15;

  text-decoration:none;
  text-align:left;

  transition:
    background .14s ease,
    color .14s ease;
}

.athena-sidebar-item:hover{
  background:var(--athena-sidebar-hover);
  color:#fff;
}

.athena-sidebar-item.active,
.athena-sidebar-item[aria-current="page"]{
  background:
    linear-gradient(
      90deg,
      var(--athena-sidebar-active-a),
      var(--athena-sidebar-active-b)
    );
  color:#fff;
}

.athena-sidebar-item.active::before,
.athena-sidebar-item[aria-current="page"]::before{
  content:"";
  position:absolute;
  left:-8px;
  top:3px;
  bottom:3px;
  width:4px;
  border-radius:0 3px 3px 0;
  background:var(--athena-sidebar-gold);
}

.athena-sidebar-icon{
  width:22px;
  min-width:22px;
  height:22px;

  display:flex;
  align-items:center;
  justify-content:center;

  color:#e7eff8;

  font-size:var(--athena-sidebar-icon);
  line-height:1;
}

.athena-sidebar-icon svg{
  width:var(--athena-sidebar-icon);
  height:var(--athena-sidebar-icon);
  stroke:currentColor;
}

.athena-sidebar-item.active .athena-sidebar-icon,
.athena-sidebar-item[aria-current="page"] .athena-sidebar-icon{
  color:var(--athena-sidebar-gold);
}

.athena-sidebar-label{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  font-size:var(--athena-sidebar-font);
  font-weight:500;
}

.athena-sidebar-badge{
  margin-left:auto;

  min-width:23px;
  height:23px;

  padding:0 6px;

  display:grid;
  place-items:center;

  border-radius:999px;

  color:#112744;
  background:var(--athena-sidebar-gold);

  font-size:10px;
  font-weight:800;
}

.athena-sidebar-divider{
  height:1px;
  margin:7px 13px;
  background:rgba(255,255,255,.14);
}

.athena-sidebar-footer{
  margin-top:auto;
  padding:7px 8px 9px;
  border-top:1px solid rgba(255,255,255,.12);
}

/* ==========================================================================
   CANONICAL SUBMENU / FLYOUT
   ========================================================================== */

.athena-submenu{
  max-height:min(70vh,620px);

  overflow-y:auto;
  overscroll-behavior:contain;

  padding:7px 0;

  border:1px solid #dfe6ef;
  border-radius:10px;

  background:#fff;

  box-shadow:0 16px 36px rgba(14,31,56,.16);

  scrollbar-width:thin;
  scrollbar-color:#bac6d5 transparent;
}

.athena-submenu::-webkit-scrollbar{
  width:5px;
}

.athena-submenu::-webkit-scrollbar-thumb{
  background:#bac6d5;
  border-radius:999px;
}

.athena-submenu-heading{
  min-height:22px;
  margin:0;
  padding:7px 16px 5px;

  color:#7787a0;

  font-size:9px;
  font-weight:800;
  letter-spacing:.14em;
  line-height:1;

  text-transform:uppercase;
}

.athena-submenu-item{
  min-height:var(--athena-sidebar-subrow);
  height:auto;

  width:100%;

  display:flex;
  align-items:center;

  gap:9px;

  margin:1px 0;
  padding:6px 15px;

  border:0;
  border-radius:0;

  background:#fff;
  color:#173556;

  font-size:var(--athena-sidebar-subfont);
  font-weight:500;
  line-height:1.25;

  text-align:left;
}

.athena-submenu-item:hover{
  background:#f4f7fb;
  color:#0e315d;
}

.athena-submenu-item.active{
  background:#eef4ff;
  color:#125fc7;
}

.athena-submenu-icon{
  width:20px;
  min-width:20px;

  display:flex;
  align-items:center;
  justify-content:center;

  color:#315c9f;

  font-size:var(--athena-sidebar-subicon);
}

.athena-submenu-label{
  min-width:0;
  flex:1;
}

.athena-submenu-item small{
  display:block;
  margin-top:2px;

  color:#8492a5;

  font-size:10px;
  font-weight:400;
  line-height:1.25;
}

/* ==========================================================================
   COMPATIBILITY — ATHENA MAIN SIDEBAR / ATHENA32
   ========================================================================== */

.athena32-navwrap{
  margin:0 !important;
  padding:0 !important;
  min-height:0 !important;
}

.athena32-nav{
  min-height:var(--athena-sidebar-row) !important;
  height:var(--athena-sidebar-row) !important;

  display:flex !important;
  align-items:center !important;

  gap:10px !important;

  margin:var(--athena-sidebar-row-gap) 8px !important;
  padding:0 13px !important;

  border-radius:var(--athena-sidebar-radius) !important;

  font-size:var(--athena-sidebar-font) !important;
  font-weight:500 !important;
  line-height:1.15 !important;
}

.athena32-label{
  min-width:0 !important;

  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;

  font-size:var(--athena-sidebar-font) !important;
  font-weight:500 !important;
  line-height:1.15 !important;

  letter-spacing:0 !important;
}

.athena32-icon{
  width:22px !important;
  min-width:22px !important;
  height:22px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  font-size:var(--athena-sidebar-icon) !important;
  line-height:1 !important;
}

.athena32-icon svg{
  width:var(--athena-sidebar-icon) !important;
  height:var(--athena-sidebar-icon) !important;
}

.athena32-separator{
  height:1px !important;
  margin:7px 13px !important;
  background:rgba(255,255,255,.14) !important;
}

/*
  Tooltip visual language remains compatible with the current shell.
  Its positioning logic is intentionally not replaced.
*/
.athena32-tip{
  font-size:12px;
}

.athena32-tip strong{
  font-size:12px;
}

.athena32-tip span{
  font-size:10.5px;
}

.athena32-tip p{
  font-size:10.5px;
  line-height:1.35;
}

/* ==========================================================================
   COMPATIBILITY — EXISTING ATHENA FLYOUTS
   ========================================================================== */

.sidebar-menu{
  max-height:min(70vh,620px) !important;

  overflow-y:auto !important;
  overscroll-behavior:contain !important;

  padding:7px 0 !important;

  border-radius:10px !important;

  scrollbar-width:thin !important;
  scrollbar-color:#bac6d5 transparent !important;
}

.sidebar-menu::-webkit-scrollbar{
  width:5px !important;
}

.sidebar-menu::-webkit-scrollbar-thumb{
  background:#bac6d5 !important;
  border-radius:999px !important;
}

.sidebar-menu h4{
  min-height:22px !important;

  margin:0 !important;
  padding:7px 16px 5px !important;

  color:#7787a0 !important;

  font-size:9px !important;
  font-weight:800 !important;
  letter-spacing:.14em !important;
  line-height:1 !important;
}

.menu-link{
  min-height:var(--athena-sidebar-subrow) !important;

  padding:6px 15px !important;

  gap:9px !important;

  font-size:var(--athena-sidebar-subfont) !important;
  font-weight:500 !important;
  line-height:1.25 !important;
}

.menu-link .mini{
  width:20px !important;
  min-width:20px !important;
  height:20px !important;

  font-size:var(--athena-sidebar-subicon) !important;
}

.menu-link small{
  margin-top:2px !important;

  font-size:10px !important;
  font-weight:400 !important;
  line-height:1.25 !important;
}

/* ==========================================================================
   COMPATIBILITY — UNIVERSE
   ========================================================================== */

.u-sidebar{
  width:var(--athena-sidebar-width) !important;

  background:
    linear-gradient(
      180deg,
      var(--athena-sidebar-bg-top) 0%,
      var(--athena-sidebar-bg-mid) 54%,
      var(--athena-sidebar-bg-bottom) 100%
    ) !important;
}

.u-nav{
  scrollbar-width:thin !important;
  scrollbar-color:rgba(255,255,255,.25) transparent !important;
}

.u-nav::-webkit-scrollbar{
  width:var(--athena-sidebar-scrollbar) !important;
}

.u-nav::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,.24) !important;
  border-radius:999px !important;
}

.u-nav-section{
  margin-top:var(--athena-sidebar-section-gap) !important;
}

.u-nav-heading{
  min-height:22px !important;

  padding:7px 13px 4px !important;

  color:var(--athena-sidebar-dim) !important;

  font-size:var(--athena-sidebar-heading) !important;
  font-weight:800 !important;
  letter-spacing:.14em !important;
  line-height:1 !important;
}

.u-nav-link{
  min-height:var(--athena-sidebar-row) !important;
  height:var(--athena-sidebar-row) !important;

  gap:10px !important;

  margin:var(--athena-sidebar-row-gap) 0 !important;
  padding:0 13px !important;

  border-radius:var(--athena-sidebar-radius) !important;

  font-size:var(--athena-sidebar-font) !important;
  font-weight:500 !important;
  line-height:1.15 !important;
}

.u-nav-icon{
  width:22px !important;
  min-width:22px !important;

  font-size:var(--athena-sidebar-icon) !important;
}

.u-nav-link.active::before{
  width:4px !important;
  background:var(--athena-sidebar-gold) !important;
}

.u-sidebar-footer{
  padding:7px 8px 9px !important;
}

.u-settings,
.u-home-return{
  min-height:36px !important;

  font-size:12px !important;
  line-height:1.15 !important;
}

/* ==========================================================================
   PROGRESSIVE GENERIC ADAPTER TARGETS
   ========================================================================== */

[data-athena-sidebar-standard="v1"]{
  --athena-sidebar-standard-active:1;
}

[data-athena-sidebar-role="sidebar"]{
  color:var(--athena-sidebar-text);
}

[data-athena-sidebar-role="scroll"]{
  overflow-y:auto;
  overscroll-behavior:contain;
}

[data-athena-sidebar-role="item"]{
  min-height:var(--athena-sidebar-row);
}

[data-athena-sidebar-role="submenu"]{
  max-height:min(70vh,620px);
  overflow-y:auto;
}

/* ==========================================================================
   TABLET
   ========================================================================== */

@media(max-width:1050px) and (min-width:721px){

  .athena-sidebar-item,
  .athena32-nav,
  .u-nav-link{
    min-height:36px !important;
    height:36px !important;
  }

  .athena-sidebar-label,
  .athena32-label,
  .u-nav-link{
    font-size:12px !important;
  }

  .athena-sidebar-icon,
  .athena32-icon,
  .u-nav-icon{
    font-size:17px !important;
  }
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media(max-width:720px){

  .athena-sidebar{
    width:min(78vw,var(--athena-sidebar-mobile-width));
    max-width:var(--athena-sidebar-mobile-width);
  }

  .athena-sidebar-item,
  .athena32-nav,
  .u-nav-link{
    min-height:40px !important;
    height:40px !important;
  }

  .athena-sidebar-label,
  .athena32-label,
  .u-nav-link{
    font-size:13px !important;
  }

  .athena-sidebar-icon,
  .athena32-icon,
  .u-nav-icon{
    font-size:18px !important;
  }
}