/**
 * Dev Studio Theme — Panel Dark Theme Override
 *
 * Overrides OH's default CSS variables to match Panel's dark theme.
 * Panel uses: #0a0a0a bg, Karla body font, Poppins heading font.
 *
 * Import this CSS at the top of the OH app entry point.
 *
 * Fork delta: This file is NEW (not in upstream OH)
 */

:root {
  /* Background */
  --bg-dark: #0a0a0a;
  --bg-secondary: #121212;
  --bg-tertiary: #1a1a1a;
  --bg-hover: #1f1f1f;
  --bg-active: #252525;

  /* Text */
  --text-primary: #e5e5e5;
  --text-secondary: #a0a0a0;
  --text-muted: #666666;

  /* Borders */
  --border-color: #1e1e1e;
  --border-hover: #333333;

  /* Accent */
  --accent-color: #3b82f6;
  --accent-hover: #2563eb;

  /* Typography — match Panel fonts */
  --font-body: "Karla", sans-serif;
  --font-heading: "Poppins", sans-serif;
  --font-mono: "JetBrains Mono", "Fira Code", monospace;

  /* Scrollbar */
  --scrollbar-thumb: #333333;
  --scrollbar-track: transparent;
}

/* Override OH body defaults */
body {
  background-color: var(--bg-dark);
  color: var(--text-primary);
  font-family: var(--font-body);
}

/* Hide OH sidebar elements not needed in the embedded iframe.
 * V0 used data-testid="sidebar-logo", "sidebar-user-menu", "sidebar-settings-link".
 * V1 changed to: no testid on logo, "user-actions" on user menu, no settings link.
 * We keep V0 selectors as no-ops for safety alongside V1 selectors.
 */
[data-testid="sidebar-logo"],
[data-testid="sidebar-user-menu"],
[data-testid="sidebar-settings-link"],
[data-testid="user-actions"] {
  display: none !important;
}

/* Compact sidebar for iframe embed.
 * V0: data-testid="sidebar". V1: <aside> with no testid — use element selector.
 * V1 default width is 75px; 60px keeps it compact without clipping icons.
 */
[data-testid="sidebar"],
[data-testid="root-layout"] > aside {
  width: 60px !important;
  min-width: 60px !important;
}

/* Scrollbar styling */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb);
  border-radius: 3px;
}
::-webkit-scrollbar-track {
  background: var(--scrollbar-track);
}