/* ============================================================
   Behandlingsnett – Designlag (bnett-design.css)
   Mobil-først. Lett. Recolorer den eksisterende plugin-UI-en via
   variabel-overstyring, setter fontene, og styler [bnett_hero].
   Lastes ETTER plugin-ens egen CSS (bnett-custom.css).
   NB: !important brukt bevisst på nøkkelfarger for å slå Elementors
   kit-spesifisitet (.elementor-kit-XX h1/a/button ...).
   ============================================================ */

/* ---- 1. Design-tokens: overstyrer plugin-ens egne variabler ---- */
:root{
  --bnett-green:#83b773;
  --bnett-green-dark:#3e8e5a;
  --bnett-green-darker:#133731;
  --bnett-text:#14241d;
  --bnett-muted:#5a6b62;
  --bnett-soft:#f2f7ee;
  --bnett-border:#e6ebe9;
  --bnett-radius:10px;
  --bnett-shadow:0 12px 30px -16px rgba(16,40,30,.22);
  --bnett-badge-count-bg:#e4efdc;

  --bnett-brand:#3e8e5a; --bnett-brand-dark:#2f7048; --bnett-pine:#133731;
  --bnett-accent:#83b773; --bnett-sage:#e4efdc; --bnett-sage-50:#f2f7ee; --bnett-mint:#c9e0bd;
  --bnett-ink:#14241d; --bnett-paper:#f2f5f2; --bnett-line:#e6ebe9;

  /* v2.0 – lyst designsystem: flater, kanter og skygger i én skala */
  --bnett-surface:#ffffff;
  --bnett-surface-2:#f7faf4;      /* svakt grønn seksjonsflate */
  --bnett-surface-3:#eef5e9;      /* sage-flate for uthevede blokker */
  --bnett-line-strong:#d6dedb;
  --bnett-ring:rgba(62,142,90,.18);
  --bnett-shadow-sm:0 1px 2px rgba(16,40,30,.05), 0 2px 8px -4px rgba(16,40,30,.10);
  --bnett-shadow-md:0 2px 6px -2px rgba(16,40,30,.08), 0 14px 30px -18px rgba(16,40,30,.22);
  --bnett-shadow-lg:0 4px 10px -4px rgba(16,40,30,.10), 0 30px 60px -32px rgba(16,40,30,.34);
  /*
   * ============================================================
   * Hjørnene, strammet inn (oktober 2026)
   * ============================================================
   *
   * Fra 12/18/24 til 6/8/10. Stian ba om det, og han hadde rett: de myke
   * hjørnene fikk kortene til å se ut som bokser i en app for barn.
   * Verdiene er målt ut av forbildet han sendte – hjørnet der lå på rundt
   * 9 piksler.
   *
   * Piller (`999px`, `100px`) og sirkler (`50%`) er IKKE med. De er former,
   * ikke bokser: en merkelapp skal se ut som en merkelapp.
   * ============================================================ */
  --bnett-radius-sm:6px;
  --bnett-radius-md:8px;
  --bnett-radius-lg:10px;

  /* Knappegrønn: mørk nok til at hvit tekst består WCAG AA (4.80:1).
     --bnett-brand beholdes som aksentfarge for ikoner/kanter/ringer. */
  --bnett-btn:#388051;
  --bnett-btn-hover:#2f7048;
  --bnett-font-head:"Bricolage Grotesque",-apple-system,system-ui,sans-serif;
  --bnett-font-body:"Inter",-apple-system,system-ui,sans-serif;
}

/* ---- 2. Fonter og sideflate (Hello Elementor = tomt lerret) ---- */
/*
 * Sideflaten er #f2f5f2, ikke hvit.
 *
 * Så lenge siden var hvit og kortene var hvite, fløt de sammen: kanten
 * på 10 % svart var alt som skilte dem. Med en svakt grønngrå flate
 * under løfter hvert kort seg av seg selv, og vi trenger mindre skygge
 * for å få samme virkning.
 *
 * Fargen er målt ut av forbildet, ikke valgt.
 */
body{
  font-family:var(--bnett-font-body) !important;
  color:var(--bnett-ink) !important;
  background:var(--bnett-paper);
}
h1,h2,h3,h4,h5,h6,
.elementor-heading-title{ font-family:var(--bnett-font-head) !important; letter-spacing:-.02em; }

/* ============================================================
   3. HERO  [bnett_hero]  – mobil-først
   Legg shortcoden i en full-bredde seksjon uten padding.
   ============================================================ */
/* v2.0 – LYS hero. Luftig sage-gradient i stedet for mørk furugrønn flate.
   Grønnfargene er de samme, men brukes som aksenter mot lys bakgrunn. */
.bnett-hero{
  position:relative; width:100%;
  padding:68px 0 56px;
  background:
    radial-gradient(58% 44% at 88% 8%, rgba(131,183,115,.30), transparent 62%),
    radial-gradient(50% 46% at 4% 96%, rgba(62,142,90,.16), transparent 66%),
    linear-gradient(180deg, #f4f9f0 0%, #eef5e9 46%, var(--bnett-paper) 100%);
  overflow:hidden;
}
/* Myk avslutning mot neste seksjon – hindrer hard kant */
.bnett-hero::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:96px;
  background:linear-gradient(180deg, transparent, var(--bnett-paper));
  pointer-events:none;
}
.bnett-hero__inner{ max-width:1160px; margin:0 auto; padding:0 24px; position:relative; z-index:1; }

.bnett-hero__eyebrow{
  display:inline-flex; align-items:center; gap:9px;
  color:var(--bnett-brand-dark) !important; font:600 13.5px/1.2 var(--bnett-font-body); letter-spacing:.01em;
  background:var(--bnett-surface); border:1px solid var(--bnett-sage);
  padding:7px 14px 7px 11px; border-radius:100px; margin-bottom:22px;
  box-shadow:var(--bnett-shadow-sm);
}
.bnett-hero__dot{ width:7px;height:7px;border-radius:50%;background:var(--bnett-brand); box-shadow:0 0 0 4px rgba(62,142,90,.16); }

.bnett-hero__title{
  font-family:var(--bnett-font-head); font-weight:700; color:var(--bnett-pine) !important;
  font-size:clamp(2.35rem,5.2vw,3.9rem); line-height:1.06; letter-spacing:-.03em;
  margin:0; max-width:16ch; text-wrap:balance;
}
.bnett-hero__hl{ color:var(--bnett-brand) !important; font-style:normal; }
.bnett-hero__sub{
  color:var(--bnett-muted) !important; font-size:clamp(1.05rem,1.6vw,1.22rem);
  line-height:1.55; max-width:54ch; margin-top:18px;
}

/* Søkekort – hvitt kort som "løftes" mot den lyse bakgrunnen */
.bnett-hero__card{
  position:relative;
  margin-top:34px; background:var(--bnett-surface);
  border:1px solid var(--bnett-line); border-radius:var(--bnett-radius-lg); padding:14px;
  box-shadow:var(--bnett-shadow-lg);
  max-width:760px;
}
.bnett-hero__row{ display:flex; flex-direction:column; gap:10px; }

