/* Ultra Boys Theme: hela utseendet. Färger och typsnitt överst, sedan del för del i sidans ordning. */

:root {
	--svart: #0b0b0b;
	--kol: #161616;
	--linje: #262626;
	--ram: #3a3a3a;
	--gron: #0a7e35;
	--gron-ljus: #19a24c;
	--vit: #f4f4f1;
	--ljus: #cfcfca;
	--gra: #9a9a95;
	--rubrik: "Bebas Neue", Impact, "Arial Narrow", sans-serif;
	--brod: Archivo, system-ui, -apple-system, "Segoe UI", sans-serif;
	--stencil: "Saira Stencil One", var(--rubrik);
}

/* Grund ------------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--svart); color: var(--vit); font-family: var(--brod); font-size: 16px; line-height: 1.5; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3, h4 { margin: 0; font-weight: 400; }
p { margin: 0; }
.dold, .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hoppa { position: absolute; left: -9999px; top: 0; z-index: 100; background: var(--gron); padding: 10px 16px; }
.hoppa:focus { left: 16px; }
:focus-visible { outline: 2px solid var(--gron-ljus); outline-offset: 2px; }
.rad { max-width: 1240px; margin: 0 auto; padding: 0 24px; }

/* Flaggans ränder som avdelare */
.rander { height: 18px; background: repeating-linear-gradient(180deg, var(--gron) 0 4px, var(--vit) 4px 6px, var(--svart) 6px 12px, var(--vit) 12px 14px, var(--gron) 14px 18px); }

/* Knappar */
.knapp, .button, button.button, .single_add_to_cart_button, input[type="submit"].button {
	display: inline-block; font-family: var(--rubrik); font-size: 24px; letter-spacing: .08em; line-height: 1;
	padding: 14px 28px 11px; background: var(--gron); color: var(--vit); border: 2px solid var(--gron); border-radius: 0; cursor: pointer; text-align: center;
}
.knapp:hover, .button:hover, .single_add_to_cart_button:hover { background: var(--gron-ljus); border-color: var(--gron-ljus); }
.knapp.spok { background: transparent; border-color: var(--vit); }
.knapp.spok:hover { background: var(--vit); color: var(--svart); }
.button.disabled, .single_add_to_cart_button.disabled, .button:disabled { opacity: .45; cursor: not-allowed; }

/* Fält */
input[type="text"], input[type="email"], input[type="tel"], input[type="password"], input[type="number"], input[type="search"], select, textarea, .input-text {
	background: var(--svart); border: 2px solid var(--ram); color: var(--vit); padding: 12px 14px; border-radius: 0; max-width: 100%;
}
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--gron-ljus); }

/* Sidhuvud ---------------------------------------------------------------------------- */
.sidhuvud { position: sticky; top: 0; z-index: 20; background: rgba(11, 11, 11, .95); border-bottom: 1px solid var(--linje); }
.admin-bar .sidhuvud { top: 32px; }
.huvud { display: flex; align-items: center; gap: 28px; height: 76px; }
.logga { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }
.logga img { width: 54px; height: 54px; }
.logga span { font-family: var(--stencil); font-size: 26px; letter-spacing: .02em; line-height: 1; white-space: nowrap; }
.logga span b { font-weight: 400; }
/* Menyn ligger på en rad. Får den inte plats sätter tema.js klassen "kompakt", och menyn blir en knapp. */
/* Högerställd via auto-marginal (inte justify-content), så att det som inte får plats hamnar till höger och kan mätas. */
.meny { display: flex; flex: 1 1 auto; min-width: 0; flex-wrap: nowrap; overflow: hidden; gap: 20px; font-family: var(--rubrik); font-size: 21px; letter-spacing: .06em; white-space: nowrap; }
.meny > :first-child { margin-left: auto; }
.kompakt .meny > :first-child { margin-left: 0; }
.meny a:hover, .meny a[aria-current] { color: var(--gron-ljus); }
.korg { flex: 0 0 auto; font-family: var(--rubrik); font-size: 21px; letter-spacing: .06em; border: 2px solid var(--vit); padding: 6px 14px 4px; }
.korg em { font-style: normal; background: var(--gron); padding: 0 6px; margin-left: 6px; }
.menyknapp { display: none; background: none; border: 0; font-family: var(--rubrik); font-size: 22px; letter-spacing: .06em; cursor: pointer; padding: 8px 0; }

/* Startsidan --------------------------------------------------------------------------- */
.hjalte { position: relative; overflow: hidden; border-bottom: 1px solid var(--linje); }
/* Mönstret centreras mot mitten och är större än ytan åt alla håll, så att inga luckor syns vid kanterna. */
.hjalte::before {
	content: "UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99 UB99";
	position: absolute; left: 50%; top: 50%; width: 3200px; height: 1800px; margin: -900px 0 0 -1600px; text-align: center;
	font-family: var(--rubrik); font-size: 120px; line-height: .95; color: #151515; transform: rotate(-8deg); word-spacing: 20px; overflow: hidden; pointer-events: none;
}
.hjalte .rad { position: relative; display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: 40px; padding-top: 72px; padding-bottom: 72px; }
.etikett { display: inline-block; font-family: var(--rubrik); font-size: 20px; letter-spacing: .14em; color: var(--svart); background: var(--vit); padding: 4px 12px 2px; transform: rotate(-2deg); margin-bottom: 22px; }
.hjalte h1 { font-family: var(--rubrik); font-size: clamp(64px, 9vw, 132px); line-height: .86; letter-spacing: .01em; text-transform: uppercase; }
.knappar { display: flex; gap: 14px; margin-top: 36px; flex-wrap: wrap; }
.hjalte-bild img { width: 100%; filter: drop-shadow(0 20px 40px rgba(0, 0, 0, .6)); }

/* Kategoriremsan: lika breda rutor, så många som det finns kategorier med synliga produkter */
.kategorier { display: grid; grid-template-columns: repeat(var(--antal, 6), 1fr); border-bottom: 1px solid var(--linje); }
.kategorier a { font-family: var(--rubrik); font-size: 26px; letter-spacing: .06em; text-align: center; padding: 22px 8px 18px; border-right: 1px solid var(--linje); text-transform: uppercase; }
.kategorier a:last-child { border-right: 0; }
.kategorier a:hover, .kategorier a.aktiv { background: var(--gron); }

