/* Theme-Variablen lokal am Chat-Wrapper (Klasse) */
:root {
  /* Farben */
  --chat--color-primary: #ff6f05;
  --chat--color-primary-shade-50: #e36a04;
  --chat--color-primary-shade-100: #c95703;
  --chat--color-secondary: #ff6f05;
  --chat--color-secondary-shade-50: #1ca08a;
  --chat--color-white: #ffffff;
  --chat--color-light: #edf0f4;
  --chat--color-light-shade-50: #e6e9f1;
  --chat--color-light-shade-100: #c2c5cc;
  --chat--color-medium: #d2d4d9;
  --chat--color-dark: #29383d;
  --chat--color-disabled: #777980;
  --chat--color-typing: #404040;

  /* Allgemeine Einstellungen */
  --chat--spacing: 0.8rem;
  --chat--border-radius: 2rem;
  --chat--transition-duration: 0.15s;

  /* Fenster */
  --chat--window--width: 340px;
  --chat--window--height: 580px;
  --chat--window--bottom: 8rem; /* vertikaler Abstand toggle */
  --chat--window--right: 3.2rem; /* horizontaler Abstand toggle */

  /* Header */
  --chat--header-height: auto;
  --chat--header--padding: 2.2rem;
  --chat--header--background: var(--chat--color-dark);
  --chat--header--color: var(--chat--color-primary);
  --chat--header--border-top: none;
  --chat--header--border-bottom: none;

  /* Typo */
  --chat--heading--font-size: 0.5rem;
  --chat--heading--font-family: 'Orbitron', sans-serif;
  --chat--subtitle--font-size: 0.5rem;
  --chat--subtitle--line-height: 1.2;

  /* Textarea */
  --chat--textarea--height: 50px;

  /* Messages */
  --chat--message--font-size: 1rem;
  --chat--message--padding: var(--chat--spacing);
  --chat--message--border-radius: var(--chat--border-radius);
  --chat--message-line-height: 1;
  --chat--message--bot--background: var(--chat--color-white);
  --chat--message--bot--color: #1b1b1b;
  --chat--message--bot--border: none;
  --chat--message--user--background: var(--chat--color-primary);
  --chat--message--user--color: var(--chat--color-white);
  --chat--message--user--border: none;
  --chat--message--pre--background: rgba(0, 0, 0, 0.05);

  /* Toggle */
  --chat--toggle--background: var(--chat--color-primary);
  --chat--toggle--hover--background: var(--chat--color-primary-shade-50);
  --chat--toggle--active--background: var(--chat--color-primary-shade-100);
  --chat--toggle--color: var(--chat--color-white);
  --chat--toggle--size: 48px;
}

/* Zusätzliche Regel im Scope, nutzt die geladene Orbitron-Schrift */
.viavendo-chat .chat-heading h1 {
  font-family: 'Orbitron', sans-serif !important;
}

/* Optional: responsive Overrides via Media Queries */
/*@media (min-width: 1200px) {
  .viavendo-chat { --chat--window--height: 640px; }
} */