.skps{
	--skps-border:#e3e6eb;
	--skps-text:#111827;
	--skps-muted:#6b7280;
	--skps-accent:#078caf;
	position:relative;
	width:100%;
	font-family:inherit;
	z-index:40;
}

.skps__field{
	display:flex;
	align-items:center;
	width:100%;
	min-height:46px;
	background:#fff;
	border:1px solid var(--skps-border);
	border-radius:12px;
	transition:border-color .15s ease,box-shadow .15s ease;
	overflow:hidden;
}

.skps__field:focus-within{
	border-color:var(--skps-accent);
	box-shadow:0 0 0 3px rgba(7,140,175,.12);
}

.skps__icon{
	display:flex;
	align-items:center;
	justify-content:center;
	flex:0 0 auto;
	margin-left:14px;
	color:#7b8490;
	pointer-events:none;
}

.skps__input{
	-webkit-appearance:none;
	appearance:none;
	box-sizing:border-box;
	width:100%;
	min-width:0;
	height:44px;
	margin:0;
	padding:0 10px;
	border:0!important;
	outline:0!important;
	box-shadow:none!important;
	background:transparent!important;
	color:var(--skps-text);
	font:inherit;
	font-size:15px;
	line-height:1.2;
}

.skps__input::-webkit-search-cancel-button{
	-webkit-appearance:none;
	appearance:none;
	display:none;
}

