/* ============================================================
   Silk Cart Unified — silk-cart.css  v5.5.1
   Defensive: !important on every critical visual rule so theme
   and Elementor styles cannot override the Figma design.
   ============================================================ */

/* Progress bar shown on the cart page + checkout page (outside
   the drawer). Inherits the existing .silk-shipping-progress
   styling and just adds page-context spacing. */
.silk-shipping-progress-page { margin: 0 0 24px !important; }
.silk-shipping-progress-page .silk-shipping-progress { margin: 0 !important; }
.silk-shipping-progress-page-checkout { margin-top: 8px !important; }

/* Cart-line price block layout: current price next to a strikethrough
   "was" price when the customer is paying less than regular.
   The colour + line-through rules live further down (~line 470)
   alongside the legacy .silk-item-price block so the cascade order
   is unambiguous. */
.silk-cart-wrap .silk-item-prices {
    display: flex !important;
    align-items: baseline !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
    margin: 2px 0 8px !important;
}

/* Pack-discount tag — "10-pak (-104,51 kr.)" pill in brand red,
   shown directly under the cart-line price when a bundle pack
   discount has been applied. Mirrors the pill design in the
   reference screenshot. */
/* The badge is wrapped in a flex column parent that defaults to
   stretching its children to full width. Forcing align-self
   keeps the pill tight to the text instead of running edge-to-
   edge, and `width: auto` + `flex: 0 0 auto` belt-and-braces
   that against any other rule. */
.silk-cart-wrap .silk-item-pack-tag {
    display: inline-flex !important;
    align-items: center !important;
    align-self: flex-start !important;
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: max-content !important;
    gap: 6px !important;
    background: var(--sc-brand) !important;
    color: #fff !important;
    padding: 5px 11px !important;
    border-radius: 999px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    margin-bottom: 6px !important;
    white-space: nowrap !important;
}
.silk-cart-wrap .silk-item-pack-tag,
.silk-cart-wrap .silk-item-pack-tag *,
.silk-cart-wrap .silk-item-pack-tag .silk-pack-tag-icon,
.silk-cart-wrap .silk-item-pack-tag .woocommerce-Price-amount,
.silk-cart-wrap .silk-item-pack-tag bdi,
.silk-cart-wrap .silk-item-pack-tag .woocommerce-Price-currencySymbol {
    color: #fff !important;
    fill: #fff !important;
    font-weight: 600 !important;
}
.silk-cart-wrap .silk-item-pack-tag .silk-pack-tag-icon {
    width: 14px !important;
    height: 14px !important;
    flex-shrink: 0 !important;
}

/* Total savings line in the action bar — sits below subtotal,
   centered, smaller than subtotal. Brand-coloured text only,
   no badge background or icon, per the latest design pass. */
.silk-action-bar .silk-total-savings {
    display: block !important;
    text-align: center !important;
    color: var(--sc-brand) !important;
    background: transparent !important;
    padding: 0 !important;
    margin: -6px 0 12px !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}
.silk-action-bar .silk-total-savings strong,
.silk-action-bar .silk-total-savings .woocommerce-Price-amount,
.silk-action-bar .silk-total-savings bdi {
    color: var(--sc-brand) !important;
    font-weight: 700 !important;
}

/* Subtotal label + amount: bolder, larger to match the design. */
.silk-action-bar .silk-cart-total .silk-total-label {
    font-weight: 700 !important;
    color: #2a1a14 !important;
    font-size: 18px !important;
}
.silk-action-bar .silk-cart-total .silk-total-price {
    font-weight: 800 !important;
    font-size: 20px !important;
}

