/**
 * BitSmart – Responsive & Cross-Browser Compatibility
 * Breakpoints: 689.98px (mobile), 999.98px (tablet), 1200px (laptop)
 * Tested for: Chrome, Firefox, Safari, Edge, Samsung Internet, iOS Safari
 */

/* =============================================
   0. BASE – Cross-browser resets & safe areas
   ============================================= */

/* Safe area insets for notched phones (iPhone X+) */
:root {
	--safe-area-top: env(safe-area-inset-top, 0px);
	--safe-area-bottom: env(safe-area-inset-bottom, 0px);
	--safe-area-left: env(safe-area-inset-left, 0px);
	--safe-area-right: env(safe-area-inset-right, 0px);
}

/* Ensure consistent box-sizing */
*,
*::before,
*::after {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

/* Prevent text size adjust on orientation change (iOS/Android) */
html {
	-webkit-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Smooth scrolling with reduced-motion respect */
@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}

/* Images responsive baseline */
img {
	max-width: 100%;
	height: auto;
}

/* iOS input zoom prevention: inputs < 16px trigger zoom */
@supports (-webkit-touch-callout: none) {
	input[type="text"],
	input[type="email"],
	input[type="tel"],
	input[type="number"],
	input[type="password"],
	input[type="search"],
	input[type="url"],
	select,
	textarea {
		font-size: 16px !important;
	}
}

/* Consistent form appearance across browsers */
input,
button,
select,
textarea {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	font-family: inherit;
}

/* Restore select dropdown arrow */
select {
	-webkit-appearance: menulist;
	-moz-appearance: menulist;
	appearance: menulist;
}

/* Touch-friendly tap targets (WCAG 2.5.5) */
a,
button,
input[type="submit"],
input[type="button"],
.button,
.btn,
.ct-button,
.single_add_to_cart_button,
.added_to_cart {
	min-height: 44px;
	min-width: 44px;
}

/* Momentum scrolling on iOS */
.ct-panel-inner,
.ct-sidebar,
.woocommerce-cart-form,
.ct-header-account-dropdown {
	-webkit-overflow-scrolling: touch;
}


/* =============================================
   1. DESKTOP (1200px+) – minor fixes
   ============================================= */

/* Breadcrumbs: prevent overflow */
.ct-breadcrumbs {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 100%;
}

/* Product single: breadcrumbs wrap */
.entry-summary-items > .ct-breadcrumbs {
	white-space: normal;
	word-break: break-word;
}


/* =============================================
   2. LAPTOP (max-width: 1200px)
   ============================================= */

@media (max-width: 1200px) {
	/* Reduce container max-width for better laptop fit */
	:root {
		--theme-normal-container-max-width: 1100px;
	}
}


/* =============================================
   3. TABLET (max-width: 999.98px)
   ============================================= */

@media (max-width: 999.98px) {
	/* Header: ensure search bar fits */
	[data-header*="type-1"] .ct-header [data-row*="middle"] {
		padding-left: 15px;
		padding-right: 15px;
	}

	/* Search input: make it wider */
	.ct-header-search {
		max-width: 100%;
	}

	/* Shop sidebar: move above products */
	[data-sidebar] {
		--sidebar-width: 100% !important;
		--sidebar-width-no-unit: 100 !important;
	}

	.ct-container[data-sidebar] {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
	}

	/* Product grid: 2 columns fine for tablet */
	[data-products] {
		--grid-columns-gap: 20px;
		--grid-rows-gap: 25px;
	}

	/* Product titles: readable on tablet */
	[data-products] .woocommerce-loop-product__title,
	[data-products] .woocommerce-loop-category__title {
		--theme-font-size: 14px !important;
	}

	[data-products] .product .price {
		--theme-font-size: 14px !important;
	}

	/* Single product: stack image + summary on tablet */
	.product-entry-wrapper {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 25px;
	}

	.product-entry-wrapper > .woocommerce-product-gallery,
	.product-entry-wrapper > .entry-summary {
		width: 100% !important;
		max-width: 100% !important;
		-webkit-box-flex: 0;
		-ms-flex: none;
		flex: none;
	}

	/* Cart table: horizontal scroll if needed */
	.woocommerce-cart-form {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	/* Footer columns: 2-column on tablet */
	[data-footer*="type-1"] .ct-footer [data-row*="middle"] > div {
		--grid-template-columns: repeat(2, 1fr) !important;
	}

	[data-footer*="type-1"] .ct-footer [data-row*="bottom"] > div {
		--grid-template-columns: repeat(2, 1fr) !important;
	}

	/* Cookie notice: fix positioning */
	.cookie-notification {
		--maxWidth: 350px;
		bottom: 15px;
		left: 15px;
		right: auto;
	}
}


/* =============================================
   4. MOBILE (max-width: 689.98px) – Blocksy breakpoint
   ============================================= */

@media (max-width: 689.98px) {
	/* Body padding for safe areas */
	body {
		padding-left: var(--safe-area-left);
		padding-right: var(--safe-area-right);
	}

	/* Container spacing: tighter on mobile */
	:root {
		--theme-container-edge-spacing: 92vw !important;
		--theme-content-vertical-spacing: 35px !important;
	}

	/* ---- HEADER ---- */

	/* Top bar: hide or shrink social icons */
	[data-header*="type-1"] .ct-header [data-row*="top"] {
		--height: 36px;
	}

	[data-header*="type-1"] [data-id="socials"].ct-header-socials {
		--theme-icon-size: 10px;
		--items-spacing: 15px;
	}

	/* Header search: full width below header */
	[data-header*="type-1"] .ct-header [data-row*="middle"] {
		padding-left: 10px;
		padding-right: 10px;
	}

	/* Logo: slightly bigger for readability */
	[data-header*="type-1"] .ct-header [data-id="logo"] .site-logo-container {
		--logo-max-height: 28px !important;
	}

	/* Hamburger: ensure tap target */
	[data-header*="type-1"] [data-id="trigger"] {
		--theme-icon-size: 22px;
		padding: 10px;
	}

	/* Off-canvas menu: full width on small phones */
	[data-header*="type-1"] #offcanvas {
		--side-panel-width: 100vw;
	}

	[data-header*="type-1"] #woo-cart-panel {
		--side-panel-width: 100vw;
	}

	/* ---- PRODUCT LISTING (SHOP/CATEGORY) ---- */

	/* FIX: Product titles were 10px ← unreadable. Override to 13px */
	[data-products] .woocommerce-loop-product__title,
	[data-products] .woocommerce-loop-category__title {
		--theme-font-size: 13px !important;
		line-height: 1.3 !important;
		word-break: break-word;
		overflow-wrap: break-word;
		-webkit-hyphens: auto;
		hyphens: auto;
	}

	/* FIX: Product prices were 10px ← unreadable */
	[data-products] .product .price {
		--theme-font-size: 14px !important;
		font-weight: 700 !important;
	}

	/* FIX: Product excerpts were 10px */
	[data-products] .entry-excerpt {
		--theme-font-size: 12px !important;
	}

	/* Product card stock info */
	[data-products] .ct-woo-card-stock {
		--theme-font-size: 12px !important;
	}

	/* Grid gaps: a bit more breathing room */
	[data-products] {
		--grid-columns-gap: 12px !important;
		--grid-rows-gap: 18px !important;
	}

	/* Add to cart button in listings: readable */
	[data-products] .ct-woo-card-actions .button,
	[data-products] .ct-woo-card-actions .added_to_cart {
		font-size: 12px;
		padding: 8px 12px;
		min-height: 38px;
	}

	/* ---- PRODUCT SINGLE PAGE ---- */

	/* Product title */
	.entry-summary .entry-title {
		--theme-font-size: 22px !important;
		line-height: 1.3 !important;
		word-break: break-word;
	}

	/* Product price */
	.entry-summary .price {
		--theme-font-size: 18px !important;
	}

	/* Breadcrumbs: allow wrapping */
	.entry-summary-items > .ct-breadcrumbs {
		white-space: normal;
		font-size: 11px;
		line-height: 1.4;
	}

	.ct-breadcrumbs {
		white-space: normal;
	}

	/* Product gallery: full width */
	.woocommerce-product-gallery {
		width: 100% !important;
		max-width: 100% !important;
	}

	/* Product summary: full width */
	.entry-summary {
		width: 100% !important;
		max-width: 100% !important;
	}

	/* Add to cart: full width button */
	.entry-summary-items > .ct-product-add-to-cart > .cart {
		--theme-button-max-width: 100% !important;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 12px;
	}

	.entry-summary-items > .ct-product-add-to-cart > .cart .quantity {
		width: 100%;
	}

	.entry-summary-items > .ct-product-add-to-cart > .cart .single_add_to_cart_button {
		width: 100%;
		min-height: 50px;
		font-size: 16px;
	}

	/* Gallery thumbnails: horizontal scroll */
	.single-product .flexy-pills {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	/* Tabs: accordion-friendly spacing */
	.woocommerce-tabs .tabs li a,
	.woocommerce-tabs .ct-accordion-heading {
		padding: 12px 15px;
		font-size: 13px;
	}

	/* Related products: 2 columns */
	.related [data-products],
	.upsells [data-products] {
		--shop-columns: repeat(2, minmax(0, 1fr)) !important;
	}

	.related .ct-module-title,
	.up-sells .ct-module-title {
		--theme-font-size: 18px;
	}

	/* ---- CART PAGE ---- */

	/* Cart table: stack vertically */
	.woocommerce-cart-form table.shop_table {
		display: block;
	}

	.woocommerce-cart-form table.shop_table thead {
		display: none;
	}

	.woocommerce-cart-form table.shop_table tbody,
	.woocommerce-cart-form table.shop_table tr,
	.woocommerce-cart-form table.shop_table td {
		display: block;
		width: 100%;
	}

	.woocommerce-cart-form table.shop_table tr {
		border-bottom: 1px solid var(--theme-border-color);
		padding: 15px 0;
		position: relative;
	}

	.woocommerce-cart-form table.shop_table td {
		border: none;
		padding: 5px 0;
		text-align: left;
	}

	.woocommerce-cart-form table.shop_table td.product-thumbnail {
		width: 80px;
		float: left;
		margin-right: 15px;
	}

	.woocommerce-cart-form table.shop_table td.product-remove {
		position: absolute;
		top: 15px;
		right: 0;
		width: auto;
	}

	/* Cart totals: full width */
	.ct-woocommerce-cart-form .cart_totals {
		width: 100% !important;
		max-width: 100% !important;
		margin-top: 20px;
	}

	/* Coupon form: stack */
	.woocommerce-cart-form .coupon {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		gap: 10px;
	}

	.woocommerce-cart-form .coupon .input-text {
		-webkit-box-flex: 1;
		-ms-flex: 1 1 auto;
		flex: 1 1 auto;
		min-width: 0;
	}

	/* Update cart button: full width */
	.woocommerce-cart-form .actions button[name="update_cart"] {
		width: 100%;
		margin-top: 10px;
	}

	/* ---- CHECKOUT PAGE ---- */

	/* Checkout: single column layout */
	.woocommerce form.checkout #customer_details {
		grid-template-columns: 1fr !important;
	}

	/* Order review: full width */
	.ct-order-review {
		width: 100% !important;
		max-width: 100% !important;
	}

	/* Place order button: prominent */
	#place_order {
		width: 100%;
		min-height: 54px;
		font-size: 17px;
		font-weight: 700;
		position: -webkit-sticky;
		position: sticky;
		bottom: var(--safe-area-bottom, 0px);
		z-index: 99;
	}

	/* Payment methods: more padding */
	.woocommerce-checkout #payment {
		padding: 15px;
	}

	.woocommerce-checkout #payment ul.payment_methods li {
		padding: 12px 10px;
	}

	/* ---- FOOTER ---- */

	/* Footer columns: single column on mobile */
	[data-footer*="type-1"] .ct-footer [data-row*="middle"] > div {
		--grid-template-columns: 1fr !important;
		text-align: center;
	}

	[data-footer*="type-1"] .ct-footer [data-row*="bottom"] > div {
		--grid-template-columns: 1fr !important;
		text-align: center;
	}

	/* Footer widgets: center alignment */
	[data-footer*="type-1"] .ct-footer .ct-widget {
		text-align: center;
	}

	[data-footer*="type-1"] .ct-footer .widget-title {
		text-align: center;
	}

	/* Footer socials: centered */
	[data-footer*="type-1"] [data-id="socials"].ct-footer-socials {
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
	}

	/* Copyright: center */
	[data-footer*="type-1"] [data-column="copyright"] {
		--horizontal-alignment: center;
		text-align: center;
	}

	/* ---- TYPOGRAPHY ---- */

	/* Headings: scale down gracefully */
	h1 {
		--theme-font-size: 26px !important;
	}
	h2 {
		--theme-font-size: 22px !important;
	}
	h3 {
		--theme-font-size: 19px !important;
	}

	/* ---- MISC ---- */

	/* Cookie notice: full width on mobile */
	.cookie-notification {
		--maxWidth: calc(100vw - 30px) !important;
		left: 15px !important;
		right: 15px !important;
		bottom: calc(15px + var(--safe-area-bottom, 0px)) !important;
	}

	/* WooCommerce notices: more compact */
	.woocommerce-message,
	.woocommerce-info,
	.woocommerce-error {
		padding: 12px 15px;
		font-size: 14px;
		line-height: 1.4;
	}

	/* Sale badge: keep readable */
	.onsale,
	.out-of-stock-badge,
	[class*="ct-woo-badge-"] {
		--theme-font-size: 11px !important;
		padding: 6px 10px;
	}

	/* Newsletter: stack */
	.ct-newsletter-subscribe-container form {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 10px;
	}

	.ct-newsletter-subscribe-container form input[type="email"] {
		width: 100%;
	}

	.ct-newsletter-subscribe-container form button {
		width: 100%;
	}
}


