/* BSB Storefront — surface CSS. Every section is scoped to a flag-gated body class so a flag
   flip fully removes its styling. Tokens (mirror db/theme.css): ink #1A1512 char #241D18
   coal #141110 coral #EB4646 ember #FF7A3D gold #F5B54A paper #FDF8F1 cream #FAF4EC
   line #E7DACB text #6E6259 muted #9a9088 */

/* ============ header cart: no hover preview of items (owner) ============
   The cart icon still links to /cart/ on click; we only suppress the hover mini-cart dropdown. */
li.cart-item.has-dropdown>.nav-dropdown,
.header .cart-item>.nav-dropdown,
.header-cart .nav-dropdown{display:none!important}
li.cart-item.has-dropdown:hover>.nav-dropdown{display:none!important}

/* ============ platform dot (shared: archive cards, category header, product chip) ============ */
.bsbsf-dot{display:inline-block;width:11px;height:11px;border-radius:50%;background:#9a9088;flex:none}
.bsbsf-dot[data-p="facebook"]{background:#1877F2}.bsbsf-dot[data-p="instagram"]{background:#E1306C}
.bsbsf-dot[data-p="youtube"]{background:#FF0000}.bsbsf-dot[data-p="linkedin"]{background:#0A66C2}
.bsbsf-dot[data-p="tik-tok"]{background:#69C9D0}.bsbsf-dot[data-p="twitter"]{background:#8899A6}
.bsbsf-dot[data-p="telegram"]{background:#229ED9}.bsbsf-dot[data-p="spotify"]{background:#1DB954}
.bsbsf-dot[data-p="vkontakte"]{background:#0077FF}.bsbsf-dot[data-p="audiomack"]{background:#FF8800}
.bsbsf-dot[data-p="mixcloud"]{background:#5000FF}.bsbsf-dot[data-p="reddit"]{background:#FF4500}
.bsbsf-dot[data-p="soundcloud"]{background:#FF5500}.bsbsf-dot[data-p="threads"]{background:#C9BFB6}
.bsbsf-dot[data-p="tidal"]{background:#7FDBFF}.bsbsf-dot[data-p="boomplay"]{background:#F23D2E}
.bsbsf-dot[data-p="coub"]{background:#00A4DE}.bsbsf-dot[data-p="kwai"]{background:#FF6633}
.bsbsf-dot[data-p="quora"]{background:#B92B27}.bsbsf-dot[data-p="tumblr"]{background:#529ECC}
.bsbsf-dot[data-p="vimeo"]{background:#1AB7EA}.bsbsf-dot[data-p="applemusic"]{background:#FA243C}
.bsbsf-dot[data-p="deezer"]{background:#A238FF}.bsbsf-dot[data-p="discord"]{background:#5865F2}
.bsbsf-dot[data-p="kick"]{background:#53FC18}.bsbsf-dot[data-p="likee"]{background:#00C6BE}
.bsbsf-dot[data-p="snapchat"]{background:#FFFC00}.bsbsf-dot[data-p="twitch"]{background:#9146FF}
.bsbsf-dot[data-p="website-traffic"]{background:#EB4646}.bsbsf-dot[data-p="whatsapp"]{background:#25D366}
.bsbsf-dot[data-p="fansly"]{background:#1D5EFF}.bsbsf-dot[data-p="line"]{background:#06C755}
.bsbsf-dot[data-p="reverbnation"]{background:#E43526}.bsbsf-dot[data-p="trovo"]{background:#1F9E4D}

/* ============ service cards (shared component — rendered wherever the card template is
   routed: archives now, related products in phase 2, search in phase 6) ============ */
.products .bsbsf-col.col{padding-bottom:14px} /* out-specifies theme.css .products .col 22px */
.bsbsf-col .col-inner{height:100%}
.bsbsf-card{display:flex;flex-direction:column;gap:8px;height:100%;min-height:148px;
    background:#fff;border:1px solid #E7DACB;border-radius:14px;padding:16px;
    text-decoration:none;transition:transform .16s,border-color .16s,box-shadow .16s}
.bsbsf-card:hover{transform:translateY(-3px);border-color:#EB4646;box-shadow:0 18px 34px -18px rgba(26,21,18,.4)}
.bsbsf-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.bsbsf-plat{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:700;
    letter-spacing:.08em;text-transform:uppercase;color:#9a9088}
.bsbsf-stars{display:inline-flex;align-items:center;gap:3px;font-size:12.5px;font-weight:700;
    color:#1A1512;font-variant-numeric:tabular-nums}
.bsbsf-stars .s{color:#F5B54A}
.bsbsf-card .bsbsf-name{font-family:"Bricolage Grotesque",system-ui,sans-serif;font-size:16px;
    font-weight:650;line-height:1.3;color:#1A1512;display:-webkit-box;-webkit-line-clamp:2;
    -webkit-box-orient:vertical;overflow:hidden;transition:color .16s}
.bsbsf-card:hover .bsbsf-name{color:#EB4646}
.bsbsf-meta{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;margin-top:auto;
    font-size:12.5px;color:#9a9088;min-width:0}
.bsbsf-meta b{font-size:13.5px;font-weight:800;color:#EB4646;white-space:nowrap}
.bsbsf-meta b .woocommerce-Price-amount{color:#EB4646}
.bsbsf-tt{white-space:normal}
.bsbsf-arrow{margin-left:auto;color:#9a9088;font-size:15px;transition:transform .16s,color .16s}
.bsbsf-card:hover .bsbsf-arrow{color:#EB4646;transform:translateX(3px)}
/* kill any leftover woo bits inside our loop + old tile hover styles */
.products .bsbsf-col .box-image{display:none}
/* category header meta row */
.bsbsf-cathead{display:flex;align-items:center;gap:12px;flex-wrap:wrap;width:100%;margin:2px 0 16px}
.bsbsf-h1{margin:0;width:auto;flex:0 1 auto;font-family:"Bricolage Grotesque",system-ui,sans-serif;
    font-weight:800;font-size:clamp(26px,3.4vw,38px);line-height:1.1;letter-spacing:-.02em;color:#1A1512}
.bsbsf-catdot{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;
    background:#FAF4EC;border:1px solid #E7DACB}
.bsbsf-catdot .bsbsf-dot{width:16px;height:16px}
.bsbsf-count{display:inline-flex;align-items:center;padding:4px 12px;border-radius:999px;
    background:#fff;border:1px solid #E7DACB;font-size:12.5px;font-weight:700;color:#1A1512}
.bsbsf-sub{flex-basis:100%;margin:2px 0 0;font-size:16px;line-height:1.55;color:#6E6259;max-width:70ch}
@media (max-width:549px){
    .bsbsf-card{min-height:120px;padding:14px}
    .bsbsf-cathead{margin-bottom:10px}
    .bsbsf-arrow{display:none} /* no hover on touch; reclaims width so the meta never overflows */
}

/* ============ product page (flags: product, pills) — TWO templates ============
   Which one a page gets is set server-side as a body class (hooks-product.php):
     .bsbsf-service  — content hero (left) + compact sticky buy card (right)
     .bsbsf-comments — order panel (left) + live comment workspace (right, 40/60)
   No DOM is moved server-side; the comment workspace is Perfect Fulfilment's .pf-cgen panel,
   relocated into .bsbsf-cgen-col by product.js. Gallery column hidden for both. */
.bsbsf-product .product-gallery{display:none!important}
.bsbsf-product .product-info{width:100%;max-width:100%;padding-left:0}
/* direct children only — the breadcrumb's own .divider separators must survive */
.bsbsf-product .product-info>.divider,.bsbsf-product .product-info>.is-divider{display:none}
/* left-column leftovers that duplicate the chip/card: meta row, share icons, price RANGE
   (the live variation price in the buy card is the price), next/prev image thumbs */
.bsbsf-product .product-info>.product_meta,
.bsbsf-product .product-info>.social-icons,
.bsbsf-product .product-info .share-wrapper,
.bsbsf-product .product-prev-next-thumbs{display:none}
.bsbsf-product.bsbsf-haspills .product-info>.price-wrapper,
.bsbsf-product.bsbsf-haspills .product-info>p.price{display:none}

/* ---- desktop grids ---- */
@media (min-width:850px){
    /* SERVICE: 7fr content / 5fr sticky buy card */
    .bsbsf-service .product-info{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);
        column-gap:44px;align-items:start;grid-auto-flow:row}
    .bsbsf-service .product-info>*{grid-column:1}
    .bsbsf-service .product-info>form.cart{grid-column:2;grid-row:1/span 40;align-self:start;
        position:sticky;top:96px}
    /* COMMENTS: 43% order panel / 57% comment workspace. form.cart flows in col 1 (below the
       eyebrow/title/lede) and sticks; the workspace is the tall scroller in col 2. */
    .bsbsf-comments .product-info{display:grid;grid-template-columns:minmax(0,43fr) minmax(0,57fr);
        column-gap:40px;align-items:start;grid-auto-flow:row}
    .bsbsf-comments .product-info>*{grid-column:1}
    .bsbsf-comments .product-info>.bsbsf-cgen-col{grid-column:2;grid-row:1/span 40;align-self:start}
    .bsbsf-comments .product-info>form.cart{position:sticky;top:88px;align-self:start}
}
/* the buy card (both templates) */
.bsbsf-product form.cart{background:#fff;border:1px solid #E7DACB;border-radius:16px;
    padding:22px 22px 18px;box-shadow:0 20px 40px -30px rgba(26,21,18,.3);margin:0 0 20px}

/* ---- left-column typography (shared) ---- */
.bsbsf-chip{display:inline-flex;align-items:center;gap:8px;padding:6px 13px;border-radius:999px;
    background:#FAF4EC;border:1px solid #E7DACB;font-size:11.5px;font-weight:700;letter-spacing:.08em;
    text-transform:uppercase;color:#6E6259;text-decoration:none;margin-bottom:12px;justify-self:start}
.bsbsf-chip:hover{border-color:#EB4646;color:#EB4646}
.bsbsf-product .product-title{font-size:clamp(27px,3.2vw,40px);line-height:1.08;margin-bottom:8px}
.bsbsf-product .product-info>.price-wrapper,
.bsbsf-product .product-info>.price{margin:2px 0 10px}
.bsbsf-product .product-short-description{font-size:16.5px;line-height:1.7;color:#584F47;max-width:56ch}

/* ---- SERVICE: feature chips + spec row ---- */
.bsbsf-chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 4px;padding:0}
.bsbsf-chips li{display:inline-flex;align-items:center;gap:7px;padding:7px 13px 7px 11px;
    border:1px solid #E7DACB;border-radius:999px;background:#fff;font-size:13.5px;font-weight:600;color:#3f3831}
.bsbsf-chips li:before{content:"\2713";display:grid;place-items:center;width:17px;height:17px;
    border-radius:50%;background:rgba(235,70,70,.12);color:#EB4646;font-size:10.5px;font-weight:800}
.bsbsf-specrow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:18px 0 4px;
    border:1px solid #EFE6D8;border-radius:14px;overflow:hidden;background:#fff}
.bsbsf-specrow>div{padding:13px 15px;border-left:1px solid #EFE6D8}
.bsbsf-specrow>div:first-child{border-left:0}
/* display:block — the theme sets dl dt/dd inline, which would jam single-word values onto the label */
.bsbsf-specrow dt{display:block;margin:0 0 3px;font-size:10.5px;font-weight:700;letter-spacing:.09em;
    text-transform:uppercase;color:#9a9088}
.bsbsf-specrow dd{display:block;margin:0;font-family:"Bricolage Grotesque",system-ui,sans-serif;
    font-size:15px;font-weight:700;color:#1A1512;line-height:1.15}

/* ---- variations block inside the card: kill the table look (shared) ---- */
.bsbsf-product .variations,.bsbsf-product .variations tbody,.bsbsf-product .variations tr,
.bsbsf-product .variations th,.bsbsf-product .variations td{display:block;width:100%;border:0;padding:0;margin:0}
.bsbsf-product .variations{margin-bottom:6px}
.bsbsf-product .variations .label,.bsbsf-product .variations th{font-family:"Bricolage Grotesque",system-ui,sans-serif;
    font-size:15px;font-weight:700;color:#1A1512;margin:0 0 8px}
.bsbsf-product .variations .reset_variations{font-size:12px;color:#9a9088}
/* tier pills */
.bsbsf-tiers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0 0 14px}
.bsbsf-tier{display:flex;align-items:center;justify-content:space-between;gap:8px;
    padding:10px 12px;border:1.5px solid #E7DACB;border-radius:12px;background:#fff;cursor:pointer;
    text-align:left;transition:border-color .14s,background .14s;min-height:52px;box-shadow:none}
.bsbsf-tier:hover{border-color:#EB4646;background:#fff}
.bsbsf-tier.is-on{border-color:#EB4646;border-width:2px;background:#FAF4EC;padding:9.5px 11.5px}
.bsbsf-tier b{font-family:"Bricolage Grotesque",system-ui,sans-serif;font-size:15px;font-weight:750;
    color:#1A1512;line-height:1.1;display:block}
.bsbsf-tier i{display:block;font-style:normal;font-size:11px;color:#9a9088;font-weight:600;margin-top:1px}
.bsbsf-tier .bsbsf-word{font-size:13.5px}
.bsbsf-tprice{font-style:normal;font-size:13px;font-weight:800;color:#EB4646;white-space:nowrap}
/* native select: keep functional, visually hide only once JS owns the pills */
.variations_form.bsbsf-js .bsbsf-native{position:absolute!important;width:1px;height:1px;
    overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* single-variation price line inside the card */
.bsbsf-product .single_variation_wrap .woocommerce-variation-price .price{font-size:27px;color:#FF7A3D}
/* ATC button full width (!important: theme.css slims this button with its own hard rules) */
.bsbsf-product form.cart .single_add_to_cart_button{width:100%!important;min-width:0!important;
    padding:13px 22px!important;font-size:15.5px!important;margin-top:4px}
/* the Clear link would resurrect the empty "no tier" state the preselect exists to prevent */
.variations_form.bsbsf-js .reset_variations{display:none!important}
/* the OLD theme.css trust line (form.cart:after, post 21805) would duplicate the new strip —
   suppress it only while this surface is on, so flipping product=0 restores it untouched */
.bsbsf-product form.cart:after{display:none!important}

/* ---- under-button reassurance (both templates) ---- */
.bsbsf-cbul{list-style:none;margin:14px 0 2px;padding:0}
.bsbsf-cbul li{position:relative;padding-left:24px;margin:7px 0;font-size:13px;color:#3f3831}
.bsbsf-cbul li:before{content:"\2713";position:absolute;left:0;top:1px;width:16px;height:16px;
    border-radius:50%;background:rgba(235,70,70,.12);color:#EB4646;font-size:10px;font-weight:800;
    display:grid;place-items:center}
.bsbsf-secure{margin:12px 0 0;font-size:12px;color:#9a9088;display:flex;align-items:center;gap:6px}

/* ---- GF add-on fields inside the card (shared) ---- */
.bsbsf-product form.cart .gform_wrapper{margin:6px 0 0}
.bsbsf-product form.cart .gform_wrapper .gfield_label{font-family:"Bricolage Grotesque",system-ui,sans-serif;
    font-size:15px;font-weight:700;color:#1A1512}
.bsbsf-product form.cart .gform_wrapper input[type=text],
.bsbsf-product form.cart .gform_wrapper input[type=url],
.bsbsf-product form.cart .gform_wrapper textarea{width:100%}

/* ---- COMMENTS: right-column workspace (relocated .pf-cgen) ----
   The scoped .bsbsf-cgen-col prefix (2 classes) outweighs Perfect Fulfilment's own single-class
   #pf-cgen-css rules that print later in the footer, so these win the cascade without !important. */
.bsbsf-cgen-col{min-height:340px}
.bsbsf-cgen-skel{border:1px solid #EFE6D8;border-radius:18px;background:#FAF4EC;padding:18px;display:grid;gap:12px}
.bsbsf-cgen-skel span{display:block;height:54px;border-radius:12px;
    background:linear-gradient(90deg,#F3EADD,#FBF5EC,#F3EADD);background-size:200% 100%;
    animation:bsbsfSkel 1.4s linear infinite}
@keyframes bsbsfSkel{0%{background-position:200% 0}100%{background-position:-200% 0}}
.bsbsf-cgen-col .pf-cgen{margin:0;border:1px solid #EFE6D8;border-radius:18px;background:#fff;padding:20px 22px}
.bsbsf-cgen-col .pf-cgen-head{border-bottom:1px solid #F0E7DA;padding-bottom:14px;margin-bottom:2px;align-items:flex-start}
.bsbsf-cgen-col .pf-cgen-title{font-family:"Bricolage Grotesque",system-ui,sans-serif;font-size:16px}
.bsbsf-cgen-col .pf-cgen-sub{font-size:12px;max-width:48ch}
/* the "redraft all" control, moved into the header by product.js as a pill = "Shuffle all" */
.bsbsf-cgen-col .pf-cgen-head .pf-cgen-redo{align-self:center;white-space:nowrap;border:1px solid #E7DACB;
    border-radius:999px;padding:7px 15px;text-decoration:none;color:#6E6259;font-weight:600;background:#fff}
.bsbsf-cgen-col .pf-cgen-head .pf-cgen-redo:hover{border-color:#EB4646;color:#EB4646;background:#fff}
/* comment rows as cards — keep PF's align-items:flex-start + its first-line offsets so the tick and
   the ↻ redo stay level with the FIRST line of a comment that grows to several lines (PF auto-grows
   the textarea to its content); only the card chrome is ours. */
.bsbsf-cgen-col .pf-cgen-row{gap:11px;margin:10px 0;padding:12px 13px;
    border:1px solid #EFE6D8;border-radius:14px;background:#FDFAF4}
.bsbsf-cgen-col .pf-cgen-txt{background:#fff}
.bsbsf-cgen-col .pf-cgen-foot{border-top:1px solid #F0E7DA;padding-top:12px;margin-top:14px}

/* ---- "how it works" card — sits at the bottom of the left content column (steps stacked
   vertically to use the spare vertical space beside the buy card) ---- */
.bsbsf-how{margin:22px 0 4px;padding:22px 24px;background:#FAF4EC;border:1px solid #EFE6D8;border-radius:18px}
.bsbsf-how h3{font-family:"Bricolage Grotesque",system-ui,sans-serif;font-size:15px;font-weight:700;
    letter-spacing:.02em;color:#1A1512;margin:0 0 14px}
.bsbsf-how ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:14px}
.bsbsf-how li{display:flex;align-items:center;gap:13px}
.bsbsf-hown{flex:0 0 auto;width:34px;height:34px;border-radius:50%;background:#EB4646;color:#fff;
    font-family:"Bricolage Grotesque",system-ui,sans-serif;font-weight:700;font-size:16px;
    display:grid;place-items:center;box-shadow:0 8px 16px -8px rgba(235,70,70,.7)}
.bsbsf-howt{font-size:14.5px;font-weight:600;color:#1A1512;line-height:1.3}

/* ---- long description: clamp with a "read full details" expander (product.js adds the classes +
   button only when the content is actually tall). Content stays in the DOM = no SEO loss. ---- */
.bsbsf-product #tab-description.bsbsf-desc{position:relative}
.bsbsf-product #tab-description.bsbsf-clamp{max-height:430px;overflow:hidden}
.bsbsf-product #tab-description.bsbsf-clamp:after{content:"";position:absolute;left:0;right:0;bottom:0;
    height:160px;background:linear-gradient(rgba(255,255,255,0),#fff 80%);pointer-events:none;z-index:1}
.bsbsf-readmore{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);z-index:2;
    display:inline-flex;align-items:center;gap:7px;background:#fff;border:1.5px solid #EB4646;color:#EB4646;
    font-family:"Bricolage Grotesque",system-ui,sans-serif;font-weight:700;font-size:13.5px;
    padding:9px 20px;border-radius:999px;cursor:pointer;box-shadow:0 6px 18px -8px rgba(26,21,18,.3)}
.bsbsf-readmore:hover{background:#EB4646;color:#fff}
.bsbsf-product #tab-description:not(.bsbsf-clamp) .bsbsf-readmore{position:static;transform:none;
    display:flex;width:max-content;margin:18px auto 4px;box-shadow:none}

/* ---- mobile sticky buy bar (fixed, off by default; product.js toggles .is-shown on scroll) ---- */
.bsbsf-buybar{position:fixed;left:0;right:0;bottom:0;z-index:1000;display:none;align-items:center;gap:12px;
    padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #E7DACB;
    box-shadow:0 -10px 30px -18px rgba(26,21,18,.45)}
.bsbsf-buybar-price{font-family:"Bricolage Grotesque",system-ui,sans-serif;font-weight:700;font-size:21px;
    color:#1A1512;white-space:nowrap;line-height:1.05}
.bsbsf-buybar-price small{display:block;font-family:system-ui,sans-serif;font-size:10.5px;font-weight:600;
    color:#9a9088;letter-spacing:.02em}
.bsbsf-buybar-btn{margin-left:auto;background:#EB4646;color:#fff;border:none;border-radius:999px;
    padding:13px 26px;font-size:15px;font-weight:700;cursor:pointer;box-shadow:0 10px 22px -10px rgba(235,70,70,.8)}
.bsbsf-buybar-btn:active{transform:translateY(1px)}

/* ---- strict single-column mobile (both templates) ---- */
@media (max-width:849px){
    .bsbsf-product .product-info{display:block}
    .bsbsf-product .product-info>form.cart{position:static!important;margin:16px 0 20px}
    .bsbsf-comments .product-info>.bsbsf-cgen-col{margin-top:4px}
    .bsbsf-specrow{grid-template-columns:repeat(2,minmax(0,1fr))}
    .bsbsf-how ol{grid-template-columns:1fr;gap:14px}
    .bsbsf-how{margin:28px 0 6px;padding:22px}
    .bsbsf-buybar.is-shown{display:flex}
    /* clear room so the fixed bar never sits over the last field/footer */
    body.bsbsf-product{padding-bottom:74px}
}

/* ============ my account (flag: account) ============
   Flatsome builds its own .account-nav sidebar (.large-3) + fires the nav hook in .large-9;
   we restyle the sidebar and hide the redundant content-column nav. Selectors carry .bsbsf-account
   to out-specify the older wp-custom-css .woocommerce-MyAccount-navigation rules (post 21805). */
.bsbsf-account .large-9 .woocommerce-MyAccount-navigation,
.bsbsf-account .large-9 > .woocommerce > .account-nav{display:none} /* kill any duplicate nav */
.bsbsf-account .col-border{border:0;box-shadow:none}
/* owner: no avatar (platform has no profile-picture feature); no "MY ACCOUNT" title band */
.bsbsf-account .account-user{display:none}
.bsbsf-account .my-account-header,.bsbsf-account .page-title.my-account-header{display:none}
.bsbsf-account .account-container,.woocommerce-account.bsbsf-account main{padding-top:26px}
.bsbsf-account ul.account-nav{list-style:none;margin:0;padding:6px;border:1px solid #E7DACB;
    border-radius:14px;background:#fff;text-align:left}
.bsbsf-account ul.account-nav li{margin:0;border:0}
.bsbsf-account ul.account-nav li a{display:block;padding:11px 14px;border-radius:9px;
    font-size:14px;font-weight:600;color:#6E6259;text-decoration:none;text-transform:none;
    letter-spacing:0;border:0;transition:background .14s,color .14s}
.bsbsf-account ul.account-nav li a:hover{background:#FAF4EC;color:#1A1512}
.bsbsf-account ul.account-nav li.is-active a,
.bsbsf-account ul.account-nav li.active a{background:#FAF4EC;color:#EB4646;font-weight:700}
.bsbsf-nicon{display:grid;place-items:center;width:20px;height:20px;flex:none}
.bsbsf-nicon svg{width:17px;height:17px}
.bsbsf-dash-hi{font-family:"Bricolage Grotesque",system-ui,sans-serif;font-weight:800;
    font-size:clamp(24px,2.6vw,32px);margin:0 0 2px;color:#1A1512}
.bsbsf-dash-sub{color:#9a9088;font-size:15px;margin:0 0 20px}
.bsbsf-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin:0 0 26px}
.bsbsf-tile{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid #E7DACB;
    border-radius:14px;padding:16px;text-decoration:none;
    transition:transform .16s,border-color .16s,box-shadow .16s}
.bsbsf-tile:hover{transform:translateY(-3px);border-color:#EB4646;box-shadow:0 18px 34px -18px rgba(26,21,18,.4)}
.bsbsf-ticon{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;
    background:#FAF4EC;color:#EB4646;margin-bottom:2px}
.bsbsf-ticon svg{width:19px;height:19px}
.bsbsf-tile b{font-family:"Bricolage Grotesque",system-ui,sans-serif;font-size:22px;font-weight:800;
    color:#1A1512;line-height:1.1}
.bsbsf-tile b.bsbsf-gold{color:#B07A17}
.bsbsf-tlabel{font-size:12.5px;color:#9a9088;font-weight:600}
.bsbsf-tsolo{font-size:14px;color:#1A1512;font-weight:700;margin-top:auto}
.bsbsf-recent h3{font-family:"Bricolage Grotesque",system-ui,sans-serif;font-size:18px;font-weight:800;margin:0 0 10px}
.bsbsf-recrow{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:#fff;
    border:1px solid #E7DACB;border-radius:12px;padding:12px 16px;margin-bottom:8px;
    text-decoration:none;transition:border-color .14s}
.bsbsf-recrow:hover{border-color:#EB4646}
.bsbsf-recrow b{font-size:14.5px;color:#1A1512}
.bsbsf-recdate{font-size:13px;color:#9a9088}
.bsbsf-rectotal{margin-left:auto;font-weight:700;color:#1A1512}
.bsbsf-recall{margin:6px 0 0}
.bsbsf-recall a{font-weight:700;color:#EB4646;text-decoration:none}
/* status pills (shared with orders table in a later pass) */
.bsbsf-status{display:inline-flex;align-items:center;padding:3px 11px;border-radius:999px;
    font-size:12px;font-weight:700;background:#eef0f6;color:#6a6c86}
.bsbsf-status.is-pending{background:rgba(245,181,74,.16);color:#9a5b00}
.bsbsf-status.is-processing{background:rgba(245,181,74,.16);color:#9a5b00}
.bsbsf-status.is-completed{background:rgba(46,158,91,.13);color:#1f7a44}
.bsbsf-status.is-on-hold{background:rgba(255,122,61,.14);color:#b4511f}
.bsbsf-status.is-cancelled,.bsbsf-status.is-refunded,.bsbsf-status.is-failed{background:#eef0f6;color:#6a6c86}

/* orders table: de-beige, card-like rows, status text as a colored pill keyed on the row's
   own --status-<slug> class (no template override needed) */
.bsbsf-account .woocommerce-orders-table{border-collapse:separate;border-spacing:0 8px;background:transparent;border:0}
.bsbsf-account .woocommerce-orders-table thead th{background:transparent;border:0;text-transform:uppercase;
    letter-spacing:.06em;font-size:11px;font-weight:700;color:#9a9088;padding:0 14px 2px}
.bsbsf-account .woocommerce-orders-table tbody tr{background:#fff}
.bsbsf-account .woocommerce-orders-table tbody td{border:1px solid #E7DACB;border-left:0;border-right:0;
    padding:14px;vertical-align:middle;background:#fff}
.bsbsf-account .woocommerce-orders-table tbody td:first-child{border-left:1px solid #E7DACB;
    border-radius:12px 0 0 12px}
.bsbsf-account .woocommerce-orders-table tbody td:last-child{border-right:1px solid #E7DACB;
    border-radius:0 12px 12px 0}
.bsbsf-account .woocommerce-orders-table__cell-order-number a{font-weight:800;color:#1A1512}
.bsbsf-account .woocommerce-orders-table__cell-order-actions .button{margin:2px}
/* status pill span comes from our myaccount/orders.php override (.bsbsf-status.is-<slug>) */

/* ============ login (flag: login) ============ */
.bsbsf-loginwrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));
    gap:18px;max-width:860px;margin:10px auto 30px}
.bsbsf-logincard{background:#fff;border:1px solid #E7DACB;border-radius:16px;padding:26px}
.bsbsf-logincard h2{font-family:"Bricolage Grotesque",system-ui,sans-serif;font-size:22px;
    font-weight:800;margin:0 0 14px}
.bsbsf-loginnew{background:#FAF4EC}
.bsbsf-newsub{color:#6E6259;font-size:14.5px;margin:0 0 12px}
.bsbsf-loginbtn{width:100%!important;margin-top:6px}
.bsbsf-loginrow{display:flex;align-items:center;gap:8px}
.bsbsf-trialbtn{margin-top:14px}
.bsbsf-login .woocommerce-LostPassword{margin:12px 0 0;font-size:13px}

/* ============ steps indicator (cart + checkout) ============ */
.bsbsf-steps{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;
    margin:0 auto 24px;max-width:520px}
.bsbsf-step{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:#9a9088}
.bsbsf-step i{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;font-style:normal;
    font-size:12px;border:1px solid #E7DACB;background:#fff;color:#9a9088}
.bsbsf-step.is-now{color:#1A1512}
.bsbsf-step.is-now i{background:#EB4646;border-color:#EB4646;color:#fff}
.bsbsf-step.is-done i{background:rgba(46,158,91,.13);border-color:transparent;color:#1f7a44}
.bsbsf-stepline{flex:1 1 22px;max-width:46px;height:1px;background:#E7DACB}

/* ============ cart (flag: cart) ============ CSS-only over Flatsome's core cart.php */
.bsbsf-cart .cart-wrapper,.bsbsf-cart .woocommerce-cart-form{border:0}
.bsbsf-cart table.cart{border-collapse:separate;border-spacing:0 10px;background:transparent;border:0}
.bsbsf-cart table.cart thead th{background:transparent;border:0;text-transform:uppercase;
    letter-spacing:.06em;font-size:11px;font-weight:700;color:#9a9088;padding:0 14px 2px}
.bsbsf-cart table.cart tbody tr.cart_item{background:#fff}
.bsbsf-cart table.cart tbody tr.cart_item td{border:1px solid #E7DACB;border-left:0;border-right:0;
    background:#fff;padding:16px 12px;vertical-align:middle}
.bsbsf-cart table.cart tbody tr.cart_item td.product-remove{border-left:1px solid #E7DACB;border-radius:12px 0 0 12px;width:44px}
.bsbsf-cart table.cart tbody tr.cart_item td.product-subtotal{border-right:1px solid #E7DACB;border-radius:0 12px 12px 0}
.bsbsf-cart td.product-thumbnail img{width:46px;height:46px;border-radius:10px;border:1px solid #E7DACB}
.bsbsf-cart td.product-name{font-weight:700;color:#1A1512}
.bsbsf-cart td.product-name>a{color:#1A1512;font-family:"Bricolage Grotesque",system-ui,sans-serif;font-size:15px}
/* collapsed GF meta (from woocommerce_get_item_data): compact grey line, no uppercase wall.
   The theme uppercases .variation via text-transform — force it back to normal case. */
.bsbsf-cart td.product-name .variation{margin:6px 0 0;display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12.5px}
.bsbsf-cart td.product-name .variation,
.bsbsf-cart td.product-name .variation *{text-transform:none!important;letter-spacing:0}
.bsbsf-cart td.product-name .variation dt{font-weight:600;color:#9a9088;margin:0}
.bsbsf-cart td.product-name .variation dd{margin:0;color:#6E6259}
.bsbsf-cart td.product-name .variation dd p{margin:0;display:inline}
.bsbsf-cart .remove{color:#9a9088;font-size:20px}
.bsbsf-cart .remove:hover{color:#EB4646;background:transparent}
.bsbsf-cart td.product-quantity .qty{border:1px solid #E7DACB;border-radius:9px;min-height:38px}
/* right column: totals + funds as a sticky summary card */
.bsbsf-cart .cart-collaterals,.bsbsf-cart .cart_totals{width:100%!important;float:none!important}
.bsbsf-cart .cart_totals{background:#fff;border:1px solid #E7DACB;border-radius:16px;padding:20px 22px;
    box-shadow:0 20px 40px -30px rgba(26,21,18,.3)}
.bsbsf-cart .cart_totals h2{font-family:"Bricolage Grotesque",system-ui,sans-serif;font-size:18px;
    font-weight:800;margin:0 0 12px;text-transform:none}
.bsbsf-cart .cart_totals table{border:0;background:transparent}
.bsbsf-cart .cart_totals table th,.bsbsf-cart .cart_totals table td{border:0;background:transparent;
    padding:9px 0;border-bottom:1px solid #F0E7DA}
.bsbsf-cart .cart_totals .order-total th,.bsbsf-cart .cart_totals .order-total td{border-bottom:0;
    font-size:18px;font-weight:800;color:#1A1512;padding-top:12px}
.bsbsf-cart .cart_totals .checkout-button{width:100%;margin-top:14px;padding:13px 22px!important;font-size:15.5px}
/* Account Funds belongs on checkout only — the cart stays clean (owner).
   The plugin wraps its apply form in a .wc-account-funds-apply-notice (.woocommerce-info) box. */
.bsbsf-cart .wc-account-funds-apply-notice,
.bsbsf-cart form.wc-account-funds-apply,
.bsbsf-cart .woocommerce-account-funds{display:none!important}
.bsbsf-cart .cart-empty,.bsbsf-cart .wc-empty-cart-message{text-align:center;font-size:18px;
    font-family:"Bricolage Grotesque",system-ui,sans-serif;color:#1A1512}
@media (max-width:849px){
    .bsbsf-cart .row-divided>.large-7,.bsbsf-cart .row-divided>.large-5{width:100%}
    .bsbsf-cart table.cart thead{display:none}
}

/* ============ checkout (flag: checkout) ============ CSS-only over core form-checkout.php.
   No structural override — Subscriptions / Account Funds / Checkout Field Editor keep their form. */
.bsbsf-checkout .woocommerce-billing-fields,.bsbsf-checkout #order_review{background:#fff;
    border:1px solid #E7DACB;border-radius:16px;padding:22px 24px;
    box-shadow:0 20px 40px -30px rgba(26,21,18,.3);margin-bottom:18px}
/* the checkout right column carries a Flatsome has-border (coral) frame — our card is the frame now */
.bsbsf-checkout .col-inner.has-border{border:0!important;padding:0}
/* minimal checkout: order-notes ("Additional information") is optional noise for virtual services.
   Checkout Field Editor manages it (bypasses the core enable-notes filter) so hide it here. */
.bsbsf-checkout .woocommerce-additional-fields{display:none}
.bsbsf-checkout .woocommerce-billing-fields>h3,.bsbsf-checkout #order_review_heading,
.bsbsf-checkout #ship-to-different-address{font-family:"Bricolage Grotesque",system-ui,sans-serif;
    font-size:18px;font-weight:800;text-transform:none;margin:0 0 14px;letter-spacing:-.01em}
.bsbsf-checkout .woocommerce-billing-fields .form-row{margin:0 0 14px;padding:0}
.bsbsf-checkout .woocommerce-billing-fields label{font-weight:600;font-size:13.5px;color:#1A1512}
.bsbsf-checkout .woocommerce-billing-fields input.input-text,
.bsbsf-checkout .woocommerce-billing-fields textarea,
.bsbsf-checkout .woocommerce-billing-fields .select2-selection,
.bsbsf-checkout .woocommerce-billing-fields select{min-height:46px;border-radius:10px}
/* order review as a sticky summary card */
@media (min-width:850px){ .bsbsf-checkout #order_review{position:sticky;top:96px} }
.bsbsf-checkout #order_review .shop_table{border:0;background:transparent;margin:0}
.bsbsf-checkout #order_review .shop_table th,.bsbsf-checkout #order_review .shop_table td{
    border:0;border-bottom:1px solid #F0E7DA;padding:11px 0;background:transparent}
.bsbsf-checkout #order_review .shop_table thead th{text-transform:uppercase;letter-spacing:.06em;
    font-size:11px;font-weight:700;color:#9a9088}
.bsbsf-checkout #order_review .order-total th,.bsbsf-checkout #order_review .order-total td{
    border-bottom:0;font-size:18px;font-weight:800;color:#1A1512;padding-top:13px}
.bsbsf-checkout #order_review .cart-subtotal td,.bsbsf-checkout #order_review .cart-discount td{font-weight:600}
/* collapsed GF meta in the review, normal case (same as cart) */
.bsbsf-checkout #order_review .variation,.bsbsf-checkout #order_review .variation *{
    text-transform:none!important;letter-spacing:0;font-size:12.5px}
.bsbsf-checkout #order_review .variation dt{font-weight:600;color:#9a9088}
.bsbsf-checkout #order_review .variation dd{margin:0;color:#6E6259}
.bsbsf-checkout #order_review .variation dd p{margin:0;display:inline}
.bsbsf-checkout #order_review .product-name{font-weight:700;color:#1A1512}
/* payment gateways as radio cards (owner's law: radio over dropdown) */
.bsbsf-checkout #payment{background:transparent;border-radius:0}
.bsbsf-checkout #payment ul.payment_methods{border:0;padding:0;margin:0 0 14px}
.bsbsf-checkout #payment li.wc_payment_method{list-style:none;background:#fff;border:1px solid #E7DACB;
    border-radius:12px;padding:13px 15px;margin:0 0 8px}
.bsbsf-checkout #payment li.wc_payment_method>label{font-weight:700;color:#1A1512;font-size:14.5px}
.bsbsf-checkout #payment li.wc_payment_method .payment_box{background:#FAF4EC;border-radius:10px;
    margin:10px 0 0;padding:12px 14px;font-size:13px}
.bsbsf-checkout #payment li.wc_payment_method .payment_box:before{display:none}
.bsbsf-checkout #payment .place-order{padding:0;margin-top:6px}
.bsbsf-checkout #place_order{width:100%;padding:14px 22px!important;font-size:16px!important;min-width:0!important}
/* Account Funds: our static .bsbsf-funds nudge (hooks-checkout) shows the balance + discount + Top up
   upfront. Hide the plugin's own animated payment description box + apply form so nothing collapses /
   reopens when toggling payment methods. Hiding is display-only; the 5% discount comes from selecting
   the Account Funds gateway, so the total is unchanged. */
.bsbsf-checkout #payment li.payment_method_accountfunds .payment_box{display:none!important}
.bsbsf-checkout .wc-account-funds-apply-notice,
.bsbsf-checkout form.wc-account-funds-apply{display:none!important}
.bsbsf-funds{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:#FAF4EC;
    border:1px solid #E7DACB;border-radius:12px;padding:13px 15px;margin:0 0 16px}
.bsbsf-funds-info{flex:1 1 auto;min-width:0;font-size:13px;color:#6E6259}
.bsbsf-funds-info b{color:#1A1512;font-weight:800;font-size:14px}
.bsbsf-funds-save{display:block;margin-top:2px;color:#1f7a44;font-weight:700}
.bsbsf-funds-topup{flex:none;display:inline-flex;align-items:center;padding:8px 16px;border-radius:999px;
    background:#fff;border:1px solid #E7DACB;color:#1A1512;font-weight:700;font-size:13px;
    text-decoration:none;transition:border-color .14s,color .14s}
.bsbsf-funds-topup:hover{border-color:#EB4646;color:#EB4646}
/* trust footer under place order */
.bsbsf-trustline{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;margin:14px 0 0;
    font-size:12px;font-weight:700;color:#9a9088}
.bsbsf-trustline span{display:inline-flex;align-items:center;gap:6px}
.bsbsf-trustline b{color:#1f7a44;font-weight:800}
@media (max-width:849px){ .bsbsf-checkout .woocommerce-billing-fields,.bsbsf-checkout #order_review{padding:18px} }