/*
Theme Name: Fabrica Child Theme
Theme URI: http://fabrica.ancorathemes.com/
Description: Fabrica is a Premium WordPress theme that has built-in support for popular Page Builders, slider with swipe gestures, and is SEO- and Retina-ready. The unique system of inheritance and override options allows setting up individual parameters for different sections of your site and supported plugins.
Author: AncoraThemes
Author URI: http://ancorathemes.com/
Version: 1.20.0
Tested up to: 6.8
Requires at least: 5.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: blog, e-commerce, portfolio, grid-layout, one-column, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, custom-background, custom-colors, custom-header, custom-logo, custom-menu, editor-style, featured-image-header, featured-images, flexible-header, footer-widgets, full-width-template, microformats, post-formats, sticky-post, theme-options, threaded-comments, translation-ready, block-styles, wide-blocks
Text Domain: fabrica
Template: fabrica
*/

/* Fonts for the spec datasheet section below — @import must stay the very
   first rule in this file (after this header comment) or browsers ignore it. */
@import url('https://fonts.googleapis.com/css2?family=Barlow+Semi+Condensed:wght@600;700&family=Inter:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500;600&display=swap');


/* =Child-Theme customization starts here
------------------------------------------------------------ */

/* Hide prices and Add to Cart / Buy Now buttons sitewide.
   PHP hooks handle standard WooCommerce output; these rules
   catch Elementor/ThemeREX widget contexts and any edge cases. */
.woocommerce .price,
.woocommerce .price_wrap,
.woocommerce-page .price,
.post_price.product_price {
	display: none !important;
}

.woocommerce .add_to_cart_button,
.woocommerce .single_add_to_cart_button,
.woocommerce .add_to_cart_wrap,
.woocommerce-page .add_to_cart_button,
.elementor .add_to_cart_wrap,
.elementor .woocommerce-loop-product__link + *,
.elementor [class*="woocommerce-"] .button {
	display: none !important;
}

/* Fix mobile menu close button: let clicks pass through the icon/text
   spans to the parent <a>, so mobile browsers (iOS Safari) dispatch the
   click event on the element that actually has the handler attached. */
.menu_mobile .menu_mobile_close .menu_button_close_icon,
.menu_mobile .menu_mobile_close .menu_button_close_text {
	pointer-events: none;
}

/* Single product page: swap gallery/summary sides (image right, summary
   left). Parent theme floats div.images left and div.summary right via
   woocommerce.css; only the float direction and padding side need flipping,
   the widths stay the same. Only applies when the page has no sidebar,
   matching the parent theme's default single-product layout. */
.woocommerce.sidebar_hide div.product div.images {
	float: right;
}
.woocommerce.sidebar_hide div.product div.summary {
	float: left;
	padding-left: 0;
	padding-right: 60px;
}

/* Single product page: force the main gallery image into a fixed 4:3 box
   (cropped to fill) instead of its native upload dimensions, so PDP images
   look consistent across products regardless of source photo proportions.
   Selector matches parent theme's woocommerce.css:1598 exactly, so it hits
   only the main viewer image, never the .flex-control-thumbs rail.
   Products with no image yet get a *different* wrapper class from
   WooCommerce — "...__image--placeholder" instead of "...__image" (see
   plugins/woocommerce/templates/single-product/product-image.php) — so both
   selectors are needed, or the "Awaiting product image" placeholder is left
   unstyled. */
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image,
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper [class*="woocommerce-product-gallery__image--placeholder"] {
	aspect-ratio: 4 / 3;
	overflow: hidden;
}
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image img,
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper [class*="woocommerce-product-gallery__image--placeholder"] img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

/* Single product page: title style. */
.woocommerce div.product .product_title {
	font-weight: 700;
	font-size: clamp(36px, 4.6vw, 54px);
	line-height: 1.04;
	text-transform: uppercase;
}