/* =============================================
   5. SMALL MOBILE (max-width: 479.98px)
   ============================================= */

@media (max-width: 479.98px) {
	/* Product grid: 2 columns with even tighter fit */
	[data-products] {
		--grid-columns-gap: 8px !important;
		--grid-rows-gap: 12px !important;
	}

	[data-products] .woocommerce-loop-product__title,
	[data-products] .woocommerce-loop-category__title {
		--theme-font-size: 12px !important;
	}

	[data-products] .product .price {
		--theme-font-size: 13px !important;
	}

	/* Product card actions: smaller */
	[data-products] .ct-woo-card-actions .button {
		font-size: 11px;
		padding: 6px 10px;
	}

	/* Single product title */
	.entry-summary .entry-title {
		--theme-font-size: 20px !important;
	}

	/* Header: compact */
	[data-header*="type-1"] .ct-header [data-row*="middle"] {
		--height: 65px !important;
	}

	[data-header*="type-1"] .ct-header [data-id="logo"] .site-logo-container {
		--logo-max-height: 24px !important;
	}

	/* Search: tighter on very small */
	[data-header*="type-1"] .ct-header [data-row*="middle"] {
		padding-left: 8px;
		padding-right: 8px;
	}

	/* Cart button in header */
	[data-header*="type-1"] [data-id="cart"] {
		--margin: 0px 0px 0px 10px !important;
	}

	/* Account icon */
	[data-header*="type-1"] [data-id="account"] {
		--margin: 0px 0px 0px 10px !important;
	}

	/* Quantity input on product page: full row */
	.entry-summary-items > .ct-product-add-to-cart > .cart .quantity[data-type="type-2"] {
		min-width: 100%;
	}
}


