/* === Hemeli facets – ren, klassisk liste === */
:root{
  --hemeli-accent:#111;       /* bytt til din primærfarge ved behov */
  --hemeli-border:#e5e7eb;
  --hemeli-radius:12px;
}

/* Øk bredden på header-container */
header .container {
  max-width: 1380px; /* juster opp fra standard 1140/1320 */
}

/* Mindre mellomrom mellom menypunktene */
.navbar-nav .nav-item {
  margin-right: -10px; /* standard er ofte 20-30px */
}

#hemeli-facets{
  position:sticky; top:16px;
  background:#fff; border:1px solid var(--hemeli-border);
  border-radius:14px; padding:14px; box-shadow:0 2px 8px rgba(0,0,0,.04);
  font-size:13px;
}

/* Seksjonstittel og gruppetitler */
.hemeli-filter-title{ font-size:14px; font-weight:600; letter-spacing:.2px; margin:0 0 10px; }
.hemeli-facet{ margin-bottom:16px; }
.hemeli-facet legend{ font-size:12px; opacity:.85; margin:0 0 8px; }

/* Radiorader */
.hemeli-facet .opt{ display:flex; align-items:center; gap:10px; padding:6px 4px; border-radius:8px; }
.hemeli-facet .opt:hover{ background:#fafafa; }

/* Skjul native radio, lag egen “dot” */
.hemeli-facet input[type="radio"]{
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  width:18px; height:18px; border:2px solid var(--hemeli-border); border-radius:50%;
  display:inline-block; position:relative; cursor:pointer; flex:0 0 18px;
  transition: border-color .15s ease;
}
.hemeli-facet input[type="radio"]:focus{ outline:2px solid rgba(17,17,17,.2); outline-offset:2px; }
.hemeli-facet input[type="radio"]::after{
  content:""; position:absolute; inset:3px; border-radius:50%; background:transparent;
  transition: background .15s ease;
}
.hemeli-facet input[type="radio"]:checked{ border-color:var(--hemeli-accent); }
.hemeli-facet input[type="radio"]:checked::after{ background:var(--hemeli-accent); }

.hemeli-facet label{ cursor:pointer; user-select:none; }

/* Nullstill-lenke */
.hemeli-facet .facet-actions{ margin-top:8px; }
.hemeli-facet .facet-reset{ font-size:12px; opacity:.8; text-decoration:underline; cursor:pointer; }
@media(max-width:991px){ #hemeli-facets{ position:static; } }

/* Utseende på Hemeli Design-knappen i headeren */
.hdr-hemeli-link{
  display:inline-flex; align-items:center;
    margin-left: 12px;   /* avstand til søkefeltet */
  margin-right: 20px;  /* avstand til ikonene */
  padding:6px 12px;
  border:3px solid #645953;
  border-radius:4px;
  font-size:16px; line-height:1;
  color:#645953; background:#e1d7cd; text-decoration:none;
  transition:.15s; white-space:nowrap;
}

.hdr-hemeli-link:hover {
  color: #fff !important;
  background: #645953 !important;
  border-color: #645953 !important;
  opacity: 1 !important;
  filter: none !important;
}

/* Hold topplinjen pen: la søkefeltet gi fra seg litt plass når det trengs */
.top-searchbar{ flex: 1 1 auto; min-width: 280px; }  /* juster min-width ved behov */

/* Skjul "Hemeli Design" i toppmenyen KUN på desktop (Bootstrap nav) */
@media (min-width: 992px){
  /* skjul selve lenken */
  .navbar-nav .nav-link[href="/sider/hemeli-design"],
  .navbar-nav .nav-link[href="/sider/hemeli-design/"]{
    display: none !important;
  }
  /* bonus: hvis nettleseren støtter :has, skjul hele LI-en så det ikke blir mellomrom */
  .navbar-nav li.nav-item:has(> a.nav-link[href="/sider/hemeli-design"]),
  .navbar-nav li.nav-item:has(> a.nav-link[href="/sider/hemeli-design/"]){
    display: none !important;
  }
}

/* Header-knappen skal vises på desktop, være skjult på mobil */
@media (min-width: 992px){ .hdr-hemeli-link { display: inline-flex !important; } }
@media (max-width: 991.98px){ .hdr-hemeli-link { display: none !important; } }


/* Litt luft på begge sider (valgfritt) */
.hdr-hemeli-link{ margin-left:12px; margin-right:20px; }


/* Vil du også skjule teksten som dukket opp under menyen (duplikat)? */
.mainmenu a[href="/sider/hemeli-design"]{ display:none !important; }

/* Mobil: gjør filter-knappen lik en select/dropdown */
#hemeli-filter-toggle{
  width:100%;
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 14px;
  font-size:16px; font-weight:500; color:#111;
  background:#fff;
  border:1px solid #e5e7eb; border-radius:8px;
  box-shadow: 0 1px 0 rgba(0,0,0,.03);
  cursor:pointer; text-align:left;
  margin-bottom:12px;
  position:sticky; top:60px; /* juster ift. headerhøyden */
  z-index:999;
}

/* caret til høyre – matcher select-look */
#hemeli-filter-toggle::after{
  content:"";
  width:8px; height:8px;
  border:2px solid transparent;
  border-right-color:#111; border-bottom-color:#111;
  transform: rotate(45deg);
  margin-left:12px;
}

/* hover/fokus som på inputs */
#hemeli-filter-toggle:hover{ background:#fff; border-color:#dcdcdc; }
#hemeli-filter-toggle:focus{ outline: none; box-shadow: 0 0 0 2px rgba(0,0,0,.06); }

/* når åpen: snu caret */
#hemeli-filter-toggle.is-open::after{
  transform: rotate(-135deg);
}

/* selve panelet under kan ha samme “kort”-look som inputs om du vil */
#hemeli-facets{
  background:#fff;
  border:1px solid #e5e7eb; border-radius:8px;
  padding:12px;
  box-shadow:0 1px 0 rgba(0,0,0,.03);
}