/* Cart & checkout gap-fillers.

   The site's own cart/checkout design lives in Oxygen's selectors.css
   ("Cart, Checkout, Bundles" / "Checkout Premium"). This file deliberately
   does NOT restyle any of that. It only covers what nothing else does:

   1. breakdance-woocommerce.css is dead on this site -- its rules are all
      scoped to a .breakdance-woocommerce wrapper that the markup never
      outputs. That stylesheet was the only thing stacking the cart table on
      small screens and styling #place_order / update_cart, so all three fall
      back to browser defaults.
   2. WooCommerce's shipping-method <ul> keeps its list bullets.

   Keep this file small. Anything that belongs to the design system proper
   should go into the Oxygen selectors instead. */

/* ---------- primary + secondary buttons Woo leaves unstyled ---------- */
.woocommerce #place_order{
display:block;width:100%;padding:17px 24px;border:0;border-radius:3px;cursor:pointer;
background:var(--claret);color:var(--cream);
font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
text-align:center;line-height:1.2;
transition:background-color .22s ease,transform .22s ease,box-shadow .22s ease}
.woocommerce #place_order:hover{
background:var(--claret-bright);transform:translateY(-1px);box-shadow:0 10px 26px rgba(107,29,29,.22)}
.woocommerce #place_order:active{transform:translateY(0);box-shadow:none}
.woocommerce #place_order:focus-visible{outline:2px solid var(--claret);outline-offset:3px}

.woocommerce .actions button[name="update_cart"]{
padding:13px 20px;border:1px solid var(--line-strong);border-radius:3px;background:none;color:var(--ink);
font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
cursor:pointer;transition:background-color .2s ease,color .2s ease,border-color .2s ease}
.woocommerce .actions button[name="update_cart"]:hover:not(:disabled){
background:var(--ink);border-color:var(--ink);color:var(--cream)}
.woocommerce .actions button[name="update_cart"]:disabled{opacity:.45;cursor:default}

/* ---------- payment methods as choice cards ---------- */
.woocommerce-checkout #payment ul.payment_methods{list-style:none;margin:0 0 20px;padding:0;border:0}
.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method{
margin:0 0 10px;padding:14px 16px;background:#fff;
border:1px solid var(--line);border-radius:3px;transition:border-color .2s ease}
.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method:hover{border-color:var(--line-strong)}
.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method label{
display:inline;margin:0;font-family:var(--sans);font-size:14px;font-weight:500;
letter-spacing:0;text-transform:none;color:var(--ink);cursor:pointer}
.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method input[type="radio"]{
margin-right:10px;accent-color:var(--claret)}
.woocommerce-checkout #payment .payment_box{
margin:12px 0 0;padding:12px 0 0;border-top:1px solid var(--line);background:none;
font-family:var(--sans);font-size:13px;line-height:1.6;color:var(--ink-3)}
.woocommerce-checkout #payment .payment_box::before{display:none}
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper{
margin:0 0 16px;font-family:var(--sans);font-size:12px;line-height:1.6;color:var(--ink-3)}

/* ---------- shipping method list keeps its bullets ---------- */
.woocommerce ul#shipping_method{list-style:none;margin:0;padding:0}
.woocommerce ul#shipping_method li{margin:0 0 6px;padding:0;display:flex;align-items:baseline;gap:8px}
.woocommerce ul#shipping_method li:last-child{margin-bottom:0}
.woocommerce ul#shipping_method label{
display:inline;font-family:var(--sans);font-size:13px;font-weight:500;letter-spacing:0;
text-transform:none;color:var(--ink-2);margin:0}
.woocommerce ul#shipping_method input[type="radio"]{accent-color:var(--claret);margin:0}
.woocommerce .woocommerce-shipping-destination{
margin:8px 0 0;font-family:var(--sans);font-size:12px;color:var(--ink-mute)}

