/* ============================================================
   RRK Labs — WooCommerce store skin
   Cart · Checkout · Thank-you · My Account
   Skins WooCommerce's NATIVE markup to the RRK design system.
   Load order: homepage.css -> woo-store.css
   Everything is scoped under .rrk-wc (the wrapper in the page-*.php
   templates) so it never leaks into other WooCommerce contexts.
   ============================================================ */

/* ---- Page heads (cart / account share the legal-head look) ---- */
.cart-head, .acct-head{padding-block:1.3rem clamp(1.2rem,3vw,1.8rem)}
.cart-head .eyebrow, .acct-head .eyebrow{display:block;margin-bottom:.7rem}
.cart-head h1, .acct-head h1{font-size:clamp(2.2rem,5.5vw,3.4rem);font-weight:700;letter-spacing:-.03em;line-height:1.02;color:var(--ink)}

/* ---- Free-shipping progress bar (rendered by rrk_hp_ship_bar_html) ---- */
.ship-bar{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:1.1rem 1.3rem;margin-bottom:1.6rem}
.ship-msg{display:flex;align-items:center;gap:.55rem;font-size:.96rem;color:var(--ink-1);margin-bottom:.9rem;line-height:1.4}
.ship-msg i{color:var(--accent-ink);font-size:1.25rem;flex:none}
.ship-msg b{font-weight:600;color:var(--ink)}
.ship-msg.free i{color:#3F7A4E}
.ship-track{position:relative;height:8px;background:var(--surface-2);border-radius:var(--pill)}
.ship-fill{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(90deg,var(--accent),#FF7A4D);border-radius:var(--pill);transition:width .45s var(--ease)}
.ship-node{position:absolute;top:50%;width:15px;height:15px;border-radius:50%;background:var(--surface);border:2px solid var(--border-2);transform:translate(-50%,-50%);z-index:1}
.ship-node.reached{background:var(--accent);border-color:var(--accent)}
.ship-marks{display:flex;justify-content:space-between;margin-top:.75rem;font-family:var(--fm);font-size:.72rem;color:var(--ink-4)}
.ship-marks .m2{text-align:right}
.ship-marks b{color:var(--ink-2);font-weight:500}
.ship-marks .reached b{color:var(--accent-ink)}

/* ---- Lyophilized reminder note ---- */
.cart-note{display:flex;gap:.7rem;align-items:flex-start;background:var(--accent-bg);border:1px solid #EFC9B7;border-radius:var(--r-sm);
  padding:.8rem 1.05rem;margin-bottom:1.4rem;font-size:.9rem;color:var(--ink-1);line-height:1.5}
.cart-note i{color:var(--accent-ink);font-size:1.2rem;flex:none;margin-top:.05rem}

/* ============================================================
   WooCommerce base — typography, links, notices
   ============================================================ */
.rrk-wc{font-family:var(--fs);color:var(--ink-1);padding-bottom:clamp(2.4rem,5vw,3.6rem);line-height:1.5}

/* My Account: kept as WooCommerce's ORIGINAL output — only the font changes.
   (The account wrapper uses .rrk-account-native, NOT .rrk-wc, so none of the
   cart/checkout skin below applies to it.) */
.rrk-account-native{padding-bottom:clamp(2.4rem,5vw,3.6rem)}
.rrk-account-native,
.rrk-account-native *{font-family:var(--fs) !important}
.rrk-wc a{color:var(--accent-ink);transition:color .2s var(--ease)}
.rrk-wc a:hover{color:var(--ink)}
.rrk-wc h1,.rrk-wc h2,.rrk-wc h3{color:var(--ink);letter-spacing:-.01em}
.rrk-wc .woocommerce{color:var(--ink-1)}

/* Notices */
.rrk-wc .woocommerce-message,
.rrk-wc .woocommerce-info,
.rrk-wc .woocommerce-error,
.rrk-wc .woocommerce-notice{border:1px solid var(--border);border-left:3px solid var(--accent);background:var(--surface);
  color:var(--ink-1);border-radius:var(--r-sm);padding:1rem 1.2rem;margin:0 0 1.4rem;font-size:.94rem;list-style:none}
.rrk-wc .woocommerce-error{border-left-color:#B3261E}
.rrk-wc .woocommerce-message .button,
.rrk-wc .woocommerce-info .button{float:right;margin-left:1rem}

/* ============================================================
   Buttons — map WooCommerce buttons to RRK pills
   ============================================================ */
.rrk-wc .button,
.rrk-wc button.button,
.rrk-wc input.button,
.rrk-wc a.button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:var(--fs);font-weight:600;
  font-size:.95rem;line-height:1;border-radius:var(--pill);border:1.5px solid var(--border-2);background:var(--surface);color:var(--ink);
  padding:.72rem 1.3rem;min-height:46px;cursor:pointer;transition:background .2s var(--ease),border-color .2s var(--ease),transform .2s var(--ease);text-decoration:none}
.rrk-wc .button:hover,
.rrk-wc button.button:hover,
.rrk-wc input.button:hover,
.rrk-wc a.button:hover{border-color:var(--ink-1);color:var(--ink);transform:translateY(-1px)}

/* Primary CTAs (proceed to checkout, place order, filled) */
.rrk-wc .checkout-button,
.rrk-wc .wc-proceed-to-checkout .button,
.rrk-wc #place_order,
.rrk-wc .button.alt,
.rrk-wc button.button.alt{background:var(--ink);color:var(--bg);border-color:transparent}
.rrk-wc .checkout-button:hover,
.rrk-wc .wc-proceed-to-checkout .button:hover,
.rrk-wc #place_order:hover,
.rrk-wc .button.alt:hover,
.rrk-wc button.button.alt:hover{background:#000;color:var(--bg);transform:translateY(-2px)}

/* Inputs / selects / textareas */
.rrk-wc input.input-text,
.rrk-wc input[type="text"],
.rrk-wc input[type="email"],
.rrk-wc input[type="tel"],
.rrk-wc input[type="password"],
.rrk-wc input[type="number"],
.rrk-wc textarea,
.rrk-wc select,
.rrk-wc .select2-container .select2-selection{width:100%;font-family:var(--fs);font-size:1rem;color:var(--ink);background:var(--bg);
  border:1.5px solid var(--border-2);border-radius:var(--r-sm);padding:.7rem .85rem;min-height:46px;transition:border-color .2s var(--ease)}
.rrk-wc input.input-text:focus,
.rrk-wc textarea:focus,
.rrk-wc select:focus{outline:none;border-color:var(--ink-1)}
.rrk-wc label{font-family:var(--fm);font-size:.74rem;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-3);display:block;margin-bottom:.4rem}
.rrk-wc .required{color:var(--accent-ink);border:0}
.rrk-wc .form-row{margin:0 0 1.1rem}

/* Tables (shared) */
.rrk-wc table.shop_table{width:100%;border-collapse:collapse;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden}
.rrk-wc table.shop_table th{font-family:var(--fm);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-4);
  font-weight:500;text-align:left;padding:.9rem 1rem;background:var(--surface-2);border-bottom:1px solid var(--border)}
.rrk-wc table.shop_table td{padding:1rem;border-top:1px solid var(--border);color:var(--ink-1);vertical-align:middle}
.rrk-wc table.shop_table .amount{font-family:var(--fm);color:var(--ink)}
.rrk-wc .woocommerce-Price-amount{font-family:var(--fm)}

/* ============================================================
   CART
   ============================================================ */
.rrk-wc-cart .woocommerce{display:grid;grid-template-columns:1.7fr 1fr;gap:clamp(1.6rem,4vw,3rem);align-items:start}
.rrk-wc-cart .woocommerce-cart-form{grid-column:1;min-width:0}
.rrk-wc-cart .cart-collaterals{grid-column:2;width:100%!important;float:none!important}
.rrk-wc-cart .cart_totals{width:100%!important;float:none!important}
/* single-column when WooCommerce didn't wrap in one .woocommerce (fallback) */
.rrk-wc-cart .woocommerce > .woocommerce-notices-wrapper{grid-column:1 / -1}

.rrk-wc-cart td.product-thumbnail img{width:66px;aspect-ratio:600/804;height:auto;object-fit:cover;border:1px solid var(--border-2);border-radius:var(--r-sm)}
.rrk-wc-cart td.product-name{font-weight:600;color:var(--ink)}
.rrk-wc-cart td.product-name a{color:var(--ink)}
.rrk-wc-cart td.product-name a:hover{color:var(--accent-ink)}
.rrk-wc-cart td.product-remove a.remove{color:var(--ink-4)!important;font-size:1.2rem;width:auto;height:auto;line-height:1;border-radius:0;background:none!important}
.rrk-wc-cart td.product-remove a.remove:hover{color:var(--accent-ink)!important;background:none!important}
.rrk-wc-cart .quantity{display:inline-flex;align-items:center;border:1.5px solid var(--border-2);border-radius:var(--pill);overflow:hidden;background:var(--surface);min-height:42px}
.rrk-wc-cart .quantity input.qty{width:56px;min-height:40px;border:0;text-align:center;font-family:var(--fm);background:transparent;padding:0}
.rrk-wc-cart .actions{padding:1.2rem 0 0}
.rrk-wc-cart .coupon{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.rrk-wc-cart .coupon #coupon_code{width:auto;flex:1;min-width:140px;text-transform:uppercase}
.rrk-wc-cart .coupon #coupon_code::placeholder{text-transform:none}

.rrk-wc-cart .cart_totals h2{font-size:1.2rem;font-weight:600;margin-bottom:1rem}
.rrk-wc-cart .cart_totals table.shop_table{border-radius:var(--r-lg)}
.rrk-wc-cart .cart_totals th{background:transparent;text-transform:none;font-family:var(--fs);font-size:.95rem;color:var(--ink-2);letter-spacing:0}
.rrk-wc-cart .cart_totals .order-total th,
.rrk-wc-cart .cart_totals .order-total td{font-size:1.1rem;color:var(--ink);font-weight:600}
.rrk-wc-cart .wc-proceed-to-checkout{padding:1.2rem 0 0}
.rrk-wc-cart .wc-proceed-to-checkout .button{width:100%;min-height:52px}

/* ============================================================
   CHECKOUT
   ============================================================ */
.rrk-wc-checkout .col2-set{width:100%;float:none}
.rrk-wc-checkout form.checkout.woocommerce-checkout{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(1.6rem,4vw,3rem);align-items:start}
.rrk-wc-checkout #customer_details{grid-column:1;min-width:0}
.rrk-wc-checkout #order_review_heading,
.rrk-wc-checkout #order_review{grid-column:2;width:100%}
.rrk-wc-checkout .col2-set .col-1,
.rrk-wc-checkout .col2-set .col-2{width:100%;float:none;margin-bottom:1.4rem}
.rrk-wc-checkout h3{font-size:1.2rem;font-weight:600;margin:0 0 1rem;padding-bottom:.6rem;border-bottom:1px solid var(--border)}
.rrk-wc-checkout #order_review_heading{font-size:1.2rem;font-weight:600;margin:0 0 1rem}
.rrk-wc-checkout #order_review{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:clamp(1.2rem,3vw,1.6rem);position:sticky;top:92px}
.rrk-wc-checkout #order_review table.shop_table{border:0;background:transparent}
.rrk-wc-checkout #order_review th{background:transparent;text-transform:none;font-family:var(--fs);letter-spacing:0}
.rrk-wc-checkout .woocommerce-checkout-review-order-table .order-total .amount{font-size:1.3rem}
.rrk-wc-checkout #payment{background:transparent;border-radius:var(--r-sm)}
.rrk-wc-checkout #payment ul.payment_methods{border:1px solid var(--border);border-radius:var(--r-sm);background:var(--bg);padding:1rem}
.rrk-wc-checkout #payment ul.payment_methods li{list-style:none;margin:0 0 .5rem}
.rrk-wc-checkout #payment div.payment_box{background:var(--surface-2);border-radius:var(--r-sm);color:var(--ink-2);font-size:.9rem}
.rrk-wc-checkout #payment div.payment_box::before{border-bottom-color:var(--surface-2)}
.rrk-wc-checkout #payment .place-order{padding-top:1.2rem}
.rrk-wc-checkout #place_order{width:100%;min-height:54px}
.rrk-wc-checkout .woocommerce-terms-and-conditions-wrapper{font-size:.9rem;color:var(--ink-3)}

/* ============================================================
   THANK YOU / order received
   ============================================================ */
.rrk-wc-thanks .woocommerce-thankyou-order-received{font-size:1.3rem;font-weight:600;color:var(--ink);margin-bottom:1.4rem}
.rrk-wc-thanks ul.woocommerce-order-overview{display:flex;flex-wrap:wrap;gap:1rem;list-style:none;margin:0 0 2rem;padding:1.2rem;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg)}
.rrk-wc-thanks ul.woocommerce-order-overview li{border:0;padding:0 1.4rem 0 0;font-family:var(--fm);font-size:.72rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-4);text-align:left}
.rrk-wc-thanks ul.woocommerce-order-overview li strong{display:block;margin-top:.35rem;font-family:var(--fs);font-size:1.05rem;
  letter-spacing:normal;text-transform:none;color:var(--ink);font-weight:600}
.rrk-wc-thanks h2{font-size:1.25rem;font-weight:600;margin:2rem 0 1rem}

/* Payment instructions card (thank-you page) — WooCommerce prints each
   gateway's OWN instructions (Zelle / bank transfer / crypto) in this block;
   we present them as one clear, prominent card. Only styled when it actually
   has content (:has(p)) so paid orders with no instructions stay clean. */
.rrk-wc-thanks .wc-block-order-confirmation-additional-information:has(p){
  background:var(--surface) !important;border:1px solid var(--accent) !important;border-left:4px solid var(--accent) !important;
  border-radius:var(--r-lg) !important;padding:clamp(1.4rem,3vw,2rem) !important;margin:1.5rem 0 2rem !important}
.rrk-wc-thanks .wc-block-order-confirmation-additional-information:has(p)::before{
  content:"Complete your payment";display:block;font-family:var(--fs);
  font-size:clamp(1.2rem,2.5vw,1.5rem);font-weight:700;letter-spacing:-.02em;color:var(--ink);margin:0 0 1rem}
.rrk-wc-thanks .wc-block-order-confirmation-additional-information p{color:var(--ink-1) !important;line-height:1.75 !important;margin:0 0 1rem;font-size:.98rem}
.rrk-wc-thanks .wc-block-order-confirmation-additional-information p:last-child{margin-bottom:0}
.rrk-wc-thanks .wc-block-order-confirmation-additional-information strong,
.rrk-wc-thanks .wc-block-order-confirmation-additional-information b{color:var(--ink);font-weight:600}
.rrk-wc-thanks .wc-block-order-confirmation-additional-information a{color:var(--accent-ink)}
.rrk-wc-thanks .wc-block-order-confirmation-additional-information h2,
.rrk-wc-thanks .wc-block-order-confirmation-additional-information h3{font-size:1.05rem;font-weight:600;color:var(--ink);margin:1.3rem 0 .5rem}

/* ============================================================
   MY ACCOUNT
   ============================================================ */
.rrk-wc-account .woocommerce::after{content:"";display:table;clear:both}
/* Keep WooCommerce's ORIGINAL account layout (its own nav/content widths +
   float). We only restyle fonts/colours below — no custom widths here. */
.rrk-wc-account .woocommerce-MyAccount-navigation{margin:0}
.rrk-wc-account .woocommerce-MyAccount-content{min-width:0}
.rrk-wc-account .woocommerce-MyAccount-navigation ul{list-style:none;margin:0;padding:.5rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);display:flex;flex-direction:column;gap:.15rem}
.rrk-wc-account .woocommerce-MyAccount-navigation ul li{margin:0}
.rrk-wc-account .woocommerce-MyAccount-navigation ul li a{display:block;padding:.7rem .9rem;border-radius:var(--r-sm);font-weight:500;font-size:.95rem;color:var(--ink-2);text-decoration:none;transition:background .18s var(--ease),color .18s var(--ease)}
.rrk-wc-account .woocommerce-MyAccount-navigation ul li a:hover{background:var(--surface-2);color:var(--ink)}
.rrk-wc-account .woocommerce-MyAccount-navigation ul li.is-active a{background:var(--ink);color:var(--bg)}
.rrk-wc-account .woocommerce-MyAccount-content{color:var(--ink-1)}
.rrk-wc-account .woocommerce-MyAccount-content > p:first-child{margin-top:0}
.rrk-wc-account .woocommerce-orders-table__cell-order-actions .button{padding:.45rem .9rem;min-height:36px;font-size:.82rem}
.rrk-wc-account .woocommerce-Address{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:1.3rem;margin-bottom:1.4rem}
.rrk-wc-account .woocommerce-Address address{font-style:normal;color:var(--ink-2);line-height:1.7}
.rrk-wc-account .woocommerce-EditAccountForm fieldset{border:1px solid var(--border);border-radius:var(--r-lg);padding:1.3rem;margin:1.6rem 0 0}
.rrk-wc-account .woocommerce-EditAccountForm legend{font-weight:600;color:var(--ink);padding:0 .5rem}

