/*
Theme Name:   zashippingcontainers.co.za
Theme URI:    https://zashippingcontainers.co.za/
Description:  Child theme of Astra for ZA Shipping Containers PTY LTD.
Author:       zashippingcontainers.co.za
Author URI:   https://zashippingcontainers.co.za/
Template:     astra
Version:      1.0.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  zashippingcontainers
*/

:root {
	--zsc-navy: #0f2a44;
	--zsc-orange: #e8711c;
	--zsc-light: #f4f6f8;
}

/* Header */
.ast-primary-header-bar { border-bottom: 3px solid var(--zsc-orange); }
.main-header-menu .menu-link { font-weight: 600; text-transform: uppercase; font-size: 13px; letter-spacing: .4px; padding-left: 11px; padding-right: 11px; }
.ast-header-button-1 .ast-custom-button { white-space: nowrap; }

/* Buttons */
.ast-button, .button, input[type=submit], .wp-block-button__link,
.woocommerce a.button, .woocommerce button.button, .woocommerce .button.alt,
.wpforms-container .wpforms-submit {
	background-color: var(--zsc-orange) !important;
	border-color: var(--zsc-orange) !important;
	color: #fff !important;
	border-radius: 4px;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .wpforms-container .wpforms-submit:hover {
	background-color: var(--zsc-navy) !important;
	border-color: var(--zsc-navy) !important;
}

/* Mobile Hamburger Menu Toggle & Submenu Toggle */
.ast-button-wrap button.menu-toggle,
.ast-mobile-header-wrap .ast-button-wrap .menu-toggle.main-header-menu-toggle,
button.menu-toggle.main-header-menu-toggle {
	background-color: var(--zsc-orange) !important;
	border: 2px solid var(--zsc-orange) !important;
	border-radius: 6px !important;
	padding: 8px 10px !important;
	color: #ffffff !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-width: 44px;
	min-height: 42px;
}
.ast-button-wrap .mobile-menu-toggle-icon .ast-mobile-svg,
.ast-mobile-header-wrap .menu-toggle .ast-mobile-svg,
button.menu-toggle.main-header-menu-toggle .ast-mobile-svg,
button.menu-toggle.main-header-menu-toggle svg,
button.menu-toggle.main-header-menu-toggle svg path {
	fill: #ffffff !important;
	color: #ffffff !important;
	width: 24px !important;
	height: 24px !important;
}
button.ast-menu-toggle {
	background: transparent !important;
	border: none !important;
	color: var(--zsc-navy) !important;
	box-shadow: none !important;
}
button.ast-menu-toggle .ast-arrow-svg,
button.ast-menu-toggle .ast-arrow-svg path {
	fill: currentColor !important;
}

/* Mobile & Slide-In Cart Drawer: keep Subtotal and Buttons directly below cart items */
.astra-cart-drawer .astra-cart-drawer-content,
.astra-cart-drawer .astra-cart-drawer-content .widget_shopping_cart,
.astra-cart-drawer .astra-cart-drawer-content .widget_shopping_cart_content {
	height: auto !important;
	justify-content: flex-start !important;
}
.astra-cart-drawer .astra-cart-drawer-content .woocommerce-mini-cart {
	flex: 0 1 auto !important;
	max-height: 55vh;
	overflow-y: auto;
	padding: 1.1em 1.3em 0.5em !important;
	margin-bottom: 0 !important;
}
.woocommerce-js .astra-cart-drawer .astra-cart-drawer-content .woocommerce-mini-cart__total,
.astra-cart-drawer .astra-cart-drawer-content .woocommerce-mini-cart__total {
	margin-top: 4px !important;
	padding: 0.75em 1.3em !important;
	border-top: 1px solid #e3e7eb;
	border-bottom: 1px solid #e3e7eb;
}
.astra-cart-drawer .astra-cart-drawer-content .woocommerce-mini-cart__buttons {
	padding: 1em 1.3em 1.3em !important;
	margin-top: 0 !important;
}
.astra-cart-drawer .astra-cart-drawer-header .astra-cart-drawer-close {
	background-color: var(--zsc-orange) !important;
	color: #ffffff !important;
	border-radius: 4px !important;
	padding: 6px !important;
}
.astra-cart-drawer .astra-cart-drawer-header .astra-cart-drawer-close svg,
.astra-cart-drawer .astra-cart-drawer-header .astra-cart-drawer-close svg path {
	fill: #ffffff !important;
}

/* Product cards */
.woocommerce ul.products li.product {
	background: #fff;
	border: 1px solid #e3e7eb;
	border-radius: 6px;
	padding: 14px 14px 20px;
	text-align: center;
	transition: box-shadow .2s ease;
}
.woocommerce ul.products li.product:hover { box-shadow: 0 8px 22px rgba(15, 42, 68, .12); }
.woocommerce ul.products li.product .woocommerce-loop-product__title { color: var(--zsc-navy); font-size: 17px; }
.woocommerce ul.products li.product .price { color: var(--zsc-orange); font-weight: 700; font-size: 18px; }
.woocommerce ul.products li.product img { aspect-ratio: 1 / 1; object-fit: contain; background: #fff; }

/* Shop by Container Type (Category Cards): uniform image heights & hide product count */
.woocommerce ul.products li.product-category {
	padding: 14px !important;
	overflow: hidden;
}
.woocommerce ul.products li.product-category a {
	display: block;
	position: relative;
	overflow: hidden;
	border-radius: 4px;
}
.woocommerce ul.products li.product-category img {
	width: 100% !important;
	height: 240px !important;
	aspect-ratio: 4 / 3 !important;
	object-fit: cover !important;
	object-position: center center !important;
	display: block !important;
	margin: 0 !important;
	border-radius: 4px;
}
.woocommerce ul.products li.product-category .woocommerce-loop-category__title .count,
.woocommerce ul.products li.product-category mark.count {
	display: none !important;
}

.zsc-dims { font-size: 13px; color: #55606b; margin: 4px 0 8px; }

/* Footer */
.site-footer, .site-primary-footer-wrap { background: var(--zsc-navy) !important; color: #d9e1e8; }
.site-footer .widget-title, .site-footer h2, .site-footer h3, .site-footer h4 { color: #fff !important; }
.site-footer a { color: #ffd2b0 !important; word-break: break-word; overflow-wrap: anywhere; }
.site-below-footer-wrap { background: #0a1e31 !important; color: #b9c5d0; }
.site-footer .widget ul { list-style: none; margin: 0; padding: 0; }
.site-footer .widget ul li { margin-bottom: 6px; }
.site-primary-footer-wrap[data-section="section-primary-footer-builder"],
.site-below-footer-wrap[data-section="section-below-footer-builder"] {
	padding-left: 24px !important;
	padding-right: 24px !important;
	box-sizing: border-box !important;
}
.site-primary-footer-wrap .ast-builder-grid-row-container-inner,
.site-primary-footer-wrap .ast-builder-grid-row,
.site-footer .site-footer-section,
.site-footer .footer-widget-area {
	width: 100% !important;
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box !important;
}
@media (max-width: 768px) {
	html, body, #page, .site-footer {
		overflow-x: hidden;
		max-width: 100vw;
	}
	.site-primary-footer-wrap[data-section="section-primary-footer-builder"],
	.site-below-footer-wrap[data-section="section-below-footer-builder"] {
		padding-left: 20px !important;
		padding-right: 20px !important;
	}
	.site-primary-footer-wrap[data-section="section-primary-footer-builder"] .ast-builder-grid-row,
	.site-below-footer-wrap[data-section="section-below-footer-builder"] .ast-builder-grid-row {
		grid-template-columns: minmax(0, 1fr) !important;
		grid-row-gap: 24px !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
		width: 100% !important;
	}
	.site-footer .site-footer-section,
	.site-footer .footer-widget-area,
	.site-footer .widget,
	.site-footer .textwidget {
		min-width: 0 !important;
		max-width: 100% !important;
		overflow-wrap: break-word !important;
		word-wrap: break-word !important;
	}
}

/* Business details block */
.zsc-business-details p { margin-bottom: 6px; }
.site-below-footer-wrap, .site-below-footer-wrap .ast-footer-copyright, .site-below-footer-wrap p { color: #b9c5d0 !important; }

/* Specification table */
table.zsc-spec th, table.zsc-spec td { text-align: left; padding: 10px 14px; }
table.zsc-spec th { width: 38%; background: var(--zsc-light); color: var(--zsc-navy); }

/* Shop, Catalog & Product Page Title Banner */
.zsc-page-banner {
	background: linear-gradient(135deg, #0a1e31 0%, var(--zsc-navy) 65%, #163a5c 100%);
	border-bottom: 4px solid var(--zsc-orange);
	color: #ffffff;
	padding: 46px 20px;
	margin-bottom: 36px;
}
.zsc-page-banner__inner {
	max-width: 1200px;
	margin: 0 auto;
}
.zsc-page-banner .woocommerce-breadcrumb {
	color: #b9c5d0 !important;
	font-size: 13px;
	margin: 0 0 12px !important;
}
.zsc-page-banner .woocommerce-breadcrumb a {
	color: #ffd2b0 !important;
	text-decoration: none;
}
.zsc-page-banner .woocommerce-breadcrumb a:hover {
	color: #ffffff !important;
	text-decoration: underline;
}
.zsc-page-banner__badge {
	display: inline-block;
	background: rgba(232, 113, 28, 0.18);
	border: 1px solid var(--zsc-orange);
	color: #ffd2b0;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.8px;
	padding: 4px 10px;
	border-radius: 3px;
	margin-bottom: 10px;
}
.zsc-page-banner__title {
	color: #ffffff !important;
	font-size: 34px;
	line-height: 1.25;
	font-weight: 700;
	margin: 0 0 10px !important;
}
.zsc-page-banner__subtitle {
	color: #e2e9f0;
	font-size: 16px;
	line-height: 1.55;
	max-width: 780px;
	margin: 0;
}
.zsc-page-banner__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 18px;
	margin-top: 14px;
	font-size: 14px;
	color: #d9e1e8;
}
.zsc-page-banner__meta span strong {
	color: #ffd2b0;
}
/* Hide default inline archive header & breadcrumb inside container when banner is active */
.woocommerce-shop .ast-woocommerce-container > .woocommerce-breadcrumb,
.tax-product_cat .ast-woocommerce-container > .woocommerce-breadcrumb,
.tax-product_brand .ast-woocommerce-container > .woocommerce-breadcrumb,
.single-product .ast-woocommerce-container .woocommerce-breadcrumb,
.woocommerce-shop .woocommerce-products-header,
.tax-product_cat .woocommerce-products-header,
.tax-product_brand .woocommerce-products-header {
	display: none !important;
}
.single-product div.product .product_title.entry-title {
	color: var(--zsc-navy);
	font-size: 26px;
	line-height: 1.3;
	margin-bottom: 10px;
}

/* ==========================================================================
   Homepage Taller, Brighter 3-Image Sliding Hero Slider
   ========================================================================== */
.home .elementor-80 .elementor-element.elementor-element-h1001,
.home .elementor-top-section:first-child {
	position: relative !important;
	overflow: hidden !important;
	min-height: 620px !important;
	padding-top: 200px !important;
	padding-bottom: 200px !important;
	display: flex !important;
	align-items: center !important;
	background-image: none !important;
}
.home .elementor-80 .elementor-element.elementor-element-h1001 > .elementor-background-overlay,
.home .elementor-top-section:first-child > .elementor-background-overlay {
	background: linear-gradient(180deg, rgba(15, 42, 68, 0.24) 0%, rgba(15, 42, 68, 0.30) 100%) !important;
	opacity: 1 !important;
	z-index: 1 !important;
	pointer-events: none;
}
.home .elementor-80 .elementor-element.elementor-element-h1001 > .elementor-container,
.home .elementor-top-section:first-child > .elementor-container {
	position: relative !important;
	z-index: 3 !important;
	width: 100%;
}
.home .elementor-top-section:first-child h1.elementor-heading-title {
	text-shadow: 0 3px 16px rgba(0, 0, 0, 0.72), 0 1px 4px rgba(0, 0, 0, 0.85) !important;
}
.home .elementor-top-section:first-child .elementor-widget-text-editor p {
	color: #ffffff !important;
	font-weight: 500;
	text-shadow: 0 2px 12px rgba(0, 0, 0, 0.78), 0 1px 3px rgba(0, 0, 0, 0.88) !important;
}

/* 3-Image Horizontal Sliding Track */
.zsc-hero-slider {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	z-index: 0;
}
.zsc-hero-slider__track {
	display: flex;
	width: 300%;
	height: 100%;
	transition: transform 0.85s cubic-bezier(0.4, 0, 0.2, 1);
	will-change: transform;
}
.zsc-hero-slider__slide {
	flex: 0 0 33.333333%;
	width: 33.333333%;
	height: 100%;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	filter: brightness(1.12) contrast(1.04) saturate(1.08);
}

/* Slider Arrows & Dots */
.zsc-hero-slider__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 4;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: rgba(15, 42, 68, 0.55) !important;
	border: 2px solid rgba(255, 255, 255, 0.75) !important;
	color: #ffffff !important;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	padding: 0 !important;
	font-size: 20px;
	line-height: 1;
	transition: background 0.2s ease, border-color 0.2s ease;
}
.zsc-hero-slider__arrow:hover {
	background: var(--zsc-orange) !important;
	border-color: var(--zsc-orange) !important;
}
.zsc-hero-slider__arrow--prev {
	left: 22px;
}
.zsc-hero-slider__arrow--next {
	right: 22px;
}
.zsc-hero-slider__dots {
	position: absolute;
	bottom: 22px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 4;
	display: flex;
	gap: 10px;
}
.zsc-hero-slider__dot {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.55) !important;
	border: 2px solid #ffffff !important;
	padding: 0 !important;
	cursor: pointer;
	transition: all 0.25s ease;
}
.zsc-hero-slider__dot.is-active {
	width: 30px;
	border-radius: 8px;
	background: var(--zsc-orange) !important;
	border-color: var(--zsc-orange) !important;
}

@media (max-width: 768px) {
	.home .elementor-80 .elementor-element.elementor-element-h1001,
	.home .elementor-top-section:first-child {
		min-height: 460px !important;
		padding-top: 120px !important;
		padding-bottom: 120px !important;
	}
	.zsc-hero-slider__arrow {
		width: 36px;
		height: 36px;
		font-size: 16px;
	}
	.zsc-hero-slider__arrow--prev { left: 10px; }
	.zsc-hero-slider__arrow--next { right: 10px; }
}
