/*
Theme Name: Klädhallen
Theme URI: https://kladhallen.se
Description: Klädhallens egna barntema till Storefront — rent och modernt mode-tema för hela familjen.
Author: Tomsjo Consulting AB
Template: storefront
Version: 1.0.0
Text Domain: kladhallen
*/

:root{
  --kh-ink:#14151a;
  --kh-muted:#6b7280;
  --kh-line:#ececec;
  --kh-bg:#ffffff;
  --kh-soft:#f7f7f8;
  --kh-accent:#14151a;
  --kh-accent-hover:#3a3d46;
  --kh-radius:14px;
  --kh-maxw:1280px;
}

/* ---------- Bas / typografi ---------- */
body.storefront,
.storefront-page{
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--kh-ink);
  background:var(--kh-bg);
  -webkit-font-smoothing:antialiased;
}
.site h1,.site h2,.site h3,.site h4{
  font-family:"Inter",sans-serif;
  letter-spacing:-.02em;
  color:var(--kh-ink);
  font-weight:700;
}
a{color:var(--kh-ink);}
a:hover{color:var(--kh-muted);}

.col-full{max-width:var(--kh-maxw);}

/* ---------- Header ---------- */
.site-header{
  background:#fff;
  border-bottom:1px solid var(--kh-line);
  padding-top:1.1em;padding-bottom:1.1em;
  box-shadow:none;
}
.site-header .site-branding{margin-bottom:0;}
.site-title{font-weight:800;letter-spacing:-.04em;font-size:1.9rem;}
.site-title a{color:var(--kh-ink)!important;}
.site-header .custom-logo-link img{max-height:46px;width:auto;}
.beta,.site-header-cart{margin-bottom:0;}

