/* Also Coffee Co — WooCommerce styling (brand-consistent with the homepage) */

/* ---------- Breadcrumb ---------- */
.also-breadcrumb{padding-block:1.1rem .2rem}
.woocommerce-breadcrumb{font-size:.85rem;color:var(--text-muted)}
.woocommerce-breadcrumb a{color:var(--text-muted);text-decoration:none}
.woocommerce-breadcrumb a:hover{color:var(--accent)}

/* ---------- Shop header ---------- */
.also-shop-head{padding-bottom:0}
.also-shop-head h1{font-size:var(--fs-h1);margin:.2em 0 .25em}
.also-shop-head__intro{color:var(--text-muted);max-width:54ch;font-size:var(--fs-lead)}
.also-usp-strip{list-style:none;margin:1.2rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.6rem 1.4rem}
.also-usp-strip li{display:inline-flex;align-items:center;gap:.5rem;font-weight:600;color:var(--text-strong);font-size:.9rem}
.also-usp-strip li .also-ic{color:var(--accent);width:1.15em;height:1.15em}
.also-shop-loop{padding-top:var(--space-xl)}

/* ---------- Product grid (reuse the homepage card system) ---------- */
.woocommerce ul.products,.woocommerce-page ul.products{display:grid !important;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.6rem);margin:0;padding:0;list-style:none}
.woocommerce ul.products li.product,.woocommerce-page ul.products li.product{width:auto !important;margin:0 !important;float:none !important;padding:0;display:flex}
.woocommerce ul.products li.product::before{display:none}
/* WooCommerce's clearfix ::before/::after become stray grid items — remove them */
.woocommerce ul.products::before,.woocommerce ul.products::after,.woocommerce-page ul.products::before,.woocommerce-page ul.products::after{display:none !important;content:none !important}
.woocommerce ul.products li.product .also-pcard{width:100%}
.woocommerce .woocommerce-ordering{margin-bottom:var(--space-md)}
.woocommerce .woocommerce-ordering select,.woocommerce-ordering .orderby{appearance:none;background:var(--surface-card);border:1.5px solid var(--border-strong);border-radius:var(--radius-pill);padding:.6rem 2.2rem .6rem 1.1rem;font-family:var(--font-body);font-weight:600;color:var(--text-strong);cursor:pointer}
.woocommerce .woocommerce-result-count{color:var(--text-muted);font-size:.9rem}

/* Routine banner (shop foot) */
.also-routine-banner{background:var(--acc-blue-soft);color:var(--acc-ink-deep);padding-block:var(--space-xl)}
.also-routine-banner__in{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap}
.also-routine-banner h2{margin:0 0 .2em;color:var(--acc-ink-deep);font-size:var(--fs-h3)}
.also-routine-banner p{margin:0;color:var(--acc-ink-deep)}

/* ---------- PDP ---------- */
.also-pdp__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:start;padding-block:var(--space-xl)}
.also-pdp__media{border-radius:var(--radius-xl);padding:clamp(1.5rem,4vw,3rem);position:sticky;top:90px}
.also-pdp__media img{filter:drop-shadow(var(--shadow-product));border-radius:var(--radius-md)}
.also-pdp .woocommerce-product-gallery{margin:0}
.also-pdp .onsale{position:absolute;top:14px;left:14px;background:var(--acc-primary);color:var(--acc-cream);border-radius:var(--radius-pill);padding:.25rem .7rem;font-size:.78rem;font-weight:700;min-height:0}
.also-pdp__summary .product_title{font-size:var(--fs-h1);margin:0 0 .3rem;line-height:1.05}
.also-pdp__strength{margin:.2rem 0 .6rem}
.also-pdp__summary .woocommerce-product-rating{margin:0 0 .6rem;display:flex;align-items:center;gap:.5rem}
.also-pdp__summary .price{color:var(--text-strong);font-size:1.5rem;font-weight:700;margin:.2rem 0}
.also-pdp__summary .price .from,.also-pdp__summary .price del{color:var(--text-muted);font-weight:500;font-size:1rem}
.also-pdp__subscribe{display:flex;gap:.7rem;align-items:flex-start;background:var(--acc-blue-pale);color:var(--acc-ink-deep);border-radius:var(--radius-md);padding:.9rem 1.1rem;margin:.8rem 0 1.1rem}
.also-pdp__subscribe .also-ic{color:var(--accent);flex:none;margin-top:.1rem}
.also-pdp__summary .woocommerce-product-details__short-description{color:var(--text-muted);margin-bottom:1.2rem}

