/* ============================================================================
   BSB product-page REDESIGN — additive re-skin over storefront.css.
   Gated by body.bsbsf-redesign so it can be rolled out to a few product IDs
   first, then site-wide, and removed instantly by dropping the class.
   Targets the REAL plugin/Woo classes — the working variation select + Gravity
   Forms + add-to-cart are untouched; only the skin changes.
   New tokens: coral #ef6a53  price #e0503b  ink #1c1c1c  text #5c5952
   muted #9a968f  line #e7e4df  line2 #eeebe5  aside #faf9f6  font Manrope
   ============================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');

/* font: Manrope across the product surface (inherits), override the Bricolage spots */
body.bsbsf-redesign.bsbsf-product .product-info,
body.bsbsf-redesign.bsbsf-product .product-info *,
body.bsbsf-redesign .woocommerce-tabs,
body.bsbsf-redesign .woocommerce-tabs *,
body.bsbsf-redesign .related,
body.bsbsf-redesign .related *{font-family:Manrope,system-ui,sans-serif}

/* white canvas (kill any warm bg on the content region) */
body.bsbsf-redesign #main,body.bsbsf-redesign.woocommerce main{background:#fff}

/* ---- eyebrow chip ---- */
body.bsbsf-redesign .bsbsf-chip{background:#fff;border-color:#e7e4df;color:#6b6b6b;letter-spacing:.09em;
    font-size:10.5px;padding:5px 12px}
