/* Aperture Left 1.0.10 - SaaS sidebar, accordion navigation and DNN Persona Bar layout compatibility */
:root {
  --aperture-left-width: 280px;
  --aperture-personabar-offset: 0px;
}

@media (min-width: 768px) {
  .aperture-left-theme .aperture-left-layout {
    display: grid;
    grid-template-columns: var(--aperture-left-width) minmax(0, 1fr);
    min-height: 100vh;
  }

  .aperture-left-theme .aperture-left-page {
    grid-column: 2;
    min-width: 0;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
  }

  .aperture-left-theme .aperture-main { flex: 1 0 auto; }

  /* Desktop SaaS sidebar */
  .aperture-left-theme .aperture-left-sidebar {
    grid-column: 1;
    position: fixed;
    inset: 0 auto 0 0;
    width: var(--aperture-left-width);
    height: 100vh;
    z-index: 100;
    display: flex !important;
    flex-direction: column !important;
    background: #22272d !important;
    color: #f5f7f9;
    border-right: 0 !important;
    overflow-y: auto;
    box-shadow: 1px 0 0 rgba(255,255,255,.04), 8px 0 24px rgba(0,0,0,.08);
  }

  .aperture-left-theme .aperture-left-sidebar__inner {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 100%;
    padding: 2rem 1.25rem 1.4rem;
    box-sizing: border-box;
  }

  .aperture-left-theme .aperture-left-logo {
    margin: .25rem 0 2.25rem;
    padding: 0 .55rem;
  }

  .aperture-left-theme .aperture-left-logo a {
    display: inline-flex;
    max-width: 100%;
  }

  .aperture-left-theme .aperture-left-logo img,
  .aperture-left-theme .aperture-left-logo svg {
    display: block;
    max-width: 180px;
    max-height: 64px;
    width: auto;
    height: auto;
    filter: brightness(0) invert(1);
    opacity: .96;
  }

  .aperture-left-theme .aperture-left-nav {
    display: block !important;
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
  }

  /* Important: explicitly undo Aperture's horizontal desktop-menu rules. */
  .aperture-left-theme #nav-sidebar,
  .aperture-left-theme #nav-sidebar.aperture-left-menu,
  .aperture-left-theme .aperture-left-menu,
  .aperture-left-theme .aperture-left-menu__children {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: .2rem !important;
  }

  .aperture-left-theme .aperture-left-menu__item {
    display: block !important;
    width: 100% !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
  }

  .aperture-left-theme .aperture-left-menu__link {
    position: relative;
    display: flex !important;
    align-items: center;
    width: 100% !important;
    min-height: 44px;
    box-sizing: border-box;
    padding: .72rem .9rem !important;
    border-radius: 7px;
    color: #e7ebef !important;
    background: transparent !important;
    font-size: .95rem;
    font-weight: 500;
    line-height: 1.25;
    text-decoration: none !important;
    white-space: normal !important;
    transition: background-color .15s ease, color .15s ease;
  }

  .aperture-left-theme .aperture-left-menu__link:hover,
  .aperture-left-theme .aperture-left-menu__link:focus-visible {
    background: #2d333a !important;
    color: #fff !important;
    text-decoration: none !important;
    outline: none;
  }

  .aperture-left-theme .aperture-left-menu__link:focus-visible {
    box-shadow: inset 0 0 0 2px rgba(66,184,230,.85);
  }

  .aperture-left-theme .aperture-left-menu__item.selected > .aperture-left-menu__link {
    background: #30363d !important;
    color: #fff !important;
    font-weight: 650;
  }

  .aperture-left-theme .aperture-left-menu__item.selected > .aperture-left-menu__link::before {
    content: "";
    position: absolute;
    left: 0;
    top: 8px;
    bottom: 8px;
    width: 3px;
    border-radius: 3px;
    background: #2aa8df;
  }

  /* Accordion subnavigation: hidden until its parent is clicked. */
  .aperture-left-theme .aperture-left-menu__children {
    gap: .08rem !important;
    margin: 0 !important;
    padding: 0 0 0 .8rem !important;
    border-left: 1px solid rgba(255,255,255,.12);
    max-height: 0 !important;
    opacity: 0;
    overflow: hidden;
    visibility: hidden;
    transform: translateY(-6px);
    transition: max-height .28s ease, opacity .20s ease, transform .28s ease, margin .28s ease, visibility 0s linear .28s;
  }

  .aperture-left-theme .aperture-left-menu__item.is-open > .aperture-left-menu__children {
    max-height: 1200px !important;
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    margin: .12rem 0 .4rem !important;
    transition: max-height .34s ease, opacity .24s ease, transform .30s ease, margin .30s ease, visibility 0s;
  }

  .aperture-left-theme .aperture-left-menu__item.has-children > .aperture-left-menu__link {
    padding-right: 2.2rem !important;
  }

  .aperture-left-theme .aperture-left-menu__item.has-children > .aperture-left-menu__link::after {
    content: "";
    position: absolute;
    right: .9rem;
    top: 50%;
    width: .48rem;
    height: .48rem;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: translateY(-65%) rotate(45deg);
    opacity: .72;
    transition: transform .22s ease;
  }

  .aperture-left-theme .aperture-left-menu__item.has-children.is-open > .aperture-left-menu__link::after {
    transform: translateY(-35%) rotate(225deg);
  }

  .aperture-left-theme .aperture-left-menu__children .aperture-left-menu__link {
    min-height: 36px;
    padding: .48rem .75rem !important;
    color: #cbd2d8 !important;
    font-size: .89rem;
  }

  .aperture-left-theme .aperture-left-account {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: .65rem;
    width: 100%;
    padding: 1.15rem .55rem 0;
    margin-top: 1.25rem;
    box-sizing: border-box;
    border-top: 1px solid rgba(255,255,255,.12);
    color: #d6dce1;
    font-size: .9rem;
  }

  .aperture-left-theme .aperture-left-account a,
  .aperture-left-theme .aperture-left-account span {
    color: #d6dce1 !important;
  }

  .aperture-left-theme .aperture-left-account a:hover,
  .aperture-left-theme .aperture-left-account a:focus-visible {
    color: #fff !important;
  }

  /* Stock Aperture constrains inner content; keep that behavior in the content column. */
  .aperture-left-theme .aperture-left-page .aperture-container { max-width: none; }
}

