/* Noctua theme for Langflow 1.13.2, following noctua-site/marca/design-guide.md:
   dark by default, neutral greys, orange #ff6600 as the only warm accent.
   Langflow colours are HSL triplets consumed as hsl(var(--x)). */

.dark {
  --background: 0 0% 6.7%;          /* #111111 */
  --canvas: 0 0% 4%;                /* #0a0a0a */
  --canvas-dot: 0 0% 20%;
  --foreground: 0 0% 94%;           /* #f0f0f0 */
  --muted: 0 0% 13.3%;              /* #222222 */
  --muted-foreground: 0 0% 53%;     /* #888888 */
  --accent: 0 0% 13.3%;
  --accent-foreground: 0 0% 94%;
  --secondary-hover: 0 0% 13.3%;
  --border: 0 0% 18%;               /* ~ rgba(255,255,255,.14) on #111 */
  --input: 0 0% 18%;
  --ring: 24 100% 50%;              /* focus / selection in brand orange */
  --primary-foreground: 0 0% 100%;  /* text on orange buttons */
  --component-icon: #ff6600;
}

:root {
  --ring: 24 100% 50%;
  --component-icon: #ff6600;
}

/* No blue/purple in the brand: connection colours and blue accents become
   orange (Message) and light grey (Data/JSON). Red stays for severity only.
   Langflow marks some of these !important, hence the !important here. */
:root, .dark {
  --datatype-blue: 24 100% 50% !important;
  --datatype-blue-foreground: 24 100% 50% !important;
  --datatype-indigo: 24 100% 50% !important;
  --datatype-indigo-foreground: 24 100% 50% !important;
  --datatype-red: 0 0% 78% !important;
  --datatype-red-foreground: 0 0% 78% !important;
  --datatype-pink: 0 0% 78% !important;
  --datatype-pink-foreground: 0 0% 78% !important;
  --accent-blue: 24 100% 50% !important;
  --accent-blue-foreground: 24 100% 50% !important;
  --accent-blue-muted: 24 100% 50% / .2 !important;
  --accent-blue-muted-foreground: 24 100% 60% !important;
  --accent-indigo-foreground: 24 100% 50% !important;
}

/* Flow icons (header and flow lists): brand orange, not blue. */
.bg-electric-blue {
  background-color: #ff6600 !important;
}
.bg-electric-blue.text-holo-frost {
  color: #ffffff !important;
}

/* Langflow's own promo in the header (GitHub stars / Discord members block)
   and the "Try the new Langflow Assistant!" onboarding banner. */
[data-testid="header_right_section_wrapper"] > .whitespace-nowrap,
div:has(> [data-testid="assistant-onboarding-open"]),
div.group.relative:has([data-testid="assistant-button"]),
[data-testid="assistant-button"],
div:has(> div > [data-testid="get_started_progress_title"]),
a[href="https://github.com/langflow-ai/langflow"],
a[href^="https://discord.com/invite"],
[data-testid="assistant-button-new-pill"] {
  display: none !important;
}

/* Sliders inside nodes (e.g. Threshold): Radix slider range and thumb. */
.react-flow__node [data-orientation="horizontal"] > [data-orientation="horizontal"] > [data-orientation="horizontal"],
.react-flow__node [role="slider"] {
  background-color: #ff6600 !important;
  background-image: none !important;
  border-color: #ff6600 !important;
}

/* Primary buttons: orange with white text, darker on hover (design guide). */
.bg-primary,
.dark .bg-primary {
  background-color: #ff6600 !important;
  color: #ffffff !important;
}
.bg-primary:hover,
.hover\:bg-primary-hover:hover {
  background-color: #cc5500 !important;
}

/* Header: Noctua owl instead of the Langflow mark (the home button). Same
   pairing as the site's <noctua-logo>: white on dark, orange+circle on light. */
[data-testid="icon-ChevronLeft"] > svg {
  display: none !important;
}
[data-testid="icon-ChevronLeft"] {
  background: url("logo-header-light.png") center / 24px 24px no-repeat;
}
.dark [data-testid="icon-ChevronLeft"] {
  background-image: url("logo-header-dark.png");
}

/* Empty-state illustrations. */
img[data-testid="empty_page_logo_dark"] {
  content: url("logo-branco.png");
  height: 7rem;
}
img[data-testid="empty_page_logo_light"] {
  content: url("logo-laranja-circulo.png");
  height: 7rem;
}