/* SAVAGE Admin sidebar alignment update.
   Keeps the existing SVG icon system and all server-backed navigation intact. */
:root {
  --savage-nav-column: 20px;
  --savage-nav-gap: 13px;
}
@media screen and (min-width:801px) {
  .shell {
    grid-template-columns: 248px minmax(0,1fr);
    align-items:stretch;
  }
  .sidebar {
    position:sticky;
    top:18px;
    height:calc(100dvh - 36px);
    max-height:calc(100dvh - 36px);
    overflow:hidden;
  }
  .sidebar-brand {padding:2px 12px 23px;}
  .sidebar-caption {margin:7px 15px 12px;}
}
.sidebar {min-width:0;}
.sidebar nav#nav {
  display:flex;
  flex-direction:column;
  align-items:stretch;
  justify-content:flex-start;
  gap:3px;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:#517488 transparent;
  padding:0 2px 5px 0;
}
.sidebar nav#nav .sidebar-nav-item {
  position:relative;
  display:grid!important;
  grid-template-columns:var(--savage-nav-column) minmax(0,1fr);
  justify-content:start!important;
  align-items:center;
  column-gap:var(--savage-nav-gap);
  width:100%;
  min-height:43px;
  padding:10px 14px;
  margin:0;
  border:0;
  border-radius:10px;
  background:transparent;
  color:#bed2df;
  font-size:12.5px;
  line-height:1.35;
  font-weight:700;
  text-align:left;
  white-space:normal;
  transition:background-color .15s ease,color .15s ease;
}
.sidebar nav#nav .sidebar-nav-item .savage-ui-icon {
  display:block;
  grid-column:1;
  width:var(--savage-nav-column);
  height:var(--savage-nav-column);
  min-width:var(--savage-nav-column);
  margin:0;
  justify-self:center;
  align-self:center;
  stroke-width:1.9;
}
.sidebar nav#nav .sidebar-nav-label {
  display:block;
  grid-column:2;
  min-width:0;
  white-space:normal;
  overflow-wrap:break-word;
  line-height:1.35;
}
.sidebar nav#nav .sidebar-nav-item:hover,
.sidebar nav#nav .sidebar-nav-item:focus-visible {
  background:#23536a;
  color:#fff;
}
.sidebar nav#nav .sidebar-nav-item.on,
.sidebar nav#nav .sidebar-nav-item[aria-current="page"] {
  background:#286472;
  color:#fff;
  font-weight:800;
}
.sidebar nav#nav .sidebar-nav-item.on::after {
  content:"";
  position:absolute;
  width:3px;
  background:#e9c16f;
  border-radius:4px;
  top:11px;
  bottom:11px;
  right:5px;
}
.sidebar nav#nav .sidebar-nav-item:focus-visible {outline:2px solid #e9c16f;outline-offset:-2px;}
.sidebar-bottom {
  flex:none;
  margin-top:12px;
  padding:17px 10px 3px;
  min-width:0;
}
.sidebar-bottom>div {min-width:0;overflow-wrap:anywhere;}
@media screen and (min-width:801px) and (max-width:1100px) {
  .shell {grid-template-columns:232px minmax(0,1fr);}
  .sidebar nav#nav .sidebar-nav-item {padding:10px 12px;}
}
@media screen and (max-width:800px) {
  .sidebar {
    height:100dvh;
    max-height:100dvh;
    overflow:hidden;
    display:flex;
    flex-direction:column;
  }
  .sidebar nav#nav {
    flex:1 1 auto!important;
    display:flex!important;
    flex-direction:column!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    width:100%;
    min-height:0;
    padding:0 3px 10px 0;
  }
  .sidebar nav#nav .sidebar-nav-item {
    width:100%;
    min-height:44px;
    padding:11px 13px!important;
    font-size:13px!important;
    white-space:normal!important;
    flex:none;
  }
  .sidebar-brand {flex:none;}
  .sidebar-caption {flex:none;}
  .sidebar-bottom {flex:none;}
}
@media (prefers-reduced-motion: reduce) {
  .sidebar nav#nav .sidebar-nav-item {transition:none;}
}
@media print { .sidebar {position:static!important;} }
