/* InstruLab Master Sidebar v1.0 — official shell contract */
:root{
  --il-sidebar-width:230px;
  --il-sidebar-bg:#08233d;
  --il-sidebar-bg-2:#0a2b4a;
  --il-sidebar-active:#0b7cf6;
}
body > .app{
  grid-template-columns:var(--il-sidebar-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:auto!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:#fff!important;
  font-family:Arial,Helvetica,sans-serif!important;
  box-shadow:none!important;
  z-index:30;
}
.il-master-brand{
  display:flex;align-items:center;min-height:58px;padding:6px 8px 13px;margin-bottom:10px;
  border-bottom:1px solid rgba(255,255,255,.10)
}
.il-master-brand img{display:block!important;width:176px!important;max-width:100%!important;height:auto!important;filter:none!important}
.il-master-menu{display:flex!important;flex-direction:column!important;gap:2px!important}
.il-master-item{
  width:100%!important;min-height:44px!important;display:flex!important;align-items:center!important;gap:11px!important;
  margin:0!important;padding:9px 12px!important;border:0!important;border-radius:8px!important;background:transparent!important;
  color:#fff!important;text-align:left!important;font:400 13px/1.15 Arial,Helvetica,sans-serif!important;cursor:pointer!important;
  box-shadow:none!important;transform:none!important
}
.il-master-item span{color:#fff!important;white-space:nowrap!important}
.il-master-item:hover{background:rgba(255,255,255,.08)!important;color:#fff!important;transform:none!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
}
.il-master-item[data-il-key="ai"].active{
  background:linear-gradient(90deg,#0b83ff,#0a6be8)!important
}
.il-master-bottom{margin-top:auto;padding-top:14px;border-top:1px solid rgba(255,255,255,.10)}
.factory-approved-frame{grid-template-columns:var(--il-sidebar-width) minmax(0,1fr)!important}
.factory-approved-frame > .il-master-sidebar{width:var(--il-sidebar-width)!important}
@media(max-width:900px){
  body > .app{grid-template-columns:1fr!important}
  body > .app > .il-master-sidebar{display:none!important}
  .factory-approved-frame{grid-template-columns:1fr!important}
  .factory-approved-frame > .il-master-sidebar{display:none!important}
}

/* PRODUCTION_LEGACY_OVERRIDE_V1
   The legacy integrated shell ships older high-specificity !important rules.
   This block is intentionally more specific so the official master sidebar
   remains the single visual contract 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 > 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-y:auto!important;
  overflow-x: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 .il-master-brand{
  display:flex!important;
  align-items:center!important;
  min-height:58px!important;
  margin:0 0 10px!important;
  padding:6px 8px 13px!important;
  border:0!important;
  border-bottom:1px solid rgba(255,255,255,.10)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

html body > div.app > aside:first-of-type.il-master-sidebar .il-master-brand img{
  display:block!important;
  width:176px!important;
  max-width:100%!important;
  height:auto!important;
  opacity:1!important;
  filter:none!important;
}

html body > div.app > aside:first-of-type.il-master-sidebar .il-master-menu{
  display:flex!important;
  flex-direction:column!important;
  gap:2px!important;
}

html body > div.app > aside:first-of-type.il-master-sidebar .il-master-item{
  display:flex!important;
  width:100%!important;
  min-height:44px!important;
  align-items:center!important;
  gap:11px!important;
  margin:0!important;
  padding:9px 12px!important;
  border:0!important;
  border-radius:8px!important;
  background:transparent!important;
  color:#fff!important;
  font:400 13px/1.15 Arial,Helvetica,sans-serif!important;
  text-align:left!important;
  box-shadow:none!important;
  opacity:1!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:auto!important;
  padding-top:14px!important;
  border-top:1px solid rgba(255,255,255,.10)!important;
}

@media screen and (max-width:1000px){
  html body > div.app{
    grid-template-columns:var(--il-sidebar-width) minmax(0,1fr)!important;
  }
  html body > div.app > aside:first-of-type.il-master-sidebar{
    display:flex!important;
    width:var(--il-sidebar-width)!important;
    min-width:var(--il-sidebar-width)!important;
    max-width:var(--il-sidebar-width)!important;
  }
}

@media screen and (max-width:680px){
  html body > div.app{
    grid-template-columns:1fr!important;
  }
  html body > div.app > aside:first-of-type.il-master-sidebar{
    display:none!important;
  }
}