/* ══════════════════════════════════════════════════════════════
   SIDE DRAWER (auto-rendered in wp_footer)
══════════════════════════════════════════════════════════════ */
.silk-drawer {
    position: fixed !important;
    inset: 0 !important;
    z-index: 999999 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

.silk-drawer.is-open {
    visibility: visible !important;
    pointer-events: auto !important;
}

.silk-drawer-backdrop {
    position: absolute !important;
    inset: 0 !important;
    background: rgba(26, 15, 11, 0.45) !important;
    opacity: 0 !important;
    transition: opacity 0.32s ease !important;
    cursor: pointer !important;
}

.silk-drawer.is-open .silk-drawer-backdrop {
    opacity: 1 !important;
}

.silk-drawer-panel {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: auto !important;
    width: 440px !important;
    max-width: 100vw !important;
    background: #ffffff !important;
    transform: translateX(100%) !important;
    transition: transform 0.38s cubic-bezier(0.32, 0.72, 0, 1) !important;
    overflow: hidden !important;
    box-shadow: -8px 0 32px rgba(0, 0, 0, 0.14) !important;
    display: flex !important;
    flex-direction: column !important;
    font-family: "Didot LP W01", "Playfair Display", Didot, "Bodoni MT", "Times New Roman", Georgia, serif !important;
    margin: 0 !important;
    padding: 0 !important;
}

.silk-drawer.is-open .silk-drawer-panel {
    transform: translateX(0) !important;
}

/* Topbar in the top-right corner of the drawer: close icon on
   top in its original position, "Clear all" stacked underneath
   so the customer can empty the cart in one tap without losing
   the familiar close affordance. */
.silk-drawer-topbar {
    position: absolute !important;
    top: 14px !important;
    right: 18px !important;
    z-index: 5 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    gap: 8px !important;
    pointer-events: none !important;
}
.silk-drawer-topbar > * { pointer-events: auto !important; }

.silk-drawer-clear {
    background: transparent !important;
    border: 0 !important;
    color: #888 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    text-decoration: underline !important;
    cursor: pointer !important;
    padding: 4px 2px !important;
    margin: 0 !important;
    font-family: inherit !important;
    line-height: 1 !important;
    transition: color 0.2s !important;
    text-align: right !important;
}
.silk-drawer-clear:hover  { color: var(--sc-brand) !important; }
.silk-drawer-clear:disabled { opacity: 0.5 !important; cursor: wait !important; }

.silk-drawer-close {
    position: relative !important;
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    border-radius: 50% !important;
    background: #6b1a1a !important;
    color: #ffffff !important;
    border: 0 !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 2 !important;
    font: inherit !important;
    padding: 0 !important;
    margin: 0 !important;
    transition: background 0.2s ease, transform 0.2s ease !important;
    box-shadow: none !important;
}

.silk-drawer-close:hover {
    background: #4a1414 !important;
    transform: scale(1.05) !important;
    color: #ffffff !important;
}

.silk-drawer-close svg { display: block !important; }

.silk-drawer-body {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    padding: 62px 22px 16px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch;
}

body.silk-drawer-open {
    overflow: hidden !important;
}

/* Responsive — works on phones (<480), tablets (480-767),
   laptops+ (>=768). Panel is full-width on phones, 400-440px
   on larger screens so it doesn't dominate a desktop. */
@media (max-width: 480px) {
    .silk-drawer-panel { width: 85vw !important; max-width: 85vw !important; }
    .silk-drawer-body { padding: 58px 16px 12px !important; }
    .silk-drawer .silk-action-bar { padding: 14px 16px 18px !important; }

    .silk-cart-wrap .silk-cart-item { gap: 12px !important; }
    .silk-cart-wrap .silk-item-img-wrap { width: 88px !important; height: 88px !important; }
    .silk-cart-wrap .silk-item-name { font-size: 18px !important; }
    .silk-cart-wrap .silk-cart-title { font-size: 26px !important; }
    .silk-cart-wrap .silk-related-img-wrap { width: 48px !important; height: 48px !important; }
    .silk-cart-wrap .silk-trust-boxes { gap: 6px !important; }
    .silk-cart-wrap .silk-trust-label { font-size: 12px !important; }
}

@media (min-width: 481px) and (max-width: 767px) {
    .silk-drawer-panel { width: 85vw !important; max-width: 440px !important; }
}

/* ══════════════════════════════════════════════════════════════
   CART DRAWER CONTENT — Figma design locked in with !important
══════════════════════════════════════════════════════════════ */
.silk-cart-wrap {
    --sc-brand:  #6b1a1a;
    --sc-deep:   #4a1414;
    --sc-dark:   #2a1a14;
    --sc-accent: #8b2e2e;
    --sc-terra:  #d4826a;
    --sc-border: #e8ddd8;
    --sc-muted:  #a89890;
    --sc-soft:   #f5f0ee;

    /* Single font stack — Didot everywhere in the cart. Both
       variables resolve to the same family so any rule that
       still uses var(--sc-sans) inherits Didot too. */
    --sc-serif: "Didot LP W01", "Playfair Display", Didot, "Bodoni MT", "Times New Roman", Georgia, serif;
    --sc-sans:  "Didot LP W01", "Playfair Display", Didot, "Bodoni MT", "Times New Roman", Georgia, serif;

    font-family: var(--sc-sans) !important;
    font-size: 17px !important;
    color: var(--sc-dark) !important;
    background: #ffffff !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    line-height: 1.4 !important;
}

.silk-cart-wrap,
.silk-cart-wrap * {
    box-sizing: border-box !important;
    font-family: var(--sc-sans) !important;
}

/* ── Header ────────────────────────────────────────────────── */
.silk-cart-wrap .silk-cart-header {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
}

.silk-cart-wrap .silk-cart-title {
    font-family: var(--sc-serif) !important;
    font-size: 28px !important;
    font-weight: 700 !important;
    color: var(--sc-brand) !important;
    letter-spacing: 0.02em !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    background: transparent !important;
    border: 0 !important;
}

.silk-cart-wrap .silk-cart-count {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 24px !important;
    height: 24px !important;
    padding: 0 6px !important;
    background: var(--sc-dark) !important;
    color: #ffffff !important;
    border-radius: 50px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
}

.silk-cart-wrap .silk-cart-divider {
    height: 1px !important;
    background: var(--sc-border) !important;
    margin: 0 0 18px !important;
    border: 0 !important;
}

/* Free-shipping progress bar — sits above the cart items.
   Shows "Add X more to get free shipping" with a fill bar that
   grows as the cart subtotal increases. Disappears entirely
   when WC has no free-shipping rule configured. */
.silk-cart-wrap .silk-shipping-progress {
    background: var(--sc-soft) !important;
    border-radius: 10px !important;
    padding: 12px 16px !important;
    margin: 0 0 18px !important;
    border: 1px solid var(--sc-border) !important;
    box-sizing: border-box !important;
}

.silk-cart-wrap .silk-shipping-progress.is-reached {
    background: rgba(107, 26, 26, 0.08) !important;
    border-color: rgba(107, 26, 26, 0.30) !important;
}

.silk-cart-wrap .silk-shipping-text {
    font-size: 15px !important;
    color: var(--sc-dark) !important;
    margin: 0 0 8px !important;
    text-align: center !important;
    line-height: 1.4 !important;
    padding: 0 !important;
    font-family: var(--sc-sans) !important;
}

.silk-cart-wrap .silk-shipping-text strong {
    font-weight: 700 !important;
    color: var(--sc-brand) !important;
}

.silk-cart-wrap .silk-shipping-progress.is-reached .silk-shipping-text strong {
    color: var(--sc-brand) !important;
}

.silk-cart-wrap .silk-shipping-bar {
    height: 6px !important;
    background: rgba(107, 26, 26, 0.12) !important;
    border-radius: 3px !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}

.silk-cart-wrap .silk-shipping-bar-fill {
    height: 100% !important;
    background: var(--sc-brand) !important;
    border-radius: 3px !important;
    transition: width 0.4s ease !important;
}

.silk-cart-wrap .silk-shipping-progress.is-reached .silk-shipping-bar-fill {
    background: var(--sc-brand) !important;
}

/* ── Cart items ────────────────────────────────────────────── */
.silk-cart-wrap .silk-cart-items { margin-bottom: 4px !important; }

.silk-cart-wrap .silk-cart-item {
    display: flex !important;
    gap: 14px !important;
    margin: 0 0 18px !important;
    padding: 0 0 18px !important;
    border-bottom: 1px solid var(--sc-border) !important;
    transition: opacity 0.2s ease !important;
    align-items: flex-start !important;
}

.silk-cart-wrap .silk-cart-item:last-child {
    border-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.silk-cart-wrap .silk-cart-item.silk-loading {
    opacity: 0.45 !important;
    pointer-events: none !important;
}

.silk-cart-wrap .silk-item-img-wrap {
    flex-shrink: 0 !important;
    width: 100px !important;
    height: 100px !important;
    border-radius: 6px !important;
    overflow: hidden !important;
    border: 1px solid var(--sc-border) !important;
    background: #f0ebe7 !important;
    padding: 0 !important;
    margin: 0 !important;
    display: block !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: opacity 0.2s ease !important;
}

.silk-cart-wrap a.silk-item-img-wrap:hover { opacity: 0.85 !important; }

.silk-cart-wrap .silk-item-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

.silk-cart-wrap .silk-item-details {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.silk-cart-wrap .silk-item-name {
    font-family: var(--sc-serif) !important;
    font-size: 23px !important;
    font-weight: 600 !important;
    letter-spacing: 0.04em !important;
    color: var(--sc-brand) !important;
    line-height: 1.3 !important;
    text-transform: uppercase !important;
    margin: 0 !important;
    padding: 0 !important;
    text-decoration: none !important;
    display: block !important;
    cursor: pointer !important;
    transition: color 0.2s ease !important;
}

.silk-cart-wrap a.silk-item-name:hover { color: var(--sc-deep) !important; }

/* Default price — only used when there's no discount. The
   discounted-price rules in .silk-item-prices override these
   for the "now" amount and the "was" amount. */
.silk-cart-wrap .silk-item-price {
    font-size: 17px !important;
    font-weight: 500 !important;
    color: var(--sc-dark) !important;
    margin: 0 !important;
    padding: 0 !important;
}

.silk-cart-wrap .silk-item-price .woocommerce-Price-amount,
.silk-cart-wrap .silk-item-price bdi {
    color: var(--sc-dark) !important;
    font-weight: 500 !important;
    text-decoration: none !important;
}

/* "Now" price — brand red, larger, bold. */
.silk-cart-wrap .silk-item-prices .silk-item-price,
.silk-cart-wrap .silk-item-prices .silk-item-price .woocommerce-Price-amount,
.silk-cart-wrap .silk-item-prices .silk-item-price bdi {
    color: var(--sc-brand) !important;
    font-weight: 700 !important;
    font-size: 20px !important;
    text-decoration: none !important;
}

/* Strikethrough "was" amount — BLACK with line-through, slightly
   smaller than the now price. The strikethrough is enforced on
   every nested span because WC wraps the value inside
   .woocommerce-Price-amount > bdi, so the rule has to apply at
   each level to render reliably. */
.silk-cart-wrap .silk-item-prices .silk-item-price-was,
.silk-cart-wrap .silk-item-prices .silk-item-price-was .woocommerce-Price-amount,
.silk-cart-wrap .silk-item-prices .silk-item-price-was bdi,
.silk-cart-wrap .silk-item-prices .silk-item-price-was .woocommerce-Price-currencySymbol {
    color: #1a1a1a !important;
    text-decoration: line-through !important;
    text-decoration-color: #1a1a1a !important;
    font-weight: 500 !important;
    font-size: 17px !important;
}

/* ── Meta (color + size) ───────────────────────────────────── */
.silk-cart-wrap .silk-item-meta {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
    margin: 2px 0 0 !important;
    padding: 0 !important;
}

.silk-cart-wrap .silk-meta-label {
    font-size: 16px !important;
    color: var(--sc-muted) !important;
    font-weight: 400 !important;
}

/* Order is now Colour → Size. Push the size label slightly
   further from the colour swatch for visual separation. */
.silk-cart-wrap .silk-meta-color-label { margin-left: 0 !important; }
.silk-cart-wrap .silk-meta-size-label,
.silk-cart-wrap .silk-item-meta .silk-meta-label + .silk-color-swatch + .silk-meta-label { margin-left: 12px !important; }

.silk-cart-wrap .silk-color-swatch {
    display: inline-block !important;
    width: 18px !important;
    height: 18px !important;
    border-radius: 50% !important;
    border: 1.5px solid rgba(0, 0, 0, 0.15) !important;
    flex-shrink: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

.silk-cart-wrap .silk-size-text {
    font-size: 17px !important;
    font-weight: 500 !important;
    color: var(--sc-dark) !important;
}

/* ── Quantity control — Figma pill with inner dark circle ─── */
.silk-cart-wrap .silk-qty-wrap {
    display: inline-flex !important;
    align-items: center !important;
    gap: 2px !important;
    border: 1.5px solid var(--sc-dark) !important;
    border-radius: 50px !important;
    overflow: hidden !important;
    margin: 6px 0 0 !important;
    padding: 0 !important;
    width: fit-content !important;
    background: #ffffff !important;
}

/* Pin the visual order: minus → input → plus. The site's existing
   qty CSS sets `order: 2` on number inputs which was leaking onto
   the drawer's input and pushing it to the left of the buttons. */
.silk-cart-wrap .silk-qty-wrap .silk-qty-minus,
.silk-cart-wrap .silk-qty-wrap .silk-qty-btn.silk-qty-minus { order: 1 !important; }
.silk-cart-wrap .silk-qty-wrap .silk-qty-input,
.silk-cart-wrap .silk-qty-wrap input.silk-qty-input { order: 2 !important; }
.silk-cart-wrap .silk-qty-wrap .silk-qty-plus,
.silk-cart-wrap .silk-qty-wrap .silk-qty-btn.silk-qty-plus { order: 3 !important; }

.silk-cart-wrap .silk-qty-btn {
    appearance: none !important;
    -webkit-appearance: none !important;
    background: transparent !important;
    border: 0 !important;
    width: 30px !important;
    height: 30px !important;
    cursor: pointer !important;
    font-size: 18px !important;
    line-height: 1 !important;
    color: var(--sc-dark) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
    transition: background 0.2s ease !important;
    box-shadow: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
}

.silk-cart-wrap .silk-qty-btn:hover  { background: rgba(42, 26, 20, 0.07) !important; }
.silk-cart-wrap .silk-qty-btn:active { background: rgba(42, 26, 20, 0.14) !important; }

.silk-cart-wrap .silk-qty-num,
.silk-cart-wrap .silk-qty-input {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    background: var(--sc-dark) !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    border-radius: 50% !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: center !important;
    font-family: var(--sc-sans) !important;
}

/* Editable qty input — kill the native number spinners so it looks
   like a clean dark circle. Tap to focus, type to change. */
.silk-cart-wrap .silk-qty-input {
    border: 0 !important;
    outline: none !important;
    -moz-appearance: textfield !important;
    appearance: textfield !important;
    cursor: text !important;
    box-shadow: none !important;
    line-height: 1 !important;
}

.silk-cart-wrap .silk-qty-input::-webkit-outer-spin-button,
.silk-cart-wrap .silk-qty-input::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
}

.silk-cart-wrap .silk-qty-input:focus {
    outline: 2px solid var(--sc-brand) !important;
    outline-offset: 1px !important;
}

/* ══════════════════════════════════════════════════════════════
   RELATED / UPSELLS — "Complete Your Sleep Set"
══════════════════════════════════════════════════════════════ */
.silk-cart-wrap .silk-related-wrap {
    margin: 16px 0 0 !important;
    padding: 0 !important;
}

.silk-cart-wrap .silk-related-title {
    font-size: 21px !important;
    font-weight: 700 !important;
    color: var(--sc-dark) !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
    letter-spacing: 0 !important;
    background: transparent !important;
    border: 0 !important;
    text-transform: none !important;
}

.silk-cart-wrap .silk-related-divider { display: none !important; }

.silk-cart-wrap .silk-related-item {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 0 0 10px !important;
    padding: 0 !important;
}

.silk-cart-wrap .silk-related-info {
    flex: 1 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.silk-cart-wrap .silk-related-select-btn {
    align-self: flex-start;
    margin: 2px 0 0 !important;
    padding: 0 !important;
    background: transparent !important;
    color: var(--sc-brand) !important;
    border: 0 !important;
    border-radius: 0 !important;
    font: 500 13px/1.2 inherit !important;
    letter-spacing: 0 !important;
    cursor: pointer !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
    transition: color .15s ease !important;
}
.silk-cart-wrap .silk-related-select-btn:hover {
    color: var(--sc-brand-dark, #4a1414) !important;
}

.silk-cart-wrap .silk-related-img-wrap {
    width: 52px !important;
    height: 52px !important;
    border-radius: 6px !important;
    overflow: hidden !important;
    border: 1px solid var(--sc-border) !important;
    flex-shrink: 0 !important;
    background: #f0ebe7 !important;
    padding: 0 !important;
    margin: 0 !important;
}

.silk-cart-wrap .silk-related-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

.silk-cart-wrap .silk-related-name {
    font-size: 15px !important;
    font-weight: 500 !important;
    color: var(--sc-dark) !important;
    line-height: 1.3 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-transform: none !important;
    text-decoration: none !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}
.silk-cart-wrap .silk-related-name:hover {
    color: var(--sc-brand) !important;
}

.silk-cart-wrap .silk-related-price {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 6px !important;
    white-space: nowrap !important;
    margin: 0 !important;
    padding: 0 !important;
}

.silk-cart-wrap .silk-price-was {
    font-size: 14px !important;
    color: var(--sc-muted) !important;
    text-decoration: line-through !important;
}

.silk-cart-wrap .silk-price-now {
    font-size: 15px !important;
    font-weight: 500 !important;
    color: var(--sc-dark) !important;
}

.silk-cart-wrap .silk-feedback {
    font-size: 14px !important;
    color: var(--sc-terra) !important;
    min-height: 0 !important;
    font-weight: 500 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ══════════════════════════════════════════════════════════════
   COUPON — Figma pill input + pill Apply button
══════════════════════════════════════════════════════════════ */
.silk-cart-wrap .silk-coupon-wrap {
    margin: 22px 0 0 !important;
    padding: 18px 0 0 !important;
    border-top: 1px solid var(--sc-border) !important;
}

.silk-cart-wrap .silk-coupon-heading {
    font-size: 18px !important;
    font-weight: 500 !important;
    color: var(--sc-dark) !important;
    margin: 0 0 10px !important;
    padding: 0 !important;
    letter-spacing: 0.01em !important;
    background: transparent !important;
    text-transform: none !important;
}

.silk-cart-wrap .silk-coupon-form {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.silk-cart-wrap .silk-coupon-row {
    display: flex !important;
    gap: 8px !important;
    align-items: stretch !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
}

.silk-cart-wrap .silk-coupon-input {
    flex: 1 !important;
    height: 44px !important;
    padding: 0 18px !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 50px !important;
    font-size: 15px !important;
    color: var(--sc-dark) !important;
    background: var(--sc-soft) !important;
    outline: none !important;
    box-shadow: none !important;
    min-height: 0 !important;
    line-height: normal !important;
}

.silk-cart-wrap .silk-coupon-input::placeholder { color: var(--sc-muted) !important; }

.silk-cart-wrap .silk-coupon-btn {
    height: 44px !important;
    padding: 0 26px !important;
    margin: 0 !important;
    background: var(--sc-brand) !important;
    color: #ffffff !important;
    border: 0 !important;
    border-radius: 50px !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    letter-spacing: 0.04em !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    transition: background 0.2s ease, opacity 0.2s ease !important;
    flex-shrink: 0 !important;
    box-shadow: none !important;
    text-transform: none !important;
    line-height: 1 !important;
    min-height: 0 !important;
}

.silk-cart-wrap .silk-coupon-btn:hover:not(:disabled) { background: var(--sc-deep) !important; }
.silk-cart-wrap .silk-coupon-btn:disabled             { opacity: 0.55 !important; cursor: not-allowed !important; }

.silk-cart-wrap .silk-coupon-spinner {
    display: none !important;
    width: 12px !important;
    height: 12px !important;
    border: 2px solid rgba(255, 255, 255, 0.3) !important;
    border-top-color: #ffffff !important;
    border-radius: 50% !important;
    animation: silkSpin 0.7s linear infinite !important;
    flex-shrink: 0 !important;
}

.silk-cart-wrap .silk-coupon-btn.silk-coupon-loading .silk-coupon-spinner { display: inline-block !important; }

@keyframes silkSpin { to { transform: rotate(360deg); } }

.silk-cart-wrap .silk-coupon-msg {
    font-size: 14px !important;
    min-height: 0 !important;
    margin: 7px 6px 0 !important;
    padding: 0 !important;
    line-height: 1.4 !important;
}

.silk-cart-wrap .silk-coupon-msg:empty { margin-top: 0 !important; }

.silk-cart-wrap .silk-coupon-msg.silk-msg-success { color: #2e7d32 !important; }
.silk-cart-wrap .silk-coupon-msg.silk-msg-error   { color: #c62828 !important; }
.silk-cart-wrap .silk-coupon-msg.silk-msg-info    { color: var(--sc-muted) !important; }

.silk-cart-wrap .silk-coupon-tags {
    list-style: none !important;
    margin: 10px 0 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
}

.silk-cart-wrap .silk-coupon-tag {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    background: var(--sc-soft) !important;
    border: 1px solid var(--sc-border) !important;
    border-radius: 50px !important;
    padding: 5px 10px !important;
    margin: 0 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--sc-dark) !important;
    letter-spacing: 0.02em !important;
    transition: opacity 0.2s ease !important;
}

.silk-cart-wrap .silk-coupon-tag-icon { font-size: 13px !important; }

.silk-cart-wrap .silk-coupon-remove {
    background: transparent !important;
    border: 0 !important;
    cursor: pointer !important;
    color: var(--sc-muted) !important;
    font-size: 17px !important;
    line-height: 1 !important;
    padding: 0 0 0 3px !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    transition: color 0.2s ease !important;
    box-shadow: none !important;
}

.silk-cart-wrap .silk-coupon-remove:hover { color: #c62828 !important; }

/* ══════════════════════════════════════════════════════════════
   TESTIMONIAL
══════════════════════════════════════════════════════════════ */
.silk-cart-wrap .silk-testimonial {
    margin: 22px 0 0 !important;
    padding: 18px 0 0 !important;
    border-top: 1px solid var(--sc-border) !important;
}

.silk-cart-wrap .silk-testimonial-title {
    font-family: var(--sc-serif) !important;
    font-size: 21px !important;
    font-weight: 700 !important;
    color: var(--sc-brand) !important;
    margin: 0 0 6px !important;
    padding: 0 !important;
    letter-spacing: 0.01em !important;
    background: transparent !important;
    text-transform: none !important;
}

.silk-cart-wrap .silk-testimonial-text {
    font-size: 15px !important;
    color: var(--sc-muted) !important;
    line-height: 1.5 !important;
    margin: 0 0 8px !important;
    padding: 0 !important;
}

.silk-cart-wrap .silk-testimonial-rating {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--sc-dark) !important;
}

.silk-cart-wrap .silk-rating-star {
    color: #e3b341 !important;
    font-size: 15px !important;
    line-height: 1 !important;
}

/* ══════════════════════════════════════════════════════════════
   TRUST BOXES
══════════════════════════════════════════════════════════════ */
.silk-cart-wrap .silk-trust-boxes {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 10px !important;
    margin: 18px 0 0 !important;
    padding: 18px 0 !important;
    border-top: 1px solid var(--sc-border) !important;
    border-bottom: 1px solid var(--sc-border) !important;
}

.silk-cart-wrap .silk-trust-box {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 8px !important;
    color: var(--sc-dark) !important;
    margin: 0 !important;
    padding: 0 !important;
}

.silk-cart-wrap .silk-trust-icon {
    width: 36px !important;
    height: 36px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: var(--sc-brand) !important;
    margin: 0 0 4px !important;
    padding: 0 !important;
}

.silk-cart-wrap .silk-trust-icon svg {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    color: var(--sc-brand) !important;
}

.silk-cart-wrap .silk-trust-label {
    font-size: 15px !important;
    font-weight: 500 !important;
    color: var(--sc-dark) !important;
    letter-spacing: 0.02em !important;
    line-height: 1.25 !important;
}

/* ══════════════════════════════════════════════════════════════
   FOOTER — subtotal + CTAs
══════════════════════════════════════════════════════════════ */
/* Action bar — sibling of drawer-body (not inside cart-wrap),
   so it's a real flex item that always shows at the bottom of
   the drawer-panel regardless of scroll position or content
   height. Uses !important to defeat theme/Elementor overrides. */
.silk-drawer .silk-action-bar {
    flex: 0 0 auto !important;
    padding: 16px 22px 22px !important;
    margin: 0 !important;
    border-top: 1px solid var(--sc-border) !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
    z-index: 2 !important;
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.04) !important;
    font-family: "Didot LP W01", "Playfair Display", Didot, "Bodoni MT", "Times New Roman", Georgia, serif !important;
}

.silk-drawer .silk-action-bar .silk-cart-total {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    font-size: 17px !important;
    font-weight: 500 !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
    color: #2a1a14 !important;
}

.silk-drawer .silk-action-bar .silk-total-price {
    font-size: 19px !important;
    font-weight: 700 !important;
    color: #2a1a14 !important;
}

.silk-drawer .silk-action-bar .silk-total-price .woocommerce-Price-amount,
.silk-drawer .silk-action-bar .silk-total-price bdi {
    color: #2a1a14 !important;
    font-weight: 700 !important;
}

.silk-drawer .silk-action-bar .silk-view-cart-btn,
.silk-drawer .silk-action-bar .silk-checkout-btn {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    text-align: center !important;
    padding: 14px 20px !important;
    margin: 0 !important;
    /* No rounded corners — squared edges. */
    border-radius: 0 !important;
    text-decoration: none !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    letter-spacing: 0.06em !important;
    transition: color 0.45s ease !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
    /* 2 px brand-burgundy border, always visible — defines the
       button shape during the fill animation too. */
    border: 2px solid #6b1a1a !important;
    color: #ffffff !important;
    line-height: 1 !important;
    text-transform: none !important;
    box-shadow: none !important;
    font-family: inherit !important;
    overflow: hidden !important;
    isolation: isolate !important;
    /* Normal state: dark maroon background, white text. */
    background: #4a1414 !important;
}

/* Sliding-fill hover.
 *   At rest    → solid maroon background, white text.
 *   On hover   → white panel grows from the LEFT, text turns
 *                burgundy (the inverse of the rest state).
 *   On unhover → transform-origin flips to RIGHT and the white
 *                panel shrinks back, visually exiting to the
 *                right (same direction as the entry, not a
 *                bounce-back).
 *   The 2 px burgundy border stays visible at every step so
 *   the button shape never collapses during the animation. */
.silk-drawer .silk-action-bar .silk-view-cart-btn::before,
.silk-drawer .silk-action-bar .silk-checkout-btn::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background: #ffffff !important;
    transform: scaleX(0) !important;
    transform-origin: right center !important;
    transition: transform 0.45s cubic-bezier(0.65, 0, 0.35, 1) !important;
    z-index: -1 !important;
    border-radius: inherit !important;
}
.silk-drawer .silk-action-bar .silk-view-cart-btn:hover::before,
.silk-drawer .silk-action-bar .silk-checkout-btn:hover::before {
    transform: scaleX(1) !important;
    transform-origin: left center !important;
}

.silk-drawer .silk-action-bar .silk-view-cart-btn {
    margin-bottom: 10px !important;
}

.silk-drawer .silk-action-bar .silk-view-cart-btn:hover,
.silk-drawer .silk-action-bar .silk-checkout-btn:hover {
    /* Hover text colour = brand burgundy (inverse of the rest
       state). Background colour comes from the ::before fill. */
    color: #6b1a1a !important;
}

.silk-cart-wrap .silk-cart-total {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    font-size: 17px !important;
    font-weight: 500 !important;
    margin: 0 0 16px !important;
    padding: 0 !important;
    color: var(--sc-dark) !important;
}

.silk-cart-wrap .silk-total-price {
    font-size: 19px !important;
    font-weight: 700 !important;
    color: var(--sc-dark) !important;
}

.silk-cart-wrap .silk-total-price .woocommerce-Price-amount,
.silk-cart-wrap .silk-total-price bdi {
    color: var(--sc-dark) !important;
    font-weight: 700 !important;
}

.silk-cart-wrap .silk-checkout-btn,
.silk-cart-wrap .silk-view-cart-btn {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    padding: 15px 20px !important;
    margin: 0 !important;
    border-radius: 50px !important;
    text-decoration: none !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    letter-spacing: 0.06em !important;
    transition: background 0.2s ease, transform 0.2s ease !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
    border: 0 !important;
    color: #ffffff !important;
    line-height: 1 !important;
    text-transform: none !important;
    box-shadow: none !important;
}

.silk-cart-wrap .silk-view-cart-btn {
    background: var(--sc-brand) !important;
    margin-bottom: 10px !important;
}

.silk-cart-wrap .silk-view-cart-btn:hover {
    background: var(--sc-deep) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
}

.silk-cart-wrap .silk-checkout-btn {
    background: var(--sc-deep) !important;
}

.silk-cart-wrap .silk-checkout-btn:hover {
    background: var(--sc-brand) !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
}

/* ── Empty cart ───────────────────────────────────────────── */
.silk-cart-wrap .silk-empty-cart {
    color: var(--sc-muted) !important;
    text-align: center !important;
    padding: 48px 0 !important;
    margin: 0 !important;
    font-size: 17px !important;
}

/* ══════════════════════════════════════════════════════════════
   CART ICONS  (header + floating) — unchanged styling
══════════════════════════════════════════════════════════════ */

.sci-badge {
    position: absolute;
    min-width: 19px;
    height: 19px;
    padding: 0 4px;
    background: #6b1a1a;
    color: #fff;
    border-radius: 50px;
    font-size: 12px;
    font-weight: 700;
    font-family: "Didot LP W01", "Playfair Display", Didot, "Bodoni MT", "Times New Roman", Georgia, serif;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    border: 2px solid #fff;
    pointer-events: none;
    z-index: 1;
    transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.sci-badge.sci-badge-pop { transform: scale(1.5); }

/* Header icon button */
.sci-hc-wrap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.sci-hc-btn {
    appearance: none;
    -webkit-appearance: none;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1.5px solid #6b1a1a;
    background: transparent;
    color: #6b1a1a !important;
    text-decoration: none !important;
    position: relative;
    cursor: pointer;
    box-sizing: border-box;
    flex-shrink: 0;
    padding: 0;
    font: inherit;
    transition: border-color 0.2s, background 0.2s, transform 0.15s;
}

.sci-hc-btn:hover {
    border-color: #4a1414;
    background: rgba(107, 26, 26, 0.08);
    transform: scale(1.06);
}

.sci-hc-btn:active { transform: scale(0.97); }

.sci-hc-badge { top: -5px; right: -5px; }

/* Floating icon button */
.sci-fb-wrap {
    position: fixed;
    bottom: 30px;
    right: 26px;
    z-index: 99998;
}

.sci-fb-btn {
    appearance: none;
    -webkit-appearance: none;
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 62px;
    height: 62px;
    border-radius: 50%;
    background: #1a0f0b;
    color: #fff !important;
    text-decoration: none !important;
    position: relative;
    cursor: pointer;
    box-shadow: 0 4px 22px rgba(0, 0, 0, 0.38);
    border: 0;
    padding: 0;
    font: inherit;
    transition: background 0.2s, transform 0.2s, box-shadow 0.2s;
}

.sci-fb-btn:hover {
    background: #3a1f18;
    transform: translateY(-3px);
    box-shadow: 0 10px 32px rgba(0, 0, 0, 0.42);
}

.sci-fb-btn:active { transform: translateY(-1px); }

.sci-fb-badge {
    top: -4px;
    right: -4px;
    min-width: 22px;
    height: 22px;
    font-size: 13px;
    border: 2.5px solid #fff;
}