/* =============================================
   6. LANDSCAPE PHONE (special case)
   ============================================= */

@media (max-height: 500px) and (orientation: landscape) {
	/* Header: minimize to save vertical space */
	[data-header*="type-1"] .ct-header [data-row*="top"] {
		display: none;
	}

	[data-header*="type-1"] .ct-header [data-row*="middle"] {
		--height: 55px !important;
	}

	/* Sticky header: thinner */
	[data-header*="type-1"] {
		--header-height: 55px !important;
		--header-sticky-height: 50px !important;
	}

	/* Product grid: 3 columns in landscape */
	[data-products] {
		--shop-columns: repeat(3, minmax(0, 1fr)) !important;
	}
}


/* =============================================
   7. HIGH DPI SCREENS (Retina)
   ============================================= */

@media (-webkit-min-device-pixel-ratio: 2),
       (min-resolution: 192dpi) {
	/* Thinner borders on retina */
	.product-entry-wrapper,
	[data-products="type-2"] .product,
	.ct-woocommerce-cart-form .cart_totals,
	.ct-order-review {
		border-width: 0.5px;
	}
}


/* =============================================
   8. DARK MODE (prefers-color-scheme)
   ============================================= */

@media (prefers-color-scheme: dark) {
	/* Keep light theme — don't auto-switch
	   But improve contrast for overlay elements */
	.cookie-notification {
		box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
	}
}


