/* Panda BEW — identity from tela.melhordebh.com, 2026-09-20.
 * Presentation only. Branding name/logo/accent remain in the official CRM UI.
 * Self-hosted fonts; no scripts, cookies, requests to third-party font services.
 */
@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url("/bew-theme/montserrat-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url("/bew-theme/montserrat-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
:root:root {
  --font-atkinson: "Montserrat";
  --font-sans: "Montserrat", ui-sans-serif, system-ui, sans-serif;
  --color-bg: #fafafa;
  --color-surface: #ffffff;
  --color-surface-elevated: #f5f5f5;
  --color-text: #171717;
  --color-text-muted: #525252;
  --color-text-subtle: #737373;
  --color-border: #e5e5e5;
  --color-border-strong: #d4d4d4;
  --color-overlay: rgb(0 0 0 / 45%);
  --color-neutral-50: #fafafa;
  --color-neutral-100: #f5f5f5;
  --color-neutral-200: #e5e5e5;
  --color-neutral-300: #d4d4d4;
  --color-neutral-400: #a3a3a3;
  --color-neutral-500: #737373;
  --color-neutral-600: #525252;
  --color-neutral-700: #404040;
  --color-neutral-800: #262626;
  --color-neutral-900: #171717;
  --color-neutral-950: #0a0a0a;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --shadow-xs: 0 2px 8px rgb(0 0 0 / 3%);
  --shadow-sm: 0 4px 16px rgb(0 0 0 / 4%);
  --shadow-md: 0 8px 28px rgb(0 0 0 / 7%);
  --bew-copper: #d2a89b;
  --bew-brown: #5e3a2f;
  --bew-button: linear-gradient(135deg, #8c6253 0%, #5e3a2f 100%);
}
:root:root[data-theme="dark"] {
  --color-bg: #0c0c0c;
  --color-surface: #171717;
  --color-surface-elevated: #222222;
  --color-text: #f5f5f5;
  --color-text-muted: #bdbdbd;
  --color-text-subtle: #a3a3a3;
  --color-border: #333333;
  --color-border-strong: #525252;
}
body { font-family: var(--font-sans); }
h1, h2, h3 { letter-spacing: -0.035em; font-weight: 600; }
/* Keep compact toolbars and destructive/status controls semantically intact. */
:is(button, a).bg-accent:not([aria-current]),
:is(button, a).bg-primary:not([aria-current]) {
  background: var(--bew-button);
  color: #ffffff;
  border: 1px solid var(--bew-copper);
  border-radius: 999px;
  font-weight: 600;
  box-shadow: 0 2px 6px rgb(94 58 47 / 12%);
}
:is(button, a).bg-accent:not([aria-current]):hover:not(:disabled),
:is(button, a).bg-primary:not([aria-current]):hover:not(:disabled) {
  background: linear-gradient(135deg, #795243, #4c2c23);
  box-shadow: 0 4px 12px rgb(94 58 47 / 20%);
}
:is(input:not([type="radio"]):not([type="checkbox"]):not([type="color"]):not([type="file"]), select, textarea) {
  border-radius: 10px;
}
/* White artwork from the source site is always given a charcoal backing. */
:is(div, span):has(> img[src*="/brand-logos/platform/"]) {
  background: #171717;
  border-radius: 12px;
  padding: 6px 12px;
}
/* The dark navigation matches the source header, with a quiet light workspace. */
aside:has(nav[aria-label="Navegação principal"]),
aside:has(nav[aria-label="Navegação plataforma"]),
[role="dialog"]:has(nav[aria-label="Navegação principal"]) {
  --color-surface: #171717;
  --color-surface-elevated: #262626;
  --color-text: #ffffff;
  --color-text-muted: #d4d4d4;
  --color-text-subtle: #a3a3a3;
  --color-border: #333333;
  --color-border-strong: #525252;
  --color-accent: #d2a89b;
  --color-accent-fg: #171717;
  --color-accent-soft: #3b2924;
  --color-accent-hover: #e8c9be;
  background: linear-gradient(180deg, #171717, #0c0c0c);
  color: #ffffff;
}
nav[aria-label="Navegação principal"] a[aria-current="page"],
nav[aria-label="Navegação plataforma"] a[aria-current="page"] {
  background: #5e3a2f;
  color: #ffffff;
  box-shadow: inset 3px 0 #d2a89b;
}
aside:has(nav[aria-label="Navegação plataforma"]) > div:first-child::before {
  content: "";
  width: 51px;
  height: 32px;
  flex-shrink: 0;
  background: url("/bew-theme/bew-logo.png") center / contain no-repeat;
}
/* Public access screens: dark, uncluttered facade like the source hero. */
div.min-h-screen:has(> div > div > div > img[data-testid="logo-da-fachada"]) {
  --color-bg: #121212;
  --color-surface: #1b1b1b;
  --color-surface-elevated: #262626;
  --color-text: #ffffff;
  --color-text-muted: #bdbdbd;
  --color-text-subtle: #a3a3a3;
  --color-border: #414141;
  --color-border-strong: #737373;
  background: radial-gradient(ellipse at 50% 0%, #35261f 0%, transparent 55%), linear-gradient(180deg, #171717, #050505);
  color: #ffffff;
  padding: clamp(24px, 5vw, 64px);
}
div.min-h-screen:has(img[data-testid="logo-da-fachada"]) > div.max-w-sm {
  max-width: 440px;
  padding: clamp(24px, 4vw, 40px);
  border: 1px solid #3c302b;
  border-radius: 24px;
  background: #171717;
  box-shadow: 0 24px 64px rgb(0 0 0 / 30%);
}
img[data-testid="logo-da-fachada"] {
  height: 64px;
  width: auto;
}
div.min-h-screen:has(img[data-testid="logo-da-fachada"]) input {
  min-height: 46px;
  background-color: #222222;
  color: #ffffff;
}
div.min-h-screen:has(img[data-testid="logo-da-fachada"]) button[type="submit"] {
  min-height: 46px;
}
/* Onboarding header retains its real stepper and all pairing controls. */
header:has(ol[aria-label="onboarding steps"]) {
  --color-accent: #d2a89b;
  --color-accent-fg: #171717;
  --color-accent-soft: #3b2924;
  --color-text: #ffffff;
  --color-text-muted: #d4d4d4;
  --color-text-subtle: #a3a3a3;
  --color-border: #404040;
  background: linear-gradient(180deg, #171717, #0a0a0a);
  color: #ffffff;
}
header:has(ol[aria-label="onboarding steps"]) > div:first-child > div:first-child::before {
  content: "";
  width: 68px;
  height: 42px;
  flex-shrink: 0;
  background: url("/bew-theme/bew-logo.png") center / contain no-repeat;
}
@media (max-width: 480px) {
  div.min-h-screen:has(img[data-testid="logo-da-fachada"]) { padding: 16px; }
  div.min-h-screen:has(img[data-testid="logo-da-fachada"]) > div.max-w-sm { padding: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  :is(button, a).bg-accent, :is(button, a).bg-primary { transition: none; }
}
