/**
 * @project: kwASSET
 * @asset: praxis
 * @version: 0.1.5
 * @encoding: UTF-8
 * @compliance: GDPR, EU-Accessibility, Data Sovereignty
 * @copyright: (c) 2025-2026 kwargs SRL
 * @description: Bootstrap theme mapping via color-mix(). Ne pas modifier par prototype.
 */

/* ── PRAXIS : THÈME & MAPPING BOOTSTRAP ──────────────────────── */
/*                                                                  */
/*  Ce fichier ne devrait JAMAIS être modifié par prototype.       */
/*  Il lit les rôles définis dans palette.css et génère            */
/*  automatiquement les variantes (hover, active, thème sombre)    */
/*  via color-mix().                                                */
/*                                                                  */
/* ─────────────────────────────────────────────────────────────── */

:root {
    /* Transition par défaut — ciblée, pas "all" */
    --ks-transition: color 0.2s ease-in-out,
                     background-color 0.2s ease-in-out,
                     border-color 0.2s ease-in-out,
                     box-shadow 0.2s ease-in-out,
                     transform 0.2s ease-in-out,
                     opacity 0.2s ease-in-out;
}

/* ── Thème clair ─────────────────────────────────────────────── */

[data-bs-theme="light"] {
    --bs-body-bg:       var(--ks-surface-light);
    --bs-body-color:    var(--ks-surface-dark);

    --bs-primary:       var(--ks-primary);
    --bs-primary-rgb:   var(--ks-primary-rgb);
    --bs-secondary:     var(--ks-secondary);
    --bs-secondary-rgb: var(--ks-secondary-rgb);

    --bs-success:       var(--ks-success);
    --bs-success-rgb:   var(--ks-success-rgb);
    --bs-danger:        var(--ks-danger);
    --bs-danger-rgb:    var(--ks-danger-rgb);
    --bs-warning:       var(--ks-warning);
    --bs-warning-rgb:   var(--ks-warning-rgb);
    --bs-info:          var(--ks-info);
    --bs-info-rgb:      var(--ks-info-rgb);

    --bs-link-color:         var(--ks-primary);
    --bs-link-hover-color:   color-mix(in srgb, var(--ks-primary) 78%, black);

    --bs-navbar-bg:     var(--ks-surface-light);
    --bs-navbar-color:  var(--ks-surface-dark);
}

/* ── Boutons — thème clair ───────────────────────────────────── */
/* hover = assombrir 12 %, active = assombrir 22 %                 */

[data-bs-theme="light"] .btn-primary {
    --bs-btn-bg:            var(--ks-primary);
    --bs-btn-border-color:  var(--ks-primary);
    --bs-btn-color:         #fff;
    --bs-btn-hover-bg:            color-mix(in srgb, var(--ks-primary) 88%, black);
    --bs-btn-hover-border-color:  color-mix(in srgb, var(--ks-primary) 88%, black);
    --bs-btn-active-bg:           color-mix(in srgb, var(--ks-primary) 78%, black);
    --bs-btn-active-border-color: color-mix(in srgb, var(--ks-primary) 78%, black);
    --bs-btn-disabled-bg:            var(--ks-primary);
    --bs-btn-disabled-border-color:  var(--ks-primary);
}

[data-bs-theme="light"] .btn-secondary {
    --bs-btn-bg:            var(--ks-secondary);
    --bs-btn-border-color:  var(--ks-secondary);
    --bs-btn-color:         #fff;
    --bs-btn-hover-bg:            color-mix(in srgb, var(--ks-secondary) 88%, black);
    --bs-btn-hover-border-color:  color-mix(in srgb, var(--ks-secondary) 88%, black);
    --bs-btn-active-bg:           color-mix(in srgb, var(--ks-secondary) 78%, black);
    --bs-btn-active-border-color: color-mix(in srgb, var(--ks-secondary) 78%, black);
}

