/*
Theme Name: JouetPlus Astra Child
Theme URI: https://jouetplus.ma
Description: Theme enfant Astra pour une boutique WooCommerce JouetPlus.ma moderne, responsive et prete a recevoir des produits.
Author: JouetPlus.ma
Template: astra
Version: 1.1.0
Text Domain: jouetplus-astra-child
*/

:root {
  --jp-blue: #2563eb;
  --jp-red: #ef4444;
  --jp-yellow: #fbbf24;
  --jp-green: #16a34a;
  --jp-ink: #172033;
  --jp-muted: #667085;
  --jp-line: #e7edf5;
  --jp-soft: #f6f9fc;
  --jp-card: #ffffff;
  --jp-footer: #151821;
  --jp-radius: 8px;
  --jp-shadow: 0 14px 38px rgba(20, 35, 60, 0.09);
}

body.jouetplus-store {
  color: var(--jp-ink);
  background: #fff;
  overflow-x: hidden;
}

body.jouetplus-store a {
  transition: color 0.18s ease, background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

body.jouetplus-store .site-content {
  background: #fff;
}

/* Header */
body.jouetplus-store .site-header,
body.jouetplus-store .ast-primary-header-bar {
  border-bottom: 1px solid rgba(231, 237, 245, 0.95);
  box-shadow: 0 10px 30px rgba(20, 35, 60, 0.06);
  backdrop-filter: blur(12px);
}

body.jouetplus-store .ast-theme-transparent-header .site-header,
body.jouetplus-store.ast-theme-transparent-header .site-header {
  background: rgba(255, 255, 255, 0.96);
}

body.jouetplus-store .custom-logo-link img,
body.jouetplus-store .site-logo-img img {
  max-height: 68px;
  width: auto;
}

body.jouetplus-store .main-header-menu > .menu-item > .menu-link {
  min-height: 44px;
  padding-inline: 13px;
  border-radius: var(--jp-radius);
  color: var(--jp-ink);
  font-weight: 800;
  letter-spacing: 0;
}

body.jouetplus-store .main-header-menu > .menu-item:hover > .menu-link,
body.jouetplus-store .main-header-menu > .current-menu-item > .menu-link {
  color: var(--jp-blue);
  background: rgba(37, 99, 235, 0.08);
}

body.jouetplus-store .ast-builder-social-element,
body.jouetplus-store .ast-header-social-wrap,
body.jouetplus-store .header-social-item {
  display: none !important;
}

body.jouetplus-store header a.menu-link[href$="/panier/"],
body.jouetplus-store header a.menu-link[href$="/mon-compte/"] {
  width: 42px;
  min-width: 42px;
  height: 42px;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--jp-line);
  border-radius: 999px;
  background: #fff;
  color: transparent !important;
  font-size: 0 !important;
  box-shadow: 0 6px 18px rgba(20, 35, 60, 0.06);
}

body.jouetplus-store header a.menu-link[href$="/panier/"]::before,
body.jouetplus-store header a.menu-link[href$="/mon-compte/"]::before {
  content: "";
  width: 20px;
  height: 20px;
  display: block;
  background: var(--jp-ink);
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
}

body.jouetplus-store header a.menu-link[href$="/panier/"]::before {
  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7 18a2 2 0 1 0 0 4 2 2 0 0 0 0-4Zm10 0a2 2 0 1 0 .01 0H17ZM6.2 6l.35 2h11.9l-1.15 5.4a2 2 0 0 1-1.95 1.6H8.2a2 2 0 0 1-1.97-1.66L4.8 4H2V2h4.5l.38 2H21l-1.8 8.2A4 4 0 0 1 15.3 15H8.2l.2 1H19v2H7.1a2 2 0 0 1-1.97-1.66L3.5 6h2.7Z"/></svg>');
  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7 18a2 2 0 1 0 0 4 2 2 0 0 0 0-4Zm10 0a2 2 0 1 0 .01 0H17ZM6.2 6l.35 2h11.9l-1.15 5.4a2 2 0 0 1-1.95 1.6H8.2a2 2 0 0 1-1.97-1.66L4.8 4H2V2h4.5l.38 2H21l-1.8 8.2A4 4 0 0 1 15.3 15H8.2l.2 1H19v2H7.1a2 2 0 0 1-1.97-1.66L3.5 6h2.7Z"/></svg>');
}

body.jouetplus-store header a.menu-link[href$="/mon-compte/"]::before {
  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 12a5 5 0 1 0-5-5 5 5 0 0 0 5 5Zm0 2c-4.42 0-8 2.24-8 5v1.5A1.5 1.5 0 0 0 5.5 22h13a1.5 1.5 0 0 0 1.5-1.5V19c0-2.76-3.58-5-8-5Z"/></svg>');
  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 12a5 5 0 1 0-5-5 5 5 0 0 0 5 5Zm0 2c-4.42 0-8 2.24-8 5v1.5A1.5 1.5 0 0 0 5.5 22h13a1.5 1.5 0 0 0 1.5-1.5V19c0-2.76-3.58-5-8-5Z"/></svg>');
}