/* ---------- cart table: stack into cards on phones ---------- */
/* Higher specificity than selectors.css's .shop_table td, which loads later. */
@media (max-width: 767px){
.woocommerce .woocommerce-cart-form__contents,
.woocommerce .woocommerce-cart-form__contents tbody,
.woocommerce .woocommerce-cart-form__contents tfoot{display:block;width:100%}
.woocommerce .woocommerce-cart-form__contents thead{display:none}
.woocommerce .woocommerce-cart-form__contents tr.cart_item{
display:grid;grid-template-columns:64px minmax(0,1fr);
column-gap:14px;row-gap:9px;align-items:center;position:relative;
padding:18px 16px;border-bottom:1px solid var(--line)}
.woocommerce .woocommerce-cart-form__contents td{display:block;padding:0;border:0}
.woocommerce .woocommerce-cart-form__contents td.product-thumbnail{grid-column:1;grid-row:1 / span 4;align-self:start}
.woocommerce .woocommerce-cart-form__contents td.product-name{grid-column:2;padding-right:28px}
.woocommerce .woocommerce-cart-form__contents td.product-price,
.woocommerce .woocommerce-cart-form__contents td.product-quantity,
.woocommerce .woocommerce-cart-form__contents td.product-subtotal{
grid-column:2;display:flex;align-items:center;justify-content:space-between;gap:12px}
.woocommerce .woocommerce-cart-form__contents td.product-price::before,
.woocommerce .woocommerce-cart-form__contents td.product-quantity::before,
.woocommerce .woocommerce-cart-form__contents td.product-subtotal::before{
content:attr(data-title);
font-family:var(--sans);font-size:10px;font-weight:600;letter-spacing:.14em;
text-transform:uppercase;color:var(--ink-mute)}
.woocommerce .woocommerce-cart-form__contents td.product-remove{position:absolute;top:14px;right:14px}
.woocommerce .woocommerce-cart-form__contents tr:not(.cart_item){display:block}
.woocommerce .woocommerce-cart-form__contents td.actions{display:block;padding:16px}
.woocommerce .woocommerce-cart-form__contents .coupon{display:flex;flex-wrap:wrap;gap:10px}
.woocommerce .woocommerce-cart-form__contents .coupon .input-text{flex:1 1 100%;width:auto;min-width:0}
.woocommerce .woocommerce-cart-form__contents .coupon button{flex:1 1 100%}
.woocommerce .actions button[name="update_cart"]{width:100%;margin-top:10px}
}

/* ---------- checkout: reassurance strip under the order button ---------- */
.woocommerce-checkout .tb-assure{margin:16px 0 0;padding:16px 0 0;border-top:1px solid var(--line)}
.woocommerce-checkout .tb-assure-marks{
display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0 0 12px;padding:0}
.woocommerce-checkout .tb-assure-mark{
padding:5px 9px;border:1px solid var(--line);border-radius:2px;background:#fff;
font-family:var(--sans);font-size:9px;font-weight:600;letter-spacing:.12em;
text-transform:uppercase;color:var(--ink-3)}
.woocommerce-checkout .tb-assure-note{
margin:0 0 6px;font-family:var(--sans);font-size:11.5px;line-height:1.55;color:var(--ink-mute)}
.woocommerce-checkout .tb-assure-note:last-child{margin-bottom:0}