/* =============================================
   9. REDUCED MOTION
   ============================================= */

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		-webkit-animation-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		-webkit-animation-iteration-count: 1 !important;
		animation-iteration-count: 1 !important;
		-webkit-transition-duration: 0.01ms !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}


/* =============================================
   10. PRINT STYLESHEET
   ============================================= */

@media print {
	/* Hide non-essential elements */
	header,
	footer,
	.ct-sidebar,
	.ct-breadcrumbs,
	.woocommerce-tabs .tabs,
	.related,
	.up-sells,
	.ct-product-additional-actions,
	.ct-share-box,
	.cookie-notification,
	nav,
	.woo-listing-top,
	.woocommerce-ordering,
	.woocommerce-result-count,
	.ct-newsletter-subscribe-container,
	#wpadminbar {
		display: none !important;
	}

	body {
		background: white !important;
		color: black !important;
		font-size: 12pt;
	}

	a {
		color: black !important;
		text-decoration: underline;
	}

	/* Show URLs after links */
	a[href]::after {
		content: " (" attr(href) ")";
		font-size: 10pt;
		color: #555;
	}

	a[href^="#"]::after,
	a[href^="javascript:"]::after {
		content: "";
	}

	img {
		max-width: 100% !important;
		page-break-inside: avoid;
	}

	.product-entry-wrapper {
		page-break-inside: avoid;
	}
}


/* =============================================
   11. FOCUS STYLES (Accessibility)
   ============================================= */

/* Visible focus for keyboard navigation */
:focus-visible {
	outline: 2px solid var(--theme-palette-color-1);
	outline-offset: 2px;
}

/* Remove outline for mouse clicks */
:focus:not(:focus-visible) {
	outline: none;
}


/* =============================================
   12. CROSS-BROWSER FLEXBOX FIXES
   ============================================= */

/* Flex gap fallback for older Safari (< 14.1) */
@supports not (gap: 1px) {
	[data-products] .product {
		margin-bottom: 15px;
	}

	.entry-summary-items > .ct-product-add-to-cart > .cart > * {
		margin-bottom: 10px;
	}
}

/* IE11 / older Edge flexbox fix (unlikely but safe) */
[data-products] {
	display: -ms-grid;
	display: grid;
}

/* WebKit scrollbar styling for consistency */
::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

::-webkit-scrollbar-track {
	background: var(--theme-palette-color-7, #f5f5f5);
}

::-webkit-scrollbar-thumb {
	background: var(--theme-palette-color-5, #ccc);
	border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
	background: var(--theme-palette-color-3, #999);
}