/* ===============================================================
   AFRIKTECK Konta — Charte (déclinaison AFRIKTECK)
   Même langage visuel que la famille AFRIKTECK, accent DISTINCT :
   - Office 360 : teal  #0f766e
   - Konta      : green #107c41  (déclinaison « facturation »)
   Typographie, structure et neutres identiques → même famille,
   accent différent → pas de confusion entre produits.
   Polices chargées en local (fonts/fonts.css), sans CDN.
   =============================================================== */

:root {
    /* Accent Konta — green */
    --color-primary: #107c41;
    --color-primary-dark: #0c5e32;
    --color-primary-light: #16a34a;

    /* Teal de la famille (conservé comme accent secondaire) */
    --color-brand-teal: #0f766e;
    --color-brand-teal-dark: #115e59;

    /* Secondaire — slate */
    --color-secondary: #475569;
    --color-secondary-dark: #334155;

    /* Neutres */
    --color-background: #ffffff;
    --color-surface: #f8fafc;
    --color-border: #e2e8f0;
    --color-text: #0f172a;
    --color-text-light: #475569;
    --color-text-muted: #64748b;

    /* Sémantiques AFRIKTECK */
    --color-success: #107c41;
    --color-success-dark: #0c5e32;
    --color-error: #d93025;
    --color-error-dark: #b0241a;
    --color-warning: #d97706;
    --color-warning-dark: #b45309;
    --color-info: #2563eb;
    --color-info-dark: #1d4ed8;
    --color-info-dark: #1d4ed8;

    /* Typographie */
    --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, system-ui, sans-serif;
    --font-mono: "JetBrains Mono", "SF Mono", "Roboto Mono", Menlo, monospace;

    /* Rayons */
    --border-radius-sm: 0.375rem;
    --border-radius: 0.5rem;
    --border-radius-lg: 0.75rem;
    --border-radius-xl: 1rem;

    /* Ombres douces */
    --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.05);
    --shadow-md: 0 4px 12px rgba(15, 23, 42, 0.08), 0 2px 4px rgba(15, 23, 42, 0.04);
    --shadow-lg: 0 12px 32px rgba(15, 23, 42, 0.10), 0 4px 8px rgba(15, 23, 42, 0.04);
    --shadow-xl: 0 24px 56px rgba(15, 23, 42, 0.14);
}

/* Inter partout */
body,
input, select, textarea, button {
    font-family: var(--font-sans);
}
.mono, code, pre, .montant, .amount, table td.num {
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
}

/* Focus accessible cohérent */
a:focus-visible, button:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.18);
    border-radius: var(--border-radius-sm);
}

/* Le badge « workspace » et l'en-tête prennent l'accent AFRIKTECK */
.workspace-context-indicator {
    border-left: 3px solid var(--color-primary);
}

/* ===============================================================
   Finitions UI — navbar / icônes (charte AFRIKTECK)
   =============================================================== */
.nav-brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 800; letter-spacing: -0.01em; }

.nav-brand-logo {
    width: 30px; height: 30px; flex: none;
    border-radius: 8px; display: grid; place-items: center;
    background: linear-gradient(135deg, #16a34a, #0f766e);
    color: #fff; font-size: 15px; font-weight: 800; letter-spacing: -0.02em;
    box-shadow: 0 2px 6px rgba(16, 124, 65, 0.25);
}

.dropdown-icon { display: inline-flex; align-items: center; justify-content: center; }
.dropdown-icon svg { display: block; }

.user-dropdown-item { display: flex; align-items: center; gap: 9px; }

/* Densité & rythme cohérents avec Office 360 */
.nav-menu li a { font-weight: 600; }
.nav-menu li a.active { font-weight: 700; }