/* sk-cards 2026-10-21: compact B2B product cards ([sk_related_products] on the product page, [sk_product_cards] on the
   front page; plugin sk-product-page). Scoped to the section class .sk-rel, so nothing outside the card list is affected.
   Quantity: CPA's input[name=quantity] with [-]/[+] from js/sk-qty.js. */
.sk-rel{--sk-r:8px}
.sk-rel .sk-pp-stock p{margin:0}
.sk-rel .sk-pp-stock-status{display:flex;align-items:center;line-height:1.3;color:var(--sk-deep-blue)}
.sk-rel .sk-pp-stock-status .sk-pp-ico{flex:none;color:var(--sk-blue-03)}
.sk-rel .sk-pp-stock.is-out .sk-pp-ico{color:var(--sk-muted)}
.sk-rel .sk-rel-list{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 48px)/4);gap:16px;margin:0;padding:2px 2px 8px;list-style:none;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain}
.sk-rel .sk-rel-card{display:grid;grid-template-columns:88px minmax(0,1fr);grid-template-rows:1fr auto;column-gap:14px;row-gap:14px;margin:0;padding:14px;background:var(--sk-surface);border:1px solid var(--sk-border);border-radius:var(--sk-r);scroll-snap-align:start}
.sk-rel .sk-rel-thumb{display:block;width:88px;height:88px;border-radius:var(--sk-r);overflow:hidden;background:var(--sk-bg)}
.sk-rel .sk-rel-thumb img{width:100%;height:100%;object-fit:cover}
.sk-rel .sk-rel-body p{margin:0}
.sk-rel .sk-rel-title{margin:0 0 2px;font-size:15px;line-height:1.3;font-weight:700}
.sk-rel .sk-rel-title a{color:var(--sk-deep-blue)}
.sk-rel .sk-rel-title a:hover{color:var(--sk-blue-03)}
.sk-rel .sk-rel-sku{font-size:13px;color:var(--sk-muted)}
/* price (sk_pp_price_stack): pallet price as the primary price, anbrudspris labelled underneath (customer meeting 22-10) */
.sk-rel .sk-rel-price{margin:6px 0 4px;font-size:12px;line-height:1.4;color:var(--sk-muted)}
.sk-rel .sk-rel-price .sk-price-main{font-size:17px;font-weight:700;line-height:1.2;color:var(--sk-deep-blue)}
.sk-rel .sk-rel-price.is-tiered .sk-price-main{color:var(--sk-blue-03)}
.sk-rel .sk-rel-price .sk-price-main :is(.amount,bdi){color:inherit;font-size:inherit;font-weight:inherit}
.sk-rel .sk-rel-price .woocommerce-price-suffix{display:none}
.sk-rel .sk-rel-price .sk-price-anbrud{margin-top:2px;color:var(--sk-text)}
.sk-rel .sk-rel-price .sk-price-anbrud :is(span,.amount,bdi){font-weight:600;color:inherit;font-size:inherit}
.sk-rel .sk-rel-card .sk-pp-stock{padding:0;background:none;border:0}
.sk-rel .sk-rel-card .sk-pp-stock-status{gap:6px;font-size:13px;font-weight:600}
.sk-rel .sk-rel-card .sk-pp-stock-status .sk-pp-ico{width:16px;height:16px}
.sk-rel .sk-rel-units{margin-top:2px!important;font-size:13px;color:var(--sk-muted)}
.sk-rel .sk-rel-buy{grid-column:1/-1;align-self:end}
.sk-rel .sk-rel-buy .cpa-loop-purchase-control{display:flex;flex-wrap:nowrap;align-items:center;gap:10px;margin:0}
.sk-rel .sk-rel-buy .cpa-uom-control--fixed{display:none}
.sk-rel .sk-rel-buy .cpa-uom-control:not(.cpa-uom-control--fixed){flex:0 0 100%}
.sk-rel .sk-rel-buy .cpa-loop-purchase-control:has(.cpa-uom-control:not(.cpa-uom-control--fixed)){flex-wrap:wrap}
.sk-rel .sk-rel-buy .cpa-uom-quantity>span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.sk-rel .sk-rel-buy .button{flex:1 1 auto;min-height:44px;height:44px;margin:0;padding:0 12px;background:var(--sk-blue-03);color:#fff;border-radius:var(--sk-r);font-size:14px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;white-space:nowrap}
.sk-rel .sk-rel-buy .button:hover{background:var(--sk-blue-02);color:#fff}
/* stepper markup from js/sk-qty.js (same control as the shop list) */
.sk-rel .cpa-uom-quantity.sk-qty{position:relative;display:inline-flex;flex:0 0 112px;flex-direction:row;flex-wrap:nowrap;align-items:stretch;gap:0;width:112px;height:44px;margin:0;border:1px solid var(--sk-muted);border-radius:var(--sk-r);background:var(--sk-surface);overflow:hidden}
.sk-rel .cpa-uom-quantity.sk-qty input[name="quantity"]{flex:1 1 auto;min-width:0;width:auto;height:100%;padding:0;border:0;border-left:1px solid var(--sk-border);border-right:1px solid var(--sk-border);border-radius:0;text-align:center;color:var(--sk-deep-blue);font-weight:600;-moz-appearance:textfield;appearance:textfield;box-shadow:none}
.sk-rel .cpa-uom-quantity.sk-qty input::-webkit-outer-spin-button,.sk-rel .cpa-uom-quantity.sk-qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.sk-rel .sk-qty-btn{flex:0 0 34px;width:34px;min-height:0;padding:0;margin:0;border:0;border-radius:0;background:var(--sk-surface);color:var(--sk-deep-blue);font-size:20px;line-height:1;box-shadow:none;cursor:pointer}
.sk-rel .sk-qty-btn:hover{background:var(--sk-blue-05)}
.sk-rel .sk-qty-btn:focus-visible,.sk-rel .cpa-uom-quantity.sk-qty input:focus-visible{outline:2px solid var(--sk-blue-03);outline-offset:-2px}
.sk-rel .cpa-uom-quantity.sk-qty:focus-within{border-color:var(--sk-blue-03)}
@media(max-width:1200px){.sk-rel .sk-rel-list{grid-auto-columns:calc((100% - 32px)/3)}}
@media(max-width:1024px){.sk-rel .sk-rel-list{grid-auto-columns:calc((100% - 16px)/2)}}
@media(max-width:767px){.sk-rel .sk-rel-list{grid-auto-columns:86%}}