/* sp-tema – stil for savepalestine.no. Farger og fonter fra WoodMart-oppsettet (lest 3.11):
   primær rgb(14,98,59), titler Urbanist 700, tekst Work Sans 15px, bredde 1400px, knapper med radius 35px. */
:root {
	--sp-primar: rgb(14, 98, 59);
	--sp-primar-mork: rgb(10, 74, 44);
	--sp-lys: rgb(224, 234, 240);
	--sp-tekst: #333;
	--sp-tekst-svak: #767676;
	--sp-tittel: #242424;
	--sp-linje: #e2e2e2;
	--sp-bakgrunn: #fff;
	--sp-radius: 10px;
	--sp-knapp-radius: 35px;
	--sp-bredde: 1400px;
	--sp-font-tittel: "Urbanist", Arial, Helvetica, sans-serif;
	--sp-font-tekst: "Work Sans", Arial, Helvetica, sans-serif;
}
body { font-family: var(--sp-font-tekst); font-size: 15px; color: var(--sp-tekst); background: var(--sp-bakgrunn); }
h1, h2, h3, h4, .sp-karusell__tittel, .woocommerce-loop-product__title, .product_title { font-family: var(--sp-font-tittel); font-weight: 700; color: var(--sp-tittel); }
a { color: var(--sp-primar); }
a:hover, a:focus { color: var(--sp-primar-mork); }
:focus-visible { outline: 2px solid var(--sp-primar); outline-offset: 2px; }
.sp-bredde { max-width: var(--sp-bredde); margin-inline: auto; padding-inline: 16px; }
.sp-innhold { min-height: 50vh; }
.screen-reader-text:focus { position: fixed; top: 8px; left: 8px; z-index: 1000; background: #fff; padding: 8px 12px; clip: auto; width: auto; height: auto; }

/* Knapper */
.sp-knapp, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit, .wpcf7-submit {
	display: inline-flex; align-items: center; justify-content: center; gap: .4em; min-height: 44px; padding: 10px 22px;
	border-radius: var(--sp-knapp-radius); border: 2px solid var(--sp-primar); background: #fff; color: var(--sp-primar);
	font-weight: 600; text-decoration: none; cursor: pointer; line-height: 1.2;
}
.sp-knapp--hoved, .woocommerce a.button.alt, .woocommerce button.button.alt, .single_add_to_cart_button, .checkout-button, .wpcf7-submit {
	background: var(--sp-primar); color: #fff;
}
.sp-knapp:hover, .woocommerce a.button:hover, .woocommerce button.button:hover { background: var(--sp-primar-mork); border-color: var(--sp-primar-mork); color: #fff; }

/* Header */
.sp-header { border-bottom: 1px solid var(--sp-linje); background: #fff; position: sticky; top: 0; z-index: 50; }
.sp-header__rad { display: flex; align-items: center; gap: 16px; min-height: 72px; }
.sp-logo img { max-height: 56px; width: auto; display: block; }
.sp-logo__tekst { font-family: var(--sp-font-tittel); font-weight: 700; font-size: 22px; color: var(--sp-tittel); text-decoration: none; }
.sp-hovedmeny { flex: 1; }
.sp-hovedmeny__liste { display: flex; flex-wrap: wrap; gap: 4px 20px; list-style: none; margin: 0; padding: 0; }
.sp-hovedmeny__liste > li { position: relative; }
.sp-hovedmeny__liste a { display: block; padding: 10px 0; font-family: var(--sp-font-tittel); font-weight: 600; color: var(--sp-tittel); text-decoration: none; }
.sp-hovedmeny__liste .sub-menu { display: none; position: absolute; left: 0; top: 100%; min-width: 200px; list-style: none; margin: 0; padding: 8px 16px; background: #fff; border: 1px solid var(--sp-linje); border-radius: var(--sp-radius); }
.sp-hovedmeny__liste li:hover > .sub-menu, .sp-hovedmeny__liste li:focus-within > .sub-menu { display: block; }
.sp-header__verktoy { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.sp-ikonknapp { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; color: var(--sp-tittel); cursor: pointer; list-style: none; }
.sp-ikonknapp::-webkit-details-marker, .sp-mobilmeny summary::-webkit-details-marker, .sp-sok summary::-webkit-details-marker { display: none; }
summary.sp-ikonknapp { list-style: none; }
.sp-kurv { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; color: var(--sp-tittel); }
.sp-kurv__antall { position: absolute; top: 4px; right: 2px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px; background: var(--sp-primar); color: #fff; font-size: 11px; line-height: 18px; text-align: center; }
.sp-sok { position: relative; }
.sp-sok__panel { position: absolute; right: 0; top: 100%; width: min(360px, 90vw); padding: 12px; background: #fff; border: 1px solid var(--sp-linje); border-radius: var(--sp-radius); }
.woocommerce-product-search { display: flex; gap: 8px; }
.woocommerce-product-search input[type="search"] { flex: 1; min-height: 44px; padding: 8px 16px; border: 1px solid var(--sp-linje); border-radius: var(--sp-knapp-radius); }
.sp-mobilmeny { display: none; }
.sp-burger, .sp-burger::before, .sp-burger::after { display: block; width: 20px; height: 2px; background: currentColor; position: relative; }
.sp-burger::before, .sp-burger::after { content: ""; position: absolute; left: 0; }
.sp-burger::before { top: -6px; }
.sp-burger::after { top: 6px; }
.sp-mobilmeny__panel { position: fixed; inset: 72px 0 0 0; overflow: auto; padding: 16px; background: #fff; z-index: 60; }
.sp-mobilmeny__liste { list-style: none; margin: 16px 0 0; padding: 0; }
.sp-mobilmeny__liste a { display: block; padding: 12px 0; border-bottom: 1px solid var(--sp-linje); color: var(--sp-tittel); text-decoration: none; font-weight: 600; }
.sp-mobilmeny__liste .sub-menu { list-style: none; padding-left: 16px; }
@media (max-width: 1024px) {
	.sp-hovedmeny { display: none; }
	.sp-mobilmeny { display: block; }
	.sp-sok { display: none; }
	.sp-logo { flex: 1; text-align: center; }
	.sp-logo img { margin-inline: auto; max-height: 44px; }
}

/* Footer */
.sp-footer { margin-top: 48px; background: #1a1a1a; color: rgba(255, 255, 255, .8); padding: 40px 0 16px; }
.sp-footer a { color: rgba(255, 255, 255, .9); text-decoration: none; }
.sp-footer a:hover { color: #fff; text-decoration: underline; }
.sp-footer__kolonner { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 24px; }
.sp-footer__kol--bred { grid-column: span 2; }
.sp-footer__tittel { color: #fff; font-size: 16px; margin: 0 0 12px; }
.sp-footer__liste, .sp-sosiale { list-style: none; margin: 0; padding: 0; }
.sp-footer__liste li, .sp-sosiale li { margin: 0 0 8px; }
.sp-footer__copyright { margin-top: 24px; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, .15); font-size: 13px; }
@media (max-width: 600px) { .sp-footer__kol--bred { grid-column: auto; } }

/* Karusell [sp_karusell] */
.sp-karusell { position: relative; }
.sp-karusell__spor { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; overscroll-behavior-x: contain; }
.sp-karusell__spor::-webkit-scrollbar { display: none; }
.sp-karusell__lysbilde { position: relative; flex: 0 0 100%; scroll-snap-align: start; }
.sp-karusell .sp-karusell__bilde { display: block; width: 100%; height: clamp(320px, 50vw, 620px); object-fit: cover; }
.sp-karusell__tekst { position: absolute; inset: auto 0 0 0; padding: 32px max(16px, 6vw) 56px; background: linear-gradient(transparent, rgba(0, 0, 0, .55)); color: #fff; }
.sp-karusell__tittel { color: #fff; font-size: clamp(26px, 4vw, 48px); margin: 0 0 8px; }
.sp-karusell__undertekst { font-size: clamp(15px, 1.6vw, 20px); margin: 0 0 16px; max-width: 40em; }
.sp-karusell__knapper { display: flex; flex-wrap: wrap; gap: 12px; margin: 0; }
.sp-karusell__pil { position: absolute; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .9); color: var(--sp-tittel); font-size: 28px; line-height: 1; cursor: pointer; }
.sp-karusell__pil:disabled { opacity: .35; cursor: default; }
.sp-karusell__pil--forrige { left: 12px; }
.sp-karusell__pil--neste { right: 12px; }
.sp-karusell__prikker { position: absolute; left: 0; right: 0; bottom: 16px; display: flex; justify-content: center; gap: 4px; }
.sp-karusell__prikk { width: 44px; height: 44px; border: 0; background: transparent; cursor: pointer; position: relative; }
.sp-karusell__prikk::after { content: ""; position: absolute; inset: 0; margin: auto; width: 10px; height: 10px; border-radius: 50%; background: rgba(255, 255, 255, .6); }
.sp-karusell__prikk[aria-current="true"]::after { background: #fff; width: 12px; height: 12px; }
@media (max-width: 600px) { .sp-karusell__pil { display: none; } }
@media (prefers-reduced-motion: reduce) { .sp-karusell__spor { scroll-behavior: auto; } }

/* Kart [sp_kart] */
.sp-kart { padding: 16px; border: 1px solid var(--sp-linje); border-radius: var(--sp-radius); background: var(--sp-lys); }
.sp-kart__ramme { display: block; width: 100%; height: 360px; border: 0; border-radius: var(--sp-radius); }
.sp-kart__info { margin-top: 0; color: var(--sp-tekst-svak); }

/* Butikk */
.sp-filtre { margin: 0 0 16px; }
.sp-filtre summary { list-style: none; }
.sp-filtre summary::-webkit-details-marker { display: none; }
.sp-filtre__innhold { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-top: 12px; padding: 16px; border: 1px solid var(--sp-linje); border-radius: var(--sp-radius); }
.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 16px; }
.woocommerce ul.products li.product img { border-radius: var(--sp-radius); }
.woocommerce .price, .woocommerce-Price-amount { color: var(--sp-tittel); font-weight: 600; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--sp-primar); }