/* Kategoriarkivet — sidhuvud, filterpanel, verktygsrad, grid */

/* =========================================================================
   Kategoriarkivet — sidhuvud, filterpanel, verktygsrad, produktgrid
   ========================================================================= */

/* Sidhuvud */
.nws-archive-head > .brxe-container { padding: 1.2rem var(--nws-gutter) 0; }
.nws-archive-head__row {
	display: flex;
	flex-direction: row; /* .brxe-block är kolumn som Bricks-default */
	align-items: flex-end;
	justify-content: space-between;
	gap: 4rem;
}
.nws-archive-head__copy { max-width: 76rem; }
.nws-archive-head__copy .brxe-heading { margin: 0 0 1rem; }
.nws-archive-head__intro { font-size: 1.8rem; line-height: 1.55; color: var(--nws-grey); text-wrap: pretty; }
.nws-archive-head__intro:empty { display: none; }
.nws-archive-head__stats { display: flex; gap: 1rem; flex: none; }
.nws-archive-stat {
	border: 1px solid var(--nws-grey-line);
	background: var(--nws-white);
	border-radius: var(--nws-radius-m);
	padding: 1.4rem 1.8rem;
	text-align: center;
}
.nws-archive-stat strong {
	display: block;
	font-family: field-gothic-compact, sans-serif;
	font-size: 2.4rem;
	font-weight: 600;
	line-height: 1;
	letter-spacing: -0.01em;
	color: var(--nws-black);
}
.nws-archive-stat span {
	display: block;
	font-size: 1.3rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 1;
	color: var(--nws-grey);
	margin-top: 0.6rem;
}

/* Underkategorier — chip-rad */
.nws-archive-subcats > .brxe-container { padding: 2rem var(--nws-gutter) 0; }
.nws-subcats { display: flex; flex-wrap: wrap; gap: 0.8rem; }
.nws-subcats__item {
	display: inline-flex;
	align-items: baseline;
	gap: 0.7rem;
	border: 1px solid var(--nws-grey-line);
	background: var(--nws-white);
	border-radius: var(--nws-radius-btn);
	padding: 1rem 1.4rem;
	font-size: 1.5rem;
	font-weight: 500;
	line-height: 1;
	color: var(--nws-black);
}
.nws-subcats__item:hover { border-color: var(--nws-grey); color: var(--nws-black); }
.nws-subcats__item.is-current { background: var(--nws-black); border-color: var(--nws-black); color: var(--nws-white); }
.nws-subcats__count { font-size: 1.3rem; color: var(--nws-grey); }
.nws-subcats__item.is-current .nws-subcats__count { color: rgba(255, 255, 255, 0.6); }

/* Layout: filterpanel | resultat */
.nws-archive > .brxe-container {
	padding: 2.4rem var(--nws-gutter) var(--space-xl);
	display: flex;
	flex-direction: column;
	gap: 1.6rem;
}
.nws-archive__layout {
	display: grid;
	grid-template-columns: 34rem minmax(0, 1fr);
	gap: 2.4rem;
	align-items: start;
}

/* Filterpanelen */
.nws-filters {
	position: sticky;
	top: 2.4rem;
	background: var(--nws-white);
	border: 1px solid var(--nws-grey-line);
	border-radius: var(--nws-radius-l);
	padding: 2.4rem 2.2rem;
	display: flex;
	flex-direction: column;
	gap: 2rem;
}
.nws-filters__head { display: flex; align-items: baseline; justify-content: space-between; gap: 1.6rem; }
.nws-filters__title { font-size: 2.1rem; font-weight: 600; line-height: 1; color: var(--nws-black); }
/* Elementets rot ÄR knappen (brxe-filter-submit bricks-button). */
button.nws-filters__clear {
	background: none;
	border: 0;
	padding: 0;
	font-size: 1.5rem;
	font-weight: 500;
	color: var(--nws-black);
	text-decoration: underline;
	cursor: pointer;
}
button.nws-filters__clear:hover { background: none; color: var(--nws-black); }
.nws-filters__group { border-top: 1px solid var(--nws-grey-soft); padding-top: 2rem; display: flex; flex-direction: column; gap: 1.2rem; }
.nws-filters__label { font-size: 1.7rem; font-weight: 600; line-height: 1; color: var(--nws-black); }
.nws-filters__hint { font-size: 1.4rem; line-height: 1.4; color: var(--nws-grey); margin-top: -0.6rem; }

/* Bricks filterelement (kryssrutor, radio/sortering) renderas som
   <fieldset>: nollställ ramen och utfyllnaden som UA/Woo ger dem. */