[data-bs-theme="light"] .btn-success {
    --bs-btn-bg:            var(--ks-success);
    --bs-btn-border-color:  var(--ks-success);
    --bs-btn-color:         #fff;
    --bs-btn-hover-bg:            color-mix(in srgb, var(--ks-success) 88%, black);
    --bs-btn-hover-border-color:  color-mix(in srgb, var(--ks-success) 88%, black);
    --bs-btn-active-bg:           color-mix(in srgb, var(--ks-success) 78%, black);
    --bs-btn-active-border-color: color-mix(in srgb, var(--ks-success) 78%, black);
}

[data-bs-theme="light"] .btn-danger {
    --bs-btn-bg:            var(--ks-danger);
    --bs-btn-border-color:  var(--ks-danger);
    --bs-btn-color:         #fff;
    --bs-btn-hover-bg:            color-mix(in srgb, var(--ks-danger) 88%, black);
    --bs-btn-hover-border-color:  color-mix(in srgb, var(--ks-danger) 88%, black);
    --bs-btn-active-bg:           color-mix(in srgb, var(--ks-danger) 78%, black);
    --bs-btn-active-border-color: color-mix(in srgb, var(--ks-danger) 78%, black);
}

[data-bs-theme="light"] .btn-warning {
    --bs-btn-bg:            var(--ks-warning);
    --bs-btn-border-color:  var(--ks-warning);
    --bs-btn-color:         var(--ks-surface-dark);
    --bs-btn-hover-bg:            color-mix(in srgb, var(--ks-warning) 88%, black);
    --bs-btn-hover-border-color:  color-mix(in srgb, var(--ks-warning) 88%, black);
    --bs-btn-active-bg:           color-mix(in srgb, var(--ks-warning) 78%, black);
    --bs-btn-active-border-color: color-mix(in srgb, var(--ks-warning) 78%, black);
}

[data-bs-theme="light"] .btn-info {
    --bs-btn-bg:            var(--ks-info);
    --bs-btn-border-color:  var(--ks-info);
    --bs-btn-color:         #fff;
    --bs-btn-hover-bg:            color-mix(in srgb, var(--ks-info) 88%, black);
    --bs-btn-hover-border-color:  color-mix(in srgb, var(--ks-info) 88%, black);
    --bs-btn-active-bg:           color-mix(in srgb, var(--ks-info) 78%, black);
    --bs-btn-active-border-color: color-mix(in srgb, var(--ks-info) 78%, black);
}

/* ── Alertes — thème clair ──────────────────────────────────── */
/* fond = 15 % couleur + blanc, texte = 60 % couleur + noir      */

[data-bs-theme="light"] .alert-success {
    --bs-alert-bg:           color-mix(in srgb, var(--ks-success) 15%, white);
    --bs-alert-color:        color-mix(in srgb, var(--ks-success) 60%, black);
    --bs-alert-border-color: color-mix(in srgb, var(--ks-success) 25%, white);
}

[data-bs-theme="light"] .alert-danger {
    --bs-alert-bg:           color-mix(in srgb, var(--ks-danger) 15%, white);
    --bs-alert-color:        color-mix(in srgb, var(--ks-danger) 60%, black);
    --bs-alert-border-color: color-mix(in srgb, var(--ks-danger) 25%, white);
}

[data-bs-theme="light"] .alert-warning {
    --bs-alert-bg:           color-mix(in srgb, var(--ks-warning) 15%, white);
    --bs-alert-color:        color-mix(in srgb, var(--ks-warning) 60%, black);
    --bs-alert-border-color: color-mix(in srgb, var(--ks-warning) 25%, white);
}

[data-bs-theme="light"] .alert-info {
    --bs-alert-bg:           color-mix(in srgb, var(--ks-info) 15%, white);
    --bs-alert-color:        color-mix(in srgb, var(--ks-info) 60%, black);
    --bs-alert-border-color: color-mix(in srgb, var(--ks-info) 25%, white);
}

[data-bs-theme="light"] .alert-secondary {
    --bs-alert-bg:           color-mix(in srgb, var(--ks-secondary) 15%, white);
    --bs-alert-color:        color-mix(in srgb, var(--ks-secondary) 60%, black);
    --bs-alert-border-color: color-mix(in srgb, var(--ks-secondary) 25%, white);
}

