/* =====================================================================
   HM-Group tilpasninger oven på Bewise2023-skin'et
   Fil: /images/skins/Bewise/css/new-skin.css  (overskrives aldrig af skin-udrulninger)
   Version 1.1 - 21-10-2026

   Gælder KUN bordpladefabrikken.dk. Filen deles med de andre shops, så alle
   regler der rører temaet står bag "scope" herunder:
     - html.hmh-on  = sættes af new-skin.js på de domæner der er slået til
     - :has(...)    = samme afgrænsning allerede ved første rendering (ingen hop)
   Rul tilbage: tøm filen (og new-skin.js).
   Retter du her? Skift versionen i --hmh herunder OG CSS_V øverst i new-skin.js (så cachen omgås).
   ===================================================================== */

:root{--hmh:"1.1"}

/* ---- Nyt kontaktfelt i headeren (markup bygges af new-skin.js) ---- */
.hmh-wrap{align-items:center;gap:12px}
.hmh-cap{display:flex;align-items:stretch;height:54px;border:1px solid #d5cdc4;border-radius:99px;background:#faf8f5;overflow:hidden;box-sizing:border-box;flex:none}
.hmh-cap a{display:flex;align-items:center;text-decoration:none;white-space:nowrap}
.hmh-ico{width:36px;height:36px;border-radius:50%;background:#fff;border:1px solid #d5cdc4;display:flex;align-items:center;justify-content:center;color:#92684B;flex:none;box-sizing:border-box}
.hmh-ico svg{width:16px;height:16px;display:block}
.hmh-phone{gap:10px;padding:0 18px 0 8px;font-size:20px;letter-spacing:.5px;color:#333}
.hmh-sep{width:1px;background:#d5cdc4;margin:12px 0;flex:none}
.hmh-call{gap:10px;padding:0 22px 0 14px;color:#512B1B}
.hmh-lbl{display:flex;flex-direction:column;gap:2px;text-align:left}
.hmh-lbl small{font-size:11px;line-height:13px;color:#5a5a58}
.hmh-lbl b{font-size:14px;line-height:16px;font-weight:700}
.hmh-quote{display:flex;align-items:center;gap:10px;height:54px;padding:0 22px 0 9px;border-radius:99px;background:#61815A;color:#fff;text-decoration:none;box-sizing:border-box;flex:none;white-space:nowrap;transition:background-color .15s ease-in-out}
.hmh-quote:hover{background:#567250;color:#fff}
.hmh-quote .hmh-ico{background:rgba(255,255,255,.16);border:0;color:#fff}
.hmh-quote .hmh-lbl small{color:#fff}
.hmh-phone:hover,.hmh-call:hover{background:#fff;color:#512B1B}
.hmh-wrap a:focus-visible,.hmh-mobile a:focus-visible{outline:3px solid rgba(97,129,90,.5);outline-offset:2px}
.hmh-chev{margin-left:auto;flex:none}

/* ---- Skjul det gamle kontaktfelt + support-ikon på de shops hvor det nye er slået til ---- */
:is(html.hmh-on,html:has(.header .logo img[src*="bordpladefabrikken-logo"])) .header .header-contact,
:is(html.hmh-on,html:has(.header .logo img[src*="bordpladefabrikken-logo"])) .header a.header-icon.desktop-flex{display:none!important}

/* ---- Desktop (>=1200 px): lav header på 88 px ---- */
@media (min-width:1200px){
 :is(html.hmh-on,html:has(.header .logo img[src*="bordpladefabrikken-logo"])) .header,
 :is(html.hmh-on,html:has(.header .logo img[src*="bordpladefabrikken-logo"])) .header .header-content{height:88px!important}
 :is(html.hmh-on,html:has(.header .logo img[src*="bordpladefabrikken-logo"])) .header .header-content > .header-col:nth-child(1){flex:0 0 auto!important;width:auto!important;margin-right:20px}
 :is(html.hmh-on,html:has(.header .logo img[src*="bordpladefabrikken-logo"])) .header .header-col:nth-child(1) .logo img{height:42px;width:auto}
 :is(html.hmh-on,html:has(.header .logo img[src*="bordpladefabrikken-logo"])) .header .header-content > .header-col:nth-child(2){flex:1 1 0%!important;width:auto!important;min-width:160px}
 :is(html.hmh-on,html:has(.header .logo img[src*="bordpladefabrikken-logo"])) .header .header-content > .header-col:nth-child(3){flex:0 0 auto!important;width:auto!important;gap:12px}
 :is(html.hmh-on,html:has(.header .logo img[src*="bordpladefabrikken-logo"])) .header .header-icon.basket{width:52px!important;height:52px!important;flex:none}
}
/* Smal desktop (1200-1399 px): lidt kompaktere */
@media (min-width:1200px) and (max-width:1399px){
 :is(html.hmh-on,html:has(.header .logo img[src*="bordpladefabrikken-logo"])) .header .header-content{gap:14px}
 :is(html.hmh-on,html:has(.header .logo img[src*="bordpladefabrikken-logo"])) .header .header-content > .header-col:nth-child(1){margin-right:6px}
 :is(html.hmh-on,html:has(.header .logo img[src*="bordpladefabrikken-logo"])) .header .header-col:nth-child(1) .logo img{height:36px}
 .hmh-wrap{gap:8px}
 .hmh-phone{font-size:17px;padding:0 12px 0 7px;gap:8px}
 .hmh-call{padding:0 14px 0 10px;gap:8px}
 .hmh-quote{padding:0 16px 0 8px;gap:8px}
}

/* ---- Burger-header (<=1199 px): logoet fylder pladsen foran kurv + burger ---- */
@media (max-width:1199px){
 :is(html.hmh-on,html:has(.header .logo img[src*="bordpladefabrikken-logo"])) .header .header-content > .header-col:nth-child(1){flex:1 1 auto!important;min-width:0}
 :is(html.hmh-on,html:has(.header .logo img[src*="bordpladefabrikken-logo"])) .header .header-content > .header-col:nth-child(3){flex:0 0 auto!important}
 :is(html.hmh-on,html:has(.header .logo img[src*="bordpladefabrikken-logo"])) .header .header-col:nth-child(1) a.logo{display:block;width:100%;max-width:280px}
 :is(html.hmh-on,html:has(.header .logo img[src*="bordpladefabrikken-logo"])) .header .header-col:nth-child(1) .logo img{width:100%;height:auto;aspect-ratio:634/89}
}

/* ---- Burger-menu: kontaktblok øverst + nyt logo ---- */
.hmh-mobile{padding:16px;background:#faf8f5;border-bottom:1px solid #d5cdc4;display:flex;flex-direction:column;gap:10px;box-sizing:border-box}
.hmh-mtitle{margin:0;font-size:13px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:#512B1B}
.hmh-mobile .hmh-cap{height:56px;background:#fff;width:100%}
.hmh-mobile .hmh-cap a{flex:1 1 auto;min-width:0;padding:0 6px 0 7px;gap:7px}
.hmh-mobile .hmh-ico{width:34px;height:34px;background:#faf8f5}
.hmh-mobile .hmh-sep{margin:11px 0}
.hmh-mobile .hmh-lbl{gap:1px}
.hmh-mobile .hmh-num{font-size:14px;line-height:18px;letter-spacing:.2px;font-weight:700}
.hmh-mobile .hmh-call .hmh-lbl b{font-size:13px;line-height:18px}
.hmh-mobile .hmh-quote{height:56px;padding:0 16px 0 10px;width:100%}
.hmh-mobile .hmh-quote .hmh-lbl b{font-size:15px;line-height:18px}
.hmh-mobile .hmh-quote .hmh-ico{width:36px;height:36px;background:rgba(255,255,255,.16);border:0}
@media (max-width:360px){.hmh-mobile .hmh-call .hmh-ico{display:none}}
/* temaets egne kontaktlinjer i menuen skjules når vores blok er sat ind */
.hmh-mobile ~ .loaded .bpf-menu .m-title,
.hmh-mobile ~ .loaded .bpf-menu .m-btn,
.hmh-mobile ~ .loaded .bpf-menu a.m-row[href^="tel:"]{display:none!important}
:is(html.hmh-on,html:has(.header .logo img[src*="bordpladefabrikken-logo"])) .mobilemenuLogo img{width:min(100%,290px);height:auto;aspect-ratio:634/89;object-fit:contain}
