/*
Theme Name: Marduino
Theme URI: https://marduino.ma/
Author: Muse for the store owner
Author URI: https://marduino.ma/
Description: Marduino is a modern, lightweight and fast WooCommerce theme built for Moroccan electronics and smart-home stores. Clean marketplace-style design, full RTL support, translation-ready (Arabic/French), AJAX cart drawer, wishlist without plugins, and a conversion-focused homepage.
Version: 1.3.9.24
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: marduino
Tags: woocommerce, rtl-language-support, translation-ready, custom-logo, custom-menu, featured-images, full-width-template, e-commerce, grid-layout, one-column, two-columns
*/

/* ============================================================
   MARDUINO 1.0.0 — base, tokens, layout
   Uses CSS logical properties throughout for automatic RTL.
   ============================================================ */
:root{
  --m-primary:#ff7a1a;
  --m-primary-dark:#e5660a;
  --m-navy:#0e2f57;
  --m-navy-dark:#0a2340;
  --m-ink:#1c2733;
  --m-muted:#66788c;
  --m-line:#e5ebf1;
  --m-bg:#ffffff;
  --m-bg-soft:#f4f7fb;
  --m-success:#1faa55;
  --m-danger:#e5484d;
  --m-star:#f5a623;
  --m-teal:#0d9488;
  --m-teal-dark:#0b7d74;
  --m-radius:12px;
  --m-radius-sm:8px;
  --m-shadow:0 8px 24px rgba(14,47,87,.10);
  --m-shadow-lg:0 16px 40px rgba(14,47,87,.16);
  --m-font:"Cairo","Segoe UI",Tahoma,Arial,"Noto Kufi Arabic",sans-serif;
  --m-container:1240px;
  /* v1.3.5: contained product sections (1240px); header/nav/hero stay full-width via overrides below */
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--m-font);
  color:var(--m-ink);
  background:var(--m-page-bg,var(--m-bg));
  line-height:1.7;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto}
a{color:var(--m-navy);text-decoration:none}
a:hover{color:var(--m-primary)}
button,input,select,textarea{font-family:inherit;font-size:1rem}
h1,h2,h3,h4{line-height:1.4;margin:0 0 .6em}
p{margin:0 0 1em}
.container{max-width:var(--m-container);margin-inline:auto;padding-inline:20px}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Buttons */
.m-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  background:var(--m-btn-bg,var(--m-primary));color:var(--m-btn-text,#fff);border:0;border-radius:999px;
  padding:.75em 1.8em;font-weight:700;cursor:pointer;line-height:1.4;transition:background .15s,transform .15s,filter .15s}
.m-btn:hover{background:var(--m-btn-bg,var(--m-primary));color:var(--m-btn-text,#fff);filter:brightness(.92);transform:translateY(-1px)}
.m-btn--navy{background:var(--m-navy)}
.m-btn--navy:hover{background:var(--m-navy-dark)}
.m-btn--ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.5)}
.m-btn--ghost:hover{background:rgba(255,255,255,.12);color:#fff}
.m-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}

/* ============================================================
   TOP UTILITY BAR
   ============================================================ */