/* ── Thème sombre ────────────────────────────────────────────── */
/* Les couleurs sont éclaircies via color-mix() pour le contraste  */

[data-bs-theme="dark"] {
    --bs-body-bg:       var(--ks-surface-dark);
    --bs-body-color:    var(--ks-surface-light);

    --bs-primary:       color-mix(in srgb, var(--ks-primary) 75%, white);
    --bs-primary-rgb:   200, 140, 86;
    --bs-secondary:     color-mix(in srgb, var(--ks-secondary) 70%, white);
    --bs-secondary-rgb: 152, 162, 172;

    --bs-success:       color-mix(in srgb, var(--ks-success) 75%, white);
    --bs-success-rgb:   110, 168, 134;
    --bs-danger:        color-mix(in srgb, var(--ks-danger) 80%, white);
    --bs-danger-rgb:    205, 102, 100;
    --bs-warning:       color-mix(in srgb, var(--ks-warning) 85%, white);
    --bs-warning-rgb:   229, 173, 91;
    --bs-info:          color-mix(in srgb, var(--ks-info) 75%, white);
    --bs-info-rgb:      122, 162, 179;

    --bs-link-color:         color-mix(in srgb, var(--ks-primary) 75%, white);
    --bs-link-hover-color:   var(--ks-surface-light);

    --bs-navbar-bg:     var(--ks-surface-dark);
    --bs-navbar-color:  var(--ks-surface-light);
}

/* ── Alertes — thème sombre ─────────────────────────────────── */
/* fond = 20 % couleur + noir, texte = 40 % couleur + blanc      */

[data-bs-theme="dark"] .alert-success {
    --bs-alert-bg:           color-mix(in srgb, var(--ks-success) 20%, black);
    --bs-alert-color:        color-mix(in srgb, var(--ks-success) 40%, white);
    --bs-alert-border-color: color-mix(in srgb, var(--ks-success) 30%, black);
}

[data-bs-theme="dark"] .alert-danger {
    --bs-alert-bg:           color-mix(in srgb, var(--ks-danger) 20%, black);
    --bs-alert-color:        color-mix(in srgb, var(--ks-danger) 40%, white);
    --bs-alert-border-color: color-mix(in srgb, var(--ks-danger) 30%, black);
}

[data-bs-theme="dark"] .alert-warning {
    --bs-alert-bg:           color-mix(in srgb, var(--ks-warning) 20%, black);
    --bs-alert-color:        color-mix(in srgb, var(--ks-warning) 40%, white);
    --bs-alert-border-color: color-mix(in srgb, var(--ks-warning) 30%, black);
}

[data-bs-theme="dark"] .alert-info {
    --bs-alert-bg:           color-mix(in srgb, var(--ks-info) 20%, black);
    --bs-alert-color:        color-mix(in srgb, var(--ks-info) 40%, white);
    --bs-alert-border-color: color-mix(in srgb, var(--ks-info) 30%, black);
}

[data-bs-theme="dark"] .alert-secondary {
    --bs-alert-bg:           color-mix(in srgb, var(--ks-secondary) 20%, black);
    --bs-alert-color:        color-mix(in srgb, var(--ks-secondary) 40%, white);
    --bs-alert-border-color: color-mix(in srgb, var(--ks-secondary) 30%, black);
}

/* ── Boutons — thème sombre ──────────────────────────────────── */
/* hover = éclaircir 10 %, active = assombrir 10 %                 */

[data-bs-theme="dark"] .btn-primary {
    --bs-btn-bg:            color-mix(in srgb, var(--ks-primary) 75%, white);
    --bs-btn-border-color:  color-mix(in srgb, var(--ks-primary) 75%, white);
    --bs-btn-color:         var(--ks-surface-dark);
    --bs-btn-hover-bg:            color-mix(in srgb, var(--ks-primary) 65%, white);
    --bs-btn-hover-border-color:  color-mix(in srgb, var(--ks-primary) 65%, white);
    --bs-btn-active-bg:           color-mix(in srgb, var(--ks-primary) 85%, white);
    --bs-btn-active-border-color: color-mix(in srgb, var(--ks-primary) 85%, white);
    --bs-btn-disabled-bg:            color-mix(in srgb, var(--ks-primary) 75%, white);
    --bs-btn-disabled-border-color:  color-mix(in srgb, var(--ks-primary) 75%, white);
}

