/* Coachonaut Design System v2.3.46 */
:root {
  --cnct-bg: #f7f8fc;
  --cnct-surface: #ffffff;
  --cnct-surface-alt: #f2f5fb;
  --cnct-text: #111827;
  --cnct-text-soft: #6b7280;
  --cnct-border: #d9e2f0;
  --cnct-accent: #4f46e5;
  --cnct-accent-strong: #312e81;
  --cnct-success: #10b981;
  --cnct-radius-lg: 18px;
  --cnct-radius-md: 12px;
  --cnct-shadow: 0 16px 40px rgba(17,24,39,.08);

  /* Erweitertes Token-Set (Abschnitt 3) — Fallback-Basis fuer alle Modi.
     Werte hier sind an die bestehende Default-Palette angelehnt und
     veraendern den Default-Modus NICHT (noch nirgends referenziert). */
  --cnct-accent-soft: rgba(79,70,229,.08);
  --cnct-accent-contrast: #ffffff;
  --cnct-warning: #f59e0b;
  --cnct-danger: #ef4444;
  --cnct-info: #3b82f6;
  --cnct-success-soft: rgba(16,185,129,.12);
  --cnct-danger-soft: rgba(239,68,68,.12);
  --cnct-info-soft: rgba(59,130,246,.12);
  --cnct-warning-soft: rgba(245,158,11,.12);
  --cnct-caution: #a16207;
  --cnct-caution-soft: color-mix(in srgb, var(--cnct-caution) 12%, transparent);
  --cnct-violet: #7c3aed;
  --cnct-violet-soft: color-mix(in srgb, var(--cnct-violet) 12%, transparent);
  --cnct-teal: #0f766e;
  --cnct-teal-soft: color-mix(in srgb, var(--cnct-teal) 12%, transparent);
  --cnct-text-strong: #0b1220;
  --cnct-text-inverse: #ffffff;
  --cnct-border-soft: #e6ebf5;
  --cnct-border-strong: #b9c6dc;
  --cnct-overlay: rgba(15,23,42,.5);

  --cnct-radius-sm: 8px;
  --cnct-radius-xl: 24px;
  --cnct-radius-pill: 999px;

  --cnct-shadow-sm: 0 1px 2px rgba(17,24,39,.06);
  --cnct-shadow-md: var(--cnct-shadow);
  --cnct-shadow-lg: 0 24px 60px rgba(17,24,39,.12);
  --cnct-shadow-focus: 0 0 0 3px rgba(79,70,229,.35);

  --cnct-space-1: 4px;
  --cnct-space-2: 8px;
  --cnct-space-3: 12px;
  --cnct-space-4: 16px;
  --cnct-space-5: 24px;
  --cnct-space-6: 32px;
  --cnct-space-7: 48px;
  --cnct-space-8: 64px;

  --cnct-font-sans: system-ui, -apple-system, "Segoe UI", sans-serif;
  --cnct-font-size-xs: 12px;
  --cnct-font-size-sm: 13px;
  --cnct-font-size-base: 14px;
  --cnct-font-size-lg: 16px;
  --cnct-font-size-xl: 18px;
  --cnct-font-size-2xl: 24px;
  --cnct-font-weight-normal: 400;
  --cnct-font-weight-medium: 500;
  --cnct-font-weight-semibold: 600;
  --cnct-font-weight-bold: 700;
  --cnct-line-height-tight: 1.2;
  --cnct-line-height-normal: 1.5;
  --cnct-line-height-relaxed: 1.7;

  --cnct-transition: 160ms ease;
  --cnct-transition-slow: 280ms ease;
}

.cnct-theme-modern {
  --cnct-bg: #0f172a;
  --cnct-surface: #111827;
  --cnct-surface-alt: #1f2937;
  --cnct-text: #f9fafb;
  --cnct-text-soft: #cbd5e1;
  --cnct-border: #334155;
  --cnct-accent: #8b5cf6;
  --cnct-accent-strong: #c4b5fd;
  --cnct-shadow: 0 18px 48px rgba(2,6,23,.45);
}

/* saas-Modus (Abschnitt 7b/8) — Light per Default, Dark via [data-theme="dark"]
   auf demselben Element (Umschaltung *innerhalb* von saas, kein eigener Modus).
   Werte 1:1 aus dem Claude-Design-Export (Coachonaut_Dashboard_-_Standalone.html). */