/* primär meny */
.storefront-primary-navigation{background:#fff;border:none;box-shadow:none;}
.main-navigation ul li a{
  font-weight:600;font-size:.95rem;color:var(--kh-ink);
  padding-top:1em;padding-bottom:1em;text-transform:none;
}
.main-navigation ul li a:hover{color:var(--kh-muted);}
.main-navigation ul.menu>li.menu-item-has-children>a:after,
.main-navigation ul.nav-menu>li.menu-item-has-children>a:after{opacity:.5;}
.main-navigation ul.menu ul.sub-menu,
.main-navigation ul.nav-menu ul.children{
  border-radius:var(--kh-radius);
  box-shadow:0 18px 48px rgba(0,0,0,.12);
  border:1px solid var(--kh-line);
  padding:.4em 0;
}
.site-search .widget_product_search input[type=search],
.site-header .widget_product_search input[type=search]{
  border-radius:999px;background:var(--kh-soft);border:1px solid var(--kh-line);
}

/* ---------- Knappar ---------- */
button,.button,input[type=submit],
.added_to_cart,
.woocommerce a.button,.woocommerce button.button,
.woocommerce .button,.woocommerce-page a.button{
  background:var(--kh-accent);color:#fff;border-radius:999px;
  font-weight:600;letter-spacing:.01em;border:none;
  padding:.85em 1.6em;transition:background .15s ease, transform .15s ease;
}
button:hover,.button:hover,input[type=submit]:hover,
.woocommerce a.button:hover,.woocommerce button.button:hover,
.woocommerce .button:hover{background:var(--kh-accent-hover);color:#fff;transform:translateY(-1px);}
.button.kh-ghost,a.kh-ghost{background:#fff;color:var(--kh-ink)!important;border:1.5px solid var(--kh-ink);}
.button.kh-ghost:hover,a.kh-ghost:hover{background:var(--kh-ink);color:#fff!important;}

/* ---------- Produktrutnät ---------- */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product{
  background:#fff;border:1px solid var(--kh-line);border-radius:var(--kh-radius);
  padding:14px;transition:box-shadow .18s ease, transform .18s ease;
  text-align:left;
}
.woocommerce ul.products li.product:hover{
  box-shadow:0 14px 36px rgba(0,0,0,.10);transform:translateY(-3px);
}
.woocommerce ul.products li.product a img{
  border-radius:10px;margin-bottom:.8em;background:var(--kh-soft);
  aspect-ratio:3/4;object-fit:cover;width:100%;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:.98rem;font-weight:600;padding:.2em 0;line-height:1.35;color:var(--kh-ink);
}
.woocommerce ul.products li.product .price{color:var(--kh-ink);font-weight:700;}
.woocommerce ul.products li.product .price del{color:var(--kh-muted);font-weight:400;}
.woocommerce ul.products li.product .button{margin-top:.4em;}
.woocommerce span.onsale{
  background:var(--kh-ink);border-radius:999px;min-height:auto;min-width:auto;
  padding:.35em .7em;font-weight:600;line-height:1;top:18px;left:18px;right:auto;
}
/* "Köp hos…" external-knappar diskret */
.woocommerce ul.products li.product .added_to_cart{display:none;}

/* ---------- Produktsida ---------- */
.single-product div.product .product_title{font-size:2rem;}
.single-product div.product p.price{font-size:1.6rem;font-weight:800;color:var(--kh-ink);}
.single-product .images img{border-radius:var(--kh-radius);background:var(--kh-soft);}
.single-product .summary .single_add_to_cart_button{padding:1em 2.4em;font-size:1.05rem;}

/* ---------- Hero / startsida ---------- */
.kh-hero{
  position:relative;border-radius:22px;overflow:hidden;margin:0 0 56px;
  background:linear-gradient(120deg,#f3f1ee 0%,#eceaf2 100%);
  min-height:440px;display:flex;align-items:center;
}
.kh-hero__inner{padding:64px 56px;max-width:620px;}
.kh-hero h1{font-size:3rem;line-height:1.04;margin:0 0 .35em;letter-spacing:-.04em;}
.kh-hero p{font-size:1.2rem;color:var(--kh-muted);margin:0 0 1.6em;}
.kh-hero .kh-cta-row{display:flex;gap:14px;flex-wrap:wrap;}
@media(max-width:768px){
  .kh-hero{min-height:auto; display:block;}            /* återställ flex → stacka */
  .kh-hero__inner{max-width:100%; width:100%; box-sizing:border-box; padding:34px 22px;}
  .kh-hero h1{font-size:1.8rem;}
  .kh-hero p{font-size:1.02rem;}
  .kh-hero__media{display:none !important;}            /* dölj collage helt på mobil */
  .kh-hero-search{flex-direction:column; max-width:100%;}
  .kh-hero-search input[type=search], .kh-hero-search button{width:100%; box-sizing:border-box;}
}

/* sektionsrubriker */
.kh-section{margin:0 0 56px;}
.kh-section__head{display:flex;align-items:baseline;justify-content:space-between;margin:0 0 22px;}
.kh-section__head h2{font-size:1.6rem;margin:0;}
.kh-section__head a{font-weight:600;color:var(--kh-muted);font-size:.95rem;}
.kh-section__head a:hover{color:var(--kh-ink);}

/* kategori-kort */
.kh-cats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.kh-cat{
  position:relative;border-radius:18px;overflow:hidden;min-height:260px;
  display:flex;align-items:flex-end;color:#fff;text-decoration:none;
  background:#ddd;
}
.kh-cat::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 35%,rgba(0,0,0,.55) 100%);}
.kh-cat img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.kh-cat span{position:relative;z-index:2;padding:24px;font-size:1.45rem;font-weight:700;letter-spacing:-.02em;}
.kh-cat:hover img{transform:scale(1.04);transition:transform .4s ease;}
@media(max-width:768px){.kh-cats{grid-template-columns:1fr 1fr;gap:12px;}.kh-cat{min-height:150px;}.kh-cat span{font-size:1.02rem;padding:14px;}}

/* trygghetsrad */
.kh-usps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin:0 0 56px;}
.kh-usp{background:var(--kh-soft);border-radius:var(--kh-radius);padding:22px;text-align:center;}
.kh-usp strong{display:block;font-size:1rem;margin-bottom:.2em;}
.kh-usp span{color:var(--kh-muted);font-size:.88rem;}
@media(max-width:768px){.kh-usps{grid-template-columns:1fr 1fr;}}

/* ---------- Footer ---------- */
.site-footer{background:var(--kh-ink);color:#cfd0d4;margin-top:0;}
.site-footer a{color:#fff;}
.site-footer a:hover{color:#cfd0d4;}
.site-footer .site-info{background:#0e0f13;color:#b8bcc6;}
.kh-credit{opacity:.85;}
.kh-credit a{text-decoration:underline;}

/* dölj WC-brus som inte passar en affiliate-sajt */
.woocommerce-store-notice,p.demo_store{border-radius:0;}

/* ---------- Startsida: produktrader 3 kolumner, lagom bilder ---------- */
.kh-front-grid.products.columns-3 li.product{
  width:31.5%!important; margin-right:2.75%!important; margin-bottom:2.75%!important; float:left;
}
.kh-front-grid.products.columns-3 li.product:nth-child(3n){ margin-right:0!important; }
.kh-front-grid.products.columns-3 li.product:nth-child(3n+1){ clear:both; }
.kh-front-grid.products li.product img,
.kh-front-grid.products li.product .kh-extimg{
  aspect-ratio:3/4; object-fit:cover; width:100%; max-height:420px;
}
@media(max-width:768px){
  .kh-front-grid.products.columns-3 li.product{ width:48%!important; margin-right:4%!important; }
  .kh-front-grid.products.columns-3 li.product:nth-child(3n){ margin-right:4%!important; }
  .kh-front-grid.products.columns-3 li.product:nth-child(2n){ margin-right:0!important; }
}

/* ---------- Produktsida: beskrivning höger om bild + artikelinfo ---------- */
.single-product div.product .kh-pdp-desc{ margin:1.6em 0 1em; }
.single-product div.product .kh-pdp-desc h2{ font-size:1.15rem; margin:0 0 .5em; }
.single-product div.product .kh-pdp-desc p{ color:#3a3d46; line-height:1.6; margin:0 0 .8em; }
.single-product div.product .kh-pdp-meta{
  margin-top:1.4em; padding-top:1.1em; border-top:1px solid var(--kh-line);
  display:flex; flex-direction:column; gap:.35em; font-size:.9rem; color:var(--kh-muted);
}
.kh-pdp-meta__row strong{ color:var(--kh-ink); font-weight:600; }
/* dölj kvarvarande varukorgs-/kassarester */
.site-header-cart, .cart-contents, .woocommerce-cart, .added_to_cart, button.single_add_to_cart_button.alt + .added_to_cart{ display:none!important; }

/* ---------- Footer (egen 4-kolumnersfooter) ---------- */
.kh-footer{ padding:56px 0 28px; }
.kh-footer__cols{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:40px; }
.kh-footer h3{ color:#fff; font-size:1.4rem; margin:0 0 .5em; letter-spacing:-.03em; }
.kh-footer h4{ color:#fff; font-size:1rem; margin:0 0 1em; }
.kh-footer p{ color:#c9ccd4; font-size:.9rem; line-height:1.6; margin:0 0 .8em; }
.kh-footer__tagline{ color:#cfd0d4; font-weight:600; }
.kh-footer ul{ list-style:none; margin:0; padding:0; }
.kh-footer ul li{ margin:0 0 .55em; }
.kh-footer ul li a{ color:#dfe1e6; font-size:.9rem; text-decoration:none; }
.kh-footer ul li a:hover{ color:#fff; text-decoration:underline; }
.kh-footer__company{ color:#b8bcc6; font-size:.82rem; line-height:1.7; margin-top:1em; }
.kh-footer__company strong{ color:#cfd0d4; }
.kh-footer__bottom{
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
  margin-top:40px; padding-top:22px; border-top:1px solid rgba(255,255,255,.12);
  font-size:.82rem; color:#b8bcc6;
}
.kh-footer__credit a{ color:#fff; text-decoration:underline; }
@media(max-width:768px){ .kh-footer__cols{ grid-template-columns:1fr 1fr; gap:28px; } }
@media(max-width:480px){ .kh-footer__cols{ grid-template-columns:1fr; } }

/* ---------- Cookie-banner ---------- */
.kh-cookie{ position:fixed; left:0; right:0; bottom:0; z-index:9999; background:#14151a; color:#eceef2; box-shadow:0 -8px 30px rgba(0,0,0,.3); }
.kh-cookie__inner{ max-width:1280px; margin:0 auto; padding:18px 24px; display:flex; align-items:center; gap:24px; flex-wrap:wrap; }
.kh-cookie__txt{ flex:1; min-width:260px; margin:0; font-size:.88rem; line-height:1.5; color:#cfd0d4; }
.kh-cookie__txt a{ color:#fff; text-decoration:underline; }
.kh-cookie__btns{ display:flex; gap:10px; }
.kh-cookie__btn{ background:#fff; color:#14151a; border:none; border-radius:999px; padding:.7em 1.4em; font-weight:600; font-size:.85rem; cursor:pointer; }
.kh-cookie__btn--ghost{ background:transparent; color:#cfd0d4; border:1.5px solid rgba(255,255,255,.35); }
.kh-cookie__btn:hover{ opacity:.9; }

/* ============================================================
   KLÄDHALLEN — DESIGN-UPPFRÄSCH 2.0 (mjukare, mer levande)
   ============================================================ */
:root{
  --kh-accent2:#c8553d;        /* varm terrakotta-accent */
  --kh-shadow:0 2px 8px rgba(20,21,26,.04), 0 8px 24px rgba(20,21,26,.06);
  --kh-shadow-lg:0 18px 50px rgba(20,21,26,.13);
  --kh-ease:cubic-bezier(.22,.61,.36,1);
}
body.storefront{ background:#fafafa; }
.col-full{ padding-left:24px; padding-right:24px; }

/* ---- Header: lite luftigare + sticky ---- */
.site-header{
  position:sticky; top:0; z-index:500; backdrop-filter:saturate(140%) blur(6px);
  background:rgba(255,255,255,.92); border-bottom:1px solid var(--kh-line);
  transition:box-shadow .25s var(--kh-ease);
}
.site-header:hover{ box-shadow:0 4px 20px rgba(0,0,0,.05); }
.site-title{ font-weight:800; }
.site-branding .site-title a{ background:linear-gradient(90deg,var(--kh-ink),#41434d); -webkit-background-clip:text; background-clip:text; }

/* ---- Menyn: animerad underline ---- */
.main-navigation ul li a{ position:relative; }
.main-navigation ul.menu>li>a::after,
.main-navigation ul.nav-menu>li>a::after{
  content:""; position:absolute; left:1em; right:1em; bottom:.55em; height:2px;
  background:var(--kh-ink); transform:scaleX(0); transform-origin:left; transition:transform .25s var(--kh-ease);
}
.main-navigation ul.menu>li:hover>a::after{ transform:scaleX(1); }
.main-navigation ul.menu ul.sub-menu{ animation:khFade .2s var(--kh-ease); }
@keyframes khFade{ from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:translateY(0);} }

/* ---- Hero: rikare, mer liv ---- */
.kh-hero{
  background:radial-gradient(120% 140% at 0% 0%, #efe9e3 0%, #e7e4ee 55%, #e2e8f0 100%);
  min-height:480px; box-shadow:var(--kh-shadow);
}
.kh-hero::before{
  content:""; position:absolute; right:-80px; top:-80px; width:420px; height:420px; border-radius:50%;
  background:radial-gradient(circle, rgba(200,85,61,.16), transparent 70%);
}
.kh-hero h1{ font-size:3.4rem; background:linear-gradient(120deg,var(--kh-ink),#3a3d46); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.kh-hero .button{ box-shadow:0 8px 24px rgba(20,21,26,.18); }
.kh-hero .button:hover{ transform:translateY(-2px) scale(1.02); }

/* ---- USP-rad: ikoner + mjukare kort ---- */
.kh-usps{ gap:16px; }
.kh-usp{ background:#fff; box-shadow:var(--kh-shadow); border:1px solid var(--kh-line); transition:transform .2s var(--kh-ease), box-shadow .2s var(--kh-ease); }
.kh-usp:hover{ transform:translateY(-3px); box-shadow:var(--kh-shadow-lg); }
.kh-usp strong{ font-size:1.02rem; }

/* ---- Sektionsrubriker med accentstreck ---- */
.kh-section__head h2{ position:relative; padding-left:16px; }
.kh-section__head h2::before{
  content:""; position:absolute; left:0; top:.15em; bottom:.15em; width:4px; border-radius:4px;
  background:linear-gradient(var(--kh-ink),var(--kh-accent2));
}

/* ---- Kategori-kort: mer djup + zoom ---- */
.kh-cat{ min-height:300px; box-shadow:var(--kh-shadow); transition:transform .3s var(--kh-ease), box-shadow .3s var(--kh-ease); }
.kh-cat:hover{ transform:translateY(-4px); box-shadow:var(--kh-shadow-lg); }
.kh-cat span{ font-size:1.6rem; }
.kh-cat::after{ background:linear-gradient(180deg,rgba(0,0,0,0) 30%,rgba(0,0,0,.62) 100%); }

/* ---- Produktkort: mjukare, lyfter vid hover ---- */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product{
  border:1px solid #f0f0f1; box-shadow:var(--kh-shadow); border-radius:16px;
  transition:transform .22s var(--kh-ease), box-shadow .22s var(--kh-ease);
}
.woocommerce ul.products li.product:hover{ transform:translateY(-5px); box-shadow:var(--kh-shadow-lg); }
.woocommerce ul.products li.product a img,
.kh-extimg{ border-radius:12px; transition:transform .4s var(--kh-ease); }
.woocommerce ul.products li.product:hover a img,
.woocommerce ul.products li.product:hover .kh-extimg{ transform:scale(1.03); }
.woocommerce ul.products li.product .price{ font-size:1.05rem; }
.woocommerce ul.products li.product .price del{ font-size:.9rem; }
.woocommerce ul.products li.product .price ins{ text-decoration:none; color:var(--kh-accent2); }
.woocommerce span.onsale{ background:var(--kh-accent2); box-shadow:0 4px 12px rgba(200,85,61,.3); }

/* ---- Knappar: mjukare lyft ---- */
.button,.woocommerce a.button,.woocommerce button.button{
  box-shadow:0 4px 14px rgba(20,21,26,.12); transition:transform .15s var(--kh-ease), box-shadow .2s var(--kh-ease), background .15s;
}
.button:hover{ box-shadow:0 8px 22px rgba(20,21,26,.2); }

/* ---- Produktsida: luftigare ---- */
.single-product div.product .product_title{ font-size:2.2rem; line-height:1.1; }
.single-product .kh-buy.button{ font-size:1.05rem; padding:1em 2.6em; }

/* ---- Storleksväljare: snyggare chips ---- */
.kh-size{ border-radius:12px; transition:all .15s var(--kh-ease); }
.kh-size:hover{ border-color:var(--kh-ink); background:var(--kh-ink); color:#fff; transform:translateY(-2px); }

/* ---- Generell mjukhet ---- */
img{ border-radius:8px; }
.kh-section{ margin-bottom:64px; }

/* ============================================================
   LEKFULLT 3.0 — kategorikort med bild+färgton, varmare header
   ============================================================ */
/* Kategori-kort: riktig bild + färgtonad overlay per avdelning */
.kh-cats{ gap:22px; }
.kh-cat{
  background-size:cover; background-position:center top; min-height:320px;
  border-radius:22px; overflow:hidden;
}
.kh-cat::after{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(165deg, rgba(20,21,26,.12) 0%, rgba(20,21,26,.66) 100%);
  transition:opacity .3s var(--kh-ease);
}
.kh-cat__label{
  position:relative; z-index:2; padding:26px; width:100%;
  display:flex; flex-direction:column; gap:.25em;
  font-size:1.7rem; font-weight:800; color:#fff; letter-spacing:-.02em;
  text-shadow:0 2px 14px rgba(0,0,0,.35);
}
.kh-cat__cta{
  font-size:.92rem; font-weight:600; font-style:normal; opacity:0;
  transform:translateY(8px); transition:opacity .25s var(--kh-ease), transform .25s var(--kh-ease);
}
.kh-cat:hover .kh-cat__cta{ opacity:1; transform:translateY(0); }
.kh-cat:hover::after{ background:linear-gradient(165deg, rgba(20,21,26,.18) 0%, rgba(20,21,26,.74) 100%); }
/* lekfulla färgtoner per avdelning (tonar bild lite) */
.kh-cat--dam::after{    background:linear-gradient(165deg, rgba(200,85,61,.20), rgba(20,21,26,.68)); }
.kh-cat--herr::after{   background:linear-gradient(165deg, rgba(46,73,104,.22), rgba(20,21,26,.68)); }
.kh-cat--barn::after{   background:linear-gradient(165deg, rgba(86,150,138,.24), rgba(20,21,26,.66)); }
.kh-cat--under::after{  background:linear-gradient(165deg, rgba(150,86,140,.22), rgba(20,21,26,.68)); }
.kh-cat--rea::after{    background:linear-gradient(165deg, rgba(200,85,61,.42), rgba(20,21,26,.6)); }
.kh-cat--marken::after{ background:linear-gradient(165deg, rgba(20,21,26,.45), rgba(20,21,26,.78)); }

/* Kategoriarkiv-banner (kh_archive_description) */
.kh-cat-hero{
  position:relative; min-height:220px; border-radius:22px; overflow:hidden;
  background-size:cover; background-position:center 30%; margin:0 0 32px;
  display:flex; align-items:flex-end; box-shadow:var(--kh-shadow);
}
.kh-cat-hero__overlay{
  position:relative; z-index:2; width:100%; padding:28px 32px; color:#fff;
  background:linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.6));
}
.kh-cat-hero__overlay h1{ margin:0; font-size:2.2rem; color:#fff; text-shadow:0 2px 14px rgba(0,0,0,.4); }
.kh-cat-hero__overlay span{ font-size:.92rem; opacity:.9; }

/* Header: varmare, mjukare, mindre stel */
.site-header{
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(250,248,246,.93));
  border-bottom:1px solid #efe9e3;
}
.site-branding .site-title a{
  background:linear-gradient(95deg, #14151a 0%, #c8553d 120%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.main-navigation ul.menu>li>a::after,
.main-navigation ul.nav-menu>li>a::after{ background:linear-gradient(90deg,var(--kh-ink),var(--kh-accent2)); }
.site-header .site-search input[type=search]{ border-radius:999px; }

/* ---------- Köpflöde: lista-knapp sekundär, PDP-knapp primär ---------- */
/* I produktlistan: gör "Se hos"-knappen sekundär (outline), så hela kortet→PDP känns primärt */
.woocommerce ul.products li.product .button.kh-buy{
  background:#fff; color:var(--kh-ink); border:1.5px solid var(--kh-line);
  box-shadow:none; font-weight:600; font-size:.86rem; padding:.6em 1.1em;
}
.woocommerce ul.products li.product .button.kh-buy:hover{
  background:var(--kh-ink); color:#fff; border-color:var(--kh-ink); transform:translateY(-1px);
}
/* hela kortet ska kännas klickbart mot PDP */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link{ cursor:pointer; }
/* PDP köp-knapp: stor & primär (terrakotta-accent för tydlig CTA) */
.single-product .kh-buy.button,
.single-product .single_add_to_cart_button{
  background:var(--kh-accent2); font-size:1.1rem; padding:1.05em 2.8em; box-shadow:0 8px 24px rgba(200,85,61,.28);
}
.single-product .kh-buy.button:hover,
.single-product .single_add_to_cart_button:hover{ background:#a8412c; transform:translateY(-2px); }

/* ---------- Produktfilter-panel (kategori/arkiv) ---------- */
.kh-filters{ background:#fff; border:1px solid var(--kh-line); border-radius:var(--kh-radius); margin:0 0 28px; box-shadow:var(--kh-shadow); overflow:hidden; }
.kh-filters__toggle{ cursor:pointer; padding:16px 22px; font-weight:700; font-size:1rem; list-style:none; display:flex; align-items:center; gap:10px; user-select:none; }
.kh-filters__toggle::-webkit-details-marker{ display:none; }
.kh-filters__icon{ font-size:1.1rem; }
.kh-filters[open] .kh-filters__toggle{ border-bottom:1px solid var(--kh-line); }
.kh-filters__panel{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:24px; padding:22px; }
.kh-filter-col h4{ font-size:.92rem; margin:0 0 .7em; font-weight:700; }
.kh-filter-col ul{ list-style:none; margin:0; padding:0; max-height:200px; overflow-y:auto; }
.kh-filter-col ul li{ margin:0 0 .4em; font-size:.88rem; }
.kh-filter-col ul li a{ color:#3a3d46; text-decoration:none; }
.kh-filter-col ul li a:hover{ color:var(--kh-accent2); }
.kh-brand-select{ width:100%; border-radius:10px; border:1px solid var(--kh-line); padding:.55em .7em; background:var(--kh-soft); font-size:.88rem; }
.kh-filter-col .price_slider_wrapper{ font-size:.85rem; }
.kh-filter-col .button{ font-size:.8rem; padding:.45em 1em; margin-top:.5em; }
@media(max-width:600px){ .kh-filters__panel{ grid-template-columns:1fr 1fr; gap:16px; } }

/* Kategori produktantal-rad (ersätter borttagna kh-cat-hero) */
.kh-cat-count{ color:var(--kh-muted); font-size:.92rem; margin:0 0 14px; }
/* attr-filter dropdowns samma stil som varumärke */
.kh-attr-select{ width:100%; border-radius:10px; border:1px solid var(--kh-line); padding:.55em .7em; background:var(--kh-soft); font-size:.88rem; }

/* ---------- Logotyp i header ---------- */
.site-header .custom-logo-link{ display:inline-block; }
.site-header .custom-logo{ max-height:54px; width:auto; }
/* Logotypen innehåller redan wordmark + DAM·HERR·BARN → dölj text-tagline */
.site-header .site-description,
.site-header .beta{ display:none; }
@media(max-width:768px){ .site-header .custom-logo{ max-height:42px; } }

/* ---------- Mega-meny för Märken (bred flerkolumns-dropdown) ---------- */
/* Hitta Märken-toppposten: dess undermeny blir grid. Vi riktar på alla sub-menus med >12 barn via generell regel på huvudmenyns sista dropdown. */
.main-navigation ul.menu li.menu-item-has-children:hover > ul.sub-menu,
.main-navigation ul.nav-menu li.menu-item-has-children:hover > ul.children{ display:block; }
/* Gör Märken-dropdownen bred + grid (märks-undermenyn har många poster) */
.main-navigation li.menu-item-has-children > ul.sub-menu.kh-mega,
.main-navigation li.kh-marken > ul.sub-menu{
  display:grid; grid-template-columns:repeat(4,minmax(140px,1fr)); gap:2px 18px;
  min-width:640px; padding:18px 22px;
}
.main-navigation li.kh-marken > ul.sub-menu li{ width:auto; }
.main-navigation li.kh-marken > ul.sub-menu li a{ padding:.45em 0; font-weight:500; }
.main-navigation li.kh-marken > ul.sub-menu li:last-child a{ font-weight:700; color:var(--kh-accent2); grid-column:1/-1; padding-top:.8em; border-top:1px solid var(--kh-line); margin-top:.4em; }
@media(max-width:768px){ .main-navigation li.kh-marken > ul.sub-menu{ grid-template-columns:1fr 1fr; min-width:auto; } }

/* ---------- Vänlig 404-sida ---------- */
.kh-404{ padding:60px 0 80px; }
.kh-404__inner{ max-width:680px; margin:0 auto; text-align:center; }
.kh-404__emoji{ font-size:3.4rem; display:block; margin-bottom:.3em; }
.kh-404 h1{ font-size:2.2rem; margin:0 0 .4em; letter-spacing:-.03em; }
.kh-404 p{ color:var(--kh-muted); font-size:1.05rem; line-height:1.6; margin:0 auto 1.6em; max-width:520px; }
.kh-404__search{ max-width:440px; margin:0 auto 2em; }
.kh-404__search form{ display:flex; gap:8px; }
.kh-404__search input[type=search]{ flex:1; border-radius:999px; border:1px solid var(--kh-line); background:var(--kh-soft); padding:.7em 1.1em; }
.kh-404__cta{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-bottom:1.8em; }
.kh-404__home a{ color:var(--kh-muted); font-weight:600; text-decoration:none; }
.kh-404__home a:hover{ color:var(--kh-ink); }

/* ---------- Footer-läsbarhet: tvinga ljus text på svart (slår Storefront) ---------- */
.site-footer, .site-footer .kh-footer{ color:#e6e8ee !important; }
.kh-footer h3, .kh-footer h4{ color:#ffffff !important; }
.kh-footer p, .kh-footer .kh-footer__tagline, .kh-footer .kh-footer__company,
.kh-footer .kh-footer__bottom{ color:#d6d9e1 !important; }
.kh-footer .kh-footer__company strong{ color:#f0f1f5 !important; }
.site-footer .kh-footer ul li a{ color:#eceef2 !important; text-decoration:none; }
.site-footer .kh-footer ul li a:hover{ color:#ffffff !important; text-decoration:underline; }
.kh-footer .kh-footer__credit, .site-footer .kh-footer__credit a,
.site-footer .kh-footer__bottom a{ color:#ffffff !important; text-decoration:underline; }

/* ---------- Filter-formulär (JS-fritt) ---------- */
.kh-filters__nav{ display:flex; flex-wrap:wrap; gap:16px; margin:0 0 14px; }
.kh-filters__nav label{ display:flex; flex-direction:column; gap:4px; font-size:.8em; font-weight:600; color:var(--kh-muted,#666); }
.kh-filters__panel select,
.kh-filters__nav select{ min-width:160px; padding:8px 10px; border:1px solid #d7dae0; border-radius:8px; background:#fff; font-size:.92em; }
.kh-price-range{ display:flex; align-items:center; gap:6px; }
.kh-price-range input{ width:78px; padding:8px 8px; border:1px solid #d7dae0; border-radius:8px; font-size:.92em; }
.kh-filter-actions{ display:flex; align-items:center; gap:14px; align-self:flex-end; }
.kh-filter-btn{ background:var(--kh-ink,#111); color:#fff; border:0; border-radius:8px; padding:11px 22px; font-weight:700; font-size:.95em; cursor:pointer; }
.kh-filter-btn:hover{ opacity:.88; }
.kh-clear-btn{ color:var(--kh-muted,#666); font-weight:600; text-decoration:none; white-space:nowrap; }
.kh-clear-btn:hover{ color:var(--kh-ink,#111); }

/* ---------- Produktbild-galleri: fram + bak med miniatyrer ---------- */
.kh-single-extimg .kh-thumbs{ display:flex; gap:10px; margin-top:14px; }
.kh-single-extimg .kh-thumb{
	width:72px; height:90px; object-fit:cover; cursor:pointer;
	border:2px solid #e5e7eb; border-radius:8px; background:#fff; padding:2px;
	transition:border-color .15s ease, transform .15s ease;
}
.kh-single-extimg .kh-thumb:hover{ transform:translateY(-2px); }
.kh-single-extimg .kh-thumb.active{ border-color:var(--kh-ink, #111); }
.kh-single-extimg #kh-main-img{ width:100%; height:auto; }

/* ---------- Header: större logo + tightare avstånd logo→meny ---------- */
.site-header .custom-logo{ max-height:64px !important; }
.site-header{ padding-top:1.0em !important; padding-bottom:.35em !important; }
.site-header .site-branding{ margin-bottom:0 !important; }
.storefront-primary-navigation{ margin-top:0 !important; padding-top:0 !important; }
.main-navigation ul li a{ padding-top:.55em !important; padding-bottom:.85em !important; }
@media(max-width:768px){ .site-header .custom-logo{ max-height:52px !important; } }

/* Dölj Storefronts mobil-bar (Sök/Varukorg/Konto) — affiliate utan varukorg */
.storefront-handheld-footer-bar{ display:none !important; }

/* ---------- Hero-sökruta (centrerad på startsidan) ---------- */
.kh-hero-search{ display:flex; gap:8px; max-width:560px; margin:22px auto 4px; }
.kh-hero-search input[type=search]{
  flex:1; padding:15px 20px; font-size:1.02rem; border:1px solid var(--kh-line,#e5e7eb);
  border-radius:999px; background:#fff; box-shadow:0 6px 24px rgba(0,0,0,.06); outline:none;
}
.kh-hero-search input[type=search]:focus{ border-color:var(--kh-ink,#111); }
.kh-hero-search button{
  padding:0 28px; border:0; border-radius:999px; background:var(--kh-ink,#111); color:#fff;
  font-weight:700; font-size:1rem; cursor:pointer;
}
.kh-hero-search button:hover{ opacity:.88; }
/* På startsidan: dölj den lilla sökrutan uppe till höger (hero-sök ersätter den) */
.home .site-header .site-search{ display:none !important; }
@media(max-width:480px){ .kh-hero-search{ flex-direction:column; } .kh-hero-search button{ padding:13px; } }

/* ---------- Prisjämförelse-block (PDP) ---------- */
.kh-offers{ margin:18px 0 8px; }
.kh-offers__head{ font-size:1.05rem; margin:0 0 12px; font-weight:700; }
.kh-offer{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding:13px 16px; border:1px solid var(--kh-line,#e5e7eb); border-radius:12px; margin-bottom:10px; }
.kh-offer--best{ border-color:var(--kh-ink,#111); background:#fafafa; }
.kh-offer__shop{ font-weight:700; }
.kh-offer__badge{ display:inline-block; background:#0a7d33; color:#fff; font-size:.7rem; font-weight:700; padding:2px 8px; border-radius:999px; font-style:normal; margin-left:8px; vertical-align:middle; }
.kh-offer__price{ font-weight:700; font-size:1.08rem; margin-left:auto; }
.kh-offer__price s{ color:#9aa0aa; font-weight:400; font-size:.82em; }
.kh-offer__btn{ background:var(--kh-ink,#111); color:#fff !important; padding:11px 20px; border-radius:999px; font-weight:700; text-decoration:none; white-space:nowrap; }
.kh-offer__btn:hover{ opacity:.88; }
.kh-from{ font-size:.78em; color:var(--kh-muted,#666); font-weight:400; }
@media(max-width:520px){ .kh-offer{ gap:8px; } .kh-offer__price{ margin-left:0; } .kh-offer__btn{ width:100%; text-align:center; } }

/* ---------- Grön köpknapp (affiliate-konvertering) ---------- */
.kh-offer__btn{ background:#157a36 !important; color:#fff !important; }
.kh-offer__btn:hover{ background:#11652c !important; }

/* ---------- Storleksguide-länk (PDP) ---------- */
.kh-sizeguide{ margin:8px 0 16px; }
.kh-sizeguide a{ font-weight:600; color:var(--kh-ink); text-decoration:none; border-bottom:1px dashed #b9bdc6; }
.kh-sizeguide a:hover{ color:#157a36; border-color:#157a36; }

/* ---------- Guide-sidor ---------- */
.kh-guide-list{ line-height:2.1; font-size:1.02rem; }
.kh-guide-note{ background:#f7f7f8; border-left:3px solid #d7dae0; padding:12px 16px; border-radius:8px; color:#555; margin-top:22px; }
table.kh-size{ width:100%; border-collapse:collapse; margin:14px 0 28px; font-size:.95rem; }
table.kh-size th, table.kh-size td{ border:1px solid #e5e7eb; padding:10px 13px; text-align:left; }
table.kh-size thead th{ background:var(--kh-ink); color:#fff; font-weight:700; }
table.kh-size tbody tr:nth-child(even){ background:#fafafa; }

/* ---------- Mobilanpassning (extra) ---------- */
@media(max-width:600px){
  /* Startsidans produktrader 3 → 2 kolumner */
  .kh-front-grid.products.columns-3 li.product{ width:48% !important; margin-right:4% !important; }
  .kh-front-grid.products.columns-3 li.product:nth-child(3n){ margin-right:4% !important; }
  .kh-front-grid.products.columns-3 li.product:nth-child(3n+1){ clear:none !important; }
  .kh-front-grid.products.columns-3 li.product:nth-child(2n){ margin-right:0 !important; }
  .kh-front-grid.products.columns-3 li.product:nth-child(2n+1){ clear:both !important; }
  .kh-front-grid.products li.product img, .kh-front-grid.products li.product .kh-extimg{ max-height:320px; }
  /* Storleks-/villkorstabeller: horisontell scroll istället för överspill */
  table.kh-size{ display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  /* Hero tightare på mobil */
  .kh-hero__inner{ padding:32px 20px; }
  .kh-hero h1{ font-size:1.8rem; }
  .kh-hero p{ font-size:1.02rem; }
  /* Filterpanelen: en kolumn på riktigt smala skärmar */
  .kh-filters__panel{ grid-template-columns:1fr !important; }
  .kh-filters__nav{ flex-direction:column; gap:10px; }
  .kh-filters__nav select, .kh-filters__panel select{ width:100%; min-width:0; }
}
@media(max-width:400px){
  .kh-front-grid.products.columns-3 li.product{ width:100% !important; margin-right:0 !important; float:none; }
}

/* ---------- Filter: enhetligt rutnät (alla selects full bredd) ---------- */
.kh-filters__panel .kh-filter-col select{ width:100%; box-sizing:border-box; }
.kh-filters__panel .kh-filter-col{ min-width:0; }

/* ---------- Underkategori-rad (chips) på kategori-/shop-arkiv ---------- */
.kh-subcats{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 22px; }
.kh-subcats .kh-subcat{ display:inline-flex; align-items:center; gap:6px; padding:8px 15px; border:1px solid var(--kh-line,#e5e7eb); border-radius:999px; background:#fff; color:var(--kh-ink,#14151a); text-decoration:none; font-size:.9rem; font-weight:600; transition:border-color .15s,background .15s; }
.kh-subcats .kh-subcat:hover{ border-color:var(--kh-ink,#14151a); }
.kh-subcats .kh-subcat--active{ background:var(--kh-ink,#14151a); color:#fff; border-color:var(--kh-ink,#14151a); }
.kh-subcats .kh-subcat span{ font-size:.76rem; color:#9aa0aa; font-weight:500; }
.kh-subcats .kh-subcat--active span{ color:#cfd1d6; }

/* ---------- Hero: 2-kolumn + produktcollage (höger) ---------- */
.kh-hero{ justify-content:space-between; gap:24px; }
.kh-hero__inner{ flex:1 1 540px; }
.kh-hero__media{ flex:0 1 430px; display:grid; grid-template-columns:1fr 1fr; gap:14px; padding:34px 48px 34px 0; align-content:center; }
.kh-hero__tile{ display:block; border-radius:16px; overflow:hidden; box-shadow:0 16px 38px rgba(0,0,0,.16); background:#fff; }
.kh-hero__tile img{ width:100%; height:100%; aspect-ratio:3/4; object-fit:cover; display:block; transition:transform .45s ease; }
.kh-hero__tile:hover img{ transform:scale(1.06); }
.kh-hero__tile:nth-child(1), .kh-hero__tile:nth-child(4){ transform:translateY(-16px); }
@media(max-width:900px){ .kh-hero__media{ display:none; } }

/* ---------- Rea/kampanj-banner ---------- */
.kh-rea-banner{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; background:var(--kh-soft,#f7f7f8); color:var(--kh-ink,#14151a) !important; border:1px solid var(--kh-line,#ececec); border-radius:14px; padding:15px 22px; margin:0 0 56px; text-decoration:none; transition:box-shadow .18s ease, transform .18s ease; }
.kh-rea-banner:hover{ box-shadow:0 10px 26px rgba(0,0,0,.06); transform:translateY(-2px); }
.kh-rea-banner__tag{ background:#e11d2a; color:#fff; font-weight:800; font-size:.76rem; padding:4px 11px; border-radius:999px; letter-spacing:.06em; }
.kh-rea-banner__txt{ font-size:1rem; color:var(--kh-ink,#14151a); }
.kh-rea-banner__txt strong{ font-weight:700; }
.kh-rea-banner__cta{ margin-left:auto; font-weight:600; color:var(--kh-muted,#6b7280); white-space:nowrap; }
.kh-rea-banner:hover .kh-rea-banner__cta{ color:var(--kh-ink,#14151a); }
@media(max-width:600px){ .kh-rea-banner__cta{ margin-left:0; } }

/* rea-kryssruta i filtret */
.kh-rea-check{ display:inline-flex; align-items:center; gap:8px; font-weight:600; cursor:pointer; padding:9px 0; }
.kh-rea-check input{ width:18px; height:18px; accent-color:#e11d2a; }

/* ---------- Mega-meny för avdelningar (L1 → L2-rubriker → L3-länkar i kolumner) ---------- */
/* Panelen visas på hover (flex istället för Storefronts block); ej Märken (.kh-marken). ENDAST desktop. */
@media(min-width:769px){
.main-navigation ul.menu > li.menu-item-has-children:not(.kh-marken):hover > ul.sub-menu,
.main-navigation ul.nav-menu > li.menu-item-has-children:not(.kh-marken):hover > ul.sub-menu{
  display:flex !important; flex-wrap:wrap; gap:4px 30px; padding:24px 28px; min-width:600px; max-width:840px; left:0;
}
/* Varje L2 = kolumn med rubrik */
.main-navigation ul.menu > li:not(.kh-marken) > ul.sub-menu > li{ flex:0 0 auto; min-width:150px; padding:0; }
.main-navigation ul.menu > li:not(.kh-marken) > ul.sub-menu > li > a{ font-weight:700; color:var(--kh-ink); padding:6px 0; }
.main-navigation ul.menu > li:not(.kh-marken) > ul.sub-menu > li.menu-item-has-children > a::after{ display:none; } /* ingen ► */
/* L3 alltid synlig under rubriken (statisk, ej flyout) */
.main-navigation ul.menu > li:not(.kh-marken) > ul.sub-menu > li > ul.sub-menu{
  position:static !important; display:block !important; box-shadow:none !important; border:none !important;
  padding:2px 0 12px !important; min-width:0 !important; background:transparent !important;
  opacity:1 !important; visibility:visible !important; transform:none !important; left:auto !important; top:auto !important;
}
.main-navigation ul.menu > li:not(.kh-marken) > ul.sub-menu > li > ul.sub-menu > li > a{ font-weight:400; color:var(--kh-muted); font-size:.88rem; padding:3px 0; }
.main-navigation ul.menu > li:not(.kh-marken) > ul.sub-menu > li > ul.sub-menu > li > a:hover{ color:var(--kh-ink); }
} /* slut @media(min-width:769px) mega-meny — på mobil används Storefronts standard-meny */

/* ===== Mobil hero — definitiv (sist i filen, vinner kaskaden mot design-3.0 .kh-hero h1) ===== */
@media(max-width:768px){
  .kh-hero{ display:block !important; min-height:auto !important; }
  .kh-hero__inner{ max-width:100% !important; width:100% !important; box-sizing:border-box !important; padding:30px 20px !important; }
  .kh-hero h1{ font-size:1.7rem !important; line-height:1.18 !important; letter-spacing:-.02em !important; }
  .kh-hero p{ font-size:1rem !important; }
  .kh-hero__media{ display:none !important; }
  .kh-hero-search{ flex-direction:column !important; max-width:100% !important; }
  .kh-hero-search input[type=search], .kh-hero-search button{ width:100% !important; box-sizing:border-box !important; }
}

/* (Borttaget 2026-06-03: svart/centrerad förstanivå — användaren ville behålla
   ljus vänsterställd toppnivå. Mega-meny-strukturen hanteras separat nedan/ovan.) */

/* ═══════════════ MEGA-MENY: exklusivahem-struktur (full-bredd panel, kolumn-grid) 2026-06-03 ═══════════════
 * Underkategorierna visas som kolumner: L2 = rubrik, L3 listas under. Panelen ankras mot
 * menyraden (li=static, ul=relative) → spänner full innehållsbredd, wrappar, ingen höger-overflow.
 * Desktop-only. Märken (.kh-marken) behåller sin egen märkes-grid.
 */
@media(min-width:769px){
  .main-navigation ul.menu, .main-navigation ul.nav-menu{ position:relative; }
  .main-navigation ul.menu > li.menu-item-has-children:not(.kh-marken){ position:static; }
  .main-navigation ul.menu > li.menu-item-has-children:not(.kh-marken):hover > ul.sub-menu{
    display:grid !important;
    grid-template-columns:repeat(5,1fr);
    gap:22px 30px;
    width:100% !important; min-width:0 !important; max-width:none !important;
    left:0 !important; right:0 !important;
    padding:30px 34px !important;
    box-sizing:border-box;
    background:#fff !important;
    border:1px solid var(--kh-line);
    border-top:2px solid var(--kh-ink);
    border-radius:0 0 var(--kh-radius) var(--kh-radius);
    box-shadow:0 24px 48px rgba(0,0,0,.13);
  }
  /* L2 = kolumn-rubrik */
  .main-navigation ul.menu > li:not(.kh-marken) > ul.sub-menu > li{ min-width:0 !important; width:auto !important; padding:0 !important; }
  .main-navigation ul.menu > li:not(.kh-marken) > ul.sub-menu > li > a{
    font-weight:700 !important; color:var(--kh-ink) !important; font-size:.92rem;
    padding:0 0 7px !important; margin-bottom:6px; border-bottom:1px solid var(--kh-line); display:block;
  }
  .main-navigation ul.menu > li:not(.kh-marken) > ul.sub-menu > li.menu-item-has-children > a::after{ display:none !important; }
  /* L3-lista (alltid synlig, statisk, ingen egen panel) */
  .main-navigation ul.menu > li:not(.kh-marken) > ul.sub-menu > li > ul.sub-menu{
    position:static !important; display:block !important; box-shadow:none !important; border:none !important;
    padding:0 !important; min-width:0 !important; background:transparent !important; opacity:1 !important; visibility:visible !important;
  }
  .main-navigation ul.menu > li:not(.kh-marken) > ul.sub-menu > li > ul.sub-menu > li > a{
    font-weight:400 !important; color:var(--kh-muted) !important; font-size:.85rem; padding:3px 0 !important;
  }
  .main-navigation ul.menu > li:not(.kh-marken) > ul.sub-menu > li > ul.sub-menu > li > a:hover{ color:var(--kh-ink) !important; }
}
/* ═══════════════ END MEGA-MENY ═══════════════ */

/* Centrerad toppmeny (ljus) 2026-06-03 — logga kvar vänster, bara menyposterna centreras */
@media(min-width:769px){
  .main-navigation ul.menu, .main-navigation ul.nav-menu{ text-align:center !important; }
  .main-navigation ul.menu > li, .main-navigation ul.nav-menu > li{ float:none !important; display:inline-block !important; }
}

/* Rea-märke — snyggare & läsbart 2026-06-03 (tydlig röd + vit text, visar REA −X%) */
.woocommerce span.onsale{
  background:#e11d2a !important; color:#fff !important;
  font-weight:800 !important; font-size:.82rem !important; letter-spacing:.03em !important;
  padding:.5em .85em !important; border-radius:999px !important; line-height:1 !important; min-width:auto !important;
  box-shadow:0 4px 12px rgba(225,29,42,.35) !important; top:14px !important; left:14px !important; right:auto !important;
}
.single-product span.onsale{ font-size:.98rem !important; padding:.55em 1em !important; top:18px !important; left:18px !important; }

/* ═══ MOBILMENY: kategoriträd (L1+L2) i hamburgaren 2026-06-04 ═══ */
@media(max-width:768px){
  .storefront-primary-navigation, .storefront-primary-navigation > .col-full, #site-navigation{
    display:block !important; visibility:visible !important; opacity:1 !important;
    position:static !important; height:auto !important; min-height:0 !important; max-height:none !important; overflow:visible !important;
  }
  #site-navigation .primary-navigation{ display:none !important; }
  #site-navigation.toggled .primary-navigation,
  #site-navigation.toggled #menu-huvudmeny,
  #site-navigation.toggled #menu-huvudmeny li,
  #site-navigation.toggled #menu-huvudmeny ul.sub-menu{
    display:block !important; visibility:visible !important; opacity:1 !important;
    position:static !important; height:auto !important; min-height:0 !important; max-height:none !important;
    overflow:visible !important; clip:auto !important; left:auto !important; right:auto !important; top:auto !important;
    transform:none !important; float:none !important; width:auto !important; min-width:0 !important; max-width:none !important;
    box-shadow:none !important; border:none !important; background:transparent !important;
  }
  #site-navigation.toggled #menu-huvudmeny > li > ul.sub-menu > li > ul.sub-menu{ display:none !important; }
  #site-navigation.toggled #menu-huvudmeny > li > ul.sub-menu{ padding:0 0 8px 16px !important; }
  #site-navigation.toggled #menu-huvudmeny > li{ border-bottom:1px solid var(--kh-line) !important; }
  #site-navigation.toggled #menu-huvudmeny > li > a{ padding:12px 4px !important; font-weight:700 !important; }
  #site-navigation.toggled #menu-huvudmeny ul.sub-menu a{ padding:7px 4px !important; color:var(--kh-muted) !important; font-weight:500 !important; }
  #site-navigation.toggled #menu-huvudmeny > li > a::after,
  #site-navigation.toggled #menu-huvudmeny ul.sub-menu a::after{ display:none !important; }
}

/* Produktrutnät 2 kolumner på mobil (kategori/shop) — CSS grid = inga trappsteg 2026-06-04 */
@media(max-width:768px){
  .woocommerce ul.products:not(.kh-front-grid),
  .woocommerce-page ul.products:not(.kh-front-grid){
    display:grid !important; grid-template-columns:1fr 1fr !important; gap:14px !important; margin:0 0 24px !important;
  }
  .woocommerce ul.products:not(.kh-front-grid) li.product,
  .woocommerce-page ul.products:not(.kh-front-grid) li.product{
    width:auto !important; margin:0 !important; float:none !important; padding:10px !important;
  }
  .woocommerce ul.products:not(.kh-front-grid) li.product .woocommerce-loop-product__title{ font-size:.86rem !important; line-height:1.3 !important; }
  .woocommerce ul.products:not(.kh-front-grid) li.product .price{ font-size:.95rem !important; }
  .woocommerce ul.products:not(.kh-front-grid) li.product .button,
  .woocommerce ul.products:not(.kh-front-grid) li.product .added_to_cart,
  .woocommerce ul.products:not(.kh-front-grid) li.product a.button{ font-size:.8rem !important; padding:.55em .6em !important; width:100% !important; box-sizing:border-box !important; text-align:center !important; }
  .woocommerce ul.products:not(.kh-front-grid) span.onsale{ font-size:.72rem !important; padding:.4em .6em !important; top:10px !important; left:10px !important; }
}
/* Fix: dölj clearfix-pseudoelement som blir grid-items (tom första cell) */
@media(max-width:768px){
  .woocommerce ul.products:not(.kh-front-grid)::before,
  .woocommerce ul.products:not(.kh-front-grid)::after,
  .woocommerce-page ul.products:not(.kh-front-grid)::before,
  .woocommerce-page ul.products:not(.kh-front-grid)::after{ display:none !important; content:none !important; }
}
/* Fix: visa hamburgaren vid ≤768 (annars glapp vid exakt 768 — iPad-porträtt) */
@media(max-width:768px){
  button.menu-toggle, #site-navigation .menu-toggle{ display:block !important; }
}

/* Frontsidans produktrutnät (Populärt just nu m.fl.) — CSS grid = inga float-trappsteg/luckor 2026-06-04 */
.kh-front-grid.products{ display:grid !important; grid-template-columns:repeat(3,1fr) !important; gap:20px !important; margin:0 0 8px !important; }
.kh-front-grid.products li.product{ width:auto !important; margin:0 !important; float:none !important; clear:none !important; }
.kh-front-grid.products::before, .kh-front-grid.products::after{ display:none !important; content:none !important; }
@media(max-width:768px){ .kh-front-grid.products{ grid-template-columns:1fr 1fr !important; gap:14px !important; } }
@media(max-width:380px){ .kh-front-grid.products{ grid-template-columns:1fr !important; } }

/* Guider-kort i "Handla efter kategori" (fyller 6:e rutan) 2026-06-04 */
.kh-cat--guider{ background:linear-gradient(150deg,#3a5a55 0%,#14151a 100%) !important; }
.kh-cat--guider::after{ background:linear-gradient(165deg, rgba(58,90,85,.28), rgba(20,21,26,.7)) !important; }