/* Produktlistor och kort ---------------------------------------------------------------- */
section.produkter { padding: 64px 0 72px; }
section.produkter.lista { padding-top: 0; }
.sektionstopp { display: flex; align-items: end; justify-content: space-between; margin-bottom: 28px; gap: 16px; }
h2, .sektionstopp h2 { font-family: var(--rubrik); font-size: 56px; line-height: .9; letter-spacing: .02em; text-transform: uppercase; }
.se-alla { font-family: var(--rubrik); font-size: 22px; letter-spacing: .08em; border-bottom: 2px solid var(--gron); padding-bottom: 2px; white-space: nowrap; }
.tomt { color: var(--ljus); padding: 40px 0; }
.rutnat, ul.products { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; list-style: none; margin: 0; padding: 0; }
ul.products li.product { margin: 0; padding: 0; }
.kort { display: flex; flex-direction: column; height: 100%; background: var(--kol); border: 1px solid var(--linje); transition: transform .15s, border-color .15s; }
.kort:hover { transform: translateY(-4px); border-color: var(--gron); }
.kort .bild { position: relative; display: block; aspect-ratio: 1; background: #ecebe6; overflow: hidden; }
.kort .bild img { width: 100%; height: 100%; object-fit: contain; }
.kort .text { display: block; padding: 16px 16px 18px; }
.kort .kat, .summary .kat { display: block; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--gra); }
.kort .namn { display: block; font-size: 17px; font-weight: 800; margin: 6px 0 10px; line-height: 1.25; overflow-wrap: anywhere; }
.kort .pris { display: block; font-family: var(--rubrik); font-size: 28px; letter-spacing: .04em; color: var(--gron-ljus); }
.pris del, .price del { color: var(--gra); font-size: .7em; margin-right: 6px; }
.pris ins, .price ins { text-decoration: none; }

