/* ==========================================================================
   Upkyo Campagnes : habillage d'Acelle 4.2 aux couleurs de l'espace client Upkyo
   Source : ~/Dev/pcm-hosting/upkyo-campagnes/upkyo-theme.css
   Chargé après les feuilles d'Acelle (voir install.sh). Ne surcharge que les
   jetons de variables.css, plus quelques composants qui codent leurs couleurs.
   Palette : upkyo-app/layer.css (fond nuit #08090B, bleu #1966FF) et
   brand/upkyo/README.md (nuit #0A1631 pour le texte sur fond clair).
   ========================================================================== */

/* ---------- Clair ---------- */
:root,
html[data-color-scheme] {
    --font-family:          "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --font-mono:            "Fragment Mono", "SF Mono", ui-monospace, Menlo, monospace;

    --color-text:           #0A1631;
    --color-text-secondary: #26314D;
    --color-text-muted:     #5B6785;
    --color-text-disabled:  #9AA3B8;

    --color-page-bg:        #F4F6FB;
    --color-card-bg:        #FFFFFF;
    --color-hover-bg:       #EEF2FB;
    --color-active-bg:      #E3EAFA;
    --color-subtle-bg:      #F8F9FD;
    --color-bg-subtle:      #F8F9FD;
    --color-banner-bg:      #EAF0FF;

    --color-border:         #E3E7F0;
    --color-border-strong:  #CDD4E3;
    --color-border-focus:   #1966FF;

    --color-teal:           #1966FF;
    --color-teal-hover:     #0B47C9;
    --color-teal-active:    #0A3DAD;
    --color-teal-ring:      rgba(25, 102, 255, 0.18);
    --color-teal-light:     #EAF0FF;

    --color-info:           #1966FF;
    --color-info-dark:      #0B47C9;

    --illust-teal:          rgba(25, 102, 255, 0.18);
    --illust-teal-bold:     rgba(25, 102, 255, 0.40);

    --radius-input:         6px;
    --radius-card:          12px;
    --shadow-card:          0 1px 2px rgba(10, 22, 49, 0.05);
    --shadow-dropdown:      0 8px 24px rgba(10, 22, 49, 0.10), 0 0 1px rgba(10, 22, 49, 0.10);
    --shadow-modal:         0 16px 48px rgba(10, 22, 49, 0.18);
}

/* ---------- Sombre : identique à l'espace client Upkyo ---------- */
html[data-theme="dark"],
html[data-theme="dark"][data-color-scheme] {
    color-scheme: dark;

    --color-white:          #14151A;
    --color-black:          #F3F4F6;

    --color-text:           #F3F4F6;
    --color-text-secondary: #C9CCD2;
    --color-text-muted:     #8D929B;
    --color-text-disabled:  #5A5F68;

    --color-page-bg:        #08090B;
    --color-card-bg:        #131419;
    --color-hover-bg:       #1A1C22;
    --color-active-bg:      #20232A;
    --color-subtle-bg:      #0E0F12;
    --color-bg-subtle:      #0E0F12;
    --color-banner-bg:      #0E1526;

    --color-border:         rgba(255, 255, 255, 0.07);
    --color-border-strong:  rgba(255, 255, 255, 0.12);
    --color-border-focus:   #4D8BFF;

    --color-teal:           #1966FF;
    --color-teal-hover:     #4D8BFF;
    --color-teal-active:    #0B47C9;
    --color-teal-ring:      rgba(77, 139, 255, 0.22);
    --color-teal-light:     rgba(25, 102, 255, 0.10);

    --color-success:        #3DDC97;
    --color-info:           #4D8BFF;
    --color-info-dark:      #8FD3FF;
    --color-info-bg:        rgba(77, 139, 255, 0.10);

    --illust-teal:          rgba(77, 139, 255, 0.22);
    --illust-teal-bold:     rgba(77, 139, 255, 0.45);

    --shadow-card:          0 1px 2px rgba(0, 0, 0, 0.4);
    --shadow-dropdown:      0 12px 32px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.07);
    --shadow-modal:         0 24px 64px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(255, 255, 255, 0.07);
}

/* ---------- Base ---------- */
html body {
    font-family: var(--font-family);
    letter-spacing: -0.011em;
    -webkit-font-smoothing: antialiased;
}
code, kbd, pre, samp, .mono, .font-monospace { font-family: var(--font-mono); letter-spacing: 0; }

/* Les boutons principaux reprennent le bouton de l'espace client */
.btn-primary,
.mc-btn-primary,
button.mc-btn--primary,
.mc-btn.mc-btn--primary {
    background: var(--color-teal) !important;
    border-color: var(--color-teal) !important;
    color: #FFFFFF !important;
    border-radius: 6px;
    font-weight: 500;
}
.btn-primary:hover,
.mc-btn-primary:hover,
button.mc-btn--primary:hover,
.mc-btn.mc-btn--primary:hover {
    background: var(--color-teal-hover) !important;
    border-color: var(--color-teal-hover) !important;
}

/* Bootstrap 5 garde ses propres variables de couleur */
:root, html[data-color-scheme] {
    --bs-primary: #1966FF;
    --bs-primary-rgb: 25, 102, 255;
    --bs-link-color: #1966FF;
    --bs-link-hover-color: #0B47C9;
    --bs-link-color-rgb: 25, 102, 255;
    --bs-body-font-family: var(--font-family);
}
html[data-theme="dark"] {
    --bs-body-bg: #08090B;
    --bs-body-color: #F3F4F6;
    --bs-border-color: rgba(255, 255, 255, 0.07);
    --bs-link-color: #4D8BFF;
    --bs-link-hover-color: #8FD3FF;
    --bs-link-color-rgb: 77, 139, 255;
}

/* Fond de la page de connexion : grille discrète du site Upkyo */
html[data-theme="dark"] body {
    background-color: #08090B;
}
html[data-theme="dark"] .auth-page,
html[data-theme="dark"] .auth-wrapper,
html[data-theme="dark"] .mc-auth {
    background:
        radial-gradient(900px 480px at 50% -10%, rgba(25, 102, 255, 0.16), transparent 70%),
        #08090B;
}

/* Sélection de texte et barre de défilement */
::selection { background: rgba(25, 102, 255, 0.28); }
html[data-theme="dark"] ::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.12); border-radius: 8px; }

/* Pages d'erreur et anciennes pages Bootstrap */
section.min-vh-100 .btn-dark,
.btn-dark.rounded-pill {
    background: var(--color-teal) !important;
    border-color: var(--color-teal) !important;
    color: #FFFFFF !important;
}
html[data-theme="dark"] body { color: var(--color-text); }
html[data-theme="dark"] .text-danger { color: #F87171 !important; }