/* ============================================================================
   EXAT || Tr@ce — Thème "Canopée" pour la page de CONNEXION (login.php)
   ----------------------------------------------------------------------------
   • Se charge en DERNIER dans le <head> de login.php (après le <style> inline).
   • Reprend la palette des 3 thèmes ; respecte le choix mémorisé (data-exat-theme).
   ============================================================================ */
:root,
html[data-exat-theme="canopee"]{ --xt-primary:#1B5E3F; --xt-primary-600:#14503A; --xt-accent:#E29A2E;
  --xt-sidebar:#123227; --xt-ring:rgba(27,94,63,.35); }
html[data-exat-theme="ivoire"]{  --xt-primary:#0F6E78; --xt-primary-600:#0B5A63; --xt-accent:#F07D22;
  --xt-sidebar:#0B4A52; --xt-ring:rgba(15,110,120,.35); }
html[data-exat-theme="grenat"]{  --xt-primary:#B31E45; --xt-primary-600:#991939; --xt-accent:#FF5957;
  --xt-sidebar:#241019; --xt-ring:rgba(179,30,69,.35); }

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

/* Fond : voile LÉGER (la photo reste lumineuse). L'assombrissement se fait
   maintenant SUR LA CARTE (voir .login-box-body plus bas), pas sur tout l'écran.
   Les 2 derniers nombres de chaque rgba = opacité du voile. Repères :
     .20/.14 -> photo quasi nette    |   .34/.24 -> léger (actuel)
     .55/.45 -> moyen                |   .82/.72 -> sombre */
html{
  background:
    linear-gradient(135deg, rgba(18,50,39,.24), rgba(14,40,32,.14)),
    url(../img/hero-home.jpg) no-repeat center center fixed !important;
  background-size:cover !important;
}
html[data-exat-theme="ivoire"]{ background:linear-gradient(135deg,rgba(11,74,82,.90),rgba(8,58,65,.78)),url(../img/hero-home.jpg) no-repeat center center fixed !important; background-size:cover !important; }
html[data-exat-theme="grenat"]{ background:linear-gradient(135deg,rgba(36,16,25,.90),rgba(26,11,18,.80)),url(../img/hero-home.jpg) no-repeat center center fixed !important; background-size:cover !important; }

body.login-page{ font-family:"Inter",Helvetica,Arial,sans-serif; }

/* Logo / titre */
.login-logo a strong{
  font-family:"Sora",sans-serif !important; font-weight:800 !important;
  letter-spacing:-.02em; color:#fff !important;
  text-shadow:0 2px 12px rgba(0,0,0,.65), 0 0 34px rgba(0,0,0,.45);
}

/* Carte : verre dépoli net */
.login-box{ width:380px; }
.login-box-body{
  /* Carte ASSOMBRIE : verre vert foncé translucide -> ressort sur la photo.
     Montez l'opacité (.72 -> .85) pour plus sombre, descendez pour plus clair. */
  background:rgba(16,42,32,.72) !important;
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border:1px solid rgba(255,255,255,.14);
  border-radius:16px !important;
  box-shadow:0 24px 70px rgba(0,0,0,.55) !important;
  padding:26px 24px !important;
}
.login-box-msg,
.login-box-body p{ color:#eef5ef !important; }

/* Champs */
.login-box-body .form-control{
  background:rgba(255,255,255,.92) !important;
  color:#233029 !important; font-weight:500 !important;
  border:1px solid rgba(255,255,255,.5) !important;
  border-radius:10px !important; height:44px;
}
.login-box-body .form-control:focus{
  border-color:var(--xt-accent) !important;
  box-shadow:0 0 0 3px var(--xt-ring) !important;
}
.login-box-body .form-control-feedback{ color:#123227; line-height:44px; }

/* Bouton principal */
.login-box-body .btn-primary{
  background-color:var(--xt-primary) !important; border-color:var(--xt-primary) !important;
  border-radius:10px !important; height:44px; font-family:"Sora",sans-serif; font-weight:700;
  letter-spacing:.02em; box-shadow:0 8px 22px rgba(0,0,0,.25);
}
.login-box-body .btn-primary:hover,.login-box-body .btn-primary:focus{
  background-color:var(--xt-primary-600) !important; border-color:var(--xt-primary-600) !important;
}

/* Liens */
.login-box-body a{ color:var(--xt-accent) !important; font-weight:600 !important; }
.login-box-body a:hover{ color:#fff !important; }
#pwd-forget a{ color:var(--xt-accent) !important; }