/* ══════════════════════════════════════════
   MODAL NOUVELLE FORMATION — Bois Légendaire
   v2 — Mar 2026
   ══════════════════════════════════════════ */

[data-theme=wood-legendary] .ft-overlay {
  background: rgba(0,0,0,0.78) !important;
  backdrop-filter: blur(7px) !important;
  -webkit-backdrop-filter: blur(7px) !important;
}

/* ── Modal panel — bois medium ── */
[data-theme=wood-legendary] .ft-modal {
  background-color: rgba(74,52,20,0.97) !important;
  background-image: var(--wood-medium) !important;
  background-size: cover !important;
  background-position: center !important;
  background-blend-mode: normal !important;
  border: 1px solid rgba(185,135,60,0.50) !important;
  border-radius: 20px !important;
  box-shadow:
    0 28px 72px rgba(0,0,0,0.80),
    inset 0 1px 0 rgba(255,215,130,0.22),
    inset 0 -2px 0 rgba(0,0,0,0.28) !important;
}

/* ── Header — bois foncé + ombre vers le bas ── */
[data-theme=wood-legendary] .ft-modal-header {
  background-color: rgba(25,16,6,0.62) !important;
  background-image: var(--wood-dark) !important;
  background-size: cover !important;
  background-position: center top !important;
  background-blend-mode: normal !important;
  border-bottom: 1px solid rgba(100,60,15,0.55) !important;
  border-radius: 20px 20px 0 0 !important;
  padding: 20px 24px !important;
  box-shadow: 0 6px 18px rgba(0,0,0,0.55), 0 2px 6px rgba(0,0,0,0.35) !important;
  position: relative !important;
  z-index: 2 !important;
}

[data-theme=wood-legendary] .ft-modal-title {
  color: #F2E8D8 !important;
  text-shadow: 0 1px 4px rgba(0,0,0,0.65) !important;
  font-weight: 700 !important;
  font-size: 1.1rem !important;
}

[data-theme=wood-legendary] .ft-modal-close {
  background: rgba(180,130,55,0.16) !important;
  border: 1px solid rgba(180,130,55,0.32) !important;
  color: #DCC8A8 !important;
  border-radius: 8px !important;
}
[data-theme=wood-legendary] .ft-modal-close:hover {
  background: rgba(200,55,35,0.28) !important;
  border-color: rgba(210,80,60,0.45) !important;
  color: #FFAA88 !important;
}

/* ── Onglets — bois très clair ── */
[data-theme=wood-legendary] .ft-tabs {
  background-color: rgba(200,165,105,0.18) !important;
  background-image: var(--wood-light) !important;
  background-size: cover !important;
  background-position: center !important;
  background-blend-mode: normal !important;
  border-bottom: 1px solid rgba(140,90,30,0.35) !important;
  box-shadow: 0 5px 16px rgba(0,0,0,0.48), 0 2px 5px rgba(0,0,0,0.28) !important;
  position: relative !important;
  z-index: 1 !important;
  padding: 0 24px !important;
}

[data-theme=wood-legendary] .ft-tab {
  color: #3A1C06 !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 8px 8px 0 0 !important;
  background: none !important;
  padding: 12px 18px !important;
  font-weight: 600 !important;
  transition: color 0.15s, background 0.15s !important;
}
[data-theme=wood-legendary] .ft-tab:hover {
  color: #2A1204 !important;
  background: rgba(120,70,15,0.12) !important;
}
[data-theme=wood-legendary] .ft-tab-active {
  color: #3A1C06 !important;
  border-bottom-color: #8B4A0E !important;
  background: rgba(100,55,10,0.10) !important;
  font-weight: 700 !important;
  text-shadow: 0 1px 0 rgba(255,220,160,0.25) !important;
}

/* ── Corps ── */
[data-theme=wood-legendary] .ft-body {
  background: transparent !important;
}

/* ── Labels — marron foncé ── */
[data-theme=wood-legendary] .ft-label {
  color: #F0E6D0 !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 3px rgba(0,0,0,0.55) !important;
}

/* ── Inputs / Textarea ── */
[data-theme=wood-legendary] .ft-input {
  background: rgba(12,6,0,0.50) !important;
  border: 1px solid rgba(212,164,76,0.28) !important;
  border-radius: 10px !important;
  color: #F5EDD8 !important;
  box-shadow: inset 0 2px 6px rgba(0,0,0,0.38) !important;
  font-size: 0.94rem !important;
}
[data-theme=wood-legendary] .ft-input:focus {
  border-color: rgba(212,164,76,0.62) !important;
  box-shadow:
    inset 0 2px 6px rgba(0,0,0,0.38),
    0 0 0 2.5px rgba(212,164,76,0.22) !important;
  outline: none !important;
}
[data-theme=wood-legendary] .ft-input::placeholder {
  color: rgba(175,135,75,0.36) !important;
}