.m-topbar{background:var(--m-navy-dark);color:#dbe7f5;font-size:.8rem}
.m-topbar__inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:.45rem}
.m-topbar__announce{display:flex;align-items:center;gap:.5em;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m-topbar__links{display:flex;align-items:center;gap:1.1rem}
.m-topbar__links a{color:#dbe7f5;display:inline-flex;align-items:center;gap:.4em}
.m-topbar__links a:hover{color:#ffb27a}
.m-topbar__links svg{width:14px;height:14px}
@media(max-width:720px){.m-topbar__links .m-hide-m{display:none}}

/* ============================================================
   STICKY HEADER
   ============================================================ */
.m-header{position:sticky;top:0;z-index:200;background:var(--m-header-bg,var(--m-bg));border-bottom:1px solid var(--m-line);box-shadow:0 2px 12px rgba(14,47,87,.06)}
.m-header__inner{display:flex;align-items:center;gap:1.25rem;padding-block:var(--m-header-py,.8rem)}
.m-logo{display:flex;align-items:center;gap:.65rem;flex:none}
body.m-hide-logo-scroll .m-logo{transition:opacity .25s ease,max-width .3s ease,margin .3s ease;max-width:240px;overflow:hidden}
body.m-hide-logo-scroll.is-scrolled .m-logo{opacity:0;max-width:0;margin-inline-end:-1.25rem;pointer-events:none}
.m-logo .custom-logo-link{display:inline-flex;line-height:0}.m-logo img{max-height:var(--m-logo-h,30px);width:auto;height:auto}
.m-logo__mark{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,var(--m-navy),#1b5faa);
  display:inline-flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:1.35rem;flex:none}
.m-logo__text{line-height:1.2}
.m-logo__text b{font-size:1.3rem;font-weight:800;display:block}
.m-logo__text small{color:var(--m-muted);font-size:.7rem;font-weight:600;letter-spacing:.04em}

/* Search */
.m-search{flex:1;display:flex;min-width:0;border:2px solid var(--m-navy);border-radius:999px;overflow:hidden;background:#fff}
.m-search input{flex:1;border:0;outline:0;padding:.65em 1.2em;min-width:0;background:transparent}
.m-search button{border:0;background:var(--m-primary);color:#fff;font-weight:700;padding-inline:1.6em;cursor:pointer;
  display:inline-flex;align-items:center;gap:.5em}
.m-search button:hover{background:var(--m-primary-dark)}
.m-search button svg{width:16px;height:16px}

/* Header actions */
.m-actions{display:flex;align-items:center;gap:.4rem;flex:none}
.m-action{position:relative;display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:50%;color:var(--m-ink);border:1px solid transparent;background:transparent;cursor:pointer}
.m-action:hover{background:var(--m-bg-soft);border-color:var(--m-line);color:var(--m-primary)}
.m-action svg{width:22px;height:22px}
.m-action__count{position:absolute;top:2px;inset-inline-end:0;min-width:19px;height:19px;border-radius:999px;
  background:var(--m-primary);color:#fff;font-size:.68rem;font-weight:800;display:inline-flex;align-items:center;justify-content:center;padding-inline:4px}
.m-action--wishlist.active svg{fill:var(--m-danger);stroke:var(--m-danger)}

/* Category nav row */
.m-catsnav{background:var(--m-navy);color:#fff}
.m-catsnav__inner{display:flex;align-items:center;gap:.25rem;overflow-x:auto;scrollbar-width:none}
.m-catsnav__inner::-webkit-scrollbar{display:none}
.m-catsnav a{color:#dbe7f5;font-size:.88rem;font-weight:600;padding:.7em 1em;white-space:nowrap;border-bottom:3px solid transparent}
.m-catsnav a:hover{color:#fff;border-bottom-color:var(--m-primary)}
.m-catsnav .menu{display:flex;list-style:none;margin:0;padding:0}
.m-catsnav .menu li{flex:none}

/* ============================================================
   v1.3.4: "All categories" dropdown (Marjane Mall style)
   ============================================================ */
.m-allcats{position:relative;flex:none}
.m-allcats__btn{display:flex;align-items:center;gap:.55em;background:var(--m-teal,#0d9488);color:#fff;
  border:0;border-radius:10px;padding:.62em 1.1em;font-weight:800;font-size:.9rem;cursor:pointer;white-space:nowrap}
.m-allcats__btn:hover{background:var(--m-teal-dark,#0b7d74)}
.m-allcats__btn svg{width:18px;height:18px}
.m-allcats__chev{transition:transform .2s}
.m-allcats__btn[aria-expanded="true"] .m-allcats__chev{transform:rotate(180deg)}
.m-allcats__panel{position:absolute;top:calc(100% + 8px);inset-inline-start:0;z-index:200;min-width:290px;max-width:92vw;
  max-height:min(70vh,560px);overflow:auto;background:var(--m-bg,#fff);border:1px solid var(--m-line);border-radius:14px;
  box-shadow:0 18px 50px rgba(10,35,64,.22);padding:.5rem}
.m-allcats__list{list-style:none;margin:0;padding:0}
.m-allcats__item{position:relative;border-radius:10px}
.m-allcats__item > a{display:flex;align-items:center;justify-content:space-between;gap:.6em;padding:.68em .9em;
  color:var(--m-ink);font-weight:600;font-size:.9rem;border-radius:10px}
.m-allcats__item > a:hover{background:var(--m-bg-soft);color:var(--m-teal-dark,#0b7d74)}
.m-allcats__item > a svg{width:15px;height:15px;color:var(--m-muted);flex:none}
.m-allcats__item .m-cat-name{display:inline-flex;align-items:center;gap:.55em}
.m-allcats__item .m-cat-name svg{width:20px;height:20px;color:var(--m-teal-dark,#0b7d74)}
.m-allcats__sub{display:none;list-style:none;margin:0;padding:.35rem;position:absolute;inset-inline-start:100%;top:0;
  min-width:230px;background:var(--m-bg,#fff);border:1px solid var(--m-line);border-radius:12px;box-shadow:0 14px 40px rgba(10,35,64,.18)}
[dir="rtl"] .m-allcats__sub{inset-inline-start:auto;inset-inline-end:100%}
.m-allcats__item:hover > .m-allcats__sub,.m-allcats__item:focus-within > .m-allcats__sub{display:block}
.m-allcats__sub a{display:block;padding:.55em .8em;color:var(--m-ink);font-size:.87rem;border-radius:8px}
.m-allcats__sub a:hover{background:var(--m-bg-soft);color:var(--m-teal-dark,#0b7d74)}
@media(max-width:900px){.m-allcats__panel{position:fixed;inset-inline:12px;top:auto;max-height:60vh}}

/* ============================================================
   v1.3.5: full-width TOP only (header/nav/hero) — product
   sections stay contained at 1240px. Fix categories dropdown
   stacking above hero slider.
   ============================================================ */
/* Header / topbar / nav span full viewport width */
.m-topbar .container,
.m-header .container,
.m-catsnav .container{max-width:100%}
/* Hero is full-bleed (background already is; content now too) */
.m-hero .container{max-width:100%}
/* Categories dropdown: stacking context above hero slider */
.m-catsnav{position:relative;z-index:500}
/* The old overflow-x:auto clipped the dropdown panel — keep menu
   scrollable instead, panel stays visible */
.m-catsnav__inner{overflow:visible}
.m-catsnav .menu{overflow-x:auto;max-width:100%;scrollbar-width:none}
.m-catsnav .menu::-webkit-scrollbar{display:none}
.m-allcats__panel{z-index:9999}

/* Mobile bar */
.m-mobilebar{display:none}
@media(max-width:900px){
  .m-header__inner{flex-wrap:wrap;gap:.7rem}
  .m-search{order:3;flex-basis:100%}
  .m-mobilebar{display:inline-flex}
}

/* ============================================================
   HERO SLIDER
   ============================================================ */
.m-hero{position:relative;background:linear-gradient(120deg,var(--m-navy-dark),var(--m-navy) 55%,#155a9e);color:#fff;overflow:hidden;border-radius:0}
.m-hero__track{display:flex;transition:transform .5s ease}
.m-hero__slide{flex:0 0 100%;min-width:0;position:relative}
.m-hero__slide--bg{padding:0;min-height:var(--m-hero-h,380px);display:block}
.m-hero__bg-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:760px){.m-hero__slide--bg{min-height:0}.m-hero__bg-img{position:relative;inset:auto;height:auto;object-fit:contain}}
.m-hero__slide-inner{display:grid;grid-template-columns:1.05fr .95fr;gap:2rem;align-items:center;padding-block:3rem;min-height:var(--m-hero-h,380px)}
.m-hero__kicker{display:inline-block;background:rgba(255,122,26,.16);border:1px solid rgba(255,122,26,.55);color:#ffb27a;
  font-size:.8rem;font-weight:700;padding:.35em 1em;border-radius:999px;margin-bottom:1rem}
.m-hero h2{font-size:clamp(1.7rem,4vw,2.8rem);font-weight:800;line-height:1.4;margin-bottom:.6rem}
.m-hero p{color:#c9d9ee;max-width:46ch;margin-bottom:1.5rem}
.m-hero__cta{display:flex;gap:.8rem;flex-wrap:wrap}
.m-hero__media{display:flex;justify-content:center}
.m-hero__media img{max-height:320px;object-fit:contain;filter:drop-shadow(0 18px 34px rgba(0,0,0,.35));border-radius:var(--m-radius)}
.m-hero__dots{position:absolute;bottom:1rem;inset-inline:0;display:flex;justify-content:center;gap:.5rem}
.m-hero__dots button{width:10px;height:10px;border-radius:999px;border:0;background:rgba(255,255,255,.35);cursor:pointer;padding:0}
.m-hero__dots button.active{background:var(--m-primary);width:28px}
.m-hero__arrow{position:absolute;top:50%;transform:translateY(-50%);inset-inline-start:1rem;z-index:2;
  width:42px;height:42px;border-radius:50%;border:0;background:rgba(255,255,255,.14);color:#fff;cursor:pointer;
  display:flex;align-items:center;justify-content:center}
.m-hero__arrow.next{inset-inline-start:auto;inset-inline-end:1rem}
.m-hero__arrow:hover{background:var(--m-primary)}
.m-hero__arrow svg{width:18px;height:18px}
@media(max-width:760px){.m-hero__slide-inner{grid-template-columns:1fr;min-height:0;padding-block:2rem}.m-hero__media{order:-1}.m-hero__media img{max-height:190px}}

/* ============================================================
   SECTION SHELL
   ============================================================ */
.m-section{padding-block:2.75rem}
.m-section--soft{background:var(--m-bg-soft)}
.m-sec-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.4rem}
.m-sec-head h2{font-size:1.45rem;font-weight:800;display:flex;align-items:center;gap:.6rem;margin:0}
.m-sec-head h2::before{content:"";width:6px;height:1.6em;border-radius:4px;background:var(--m-primary);flex:none}
.m-sec-head a.m-link{font-size:.88rem;font-weight:700;color:var(--m-primary)}

/* ============================================================
   CATEGORY TILES
   ============================================================ */
.m-tiles{display:grid;grid-template-columns:repeat(6,1fr);gap:.9rem}
.m-tile{background:var(--m-bg);border:1px solid var(--m-line);border-radius:var(--m-radius);padding:1.4rem .7rem;text-align:center;transition:transform .15s,box-shadow .15s,border-color .15s}
.m-tile:hover{transform:translateY(-4px);box-shadow:var(--m-shadow);border-color:var(--m-primary)}
.m-tile__img{width:64px;height:64px;margin-inline:auto;margin-bottom:.7rem;border-radius:16px;background:var(--m-bg-soft);
  display:flex;align-items:center;justify-content:center;overflow:hidden}
.m-tile__img img{width:100%;height:100%;object-fit:cover}
.m-tile b{display:block;font-size:.9rem}
.m-tile small{color:var(--m-muted);font-size:.75rem}
@media(max-width:900px){.m-tiles{grid-template-columns:repeat(3,1fr)}}

/* ============================================================
   FLASH DEALS + COUNTDOWN
   ============================================================ */
.m-flash{background:linear-gradient(120deg,#c2410c,var(--m-primary));border-radius:18px;color:#fff;padding:1.8rem}
.m-flash__head{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1.2rem}
.m-flash__head h2{margin:0;font-size:1.4rem;font-weight:800;display:flex;align-items:center;gap:.6rem}
.m-flash__head h2 svg{width:26px;height:26px}
.m-countdown{display:flex;gap:.5rem;direction:ltr}
.m-countdown div{background:rgba(0,0,0,.28);border-radius:10px;min-width:58px;text-align:center;padding:.45rem .3rem}
.m-countdown b{display:block;font-size:1.25rem;line-height:1.2}
.m-countdown small{font-size:.68rem;opacity:.85}
.m-flash .m-grid{--m-card-bg:rgba(255,255,255,.97)}

/* ============================================================
   PRODUCT GRID + CARD
   ============================================================ */
.m-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem}
@media(max-width:1024px){.m-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.m-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:.7rem}.m-grid>*{min-width:0}}
.m-card{position:relative;background:var(--m-bg,#fff);border:1px solid var(--m-line);border-radius:var(--m-radius);
  overflow:hidden;display:flex;flex-direction:column;transition:transform .15s,box-shadow .15s}
.m-card:hover{transform:translateY(-4px);box-shadow:var(--m-shadow-lg)}
.m-card__media{position:relative;aspect-ratio:1/.9;background:var(--m-bg-soft);background-size:cover!important;background-position:center center!important;background-repeat:no-repeat!important;display:flex;align-items:center;justify-content:center;overflow:hidden}
.m-card__media img{width:100%;height:100%;object-fit:cover}
.m-card__badges{position:absolute;top:.65rem;inset-inline-start:.65rem;display:flex;flex-direction:column;gap:.35rem;z-index:2}
.m-badge{font-size:.7rem;font-weight:800;color:#fff;padding:.25em .8em;border-radius:999px;background:var(--m-danger)}
.m-badge--new{background:var(--m-success)}
.m-badge--oos{background:#3a4552;letter-spacing:.02em}
.m-card:has(.m-badge--oos) .m-card__media img{filter:grayscale(.65);opacity:.65}
.m-wish{position:absolute;top:.6rem;inset-inline-end:.6rem;z-index:3;width:36px;height:36px;border-radius:50%;
  border:0;background:rgba(255,255,255,.95);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--m-muted);
  box-shadow:0 2px 8px rgba(0,0,0,.15)}
.m-wish svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}
.m-wish.active{color:var(--m-danger)}
.m-wish.active svg{fill:var(--m-danger);stroke:var(--m-danger)}
.m-card__body{padding:.95rem;display:flex;flex-direction:column;gap:.45rem;flex:1}
.m-card__cat{font-size:.72rem;color:var(--m-muted);font-weight:600}
.m-card__name{font-size:.95rem;font-weight:700;line-height:1.55;min-height:2.9em}
.m-card__name a{color:inherit}
.m-stars{color:var(--m-star);font-size:.82rem;letter-spacing:.12em}
.m-stars small{color:var(--m-muted);letter-spacing:0;font-size:.75rem}
.m-card__price{display:flex;align-items:baseline;gap:.55rem;margin-top:auto;padding-top:.3rem}
.m-card__price .price,.m-card__price b{font-size:1.15rem;font-weight:800;color:var(--m-navy)}
.m-card__price del,.m-card__price s{color:var(--m-muted);font-size:.85rem}
.m-card__add{margin-top:0;background:var(--m-navy);color:#fff;border:0;border-radius:10px;padding:.55em .9em;flex:1;
  font-size:.88rem;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5em;transition:background .15s}
.m-card__add:hover{background:var(--m-primary)}
.m-card__add svg{width:16px;height:16px}
.m-card__add.added{background:var(--m-success)}

/* ============================================================
   v1.3.4: Marjane Mall style product cards
   ============================================================ */
.m-badge--delivery{background:#f5820b;display:inline-flex;align-items:center;gap:.35em}
.m-badge--delivery svg{width:14px;height:14px}
.m-price--mm{display:flex;align-items:baseline;gap:.5rem;flex-wrap:wrap;margin-top:auto;padding-top:.3rem}
.m-price--mm .m-price__current{font-size:1.35rem;font-weight:800;color:var(--m-teal-dark,#0b7d74)}
.m-price--mm .m-price__current .woocommerce-Price-currencySymbol{font-size:.85em}
.m-price--mm .m-price__old{color:var(--m-muted);font-size:.82rem;text-decoration:line-through}
.m-price--mm .m-price__off{background:var(--m-danger);color:#fff;font-size:.72rem;font-weight:800;
  padding:.2em .65em;border-radius:999px}
.m-price--mm .price,.m-price--mm b{font-size:1.35rem;font-weight:800;color:var(--m-teal-dark,#0b7d74)}
.m-price--mm del,.m-price--mm s{color:var(--m-muted);font-size:.82rem}
/* ============================================================
   v1.3.5: consistent product card actions — Quick view, Compare
   and Add to cart ALL share the same round teal button style.
   Price sits next to the buttons in one clean row.
   ============================================================ */
.m-card__foot{display:flex;align-items:center;justify-content:space-between;gap:.6rem;
  margin-top:auto;padding-top:.55rem}
.m-card__foot .m-price--mm{margin:0;padding:0;flex:1;min-width:0}
.m-card__foot .m-actions--mm{margin:0;flex:none}
.m-actions--mm{display:flex;align-items:center;gap:.45rem}
.m-actions--mm .m-card__roundadd,
.m-actions--mm .m-card__iconbtn{
  width:44px;height:44px;border-radius:50%;border:0;flex:none;margin:0;
  background:var(--m-teal,#0d9488);color:#fff;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
  transition:background .15s,transform .15s;
  box-shadow:0 4px 12px rgba(13,148,136,.30)}
.m-actions--mm .m-card__roundadd:hover,
.m-actions--mm .m-card__iconbtn:hover{background:var(--m-teal-dark,#0b7d74);transform:scale(1.07)}
.m-actions--mm .m-card__roundadd svg,
.m-actions--mm .m-card__iconbtn svg{width:19px;height:19px}
.m-actions--mm .m-card__roundadd.added,
.m-actions--mm .m-card__iconbtn.active{background:var(--m-success)}
/* Mobile: compact product cards */
@media(max-width:720px){
.m-card__foot{flex-wrap:wrap;gap:.4rem}
.m-card__foot .m-price--mm{flex:1 1 100%;margin-bottom:.15rem}
.m-actions--mm .m-card__roundadd,.m-actions--mm .m-card__iconbtn{width:38px;height:38px}
.m-actions--mm .m-card__roundadd svg,.m-actions--mm .m-card__iconbtn svg{width:16px;height:16px}
.m-card{padding:.6rem}
.m-card h3{font-size:.82rem;line-height:1.35}
}
/* Out-of-stock / view-product link keeps a clean pill style */
.m-actions--mm .m-card__add{border-radius:999px;padding:.6em 1.2em;flex:none;margin:0}
/* "View all offers" button below grids */
.m-offers-more{display:flex;justify-content:center;margin-top:1.4rem}
.m-offers-more .m-btn{background:var(--m-teal,#0d9488);color:#fff;border:0;border-radius:999px;
  padding:.8em 2.6em;font-weight:800;cursor:pointer;font-size:.95rem}
.m-offers-more .m-btn:hover{background:var(--m-teal-dark,#0b7d74);color:#fff}

/* Product tabs */
.m-tabs__nav{display:flex;gap:.6rem;flex-wrap:wrap}
.m-tabs__nav button{border:1.5px solid var(--m-line);background:var(--m-bg);border-radius:999px;padding:.55em 1.4em;
  font-weight:700;cursor:pointer;color:var(--m-muted)}
.m-tabs__nav button.active{background:var(--m-navy);border-color:var(--m-navy);color:#fff}
.m-tabs__panel{display:none}
.m-tabs__panel.active{display:block;animation:m-fade .25s ease}
@keyframes m-fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ============================================================
   PROMO BANNERS
   ============================================================ */
.m-promos{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.m-promo{position:relative;border-radius:18px;overflow:hidden;min-height:210px;display:flex;align-items:flex-end;color:#fff;
  background:linear-gradient(120deg,var(--m-navy),#155a9e)}
.m-promo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.m-promo__inner{position:relative;padding:1.6rem;z-index:1}
.m-promo h3{font-size:1.35rem;font-weight:800;margin-bottom:.4rem}
.m-promo p{opacity:.9;font-size:.9rem;margin-bottom:1rem;max-width:34ch}
@media(max-width:720px){.m-promos{grid-template-columns:1fr}}

/* ============================================================
   FEATURES ROW
   ============================================================ */
.m-features{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.m-feature{display:flex;align-items:center;gap:.9rem;background:var(--m-bg);border:1px solid var(--m-line);border-radius:var(--m-radius);padding:1rem 1.1rem}
.m-feature__ic{width:50px;height:50px;flex:none;border-radius:14px;background:rgba(255,122,26,.12);color:var(--m-primary);
  display:flex;align-items:center;justify-content:center}
.m-feature__ic svg{width:26px;height:26px}
.m-feature b{display:block;font-size:.92rem}
.m-feature small{color:var(--m-muted);font-size:.78rem}
@media(max-width:900px){.m-features{grid-template-columns:repeat(2,1fr)}}

/* ============================================================
   MINI CART DRAWER
   ============================================================ */
.m-drawer-veil{position:fixed;inset:0;background:rgba(10,35,64,.55);opacity:0;pointer-events:none;transition:opacity .25s;z-index:400}
.m-drawer{position:fixed;top:0;bottom:0;inset-inline-end:0;width:min(400px,92vw);background:var(--m-bg);z-index:401;
  transform:translateX(105%);transition:transform .3s ease;display:flex;flex-direction:column;box-shadow:var(--m-shadow-lg)}
[dir="rtl"] .m-drawer{transform:translateX(-105%)}
body.m-drawer-open .m-drawer{transform:none}
body.m-drawer-open .m-drawer-veil{opacity:1;pointer-events:auto}
body.m-drawer-open{overflow:hidden}
.m-drawer__head{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.2rem;border-bottom:1px solid var(--m-line)}
.m-drawer__head h3{margin:0;font-size:1.1rem}
.m-drawer__close{border:0;background:var(--m-bg-soft);width:36px;height:36px;border-radius:50%;cursor:pointer;font-size:1.1rem;line-height:1}
.m-drawer__body{flex:1;overflow-y:auto;padding:1rem 1.2rem}
.m-drawer__empty{text-align:center;color:var(--m-muted);padding:3rem 1rem}
.m-mini-item{display:flex;gap:.9rem;padding-block:.8rem;border-bottom:1px solid var(--m-line)}
.m-mini-item img{width:70px;height:70px;object-fit:cover;border-radius:10px;flex:none}
.m-mini-item__info{flex:1;min-width:0}
.m-mini-item__info b{font-size:.88rem;display:block;line-height:1.5}
.m-mini-item__meta{display:flex;align-items:center;justify-content:space-between;margin-top:.4rem;font-size:.85rem;color:var(--m-muted)}
.m-mini-item__rm{border:0;background:none;color:var(--m-danger);cursor:pointer;font-size:.8rem}
.m-drawer__foot{border-top:1px solid var(--m-line);padding:1rem 1.2rem}
.m-drawer__total{display:flex;justify-content:space-between;font-weight:800;margin-bottom:.9rem}
.m-drawer__foot .m-btn{width:100%;margin-bottom:.5rem}
.m-drawer__foot .m-btn--ghost{color:var(--m-navy);border-color:var(--m-line)}
.m-drawer__foot .m-btn--ghost:hover{background:var(--m-bg-soft);color:var(--m-navy)}

/* ============================================================
   FOOTER
   ============================================================ */
.m-footer{background:var(--m-footer-bg,var(--m-navy-dark));color:#c9d9ee;margin-top:3rem}
.m-footer__grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:2rem;padding-block:2.8rem 2rem}
.m-footer h4{color:#fff;font-size:1rem;margin-bottom:1rem}
.m-footer p{font-size:.88rem}
.m-footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.55rem}
.m-footer ul a{color:#c9d9ee;font-size:.88rem}
.m-footer ul a:hover{color:#ffb27a}
.m-footer__contact li{display:flex;gap:.6rem;align-items:flex-start;font-size:.88rem}
.m-footer__contact svg{width:16px;height:16px;flex:none;margin-top:.3em;color:#ffb27a}
.m-pay{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem}
.m-pay span{background:rgba(255,255,255,.1);border-radius:8px;padding:.4em .9em;font-size:.75rem;font-weight:700}
.m-footer__bar{border-top:1px solid rgba(255,255,255,.12);padding-block:1rem;font-size:.8rem;color:#8ba3c2}
.m-footer__bar .container{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
@media(max-width:900px){.m-footer__grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.m-footer__grid{grid-template-columns:1fr}}

/* ============================================================
   SHOP / ARCHIVE
   ============================================================ */
.m-shop-head{background:var(--m-bg-soft);padding-block:1.6rem;margin-bottom:1.6rem}
.m-shop-head h1{font-size:1.6rem;margin:0}
.m-shop-head .woocommerce-breadcrumb{font-size:.82rem;color:var(--m-muted);margin-bottom:.4rem}
.m-toolbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1.2rem}
.m-pills{display:flex;gap:.5rem;overflow-x:auto;scrollbar-width:none;padding-bottom:.2rem}
.m-pills::-webkit-scrollbar{display:none}
.m-pills a{flex:none;border:1.5px solid var(--m-line);border-radius:999px;padding:.4em 1.1em;font-size:.85rem;font-weight:600;color:var(--m-muted);background:var(--m-bg)}
.m-pills a.active,.m-pills a:hover{border-color:var(--m-primary);color:var(--m-primary)}
.m-pills a.sub{border-style:dashed;opacity:.85}
.m-shop-layout{display:grid;grid-template-columns:240px 1fr;gap:1.6rem;align-items:start}
@media(max-width:900px){.m-shop-layout{grid-template-columns:1fr}.m-shop-layout>.m-sidebar{display:none}}
.m-sidebar .widget{background:var(--m-bg);border:1px solid var(--m-line);border-radius:var(--m-radius);padding:1.2rem;margin-bottom:1.2rem}
.m-sidebar .widget h3,.m-sidebar .widget-title{font-size:1rem;margin-bottom:.8rem}
.woocommerce-pagination{margin-top:2rem;text-align:center}
.woocommerce-pagination ul{list-style:none;display:inline-flex;gap:.4rem;margin:0;padding:0}
.woocommerce-pagination a,.woocommerce-pagination span{display:inline-flex;align-items:center;justify-content:center;
  min-width:40px;height:40px;border-radius:10px;border:1px solid var(--m-line);font-weight:700}
.woocommerce-pagination span.current{background:var(--m-navy);border-color:var(--m-navy);color:#fff}

/* WooCommerce notices */
.woocommerce-message,.woocommerce-info,.woocommerce-error{border-radius:var(--m-radius);border:1px solid var(--m-line);
  background:var(--m-bg-soft);padding:1rem 1.2rem;margin-bottom:1.2rem;list-style:none}
.woocommerce-message{border-inline-start:4px solid var(--m-success)}
.woocommerce-error{border-inline-start:4px solid var(--m-danger)}

/* ============================================================
   SINGLE PRODUCT
   ============================================================ */
.m-product{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;margin-block:2rem}
@media(max-width:900px){.m-product{grid-template-columns:1fr}}
.m-product .woocommerce-product-gallery{margin:0}
.m-product__summary .price{font-size:1.7rem;font-weight:800;color:var(--m-navy)}
.m-product__summary .price del{color:var(--m-muted);font-size:1.1rem;font-weight:400}
.m-product__summary .woocommerce-product-rating{margin-bottom:.8rem}
.m-product__meta{font-size:.85rem;color:var(--m-muted);border-top:1px solid var(--m-line);padding-top:1rem;margin-top:1rem}
.m-product__meta span{display:block;margin-bottom:.3rem}
.woocommerce div.product form.cart{display:flex;gap:.7rem;flex-wrap:wrap;margin:1.2rem 0}
.woocommerce div.product form.cart .quantity input{width:70px;padding:.65em;border:1.5px solid var(--m-line);border-radius:10px;text-align:center}
.single_add_to_cart_button{background:var(--m-primary)!important;color:#fff!important;border:0;border-radius:999px!important;
  padding:.8em 2.2em!important;font-weight:700;cursor:pointer}
.single_add_to_cart_button:hover{background:var(--m-primary-dark)!important}
.woocommerce-tabs{margin-top:2.5rem}
.woocommerce-tabs ul.tabs{list-style:none;display:flex;gap:.4rem;padding:0;margin:0 0 -1px;border-bottom:2px solid var(--m-line)}
.woocommerce-tabs ul.tabs li a{display:block;padding:.7em 1.4em;font-weight:700;color:var(--m-muted);border-bottom:3px solid transparent}
.woocommerce-tabs ul.tabs li.active a{color:var(--m-navy);border-bottom-color:var(--m-primary)}

/* ============================================================
   CART & CHECKOUT
   ============================================================ */
.woocommerce-cart-form table,.woocommerce-checkout-review-order-table{width:100%;border-collapse:collapse}
.woocommerce-cart-form th,.woocommerce-cart-form td{padding:.8rem;border-bottom:1px solid var(--m-line);text-align:start;vertical-align:middle}
.woocommerce input[type=text],.woocommerce input[type=tel],.woocommerce input[type=email],.woocommerce input[type=number],
.woocommerce input[type=password],.woocommerce textarea,.woocommerce select,.m-field input,.m-field textarea,.m-field select{
  width:100%;border:1.5px solid var(--m-line);border-radius:10px;padding:.7em 1em;background:#fff}
.woocommerce input:focus,.woocommerce textarea:focus,.woocommerce select:focus{outline:0;border-color:var(--m-primary)}
.woocommerce .button,.woocommerce button.button,.woocommerce a.button{background:var(--m-navy);color:#fff;border:0;border-radius:999px;
  padding:.75em 1.8em;font-weight:700;cursor:pointer}
.woocommerce .button:hover,.woocommerce button.button:hover,.woocommerce a.button:hover{background:var(--m-primary);color:#fff}
.woocommerce-checkout{display:grid;grid-template-columns:1.4fr 1fr;gap:2rem;align-items:start}
@media(max-width:900px){.woocommerce-checkout{grid-template-columns:1fr}}
#order_review{background:var(--m-bg-soft);border:1px solid var(--m-line);border-radius:var(--m-radius);padding:1.4rem}

/* ============================================================
   BLOG / PAGES / MISC
   ============================================================ */
.m-post-card{background:var(--m-bg);border:1px solid var(--m-line);border-radius:var(--m-radius);overflow:hidden;margin-bottom:1.4rem}
.m-post-card__body{padding:1.4rem}
.m-post-card h2{font-size:1.3rem}
.m-post-card h2 a{color:inherit}
.m-meta{font-size:.8rem;color:var(--m-muted);margin-bottom:.8rem;display:flex;gap:1rem;flex-wrap:wrap}
.m-page-head{background:var(--m-bg-soft);padding-block:2rem;margin-bottom:2rem}
.m-page-head h1{margin:0;font-size:1.8rem}
.m-content{margin-bottom:3rem}
.m-content img{border-radius:var(--m-radius)}
.aligncenter{text-align:center}
.m-404{text-align:center;padding:4rem 1rem}
.m-404 h1{font-size:4rem;color:var(--m-navy);margin:0}
.m-search-results{margin-bottom:2rem}
.comment-list{list-style:none;margin:0;padding:0}
.comment{border:1px solid var(--m-line);border-radius:var(--m-radius);padding:1.2rem;margin-bottom:1rem}
.comment-meta{font-size:.8rem;color:var(--m-muted);margin-bottom:.6rem}
#respond{margin-top:2rem}
#respond textarea{width:100%;min-height:120px}
.m-backtop{position:fixed;bottom:1.2rem;inset-inline-end:1.2rem;z-index:300;width:46px;height:46px;border-radius:50%;
  border:0;background:var(--m-navy);color:#fff;cursor:pointer;display:none;align-items:center;justify-content:center;box-shadow:var(--m-shadow-lg)}
.m-backtop.show{display:flex}
.m-backtop svg{width:20px;height:20px}

/* Skip link + focus */
.skip-link{position:absolute;inset-inline-start:-999px;background:var(--m-navy);color:#fff;padding:.6em 1.2em;z-index:999;border-radius:0 0 8px 0}
.skip-link:focus{inset-inline-start:0}
a:focus-visible,button:focus-visible{outline:2px solid var(--m-primary);outline-offset:2px}

/* ============================================================
   WOOCOMMERCE LOOP COMPATIBILITY
   ============================================================ */
ul.products{list-style:none;margin:0 0 2rem;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem}
ul.products li.m-card{margin:0!important;width:auto!important;float:none!important;clear:none!important}
@media(max-width:1024px){ul.products{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){ul.products{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:.7rem}ul.products>*{min-width:0}}
.woocommerce-result-count{font-size:.85rem;color:var(--m-muted)}

/* ============================================================
   MOBILE MENU
   ============================================================ */
@media(max-width:900px){
  .m-catsnav{display:none}
  body.m-menu-open{overflow:hidden}
  body.m-menu-open .m-catsnav{display:block;position:fixed;top:0;bottom:0;inset-inline-start:0;
    width:min(320px,85vw);z-index:500;overflow-y:auto;box-shadow:var(--m-shadow-lg)}
  body.m-menu-open .m-catsnav__inner{flex-direction:column;align-items:stretch;padding:1rem;overflow:visible}
  body.m-menu-open .m-catsnav .menu{flex-direction:column}
  body.m-menu-open .m-catsnav a{display:block;border-bottom:1px solid rgba(255,255,255,.1);padding:.85em .5em}
  body.m-menu-open .m-drawer-veil{opacity:1;pointer-events:auto}
}

/* RTL: flip directional chevrons */
[dir="rtl"] .m-hero__arrow svg{transform:scaleX(-1)}

/* ============================================================
   TOAST
   ============================================================ */
.m-toast{position:fixed;bottom:1.5rem;inset-inline:0;margin-inline:auto;width:max-content;max-width:90vw;
  background:var(--m-navy-dark);color:#fff;padding:.8em 1.6em;border-radius:999px;z-index:600;
  font-size:.9rem;font-weight:600;box-shadow:var(--m-shadow-lg);opacity:0;transform:translateY(10px);
  transition:opacity .25s,transform .25s;pointer-events:none}
.m-toast.show{opacity:1;transform:none}

/* ============================================================
   MOCKUP ALIGNMENT — orange category nav (Amazon/Jumia style)
   ============================================================ */
.m-catsnav{background:var(--m-nav-bg,var(--m-navy))}
.m-catsnav a{color:#fff;border-bottom:3px solid transparent}
.m-catsnav a:hover{color:#fff;border-bottom-color:#fff;opacity:1}

/* ============================================================
   HOMEPAGE LAYOUT — left sidebar + main column
   ============================================================ */
.m-home-layout{display:grid;grid-template-columns:274px minmax(0,1fr);gap:1.5rem;align-items:start}
body.m-side-collapsed .m-home-layout{grid-template-columns:66px minmax(0,1fr)}
/* Collapsible icon-only sidebar */
.m-side-toggle{display:flex;align-items:center;justify-content:center;width:38px;height:38px;margin:0 0 .8rem;
  border:1px solid var(--m-line);border-radius:10px;background:var(--m-bg-soft);color:var(--m-navy);cursor:pointer}
.m-side-toggle svg{width:20px;height:20px}
.m-side-toggle:hover{background:var(--m-navy);color:#fff;border-color:var(--m-navy)}
.m-home-side{transition:width .25s ease}
body.m-side-collapsed .m-home-side{padding:1rem .55rem}
body.m-side-collapsed .m-side-toggle{margin:0 auto .8rem}
body.m-side-collapsed .m-home-side .m-side-title,
body.m-side-collapsed .m-home-side .m-cat-label,
body.m-side-collapsed .m-home-side .m-cat-arrow,
body.m-side-collapsed .m-home-side__cats ul,
body.m-side-collapsed .m-home-side__block + .m-home-side__block{display:none}
body.m-side-collapsed .m-home-side h3{justify-content:center;margin-bottom:.4rem}
body.m-side-collapsed .m-home-side h3 svg{display:none}
body.m-side-collapsed .m-home-side__cats > li > a{justify-content:center;padding:.6em 0;position:relative}
body.m-side-collapsed .m-home-side .m-cat-ico{width:30px;height:30px}
body.m-side-collapsed .m-home-side .m-cat-ico--mono svg{width:20px;height:20px}
body.m-side-collapsed .m-home-side .m-cat-ico--emoji{font-size:20px}
body.m-side-collapsed .m-home-side__cats > li > a:hover::after{content:attr(data-name);position:absolute;inset-inline-start:calc(100% + 12px);top:50%;transform:translateY(-50%);background:var(--m-navy);color:#fff;font-size:.8rem;font-weight:600;padding:.45em .9em;border-radius:8px;white-space:nowrap;z-index:50;box-shadow:var(--m-shadow)}
.m-home-layout--full{grid-template-columns:1fr}
.m-home-main{min-width:0}
.m-home-main .m-hero{border-radius:18px;margin-top:1.4rem}
.m-home-main .m-hero__slide-inner{padding-inline:2rem}
.m-home-main .m-section{padding-block:1.8rem}
.m-home-main .m-best{padding-bottom:0}
@media(max-width:1024px){
  .m-home-layout{grid-template-columns:1fr}
  .m-home-side{display:none}
}

/* Homepage sidebar panel (Catégories / Prix) */
.m-home-side{position:sticky;top:96px;background:var(--m-bg);border:1px solid var(--m-line);
  border-radius:14px;padding:1.25rem 1.15rem;margin-top:1.4rem;box-shadow:0 2px 10px rgba(14,47,87,.05)}
.m-home-side__block + .m-home-side__block{border-top:1px solid var(--m-line);margin-top:1.1rem;padding-top:1.1rem}
.m-home-side h3{font-size:1.05rem;font-weight:800;display:flex;align-items:center;gap:.55rem;margin:0 0 .7rem}
.m-home-side h3 svg{width:20px;height:20px;color:var(--m-primary)}
.m-home-side__cats{list-style:none;margin:0;padding:0}
.m-cat-name{display:inline-flex;align-items:center;gap:.55rem;min-width:0}
.m-cat-ico{width:22px;height:22px;flex:none;display:inline-flex;align-items:center;justify-content:center;background:transparent;overflow:hidden;color:inherit}
.m-cat-ico img{width:100%;height:100%;object-fit:cover;border-radius:6px}
.m-cat-ico--emoji{font-size:15px}
.m-cat-ico svg{width:17px;height:17px}
.m-cat-ico--default{color:var(--m-navy)}
.m-cat-ico--default svg{width:14px;height:14px}
.menu .m-cat-ico{width:18px;height:18px;border-radius:6px}
.menu .m-cat-ico--emoji{font-size:13px}
.m-tile__ico .m-cat-ico{width:34px;height:34px;border-radius:10px}
.m-tile__ico .m-cat-ico--emoji{font-size:24px}
.m-home-side__cats > li > a{display:flex;align-items:center;justify-content:space-between;gap:.5rem;
  font-weight:700;color:var(--m-ink);padding:.42em 0;font-size:.95rem}
.m-home-side__cats > li > a:hover{color:var(--m-primary)}
.m-home-side__cats > li > a .m-cat-arrow{color:var(--m-primary)}
.m-home-side__cats ul{list-style:none;margin:0 0 .35rem;padding:0}
.m-home-side__cats ul a{position:relative;display:block;font-size:.86rem;color:var(--m-muted);
  padding:.26em 0;padding-inline-start:1.1rem}
.m-home-side__cats ul a::before{content:"•";position:absolute;inset-inline-start:.15rem;color:var(--m-primary)}
.m-home-side__cats ul a:hover{color:var(--m-primary)}
.m-home-side__price{list-style:none;margin:0;padding:0}
.m-home-side__price a{display:flex;align-items:center;gap:.65rem;padding:.36em 0;font-size:.88rem;color:var(--m-ink)}
.m-home-side__price a:hover{color:var(--m-primary)}
.m-check{width:16px;height:16px;flex:none;border:1.5px solid #c6d2de;border-radius:4px;background:#fff}

/* ============================================================
   PRODUCT CARDS — orange add-to-cart, sale %, sold count
   ============================================================ */
.m-card__badges{inset-inline-end:auto}
.m-badge--sale{background:var(--m-danger)}
.m-card__add{background:var(--m-primary)}
.m-card__add:hover{background:var(--m-primary-dark)}
.m-card__sold{display:inline-flex;align-items:center;gap:.35em;font-size:.78rem;color:var(--m-muted);font-weight:600}
.m-card__sold svg{width:13px;height:13px;color:var(--m-primary)}

/* Compact card style (Customizer) */
.m-card--compact .m-card__body{padding:.65rem;gap:.3rem}
.m-card--compact .m-card__name{font-size:.83rem;min-height:0}
.m-card--compact .m-card__cat,.m-card--compact .m-wish{display:none}
.m-card--compact .m-card__add{padding:.55em;font-size:.85rem}
.m-card--compact .m-stars{font-size:.75rem}

/* ============================================================
   SHOP FILTERS PANEL (Amazon-style mockup)
   ============================================================ */
.m-filters{background:var(--m-bg);border:1px solid var(--m-line);border-radius:14px;padding:1.3rem}
.m-filters__title{font-size:1.2rem;font-weight:800;color:var(--m-navy);margin:0 0 1.1rem}
.m-filter-block{margin-bottom:1.35rem;padding-bottom:1.35rem;border-bottom:1px solid var(--m-line)}
.m-filter-block:last-of-type{border-bottom:0;padding-bottom:0;margin-bottom:1rem}
.m-filter-block h3{font-size:.98rem;font-weight:800;margin:0 0 .55rem}
.m-filter-block ul{list-style:none;margin:0;padding:0}
.m-checklink{display:flex;align-items:center;gap:.6rem;padding:.34em 0;font-size:.88rem;color:var(--m-ink)}
.m-checklink::before{content:"";width:16px;height:16px;flex:none;border:1.5px solid #c6d2de;border-radius:4px;background:#fff;
  display:inline-flex;align-items:center;justify-content:center;font-size:.68rem;color:#fff}
.m-checklink:hover{color:var(--m-primary)}
.m-checklink.active{font-weight:700}
.m-checklink.active::before{content:"✓";background:var(--m-primary);border-color:var(--m-primary)}
.m-checklink .count{margin-inline-start:auto;color:var(--m-muted);font-size:.8rem;font-weight:400}
.m-filter-stars{color:var(--m-star);letter-spacing:.08em}
.m-filter-reset{display:inline-block;margin-top:.3rem;font-size:.86rem;font-weight:700;color:var(--m-primary);text-decoration:underline}
/* Widgets placed in the shop sidebar inherit the panel look */
.m-filters .widget{border:0;padding:0;margin-bottom:1.35rem;background:none}
.m-filters .widget:last-child{margin-bottom:0}

/* ============================================================
   LANGUAGE SWITCHER (header)
   ============================================================ */
.m-lang{flex:none}
.m-lang ul{display:flex;align-items:center;gap:.25rem;list-style:none;margin:0;padding:0}
.m-lang a{display:inline-block;padding:.35em .7em;border-radius:8px;font-size:.8rem;font-weight:700;color:var(--m-muted);text-transform:uppercase}
.m-lang a:hover{background:var(--m-bg-soft);color:var(--m-navy)}
.m-lang .current-lang a{background:var(--m-bg-soft);color:var(--m-primary)}
@media(max-width:900px){.m-lang a{padding:.3em .5em}}

/* ============================================================
   HEADER LAYOUTS
   ============================================================ */
.m-header--compact .m-header__inner{padding-block:.45rem}
.m-header--compact .m-logo img{max-height:calc(var(--m-logo-h,30px) * .75)}
.m-header--compact .m-logo__text small{display:none}
.m-header--compact .m-logo__mark{width:36px;height:36px;font-size:1.1rem}

/* ============================================================
   WHATSAPP — floating button + product order button
   ============================================================ */
.m-whatsapp{position:fixed;bottom:1.2rem;inset-inline-start:1.2rem;z-index:300;width:54px;height:54px;
  border-radius:50%;background:#25d366;color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 24px rgba(37,211,102,.45);transition:transform .15s}
.m-whatsapp:hover{transform:scale(1.07);color:#fff}
.m-whatsapp svg{width:30px;height:30px}
.m-btn--wa{background:#25d366;margin-top:.7rem;width:100%}
.m-btn--wa:hover{background:#1da851;color:#fff}
.m-btn--wa svg{width:18px;height:18px}

/* ============================================================
   NEWSLETTER SECTION
   ============================================================ */
.m-news{background:linear-gradient(120deg,var(--m-navy-dark),var(--m-navy));color:#fff;border-radius:0}
.m-news__inner{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center}
.m-news h2{font-size:1.5rem;font-weight:800;margin:0 0 .5rem;color:#fff}
.m-news p{color:#c9d9ee;margin:0}
.m-news__form form{display:flex;gap:.6rem}
.m-news__form input[type=email]{flex:1;min-width:0;border:0;border-radius:999px;padding:.8em 1.3em}
.m-news__form .m-btn{flex:none}
.m-news__demo{display:block;margin-top:.6rem;font-size:.75rem;color:#8ba3c2}
@media(max-width:760px){.m-news__inner{grid-template-columns:1fr}}

/* ============================================================
   PROMO POPUP
   ============================================================ */
.m-popup{position:fixed;inset:0;z-index:700;background:rgba(10,35,64,.6);display:flex;align-items:center;justify-content:center;padding:1rem}
.m-popup[hidden]{display:none}
.m-popup__box{position:relative;background:#fff;border-radius:18px;max-width:430px;width:100%;padding:2.2rem 2rem 2rem;
  text-align:center;box-shadow:var(--m-shadow-lg);border-top:5px solid var(--m-primary)}
.m-popup__box h3{font-size:1.4rem;font-weight:800;color:var(--m-navy);margin:0 0 .6rem}
.m-popup__box p{color:var(--m-muted);margin:0 0 1.4rem}
.m-popup__close{position:absolute;top:.6rem;inset-inline-end:.8rem;border:0;background:var(--m-bg-soft);width:34px;height:34px;
  border-radius:50%;font-size:1.2rem;line-height:1;cursor:pointer;color:var(--m-muted)}
.m-popup__close:hover{background:var(--m-line);color:var(--m-ink)}
.m-popup__box .m-btn{width:100%}

/* ============================================================
   FOOTER COLUMN VARIANTS
   ============================================================ */
.m-footer__grid--cols-2{grid-template-columns:1.3fr 1fr}
.m-footer__grid--cols-3{grid-template-columns:1.3fr 1fr 1fr}

/* ============================================================
   FLASH DEALS — countdown label
   ============================================================ */
.m-flash__timer{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap}
.m-flash__ends{font-weight:700;font-size:.95rem}

/* ============================================================
   TYPOGRAPHY SCALE (Customizer)
   ============================================================ */
.m-sec-head h2{font-size:calc(1.45rem * var(--m-hs,1))}
.m-hero h2{font-size:calc(clamp(1.7rem,4vw,2.8rem) * var(--m-hs,1))}
.m-news h2{font-size:calc(1.5rem * var(--m-hs,1))}
.m-shop-head h1{font-size:calc(1.6rem * var(--m-hs,1))}

/* ============================================================
   CHAT ASSISTANT — floating button + panel
   (stacked above the WhatsApp button, RTL-aware via logical props)
   ============================================================ */
.m-chatbot-btn{position:fixed;inset-inline-start:1.2rem;z-index:310;width:56px;height:56px;
  border-radius:50%;background:var(--m-navy);border:2px solid #fff;cursor:pointer;
  display:flex;align-items:center;justify-content:center;padding:0;
  box-shadow:0 8px 24px rgba(14,47,87,.4);transition:transform .15s}
.m-chatbot-btn:hover{transform:scale(1.07)}
.m-chatbot-btn img{width:38px;height:38px;border-radius:50%;object-fit:cover}
.m-chatbot-btn__dot{position:absolute;top:2px;inset-inline-end:2px;width:12px;height:12px;
  border-radius:50%;background:var(--m-success);border:2px solid #fff}
.m-chatbot{position:fixed;inset-inline-start:1.2rem;z-index:320;width:min(380px,calc(100vw - 2rem));
  height:min(540px,72vh);display:flex;flex-direction:column;overflow:hidden;
  background:var(--m-bg);border-radius:18px;box-shadow:var(--m-shadow-lg);
  border:1px solid var(--m-line)}
.m-chatbot[hidden]{display:none}
.m-chatbot__head{display:flex;align-items:center;gap:.7rem;background:var(--m-navy);
  color:#fff;padding:.8rem 1rem}
.m-chatbot__head img{width:38px;height:38px;border-radius:50%;object-fit:cover;background:#fff;flex:none}
.m-chatbot__head-text{flex:1;min-width:0}
.m-chatbot__head-text strong{display:block;font-size:.95rem;line-height:1.3}
.m-chatbot__head-text small{color:#c9d9ee;font-size:.72rem}
.m-chatbot__close{border:0;background:rgba(255,255,255,.14);color:#fff;width:32px;height:32px;
  border-radius:50%;font-size:1.15rem;line-height:1;cursor:pointer;flex:none}
.m-chatbot__close:hover{background:rgba(255,255,255,.28)}
.m-chatbot__msgs{flex:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:.6rem;
  background:var(--m-bg-soft)}
.m-chatbot__row{display:flex}
.m-chatbot__row--bot{justify-content:flex-start}
.m-chatbot__row--user{justify-content:flex-end}
.m-chatbot__bubble{max-width:85%;padding:.6em .9em;border-radius:14px;font-size:.88rem;
  line-height:1.65;overflow-wrap:break-word}
.m-chatbot__row--bot .m-chatbot__bubble{background:#fff;color:var(--m-ink);
  border:1px solid var(--m-line);border-start-start-radius:4px}
.m-chatbot__row--user .m-chatbot__bubble{background:var(--m-primary);color:#fff;
  border-start-end-radius:4px}
.m-chatbot__typing{display:flex;gap:5px;align-items:center;padding:.9em 1em}
.m-chatbot__typing span{width:7px;height:7px;border-radius:50%;background:var(--m-muted);
  animation:m-chatbot-blink 1.2s infinite}
.m-chatbot__typing span:nth-child(2){animation-delay:.2s}
.m-chatbot__typing span:nth-child(3){animation-delay:.4s}
@keyframes m-chatbot-blink{0%,60%,100%{opacity:.25}30%{opacity:1}}
.m-chatbot__chips{display:flex;gap:.5rem;overflow-x:auto;padding:.6rem 1rem 0;
  background:var(--m-bg-soft)}
.m-chatbot__chips:empty{display:none}
.m-chatbot__chip{flex:none;border:1px solid var(--m-primary);background:#fff;color:var(--m-primary);
  border-radius:999px;padding:.35em 1em;font-size:.78rem;font-weight:700;cursor:pointer;
  font-family:inherit}
.m-chatbot__chip:hover{background:var(--m-primary);color:#fff}
.m-chatbot__form{display:flex;gap:.6rem;padding:.8rem 1rem;background:var(--m-bg);
  border-top:1px solid var(--m-line)}
.m-chatbot__form input{flex:1;min-width:0;border:1px solid var(--m-line);border-radius:999px;
  padding:.65em 1.1em;font-family:inherit;font-size:.88rem;color:var(--m-ink);background:#fff}
.m-chatbot__form input:focus{outline:2px solid var(--m-primary);border-color:var(--m-primary)}
.m-chatbot__form button{flex:none;width:44px;height:44px;border-radius:50%;border:0;cursor:pointer;
  background:var(--m-primary);color:#fff;display:flex;align-items:center;justify-content:center}
.m-chatbot__form button:hover{background:var(--m-primary-dark)}
.m-chatbot__form button svg{width:20px;height:20px;transform:scaleX(-1)}
[dir="rtl"] .m-chatbot__form button svg{transform:none}
@media(max-width:480px){
  .m-chatbot{width:calc(100vw - 1.6rem);inset-inline-start:.8rem;height:70vh}
  .m-chatbot-btn{inset-inline-start:.8rem}
}

/* ============================================================
 * MARDUINO — PREMIUM FEATURES
 * Quick view, compare, sticky ATC, scarcity, load more,
 * mobile nav, bought-together, recently viewed.
 * ============================================================ */

/* ---------- Generic modal ---------- */
.m-modal[hidden]{display:none!important}
.m-modal{position:fixed;inset:0;z-index:600;display:flex;align-items:center;justify-content:center;padding:1rem}
.m-modal__veil{position:absolute;inset:0;background:rgba(10,25,45,.55);backdrop-filter:blur(2px)}
.m-modal__box{position:relative;background:var(--m-bg);border-radius:var(--m-radius);box-shadow:var(--m-shadow-lg);max-width:860px;width:100%;max-height:90vh;overflow:auto;padding:1.5rem;animation:m-pop .22s ease}
@keyframes m-pop{from{transform:translateY(14px) scale(.98);opacity:0}to{transform:none;opacity:1}}
.m-modal__close{position:absolute;top:.6rem;inset-inline-end:.8rem;width:36px;height:36px;border-radius:50%;border:1px solid var(--m-line);background:var(--m-bg);font-size:1.4rem;line-height:1;color:var(--m-muted);cursor:pointer;z-index:2}
.m-modal__close:hover{color:var(--m-danger);border-color:var(--m-danger)}
.m-modal__title{margin:0 0 1rem;font-size:1.15rem;font-weight:800;color:var(--m-navy);padding-inline-end:2.5rem}
body.m-modal-open{overflow:hidden}

/* ---------- Product card actions (add to cart + icon buttons) ---------- */
.m-card__top{position:relative}
.m-card__actions{display:flex;gap:.5rem;align-items:stretch;margin-top:.4rem}
.m-card__iconbtn{flex:none;width:42px;border:1px solid var(--m-line);background:#fff;border-radius:10px;color:var(--m-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}
.m-card__iconbtn svg{width:17px;height:17px}
.m-card__iconbtn:hover{background:var(--m-navy);border-color:var(--m-navy);color:#fff}
.m-card__iconbtn.active{background:var(--m-primary);border-color:var(--m-primary);color:#fff}

/* ---------- Quick view ---------- */
.m-qv__box{max-width:880px}
.m-qv__content{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.m-qv__media{background:var(--m-bg-soft);border-radius:var(--m-radius-sm);display:flex;align-items:center;justify-content:center;overflow:hidden;min-height:280px}
.m-qv__media img{width:100%;height:100%;object-fit:contain;max-height:420px}
.m-qv__name{margin:0 0 .4rem;font-size:1.25rem}
.m-qv__name a{color:inherit}
.m-qv__price{font-size:1.4rem;font-weight:800;color:var(--m-primary);margin:.6rem 0}
.m-qv__excerpt{color:var(--m-muted);font-size:.9rem;margin:.6rem 0}
.m-qv__stock{font-weight:700;font-size:.85rem}
.m-qv__stock.in{color:var(--m-success)}
.m-qv__stock.out{color:var(--m-danger)}
.m-qv__cart{display:flex;gap:.6rem;align-items:center;margin:.9rem 0;flex-wrap:wrap}
.m-qv__full{display:inline-block;margin-top:.4rem;font-weight:700;color:var(--m-navy);font-size:.9rem}
.m-qv__loading{padding:3rem;text-align:center;color:var(--m-muted)}
@media(max-width:640px){.m-qv__content{grid-template-columns:1fr}}

/* ---------- Quantity stepper ---------- */
.m-qty{display:inline-flex;align-items:center;border:1.5px solid var(--m-line);border-radius:999px;overflow:hidden}
.m-qty button{width:34px;height:38px;border:0;background:var(--m-bg-soft);font-size:1.1rem;cursor:pointer;color:var(--m-navy)}
.m-qty button:hover{background:var(--m-line)}
.m-qty input{width:44px;border:0;text-align:center;font-weight:800;font-size:.95rem;background:transparent;color:var(--m-ink)}
.m-qty input::-webkit-outer-spin-button,.m-qty input::-webkit-inner-spin-button{-webkit-appearance:none}

/* ---------- Scarcity bar ---------- */
.m-scarcity{margin:.35rem 0}
.m-scarcity__label{font-size:.78rem;color:var(--m-danger);font-weight:600}
.m-scarcity__label strong{font-weight:800}
.m-scarcity__bar{display:block;height:6px;border-radius:99px;background:#f6d9d9;overflow:hidden;margin-top:.3rem}
.m-scarcity__bar span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--m-danger),#ff7a5c)}

/* ---------- Compare ---------- */
.m-compare-bar{position:fixed;bottom:1rem;inset-inline:0;margin-inline:auto;width:max-content;max-width:94vw;z-index:550;background:var(--m-navy);color:#fff;border-radius:999px;padding:.55rem .6rem .55rem 1rem;display:flex;align-items:center;gap:.8rem;box-shadow:var(--m-shadow-lg)}
.m-compare-bar[hidden]{display:none!important}
.m-compare-bar__items{display:flex;gap:.4rem}
.m-compare-bar__chip{background:rgba(255,255,255,.15);border-radius:999px;padding:.3rem .7rem;font-size:.75rem;font-weight:700}
.m-compare-bar__actions{display:flex;align-items:center;gap:.6rem}
.m-compare-bar .m-btn{border-radius:999px;padding:.55rem 1.1rem}
.m-compare-bar__clear{background:none;border:0;color:#fff;opacity:.75;font-size:.8rem;cursor:pointer;text-decoration:underline}
.m-compare-bar__clear:hover{opacity:1}
.m-compare__box{max-width:1020px}
.m-compare__table-wrap{overflow-x:auto}
.m-compare__table{width:100%;border-collapse:collapse;font-size:.88rem;min-width:560px}
.m-compare__table th,.m-compare__table td{border:1px solid var(--m-line);padding:.7rem .8rem;vertical-align:top;text-align:start}
.m-compare__table th[scope="row"]{background:var(--m-bg-soft);font-weight:700;color:var(--m-navy);white-space:nowrap;width:130px}
.m-compare__table td img{max-width:110px;height:auto;border-radius:var(--m-radius-sm)}
.m-compare__table .m-btn--sm{padding:.45rem .9rem;font-size:.8rem}
.m-stock.in{color:var(--m-success);font-weight:700}
.m-stock.out{color:var(--m-danger);font-weight:700}
.m-stars-js{color:var(--m-star);letter-spacing:.1em}
.m-compare-single{display:inline-flex;align-items:center;gap:.45rem;margin-top:.7rem;background:none;border:1.5px solid var(--m-line);border-radius:999px;padding:.5rem 1rem;font-weight:700;font-size:.85rem;color:var(--m-navy);cursor:pointer}
.m-compare-single svg{width:16px;height:16px}
.m-compare-single:hover{border-color:var(--m-navy)}
.m-compare-single.active{background:var(--m-primary);border-color:var(--m-primary);color:#fff}

/* ---------- Wishlist modal ---------- */
.m-wish__row{display:flex;align-items:center;gap:.8rem;padding:.7rem 0;border-bottom:1px solid var(--m-line)}
.m-wish__row:last-child{border-bottom:0}
.m-wish__thumb img{width:64px;height:64px;object-fit:cover;border-radius:var(--m-radius-sm)}
.m-wish__meta{flex:1;min-width:0}
.m-wish__meta a{font-weight:700;color:var(--m-ink);font-size:.9rem}
.m-wish__price{color:var(--m-primary);font-weight:800;font-size:.9rem;margin-top:.2rem}
.m-wish__remove{background:none;border:0;font-size:1.5rem;color:var(--m-muted);cursor:pointer;line-height:1}
.m-wish__remove:hover{color:var(--m-danger)}
.m-wish__empty,.m-wish__loading,.m-compare__loading{text-align:center;color:var(--m-muted);padding:2rem}

/* ---------- Sticky add to cart ---------- */
.m-sticky{position:fixed;inset-inline:0;z-index:500;background:rgba(255,255,255,.97);backdrop-filter:blur(6px);border-bottom:1px solid var(--m-line);box-shadow:var(--m-shadow);transform:translateY(-110%);transition:transform .28s ease}
.m-sticky.show{transform:none}
@media(min-width:769px){.m-sticky{top:0}}
@media(max-width:768px){.m-sticky{top:auto;bottom:0;border-bottom:0;border-top:1px solid var(--m-line);transform:translateY(110%)}}
.m-sticky__inner{max-width:var(--m-container);margin-inline:auto;padding:.6rem 20px;display:flex;align-items:center;gap:.9rem}
.m-sticky__thumb img{width:52px;height:52px;object-fit:cover;border-radius:var(--m-radius-sm)}
.m-sticky__meta{flex:1;min-width:0;display:flex;flex-direction:column}
.m-sticky__meta strong{font-size:.88rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m-sticky__price{color:var(--m-primary);font-weight:800;font-size:.92rem}
@media(max-width:560px){.m-sticky__thumb{display:none}.m-sticky__qty{display:none}}

/* ---------- Load more ---------- */
.m-loadmore{text-align:center;padding:1.6rem 0 .6rem;position:relative;min-height:60px}
.m-loadmore__btn{min-width:220px}
.m-loadmore__sentinel{height:2px}
.m-loadmore__end{color:var(--m-muted);font-size:.9rem}

/* ---------- Mobile bottom nav ---------- */
.m-mnav{display:none}
@media(max-width:768px){
  .m-mnav{display:flex;position:fixed;bottom:0;inset-inline:0;z-index:520;background:var(--m-bg);border-top:1px solid var(--m-line);box-shadow:0 -6px 20px rgba(14,47,87,.10);padding:.35rem .2rem calc(.35rem + env(safe-area-inset-bottom))}
  .m-mnav__item{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;background:none;border:0;color:var(--m-muted);font-size:.66rem;font-weight:700;cursor:pointer;padding:.3rem 0;position:relative;font-family:inherit;text-decoration:none}
  .m-mnav__item svg{width:22px;height:22px}
  .m-mnav__item:hover,.m-mnav__item:focus{color:var(--m-primary)}
  .m-mnav__badge{position:absolute;top:0;inset-inline-end:calc(50% - 22px);background:var(--m-danger);color:#fff;font-size:.62rem;min-width:17px;height:17px;border-radius:99px;display:flex;align-items:center;justify-content:center;padding:0 4px;font-weight:800}
  .m-mnav__badge[hidden]{display:none}
  .m-mnav__search{position:absolute;bottom:100%;inset-inline:0;background:var(--m-bg);border-top:1px solid var(--m-line);padding:.7rem 1rem}
  .m-mnav__search[hidden]{display:none}
  .m-mnav__search form{display:flex;gap:.5rem}
  .m-mnav__search input{flex:1;border:1.5px solid var(--m-line);border-radius:999px;padding:.6rem 1rem;font-size:.9rem;font-family:inherit}
  .m-mnav__search button{border:0;background:var(--m-primary);color:#fff;border-radius:50%;width:42px;height:42px;cursor:pointer;display:flex;align-items:center;justify-content:center}
  .m-mnav__search button svg{width:18px;height:18px}
  body{padding-bottom:64px}
}

/* ---------- Frequently bought together ---------- */
.m-fbt{margin:2rem 0;padding:1.4rem;background:var(--m-bg-soft);border:1px solid var(--m-line);border-radius:var(--m-radius)}
.m-fbt__title{margin:0 0 1rem;font-size:1.1rem;font-weight:800;color:var(--m-navy)}
.m-fbt__grid{display:grid;grid-template-columns:1fr 240px;gap:1.4rem}
@media(max-width:700px){.m-fbt__grid{grid-template-columns:1fr}}
.m-fbt__row{display:flex;align-items:center;gap:.8rem;padding:.6rem 0;border-bottom:1px dashed var(--m-line);cursor:pointer}
.m-fbt__row:last-child{border-bottom:0}
.m-fbt__row input{width:18px;height:18px;accent-color:var(--m-primary);flex:none}
.m-fbt__thumb img{width:56px;height:56px;object-fit:cover;border-radius:var(--m-radius-sm)}
.m-fbt__name{flex:1;font-size:.88rem;min-width:0}
.m-fbt__price{font-weight:800;color:var(--m-primary);white-space:nowrap}
.m-fbt__side{background:var(--m-bg);border:1px solid var(--m-line);border-radius:var(--m-radius-sm);padding:1.1rem;display:flex;flex-direction:column;gap:.8rem;justify-content:center;align-self:start}
.m-fbt__total{margin:0;font-size:.95rem}
.m-fbt__total strong{color:var(--m-primary);font-size:1.25rem}

/* ---------- Recently viewed ---------- */
.m-recent__track{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:.5rem;scrollbar-width:thin}
.m-recent__item{flex:0 0 230px;scroll-snap-align:start}
.m-recent__item .m-card{height:100%}
.m-section__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}
.m-section__head h2{margin:0;font-size:1.25rem;color:var(--m-navy)}
.m-recent__nav{display:flex;gap:.4rem}
.m-recent__nav button{width:36px;height:36px;border-radius:50%;border:1px solid var(--m-line);background:var(--m-bg);font-size:1.2rem;cursor:pointer;color:var(--m-navy);line-height:1}
.m-recent__nav button:hover{background:var(--m-navy);color:#fff;border-color:var(--m-navy)}
[dir="rtl"] .m-recent__nav button{transform:scaleX(-1)}

/* ================= Wow features ================= */

/* --- Dark mode --- */
html[data-theme="dark"]{
	--m-bg:#0f1826;
	--m-bg-soft:#15212f;
	--m-ink:#e9eef4;
	--m-muted:#93a5b8;
	--m-line:#223349;
	--m-navy:#8fb8e8;
}
html[data-theme="dark"] body{background:var(--m-bg);color:var(--m-ink)}
html[data-theme="dark"] img{filter:brightness(.93)}
html[data-theme="dark"] .m-search{background:#1a2635}
html[data-theme="dark"] .m-search input{color:var(--m-ink)}
html[data-theme="dark"] input,html[data-theme="dark"] textarea,html[data-theme="dark"] select{background:#1a2635;color:var(--m-ink);border-color:var(--m-line)}
html[data-theme="dark"] .woocommerce div.product .woocommerce-tabs ul.tabs li{background:var(--m-bg-soft)}
#m-dark-toggle .m-ico-sun{color:var(--m-star)}

/* --- Kit builder --- */
.m-kit{max-width:1100px;margin:0 auto;padding:1rem}
.m-kit__title{font-size:1.6rem;margin-bottom:.25rem}
.m-kit__sub{color:var(--m-muted);margin-bottom:1.5rem}
.m-kit__step{border:1px solid var(--m-line);border-radius:14px;padding:1rem 1.25rem;margin-bottom:1.25rem;background:var(--m-bg)}
.m-kit__step legend{font-weight:800;padding:0 .5rem}
.m-kit__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.75rem}
.m-kit__card{display:flex;flex-direction:column;align-items:center;gap:.4rem;border:2px solid var(--m-line);border-radius:12px;padding:.75rem;cursor:pointer;text-align:center;transition:border-color .2s,box-shadow .2s}
.m-kit__card input{position:absolute;opacity:0;pointer-events:none}
.m-kit__card:has(input:checked){border-color:var(--m-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--m-primary) 25%,transparent)}
.m-kit__img img{max-width:100%;height:auto;border-radius:8px}
.m-kit__name{font-size:.85rem;font-weight:600;line-height:1.3}
.m-kit__price{font-weight:800;color:var(--m-primary)}
.m-kit__summary{position:sticky;bottom:0;background:var(--m-bg);border:1px solid var(--m-line);border-radius:14px;padding:1rem 1.25rem;display:flex;align-items:center;gap:1rem;flex-wrap:wrap;box-shadow:0 -4px 20px rgba(0,0,0,.06)}
.m-kit__total{font-size:1.15rem}
.m-kit__total strong{color:var(--m-primary);font-size:1.4rem}
.m-kit__discount{background:#e8f7ee;color:#1faa55;font-weight:700;border-radius:999px;padding:.3em .9em;font-size:.9rem}
html[data-theme="dark"] .m-kit__discount{background:#14301f}
.m-kit__add{margin-inline-start:auto}
.m-kit__msg{flex-basis:100%;margin:0}
.m-kit__msg--ok{color:#1faa55;font-weight:600}
.m-kit__msg--err{color:var(--m-danger);font-weight:600}

/* --- Spin wheel --- */
.m-spin{position:fixed;inset:0;z-index:999;display:flex;align-items:center;justify-content:center;padding:1rem}
.m-spin[hidden]{display:none}
.m-spin__overlay{position:absolute;inset:0;background:rgba(10,20,35,.6)}
.m-spin__box{position:relative;background:var(--m-bg);border-radius:18px;padding:1.75rem;max-width:380px;width:100%;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.m-spin__close{position:absolute;top:.5rem;inset-inline-end:.75rem;border:0;background:none;font-size:1.6rem;cursor:pointer;color:var(--m-muted)}
.m-spin__form h3{margin-top:0}
.m-spin__form input[type="email"]{width:100%;padding:.7em 1em;border:1px solid var(--m-line);border-radius:10px;margin:.75rem 0}
.m-spin__err{color:var(--m-danger);font-size:.9rem}
.m-spin__wheel{position:relative;display:inline-block}
#m-spin-canvas{max-width:100%;height:auto}
.m-spin__go{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:64px;height:64px;border-radius:50%;border:4px solid #fff;background:var(--m-navy);color:#fff;font-weight:800;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.3)}
.m-spin__result h3{margin-top:0}
.m-spin__code{display:flex;align-items:center;justify-content:center;gap:.6rem;margin-top:.75rem}
.m-spin__code code{font-size:1.2rem;font-weight:800;background:var(--m-bg-soft);border:2px dashed var(--m-primary);border-radius:10px;padding:.4em .9em;letter-spacing:.05em}
.m-spin__note{font-size:.85rem;color:var(--m-muted)}

/* --- Loyalty --- */
.m-loyalty__balance{background:linear-gradient(135deg,var(--m-navy),#1b5faa);color:#fff;border-radius:16px;padding:1.5rem;text-align:center;margin-bottom:1.25rem}
.m-loyalty__balance strong{font-size:2.6rem;display:block;line-height:1}
.m-loyalty__balance p{opacity:.85;margin:.5rem 0 0}
.m-loyalty__result{border-radius:10px;padding:.9rem 1.1rem;margin-top:1rem}
.m-loyalty__result--ok{background:#e8f7ee;color:#14663a}
.m-loyalty__result--err{background:#fdecec;color:#a02a2e}
.m-loyalty__table{width:100%;margin-top:1rem}

/* --- Product video --- */
.m-video-slide{position:relative}
.m-video-slide__ph{display:flex;align-items:center;justify-content:center;min-height:220px;background:var(--m-bg-soft);border-radius:12px;font-size:2rem;color:var(--m-muted)}
.m-video-slide__play{position:absolute;top:50%;inset-inline-start:50%;transform:translate(50%,-50%);width:64px;height:64px;border-radius:50%;background:rgba(255,122,26,.92);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(0,0,0,.3)}
[dir="ltr"] .m-video-slide__play{transform:translate(-50%,-50%)}
.m-video-slide__play svg{width:30px;height:30px;fill:#fff}

/* --- Photo reviews --- */
.m-review-photos{margin:.75rem 0}
.m-review-photos label{display:block;font-weight:700;margin-bottom:.35rem}
.m-review-photos__list{display:flex;gap:.5rem;margin-top:.6rem;flex-wrap:wrap}
.m-review-photos__list img{width:72px;height:72px;object-fit:cover;border-radius:10px;border:1px solid var(--m-line)}

/* --- Lightbox --- */
.m-lightbox{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:1rem}
.m-lightbox__overlay{position:absolute;inset:0;background:rgba(5,10,18,.8)}
.m-lightbox__box{position:relative;max-width:860px;width:100%}
.m-lightbox__content{background:#000;border-radius:14px;overflow:hidden;display:flex;justify-content:center}
.m-lightbox__content iframe{width:100%;aspect-ratio:16/9;border:0}
.m-lightbox__close{position:absolute;top:-2.6rem;inset-inline-end:0;border:0;background:#fff;color:#111;width:38px;height:38px;border-radius:50%;font-size:1.4rem;cursor:pointer;line-height:1}

@media (max-width:640px){
	.m-kit__grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}
	.m-kit__summary{gap:.6rem}
	.m-kit__add{margin-inline-start:0;width:100%}
}

/* ============ SOCIAL ICONS (v1.2.0) ============ */
.m-social{display:inline-flex;gap:.5rem;align-items:center}
.m-social a{width:32px;height:32px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.14);color:#fff;transition:transform .2s,background .2s}
.m-social a:hover{background:var(--m-primary);transform:translateY(-2px);color:#fff}
.m-social svg{width:16px;height:16px;display:block}
.m-topbar .m-social a{width:28px;height:28px;background:rgba(255,255,255,.12)}
.m-topbar .m-social svg{width:14px;height:14px}
.m-footer__bar .m-social{margin-inline-start:.8rem}
@media(max-width:720px){.m-topbar .m-social{display:none}}

/* ---------- v1.2.1: custom sidebar menu (Menu lat\u00e9ral) ---------- */
.m-side-menu a{display:flex;align-items:center;gap:.6rem;padding:.55rem .35rem;color:var(--m-ink);font-weight:600;border-radius:8px;line-height:1.35}
.m-side-menu a:hover{color:var(--m-primary);background:rgba(249,115,22,.08)}
.m-side-menu .sub-menu{list-style:none;margin:.1rem 0 .3rem;padding-inline-start:1.1rem;border-inline-start:2px solid var(--m-line)}
.m-side-menu .sub-menu a{font-weight:500;font-size:.92em;padding:.4rem .35rem}
/* ---------- v1.2.1: prevent hidden off-canvas elements from widening the page ---------- */
html,body{overflow-x:clip}

/* ---------- v1.2.4: dedicated mobile menu ---------- */
.m-catsnav__mobile{display:none}
.m-menu-open .m-catsnav__desktop{display:none}
.m-menu-open .m-catsnav__mobile{display:block}
.m-menu-open .m-catsnav__mobile .menu{flex-direction:column}
.m-menu-open .m-catsnav__mobile .sub-menu{list-style:none;margin:0;padding-inline-start:1rem}

/* ---------- v1.3.2: Page templates ---------- */
.m-page-sub{opacity:.85;margin:.5rem 0 0;font-size:1.05rem}
.m-contact-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:2rem;margin:2rem 0}
.m-contact-cards{display:grid;gap:1rem;align-content:start}
.m-contact-card{display:flex;gap:.9rem;align-items:center;background:#fff;border:1px solid #eee;border-radius:12px;padding:1rem 1.2rem;box-shadow:var(--m-shadow,0 2px 8px rgba(0,0,0,.06))}
.m-contact-card__icon{font-size:1.6rem;line-height:1}
.m-contact-card strong{display:block;font-size:.85rem;color:#666;margin-bottom:.15rem}
.m-contact-card span{font-weight:600}
.m-contact-form{background:#fff;border:1px solid #eee;border-radius:12px;padding:1.5rem}
.m-contact-map{margin:0 0 2rem}
.m-contact-map iframe{width:100%;height:320px;border:0;border-radius:12px}
.m-about-features{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;margin:2rem 0}
.m-about-feature{background:#fff;border:1px solid #eee;border-radius:12px;padding:1.3rem;text-align:center}
.m-about-feature strong{display:block;margin-bottom:.4rem;color:var(--m-primary,#0a2540)}
.m-faq-wrap{max-width:800px;margin:2rem auto}
.m-faq__item{border:1px solid #eee;border-radius:10px;margin-bottom:.7rem;background:#fff;overflow:hidden}
.m-faq__q{width:100%;display:flex;justify-content:space-between;align-items:center;padding:1rem 1.2rem;background:none;border:0;font-weight:600;font-size:1rem;cursor:pointer;text-align:start}
.m-faq__icon{font-size:1.3rem;color:var(--m-accent,#f60);transition:transform .2s}
.m-faq__item.open .m-faq__icon{transform:rotate(45deg)}
.m-faq__a{padding:0 1.2rem 1.1rem;color:#555}
@media(max-width:768px){
.m-contact-grid{grid-template-columns:1fr}
.m-about-features{grid-template-columns:repeat(2,1fr)}
}

/* ---------- v1.3.9.11: mobile categories sheet + WhatsApp center button ---------- */
.m-mnav__item--wa{color:#1faa55}
.m-mnav__item--wa:hover,.m-mnav__item--wa:focus{color:#128c4b}
.m-catsheet{position:fixed;inset:0;z-index:600;background:var(--m-bg);display:flex;flex-direction:column;transform:translateY(103%);transition:transform .32s ease;visibility:hidden}
.m-catsheet[hidden]{display:none}
.m-catsheet.open{transform:none;visibility:visible}
.m-catsheet__head{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.1rem .8rem;border-bottom:1px solid var(--m-line)}
.m-catsheet__head h2{margin:0;font-size:1.25rem;font-weight:800;color:var(--m-navy)}
.m-catsheet__close{border:0;background:var(--m-bg-soft);width:40px;height:40px;border-radius:50%;font-size:1.05rem;cursor:pointer;color:var(--m-navy);flex:none}
.m-catsheet__body{overflow-y:auto;padding:.4rem 1.1rem calc(1.2rem + env(safe-area-inset-bottom))}
.m-catsheet__quick{display:flex;flex-direction:column}
.m-catsheet__quick a{display:flex;align-items:center;gap:.8rem;padding:.8rem 0;font-weight:800;color:var(--m-navy);text-decoration:none;font-size:1rem;border-bottom:1px solid var(--m-line)}
.m-catsheet__quick .m-catsheet__qico{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:12px;background:#fde8e8;color:#d92b2b;flex:none}
.m-catsheet__quick .m-catsheet__qico svg{width:21px;height:21px}
.m-catsheet__list{list-style:none;margin:0;padding:0}
.m-catsheet__list>li{border-bottom:1px solid var(--m-line)}
.m-catsheet__row{display:flex;align-items:center;gap:.8rem;padding:.85rem 0;color:var(--m-navy);text-decoration:none;font-size:1rem;font-weight:600;width:100%;background:none;border:0;font-family:inherit;cursor:pointer;text-align:start}
.m-catsheet__row .m-cat-ico{display:inline-flex;flex:none;color:var(--m-teal,#0a9a8a)}
.m-catsheet__row .m-cat-ico svg{width:24px;height:24px}
.m-catsheet__row .m-cat-label{flex:1;min-width:0}
.m-catsheet__chev{color:var(--m-muted);font-size:1.3rem;transition:transform .25s;flex:none}
details.m-catsheet__group[open] .m-catsheet__chev{transform:rotate(90deg)}
.m-catsheet__subs{list-style:none;margin:0;padding:0 0 .7rem}
.m-catsheet__subs a{display:block;padding:.5rem 0 .5rem 2.6rem;color:var(--m-text);text-decoration:none;font-size:.95rem}
.m-catsheet__subs a.m-catsheet__all{font-weight:800;color:var(--m-primary)}

/* ============================================================
   MARDUINO 1.3.9.15 — brands marquee (homepage, under the hero)
   Auto-scrolling strip; pauses on hover; Customizer-driven
   (« Mardino: Brands marquee »). CSS logical properties = RTL-safe.
   ============================================================ */
.m-brands { padding: 26px 0 6px; }
.m-brands__title { text-align: center; font-size: 20px; color: var(--m-navy, #0b2a4a); margin: 0 0 14px; }
.m-marquee { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.m-marquee__track { display: flex; gap: 12px; width: max-content; padding: 2px 0 10px; animation: m-brands-scroll var(--m-brands-speed, 30s) linear infinite; }
.m-marquee:hover .m-marquee__track { animation-play-state: paused; }
@keyframes m-brands-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.m-brand { min-width: 170px; height: 62px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; border: 1px solid #e3e9ef; border-radius: 10px; background: #fff; padding: 6px 14px; text-decoration: none; }
.m-brand img { max-height: 40px; max-width: 140px; width: auto; filter: grayscale(1); opacity: .75; transition: filter .25s, opacity .25s; }
.m-brand:hover img { filter: none; opacity: 1; }
.m-brand__name { font-weight: 800; font-size: 16px; letter-spacing: .3px; color: #9aa7b4; transition: color .25s; text-align: center; }
.m-brand:hover .m-brand__name { color: var(--m-navy, #0b2a4a); }
.m-brand:hover { border-color: var(--m-orange, #ff8c1a); }
@media (prefers-reduced-motion: reduce) { .m-marquee__track { animation: none; } }

/* ============================================================
   MARDUINO 1.3.9.15 — trust logos (client companies, homepage)
   Static grid; Customizer-driven (« Mardino: Trust logos »).
   Hidden while the company list is empty.
   ============================================================ */
.m-trust { padding: 30px 0 36px; }
.m-trust__title { text-align: center; font-size: 20px; color: var(--m-navy, #0b2a4a); margin: 0 0 4px; }
.m-trust__sub { text-align: center; font-size: 13.5px; color: #7b8a99; margin: 0 0 16px; }
.m-trust__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; max-width: 1000px; margin: 0 auto; }
.m-client { min-height: 72px; display: flex; align-items: center; justify-content: center; border: 1px solid #e3e9ef; border-radius: 10px; background: #fff; padding: 10px 14px; text-decoration: none; }
.m-client img { max-height: 44px; max-width: 150px; width: auto; filter: grayscale(1); opacity: .75; transition: filter .25s, opacity .25s; }
.m-client:hover img { filter: none; opacity: 1; }
.m-client__name { font-weight: 800; font-size: 15.5px; color: #9aa7b4; transition: color .25s; text-align: center; }
.m-client:hover .m-client__name { color: var(--m-navy, #0b2a4a); }
.m-client:hover { border-color: var(--m-orange, #ff8c1a); }

/* ============================================================
   MARDUINO 1.3.9.15 — advertising slot (homepage)
   Paid banner emplacement, always labelled « Publicité »;
   Customizer-driven (« Mardino: Advertising slot »). Without an
   advertiser image, shows the house booking teaser.
   ============================================================ */
.m-ad { padding: 10px 0 4px; }
.m-ad__box { position: relative; border: 1.5px solid #ffb35c; background: linear-gradient(115deg, #fff3e2, #ffe3c2); border-radius: 12px; padding: 18px 16px; }
.m-ad__tag { position: absolute; top: -9px; inset-inline-end: 14px; background: #8a97a5; color: #fff; font-size: 10.5px; letter-spacing: .6px; padding: 2px 9px; border-radius: 8px; text-transform: uppercase; }
.m-ad__banner { display: block; }
.m-ad__banner img { display: block; width: 100%; height: auto; border-radius: 8px; }
.m-ad__teaser { display: flex; align-items: center; gap: 14px; }
.m-ad__icon { font-size: 28px; }
.m-ad__texts { display: flex; flex-direction: column; gap: 2px; }
.m-ad__title { font-size: 16.5px; color: #7a4a00; }
.m-ad__text { font-size: 12.5px; color: #8a6a33; }
.m-ad__cta { margin-inline-start: auto; background: #7a4a00; color: #fff; padding: 9px 16px; border-radius: 20px; font-size: 12.5px; font-weight: 700; white-space: nowrap; text-decoration: none; }
@media (max-width: 560px) { .m-ad__teaser { flex-direction: column; text-align: center; } .m-ad__cta { margin-inline-start: 0; } }

/* 2026-11-05: card image absolute fill — keeps product photos filling their
 * boxes on phones (fallback path when a card still renders an <img>). */
.m-card__media img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;display:block!important}