body.jouetplus-store header a.menu-link[href$="/panier/"]:hover,
body.jouetplus-store header a.menu-link[href$="/mon-compte/"]:hover {
  background: var(--jp-yellow);
  border-color: var(--jp-yellow);
  transform: translateY(-1px);
}

/* Homepage slider */
body.jouetplus-store .jp-slider-root {
  position: relative;
  overflow: hidden;
  background: #0d0a2e;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

body.jouetplus-store .jp-track {
  display: flex;
  transition: transform 0.65s cubic-bezier(0.77, 0, 0.175, 1);
  will-change: transform;
}

body.jouetplus-store .jp-slide {
  min-width: 100%;
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
  display: flex;
  align-items: center;
}

body.jouetplus-store .jp-slide-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
}

body.jouetplus-store .jp-slide-content {
  position: relative;
  z-index: 2;
  max-width: 1180px;
}

body.jouetplus-store .jp-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 20px;
  padding: 5px 16px;
  border: 1px solid rgba(251, 191, 36, 0.45);
  border-radius: 999px;
  background: rgba(251, 191, 36, 0.15);
  color: var(--jp-yellow);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body.jouetplus-store .jp-badge-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--jp-yellow);
}

body.jouetplus-store .jp-title {
  margin: 0 0 16px;
  color: #fff;
  font-weight: 900;
  line-height: 1.12;
}

body.jouetplus-store .jp-title span {
  color: var(--jp-yellow);
}

body.jouetplus-store .jp-desc {
  max-width: 460px;
  margin: 0 0 30px;
  color: rgba(255, 255, 255, 0.82);
  line-height: 1.7;
}

body.jouetplus-store .jp-btns {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

body.jouetplus-store .jp-btn-primary,
body.jouetplus-store .jp-btn-secondary {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 24px;
  text-decoration: none;
  font-size: 15px;
  font-weight: 850;
}

body.jouetplus-store .jp-btn-primary {
  background: var(--jp-yellow);
  color: #0d0a2e;
}

body.jouetplus-store .jp-btn-secondary {
  border: 2px solid rgba(255, 255, 255, 0.42);
  color: #fff;
  background: rgba(255, 255, 255, 0.05);
}

body.jouetplus-store .jp-nav {
  position: absolute;
  top: 50%;
  z-index: 10;
  width: 46px;
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  cursor: pointer;
  font-size: 24px;
  line-height: 1;
  transform: translateY(-50%);
}

body.jouetplus-store .jp-nav-prev { left: 18px; }
body.jouetplus-store .jp-nav-next { right: 18px; }

body.jouetplus-store .jp-dots {
  position: absolute;
  bottom: 22px;
  left: calc((100vw - min(1180px, calc(100vw - 48px))) / 2);
  z-index: 10;
  display: flex;
  gap: 8px;
}

body.jouetplus-store .jp-dot {
  width: 8px;
  height: 8px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.34);
  cursor: pointer;
  transition: width 0.35s ease, background 0.25s ease;
}

body.jouetplus-store .jp-dot.active {
  width: 28px;
  background: var(--jp-yellow);
}

body.jouetplus-store .jp-progress {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 10;
  height: 3px;
  background: var(--jp-yellow);
  opacity: 0.9;
}