/* Variation form */
.also-pdp table.variations{border:0;margin:0 0 1rem;width:100%;background:transparent}
.also-pdp table.variations td,.also-pdp table.variations th{border:0;padding:.35rem 0;display:block;text-align:left;background:transparent}
.also-pdp table.variations th.label{font-weight:700;color:var(--text-strong);padding-top:.6rem}
.also-pdp table.variations td.value{width:100%}
.also-pdp .variations select{width:100%;appearance:none;background:var(--surface-card);border:1.5px solid var(--border-strong);border-radius:var(--radius-md);padding:.7rem 1rem;font-family:var(--font-body);font-weight:600;color:var(--text-strong);min-height:46px;cursor:pointer}
.also-pdp .reset_variations{font-size:.82rem;color:var(--text-muted);margin-left:.4rem}
.also-pdp .single_variation .price{margin:.4rem 0}
.also-pdp .woocommerce-variation-add-to-cart{display:flex;gap:.6rem;align-items:stretch;flex-wrap:wrap;margin-top:.6rem}
.also-pdp .quantity{display:flex;align-items:center}
.also-pdp .quantity .qty{width:64px;height:52px;text-align:center;border:1.5px solid var(--border-strong);border-radius:var(--radius-md);font-family:var(--font-body);font-weight:700;font-size:1rem}
.also-pdp .single_add_to_cart_button{flex:1;min-width:200px}
.also-pdp__reassure{list-style:none;margin:1.4rem 0 0;padding:1.2rem 0 0;border-top:1px solid var(--border);display:grid;gap:.7rem}
.also-pdp__reassure li{display:flex;gap:.6rem;align-items:flex-start;color:var(--text-muted);font-size:.92rem}
.also-pdp__reassure .also-ic{color:var(--accent);flex:none;margin-top:.1rem}
.also-pdp .product_meta{margin-top:1.2rem;font-size:.85rem;color:var(--text-muted)}

/* PDP tabs + related */
.also-pdp__extra{background:var(--acc-base);padding-block:var(--space-2xl)}
.woocommerce-tabs ul.tabs{list-style:none;display:flex;gap:.5rem;padding:0;margin:0 0 var(--space-md);border-bottom:1px solid var(--border)}
.woocommerce-tabs ul.tabs li{margin:0}
.woocommerce-tabs ul.tabs li a{display:block;padding:.7rem 1.1rem;font-weight:700;color:var(--text-muted);text-decoration:none;border-radius:var(--radius-md) var(--radius-md) 0 0}
.woocommerce-tabs ul.tabs li.active a{color:var(--accent);box-shadow:inset 0 -3px 0 var(--accent)}
.woocommerce-tabs .panel{color:var(--text-body)}
.related.products>h2,.up-sells>h2{font-size:var(--fs-h2);margin-bottom:var(--space-lg)}

