/*
 * King Webshops | shop.css
 * Alleen op categorie-, tag- en zoekpagina's.
 */

/* =========================================================================
   Lees meer / Lees minder (categorietekst op mobiel, werkt met assets/js/lees-meer.js)
   ========================================================================= */
.mobile-nav-toggle,
.read-more-less-btn {
	display: none;
	width: fit-content;
}

@media (max-width: 1200px) {
	.mobile-nav-toggle,
	.read-more-less-btn {
		display: block;
	}

	#primary-navigation[data-visible="false"] {
		height: 46px;
		overflow: hidden;
	}

	#primary-navigation[data-visible="false"]:after {
		background: linear-gradient(90deg, rgb(255 255 255 / 0), #fff 50%);
		bottom: 0;
		content: "";
		height: 22px;
		max-width: 150px;
		position: absolute;
		right: 0;
		text-align: right;
		width: 50%;
	}
}

/* Volgorde in de kolom: titel/omschrijving, dan de Lees meer-knop, dan de rest */
.archive .elementor-element-populated > * {
	order: 3;
}

.archive .elementor-element-populated > .elementor-page-title,
.archive .elementor-element-populated > .elementor-widget-woocommerce-archive-description {
	order: 1;
}

.archive .elementor-element-populated > .mobile-nav-toggle {
	order: 2;
}

.box-toggle {
	border: none;
}

/* =========================================================================
   Gerelateerde categorieën (strook met kaartjes, o.a. op Schaakset kopen)
   ========================================================================= */
.related-categories-component {
	display: flex;
	align-items: center;
}

.related-categories-carousel {
	display: flex;
	align-items: center;
	margin: 0.5rem 0 0.5rem -0.5rem;
	padding-left: 0;
	overflow-y: hidden;
}

.filmstrip-card {
	flex: none;
	padding-left: 0.5rem;
	list-style-type: none;
}

.related-categories-card {
	border: 1px solid var(--king-rand);
	padding: 0.5rem;
	border-radius: 0.25rem;
	display: flex;
	align-items: center;
}

.related-categories-card-image {
	max-width: 4em;
	height: 3em;
	margin: 0 0.5em 0 0;
}

.related-categories-card-image > a {
	display: flex;
	align-items: center;
	height: 100%;
	overflow: hidden;
}

.related-categories-card-image > a img {
	width: 100%;
	height: 100%;
}

.related-categories-card-text a,
.related-categories-card-text a:hover {
	text-decoration: none !important; /* wint van de algemene linkstijl */
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--king-tekst);
}

/* =========================================================================
   Filter en sorteren
   ========================================================================= */
.wcpf-button-action-reset {
	color: var(--king-rood) !important;      /* overschrijft de filterplugin */
	border-radius: 8px !important;
}

.wcpf-button-action-reset:hover {
	background-color: var(--king-rood) !important;
	color: #fff !important;
}

.wcpf-button-action-reset:active {
	background-color: #fff !important;
	color: var(--king-rood) !important;
	border-radius: 8px !important;
	border: 1px solid var(--king-rand) !important;
}

.orderby {
	border-radius: 8px;
}

.woocommerce .woocommerce-ordering select {
	vertical-align: top;
	background-color: #fff;
}

@media (max-width: 1024px) {
	.woocommerce-ordering,
	.woocommerce .woocommerce-ordering select {
		width: 100%;
	}

	.orderby {
		text-align: center;
		font-size: 13px;
	}
}