body.jouetplus-store.home .entry-content > .wp-block-html:first-child,
body.jouetplus-store.home .jp-slider-root {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

body.jouetplus-store .jp-slider-root {
  margin-top: 0 !important;
  border-bottom: 1px solid var(--jp-line);
}

body.jouetplus-store .jp-slide {
  height: clamp(390px, 45vw, 590px) !important;
}

body.jouetplus-store .jp-slide-content {
  width: min(1180px, calc(100% - 48px));
  margin-inline: auto;
  padding: 92px 0 54px !important;
}

body.jouetplus-store .jp-title {
  font-size: clamp(32px, 4vw, 56px) !important;
  letter-spacing: 0 !important;
}

body.jouetplus-store .jp-desc {
  font-size: clamp(15px, 1.4vw, 18px) !important;
}

body.jouetplus-store .jp-btn-primary,
body.jouetplus-store .jp-btn-secondary {
  border-radius: var(--jp-radius) !important;
}

/* Homepage sections */
body.jouetplus-store.home .entry-content {
  width: min(1180px, calc(100% - 32px));
  margin-inline: auto;
}

body.jouetplus-store.home .jp-home-section {
  padding: clamp(34px, 6vw, 72px) 0;
  border-bottom: 1px solid rgba(231, 237, 245, 0.85);
}

body.jouetplus-store.home .jp-home-section h2,
body.jouetplus-store.home .entry-content > h2.wp-block-heading {
  margin: 0 0 24px;
  color: var(--jp-ink);
  font-size: clamp(24px, 3vw, 36px);
  line-height: 1.2;
  letter-spacing: 0;
}

body.jouetplus-store.home .jp-section-intro {
  display: none !important;
}

body.jouetplus-store .woocommerce ul.products {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
}

body.jouetplus-store .woocommerce.columns-3 ul.products {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.jouetplus-store .woocommerce ul.products::before,
body.jouetplus-store .woocommerce ul.products::after {
  display: none;
}

body.jouetplus-store .woocommerce ul.products li.product,
body.jouetplus-store .woocommerce-page ul.products li.product,
body.jouetplus-store .woocommerce ul.products li.product-category {
  width: auto !important;
  margin: 0 !important;
  float: none !important;
  border: 1px solid var(--jp-line);
  border-radius: var(--jp-radius);
  background: var(--jp-card);
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(20, 35, 60, 0.06);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

body.jouetplus-store .woocommerce ul.products li.product:hover,
body.jouetplus-store .woocommerce ul.products li.product-category:hover {
  transform: translateY(-4px);
  border-color: rgba(37, 99, 235, 0.22);
  box-shadow: var(--jp-shadow);
}

body.jouetplus-store .woocommerce ul.products li.product a img,
body.jouetplus-store .woocommerce ul.products li.product-category a img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  margin: 0;
  background: var(--jp-soft);
}

body.jouetplus-store .woocommerce-loop-product__title,
body.jouetplus-store .woocommerce-loop-category__title {
  padding: 16px 16px 6px !important;
  color: var(--jp-ink);
  font-size: 1rem !important;
  font-weight: 850;
  line-height: 1.35;
  letter-spacing: 0;
}

body.jouetplus-store .woocommerce-loop-category__title .count {
  display: none;
}

body.jouetplus-store .woocommerce ul.products li.product .price {
  display: block;
  padding: 0 16px 14px;
  color: var(--jp-red);
  font-weight: 900;
}

body.jouetplus-store .woocommerce ul.products li.product .button {
  margin: 0 16px 18px;
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--jp-radius);
  background: var(--jp-blue);
  color: #fff;
  font-weight: 850;
}

body.jouetplus-store .woocommerce ul.products li.product .button:hover {
  background: #1d4ed8;
  color: #fff;
}

body.jouetplus-store .jp-service-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
}