fieldset[data-brx-filter] { border: 0; padding: 0; margin: 0; min-width: 0; }
.nws-filters__checks {
	--brx-indicator-size: 2rem;
	--brx-indicator-border-width: 2px;
	--brx-indicator-border-color: var(--nws-grey-line);
	--brx-indicator-border-radius: 5px;
	--brx-indicator-bg-checked: var(--nws-black);
	--brx-indicator-border-color-checked: var(--nws-black);
	--brx-indicator-check-color-checked: var(--nws-green);
	--brx-indicator-focus-color: var(--nws-black);
	--brx-indicator-gap: 1.2rem;
	--brx-options-gap: 1.1rem;
	font-size: 1.6rem;
	color: var(--nws-black);
}
.nws-filters__checks .brx-option-text { font-weight: 500; }
.nws-filters__checks .brx-option-count { font-size: 1.5rem; color: var(--nws-grey); }
.nws-filters__checks .brx-show-more-less-button {
	background: none;
	border: 0;
	padding: 0;
	align-self: flex-start;
	font-size: 1.5rem;
	font-weight: 500;
	color: var(--nws-black);
	text-decoration: underline;
	cursor: pointer;
}

/* Chip-filter (knappläge) */
.nws-filters__chips .bricks-button {
	background: var(--nws-white);
	border: 1px solid var(--nws-grey-line);
	border-radius: var(--nws-radius-btn);
	padding: 1rem 1.3rem;
	font-size: 1.5rem;
	font-weight: 500;
	line-height: 1;
	color: var(--nws-grey);
	cursor: pointer;
}
.nws-filters__chips .bricks-button:hover { border-color: var(--nws-grey); }
.nws-filters__chips .bricks-button.brx-option-active {
	background: var(--nws-black);
	border-color: var(--nws-black);
	color: var(--nws-white);
}

/* Intervallfilter (pris, batterihälsa) */
.nws-filters__range { font-size: 1.5rem; color: var(--nws-grey); }
.nws-filters__range input[type="range"] { accent-color: var(--nws-black); }
.nws-filters__range input[type="number"],
.nws-filters__range input[type="text"] {
	border: 1.5px solid var(--nws-grey-line);
	border-radius: var(--nws-radius-s);
	padding: 0.8rem 1rem;
	font-size: 1.5rem;
	color: var(--nws-black);
	background: var(--nws-white);
}

/* Resultatkolumnen: verktygsrad → grid → paginering med luft emellan */
.nws-archive__results { display: flex; flex-direction: column; gap: 1.6rem; }

/* Verktygsraden */
.nws-archive__bar {
	background: var(--nws-white);
	border: 1px solid var(--nws-grey-line);
	border-radius: var(--nws-radius-m);
	padding: 1.4rem 2rem;
	display: flex;
	align-items: center;
	gap: 1rem 1.4rem;
	flex-wrap: wrap;
}
.nws-archive__count { font-size: 1.7rem; font-weight: 600; color: var(--nws-black); }
.nws-archive__active button,
.nws-archive__active .active-filter {
	display: inline-flex;
	align-items: center;
	gap: 0.8rem;
	background: var(--nws-black);
	border: 0;
	border-radius: var(--nws-radius-btn);
	padding: 1rem 1.3rem;
	font-size: 1.5rem;
	font-weight: 500;
	line-height: 1;
	color: var(--nws-white);
	cursor: pointer;
}
.nws-archive__sort { margin-left: auto; display: flex; align-items: center; gap: 1rem; }
.nws-archive__sort-label { font-size: 1.6rem; color: var(--nws-grey); }
.nws-archive__sort-pills .bricks-button {
	background: var(--nws-white);
	border: 1px solid var(--nws-grey-line);
	border-radius: var(--nws-radius-btn);
	padding: 1.1rem 1.4rem;
	font-size: 1.5rem;
	font-weight: 500;
	line-height: 1;
	color: var(--nws-grey);
	cursor: pointer;
}
.nws-archive__sort-pills .bricks-button:hover { border-color: var(--nws-grey); }
.nws-archive__sort-pills .bricks-button.brx-option-active {
	background: var(--nws-black);
	border-color: var(--nws-black);
	color: var(--nws-white);
}