/* ---------- checkout: sommelier note, below the summary card ---------- */
.woocommerce-checkout .tb-cellar{
grid-column:2;align-self:start;
margin:18px 0 0;padding:24px 26px 26px;
background:var(--well);border:1px solid rgba(217,184,122,.2);border-radius:4px;
box-shadow:0 18px 40px rgba(26,22,20,.07)}
.woocommerce-checkout .tb-cellar-eyebrow{
display:block;margin:0 0 18px;
font-family:var(--sans);font-size:9.5px;font-weight:600;letter-spacing:.18em;
text-transform:uppercase;color:var(--gold-light)}
.woocommerce-checkout .tb-cellar-lead{
margin:0 0 12px;font-family:var(--sans);font-size:10.5px;font-weight:500;letter-spacing:.12em;
text-transform:uppercase;color:var(--on-dark-mute)}
.woocommerce-checkout .tb-cellar-list{list-style:none;margin:0;padding:0}
.woocommerce-checkout .tb-cellar-row{display:flex;align-items:baseline;gap:10px;margin:0 0 10px}
.woocommerce-checkout .tb-cellar-row:last-child{margin-bottom:0}
.woocommerce-checkout .tb-cellar-wine{
font-family:var(--serif);font-size:16px;color:var(--cream);white-space:nowrap}
.woocommerce-checkout .tb-cellar-dots{
flex:1 1 auto;height:1px;transform:translateY(-3px);
background-image:radial-gradient(circle,rgba(217,184,122,.5) .5px,transparent .5px);
background-size:5px 1px;background-repeat:repeat-x}
.woocommerce-checkout .tb-cellar-temp{
font-family:var(--serif);font-size:16px;color:var(--gold-light);white-space:nowrap}
.woocommerce-checkout .tb-cellar-lead-estates{
margin-top:22px;padding-top:18px;border-top:1px solid rgba(217,184,122,.16)}
.woocommerce-checkout .tb-cellar-estates{
margin:0;font-family:var(--serif);font-size:15px;line-height:1.55;color:var(--cream)}

/* Below the checkout's two-column breakpoint the form is a single column, so
   the note must not be pinned to a second track that no longer exists. */
@media (max-width: 1119px){
.woocommerce-checkout .tb-cellar{grid-column:auto}
}
@media (max-width: 767px){
.woocommerce-checkout .tb-cellar{padding:20px 20px 22px}
}

/* ---------- product page: wine dossier ---------- */
.tb-dossier-specs{margin:0;padding:0}
.tb-dossier-row{
display:flex;align-items:baseline;gap:16px;
padding:13px 0;border-bottom:1px solid var(--line)}
.tb-dossier-row:last-child{border-bottom:0}
.tb-dossier-dt{
flex:0 0 auto;min-width:138px;
font-family:var(--sans);font-size:10px;font-weight:600;letter-spacing:.14em;
text-transform:uppercase;color:var(--ink-mute)}
.tb-dossier-dd{
margin:0;flex:1 1 auto;
font-family:var(--serif);font-size:17px;line-height:1.45;color:var(--ink)}
.tb-dossier-pair{
margin:24px 0 0;padding:18px 20px;
background:var(--bg-2);border-left:2px solid var(--gold);border-radius:2px}
.tb-dossier-pair-label{
display:block;margin:0 0 7px;
font-family:var(--sans);font-size:10px;font-weight:600;letter-spacing:.14em;
text-transform:uppercase;color:var(--gold)}
.tb-dossier-pair-text{
margin:0;font-family:var(--serif);font-size:16px;line-height:1.6;color:var(--ink-2)}

@media (max-width: 767px){
.tb-dossier-row{flex-direction:column;gap:4px;padding:12px 0}
.tb-dossier-dt{min-width:0}
}

/* The template's .taste-grid is two columns; the dossier spans both and
   splits itself instead, so the right half is not left empty. */
.taste-grid .tb-dossier{grid-column:1 / -1}
.tb-dossier{
display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
gap:60px;align-items:start}
.tb-dossier .tb-dossier-pair{margin-top:0}

@media (max-width: 1023px){
.tb-dossier{grid-template-columns:minmax(0,1fr);gap:0}
.tb-dossier .tb-dossier-pair{margin-top:24px}
}

/* Oxygen wraps a shortcode element in .oxy-shortcode, so the wrapper -- not
   .tb-dossier -- is the grid item that has to span both columns. */
.taste-grid > .oxy-shortcode{grid-column:1 / -1}