/* =========================================================
   KEN'S DISTRIBUTING
   DYNAMIC CATEGORY TEMPLATE
   ========================================================= */


/* =========================================================
   PAGE
   ========================================================= */

.kendisco-category-main {
	--kendisco-category-width: 1440px;

	width: 100%;
	max-width: none;

	margin: 0;
	padding: 0;

	background: #F9FAFB;
}


.kendisco-category-main *,
.kendisco-category-main *::before,
.kendisco-category-main *::after {
	box-sizing: border-box;
}


/* =========================================================
   BREADCRUMBS
   ========================================================= */

.kendisco-category-breadcrumbs {
	width: 100%;
	max-width: var(--kendisco-category-width);

	margin: 0 auto !important;

	padding: 7px 20px !important;

	border-bottom: 1px solid #E5E7EB;

	background: #F9FAFB;

	color: #334155;

	font-size: 12px;
	font-weight: 400;
	line-height: 1.5;
}


.kendisco-category-breadcrumbs a {
	color: #334155;

	font-size: inherit;
	font-weight: 400;

	text-decoration: none;
}


.kendisco-category-breadcrumbs a:hover,
.kendisco-category-breadcrumbs a:focus {
	color: #FF5F14;
}


.kendisco-category-breadcrumb-separator {
	display: inline-block;

	margin: 0 5px;

	color: #334155;
}


/* =========================================================
   HERO
   ========================================================= */

.kendisco-category-hero {
	width: 100%;

	margin: 0;
	padding: 0;

	background: #0F172A;
}


.kendisco-category-hero-inner {
	width: 100%;
	max-width: var(--kendisco-category-width);

	margin: 0 auto;

	padding: 28px 20px;

	display: grid;

	grid-template-columns:
		minmax(0, 1fr)
		minmax(380px, 460px);

	gap: 50px;

	align-items: start;
}


.kendisco-category-hero-content {
	width: 100%;
	min-width: 0;

	padding-top: 10px;
}


/* =========================================================
   H1
   ========================================================= */

.kendisco-category-title {
	margin: 0 0 12px 0 !important;
	padding: 0 !important;

	color: #FFFFFF !important;

	font-family: inherit !important;
	font-size: 28px !important;
	font-style: normal !important;
	font-weight: 600 !important;
	line-height: 1.25 !important;
	letter-spacing: 0 !important;

	opacity: 1 !important;
	visibility: visible !important;
	transform: none !important;
	animation: none !important;
	transition: none !important;
}


/* =========================================================
   DESCRIPTION
   ========================================================= */

.kendisco-category-description {
	width: 100%;
	max-width: 800px;

	color: #FFFFFF !important;

	font-size: 14px;
	font-weight: 400;
	line-height: 1.6;

	opacity: 1 !important;
	visibility: visible !important;
	transform: none !important;
	animation: none !important;
}


.kendisco-category-description p,
.kendisco-category-description span,
.kendisco-category-description li,
.kendisco-category-description strong,
.kendisco-category-description em {
	color: #FFFFFF !important;
}


.kendisco-category-description p {
	margin-top: 0;
	margin-bottom: 10px;
}


.kendisco-category-description p:last-child {
	margin-bottom: 0;
}


.kendisco-category-description a {
	color: #FFFFFF !important;

	text-decoration: underline;
}


.kendisco-category-description a:hover,
.kendisco-category-description a:focus {
	color: #FF5F14 !important;
}


/* =========================================================
   CATEGORY FORM
   ========================================================= */

.kendisco-category-form {
	width: 100%;
	max-width: 100%;
	min-width: 0;

	/*
	 * Reserve the quote form's above-the-fold space before
	 * Elementor finishes applying its generated CSS.
	 */
	min-height: 330px;

	margin: 0;
	padding: 0;

	align-self: start;

	background: #FFFFFF;

	border-radius: 8px;

	overflow: hidden;
}


.kendisco-category-form > .elementor {
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;
}


.kendisco-category-form .e-con,
.kendisco-category-form .elementor-section,
.kendisco-category-form .elementor-container {
	width: 100% !important;
	max-width: 100% !important;
}


/* =========================================================
   FORM CLS FALLBACK
   ========================================================= */

.kendisco-category-form .elementor-form-fields-wrapper {
	display: flex;

	flex-wrap: wrap;

	width: 100%;
}


.kendisco-category-form .elementor-field-group {
	min-width: 0;
}


.kendisco-category-form .elementor-col-100 {
	width: 100%;
}


.kendisco-category-form .elementor-col-50 {
	width: 50%;
}


.kendisco-category-form .elementor-col-40 {
	width: 40%;
}


.kendisco-category-form .elementor-col-33 {
	width: 33.333333%;
}


