/*
 * NELLCA Product Page — Delade stilar
 * Laddas på alla produktsidor oavsett layout.
 * Innehåller CSS-variabler och bas-reset för plugin-element.
 *
 * Breakpoints matchar Shoptimizer:
 *   480px  — liten mobil
 *   600px  — tablet start
 *   768px  — tablet/desktop-gräns (tvåkolumns-brytpunkt)
 *   992px  — stort desktop
 *
 * Gutter matchar Shoptimizer: 2.617924em
 * Max-width matchar Shoptimizer: 1170px
 */

:root {
	/* Layout */
	--nellca-pp-max-width:        1170px;
	--nellca-pp-gutter:           2.617924em;
	--nellca-pp-gutter-mobile:    1.2em;
	--nellca-pp-col-gap:          3rem;

	/* Hero */
	--nellca-pp-hero-height-mobile:  50vh;
	--nellca-pp-hero-height-desktop: 65vh;
	--nellca-pp-hero-bg:             #f5f5f5;

	/* Breadcrumb overlay */
	--nellca-pp-breadcrumb-bg:    rgba(255, 255, 255, 0.82);
	--nellca-pp-breadcrumb-blur:  4px;

	/* Produkthuvud */
	--nellca-pp-header-bg:        #fff;
	--nellca-pp-header-padding-y: 1rem;
	--nellca-pp-sku-color:        #888;
	--nellca-pp-sku-size:         0.85rem;

	/* Produktdata */
	--nellca-pp-data-bg:          #fafafa;
	--nellca-pp-data-border:      #e8e8e8;
	--nellca-pp-data-row-border:  #ebebeb;
	--nellca-pp-data-heading-gap: 0.75rem;

	/* Gallery dots */
	--nellca-pp-dot-size:         8px;
	--nellca-pp-dot-color:        rgba(255, 255, 255, 0.55);
	--nellca-pp-dot-active:       #fff;
	--nellca-pp-dot-gap:          6px;
}

/* ════════════════════════════════════════════════════════════
   PRISVISNING
   WooCommerce renderar priset på två ställen: p.price (statisk)
   och .woocommerce-variation-price (dynamisk, uppdateras av JS
   när en variant väljs). B2B-prisboxen ersätter båda.
   Döljs globalt på alla produktsidor oavsett layout.
   ════════════════════════════════════════════════════════════ */

.single-product .summary p.price,
.single-product .summary .woocommerce-variation-price {
	display: none !important;
}