/* == L'ACCUEIL APRÈS CONNEXION (16/09, demande client) ========================
   Quatre gros boutons, une couleur chacun, immédiatement reconnaissables :
   bleu pour suivre, violet pour créer (la couleur de l'IA dans tout le
   studio), vert pour modifier, ambre pour créditer. Deux par rangée sur un
   écran large, un par rangée sous 760 px. */
.acc-grille{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem;
  max-width:1060px;margin:.4rem 0 0}
.acc-btn{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;
  gap:1.1rem;padding:1.5rem 1.5rem 1.5rem 1.35rem;min-height:150px;border-radius:20px;
  color:#fff;text-decoration:none;border:1px solid transparent;
  box-shadow:0 10px 26px rgba(15,23,42,.14);transition:transform .15s ease,box-shadow .15s ease,filter .15s ease}
.acc-btn:hover{text-decoration:none;color:#fff;transform:translateY(-2px);
  box-shadow:0 16px 34px rgba(15,23,42,.22);filter:saturate(1.08)}
.acc-btn:focus-visible{outline:3px solid #fff;outline-offset:3px}
.acc-ico{display:grid;place-items:center;width:64px;height:64px;border-radius:18px;
  background:rgba(255,255,255,.18);flex:0 0 auto}
.acc-txt{display:grid;gap:.3rem;min-width:0}
.acc-txt b{font-size:1.28rem;font-weight:800;line-height:1.2;letter-spacing:-.2px}
.acc-txt > span{font-size:.94rem;line-height:1.4;opacity:.92}
.acc-txt small{display:inline-block;margin-top:.25rem;font-size:.76rem;font-weight:700;
  padding:.22rem .6rem;border-radius:999px;background:rgba(255,255,255,.2);width:max-content;max-width:100%}
.acc-fleche{opacity:.85;transition:transform .15s ease}
.acc-btn:hover .acc-fleche{transform:translateX(4px);opacity:1}

/* ── LES COULEURS DES BRIQUES, ÉCARTÉES (24/09/2026, demande client) ──────
   « Chaque univers doit être identifiable immédiatement. » Avant : un violet
   en double (créer ET atelier), un indigo coincé entre le violet et le bleu,
   un bleu électrique trop proche du turquoise. Désormais sept teintes prises
   aux quatre coins du cercle chromatique, chacune en dégradé de sa propre
   famille (jamais vers la voisine) :
     violet  créer            (la marque, la couleur de l'IA)
     bleu    suivre           (bleu roi, franchement plus profond que le cyan)
     vert    modifier
     rose    studio photo     (magenta, pas rouge)
     cyan    page web         (clair et vif, pas bleu)
     orange  atelier          (orange-rouge, pas ambre)
     ambre   créditer         (doré, pas orange)
   ⚠ Les pages où mènent les briques reprennent la MÊME teinte pour leurs
     boutons principaux : table LS_UNIVERS dans inc/layout.php, jetons dans
     app.css (bloc « UNIVERS »). Changer une couleur ici = la changer là. */
.acc-bleu{background:#1d4ed8;background:linear-gradient(135deg,#3b6cf6,#1e40af)}
.acc-violet{background:#7c3aed;background:linear-gradient(135deg,#9061f9,#6d28d9)}
.acc-vert{background:#16a34a;background:linear-gradient(135deg,#22b455,#146c35)}
.acc-ambre{background:#d97706;background:linear-gradient(135deg,#f5b014,#d27008)}
.acc-rose{background:#db2777;background:linear-gradient(135deg,#ec4899,#b0125f)}
.acc-cyan{background:#0891b2;background:linear-gradient(135deg,#1cc8e6,#0786a6)}
.acc-orange{background:#ea580c;background:linear-gradient(135deg,#fb7a2c,#d9360b)}
/* Gardé pour mémoire : plus aucune tuile ne l'emploie depuis le 24/09. */
.acc-indigo{background:#4f46e5;background:linear-gradient(135deg,#6366f1,#4338ca)}
/* Le texte blanc sur le doré et le cyan clairs : une ombre portée légère
   le garde lisible sans changer la couleur de la tuile. */
.acc-ambre .acc-txt,.acc-cyan .acc-txt{text-shadow:0 1px 2px rgba(0,0,0,.22)}

@media (max-width:760px){
  .acc-grille{grid-template-columns:minmax(0,1fr);gap:.9rem}
  .acc-btn{min-height:0;padding:1.15rem 1.1rem;gap:.9rem}
  .acc-ico{width:52px;height:52px;border-radius:14px}
  .acc-ico svg{width:26px;height:26px}
  .acc-txt b{font-size:1.12rem}
}
/* Thème sombre du tableau de bord : les boutons gardent leurs couleurs, seule
   l'ombre s'assombrit. */
body.theme-sombre .acc-btn{box-shadow:0 10px 26px rgba(0,0,0,.45)}

/* == « VOUS AVEZ UNE CAMPAGNE EN COURS » (19/09, demande client) ==========
   Au-dessus des quatre boutons, parce que c'est ce qu'on vient chercher
   quand on a laissé une campagne en route. Violet, la couleur du studio. */
.acc-reprise{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:1.1rem;
  max-width:1060px;margin:.4rem 0 1.25rem;padding:1.2rem 1.4rem;border-radius:20px;
  border:1px solid rgba(124,58,237,.35);background:linear-gradient(135deg,rgba(124,58,237,.12),rgba(8,119,255,.08));
  box-shadow:0 10px 26px rgba(15,23,42,.1)}
.acc-reprise-ico{display:grid;place-items:center;width:56px;height:56px;border-radius:16px;color:#fff;
  background:linear-gradient(135deg,#7c3aed,#0877ff)}
.acc-reprise-txt{min-width:0;display:grid;gap:.25rem}
.acc-reprise-txt h2{margin:0;font-size:1.15rem;font-weight:800;letter-spacing:-.2px}
.acc-reprise-txt p{margin:0;font-size:.95rem}
.acc-reprise-txt small{font-size:.8rem;opacity:.75}
.acc-reprise-actions{display:grid;gap:.45rem;justify-items:end}
.acc-reprise-actions form{margin:0}
.acc-reprise-btn{display:inline-flex;align-items:center;gap:.55rem;padding:.8rem 1.2rem;border:0;border-radius:12px;cursor:pointer;
  background:linear-gradient(135deg,#7c3aed,#6d28d9);color:#fff;font:inherit;font-weight:700;font-size:.98rem;
  box-shadow:0 8px 20px rgba(124,58,237,.3);transition:transform .15s ease}
.acc-reprise-btn:hover{transform:translateY(-1px)}
.acc-reprise-btn:focus-visible{outline:3px solid #a78bfa;outline-offset:3px}
.acc-reprise-lien{font-size:.84rem;font-weight:600}
@media(max-width:760px){
  .acc-reprise{grid-template-columns:auto minmax(0,1fr)}
  .acc-reprise-actions{grid-column:1/-1;justify-items:stretch}
  .acc-reprise-btn{width:100%;justify-content:center}
}
@media(prefers-reduced-motion:reduce){.acc-reprise-btn{transition:none}.acc-reprise-btn:hover{transform:none}}

/* == LA TUILE « LANCER MON RADAR » (19/09) ================================
   Pleine largeur, au-dessus des quatre actions : l'accès le plus rapide à la
   valeur de Leadsoon. Dégradé bleu → violet → rose, pour se distinguer des
   quatre tuiles unies sans leur voler la hiérarchie. */
.acc-radar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:1.1rem;max-width:1060px;margin:.4rem 0 1.25rem;
  padding:1.3rem 1.5rem 1.3rem 1.35rem;border-radius:20px;color:#fff;text-decoration:none;
  background:#4f46e5;background:linear-gradient(115deg,#087aff,#7838ff 55%,#c026d3);
  box-shadow:0 12px 30px rgba(120,56,255,.28);transition:transform .15s ease,box-shadow .15s ease}
.acc-radar:hover{color:#fff;text-decoration:none;transform:translateY(-2px);box-shadow:0 18px 38px rgba(120,56,255,.36)}
.acc-radar:focus-visible{outline:3px solid #fff;outline-offset:3px}
.acc-radar-ico{display:grid;place-items:center;width:64px;height:64px;border-radius:18px;background:rgba(255,255,255,.18)}
.acc-radar-txt{display:grid;gap:.3rem;min-width:0}
.acc-radar-txt b{display:flex;align-items:center;gap:.6rem;font-size:1.3rem;font-weight:800;letter-spacing:-.2px}
.acc-radar-txt b em{font-style:normal;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;padding:.2rem .55rem;border-radius:20px;background:#fbbf24;color:#3b2500}
.acc-radar-txt > span{font-size:.94rem;line-height:1.4;opacity:.92}
.acc-radar-go{display:inline-flex;align-items:center;gap:.45rem;padding:.7rem 1.1rem;border-radius:12px;background:#fff;color:#4c1d95;font-weight:800;white-space:nowrap}
@media(max-width:760px){.acc-radar{grid-template-columns:auto minmax(0,1fr)}.acc-radar-go{grid-column:1/-1;justify-content:center}}
@media(prefers-reduced-motion:reduce){.acc-radar{transition:none}.acc-radar:hover{transform:none}}

/* Cinq tuiles sur deux colonnes : la dernière prend toute la largeur plutôt
   que de laisser un trou à côté d’elle (20/09). */
.acc-grille > :last-child:nth-child(odd){grid-column:1/-1;min-height:120px}
/* LE CRM (11/10/2026) : sa couleur, la même que dans le menu. */
.acc-menthe{background:#0f766e;background:linear-gradient(135deg,#14b8a6,#0f766e)}
.acc-menthe .acc-txt{text-shadow:0 1px 2px rgba(0,0,0,.2)}
