/* AnswerMeld product color tokens — lifted verbatim from
   CouncilDesk/extension/src/sidepanel/App.css (light / dark / contrast themes). */

:root,
:root[data-answermeld-theme="light"],
.theme-light {
  color-scheme: light;

  /* base */
  --am-accent: #3D5AFD;
  --am-accent-ink: #ffffff;
  --am-grad: linear-gradient(135deg, #22B0F4, #2E6BFF 48%, #8E3AF0); /* @kind color */
  --am-bg: #FBFBFC;
  --am-panel: #ffffff;
  --am-panel-2: #F4F4F7;
  --am-ink: #191B22;
  --am-ink-strong: #0B0C10;
  --am-muted: #6B7080;
  --am-faint: #9A9FAD;
  --am-line: rgba(25, 28, 40, 0.09);
  --am-line-strong: rgba(25, 28, 40, 0.16);

  /* semantic */
  --bg: var(--am-bg);
  --surface: var(--am-panel);
  --surface-muted: var(--am-panel-2);
  --ink: var(--am-ink);
  --ink-strong: var(--am-ink-strong);
  --muted: var(--am-muted);
  --faint: var(--am-faint);
  --line: var(--am-line);
  --line-strong: var(--am-line-strong);
  --brand-gradient: var(--am-grad);

  --primary: var(--am-accent);
  --primary-dark: #2e6bff;
  --primary-hover: #274fe5;
  --primary-soft: rgba(61, 90, 253, 0.1);
  --accent: var(--am-accent);
  --accent-soft: rgba(61, 90, 253, 0.1);
  --info: var(--am-accent);
  --info-soft: rgba(61, 90, 253, 0.08);
  --info-border: rgba(61, 90, 253, 0.22);
  --warning: #8e3af0;
  --warning-soft: rgba(142, 58, 240, 0.1);
  --danger: #8a2732;
  --danger-soft: rgba(138, 39, 50, 0.1);
  --success: #247856;
  --success-soft: rgba(52, 178, 123, 0.11);

  --selected-bg: rgba(61, 90, 253, 0.08);
  --selected-ink: var(--am-ink);
  --selected-border: rgba(61, 90, 253, 0.34);
  --selected-ring: rgba(61, 90, 253, 0.08);
  --focus-border: rgba(61, 90, 253, 0.58);
  --action-ink: #ffffff;
  --action-sheen: rgba(255, 255, 255, 0.2);

  --sidebar: var(--am-panel);
  --sidebar-ink: var(--am-ink);
  --sidebar-muted: var(--am-muted);
  --sidebar-border: var(--am-line);
  --sidebar-border-strong: var(--am-line-strong);
  --sidebar-fill: rgba(244, 244, 247, 0.74);
  --sidebar-fill-active: var(--am-panel);
  --sidebar-panel: rgba(255, 255, 255, 0.78);
  --sidebar-control-bg: var(--am-panel);
  --sidebar-control-hover: var(--am-panel-2);

  --frame-bg: #ffffff;
  --brand-glow: rgba(61, 90, 253, 0.18);
  --brand-logo-shadow: rgba(46, 107, 255, 0.16);
  --state-active-border: rgba(61, 90, 253, 0.3);
  --state-active-ring: rgba(61, 90, 253, 0.12);
  --success-border: rgba(52, 178, 123, 0.28);
  --danger-border: rgba(138, 39, 50, 0.28);
}

:root[data-answermeld-theme="dark"],
.theme-dark {
  color-scheme: dark;
  --am-bg: #15161c;
  --am-panel: #1c1e26;
  --am-panel-2: #23252f;
  --am-ink: #edeef3;
  --am-ink-strong: #ffffff;
  --am-muted: #9aa0b0;
  --am-faint: #6d7280;
  --am-line: rgba(240, 242, 255, 0.09);
  --am-line-strong: rgba(240, 242, 255, 0.18);

  --bg: var(--am-bg);
  --surface: var(--am-panel);
  --surface-muted: var(--am-panel-2);
  --ink: var(--am-ink);
  --ink-strong: #ffffff;
  --muted: var(--am-muted);
  --faint: var(--am-faint);
  --line: var(--am-line);
  --line-strong: var(--am-line-strong);

  --primary: #7c93ff;
  --primary-dark: #aebcff;
  --primary-hover: #9fb0ff;
  --primary-soft: rgba(124, 147, 255, 0.16);
  --accent: #9fb0ff;
  --accent-soft: rgba(124, 147, 255, 0.15);
  --info: #9fb0ff;
  --info-soft: rgba(124, 147, 255, 0.14);
  --info-border: rgba(124, 147, 255, 0.28);
  --warning: #c08cff;
  --warning-soft: rgba(192, 140, 255, 0.14);
  --danger: #ff9aa5;
  --danger-soft: rgba(255, 154, 165, 0.12);
  --success: #65d69e;
  --success-soft: rgba(101, 214, 158, 0.14);

  --selected-bg: rgba(124, 147, 255, 0.16);
  --selected-ink: #ffffff;
  --selected-border: rgba(124, 147, 255, 0.36);
  --selected-ring: rgba(124, 147, 255, 0.16);
  --focus-border: rgba(124, 147, 255, 0.72);
  --action-ink: #ffffff;
  --action-sheen: rgba(0, 0, 0, 0.1);

  --sidebar: var(--am-panel);
  --sidebar-ink: var(--am-ink);
  --sidebar-muted: var(--am-muted);
  --sidebar-border: var(--am-line);
  --sidebar-border-strong: var(--am-line-strong);
  --sidebar-fill: rgba(255, 255, 255, 0.05);
  --sidebar-fill-active: rgba(255, 255, 255, 0.08);
  --sidebar-panel: rgba(255, 255, 255, 0.05);
  --sidebar-control-bg: rgba(255, 255, 255, 0.06);
  --sidebar-control-hover: rgba(255, 255, 255, 0.1);

  --frame-bg: #ffffff;
  --brand-glow: rgba(124, 147, 255, 0.24);
  --brand-logo-shadow: rgba(0, 0, 0, 0.34);
  --state-active-border: rgba(124, 147, 255, 0.38);
  --state-active-ring: rgba(124, 147, 255, 0.18);
  --success-border: rgba(101, 214, 158, 0.28);
  --danger-border: rgba(255, 154, 165, 0.34);
}