/* Cape Ranch — sidebar brand layout correction. Loaded last by index.html. */
.sidebar .brand{
  display:grid!important;
  grid-template-columns:50px minmax(0,1fr)!important;
  grid-template-rows:auto auto!important;
  grid-template-areas:"logo name" "toggle toggle"!important;
  align-items:center!important;
  gap:9px 11px!important;
  min-height:0!important;
  margin:0 0 11px!important;
  padding:8px 8px 15px!important;
  width:100%;
  max-width:100%;
  border-bottom:1px solid rgba(255,255,255,.19);
}
.sidebar .brand-icon{
  grid-area:logo;
  width:48px!important;
  height:48px!important;
  min-width:0!important;
  margin:0!important;
  display:grid;
  place-items:center;
  align-self:center;
}
.sidebar .brand-icon img{width:48px!important;height:48px!important;max-width:100%;object-fit:contain}
.sidebar .brand-name{
  grid-area:name;
  display:block;
  min-width:0!important;
  max-width:100%;
  overflow-wrap:break-word;
  word-break:normal;
  white-space:normal!important;
  font-size:15px;
  line-height:1.28;
  letter-spacing:0;
}
.sidebar .brand-name small{
  display:block;
  margin-top:5px;
  max-width:100%;
  font-size:9px;
  line-height:1.4;
  letter-spacing:1.3px!important;
  white-space:normal!important;
  word-break:normal;
  overflow-wrap:break-word;
}
.sidebar .sidebar-toggle{
  grid-area:toggle;
  justify-self:end!important;
  align-self:center;
  position:static!important;
  display:grid!important;
  place-items:center;
  width:38px!important;
  min-width:38px!important;
  height:34px!important;
  padding:0!important;
  margin:0!important;
  flex:none!important;
  line-height:1;
  border:1px solid rgba(255,255,255,.24);
  background:rgba(255,255,255,.08);
  border-radius:9px;
  color:#fff;
  font-size:19px;
  cursor:pointer;
  transition:background .15s ease;
}
.sidebar .sidebar-toggle:hover,.sidebar .sidebar-toggle:focus-visible{background:rgba(255,255,255,.21)}
.sidebar .sidebar-toggle:focus-visible{outline:2px solid #d4f2df;outline-offset:2px}
/* Collapse layout: icon and toggle occupy independent rows; labels disappear. */
.app-shell.is-collapsed .sidebar{width:68px!important;flex-basis:68px!important;padding-left:8px!important;padding-right:8px!important}
.app-shell.is-collapsed .sidebar .brand{
  grid-template-columns:1fr!important;grid-template-rows:auto auto!important;
  grid-template-areas:"logo" "toggle"!important;
  padding:6px 0 14px!important;
  justify-items:center!important;
}
.app-shell.is-collapsed .sidebar .brand-name{display:none!important}
.app-shell.is-collapsed .sidebar .sidebar-toggle{justify-self:center!important}
.app-shell.is-collapsed .sidebar .brand-icon,.app-shell.is-collapsed .sidebar .brand-icon img{width:44px!important;height:44px!important}
.app-shell.is-collapsed .sidebar .nav-label,.app-shell.is-collapsed .sidebar .nav-text{display:none!important}
.app-shell.is-collapsed .sidebar .nav-link{justify-content:center!important;padding:11px 0!important}
@media(max-width:710px){
 .sidebar .brand{grid-template-columns:48px minmax(0,1fr)!important}
 .app-shell.is-collapsed .sidebar{width:245px!important;flex-basis:245px!important;left:-260px}
 .app-shell.is-collapsed .sidebar.open{left:0}
 .app-shell.is-collapsed .sidebar .brand{grid-template-columns:48px minmax(0,1fr)!important;grid-template-rows:auto auto!important;grid-template-areas:"logo name" "toggle toggle"!important;justify-items:stretch!important}
 .app-shell.is-collapsed .sidebar .brand-name{display:block!important}
 .app-shell.is-collapsed .sidebar .sidebar-toggle{justify-self:end!important}
 .app-shell.is-collapsed .sidebar .nav-label,.app-shell.is-collapsed .sidebar .nav-text{display:initial!important}
 .app-shell.is-collapsed .sidebar .nav-link{justify-content:flex-start!important;padding:11px 13px!important}
}