/* V9.6.13 — Sidebar contrast + theme refresh stability.
   Loaded after every prior admin stylesheet. Uses the contrast-safe variables
   generated by theme.php instead of hard-coded light/dark menu colors. */

/* The sidebar must always use the Appearance Studio palette coherently. */
html body.app-body .app-sidebar{
  background:var(--navy-900,#0b2747)!important;
  color:var(--sidebar-text,#eaf2fc)!important;
  border-right-color:var(--sidebar-border,#203043)!important;
}
html body.app-body .app-sidebar .app-brand{
  border-bottom-color:var(--sidebar-border,#203043)!important;
}
html body.app-body .app-sidebar .app-brand strong,
html body.app-body .app-sidebar .app-brand small{
  color:var(--sidebar-text,#eaf2fc)!important;
}

/* V9.6.11 sidebar-only navigation: never hard-code pale text over a light sidebar. */
html body.app-body .app-nav.v9611-admin-nav>.v9611-dashboard-link,
html body.app-body .app-nav.v9611-admin-nav .v9611-group-toggle{
  color:color-mix(in srgb,var(--sidebar-text,#eaf2fc) 88%,transparent)!important;
}
html body.app-body .app-nav.v9611-admin-nav>.v9611-dashboard-link>i,
html body.app-body .app-nav.v9611-admin-nav .v9611-group-icon,
html body.app-body .v9611-group-chevron{
  color:color-mix(in srgb,var(--sidebar-text,#eaf2fc) 72%,var(--blue-600,#2563eb))!important;
}
html body.app-body .app-nav.v9611-admin-nav>.v9611-dashboard-link:hover,
html body.app-body .app-nav.v9611-admin-nav .v9611-group-toggle:hover{
  background:color-mix(in srgb,var(--sidebar-active,#eef2f7) 65%,transparent)!important;
  color:var(--sidebar-text,#eaf2fc)!important;
}
html body.app-body .app-nav.v9611-admin-nav>.v9611-dashboard-link.active,
html body.app-body .v9611-nav-group.active>.v9611-group-toggle{
  background:var(--sidebar-active,#eef2f7)!important;
  color:var(--sidebar-active-text,#111827)!important;
  border-color:color-mix(in srgb,var(--sidebar-border,#e4e7ec) 75%,transparent)!important;
  box-shadow:none!important;
}
html body.app-body .app-nav.v9611-admin-nav>.v9611-dashboard-link.active>i,
html body.app-body .v9611-nav-group.active>.v9611-group-toggle>.v9611-group-icon,
html body.app-body .v9611-nav-group.active>.v9611-group-toggle>.v9611-group-chevron{
  color:var(--sidebar-active-text,#111827)!important;
}
html body.app-body .v9611-submenu{
  border-left-color:color-mix(in srgb,var(--sidebar-text,#eaf2fc) 22%,transparent)!important;
}
html body.app-body .app-nav.v9611-admin-nav .v9611-submenu a{
  color:color-mix(in srgb,var(--sidebar-text,#eaf2fc) 73%,transparent)!important;
}
html body.app-body .app-nav.v9611-admin-nav .v9611-submenu a>i{
  color:color-mix(in srgb,var(--sidebar-text,#eaf2fc) 58%,var(--blue-600,#2563eb))!important;
}
html body.app-body .app-nav.v9611-admin-nav .v9611-submenu a:hover{
  background:color-mix(in srgb,var(--sidebar-active,#eef2f7) 55%,transparent)!important;
  color:var(--sidebar-text,#eaf2fc)!important;
}
html body.app-body .app-nav.v9611-admin-nav .v9611-submenu a.active{
  background:var(--sidebar-active,#eef2f7)!important;
  color:var(--sidebar-active-text,#111827)!important;
}
html body.app-body .app-nav.v9611-admin-nav .v9611-submenu a.active>i{
  color:var(--sidebar-active-text,#111827)!important;
}
html body.app-body .v9611-submenu-label{
  color:color-mix(in srgb,var(--sidebar-text,#eaf2fc) 55%,transparent)!important;
}
html body.app-body .v9611-submenu-divider{
  background:color-mix(in srgb,var(--sidebar-text,#eaf2fc) 16%,transparent)!important;
}
html body.app-body .v968-sidebar-collapse{
  background:color-mix(in srgb,var(--sidebar-active,#eef2f7) 35%,transparent)!important;
  border-color:color-mix(in srgb,var(--sidebar-text,#eaf2fc) 28%,transparent)!important;
  color:var(--sidebar-text,#eaf2fc)!important;
}
html body.app-body .v968-sidebar-collapse:hover{
  background:var(--sidebar-active,#eef2f7)!important;
  color:var(--sidebar-active-text,#111827)!important;
}

/* Explicit dark fallback still follows the same variables, so Appearance Studio
   and the header toggle cannot fight over a second sidebar palette. */
html[data-admin-theme="dark"] body.app-body .app-sidebar,
html[data-otp-theme="dark"] body.app-body .app-sidebar{
  background:var(--navy-900,#111318)!important;
  color:var(--sidebar-text,#f5f7fb)!important;
  border-right-color:var(--sidebar-border,#2d313a)!important;
}

/* Avoid a one-frame color animation/flicker while theme attributes are synchronized. */
html:not([data-admin-theme]) body.app-body .app-sidebar,
html:not([data-otp-theme]) body.app-body .app-sidebar{transition:none!important}
