/* ============================================================
   Design tokens — refonte design 2026
   Source de vérité des couleurs, formes et typographie.

   Marque blanche : --brand-primary / --brand-secondary sont
   injectées par les layouts ({{ brand.primaryColor }}) AVANT ce
   fichier ; --gr-primary les consomme avec fallback Greenred.
   Les couleurs SÉMANTIQUES de données (--gr-up / --gr-down)
   restent vert/rouge pour TOUS les tenants.

   Dark mode (préparé, non activé) : surcharger ces variables
   dans [data-bs-theme="dark"].
   ============================================================ */

:root {
    /* --- Marque (surchargée par tenant via --brand-*) --- */
    --gr-primary: var(--brand-primary, #10b981);
    --gr-secondary: var(--brand-secondary, #22c55e);
    --gr-primary-dark: color-mix(in srgb, var(--gr-primary) 80%, black);
    --gr-primary-soft: color-mix(in srgb, var(--gr-primary) 12%, white);
    --gr-primary-rgb: 16, 185, 129; /* fallback Greenred pour rgba() legacy */

    /* --- Sémantique données : identique pour tous les tenants --- */
    --gr-up: #10b981;        /* hausse / positif */
    --gr-up-soft: #d1fae5;
    --gr-down: #ef4444;      /* baisse / négatif */
    --gr-down-soft: #fee2e2;

    /* --- Sémantique UI --- */
    --gr-success: var(--gr-up);
    --gr-danger: var(--gr-down);
    --gr-warning: #f59e0b;
    --gr-warning-soft: #fef3c7;
    --gr-info: #0ea5e9;
    --gr-info-soft: #e0f2fe;

    /* --- Neutres (échelle slate unique) --- */
    --gr-ink: #0f172a;       /* titres */
    --gr-text: #1e293b;      /* corps */
    --gr-muted: #64748b;     /* texte secondaire */
    --gr-faint: #94a3b8;     /* texte tertiaire, placeholders */
    --gr-border: #e2e8f0;
    --gr-border-strong: #cbd5e1;
    --gr-bg: #f8fafc;        /* fond application */
    --gr-bg-subtle: #f1f5f9; /* fonds de zones (thead, hover) */
    --gr-surface: #ffffff;   /* cartes, panneaux */

    /* --- Couleurs de section (menu + accents par domaine) --- */
    --sec-pilotage: #2563eb;
    --sec-traffic: #f97316;
    --sec-geo: #06b6d4;
    --sec-seo: #10b981;
    --sec-ads: #3b82f6;
    --sec-social: #8b5cf6;
    --sec-sante: #f43f5e;
    --sec-resources: #6366f1;

    /* --- Forme --- */
    --gr-radius: 12px;
    --gr-radius-sm: 8px;
    --gr-shadow: 0 1px 3px rgb(15 23 42 / .06), 0 4px 12px rgb(15 23 42 / .04);
    --gr-shadow-lg: 0 4px 6px rgb(15 23 42 / .05), 0 12px 28px rgb(15 23 42 / .08);

    /* --- Typographie --- */
    --gr-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

    /* --- Layout --- */
    --gr-sidebar-width: 14rem;
    --gr-sidebar-width-collapsed: 6.5rem;
    --gr-topbar-height: 4.375rem;
}

/* Surcharges Bootstrap 5 : brancher BS sur les tokens */
:root {
    --bs-body-font-family: var(--gr-font);
    --bs-body-color: var(--gr-text);
    --bs-body-bg: var(--gr-bg);
    --bs-border-color: var(--gr-border);
    --bs-primary: var(--gr-primary);
    --bs-success: var(--gr-success);
    --bs-danger: var(--gr-danger);
    --bs-warning: var(--gr-warning);
    --bs-info: var(--gr-info);
    --bs-link-color: var(--gr-primary-dark);
    --bs-link-hover-color: var(--gr-primary);
}

/* ------------------------------------------------------------
   Mapping des utilitaires Bootstrap 5 sur les tokens.
   Sans cela, .btn-primary / .text-primary etc. affichent le bleu
   Bootstrap par défaut (#0d6efd) au lieu de la couleur de marque —
   indispensable aussi pour les marques blanches (--gr-primary suit
   --brand-primary).
   ------------------------------------------------------------ */
.btn-primary {
    --bs-btn-bg: var(--gr-primary);
    --bs-btn-border-color: var(--gr-primary);
    --bs-btn-hover-bg: var(--gr-primary-dark);
    --bs-btn-hover-border-color: var(--gr-primary-dark);
    --bs-btn-active-bg: var(--gr-primary-dark);
    --bs-btn-active-border-color: var(--gr-primary-dark);
    --bs-btn-disabled-bg: var(--gr-primary);
    --bs-btn-disabled-border-color: var(--gr-primary);
}
.btn-outline-primary {
    --bs-btn-color: var(--gr-primary);
    --bs-btn-border-color: var(--gr-primary);
    --bs-btn-hover-bg: var(--gr-primary);
    --bs-btn-hover-border-color: var(--gr-primary);
    --bs-btn-active-bg: var(--gr-primary);
    --bs-btn-active-border-color: var(--gr-primary);
}
.btn-success {
    --bs-btn-bg: var(--gr-success);
    --bs-btn-border-color: var(--gr-success);
    --bs-btn-hover-bg: color-mix(in srgb, var(--gr-success) 80%, black);
    --bs-btn-hover-border-color: color-mix(in srgb, var(--gr-success) 80%, black);
    --bs-btn-active-bg: color-mix(in srgb, var(--gr-success) 80%, black);
    --bs-btn-active-border-color: color-mix(in srgb, var(--gr-success) 80%, black);
}
.btn-danger {
    --bs-btn-bg: var(--gr-danger);
    --bs-btn-border-color: var(--gr-danger);
    --bs-btn-hover-bg: var(--gr-red-dark);
    --bs-btn-hover-border-color: var(--gr-red-dark);
    --bs-btn-active-bg: var(--gr-red-dark);
    --bs-btn-active-border-color: var(--gr-red-dark);
}
.text-primary { color: var(--gr-primary) !important; }
.text-success { color: var(--gr-success) !important; }
.text-danger { color: var(--gr-danger) !important; }
.text-warning { color: var(--gr-warning) !important; }
.text-info { color: var(--gr-info) !important; }
.bg-primary { background-color: var(--gr-primary) !important; }
.bg-success { background-color: var(--gr-success) !important; }
.bg-danger { background-color: var(--gr-danger) !important; }
.border-primary { border-color: var(--gr-primary) !important; }
.text-bg-primary { background-color: var(--gr-primary) !important; color: #fff !important; }
.text-bg-success { background-color: var(--gr-success) !important; color: #fff !important; }
.text-bg-danger { background-color: var(--gr-danger) !important; color: #fff !important; }
.text-bg-warning { background-color: var(--gr-warning) !important; color: #fff !important; }
.text-bg-info { background-color: var(--gr-info) !important; color: #fff !important; }

body {
    font-family: var(--gr-font);
    color: var(--gr-text);
    background-color: var(--gr-bg);
    font-variant-numeric: tabular-nums;
}

h1, h2, h3, h4, h5, h6 { color: var(--gr-ink); }

/* Dark mode — préparé : jeu de variables à compléter à l'activation */
[data-bs-theme="dark"] {
    /* --gr-bg: #0f172a; --gr-surface: #1e293b; --gr-text: #e2e8f0; ... */
}