.cnct-theme-saas {
  --cnct-accent: #4F46E5;
  --cnct-accent-strong: #4338CA;
  --cnct-accent-soft: color-mix(in srgb, var(--cnct-accent) 9%, transparent);
  --cnct-accent-contrast: #ffffff;

  --cnct-bg: #FAF9F7;
  --cnct-surface: #FFFFFF;
  --cnct-surface-alt: #F4F2EF;
  --cnct-border: #E7E4DF;
  --cnct-border-soft: #EFEDE9;
  --cnct-border-strong: #D8D4CD;

  --cnct-text: #1B1A18;
  --cnct-text-strong: #1B1A18;
  --cnct-text-soft: #6E6A64;
  --cnct-text-inverse: #ffffff;

  --cnct-success: #178A50;
  --cnct-success-soft: color-mix(in srgb, var(--cnct-success) 12%, transparent);
  --cnct-warning: #B45309;
  --cnct-warning-soft: color-mix(in srgb, var(--cnct-warning) 12%, transparent);
  --cnct-danger: #DC2626;
  --cnct-danger-soft: color-mix(in srgb, var(--cnct-danger) 12%, transparent);
  --cnct-info: #2563EB;
  --cnct-info-soft: color-mix(in srgb, var(--cnct-info) 12%, transparent);
  --cnct-overlay: rgba(27,26,24,.5);

  --cnct-radius-sm: 8px;
  --cnct-radius-md: 12px;
  --cnct-radius-lg: 16px;
  --cnct-radius-xl: 18px;
  --cnct-radius-pill: 99px;

  --cnct-shadow-sm: 0 1px 2px rgba(24,20,16,.05);
  --cnct-shadow-md: 0 1px 2px rgba(24,20,16,.05);
  --cnct-shadow: 0 1px 2px rgba(24,20,16,.05);
  --cnct-shadow-lg: 0 8px 24px rgba(24,20,16,.08);
  --cnct-shadow-focus: 0 0 0 3px color-mix(in srgb, var(--cnct-accent) 35%, transparent);

  --cnct-font-sans: 'Geist', system-ui, -apple-system, sans-serif;
  --cnct-font-size-xs: 11.5px;
  --cnct-font-size-sm: 12.5px;
  --cnct-font-size-base: 13px;
  --cnct-font-size-lg: 14px;
  --cnct-font-size-xl: 15.5px;
  --cnct-font-size-2xl: 24px;
  --cnct-font-weight-normal: 400;
  --cnct-font-weight-medium: 500;
  --cnct-font-weight-semibold: 600;
  --cnct-font-weight-bold: 700;
}

.cnct-theme-saas[data-theme="dark"] {
  --cnct-accent-strong: #6366F1;

  --cnct-bg: #181817;
  --cnct-surface: #232322;
  --cnct-surface-alt: #1F1F1E;
  --cnct-border: #343431;
  --cnct-border-soft: #2C2C2A;
  --cnct-border-strong: #3F3F3C;

  --cnct-text: #EDECE9;
  --cnct-text-strong: #EDECE9;
  --cnct-text-soft: #A3A09A;

  --cnct-success: #4ADE80;
  --cnct-warning: #FBBF24;
  --cnct-danger: #F87171;
  --cnct-info: #60A5FA;
  --cnct-caution: #FACC15;
  --cnct-violet: #A78BFA;
  --cnct-teal: #2DD4BF;
  --cnct-overlay: rgba(0,0,0,.5);

  --cnct-shadow-sm: 0 1px 2px rgba(0,0,0,.35);
  --cnct-shadow-md: 0 1px 2px rgba(0,0,0,.35);
  --cnct-shadow: 0 1px 2px rgba(0,0,0,.35);
  --cnct-shadow-lg: 0 8px 24px rgba(0,0,0,.45);
}

.cnct-design-area {
  color: var(--cnct-text);
}

.cnct-design-area .cnct-box,
.cnct-design-area .cnct-role-card,
.cnct-design-area .cnct-list-item,
.cnct-design-area .cnct-card {
  background: var(--cnct-surface);
  border-color: var(--cnct-border);
}

.cnct-design-area .cnct-muted {
  color: var(--cnct-text-soft);
}

.cnct-design-area .cnct-btn {
  border-radius: 999px;
}

.cnct-ui-card {
  border-radius: var(--cnct-radius-lg);
  box-shadow: var(--cnct-shadow);
}

/* Area-specific hooks for future targeted Modern-only work */
.cnct-design-hub-modern {}
.cnct-design-dashboard-modern {}
.cnct-design-client_dashboard-modern {}
.cnct-design-coach_profiles-modern {}
.cnct-design-helpdesk-modern {}
.cnct-design-support-modern {}
.cnct-design-booking-modern {}