/* ArtOf B2B – priser, beställning och återförsäljare.
   Byggt av Micke (ArtOf · hello@artof.se) & Claude. */
:root {
	--artof-b2b-green: #1c3328;
	--artof-b2b-line: rgba(0, 0, 0, .12);
}

.artof-b2b-login-price a {
	font-size: .9em;
	letter-spacing: .02em;
	text-decoration: underline;
	text-underline-offset: 3px;
}
.artof-b2b-unit { opacity: .7; font-size: .75em; }

.artof-b2b-badges { margin: .4em 0 1em; display: flex; flex-wrap: wrap; gap: .5em; }
.artof-b2b-badge {
	display: inline-block;
	padding: .35em .8em;
	border-radius: 999px;
	font-size: .78rem;
	letter-spacing: .06em;
	text-transform: uppercase;
	line-height: 1.3;
}
.artof-b2b-badge--soon { background: #efe7d6; color: #6b4e12; }
.artof-b2b-badge--stock { background: #e3efe7; color: var(--artof-b2b-green); }
.artof-b2b-badge--sm { font-size: .68rem; margin: .3em 0; }

.artof-b2b-table-wrap { margin: 1.4em 0 1.6em; overflow-x: auto; }
.artof-b2b-table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.artof-b2b-table th,
.artof-b2b-table td { padding: .55em .7em; border-bottom: 1px solid var(--artof-b2b-line); text-align: left; white-space: nowrap; }
.artof-b2b-table th { font-weight: 600; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; opacity: .75; }
.artof-b2b-table .num { text-align: right; }
.artof-b2b-table-note { font-size: .8rem; opacity: .7; margin-top: .6em; }

.artof-b2b-box { margin: .4em 0 0; font-size: .9rem; opacity: .85; }

.artof-b2b-cta {
	margin: 1.4em 0;
	padding: 1.3em 1.4em;
	border: 1px solid var(--artof-b2b-line);
	border-left: 3px solid var(--artof-b2b-green);
	border-radius: 4px;
}
.artof-b2b-cta p { margin: 0 0 .7em; }
.artof-b2b-cta p:last-child { margin-bottom: 0; }
.artof-b2b-cta__btns { display: flex; flex-wrap: wrap; gap: .6em; }
.artof-b2b-cta .button { background: var(--artof-b2b-green); color: #fff; border: 1px solid var(--artof-b2b-green); }
.artof-b2b-cta .button.artof-b2b-ghost { background: transparent; color: var(--artof-b2b-green); }
.artof-b2b-cta__small { font-size: .85rem; opacity: .8; }

.artof-b2b-reg-intro { font-size: .92rem; opacity: .85; }
.artof-b2b-note-row td { border: 0 !important; padding-top: .6em !important; opacity: .75; }

/* v1.1: klickbar varianttabell, ryms utan sidscroll */
.artof-b2b-table-wrap { overflow-x: visible; }
.artof-b2b-table th, .artof-b2b-table td { white-space: normal; vertical-align: middle; }
.artof-b2b-table td small { display: block; opacity: .65; font-size: .75rem; margin-top: 2px; }
.artof-pick { display: block; width: 100%; padding: .55em .5em; border: 1px solid var(--artof-b2b-line, #d8d8d0); border-radius: 4px; background: #fff; color: inherit; cursor: pointer; font: inherit; font-weight: 600; text-align: center; line-height: 1.25; transition: background .15s, color .15s, border-color .15s; }
.artof-pick span { display: block; font-weight: 400; font-size: .72rem; opacity: .7; }
.artof-pick:hover { border-color: #1c3328; }
.artof-pick.is-on { background: #1c3328; border-color: #1c3328; color: #fff; }
.artof-pick[disabled] { opacity: .4; cursor: not-allowed; }
.artof-vt-hide form.variations_form table.variations { display: none; }
.artof-vt-hide form.variations_form .reset_variations { display: none !important; }
.artof-pick, .artof-pick .woocommerce-Price-amount, .artof-pick .woocommerce-Price-amount bdi { white-space: nowrap; }
.artof-pick .woocommerce-Price-amount { display: inline; font-weight: 600; }
.artof-pick span:not(.woocommerce-Price-amount):not(.woocommerce-Price-currencySymbol) { display: block; }
.artof-b2b-table th, .artof-b2b-table td { padding: .5em .35em; }
.artof-pick .woocommerce-Price-amount, .artof-pick .woocommerce-Price-currencySymbol { display: inline !important; font-size: inherit; opacity: 1; font-weight: 600; }
.artof-pick > span:last-child { display: block; }

/* Två knappar i produktlistor */
.artof-addrow { display: flex; gap: 8px; margin-top: 10px; }
.woocommerce ul.products li.product .artof-addrow a.button { flex: 1 1 0; margin: 0; padding: .7em .4em; text-align: center; white-space: nowrap; line-height: 1.2; }
.woocommerce ul.products li.product .artof-addrow a.button small { display: block; font-size: .7rem; font-weight: 400; opacity: .75; letter-spacing: 0; }
.woocommerce ul.products li.product .artof-addrow a.added::after { display: none; }
.woocommerce ul.products li.product .artof-addrow + a.added_to_cart { display: block; margin-top: 8px; font-size: .85rem; }

/* Jämna produktkort: titel reserverar 3 rader, pris och knappar ligger i linje */
.woocommerce ul.products li.product { display: flex; flex-direction: column; }
.woocommerce ul.products li.product .woocommerce-LoopProduct-link { display: flex; flex-direction: column; flex: 1 1 auto; }
.woocommerce ul.products li.product .woocommerce-loop-product__title { line-height: 1.4; min-height: 4.2em; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.woocommerce ul.products li.product .price { margin-top: auto; min-height: 2.6em; }
.woocommerce ul.products li.product > .artof-addrow,
.woocommerce ul.products li.product > a.button { margin-top: 10px; }
.woocommerce ul.products li.product > a.button { align-self: stretch; text-align: center; }

/* Resultatdiagram i produktbeskrivning */
.artof-chart { margin: 1.6em 0; padding: 1.4em 1.2em 1em; background: #f4f6f1; border: 1px solid var(--artof-b2b-line); border-radius: 10px; }
.artof-chart__title { margin: 0 0 1em; text-align: center; font-weight: 700; font-size: 1.1em; color: var(--artof-b2b-green); }
.artof-chart__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2em; }
.artof-chart__col h4 { margin: 0 0 .8em; text-align: center; font-size: 1em; color: var(--artof-b2b-green); }
.artof-chart__bars { display: flex; align-items: flex-end; justify-content: center; gap: 8px; height: 220px; padding-top: 56px; box-sizing: border-box; border-bottom: 2px solid rgba(0,0,0,.15); }
.artof-chart__bar { position: relative; flex: 1 1 0; max-width: 90px; border-radius: 6px 6px 0 0; }
.artof-chart__bar.is-ctrl { background: #b9a79b; }
.artof-chart__bar.is-mist { background: linear-gradient(180deg, #3f7a56, #1c3328); }
.artof-chart__bar.h100 { height: 100%; } .artof-chart__bar.h77 { height: 77%; } .artof-chart__bar.h60 { height: 60%; } .artof-chart__bar.h39 { height: 39%; }
.artof-chart__bar b { position: absolute; left: 0; right: 0; bottom: 100%; margin-bottom: 4px; text-align: center; font-size: .78em; line-height: 1.2; color: var(--artof-b2b-green); }
.artof-chart__labels { display: flex; justify-content: center; gap: 8px; margin-top: .5em; }
.artof-chart__labels span { flex: 1 1 0; max-width: 90px; text-align: center; font-size: .78em; line-height: 1.2; }
.artof-chart__note { margin: 1em 0 0; font-size: .8em; opacity: .75; text-align: center; }
@media (max-width: 600px) { .artof-chart__grid { grid-template-columns: 1fr; } .artof-chart__bars { height: 190px; } }

/* Återförsäljarlista */
.artof-stores { list-style: none; margin: 0 0 2.2em; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; }
.artof-stores li { margin: 0; padding: 16px 18px; border: 1px solid var(--artof-b2b-line); border-left: 3px solid var(--artof-b2b-green); border-radius: 8px; background: #f7f8f4; display: flex; flex-direction: column; gap: 4px; line-height: 1.4; }
.artof-stores li::before { display: none; }
.artof-stores strong { font-size: 1.05em; color: var(--artof-b2b-green); }
.artof-stores a { margin-top: 4px; font-size: .92em; word-break: break-all; }
.artof-stores li:target { box-shadow: 0 0 0 3px #c6d67c; }
.artof-instore { margin: 1em 0 0; padding: .7em .9em; border: 1px dashed var(--artof-b2b-line); border-radius: 6px; font-size: .92em; display: flex; flex-wrap: wrap; gap: .3em .8em; align-items: center; }
.artof-instore a { font-weight: 600; }

/* ---------- Odlingstips & råd: guidesidor (undersidor till Rådgivning) ---------- */
.parent-pageid-2583 .artof-content { font-size: 1.04rem; line-height: 1.7; }
.parent-pageid-2583 .artof-content h2 { margin: 2.4em 0 .7em; padding-top: .9em; border-top: 1px solid rgba(29,29,27,.14); }
.parent-pageid-2583 .artof-content h3 { margin: 1.6em 0 .4em; font-size: 1.15em; }
.parent-pageid-2583 .artof-content table { width: 100%; margin: 1em 0 1.6em; border-collapse: collapse; font-size: .95em; line-height: 1.5; }
.parent-pageid-2583 .artof-content th, .parent-pageid-2583 .artof-content td { padding: 11px 14px; border-bottom: 1px solid rgba(29,29,27,.12); text-align: left; vertical-align: top; }
.parent-pageid-2583 .artof-content thead th { background: #eef2ea; color: #1f3b2d; font-size: .78em; letter-spacing: .12em; text-transform: uppercase; border-bottom: 2px solid #3d5f4d; }
.parent-pageid-2583 .artof-content tbody th { width: 30%; color: #1f3b2d; font-weight: 700; background: #f6f7f3; }
.parent-pageid-2583 .artof-content tbody tr:hover td { background: #fafbf8; }
.artof-guide-figs { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 18px; margin: 1.2em 0 1.4em; align-items: start; }
.artof-guide-fig { margin: 1.2em 0 1.4em; }
.artof-guide-figs .artof-guide-fig { margin: 0; }
.artof-guide-fig img { display: block; width: 100%; height: auto; border-radius: 10px; }
.artof-guide-fig--rr img { max-width: 300px; margin: 0 auto; }
.artof-guide-fig figcaption { margin-top: 8px; font-size: .85em; line-height: 1.45; color: rgba(29,29,27,.64); }
.artof-guide-cta { margin-top: 2.6em; padding: 18px 22px; border-left: 3px solid #3d5f4d; background: #f3f5ef; border-radius: 0 10px 10px 0; }
.artof-guide-cta a { font-weight: 700; white-space: nowrap; }
.artof-guide-note { padding: 16px 20px; border: 1px solid rgba(29,29,27,.18); border-radius: 10px; font-size: .94em; }
@media (max-width: 700px) {
	.parent-pageid-2583 .artof-content table, .parent-pageid-2583 .artof-content tbody, .parent-pageid-2583 .artof-content tr, .parent-pageid-2583 .artof-content th, .parent-pageid-2583 .artof-content td { display: block; width: 100%; }
	.parent-pageid-2583 .artof-content thead { display: none; }
	.parent-pageid-2583 .artof-content tr { margin-bottom: 12px; border: 1px solid rgba(29,29,27,.14); border-radius: 10px; overflow: hidden; }
	.parent-pageid-2583 .artof-content th, .parent-pageid-2583 .artof-content td { border-bottom: 0; padding: 8px 14px; }
	.parent-pageid-2583 .artof-content tbody th { background: #eef2ea; }
	.parent-pageid-2583 .artof-content td[data-label]::before { content: attr(data-label); display: block; font-size: .72em; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #3d5f4d; }
}
.artof-unit { text-align: center; font-weight: 600; color: #555; }
.artof-unit > span:not(.woocommerce-Price-amount) { display: block; font-weight: 400; font-size: .72rem; opacity: .7; }
.artof-unit .woocommerce-Price-amount, .artof-unit .woocommerce-Price-amount * { display: inline !important; white-space: nowrap; font-size: inherit; opacity: 1; }
/* Efter "Lägg till": ingen extra länk som trycker ihop knapparna; knappen blir grön en stund och kan klickas igen. */
.artof-addrow { align-items: flex-start; }
.woocommerce ul.products li.product .artof-addrow a.added_to_cart { display: none !important; }
.woocommerce ul.products li.product .artof-addrow a.button.added { background: #1c3328; color: #fff; }
.woocommerce ul.products li.product .artof-addrow a.button.loading { opacity: .6; }
/* Mobil: enhetliga produktkort. Lika bildyta, titel/pris i fast höjd och knappar i botten, staplade så inget rinner utanför. */
@media (max-width: 768px) {
	.woocommerce ul.products li.product { display: flex; flex-direction: column; }
	.woocommerce ul.products li.product a img, .woocommerce ul.products li.product .attachment-woocommerce_thumbnail { width: 100%; aspect-ratio: 1 / 1; height: auto; object-fit: contain; }
	.woocommerce ul.products li.product .woocommerce-loop-product__title { min-height: 3.9em; }
	.woocommerce ul.products li.product .price { min-height: 2.4em; }
	.woocommerce ul.products li.product > .artof-addrow, .woocommerce ul.products li.product > a.button { margin-top: auto; }
	.artof-addrow { flex-direction: column; align-items: stretch; width: 100%; }
	.woocommerce ul.products li.product .artof-addrow a.button { flex: 0 0 auto; width: 100%; box-sizing: border-box; min-height: 3.2em; display: flex; flex-direction: column; justify-content: center; align-items: center; }
	.woocommerce ul.products li.product > a.button { width: 100%; box-sizing: border-box; min-height: 3.2em; text-align: center; }
}

/* ===== Enhetliga köpknappar i produktlistor (alla lika breda och höga) ===== */
.woocommerce ul.products li.product .artof-addrow { display: flex; gap: 10px; width: 100%; margin-top: auto; padding-top: 12px; align-items: stretch; flex-direction: row; }
.woocommerce ul.products li.product .artof-addrow a.button.artof-add {
	flex: 1 1 0; min-width: 0; box-sizing: border-box; height: 58px; min-height: 58px; margin: 0; padding: 0 8px;
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
	background: transparent; color: #1c3328; border: 1.5px solid #1c3328; border-radius: 999px;
	text-align: center; white-space: nowrap; line-height: 1; box-shadow: none;
	transition: background .2s ease, color .2s ease, transform .15s ease;
}
.woocommerce ul.products li.product .artof-addrow a.button.artof-add .artof-b-main { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.woocommerce ul.products li.product .artof-addrow a.button.artof-add .artof-b-sub { font-size: 11px; font-weight: 500; letter-spacing: .04em; opacity: .7; text-transform: none; }
.woocommerce ul.products li.product .artof-addrow a.button.artof-add:hover { background: #1c3328; color: #fff; }
.woocommerce ul.products li.product .artof-addrow a.button.artof-add:active { transform: scale(.97); }
.woocommerce ul.products li.product .artof-addrow a.button.artof-add.added { background: #1c3328; color: #fff; }
.woocommerce ul.products li.product .artof-addrow a.button.artof-add.added .artof-b-sub::before { content: "✓ "; }
.woocommerce ul.products li.product .artof-addrow a.button.artof-add.loading { opacity: .6; }
.woocommerce ul.products li.product .artof-addrow a.button.artof-add.loading::after, .woocommerce ul.products li.product .artof-addrow a.button.artof-add.added::after { display: none; }
@media (max-width: 768px) {
	.woocommerce ul.products li.product .artof-addrow { flex-direction: column; gap: 8px; }
	.woocommerce ul.products li.product .artof-addrow a.button.artof-add { flex: 0 0 auto; width: 100%; height: 58px; min-height: 58px; }
}
/* Samma mått överallt: knapparna ligger alltid under varandra, full kortbredd. */
.woocommerce ul.products li.product .artof-addrow { flex-direction: column; gap: 8px; }
.woocommerce ul.products li.product .artof-addrow a.button.artof-add { flex: 0 0 auto; width: 100%; }

/* Mobil: rutnät där alla kort i en rad blir lika höga, så knapparna hamnar på samma nivå. */
@media (max-width: 768px) {
	.woocommerce ul.products { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 16px; align-items: stretch; }
	.woocommerce ul.products::before, .woocommerce ul.products::after { display: none !important; }
	.woocommerce ul.products li.product { float: none !important; width: auto !important; margin: 0 !important; height: 100%; }
	.woocommerce ul.products li.product .woocommerce-loop-product__title { min-height: 3lh; margin-bottom: 0; }
	.woocommerce ul.products li.product .price { min-height: 2lh; }
}
@media (max-width: 768px) {
	/* Knapparna börjar på samma höjd i varje rad (direkt under pris), inte längst ned. */
	.woocommerce ul.products li.product > .artof-addrow, .woocommerce ul.products li.product > a.button { margin-top: 0; }
	.woocommerce ul.products li.product .artof-addrow { justify-content: flex-start; }
}
@media (max-width: 768px) {
	.woocommerce ul.products li.product > a.woocommerce-LoopProduct-link { flex: 0 0 auto !important; }
}
@media (max-width: 768px) {
	.woocommerce ul.products li.product .woocommerce-loop-product__title { min-height: 4lh; }
}

/* ArtOf: antal kartonger */
.artof-cartons { display: inline-flex; align-items: center; gap: .6em; flex-wrap: wrap; vertical-align: middle; }
.artof-cartons__n { width: 4.5em; text-align: center; }
.artof-cartons__lbl { font-size: .85em; opacity: .8; }
.woocommerce .artof-cartons .artof-cartons__n, .woocommerce-cart .artof-cartons .artof-cartons__n { width: 4.5em !important; max-width: 4.5em; flex: none; }

.artof-b2b-table td.artof-picks .artof-pick + .artof-pick { margin-top: 6px; }
