/* ==========================================================================
   ATHENA_CONTEXTUAL_SIDEBAR_ROUTING_V100_CSS
   Uses Universe as the reference sidebar language.
   ========================================================================== */

:root{
  --acs-bg1:#081d39;
  --acs-bg2:#09264d;
  --acs-bg3:#061b37;

  --acs-gold:#f3c35d;

  --acs-text:#f4f7fb;
  --acs-muted:#9eafc4;
  --acs-dim:#758aa5;

  --acs-line:rgba(255,255,255,.11);

  --acs-hover:rgba(255,255,255,.055);

  --acs-active1:rgba(37,78,124,.72);
  --acs-active2:rgba(19,53,91,.65);

  --acs-row:42px;

  --acs-font:13px;
  --acs-heading:9px;

  --acs-radius:8px;
}

/* --------------------------------------------------------------------------
   SIDEBAR
   -------------------------------------------------------------------------- */

.athena-contextual-sidebar{
  display:flex !important;
  flex-direction:column !important;

  color:var(--acs-text) !important;

  background:
    linear-gradient(
      180deg,
      var(--acs-bg1),
      var(--acs-bg2) 53%,
      var(--acs-bg3)
    ) !important;

  overflow:hidden !important;
}

/* --------------------------------------------------------------------------
   HEADER
   -------------------------------------------------------------------------- */

.acs-header{
  flex:0 0 auto;

  min-height:78px;

  display:flex;
  align-items:center;

  gap:12px;

  padding:14px 18px;

  border-bottom:1px solid var(--acs-line);
}

.acs-header-icon{
  width:35px;
  min-width:35px;
  height:35px;

  display:grid;
  place-items:center;

  color:var(--acs-gold);

  font-size:26px;
}

.acs-header-copy{
  min-width:0;
}

.acs-header-title{
  display:block;

  color:#f5ce68;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size:22px;
  font-weight:600;

  letter-spacing:.025em;
  line-height:1.05;
}

.acs-header-subtitle{
  display:block;

  margin-top:4px;

  color:var(--acs-muted);

  font-size:9.5px;

  line-height:1.2;
}

/* --------------------------------------------------------------------------
   ATHENA HOME
   -------------------------------------------------------------------------- */

.acs-home{
  flex:0 0 auto;

  min-height:42px;

  display:flex;
  align-items:center;

  margin:13px 11px 7px;

  padding:0 12px;

  border:
    1px
    solid
    rgba(255,255,255,.10);

  border-radius:9px;

  color:#bdcadd;

  background:
    rgba(255,255,255,.015);

  font-size:12px;

  text-decoration:none;
}

.acs-home:hover{
  color:#fff;

  background:
    rgba(255,255,255,.05);
}

/* --------------------------------------------------------------------------
   NAVIGATION SCROLL
   -------------------------------------------------------------------------- */

.acs-scroll{
  flex:1 1 auto;

  min-height:0;

  overflow-y:auto;
  overflow-x:hidden;

  overscroll-behavior:contain;

  padding:
    2px
    0
    12px;

  scrollbar-width:thin;

  scrollbar-color:
    rgba(255,255,255,.26)
    transparent;
}

.acs-scroll::-webkit-scrollbar{
  width:5px;
}

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

.acs-scroll::-webkit-scrollbar-thumb{
  background:
    rgba(255,255,255,.24);

  border-radius:999px;
}

/* --------------------------------------------------------------------------
   CATEGORY
   -------------------------------------------------------------------------- */

.acs-category{
  min-height:27px;

  display:flex;
  align-items:flex-end;

  padding:
    9px
    24px
    5px;

  color:var(--acs-dim);

  font-size:var(--acs-heading);
  font-weight:800;

  letter-spacing:.16em;

  line-height:1;

  text-transform:uppercase;
}

/* --------------------------------------------------------------------------
   ITEM
   -------------------------------------------------------------------------- */

.acs-item{
  position:relative;

  min-height:var(--acs-row);
  height:var(--acs-row);

  display:flex;
  align-items:center;

  gap:10px;

  margin:2px 9px;

  padding:0 14px;

  border-radius:var(--acs-radius);

  color:var(--acs-text);

  background:transparent;

  text-decoration:none;

  font-size:var(--acs-font);
  font-weight:500;

  line-height:1.15;
}

.acs-item:hover{
  color:#fff;

  background:
    var(--acs-hover);
}

.acs-item.active,
.acs-item[aria-current="page"]{
  color:#fff;

  background:
    linear-gradient(
      90deg,
      var(--acs-active1),
      var(--acs-active2)
    );
}

.acs-item.active::before,
.acs-item[aria-current="page"]::before{
  content:"";

  position:absolute;

  left:-9px;
  top:3px;
  bottom:3px;

  width:4px;

  border-radius:
    0
    4px
    4px
    0;

  background:
    var(--acs-gold);
}

.acs-icon{
  width:23px;
  min-width:23px;
  height:23px;

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

  color:#edf3fa;

  font-size:17px;
}

.acs-item.active .acs-icon{
  color:var(--acs-gold);
}

.acs-label{
  min-width:0;

  overflow:hidden;

  text-overflow:ellipsis;

  white-space:nowrap;
}

/* --------------------------------------------------------------------------
   FOOTER
   -------------------------------------------------------------------------- */

.acs-footer{
  flex:0 0 auto;

  padding:
    7px
    9px
    9px;

  border-top:
    1px
    solid
    var(--acs-line);

  background:
    rgba(0,17,38,.16);
}

.acs-footer-link{
  min-height:37px;

  display:flex;
  align-items:center;

  gap:9px;

  padding:
    0
    12px;

  border-radius:8px;

  color:#aebdd0;

  font-size:11.5px;

  text-decoration:none;
}

.acs-footer-link:hover{
  color:#fff;

  background:
    rgba(255,255,255,.05);
}

/* --------------------------------------------------------------------------
   MOBILE
   -------------------------------------------------------------------------- */

@media(max-width:720px){

  .acs-header{
    min-height:68px;

    padding:
      11px
      14px;
  }

  .acs-header-title{
    font-size:20px;
  }

  .acs-item{
    min-height:40px;
    height:40px;
  }

}