/* Kodelig Markedsføring – samtykkebanner og påmeldingsknapp.
   Temaet setter fargene og skriften med variablene under. */
:root {
	--kmf-bakgrunn: #12131a;
	--kmf-flate: #1d1f2b;
	--kmf-tekst: #f4f4f2;
	--kmf-dempet: #b9bcc8;
	--kmf-aksent: #c65a28;
	--kmf-aksent-tekst: #fff;
	--kmf-kant: rgba(255, 255, 255, .16);
	--kmf-fokus: #00b1be;
	--kmf-skrift: inherit;
	--kmf-tittelskrift: inherit;
	--kmf-radius: 6px;
	--kmf-knapp-form: none; /* f.eks. clip-path for skrå kanter */
	--kmf-z: 9990;
}

.kmf-banner[hidden], .kmf-nyhetsbrev__panel[hidden], .kmf-banner [hidden] { display: none !important; }

.kmf-banner, .kmf-nyhetsbrev { font-family: var(--kmf-skrift); color: var(--kmf-tekst); line-height: 1.5; box-sizing: border-box; }
.kmf-banner *, .kmf-nyhetsbrev * { box-sizing: border-box; }
.kmf-banner :focus-visible, .kmf-nyhetsbrev :focus-visible { outline: 2px solid var(--kmf-fokus); outline-offset: 2px; }
.kmf-banner a, .kmf-nyhetsbrev a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }

.kmf-knapp {
	appearance: none; border: 0; cursor: pointer; font: inherit; font-weight: 700; letter-spacing: .02em;
	background: var(--kmf-aksent); color: var(--kmf-aksent-tekst); padding: .7rem 1.25rem; border-radius: var(--kmf-radius);
	clip-path: var(--kmf-knapp-form); transition: filter .15s ease;
}
.kmf-knapp:hover { filter: brightness(1.1); }
.kmf-knapp:disabled { opacity: .6; cursor: default; }
.kmf-banner [data-kmf-handling="lagre"] { background: transparent; color: var(--kmf-tekst); box-shadow: inset 0 0 0 2px var(--kmf-tekst); }
.kmf-knapp--lenke { background: transparent; color: var(--kmf-tekst); text-decoration: underline; text-underline-offset: 3px; padding-inline: .5rem; clip-path: none; }