@media (max-width: 767.98px) {
  .aperture-left-theme .aperture-left-layout { display: block; }
  .aperture-left-theme .aperture-left-page { min-width: 0; }
}

/* Persona Bar compatibility.
   DNN overlays the permanent Persona Bar rail on the left side of the page.
   When present we must move BOTH the fixed sidebar and the normal page grid.
   Moving only the fixed sidebar causes it to overlap the content column. */
@media (min-width: 768px) {
  /* DNN already shifts the normal page/form to the right when the Persona Bar
     rail is present. Do NOT add that offset a second time to the theme grid.
     Only the fixed sidebar needs an explicit viewport offset. */
  body.aperture-personabar-present .aperture-left-theme {
    margin-left: 0 !important;
    width: 100% !important;
    max-width: none !important;
    transform: none !important;
  }

  body.aperture-personabar-present .aperture-left-theme .aperture-left-sidebar {
    left: var(--aperture-personabar-offset, 80px) !important;
    transition: left .18s ease;
  }
}

/* Aperture Left 1.0.8 - footer alignment with Persona Bar
   Keep the footer background and its inner container anchored to the content
   column. Stock Aperture/DNN admin styles can otherwise contribute an extra
   left margin when the Persona Bar is present. */
@media (min-width: 768px) {
  .aperture-left-theme .aperture-left-page > .aperture-footer {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    transform: none !important;
    box-sizing: border-box;
  }

  .aperture-left-theme .aperture-left-page > .aperture-footer > .aperture-container {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box;
  }

  body.aperture-personabar-present .aperture-left-theme .aperture-left-page > .aperture-footer,
  body.aperture-personabar-present .aperture-left-theme .aperture-left-page > .aperture-footer > .aperture-container {
    left: auto !important;
    right: auto !important;
    margin-left: 0 !important;
    transform: none !important;
  }
}


/* Aperture Left 1.0.9 - hard footer reset in Persona Bar mode.
   DNN/Aperture may inject a more specific admin rule against .aperture-footer.
   Use DNN's normal Body/Form ids to outrank those selectors; JS adds an inline
   !important safety net as well. */
@media (min-width: 768px) {
  html body#Body.aperture-personabar-present form#Form .aperture-left-theme .aperture-left-page > footer.aperture-footer {
    position: relative !important;
    left: 0 !important;
    right: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    transform: none !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }

  html body#Body.aperture-personabar-present form#Form .aperture-left-theme .aperture-left-page > footer.aperture-footer > .aperture-container {
    position: relative !important;
    left: 0 !important;
    right: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    transform: none !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }
}


/* 1.0.10: prevent double Persona Bar offset on the normal-flow grid. */
@media (min-width: 768px) {
  html body#Body.aperture-personabar-present form#Form .aperture-left-theme,
  html body#Body.aperture-personabar-present form#Form .aperture-left-theme .aperture-left-layout {
    margin-left: 0 !important;
    left: auto !important;
    transform: none !important;
  }
}