/* ── Emoji trigger ── */
[data-theme=wood-legendary] .ft-emoji-trigger {
  background: rgba(12,6,0,0.50) !important;
  border: 1px solid rgba(212,164,76,0.28) !important;
  border-radius: 10px !important;
  transition: border-color 0.15s !important;
}
[data-theme=wood-legendary] .ft-emoji-trigger:hover {
  border-color: rgba(212,164,76,0.58) !important;
  background: rgba(20,10,0,0.55) !important;
}
[data-theme=wood-legendary] .ft-emoji-hint {
  color: rgba(175,135,75,0.50) !important;
  font-size: 0.73rem !important;
}

/* ── Emoji picker ── */
[data-theme=wood-legendary] .ft-emoji-picker {
  background-color: #1E140C !important;
  background-image: var(--wood-dark) !important;
  background-size: cover !important;
  background-position: center !important;
  border: 1px solid rgba(212,164,76,0.28) !important;
  box-shadow: 0 14px 42px rgba(0,0,0,0.68) !important;
  border-radius: 12px !important;
}
[data-theme=wood-legendary] .ft-emoji-opt:hover {
  background: rgba(212,164,76,0.20) !important;
  border-radius: 6px !important;
}

/* ── Bouton primaire ── */
[data-theme=wood-legendary] .ft-btn-primary {
  background: linear-gradient(135deg, #BF7A34 0%, #D4A44C 55%, #B86820 100%) !important;
  color: #1E140C !important;
  font-weight: 700 !important;
  border: 1px solid rgba(220,158,58,0.65) !important;
  box-shadow:
    0 3px 10px rgba(0,0,0,0.45),
    inset 0 1px 0 rgba(255,225,145,0.38) !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.22) !important;
  border-radius: 10px !important;
}
[data-theme=wood-legendary] .ft-btn-primary:hover:not(:disabled) {
  background: linear-gradient(135deg, #CC8A3C 0%, #E0B65A 55%, #C47228 100%) !important;
  transform: translateY(-1px) !important;
  box-shadow:
    0 6px 20px rgba(0,0,0,0.52),
    inset 0 1px 0 rgba(255,235,160,0.42) !important;
}

/* ── Bouton secondaire ── */
[data-theme=wood-legendary] .ft-btn-secondary {
  background: rgba(55,35,12,0.65) !important;
  color: #DCC8A8 !important;
  border: 1px solid rgba(180,130,55,0.32) !important;
  border-radius: 10px !important;
}
[data-theme=wood-legendary] .ft-btn-secondary:hover:not(:disabled) {
  background: rgba(75,50,18,0.82) !important;
  color: #F2E8D8 !important;
  border-color: rgba(212,164,76,0.48) !important;
}

/* ── Cards templates ── */
[data-theme=wood-legendary] .ft-card {
  background-color: rgba(58,38,10,0.75) !important;
  background-image: var(--wood-medium) !important;
  background-size: cover !important;
  background-position: center !important;
  background-blend-mode: normal !important;
  border: 1px solid rgba(180,130,55,0.32) !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 18px rgba(0,0,0,0.42) !important;
  cursor: pointer !important;
  transition: border-color 0.18s, box-shadow 0.18s, transform 0.18s !important;
}
[data-theme=wood-legendary] .ft-card:hover {
  border-color: rgba(212,164,76,0.58) !important;
  box-shadow:
    0 8px 30px rgba(0,0,0,0.58),
    inset 0 1px 0 rgba(255,210,120,0.14) !important;
  transform: translateY(-2px) !important;
}
[data-theme=wood-legendary] .ft-card-name {
  color: #F2E8D8 !important;
  font-weight: 600 !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.52) !important;
}
[data-theme=wood-legendary] .ft-card-desc {
  color: #F0E6D0 !important;
}
[data-theme=wood-legendary] .ft-card-meta span {
  color: rgba(240,230,208,0.82) !important;
}
[data-theme=wood-legendary] .ft-card-emoji {
  filter: drop-shadow(0 2px 5px rgba(0,0,0,0.55)) !important;
}
[data-theme=wood-legendary] .ft-badge-giri {
  background: rgba(212,164,76,0.20) !important;
  color: #D4A44C !important;
  border: 1px solid rgba(212,164,76,0.38) !important;
  border-radius: 5px !important;
}

