/**
 * Styles pour remplacer complètement la section des marques
 * Cette feuille de style doit être chargée en dernier
 */

/* Masquer toutes les marques existantes */
.brands-slider {
  display: none !important;
}

/* Créer un nouveau conteneur pour les marques */
.brands-container::after {
  content: "";
  display: block;
  height: 50px;
  width: 100%;
  position: relative;
  overflow: hidden;
}

/* Injecter les nouvelles marques via CSS */
.brands-container::before {
  content: "Caterpillar • Cummins • Perkins • Deutz • Volvo Penta • John Deere • Kubota • Yanmar • Mitsubishi • Hatz • Isuzu • MTU • MAN • FPT • Liebherr • Scania • Mercury Marine • Evinrude • Suzuki Marine • Honda Marine • Tohatsu";
  display: inline-block;
  white-space: nowrap;
  position: absolute;
  animation: marquee-scroll-override 30s linear infinite;
  height: 50px;
  line-height: 50px;
  padding: 0 20px;
  font-size: 0.9rem;
  font-weight: 500;
  color: #333;
}

/* Animation de défilement */
@keyframes marquee-scroll-override {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(-100%);
  }
}

/* Styles spécifiques pour mobile */
@media (max-width: 768px) {
  .brands-container::before {
    font-size: 0.8rem;
    height: 40px;
    line-height: 40px;
    animation: marquee-scroll-override 25s linear infinite;
  }
  
  .brands-container::after {
    height: 40px;
  }
  
  @-webkit-keyframes marquee-scroll-override {
    0% {
      -webkit-transform: translateX(100%);
    }
    100% {
      -webkit-transform: translateX(-100%);
    }
  }
}