/* Produktgrid — Bricks-loop där kortet renderas av Woo-loopens hookar */
.nws-archive__grid ul.products {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.8rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.nws-card__hooks { display: contents; } /* hook-utskriftens omslag ska inte synas i flödet */



/* Paginering */
.nws-archive__pages ul.page-numbers {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	justify-content: center;
	margin: 0;
	padding: 0;
	list-style: none;
}
.nws-archive__pages a.page-numbers,
.nws-archive__pages span.page-numbers {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 4rem;
	height: 4rem;
	padding: 0 1rem;
	border: 1px solid var(--nws-grey-line);
	border-radius: var(--nws-radius-s);
	background: var(--nws-white);
	font-size: 1.6rem;
	color: var(--nws-black);
}
.nws-archive__pages span.page-numbers.current { background: var(--nws-black); border-color: var(--nws-black); color: var(--nws-white); }
.nws-archive__pages a.page-numbers:hover { border-color: var(--nws-grey); }

/* Mobil: panelen som fullskärmslager bakom Filtrera-knappen.
   Stängknappen och "Visa X träffar"-raden injiceras av nws-header.js
   och finns bara när lagret använts — döljs ändå alltid på desktop. */
.nws-filters__togglebar { display: none; }
.nws-filters__stang,
.nws-filters__visa { display: none; }
@media (max-width: 991px) {
	.nws-archive__layout { grid-template-columns: 1fr; }
	.nws-archive__grid ul.products { grid-template-columns: repeat(2, 1fr); }
	.nws-filters { display: none; }
	.nws-filters.is-open {
		display: flex;
		position: fixed;
		inset: 0;
		z-index: 1300;
		border: 0;
		border-radius: 0;
		overflow-y: auto;
		overscroll-behavior: contain;
		padding: 2rem 2rem 0;
	}
	body.nws-filter-oppen { overflow: hidden; }
	.nws-filters.is-open .nws-filters__head {
		align-items: center;
		position: sticky;
		top: 0;
		background: var(--nws-white);
		margin: -2rem -2rem 0;
		padding: 1.8rem 2rem;
		border-bottom: 1px solid var(--nws-grey-soft);
		z-index: 1;
	}
	.nws-filters.is-open .nws-filters__stang {
		display: flex;
		align-items: center;
		justify-content: center;
		background: none;
		border: 0;
		font-size: 2.8rem;
		line-height: 1;
		color: var(--nws-grey);
		cursor: pointer;
		padding: 0.4rem;
		margin-left: auto;
	}
	.nws-filters.is-open .nws-filters__visa {
		display: block;
		position: sticky;
		bottom: 0;
		background: var(--nws-white);
		margin: auto -2rem 0;
		padding: 1.4rem 2rem calc(1.4rem + env(safe-area-inset-bottom));
		border-top: 1px solid var(--nws-grey-soft);
	}
	.nws-filters__visa-btn {
		width: 100%;
		background: var(--nws-green);
		color: var(--nws-black);
		border: 0;
		border-radius: var(--nws-radius-m);
		font-family: inherit;
		font-size: 1.8rem;
		font-weight: 600;
		line-height: 1;
		padding: 1.7rem;
		cursor: pointer;
	}
	.nws-filters__togglebar { display: block; }
	.nws-filters__toggle {
		width: 100%;
		background: var(--nws-white);
		border: 1.5px solid var(--nws-grey-line);
		border-radius: var(--nws-radius-m);
		padding: 1.4rem;
		font-size: 1.7rem;
		font-weight: 600;
		color: var(--nws-black);
		cursor: pointer;
	}
	.nws-archive__sort { margin-left: 0; width: 100%; }
}
@media (max-width: 478px) {
	.nws-archive__grid ul.products { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
	.nws-archive-head > .brxe-container,
	.nws-archive-subcats > .brxe-container,
	.nws-archive > .brxe-container { padding-left: 1.6rem; padding-right: 1.6rem; }
	.nws-archive-head__row { flex-direction: column; align-items: flex-start; gap: 2rem; }
}

/* Tomläget i arkivgridden (Bricks no_results_text) */
.bricks-posts-nothing-found { grid-column: 1 / -1; }
.nws-archive-empty {
	background: var(--nws-white);
	border: 1px solid var(--nws-grey-line);
	border-radius: var(--nws-radius-l);
	padding: 4.8rem 4rem;
	text-align: center;
}
.nws-archive-empty__title {
	font-family: field-gothic-compact, sans-serif;
	font-size: 2.8rem;
	font-weight: 400;
	line-height: 1.2;
	color: var(--nws-black);
	margin: 0 0 1rem;
}
.nws-archive-empty__text {
	font-size: 1.8rem;
	line-height: 1.55;
	color: var(--nws-grey);
	max-width: 52rem;
	margin: 0 auto 2.2rem;
}
.nws-archive-empty__btn {
	display: inline-block;
	background: var(--nws-black);
	color: var(--nws-white);
	font-size: 1.7rem;
	font-weight: 600;
	line-height: 1;
	padding: 1.5rem 2.2rem;
	border-radius: var(--nws-radius-btn);
}
.nws-archive-empty__btn:hover { background: var(--nws-black-hover-bg); color: var(--nws-black-hover-fg); }

/* Sökresultatens verktygsrad (mall 1141) — samma vita kort som arkivets,
   med WooCommerces räknare och sorteringsselect i stället för Bricks-delarna. */
.nws-archive__bar {
	background: var(--nws-white);
	border: 1px solid var(--nws-grey-line);
	border-radius: var(--nws-radius-l);
	padding: 1.8rem 2.4rem;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 2rem;
	margin-bottom: 2rem;
}
.nws-archive__bar .woocommerce-result-count { margin: 0; font-size: 1.7rem; font-weight: 600; color: var(--nws-black); }
.nws-archive__bar .nws-archive__sort { margin-left: auto; }
.nws-archive__bar .woocommerce-ordering { margin: 0; }
.nws-archive__bar select.orderby {
	font-family: inherit;
	font-size: 1.5rem;
	font-weight: 500;
	color: var(--nws-black);
	border: 1px solid var(--nws-grey-line);
	border-radius: var(--nws-radius-s);
	background: var(--nws-white);
	padding: 1.1rem 1.4rem;
	cursor: pointer;
}
