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

/* ---------- Breadcrumb ----------
   One look for all three implementations: .also-crumb on content pages,
   .also-shopcrumb on the shop, .woocommerce-breadcrumb on the PDP. They had
   drifted to 15px/13.6px/15.64px and the PDP was rendering in unstyled #767676. */
.also-breadcrumb{display:block;padding-block:1.1rem .2rem}
.also-crumb,
.also-shopcrumb,
/* WooCommerce ships `.woocommerce:where(...) .woocommerce-breadcrumb`, which is
   two classes — a bare .woocommerce-breadcrumb loses to it. Going through our
   own wrapper matches that weight without !important. */
.also-breadcrumb .woocommerce-breadcrumb{
  font-size:var(--fs-small);
  line-height:1.4;
  color:var(--text-muted);
  margin:0 0 .7rem;
}
.also-crumb a,
.also-shopcrumb a,
.also-breadcrumb .woocommerce-breadcrumb a{
  color:var(--text-muted);
  text-decoration:none;
  padding-block:.35rem;      /* keeps the tap target at a usable height */
}
.also-crumb a:hover,
.also-shopcrumb a:hover,
.also-breadcrumb .woocommerce-breadcrumb a:hover{color:var(--accent);text-decoration:underline}
.also-crumb a:focus-visible,
.also-shopcrumb a:focus-visible,
.also-breadcrumb .woocommerce-breadcrumb a:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:3px}
.also-crumb span[aria-hidden],
.also-shopcrumb span[aria-hidden]{margin:0 .4rem;opacity:.55}

/* ---------- 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 ---------- */
.also-main .also-section.also-account__section{padding-block:clamp(2rem,4vw,3.5rem) clamp(3rem,6vw,5rem)}
.also-account__container{max-width:1120px}
.also-account__intro{text-align:center;margin-bottom:2rem}
.also-account__intro h1{font-size:clamp(2.25rem,4vw,3rem);line-height:1.15;margin:0 0 .65rem}
.also-account__intro p{margin:0;color:var(--text-muted);font-size:1.05rem;line-height:1.6}
.also-account__back{display:inline-flex;align-items:center;min-height:44px;color:var(--accent);text-underline-offset:4px}
.woocommerce-account .woocommerce{display:grid;grid-template-columns:240px minmax(0,1fr);gap:1.5rem;align-items:start}
.woocommerce-account .woocommerce::before,.woocommerce-account .woocommerce::after,.woocommerce-account .woocommerce .col2-set::before,.woocommerce-account .woocommerce .col2-set::after{display:none;content:none}
.woocommerce-account .woocommerce-notices-wrapper{grid-column:1/-1}
.woocommerce-account .woocommerce-notices-wrapper:empty{display:none}
.woocommerce-account .woocommerce-MyAccount-navigation{float:none;width:auto;min-width:0;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{float:none;width:auto;min-width:0;background:var(--surface-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:clamp(1.25rem,3vw,2rem);overflow-wrap:anywhere}
.woocommerce-account:not(.logged-in) .woocommerce{display:block;width:100%;max-width:none;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)}
.woocommerce-account .woocommerce #customer_login{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem;align-items:stretch;width:100%;margin:0}
.woocommerce-account .woocommerce #customer_login>.col-1,.woocommerce-account .woocommerce #customer_login>.col-2{float:none;width:auto;min-width:0;margin:0;padding:clamp(1.5rem,3vw,2.25rem);border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface-card);box-shadow:var(--shadow-sm)}
.woocommerce-account .woocommerce #customer_login>.col-2{background:var(--acc-blue-pale);border-color:var(--acc-blue)}
.woocommerce-account #customer_login h2{font-size:clamp(1.75rem,3vw,2.15rem);line-height:1.2;margin:0 0 1.5rem}
.woocommerce-account #customer_login form.login,.woocommerce-account #customer_login form.register{margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
.woocommerce-account .woocommerce form .form-row{padding:0;margin:0 0 1.1rem}
.woocommerce-account .woocommerce form .form-row label{line-height:1.5;margin-bottom:.4rem}
.woocommerce-account .woocommerce form .form-row input.input-text{width:100%;font-size:16px;line-height:1.5}
.woocommerce-account .woocommerce form .password-input input.input-text{padding-right:3rem!important}
.woocommerce-account .woocommerce form .show-password-input{top:50%;right:0;width:48px;height:48px;padding:0;display:grid;place-items:center;transform:translateY(-50%)}
.woocommerce-account .woocommerce form .show-password-input::after{margin:0}
.woocommerce-account .woocommerce form .woocommerce-form-login__rememberme{display:flex;align-items:center;gap:.5rem;min-height:44px;margin:0 0 .75rem}
.woocommerce-account .woocommerce form .woocommerce-form-login__rememberme input{width:18px;height:18px;margin:0;flex:none}
.woocommerce-account .woocommerce .woocommerce-form-login__submit,.woocommerce-account .woocommerce .woocommerce-form-register__submit{float:none;width:100%;margin:0}
.woocommerce-account .woocommerce .woocommerce-LostPassword{margin:0}
.woocommerce-account .woocommerce .woocommerce-LostPassword a{display:inline-flex;align-items:center;min-height:44px;text-underline-offset:4px}
.woocommerce-account .woocommerce-privacy-policy-text{font-size:.95rem;line-height:1.65;margin:0 0 1.1rem}
.woocommerce-account .woocommerce-privacy-policy-text p{margin:0}
.woocommerce-account .woocommerce .woocommerce-ResetPassword{max-width:640px;padding:clamp(1.5rem,3vw,2.25rem);margin:0 auto;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface-card);box-shadow:var(--shadow-sm)}
.woocommerce-account .woocommerce .woocommerce-ResetPassword>p:first-child{margin-top:0;line-height:1.65}
.woocommerce-account .woocommerce .woocommerce-ResetPassword .form-row{float:none;width:100%}
.woocommerce-account .woocommerce .woocommerce-ResetPassword button{width:100%}
.woocommerce-account .woocommerce .woocommerce-error,.woocommerce-account .woocommerce .woocommerce-message,.woocommerce-account .woocommerce .woocommerce-info{padding:1rem 1.25rem;line-height:1.6;overflow-wrap:anywhere}
.woocommerce-account .woocommerce .woocommerce-error::before,.woocommerce-account .woocommerce .woocommerce-message::before,.woocommerce-account .woocommerce .woocommerce-info::before{display:none}
.woocommerce-account .woocommerce :is(input,button,a):focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px}
@media(max-width:760px){
  .woocommerce-account .woocommerce #customer_login{grid-template-columns:minmax(0,1fr)}
  .also-account__intro{margin-bottom:1.5rem}
}

/* ---------- 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}
}