.kendisco-category-form .elementor-col-30 {
	width: 30%;
}


.kendisco-category-form .elementor-col-25 {
	width: 25%;
}


.kendisco-category-form input,
.kendisco-category-form textarea,
.kendisco-category-form select,
.kendisco-category-form button {
	max-width: 100%;
}


/* =========================================================
   CATEGORY BODY
   ========================================================= */

.kendisco-category-body {
	width: 100%;
	max-width: var(--kendisco-category-width);

	margin: 0 auto;

	padding: 24px 20px 40px;

	align-items: start;
}


.kendisco-category-body.has-sidebar {
	display: grid;

	grid-template-columns:
		260px
		minmax(0, 1fr);

	gap: 24px;
}


.kendisco-category-body.no-sidebar {
	display: block;
}


/* =========================================================
   STICKY SIDEBAR
   ========================================================= */

.kendisco-category-sidebar {
	position: sticky;

	top: 20px;

	align-self: start;

	width: 100%;
	min-width: 0;

	max-height: calc(100vh - 40px);

	overflow-y: auto;

	margin: 0;

	padding: 26px 22px;

	background: #0F172A;

	border-radius: 5px;

	color: #FFFFFF;

	scrollbar-width: thin;
}


.kendisco-category-sidebar-title {
	position: relative;

	margin: 0 0 18px 0;

	padding: 0 0 13px 0;

	border-bottom:
		1px solid
		rgba(255,255,255,0.15);

	color: #FFFFFF !important;

	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;

	text-transform: uppercase;
}


.kendisco-category-sidebar-title::after {
	content: "";

	position: absolute;

	left: 0;
	bottom: -1px;

	width: 42px;
	height: 3px;

	background: #FF5F14;
}


.kendisco-category-sidebar-nav {
	display: flex;

	flex-direction: column;

	width: 100%;
}


.kendisco-category-sidebar-link {
	display: block;

	width: 100%;

	padding: 11px 0;

	border-bottom:
		1px solid
		rgba(255,255,255,0.15);

	color: #FFFFFF !important;

	font-size: 13px;
	font-weight: 400;
	line-height: 1.4;

	text-decoration: none;

	transform: translateX(0);

	transition:
		color 0.15s ease,
		transform 0.15s ease;
}


.kendisco-category-sidebar-link:hover,
.kendisco-category-sidebar-link:focus {
	color: #FF5F14 !important;

	/*
	 * Visual movement only. Padding stays unchanged,
	 * so hover does not change layout geometry.
	 */
	transform: translateX(4px);
}


/* =========================================================
   RESULTS
   ========================================================= */

.kendisco-category-results {
	width: 100%;
	min-width: 0;
}


/* =========================================================
   CATEGORY SECTIONS
   ========================================================= */

.kendisco-category-group {
	width: 100%;

	margin: 0 0 22px 0;

	padding: 0;
}


.kendisco-category-group-title {
	margin: 0 0 10px 0;

	padding: 0;

	color: #0F172A;

	line-height: 1.35;
}


.kendisco-category-group-title a {
	color: #0F172A;

	text-decoration: none;
}


.kendisco-category-group-title a:hover,
.kendisco-category-group-title a:focus {
	color: #FF5F14;
}


/* H2 category sections */

.kendisco-category-depth-2
> .kendisco-category-group-title {
	margin-top: 6px;

	margin-bottom: 12px;

	padding-bottom: 8px;

	border-bottom: 1px solid #E5E7EB;

	font-size: 20px;
	font-weight: 500;
}


/* H3 category sections */

.kendisco-category-depth-3
> .kendisco-category-group-title {
	margin-top: 12px;

	margin-bottom: 9px;

	padding: 0;

	border: 0;

	font-size: 15px;
	font-weight: 500;
}


/* Deeper generic levels */

.kendisco-category-depth-4
> .kendisco-category-group-title,

.kendisco-category-depth-5
> .kendisco-category-group-title,

.kendisco-category-depth-6
> .kendisco-category-group-title {
	margin-top: 10px;

	margin-bottom: 8px;

	font-size: 14px;
	font-weight: 500;
}


/* =========================================================
   PRODUCT GRID
   ========================================================= */

.kendisco-category-product-grid {
	width: 100%;

	display: grid;

	grid-template-columns:
		repeat(
			4,
			minmax(0, 1fr)
		);

	gap: 12px;

	margin: 0 0 22px 0;

	padding: 0;
}


/* =========================================================
   PRODUCT CARD
   ========================================================= */

.kendisco-category-product-card {
	width: 100%;
	min-width: 0;

	margin: 0;

	padding: 12px;

	background: #FFFFFF;

	border: 1px solid #E5E7EB;

	border-radius: 6px;

	overflow: hidden;
}


