/**
 * TrainingsPage - Background & Layer Styles
 *
 * This file manages the complete visual layering system for TrainingsPage:
 * - z-index 0: Purple glows, dark theme only (BackgroundManager.js -> utils/ui/background-glows.js)
 * - z-index 10: Page content (sections, cards with backdrop-filter)
 */

/* ==========================================================================
   Page Background Base
   ========================================================================== */

body.trainings-page {
  background: rgba(9, 5, 24, 1) !important;
  min-height: 100%;
  margin: 0;
  padding: 0;
}

/* Light theme: plain white page, the purple glows (BackgroundManager.js) are dark-only */
body.trainings-page.trainings-theme-light {
  background: #ffffff !important;
  color: #111827;
}

body.trainings-page.trainings-theme-light .purple-glow-training {
  display: none;
}

body.trainings-page.trainings-theme-light #app,
body.trainings-page.trainings-theme-light #main-content {
  background: transparent !important;
}

body.trainings-page.trainings-theme-light .trainings-formation-title,
body.trainings-page.trainings-theme-light .trainings-vendre-avantage-title,
body.trainings-page.trainings-theme-light .service-section__title,
body.trainings-page.trainings-theme-light .trainings-confiance-title,
body.trainings-page.trainings-theme-light .nos-solution-card__copy strong {
  color: #111827 !important;
}

body.trainings-page.trainings-theme-light .service-section__intro,
body.trainings-page.trainings-theme-light .trainings-formation-card p,
body.trainings-page.trainings-theme-light .trainings-confiance-label,
body.trainings-page.trainings-theme-light .nos-solutions-section__eyebrow,
body.trainings-page.trainings-theme-light .nos-solution-card__copy span {
  color: #475569 !important;
}

body.trainings-page.trainings-theme-light .trainings-vendre-avantage-shell,
body.trainings-page.trainings-theme-light .trainings-vendre-avantage-card h3,
body.trainings-page.trainings-theme-light .trainings-formation-card h3 {
  color: #111827 !important;
}

body.trainings-page.trainings-theme-light .trainings-vendre-avantage-card,
body.trainings-page.trainings-theme-light .trainings-formation-card,
body.trainings-page.trainings-theme-light .service-financing,
body.trainings-page.trainings-theme-light .nos-solution-card,
body.trainings-page.trainings-theme-light .trainings-confiance-stat {
  border-color: rgba(124, 58, 237, 0.16) !important;
  background: rgba(255, 255, 255, 0.78) !important;
  color: #111827 !important;
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.08) !important;
}

body.trainings-page.trainings-theme-light .trainings-confiance-shell {
  border-color: rgba(124, 58, 237, 0.16) !important;
  background:
    radial-gradient(circle at 18% 50%, rgba(124, 58, 237, 0.1), transparent 24%),
    linear-gradient(90deg, rgba(255, 255, 255, 0.92) 0%, rgba(244, 247, 255, 0.94) 100%) !important;
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.08) !important;
}

body.trainings-page.trainings-theme-light .trainings-confiance-title {
  text-shadow: none !important;
}

body.trainings-page.trainings-theme-light .trainings-confiance-value {
  color: #312e81 !important;
}

body.trainings-page.trainings-theme-light .trainings-confiance-logo-line {
  stroke: #312e81 !important;
}

body.trainings-page.trainings-theme-light .trainings-vendre-avantage-icon,
body.trainings-page.trainings-theme-light .trainings-formation-icon {
  background: rgba(124, 58, 237, 0.1) !important;
}

body.trainings-page.trainings-theme-light .nos-solutions-section__blog-link {
  background: rgba(124, 58, 237, 0.08) !important;
  color: #312e81 !important;
}

body.trainings-page.trainings-theme-light .service-financing__content h3,
body.trainings-page.trainings-theme-light .service-financing__content p,
body.trainings-page.trainings-theme-light .service-financing__badges > span {
  color: #334155 !important;
}

body.trainings-page.trainings-theme-light .service-financing__badges > span {
  border-color: rgba(59, 130, 246, 0.2) !important;
  background: rgba(59, 130, 246, 0.09) !important;
}