[data-bs-theme="dark"] .btn-secondary {
    --bs-btn-bg:            color-mix(in srgb, var(--ks-secondary) 70%, white);
    --bs-btn-border-color:  color-mix(in srgb, var(--ks-secondary) 70%, white);
    --bs-btn-color:         var(--ks-surface-dark);
    --bs-btn-hover-bg:            color-mix(in srgb, var(--ks-secondary) 60%, white);
    --bs-btn-hover-border-color:  color-mix(in srgb, var(--ks-secondary) 60%, white);
    --bs-btn-active-bg:           color-mix(in srgb, var(--ks-secondary) 80%, white);
    --bs-btn-active-border-color: color-mix(in srgb, var(--ks-secondary) 80%, white);
}

[data-bs-theme="dark"] .btn-success {
    --bs-btn-bg:            color-mix(in srgb, var(--ks-success) 75%, white);
    --bs-btn-border-color:  color-mix(in srgb, var(--ks-success) 75%, white);
    --bs-btn-color:         var(--ks-surface-dark);
    --bs-btn-hover-bg:            color-mix(in srgb, var(--ks-success) 65%, white);
    --bs-btn-hover-border-color:  color-mix(in srgb, var(--ks-success) 65%, white);
    --bs-btn-active-bg:           color-mix(in srgb, var(--ks-success) 85%, white);
    --bs-btn-active-border-color: color-mix(in srgb, var(--ks-success) 85%, white);
}

[data-bs-theme="dark"] .btn-danger {
    --bs-btn-bg:            color-mix(in srgb, var(--ks-danger) 80%, white);
    --bs-btn-border-color:  color-mix(in srgb, var(--ks-danger) 80%, white);
    --bs-btn-color:         #fff;
    --bs-btn-hover-bg:            color-mix(in srgb, var(--ks-danger) 70%, white);
    --bs-btn-hover-border-color:  color-mix(in srgb, var(--ks-danger) 70%, white);
    --bs-btn-active-bg:           color-mix(in srgb, var(--ks-danger) 90%, white);
    --bs-btn-active-border-color: color-mix(in srgb, var(--ks-danger) 90%, white);
}

[data-bs-theme="dark"] .btn-warning {
    --bs-btn-bg:            color-mix(in srgb, var(--ks-warning) 85%, white);
    --bs-btn-border-color:  color-mix(in srgb, var(--ks-warning) 85%, white);
    --bs-btn-color:         var(--ks-surface-dark);
    --bs-btn-hover-bg:            color-mix(in srgb, var(--ks-warning) 75%, white);
    --bs-btn-hover-border-color:  color-mix(in srgb, var(--ks-warning) 75%, white);
    --bs-btn-active-bg:           color-mix(in srgb, var(--ks-warning) 95%, white);
    --bs-btn-active-border-color: color-mix(in srgb, var(--ks-warning) 95%, white);
}

[data-bs-theme="dark"] .btn-info {
    --bs-btn-bg:            color-mix(in srgb, var(--ks-info) 75%, white);
    --bs-btn-border-color:  color-mix(in srgb, var(--ks-info) 75%, white);
    --bs-btn-color:         var(--ks-surface-dark);
    --bs-btn-hover-bg:            color-mix(in srgb, var(--ks-info) 65%, white);
    --bs-btn-hover-border-color:  color-mix(in srgb, var(--ks-info) 65%, white);
    --bs-btn-active-bg:           color-mix(in srgb, var(--ks-info) 85%, white);
    --bs-btn-active-border-color: color-mix(in srgb, var(--ks-info) 85%, white);
}
