/* ============================================
   BIYN SOLUTIONS — Design Tokens
   Source: _design-reference/DESIGN-SYSTEM.md
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Lora:wght@400;500;600;700&display=swap');

:root {
    /* Backgrounds (du plus sombre au plus clair) */
    --bg-primary:    #0b0b0f;
    --bg-secondary:  #111118;
    --bg-card:       #16161e;
    --bg-card-hover: #1c1c26;
    --bg-elevated:   #1e1e28;
    --bg-subtle:     rgba(255,255,255,0.03);

    /* Accent — Vert Biyn */
    --accent:        #abed4a;
    --accent-hover:  #608726;
    --accent-soft:   rgba(171, 237, 74, 0.12);
    --accent-glow:   rgba(171, 237, 74, 0.25);

    /* Texte */
    --text-primary:   #ffffff;
    --text-secondary: rgba(255,255,255,0.7);
    --text-muted:     rgba(255,255,255,0.45);
    --text-dark:      #0b0b0f;

    /* Bordures */
    --border:        rgba(255,255,255,0.08);
    --border-hover:  rgba(255,255,255,0.15);
    --border-accent: rgba(171, 237, 74, 0.3);

    /* Semantiques */
    --success: #22c55e;
    --danger:  #ef4444;
    --warning: #f59e0b;
    --info:    #3b82f6;

    /* Typographie */
    --font-body:    'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-heading: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-serif:   'Lora', Georgia, serif;

    /* Layout */
    --max-width:     1200px;
    --header-height: 64px;
    --sidebar-width: 260px;

    /* Rayons */
    --radius:    8px;
    --radius-lg: 16px;

    /* Ombres */
    --shadow:    0 8px 32px rgba(0,0,0,0.3);
    --shadow-sm: 0 2px 8px rgba(0,0,0,0.2);

    /* Transitions */
    --transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Reset */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; font-size: 14px; }

.biyn-app {
    font-family: var(--font-body);
    background: var(--bg-primary);
    color: var(--text-secondary);
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    min-height: 100vh;
}

.biyn-app img:not(.biyn-avatar-img) { max-width: 100%; height: auto; }
.biyn-app a { color: inherit; text-decoration: none; }
.biyn-app ul, .biyn-app ol { list-style: none; padding: 0; margin: 0; }

.biyn-app h1, .biyn-app h2, .biyn-app h3, .biyn-app h4, .biyn-app h5 {
    font-family: var(--font-heading);
    color: var(--text-primary);
    line-height: 1.2;
    font-weight: 700;
    margin: 0;
}

.biyn-app h1 { font-size: clamp(1.5rem, 3vw, 2rem); letter-spacing: -0.02em; }
.biyn-app h2 { font-size: clamp(1.25rem, 2.5vw, 1.75rem); letter-spacing: -0.02em; }
.biyn-app h3 { font-size: clamp(1rem, 1.5vw, 1.25rem); }
.biyn-app h4 { font-size: 1rem; }

.biyn-app h2 span, .biyn-app h1 span { color: var(--accent); }
.biyn-app strong { color: var(--text-primary); font-weight: 600; }
.biyn-app p { margin: 0 0 1rem; }
.biyn-app p:last-child { margin-bottom: 0; }