/* =====================================================================
   Jamaica Auto Parts — WordPress/WooCommerce integration supplement.
   Loads AFTER theme.css (the ported Option B design system). Only adds glue
   the static prototype did not need: a11y helpers, button aliases, WhatsApp
   button, and mapping WooCommerce markup onto the prototype's components.
   ===================================================================== */

/* ---------- Accessibility ---------- */
.screen-reader-text {
	border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%);
	height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute;
}
.jap-skip-link {
	position: absolute; left: -9999px; top: 0; z-index: 2000;
	padding: 12px 20px; background: var(--blue); color: #fff; font-weight: 700;
	border-radius: 0 0 8px 0;
}
.jap-skip-link:focus { left: 0; }
:focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; }

/* ---------- Button aliases (theme templates use .jap-btn) ---------- */
.jap-btn { display:inline-flex; align-items:center; gap:10px; padding:12px 22px; border-radius:var(--radius-sm); font-family:var(--f-body); font-weight:700; font-size:.88rem; border:1px solid transparent; cursor:pointer; transition:var(--transition); white-space:nowrap; text-decoration:none; }
.jap-btn--primary { background:var(--blue); color:#fff; border-color:var(--blue); box-shadow:0 4px 12px -4px rgba(11,95,255,.3); }
.jap-btn--primary:hover { background:var(--blue-dim); color:#fff; transform:translateY(-1px); }
.jap-btn--ghost { background:transparent; color:var(--text); border-color:var(--line-2); }
.jap-btn--ghost:hover { border-color:var(--blue); color:var(--blue); }
.jap-btn--block { width:100%; justify-content:center; }

/* ---------- WooCommerce loop → prototype card grid ---------- */
.woocommerce ul.products,
ul.products {
	list-style:none; margin:0; padding:0; display:grid; gap:20px;
	grid-template-columns:repeat(auto-fill, minmax(230px, 1fr));
}
ul.products::before, ul.products::after { display:none !important; }
ul.products li.product { width:auto !important; margin:0 !important; float:none !important; }

/* ---------- Shop layout (filter rail + results) ---------- */
.woocommerce-products-header { padding: 28px 0 0; }
.woocommerce-products-header__title { font-family:var(--f-display); font-size:1.9rem; margin:0; }
.jap-shop { display:grid; grid-template-columns:260px 1fr; gap:32px; padding:20px 0 60px; align-items:start; }
.jap-shop__results { min-width:0; }
.jap-filters-toggle { display:none; }
.jap-archive-context { background:rgba(11,95,255,.05); border:1px solid var(--line); border-radius:var(--radius-sm); padding:10px 14px; margin:0 0 16px; font-size:.9rem; }
.jap-archive-context a { color:var(--blue); font-weight:600; }
.jap-filters { position:sticky; top:120px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; padding:18px; }
.jap-filters__group { border:0; padding:0; margin:0 0 18px; }
.jap-filters__group legend { font-weight:700; font-size:.8rem; text-transform:uppercase; letter-spacing:.06em; color:var(--text); margin-bottom:8px; padding:0; }
.jap-filters__opt { display:flex; align-items:center; gap:8px; margin:6px 0; font-size:.9rem; color:var(--muted); cursor:pointer; }
.jap-filters__opt input { accent-color:var(--blue); }
.jap-filters__price { display:flex; gap:8px; }
.jap-filters__price input { width:100%; padding:8px 10px; border:1px solid var(--line-2); border-radius:var(--radius-sm); font:inherit; }
.jap-filters__actions { margin-top:16px; }
.jap-filters__clear { display:inline-block; margin-top:10px; font-size:.85rem; color:var(--muted); text-decoration:underline; }

/* ---------- WooCommerce single / cart / checkout basic mapping ---------- */
.woocommerce, .woocommerce-page { }
.single-product div.product, .woocommerce-cart .woocommerce, .woocommerce-checkout .woocommerce {
	max-width: var(--container, 1240px); margin: 0 auto; padding: 32px 24px 60px;
}
.woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt,
.wc-block-components-button {
	background:var(--blue) !important; color:#fff !important; border-radius:var(--radius-sm) !important;
	font-weight:700 !important; border:0 !important;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover { background:var(--blue-dim) !important; }
.woocommerce span.price, .woocommerce div.product p.price, .woocommerce .woocommerce-Price-amount { font-variant-numeric:tabular-nums; }
.single-product div.product .product_title { font-family:var(--f-display); }

/* ---------- Hero heading on dark banner (beats theme.json global heading color) ---------- */
.home-hero-banner h1 { color: #fff; }

/* ---------- WhatsApp float button ---------- */
.jap-whatsapp {
	position:fixed; right:20px; bottom:20px; z-index:900;
	width:56px; height:56px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
	background:#25D366; color:#fff; box-shadow:0 8px 24px -6px rgba(37,211,102,.5); transition:var(--transition);
}
.jap-whatsapp:hover { color:#fff; transform:translateY(-2px) scale(1.05); }

/* ---------- Responsive shop ---------- */
@media (max-width: 960px) {
	.jap-shop { grid-template-columns:1fr; }
	.jap-filters { position:static; }
	.jap-filters-toggle { display:inline-flex; margin-bottom:10px; }
}