.skps__input::placeholder{color:#8a949f;opacity:1}

.skps__clear{
	display:flex;
	align-items:center;
	justify-content:center;
	flex:0 0 42px;
	width:42px;
	height:42px;
	padding:0;
	margin:0 2px 0 0;
	border:0;
	border-radius:10px;
	background:transparent;
	color:#6b7280;
	cursor:pointer;
	touch-action:manipulation;
}

.skps__clear:hover,.skps__clear:focus-visible{
	background:#f3f4f6;
	color:#111827;
	outline:none;
}

.skps__clear[hidden]{display:none!important}

.skps__panel{
	position:absolute;
	top:calc(100% + 8px);
	left:0;
	right:0;
	max-height:min(520px,65vh);
	overflow:auto;
	overscroll-behavior:contain;
	-webkit-overflow-scrolling:touch;
	background:#fff;
	border:1px solid var(--skps-border);
	border-radius:14px;
	box-shadow:0 18px 45px rgba(17,24,39,.14);
	padding:7px;
	z-index:300;
}

.skps__panel[hidden]{display:none!important}

.skps__result{
	display:grid;
	grid-template-columns:54px minmax(0,1fr) auto;
	gap:12px;
	align-items:center;
	min-height:68px;
	padding:8px;
	border-radius:10px;
	color:var(--skps-text)!important;
	text-decoration:none!important;
	-webkit-tap-highlight-color:transparent;
	touch-action:manipulation;
}

.skps__result--no-image{grid-template-columns:minmax(0,1fr) auto}

.skps__result:hover,.skps__result:focus-visible,.skps__result.is-active{
	background:#f5f7f9;
	outline:none;
}

.skps__thumb{
	display:block;
	width:54px;
	height:54px;
	border-radius:8px;
	object-fit:contain;
	background:#f7f8fa;
}

.skps__body{display:flex;flex-direction:column;min-width:0;gap:4px}

.skps__name{
	display:block;
	overflow:hidden;
	color:var(--skps-text);
	font-size:14px;
	font-weight:650;
	line-height:1.3;
	text-overflow:ellipsis;
	white-space:nowrap;
}

.skps__meta{
	display:flex;
	align-items:center;
	flex-wrap:wrap;
	gap:5px;
	color:var(--skps-muted);
	font-size:12px;
	line-height:1.3;
}

.skps__dot{color:#b1b7bf}

.skps__price{
	color:var(--skps-text);
	font-size:13px;
	font-weight:700;
	white-space:nowrap;
	text-align:right;
}

.skps__price del{display:none}
.skps__price ins{text-decoration:none}

.skps__all-results{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:12px;
	margin-top:6px;
	padding:12px 13px;
	border-top:1px solid #edf0f2;
	border-radius:0 0 9px 9px;
	color:var(--skps-accent)!important;
	font-size:13px;
	font-weight:700;
	text-decoration:none!important;
	touch-action:manipulation;
}

.skps__all-results:hover,
.skps__all-results:focus-visible{
	background:#f5f7f9;
	outline:none;
}

.skps__message{
	padding:18px 14px;
	color:var(--skps-muted);
	font-size:14px;
	text-align:center;
}

.skps--header{
	display:flex;
	align-items:center;
	height:44px;
	margin:0!important;
	padding:0!important;
	line-height:normal;
}

.skps--header .skps__field{
	height:44px!important;
	min-height:44px!important;
	max-height:44px!important;
	margin:0!important;
	padding:0!important;
	border-radius:10px;
	box-sizing:border-box;
}

.skps--header .skps__icon{
	margin-left:13px;
	line-height:0;
}

.skps--header .skps__icon svg{
	display:block;
	width:18px;
	height:18px;
}

.skps--header .skps__input{
	height:42px!important;
	min-height:0!important;
	max-height:42px!important;
	margin:0!important;
	padding:2px 10px 0!important;
	font-size:14px;
	line-height:20px!important;
	box-sizing:border-box;
}

.skps--header .skps__clear{
	height:38px!important;
	min-height:38px!important;
	width:38px;
	flex-basis:38px;
	margin:0 2px 0 0!important;
	padding:0!important;
}

.skps--large .skps__field{min-height:56px;border-radius:14px}
.skps--large .skps__input{height:54px;font-size:17px;padding-left:12px}
.skps--large .skps__icon{margin-left:18px}
.skps--large .skps__clear{height:50px;width:50px;flex-basis:50px}

@media(max-width:767px){
	.skps__field{min-height:48px;border-radius:11px}
	.skps__input{height:46px;font-size:16px}
	.skps__clear{flex-basis:46px;width:46px;height:46px}
	.skps__panel{top:calc(100% + 6px);max-height:min(62vh,480px);border-radius:12px}
	.skps__result{grid-template-columns:50px minmax(0,1fr);gap:10px;min-height:66px;padding:8px}
	.skps__result--no-image{grid-template-columns:minmax(0,1fr)}
	.skps__thumb{width:50px;height:50px}
	.skps__price{grid-column:2;text-align:left;margin-top:-2px}
	.skps__result--no-image .skps__price{grid-column:1}
	.skps__name{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}

	.skps--header{height:46px}
	.skps--header .skps__field{height:46px!important;min-height:46px!important;max-height:46px!important}
	.skps--header .skps__input{height:44px!important;max-height:44px!important;padding:2px 10px 0!important;font-size:16px;line-height:22px!important}
	.skps--header .skps__clear{height:42px!important;min-height:42px!important;width:42px;flex-basis:42px}
}

/* =========================================================
   v2.0.9 - The7 / microheader / mobilmenu kompatibilitet
   ========================================================= */

/*
 * The7 tekst-widgets kan køre wpautop på shortcode-output og dermed lægge
 * ekstra <p>-elementer omkring input og knapper. Neutralisér dem, så
 * flex-centeringen bliver ens på desktop og mobil.
 */
.skps > p,
.skps__field > p{
	margin:0!important;
	padding:0!important;
	border:0!important;
	line-height:0!important;
}

.skps__field > p:has(.skps__input){
	display:flex!important;
	align-items:center!important;
	flex:1 1 auto!important;
	min-width:0!important;
	height:100%!important;
}

.skps__field > p:has(.skps__clear){
	display:flex!important;
	align-items:center!important;
	justify-content:center!important;
	flex:0 0 auto!important;
	height:100%!important;
}

/* Fallback for browsere uden :has(). */
.skps__field > p{
	align-self:stretch;
}

.skps__field > p .skps__input{
	display:block!important;
}

.skps--header .skps__field{
	display:flex!important;
	align-items:center!important;
}

.skps--header .skps__icon{
	align-self:center!important;
}

.skps--header .skps__input{
	display:block!important;
	height:100%!important;
	min-height:0!important;
	max-height:none!important;
	margin:0!important;
	padding:0 10px!important;
	line-height:normal!important;
	vertical-align:middle!important;
}

/*
 * Resultatpanelet må ikke kunne lægge desktop/microheader-søgningen oven på
 * The7's mobile off-canvas-menu. Selve mobilmenuen har sit eget højere lag.
 */
.skps{
	isolation:isolate;
}

/*
 * Når JS flytter resultatlisten ud i <body> inde fra The7 mobilmenuen,
 * bruges fixed-positionering for at undgå overflow/clip i off-canvas-panelet.
 */
.skps__panel.skps__panel--portal{
	position:fixed!important;
	right:auto!important;
	margin:0!important;
	z-index:2147483000!important;
	box-sizing:border-box!important;
}

/* Men når The7-menuen ligger ovenpå resten af siden, skal almindelige
   header-søgefelter ikke kunne trænge igennem panelet. */
@media(max-width:1024px){
	body .skps{
		z-index:20;
	}
	body .dt-mobile-header{
		z-index:10000;
	}
}


/* v2.0.10 - Flyt header-preset 10px op på desktop */
@media (min-width:1025px){
	.skps--header{
		position:relative;
		top:-10px;
	}
}


/* =========================================================
   v2.0.11 - Søgning øverst i The7 mobilmenu
   ========================================================= */
.dt-mobile-header > .skps-mobile-top-slot{
	box-sizing:border-box;
	width:100%;
	padding:52px 16px 12px;
}

.dt-mobile-header > .skps-mobile-top-slot .skps--header{
	position:relative!important;
	top:auto!important;
	width:100%!important;
	max-width:none!important;
	margin:0!important;
}

.dt-mobile-header > .skps-mobile-top-slot .skps__field{
	width:100%!important;
}

@media(min-width:1025px){
	.skps-mobile-top-slot{
		display:none!important;
	}
}


/* =========================================================
   v2.0.12 - Header-søgning under logo-rækken på mobil
   ========================================================= */

.dt-mobile-header .skps-mobile-below-header-slot{
	box-sizing:border-box;
	width:100%;
	flex:0 0 100%;
	padding:10px 16px 12px;
	background:inherit;
}

.dt-mobile-header .skps-mobile-below-header-slot .skps--header{
	position:relative!important;
	top:auto!important;
	left:auto!important;
	right:auto!important;
	width:100%!important;
	max-width:none!important;
	margin:0!important;
}

.dt-mobile-header .skps-mobile-below-header-slot .skps__field{
	width:100%!important;
	max-width:none!important;
}

.dt-mobile-header .skps-mobile-below-header-slot .skps__input{
	width:100%!important;
}

/* Den gamle burger-top slot bruges kun når den valgte backend-indstilling er aktiv. */
.dt-mobile-header > .skps-mobile-top-slot:empty,
.dt-mobile-header .skps-mobile-below-header-slot:empty{
	display:none!important;
}

@media(min-width:1025px){
	.skps-mobile-below-header-slot{
		display:none!important;
	}
}


/* =========================================================
   v2.0.13 - Korrekt placering under The7's synlige header
   ========================================================= */

/*
 * The7 bruger .dt-mobile-header til selve off-canvas burger-menuen.
 * Den synlige logo/kurv/burger-række er stadig .masthead .header-bar.
 * Derfor ligger full-width søgefeltet nu som en separat række direkte
 * efter .header-bar.
 */
.masthead > .skps-mobile-below-header-slot{
	box-sizing:border-box;
	width:100%;
	flex:0 0 100%;
	padding:10px 16px 12px;
	background:#fff;
	border-top:1px solid #e3e6eb;
}

.masthead > .skps-mobile-below-header-slot .skps--header{
	position:relative!important;
	top:auto!important;
	left:auto!important;
	right:auto!important;
	width:100%!important;
	max-width:none!important;
	margin:0!important;
}

.masthead > .skps-mobile-below-header-slot .skps__field{
	width:100%!important;
	max-width:none!important;
}

.masthead > .skps-mobile-below-header-slot .skps__input{
	width:100%!important;
}

.masthead > .skps-mobile-below-header-slot:empty{
	display:none!important;
}

/* Den tidligere v2.0.12-slot inde i burger-panelet må ikke bruges. */
.dt-mobile-header .skps-mobile-below-header-slot{
	display:none!important;
}

/* Kun tablet/mobil. Desktop beholder den normale headerplacering. */
@media(min-width:1251px){
	.masthead > .skps-mobile-below-header-slot{
		display:none!important;
	}
}


/* =========================================================
   v2.0.14 - Placér søgefeltet EFTER logo/kurv/burger-rækken
   ========================================================= */
.masthead .skps-mobile-below-header-slot{
	box-sizing:border-box;
	width:100%;
	flex:0 0 100%;
	padding:10px 16px 12px;
	background:#fff;
	border-top:1px solid #e3e6eb;
	order:999;
}

.masthead .mobile-header-bar + .skps-mobile-below-header-slot{
	display:block!important;
}

.masthead .skps-mobile-below-header-slot .skps--header,
.masthead .skps-mobile-below-header-slot .skps__field{
	width:100%!important;
	max-width:none!important;
	margin:0!important;
	top:auto!important;
}

@media(min-width:1251px){
	.masthead .skps-mobile-below-header-slot{
		display:none!important;
	}
}


/* =========================================================
   v2.0.15 - Automatisk tablet/desktop placering
   ========================================================= */

/* Tablet/mobil følger den valgte mobile placering. */
@media(max-width:1250px){
	.masthead .skps-mobile-below-header-slot{
		display:block;
	}
}

/* Desktop/PC: slots må ikke optage plads; JS flytter søgningen tilbage
   til den oprindelige shortcode-position. */
@media(min-width:1251px){
	.skps-mobile-top-slot,
	.skps-mobile-below-header-slot{
		display:none!important;
		height:0!important;
		min-height:0!important;
		margin:0!important;
		padding:0!important;
		border:0!important;
		overflow:hidden!important;
	}
}