/* ============================================================
   ADELINE FAUCHARD — Système de Thèmes
   Dark Mode (défaut) + Light Mode (blanc/crème/or)
   ============================================================ */

/* ─── BOUTON DE BASCULE DE THÈME ───────────────────────────── */
.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: 50%;
  color: rgba(255,255,255,0.7);
  background: transparent;
  transition:
    color var(--dur-mid) var(--ease-out),
    border-color var(--dur-mid) var(--ease-out),
    transform var(--dur-fast) var(--ease-spring),
    background var(--dur-mid) var(--ease-out);
  flex-shrink: 0;
  cursor: pointer;
}

@media (hover: none) { .theme-toggle { cursor: pointer; } }

.theme-toggle:hover {
  color: var(--gold);
  border-color: var(--gold);
  background: var(--gold-subtle);
  transform: scale(1.1) rotate(12deg);
}

.theme-toggle .icon-sun,
.theme-toggle .icon-moon {
  font-size: 0.875rem;
  line-height: 1;
}

/* Dark theme (défaut) : affiche soleil pour basculer en clair */
.theme-toggle .icon-sun  { display: block; }
.theme-toggle .icon-moon { display: none;  }

/* ─── BANDEAU MAINTENANCE ADMIN ─────────────────────────────── */
.maintenance-admin-bar {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  background: var(--gold);
  color: var(--black);
  text-align: center;
  padding: 0.6rem 1rem;
  font-family: var(--sans);
  font-size: 0.7rem;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  z-index: 9990;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
}

/* ─── LIGHT THEME ───────────────────────────────────────────── */
[data-theme="light"] {
  /* Fonds clairs — blanc chaud, crème, lin */
  --black:        #faf9f6;
  --dark:         #f4f1eb;
  --dark-2:       #ede8de;
  --dark-3:       #e6e0d4;
  --mid:          #ccc5b8;
  --border:       #ddd7ca;
  --border-light: rgba(0, 0, 0, 0.06);

  /* Or plus intense pour contraste sur fond clair */
  --gold:         #a87a28;
  --gold-light:   #c9a255;
  --gold-dark:    #7a5818;
  --gold-subtle:  rgba(168, 122, 40, 0.10);
  --gold-glow:    rgba(168, 122, 40, 0.18);

  /* Texte sombre sur fond clair */
  --white:        #1a1612;
  --cream:        #2d2720;
  --text:         #3c3530;
  --text-muted:   #6e6760;
  --text-dim:     #9e9890;

  /* Ombres plus légères */
  --shadow-sm:   0 2px 12px rgba(0,0,0,0.07);
  --shadow-md:   0 8px 32px rgba(0,0,0,0.10);
  --shadow-lg:   0 24px 64px rgba(0,0,0,0.14);
  --shadow-gold: 0 0 30px rgba(168,122,40,0.15);
}

/* ─── BODY EN MODE CLAIR ────────────────────────────────────── */
[data-theme="light"] body {
  background-color: var(--black); /* crème #faf9f6 = même que header scrollé → pas de décalage */
  color: var(--text);
}

/* ─── SCROLLBAR EN MODE CLAIR ───────────────────────────────── */
[data-theme="light"] ::-webkit-scrollbar-track {
  background: var(--dark);
}
[data-theme="light"] ::-webkit-scrollbar-thumb {
  background: var(--gold-dark);
}

/* ─── SÉLECTION TEXTE ───────────────────────────────────────── */
[data-theme="light"] ::selection {
  background: var(--gold);
  color: var(--black);
}

/* ─── CURSEUR EN MODE CLAIR ─────────────────────────────────── */
[data-theme="light"] .cursor__dot {
  background: #1a1612;
  mix-blend-mode: normal;
}
[data-theme="light"] .cursor__ring {
  border-color: rgba(26, 22, 18, 0.3);
  mix-blend-mode: normal;
}
/* Curseur blanc quand il passe sur le header (tous thèmes) */
.cursor--on-header .cursor__dot {
  background: #ffffff !important;
}
.cursor--on-header .cursor__ring {
  border-color: rgba(255, 255, 255, 0.5) !important;
}