body.bsbsf-redesign .bsbsf-chip:hover{border-color:#ef6a53;color:#ef6a53}

/* ---- title + rating + price + intro ---- */
body.bsbsf-redesign.bsbsf-product .product-title{font-weight:800;letter-spacing:-.01em;color:#1c1c1c;margin-bottom:12px}
body.bsbsf-redesign .woocommerce-product-rating{margin:0 0 12px}
body.bsbsf-redesign .woocommerce-product-rating .star-rating span:before{color:#f0a92e}
body.bsbsf-redesign .woocommerce-product-rating .woocommerce-review-link{color:#9a968f;font:600 12.5px Manrope}
/* SHOW the price range in the hero (base hides it for pill products) */
body.bsbsf-redesign.bsbsf-haspills .product-info>.price-wrapper,
body.bsbsf-redesign.bsbsf-haspills .product-info>p.price{display:block}
body.bsbsf-redesign.bsbsf-product .product-info>.price-wrapper .price,
body.bsbsf-redesign.bsbsf-product .product-info>.price{font-weight:800;font-size:27px;color:#e0503b;margin:2px 0 14px}
body.bsbsf-redesign .product-short-description{font-size:14.5px;line-height:1.6;color:#5c5952;max-width:56ch}

/* ---- feature chips ---- */
body.bsbsf-redesign .bsbsf-chips li{border-color:#e7e4df;background:#fff;color:#4a4843;font-weight:500;font-size:12.5px;
    padding:8px 13px}
body.bsbsf-redesign .bsbsf-chips li:before{content:"\2713";background:none;color:#2e9e6b;font-size:13px;font-weight:700;width:auto;height:auto}

/* ---- spec row → design spec grid (border-top, cell dividers, no full box) ---- */
body.bsbsf-redesign .bsbsf-specrow{border:0;border-top:1px solid #eeebe5;border-radius:0;background:transparent}
body.bsbsf-redesign .bsbsf-specrow>div{border-left:0;border-right:1px solid #eeebe5;padding:14px 14px 14px 0}
body.bsbsf-redesign .bsbsf-specrow>div:first-child{padding-left:0}
body.bsbsf-redesign .bsbsf-specrow>div:last-child{border-right:0}
body.bsbsf-redesign .bsbsf-specrow dt{font-size:10px;letter-spacing:.06em;color:#9a968f}
body.bsbsf-redesign .bsbsf-specrow dd{font-family:Manrope,sans-serif;font-weight:600;font-size:13px;color:#1c1c1e}

/* ---- buy card ---- */
body.bsbsf-redesign.bsbsf-product form.cart{background:#fff;border:1px solid #e7e4df;border-radius:16px;
    box-shadow:0 4px 20px rgba(0,0,0,.05);padding:26px}
body.bsbsf-redesign.bsbsf-product .variations .label{font-family:Manrope,sans-serif;font-weight:700;font-size:11px;
    letter-spacing:.05em;text-transform:uppercase;color:#9a968f;margin-bottom:9px}

/* ---- native variation select styled as the design dropdown (pages without pills) ---- */
body.bsbsf-redesign form.cart .variations td.value select,
body.bsbsf-redesign form.cart .variations select{width:100%;padding:12px 40px 12px 14px;border:1px solid #e7e4df;
    border-radius:10px;background:#fff;font:700 15px Manrope;color:#1c1c1e;cursor:pointer;-webkit-appearance:none;appearance:none;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1.5L6 6.5L11 1.5' stroke='%23a8a49d' stroke-width='1.6' fill='none' stroke-linecap='round'/></svg>");
    background-repeat:no-repeat;background-position:right 14px center}
body.bsbsf-redesign form.cart .variations td.value select:focus,
body.bsbsf-redesign form.cart .variations select:focus{border-color:#ef6a53;outline:none;box-shadow:0 0 0 3px rgba(239,106,83,.12)}

/* ---- tier pills → single-column design rows (dropdown collapse is the JS step) ---- */
body.bsbsf-redesign .bsbsf-tiers{grid-template-columns:1fr;gap:6px;max-height:none}
body.bsbsf-redesign .bsbsf-tier{border-color:#e7e4df;border-radius:10px;min-height:0;padding:11px 13px;
    justify-content:space-between}
body.bsbsf-redesign .bsbsf-tier:hover{border-color:#e7e4df;background:#faf7f3}
body.bsbsf-redesign .bsbsf-tier.is-on{border-color:#ef6a53;background:#fff1ed;padding:10.5px 12.5px}
body.bsbsf-redesign .bsbsf-tier b{font-family:Manrope,sans-serif;font-weight:700;font-size:14px;color:#33312e;display:inline}
body.bsbsf-redesign .bsbsf-tier i{display:inline;font-size:12px;color:#9a968f;margin-left:6px}
body.bsbsf-redesign .bsbsf-tprice{color:#e0503b;font-size:12.5px}

/* ---- single-variation live price ---- */
body.bsbsf-redesign .single_variation_wrap .woocommerce-variation-price .price{color:#e0503b;font-weight:800}

/* ---- GF link field ---- */
body.bsbsf-redesign form.cart .gform_wrapper .gfield_label{font-family:Manrope,sans-serif;font-weight:700;font-size:11px;
    letter-spacing:.05em;text-transform:uppercase;color:#9a968f}
body.bsbsf-redesign form.cart .gform_wrapper input[type=text],
body.bsbsf-redesign form.cart .gform_wrapper input[type=url]{border:1px solid #e7e4df;border-radius:10px;padding:12px 13px;
    background:#fbfaf8;font:500 13px Manrope;color:#33312e}

/* ---- add to cart ---- */
body.bsbsf-redesign form.cart .single_add_to_cart_button{background:#ef6a53!important;border-radius:11px!important;
    box-shadow:0 4px 14px rgba(239,106,83,.35)!important;font-weight:700!important}
body.bsbsf-redesign form.cart .single_add_to_cart_button:hover{background:#e85c44!important}

/* ---- reassurance ---- */
body.bsbsf-redesign .bsbsf-cbul li{color:#4a4843;font-size:13px}
body.bsbsf-redesign .bsbsf-cbul li:before{background:none;color:#2e9e6b;font-size:13px}
body.bsbsf-redesign .bsbsf-secure{color:#9a968f}

/* ---- tabs ---- */
body.bsbsf-redesign .woocommerce-tabs .wc-tabs{border-bottom:1px solid #e7e4df}
body.bsbsf-redesign .woocommerce-tabs .wc-tabs li{border:0;background:none}
body.bsbsf-redesign .woocommerce-tabs .wc-tabs li a{font:700 15px Manrope;color:#9a968f;text-transform:none;letter-spacing:normal;padding:6px 0}
body.bsbsf-redesign .woocommerce-tabs .wc-tabs li.active a{color:#1c1c1e;box-shadow:inset 0 -2px 0 #e0503b}
body.bsbsf-redesign #tab-description h2{font:800 24px/1.2 Manrope;letter-spacing:-.01em;color:#1c1c1c;margin:28px 0 14px}
body.bsbsf-redesign #tab-description h3{font:800 18px Manrope;color:#1c1c1c}
body.bsbsf-redesign #tab-description p,body.bsbsf-redesign #tab-description li{font:500 15px/1.72 Manrope;color:#5c5952;max-width:900px}
body.bsbsf-redesign .bsbsf-readmore{font-family:Manrope,sans-serif;border-color:#f0c9c0;color:#e0503b}
body.bsbsf-redesign .bsbsf-readmore:hover{background:#ef6a53;border-color:#ef6a53}

/* ---- related cards ---- */
body.bsbsf-redesign .related .bsbsf-card{border-color:#e7e4df;border-radius:13px}
body.bsbsf-redesign .related .bsbsf-card:hover{border-color:#e0d9d0;box-shadow:0 6px 20px rgba(0,0,0,.06)}
body.bsbsf-redesign .related .bsbsf-name{font-family:Manrope,sans-serif;font-weight:700}
body.bsbsf-redesign .related .bsbsf-card:hover .bsbsf-name{color:#1c1c1c}
body.bsbsf-redesign .related .bsbsf-meta b{color:#e0503b}
body.bsbsf-redesign .related .bsbsf-plat{color:#8a867f}

/* ---- mobile: buy card up right after the price ----
   FIX: .bsbsf-product is on <body>, not a descendant — flex the summary column directly, and
   order EVERY real child (the raw Woo DOM has breadcrumb / dividers / meta / thumbs that would
   otherwise default to order:0 and jump above the eyebrow). */
@media (max-width:849px){
  body.bsbsf-redesign .product-info{display:flex!important;flex-direction:column}
  body.bsbsf-redesign .product-info>.woocommerce-breadcrumb{order:0}
  body.bsbsf-redesign .product-info>.bsbsf-chip{order:1}
  body.bsbsf-redesign .product-info>.product-title{order:2}
  body.bsbsf-redesign .product-info>.woocommerce-product-rating{order:3}
  body.bsbsf-redesign .product-info>.price-wrapper,
  body.bsbsf-redesign .product-info>.price{order:4}
  body.bsbsf-redesign .product-info>form.cart{order:5;margin:6px 0 20px}
  body.bsbsf-redesign .product-info>.product-short-description{order:6}
  body.bsbsf-redesign .product-info>.bsbsf-chips{order:7}
  body.bsbsf-redesign .product-info>.bsbsf-specrow{order:8}
  body.bsbsf-redesign .product-info>.bsbsf-cgen-col{order:9}
  /* park + hide the leftover Woo bits so they never jump to the top of the flex column */
  body.bsbsf-redesign .product-info>.is-divider,
  body.bsbsf-redesign .product-info>.next-prev-thumbs,
  body.bsbsf-redesign .product-info>.product-prev-next-thumbs,
  body.bsbsf-redesign .product-info>.product_meta,
  body.bsbsf-redesign .product-info>.social-icons{order:20;display:none}
  /* the plugin's mobile sticky buy-bar leaked into the flow (shows on scroll) — drop it;
     the buy card now sits high in the column, so the extra bar is redundant */
  body.bsbsf-redesign .bsbsf-buybar{display:none!important}
  /* spec cells: kill the dangling right border on the 2nd column of the 2-wide grid */
  body.bsbsf-redesign .bsbsf-specrow>div:nth-child(2n){border-right:0}
}