/* Core GUI variables */

:root {
  /* Typography */
  --font-sans: 'Baloo', Arial, Helvetica, sans-serif;

  /* Green palette: use these for green accents throughout the app. */
  --available-dark: #086855;
  --available-base: #0d806c;
  --available-bright: #009b7d;
  --available-slot: #76d9c4;
  --available-wash: #eef8f6;
  --available-success: #12b76a;

  /* Brand roles */
  --color-brand: var(--available-bright); /* Public components shared with beta-fr. */
  --brand-primary: var(--available-base);
  --brand-surface-background: radial-gradient(ellipse 75% 85% at 80% 100%, rgba(76, 201, 159, 0.18) 0%, rgba(76, 201, 159, 0) 72%), var(--brand-primary);
  --brand-link: var(--available-dark);
  --brand-lightbg: var(--available-wash);
  --brand-lightbg-text: var(--available-dark);
  --brand-lightbg-border: #d8f2ea;
  --brand-logo-height: 34px;

  /* Neutrals */
  --color-text: #202b3c;
  --color-text-strong: #111827;
  --color-text-muted: #506176;
  --color-text-soft: #8290a3;

  /* Surfaces */
  --bg-page: #f4f7fb;
  --bg-surface: #ffffff;
  --bg-surface-2: #f9fafb;
  --bg-surface-5: var(--available-wash);

  /* Borders */
  --border: #d5e1ed;
  --border-soft: var(--border);
  --border-surface-5: #d8f2ea;

  /* Shadows */
  --shadow-soft: none;

  /* Buttons */
  --btn-bg: linear-gradient(135deg, var(--available-bright) 0%, var(--available-base) 100%);
  --btn-text: #ffffff;

  /* Status / semantic */
  --success: var(--available-success);
  --connected: var(--available-success);
  --disconnected: #98a2b3;
  --warning: #f79009;
  --danger: #d92d20;

  /* Radius */
  --radius-md: 8px;
  --radius-lg: 16px;

}
