/* ── REPRISE (IA + humain) ── bloo-header ──
 * FICHIER : assets/css/layouts/aurora.css
 * ROLE : Skin « Aurora » de la carte publique : glassmorphisme sombre dont le fond et les accents dérivent de la
 *        couleur d'accent du thème (--card-accent).
 * ENTREES/SORTIES : Toutes les règles sous body[data-layout="aurora"] : .card-container, .card-inner (::before
 *                   masqué), .card-avatar-frame, .card-name, h1, h2, .card-company, .mod-btn, [class*="tile"],
 *                   .mod-disabled, .carousel-dot(.active), .card-footer, .card-footer-logo .f-accent,
 *                   .contact-actions a/button. Pas de variable définie ; thème sombre fixe ; pas de point de
 *                   rupture.
 * DEPEND : --card-accent posé par card.php ; polices DM Sans et Playfair Display (déclarées dans bloo-fonts.css) ;
 *          color-mix() (navigateurs récents).
 * APPELE PAR : card.php (lien dynamique /assets/css/layouts/<layout>.css?v=filemtime, émis seulement si le layout
 *              n'est pas studio) quand layout = aurora.
 * REPRISE :
 *   - Chargée après bloo-design-system-2026.css et avant card-redesign.css : à spécificité égale card-redesign.css
 *     passe après.
 *   - card.php contient aussi un bloc <style> inline body[data-layout="aurora"] (vers la ligne 3258, avant le
 *     lien) : deux sources à tenir cohérentes, la feuille l'emporte à spécificité égale.
 *   - Tout est en !important ; le sélecteur [class*="tile"] touche n'importe quel élément dont une classe contient
 *     « tile » (y compris dans les modules).
 *   - Layout gratuit (hors $__paidLayouts) et marqué « wip-legacy » en aperçu backoffice (?wip=1), donc concerné
 *     par les correctifs body.wip-preview.wip-legacy du design system.
 *   - ?v= = filemtime de ce fichier : rien à bumper à la main.
 * MAJ :
 *   - 2026-10-05 · rel2770 · en-tete de reprise (annotation lot 5 : CSS)
 * ── fin REPRISE ── */
/* ============================================================
   bloo.Cards — Layout: Aurora (dark glassmorphism, THEME-DRIVEN)
   Le fond et les accents dérivent de var(--card-accent) (thème choisi).
   ============================================================ */

body[data-layout="aurora"] {
  background:
    radial-gradient(ellipse at 30% 20%, color-mix(in srgb, var(--card-accent) 22%, transparent) 0%, transparent 55%),
    radial-gradient(ellipse at 70% 80%, color-mix(in srgb, var(--card-accent) 16%, transparent) 0%, transparent 60%),
    radial-gradient(ellipse at 30% 60%, color-mix(in srgb, var(--card-accent) 45%, #14110a) 0%, color-mix(in srgb, var(--card-accent) 18%, #0a0604) 50%, #0a0604 100%) !important;
  color: #f5e9d4 !important;
  font-family: 'DM Sans', system-ui, -apple-system, sans-serif !important;
}

body[data-layout="aurora"] .card-container,
body[data-layout="aurora"] .card-inner,
body[data-layout="aurora"] .modules-section,
body[data-layout="aurora"] .modules-page-wrap,
body[data-layout="aurora"] .modules-page {
  background: transparent !important;
}

body[data-layout="aurora"] .card-inner {
  background: linear-gradient(180deg, color-mix(in srgb, var(--card-accent) 22%, rgba(20,17,10,0.6)) 0%, color-mix(in srgb, var(--card-accent) 10%, rgba(10,6,4,0.72)) 100%) !important;
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border: 1px solid color-mix(in srgb, var(--card-accent) 22%, transparent) !important;
}

body[data-layout="aurora"] .card-inner::before { display: none !important; }

body[data-layout="aurora"] .card-avatar-frame {
  background: linear-gradient(135deg, var(--card-accent), color-mix(in srgb, var(--card-accent) 65%, #000)) !important;
  box-shadow:
    0 0 0 4px color-mix(in srgb, var(--card-accent) 22%, transparent),
    0 8px 24px color-mix(in srgb, var(--card-accent) 40%, transparent) !important;
}

body[data-layout="aurora"] .card-name,
body[data-layout="aurora"] h1,
body[data-layout="aurora"] h2 {
  color: #f5e9d4 !important;
  font-family: 'Playfair Display', Georgia, serif !important;
}

body[data-layout="aurora"] .card-company,
body[data-layout="aurora"] .card-name + p,
body[data-layout="aurora"] .card-name::after {
  color: rgba(245, 233, 212, 0.75) !important;
}

body[data-layout="aurora"] .card-name::after {
  background: linear-gradient(90deg, transparent, var(--card-accent), transparent) !important;
}

body[data-layout="aurora"] .mod-btn,
body[data-layout="aurora"] [class*="tile"] {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid color-mix(in srgb, var(--card-accent) 20%, transparent) !important;
  color: #f5e9d4 !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

body[data-layout="aurora"] .mod-btn:hover {
  background: rgba(255, 255, 255, 0.10) !important;
  border-color: color-mix(in srgb, var(--card-accent) 40%, transparent) !important;
}

body[data-layout="aurora"] .mod-btn i,
body[data-layout="aurora"] [class*="tile"] i {
  color: var(--card-accent) !important;
}

body[data-layout="aurora"] .mod-disabled { opacity: 0.45 !important; }

body[data-layout="aurora"] .carousel-dot {
  background: rgba(245, 233, 212, 0.35) !important;
}
body[data-layout="aurora"] .carousel-dot.active {
  background: var(--card-accent) !important;
}

body[data-layout="aurora"] .card-footer {
  background: transparent !important;
  border-top: 1px solid color-mix(in srgb, var(--card-accent) 20%, transparent) !important;
}
body[data-layout="aurora"] .card-footer-logo { color: #f5e9d4 !important; }
body[data-layout="aurora"] .card-footer-logo .f-accent { color: var(--card-accent) !important; }

body[data-layout="aurora"] .contact-actions a,
body[data-layout="aurora"] .contact-actions button {
  background: linear-gradient(135deg, var(--card-accent), color-mix(in srgb, var(--card-accent) 70%, #000)) !important;
  color: #fff !important;
  border: none !important;
}
