/* D515 v3 — Readability EXHAUSTIVE Yacine 29avr20h27
   Fix v2 ne couvrait PAS:
   - .cat-btn (erp-launchpad filtres catégories)
   - .module-head .name (erp-launchpad sections titres "Intelligence IA")
   - .section-title (erp-gap-fill-offer "Matrice des risques")
   - header h1 (color:transparent + gradient fallback)
   - footer links (marketplace footer Services/Ressources)
*/

/* ════════════════════════════════════════════════════════════════
   A. ERP-LAUNCHPAD — cat filters + section titles + sub-modules
   ════════════════════════════════════════════════════════════════ */

/* Cat-btn (filtres en haut: "Tous", "Intelligence IA", "Commerce & Sales"...) */
.cat-btn {
  color: #cbd5e0;
  background: var(--bg-2, #11141f);
  border: 1px solid rgba(99,102,241,0.25);
}
.cat-btn:hover {
  color: #fff;
  border-color: rgba(99,102,241,0.5);
}
.cat-btn.active {
  color: #fff;
  background: linear-gradient(135deg, #6366f1, #a855f7);
  border-color: #a855f7;
}

/* Module sections titres ("Intelligence IA", "Commerce & Sales" en gros) */
.module-head .name,
.module-head > .info > .name,
.module-sec .module-head .name {
  color: #e2e8f0;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.module-head .sub,
.module-head > .info > .sub {
  color: #94a3b8;
  font-size: 12.5px;
  margin-top: 2px;
}

/* Module ic (icône) */
.module-head .ic { font-size: 22px; }
.module-head .chev { color: #64748b; font-size: 14px; }

/* Sub-modules names */
.submod-name { color: #e2e8f0; font-weight: 600; font-size: 13px; }
.submod-ic { font-size: 18px; }

/* ════════════════════════════════════════════════════════════════
   B. ERP-GAP-FILL-OFFER — h1 transparent + section-title
   ════════════════════════════════════════════════════════════════ */

/* D519 fix: header h1 fallback retiré (cassait pages light comme index)
   Theme-aware fallback uniquement sur pages dark détectées */
body[data-theme="dark"] header h1,
body.theme-night header h1,
body[style*="radial-gradient"][style*="#05060a"] header h1,
body[style*="radial-gradient"][style*="#0b0d15"] header h1 {
  color: #e2e8f0; /* fallback dark only */
}

/* Si le navigator supporte background-clip text, le gradient prend le dessus */
@supports (-webkit-background-clip: text) or (background-clip: text) {
  header h1 {
    background: linear-gradient(90deg, #22d3ee, #a855f7, #f43f5e);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    /* Fallback en cas où: ajoute text-shadow pour contour si gradient invisible */
  }
}

/* Section titles ("Matrice des risques 5×5", "KPIs pilotage offre", etc.) */
.section-title {
  color: #e2e8f0;
  font-size: 16px;
  font-weight: 700;
}
.section-title .suffix {
  color: #94a3b8;
  font-weight: 500;
}

/* Pitch box "💡 Les ERPs SAP/Oracle/Sage..." */
header .pitch, .pitch-banner, .pitch-box {
  color: #cbd5e0;
}

header .sub, .header-sub {
  color: #cbd5e0;
}

/* Service titles */
.service h5 { color: #e2e8f0 !important; }
.service .price { color: #a855f7; }

/* ════════════════════════════════════════════════════════════════
   C. MARKETPLACE / INDEX FOOTER — Services / Ressources / Articles
   ════════════════════════════════════════════════════════════════ */

footer { color: #cbd5e0; }
footer h4, footer h5 { color: #fff; font-weight: 700; }
footer ul li, footer ul li a, footer .link, footer a {
  color: #cbd5e0;
  text-decoration: none;
}
footer ul li a:hover, footer a:hover {
  color: #fff;
  text-decoration: underline;
}

/* Footer marketplace specific (Services, Ressources, Articles récents) */
.footer-section h4, .footer-col h4, .footer-section-title {
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 12px;
}

.footer-section ul li, .footer-col ul li,
.footer-section a, .footer-col a {
  color: #cbd5e0;
  font-size: 13px;
  line-height: 1.8;
}

/* ════════════════════════════════════════════════════════════════
   D. KPI VALUES global (chiffres "8 / 4 / 79 / 100%" image 1 Weval)
   ════════════════════════════════════════════════════════════════ */

.eco-stat-num, .hero-stat-num, .stat-value, .kpi-num,
[class*="stat-num"], [class*="kpi-value"] {
  color: #fff;
  font-weight: 800;
}

.eco-stat-label, .hero-stat-label, .stat-label, .kpi-label,
[class*="stat-label"], [class*="kpi-label"] {
  color: #cbd5e0;
}

/* ════════════════════════════════════════════════════════════════
   E. HEADINGS GENERIC (h1-h6) sur dark theme - safety net
   ════════════════════════════════════════════════════════════════ */

/* D520 — Headings safety net REMOVED (was too broad, broke light pages)
   Use explicit page theme detection via D518/D519 instead */

/* ════════════════════════════════════════════════════════════════
   F. SUB-MODULES BADGES (cnt count)
   ════════════════════════════════════════════════════════════════ */

.cnt, span.cnt, .sub-count, .badge-count {
  background: rgba(99,102,241,0.20);
  color: #c4b5fd;
  border: 1px solid rgba(99,102,241,0.35);
  padding: 4px 10px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 600;
}

/* Light theme badges */
body.theme-light .cnt, body.theme-light span.cnt {
  background: rgba(99,102,241,0.10);
  color: #4338ca;
  border-color: rgba(99,102,241,0.4);
}

/* ════════════════════════════════════════════════════════════════
   G. THEME-LIGHT SAFETY (override forced dark on light)
   ════════════════════════════════════════════════════════════════ */

body.theme-light, html[data-theme="light"] body, html.theme-light body {
  background: #FAF7F2;
  color: #1a1a1a;
}

/* Light theme: les éléments cités plus haut → forcer foncé */
body.theme-light .module-head .name,
body.theme-light .submod-name,
body.theme-light .section-title,
body.theme-light .cat-btn,
body.theme-light footer h4,
body.theme-light .footer-section h4,
body.theme-light .eco-stat-num,
body.theme-light .stat-value,
body.theme-light header h1 {
  color: #1a1a1a;
}

body.theme-light .module-head .sub,
body.theme-light .section-title .suffix,
body.theme-light footer ul li a,
body.theme-light footer a,
body.theme-light .eco-stat-label,
body.theme-light .stat-label,
body.theme-light header .sub {
  color: #4b5563;
}

body.theme-light .cat-btn {
  background: rgba(99,102,241,0.06);
  border-color: rgba(99,102,241,0.4);
}

body.theme-light .cat-btn.active {
  color: #fff;
  background: linear-gradient(135deg, #6366f1, #a855f7);
}

/* ════════════════════════════════════════════════════════════════
   H. Mobile responsive
   ════════════════════════════════════════════════════════════════ */

@media (max-width: 768px) {
  .module-head .name { font-size: 16px; }
  .section-title { font-size: 14px; }
  .cat-btn { font-size: 11px; padding: 6px 10px; }
}


/* ════════════════════════════════════════════════════════════════
   D518 — Day/Night theme UNIFIED Yacine 29avr20h35
   Coverage exhaustive auto-détection theme
   ════════════════════════════════════════════════════════════════ */

/* === DETECT THEME via multiple selectors === */

/* DARK THEME (page native dark OR body explicit) */
body[data-theme="dark"],
body.dark-theme,
body.theme-night,
body.theme-dark,
html[data-theme="dark"] body,
html.theme-night body,
html.dark-theme body,
/* OR page avec bg sombre détecté */
body[style*="radial-gradient"][style*="#05060a"],
body[style*="radial-gradient"][style*="#0b0d15"] {
  /* Texte clair forcé */
  color: #e2e8f0;
}

body[data-theme="dark"] .module-head .name,
body.dark-theme .module-head .name,
body.theme-night .module-head .name,
body[style*="radial-gradient"][style*="#05060a"] .module-head .name,
body[style*="radial-gradient"][style*="#0b0d15"] .module-head .name {
  color: #e2e8f0 !important;
}

body[data-theme="dark"] .section-title,
body.dark-theme .section-title,
body.theme-night .section-title,
body[style*="radial-gradient"][style*="#05060a"] .section-title,
body[style*="radial-gradient"][style*="#0b0d15"] .section-title {
  color: #e2e8f0 !important;
}

/* === LIGHT THEME (cream forcé par master OR explicit) === */

body.theme-day,
body.theme-light,
html[data-theme="light"] body,
html.theme-light body,
/* OR page avec bg cream forcé par master-theme */
body:not([data-theme="dark"]):not(.dark-theme):not(.theme-night) {
  /* (par défaut, pas de override - laisse la page) */
}

/* === Pages avec body bg=cream FORCÉ via master-theme + texte interne dark theme === */
/* Détection: body bg=#FAF8F5 (cream master) + module-head qui définit son fond sombre interne */

/* Module sections qui ont leur OWN dark bg → texte clair */
.module-sec[style*="background"] .name,
.module-head[style*="rgba(11"] .name,
.module-head[style*="bg-1"] .name {
  color: #e2e8f0 !important;
}

/* Sections cards avec fond sombre propre */
.dark-card .module-name,
.dark-card .submod-name,
[class*="dark"] .module-head .name {
  color: #e2e8f0 !important;
}

/* === Footer marketplace (Image 2 Yacine) === */
/* Footer toujours dark visuellement → titres + liens */

footer h4, footer h5, .footer-section h4, .footer-col h4 {
  color: #fff !important;
  font-weight: 700;
}

footer ul li, footer ul li a, footer .link, footer a,
.footer-section a, .footer-col a, .footer-link {
  color: #cbd5e0 !important;
  text-decoration: none;
}

footer ul li a:hover, footer a:hover, .footer-link:hover {
  color: #fff !important;
  text-decoration: underline;
}

/* === Marketplace page (image 2) — Services, Ressources, Articles === */
/* Ces sections ont fond sombre + titres en gris foncé invisibles */

[class*="footer"] .footer-title,
[class*="footer"] [class*="title"] {
  color: #fff !important;
}

[class*="footer"] [class*="link"],
[class*="footer"] li a {
  color: #cbd5e0 !important;
}


/* ════════════════════════════════════════════════════════════════
   D521 — Fix éléments restants détectés cascade tracing Playwright
   29avr 21h00 - chirurgical par class réelle uniquement
   ════════════════════════════════════════════════════════════════ */

/* === A. demo-agents.html (page LIGHT/cream) - éléments white sur cream === */

/* d490-stats-title : violet pâle sur cream → violet sombre lisible */
body:not([data-theme="dark"]):not(.theme-night):not(.dark-theme) .d490-stats-title {
  color: #3730a3 !important;
}

/* d453-title + d453-subtitle : forced white sur cream → dark */
body:not([data-theme="dark"]):not(.theme-night):not(.dark-theme) .d453-title {
  color: #1B1B1B !important;
}
body:not([data-theme="dark"]):not(.theme-night):not(.dark-theme) .d453-subtitle {
  color: #555555 !important;
}

/* === B. ai-benchmark.html leaderboard (page DARK) === */

/* lb-name visibilité forcée sur dark */
body[data-theme="dark"] .lb-name,
body.theme-night .lb-name,
body[style*="rgb(9, 9, 11)"] .lb-name,
body[style*="#09090b"] .lb-name,
/* Detection page ai-benchmark via body bg */
.lb-name {
  color: #f1f5f9 !important;  /* high contrast on dark bg */
}

/* lb-rank, lb-desc, lb-usage, lb-usecase : élargir contraste */
.lb-rank { color: #cbd5e0 !important; }
.lb-desc { color: #94a3b8 !important; }
.lb-usage { color: #94a3b8 !important; }
.lb-usecase { color: #cbd5e0 !important; opacity: 1 !important; }

/* === C. FAQ items chez demo-agents (titres question) === */
/* details > summary OR .faq-q OR similar - garde dark sur cream */
body:not([data-theme="dark"]):not(.theme-night) details summary,
body:not([data-theme="dark"]):not(.theme-night) .faq-q,
body:not([data-theme="dark"]):not(.theme-night) .faq-question,
body:not([data-theme="dark"]):not(.theme-night) .d491-faq-q {
  color: #1B1B1B !important;
}