/* ── Preview ── */
[data-theme=wood-legendary] .ft-preview {
  background-color: rgba(22,14,4,0.55) !important;
  border-top: 1px solid rgba(180,130,55,0.25) !important;
}
[data-theme=wood-legendary] .ft-preview-title { color: #F2E8D8 !important; font-weight: 600 !important; }
[data-theme=wood-legendary] .ft-preview-desc { color: rgba(200,165,105,0.72) !important; }
[data-theme=wood-legendary] .ft-preview-back { color: rgba(212,164,76,0.68) !important; background: none !important; border: none !important; }
[data-theme=wood-legendary] .ft-preview-back:hover { color: #D4A44C !important; }
[data-theme=wood-legendary] .ft-spinner { border-color: rgba(180,130,55,0.22) !important; border-top-color: #D4A44C !important; }
[data-theme=wood-legendary] .ft-preview-tag { background: rgba(212,164,76,0.18) !important; color: #D4A44C !important; border: 1px solid rgba(212,164,76,0.32) !important; border-radius: 4px !important; }
[data-theme=wood-legendary] .ft-drip-badge { background: rgba(122,158,90,0.18) !important; color: #7A9E5A !important; border: 1px solid rgba(122,158,90,0.28) !important; border-radius: 4px !important; }
[data-theme=wood-legendary] .ft-templates-loading { color: rgba(200,165,105,0.58) !important; }
[data-theme=wood-legendary] .ft-empty { color: rgba(180,138,75,0.52) !important; }

/* ── Badges catégorie — forcer crème clair ── */
[data-theme=wood-legendary] .ft-badge {
  color: #F0E6D0 !important;
  background: rgba(80,45,10,0.55) !important;
  border: 1px solid rgba(200,160,80,0.30) !important;
  font-size: 0.70rem !important;
  font-weight: 700 !important;
  border-radius: 5px !important;
  padding: 2px 7px !important;
}

/* ══════════════════════════════════════════
   GIRI TIMER — Bois Légendaire
   ══════════════════════════════════════════ */

/* Sous-titre Technique Pomodoro · Deep Work · Flow State */
[data-theme=wood-legendary] .gt-hero-sub {
  color: #F0E6D0 !important;
  text-shadow: 0 1px 3px rgba(0,0,0,0.55) !important;
  opacity: 1 !important;
}

/* Conteneur des 3 boutons de mode */
[data-theme=wood-legendary] .gt-mode-tabs {
  background-color: rgba(180,140,80,0.18) !important;
  background-image: var(--wood-light) !important;
  background-size: cover !important;
  background-position: center !important;
  background-blend-mode: normal !important;
  border-radius: 12px !important;
  padding: 4px !important;
  border: 1px solid rgba(160,110,45,0.35) !important;
  box-shadow: inset 0 1px 3px rgba(0,0,0,0.25) !important;
}

/* Les 3 boutons — bois clair par défaut */
[data-theme=wood-legendary] .gt-mode-tab {
  background-color: rgba(210,175,110,0.22) !important;
  background-image: var(--wood-light) !important;
  background-size: cover !important;
  background-position: center !important;
  background-blend-mode: normal !important;
  color: #3A1C06 !important;
  border: 1px solid rgba(150,100,35,0.30) !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  text-shadow: 0 1px 0 rgba(255,220,160,0.35) !important;
  box-shadow:
    0 2px 5px rgba(0,0,0,0.20),
    inset 0 1px 0 rgba(255,230,170,0.30) !important;
  transition: all 0.22s !important;
}
[data-theme=wood-legendary] .gt-mode-tab:hover {
  box-shadow:
    0 3px 8px rgba(0,0,0,0.28),
    inset 0 1px 0 rgba(255,230,170,0.40) !important;
  border-color: rgba(180,130,55,0.50) !important;
}

/* Bouton actif — relief prononcé + couleur mode conservée */
[data-theme=wood-legendary] .gt-mode-tab[style*=color:#fff] {
  box-shadow:
    0 4px 14px rgba(0,0,0,0.40),
    inset 0 1px 0 rgba(255,235,180,0.45),
    inset 0 -2px 0 rgba(0,0,0,0.20) !important;
  border-color: rgba(0,0,0,0.15) !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.35) !important;
  background-image: none !important;
}
