/**
 * Espace membre « Mon compte » — habillage, scopé .cda-compte.
 * Hérite du socle .cda-tirage (tokens de la charte : --cda-heading, --cda-text,
 * --cda-surface, --cda-blush, --cda-hairline, --cda-btn…). Ne redéfinit pas le socle.
 */

/* Largeur pleine : le bloc suit le conteneur/l'alignement Elementor (ne se centre
   plus de force). Règle la largeur via la colonne/le conteneur dans Elementor. */
.cda-compte { width: 100%; }

/* L'enveloppe réutilise les TOKENS de .cda-tirage (couleurs, polices) mais PAS son
   décor de conteneur de module (fond ivoire + bordure + ombre + padding bas) :
   sinon double-cadre et « boîte fantôme » sous la carte. */
.cda-tirage.cda-compte {
  max-width: none;   /* annule le max-width: 720px du socle (qui bloquait la largeur) */
  margin: 0;         /* annule le margin: 0 auto du socle (qui centrait de force) */
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
}
/* Retire aussi le « filet doré intérieur » (pseudo-élément décoratif du socle). */
.cda-tirage.cda-compte::before { content: none; display: none; }

/* --- Cartes --- */
.cda-compte-carte {
  background: var(--cda-surface, #fff);
  border: 1px solid var(--cda-hairline, #e7dad3);
  border-radius: 12px;
  padding: 22px 24px;
  margin: 0 0 18px;
  box-shadow: 0 6px 22px rgba(80, 50, 40, 0.05);
}

.cda-compte-kicker {
  font-family: var(--cda-i, inherit);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.72rem;
  color: var(--cda-kicker, #b0822e);
  margin: 0 0 10px;
}

.cda-compte-titre,
.cda-compte-bonjour {
  font-family: var(--cda-heading, Georgia, serif);
  color: var(--cda-heading-text, #241d16);
  margin: 0;
}
.cda-compte-titre { font-size: 1.5rem; margin: 0 0 8px; }
.cda-compte-intro { color: var(--cda-muted, #6b6156); margin: 0 0 18px; line-height: 1.6; }

/* --- En-tête (Bonjour + badge) --- */
.cda-compte-entete {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 12px; margin: 4px 0 20px;
}
.cda-compte-bonjour { font-size: 1.8rem; }
.cda-compte-badge {
  display: inline-block; padding: 6px 14px; border-radius: 999px;
  font-size: 0.82rem; font-weight: 600; text-decoration: none;
  background: var(--cda-blush, #f6e7df); color: var(--cda-accent-text, #a5642a);
  border: 1px solid var(--cda-border-accent, #e8cdbf);
}
.cda-compte-badge--invite { background: var(--cda-btn, #b0822e); color: var(--cda-btn-text, #fffdf8); border: 0; }

/* --- Formulaires (connexion / profil) --- */
.cda-compte-form { display: flex; flex-direction: column; gap: 6px; }
.cda-compte-label { font-size: 0.85rem; color: var(--cda-muted, #6b6156); margin-top: 8px; }
.cda-compte-input {
  padding: 12px 14px; font-size: 1rem;
  border: 1px solid var(--cda-field-border, #dccfc5);
  border-radius: 8px; background: var(--cda-field, #fffdf8);
  color: var(--cda-field-text, #241d16); width: 100%;
}
.cda-compte-input:focus { outline: none; border-color: var(--cda-field-focus, #b0822e); }
.cda-compte-date { display: grid; grid-template-columns: 1fr 1fr 1.3fr; gap: 10px; }
.cda-compte-btn { margin-top: 16px; align-self: flex-start; }
.cda-compte-message { margin: 12px 0 0; font-size: 0.9rem; min-height: 1.2em; }
.cda-compte-message.is-ok { color: var(--cda-accent-text, #4a7a4a); }
.cda-compte-message.is-erreur { color: var(--cda-error, #b3372e); }

/* --- Message de l'ange --- */
.cda-compte-ange { text-align: center; background: var(--cda-blush, #faf4e6); }
.cda-compte-ange-nom {
  font-family: var(--cda-heading, Georgia, serif);
  font-size: 1.4rem; color: var(--cda-accent-text, #b0822e); margin: 2px 0 10px;
}
.cda-compte-ange-msg { font-size: 1.05rem; line-height: 1.7; color: var(--cda-text, #4a4238); margin: 0; }

/* --- Horoscope --- */
.cda-compte-horo-texte { line-height: 1.7; color: var(--cda-text, #4a4238); }
.cda-compte-horo-texte p { margin: 0 0 12px; }
.cda-compte-horo-vide { color: var(--cda-muted, #8a8175); font-style: italic; margin: 0; }

/* --- Listes relisables (guidances / rêves) --- */
.cda-compte-recurrents {
  background: var(--cda-blush, #faf4e6); border-radius: 8px;
  padding: 10px 14px; font-size: 0.92rem; color: var(--cda-text, #4a4238); margin: 0 0 14px;
}
.cda-compte-liste { list-style: none; margin: 0; padding: 0; }
.cda-compte-item { border-bottom: 1px solid var(--cda-hairline, #eee3db); }
.cda-compte-item:last-child { border-bottom: 0; }
.cda-compte-item summary {
  cursor: pointer; padding: 12px 0; list-style: none;
  display: flex; gap: 12px; align-items: baseline;
}
.cda-compte-item summary::-webkit-details-marker { display: none; }
.cda-compte-item summary::before { content: '+'; color: var(--cda-kicker, #b0822e); font-weight: 700; }
.cda-compte-item details[open] summary::before { content: '–'; }
.cda-compte-item-date { color: var(--cda-muted, #8a8175); font-size: 0.85rem; white-space: nowrap; }
.cda-compte-item-titre { color: var(--cda-heading-text, #241d16); font-weight: 600; }
.cda-compte-item-corps { padding: 4px 0 16px; line-height: 1.7; color: var(--cda-text, #4a4238); }
.cda-compte-item-corps p { margin: 0 0 12px; }

/* --- Commandes --- */
/* Chaque commande avec une lecture est un accordéon (même gabarit que les guidances) :
   date + produit + montant + statut dans le résumé, la lecture au dépli. */
.cda-compte-commandes .cda-compte-item summary .cda-compte-cmd-montant,
.cda-compte-item--statique .cda-compte-cmd-montant { margin-left: auto; }
.cda-compte-commandes .cda-compte-item summary .cda-compte-cmd-statut,
.cda-compte-item--statique .cda-compte-cmd-statut { font-size: 0.85rem; }
/* Commande sans lecture à relire (abonnement Club, paiement en attente) : ligne simple. */
.cda-compte-item--statique { list-style: none; border-bottom: 1px solid var(--cda-hairline, #eee3db); }
.cda-compte-item--statique:last-child { border-bottom: 0; }
.cda-compte-item-tete { display: flex; gap: 12px; align-items: baseline; padding: 12px 0; }

.cda-compte-liste--plate .cda-compte-cmd {
  display: grid; grid-template-columns: auto 1fr auto auto; gap: 10px; align-items: center;
  padding: 10px 0; border-bottom: 1px solid var(--cda-hairline, #eee3db);
  font-size: 0.92rem;
}
.cda-compte-cmd:last-child { border-bottom: 0; }
.cda-compte-cmd-date { color: var(--cda-muted, #8a8175); white-space: nowrap; }
.cda-compte-cmd-produit { color: var(--cda-heading-text, #241d16); font-weight: 600; }
.cda-compte-cmd-montant { color: var(--cda-text, #4a4238); white-space: nowrap; }
.cda-compte-cmd-statut { color: var(--cda-accent-text, #a5642a); white-space: nowrap; }

/* --- Liens & services --- */
.cda-compte-lien {
  display: inline-block; margin-top: 12px; color: var(--cda-accent-text, #a5642a);
  text-decoration: none; font-weight: 600; font-size: 0.92rem;
}
.cda-compte-lien:hover { text-decoration: underline; }
.cda-compte-gerer { margin-top: 16px; }
.cda-compte-services { display: flex; flex-wrap: wrap; gap: 10px; }
.cda-compte-service {
  padding: 8px 14px; border-radius: 999px; text-decoration: none; font-size: 0.9rem;
  background: var(--cda-blush, #f6e7df); color: var(--cda-accent-text, #a5642a);
  border: 1px solid var(--cda-hairline, #e7dad3);
}
.cda-compte-service:hover { background: var(--cda-btn, #b0822e); color: var(--cda-btn-text, #fffdf8); }

.cda-compte-vide { color: var(--cda-muted, #8a8175); font-style: italic; margin: 0; }

/* Images dynamiques (ange / signe) — responsive par défaut ; le reste se règle
   dans Elementor (largeur du widget) ou en CSS. */
.cda-mon-image { max-width: 100%; height: auto; display: inline-block; }

/* --- Cartes verrouillées (avantages Club) --- */
.cda-compte-verrou { text-align: center; border-style: dashed; }
.cda-compte-cadenas { font-size: 1.4rem; color: var(--cda-kicker, #b0822e); }
.cda-compte-verrou-titre {
  font-family: var(--cda-heading, Georgia, serif); font-size: 1.2rem;
  color: var(--cda-heading-text, #241d16); margin: 6px 0 8px;
}
.cda-compte-verrou-texte { color: var(--cda-muted, #6b6156); line-height: 1.6; margin: 0 auto 16px; max-width: 46ch; }

@media (max-width: 520px) {
  .cda-compte-liste--plate .cda-compte-cmd { grid-template-columns: 1fr auto; }
  .cda-compte-cmd-produit { grid-column: 1 / -1; order: 3; }
}