/* InstruLab Master Sidebar v2 — official shell contract */
:root{
  --il-sidebar-width:230px;
  --il-sidebar-mini-width:72px;
  --il-sidebar-bg:#08233d;
  --il-sidebar-bg-2:#0a2b4a;
  --il-sidebar-active:#0b7cf6;
  --il-sidebar-text:#fff;
}

body > .app{
  grid-template-columns:var(--il-sidebar-width) minmax(0,1fr)!important;
}
body > .app.il-sidebar-mini{
  grid-template-columns:var(--il-sidebar-mini-width) minmax(0,1fr)!important;
}

.il-master-sidebar{
  position:sticky!important;
  top:0!important;
  width:var(--il-sidebar-width)!important;
  min-width:var(--il-sidebar-width)!important;
  max-width:var(--il-sidebar-width)!important;
  height:100vh!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  padding:10px 10px 14px!important;
  background:linear-gradient(180deg,var(--il-sidebar-bg),var(--il-sidebar-bg-2))!important;
  border-right:1px solid rgba(255,255,255,.08)!important;
  color:var(--il-sidebar-text)!important;
  font-family:Arial,Helvetica,sans-serif!important;
  box-shadow:none!important;
  z-index:100;
  transition:width .2s ease,min-width .2s ease,max-width .2s ease,transform .22s ease;
}
.il-master-sidebar *{box-sizing:border-box}
.il-master-brand{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  min-height:58px!important;
  padding:6px 6px 13px!important;
  margin-bottom:8px!important;
  border-bottom:1px solid rgba(255,255,255,.10)!important;
  background:transparent!important;
}
.il-master-logo-full{
  display:block!important;
  width:162px!important;
  max-width:calc(100% - 34px)!important;
  height:auto!important;
  filter:none!important;
}
.il-master-logo-mini{
  display:none!important;
  width:34px!important;
  height:34px!important;
  object-fit:contain!important;
  filter:brightness(0) invert(1)!important;
}
.il-master-collapse{
  margin-left:auto!important;
  width:30px!important;
  height:30px!important;
  min-width:30px!important;
  display:grid!important;
  place-items:center!important;
  border:0!important;
  border-radius:7px!important;
  background:rgba(255,255,255,.07)!important;
  color:#fff!important;
  cursor:pointer!important;
  padding:0!important;
}
.il-master-collapse:hover,.il-master-collapse:focus-visible{
  background:rgba(255,255,255,.14)!important;
  outline:2px solid rgba(255,255,255,.65)!important;
  outline-offset:2px!important;
}
.il-master-menu{
  display:flex!important;
  flex:1 1 auto!important;
  min-height:0!important;
  flex-direction:column!important;
  gap:2px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,.22) transparent;
  padding-right:2px!important;
}
.il-master-item{
  width:100%!important;
  min-height:42px!important;
  display:flex!important;
  align-items:center!important;
  gap:11px!important;
  margin:0!important;
  padding:9px 10px!important;
  border:0!important;
  border-radius:8px!important;
  background:transparent!important;
  color:#fff!important;
  text-align:left!important;
  font:400 13px/1.2 Arial,Helvetica,sans-serif!important;
  cursor:pointer!important;
  box-shadow:none!important;
  transform:none!important;
  transition:background .15s ease,box-shadow .15s ease!important;
}
.il-master-item span{color:#fff!important}
.il-master-label{
  display:block!important;
  min-width:0!important;
  white-space:normal!important;
}
.il-master-item:hover{background:rgba(255,255,255,.08)!important;color:#fff!important}
.il-master-item:focus-visible{
  outline:2px solid rgba(255,255,255,.75)!important;
  outline-offset:2px!important;
}
.il-master-item.active{
  background:linear-gradient(90deg,#0b83ff,#0a6be8)!important;
  color:#fff!important;
  box-shadow:0 7px 18px rgba(0,115,255,.24)!important;
}
.il-master-icon{
  width:20px!important;
  height:20px!important;
  min-width:20px!important;
  display:block!important;
  fill:none!important;
  stroke:#fff!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.il-master-item[data-il-key="ai"],
.il-master-item[data-il-key="ai"] span,
.il-master-item[data-il-key="ai"] .il-master-icon{
  color:#fff!important;
  stroke:#fff!important;
  background-color:transparent!important;
}
.il-master-item[data-il-key="ai"].active{
  background:linear-gradient(90deg,#0b83ff,#0a6be8)!important;
}
.il-master-bottom{
  flex:0 0 auto!important;
  margin-top:8px!important;
  padding-top:10px!important;
  border-top:1px solid rgba(255,255,255,.10)!important;
}

/* Accordion */
.il-master-accordion{width:100%!important}
.il-master-accordion-trigger .il-master-chevron{
  width:16px!important;
  height:16px!important;
  min-width:16px!important;
  margin-left:auto!important;
  transition:transform .18s ease!important;
}
.il-master-accordion.is-open .il-master-chevron{transform:rotate(90deg)!important}
.il-master-submenu{
  display:none!important;
  flex-direction:column!important;
  gap:2px!important;
  padding:2px 0 4px 13px!important;
}
.il-master-accordion.is-open .il-master-submenu{display:flex!important}
.il-master-submenu .il-master-item{
  min-height:38px!important;
  padding:8px 8px!important;
  font-size:12.5px!important;
}
.il-master-submenu .il-master-item .il-master-icon{
  width:14px!important;
  height:14px!important;
  min-width:14px!important;
}

/* Mini sidebar */
.il-master-sidebar.is-mini{
  width:var(--il-sidebar-mini-width)!important;
  min-width:var(--il-sidebar-mini-width)!important;
  max-width:var(--il-sidebar-mini-width)!important;
  padding-left:8px!important;
  padding-right:8px!important;
}
.il-master-sidebar.is-mini .il-master-brand{
  justify-content:center!important;
  padding-left:0!important;
  padding-right:0!important;
}
.il-master-sidebar.is-mini .il-master-logo-full{display:none!important}
.il-master-sidebar.is-mini .il-master-logo-mini{display:block!important}
.il-master-sidebar.is-mini .il-master-collapse{
  position:absolute!important;
  top:58px!important;
  left:21px!important;
  margin:0!important;
  width:30px!important;
  height:30px!important;
}
.il-master-sidebar.is-mini .il-master-menu{padding-top:38px!important;padding-right:0!important}
.il-master-sidebar.is-mini .il-master-item{
  justify-content:center!important;
  padding:9px!important;
  gap:0!important;
}
.il-master-sidebar.is-mini .il-master-label,
.il-master-sidebar.is-mini .il-master-chevron{display:none!important}
.il-master-sidebar.is-mini .il-master-submenu{
  display:none!important;
  padding-left:0!important;
}
.il-master-sidebar.is-mini .il-master-accordion.is-open .il-master-submenu{
  display:none!important;
}
.il-master-sidebar.is-mini .il-master-item[title]{position:relative}

/* Factory frame follows same shell widths */
.factory-approved-frame{
  grid-template-columns:var(--il-sidebar-width) minmax(0,1fr)!important;
}
.factory-approved-frame.il-sidebar-mini{
  grid-template-columns:var(--il-sidebar-mini-width) minmax(0,1fr)!important;
}
.factory-approved-frame > .il-master-sidebar{
  width:var(--il-sidebar-width)!important;
}
.factory-approved-frame > .il-master-sidebar.is-mini{
  width:var(--il-sidebar-mini-width)!important;
  min-width:var(--il-sidebar-mini-width)!important;
  max-width:var(--il-sidebar-mini-width)!important;
}

/* Mobile / tablet off-canvas */
.il-master-mobile-toggle{
  display:none!important;
  position:fixed!important;
  top:12px!important;
  left:12px!important;
  z-index:10002!important;
  width:42px!important;
  height:42px!important;
  place-items:center!important;
  border:0!important;
  border-radius:9px!important;
  background:#08233d!important;
  color:#fff!important;
  box-shadow:0 6px 18px rgba(0,0,0,.18)!important;
  cursor:pointer!important;
}
.il-master-mobile-toggle .il-master-icon{width:22px!important;height:22px!important}
.il-master-overlay{
  display:none!important;
  position:fixed!important;
  inset:0!important;
  z-index:10000!important;
  border:0!important;
  background:rgba(6,20,34,.48)!important;
  padding:0!important;
}
body.il-sidebar-mobile-open{overflow:hidden!important}
body.il-sidebar-mobile-open .il-master-overlay{display:block!important}

@media screen and (max-width:900px){
  body > .app,
  body > .app.il-sidebar-mini,
  .factory-approved-frame,
  .factory-approved-frame.il-sidebar-mini{
    grid-template-columns:1fr!important;
  }
  html body > div.app > aside:first-of-type.il-master-sidebar,
  body > .app > .il-master-sidebar,
  .factory-approved-frame > .il-master-sidebar{
    display:flex!important;
    position:fixed!important;
    top:0!important;
    left:0!important;
    width:var(--il-sidebar-width)!important;
    min-width:var(--il-sidebar-width)!important;
    max-width:var(--il-sidebar-width)!important;
    height:100vh!important;
    transform:translateX(-105%)!important;
    z-index:10001!important;
  }
  html body > div.app > aside:first-of-type.il-master-sidebar.is-open,
  body > .app > .il-master-sidebar.is-open,
  .factory-approved-frame > .il-master-sidebar.is-open{
    transform:translateX(0)!important;
  }
  .il-master-sidebar.is-mini{
    width:var(--il-sidebar-width)!important;
    min-width:var(--il-sidebar-width)!important;
    max-width:var(--il-sidebar-width)!important;
  }
  .il-master-sidebar .il-master-brand,
  .il-master-sidebar.is-mini .il-master-brand{
    min-height:64px!important;
    padding:7px 48px 13px 8px!important;
  }
  .il-master-sidebar .il-master-logo-full,
  .il-master-sidebar.is-mini .il-master-logo-full{
    display:block!important;
    width:166px!important;
    max-width:166px!important;
    height:auto!important;
  }
  .il-master-sidebar .il-master-logo-mini,
  .il-master-sidebar.is-mini .il-master-logo-mini{display:none!important}
  .il-master-sidebar .il-master-collapse,
  .il-master-sidebar.is-mini .il-master-collapse{display:none!important}
  .il-master-sidebar.is-mini .il-master-menu{padding-top:0!important}
  .il-master-sidebar.is-mini .il-master-item{
    justify-content:flex-start!important;
    padding:9px 10px!important;
    gap:11px!important;
  }
  .il-master-sidebar.is-mini .il-master-label,
  .il-master-sidebar.is-mini .il-master-chevron{display:block!important}
  .il-master-mobile-toggle{display:grid!important}
  body.il-sidebar-mobile-open .il-master-mobile-toggle{
    left:178px!important;
    top:17px!important;
    background:rgba(255,255,255,.10)!important;
    box-shadow:none!important;
  }
  body.il-sidebar-mobile-open .factory-approved-footer,
  body.il-sidebar-mobile-open .fv-footer{
    z-index:1!important;
  }
}

/* PRODUCTION_LEGACY_OVERRIDE_V2
   Legacy integrated shell contains high-specificity !important rules.
   These selectors keep the v2 sidebar contract authoritative in production. */
html body > div.app{
  display:grid!important;
  grid-template-columns:var(--il-sidebar-width) minmax(0,1fr)!important;
  width:100%!important;
  max-width:100vw!important;
  overflow:hidden!important;
  background:#f4f7fa!important;
}
html body > div.app.il-sidebar-mini{
  grid-template-columns:var(--il-sidebar-mini-width) minmax(0,1fr)!important;
}
html body > div.app > aside:first-of-type.il-master-sidebar{
  display:flex!important;
  position:sticky!important;
  top:0!important;
  width:var(--il-sidebar-width)!important;
  min-width:var(--il-sidebar-width)!important;
  max-width:var(--il-sidebar-width)!important;
  height:100vh!important;
  max-height:100vh!important;
  overflow:hidden!important;
  padding:10px 10px 14px!important;
  background:linear-gradient(180deg,var(--il-sidebar-bg),var(--il-sidebar-bg-2))!important;
  color:#fff!important;
  border-right:1px solid rgba(255,255,255,.08)!important;
  box-shadow:none!important;
  z-index:100!important;
  font-family:Arial,Helvetica,sans-serif!important;
}
html body > div.app > aside:first-of-type.il-master-sidebar.is-mini{
  width:var(--il-sidebar-mini-width)!important;
  min-width:var(--il-sidebar-mini-width)!important;
  max-width:var(--il-sidebar-mini-width)!important;
}
html body > div.app > aside:first-of-type.il-master-sidebar .il-master-brand{
  display:flex!important;
  align-items:center!important;
  background:transparent!important;
  box-shadow:none!important;
}
html body > div.app > aside:first-of-type.il-master-sidebar .il-master-menu{
  display:flex!important;
  flex-direction:column!important;
}
html body > div.app > aside:first-of-type.il-master-sidebar .il-master-item{
  display:flex!important;
  color:#fff!important;
  background:transparent!important;
  opacity:1!important;
  font-weight:400!important;
}
html body > div.app > aside:first-of-type.il-master-sidebar .il-master-item .il-master-label{
  font-weight:400!important;
}
html body > div.app > aside:first-of-type.il-master-sidebar .il-master-item span{
  color:#fff!important;
  opacity:1!important;
}
html body > div.app > aside:first-of-type.il-master-sidebar .il-master-item .il-master-icon{
  stroke:#fff!important;
  opacity:1!important;
}
html body > div.app > aside:first-of-type.il-master-sidebar .il-master-item:hover{
  background:rgba(255,255,255,.08)!important;
}
html body > div.app > aside:first-of-type.il-master-sidebar .il-master-item.active,
html body > div.app > aside:first-of-type.il-master-sidebar .il-master-item[data-il-key="ai"].active{
  background:linear-gradient(90deg,#0b83ff,#0a6be8)!important;
  color:#fff!important;
  box-shadow:0 7px 18px rgba(0,115,255,.24)!important;
}
html body > div.app > aside:first-of-type.il-master-sidebar .il-master-item[data-il-key="ai"]{
  background:transparent!important;
  border:0!important;
  color:#fff!important;
}
html body > div.app > aside:first-of-type.il-master-sidebar .il-master-bottom{
  margin-top:8px!important;
  padding-top:10px!important;
  border-top:1px solid rgba(255,255,255,.10)!important;
}

@media screen and (max-width:900px){
  html body > div.app,
  html body > div.app.il-sidebar-mini{
    grid-template-columns:1fr!important;
  }
  html body > div.app > aside:first-of-type.il-master-sidebar,
  html body > div.app > aside:first-of-type.il-master-sidebar.is-mini{
    display:flex!important;
    position:fixed!important;
    width:var(--il-sidebar-width)!important;
    min-width:var(--il-sidebar-width)!important;
    max-width:var(--il-sidebar-width)!important;
    transform:translateX(-105%)!important;
  }
  html body > div.app > aside:first-of-type.il-master-sidebar.is-open{
    transform:translateX(0)!important;
  }
}