/* ─── LOADER EN MODE CLAIR ──────────────────────────────────── */
[data-theme="light"] .loader {
  background: var(--black);
  /* Pas de transition sur le loader : couleur fixée inline côté PHP */
  transition: opacity 0.6s var(--ease-out), visibility 0.6s var(--ease-out);
}
[data-theme="light"] .loader__bar {
  background: var(--border);
}

/* ─── TOPBAR + HEADER + HERO : TOUJOURS DARK EN MODE CLAIR ──── */
/* Le haut de page garde l'esthétique sombre quel que soit le thème */

[data-theme="light"] .topbar {
  background: #090909 !important;
  border-bottom-color: #2a2a2a !important;
}
[data-theme="light"] .topbar__social a {
  color: rgba(255, 255, 255, 0.5) !important;
}
[data-theme="light"] .topbar__social a:hover {
  color: #c9a255 !important;
}
[data-theme="light"] .topbar__client-btn {
  color: #c9a255 !important;
  border-color: rgba(201, 162, 85, 0.4) !important;
}
[data-theme="light"] .topbar__client-btn:hover {
  color: #dbbf7e !important;
  border-color: #c9a255 !important;
  background: rgba(201, 162, 85, 0.08) !important;
}

[data-theme="light"] .header {
  background: rgba(255, 245, 241, 0.96) !important;
  backdrop-filter: blur(24px) saturate(130%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(130%) !important;
  border-bottom-color: rgba(62, 47, 41, 0.08) !important;
}
[data-theme="light"] body.page-home .header:not(.scrolled) {
  background: transparent !important;
  border-bottom-color: transparent !important;
}
[data-theme="light"] .header.scrolled {
  background: rgba(255, 245, 241, 0.96) !important;
  backdrop-filter: blur(24px) saturate(130%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(130%) !important;
  border-bottom-color: rgba(62, 47, 41, 0.08) !important;
}

[data-theme="light"] .header .nav__item a {
  color: rgba(62, 47, 41, 0.6) !important;
}
[data-theme="light"] .header .nav__item a:hover,
[data-theme="light"] .header .nav__item a.active {
  color: #3E2F29 !important;
}

[data-theme="light"] .hamburger span {
  background: #3E2F29;
}

[data-theme="light"] .header .logo__name {
  color: #3E2F29 !important;
}
[data-theme="light"] .header .logo__name-accent {
  color: #c9a255 !important;
}
[data-theme="light"] .header .logo__tagline {
  color: rgba(62, 47, 41, 0.4) !important;
}

[data-theme="light"] .header .btn--ghost {
  color: #3E2F29 !important;
  border-color: rgba(62, 47, 41, 0.2) !important;
  background: transparent !important;
}
[data-theme="light"] .header .btn--ghost:hover {
  color: #ffffff !important;
  background: #c9a255 !important;
  border-color: #c9a255 !important;
  box-shadow: 0 4px 16px rgba(201,162,85,.25);
}

[data-theme="light"] .theme-toggle {
  border-color: rgba(62, 47, 41, 0.2) !important;
  color: rgba(62, 47, 41, 0.5) !important;
}
[data-theme="light"] .theme-toggle:hover {
  color: #c9a255 !important;
  border-color: #c9a255 !important;
}

/* ─── HEADER TRANSPARENT (homepage, pas scrollé) → style dark ── */
[data-theme="light"] body.page-home .header:not(.scrolled) .nav__item a {
  color: rgba(255, 255, 255, 0.75) !important;
}
[data-theme="light"] body.page-home .header:not(.scrolled) .nav__item a:hover,
[data-theme="light"] body.page-home .header:not(.scrolled) .nav__item a.active {
  color: #ffffff !important;
}
[data-theme="light"] body.page-home .header:not(.scrolled) .hamburger span {
  background: #ffffff !important;
}
[data-theme="light"] body.page-home .header:not(.scrolled) .logo__name {
  color: #ffffff !important;
}
[data-theme="light"] body.page-home .header:not(.scrolled) .logo__name-accent {
  color: #c9a255 !important;
}
[data-theme="light"] body.page-home .header:not(.scrolled) .logo__tagline {
  color: rgba(255, 255, 255, 0.5) !important;
}
[data-theme="light"] body.page-home .header:not(.scrolled) .btn--ghost {
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
  background: transparent !important;
}
[data-theme="light"] body.page-home .header:not(.scrolled) .btn--ghost:hover {
  color: #ffffff !important;
  background: #c9a255 !important;
  border-color: #c9a255 !important;
}
[data-theme="light"] body.page-home .header:not(.scrolled) .theme-toggle {
  border-color: rgba(255, 255, 255, 0.3) !important;
  color: rgba(255, 255, 255, 0.7) !important;
}
[data-theme="light"] body.page-home .header:not(.scrolled) .theme-toggle:hover {
  color: #c9a255 !important;
  border-color: #c9a255 !important;
}

/* En mode clair : affiche lune pour revenir en sombre */
[data-theme="light"] .theme-toggle .icon-sun  { display: none;  }
[data-theme="light"] .theme-toggle .icon-moon { display: block; }

/* ─── PAGE-HERO : TOUJOURS DARK ────────────────────────────── */
[data-theme="light"] .page-hero {
  background: #111111 !important;
  border-bottom-color: #2a2a2a !important;
}
[data-theme="light"] .page-hero .section-tag {
  color: #c9a255;
}
[data-theme="light"] .page-hero .section-tag::before,
[data-theme="light"] .page-hero .section-tag::after {
  background: #c9a255;
}
[data-theme="light"] .page-hero .t-headline {
  color: #ddd9d0;
}
[data-theme="light"] .page-hero__breadcrumb,
[data-theme="light"] .page-hero__breadcrumb a {
  color: #888480;
}
[data-theme="light"] .page-hero__breadcrumb a:hover {
  color: #c9a255;
}

/* ─── MENU MOBILE EN MODE CLAIR ─────────────────────────────── */
[data-theme="light"] .nav-mobile {
  background: rgba(255, 245, 241, 0.98);
  border-left: 1px solid rgba(62, 47, 41, 0.08);
}
[data-theme="light"] .nav-mobile .nav__item a {
  color: rgba(62, 47, 41, 0.7);
}
[data-theme="light"] .nav-mobile .nav__item a:hover {
  color: #c9a255;
}

/* ─── HERO EN MODE CLAIR — couleurs dark forcées ───────────── */
[data-theme="light"] .hero__overlay {
  background:
    linear-gradient(to bottom, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0.10) 25%, transparent 50%),
    linear-gradient(to top,    rgba(0,0,0,0.88) 0%, rgba(0,0,0,0.38) 45%, transparent 70%),
    linear-gradient(to right,  rgba(0,0,0,0.25) 0%, transparent 55%);
}
[data-theme="light"] .hero__eyebrow {
  color: #c9a255;
}
[data-theme="light"] .hero__sub {
  color: rgba(255,255,255,0.75);
}
[data-theme="light"] .hero__scroll-text {
  color: #888480;
}
[data-theme="light"] .hero__scroll-line {
  background: linear-gradient(to bottom, #c9a255, transparent);
}

/* ─── SECTION ABOUT ─────────────────────────────────────────── */
[data-theme="light"] .about {
  background: var(--dark);
}
[data-theme="light"] .about__stat {
  border-color: var(--border);
  background: var(--black);
}
[data-theme="light"] .about__stat:hover {
  border-color: var(--gold-dark);
}
[data-theme="light"] .about__image-decor {
  border-color: var(--mid);
}

/* ─── SECTION SERVICES ──────────────────────────────────────── */
[data-theme="light"] .services {
  background: var(--black);
}
[data-theme="light"] .services__grid {
  background: var(--border);
  border-color: var(--border);
}
[data-theme="light"] .service-card {
  background: var(--black);
}
[data-theme="light"] .service-card:hover {
  background: var(--dark);
}
[data-theme="light"] .service-card__title {
  color: var(--cream);
}
[data-theme="light"] .service-card__desc {
  color: var(--text-muted);
}

/* ─── SECTION PORTFOLIO ─────────────────────────────────────── */
[data-theme="light"] .portfolio {
  background: var(--dark);
}
[data-theme="light"] .filter-btn {
  color: var(--text-muted);
}
[data-theme="light"] .filter-btn:hover,
[data-theme="light"] .filter-btn.active {
  color: var(--cream);
}
[data-theme="light"] .filter-btn.active {
  background: var(--gold-subtle);
}

/* ─── SECTION STATS ─────────────────────────────────────────── */
[data-theme="light"] .stats {
  background: var(--dark-2);
  border-color: var(--border);
}
[data-theme="light"] .stat-item {
  border-color: var(--border);
}
[data-theme="light"] .stat-item__num {
  color: var(--cream);
}

/* ─── SECTION TESTIMONIALS ──────────────────────────────────── */
[data-theme="light"] .testimonials {
  background: var(--black);
}
[data-theme="light"] .testimonial-card {
  border-color: var(--border);
  background: var(--dark);
}
[data-theme="light"] .testimonial-card__text {
  color: var(--text);
}
[data-theme="light"] .testimonial-card__author {
  color: var(--text-muted);
}
[data-theme="light"] .slider-btn {
  border-color: var(--border);
  color: var(--text-muted);
}
[data-theme="light"] .slider-btn:hover {
  border-color: var(--gold);
  color: var(--gold);
}
[data-theme="light"] .slider-dot {
  background: var(--mid);
}
[data-theme="light"] .slider-dot.active {
  background: var(--gold);
}

/* ─── SECTION CTA ───────────────────────────────────────────── */
[data-theme="light"] .cta-section {
  background: var(--dark-2);
}

/* ─── SECTION CONTACT ───────────────────────────────────────── */
[data-theme="light"] .contact {
  background: var(--dark);
}
[data-theme="light"] .contact__info-item {
  border-bottom-color: var(--border);
}
[data-theme="light"] .contact__info-label {
  color: var(--text-dim);
}
[data-theme="light"] .contact__info-value {
  color: var(--text);
}

/* ─── FORMULAIRES ───────────────────────────────────────────── */
[data-theme="light"] .form-control {
  background: var(--black);
  border-color: var(--border);
  color: var(--text);
}
[data-theme="light"] .form-control:focus {
  border-color: var(--gold);
  background: var(--black);
}
[data-theme="light"] .form-control::placeholder {
  color: var(--text-dim);
}
[data-theme="light"] .form-label {
  color: var(--text);
}

/* ─── BOUTONS EN MODE CLAIR ─────────────────────────────────── */
[data-theme="light"] .btn--primary {
  color: #ffffff;
}
[data-theme="light"] .btn--outline {
  color: var(--text);
  border-color: var(--text-dim);
}
[data-theme="light"] .btn--ghost {
  color: var(--gold);
}

/* Hero / page-hero : boutons sur fond sombre → couleurs claires forcées */
[data-theme="light"] .hero .btn--outline {
  color: rgba(255, 255, 255, 0.85);
  border-color: rgba(255, 255, 255, 0.4);
}
[data-theme="light"] .hero .btn--outline:hover {
  color: #ffffff;
  border-color: #ffffff;
  background: rgba(255, 255, 255, 0.1);
}

/* Hover général */
[data-theme="light"] .btn--primary:hover,
[data-theme="light"] .btn--outline:hover,
[data-theme="light"] .btn--ghost:hover {
  color: #ffffff;
  border-color: var(--gold);
}

[data-theme="light"] .btn-icon {
  border-color: var(--border);
  color: var(--text-muted);
}
[data-theme="light"] .btn-icon:hover {
  border-color: var(--gold);
  color: var(--gold);
}

/* ─── FOOTER EN MODE CLAIR ──────────────────────────────────── */
[data-theme="light"] .footer {
  background: var(--dark-3);
}
[data-theme="light"] .footer__wave {
  background: linear-gradient(
    to right,
    transparent 0%,
    rgba(168, 122, 40, 0.25) 30%,
    rgba(168, 122, 40, 0.45) 50%,
    rgba(168, 122, 40, 0.25) 70%,
    transparent 100%
  );
}
[data-theme="light"] .footer__tagline {
  color: var(--text-muted);
}
[data-theme="light"] .footer__col-title {
  color: var(--gold-dark);
}
[data-theme="light"] .footer__links a,
[data-theme="light"] .footer__contact-list li,
[data-theme="light"] .footer__contact-list a {
  color: var(--text-muted);
}
[data-theme="light"] .footer__links a:hover,
[data-theme="light"] .footer__contact-list a:hover {
  color: var(--gold-dark);
}
[data-theme="light"] .footer__social-btn {
  border-color: var(--border);
  color: var(--text-muted);
}
[data-theme="light"] .footer__social-btn:hover {
  border-color: var(--gold);
  color: var(--gold);
  background: rgba(168, 122, 40, 0.08);
}
[data-theme="light"] .footer__cta-btn {
  border-color: rgba(168, 122, 40, 0.4);
  color: var(--gold-dark);
}
[data-theme="light"] .footer__cta-btn:hover {
  background: rgba(168, 122, 40, 0.08);
  border-color: var(--gold);
}
[data-theme="light"] .footer__grid {
  border-bottom-color: var(--border);
}
[data-theme="light"] .footer__copyright,
[data-theme="light"] .footer__copyright a {
  color: var(--text-dim);
}
[data-theme="light"] .footer__legal a {
  color: var(--text-dim);
}
[data-theme="light"] .footer__legal a:hover {
  color: var(--gold-dark);
}

/* ─── TARIFS ────────────────────────────────────────────────── */
[data-theme="light"] .pricing-card {
  background: var(--black);
  border-color: var(--border);
}
[data-theme="light"] .pricing-card.featured {
  border-color: var(--gold);
  background: var(--dark);
}
[data-theme="light"] .pricing-card__price {
  color: var(--cream);
}
[data-theme="light"] .pricing-divider {
  border-color: var(--border);
}

/* ─── SECTION GENERALE ──────────────────────────────────────── */
[data-theme="light"] .section-tag {
  color: var(--gold);
}
[data-theme="light"] .section-tag::before,
[data-theme="light"] .section-tag::after {
  background: var(--gold);
}

/* ─── HERO — textes toujours blancs (fond toujours sombre) ──── */
[data-theme="light"] .hero__title,
[data-theme="light"] .hero__title-line,
[data-theme="light"] .hero__title-inner {
  color: #ffffff !important;
}
[data-theme="light"] .hero__eyebrow {
  color: #c9a255;
}
[data-theme="light"] .hero__sub {
  color: rgba(255, 255, 255, 0.75);
}

/* ─── LIGHTBOX — toujours sombre pour les deux thèmes ───────── */
/* Pas d'override : lightbox reste noir pour valoriser les photos */

/* ─── BACK TO TOP EN MODE CLAIR ─────────────────────────────── */
[data-theme="light"] .back-to-top {
  background: rgba(250, 249, 246, 0.90);
  border-color: rgba(168, 122, 40, 0.40);
  color: var(--gold);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.10);
}
[data-theme="light"] .back-to-top:hover {
  background: rgba(168, 122, 40, 0.10);
  border-color: var(--gold);
  box-shadow: 0 4px 24px rgba(168, 122, 40, 0.22);
}

/* ─── TRANSITIONS GLOBALES ──────────────────────────────────── */
html {
  transition:
    background-color 300ms ease,
    color 300ms ease;
}
body,
.header,
.about,
.services,
.portfolio,
.stats,
.testimonials,
.cta-section,
.contact,
.footer,
.service-card,
.testimonial-card,
.pricing-card,
.form-control,
.nav-mobile {
  transition:
    background-color 300ms ease,
    color 300ms ease,
    border-color 300ms ease;
}

/* Temporary white-first visual direction */
[data-theme="light"] {
  --black: #ffffff;
  --dark: #ffffff;
  --dark-2: #ffffff;
  --dark-3: #ffffff;
  --border: #ece7df;
}

[data-theme="light"] .page-hero,
[data-theme="light"] .contact-section,
[data-theme="light"] .cta-section,
[data-theme="light"] .footer,
[data-theme="light"] .section-pad,
[data-theme="light"] section {
  background-color: #ffffff !important;
}

[data-theme="light"] .page-hero .t-headline,
[data-theme="light"] .page-hero .t-body,
[data-theme="light"] .page-hero__breadcrumb,
[data-theme="light"] .page-hero__breadcrumb a {
  color: var(--text) !important;
}

[data-theme="light"] .page-hero {
  border-bottom-color: var(--border) !important;
}

[data-theme="light"] body.page-home .header:not(.scrolled) {
  background: rgba(255,255,255,.92) !important;
  border-bottom-color: rgba(62,47,41,.08) !important;
}

[data-theme="light"] body.page-home .header:not(.scrolled) .nav__item a,
[data-theme="light"] body.page-home .header:not(.scrolled) .logo__name,
[data-theme="light"] body.page-home .header:not(.scrolled) .hamburger span {
  color: #3E2F29 !important;
}