/* Single product page: the parent theme's rule (woocommerce.css:2629) hides
   ALL h2 inside #tab-description, not just the auto-generated "Description"
   heading — undo that broadly, then re-hide only the auto-generated one
   (always the first child, printed before the_content() — see
   plugins/woocommerce/templates/single-product/tabs/description.php), so
   any other h2 inside the product's own description content stays visible. */
.woocommerce div.product .woocommerce-tabs #tab-description h2 {
	display: block;
	font-weight: 700;
	font-size: clamp(26px, 3.2vw, 36px);
	text-transform: uppercase;
	line-height: 1.08;
	margin: 0;
}
.woocommerce div.product .woocommerce-tabs #tab-description > h2:first-child {
	display: none;
}

/* Single product page: hide SKU, Categories, Tags, and Product ID from the
   product meta row. .product_id is a Fabrica theme addition (hooked on
   woocommerce_product_meta_end); the rest are stock WooCommerce fields
   from templates/single-product/meta.php. */
.woocommerce div.product .product_meta .sku_wrapper,
.woocommerce div.product .product_meta .posted_in,
.woocommerce div.product .product_meta .tagged_as,
.woocommerce div.product .product_meta .product_id {
	display: none;
}


/* ═══════════════════════════════════════════════════════════════════════
   CATEGORY HERO BANNER
   Shown at the top of the Bearings, FRP Composites, and Fasteners &
   Hardware archive pages — above the product grid.
   ═══════════════════════════════════════════════════════════════════════ */

.mcardent-cat-hero {
	position: relative;
	width: 100%;
	min-height: 260px;
	display: flex;
	align-items: center;
	overflow: hidden;
	border-radius: 10px;
	margin: 0 0 4px;
}

.mcardent-cat-hero__bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	transition: transform 8s ease;
}
.mcardent-cat-hero:hover .mcardent-cat-hero__bg {
	transform: scale(1.03);
}

.mcardent-cat-hero__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to right, rgba(10,20,40,0.88) 40%, rgba(10,20,40,0.55) 100%);
}

.mcardent-cat-hero__inner {
	position: relative;
	z-index: 2;
	padding: 60px 48px;
	max-width: 720px;
	color: #fff;
}

.mcardent-cat-hero__breadcrumb {
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.6);
	margin-bottom: 16px;
}
.mcardent-cat-hero__breadcrumb a {
	color: rgba(255,255,255,0.6);
	text-decoration: none;
	transition: color 0.2s;
}
.mcardent-cat-hero__breadcrumb a:hover {
	color: #fff;
}
.mcardent-cat-hero__breadcrumb span[aria-hidden] {
	margin: 0 6px;
	opacity: 0.4;
}

.mcardent-cat-hero__title {
	font-size: clamp(28px, 4vw, 46px);
	font-weight: 700;
	line-height: 1.15;
	margin: 0 0 16px;
	color: #fff;
}

.mcardent-cat-hero__desc {
	font-size: 15px;
	line-height: 1.7;
	color: rgba(255,255,255,0.8);
	margin: 0 0 20px;
	max-width: 540px;
}

.mcardent-cat-hero__count {
	display: inline-block;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.55);
	border: 1px solid rgba(255,255,255,0.2);
	border-radius: 3px;
	padding: 4px 12px;
}


/* ═══════════════════════════════════════════════════════════════════════
   SUBCATEGORY GRID SECTION
   ═══════════════════════════════════════════════════════════════════════ */

.mcardent-subcat-section {
	background: #f2f4f7;
	padding: 36px 28px 40px;
	margin: 0;
	border-radius: 10px;
}

.mcardent-subcat-section__header {
	text-align: center;
	margin-bottom: 28px;
}

.mcardent-subcat-section__heading {
	font-size: clamp(16px, 2vw, 22px);
	font-weight: 700;
	margin: 0 0 6px;
	color: #1a1a2e;
}

.mcardent-subcat-section__sub {
	font-size: 13px;
	color: #6b7280;
	margin: 0;
}