body.trainings-page.trainings-theme-light #team-section h2.text-white,
body.trainings-page.trainings-theme-light #team-section h3.text-white,
body.trainings-page.trainings-theme-light #team-section .team-member h3,
body.trainings-page.trainings-theme-light #team-section .team-member p {
  color: #111827 !important;
}

body.trainings-page.trainings-theme-light #team-section p.text-gray-300,
body.trainings-page.trainings-theme-light #team-section .team-member p.text-white\/60,
body.trainings-page.trainings-theme-light #team-section .team-member p .text-white\/60 {
  color: #475569 !important;
}

body.trainings-page.trainings-theme-light #team-section .team-member p.text-white\/40,
body.trainings-page.trainings-theme-light #team-section p.italic.text-white\/60 {
  color: #64748b !important;
}

body.trainings-page.trainings-theme-light #team-section .bg-white\/30,
body.trainings-page.trainings-theme-light #team-section .bg-white\/20,
body.trainings-page.trainings-theme-light #team-section .bg-white\/10,
body.trainings-page.trainings-theme-light #team-section .border-white\/20,
body.trainings-page.trainings-theme-light #team-section .border-white\/40 {
  border-color: rgba(49, 46, 129, 0.18) !important;
}

body.trainings-page.trainings-theme-light #team-section .vision-separator {
  background: linear-gradient(
    to right,
    transparent,
    rgba(49, 46, 129, 0.38),
    transparent
  ) !important;
}

body.trainings-page.trainings-theme-light .trainings-cta-content {
  background:
    radial-gradient(circle at 78% 10%, rgba(124, 58, 237, 0.16), transparent 38%),
    linear-gradient(
      100deg,
      rgba(255, 255, 255, 0.9),
      rgba(245, 247, 255, 0.94) 54%,
      rgba(252, 245, 255, 0.92)
    ) !important;
  border-color: rgba(124, 58, 237, 0.18) !important;
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.08) !important;
}

body.trainings-page.trainings-theme-light .trainings-cta-title {
  color: #111827 !important;
}

body.trainings-page.trainings-theme-light .trainings-cta-description {
  color: #475569 !important;
}

body.trainings-page.trainings-theme-light .trainings-cta-button--secondary {
  color: #312e81 !important;
  background: rgba(255, 255, 255, 0.72) !important;
  border-color: rgba(49, 46, 129, 0.24) !important;
}

body.trainings-page.trainings-theme-light .trainings-commentaire-title {
  color: #111827 !important;
}

body.trainings-page.trainings-theme-light .trainings-commentaire-card {
  border-color: rgba(124, 58, 237, 0.14) !important;
  background: rgba(255, 255, 255, 0.82) !important;
  box-shadow:
    0 16px 38px rgba(15, 23, 42, 0.08),
    0 1px 0 rgba(15, 23, 42, 0.04) !important;
}

body.trainings-page.trainings-theme-light .trainings-commentaire-text {
  color: #374151 !important;
}

body.trainings-page.trainings-theme-light .trainings-commentaire-meta strong {
  color: #111827 !important;
}

body.trainings-page.trainings-theme-light .trainings-commentaire-meta span {
  color: #6b7280 !important;
}

body.trainings-page.trainings-theme-light .trainings-commentaire-avatar {
  border-color: #ffffff !important;
}

/* ==========================================================================
   Page Isolation
   Ensure TrainingsPage styles don't affect other pages
   ========================================================================== */

body:not(.trainings-page) .purple-glow-training {
  display: none !important;
}

/* ==========================================================================
   Content Layering
   Ensures content is above background layers for proper stacking context.
   Required for backdrop-filter effects on cards to work correctly.
   ========================================================================== */

body.trainings-page #app,
body.trainings-page #main-content {
  position: relative;
}

body.trainings-page #main-content > *:not(#header-container) {
  position: relative;
  z-index: 10;
}

/* Section content should also be above background */
body.trainings-page #hero-container,
body.trainings-page #vendre-avantage-section-container,
body.trainings-page #formation-section-container,
body.trainings-page #confiance-section-container,
body.trainings-page #commentaire-section-container,
body.trainings-page #service-section-container,
body.trainings-page #nos-solutions-section-container,
body.trainings-page #team-section-container,
body.trainings-page #cta-section-container {
  position: relative;
  z-index: 10;
}