/* ═══════════════════════════════════════════════
   LFP DÉFIS — Frontend CSS v4.2
   lafamilleparfaite.com
═══════════════════════════════════════════════ */
:root {
  --lfp-primary:   #667eea;
  --lfp-secondary: #764ba2;
  --lfp-gold:      #f59e0b;
  --lfp-red:       #dc2626;
  --lfp-green:     #16a34a;
  --lfp-dark:      #0f0f1a;
  --lfp-card-bg:   #1a1a2e;
  --lfp-radius:    12px;
  --lfp-shadow:    0 4px 20px rgba(0,0,0,.25);
}

/* ── PAGE CONTAINER ── */
.lfp-defi-page { background:#f8f9fa; min-height:100vh; max-width:1100px; margin:0 auto; }

/* ── HERO ── */
.lfp-hero {
  position:relative; min-height:240px; display:flex;
  flex-direction:column; justify-content:flex-end; overflow:hidden;
  background:linear-gradient(135deg,#0f0f1a,#1a1a2e);
  border-radius:0 0 var(--lfp-radius) var(--lfp-radius);
}
.lfp-hero-18 { background:linear-gradient(135deg,#1a0a0a,#2d1515); }
.lfp-hero-bg {
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  filter:brightness(.45);
}
.lfp-hero-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.85) 0%, transparent 60%);
}
.lfp-hero-content {
  position:relative; z-index:1; padding:20px 5% 24px;
  max-width:900px;
}
.lfp-live-ribbon {
  position:absolute; top:0; left:0; right:0;
  background:#ef4444; color:#fff; text-align:center;
  padding:5px; font-weight:700; font-size:13px; letter-spacing:2px;
  animation:pulse 2s infinite;
}
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.7} }
.lfp-hero-badges { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:10px; }
.lfp-badge-cat {
  display:inline-flex; align-items:center; gap:4px;
  padding:3px 10px; border-radius:20px; font-size:11px; font-weight:700;
}
.badge-18  { background:#dc2626; color:#fff; }
.badge-gen { background:#f59e0b; color:#fff; }
.lfp-defi-title {
  font-size:clamp(17px,3vw,24px); font-weight:800; color:#fff;
  margin:0 0 4px; line-height:1.25; text-shadow:0 2px 8px rgba(0,0,0,.5);
}
.lfp-defi-host { color:#d1d5db; font-size:13px; margin:0 0 12px; }
.lfp-hero-stats { display:flex; gap:20px; flex-wrap:wrap; }
.lfp-stat { display:flex; flex-direction:column; align-items:center; gap:1px; }
.lfp-stat-icon { font-size:18px; }
.lfp-stat-num  { font-size:16px; font-weight:800; color:#fff; }
.lfp-stat-label { font-size:10px; color:#9ca3af; text-transform:uppercase; letter-spacing:.5px; }
.lfp-hero-stream-links { display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; }
.lfp-stream-btn {
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 14px; border-radius:8px; text-decoration:none;
  font-weight:700; font-size:12px; color:#fff;
}
.lfp-twitch  { background:#9146ff; }
.lfp-youtube { background:#ef4444; }

/* ── NAV BAR + SHARE ── */
.lfp-defi-nav {
  display:flex; justify-content:space-between; align-items:center;
  background:#fff; border-bottom:2px solid #e5e7eb;
  position:sticky; top:0; z-index:50;
  box-shadow:0 2px 8px rgba(0,0,0,.04);
  padding:0 8px;
}
.lfp-nav-sections {
  display:flex; gap:0; overflow-x:auto; -webkit-overflow-scrolling:touch; flex:1;
}
.lfp-nav-sections a {
  display:flex; align-items:center; gap:4px;
  padding:10px 14px; font-size:12px; font-weight:600;
  color:#6b7280; text-decoration:none; white-space:nowrap;
  border-bottom:3px solid transparent; transition:all .2s; cursor:pointer;
}
.lfp-nav-sections a:hover { color:#374151; background:#f9fafb; }
.lfp-nav-sections a.active { color:var(--lfp-primary); border-bottom-color:var(--lfp-primary); }
.lfp-nav-judge { color:#8b5cf6 !important; }
.lfp-nav-judge-active { color:#fff !important; background:#8b5cf6 !important; border-radius:6px; margin:4px 0; }
.lfp-nav-share {
  display:flex; gap:4px; align-items:center; padding:4px 0; flex-shrink:0;
}
.lfp-share-icon {
  display:inline-flex; align-items:center; justify-content:center;
  width:28px; height:28px; border-radius:6px; font-size:12px; font-weight:800;
  text-decoration:none; border:none; cursor:pointer; background:transparent;
  transition:opacity .2s;
}
.lfp-share-icon:hover { opacity:.7; }
@media(max-width:700px) {
  .lfp-nav-sections a { padding:8px 10px; font-size:11px; }
  .lfp-nav-share { display:none; }
}

/* ── TIMERS ── */
.lfp-timers { background:#1a1a2e; padding:10px 16px; }
.lfp-timers-inner { display:flex; gap:24px; flex-wrap:wrap; }
.lfp-timer-block { display:flex; align-items:center; gap:10px; }
.lfp-timer-icon  { font-size:24px; }
.lfp-timer-label { font-size:10px; color:#9ca3af; text-transform:uppercase; letter-spacing:1px; }
.lfp-timer-value { font-size:16px; font-weight:800; color:#f59e0b; font-family:monospace; }

/* ── BODY ── */
.lfp-defi-body {
  display:grid; grid-template-columns:1fr 300px; gap:16px;
  padding:16px 12px 40px;
}
@media(max-width:900px) { .lfp-defi-body { grid-template-columns:1fr; } }

/* ── SECTIONS ── */
.lfp-section {
  background:#fff; border-radius:var(--lfp-radius);
  padding:20px; margin-bottom:16px;
  box-shadow:0 2px 10px rgba(0,0,0,.06);
}
.lfp-section h2 {
  font-size:16px; font-weight:800; margin:0 0 14px;
  padding-bottom:8px; border-bottom:2px solid #f3f4f6; color:#1f2937;
}
.lfp-defi-content { color:#374151; line-height:1.7; font-size:14px; }
.lfp-reglement {
  margin-top:16px; background:#f9fafb; border-radius:8px;
  padding:14px; border-left:4px solid var(--lfp-primary);
}
.lfp-reglement h3 { font-size:14px; font-weight:700; margin:0 0 8px; }
.lfp-equipement {
  margin-top:16px; background:#fef3c7; border-radius:8px;
  padding:14px; border-left:4px solid #f59e0b;
}
.lfp-equipement h3 { font-size:14px; font-weight:700; margin:0 0 8px; color:#92400e; }

/* ── PARTICIPANTS ── */
.lfp-count-badge {
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--lfp-primary); color:#fff; border-radius:20px;
  font-size:12px; font-weight:700; padding:2px 8px; margin-left:6px;
}
.lfp-parts-group { margin-bottom:14px; }
.lfp-parts-group-title {
  font-size:12px; font-weight:700; margin:0 0 8px;
  padding:5px 10px; border-radius:6px;
}
.lfp-group-green  { background:#dcfce7; color:#15803d; }
.lfp-group-orange { background:#fef3c7; color:#92400e; }
.lfp-parts-grid { display:flex; flex-wrap:wrap; gap:6px; }
.lfp-part-chip {
  display:flex; align-items:center; gap:6px;
  background:#f9fafb; border:1px solid #e5e7eb;
  border-radius:20px; padding:4px 12px; font-size:12px;
}
.lfp-part-chip.lfp-part-done { background:#f0fdf4; border-color:#bbf7d0; }
.lfp-part-avatar {
  width:22px; height:22px; border-radius:50%;
  background:var(--lfp-primary); color:#fff; display:flex; align-items:center;
  justify-content:center; font-size:11px; font-weight:700; flex-shrink:0;
}
.lfp-part-name  { font-weight:600; color:#1f2937; }
.lfp-part-proof-badge { color:#16a34a; font-size:13px; }

/* ── UPLOAD ── */
.lfp-btn-submit-proof {
  width:100%; padding:10px; background:linear-gradient(135deg,#667eea,#764ba2);
  color:#fff; border:none; border-radius:8px; font-size:14px;
  font-weight:700; cursor:pointer; transition:opacity .2s;
}
.lfp-btn-submit-proof:hover { opacity:.9; }
.lfp-timestamp-fields { display:flex; flex-direction:column; gap:10px; margin:12px 0; }
.lfp-timestamp-fields label { font-size:12px; font-weight:600; color:#374151; display:block; }
.lfp-timestamp-fields input {
  width:100%; padding:8px; border:1px solid #d1d5db; border-radius:6px; font-size:13px;
}

/* ── GAGNANT ── */
.lfp-winner-card {
  text-align:center; background:linear-gradient(135deg,#f59e0b,#d97706);
  border-radius:var(--lfp-radius); padding:28px; color:#fff;
}
.lfp-winner-trophy { font-size:56px; margin-bottom:6px; }
.lfp-winner-card h2 { color:#fff; margin:0 0 6px; font-size:24px; border:none; }
.lfp-winner-name  { font-size:20px; font-weight:800; margin-bottom:6px; }
.lfp-winner-prize { font-size:24px; font-weight:900; }

/* ── LEADERBOARD ── */
.lfp-lb-title { font-size:15px; font-weight:800; margin:0 0 12px; }
.lfp-lb-list  { display:flex; flex-direction:column; gap:6px; }
.lfp-lb-row {
  display:flex; align-items:center; gap:10px;
  padding:8px 12px; background:#f9fafb; border-radius:8px;
  border:1px solid #e5e7eb;
}
.lfp-lb-first  { background:linear-gradient(135deg,#fef9c3,#fef3c7); border-color:#f59e0b; }
.lfp-lb-second { background:linear-gradient(135deg,#f1f5f9,#e2e8f0); border-color:#94a3b8; }
.lfp-lb-third  { background:linear-gradient(135deg,#fff7ed,#fed7aa); border-color:#f97316; }
.lfp-lb-rank   { font-size:18px; min-width:24px; }
.lfp-lb-name   { flex:1; font-weight:700; color:#1f2937; font-size:13px; }
.lfp-lb-amount { font-weight:800; color:var(--lfp-primary); font-size:13px; }
.lfp-lb-date   { font-size:10px; color:#9ca3af; }

/* ── ASIDE ── */
.lfp-defi-aside { display:flex; flex-direction:column; gap:12px; }
.lfp-aside-card {
  background:#fff; border-radius:var(--lfp-radius);
  padding:16px; box-shadow:0 2px 10px rgba(0,0,0,.06);
}
.lfp-aside-card h4 { font-size:14px; font-weight:800; margin:0 0 12px; }
.lfp-cta-card { border-top:4px solid var(--lfp-primary); }
.lfp-cta-login,.lfp-cta-join,.lfp-cta-finished,.lfp-cta-closed { text-align:center; }
.lfp-cta-login h3,.lfp-cta-join h3 { margin:0 0 8px; font-size:15px; }
.lfp-inscrit-icon { font-size:40px; margin-bottom:6px; }
.lfp-cta-inscrit  { text-align:center; }
.lfp-cta-inscrit h3 { margin:0 0 4px; color:#16a34a; font-size:15px; }
.lfp-inscrit-ref  { font-size:12px; color:#6b7280; }
.lfp-cta-mise {
  background:#f0f9ff; border-radius:8px; padding:8px;
  font-size:12px; margin-bottom:12px; text-align:center; color:#374151;
}
.lfp-mise-row {
  display:flex; justify-content:space-between; padding:5px 0;
  border-bottom:1px solid #f3f4f6; font-size:12px; color:#374151;
}
.lfp-mise-winner { font-weight:800; color:#16a34a; }
.lfp-mise-small  { color:#9ca3af; font-size:11px; }
.lfp-mise-total  { font-weight:700; border-top:2px solid #e5e7eb; border-bottom:none; }
.lfp-info-row {
  display:flex; justify-content:space-between; padding:5px 0;
  font-size:12px; color:#374151; border-bottom:1px solid #f3f4f6; gap:6px;
}
.lfp-info-row:last-child { border-bottom:none; }
.lfp-info-row span:last-child { font-weight:600; text-align:right; }

/* ── BOUTONS ── */
.lfp-btn-primary {
  display:inline-block; background:linear-gradient(135deg,#667eea,#764ba2);
  color:#fff; padding:10px 24px; border-radius:8px;
  text-decoration:none; font-weight:700; border:none; cursor:pointer;
  font-size:13px; transition:opacity .2s;
}
.lfp-btn-primary:hover { opacity:.9; color:#fff; }
.lfp-btn-18plus { background:linear-gradient(135deg,#dc2626,#991b1b); }
.lfp-btn-secondary {
  display:inline-block; background:#f3f4f6; color:#374151;
  padding:8px 16px; border-radius:8px; text-decoration:none;
  font-weight:700; border:1px solid #e5e7eb; cursor:pointer; font-size:12px;
}
.lfp-btn-ghost {
  display:inline-block; background:transparent; color:#9ca3af;
  padding:6px 14px; border-radius:8px; text-decoration:none;
  font-size:12px; border:1px solid #e5e7eb;
}
.lfp-btn-join-defi {
  display:block; width:100%; background:linear-gradient(135deg,#667eea,#764ba2);
  color:#fff; border:none; padding:12px; border-radius:8px;
  font-size:14px; font-weight:800; cursor:pointer; transition:opacity .2s;
}
.lfp-btn-join-defi:hover { opacity:.9; }

/* ── GATE 18+ ── */
.lfp-gate-18-wall {
  min-height:60vh; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,#1a0a0a,#2d1515); padding:40px;
}
.lfp-gate-18-inner { text-align:center; color:#fff; max-width:440px; }
.lfp-gate-icon { font-size:64px; margin-bottom:12px; }
.lfp-gate-18-inner h1 { color:#fff; margin-bottom:10px; }
.lfp-gate-18-inner p  { color:#fca5a5; margin-bottom:20px; }

/* ── SHARE BAR ── */
.lfp-share-bar {
  background:#1a1a2e; padding:12px 16px;
  border-top:1px solid rgba(255,255,255,.05);
  border-radius:0 0 var(--lfp-radius) var(--lfp-radius);
}
.lfp-share-inner { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.lfp-share-label { color:#9ca3af; font-size:12px; font-weight:600; }
.lfp-share-btn {
  display:inline-flex; align-items:center; justify-content:center;
  width:32px; height:32px; border-radius:8px; color:#fff;
  text-decoration:none; font-size:13px; font-weight:800; border:none; cursor:pointer;
  transition:opacity .2s;
}
.lfp-share-btn:hover { opacity:.85; }

/* ═══════════════════════════════════════════════
   MODALES
═══════════════════════════════════════════════ */
.lfp-modal {
  display:none; position:fixed; inset:0; z-index:10000;
  align-items:center; justify-content:center;
}
.lfp-modal.lfp-modal-open { display:flex; }
.lfp-modal-backdrop {
  position:absolute; inset:0; background:rgba(0,0,0,.6);
  backdrop-filter:blur(4px);
}
.lfp-modal-content {
  position:relative; background:#fff; border-radius:16px;
  max-width:640px; width:92%; max-height:85vh; overflow-y:auto;
  box-shadow:0 20px 60px rgba(0,0,0,.3); padding:24px;
  animation:lfpModalIn .25s ease-out;
}
.lfp-modal-large { max-width:780px; }
@keyframes lfpModalIn { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }
.lfp-modal-close {
  position:absolute; top:12px; right:12px; width:32px; height:32px;
  border-radius:50%; background:#f3f4f6; border:none; cursor:pointer;
  font-size:18px; display:flex; align-items:center; justify-content:center;
  color:#6b7280; transition:background .2s;
}
.lfp-modal-close:hover { background:#e5e7eb; }
.lfp-modal-content h2 { font-size:18px; font-weight:800; margin:0 0 16px; color:#1f2937; }
.lfp-modal-body { font-size:14px; color:#374151; line-height:1.7; }

/* ── TERMS MODAL ── */
.lfp-terms-section { margin-bottom:20px; }
.lfp-terms-section h3 { font-size:14px; font-weight:700; margin:0 0 8px; color:#374151; }
.lfp-terms-scroll {
  max-height:180px; overflow-y:auto; background:#f9fafb; border:1px solid #e5e7eb;
  border-radius:8px; padding:12px; font-size:12px; color:#4b5563; line-height:1.6;
  white-space:pre-wrap; margin-bottom:8px;
}
.lfp-terms-check {
  display:flex; align-items:center; gap:8px; font-size:13px; font-weight:600;
  cursor:pointer; color:#374151;
}
.lfp-terms-check input { width:18px; height:18px; cursor:pointer; }
.lfp-terms-signature { margin-top:16px; }

/* ── ARCHIVE GRID ── */
.lfp-defis-grid {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:20px; padding:4px;
}
.lfp-card {
  border-radius:var(--lfp-radius); overflow:hidden; background:#fff;
  box-shadow:var(--lfp-shadow); transition:transform .2s; position:relative;
}
.lfp-card:hover { transform:translateY(-4px); }
.lfp-card-img {
  position:relative; height:160px; background:#1a1a2e;
  display:flex; align-items:center; justify-content:center; overflow:hidden;
}
.lfp-card-placeholder { font-size:48px; opacity:.3; }
.lfp-live-badge {
  position:absolute; top:8px; right:8px;
  background:#ef4444; color:#fff; padding:3px 10px;
  border-radius:12px; font-size:11px; font-weight:700; animation:pulse 2s infinite;
}
.lfp-card-badge {
  position:absolute; top:8px; left:8px; z-index:1;
  padding:3px 10px; border-radius:12px; font-size:11px; font-weight:700;
}
.lfp-blur-overlay {
  position:absolute; inset:0; background:rgba(0,0,0,.7);
  display:flex; flex-direction:column; align-items:center;
  justify-content:center; gap:8px; color:#fff; z-index:1;
}
.lfp-btn-unlock {
  background:#dc2626; color:#fff; padding:6px 16px;
  border-radius:6px; text-decoration:none; font-size:12px; font-weight:700;
}
.lfp-card-body { padding:14px; }
.lfp-card-title { margin:0 0 8px; font-size:14px; font-weight:800; }
.lfp-card-title a { color:#1f2937; text-decoration:none; }
.lfp-card-meta { display:flex; justify-content:space-between; margin-bottom:6px; font-size:11px; }
.lfp-mise  { color:#f59e0b; font-weight:700; }
.lfp-gratuit { color:#16a34a; font-weight:700; }
.lfp-count   { color:#6b7280; }
.lfp-countdown { font-size:11px; color:#6b7280; margin-bottom:6px; }
.lfp-status  { margin-bottom:8px; }
.lfp-btn-voir {
  display:block; text-align:center; background:linear-gradient(135deg,#667eea,#764ba2);
  color:#fff; padding:8px; border-radius:8px; text-decoration:none;
  font-weight:700; font-size:12px;
}
.lfp-btn-live { background:linear-gradient(135deg,#ef4444,#dc2626); animation:pulse 2s infinite; }

/* ═══════════════════════════════════════════════
   TIRAGE AU SORT
═══════════════════════════════════════════════ */
@keyframes lfpPopIn {
  0%   { transform:scale(.6); opacity:0; }
  60%  { transform:scale(1.05); }
  100% { transform:scale(1); opacity:1; }
}
@keyframes lfpPulse {
  0%,100% { transform:scale(1); }
  50%     { transform:scale(1.1); }
}
.lfp-spinner {
  display:inline-block; width:32px; height:32px;
  border:3px solid #e5e7eb; border-top-color:#667eea;
  border-radius:50%; animation:lfpSpin .8s linear infinite;
}
@keyframes lfpSpin { to { transform:rotate(360deg); } }
#lfp-tirage-countdown-num {
  animation:lfpPulse 1s ease-in-out infinite;
}

/* ═══════════════════════════════════════════════
   MODALE LARGE
═══════════════════════════════════════════════ */
.lfp-modal-large {
  max-width:700px !important;
}