/* Aktørkort — sammenligningsblokk. Oppdatert 25.09.2026. */
/* Filterlinje (vises bare naar JavaScript er paa) */
.kgn-filter{margin:0 0 16px}
.kgn-filter-rad{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding:12px 14px;background:#f6f7f8;border:1px solid var(--k-line);border-radius:12px}
.kgn-filter-rad+.kgn-filter-rad{margin-top:8px}
.kgn-filter-merknad{margin:8px 4px 0;font-size:12px;line-height:1.4;color:#6b7280;text-align:center}
.kgn-filter-gruppe{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.kgn-filter-etikett{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#000}
.kgn-chip{cursor:pointer;font-family:inherit;font-size:13px;font-weight:600;color:#3a4149;background:#fff;border:1px solid var(--k-line2);border-radius:20px;padding:6px 12px;line-height:1.2}
.kgn-chip:hover{border-color:#9aa3ac}
.kgn-chip[aria-pressed="true"]{background:var(--k-acc);border-color:var(--k-acc);color:var(--k-acc-ink)}
.kgn-filter-teller{margin-left:auto;font-size:12px;color:var(--k-muted)}
.kgn-nullstill{cursor:pointer;font-family:inherit;font-size:13px;font-weight:600;color:#0f8f5f;background:none;border:0;padding:6px 4px;text-decoration:underline}
.kgn-tomt{margin:10px 0 0;font-size:14px;color:#3a4149}
@media(max-width:600px){.kgn-filter-teller{margin-left:0;width:100%}}

.kgn-liste{--k-ink:#000;--k-muted:#6b7480;--k-line:#e6e9ec;--k-line2:#d6dbe0;--k-surf:#fff;--k-tilbud:#eaf1fb;--k-acc:#fbcb2a;--k-acc-ink:#111418;--k-nr:#111418;display:flex;flex-direction:column;gap:22px;margin:26px 0;color:var(--k-ink)}
.kgn-kort{position:relative;overflow:visible;background:var(--k-surf);border:1px solid var(--k-line);border-radius:14px;padding:22px 22px 12px;box-shadow:0 4px 14px rgba(11,76,155,.22);color:var(--k-ink)}
.kgn-nr{position:absolute;top:50%;left:-14px;transform:translateY(-50%);width:28px;height:28px;border-radius:6px;display:grid;place-items:center;background:var(--k-nr);color:#fff;font-size:14px;font-weight:700;font-variant-numeric:tabular-nums}
.kgn-merke{position:absolute;top:0;right:0;box-sizing:border-box;min-width:182px;height:22px;display:inline-flex;align-items:center;justify-content:center;padding:0 12px 0 34px;background:var(--k-merke,#0b4c9b);color:#fff;font-size:11px;font-weight:700;line-height:1;text-align:center;text-transform:uppercase;letter-spacing:.04em;border-radius:0 13px 0 0;clip-path:polygon(0 0,100% 0,100% 100%,0 100%,22px 50%)}

.kgn-topp{display:grid;grid-template-columns:116px minmax(120px,150px) minmax(0,1fr) 330px 238px;gap:18px;align-items:center}

.kgn-logo{width:106px;height:106px;margin-left:10px;display:grid;place-items:center;background:transparent;border:0;padding:0}
.kgn-logo img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}

.kgn-ident{display:flex;flex-direction:column;gap:8px;align-items:center;text-align:center;padding-left:18px}
.kgn-navn{font-weight:700;font-size:1rem;line-height:1.2;color:var(--k-ink)}

/* Vurdering: stjernestripe, samme prinsipp som nichetable (graa bunn, gull over, klippet etter poeng) */
.kgn-vurdering{display:flex;flex-direction:column;align-items:center;gap:4px;width:80px}
.kgn-stjerner{position:relative;display:block;width:80px;height:16px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23dddddd' d='M8 1.4l1.9 4 4.4.6-3.2 3.1.8 4.4L8 11.4l-3.9 2.1.8-4.4L1.7 6l4.4-.6z'/%3E%3C/svg%3E");background-size:16px 16px;background-repeat:repeat-x;background-position:left center}
.kgn-stjerner-fyll{position:absolute;top:0;left:0;height:16px;overflow:hidden;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23ffc900' d='M8 1.4l1.9 4 4.4.6-3.2 3.1.8 4.4L8 11.4l-3.9 2.1.8-4.4L1.7 6l4.4-.6z'/%3E%3C/svg%3E");background-size:16px 16px;background-repeat:repeat-x;background-position:left center}
.kgn-vurdering-tall{text-align:center;font-weight:700;font-size:14px;line-height:1;font-variant-numeric:tabular-nums;color:var(--k-ink)}
.kgn-vurdering-etikett{display:block;font-size:10px;font-weight:600;line-height:1.2;margin-bottom:2px;color:var(--k-muted);letter-spacing:.2px}

.kgn-liste ul.kgn-punkter{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:5px}
.kgn-aktorkort .kgn-liste ul.kgn-punkter li{display:flex;align-items:baseline;gap:8px;position:static;margin:0;padding:0;font-size:15px;line-height:1.9;list-style:none;color:var(--k-ink)}
.kgn-liste ul.kgn-punkter li:before{content:"\2714";position:static;flex:0 0 auto;width:auto;height:auto;background:none;border:0;border-radius:0;transform:none;color:#8a9199;font-size:11px;line-height:1.3}

.kgn-tilbud{background:var(--k-tilbud);border-radius:12px;padding:14px 16px}
.kgn-tilbud-tittel{font-weight:800;font-size:20px;line-height:1.25;letter-spacing:-.2px;color:var(--k-ink)}
.kgn-tilbud-under{font-weight:500;font-size:16px;line-height:1.3;margin-top:4px;color:#5a636d}

.kgn-handling{position:relative;display:flex;flex-direction:column;justify-content:center}
.kgn-knapp{display:flex;align-items:center;justify-content:center;gap:9px;text-align:center;background:linear-gradient(180deg,#fdd757 0%,#f6b71a 100%);color:var(--k-acc-ink);text-decoration:none;font-weight:700;font-size:18px;padding:12px 21px;border-radius:10px;box-shadow:0 4px 12px rgba(0,0,0,.2)}
.kgn-knapp:hover{filter:brightness(1.06);color:var(--k-acc-ink)}
.kgn-knapp .kgn-chevron{font-size:16px;line-height:1}
.kgn-knapp .kgn-chevron:before{content:"\276F"}
.kgn-annonse{position:absolute;top:100%;left:0;right:0;margin-top:6px;font-size:11px;line-height:1.3;color:var(--k-muted);text-align:center}

.kgn-detaljer{margin-top:2px}
.kgn-detaljer summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:flex-start;gap:8px;font-weight:600;font-size:14px;line-height:1.2;color:#5a636d;padding:2px 0 2px 10px}
.kgn-detaljer summary::-webkit-details-marker{display:none}
.kgn-detaljer summary:before{content:"";flex:0 0 auto;width:8px;height:8px;border-right:2.5px solid currentColor;border-bottom:2.5px solid currentColor;transform:rotate(45deg);position:relative;top:-3px}
.kgn-detaljer[open] summary:before{transform:rotate(-135deg);top:2px}

.kgn-bokser{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:14px 0 8px}
.kgn-boks{background:#fbfcfc;border:1px solid #f0f2f3;border-radius:10px;padding:16px 18px;text-align:center;color:#3a4149}
.kgn-boks-tittel{font-weight:700;font-size:18px;color:#000;margin-bottom:9px}
.kgn-linjer{display:block;text-align:center}
.kgn-linje{font-size:15px;line-height:1.5;color:#3a4149}
.kgn-linje-etikett{color:#3a4149}
.kgn-boks-lenke{margin-top:12px}
.kgn-boks-lenke a{color:#0f8f5f;font-weight:600;font-size:16px;text-decoration:none}
.kgn-boks-lenke a:after{content:" \2192"}
.kgn-boks-lenke a:hover{text-decoration:underline}
.kgn-bet-gruppe{display:flex;align-items:center;gap:10px;text-align:left}
.kgn-bet-gruppe+.kgn-bet-gruppe{margin-top:18px}
.kgn-bet-tittel{flex:0 0 auto;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#000;white-space:nowrap}
.kgn-bet-logoer{flex:1 1 auto;min-width:0;display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-start;gap:8px;margin-top:0;overflow-x:auto;scrollbar-width:thin;padding-bottom:2px}
.kgn-bet-logoer img{flex:0 0 auto;max-height:22px;width:auto;height:auto;object-fit:contain;filter:grayscale(1) contrast(.9);opacity:.85}
.kgn-bet-merke{flex:0 0 auto;white-space:nowrap;font-size:14px;font-weight:600;color:#3a4149;background:#fff;border:1px solid var(--k-line2);border-radius:4px;padding:2px 7px}
.kgn-bet-mer{flex:0 0 auto;white-space:nowrap;font-size:14px;color:var(--k-muted)}

@media(max-width:1000px){
.kgn-topp{grid-template-columns:96px minmax(0,1fr);grid-template-areas:"logo ident" "punkter punkter" "tilbud tilbud" "handling handling";gap:16px}
.kgn-logo{grid-area:logo;width:92px;height:92px;margin-left:0}
.kgn-ident{grid-area:ident;padding-left:0}
.kgn-liste ul.kgn-punkter{grid-area:punkter}
.kgn-tilbud{grid-area:tilbud}
.kgn-handling{grid-area:handling}
.kgn-bokser{grid-template-columns:1fr;gap:12px}

}
@media(max-width:480px){

.kgn-kort{padding:18px 16px 10px}
}

/* Billett/klippekort rundt bonusen */
.kgn-tilbud{position:relative;background:#fbf7f2;border:1px solid #ece2d6;border-radius:12px;padding:14px 22px;box-shadow:0 2px 8px rgba(17,20,24,.10);text-align:center}
/* Hullet fylles med sidebakgrunnen. Bare buen som vender inn mot billetten
   tegnes — det er klippekanten. Ytterhalvdelen staar uten strek. */
.kgn-tilbud:before,
.kgn-tilbud:after{content:"";position:absolute;top:50%;width:16px;height:16px;border-radius:50%;background:var(--k-surf);border:1px solid transparent;box-sizing:border-box;z-index:1}
.kgn-tilbud:before{left:-8px;border-right-color:#c4ae96;border-bottom-color:#c4ae96;transform:translateY(-50%) rotate(-45deg)}
.kgn-tilbud:after{right:-8px;border-left-color:#c4ae96;border-top-color:#c4ae96;transform:translateY(-50%) rotate(-45deg)}

/* Billetten fyller ikke kolonnen: 80 % bredde, sentrert. Da blir avstanden
   til punktene og til knappen lik, uten aa flytte kolonnegrensen. */
@media(min-width:1001px){
.kgn-tilbud{width:80%;justify-self:center}
/* Dempet litt paa desktop: beloepet var for dominerende ved siden av knappen. */
.kgn-tilbud-tittel{font-weight:700;font-size:19px;color:#1c232b}
}

/* ---------------------------------------------------------------------------
   Mobil: egne tekststorrelser. Desktop-storrelsene er dimensjonert for et
   1237px bredt kort og leser for smatt pa ~390px. Lagt til 27.09.2026.
   --------------------------------------------------------------------------- */
@media(max-width:1000px){
.kgn-filter-etikett{font-size:13px}
.kgn-chip,.kgn-nullstill{font-size:14px}
.kgn-nr{font-size:15px}
.kgn-merke{font-size:12px}
.kgn-navn{font-size:18px}
.kgn-vurdering-tall{font-size:15px}
.kgn-aktorkort .kgn-liste ul.kgn-punkter li{font-size:16px;line-height:1.45}
.kgn-liste ul.kgn-punkter li:before{font-size:12px}
.kgn-liste ul.kgn-punkter{gap:9px}
.kgn-tilbud-tittel{font-size:20px}
.kgn-tilbud-under{font-size:15px}
.kgn-knapp{font-size:19px;padding:15px 21px}
.kgn-knapp .kgn-chevron{display:none}
.kgn-detaljer{margin-top:16px}
/* Annonsemerkingen over knappen, ikke under. */
.kgn-handling{position:static}
.kgn-annonse{position:static;order:-1;margin:0 0 7px;font-size:12px;text-align:center}
/* «Flere detaljer» sentrert under knappen, litt stoerre og moerkere. */
.kgn-detaljer{text-align:center}
.kgn-detaljer summary{justify-content:center;padding-left:0;font-size:16px;color:#3a4149}
.kgn-boks-tittel{font-size:17px}
/* Linjene i boksene som punktliste med smaa graa prikker. */
.kgn-linjer{text-align:left;display:inline-block}
.kgn-linje{font-size:16px;position:relative;padding-left:17px}
.kgn-linje:before{content:"";position:absolute;left:0;top:.62em;width:5px;height:5px;border-radius:50%;background:#b6bdc5}
.kgn-boks-lenke a{font-size:16px}
.kgn-bet-tittel{font-size:12px}
.kgn-bet-merke,.kgn-bet-mer{font-size:14px}
}

/* Bonuskode-brikke under knappen. Groent fordi koden er en del av tilbudet
   (verdi/handling); stiplet kant saa den ikke leses som en knapp nr. 2.
   Lars 08.10.2026. */
.kgn-kode{margin-top:9px;text-align:center}
.kgn-kode-knapp{display:inline-flex;align-items:center;gap:7px;cursor:pointer;background:#fff;border:1px dashed #c3cad2;border-radius:8px;padding:6px 12px;font:600 14px/1 inherit;color:#3d444c}
.kgn-kode-knapp:hover{border-color:#17795C;background:#f6fbf9}
.kgn-kode-etikett{font-weight:600;color:#1c232b} /* 08.10: var #6b7480/500 — for lys til aa lese (Lars). Samme sort som bonusbeloepet */
.kgn-kode-verdi{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:700;letter-spacing:.06em;color:#17795C}
.kgn-kode-ikon{font-size:14px;color:#8a9199}
.kgn-kode-kvittering[hidden]{display:none}
.kgn-kode-kvittering{display:inline-block;margin-left:8px;font:600 13px/1 inherit;color:#17795C}
