/* moved to inline in BB_Sub_Cart::inline_styles_once() */

/* ---------------------------------------------------------------
   Cart-level "Subscribe & save" upsell on a one-time line, and the
   money-back guarantee under the checkout button (proposal 6/29).
   Styled to match the product page's Subscribe & Save card.
   --------------------------------------------------------------- */
/* The hook fires inside .fkcart-item-title-price, a flex row holding the title and the price, so
   the button was being squeezed into a narrow column and wrapping to four lines. Let that row wrap
   and give the button its own full-width line underneath. */
.bb-fk-sub-upsell { flex: 1 0 100% !important; width: 100% !important; order: 99 !important; margin-top: 6px !important; }

.bb-fk-sub-upsell {
    display: flex !important;
    margin-left: 14px !important; margin-right: 14px !important;
    width: auto !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 2px !important;
    width: 100% !important;
    margin: 8px 0 2px !important;
    padding: 9px 12px !important;
    background: #fdf2f8 !important;
    border: 1.5px solid #f3c6de !important;
    border-radius: 10px !important;
    cursor: pointer !important;
    text-align: left !important;
    transition: border-color .15s, background .15s !important;
}
.bb-fk-sub-upsell:hover { border-color: #e0409a !important; background: #fce7f3 !important; }
.bb-fk-sub-upsell.is-busy { opacity: .55 !important; cursor: default !important; }
.bb-fk-sub-upsell-main {
    font-size: 12.5px !important; font-weight: 800 !important; color: #b83280 !important;
    letter-spacing: .01em !important; line-height: 1.3 !important;
}
.bb-fk-sub-upsell-sub { font-size: 11px !important; color: #6b7280 !important; line-height: 1.35 !important; }

.bb-fk-guarantee {
    display: flex !important; align-items: flex-start !important; gap: 9px !important;
    margin: 10px 14px 4px !important; padding: 10px 12px !important;
    background: #f9fafb !important; border: 1px solid #e5e7eb !important; border-radius: 10px !important;
}
.bb-fk-guarantee-icon { font-size: 15px !important; line-height: 1.2 !important; color: #16a34a !important; }
.bb-fk-guarantee-text { display: flex !important; flex-direction: column !important; gap: 2px !important; }
.bb-fk-guarantee-text strong { font-size: 12px !important; font-weight: 800 !important; color: #1f2937 !important; }
.bb-fk-guarantee-text span { font-size: 11px !important; color: #6b7280 !important; line-height: 1.35 !important; }

/* Founder / legacy rate notice at the top of the cart. */
.bb-fk-legacy-note {
    display: flex !important; align-items: flex-start !important; gap: 8px !important;
    margin: 8px 14px 0 !important; padding: 9px 12px !important;
    background: linear-gradient(135deg, #fdf2f8, #fff7fb) !important;
    border: 1px solid #f3c6de !important; border-radius: 10px !important;
    font-size: 11.5px !important; color: #6b3350 !important; line-height: 1.4 !important;
}
.bb-fk-legacy-pill {
    flex: 0 0 auto !important; background: #c83784 !important; color: #fff !important;
    font-size: 9.5px !important; font-weight: 800 !important; letter-spacing: .04em !important;
    text-transform: uppercase !important; padding: 3px 8px !important; border-radius: 999px !important;
    white-space: nowrap !important;
}
.bb-fk-sub-upsell-item {
    font-size: 10px !important; color: #9b7d8c !important; text-transform: uppercase !important;
    letter-spacing: .04em !important; font-weight: 700 !important; margin-top: 2px !important;
}

/* Cross-sell image and name link through to the product page. */
body .fkcart-modal a.bb-fk-cs-img { display: block !important; }
body .fkcart-modal .bb-fk-cs-name a { color: inherit !important; text-decoration: none !important; }
body .fkcart-modal .bb-fk-cs-name a:hover { text-decoration: underline !important; }

/* ---------------------------------------------------------------
   Aurora (dark glass) variants for the two blocks we add. Without
   these they render as light cards against the dark panel.
   --------------------------------------------------------------- */
body .fkcart-modal.bb-skin-aurora .bb-fk-sub-upsell,
body .fkcart-preview-ui.bb-skin-aurora .bb-fk-sub-upsell {
    background: rgba(255,255,255,.07) !important;
    border: 1px solid rgba(255,140,200,.38) !important;
    backdrop-filter: blur(6px) !important;
}
body .fkcart-modal.bb-skin-aurora .bb-fk-sub-upsell:hover,
body .fkcart-preview-ui.bb-skin-aurora .bb-fk-sub-upsell:hover {
    background: rgba(255,255,255,.12) !important;
    border-color: rgba(255,140,200,.65) !important;
}
body .fkcart-modal.bb-skin-aurora .bb-fk-sub-upsell-main,
body .fkcart-preview-ui.bb-skin-aurora .bb-fk-sub-upsell-main { color: #ff9ed2 !important; }
body .fkcart-modal.bb-skin-aurora .bb-fk-sub-upsell-sub,
body .fkcart-preview-ui.bb-skin-aurora .bb-fk-sub-upsell-sub { color: rgba(243,232,255,.82) !important; }
body .fkcart-modal.bb-skin-aurora .bb-fk-sub-upsell-item,
body .fkcart-preview-ui.bb-skin-aurora .bb-fk-sub-upsell-item { color: rgba(243,232,255,.55) !important; }

body .fkcart-modal.bb-skin-aurora .bb-fk-guarantee,
body .fkcart-preview-ui.bb-skin-aurora .bb-fk-guarantee {
    background: rgba(255,255,255,.06) !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    backdrop-filter: blur(6px) !important;
}
body .fkcart-modal.bb-skin-aurora .bb-fk-guarantee-text strong,
body .fkcart-preview-ui.bb-skin-aurora .bb-fk-guarantee-text strong { color: #f3e8ff !important; }
body .fkcart-modal.bb-skin-aurora .bb-fk-guarantee-text span,
body .fkcart-preview-ui.bb-skin-aurora .bb-fk-guarantee-text span { color: rgba(243,232,255,.70) !important; }
body .fkcart-modal.bb-skin-aurora .bb-fk-guarantee-icon,
body .fkcart-preview-ui.bb-skin-aurora .bb-fk-guarantee-icon { color: #6ee7b7 !important; }

body .fkcart-modal.bb-skin-aurora .bb-fk-legacy-note,
body .fkcart-preview-ui.bb-skin-aurora .bb-fk-legacy-note {
    background: rgba(255,255,255,.07) !important;
    border: 1px solid rgba(255,140,200,.35) !important;
    color: rgba(243,232,255,.85) !important;
}


/* ---- Pass 10 (2026-09-04): item update/remove state. FunnelKit paints a white
   32px disc with a blur over the thumbnail; replace with a fade + slim pink ring,
   and stop clicks from selecting text across the cart. ---- */
body .fkcart-modal, body .fkcart-preview-ui { -webkit-user-select: none; user-select: none; }
body .fkcart-modal input, body .fkcart-modal textarea { -webkit-user-select: text; user-select: text; }
body .fkcart-modal .fkcart-loading::before { display: none !important; }
body .fkcart-modal .fkcart-loading::after { content: "" !important; display: block !important; position: absolute !important; left: 50% !important; top: 50% !important; width: 22px !important; height: 22px !important; margin: -11px 0 0 -11px !important; border: 2px solid rgba(200,55,132,.18) !important; border-top-color: #c83784 !important; border-radius: 50% !important; background: none !important; box-shadow: none !important; animation: bbfk-spin .7s linear infinite !important; }
body .fkcart-modal .fkcart-checkout--btn.fkcart-loading::after { border-color: rgba(255,255,255,.35) !important; border-top-color: #fff !important; }
body .fkcart-modal .fkcart-cart-item:has(.fkcart-loading) { opacity: .55 !important; transition: opacity .2s ease !important; }
@keyframes bbfk-spin { to { transform: rotate(360deg); } }

/* ---- Pass 10 (2026-09-05): subscribe upsell as a card, same language as "Pairs well with" ---- */
body .fkcart-modal .bb-fk-subup, body .bb-checkout-subup .bb-fk-subup { margin: 8px 22px 6px !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
body .fkcart-modal .bb-fk-subup-title, body .bb-checkout-subup .bb-fk-subup-title { text-align: center !important; font-size: 11px !important; font-weight: 800 !important; letter-spacing: .12em !important; text-transform: uppercase !important; color: #6b7280 !important; margin: 0 0 10px !important; }
body .fkcart-modal .bb-fk-subup-card, body .bb-checkout-subup .bb-fk-subup-card { background: rgba(255,255,255,.62) !important; backdrop-filter: blur(20px) saturate(150%) !important; -webkit-backdrop-filter: blur(20px) saturate(150%) !important; border: 1px solid rgba(255,255,255,.9) !important; border-radius: 16px !important; padding: 12px !important; box-shadow: 0 1px 2px rgba(31,41,55,.04), inset 0 1px 0 rgba(255,255,255,.8) !important; }
body .fkcart-modal .bb-fk-subup-top, body .bb-checkout-subup .bb-fk-subup-top { display: flex !important; align-items: center !important; gap: 12px !important; }
body .fkcart-modal .bb-fk-subup-img, body .bb-checkout-subup .bb-fk-subup-img { flex: 0 0 56px !important; width: 56px !important; height: 56px !important; display: block !important; }
body .fkcart-modal .bb-fk-subup-img img, body .bb-checkout-subup .bb-fk-subup-img img { width: 56px !important; height: 56px !important; object-fit: contain !important; display: block !important; background: transparent !important; }
body .fkcart-modal .bb-fk-subup-name, body .bb-checkout-subup .bb-fk-subup-name { flex: 1 1 auto !important; min-width: 0 !important; font-size: 14.5px !important; font-weight: 800 !important; color: #18121f !important; line-height: 1.25 !important; }
body .fkcart-modal .bb-fk-subup-meta, body .bb-checkout-subup .bb-fk-subup-meta { display: block !important; margin-top: 3px !important; font-size: 12px !important; font-weight: 500 !important; color: #6b7280 !important; line-height: 1.35 !important; }
body .fkcart-modal .bb-fk-subup-price, body .bb-checkout-subup .bb-fk-subup-price { flex: 0 0 auto !important; text-align: right !important; }
body .fkcart-modal .bb-fk-subup-price strong, body .bb-checkout-subup .bb-fk-subup-price strong { display: block !important; font-size: 16px !important; font-weight: 800 !important; color: #18121f !important; line-height: 1.2 !important; }
body .fkcart-modal .bb-fk-subup-price small, body .bb-checkout-subup .bb-fk-subup-price small { display: inline-block !important; margin-top: 4px !important; padding: 2px 8px !important; background: #e9f7ef !important; color: #16a34a !important; font-size: 11px !important; font-weight: 800 !important; border-radius: 100px !important; line-height: 1.4 !important; }
body .fkcart-modal .bb-fk-subup-btn, body .bb-checkout-subup .bb-fk-subup-btn { display: block !important; width: 100% !important; margin: 12px 0 0 !important; padding: 12px 16px !important; border: 0 !important; border-radius: 14px !important; background: linear-gradient(135deg, #e85ca6, #a06ade) !important; color: #fff !important; font-family: inherit !important; font-size: 14px !important; font-weight: 800 !important; letter-spacing: 0 !important; text-transform: none !important; line-height: 1.2 !important; min-height: 0 !important; cursor: pointer !important; position: relative !important; overflow: hidden !important; box-shadow: 0 4px 10px rgba(232,92,166,.30), inset 0 1px 0 rgba(255,255,255,.25) !important; transition: transform .2s ease, box-shadow .2s ease !important; }
body .fkcart-modal .bb-fk-subup-btn:hover, body .bb-checkout-subup .bb-fk-subup-btn:hover { transform: translateY(-1px) !important; box-shadow: 0 6px 16px rgba(232,92,166,.4) !important; }
body .fkcart-modal .bb-fk-subup-btn.is-busy, body .bb-checkout-subup .bb-fk-subup-btn.is-busy, body .fkcart-modal .bb-fk-subup-btn:disabled { opacity: .55 !important; cursor: default !important; transform: none !important; }

/* ---- Pass 10 (2026-09-04): background-free thumbnails sit straight on the card:
   no white box, border or shadow around the image, image fits by contain. ---- */
body .fkcart-modal .fkcart-thumb-wrap .fkcart-image-wrapper,
body .fkcart-modal.bb-skin-lumen .fkcart-thumb-wrap .fkcart-image-wrapper,
body .fkcart-modal.bb-skin-aurora .fkcart-thumb-wrap .fkcart-image-wrapper { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; border-radius: 0 !important; }
body .fkcart-modal .fkcart-thumb-wrap .fkcart-image,
body .fkcart-modal .bb-fk-clean-thumb { object-fit: contain !important; background: transparent !important; border-radius: 0 !important; box-shadow: none !important; border: 0 !important; }
body .fkcart-modal .bb-fk-crosssell-item img.bb-fk-clean-thumb, body .fkcart-modal .bb-fk-cs-thumb img.bb-fk-clean-thumb { object-fit: contain !important; background: transparent !important; }

/* ---- Pass 10 (2026-09-05): remove control as a corner badge on the item card
   (owner: top-right, half inside / half outside), and a quiet price loading state. ---- */
body .fkcart-modal .fkcart--item { position: relative !important; overflow: visible !important; }
body .fkcart-modal .fkcart--item .fkcart-thumb-wrap { position: static !important; }   /* the × anchors to the card, not the thumb */
body .fkcart-modal .fkcart--item .fkcart-image-wrapper { position: relative !important; } /* keeps the loading ring on the thumb */
body .fkcart-modal .fkcart--item .fkcart-remove-item { top: -9px !important; right: -9px !important; left: auto !important; bottom: auto !important; width: 24px !important; height: 24px !important; z-index: 5 !important; }
/* Price / subtotal while a quantity updates: no gray shimmer block, no ring, just dimmed text. */
body .fkcart-modal .fkcart-loading .woocommerce-Price-amount.amount::after { display: none !important; animation: none !important; background: none !important; }
body .fkcart-modal .fkcart-loading .woocommerce-Price-amount, body .fkcart-modal .fkcart-loading .woocommerce-Price-amount * { color: inherit !important; }
body .fkcart-modal .fkcart-item-price.fkcart-loading, body .fkcart-modal .fkcart-summary-amount.fkcart-loading, body .fkcart-modal .fkcart-loading:has(.woocommerce-Price-amount) { opacity: .45 !important; }
body .fkcart-modal .fkcart-item-price.fkcart-loading::after, body .fkcart-modal .fkcart-summary-amount.fkcart-loading::after, body .fkcart-modal .fkcart-loading:has(.woocommerce-Price-amount)::after { display: none !important; }

/* ---- Pass 10 (2026-09-05): mark subscription lines vs one-time lines.
   Keyed off the "Subscription" item meta FunnelKit prints ([data-attr-key="variation-Subscription"]),
   so it cannot silently vanish the way the fkcart_after_item_meta badge did. ---- */
/* the meta row becomes: [SUBSCRIPTION pill] then the renewal line underneath */
/* Pass 11 #15 (client 2026-09-05): the SUBSCRIPTION tag sits directly under the product title, not
   under the variation line. Both tags are drawn on the title link itself so they always follow it. */
body .fkcart-modal a.fkcart-item-title { display: block !important; }
body .fkcart-modal a.fkcart-item-title::after { display: block; width: max-content; margin: 5px 0 2px; font-size: 10px; line-height: 1.6; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; border-radius: 6px; padding: 1px 7px; }
body .fkcart-modal .fkcart--item:has([data-attr-key="variation-Subscription"]) a.fkcart-item-title::after { content: "Subscription"; color: #c72f85; background: #fdeef5; border: 1px solid #f6d4e5; }
body .fkcart-modal .fkcart--item:not(:has([data-attr-key="variation-Subscription"])) a.fkcart-item-title::after { content: "One-time purchase"; font-weight: 700; letter-spacing: .06em; color: #6b7280; background: #f3f4f6; border: 1px solid #e5e7eb; }
body .fkcart-modal .fkcart-attr-wrap:has(> [data-attr-key="variation-Subscription"]) { display: block !important; margin-top: 4px !important; }
body .fkcart-modal .fkcart-attr-key[data-attr-key="variation-Subscription"] { display: none !important; }
body .fkcart-modal .fkcart-attr-wrap:has(> [data-attr-key="variation-Subscription"]) .fkcart-attr-value { display: block !important; font-size: 12px !important; color: #6b7280 !important; line-height: 1.35 !important; }
body .fkcart-modal .fkcart--item:has([data-attr-key="variation-Subscription"]) { box-shadow: inset 3px 0 0 #e0409a, 0 1px 2px rgba(31,41,55,.04) !important; }
body .fkcart-modal .fkcart--item:has([data-attr-key="variation-Subscription"]) .fkcart-quantity-selector { display: none !important; }

/* Pass 11 #14: secondary one-time upgrade action under the subscribe button */
body .fkcart-modal .bb-fk-subup-alt, body .bb-checkout-subup .bb-fk-subup-alt { display: block; width: 100%; margin: 8px 0 0; padding: 0; background: transparent !important; border: 0 !important; box-shadow: none !important; color: #6b7280 !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0 !important; text-transform: none !important; line-height: 1.4 !important; text-align: center; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
body .fkcart-modal .bb-fk-subup-alt:hover, body .bb-checkout-subup .bb-fk-subup-alt:hover { color: #c72f85 !important; }
body .fkcart-modal .bb-fk-subup-alt.is-busy, body .bb-checkout-subup .bb-fk-subup-alt.is-busy { opacity: .5; pointer-events: none; }

/* Pass 11 review round 1 (item 14): the Save pill on the upsell card sat at 11px and APCA Lc 53 on its light green. 12px and a deeper green clear the floor. */
body .fkcart-modal .bb-fk-subup-price small, body .bb-checkout-subup .bb-fk-subup-price small { font-size: 12px !important; color: #166534 !important; background: #dcfce7 !important; font-weight: 700 !important; }

/* Pass 11 review round 2 (item 14): the one-line upgrade link needs a 40px tap target on phones */
body .fkcart-modal .bb-fk-subup-alt, body .bb-checkout-subup .bb-fk-subup-alt { min-height: 40px !important; padding: 8px 4px !important; display: flex !important; align-items: center; justify-content: center; }

/* 2026-09-08: two stacked pills under the subscription price ("25% off today" / "15% off refills") */
body .fkcart-modal .bb-fk-subup-price small, body .bb-checkout-subup .bb-fk-subup-price small { display: block !important; width: max-content !important; margin-left: auto !important; }

/* Pass 12 (2026-09-10): checkout-page upsell wrapper + paid-shipping note on the recurring row + hero shipping line */
body .bb-checkout-subup { margin: 0 0 18px; }
body .bb-checkout-subup .bb-fk-subup { margin: 0 !important; }
body .fkcart-modal .bb-fk-recurring-ship { display: block; width: 100%; font-size: 12px; color: #6b7280; margin-top: 4px; }
.bb-sub-hero-ship { font-size: 12.5px; color: #6b7280; margin-top: 2px; }
