/* Global Styles */
body {
  margin: 0;
  padding: 0;
  background-color: #000000;
  color: #ffffff;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
}

.app {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

/* Header Styles */
header {
  background-color: rgba(0, 0, 0, 0.95);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.header-content {
  max-width: 1200px;
  margin: 0 auto;
  padding: 1rem 2rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.logo a {
  color: #fff;
  text-decoration: none;
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: -0.5px;
}

nav ul {
  display: flex;
  gap: 2rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

nav a {
  color: #999;
  text-decoration: none;
  font-size: 0.9rem;
  letter-spacing: 0.5px;
  transition: color 0.2s;
}

nav a:hover,
nav a.active {
  color: #fff;
}

/* Style spécifique pour les liens de navigation (sauf le logo) */
nav .nav-link {
  text-transform: uppercase;
}

/* Main Content Styles */
main {
  flex: 1;
  padding-top: 2px;
}

.video-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 8px;
  padding: 8px;
}

.video-thumb {
  text-decoration: none;
  color: inherit;
}

.thumb-container {
  position: relative;
  aspect-ratio: 16/9;
  overflow: hidden;
  background-color: #000;
  border-radius: 4px;
  margin-bottom: 8px;
}

img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.3s ease;
}

.video-thumb:hover img {
  transform: scale(1.05);
}

.duration {
  position: absolute;
  bottom: 8px;
  right: 8px;
  background: rgba(0, 0, 0, 0.8);
  color: white;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 0.8rem;
  font-weight: 500;
}

.overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.video-thumb:hover .overlay {
  opacity: 1;
}

.play-icon {
  color: white;
  font-size: 3rem;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
}

.video-info {
  padding: 0 4px;
}

h3 {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 400;
  color: #fff;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.meta {
  color: #999;
  font-size: 0.8rem;
  margin-top: 4px;
}

/* Footer Styles */
footer {
  background-color: rgba(0, 0, 0, 0.95);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding: 3rem 0;
  margin-top: 4rem;
}

.footer-content {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 2rem;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 3rem;
}

.footer-section h3 {
  color: #fff;
  font-size: 1.1rem;
  margin: 0 0 1rem 0;
  font-weight: 500;
}

.footer-section p {
  color: #999;
  font-size: 0.9rem;
  line-height: 1.5;
  margin: 0.5rem 0;
}

.footer-section ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-section ul li {
  margin: 0.5rem 0;
}

.footer-section a {
  color: #999;
  text-decoration: none;
  font-size: 0.9rem;
  transition: color 0.2s;
}

.footer-section a:hover {
  color: #fff;
}

/* Responsive Styles */
@media (max-width: 768px) {
  .header-content {
    padding: 1rem;
    flex-direction: column;
    gap: 1rem;
  }

  nav ul {
    gap: 1rem;
  }

  .video-grid {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 8px;
  }

  .thumb-container {
    aspect-ratio: 16/9;
  }

  /* Toujours afficher l'overlay et le bouton play sur mobile */
  .overlay {
    opacity: 1;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%);
  }

  .play-icon {
    font-size: 4rem;
    opacity: 0.9;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.6);
  }

  h3 {
    font-size: 1rem;
    margin: 4px 0;
  }

  .meta {
    font-size: 0.9rem;
  }

  footer {
    padding: 2rem 0;
  }

  .footer-content {
    padding: 0 1rem;
    gap: 2rem;
  }
}header.svelte-lazz7s.svelte-lazz7s{background:#1a1a1a;padding:1rem 0;border-bottom:1px solid #2a2a2a}.main-nav.svelte-lazz7s.svelte-lazz7s{max-width:1700px;margin:0 auto;padding:0 1.5rem;display:flex;justify-content:space-between;align-items:center;position:relative}.nav-left.svelte-lazz7s.svelte-lazz7s{display:flex;align-items:center;gap:1.5rem;flex:1;margin-top:50px}.logo.svelte-lazz7s.svelte-lazz7s{text-decoration:none;color:#fff;font-size:1.5rem;font-weight:bold;transition:opacity 0.2s ease}.logo.svelte-lazz7s.svelte-lazz7s:hover{opacity:0.8}.logo-text.svelte-lazz7s.svelte-lazz7s{display:inline-flex;align-items:center;gap:0.5rem;font-family:"Inter", system-ui, sans-serif;font-size:1.8rem;font-weight:700;letter-spacing:-0.5px}.logo-text.svelte-lazz7s img.svelte-lazz7s{width:40px;height:40px;object-fit:contain;margin-right:0px;vertical-align:middle}.fap.svelte-lazz7s.svelte-lazz7s{color:#ff3e3e}.desktop-nav.svelte-lazz7s.svelte-lazz7s{display:flex;gap:1.5rem}.nav-link.svelte-lazz7s.svelte-lazz7s{color:#999;text-decoration:none;font-size:0.95rem;transition:color 0.2s;padding:0.5rem 0;position:relative}.nav-link.svelte-lazz7s.svelte-lazz7s:hover{color:#fff}.nav-link.active.svelte-lazz7s.svelte-lazz7s{color:#fff}.language-selector.svelte-lazz7s.svelte-lazz7s{position:relative;z-index:100}.desktop-lang.svelte-lazz7s.svelte-lazz7s{position:absolute;right:1.5rem;top:50%;transform:translateY(-50%)}.mobile-lang.svelte-lazz7s.svelte-lazz7s{margin-bottom:1rem;width:100%}.lang-display.svelte-lazz7s.svelte-lazz7s{display:flex;align-items:center;gap:0.5rem;padding:0.5rem 0.75rem;background:rgba(255, 255, 255, 0.05);border:1px solid rgba(255, 255, 255, 0.1);border-radius:100px;cursor:pointer;transition:all 0.2s ease}.mobile-lang.svelte-lazz7s .lang-display.svelte-lazz7s{justify-content:center;padding:0.75rem;background:rgba(255, 255, 255, 0.08)}.lang-display.svelte-lazz7s.svelte-lazz7s:hover{background:rgba(255, 255, 255, 0.1);border-color:rgba(255, 255, 255, 0.2)}.current-lang.svelte-lazz7s.svelte-lazz7s{font-size:0.9rem;font-weight:500;color:#fff}.mobile-lang.svelte-lazz7s .current-lang.svelte-lazz7s{font-size:1rem}.lang-arrow.svelte-lazz7s.svelte-lazz7s{width:1rem;height:1rem;color:#fff;transition:transform 0.2s ease}.lang-arrow.open.svelte-lazz7s.svelte-lazz7s{transform:rotate(180deg)}.lang-menu.svelte-lazz7s.svelte-lazz7s{position:absolute;top:calc(100% + 0.5rem);right:0;background:rgba(31, 31, 31, 0.95);border-radius:12px;padding:0.5rem;min-width:150px;box-shadow:0 8px 24px rgba(0, 0, 0, 0.4);border:1px solid rgba(255, 255, 255, 0.1);backdrop-filter:blur(10px);transform-origin:top right}.mobile-lang.svelte-lazz7s .lang-menu.svelte-lazz7s{position:relative;top:0.5rem;width:100%;border-radius:8px}.lang-option.svelte-lazz7s.svelte-lazz7s{width:100%;text-align:left;padding:0.75rem 1rem;background:none;border:none;color:#fff;font-size:0.9rem;cursor:pointer;border-radius:8px;transition:all 0.2s ease}.mobile-lang.svelte-lazz7s .lang-option.svelte-lazz7s{text-align:center;font-size:1rem;padding:1rem}.lang-option.svelte-lazz7s.svelte-lazz7s:hover{background:rgba(255, 255, 255, 0.1);transform:translateX(4px)}.mobile-lang.svelte-lazz7s .lang-option.svelte-lazz7s:hover{transform:none;background:rgba(255, 255, 255, 0.15)}.nav-link.active.svelte-lazz7s.svelte-lazz7s::after{content:"";position:absolute;bottom:0;left:0;width:100%;height:2px;background:#ff2e2e}.search-container.svelte-lazz7s.svelte-lazz7s{min-width:300px;position:relative}.search-form.svelte-lazz7s.svelte-lazz7s{display:flex;flex-direction:column;position:relative;width:300px}.input-wrapper.svelte-lazz7s.svelte-lazz7s{display:flex;align-items:center;background:#2a2a2a;border-radius:8px;width:100%}.suggestions-container.svelte-lazz7s.svelte-lazz7s{position:absolute;top:100%;left:0;right:0;background:#1a1a1a;border:1px solid #333;border-radius:8px;margin-top:4px;box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.3);z-index:1000;max-height:300px;overflow-y:auto}.suggestion-item.svelte-lazz7s.svelte-lazz7s{padding:8px 12px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;color:#fff;border-bottom:1px solid #333;width:100%;text-align:left;background:none;border-left:none;border-right:none;border-top:none}.suggestion-item.svelte-lazz7s.svelte-lazz7s:last-child{border-bottom:none}.suggestion-item.svelte-lazz7s.svelte-lazz7s:hover,.suggestion-item.selected.svelte-lazz7s.svelte-lazz7s{background-color:#333}.suggestion-text.svelte-lazz7s.svelte-lazz7s{flex:1;font-size:0.9rem}.suggestion-count.svelte-lazz7s.svelte-lazz7s{color:#666;font-size:0.8rem;margin-left:8px;background:rgba(255, 255, 255, 0.1);padding:2px 6px;border-radius:12px}.search-form.svelte-lazz7s input.svelte-lazz7s{flex:1;padding:0.7rem 1rem;border:none;background:transparent;color:#fff;font-size:0.95rem;outline:none;width:100%}.search-form.svelte-lazz7s input.svelte-lazz7s::placeholder{color:#666}.search-form.svelte-lazz7s button.svelte-lazz7s{padding:0.7rem 1rem;border:none;background:transparent;color:#e2e2e2;cursor:pointer;transition:color 0.2s;display:flex;align-items:center}.search-form.svelte-lazz7s button.svelte-lazz7s:hover{color:#fff}.search-form.svelte-lazz7s button svg.svelte-lazz7s{width:1.2rem;height:1.2rem}.menu-toggle.svelte-lazz7s.svelte-lazz7s{display:none;background:none;border:none;padding:0.5rem;cursor:pointer;color:#fff}.menu-icon.svelte-lazz7s.svelte-lazz7s{display:flex;flex-direction:column;justify-content:space-between;width:24px;height:18px}.bar.svelte-lazz7s.svelte-lazz7s{width:100%;height:2px;background-color:#fff;transition:transform 0.3s,
      opacity 0.3s}.menu-icon.open.svelte-lazz7s .bar.svelte-lazz7s:nth-child(1){transform:translateY(8px) rotate(45deg)}.menu-icon.open.svelte-lazz7s .bar.svelte-lazz7s:nth-child(2){opacity:0}.menu-icon.open.svelte-lazz7s .bar.svelte-lazz7s:nth-child(3){transform:translateY(-8px) rotate(-45deg)}.mobile-nav.svelte-lazz7s.svelte-lazz7s{display:none}@media(max-width: 768px){.main-nav.svelte-lazz7s.svelte-lazz7s{flex-wrap:wrap}.desktop-lang.svelte-lazz7s.svelte-lazz7s{display:none}.nav-left.svelte-lazz7s.svelte-lazz7s{flex-wrap:wrap;gap:0.5rem}.logo.svelte-lazz7s.svelte-lazz7s{flex:1;order:1}.menu-toggle.svelte-lazz7s.svelte-lazz7s{display:flex;order:2;padding:0.5rem;background:none;border:none;cursor:pointer}.search-container.svelte-lazz7s.svelte-lazz7s{width:100%;min-width:100%;order:3;margin-top:0.5rem}.search-form.svelte-lazz7s.svelte-lazz7s{width:100%}.desktop-nav.svelte-lazz7s.svelte-lazz7s{display:none}.desktop-nav.svelte-lazz7s.svelte-lazz7s{display:none}.logo-text.svelte-lazz7s.svelte-lazz7s{font-size:1.4rem}.mobile-nav.svelte-lazz7s.svelte-lazz7s{display:block;position:fixed;top:200px;left:0;right:0;background:#1a1a1a;padding:0;border-top:1px solid #2a2a2a;transform:translateY(-100%);opacity:0;visibility:hidden;transition:all 0.3s ease-in-out;z-index:1000;max-height:calc(100vh - 60px);overflow-y:auto}.mobile-nav.open.svelte-lazz7s.svelte-lazz7s{transform:translateY(0);opacity:1;visibility:visible;box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1),
        0 2px 4px -1px rgba(0, 0, 0, 0.06)}.mobile-nav.svelte-lazz7s .nav-link.svelte-lazz7s{display:block;padding:1rem 1.5rem;font-size:1.1rem;border-bottom:1px solid #2a2a2a;text-align:left;width:100%;box-sizing:border-box}}footer.svelte-nrfpey.svelte-nrfpey{background:#1a1a1a;padding:2rem 0;border-top:1px solid #333}.footer-content.svelte-nrfpey.svelte-nrfpey{max-width:1200px;margin:0 auto;padding:0 1rem;display:grid;grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));gap:2rem}.footer-section.svelte-nrfpey h3.svelte-nrfpey{color:#ff6b6b;margin-bottom:1rem}.footer-section.svelte-nrfpey ul.svelte-nrfpey{list-style:none;padding:0}.footer-section.svelte-nrfpey ul li.svelte-nrfpey{margin-bottom:0.5rem}.footer-section.svelte-nrfpey a.svelte-nrfpey{color:#999;text-decoration:none;transition:color 0.3s}.footer-section.svelte-nrfpey a.svelte-nrfpey:hover{color:#ff6b6b}.footer-section.svelte-nrfpey p.svelte-nrfpey{color:#666;font-size:0.9rem}@media(max-width: 768px){.footer-content.svelte-nrfpey.svelte-nrfpey{grid-template-columns:1fr;text-align:center}}.app.svelte-1060vnh{display:flex;flex-direction:column;min-height:100vh}main.svelte-1060vnh{flex:1;background:#121212}