.bnett-hero__field{
  position:relative; flex:1; min-width:0;
  display:flex; align-items:center; gap:12px;
  background:var(--bnett-sage-50); border:1px solid var(--bnett-line);
  border-radius:8px; padding:12px 16px;
  transition:border-color .18s, background .18s;
}
.bnett-hero__field:hover{ background:#eef5e9; border-color:var(--bnett-mint); }
.bnett-hero__field:focus-within{
  background:#fff; border-color:var(--bnett-brand);
  box-shadow:0 0 0 3px var(--bnett-ring);
}
.bnett-hero__ic{ flex:none; color:var(--bnett-brand); display:flex; }
.bnett-hero__ftext{ flex:1; min-width:0; display:flex; flex-direction:column; gap:1px; }
.bnett-hero__flabel{
  font:600 11.5px/1.3 var(--bnett-font-body); letter-spacing:.04em;
  text-transform:uppercase; color:var(--bnett-muted);
}
.bnett-hero__select, .bnett-hero__input{
  width:100%; border:0; background:transparent; outline:0; padding:1px 0;
  font:600 16.5px/1.35 var(--bnett-font-body); color:var(--bnett-ink) !important;
  -webkit-appearance:none; appearance:none;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.bnett-hero__select{
  padding-right:22px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%235a6b62' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M4 6l4 4 4-4'/></svg>");
  background-repeat:no-repeat; background-position:right center;
}
.bnett-hero__input::placeholder{ color:var(--bnett-muted); font-weight:500; }
.bnett-hero__input:disabled{ color:var(--bnett-muted) !important; cursor:not-allowed; }

.bnett-hero__btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px; flex:none;
  background:var(--bnett-btn) !important; color:#fff !important; border:0; border-radius:8px;
  padding:15px 22px; font:600 16.5px/1 var(--bnett-font-body); cursor:pointer;
  box-shadow:0 10px 22px -12px rgba(62,142,90,.9); text-decoration:none !important;
  transition:background .18s, transform .12s;
}
.bnett-hero__btn:hover{ background:var(--bnett-btn-hover) !important; }
.bnett-hero__btn:active{ transform:translateY(1px); }

/* Resultat-dropdown (søk) */
.bnett-hero__results{
  position:absolute; left:0; right:0; top:calc(100% + 6px); z-index:40;
  background:#fff; border:1px solid var(--bnett-line); border-radius:8px;
  box-shadow:0 18px 40px -18px rgba(8,22,16,.4); overflow:hidden;
}
.bnett-hero__result{
  display:flex; align-items:center; gap:10px; padding:11px 14px;
  color:var(--bnett-ink) !important; text-decoration:none !important; font-size:15px;
}
.bnett-hero__result:hover{ background:var(--bnett-sage-50); }
.bnett-hero__pill{
  flex:none; font:600 11px/1 var(--bnett-font-body); color:var(--bnett-brand-dark);
  background:var(--bnett-sage); padding:4px 8px; border-radius:100px;
}

/* Hurtigvalg */
.bnett-hero__chips{ display:flex; flex-wrap:wrap; align-items:center; gap:7px; padding:12px 6px 4px; }
.bnett-hero__chips-label{ font-size:13px; color:var(--bnett-muted) !important; margin-right:2px; align-self:center; font-weight:600; }
.bnett-hero__chip{
  font:500 13px/1 var(--bnett-font-body); color:var(--bnett-ink) !important;
  background:#fff; border:1px solid var(--bnett-line); border-radius:100px;
  padding:7px 13px; text-decoration:none !important; transition:.16s;
}
.bnett-hero__chip:hover{ background:var(--bnett-sage-50); border-color:var(--bnett-accent); color:var(--bnett-brand-dark) !important; }

/* Trygghetsrad */
.bnett-hero__trust{ display:flex; flex-wrap:wrap; gap:14px 22px; margin-top:26px; }
.bnett-hero__trust-item{ display:inline-flex; align-items:center; gap:8px; color:#3c4f45 !important; font:500 14.5px/1.3 var(--bnett-font-body); }
.bnett-hero__check{ width:18px; height:18px; border-radius:50%; background:var(--bnett-sage); color:var(--bnett-brand-dark); display:grid; place-items:center; flex:none; }

/* Desktop: felt på rad, mer luft */
@media (min-width:680px){
  .bnett-hero{ padding:104px 0 88px; }
  .bnett-hero__row{ flex-direction:row; align-items:stretch; }
  .bnett-hero__btn{ padding:0 26px; }
}

/* ============================================================
   3b. STAT-STRIPE  [bnett_stats]  – furugrønn, full bredde
   ============================================================ */
/* v2.0 – lys stat-stripe. Tallene bærer fargen, ikke bakgrunnen. */
.bnett-stats{
  width:100%;
  background:var(--bnett-surface-3);
  border-top:1px solid var(--bnett-sage);
  border-bottom:1px solid var(--bnett-sage);
  color:var(--bnett-ink);
}
.bnett-stats__inner{
  max-width:1160px; margin:0 auto;
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:22px;
  padding:26px 24px;
}
.bnett-stats__item{ display:flex; flex-direction:column; gap:2px; min-width:120px; }
.bnett-stats__item b{
  font-family:var(--bnett-font-head); font-weight:700; font-size:1.7rem;
  letter-spacing:-.02em; line-height:1; color:var(--bnett-brand-dark) !important;
}
.bnett-stats__item span{ color:var(--bnett-muted) !important; font:500 13.5px/1.3 var(--bnett-font-body); }

/* ============================================================
   4. Lett komponent-finpuss på plugin-ens utdata
   ============================================================ */

/* Fagområde-oversikten (pt_category_overview) */
.pt-coming__grid{ display:grid; grid-template-columns:1fr; gap:12px; }
@media (min-width:560px){ .pt-coming__grid{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:900px){ .pt-coming__grid{ grid-template-columns:repeat(4,1fr); gap:16px; } }

.pt-coming__card{
  background:#fff; border:1px solid var(--bnett-line); border-radius:var(--bnett-radius);
  padding:20px; display:flex; flex-direction:column; gap:12px;
  transition:transform .2s, box-shadow .2s, border-color .2s;
}
.pt-coming__card:hover{ transform:translateY(-3px); box-shadow:var(--bnett-shadow); border-color:var(--bnett-mint); }
.pt-coming__h{ font-family:var(--bnett-font-head); font-weight:600; font-size:1.18rem; letter-spacing:-.01em; color:var(--bnett-ink) !important; margin:0; }
.pt-coming__badge{ font:600 11px/1 var(--bnett-font-body); color:var(--bnett-brand-dark); background:var(--bnett-sage); padding:5px 10px; border-radius:100px; }
.pt-coming__actions{ margin-top:auto; }
.pt-coming__btn--primary{
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--bnett-brand) !important; color:#fff !important; text-decoration:none !important;
  border-radius:8px; padding:10px 16px; font:600 14px/1 var(--bnett-font-body);
  transition:background .18s;
}
.pt-coming__btn--primary:hover{ background:var(--bnett-btn-hover) !important; }

/* Søke-autocomplete på rute-sider (.ptlr-search) */
.ptlr-search-results{ border:1px solid var(--bnett-line); border-radius:var(--bnett-radius); box-shadow:var(--bnett-shadow); overflow:hidden; }
.ptlr-search-results a{ display:flex; align-items:center; gap:10px; padding:11px 14px; text-decoration:none !important; }
.ptlr-search-results a:hover{ background:var(--bnett-sage-50); }
.ptlr-search-pill{ font:600 11px/1 var(--bnett-font-body); color:var(--bnett-brand-dark); background:var(--bnett-sage); padding:4px 8px; border-radius:100px; }
.ptlr-search-title{ font-weight:600; color:var(--bnett-ink) !important; }
.ptlr-search-sub{ color:var(--bnett-muted); font-size:13px; }

/* Filterlinje (.ptlr-facets) */
.ptlr-facets__btn{ border:1px solid var(--bnett-line); border-radius:8px; }
.ptlr-facets__search{ border:1px solid var(--bnett-line); border-radius:8px; background:var(--bnett-sage-50); }
.ptlr-facets__chip.is-on{ background:var(--bnett-btn) !important; border-color:var(--bnett-btn) !important; color:#fff !important; }

/* Generelle CTA-er + paginering */
.ptlr-cta{ background:var(--bnett-btn) !important; color:#fff !important; border-radius:8px; padding:11px 18px; font-weight:600; text-decoration:none !important; display:inline-flex; align-items:center; gap:8px; transition:background .18s; }
.ptlr-cta:hover{ background:var(--bnett-btn-hover) !important; }
.ptlr-pagination a, .ptlr-pagination span{ border-radius:7px; }

/* ============================================================
   5. BEHANDLERKORT v2 – nytt kategoriside-design (jul 2026)
   Additivt lag: overstyrer kort, badges og knapper fra
   bnett-custom.css. Kan fjernes i sin helhet uten bivirkninger.
   ============================================================ */

/* ---- 5.1/5.2 Behandlerkortene ----
   Flyttet til v3.4 nederst i filen. Kortene ble styrt fra tre steder med
   !important i hvert av dem, og da var det umulig aa endre noe uten aa
   trekke i tre traader samtidig. Naa ligger alt ett sted. */

/* ---- 5.3 Fremhevet-badge: grønn pille, hvit tekst ---- */
.pt-badge--recommended{
  background:var(--bnett-btn) !important;
  color:#fff !important;
  border-radius:999px !important;
  right:14px !important;
  top:14px !important;
  padding:7px 14px !important;
  font-size:11px !important;
  font-weight:700 !important;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.pt-badge--recommended .pt-badge__icon{
  background:rgba(255,255,255,.22) !important;
  border-color:transparent !important;
  color:#fff !important;
  width:1.5rem !important;
  height:1.5rem !important;
  font-size:11px !important;
}
@media (max-width:768px){
  .pt-badge--recommended{
    right:0 !important; top:0 !important;
    padding:6px 12px !important;
    align-self:flex-start;
    width:max-content;
    margin-bottom:6px;
  }
}

/* ---- 5.4 Knapper i kort: piller (fylt grønn / hvit med kant) ---- */
.ptlr-cta{ border-radius:999px !important; border:1.5px solid transparent !important; }
.ptlr-campaign-card .ptlr-cta{
  background:var(--bnett-btn) !important;
  color:#fff !important;
  border:1.5px solid transparent !important;
  border-radius:999px !important;
  font-weight:600;
  text-decoration:none !important;
}
.ptlr-campaign-card .ptlr-cta:hover{
  background:var(--bnett-btn-hover) !important;
  text-decoration:none !important;
}
.ptlr-campaign-card .ptlr-profile-link{
  background:#fff !important;
  color:var(--bnett-pine) !important;
  border:1.5px solid var(--bnett-sage) !important;
  border-radius:999px !important;
  font-weight:600;
  text-decoration:none !important;
  transition:border-color .15s ease, background .15s ease;
}
.ptlr-campaign-card .ptlr-profile-link:hover{
  border-color:var(--bnett-brand) !important;
  background:var(--bnett-sage-50) !important;
  text-decoration:none !important;
}

/* ---- 5.5 Steds-badges i kort: sage-pille med grønn tekst ---- */
.ptlr-badge--loc{
  background:var(--bnett-sage-50) !important;
  border:1px solid var(--bnett-sage) !important;
  color:var(--bnett-brand-dark) !important;
  font-weight:600 !important;
}

/* ---- 5.6 Profilbilder: merkegrønn ring i stedet for mørk ---- */
.ptlr-campaign-list .ptlr-campaign-card .ptlr-campaign-list-logo,
.ptlr-campaign-detail-logo{
  border:2px solid var(--bnett-brand) !important;
}

/* ---- 5.7 Videotime-indikator: brand-grønn ---- */
.ptlr-online-dot{ fill:var(--bnett-brand); }
.ptlr-online-pulse{ stroke:var(--bnett-brand); }

/* ============================================================
   6. POPULÆRE STEDER / stedslister – pille-kort i grid
   Overstyrer darkseagreen-listene fra bnett-custom.css.
   Additivt: kan fjernes i sin helhet uten bivirkninger.
   ============================================================ */
.ptlr-location-counts-list__title{
  font-family:var(--bnett-font-head);
  font-weight:700;
  font-size:1.35rem;
  color:var(--bnett-pine);
  margin:0 0 14px;
}
ul.ptlr-location-counts-list__list{
  display:grid !important;
  grid-template-columns:repeat(auto-fill, minmax(215px, 1fr)) !important;
  gap:10px !important;
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
}
li.ptlr-location-counts-list__item{
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  background:none !important;
  border:0 !important;
  border-radius:0 !important;
  min-width:0;
}
li.ptlr-location-counts-list__item a.ptlr-location-counts-list__link{
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  background:#fff !important;
  border:1.5px solid var(--bnett-sage) !important;
  border-radius:8px !important;
  padding:13px 16px !important;
  color:var(--bnett-pine) !important;
  font:500 .93rem/1.35 var(--bnett-font-body) !important;
  text-decoration:none !important;
  transition:border-color .15s ease, box-shadow .15s ease;
  min-width:0;
}
li.ptlr-location-counts-list__item a.ptlr-location-counts-list__link:hover{
  border-color:var(--bnett-brand) !important;
  box-shadow:0 6px 18px rgba(20,36,29,.08);
  text-decoration:none !important;
}
.ptlr-location-counts-list__name{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.ptlr-location-counts-list__count{
  flex:none;
  font:700 .8rem/1 var(--bnett-font-body);
  color:var(--bnett-brand-dark);
  background:var(--bnett-sage-50);
  border:1px solid var(--bnett-sage);
  padding:5px 10px;
  border-radius:999px;
}

/* ---- 6.1 Stedsnavn skal aldri kuttes: bryt til to linjer ---- */
ul.ptlr-location-counts-list__list{
  grid-template-columns:repeat(auto-fill, minmax(230px, 1fr)) !important;
}
li.ptlr-location-counts-list__item a.ptlr-location-counts-list__link{
  min-height:52px;
}
.ptlr-location-counts-list__name{
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
  overflow-wrap:break-word;
}

/* ============================================================
   7. PAGINERING – brand-grønn aktiv side (erstatter navy)
   ============================================================ */
.ptlr-pagination a,
.ptlr-pagination span{
  border:1.5px solid var(--bnett-sage) !important;
  border-radius:8px !important;
  color:var(--bnett-pine);
}
.ptlr-pagination a:hover{
  border-color:var(--bnett-brand) !important;
  box-shadow:0 6px 18px rgba(20,36,29,.08) !important;
}
.ptlr-pagination .is-active{
  background:var(--bnett-brand) !important;
  border-color:var(--bnett-brand) !important;
  color:#fff !important;
}
.ptlr-pagination .is-ellipsis{
  border-color:transparent !important;
  background:transparent !important;
}

/* ---- v2.0: aktiv rad i hero-søkeresultat (tastaturnavigasjon) ---- */
.bnett-hero__result.is-active{
  background:var(--bnett-sage-50);
  outline:2px solid var(--bnett-ring);
  outline-offset:-2px;
}
.bnett-hero__rtitle{ font-weight:600; }

/* ============================================================
   7. v2.0 – Gjennomgående lyst designspråk
   Samler flatene på tvers av komponentene så sidene henger sammen.
   ============================================================ */

/* Seksjonsflater: unngå at "alt er hvitt" uten å bli mørkt */
.bnett-section-soft{ background:var(--bnett-surface-2); }
.bnett-section-sage{ background:var(--bnett-surface-3); }

/* Kort-konsistens: samme radius/kant/skygge som hero-kortet.
   Behandlerkortene er tatt ut – de styres av v3.4 nederst. */
.pt-coming__card,
.ptlr-search-results,
.ptlr-facets__panel{
  border-radius:var(--bnett-radius-md) !important;
  box-shadow:var(--bnett-shadow-sm) !important;
}
/* Fasett-panel: lys og luftig, samme språk som hero-kortet */
.ptlr-facets__panel{
  box-shadow:var(--bnett-shadow-lg) !important;
}
.ptlr-facets__btn{
  border-radius:var(--bnett-radius-sm) !important;
  box-shadow:var(--bnett-shadow-sm) !important;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.ptlr-facets__btn:hover{
  border-color:var(--bnett-mint) !important;
}
.ptlr-facets__btn:focus-visible{
  outline:none !important;
  border-color:var(--bnett-brand) !important;
  box-shadow:0 0 0 3px var(--bnett-ring) !important;
}
.ptlr-facets__actionBtn--primary{
  background:var(--bnett-btn) !important;
}
.ptlr-facets__actionBtn--primary:hover{
  background:var(--bnett-btn-hover) !important;
}

/* Populære steder: fra darkseagreen-blokker til lyse sage-piller */
li.ptlr-location-counts-list__item{
  background:var(--bnett-surface) !important;
  border:1px solid var(--bnett-sage) !important;
  border-radius:var(--bnett-radius-sm) !important;
  padding:12px 18px !important;
  transition:border-color .15s ease, background .15s ease, transform .12s ease;
}
li.ptlr-location-counts-list__item:hover{
  background:var(--bnett-sage-50) !important;
  border-color:var(--bnett-accent) !important;
  transform:translateY(-1px);
}
li.ptlr-location-counts-list__item a{
  color:var(--bnett-pine) !important;
  font-weight:600;
}
li.ptlr-location-counts-list__item a:hover{ text-decoration:none !important; }

/* Default-avatarer: samme ring som ekte profilbilder, men mykere */
.bnett-avatar{
  display:block;
  border-radius:50%;
  background:transparent;
}
.ptlr-campaign-list .ptlr-campaign-card .bnett-avatar,
.ptlr-campaign-detail-logo.bnett-avatar{
  border:2px solid var(--bnett-accent) !important;
  box-shadow:var(--bnett-shadow-sm);
}

/* Universell fokus-synlighet (tilgjengelighet) */
.bnett-hero a:focus-visible,
.bnett-hero button:focus-visible,
.ptlr-campaign-card a:focus-visible,
.ptlr-register-cta a:focus-visible{
  outline:3px solid var(--bnett-ring);
  outline-offset:2px;
  border-radius:6px;
}

/* Respekter redusert bevegelse */
@media (prefers-reduced-motion:reduce){
  .ptlr-campaign-card,
  .ptlr-register-cta__btn,
  li.ptlr-location-counts-list__item,
  .ptc-web__cta{
    transition:none !important;
  }
  .ptlr-campaign-card:hover,
  a.ptlr-register-cta__btn:hover,
  li.ptlr-location-counts-list__item:hover{
    transform:none !important;
  }
}

/* ---- v2.0: sosialt bevis (avatar-stack) i hero-eyebrow ---- */
.bnett-hero__eyebrow{ padding-left:8px; }
.bnett-hero__avas{ display:inline-flex; align-items:center; flex:none; }
.bnett-hero__ava{
  display:block; width:26px; height:26px; border-radius:50%;
  overflow:hidden; background:#fff;
  box-shadow:0 0 0 2px #fff;
  margin-right:-9px;
}
.bnett-hero__ava:last-child{ margin-right:5px; }
.bnett-hero__ava-svg{ width:26px !important; height:26px !important; display:block; border:0 !important; box-shadow:none !important; }

/* ---- v2.0: sentrert hero (standard). align="left" gir gammel venstrestilling ---- */
@media (min-width:980px){
  .bnett-hero--center .bnett-hero__inner{ text-align:center; }
  .bnett-hero--center .bnett-hero__title{ margin-left:auto; margin-right:auto; max-width:19ch; }
  .bnett-hero--center .bnett-hero__sub{ margin-left:auto; margin-right:auto; }
  .bnett-hero--center .bnett-hero__card{ margin-left:auto; margin-right:auto; text-align:left; }
  .bnett-hero--center .bnett-hero__chips{ justify-content:center; }
  .bnett-hero--center .bnett-hero__trust{ justify-content:center; }
}


/* ============================================================
   v3.0 – STRAMMING
   ------------------------------------------------------------
   Retning: hårfine streker i stedet for skygger, nesten flate
   hjørner, versal-etiketter og tyngre overskrifter. Grønnfargen
   beholdes, men brukes som signal – ikke som store flater.

   Tokenene under styrer alt som faktisk bruker dem. Blokkene
   etterpå tar de komponentene som hardkoder radius og skygge.
   ============================================================ */

:root{
  /* Flate hjørner. Profilbilder og toppmenyens CTA er unntak, og
     settes eksplisitt lenger ned. */
  --bnett-radius:5px;
  --bnett-radius-sm:4px;
  --bnett-radius-md:5px;
  --bnett-radius-lg:6px;

  /* Ingen skygger. Dybden kommer fra streken. */
  --bnett-shadow:none;
  --bnett-shadow-sm:none;
  --bnett-shadow-md:none;
  --bnett-shadow-lg:none;

  /* Streken bærer nå strukturen, og må være synlig nok til det. */
  --bnett-border:#e6e8e6;
  --bnett-line:#e6e8e6;
  --bnett-line-strong:#cfd5d1;

  /* Mindre grønt flatefyll: seksjonsflatene går mot hvitt. */
  --bnett-surface:#ffffff;
  --bnett-surface-2:#fafbfa;
  --bnett-surface-3:#f4f6f4;
  --bnett-soft:#f4f6f4;
  --bnett-paper:#ffffff;
}

/* ---- Overskrifter: tyngre og strammere ---- */
body h1, body h2, body h3,
body .elementor-heading-title{
  font-weight:800 !important;
  letter-spacing:-.028em !important;
  line-height:1.08 !important;
}
body h4, body h5, body h6{
  font-weight:700 !important;
  letter-spacing:-.018em !important;
}

/* ---- Seksjonsetiketter som versaler ---- */
.ptlr-facets__panelTitle,
.bnett-stats__item span,
.ptlr-campaign-summary__count,
.bnf-group__label{
  font-family:var(--bnett-font-body) !important;
  font-size:10.5px !important;
  letter-spacing:.13em !important;
  text-transform:uppercase !important;
  font-weight:500 !important;
  color:var(--bnett-muted) !important;
}

/* ---- Flate hjørner der de er hardkodet ----
   Behandlerkortene staar ikke her lenger; de har egne, mykere hjoerner. */
.ptlr-campaign-gallery,
.ptlr-campaign-detailpage,
.ptlr-pagination,
.ptlr-facets__panel,
.ptlr-facets__suggest,
.ptlr-facets__actionBtn,
.ptlr-facets__section__toggle,
.ptlr-register-cta,
.ptlr-card-grid > *,
.pt-coming__btn,
.elementor-message-success,
.bnett-stats,
.bnett-hero__card{
  border-radius:5px !important;
  box-shadow:none !important;
}

/* Kanten erstatter skyggen der den manglet */
.ptlr-register-cta,
.ptlr-card-grid > *{
  border:1px solid var(--bnett-border) !important;
}

/* ---- Unntakene: rundt skal fortsatt være rundt ----
   NB: :not(.ptlr-campaign-gallery) er vesentlig. Galleribildene har også
   klassen .ptlr-campaign-media, og ble runde – det var derfor hjørnene så
   ut til å bli kuttet. */
.ptlr-campaign-card img.ptlr-campaign-media:not(.ptlr-campaign-gallery),
.ptlr-campaign-media--avatar,
.ptlr-campaign-detail-logo,
.bnett-hero__avatars img,
.ptlr-campaign-fallback-badge{
  border-radius:50% !important;
}
/* Toppmenyens CTA beholder pilleformen – den er merkevaren, ikke UI-krom. */
.bnett-hero__cta,
.ptlr-facets__fab{
  border-radius:999px !important;
}

/* ---- Chips og merker: flate, kant i stedet for fyll ---- */
.ptlr-badge,
.ptlr-filter-chip,
.ptlr-campaign-locations__item,
.bnett-hero__chip{
  border-radius:4px !important;
  box-shadow:none !important;
  letter-spacing:.03em;
}

/* ---- Knapper ---- */
.ptlr-facets__actionBtn--primary,
.ptlr-register-cta__btn,
.pt-coming__btn{
  border-radius:4px !important;
  box-shadow:none !important;
}

/* ---- Skjemafelter ---- */
.ptlr-facets__input,
.ptlr-facets__search input,
.bnett-hero__field input,
.bnett-hero__field select{
  border-radius:4px !important;
  box-shadow:none !important;
}

/* ---- Hero: mindre gradient, mer luft ---- */
.bnett-hero{
  background:#fff !important;
  border-bottom:1px solid var(--bnett-border) !important;
}
.bnett-hero__title{ letter-spacing:-.032em !important; }

/* ---- Fokus skal fortsatt være godt synlig ---- */
.bnf button:focus-visible,
.ptlr-facets__btn:focus-visible,
.ptlr-campaign-card a:focus-visible{
  outline:2px solid var(--bnett-btn) !important;
  outline-offset:2px !important;
}


/* ---- Galleri: firkantet med myke hjørner, aldri sirkel ---- */
.ptlr-campaign-gallery .ptlr-gallery-item,
.ptlr-campaign-gallery .ptlr-gallery-item img{
  border-radius:4px !important;
}

/* ---- Lightbox: piler, teller og lukk ---- */
.ptlr-lightbox{
  position:fixed; inset:0; z-index:1000000;
  background:rgba(12,20,16,.86);
  display:none; align-items:center; justify-content:center;
  padding:56px 20px;
}
.ptlr-lightbox.is-open{ display:flex; }
.ptlr-lightbox__img{
  max-width:min(1100px,92vw); max-height:86vh; width:auto; height:auto;
  border-radius:4px !important; box-shadow:none !important; background:#fff;
}
/*
 * Lightboxen henger paa <body>, utenfor alt vi ellers eier, og knappene
 * er <button>. Temaets Elementor Kit har sin egen knappestil med
 * spesifisitet 0-2-0 og en blaa merkefarge – den vant over de gamle
 * reglene her (0-1-0), og piler og kryss ble blaa klosser oppaa bildet.
 * Velgerne under gjentar klassen for aa komme over, og setter ogsaa
 * skygge og tekstskygge til `none`, som Kit-et legger paa knapper.
 */
.ptlr-lightbox button.ptlr-lightbox__close.ptlr-lightbox__close,
.ptlr-lightbox button.ptlr-lightbox__nav.ptlr-lightbox__nav{
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  cursor:pointer;
  background:rgba(18,28,23,.55);
  color:#fff;
  line-height:1;
  padding:0;
  box-shadow:none;
  text-shadow:none;
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
  display:flex; align-items:center; justify-content:center;
  transition:background .15s ease, border-color .15s ease, transform .15s ease;
}
.ptlr-lightbox button.ptlr-lightbox__close.ptlr-lightbox__close{
  position:absolute; top:16px; right:18px;
  width:44px; height:44px; font-size:24px;
}
.ptlr-lightbox button.ptlr-lightbox__nav.ptlr-lightbox__nav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:52px; height:52px; font-size:26px;
}
.ptlr-lightbox button.ptlr-lightbox__close.ptlr-lightbox__close:hover,
.ptlr-lightbox button.ptlr-lightbox__nav.ptlr-lightbox__nav:hover{
  background:rgba(255,255,255,.18);
  border-color:rgba(255,255,255,.45);
  color:#fff;
}
.ptlr-lightbox button.ptlr-lightbox__nav.ptlr-lightbox__nav:hover{
  transform:translateY(-50%) scale(1.06);
}
.ptlr-lightbox button.ptlr-lightbox__close.ptlr-lightbox__close:focus-visible,
.ptlr-lightbox button.ptlr-lightbox__nav.ptlr-lightbox__nav:focus-visible{
  outline:2px solid #fff; outline-offset:2px;
}
.ptlr-lightbox__nav--prev{ left:16px; }
.ptlr-lightbox__nav--next{ right:16px; }
@media (prefers-reduced-motion:reduce){
  .ptlr-lightbox button.ptlr-lightbox__close.ptlr-lightbox__close,
  .ptlr-lightbox button.ptlr-lightbox__nav.ptlr-lightbox__nav{ transition:none; }
  .ptlr-lightbox button.ptlr-lightbox__nav.ptlr-lightbox__nav:hover{
    transform:translateY(-50%);
  }
}
.ptlr-lightbox__count{
  position:absolute; bottom:18px; left:50%; transform:translateX(-50%);
  color:rgba(255,255,255,.8); font-size:13px; letter-spacing:.06em;
  font-variant-numeric:tabular-nums;
}
.ptlr-lightbox [hidden]{ display:none !important; }
@media (max-width:640px){
  .ptlr-lightbox{ padding:56px 8px; }
  .ptlr-lightbox button.ptlr-lightbox__nav.ptlr-lightbox__nav{
    width:44px; height:44px; font-size:22px;
  }
  .ptlr-lightbox__nav--prev{ left:6px; }
  .ptlr-lightbox__nav--next{ right:6px; }
}

/* ============================================================
   v3.1 – FOELGER AV STICKY HEADER OG NYE KOMPONENTER
   ------------------------------------------------------------
   Naar headeren ble sticky, la den seg oppaa alt man hopper til
   med en ankerlenke: innholdslenker i artiklene, «hopp til
   innhold», og #-lenker i menyen. scroll-margin-top loeser det
   uten JavaScript og uten aa flytte noe visuelt.
   ============================================================ */
:root{ --bnett-sticky-h: 88px; }

:where(#content, [id]):target{ scroll-margin-top: var(--bnett-sticky-h); }
.bn-artikkel :where(h2, h3, h4)[id],
.ptlr-campaign-card[id],
.bnfilter[id],
.bnart[id]{ scroll-margin-top: var(--bnett-sticky-h); }

@media (max-width: 980px){
  :root{ --bnett-sticky-h: 76px; }
}

/* Ett felles fokusmerke i alle komponentene vaare. Nettleserens eget
   forsvinner mot de lyse flatene, og Elementor nullstiller det flere
   steder. Vi setter det derfor selv, scopet til vaare egne roetter. */
.ptlr-campaign-card :where(a, button):focus-visible,
.bnfilter :where(a, button, input, select):focus-visible,
.bnart :where(a, button):focus-visible,
.bnart-sok a:focus-visible,
.ptc-v2 :where(a, button, input, select, textarea):focus-visible{
  outline: 2px solid #388051;
  outline-offset: 2px;
  border-radius: 3px;
}

@media (prefers-reduced-motion: no-preference){
  html{ scroll-behavior: smooth; }
}

/* ============================================================
   v3.2 – HEROENS SØKEBLOKK
   ------------------------------------------------------------
   Kortet rundt søkefeltene og «Populært» hadde en grå ramme som
   la en boks rundt boksene. Rammen er borte; feltene staar for
   seg selv mot den hvite heroen. Samtidig er felt, knapp og
   tekst strammet inn et hakk – de var i overkant store, og den
   lange plassholderen i stedsfeltet ble kuttet midt i ordet.
   ============================================================ */
.bnett-hero__card{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  margin-top:28px;
  max-width:720px;
}
.bnett-hero__row{ gap:8px; }

.bnett-hero__field{
  padding:8px 13px !important;
  gap:10px;
  border-radius:4px !important;
}
.bnett-hero__ic svg{ width:18px; height:18px; }
.bnett-hero__flabel{ font-size:10.5px !important; letter-spacing:.06em; }
.bnett-hero__select,
.bnett-hero__input{ font-size:15px !important; }

.bnett-hero__btn{
  padding:13px 20px !important;
  font-size:15px !important;
  border-radius:4px !important;
  box-shadow:none !important;
}

.bnett-hero__chips{ padding:14px 0 0 !important; gap:6px; }
.bnett-hero__chips-label{ font-size:12.5px !important; }
.bnett-hero__chip{ font-size:12.5px !important; padding:6px 11px !important; }

.bnett-hero__trust{ margin-top:22px; }
.bnett-hero__trust-item{ font-size:14px !important; }

@media (min-width:680px){
  /* Knappen fyller hoyden av raden av seg selv naar radene strekkes. */
  .bnett-hero__btn{ padding:0 22px !important; }
  .bnett-hero__card{ margin-top:30px; }
}

/* ============================================================
   v3.3 – headeren skal alltid ligge over innholdet
   ------------------------------------------------------------
   Elementor gir ikke sticky-beholderen noen z-index. Seksjoner
   lenger nede paa siden lager egne stablingskontekster (transform,
   filter, egen z-index) og la seg derfor over headeren naar man
   rullet. Vi loefter headeren eksplisitt.
   ============================================================ */
/* MERK: position staar her ogsaa, og maa foelge bnett-header.css. Sto det
   `relative` her, ville denne filen slaatt av sticky – de to reglene har
   samme spesifisitet, og denne lastes sist. */
.bnh{ position:sticky; top:0; z-index:99990; }

/* Selve sticky-beholderen Elementor lager. */
.elementor-sticky--active{ z-index:99990 !important; }

/* Beholderen headeren staar i, ogsaa naar den ikke er sticky.
   MERK: sett aldri position paa selve sticky-elementet her. Elementor gir det
   position:fixed, og en regel med hoeyere spesifisitet ville slaatt den av –
   da ruller headeren ut av bildet i stedet. Bare z-index. */
header.elementor-location-header,
.elementor-location-header{ position:relative; z-index:99990; }
.elementor-element:has(> .elementor-widget-container > .bnh){ z-index:99990; }

/* Ingenting i innholdet skal kunne konkurrere. Elementor setter ofte
   z-index paa enkeltseksjoner; de skal fortsatt ligge under headeren. */
.elementor-location-header ~ .elementor-location-single,
.elementor-location-header ~ main,
main.site-main{ position:relative; z-index:1; }

/* Nedtrekk og skuff ligger over alt annet i headeren. */
.bnh .bnh__sub{ z-index:100; }

/* ============================================================
   v3.4 – behandlerkortene
   ------------------------------------------------------------
   Kortene ble tegnet med skygge, uten ramme, med prosentbasert
   luft (2% 3%) og en radial "blob" paa prioriterte. Prosentluft
   gir ulik innvendig marg i én kolonne og i tre, skyggen gjorde
   listen grumsete, og blobben leste som en flekk.

   Nytt: hvit flate, hårfin ramme, roligere hjørner og INGEN
   skygge i hvile. All bevegelse ligger i hover, der den betyr
   noe. Ligger i bnett-design.css, som lastes etter
   bnett-custom.css, og trenger derfor ingen !important.
   ============================================================ */
.ptlr-campaign-card{
  --kort-linje:rgba(20,36,29,.10);
  --kort-linje-hover:rgba(56,128,81,.45);
  --kort-gronn:#388051;

  background:#fff;
  border:1px solid var(--kort-linje);
  border-radius:8px;
  box-shadow:none;
  padding:20px 22px;
  margin-bottom:12px;
  transition:border-color .16s ease, box-shadow .18s ease, transform .18s ease;
}

/* Hover og tastaturfokus gjoer det samme: loefter kortet litt og
   gjoer rammen groenn. Focus-within fanger opp at man tabber seg
   inn i lenken eller knappen inni kortet.

   MERK: bare kort som staar i en LISTE loefter seg. Paa en
   behandlerside er kortet selve siden – da skal ingenting bevege
   seg naar musen tilfeldigvis er over det. */
.ptlr-campaign-list .ptlr-campaign-card:hover,
.ptlr-campaign-list .ptlr-campaign-card:focus-within{
  border-color:var(--kort-linje-hover);
  box-shadow:0 6px 20px -10px rgba(20,36,29,.28), 0 2px 6px -3px rgba(20,36,29,.12);
  transform:translateY(-2px);
}

/* Prioriterte kort: ingen blob, men en tydelig groenn kant til
   venstre og et anelse varmere underlag. Det leses som «denne er
   framhevet» uten aa rope. */
.ptlr-campaign-card--prioritert{
  border-color:rgba(56,128,81,.28);
  background:linear-gradient(180deg,#f7fbf5 0,#fff 120px);
  box-shadow:inset 3px 0 0 var(--kort-gronn);
  padding-left:25px;
}
.ptlr-campaign-list .ptlr-campaign-card--prioritert:hover,
.ptlr-campaign-list .ptlr-campaign-card--prioritert:focus-within{
  border-color:var(--kort-linje-hover);
  box-shadow:inset 3px 0 0 var(--kort-gronn),
             0 8px 24px -10px rgba(20,36,29,.30), 0 2px 6px -3px rgba(20,36,29,.12);
}
/* Den gamle blobben skal ikke ligge under det nye. */
.ptlr-campaign-card--prioritert::before{ content:none; }

@media (max-width:768px){
  .ptlr-campaign-card{ padding:16px; margin-bottom:10px; border-radius:7px; }
  .ptlr-campaign-card--prioritert{ padding-left:19px; }
}

/* I rutenettet (tre kolonner) skal kortene vaere like hoye og ikke
   flytte pa seg ved hover – der er de smale. */
.ptlr-campaign-list-float .ptlr-campaign-card{ margin-bottom:0; height:100%; }
.ptlr-campaign-list-float .ptlr-campaign-card:hover{ transform:none; }

/* Et kort som ikke staar i en liste – behandlersiden – ligger stille. */
.bnett-behandlerside .ptlr-campaign-card:not(.ptlr-campaign-list .ptlr-campaign-card){
  transform:none;
  cursor:default;
}

@media (prefers-reduced-motion:reduce){
  .ptlr-campaign-card{ transition:none; }
  .ptlr-campaign-card:hover,
  .ptlr-campaign-card:focus-within{ transform:none; }
}

/* ============================================================
   v3.5 – behandlersiden (detaljsiden)
   ------------------------------------------------------------
   Siden er bygget av en Elementor-mal og shortcodes fra ruteren.
   Vi kan derfor ikke flytte paa markupen, men vi kan gi den ro,
   rytme og et tydeligere hierarki. Alt henger paa
   body.bnett-behandlerside, som ruteren setter, og paa klassene
   shortcodene selv skriver ut.
   ============================================================ */

/* ---- Temaene som chips i stedet for kulepunkter ----
   «Hva kan jeg få hjelp med?» var en 13 punkters kulepunktliste.
   Som chips ser man hele bredden av tilbudet på ett blikk. */
.ptlr-cmeta-list--tema{
  list-style:none !important;
  margin:10px 0 0 !important;
  padding:0 !important;
  display:flex; flex-wrap:wrap; gap:7px;
}
.ptlr-cmeta-list--tema .ptlr-cmeta-list__item{
  margin:0 !important;
  padding:6px 13px;
  background:var(--bnett-sage-50,#f2f7ee);
  color:var(--bnett-btn-hover,#2f7048);
  border:1px solid rgba(56,128,81,.16);
  border-radius:999px;
  font-size:13.5px; font-weight:600; line-height:1.35;
  list-style:none !important;
}
.ptlr-cmeta-list--tema .ptlr-cmeta-list__item::marker{ content:none; }

/* ---- «Tilbyr online-timer» ---- */
.ptlr-video-badge{
  display:inline-flex; align-items:center; gap:7px;
  padding:5px 13px 5px 10px; border-radius:999px;
  background:var(--bnett-sage-50,#f2f7ee);
  color:var(--bnett-btn-hover,#2f7048);
  font-size:13.5px; font-weight:600;
}

/* ---- Rytme i seksjonene ----
   Overskriftene i malen sto for tett paa teksten over. En hårfin
   linje over hver seksjon gir siden takt uten flere bokser. */
.bnett-behandlerside .elementor-widget-heading h2,
.bnett-behandlerside .elementor-widget-heading h3{
  margin-top:0;
  letter-spacing:-.02em;
}
.bnett-behandlerside .ptlr-section-title{
  margin:34px 0 12px;
  padding-top:22px;
  border-top:1px solid var(--bnett-border,rgba(20,36,29,.10));
  font-size:13px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--bnett-muted,#5a6b62);
}

/* ---- Leselengde ----
   Brødteksten gikk i full bredde paa store skjermer. Over ca. 75
   tegn mister oeyet linjen. */
.bnett-behandlerside .elementor-widget-text-editor p,
.bnett-behandlerside .elementor-widget-theme-post-content p{
  max-width:72ch;
  line-height:1.65;
}

/* ---- Profilbildet ---- */
.bnett-behandlerside .ptlr-campaign-detail-logo{
  border:3px solid #fff !important;
  box-shadow:0 0 0 1px rgba(20,36,29,.10), 0 10px 26px -14px rgba(20,36,29,.35) !important;
}

/* ---- «Avtal en time» ----
   Hovedhandlingen paa siden. Den skal se ut som det. */
.bnett-behandlerside .ptlr-cta{
  padding:14px 26px !important;
  font-size:16px !important;
  font-weight:600;
  border-radius:8px !important;
  float:none !important;
  display:inline-flex; align-items:center; gap:9px;
}
.bnett-behandlerside .ptlr-cta::after{
  content:"→"; font-size:15px; line-height:1;
  transition:transform .16s ease;
}
.bnett-behandlerside .ptlr-cta:hover::after{ transform:translateX(3px); }
.bnett-behandlerside .ptlr-profile-link{
  padding:13px 24px !important;
  border-radius:8px !important;
  float:none !important;
}

@media (max-width:680px){
  /* Paa mobil er knappen ofte langt nede. Full bredde gjoer den
     lettere aa treffe, og skiller den fra teksten rundt. */
  .bnett-behandlerside .ptlr-cta,
  .bnett-behandlerside .ptlr-profile-link{
    display:flex; justify-content:center; width:100%;
    margin:0 0 10px 0 !important;
  }
}

/* ---- Kartet ---- */
.bnett-behandlerside .bnm-map,
.bnett-behandlerside iframe[src*="google.com/maps"]{
  border-radius:7px;
  border:1px solid var(--bnett-border,rgba(20,36,29,.10));
  overflow:hidden;
  min-height:280px;
}

/* ---- Naboene ----
   «Andre psykologer i nærheten» er lange lister. Vi gjoer dem
   luftigere og lettere aa skanne. */
.bnett-behandlerside .ptlr-campaign-list-short .ptlr-campaign-card{
  padding:14px 16px;
  margin-bottom:8px;
}

/* ---- Krisetelefonene ----
   Skal vaere lette aa finne, men ikke stjele oppmerksomheten fra
   behandleren. Dempet ramme, tydelige numre. */
.bnett-behandlerside .ptlr-akutt,
.bnett-behandlerside .bnett-akutt{
  border:1px solid var(--bnett-border,rgba(20,36,29,.10));
  border-radius:7px;
  padding:16px 18px;
  background:#fbfcfa;
}

@media (prefers-reduced-motion:reduce){
  .bnett-behandlerside .ptlr-cta::after{ transition:none; }
  .bnett-behandlerside .ptlr-cta:hover::after{ transform:none; }
}

/* =============================================================
   FELT — ÉN STIL FOR HELE NETTSTEDET

   ============================================================
   Hvorfor denne blokken finnes
   ============================================================

   Feltstilen var definert fire steder: forsiden, Min side,
   bestillingsskjemaet i commerce og filterpanelet. Hver av dem hadde
   sine egne verdier – 4px, 6px og 12px hjørneradius, 15px og 16px
   skrift, tre ulike rammefarger – og hver av dem forsvarte seg mot
   temaet på sin egen måte. Resultatet var at ett felt så ulikt ut
   avhengig av hvilken side du sto på, og at en ny skjerm arvet den
   grønne bakgrunnen fra temaet helt til noen oppdaget det.

   Nå står formen ett sted. Komponenter som MÅ se annerledes ut – den
   hvite søkepillen på forsiden og /finn-behandler/, der feltene er
   usynlige inni én pille – overstyrer med høyere spesifisitet, som de
   allerede gjør.

   ============================================================
   Hvorfor fargene er tall og ikke var()
   ============================================================

   En var() som ikke lar seg løse gjør HELE erklæringen ugyldig. Da
   faller `background` bort, og temaets lysegrønne slår igjennom – altså
   nøyaktig feilen vi forsvarer oss mot. Et forsvar som avhenger av at et
   token finnes, er ikke et forsvar.

   ============================================================
   Hvorfor :is() og ikke :where()
   ============================================================

   Første utgave brukte :where(), som teller null i spesifisitet. Det var
   elegant og helt ubrukelig: temaets regel er `.elementor-kit-9 input`
   med !important, altså (0,1,1), mens vår ble (0,1,0). Temaet vant, og
   filterpanelet ble grønt igjen.

   Jeg oppdaget det bare fordi kategori-riggen fikk temaets regel og
   `class="elementor-kit-9"` på body samtidig – før det kunne en negativ
   kontroll ikke feile, fordi det ikke fantes noen motstand å tape mot.

   :is() arver spesifisiteten til sitt mest spesifikke argument, så
   `.bnfilter :is(input[type="text"], …)` blir (0,2,1) og vinner.

   Søkepillene på forsiden og /finn-behandler/ er løftet tilsvarende
   (`.bnf.bnf .bnf-sok …`), slik at de fortsatt vinner over denne. Der
   SKAL feltene være gjennomsiktige inni én hvit pille.
   ============================================================= */

.bnf    :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="search"], input[type="number"], input[type="password"], input:not([type]), select, textarea),
.bnfinn :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="search"], input[type="number"], input[type="password"], input:not([type]), select, textarea),
.bnms   :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="search"], input[type="number"], input[type="password"], input:not([type]), select, textarea),
.bnbs   :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="search"], input[type="number"], input[type="password"], input:not([type]), select, textarea),
.bnfilter :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="search"], input[type="number"], input[type="password"], input:not([type]), select, textarea),
.bntm   :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="search"], input[type="number"], input[type="password"], input:not([type]), select, textarea),
.ptc-v2 :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="search"], input[type="number"], input[type="password"], input:not([type]), select, textarea){
  /*
   * `width` står IKKE her, og det er med vilje.
   *
   * Første utgave satte width:100%. Det er en layout-beslutning, ikke en
   * feltstil, og den hører til komponenten som vet hvor feltet står.
   * Resultatet var at `.bnms__felt--liste` på Min side – som ligger inne
   * med 51 piksler venstremarg – ble 100 % av en bredere forelder og
   * dyttet siden 51 piksler ut i det tomme på mobil.
   *
   * Komponentene som trenger full bredde, setter den selv. Denne regelen
   * bestemmer hvordan feltet SER UT, ikke hvor det ligger.
   */
  padding:12px 14px;
  /* 16px er ikke en smakssak: under 16px zoomer iOS Safari inn når
     feltet får fokus, og da hopper hele siden. */
  font:400 16px/1.35 var(--bnett-font-body, -apple-system, system-ui, sans-serif);
  color:#14241d;
  background:#ffffff !important;
  background-image:none !important;
  border:1.5px solid #dfe5e0 !important;
  border-radius:8px !important;
  box-shadow:none !important;
  appearance:none; -webkit-appearance:none;
  transition:border-color .12s ease, box-shadow .12s ease;
}

