@import url('https://fonts.googleapis.com/css2?family=Figtree:wght@300;400;500;600;700;800&display=swap');

/* =========================================================================
   MOVE EQUIPMENT — clone du design moveequipment.com
   Scopé à la boutique Move (id_shop=1) via body.shop-1.
   N'affecte JAMAIS RSM Pro (body.shop-2) ni l'admin.
   ========================================================================= */

:root {
  --move-orange: #fb6e00;
  --move-orange-dark: #e26300;
  --move-dark: #363636;
  --move-text: #313131;
  --move-link: #464646;
  --move-title: #1a1a1a;
}

/* ---------- Typographie & couleurs de base ---------- */
body.shop-1,
body.shop-1 .ps-mainmenu__tree-link,
body.shop-1 button,
body.shop-1 input,
body.shop-1 select,
body.shop-1 textarea,
body.shop-1 a {
  font-family: 'Figtree', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
body.shop-1 {
  color: var(--move-text);
  background: #ffffff;
  font-size: 16px;
  /* Override de la couleur primaire Bootstrap → tout devient orange Move */
  --bs-primary: #fb6e00;
  --bs-primary-rgb: 251, 110, 0;
  --bs-link-color: #464646;
  --bs-link-hover-color: #fb6e00;
  --bs-btn-bg: #fb6e00;
}
body.shop-1 .btn-outline-primary {
  --bs-btn-color: #fb6e00;
  --bs-btn-border-color: #fb6e00;
  --bs-btn-hover-bg: #fb6e00;
  --bs-btn-hover-border-color: #fb6e00;
  --bs-btn-active-bg: #e26300;
  color: #fb6e00;
  border-color: #fb6e00;
}
body.shop-1 .btn-outline-primary:hover { color: #fff; background: #fb6e00; }
body.shop-1 h1, body.shop-1 h2, body.shop-1 h3,
body.shop-1 .h1, body.shop-1 .h2, body.shop-1 .h3 {
  color: var(--move-title);
  font-weight: 700;
}

/* ---------- Bande "Exclusivité" dédiée (.move-topbar) ----------
   Desktop : masquée (la .header-top stylée fait le job, plus fidèle).
   Mobile  : affichée (l'original montre aussi la bande sombre sur mobile,
             et Hummingbird masque .header-top en < 768px via JS/d-none). */
body.shop-1 .move-topbar { display: none; }
@media (max-width: 767px) {
  body.shop-1 .move-topbar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: var(--move-dark);
    color: #f2f2f2;
    min-height: 40px;
    padding: 8px 12px;
    text-align: center;
  }
  body.shop-1 .move-topbar::before {
    content: "";
    display: inline-block;
    width: 16px; height: 16px; flex: 0 0 16px;
    background: url('/img/move-clone/megaphone-duotone-solid.svg') center/contain no-repeat;
    filter: brightness(0) saturate(100%) invert(54%) sepia(98%) saturate(2000%) hue-rotate(2deg) brightness(101%) contrast(101%);
  }
  body.shop-1 .move-topbar__txt { font-size: 13px; font-weight: 500; }
}

/* ---------- TOPBAR (header-top → bande sombre) ---------- */
body.shop-1 .header-top {
  background: var(--move-dark);
  color: #f2f2f2;
  min-height: 46px;
  display: flex;
  align-items: center;
}
body.shop-1 .header-top .container-md { width: 100%; max-width: 1320px; }
/* bandeau promo centré injecté en pseudo-élément */
body.shop-1 .header-top__left { display: flex; align-items: center; }
body.shop-1 .header-top__right {
  display: flex; align-items: center; justify-content: flex-end; gap: 18px;
}
body.shop-1 .header-top .ps-contactinfo__email,
body.shop-1 .header-top a {
  color: #f2f2f2 !important;
  text-decoration: none;
  font-size: 14px;
}
body.shop-1 .header-top a:hover { color: var(--move-orange) !important; }
/* Message d'exclusivité Move au centre de la barre sombre */
body.shop-1 .header-top__left::before {
  content: "";
  display: inline-block;
  width: 18px; height: 18px;
  margin-right: 10px;
  background: url('/img/move-clone/megaphone-duotone-solid.svg') center/contain no-repeat;
  filter: brightness(0) saturate(100%) invert(54%) sepia(98%) saturate(2000%) hue-rotate(2deg) brightness(101%) contrast(101%);
  flex: 0 0 18px;
}
body.shop-1 .header-top__left::after {
  content: "Exclusivité : Frais de port offert dès 750€ d'achat*";
  color: #f2f2f2;
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
}
body.shop-1 .header-top .ps-contactinfo { display: none; } /* on garde le message Move */

/* ---------- HEADER blanc (logo + recherche + actions) ---------- */
body.shop-1 #header,
body.shop-1 .header-bottom {
  background: #ffffff;
}
body.shop-1 .header-bottom { padding: 14px 0; box-shadow: 0 1px 0 rgba(0,0,0,.06); }
body.shop-1 .header-bottom__container { max-width: 1320px; }

/* Logo Move (l'image vient de PS_LOGO scoppée shop 1 = logo-moveequipment.svg) */
body.shop-1 .logo.img-fluid,
body.shop-1 .navbar-brand .logo {
  width: auto !important;
  height: 56px !important;
  max-height: 56px;
}
body.shop-1 .header-bottom__h1 { line-height: 1; }

/* Barre de recherche : claire, arrondie, bordure discrète */
body.shop-1 .ps-searchbar { width: 100%; }
body.shop-1 .ps-searchbar__form {
  background: #f4f4f4;
  border: 1px solid #e3e3e3;
  border-radius: 8px;
  height: 52px;
  display: flex;
  align-items: center;
  padding: 0 14px;
}
body.shop-1 .ps-searchbar__input {
  background: transparent;
  border: none;
  font-size: 16px;
  color: var(--move-text);
}
body.shop-1 .ps-searchbar__magnifier { color: #9a9a9a; }

/* Icônes header (compte / panier) en gris foncé, hover orange */
body.shop-1 .header-block__icon,
body.shop-1 .header-block__title { color: var(--move-link); }
body.shop-1 .header-block__action-btn:hover .header-block__icon,
body.shop-1 .header-block__action-btn:hover .header-block__title { color: var(--move-orange); }
body.shop-1 .header-block__badge {
  background: var(--move-orange);
  color: #fff;
}

/* ---------- MENU principal (catégories) ---------- */
body.shop-1 .ps-mainmenu,
body.shop-1 .header-nav-full-width { background: #ffffff; }
body.shop-1 .ps-mainmenu__tree { border-top: 1px solid #ececec; }
body.shop-1 .ps-mainmenu__tree-link {
  color: var(--move-link);
  font-weight: 600;
  font-size: 15px;
  text-transform: uppercase;
  letter-spacing: .2px;
}
body.shop-1 .ps-mainmenu__tree-link:hover,
body.shop-1 .ps-mainmenu__tree-item:hover > .ps-mainmenu__tree-item-wrapper .ps-mainmenu__tree-link {
  color: var(--move-orange);
}
body.shop-1 .ps-mainmenu__tree-dropdown-toggle::after,
body.shop-1 .ps-mainmenu__tree-dropdown-toggle { color: var(--move-orange); }

/* ---------- BOUTONS : orange Move ---------- */
body.shop-1 .btn-primary,
body.shop-1 .btn--primary,
body.shop-1 .button.btn,
body.shop-1 button[type="submit"].btn-primary {
  background-color: var(--move-orange);
  border-color: var(--move-orange);
  color: #fff;
  border-radius: 8px;
  font-weight: 600;
}
body.shop-1 .btn-primary:hover,
body.shop-1 .button.btn:hover {
  background-color: var(--move-orange-dark);
  border-color: var(--move-orange-dark);
}
body.shop-1 a { color: var(--move-link); }
body.shop-1 a:hover { color: var(--move-orange); }
body.shop-1 .product-price,
body.shop-1 .price,
body.shop-1 .regular-price { color: var(--move-title); }

/* ---------- HERO (recouvre le slider démo) ---------- */
/* On masque le slider Bootstrap démo et on affiche notre hero plein écran */
body.shop-1 #content.page-content--home .imageslider,
body.shop-1 #content.page-content--home #ps_imageslider,
body.shop-1 #content.page-content--home [id*="slider"],
body.shop-1 #content.page-content--home .carousel { display: none !important; }

body.shop-1 #content.page-content--home::before {
  content: "";
  display: block;
}
body.shop-1 .move-hero {
  position: relative;
  width: 100%;
  min-height: 560px;
  background: linear-gradient(rgba(0,0,0,.32), rgba(0,0,0,.42)),
              url('/img/move-clone/4-55.jpg') center/cover no-repeat;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #fff;
  margin-bottom: 48px;
}
body.shop-1 .move-hero__title {
  color: #fff;
  font-size: 42px;
  font-weight: 700;
  max-width: 760px;
  line-height: 1.15;
  margin: 0 0 18px;
  text-shadow: 0 2px 12px rgba(0,0,0,.45);
}
body.shop-1 .move-hero__sub {
  color: #fff;
  font-size: 19px;
  max-width: 640px;
  margin: 0 0 22px;
  text-shadow: 0 1px 8px rgba(0,0,0,.4);
}
body.shop-1 .move-hero__rating { color: #ffce3a; font-size: 18px; font-weight: 600; }
body.shop-1 .move-hero__rating small { color: #fff; font-weight: 400; }

/* ---------- BANDEAU RÉASSURANCE (4 items Move) ---------- */
body.shop-1 .move-reassurance {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  max-width: 1240px;
  margin: 40px auto;
  padding: 28px 16px;
  border-top: 1px solid #ececec;
  border-bottom: 1px solid #ececec;
}
body.shop-1 .move-reassurance__item {
  display: flex;
  align-items: center;
  gap: 14px;
}
body.shop-1 .move-reassurance__item img { width: 38px; height: 38px; flex: 0 0 38px; }
body.shop-1 .move-reassurance__txt strong {
  display: block;
  color: var(--move-title);
  font-weight: 700;
  font-size: 16px;
}
body.shop-1 .move-reassurance__txt span { color: #767676; font-size: 14px; }

/* On masque les modules démo réassurance natifs (texte lorem/anglais) */
body.shop-1 .footer__before .block-reassurance,
body.shop-1 .header-nav-full-width .block-reassurance,
body.shop-1 #block-reassurance { display: none !important; }

/* ---------- Masquage des blocs DÉMO Hummingbird ---------- */
/* Custom Text Block (lorem ipsum), banner démo, "20% OFF ON CLOTHES" */
body.shop-1 #content.page-content--home .ps-customtext,
body.shop-1 #content.page-content--home .customtext,
body.shop-1 #content.page-content--home .ps-banner,
body.shop-1 #content.page-content--home .banner { display: none !important; }

/* ---------- FOOTER sombre Move ---------- */
body.shop-1 .footer,
body.shop-1 #footer { background: var(--move-dark); }
body.shop-1 .footer__before,
body.shop-1 .footer__main,
body.shop-1 .footer { color: #d6d6d6; }
body.shop-1 .footer h3,
body.shop-1 .footer .h3,
body.shop-1 .footer .footer-block__title,
body.shop-1 .footer .title { color: #ffffff; }
body.shop-1 .footer a,
body.shop-1 .footer .ps-linklist a,
body.shop-1 .footer .ps-contactinfo a { color: #cfcfcf; }
body.shop-1 .footer a:hover { color: var(--move-orange); }
body.shop-1 .footer .btn-primary,
body.shop-1 .footer button[type="submit"] {
  background: var(--move-orange);
  border-color: var(--move-orange);
  color: #fff;
}
/* Bloc marque "30 ans d'expérience" injecté en tête de footer */
body.shop-1 .move-footer-brand {
  background: var(--move-dark);
  color: #d6d6d6;
  padding: 40px 16px 8px;
  text-align: center;
  border-top: 4px solid var(--move-orange);
}
body.shop-1 .move-footer-brand h3 {
  color: #fff; font-size: 26px; font-weight: 800; margin-bottom: 14px;
}
body.shop-1 .move-footer-brand p { max-width: 880px; margin: 0 auto; font-size: 15px; line-height: 1.6; }

/* newsletter input clair sur footer sombre */
body.shop-1 .footer .emailsubscription input,
body.shop-1 .footer input[type="email"] {
  background: #fff; color: #313131; border-radius: 6px;
}

/* ---------- RESPONSIVE / MOBILE ---------- */
@media (max-width: 767px) {
  body.shop-1 .move-hero { min-height: 380px; }
  body.shop-1 .move-hero__title { font-size: 28px; }
  body.shop-1 .move-hero__sub { font-size: 16px; }
  body.shop-1 .move-reassurance { grid-template-columns: 1fr 1fr; gap: 18px; }
  body.shop-1 .header-top__left::before { white-space: normal; font-size: 12px; }
}
@media (max-width: 480px) {
  body.shop-1 .move-reassurance { grid-template-columns: 1fr; }
}