/* Grid — 4 cols default, adjusts via column modifier class */
.mcardent-subcat-grid {
	display: grid;
	gap: 18px;
	grid-template-columns: repeat(4, 1fr);
}
.mcardent-subcat-grid--3col { grid-template-columns: repeat(3, 1fr); }
.mcardent-subcat-grid--2col { grid-template-columns: repeat(2, 1fr); }
.mcardent-subcat-grid--1col { grid-template-columns: 1fr; }

/* ── Individual card ──────────────────────────────────────────── */

.mcardent-subcat-card {
	display: flex;
	flex-direction: column;
	background: #fff;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 1px 4px rgba(0,0,0,0.07), 0 4px 16px rgba(0,0,0,0.05);
	text-decoration: none !important;
	color: inherit;
	transition: transform 0.22s ease, box-shadow 0.22s ease;
	border-top: 3px solid transparent;
}

.mcardent-subcat-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 30px rgba(0,0,0,0.12);
	border-top-color: var(--theme-color-dark, #1a1a2e);
	text-decoration: none !important;
}

/* Thumbnail area */
.mcardent-subcat-card__thumb {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: #e8ecef;
	flex-shrink: 0;
}

.mcardent-subcat-card__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.4s ease;
}
.mcardent-subcat-card:hover .mcardent-subcat-card__img {
	transform: scale(1.06);
}

/* No-image placeholder */
.mcardent-subcat-card__placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.mcardent-subcat-card__initials {
	font-size: 36px;
	font-weight: 800;
	letter-spacing: 0.05em;
	color: rgba(255,255,255,0.35);
	user-select: none;
	font-family: inherit;
}

/* Product count badge */
.mcardent-subcat-card__badge {
	position: absolute;
	bottom: 10px;
	right: 10px;
	background: rgba(0,0,0,0.55);
	color: #fff;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.06em;
	padding: 3px 9px;
	border-radius: 3px;
	backdrop-filter: blur(4px);
}

