/* ============================================================
   Hypno-Kit — Design "Mon compte / Connexion / Inscription"
   Aligné sur la palette de l'extension hypno-product-detail
   (navy #03111f, crème #f4eee3, citron #d8ef19, violet #8d35f5).
   Tout est scopé sous .hk-auth-section et .hk-member-wrap pour ne
   jamais affecter les boutons/couleurs utilisés ailleurs sur le site.
   ============================================================ */

.hk-auth-section,
.hk-member-wrap {
  --hka-navy:    #03111f;
  --hka-navy-2:  #0a2235;
  --hka-cream:   #f4eee3;
  --hka-text:    #071523;
  --hka-muted:   #6d7680;
  --hka-lime:    #d8ef19;
  --hka-purple:  #8d35f5;
  --hka-gold:    #d9a22e;
  --hka-line:    #dfe3e6;
  --hka-radius:  20px;
  font-family: 'Inter', sans-serif;
}

/* ── Connexion / Inscription ─────────────────────────────────── */
.hk-auth-section {
  background: var(--hka-cream);
  padding: 70px 40px;
  border-radius: var(--hka-radius);
}
.hk-auth-eyebrow {
  color: var(--hka-gold);
  font-weight: 800;
  font-size: .7rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.hk-auth-eyebrow::before {
  content: "";
  width: 28px;
  height: 1px;
  background: currentColor;
}
.hk-auth-h1 {
  font-weight: 800;
  letter-spacing: -.05em;
  text-transform: uppercase;
  color: var(--hka-navy);
  line-height: .98;
  margin: 16px 0 18px;
}
.hk-auth-h1 span { color: var(--hka-purple) !important; }
.hk-auth-desc { color: var(--hka-muted); line-height: 1.7; }
.hk-auth-benefits { list-style: none; padding: 0; margin: 26px 0 0; }
.hk-auth-benefits li {
  color: var(--hka-text);
  font-size: .92rem;
  padding: 10px 0;
  border-bottom: 1px solid var(--hka-line);
}
.hk-auth-benefits li::before {
  content: "✓";
  color: var(--hka-purple);
  font-weight: 900;
  margin-right: 10px;
}

.hk-auth-card {
  background: #fff;
  border-radius: var(--hka-radius);
  padding: 40px;
  box-shadow: 0 30px 70px rgba(3,17,31,.10);
}
.hk-card-icon {
  width: 44px; height: 44px;
  display: grid; place-items: center;
  background: var(--hka-purple);
  color: #fff;
  border-radius: 50%;
  font-size: 1.1rem;
}
.hk-card-top { display: flex; align-items: center; gap: 14px; margin-bottom: 26px; }
.hk-card-title { font-weight: 800; color: var(--hka-navy); font-size: 1.15rem; }
.hk-card-subtitle { color: var(--hka-muted); font-size: .82rem; margin-top: 2px; }

.hk-auth-card .hk-form-group label {
  font-weight: 700;
  font-size: .78rem;
  color: var(--hka-navy);
  text-transform: uppercase;
  letter-spacing: .02em;
}
.hk-auth-card .hk-input {
  height: 48px;
  border: 1px solid var(--hka-line);
  border-radius: 10px;
  padding: 0 14px;
  font-family: 'Inter', sans-serif;
  color: var(--hka-text);
  background: #fff;
}
.hk-auth-card .hk-input:focus {
  border-color: var(--hka-purple);
  box-shadow: 0 0 0 4px rgba(141,53,245,.1);
  outline: none;
}
.hk-auth-card .hk-checkbox { font-size: .82rem; color: var(--hka-muted); }
.hk-auth-card .hk-checkbox input[type="checkbox"]:checked { accent-color: var(--hka-purple); }
.hk-auth-card .hk-checkbox a { color: var(--hka-purple); font-weight: 700; }

.hk-forgot, .hk-lostpw-back {
  color: var(--hka-purple) !important;
  font-weight: 700;
  font-size: .82rem;
}
.hk-auth-switch { color: var(--hka-muted); font-size: .86rem; text-align: center; }
.hk-auth-switch a { color: var(--hka-purple); font-weight: 800; }
.hk-form-divider { height: 1px; background: var(--hka-line); }

/* Bouton principal (connexion / inscription / réinit. mot de passe) :
   même traitement que le bouton "Ajouter au panier" de la référence —
   fond citron, texte navy, bien visible. */
.hk-auth-card .hk-btn--primary {
  background: var(--hka-lime) !important;
  color: var(--hka-navy) !important;
  border: 0 !important;
  border-radius: 10px !important;
  min-height: 52px;
  font-weight: 800 !important;
  text-transform: uppercase;
  letter-spacing: -.01em;
}
.hk-auth-card .hk-btn--primary:hover { filter: brightness(0.96); }

.hk-auth-card .hk-notice { border-radius: 10px; font-size: .85rem; }
.hk-auth-card .hk-notice--success { background: rgba(141,53,245,.08); color: var(--hka-purple); border: 1px solid rgba(141,53,245,.2); }
.hk-auth-card .hk-notice--error   { background: #fdeee7; color: #b3401c; border: 1px solid #f3cdb9; }

@media (max-width: 980px) {
  .hk-auth-section { padding: 44px 22px; }
}

/* ── Mon compte / Espace membre ──────────────────────────────── */
.hk-member-wrap {
  background: var(--hka-cream);
  padding: 60px 40px;
  border-radius: var(--hka-radius);
}
.hk-member-header h1 {
  font-weight: 800;
  letter-spacing: -.04em;
  text-transform: uppercase;
  color: var(--hka-navy);
  margin: 0 0 6px;
}
.hk-member-header h1 span { color: var(--hka-purple); }
.hk-member-header p { color: var(--hka-muted); }

.hk-stat-card {
  background: #fff;
  border-radius: 16px;
  padding: 22px;
  box-shadow: 0 16px 40px rgba(3,17,31,.08);
}
/* Spécificité renforcée : la règle de base (.hk-stat-card .hk-stat-number)
   utilisait du blanc, pensé pour l'ancien thème sombre — invisible sur les
   cartes blanches du nouveau design. On la surcharge explicitement ici. */
.hk-member-wrap .hk-stat-card .hk-stat-number {
  color: var(--hka-navy) !important;
  font-weight: 800;
}
.hk-member-wrap .hk-stat-card .hk-stat-label {
  color: var(--hka-muted) !important;
  font-size: .78rem;
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: .04em;
}

/* Notice "Vous n'avez pas encore de ressources" : la couleur de base (cyan
   pâle sur fond cyan pâle) était pensée pour un fond sombre — illisible ici. */
.hk-member-wrap .hk-notice--info,
.hk-auth-card .hk-notice--info {
  background: rgba(141,53,245,.06) !important;
  color: var(--hka-navy) !important;
  border: 1px solid rgba(141,53,245,.18) !important;
}

.hk-member-section {
  background: #fff;
  border-radius: var(--hka-radius);
  padding: 30px;
  box-shadow: 0 16px 40px rgba(3,17,31,.06);
}
.hk-member-section h2 { color: var(--hka-navy); font-weight: 800; }

.hk-member-wrap .hk-btn--teal,
.hk-member-wrap .hk-btn--primary {
  background: var(--hka-lime) !important;
  color: var(--hka-navy) !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-transform: uppercase;
  font-size: .78rem !important;
}

.hk-resource-card {
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 16px 40px rgba(3,17,31,.08);
}
.hk-resource-body { padding: 16px; }

@media (max-width: 980px) {
  .hk-member-wrap { padding: 40px 20px; }
}