/* ---------- Banneret ---------- */
.kmf-banner {
	/* Nede til høyre på PC (heltekst står som regel til venstre), hele bredden på mobil. */
	position: fixed; z-index: var(--kmf-z); right: 16px; bottom: 16px; width: min(640px, calc(100vw - 32px));
	max-height: calc(100vh - 32px); overflow: auto; overscroll-behavior: contain;
	background: var(--kmf-bakgrunn); border: 1px solid var(--kmf-kant); border-radius: var(--kmf-radius);
	box-shadow: 0 18px 50px rgba(0, 0, 0, .45);
}
.kmf-banner__indre { position: relative; padding: 1.25rem 1.4rem 1.2rem; }
.kmf-banner__tittel { font-family: var(--kmf-tittelskrift); font-size: 1.25rem; line-height: 1.2; margin: 0 2rem .5rem 0; color: var(--kmf-tekst); }
.kmf-banner__tekst { margin: 0 0 1rem; font-size: .95rem; color: var(--kmf-dempet); }
.kmf-banner__knapper { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.kmf-banner__knapper .kmf-knapp:not(.kmf-knapp--lenke) { flex: 1 1 0; white-space: nowrap; }
.kmf-banner__lukk { position: absolute; top: .6rem; right: .7rem; background: none; border: 0; color: var(--kmf-dempet); font-size: 1.6rem; line-height: 1; cursor: pointer; padding: .2rem .45rem; }

.kmf-banner__valg { display: grid; gap: .6rem; margin: 0 0 1rem; }
.kmf-kategori { background: var(--kmf-flate); border-radius: var(--kmf-radius); padding: .75rem .9rem; }
.kmf-kategori__bryter { display: flex; gap: .6rem; align-items: center; font-weight: 700; cursor: pointer; }
.kmf-kategori__bryter input { width: 1.15rem; height: 1.15rem; accent-color: var(--kmf-aksent); margin: 0; }
.kmf-kategori__alltid { font-weight: 400; color: var(--kmf-dempet); font-size: .85rem; }
.kmf-kategori__om { margin: .3rem 0 0 1.75rem; font-size: .88rem; color: var(--kmf-dempet); }
.kmf-kategori__detaljer { margin: .4rem 0 0 1.75rem; font-size: .82rem; }
.kmf-kategori__detaljer summary { cursor: pointer; color: var(--kmf-dempet); }
.kmf-kategori__detaljer table { width: 100%; border-collapse: collapse; margin-top: .4rem; }
.kmf-kategori__detaljer th, .kmf-kategori__detaljer td { text-align: left; vertical-align: top; padding: .3rem .4rem .3rem 0; border-top: 1px solid var(--kmf-kant); }
.kmf-kategori__detaljer th { font-weight: 700; }

@media (max-width: 600px) {
	.kmf-banner { left: 0; right: 0; bottom: 0; width: 100%; border-radius: var(--kmf-radius) var(--kmf-radius) 0 0; border-width: 1px 0 0; max-height: 85vh; }
	.kmf-banner__indre { padding: 1rem 1rem 1.1rem; }
	.kmf-banner__knapper .kmf-knapp:not(.kmf-knapp--lenke) { flex: 1 1 100%; }
	.kmf-kategori__detaljer td:nth-child(2) { min-width: 9rem; }
}

/* ---------- Påmeldingsknappen ---------- */
.kmf-nyhetsbrev { position: fixed; z-index: calc(var(--kmf-z) - 1); right: 16px; bottom: 16px; transform-origin: 100% 100%; transition: translate .35s ease, scale .35s ease; }
/* Helt nederst på siden: knappen løftes litt og blir 50 % større (ikke når panelet er åpent). */
.kmf-nyhetsbrev.er-nederst:not(.er-apen) { translate: 0 calc(-1 * var(--kmf-nederst-loft, 2.5rem)); scale: var(--kmf-nederst-skala, 1.5); } /* temaet kan løfte mer */
/* Skjult mens banneret eller en mobilmeny (Navigation-blokken: html.has-modal-open) er åpen. */
html.kmf-banner-apen .kmf-nyhetsbrev, html.has-modal-open .kmf-nyhetsbrev { display: none; }
.kmf-nyhetsbrev__knapp {
	display: inline-flex; align-items: center; gap: .6rem; cursor: pointer; font: inherit; font-weight: 700; font-size: 1.1rem;
	background: var(--kmf-bakgrunn); color: var(--kmf-tekst); border: 1px solid var(--kmf-kant); border-radius: 999px;
	padding: .85rem 1.4rem .85rem 1.15rem; box-shadow: 0 10px 28px rgba(0, 0, 0, .4); transition: transform .15s ease, border-color .15s ease;
	/* Vrikker kort hvert sjuende sekund (først etter tre sekunder); stopper når panelet er åpent eller pekeren er over. */
	animation: kmf-vrikk 7s ease-in-out 3s infinite;
	transform-origin: 50% 100%;
}
.kmf-nyhetsbrev__knapp:hover { border-color: var(--kmf-aksent); transform: translateY(-1px); }
.kmf-nyhetsbrev__knapp:hover, .kmf-nyhetsbrev__knapp:focus-visible, .kmf-nyhetsbrev.er-apen .kmf-nyhetsbrev__knapp { animation: none; }
.kmf-nyhetsbrev__knapp svg { width: 1.45rem; height: 1.45rem; color: var(--kmf-aksent); }
.kmf-nyhetsbrev.er-apen .kmf-nyhetsbrev__knapp { border-color: var(--kmf-aksent); }
/* Egen rotate-egenskap, så vrikkingen ikke kolliderer med transform ved hover. */
@keyframes kmf-vrikk {
	0%, 12%, 100% { rotate: 0deg; }
	2% { rotate: -7deg; }
	4% { rotate: 6deg; }
	6% { rotate: -5deg; }
	8% { rotate: 3deg; }
	10% { rotate: -1deg; }
}

.kmf-nyhetsbrev__panel {
	position: absolute; right: 0; bottom: calc(100% + 10px); width: min(360px, calc(100vw - 32px));
	background: var(--kmf-bakgrunn); border: 1px solid var(--kmf-kant); border-radius: var(--kmf-radius);
	box-shadow: 0 18px 50px rgba(0, 0, 0, .45); padding: 1.15rem 1.2rem 1.1rem;
}
.kmf-nyhetsbrev__lukk { position: absolute; top: .5rem; right: .6rem; background: none; border: 0; color: var(--kmf-dempet); font-size: 1.5rem; line-height: 1; cursor: pointer; padding: .2rem .4rem; }
.kmf-nyhetsbrev__tittel { font-family: var(--kmf-tittelskrift); font-size: 1.2rem; line-height: 1.2; margin: 0 1.8rem .35rem 0; color: var(--kmf-tekst); }
.kmf-nyhetsbrev__ingress { margin: 0 0 .8rem; font-size: .92rem; color: var(--kmf-dempet); }
.kmf-nyhetsbrev__etikett { display: block; font-size: .85rem; font-weight: 700; margin-bottom: .3rem; }
.kmf-nyhetsbrev__felt {
	width: 100%; font: inherit; font-size: 1rem; padding: .65rem .75rem; margin-bottom: .7rem;
	background: var(--kmf-flate); color: var(--kmf-tekst); border: 1px solid var(--kmf-kant); border-radius: var(--kmf-radius);
}
.kmf-nyhetsbrev__samtykke { font-size: .8rem; color: var(--kmf-dempet); margin: 0 0 .8rem; }
.kmf-nyhetsbrev__skjema .kmf-knapp { width: 100%; }
.kmf-nyhetsbrev__svar { margin: .6rem 0 0; font-size: .9rem; min-height: 1.2em; }
.kmf-nyhetsbrev__svar:empty { display: none; }
.kmf-nyhetsbrev__svar.er-ok { color: var(--kmf-tekst); }
.kmf-nyhetsbrev__svar.er-feil { color: #ffb4a0; }
.kmf-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

@media (max-width: 600px) {
	.kmf-nyhetsbrev { right: 12px; bottom: 12px; }
	.kmf-nyhetsbrev__panel { position: fixed; left: 0; right: 0; bottom: 0; width: 100%; border-radius: var(--kmf-radius) var(--kmf-radius) 0 0; border-width: 1px 0 0; }
}

@media (prefers-reduced-motion: reduce) {
	.kmf-knapp, .kmf-nyhetsbrev__knapp { transition: none; }
	.kmf-nyhetsbrev__knapp { animation: none; }
	.kmf-nyhetsbrev { transition: none; }
	.kmf-nyhetsbrev__knapp:hover { transform: none; }
}

/* ---------- Kassen ---------- */
.kmf-kasse { margin: 1rem 0; font-size: .92rem; }
.kmf-kasse label { display: flex !important; gap: .55rem; align-items: flex-start; }
.kmf-kasse input[type="checkbox"] { margin-top: .25rem; flex: 0 0 auto; }