/* Deliberately scoped: the upstream T3 app owns its layout and theme. */
#council-navigation {
  --cn-bg: var(--sidebar, #f5f5f5);
  --cn-fg: var(--sidebar-foreground, #262626);
  --cn-muted: var(--muted-foreground, #656565);
  --cn-line: var(--sidebar-border, #dedede);
  --cn-selected: var(--background, #fff);
  display: flex;
  align-items: center;
  gap: 2px;
  box-sizing: border-box;
  padding: 3px;
  border: 1px solid var(--cn-line);
  border-radius: var(--control-radius, 8px);
  background: var(--cn-bg);
  color: var(--cn-fg);
  font: 500 13px/1.25 var(--font-sans, system-ui, sans-serif);
  -webkit-app-region: no-drag;
}
#council-navigation[data-placement="sidebar"] { flex-shrink: 0; margin: 4px 12px 10px; }
#council-navigation[data-placement="floating"] {
  position: fixed;
  z-index: 61;
  top: max(8px, env(safe-area-inset-top));
  right: max(12px, env(safe-area-inset-right));
  width: 184px;
  box-shadow: 0 1px 3px #0000000d;
}
#council-navigation[data-placement="direct"] { flex-shrink: 0; margin-left: auto; }
#council-navigation > button, #council-navigation > a {
  display: flex;
  flex: 1 1 0;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-width: 0;
  min-height: 32px;
  margin: 0;
  padding: 6px 10px;
  border: 0;
  border-radius: max(3px, calc(var(--control-radius, 8px) - 3px));
  background: transparent;
  color: var(--cn-muted);
  font: inherit;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  touch-action: manipulation;
}
#council-navigation > :hover { color: var(--cn-fg); background: var(--sidebar-accent, #88888814); }
#council-navigation > [aria-selected="true"], #council-navigation > [aria-current="page"] {
  color: var(--cn-fg);
  background: var(--cn-selected);
  box-shadow: 0 1px 2px #00000012;
}
#council-navigation > :focus-visible { outline: 2px solid var(--ring, #5a82c6); outline-offset: 2px; }
#council-navigation-panel {
  position: fixed;
  z-index: 60;
  inset: 0 0 0 0;
  box-sizing: border-box;
  background: var(--background, #fff);
  border-left: 1px solid var(--border, #dedede);
  overscroll-behavior: contain;
}
#council-navigation-panel[data-floating="true"] { padding-top: calc(56px + env(safe-area-inset-top)); }
#council-navigation-panel[hidden] { display: none !important; }
#council-navigation-panel > iframe { display: block; width: 100%; height: 100%; border: 0; background: inherit; }
#council-frame-feedback { position: absolute; inset: 56px 0 0; display: grid; align-content: center; justify-items: center; gap: 12px; padding: 24px; background: var(--background, #18191b); color: var(--foreground, #ececee); font-family: var(--font-sans, system-ui, sans-serif); text-align: center; }
#council-frame-feedback[hidden] { display: none !important; }
#council-frame-feedback h2 { margin: 0; font-size: 18px; }
#council-frame-feedback p { margin: 0; font-size: 14px; }
#council-frame-feedback button { padding: 9px 18px; border: 1px solid var(--border, #555); border-radius: 8px; color: inherit; background: var(--muted, #333); cursor: pointer; }
.council-navigation-embedded .masthead { min-height: 54px; }
.council-navigation-embedded .masthead .brand { font-size: 14px; }
.council-navigation-embedded .masthead .brand-mark { width: 28px; height: 28px; font-size: 18px; border-radius: 6px; }
/* Reserve a real row whenever there is no sidebar to dock into. Padding avoids
   margin collapse / page scrolling when T3 focuses its mobile composer. */
html.council-navigation-bar #root { padding-top: calc(56px + env(safe-area-inset-top)); height: 100dvh; box-sizing: border-box; }
html.council-navigation-bar #root [data-slot="sidebar-wrapper"] { height: calc(100dvh - 56px - env(safe-area-inset-top)) !important; min-height: 0 !important; }
html.council-navigation-bar #root main[data-slot="sidebar-inset"] { height: 100% !important; min-height: 0 !important; }
@media (prefers-color-scheme: dark) {
  #council-navigation { --cn-bg: var(--sidebar, #202020); --cn-fg: var(--sidebar-foreground, #e6e6e6); --cn-muted: var(--muted-foreground, #aaa); --cn-line: var(--sidebar-border, #363636); --cn-selected: var(--background, #303030); }
}
@media (max-width: 767px) {
  #council-navigation { font-size: 12px; }
  #council-navigation[data-placement="floating"] { width: calc(100% - 16px); right: 8px; }
  #council-navigation > button, #council-navigation > a { min-height: 38px; padding-inline: 8px; }
  #council-navigation[data-placement="direct"] { margin-left: 0; }
  .masthead:has(> #council-navigation) { flex-wrap: wrap; padding-block: 12px; gap: 10px; }
  #council-navigation-panel { border-left: 0; }
}
@media (forced-colors: active) {
  #council-navigation > [aria-selected="true"], #council-navigation > [aria-current="page"] { outline: 1px solid Highlight; }
}