/* Login / register */
.rrk-wc-account .woocommerce-form-login,
.rrk-wc-account .woocommerce-form-register{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:clamp(1.4rem,3vw,2rem);max-width:460px}
.rrk-wc-account .col2-set .col-1,
.rrk-wc-account .col2-set .col-2{width:100%;float:none}

/* ============================================================
   WooCommerce BLOCK cart & checkout
   This site's Cart/Checkout pages use the newer WooCommerce *blocks*
   (wp-block-woocommerce-cart / -checkout), not the classic shortcodes, so
   they carry .wc-block-* classes. These rules bring the block versions onto
   the RRK design. Block cart/checkout already lay out in two columns and
   inherit the RRK font from .rrk-wc; here we fix buttons, inputs and prices.
   ============================================================ */
.rrk-wc .wc-block-components-button.contained,
.rrk-wc .wc-block-cart__submit-button,
.rrk-wc .wc-block-components-checkout-place-order-button{
  background:var(--ink) !important;color:var(--bg) !important;border-radius:var(--pill) !important;
  min-height:52px !important;font-family:var(--fs) !important;font-weight:600 !important;box-shadow:none !important}
.rrk-wc .wc-block-components-button.contained:hover,
.rrk-wc .wc-block-cart__submit-button:hover,
.rrk-wc .wc-block-components-checkout-place-order-button:hover{background:#000 !important}
.rrk-wc .wc-block-components-button.outlined{border-radius:var(--pill) !important;border-color:var(--border-2) !important;color:var(--ink) !important;box-shadow:none !important}
.rrk-wc .wc-block-components-button.link,
.rrk-wc .wc-block-checkout__actions a,
.rrk-wc .wc-block-cart__submit-container a{color:var(--accent-ink) !important}

/* Prices & totals in mono */
.rrk-wc .wc-block-components-formatted-money-amount,
.rrk-wc .wc-block-components-totals-item__value,
.rrk-wc .wc-block-components-product-price,
.rrk-wc .wc-block-components-order-summary-item__total-price{font-family:var(--fm) !important}

/* Inputs / selects / quantity */
.rrk-wc .wc-block-components-text-input input,
.rrk-wc .wc-block-components-select .wc-block-components-select__container,
.rrk-wc .wc-block-components-quantity-selector{border-radius:var(--r-sm) !important;border-color:var(--border-2) !important}
.rrk-wc .wc-block-components-text-input input:focus{border-color:var(--ink-1) !important}

/* Order-summary / totals sidebar as a card */
.rrk-wc .wc-block-cart__sidebar .wc-block-components-totals-wrapper,
.rrk-wc .wc-block-checkout__sidebar > .wc-block-components-totals-wrapper{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:1.2rem}

/* Step titles */
.rrk-wc .wc-block-components-checkout-step__title{font-family:var(--fs);color:var(--ink);font-weight:600}
.rrk-wc .wc-block-components-title{color:var(--ink)}

/* Product thumbnails keep the portrait ratio */
.rrk-wc .wc-block-cart-item__image img,
.rrk-wc .wc-block-components-order-summary-item__image img{border-radius:var(--r-sm)}

/* ============================================================
   Dark footer (matches the rest of the site)
   ============================================================ */
.foot{background:var(--dark);border-top:0;color:#C9C1B2;position:relative}
.foot::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,74,28,.55),transparent)}
.foot .foot-brand img{filter:brightness(0) invert(1);opacity:.85}
.foot .foot-brand p{color:#A79E8C}
.foot .foot-col h4{color:#8F8778}
.foot .foot-col a{color:#D6CFC2}
.foot .foot-col a:hover{color:#fff}
.foot .disclaimer{background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.09);color:#A79E8C}
.foot .disclaimer i{color:#FF6A3D}
.foot .foot-bot{border-top-color:rgba(255,255,255,.11);color:#8F8778}
.foot .pay{color:#8F8778}

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width:900px){
  .rrk-wc-cart .woocommerce{grid-template-columns:1fr}
  .rrk-wc-cart .woocommerce-cart-form,
  .rrk-wc-cart .cart-collaterals{grid-column:1}
  .rrk-wc-checkout form.checkout.woocommerce-checkout{grid-template-columns:1fr}
  .rrk-wc-checkout #customer_details,
  .rrk-wc-checkout #order_review_heading,
  .rrk-wc-checkout #order_review{grid-column:1}
  .rrk-wc-checkout #order_review{position:static}
  .rrk-wc-account .woocommerce-MyAccount-navigation,
  .rrk-wc-account .woocommerce-MyAccount-content{width:100%;float:none}
  .rrk-wc-account .woocommerce-MyAccount-navigation{margin-bottom:1.4rem}
}
@media (max-width:520px){
  .rrk-wc table.shop_table thead{display:none}
  .rrk-wc-cart table.shop_table td{display:block;text-align:right;border-top:0;padding:.5rem 1rem}
  .rrk-wc-cart table.shop_table tr.cart_item{display:block;border-top:1px solid var(--border);padding:.8rem 0}
  .rrk-wc-cart td.product-thumbnail{text-align:left}
}