/* Pixmania custom theme layer — brand tokens from brand_brief.json */
:root{
  --pix-green:#006A38;
  --pix-pink:#FF67D9;
  --pix-accent:#019950;
  --pix-text:#101010;
  --pix-muted:#767676;
  --pix-border:#ECECEC;
  --pix-surface:#FAFAFA;
}
html,body{font-family:Arial,Helvetica,"Helvetica Neue",system-ui,sans-serif;color:var(--pix-text);background:#fff}
h1,h2,h3,.mk-section-title{font-family:Arial,Helvetica,sans-serif;font-weight:800;letter-spacing:.01em}

/* container rhythm like reference */
.mk-container{max-width:1400px;margin:0 auto;padding-left:24px;padding-right:24px}

/* top thin credit/promo bar */
.mk-promobar{background:#fff;color:#101010;font-size:11px;line-height:1.35;text-align:center;padding:6px 12px;border-bottom:1px solid var(--pix-border)}

/* header */
.mk-header{background:#fff}
.mk-header .mk-search .input{background:#F2F2F2;border:none;border-radius:9999px;height:44px;font-size:14px}
.mk-headlink{font-weight:800;text-transform:uppercase;font-size:13px;letter-spacing:.02em;color:#0F2A5B;display:flex;align-items:center;gap:8px}
.mk-headlink.mk-acct{color:#8A4B12}
.mk-navrow{border-top:1px solid var(--pix-border);border-bottom:1px solid var(--pix-border)}
.mk-navrow a{font-size:14px;font-weight:700;color:#101010;white-space:nowrap}
.mk-navrow a.is-green{color:var(--pix-accent)}
.mk-navrow a.is-pink{color:var(--pix-pink)}
.mk-badge-new{background:var(--pix-pink);color:#fff;font-size:9px;font-weight:800;border-radius:9999px;padding:1px 6px;position:relative;top:-8px;margin-left:-4px}

/* hero */
.mk-hero{position:relative;background:var(--pix-green);border-radius:0;overflow:hidden;min-height:220px}
.mk-hero-grid{display:grid;grid-template-columns:minmax(240px,1fr) 2fr;gap:24px;align-items:center;min-height:220px}
.mk-hero h1{color:#fff;font-size:34px;line-height:1.05;font-weight:900}
.mk-hero h1 em{font-style:normal;color:var(--pix-pink)}
.mk-coupon{background:transparent;color:#fff;text-align:center}
.mk-coupon .mk-amount{font-size:38px;font-weight:900;color:#fff}
.mk-coupon .mk-code{display:inline-block;background:#fff;color:var(--pix-green);border-radius:9999px;padding:2px 12px;font-size:12px;font-weight:700;margin-top:6px}
.mk-dot{width:8px;height:8px;border-radius:9999px;background:rgba(255,255,255,.55)}
.mk-dot.is-active{background:var(--pix-pink)}

/* capsule category tiles */
.mk-tile{display:flex;flex-direction:column;align-items:center;gap:10px}
.mk-tile .mk-tile-img{width:100%;aspect-ratio:16/11;background:var(--pix-surface);border-radius:9999px/60%;overflow:hidden;position:relative;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.mk-tile img{width:70%;height:70%;object-fit:contain}
.mk-tile .mk-off{position:absolute;top:10px;right:16px;background:var(--pix-pink);color:#fff;font-size:11px;font-weight:800;border-radius:9999px;padding:2px 8px}
.mk-tile span{font-size:13px}

/* product card */
.mk-pcard{background:#fff;border:1px solid var(--pix-border);border-radius:6px;padding:10px;display:flex;flex-direction:column;gap:6px;transition:box-shadow .18s ease,transform .18s ease}
.mk-pcard:hover{box-shadow:0 6px 18px rgba(0,0,0,.10);transform:translateY(-2px)}
.mk-pcard .mk-promo-chip{background:#FDE6F7;color:#B0128B;font-size:10px;font-weight:700;border-radius:3px;padding:2px 6px;align-self:flex-start}
.mk-pcard .mk-thumb{aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;padding:8px}
.mk-pcard .mk-thumb img{max-height:100%;max-width:100%;object-fit:contain}
.mk-pcard .mk-name{font-size:12.5px;line-height:1.35;min-height:52px}
.mk-pcard .mk-price{font-size:16px;font-weight:800}
.mk-pcard .mk-old{font-size:11px;color:var(--pix-muted);text-decoration:line-through}
.mk-pcard .mk-off2{background:var(--pix-pink);color:#fff;font-size:10px;font-weight:800;border-radius:3px;padding:1px 5px}
.mk-pcard .mk-small{font-size:10.5px;color:var(--pix-muted)}
.mk-pcard .mk-stars{color:var(--pix-pink);font-size:11px}

.mk-promo-card{background:var(--pix-green);color:#fff;border-radius:6px;padding:16px;display:flex;flex-direction:column;justify-content:center;gap:10px}
.mk-promo-card h3{font-size:17px;font-weight:900;line-height:1.15}
.mk-promo-card h3 em{font-style:normal;color:var(--pix-pink)}

.mk-section-title{font-size:18px;text-transform:uppercase;margin-bottom:14px}

/* brands */
.mk-brand{border:1px solid var(--pix-border);border-radius:6px;height:78px;display:flex;align-items:center;justify-content:center;font-weight:800;color:#111;font-size:15px;background:#fff}

/* trust row */
.mk-trust i{color:var(--pix-pink);font-size:26px}
.mk-trust .mk-t{font-size:12px;text-align:center;margin-top:6px}

/* footer */
.mk-footer{background:#fff;border-top:1px solid var(--pix-border)}
.mk-footer h4{font-size:13px;font-weight:800;text-transform:uppercase;margin-bottom:10px}
.mk-footer a{font-size:13px;color:#101010}
.mk-footer a:hover{color:var(--pix-green);text-decoration:underline}
.mk-newsletter{background:var(--pix-surface)}
.mk-paychip{border:1px solid var(--pix-border);border-radius:4px;padding:4px 10px;font-size:11px;color:#444;background:#fff}

/* btns */
.btn-pix{background:var(--pix-pink);color:#fff;border:none;border-radius:9999px;font-weight:700}
.btn-pix:hover{background:#f04ec6;color:#fff}
.mk-link-more{font-size:13px;color:#101010;text-decoration:underline}
@media (max-width:768px){
  .mk-hero-grid{grid-template-columns:1fr}
  .mk-hero h1{font-size:24px}
  .mk-coupon .mk-amount{font-size:26px}
}

/* hero as real reference slide */
.mk-hero{background:#fff;min-height:0}
.mk-hero img{display:block;width:100%}
.mk-hero-cta{position:absolute;left:3%;top:44%;width:14%;height:16%;border-radius:9999px}
.mk-hero-dots{background:#fff}
.mk-tile-img.is-raw{background:#fff;box-shadow:none;border-radius:0;aspect-ratio:auto}
.mk-tile-img.is-raw img{width:100%;height:auto;object-fit:contain}

/* mobile drawer overlay wrapper (DaisyUI drawer kept intact, only positioning added) */
.mk-mobile-menu{position:fixed;inset:0;z-index:60;pointer-events:none}
.mk-mobile-menu .drawer-toggle:checked ~ .contents .drawer-side,
.mk-mobile-menu:has(.drawer-toggle:checked){pointer-events:auto}
.mk-mobile-menu .drawer-content{display:none}

/* product variant swatches (reference: Couleur row) */
.mk-swatch{display:inline-block;width:28px;height:20px;border-radius:4px;border:1px solid var(--pix-border);cursor:pointer}
.mk-swatch.is-active{outline:2px solid var(--pix-green);outline-offset:2px}

/* ---- catalog lane (category / product / search) ---- */
.mk-pcard .mk-stars i{margin-right:1px}
.mk-pcard .mk-name{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;color:#101010}
.mk-pcard .mk-name:hover{text-decoration:underline}
.mk-pcard .mk-thumb img{mix-blend-mode:multiply}
aside{min-width:0;overflow:hidden}
aside .menu a{padding:4px 0;font-size:13px}
aside .select,aside .input,aside .btn{width:100%;min-width:0;max-width:100%}
.mk-pagination .pagination{display:flex;gap:6px;list-style:none;padding:0;margin:0;flex-wrap:wrap}
.mk-pagination .page-item .page-link{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:32px;padding:0 8px;border:1px solid var(--pix-border);border-radius:9999px;font-size:12px;color:#101010;text-decoration:none;background:#fff}
.mk-pagination .page-item.active .page-link{background:var(--pix-green);border-color:var(--pix-green);color:#fff}
.mk-thumbs{overflow-x:auto}
.mk-thumbs>*{flex:0 0 auto}
@media (max-width:1023px){
  aside .menu,aside .list-group{max-height:240px;overflow-y:auto}
  aside{margin-bottom:8px}
}

/* stock column-left modules dropped into the catalog sidebar: render like the
   reference "Toutes nos catégories" list until the module lane themes them */
aside .list-group,aside ul.list-unstyled,aside #column-left .list-group{display:block;padding:0;margin:0 0 18px;border:0;list-style:none}
aside .list-group-item,aside .list-group a{display:block;padding:6px 0;border:0;background:transparent;font-size:13px;color:#101010;text-decoration:none}
aside .list-group-item.active,aside .list-group a:hover{background:transparent;color:var(--pix-green);text-decoration:underline}
aside h3,aside .card-header{font-size:18px;font-weight:800;text-transform:uppercase;margin-bottom:14px;padding:0;background:transparent;border:0}
aside .card,aside .card-body{border:0;padding:0;background:transparent}
aside img{max-width:100%;height:auto}

/* daisyUI radius token is pill-shaped globally — keep boxes square where it matters */
.checkbox,.textarea,.select,.input:not(.rounded-full){border-radius:4px}
.mk-pcard .mk-promo-chip{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}