/*
 * Werthain Theme Tokens - Base Layer
 * Shared design DNA (spacing, radius, motion, semantic aliases, HumHub bridge).
 */

:root {
    /* Layout rhythm */
    --wt-space-1: 0.25rem;
    --wt-space-2: 0.5rem;
    --wt-space-3: 0.75rem;
    --wt-space-4: 1rem;
    --wt-space-5: 1.25rem;
    --wt-space-6: 1.5rem;
    --wt-space-8: 2rem;
    --wt-space-10: 2.5rem;

    /* Radius system */
    --wt-radius-xs: 6px;
    --wt-radius-sm: 10px;
    --wt-radius-md: 14px;
    --wt-radius-lg: 18px;
    --wt-radius-xl: 24px;
    --wt-radius-pill: 999px;

    /* Border and interaction rhythm */
    --wt-border-width-soft: 1px;
    --wt-border-width-strong: 1.5px;
    --wt-focus-ring-width: 2px;
    --wt-focus-ring-offset: 1px;

    /* Motion */
    --wt-duration-fast: 120ms;
    --wt-duration-base: 180ms;
    --wt-duration-soft: 260ms;
    --wt-easing-standard: cubic-bezier(0.2, 0.7, 0.2, 1);

    /* Glass DNA */
    --wt-glass-blur-soft: 10px;
    --wt-glass-blur-main: 16px;
    --wt-glass-blur-float: 22px;
    --wt-glass-saturation: 150%;

    /* Semantic surface tokens */
    --wt-bg-main: #141b26;
    --wt-bg-canvas: #182231;
    --wt-bg-surface: #1c2638;
    --wt-bg-elevated: #233047;
    --wt-bg-inset: #101723;
    --wt-bg-hover: #2a3851;
    --wt-bg-active: #32425f;
    --wt-bg-overlay: rgba(8, 12, 18, 0.72);

    /* Semantic text tokens */
    --wt-text-primary: #eaf3ff;
    --wt-text-secondary: #bfd0e4;
    --wt-text-tertiary: #9eb0c7;
    --wt-text-muted: #8395ac;
    --wt-text-inverse: #162131;
    --wt-text-accent: #74b8ff;

    /* Semantic border tokens */
    --wt-border-soft: rgba(155, 184, 219, 0.26);
    --wt-border-strong: rgba(169, 197, 227, 0.44);
    --wt-border-inverse: rgba(26, 36, 52, 0.24);
    --wt-border-focus: rgba(99, 172, 246, 0.62);

    /* Accent tokens */
    --wt-accent: #4f97df;
    --wt-accent-hover: #66a8ea;
    --wt-accent-active: #3e85cb;
    --wt-accent-contrast: #ffffff;
    --wt-accent-soft: rgba(79, 151, 223, 0.18);

    /* Status tokens */
    --wt-success: #34a167;
    --wt-warning: #c78a31;
    --wt-danger: #d05a67;
    --wt-info: #349ebf;

    --wt-success-soft: rgba(52, 161, 103, 0.16);
    --wt-warning-soft: rgba(199, 138, 49, 0.18);
    --wt-danger-soft: rgba(208, 90, 103, 0.17);
    --wt-info-soft: rgba(52, 158, 191, 0.17);
    --wt-success-border: #6daf8a;
    --wt-warning-border: #b79056;
    --wt-danger-border: #b97a84;

    /* Glass tokens */
    --wt-glass-bg: rgba(20, 31, 48, 0.62);
    --wt-glass-bg-strong: rgba(20, 31, 48, 0.78);
    --wt-glass-border: rgba(180, 205, 232, 0.3);

    /* Shadow tokens */
    --wt-shadow-soft: 0 1px 2px rgba(7, 14, 24, 0.24);
    --wt-shadow-medium: 0 8px 24px rgba(7, 14, 24, 0.28);
    --wt-shadow-float: 0 18px 44px rgba(7, 14, 24, 0.34);
    --wt-shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.06);

    /* Focus */
    --wt-focus-ring: 0 0 0 var(--wt-focus-ring-width) var(--wt-border-focus);

    /* HumHub variable bridge */
    --default: var(--wt-border-soft);
    --primary: var(--wt-accent);
    --info: var(--wt-info);
    --success: var(--wt-success);
    --warning: var(--wt-warning);
    --danger: var(--wt-danger);
    --link: var(--wt-accent);

    --text-color-main: var(--wt-text-primary);
    --text-color-default: var(--wt-text-primary);
    --text-color-secondary: var(--wt-text-secondary);
    --text-color-highlight: var(--wt-text-primary);
    --text-color-soft: var(--wt-text-tertiary);
    --text-color-soft2: var(--wt-text-muted);
    --text-color-soft3: var(--wt-text-muted);
    --text-color-contrast: var(--wt-text-inverse);

    --background-color-page: var(--wt-bg-main);
    --background-color-main: var(--wt-bg-surface);
    --background-color-secondary: var(--wt-bg-elevated);
    --background-color-highlight: var(--wt-bg-hover);
    --background-color-highlight-soft: var(--wt-accent-soft);
    --background3: var(--wt-bg-canvas);
    --background4: var(--wt-bg-inset);

    --background-color-success: var(--wt-success-soft);
    --text-color-success: var(--wt-success);
    --border-color-success: var(--wt-success-border);

    --background-color-warning: var(--wt-warning-soft);
    --text-color-warning: var(--wt-warning);
    --border-color-warning: var(--wt-warning-border);

    --background-color-danger: var(--wt-danger-soft);
    --text-color-danger: var(--wt-danger);
    --border-color-danger: var(--wt-danger-border);
}