.bnf    :is(input, select, textarea):focus,
.bnfinn :is(input, select, textarea):focus,
.bnms   :is(input, select, textarea):focus,
.bnbs   :is(input, select, textarea):focus,
.bnfilter :is(input, select, textarea):focus,
.bntm   :is(input, select, textarea):focus,
.ptc-v2 :is(input, select, textarea):focus{
  outline:none;
  border-color:#388051 !important;
  box-shadow:0 0 0 3px rgba(56,128,81,.15) !important;
}

/* Nettleserens egen autofyll-farging nås ikke av `background`. Innvendig
   boksskygge er den ene veien rundt den, og har virket i ti år. */
.bnf    :is(input):-webkit-autofill,
.bnfinn :is(input):-webkit-autofill,
.bnms   :is(input):-webkit-autofill,
.bnbs   :is(input):-webkit-autofill,
.bnfilter :is(input):-webkit-autofill,
.bntm   :is(input):-webkit-autofill,
.ptc-v2 :is(input):-webkit-autofill{
  -webkit-box-shadow:0 0 0 60px #ffffff inset !important;
  box-shadow:0 0 0 60px #ffffff inset !important;
  -webkit-text-fill-color:#14241d !important;
}

/* Den ekte feilmarkeringen må vinne over alt annet. Et felt som mangler
   noe, er det eneste som skal ha farge – ellers betyr fargen ingenting. */