/* Card body */
.mcardent-subcat-card__body {
	padding: 18px 20px 20px;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.mcardent-subcat-card__name {
	font-size: 15px;
	font-weight: 700;
	margin: 0 0 6px;
	color: #1a1a2e;
	line-height: 1.3;
}

.mcardent-subcat-card__desc {
	font-size: 13px;
	color: #6b7280;
	margin: 0 0 12px;
	line-height: 1.5;
	flex: 1;
}

.mcardent-subcat-card__cta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--theme-color-dark, #1a1a2e);
	margin-top: auto;
	transition: gap 0.2s ease, color 0.2s ease;
}
.mcardent-subcat-card:hover .mcardent-subcat-card__cta {
	gap: 10px;
	color: var(--theme-color, #0066cc);
}
.mcardent-subcat-card__cta svg {
	transition: transform 0.2s ease;
}
.mcardent-subcat-card:hover .mcardent-subcat-card__cta svg {
	transform: translateX(3px);
}


/* ── Section divider before products ─────────────────────────── */

.mcardent-products-divider {
	display: flex;
	align-items: center;
	gap: 16px;
	margin: 36px 0 24px;
	color: #9ca3af;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}
.mcardent-products-divider::before,
.mcardent-products-divider::after {
	content: '';
	flex: 1;
	height: 1px;
	background: #e5e7eb;
}


/* ═══════════════════════════════════════════════════════════════════════
   RESPONSIVE BREAKPOINTS
   ═══════════════════════════════════════════════════════════════════════ */

@media (max-width: 1200px) {
	.mcardent-subcat-grid,
	.mcardent-subcat-grid--4col {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 1024px) {
	.mcardent-subcat-grid,
	.mcardent-subcat-grid--4col,
	.mcardent-subcat-grid--3col {
		grid-template-columns: repeat(2, 1fr);
	}
	.mcardent-cat-hero__inner {
		padding: 44px 32px;
	}
	.mcardent-subcat-section {
		padding: 28px 20px 32px;
	}
}

@media (max-width: 600px) {
	.mcardent-subcat-grid,
	.mcardent-subcat-grid--4col,
	.mcardent-subcat-grid--3col,
	.mcardent-subcat-grid--2col {
		grid-template-columns: 1fr 1fr;
		gap: 14px;
	}
	.mcardent-cat-hero {
		min-height: 200px;
	}
	.mcardent-cat-hero__inner {
		padding: 32px 20px;
	}
	.mcardent-subcat-card__initials {
		font-size: 24px;
	}
}

@media (max-width: 380px) {
	.mcardent-subcat-grid,
	.mcardent-subcat-grid--4col,
	.mcardent-subcat-grid--3col,
	.mcardent-subcat-grid--2col {
		grid-template-columns: 1fr;
	}
}


/* ═══════════════════════════════════════════════════════════════════════
   SPEC DATASHEET SECTION
   ═══════════════════════════════════════════════════════════════════════ */

:root {
	--brand-navy: #101F3C;
	--brand-red: #D8232A;
	--brand-steel: #EDF0F4;
	--brand-line: #D8DEE7;
	--brand-ink: #182130;
	--brand-muted: #5B6575;
	--font-display: 'Barlow Semi Condensed', sans-serif;
	--font-body: 'Inter', sans-serif;
	--font-mono: 'IBM Plex Mono', monospace;
}

/* ---------- Section shell ---------- */
.spec-section {
	font-family: var(--font-body);
	color: var(--brand-ink);
}
.spec-section * { margin: 0; padding: 0; box-sizing: border-box; }

/* ---------- Heading ---------- */
.spec-eyebrow {
	font-family: var(--font-mono);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--brand-red);
	display: inline-flex;
	align-items: center;
	gap: 10px;
}
.spec-eyebrow::before { content: ""; width: 26px; height: 2px; background: var(--brand-red); }
.spec-title {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: clamp(26px, 3.2vw, 36px);
	text-transform: uppercase;
	color: var(--brand-navy);
	line-height: 1.08;
}

/* ---------- Datasheet card ---------- */
.datasheet {
	border: 1px solid var(--brand-navy);
	border-radius: 4px;
	overflow: hidden;
	box-shadow: 0 14px 34px rgba(16,31,60,.08);
	background: #fff;
}
.datasheet-head {
	background: var(--brand-navy);
	color: #fff;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	padding: 14px 20px;
}
.datasheet-head .title {
	font-family: var(--font-display);
	font-weight: 600;
	font-size: 17px;
	text-transform: uppercase;
	letter-spacing: .05em;
}
.datasheet-head .meta {
	font-family: var(--font-mono);
	font-size: 12px;
	color: #AEB9CC;
}

/* ---------- Table ---------- */
.datasheet-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.datasheet table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14.5px;
	min-width: 640px;
}
.datasheet thead th {
	font-family: var(--font-mono);
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--brand-muted);
	background: var(--brand-steel);
	border-bottom: 2px solid var(--brand-navy);
	padding: 12px 18px;
	text-align: left;
}
.datasheet tbody td {
	padding: 13px 18px;
	border-bottom: 1px solid var(--brand-line);
	line-height: 1.5;
}
.datasheet tbody tr:last-child td { border-bottom: 0; }
.datasheet tbody tr:hover { background: #F6F8FB; }

/* cell types */
.datasheet td.part {
	font-family: var(--font-mono);
	font-weight: 600;
	color: var(--brand-navy);
}
.datasheet td.dim { font-family: var(--font-mono); color: var(--brand-ink); }
.datasheet td.opt span {
	font-family: var(--font-mono);
	font-size: 12px;
	background: var(--brand-steel);
	border: 1px solid var(--brand-line);
	padding: 2px 8px;
	border-radius: 2px;
	margin-right: 6px;
	white-space: nowrap;
	display: inline-block;
	margin-bottom: 4px;
}

/* ---------- Footer strip ---------- */
.datasheet-foot {
	padding: 12px 20px;
	background: var(--brand-steel);
	border-top: 1px solid var(--brand-line);
	font-size: 13px;
	color: var(--brand-muted);
	display: flex;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
}
.datasheet-foot .mono { font-family: var(--font-mono); font-size: 12px; }