/* Märken: Nyhet, Förbokning och Slut */
.marken { position: absolute; top: 12px; left: 12px; z-index: 2; display: flex; gap: 6px; flex-wrap: wrap; }
.marke { font-family: var(--rubrik); font-size: 17px; letter-spacing: .1em; background: var(--svart); color: var(--vit); padding: 3px 9px 1px; text-transform: uppercase; }
.marke.ny { background: var(--gron); }
.marke.slut { background: #151515; color: var(--vit); }

/* Kategorisidor */
.stig { padding: 22px 0 0; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--gra); }
.stig a:hover { color: var(--vit); }
.stig span { margin: 0 8px; color: #444; }
.katrubrik { padding: 18px 0 30px; display: flex; align-items: end; justify-content: space-between; gap: 20px; }
.katrubrik h1 { font-family: var(--rubrik); font-size: 96px; line-height: .85; letter-spacing: .01em; text-transform: uppercase; }
.katrubrik .antal { font-family: var(--rubrik); font-size: 24px; letter-spacing: .08em; color: var(--gron-ljus); text-transform: uppercase; white-space: nowrap; }
.verktyg { display: flex; justify-content: space-between; align-items: center; padding: 22px 0; border-bottom: 1px solid var(--linje); margin-bottom: 28px; gap: 16px; }
.woocommerce-result-count { font-size: 14px; color: var(--gra); }
.woocommerce-ordering { margin: 0; }
.woocommerce-ordering select { padding: 10px 14px; font-size: 14px; font-weight: 600; }
.woocommerce-pagination ul { display: flex; justify-content: center; gap: 8px; list-style: none; padding: 0; margin: 44px 0 0; }
.woocommerce-pagination .page-numbers { display: block; font-family: var(--rubrik); font-size: 22px; letter-spacing: .06em; min-width: 46px; text-align: center; padding: 10px 12px 7px; border: 2px solid var(--ram); }
.woocommerce-pagination .page-numbers.current { background: var(--vit); color: var(--svart); border-color: var(--vit); }
.woocommerce-pagination a.page-numbers:hover { border-color: var(--vit); }

/* Produktsidan --------------------------------------------------------------------------- */
div.product { display: grid; grid-template-columns: 1.05fr .95fr; gap: 56px; padding: 26px 0 72px; align-items: start; }
.galleri { position: relative; min-width: 0; }
.galleri .marken { top: 16px; left: 16px; }
.galleri .marke { font-size: 20px; padding: 4px 11px 2px; }
.woocommerce-product-gallery { position: relative; margin: 0; }
.woocommerce-product-gallery__wrapper { margin: 0; }
.woocommerce-product-gallery__image { background: #ecebe6; }
.woocommerce-product-gallery__image img { width: 100%; aspect-ratio: 1; object-fit: contain; }
.flex-viewport { border: 1px solid var(--linje); }
.flex-control-thumbs { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; list-style: none; margin: 12px 0 0; padding: 0; }
.flex-control-thumbs img { aspect-ratio: 1; object-fit: cover; background: #ecebe6; border: 2px solid transparent; cursor: pointer; opacity: .75; }
.flex-control-thumbs img.flex-active, .flex-control-thumbs img:hover { border-color: var(--gron-ljus); opacity: 1; }
.woocommerce-product-gallery__trigger { position: absolute; top: 14px; right: 14px; z-index: 3; width: 40px; height: 40px; background: var(--svart); border: 1px solid var(--ram); font-size: 0; }
.woocommerce-product-gallery__trigger::before { content: "⤢"; font-size: 20px; line-height: 38px; display: block; text-align: center; color: var(--vit); }
.woocommerce-product-gallery__trigger img { display: none; }

.summary { min-width: 0; }
.summary .kat { color: var(--gron-ljus); font-weight: 600; font-size: 13px; letter-spacing: .14em; }
.produktnamn { font-family: var(--rubrik); font-size: 72px; line-height: .9; letter-spacing: .01em; margin: 10px 0 18px; text-transform: uppercase; }
.summary > .price, .woocommerce-variation-price .price { font-family: var(--rubrik); font-size: 46px; letter-spacing: .03em; color: var(--gron-ljus); line-height: 1; }
.prisnot { font-size: 13px; color: var(--gra); margin-top: 6px; }
.linje { height: 1px; background: var(--linje); margin: 26px 0; }
.woocommerce-product-details__short-description { color: var(--ljus); margin-bottom: 22px; }

/* Storlekar: WooCommerces tabell blir knappar (se tema.js) */
table.variations { width: 100%; border-collapse: collapse; margin: 0; }
table.variations th, table.variations td { padding: 0; text-align: left; display: block; }
table.variations tr.har-knappar th { display: none; }
table.variations select { width: 100%; }
/* Den dolda rullgardinen ligger kvar (WooCommerce läser den) men tar ingen plats och får inte göra sidan bredare. */
table.variations td { position: relative; }
table.variations select.dold-select { position: absolute !important; left: 0; top: 0; opacity: 0; pointer-events: none; width: 1px !important; height: 1px; overflow: hidden; }
.reset_variations { display: none !important; }
.etikett-rad { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 12px; }
.etikett-rad b { font-family: var(--rubrik); font-weight: 400; font-size: 22px; letter-spacing: .08em; text-transform: uppercase; }
.etikett-rad span { font-size: 13px; color: var(--gra); }
.storlekar { display: grid; grid-template-columns: repeat(auto-fill, minmax(78px, 1fr)); gap: 10px; }
.storlekar button { font-family: var(--rubrik); font-size: 24px; letter-spacing: .06em; padding: 14px 4px 11px; background: transparent; color: var(--vit); border: 2px solid var(--ram); cursor: pointer; }
.storlekar button:hover { border-color: var(--vit); }
.storlekar button.vald { background: var(--vit); color: var(--svart); border-color: var(--vit); }
.storlekar button.slut { color: #555; border-color: var(--linje); text-decoration: line-through; }
.single_variation_wrap { margin-top: 18px; }
.woocommerce-variation-availability .stock, .summary .stock { font-size: 14px; color: var(--ljus); margin: 8px 0 0; }
.summary .stock.out-of-stock { color: #ff8a80; }

/* Antal och köpknapp */
form.cart:not(.variations_form), .woocommerce-variation-add-to-cart { display: grid; grid-template-columns: 150px 1fr; gap: 12px; margin-top: 22px; }
.quantity { display: flex; border: 2px solid var(--ram); }
.quantity input.qty { width: 100%; min-width: 0; border: 0; background: transparent; text-align: center; font-family: var(--rubrik); font-size: 26px; padding: 10px 0 6px; -moz-appearance: textfield; }
.quantity input.qty::-webkit-outer-spin-button, .quantity input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.quantity button { flex: 0 0 40px; background: transparent; border: 0; color: var(--gra); font-size: 22px; cursor: pointer; }
.quantity button:hover { color: var(--vit); }
.single_add_to_cart_button { font-size: 26px; padding: 16px 12px 13px; width: 100%; }
.saker { display: flex; gap: 22px; flex-wrap: wrap; list-style: none; margin: 18px 0 0; padding: 0; font-size: 14px; color: var(--ljus); }
.saker li::before { content: "■"; color: var(--gron-ljus); margin-right: 8px; font-size: 10px; vertical-align: 2px; }
.fakta { font-size: 14px; color: var(--gra); line-height: 1.8; }
.fakta b { color: var(--vit); font-weight: 600; }
.fakta a { border-bottom: 1px solid var(--gron-ljus); color: var(--ljus); }

/* Utfällbara detaljer (Beskrivning, Ytterligare information) */
.detaljer { margin-top: 26px; }
.detaljer details { border-top: 1px solid var(--linje); }
.detaljer details:last-child { border-bottom: 1px solid var(--linje); }
.detaljer summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; padding: 18px 0 15px; font-family: var(--rubrik); font-size: 26px; letter-spacing: .06em; text-transform: uppercase; }
.detaljer summary::-webkit-details-marker { display: none; }
.detaljer summary::after { content: "+"; color: var(--gron-ljus); }
.detaljer details[open] summary::after { content: "–"; }
.detaljinnehall { padding-bottom: 20px; color: var(--ljus); line-height: 1.6; font-size: 15px; }
.detaljinnehall p + p { margin-top: 12px; }
.woocommerce-product-attributes { width: 100%; border-collapse: collapse; }
.woocommerce-product-attributes th, .woocommerce-product-attributes td { text-align: left; padding: 6px 0; border-bottom: 1px solid #1f1f1f; font-weight: 400; }
.woocommerce-product-attributes th { color: var(--gra); width: 40%; }
.woocommerce-product-attributes td p { margin: 0; }

/* Väntelista och liknande tillägg som lägger sig under köpknappen */
.summary form:not(.cart):not(.variations_form) { margin-top: 22px; }

/* "Bevaka produkten" (tillägget Waitlist, xoo-wl) i samma stil som rutan i mockupen och nyhetsbrevet */
.summary .xoo-wl-btn-container { margin-top: 26px; }
.summary .xoo-wl-inline-form { border: 1px dashed var(--ram); padding: 20px; }
.summary .xoo-wl-header { display: block; margin: 0 0 14px; text-align: left; }
.summary .xwh-heading { display: block; font-family: var(--rubrik); font-weight: 400; font-size: 30px; letter-spacing: .04em; text-transform: uppercase; text-align: left !important; line-height: 1; }
.summary .xwh-subheading { display: block; margin-top: 6px; color: var(--ljus); font-size: 14px; line-height: 1.55; text-align: left; }
.summary form.xoo-wl-form { display: flex; margin: 0 !important; }
.summary .xoo-aff-fields { flex: 1; min-width: 0; margin: 0; }
.summary .xoo-aff-group { margin: 0 !important; width: 100% !important; max-width: none !important; float: none !important; }
.summary .xoo-aff-input-group { display: block; }
.summary .xoo-aff-input-icon { display: none !important; }
.summary .xoo-aff-input-group input.xoo-aff-email { width: 100%; height: 100%; min-height: 46px; background: var(--svart) !important; color: var(--vit) !important; border: 2px solid var(--ram) !important; border-right: 0 !important; border-radius: 0 !important; padding: 12px 14px !important; }
.summary .xoo-wl-submit-btn { flex: 0 0 auto; margin: 0 !important; font-family: var(--rubrik); font-size: 20px !important; letter-spacing: .08em; padding: 0 20px !important; border-radius: 0 !important; width: auto !important; }
.summary .xoo-wl-notices:empty { display: none; }
.summary .xoo-wl-notices { margin-bottom: 10px; font-size: 14px; }

/* Meddelanden (lagt i varukorgen, fel och information) ------------------------------- */
.woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-message, .woocommerce-error, .woocommerce-info, .wc-block-components-notice-banner {
	list-style: none; margin: 20px 0; padding: 16px 18px; border: 1px solid var(--ram); border-left: 4px solid var(--gron-ljus); background: var(--kol); color: var(--vit); display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap;
}
.woocommerce-error { border-left-color: #e05d4f; display: block; }
/* Blockens meddelanden (t.ex. "kortet nekades" i kassan) har egna ljusa färger, så de skrivs över med mörk botten och ljus text. */
.wc-block-components-notice-banner { background: var(--kol) !important; color: var(--vit) !important; border: 1px solid var(--ram) !important; border-left: 4px solid var(--gron-ljus) !important; border-radius: 0 !important; }
.wc-block-components-notice-banner.is-error { border-left-color: #e05d4f !important; }
.wc-block-components-notice-banner.is-warning { border-left-color: #e0b84f !important; }
.wc-block-components-notice-banner > svg { background: transparent !important; fill: currentColor; }
.wc-block-components-notice-banner.is-error > svg { fill: #e05d4f; }
.wc-block-components-notice-banner a { color: var(--vit); text-decoration: underline; }
/* Den klistrade ordersammanfattningen i kassan ska stanna under sidhuvudet, inte glida in under det. */
.wc-block-components-sidebar-layout .wc-block-components-sidebar.is-sticky, .wc-block-checkout__sidebar.is-sticky { top: 96px !important; }
.woocommerce-error li { list-style: none; }
.woocommerce-message .button, .woocommerce-info .button { font-size: 18px; padding: 9px 16px 7px; order: 2; }

/* Vanliga sidor (textsidor, varukorg, kassa och Mitt konto) ----------------------------- */
.sida { padding-bottom: 72px; }
.sidrubrik { font-family: var(--rubrik); font-size: 84px; line-height: .9; letter-spacing: .01em; margin: 40px 0 28px; text-transform: uppercase; }
.sidtext { max-width: 820px; color: var(--ljus); line-height: 1.7; }
.butikssida .sidtext { max-width: none; }
.sidtext > * + * { margin-top: 1em; }
.sidtext h2 { font-size: 40px; color: var(--vit); margin-top: 1.4em; }
.sidtext h3 { font-family: var(--rubrik); font-size: 28px; letter-spacing: .04em; color: var(--vit); margin-top: 1.2em; }
.sidtext a { color: var(--vit); border-bottom: 1px solid var(--gron-ljus); }
.sidtext ul, .sidtext ol { padding-left: 1.3em; }
.sidtext strong { color: var(--vit); }
.sidtext table { border-collapse: collapse; width: 100%; }
.sidtext th, .sidtext td { border-bottom: 1px solid var(--linje); padding: 10px 8px; text-align: left; }
.inlagg + .inlagg { margin-top: 40px; }
.inlagg h2 { font-size: 40px; }

/* Stegen i varukorgen och kassan */
.steg { display: flex; list-style: none; padding: 30px 0 0; margin: 0; }
.steg li { flex: 1; display: flex; align-items: center; gap: 10px; font-family: var(--rubrik); font-size: 20px; letter-spacing: .08em; color: var(--gra); padding-bottom: 12px; border-bottom: 3px solid var(--linje); }
.steg li b { display: grid; place-items: center; width: 30px; height: 30px; border: 2px solid var(--ram); font-weight: 400; padding-top: 2px; }
.steg li.aktiv { color: var(--vit); border-bottom-color: var(--gron); }
.steg li.aktiv b { background: var(--gron); border-color: var(--gron); }
.steg li.klar { color: var(--ljus); border-bottom-color: var(--ram); }
.steg li.klar b { border-color: var(--gron-ljus); color: var(--gron-ljus); }
/* Siffran centreras på siffrans egen höjd, så att den hamnar mitt i rutan oavsett hur enheten placerar typsnittet (iPhone la den för lågt) */
@supports (text-box: trim-both cap alphabetic) {
	.steg li b { padding-top: 0; }
	.steg li b span { text-box: trim-both cap alphabetic; }
}

/* Blockvarukorgen och blockkassan: bara färger, typsnitt och ramar. Fälten och Stripes kortfält fungerar som förut. */
.wp-block-woocommerce-cart, .wp-block-woocommerce-checkout { color: var(--vit); }
.wc-block-components-text-input input, .wc-block-components-text-input textarea, .wc-blocks-components-select__select,
.wc-block-components-combobox .wc-block-components-combobox-control input, .wc-block-components-textarea, .wc-block-components-totals-coupon input {
	background: var(--svart) !important; color: var(--vit) !important; border: 2px solid var(--ram) !important; border-radius: 0 !important;
}
.wc-block-components-text-input label, .wc-blocks-components-select__label, .wc-block-components-combobox label { color: var(--gra) !important; }
.wc-block-components-text-input.is-active input:focus, .wc-blocks-components-select__select:focus { border-color: var(--gron-ljus) !important; }
.wc-block-components-button:not(.is-link), .wc-block-cart__submit-button, .wc-block-components-checkout-place-order-button {
	background: var(--gron) !important; color: var(--vit) !important; border-radius: 0 !important; border: 0 !important;
	font-family: var(--rubrik) !important; font-size: 26px !important; letter-spacing: .08em; min-height: 58px;
}
.wc-block-components-button:not(.is-link):hover { background: var(--gron-ljus) !important; }
.wc-block-components-order-summary-item__quantity { background: var(--gron) !important; color: var(--vit) !important; border: 0 !important; box-shadow: none !important; font-weight: 700; }
.wc-block-components-title.wc-block-components-title, .wc-block-cart__totals-title, .wc-block-components-checkout-step__title, .wc-block-components-checkout-order-summary__title-text {
	font-family: var(--rubrik) !important; font-size: 34px !important; letter-spacing: .04em; text-transform: uppercase; font-weight: 400 !important;
}
.wc-block-components-sidebar .wc-block-components-panel, .wp-block-woocommerce-cart-order-summary-block, .wp-block-woocommerce-checkout-order-summary-block {
	background: var(--kol); border-color: var(--linje) !important;
}
.wc-block-cart-items, .wc-block-cart-items td, .wc-block-cart-items th, .wc-block-components-totals-wrapper, .wc-block-components-order-summary-item { border-color: var(--linje) !important; }
.wc-block-cart-items th { color: var(--gra); font-size: 12px; letter-spacing: .14em; }
.wc-block-components-product-name { color: var(--vit) !important; font-weight: 800; font-size: 17px; text-decoration: none !important; }
.wc-block-components-product-metadata, .wc-block-components-product-details { color: var(--gra) !important; }
.wc-block-components-product-price, .wc-block-cart-item__total { font-family: var(--rubrik); font-size: 24px; letter-spacing: .04em; }
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value, .wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
	font-family: var(--rubrik); font-size: 34px !important; letter-spacing: .04em; font-weight: 400 !important;
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value { color: var(--gron-ljus); }
.wc-block-components-quantity-selector { border: 2px solid var(--ram) !important; border-radius: 0 !important; }
.wc-block-components-quantity-selector input, .wc-block-components-quantity-selector button { color: var(--vit) !important; background: transparent !important; }
.wc-block-cart-item__image img { background: #ecebe6; }
.wc-block-components-radio-control__option, .wc-block-components-radio-control-accordion-option { border-color: var(--ram) !important; }
.wc-block-components-radio-control__option--checked-option-highlighted, .wc-block-components-radio-control-accordion-option--checked-option-highlighted { box-shadow: inset 0 0 0 2px var(--gron) !important; }
.wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"] { background: var(--svart); border-color: var(--ram); }
.wc-block-components-checkbox .wc-block-components-checkbox__mark { fill: var(--vit); }
.wc-block-checkout__actions_row .wc-block-components-checkout-return-to-cart-button, .wc-block-components-totals-coupon-link, .wc-block-components-panel__button { color: var(--vit) !important; }
.wc-block-components-checkout-step__description, .wc-block-components-checkout-step__heading-content, .wc-block-components-address-card { color: var(--ljus); }
.wc-block-components-address-card { background: var(--kol) !important; border-color: var(--ram) !important; }
.wp-block-woocommerce-empty-cart-block h2 { font-size: 40px; }
/* Produktrutnätet i blocken (t.ex. "Nytt i butiken" i en tom varukorg) i samma stil som korten */
.wc-block-grid__products { gap: 22px; margin: 0 !important; }
.wc-block-grid__product { background: var(--kol); border: 1px solid var(--linje) !important; padding: 0 0 18px !important; text-align: left !important; }
.wc-block-grid__product-image img { background: #ecebe6; aspect-ratio: 1; object-fit: contain; }
.wc-block-grid__product-link { border: 0 !important; }
.wc-block-grid__product-title { color: var(--vit); font-size: 15px !important; font-weight: 800; padding: 14px 16px 0; border: 0 !important; }
.wc-block-grid__product-price { color: var(--gron-ljus); font-family: var(--rubrik); font-size: 24px !important; padding: 6px 16px 0; border: 0 !important; }
.wc-block-grid__product-add-to-cart { padding: 10px 16px 0; }
.wc-block-grid__product-add-to-cart .wp-block-button__link { background: transparent !important; color: var(--vit) !important; border: 2px solid var(--ram) !important; border-radius: 0 !important; font-family: var(--rubrik); font-size: 18px !important; letter-spacing: .06em; padding: 8px 14px 6px !important; }
.wc-block-grid__product-add-to-cart .wp-block-button__link:hover { border-color: var(--vit) !important; }
.wp-block-woocommerce-empty-cart-block .wc-block-cart__empty-cart__title { font-family: var(--rubrik); font-size: 40px; font-weight: 400; }
.wp-block-woocommerce-empty-cart-block .wp-block-separator { border-color: var(--linje); opacity: 1; }
.wp-block-woocommerce-empty-cart-block a { border-bottom: 1px solid var(--gron-ljus); }

/* Lösenordsfältet med "visa lösenord"-knappen (Mitt konto) */
.password-input { position: relative; display: block; width: 100%; }
.password-input input { width: 100%; padding-right: 48px; }
.show-password-input { position: absolute; right: 2px; top: 2px; bottom: 2px; width: 44px; background: transparent; border: 0; cursor: pointer; font-size: 0; }
.show-password-input::before { content: "👁"; font-size: 18px; filter: grayscale(1); opacity: .7; }
.show-password-input.display-password::before { opacity: 1; }
.woocommerce form .form-row input.input-text { width: 100%; }

/* Klassisk varukorg och kassa (kortkoderna [woocommerce_cart] och [woocommerce_checkout], som den riktiga butiken använder) -------- */
.woocommerce-cart .sidtext > .woocommerce { display: grid; grid-template-columns: 1fr 400px; gap: 0 40px; align-items: start; }
.woocommerce-cart .sidtext > .woocommerce > :not(.woocommerce-cart-form):not(.cart-collaterals) { grid-column: 1 / -1; }
.sidtext table.shop_table { border-collapse: collapse; width: 100%; }
.sidtext table.shop_table th { color: var(--gra); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; font-weight: 400; text-align: left; padding: 0 8px 12px; border-bottom: 1px solid var(--linje); }
.sidtext table.shop_table td { padding: 20px 8px; border-bottom: 1px solid var(--linje); vertical-align: middle; color: var(--vit); }
table.cart .product-thumbnail { width: 110px; }
table.cart .product-thumbnail img { width: 96px; height: 96px; object-fit: contain; background: #ecebe6; }
table.cart .product-name a { border: 0; font-weight: 800; font-size: 17px; color: var(--vit); }
table.cart .product-name a:hover { color: var(--gron-ljus); }
table.cart .product-name .variation { margin: 6px 0 0; color: var(--gra); font-size: 14px; display: flex; gap: 4px; }
table.cart .product-name .variation dt, table.cart .product-name .variation dd { margin: 0; }
table.cart .product-name .variation dd p { margin: 0; }
table.cart .product-price { color: var(--gra); }
table.cart .product-subtotal { font-family: var(--rubrik); font-size: 26px; letter-spacing: .04em; text-align: right; white-space: nowrap; }
table.cart th.product-subtotal { text-align: right; font-family: var(--brod); font-size: 12px; }
table.cart .product-remove { width: 36px; }
table.cart a.remove { border: 0; color: var(--gra); font-size: 24px; line-height: 1; display: block; text-align: center; }
table.cart a.remove:hover { color: var(--vit); }
table.cart .product-quantity .quantity { width: 130px; }
table.cart td.actions { padding-top: 24px; border-bottom: 0; text-align: right; }
table.cart td.actions .coupon { float: left; display: flex; }
table.cart td.actions .coupon label { position: absolute; left: -9999px; }
table.cart td.actions .coupon input.input-text { width: 220px; border-right: 0; }
table.cart td.actions .button { font-size: 20px; padding: 11px 18px 9px; white-space: nowrap; }
table.cart td.actions .coupon .button, table.cart td.actions button[name="update_cart"] { background: transparent; color: var(--vit); border-color: var(--vit); }
table.cart td.actions button[name="update_cart"]:disabled { opacity: .35; }

.cart-collaterals .cart_totals, .woocommerce-checkout-review-order { background: var(--kol); border: 1px solid var(--linje); padding: 26px; }
.cart_totals h2, #order_review_heading { font-family: var(--rubrik); font-size: 40px; margin: 0 0 18px; text-transform: uppercase; color: var(--vit); }
.sidtext .cart_totals table.shop_table th, .sidtext .cart_totals table.shop_table td, .sidtext table.shop_table.woocommerce-checkout-review-order-table th, .sidtext table.shop_table.woocommerce-checkout-review-order-table td {
	padding: 10px 0; border-bottom: 0; font-size: 15px; letter-spacing: 0; text-transform: none; color: var(--ljus); font-weight: 400;
}
.sidtext .cart_totals table.shop_table td, .sidtext table.shop_table.woocommerce-checkout-review-order-table tfoot td { text-align: right; }
.sidtext .cart_totals table.shop_table th { width: 40%; }
.sidtext .cart_totals table.shop_table .order-total th, .sidtext .cart_totals table.shop_table .order-total td, .sidtext table.shop_table.woocommerce-checkout-review-order-table .order-total th, .sidtext table.shop_table.woocommerce-checkout-review-order-table .order-total td {
	border-top: 1px solid #333; padding-top: 18px; font-family: var(--rubrik); font-size: 34px; color: var(--vit); letter-spacing: .04em;
}
.sidtext .cart_totals table.shop_table .order-total td, .sidtext table.shop_table.woocommerce-checkout-review-order-table .order-total td { color: var(--gron-ljus); }
.sidtext .order-total td strong, .sidtext .order-total td .amount { font-weight: 400; color: inherit; }
ul#shipping_method { list-style: none; margin: 0; padding: 0; }
ul#shipping_method li { display: flex; gap: 8px; justify-content: flex-end; align-items: center; }
.woocommerce-shipping-destination, .woocommerce-shipping-calculator { font-size: 12px; color: var(--gra); margin-top: 6px; }
.shipping-calculator-button { border-bottom: 1px solid var(--gron-ljus) !important; }
.wc-proceed-to-checkout { margin-top: 20px; }
.wc-proceed-to-checkout .checkout-button, #place_order { display: block; width: 100%; font-size: 26px; padding: 18px 12px 15px; }

/* Kassan: uppgifter till vänster, ordern och betalningen i en ruta till höger */
form.woocommerce-checkout { display: grid; grid-template-columns: 1fr 420px; gap: 0 40px; align-items: start; }
form.woocommerce-checkout > * { grid-column: 1 / -1; }
form.woocommerce-checkout #customer_details { grid-column: 1; grid-row: 1 / span 3; }
form.woocommerce-checkout #order_review_heading { grid-column: 2; grid-row: 1; background: var(--kol); border: 1px solid var(--linje); border-bottom: 0; padding: 26px 26px 0; margin: 0; }
form.woocommerce-checkout #order_review { grid-column: 2; grid-row: 2; border-top: 0; padding-top: 10px; }
#customer_details .col-1, #customer_details .col-2 { border: 1px solid var(--linje); background: var(--kol); padding: 26px; margin-bottom: 20px; }
#customer_details h3 { font-family: var(--rubrik); font-size: 34px; letter-spacing: .02em; text-transform: uppercase; margin: 0 0 18px; color: var(--vit); display: flex; align-items: center; gap: 10px; }
#ship-to-different-address label { display: flex; align-items: center; gap: 10px; font-family: var(--brod); font-size: 15px; text-transform: none; letter-spacing: 0; color: var(--ljus); cursor: pointer; }
.woocommerce-billing-fields__field-wrapper, .woocommerce-shipping-fields__field-wrapper, .woocommerce-additional-fields__field-wrapper { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.woocommerce-billing-fields__field-wrapper > *, .woocommerce-shipping-fields__field-wrapper > *, .woocommerce-additional-fields__field-wrapper > * { grid-column: 1 / -1; }
.woocommerce-checkout .form-row-first { grid-column: 1 / 2 !important; }
.woocommerce-checkout .form-row-last { grid-column: 2 / 3 !important; }
.woocommerce-checkout .form-row input.input-text, .woocommerce-checkout .form-row textarea, .woocommerce-checkout .form-row select { width: 100%; }
.woocommerce-checkout .form-row textarea { min-height: 90px; }
.woocommerce-checkout .optional { color: var(--gra); }
.woocommerce form .form-row.woocommerce-invalid input.input-text { border-color: #e05d4f; }
.woocommerce-checkout-review-order-table thead th { color: var(--gra); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; }
.woocommerce-checkout-review-order-table td.product-name { color: var(--vit); }
.woocommerce-checkout-review-order-table .product-quantity { color: var(--gra); font-weight: 400; }
.woocommerce-checkout-review-order-table tbody td { border-bottom: 1px solid var(--linje) !important; }
.woocommerce-checkout-review-order-table td.product-total { text-align: right; }
.woocommerce-form-coupon-toggle .woocommerce-info { display: block; }
.woocommerce-form-coupon-toggle a { border-bottom: 1px solid var(--gron-ljus); }
form.checkout_coupon { display: flex; gap: 0; max-width: 460px; margin: 0 0 20px; }
form.checkout_coupon p { margin: 0; }
form.checkout_coupon p:first-of-type:not(:only-child) { display: none; }
form.checkout_coupon .button { font-size: 20px; padding: 11px 18px 9px; background: transparent; color: var(--vit); border-color: var(--vit); }

/* Betalningen (Stripes kortfält ritas av Stripe själv inuti rutan och behåller sitt eget utseende) */
#payment { margin-top: 18px; }
#payment ul.payment_methods { list-style: none; margin: 0 0 18px; padding: 0; }
#payment ul.payment_methods li { border: 2px solid var(--ram); padding: 14px 16px; margin-bottom: 10px; }
#payment ul.payment_methods li > label { font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; }
#payment ul.payment_methods li img { display: inline-block; max-height: 22px; width: auto; vertical-align: middle; }
#payment ul.payment_methods li:has(input:checked) { border-color: var(--gron); }
#payment .payment_box { margin-top: 12px; color: var(--ljus); font-size: 14px; }
#payment .payment_box p { margin: 0 0 10px; }
#payment .place-order { margin: 0; }
.woocommerce-terms-and-conditions-wrapper { font-size: 13px; color: var(--ljus); line-height: 1.55; margin-bottom: 16px; }
.woocommerce-terms-and-conditions-wrapper a { color: var(--vit); border-bottom: 1px solid var(--gron-ljus); }
.woocommerce-form__label-for-checkbox { display: flex !important; gap: 10px; align-items: flex-start; margin-top: 10px; cursor: pointer; }
.woocommerce-form__label-for-checkbox input { margin-top: 3px; accent-color: var(--gron); }
input[type="radio"], input[type="checkbox"] { accent-color: var(--gron); }

/* Landsvalet i kassan (selectWoo/select2) */
.select2-container .select2-selection--single { background: var(--svart); border: 2px solid var(--ram); border-radius: 0; height: 48px; }
.select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--vit); line-height: 44px; padding-left: 14px; }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 44px; }
.select2-dropdown { background: var(--kol); border: 2px solid var(--ram); color: var(--vit); border-radius: 0; }
.select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option--highlighted[data-selected] { background: var(--gron); color: var(--vit); }
.select2-container--default .select2-search--dropdown .select2-search__field { background: var(--svart); color: var(--vit); border: 1px solid var(--ram); }

/* Orderbekräftelsen (steg 3, Klart) */
.woocommerce-order-overview { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 14px 30px; margin: 20px 0 30px; }
.woocommerce-order-overview li { color: var(--gra); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
.woocommerce-order-overview li strong { display: block; color: var(--vit); font-family: var(--rubrik); font-size: 24px; letter-spacing: .04em; font-weight: 400; margin-top: 4px; text-transform: none; }
.woocommerce-thankyou-order-received { font-family: var(--rubrik); font-size: 34px; line-height: 1.1; color: var(--gron-ljus); letter-spacing: .03em; }
.woocommerce-order-details, .woocommerce-customer-details { margin-top: 30px; }
.woocommerce-order-details h2, .woocommerce-customer-details h2 { font-size: 34px; margin-bottom: 14px; }
.woocommerce-customer-details address { font-style: normal; border: 1px solid var(--linje); background: var(--kol); padding: 18px; color: var(--ljus); }

/* Mitt konto */
.woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; margin: 0 0 28px; display: flex; flex-wrap: wrap; gap: 8px; }
.woocommerce-MyAccount-navigation a { display: block; font-family: var(--rubrik); font-size: 20px; letter-spacing: .06em; padding: 9px 14px 6px; border: 2px solid var(--ram); }
.woocommerce-MyAccount-navigation .is-active a { background: var(--vit); color: var(--svart); border-color: var(--vit); }
.woocommerce-form-login, .woocommerce-form-register, .woocommerce-ResetPassword, .woocommerce-EditAccountForm { max-width: 460px; }
.woocommerce form .form-row { display: flex; flex-direction: column; gap: 6px; margin: 0 0 14px; }
.woocommerce form .form-row label { font-size: 13px; color: var(--ljus); }
.woocommerce form .required { color: var(--gron-ljus); text-decoration: none; }
.woocommerce-form-login__rememberme { flex-direction: row !important; align-items: center; gap: 8px; }
.lost_password a { border-bottom: 1px solid var(--gron-ljus); }
table.shop_table { width: 100%; border-collapse: collapse; }
table.shop_table th, table.shop_table td { border-bottom: 1px solid var(--linje); padding: 12px 8px; text-align: left; }

/* Sidfot ------------------------------------------------------------------------------- */
.sidfot { padding: 56px 0 28px; }
.fot { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.4fr; gap: 40px; }
.fot h4 { font-family: var(--rubrik); font-size: 26px; letter-spacing: .06em; margin-bottom: 14px; text-transform: uppercase; }
.fot ul { list-style: none; margin: 0; padding: 0; }
.fot li { margin-bottom: 9px; color: var(--ljus); }
.fot li a:hover { color: var(--gron-ljus); }
.fot p { color: var(--ljus); line-height: 1.55; }
.fottext { margin-top: 16px; }
.nyhetsbrev { display: flex; margin-top: 10px; }
.nyhetsbrev input[type="email"] { flex: 1; min-width: 0; border-right: 0; }
.nyhetsbrev button { font-family: var(--rubrik); font-size: 20px; letter-spacing: .08em; background: var(--gron); color: var(--vit); border: 0; padding: 0 18px; cursor: pointer; }
.nyhetsbrev button:hover { background: var(--gron-ljus); }
.nyhetsbrev-svar { margin-top: 10px; font-size: 14px; }
.nyhetsbrev-svar.fel { color: #ff8a80; }
.copy { margin-top: 44px; padding-top: 20px; border-top: 1px solid var(--linje); display: flex; justify-content: space-between; color: var(--gra); font-size: 13px; }

/* Kompakt meny: när kategorierna inte får plats på en rad (tema.js), och alltid på mobil ---- */
.kompakt .menyknapp { display: block; }
.kompakt .huvud { gap: 18px; }
.kompakt .logga { margin-right: auto; }
.kompakt .korg { order: 2; }
.kompakt .menyknapp { order: 3; }
.kompakt .meny { order: 4; display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; gap: 0; overflow: visible; background: var(--svart); border-bottom: 1px solid var(--linje); padding: 8px 24px 16px; font-size: 26px; }
.kompakt .meny a { padding: 10px 0; border-bottom: 1px solid var(--linje); }
.meny-oppen .kompakt .meny { display: flex; }

.galleri { overflow: hidden; }
.single_add_to_cart_button.disabled { opacity: .6; }

/* Mobil ---------------------------------------------------------------------------------- */
@media (max-width: 900px) {
	.rad { padding: 0 16px; }
	.sida { padding-bottom: 48px; }
	.huvud { height: 64px; }
	.logga img { width: 38px; height: 38px; }
	.logga span { font-size: 20px; }
	.korg { font-size: 18px; padding: 5px 10px 3px; }
	.admin-bar .sidhuvud { top: 46px; }
	.meny { padding: 8px 16px 16px; }

	.hjalte .rad { grid-template-columns: 1fr; padding-top: 40px; padding-bottom: 48px; gap: 20px; }
	.hjalte-bild { order: -1; max-width: 300px; margin: 0 auto; }

	.kategorier { grid-template-columns: repeat(3, 1fr); }
	.kategorier a { border-bottom: 1px solid var(--linje); font-size: 22px; padding: 16px 4px 12px; }
	.kategorier a:nth-child(3n) { border-right: 0; }

	.rutnat, ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
	.kort .text { padding: 12px 12px 14px; }
	.kort .namn { font-size: 14px; }
	.kort .pris { font-size: 24px; }
	.marken { top: 8px; left: 8px; }
	.marke { font-size: 14px; }
	h2, .sektionstopp h2 { font-size: 42px; }

	.katrubrik { flex-direction: column; align-items: start; gap: 8px; padding-bottom: 22px; }
	.katrubrik h1 { font-size: 64px; }
	.stig { font-size: 11px; }
	.verktyg { flex-direction: column; align-items: stretch; }
	.woocommerce-ordering select { width: 100%; }

	div.product { grid-template-columns: 1fr; gap: 28px; padding-top: 16px; }
	.produktnamn { font-size: 52px; }
	.summary > .price, .woocommerce-variation-price .price { font-size: 40px; }
	.storlekar button { font-size: 20px; padding: 12px 2px 9px; }
	form.cart:not(.variations_form), .woocommerce-variation-add-to-cart { grid-template-columns: 120px 1fr; }
	.single_add_to_cart_button { font-size: 22px; }
	.flex-control-thumbs { grid-template-columns: repeat(4, 1fr); }

	.sidrubrik { font-size: 56px; margin: 24px 0 18px; }
	.steg li { font-size: 16px; gap: 6px; }
	.steg li b { width: 24px; height: 24px; }

	.fot { grid-template-columns: 1fr 1fr; gap: 28px; }
	.fot > div:first-child, .fot > div:last-child { grid-column: 1 / -1; }
	.copy { flex-direction: column; gap: 6px; }

	/* Klassisk varukorg och kassa på mobil: en kolumn, och varukorgens tabell blir kort per vara */
	.woocommerce-cart .sidtext > .woocommerce, form.woocommerce-checkout { grid-template-columns: 1fr; }
	form.woocommerce-checkout #customer_details, form.woocommerce-checkout #order_review_heading, form.woocommerce-checkout #order_review { grid-column: 1; grid-row: auto; }
	.cart-collaterals { margin-top: 24px; }
	table.cart thead { display: none; }
	table.cart tr.cart_item { display: grid; grid-template-columns: 80px 1fr auto; grid-template-areas: "bild namn bort" "bild antal summa"; gap: 8px 14px; padding: 16px 0; border-bottom: 1px solid var(--linje); }
	table.cart tr.cart_item td { padding: 0; border: 0; }
	table.cart td.product-thumbnail { grid-area: bild; width: auto; }
	table.cart td.product-thumbnail img { width: 80px; height: 80px; }
	table.cart td.product-name { grid-area: namn; }
	table.cart td.product-price { display: none; }
	table.cart td.product-quantity { grid-area: antal; }
	table.cart td.product-subtotal { grid-area: summa; align-self: center; font-size: 22px; }
	table.cart td.product-remove { grid-area: bort; }
	table.cart td::before { display: none !important; }
	table.cart td.actions { display: block; text-align: left; width: auto; padding: 24px 0 0; }
	table.cart td.actions .coupon { float: none; margin-bottom: 12px; }
	table.cart, table.cart tbody, table.cart tr:not(.cart_item) { display: block; width: 100%; }
	table.cart td.actions .coupon input.input-text { flex: 1; width: auto; min-width: 0; }
	table.cart td.actions button[name="update_cart"] { width: 100%; }
	.woocommerce-billing-fields__field-wrapper, .woocommerce-shipping-fields__field-wrapper { grid-template-columns: 1fr; }
	.woocommerce-checkout .form-row-first, .woocommerce-checkout .form-row-last { grid-column: 1 / -1 !important; }
	#customer_details .col-1, #customer_details .col-2, .cart-collaterals .cart_totals, .woocommerce-checkout-review-order { padding: 18px; }
	form.woocommerce-checkout #order_review_heading { padding: 18px 18px 0; }

	/* Samma kompakta meny som ovan, ifall skriptet inte har körts */
	.menyknapp { display: block; order: 3; }
	.logga { margin-right: auto; }
	.korg { order: 2; }
	.meny { order: 4; display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; gap: 0; overflow: visible; background: var(--svart); border-bottom: 1px solid var(--linje); padding: 8px 16px 16px; font-size: 26px; }
	.meny a { padding: 10px 0; border-bottom: 1px solid var(--linje); }
	.meny > :first-child { margin-left: 0; }
	.meny-oppen .meny { display: flex; }
}

/* Smala mobiler: korgen visar bara antalet och menyknappen bara symbolen */
@media (max-width: 520px) {
	.huvud { gap: 12px; }
	.korg-text, .menyknapp-text { display: none; }
	.korg em { margin-left: 0; }
	.menyknapp { font-size: 28px; }
	.sektionstopp { flex-wrap: wrap; align-items: baseline; }
	.sidrubrik { font-size: min(56px, 12vw); }
}

/* De minsta telefonerna (320 px, som WordPress mobilförhandsvisning): mindre logga så att korgen och menyknappen får plats */
@media (max-width: 380px) {
	.huvud { gap: 10px; }
	.logga { gap: 8px; }
	.logga img { width: 30px; height: 30px; }
	.logga span { font-size: 16px; }
	.korg { padding: 4px 8px 2px; }
	.kategorier a { font-size: 16px; padding: 14px 2px 10px; letter-spacing: .02em; overflow-wrap: anywhere; }
	.sidrubrik { font-size: 42px; overflow-wrap: anywhere; }
	.steg li { font-size: 13px; gap: 4px; letter-spacing: .04em; }
	.steg li b { width: 20px; height: 20px; font-size: 13px; }
	.katrubrik h1 { font-size: 52px; overflow-wrap: anywhere; }
}

/* Rutnäten i varukorgen och kassan får krympa under tabellernas naturliga bredd (annars flödar de över på smala skärmar) */
.woocommerce-cart .sidtext > .woocommerce > *, form.woocommerce-checkout > * { min-width: 0; }