/* Hair For You Beauty — WooCommerce components
   Catalogue, product, cart and checkout styled as one system. */

/* Breadcrumb ------------------------------------------------------------- */
.hfy-crumb,.hfy-crumb a{font-size:11px;letter-spacing:.02em;text-transform:uppercase;color:var(--hfy-muted)}
.hfy-crumb{padding-block:26px}
.hfy-crumb a:hover{color:var(--hfy-fuchsia)}

/* Shop header + layout ---------------------------------------------------- */
.hfy-shop__head{padding-bottom:30px;border-bottom:1px solid var(--hfy-line)}
.hfy-shop__head h1{margin:0}
.hfy-shop__grid{padding-block:34px 90px}

/* Filters ----------------------------------------------------------------- */
.hfy-filter{padding-block:22px;border-bottom:1px solid var(--hfy-line)}
.hfy-filter:first-child{padding-top:0}
.hfy-filter h3,.hfy-filter h4,.wp-block-woocommerce-product-filters h3{font-size:11px!important;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--hfy-ink);margin:0 0 16px}
.wc-block-components-checkbox__label{font-size:14px;color:var(--hfy-body)}
.wc-block-components-checkbox__input[type=checkbox]{border:1px solid var(--hfy-line-strong);border-radius:1px;width:15px;height:15px}
.wc-block-components-checkbox__input[type=checkbox]:checked{background:var(--hfy-pink);border-color:var(--hfy-pink)}
.wc-block-components-filter-submit-button,.wc-block-components-product-filter-clear-button{font-size:12px!important;letter-spacing:.04em;text-transform:uppercase;color:var(--hfy-muted)!important;border-bottom:1px solid var(--hfy-line-strong)}
/* chips */
.wc-block-product-filter-chips__item,.wc-block-components-product-filter-chips__item{border:1px solid var(--hfy-line-strong)!important;border-radius:0!important;padding:8px 13px!important;font-size:12px;background:#fff!important;color:var(--hfy-body)!important}
.wc-block-product-filter-chips__item[aria-checked=true],.wc-block-components-product-filter-chips__item[aria-checked=true]{border-color:var(--hfy-pink)!important;color:var(--hfy-fuchsia)!important;background:var(--hfy-soft)!important}
/* active filter tags */
.wc-block-components-filter-active-filters__item,.wc-block-product-filter-active__item{background:var(--hfy-soft);color:var(--hfy-fuchsia);font-size:12px;padding:7px 12px;border-radius:0}
/* price slider */
.wc-block-components-price-slider__range-input-progress{--range-color:var(--hfy-pink)}
.wc-block-components-price-slider__range-input::-webkit-slider-thumb{background:#fff;border:1px solid var(--hfy-pink)}

/* Toolbar ----------------------------------------------------------------- */
.hfy-toolbar{padding-bottom:20px;border-bottom:1px solid var(--hfy-line);margin-bottom:26px;gap:20px}
.hfy-toolbar__count,.hfy-toolbar__count p{font-size:13px;color:var(--hfy-muted);margin:0}
.hfy-toolbar__sort select,.woocommerce-ordering select{border:1px solid var(--hfy-line-strong);padding:10px 34px 10px 14px;font-family:inherit;font-size:13px;background-color:#fff;border-radius:var(--hfy-r);appearance:none;
	background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23241C20'/%3E%3C/svg%3E");
	background-repeat:no-repeat;background-position:right 12px center;background-size:10px}

/* Product cards ------------------------------------------------------------ */
.hfy-products .wc-block-product-template__responsive,.hfy-products .wp-block-post-template{gap:26px}
.hfy-card__media img,.wc-block-components-product-image img{width:100%;height:auto;border:1px solid var(--hfy-line);background:var(--hfy-blush)}
.hfy-card__media{margin-bottom:14px!important;position:relative}
.hfy-card__title{margin:0 0 6px}
.hfy-card__title a:hover{color:var(--hfy-fuchsia)}
.hfy-card__price{margin:0;font-weight:550;letter-spacing:-.01em;color:var(--hfy-ink)}
.hfy-card__price del{color:var(--hfy-muted);margin-right:8px;font-size:.88em}
.hfy-card__price ins{text-decoration:none;color:var(--hfy-pink)}
.hfy-card__button{margin-top:12px}
.wc-block-components-product-sale-badge,.hfy-card__media .onsale{background:var(--hfy-pink)!important;color:#fff!important;border:0!important;border-radius:0!important;font-size:9px;letter-spacing:.18em;text-transform:uppercase;padding:5px 10px;top:12px;left:12px;right:auto}
.hfy-empty{padding:70px 0;text-align:center}
.hfy-pagination{margin-top:52px}
.hfy-pagination a,.hfy-pagination span{font-size:13px;padding:6px 10px}
.hfy-pagination .current{color:var(--hfy-fuchsia);border-bottom:1px solid var(--hfy-pink)}

/* Product page ------------------------------------------------------------- */
.hfy-pdp__grid{padding-block:10px 60px}
@media(min-width:821px){.hfy-pdp__media{position:sticky;top:96px;align-self:flex-start}}
.hfy-pdp__title{margin:0 0 12px}
.hfy-pdp__price{font-size:26px;font-weight:550;letter-spacing:-.01em;color:var(--hfy-ink);margin:0 0 14px;display:block}
.hfy-pdp__price del{color:var(--hfy-muted);font-size:.7em;margin-right:10px}
.hfy-pdp__price ins{text-decoration:none;color:var(--hfy-pink)}
.hfy-pdp__stock{font-size:12px;letter-spacing:.02em;text-transform:uppercase;color:#3B7A57}
.hfy-pdp__excerpt{color:var(--hfy-muted);margin-top:18px}
.hfy-pdp__meta{margin-top:22px;padding-top:18px;border-top:1px solid var(--hfy-line);font-size:13px;color:var(--hfy-muted)}

/* Variation swatches ------------------------------------------------------- */
.hfy-pdp__form .variations{display:block;border:0;margin:26px 0}
.hfy-pdp__form .variations tr,.hfy-pdp__form .variations td,.hfy-pdp__form .variations th{display:block;border:0;padding:0}
.hfy-pdp__form .variations label{font-size:11px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--hfy-ink);display:block;margin:0 0 12px}
.hfy-pdp__form .variations tr+tr{margin-top:26px;display:block}
.hfy-swatches{display:flex;flex-wrap:wrap;gap:8px}
.hfy-swatch{border:1px solid var(--hfy-line-strong);background:#fff;color:var(--hfy-body);padding:9px 14px;font-family:inherit;font-size:12px;letter-spacing:.02em;cursor:pointer;border-radius:var(--hfy-r);transition:.2s}
.hfy-swatch:hover{border-color:var(--hfy-pink);color:var(--hfy-fuchsia)}
.hfy-swatch.is-selected{border-color:var(--hfy-pink);color:var(--hfy-fuchsia);background:var(--hfy-soft)}
.hfy-swatch.is-unavailable{color:#C9BFC5;text-decoration:line-through;cursor:not-allowed;border-color:var(--hfy-line)}
.hfy-swatches.is-colour .hfy-swatch{width:28px;height:28px;padding:0;border-radius:50%;background:var(--hfy-swatch,#ddd);border:1px solid var(--hfy-line-strong)}
.hfy-swatches.is-colour .hfy-swatch span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.hfy-swatches.is-colour .hfy-swatch.is-selected{box-shadow:0 0 0 2px #fff,0 0 0 3px var(--hfy-pink)}
/* Native select stays for no-JS and screen readers */
.hfy-swatch-fallback{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
html:not(.hfy-js) .hfy-swatches{display:none}
html:not(.hfy-js) .hfy-swatch-fallback{position:static;width:auto;height:auto;clip:auto;overflow:visible}
html:not(.hfy-js) .hfy-swatch-fallback select{border:1px solid var(--hfy-line-strong);padding:12px 14px;font-family:inherit;font-size:15px;background:#fff;width:100%;max-width:320px}

/* Quantity + add to cart ---------------------------------------------------- */
.hfy-pdp__form .quantity{display:inline-flex;border:1px solid var(--hfy-line-strong);align-items:center;border-radius:var(--hfy-r);margin-right:12px}
.hfy-pdp__form .quantity input[type=number]{width:60px;height:50px;border:0;text-align:center;font-family:inherit;font-size:15px;background:transparent}
.hfy-pdp__form .single_add_to_cart_button{background:var(--hfy-pink);color:#fff;border:0;border-radius:var(--hfy-r);padding:17px 34px;font-family:inherit;font-size:12px;font-weight:590;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:background .25s}
.hfy-pdp__form .single_add_to_cart_button:hover{background:var(--hfy-fuchsia)}
.hfy-pdp__form .single_add_to_cart_button.disabled{background:var(--hfy-line-strong);cursor:not-allowed}
.hfy-pdp__form .woocommerce-variation-price{font-size:22px;font-weight:550;color:var(--hfy-ink);margin-bottom:14px}
.hfy-pdp__form .reset_variations{font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--hfy-muted);margin-left:12px}
.hfy-pdp__form .stock.out-of-stock{color:#C0392B;font-size:13px}

/* Details tabs / accordion --------------------------------------------------- */
.hfy-pdp__details{margin-top:34px;border-top:1px solid var(--hfy-line)}
.wp-block-woocommerce-product-details .wc-tabs{display:none}
.hfy-pdp__details h2,.hfy-pdp__details h3{font-size:12px!important;letter-spacing:.02em;text-transform:uppercase;font-weight:600;padding-block:18px;margin:0;border-bottom:1px solid var(--hfy-line)}
.hfy-pdp__details .woocommerce-Tabs-panel{padding-bottom:18px;font-size:15px;color:var(--hfy-body)}

/* Cart ------------------------------------------------------------------------ */
.hfy-cart .wc-block-cart{gap:56px}
.wc-block-cart-items__row{border-bottom:1px solid var(--hfy-line);padding-block:26px}
.wc-block-cart-item__image img{border:1px solid var(--hfy-line);background:var(--hfy-blush)}
.wc-block-components-product-name{font-size:17px;font-weight:600;letter-spacing:-.02em;color:var(--hfy-ink)}
.wc-block-components-product-metadata{font-size:13px;color:var(--hfy-muted)}
.wc-block-cart__totals-title,.wc-block-components-totals-wrapper{font-size:14px}
.wc-block-cart .wc-block-components-sidebar,.wc-block-checkout__sidebar{background:var(--hfy-blush);border:1px solid var(--hfy-line);padding:30px;border-radius:var(--hfy-r)}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value{font-size:21px;font-weight:600;letter-spacing:-.02em;color:var(--hfy-ink)}
.wc-block-cart__submit-button,.wc-block-components-checkout-place-order-button{background:var(--hfy-pink)!important;color:#fff!important;border-radius:var(--hfy-r)!important;font-family:inherit;font-size:12px!important;font-weight:590;letter-spacing:.06em;text-transform:uppercase;padding:17px 30px!important}
.wc-block-cart__submit-button:hover,.wc-block-components-checkout-place-order-button:hover{background:var(--hfy-fuchsia)!important}
.wc-block-components-quantity-selector{border:1px solid var(--hfy-line-strong);border-radius:var(--hfy-r)}
.wc-block-components-quantity-selector__input{font-family:inherit}

/* Checkout --------------------------------------------------------------------- */
.wc-block-components-title,.wc-block-checkout__form h2{font-size:19px!important;font-weight:600;letter-spacing:-.02em;color:var(--hfy-ink)}
.wc-block-components-text-input input,.wc-block-components-country-input select,.wc-block-components-state-input select,.wc-block-components-select select{border:1px solid var(--hfy-line-strong)!important;border-radius:var(--hfy-r)!important;font-family:inherit;font-size:15px;padding:13px 14px;background:#fff}
.wc-block-components-text-input.is-active input:focus,.wc-block-components-text-input input:focus{border-color:var(--hfy-pink)!important;box-shadow:none;outline:2px solid transparent}
.wc-block-components-text-input label{color:var(--hfy-muted)}
.wc-block-components-validation-error{color:#C0392B;font-size:12px}
.wc-block-components-radio-control__option{border:1px solid var(--hfy-line-strong);padding:16px 18px;margin-bottom:12px;border-radius:var(--hfy-r)}
.wc-block-components-radio-control__option--checked-option-highlighted,.wc-block-components-radio-control-accordion-option--checked-option-highlighted{border-color:var(--hfy-pink);background:var(--hfy-blush)}
.wc-block-components-radio-control__input:checked{border-color:var(--hfy-pink);background:var(--hfy-pink)}
.wc-block-components-order-summary-item__image img{border:1px solid var(--hfy-line)}
@media(min-width:821px){.wc-block-checkout__sidebar{position:sticky;top:96px}}

/* Mobile ------------------------------------------------------------------------ */
@media(max-width:820px){
	.hfy-shop__grid,.hfy-pdp__grid{gap:0}
	.hfy-filters{margin-bottom:12px}
	.hfy-filters__inner{border:1px solid var(--hfy-line);padding:18px;border-radius:var(--hfy-r)}
	.hfy-products .wc-block-product-template__responsive,.hfy-products .wp-block-post-template{gap:16px}
	.hfy-toolbar{flex-wrap:wrap;gap:12px}
	.hfy-pdp__form .quantity{margin-bottom:12px}
	.hfy-pdp__form .single_add_to_cart_button{width:100%}
	.wc-block-cart .wc-block-components-sidebar,.wc-block-checkout__sidebar{padding:22px}
}

/* ---- corrections after live testing ---- */

/* Sale badge: WooCommerce's default is a dark circle on the single product. */
.woocommerce span.onsale,
.wc-block-components-product-sale-badge,
.hfy-pdp span.onsale{
	background:var(--hfy-pink)!important;color:#fff!important;
	border-radius:0!important;border:0!important;
	min-height:0!important;min-width:0!important;
	padding:6px 12px!important;margin:0!important;
	font-size:9px!important;font-weight:590;letter-spacing:.18em;text-transform:uppercase;
	line-height:1.3!important;
	top:14px!important;left:14px!important;right:auto!important;bottom:auto!important;
}

/* Catalogue: hold three across on desktop, four for featured/related rows. */
@media(min-width:1100px){
	.hfy-shop__results .wc-block-product-template{grid-template-columns:repeat(3,minmax(0,1fr))!important}
	.hfy-related .wc-block-product-template,
	.hfy-section > .hfy-products .wc-block-product-template{grid-template-columns:repeat(4,minmax(0,1fr))!important}
}
@media(max-width:820px){
	.wc-block-product-template{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* Cart: side-by-side items and summary on desktop. */
@media(min-width:900px){
	.hfy-cart .wc-block-cart{display:flex;gap:56px;align-items:flex-start}
	.hfy-cart .wc-block-cart__main{flex:1 1 auto;min-width:0;padding-right:0}
	.hfy-cart .wc-block-cart__sidebar{flex:0 0 360px;max-width:360px}
}
.hfy-cart .wc-block-cart-items{margin-top:0}
.hfy-cart .wc-block-cart__submit-container{padding:0}

/* Product gallery: keep it from towering over the details column. */
.hfy-pdp__media .woocommerce-product-gallery__image img{border:1px solid var(--hfy-line);background:var(--hfy-blush)}
.hfy-pdp__media .flex-control-thumbs{display:flex;gap:12px;margin-top:12px;padding:0;list-style:none}
.hfy-pdp__media .flex-control-thumbs li{width:78px;margin:0}
.hfy-pdp__media .flex-control-thumbs img{border:1px solid var(--hfy-line);opacity:1}
.hfy-pdp__media .flex-control-thumbs img.flex-active{border-color:var(--hfy-pink)}

/* SKU / meta line */
.hfy-pdp .product_meta,.hfy-pdp__meta{font-size:13px;color:var(--hfy-muted);margin-top:22px;padding-top:18px;border-top:1px solid var(--hfy-line)}
.hfy-pdp .product_meta > span{display:block;margin-bottom:6px}

/* Variation price + stock spacing */
.hfy-pdp__form .woocommerce-variation-add-to-cart{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.hfy-pdp__form .woocommerce-variation-availability{font-size:13px;color:var(--hfy-muted);margin-bottom:10px}

/* Filters: inline sidebar on desktop, WooCommerce's own drawer on mobile. */
@media(min-width:821px){
	.hfy-filters .wc-block-product-filters__open-overlay,
	.hfy-filters .wc-block-product-filters__overlay-header{display:none!important}
	.hfy-filters .wc-block-product-filters__overlay,
	.hfy-filters .wc-block-product-filters__overlay-wrapper,
	.hfy-filters .wc-block-product-filters__overlay-dialog,
	.hfy-filters .wc-block-product-filters__overlay-content{
		position:static!important;display:block!important;background:none!important;
		box-shadow:none!important;padding:0!important;max-width:none!important;width:auto!important;inset:auto!important}
}
@media(max-width:820px){
	.hfy-filters .wc-block-product-filters__open-overlay{
		width:100%;border:1px solid var(--hfy-line-strong);background:#fff;
		padding:13px 18px;font-family:inherit;font-size:12px;font-weight:590;
		letter-spacing:.06em;text-transform:uppercase;color:var(--hfy-ink);border-radius:var(--hfy-r)}
}

/* ---- shop sidebar containment ----
   The filter column is a flex item; without min-width:0 it refuses to shrink
   below the intrinsic width of WooCommerce's checkbox lists and chip rows,
   so the panels spill over the product grid. */
.hfy-shop__grid{align-items:flex-start}
.hfy-shop__grid > .hfy-filters{flex:0 0 264px!important;width:264px!important;max-width:264px!important;min-width:0!important}
.hfy-shop__grid > .hfy-shop__results{flex:1 1 auto;min-width:0}

.hfy-filters,
.hfy-filters *{min-width:0!important;box-sizing:border-box}

.hfy-filters .hfy-filters__inner,
.hfy-filters .wc-block-product-filters,
.hfy-filters .wc-block-product-filters__overlay,
.hfy-filters .wc-block-product-filters__overlay-wrapper,
.hfy-filters .wc-block-product-filters__overlay-dialog,
.hfy-filters .wc-block-product-filters__overlay-content{
	width:100%!important;max-width:100%!important;margin:0!important;
	padding:0!important;border:0!important;background:none!important;box-shadow:none!important;
}

/* Checkbox lists: WooCommerce wraps these in a bordered, fixed-width scroll box. */
.hfy-filters [class*="product-filter-checkbox-list"]{
	border:0!important;padding:0!important;margin:0!important;
	max-height:none!important;overflow:visible!important;width:100%!important;background:none!important;
}
.hfy-filters [class*="checkbox-list__list"]{margin:0;padding:0;list-style:none;width:100%}
.hfy-filters [class*="checkbox-list__item"]{margin:0 0 10px;width:100%}
.hfy-filters .wc-block-components-checkbox{margin:0;width:100%}
.hfy-filters .wc-block-components-checkbox__label{font-size:14px;overflow-wrap:anywhere}
.hfy-filters [class*="checkbox-list__show-more"],
.hfy-filters [class*="checkbox-list__show-less"]{font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--hfy-muted)}

/* Chip rows wrap inside the column instead of running past it. */
.hfy-filters [class*="chips__items"],
.hfy-filters [class*="chips-list"]{display:flex!important;flex-wrap:wrap!important;gap:8px!important;width:100%;margin:0;padding:0;list-style:none}
.hfy-filters [class*="chips__item"]{margin:0!important;max-width:100%}

/* Price slider fits the column. */
.hfy-filters [class*="price-slider"]{width:100%!important;max-width:100%!important}
.hfy-filters [class*="price-slider__range"]{width:100%!important}

/* Section rhythm */
.hfy-filters .hfy-filter{padding-block:20px;border-bottom:1px solid var(--hfy-line);width:100%}
.hfy-filters .hfy-filter:first-child{padding-top:0}
.hfy-filters .hfy-filter__title{margin:0 0 14px!important}

/* ---- filter checkbox rows ----
   The label is an inline-flex with two children and no flex basis, so the
   16px checkbox was stretching to half the row. Pin the box, let the text flow. */
.hfy-filters .wc-block-product-filter-checkbox-list__item{display:block;width:100%;margin:0 0 10px}
.hfy-filters .wc-block-product-filter-checkbox-list__label{
	display:flex!important;align-items:center;gap:10px;width:100%;cursor:pointer}
.hfy-filters .wc-block-product-filter-checkbox-list__input-wrapper{
	flex:0 0 16px!important;width:16px!important;height:16px!important;
	display:block!important;position:relative;margin:0}
.hfy-filters .wc-block-product-filter-checkbox-list__input{
	width:16px!important;height:16px!important;min-width:0!important;margin:0!important;
	border:1px solid var(--hfy-line-strong);border-radius:1px;background:#fff;appearance:none;cursor:pointer}
.hfy-filters .wc-block-product-filter-checkbox-list__input:checked{background:var(--hfy-pink);border-color:var(--hfy-pink)}
.hfy-filters .wc-block-product-filter-checkbox-list__input-wrapper svg{
	display:block!important;position:absolute;inset:0;width:16px;height:16px;pointer-events:none;fill:#fff;opacity:0}
.hfy-filters .wc-block-product-filter-checkbox-list__input:checked + svg{opacity:1}
.hfy-filters .wc-block-product-filter-checkbox-list__text-wrapper{
	flex:1 1 auto!important;display:flex!important;align-items:center;justify-content:space-between;
	gap:8px;min-width:0;font-size:14px;color:var(--hfy-body)}
.hfy-filters .wc-block-product-filter-checkbox-list__text{overflow-wrap:anywhere}
.hfy-filters .wc-block-product-filter-checkbox-list__count{color:var(--hfy-muted);font-size:12px;flex:none}
.hfy-filters .wc-block-product-filter-checkbox-list__items{display:block;width:100%}

/* ---- product card aspect ratio ----
   WooCommerce's product-image block forces a 1:1 box, which crops the top off
   4:5 product photography. Match the container to the photography instead. */
.hfy-products .wc-block-components-product-image,
.hfy-products .hfy-card__media{aspect-ratio:4/5!important;overflow:hidden;display:block}
.hfy-products .wc-block-components-product-image a,
.hfy-products .hfy-card__media a{display:block;width:100%;height:100%}
.hfy-products .wc-block-components-product-image img,
.hfy-products .hfy-card__media img{width:100%!important;height:100%!important;object-fit:cover;object-position:center}