body.jouetplus-store .jp-service-card {
  padding: 24px;
  border: 1px solid var(--jp-line);
  border-radius: var(--jp-radius);
  background: linear-gradient(180deg, #fff 0%, #f8fbff 100%);
  box-shadow: 0 10px 28px rgba(20, 35, 60, 0.05);
}

body.jouetplus-store .jp-service-card h3 {
  margin: 0 0 8px;
  font-size: 1.05rem;
  letter-spacing: 0;
}

body.jouetplus-store .jp-service-card p {
  margin: 0;
  color: var(--jp-muted);
}

/* WooCommerce detail pages */
body.jouetplus-store .entry-title,
body.jouetplus-store .woocommerce-products-header__title {
  color: var(--jp-ink);
  letter-spacing: 0;
}

body.jouetplus-store .woocommerce div.product div.images img {
  border-radius: var(--jp-radius);
  background: var(--jp-soft);
}

body.jouetplus-store .woocommerce div.product .summary {
  padding: clamp(18px, 3vw, 30px);
  border: 1px solid var(--jp-line);
  border-radius: var(--jp-radius);
  background: #fff;
  box-shadow: 0 10px 34px rgba(20, 35, 60, 0.06);
}

body.jouetplus-store .woocommerce div.product p.price,
body.jouetplus-store .woocommerce div.product span.price {
  color: var(--jp-red);
  font-weight: 900;
}

/* Footer */
body.jouetplus-store footer.site-footer {
  display: none !important;
}

.jouetplus-footer {
  margin-top: 64px;
  background: var(--jp-footer);
  color: #d8dee9;
}

.jouetplus-footer a {
  color: #d8dee9;
  text-decoration: none;
}

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

.jouetplus-footer__inner {
  width: min(1180px, calc(100% - 32px));
  margin-inline: auto;
  display: grid;
  grid-template-columns: 1.4fr repeat(4, 1fr);
  gap: 30px;
  padding: 54px 0 38px;
}

.jouetplus-footer__logo {
  display: inline-flex;
  margin-bottom: 16px;
  padding: 8px;
  border-radius: var(--jp-radius);
  background: #fff;
}

.jouetplus-footer__brand img {
  display: block;
  max-width: 190px;
  max-height: 72px;
  width: auto;
  height: auto;
}

.jouetplus-footer__brand p {
  max-width: 320px;
  color: #aab4c3;
  line-height: 1.7;
}

.jouetplus-footer h2 {
  margin: 0 0 14px;
  color: #fff;
  font-size: 1rem;
  letter-spacing: 0;
}

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

.jouetplus-footer li {
  margin: 9px 0;
}

.jouetplus-footer__social {
  display: flex;
  gap: 10px;
  margin-top: 18px;
}

.jouetplus-footer__social a {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
}

.jouetplus-footer__social svg {
  width: 19px;
  height: 19px;
  fill: currentColor;
}

.jouetplus-footer__bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.jouetplus-footer__bottom-inner {
  width: min(1180px, calc(100% - 32px));
  margin-inline: auto;
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 0;
  color: #aab4c3;
  font-size: 0.92rem;
}

/* Social Chat / WhatsApp visual integration */
.qlwapp,
.joinchat,
.wa__btn_popup,
.social-chat-button {
  z-index: 9999 !important;
}

.qlwapp.qlwapp-bottom-right,
.joinchat--right,
.wa__btn_popup,
.social-chat-button {
  right: 22px !important;
  bottom: 22px !important;
}

@media (max-width: 980px) {
  body.jouetplus-store .woocommerce ul.products,
  body.jouetplus-store .woocommerce.columns-3 ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.jouetplus-store .jp-service-grid,
  .jouetplus-footer__inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  body.jouetplus-store .custom-logo-link img,
  body.jouetplus-store .site-logo-img img {
    max-height: 56px;
  }

  body.jouetplus-store .ast-mobile-popup-drawer .main-header-menu .menu-link,
  body.jouetplus-store .main-header-bar-navigation .main-header-menu .menu-link {
    min-height: 46px;
    justify-content: flex-start;
    border-radius: 0;
    box-shadow: none;
  }

  body.jouetplus-store header a.menu-link[href$="/panier/"],
  body.jouetplus-store header a.menu-link[href$="/mon-compte/"] {
    width: 44px;
    min-width: 44px;
    height: 44px;
    margin: 8px 10px;
  }

  body.jouetplus-store .jp-slide {
    height: 440px !important;
    align-items: flex-end !important;
  }

  body.jouetplus-store .jp-slide-content {
    width: min(100% - 28px, 1180px);
    padding: 0 0 54px !important;
  }

  body.jouetplus-store .jp-badge {
    font-size: 10px !important;
    margin-bottom: 12px !important;
  }

  body.jouetplus-store .jp-title {
    font-size: 30px !important;
  }

  body.jouetplus-store .jp-desc {
    max-width: 92%;
    font-size: 14px !important;
  }
}

@media (max-width: 640px) {
  body.jouetplus-store.home .entry-content {
    width: min(100% - 24px, 1180px);
  }

  body.jouetplus-store .woocommerce ul.products,
  body.jouetplus-store .woocommerce.columns-3 ul.products,
  body.jouetplus-store .jp-service-grid,
  .jouetplus-footer__inner {
    grid-template-columns: 1fr;
  }

  body.jouetplus-store .woocommerce ul.products {
    gap: 16px;
  }

  .jouetplus-footer__inner {
    width: min(100% - 24px, 1180px);
    padding-top: 40px;
  }

  .jouetplus-footer__bottom-inner {
    width: min(100% - 24px, 1180px);
    flex-direction: column;
  }

  .qlwapp.qlwapp-bottom-right,
  .joinchat--right,
  .wa__btn_popup,
  .social-chat-button {
    right: 14px !important;
    bottom: 14px !important;
  }
}


/* JouetPlus UX corrections - 2026-06-13 */
body.jouetplus-store .site-header,
body.jouetplus-store .ast-primary-header-bar {
  background: rgba(255, 255, 255, 0.98) !important;
}

body.jouetplus-store .custom-logo-link img,
body.jouetplus-store .site-logo-img img {
  max-height: 78px;
}

body.jouetplus-store .main-header-menu > .menu-item > .menu-link {
  min-height: 46px;
  padding-inline: 14px;
  color: #1f2937;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0;
  border-radius: 999px;
}

body.jouetplus-store .main-header-menu > .menu-item:hover > .menu-link,
body.jouetplus-store .main-header-menu > .current-menu-item > .menu-link {
  color: var(--jp-blue);
  background: rgba(37, 99, 235, 0.07);
}

body.jouetplus-store header a.menu-link[href$="/panier/"],
body.jouetplus-store header a.menu-link[href$="/mon-compte/"] {
  width: 44px;
  min-width: 44px;
  height: 44px;
  border: 1px solid rgba(23, 32, 51, 0.11);
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  box-shadow: 0 9px 22px rgba(20, 35, 60, 0.08);
}

body.jouetplus-store header a.menu-link[href$="/panier/"]::before,
body.jouetplus-store header a.menu-link[href$="/mon-compte/"]::before {
  width: 21px;
  height: 21px;
  background: #111827;
}

body.jouetplus-store header a.menu-link[href$="/panier/"]::before {
  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7.2 8.2V7a4.8 4.8 0 0 1 9.6 0v1.2H19a2 2 0 0 1 2 2.18l-.72 8A4 4 0 0 1 16.3 22H7.7a4 4 0 0 1-3.98-3.62l-.72-8A2 2 0 0 1 5 8.2h2.2Zm2 0h5.6V7a2.8 2.8 0 0 0-5.6 0v1.2Zm-4.2 2 .71 7.99A2 2 0 0 0 7.7 20h8.6a2 2 0 0 0 1.99-1.81L19 10.2H5Z"/></svg>');
  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7.2 8.2V7a4.8 4.8 0 0 1 9.6 0v1.2H19a2 2 0 0 1 2 2.18l-.72 8A4 4 0 0 1 16.3 22H7.7a4 4 0 0 1-3.98-3.62l-.72-8A2 2 0 0 1 5 8.2h2.2Zm2 0h5.6V7a2.8 2.8 0 0 0-5.6 0v1.2Zm-4.2 2 .71 7.99A2 2 0 0 0 7.7 20h8.6a2 2 0 0 0 1.99-1.81L19 10.2H5Z"/></svg>');
}

body.jouetplus-store header a.menu-link[href$="/mon-compte/"]::before {
  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 12.2a5.1 5.1 0 1 0 0-10.2 5.1 5.1 0 0 0 0 10.2Zm0-8.2a3.1 3.1 0 1 1 0 6.2A3.1 3.1 0 0 1 12 4Zm0 10.1c-4.7 0-8.4 2.55-8.4 5.8V21a1 1 0 0 0 1 1h14.8a1 1 0 0 0 1-1v-1.1c0-3.25-3.7-5.8-8.4-5.8Zm-6.4 5.8c0-1.86 2.73-3.8 6.4-3.8s6.4 1.94 6.4 3.8v.1H5.6v-.1Z"/></svg>');
  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 12.2a5.1 5.1 0 1 0 0-10.2 5.1 5.1 0 0 0 0 10.2Zm0-8.2a3.1 3.1 0 1 1 0 6.2A3.1 3.1 0 0 1 12 4Zm0 10.1c-4.7 0-8.4 2.55-8.4 5.8V21a1 1 0 0 0 1 1h14.8a1 1 0 0 0 1-1v-1.1c0-3.25-3.7-5.8-8.4-5.8Zm-6.4 5.8c0-1.86 2.73-3.8 6.4-3.8s6.4 1.94 6.4 3.8v.1H5.6v-.1Z"/></svg>');
}

body.jouetplus-store header a.menu-link[href$="/panier/"]:hover,
body.jouetplus-store header a.menu-link[href$="/mon-compte/"]:hover {
  background: linear-gradient(180deg, #fbbf24 0%, #f59e0b 100%);
  border-color: rgba(245, 158, 11, 0.55);
  box-shadow: 0 12px 26px rgba(245, 158, 11, 0.25);
}

body.jouetplus-store .jp-slide-bg {
  background-repeat: no-repeat;
}

body.jouetplus-store .jp-service-card {
  min-height: 190px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 28px;
  background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
  box-shadow: 0 16px 36px rgba(20, 35, 60, 0.08);
}

body.jouetplus-store .jp-service-card::before {
  content: "";
  width: 46px;
  height: 46px;
  margin-bottom: 18px;
  border-radius: 14px;
  background-color: var(--jp-blue);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 25px;
  box-shadow: 0 12px 24px rgba(37, 99, 235, 0.22);
}

body.jouetplus-store .jp-service-card:nth-child(1)::before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" viewBox="0 0 24 24"><path d="M3 7h11v10H3z"/><path d="M14 10h4l3 3v4h-7z"/><circle cx="7" cy="18" r="2"/><circle cx="18" cy="18" r="2"/></svg>');
}

body.jouetplus-store .jp-service-card:nth-child(2)::before {
  background-color: var(--jp-green);
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="14" rx="2"/><path d="M3 10h18"/><path d="M7 15h4"/></svg>');
  box-shadow: 0 12px 24px rgba(22, 163, 74, 0.2);
}

body.jouetplus-store .jp-service-card:nth-child(3)::before {
  background-color: #8b5cf6;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" viewBox="0 0 24 24"><path d="M4 13a8 8 0 0 1 16 0"/><path d="M4 13v4a2 2 0 0 0 2 2h2v-8H6a2 2 0 0 0-2 2Z"/><path d="M20 13v4a2 2 0 0 1-2 2h-2v-8h2a2 2 0 0 1 2 2Z"/></svg>');
  box-shadow: 0 12px 24px rgba(139, 92, 246, 0.2);
}

body.jouetplus-store .jp-service-card h3 {
  margin-bottom: 10px;
  font-weight: 750;
}

.jouetplus-footer__inner { align-items: start; }
.jouetplus-footer__brand { display: flex; flex-direction: column; align-items: flex-start; }
.jouetplus-footer__brand h2,
.jouetplus-footer section h2 { margin-top: 0; min-height: 24px; }
.jouetplus-footer__logo { margin-top: 0; }

@media (max-width: 921px) {
  body.jouetplus-store .ast-mobile-popup-drawer,
  body.jouetplus-store .ast-mobile-popup-inner,
  body.jouetplus-store .ast-mobile-popup-content {
    background: #ffffff !important;
    color: #172033 !important;
  }

  body.jouetplus-store .ast-mobile-popup-drawer .menu-link,
  body.jouetplus-store .main-header-bar-navigation .menu-link {
    color: #172033 !important;
    background: transparent !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.35;
  }

  body.jouetplus-store .ast-mobile-popup-drawer .menu-link:hover,
  body.jouetplus-store .main-header-bar-navigation .menu-link:hover {
    color: var(--jp-blue) !important;
    background: rgba(37, 99, 235, 0.07) !important;
  }

  body.jouetplus-store .menu-toggle,
  body.jouetplus-store .ast-mobile-menu-trigger-minimal {
    color: #172033 !important;
  }

  body.jouetplus-store .ast-mobile-popup-drawer a.menu-link[href$="/panier/"],
  body.jouetplus-store .ast-mobile-popup-drawer a.menu-link[href$="/mon-compte/"],
  body.jouetplus-store .main-header-bar-navigation a.menu-link[href$="/panier/"],
  body.jouetplus-store .main-header-bar-navigation a.menu-link[href$="/mon-compte/"] {
    width: calc(100% - 24px) !important;
    min-width: 0;
    height: 48px;
    margin: 6px 12px;
    padding: 0 14px !important;
    justify-content: flex-start;
    gap: 12px;
    border-radius: 8px;
    color: #172033 !important;
    font-size: 16px !important;
    box-shadow: none;
  }

  body.jouetplus-store .ast-mobile-popup-drawer a.menu-link[href$="/panier/"]::before,
  body.jouetplus-store .ast-mobile-popup-drawer a.menu-link[href$="/mon-compte/"]::before,
  body.jouetplus-store .main-header-bar-navigation a.menu-link[href$="/panier/"]::before,
  body.jouetplus-store .main-header-bar-navigation a.menu-link[href$="/mon-compte/"]::before {
    flex: 0 0 21px;
    margin-right: 8px;
    background: #172033;
  }
}

@media (max-width: 768px) {
  body.jouetplus-store .custom-logo-link img,
  body.jouetplus-store .site-logo-img img { max-height: 62px; }
  body.jouetplus-store .jp-slide { height: min(86vh, 500px) !important; }
  body.jouetplus-store .jp-slide-bg { background-size: contain; background-position: center top; background-color: #0d0a2e; }
  body.jouetplus-store .jp-slide-content { width: min(100% - 28px, 1180px); padding-bottom: 44px !important; }
  body.jouetplus-store .jp-title { font-size: 28px !important; }
  body.jouetplus-store .jp-btn-primary,
  body.jouetplus-store .jp-btn-secondary { min-height: 42px; padding-inline: 16px; font-size: 14px; }
}

@media (max-width: 640px) {
  body.jouetplus-store .jp-section-categories .woocommerce ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  body.jouetplus-store .jp-section-categories .woocommerce ul.products li.product-category { min-height: 100%; }
  body.jouetplus-store .jp-section-categories .woocommerce ul.products li.product-category a { height: 100%; display: flex; flex-direction: column; }
  body.jouetplus-store .jp-section-categories .woocommerce-loop-category__title { min-height: 64px; display: flex; align-items: center; padding: 12px !important; font-size: 0.94rem !important; }
  body.jouetplus-store .jp-service-card { min-height: 0; padding: 22px; }
  .jouetplus-footer__inner { gap: 26px; }
  .jouetplus-footer,
  .jouetplus-footer * { max-width: 100%; }
}

/* Correction alignement footer JouetPlus */
.jouetplus-footer__inner {
  width: min(1180px, calc(100% - 32px));
  margin-inline: auto;
  display: grid;
  grid-template-columns: 1.15fr 1fr 1fr 1fr 1fr;
  gap: 46px;
  align-items: start;
  padding: 54px 0 38px;
}

.jouetplus-footer__brand {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-top: 0;
}

.jouetplus-footer__logo {
  margin: 0 0 14px 0;
  padding: 0;
  background: transparent;
  border-radius: 0;
}

.jouetplus-footer__brand img {
  max-width: 170px;
  max-height: 70px;
  width: auto;
  height: auto;
  display: block;
}

.jouetplus-footer__brand h2,
.jouetplus-footer section h2 {
  margin: 0 0 18px 0;
  min-height: auto;
  color: #fff;
  font-size: 1rem;
  font-weight: 800;
}

.jouetplus-footer__brand p {
  max-width: 260px;
  margin: 0;
  color: #aab4c3;
  line-height: 1.65;
}

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

.jouetplus-footer li {
  margin: 0 0 14px 0;
}

@media (max-width: 980px) {
  .jouetplus-footer__inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px;
  }
}

@media (max-width: 640px) {
  .jouetplus-footer__inner {
    grid-template-columns: 1fr;
    width: min(100% - 24px, 1180px);
    gap: 26px;
    padding-top: 40px;
  }

  .jouetplus-footer__brand img {
    max-width: 160px;
  }
}

/* Footer - aligner la colonne logo avec les autres colonnes */
.jouetplus-footer__brand {
  margin-top: -8px !important;
}

.jouetplus-footer__logo {
  margin-bottom: 8px !important;
}

.jouetplus-footer__brand img {
  max-width: 185px !important;
}

.jouetplus-footer__brand h2 {
  margin-top: 0 !important;
  margin-bottom: 18px !important;
}

.jouetplus-footer__inner {
  align-items: start !important;
}

.jouetplus-footer__brand p {
    display: none !important;
}

/* Masquer le titre A propos */
.jouetplus-footer__brand h2{
    display:none !important;
}

/* Masquer le texte sous le logo */
.jouetplus-footer__brand p{
    display:none !important;
}

/* Footer plus équilibré */
.jouetplus-footer__inner{
    grid-template-columns: repeat(5,1fr) !important;
    gap:50px !important;
    align-items:start !important;
}

/* Centrer visuellement le logo */
.jouetplus-footer__brand{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
}

.jouetplus-footer__logo{
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
}

.jouetplus-footer__brand img{
    max-width:180px !important;
}

/* Titres colonnes */
.jouetplus-footer section h2{
    font-size:16px !important;
    font-weight:700 !important;
    margin-bottom:20px !important;
}

/* Liens */
.jouetplus-footer li{
    margin-bottom:14px !important;
}

.jouetplus-footer a{
    color:#d8dee9 !important;
}

.jouetplus-footer a:hover{
    color:#ffffff !important;
}

/* Cartes services JouetPlus */

.jp-service-card{
    text-align:center !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:240px !important;
    border:none !important;
    border-radius:20px !important;
    transition:all .3s ease !important;
}

/* Icônes centrées */
.jp-service-card::before{
    margin:0 auto 20px auto !important;
}

/* Titre */
.jp-service-card h3{
    width:100%;
    text-align:center !important;
    margin-bottom:12px !important;
    color:#fff !important;
    font-size:24px !important;
    font-weight:700 !important;
}

/* Texte */
.jp-service-card p{
    width:100%;
    text-align:center !important;
    color:rgba(255,255,255,.9) !important;
    font-size:16px !important;
    line-height:1.6 !important;
}

/* Livraison */
.jp-service-card:nth-child(1){
    background:linear-gradient(135deg,#2563eb,#60a5fa) !important;
}

/* Paiement */
.jp-service-card:nth-child(2){
    background:linear-gradient(135deg,#16a34a,#4ade80) !important;
}

/* Support */
.jp-service-card:nth-child(3){
    background:linear-gradient(135deg,#8b5cf6,#c084fc) !important;
}

/* Effet hover */
.jp-service-card:hover{
    transform:translateY(-8px) !important;
    box-shadow:0 20px 40px rgba(0,0,0,.20) !important;
}

/* Slider plus discret et premium */

.jp-slide{
    height: 420px !important;
}

.jp-slide-content{
    padding: 60px 0 40px !important;
}

.jp-title{
    font-size: 42px !important;
    line-height: 1.15 !important;
}

.jp-desc{
    font-size: 16px !important;
    max-width: 420px !important;
}

.jp-slide-bg::after{
    background: rgba(0,0,0,.35) !important;
}

/* Masquer les flèches */
.jp-nav{
    display:none !important;
}

/* Points plus élégants */
.jp-dots{
    bottom:20px !important;
}

.jp-dot{
    width:10px !important;
    height:10px !important;
    background:rgba(255,255,255,.4) !important;
}

.jp-dot.active{
    width:28px !important;
    background:#fbbf24 !important;
}

/* Boutons plus discrets */
.jp-btn-primary,
.jp-btn-secondary{
    min-height:42px !important;
    font-size:14px !important;
    padding:0 18px !important;
}

@media(max-width:768px){

    .jp-slide{
        height:360px !important;
    }

    .jp-title{
        font-size:28px !important;
    }

    .jp-desc{
        font-size:14px !important;
    }

    .jp-btn-primary,
    .jp-btn-secondary{
        display:none !important;
    }
}

/* Correction slider mobile JouetPlus */
@media (max-width: 768px){

  html, body{
    overflow-x:hidden !important;
  }

  .jp-slider-root{
    width:100vw !important;
    max-width:100vw !important;
    overflow:hidden !important;
    margin-left:calc(50% - 50vw) !important;
    margin-right:calc(50% - 50vw) !important;
  }

  .jp-track{
    width:100% !important;
    max-width:100% !important;
  }

  .jp-slide{
    min-width:100% !important;
    width:100% !important;
    height:360px !important;
    overflow:hidden !important;
    display:flex !important;
    align-items:center !important;
  }

  .jp-slide-bg{
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    background-size:cover !important;
    background-position:center center !important;
  }

  .jp-slide-content{
    width:calc(100% - 32px) !important;
    max-width:calc(100% - 32px) !important;
    margin:0 auto !important;
    padding:0 !important;
  }

  .jp-title{
    font-size:26px !important;
    line-height:1.15 !important;
    max-width:280px !important;
  }

  .jp-desc{
    font-size:14px !important;
    line-height:1.5 !important;
    max-width:300px !important;
  }

  .jp-badge{
    font-size:10px !important;
    max-width:max-content !important;
  }

  .jp-nav{
    display:none !important;
  }

  .jp-dots{
    left:24px !important;
    bottom:18px !important;
  }
}

/* ===== JOUPETPLUS PREMIUM SLIDER ===== */

.jp-slider-root{
    position:relative;
    overflow:hidden;
    border-radius:0 0 30px 30px;
}

.jp-slide{
    height:520px !important;
}

.jp-slide-bg{
    background-size:cover !important;
    background-position:center center !important;
    transform:scale(1.02);
}

.jp-slide-bg::after{
    content:'';
    position:absolute;
    inset:0;
    background:linear-gradient(
        90deg,
        rgba(4,8,25,.75) 0%,
        rgba(4,8,25,.45) 45%,
        rgba(4,8,25,.15) 100%
    ) !important;
}

.jp-slide-content{
    width:min(1180px,calc(100% - 40px));
    margin:auto;
}

.jp-badge{
    background:rgba(255,193,7,.15) !important;
    border:1px solid rgba(255,193,7,.35) !important;
    color:#FFC107 !important;
    backdrop-filter:blur(10px);
}

.jp-title{
    font-size:64px !important;
    font-weight:900 !important;
    line-height:1.05 !important;
    max-width:650px !important;
    color:#fff !important;
}

.jp-title span{
    color:#FFC107 !important;
}

.jp-desc{
    font-size:19px !important;
    line-height:1.7 !important;
    max-width:560px !important;
    color:rgba(255,255,255,.92) !important;
}

.jp-btn-primary{
    background:#FFC107 !important;
    color:#111827 !important;
    border:none !important;
    border-radius:12px !important;
    font-weight:800 !important;
}

.jp-btn-primary:hover{
    transform:translateY(-2px);
}

.jp-dots{
    bottom:30px !important;
}

.jp-dot{
    width:12px !important;
    height:12px !important;
    border-radius:999px !important;
    background:rgba(255,255,255,.35) !important;
}

.jp-dot.active{
    width:34px !important;
    background:#FFC107 !important;
}

.jp-nav{
    width:48px !important;
    height:48px !important;
    border-radius:999px !important;
    background:rgba(255,255,255,.15) !important;
    backdrop-filter:blur(8px);
}

/* ===== MOBILE ===== */

@media(max-width:768px){

    .jp-slide{
        height:420px !important;
    }

    .jp-slide-bg{
        background-position:center center !important;
    }

    .jp-slide-bg::after{
        background:linear-gradient(
            180deg,
            rgba(0,0,0,.15) 0%,
            rgba(0,0,0,.55) 55%,
            rgba(0,0,0,.82) 100%
        ) !important;
    }

    .jp-slide-content{
        width:calc(100% - 30px) !important;
        padding-bottom:55px !important;
    }

    .jp-title{
        font-size:34px !important;
        line-height:1.1 !important;
        max-width:320px !important;
    }

    .jp-desc{
        font-size:15px !important;
        max-width:320px !important;
    }

    .jp-nav{
        display:none !important;
    }

    .jp-btn-primary,
    .jp-btn-secondary{
        display:none !important;
    }
}

/* Nouveau slider avec sl1 sl2 sl3 */
.jp-slide:nth-child(1) .jp-slide-bg{
  background-image:url('https://jouetplus.ma/wp/wp-content/uploads/2026/06/sl1.jpg') !important;
}

.jp-slide:nth-child(2) .jp-slide-bg{
  background-image:url('https://jouetplus.ma/wp/wp-content/uploads/2026/06/sl2.jpg') !important;
}

.jp-slide:nth-child(3) .jp-slide-bg{
  background-image:url('https://jouetplus.ma/wp/wp-content/uploads/2026/06/sl3.jpg') !important;
}

/* Ajustement propre desktop/mobile */
.jp-slide{
  height:430px !important;
}

.jp-slide-bg{
  background-size:cover !important;
  background-position:center !important;
}

.jp-slide-bg::after{
  background:rgba(0,0,0,.08) !important;
}

.jp-slide-content,
.jp-badge,
.jp-title,
.jp-desc,
.jp-btns{
  display:none !important;
}

.jp-nav{
  display:none !important;
}

@media(max-width:768px){
  .jp-slide{
    height:230px !important;
  }

  .jp-slide-bg{
    background-size:cover !important;
    background-position:center !important;
  }
}