.kendisco-category-product-card:hover {
	border-color: #CBD5E1;

	box-shadow:
		0 2px 8px
		rgba(15,23,42,0.06);
}


/* =========================================================
   PRODUCT IMAGE
   ========================================================= */

.kendisco-category-product-image {
	display: flex;

	width: 100%;

	aspect-ratio: 4 / 3;

	align-items: center;
	justify-content: center;

	margin: 0 0 9px 0;

	padding: 5px;

	overflow: hidden;

	text-decoration: none;
}


.kendisco-category-product-image img,
.kendisco-category-card-image {
	display: block;

	width: 100%;
	height: 100%;

	max-width: 100%;
	max-height: 100%;

	margin: 0;
	padding: 0;

	object-fit: contain;

	object-position: center;
}


/* =========================================================
   PRODUCT TITLE
   ========================================================= */

.kendisco-category-product-title {
	margin: 0;

	padding: 0;

	font-size: 13px;
	font-weight: 400;
	line-height: 1.45;

	text-align: center;
}


.kendisco-category-product-title a {
	color: #334155;

	text-decoration: none;
}


.kendisco-category-product-title a:hover,
.kendisco-category-product-title a:focus {
	color: #FF5F14;
}


/* =========================================================
   EMPTY CATEGORY
   ========================================================= */

.kendisco-category-no-products {
	margin: 0;

	color: #475569;

	font-size: 14px;
}


/* =========================================================
   WIDESCREEN
   ========================================================= */

@media (min-width: 1600px) {

	.kendisco-category-main {
		--kendisco-category-width: 1520px;
	}


	.kendisco-category-breadcrumbs {
		font-size: 14px;
	}


	.kendisco-category-title {
		font-size: 32px;
	}


	.kendisco-category-body.has-sidebar {
		grid-template-columns:
			280px
			minmax(0, 1fr);
	}

}


/* =========================================================
   TABLET
   ========================================================= */

@media
(min-width: 768px)
and
(max-width: 1199px) {

	.kendisco-category-hero-inner {
		grid-template-columns:
			minmax(0, 1fr)
			minmax(320px, 400px);

		gap: 30px;
	}


	.kendisco-category-title {
		font-size: 24px;
	}


	.kendisco-category-body.has-sidebar {
		grid-template-columns:
			220px
			minmax(0, 1fr);

		gap: 18px;
	}


	.kendisco-category-product-grid {
		grid-template-columns:
			repeat(
				3,
				minmax(0, 1fr)
			);
	}

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

	.kendisco-category-breadcrumbs {
		padding: 7px 15px !important;

		font-size: 10px;
	}


	.kendisco-category-hero-inner {
		padding: 22px 15px;

		grid-template-columns: 1fr;

		gap: 20px;
	}


	.kendisco-category-title {
		font-size: 22px;
	}


	.kendisco-category-description {
		font-size: 14px;
	}


	.kendisco-category-form {
		min-height: 390px;
	}


	.kendisco-category-form .elementor-col-50,
	.kendisco-category-form .elementor-col-40,
	.kendisco-category-form .elementor-col-33,
	.kendisco-category-form .elementor-col-30,
	.kendisco-category-form .elementor-col-25 {
		width: 100% !important;
	}


	.kendisco-category-body,
	.kendisco-category-body.has-sidebar,
	.kendisco-category-body.no-sidebar {
		padding: 18px 15px 30px;
	}


	.kendisco-category-body.has-sidebar {
		display: grid;

		grid-template-columns: 1fr;

		gap: 20px;
	}


	/* Sticky disabled on phones */

	.kendisco-category-sidebar {
		position: static;

		top: auto;

		max-height: none;

		overflow: visible;

		padding: 18px;
	}


	.kendisco-category-sidebar-nav {
		display: grid;

		grid-template-columns:
			repeat(
				2,
				minmax(0, 1fr)
			);

		column-gap: 16px;
	}


	.kendisco-category-sidebar-link {
		font-size: 12px;
	}


	.kendisco-category-depth-2
	> .kendisco-category-group-title {
		font-size: 18px;
	}


	.kendisco-category-depth-3
	> .kendisco-category-group-title {
		font-size: 15px;
	}


	.kendisco-category-product-grid {
		grid-template-columns:
			repeat(
				2,
				minmax(0, 1fr)
			);

		gap: 10px;
	}


	.kendisco-category-product-card {
		padding: 9px;
	}


	.kendisco-category-product-title {
		font-size: 12px;
	}

}


/* =========================================================
   VERY SMALL MOBILE
   ========================================================= */

@media (max-width: 420px) {

	.kendisco-category-sidebar-nav {
		grid-template-columns: 1fr;
	}

}