/* ---------- Cart ---------- */
.also-cart-reassure{margin-bottom:var(--space-lg)}
.also-ship-progress{margin:0 0 .5rem;color:var(--text-strong);font-weight:600}
.also-ship-progress .also-ic{color:var(--accent);vertical-align:-2px}
.also-ship-bar{height:8px;border-radius:var(--radius-pill);background:var(--acc-surface);overflow:hidden;margin-bottom:1rem}
.also-ship-bar span{display:block;height:100%;background:var(--acc-blue);transition:width var(--dur-slow) var(--ease-out)}
.woocommerce table.shop_table{border:0;border-radius:var(--radius-lg);background:var(--surface-card);box-shadow:var(--shadow-sm);overflow:hidden;border-collapse:separate}
.woocommerce table.shop_table th{background:transparent;color:var(--text-muted);font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;border-bottom:1px solid var(--border)}
.woocommerce table.shop_table td{border-top:1px solid var(--border);padding:1rem;vertical-align:middle}
.woocommerce table.cart img{width:64px;border-radius:var(--radius-md);background:var(--acc-surface)}
.woocommerce a.remove{color:var(--accent) !important;border:1px solid var(--border-strong);border-radius:50%}
.woocommerce .cart-collaterals .cart_totals{background:var(--surface-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:var(--space-md)}
.woocommerce .cart_totals h2{font-size:var(--fs-h3);margin-top:0}
.woocommerce .wc-proceed-to-checkout{padding-top:.5rem}
.woocommerce #coupon_code{border:1.5px solid var(--border-strong);border-radius:var(--radius-pill);padding:.7rem 1rem;min-height:46px}

/* ---------- Checkout ---------- */
.woocommerce-checkout .col2-set,.woocommerce-checkout #customer_details{margin-bottom:var(--space-lg)}
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.woocommerce-checkout select,.select2-container .select2-selection{background:var(--surface-card) !important;border:1.5px solid var(--border-strong) !important;border-radius:var(--radius-md) !important;padding:.75rem 1rem !important;font-family:var(--font-body);min-height:48px !important;color:var(--text-strong)}
.woocommerce form .form-row label{font-weight:600;color:var(--text-strong)}
.woocommerce-checkout #payment{background:var(--surface-raised);border-radius:var(--radius-lg)}
.woocommerce-checkout-review-order{background:var(--surface-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:var(--space-md)}
#place_order{width:100%}
.also-usp-strip--checkout{justify-content:center;margin:0 0 var(--space-lg);padding:1rem;background:var(--surface-raised);border-radius:var(--radius-md)}

/* ---------- My account ---------- */
.woocommerce-account .woocommerce{display:grid;grid-template-columns:240px 1fr;gap:var(--space-xl);align-items:start}
.woocommerce-MyAccount-navigation{background:var(--surface-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:.6rem}
.woocommerce-MyAccount-navigation ul{list-style:none;margin:0;padding:0}
.woocommerce-MyAccount-navigation li a{display:block;padding:.7rem 1rem;border-radius:var(--radius-md);color:var(--text-body);text-decoration:none;font-weight:600}
.woocommerce-MyAccount-navigation li.is-active a,.woocommerce-MyAccount-navigation li a:hover{background:var(--acc-surface);color:var(--accent)}
.woocommerce-account .woocommerce-MyAccount-content{background:var(--surface-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:var(--space-lg)}
.woocommerce-account:not(.logged-in) .woocommerce{grid-template-columns:1fr;max-width:460px;margin-inline:auto}
.woocommerce form.login,.woocommerce form.register{border:0;border-radius:var(--radius-lg);background:var(--surface-card);box-shadow:var(--shadow-sm);padding:var(--space-lg)}

/* ---------- Notices ---------- */
.woocommerce-message,.woocommerce-info,.woocommerce-error{border-radius:var(--radius-md);border:0;padding:1rem 1.2rem;font-weight:600}
.woocommerce-message{background:var(--acc-blue-pale);color:var(--acc-ink-deep);border-top:3px solid var(--acc-blue)}
.woocommerce-info{background:var(--surface-raised);color:var(--text-strong);border-top:3px solid var(--border-strong)}
.woocommerce-error{background:#F8E7DE;color:#7A2E12;border-top:3px solid #C0502B;list-style:none}
.woocommerce-message a.button,.woocommerce-info a.button{float:none;margin-left:.6rem}

/* ---------- Buttons: map Woo roles to brand variants ---------- */
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit,.woocommerce .button{background:var(--btn-primary-bg);color:var(--btn-primary-text);border:0;border-radius:var(--radius-pill);font-family:var(--font-body);font-weight:700;padding:.85em 1.5em;min-height:48px;line-height:1;transition:transform var(--dur-base) var(--ease-out),background var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out);cursor:pointer}
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover,.woocommerce .button:hover{background:var(--btn-primary-bg-hover);transform:translateY(var(--hover-lift));box-shadow:var(--shadow-md)}
.woocommerce a.button:active,.woocommerce button.button:active{transform:scale(var(--press-scale))}
.woocommerce button[name="update_cart"],.woocommerce .button.wc-backward,.woocommerce .added_to_cart,.woocommerce-cart .actions .button{background:var(--btn-secondary-bg) !important;color:var(--btn-secondary-text) !important}
.woocommerce button[name="update_cart"]:hover,.woocommerce .button.wc-backward:hover{background:var(--btn-secondary-bg-hover) !important}
.woocommerce .single_add_to_cart_button,.woocommerce .checkout-button,.woocommerce #place_order{font-size:1.08rem}

/* ---------- Responsive ---------- */
@media (max-width:920px){
  .woocommerce ul.products,.woocommerce-page ul.products{grid-template-columns:repeat(2,1fr)}
  .also-pdp__grid{grid-template-columns:1fr}
  .also-pdp__media{position:static}
  .woocommerce-account .woocommerce{grid-template-columns:1fr}
}
@media (max-width:560px){
  .woocommerce ul.products,.woocommerce-page ul.products{grid-template-columns:1fr}
  .also-routine-banner__in{flex-direction:column;align-items:flex-start}
}