.bnf    :is(input, select, textarea).is-missing,
.bnms   :is(input, select, textarea).is-missing,
.bnbs   :is(input, select, textarea).is-missing,
.bntm   :is(input, select, textarea).is-missing,
.ptc-v2 :is(input, select, textarea).is-missing{
  border-color:#dc2626 !important;
  box-shadow:0 0 0 3px rgba(220,38,38,.12) !important;
}

/* Avkrysning og brytere skal IKKE ha feltstilen – de er ikke tekstfelt,
   og :where()-listen over utelater dem med vilje. Her settes bare
   merkefargen, så de følger resten av nettstedet. */
.bnf    :is(input[type="checkbox"], input[type="radio"], input[type="range"]),
.bnfinn :is(input[type="checkbox"], input[type="radio"], input[type="range"]),
.bnms   :is(input[type="checkbox"], input[type="radio"], input[type="range"]),
.bnbs   :is(input[type="checkbox"], input[type="radio"], input[type="range"]),
.bnfilter :is(input[type="checkbox"], input[type="radio"], input[type="range"]),
.bntm   :is(input[type="checkbox"], input[type="radio"], input[type="range"]),
.ptc-v2 :is(input[type="checkbox"], input[type="radio"], input[type="range"]){
  accent-color:#388051;
}