/* ════════════════════════════════════════════════════════════════════════
   PORTRAITGIFT TRUST PALETTE — remapped to the house brand 2026-07-17
   Loaded LAST so it owns the cascade. One coherent system replaces the
   pink/red/IG-blue/purple/brown patchwork:

     Ink        #1d1b18 headings · #39352f body · #716b62 secondary
     Surfaces   #ffffff cards · #f3eee5 app bg · #e6ddce hairlines
     Action     oxblood #71313b (the ONLY action/brand color)
     Warmth     antique gold #aa8755 / dark gold #7d5f28 — prices, urgency
     Hearts     #71313b — likes & notification badges only
   ════════════════════════════════════════════════════════════════════════ */

/* ── 1 · Root variable remap (kills IG-blue + hot-pink at the source) ──── */
:root {
    --primary-color: #71313b !important;
    --secondary-color: #58242d !important;
    --ig-primary: #71313b !important;
    --ig-primary-hover: #58242d !important;
    --ig-text-link: #58242d !important;
    --ig-border: #e6ddce !important;
    --ig-background: #f3eee5 !important;
    --ig-text-primary: #39352f !important;
    --ig-text-secondary: #716b62 !important;
    /* Story-ring gradient on the card avatar → quiet emerald sweep */
    --ig-gradient-start: #a96773 !important;
    --ig-gradient-mid: #71313b !important;
    --ig-gradient-end: #8d4250 !important;
}

/* ── 2 · App chrome ────────────────────────────────────────────────────── */
body { background: #f3eee5 !important; }

/* Top sale strip: red alarm → warm amber (urgency without anxiety) */
#saleMidnightBanner {
    background: linear-gradient(135deg, #faf5ea, #f5ecd7) !important;
    color: #7d5f28 !important;
    border: 1px solid #e9d9b4 !important;
    box-shadow: 0 1px 3px rgba(180, 83, 9, 0.08) !important;
}

/* Sticky header: calm white bar in BOTH states; the cart button carries
   the brand color instead of the whole bar screaming pink */
.header-cart-bar.has-items {
    background: rgba(255, 255, 255, 0.95) !important;
    border-bottom: 1px solid #e6ddce !important;
    box-shadow: 0 1px 10px rgba(15, 23, 42, 0.06) !important;
}
.header-cart-bar.has-items .header-cart-btn {
    background: linear-gradient(135deg, #8d4250, #71313b) !important;
    color: #fff !important;
    border: none !important;
    box-shadow: 0 3px 12px rgba(5, 150, 105, 0.32) !important;
}
.header-cart-bar.has-items .header-cart-btn:hover { background: linear-gradient(135deg, #71313b, #58242d) !important; }
.header-cart-bar.has-items .header-cart-count { background: #fff !important; color: #58242d !important; }
.header-cart-btn { background: #1d1b18 !important; border-color: #1d1b18 !important; }

/* Share button: pink circle → quiet ghost control. The old mobile style
   hardcoded a WHITE icon (css-4 `.share-gallery-btn i`) — force the icon
   and label to ink too, or it vanishes on the white button. */
.share-gallery-btn,
.header-cart-bar.has-items .share-gallery-btn {
    background: #fff !important;
    color: #57514a !important;
    border: 1px solid #d7cdbf !important;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.08) !important;
}
.share-gallery-btn i,
.share-gallery-btn span,
.header-cart-bar.has-items .share-gallery-btn i,
.header-cart-bar.has-items .share-gallery-btn span {
    color: #57514a !important;
}
.share-gallery-btn:hover { background: #f3eee5 !important; color: #1d1b18 !important; }
.share-gallery-btn:hover i { color: #1d1b18 !important; }

/* ── 3 · Urgency countdown card: muddy brown → deep slate + amber digits ─ */
.urgency-timer-hero {
    background: linear-gradient(135deg, #1d1b18 0%, #2a2721 100%) !important;
}
.timer-label, #defaultUrgencyBanner .timer-label { color: #e6ddce !important; }
.timer-digits, #defaultUrgencyBanner .timer-digits,
#defaultUrgencyBanner #urgencyBannerCountdown { color: #d9c7a7 !important; }
.timer-sublabel, #defaultUrgencyBanner .timer-sublabel { color: #a39a8d !important; }
.urgency-info { background: #faf5ea !important; border-top: 1px solid #e9d9b4 !important; }
.urgency-info .info-icon, .urgency-info .info-text { color: #63491c !important; }
.urgency-info .info-text strong { color: #7d5f28 !important; }

/* ── 4 · Grid helper cards ─────────────────────────────────────────────── */
/* Generate-new: dashed pink → neutral slate with an emerald spark */
.artwork-item.generate-new-item {
    border: 2px dashed #d7cdbf !important;
    background: linear-gradient(135deg, #ffffff 0%, #f3eee5 100%) !important;
}
.artwork-item.generate-new-item:hover { border-color: #8d4250 !important; background: #f1e4e5 !important; }
.generate-new-icon {
    background: linear-gradient(135deg, #8d4250, #71313b) !important;
    color: #fff !important;
    box-shadow: 0 4px 14px rgba(5, 150, 105, 0.3) !important;
}
.generate-new-title { color: #1d1b18 !important; }
.generate-new-subtitle { color: #716b62 !important; }

/* Share-gallery card: purple gradient → clean white card, emerald icon.
   Platform buttons keep their native brand colors (recognition = trust). */
.share-gallery-card {
    background: #ffffff !important;
    border: 1px solid #e6ddce !important;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.05) !important;
}
.share-gallery-card .share-card-header i {
    background: linear-gradient(135deg, #8d4250, #58242d) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
}
.share-gallery-card .share-card-header h3 { color: #1d1b18 !important; }
.share-gallery-card .share-card-header p { color: #716b62 !important; }

/* Share popup (modal twin of the card) */
.share-popup-header i { color: #71313b !important; }
.share-popup-header h3 { color: #1d1b18 !important; }
.share-link-box button {
    background: #1d1b18 !important;
    color: #fff !important;
}

/* Selected card ring: unify the greens onto the brand emerald */
.artwork-item.selected {
    border-color: #8d4250 !important;
    box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.16), 0 8px 24px rgba(15, 23, 42, 0.1) !important;
}

/* ── 5 · Floating elements ─────────────────────────────────────────────── */
.floating-cart {
    background: linear-gradient(135deg, #8d4250, #71313b) !important;
    box-shadow: 0 5px 16px rgba(5, 150, 105, 0.38) !important;
}
.floating-cart:hover { background: linear-gradient(135deg, #71313b, #58242d) !important; }

/* ── 6 · Cart drawer accents ───────────────────────────────────────────── */
/* Flash-sale promo widget: red alarm → premium amber voucher */
.promo-coupon-widget {
    background: linear-gradient(135deg, #faf5ea 0%, #f5ecd7 100%) !important;
    border: 2px dashed #aa8755 !important;
}
.promo-coupon-flash-badge {
    background: linear-gradient(90deg, #aa8755, #c2a06b) !important;
    box-shadow: 0 2px 6px rgba(217, 119, 6, 0.35) !important;
}
.promo-coupon-headline { color: #63491c !important; }
.promo-coupon-headline-pct { color: #7d5f28 !important; }
.promo-coupon-sub { color: #7d5f28 !important; }
.promo-coupon-code {
    border: 1px dashed #aa8755 !important;
    color: #63491c !important;
}
.promo-coupon-copy-btn {
    background: #fff !important;
    color: #7d5f28 !important;
    border: 1px solid #dfc794 !important;
}
.promo-coupon-apply-btn {
    background: linear-gradient(135deg, #8d4250, #71313b) !important;
    color: #fff !important;
    box-shadow: 0 4px 12px rgba(5, 150, 105, 0.3) !important;
}
.promo-coupon-apply-btn:hover { background: linear-gradient(135deg, #71313b, #58242d) !important; }
.promo-coupon-deadline { color: #8a6a24 !important; }
.promo-coupon-countdown { color: #7d5f28 !important; }

/* Cart upsell price + misc stray pinks → emerald */
.video-upsell-price { color: #71313b !important; }

/* ── 7 · Stray hardcoded blues (FB-blue buttons outside platform CTAs) ─── */
.artwork-item .ig-selection-badge { background: #71313b !important; }

/* ── 8 · Typography ────────────────────────────────────────────────────── */
/* Inter for all UI — sharper than the Roboto/system mix, tabular numerals
   for prices & timers. Cormorant Garamond gives the big headings a gallery
   voice (it was already the design intent in the shipping-trust modal). */
body, button, input, select, textarea,
.ig-order-btn, .cart-checkout-cta, .header-cart-btn {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}
h2, .cart-summary-title {
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    color: #1d1b18 !important;
}
h2 { font-size: 1.85rem !important; }
.cart-summary-title { font-size: 1.35rem !important; }
/* Prices, totals and countdowns: lining tabular figures, no jitter */
.vt-price, .apt-price, .mobile-total-value, .header-cart-total,
.timer-digits, .promo-coupon-countdown, .cart-savings-row,
.product-token-price, .pill-price {
    font-variant-numeric: lining-nums tabular-nums;
    font-feature-settings: "tnum" 1, "lnum" 1;
}
/* Quieter, better-set body copy under headings */
.timer-label { font-weight: 600 !important; letter-spacing: 0.01em !important; }

/* ── 9 · Green diet ────────────────────────────────────────────────────── */
/* Emerald = buy actions & live selection ONLY. Informational surfaces that
   were green-washed go neutral; the signal moves into small accents. */

/* No-risk strip: green slab → quiet white card, slate text */
.no-risk-strip {
    background: #ffffff !important;
    border: 1px solid #e6ddce !important;
    box-shadow: 0 1px 5px rgba(15, 23, 42, 0.05) !important;
}
.no-risk-strip .nr-item { color: #57514a !important; }
.no-risk-strip .nr-item:not(:last-child)::after { background: #e6ddce !important; }

/* In-grid tier banner: mint slab → white card; only the progress fill and
   achieved tiers stay emerald */
.in-grid-tier-banner,
.in-grid-tier-banner.igb-maxed {
    background: #ffffff !important;
    border: 1px solid #e6ddce !important;
    box-shadow: 0 1px 6px rgba(15, 23, 42, 0.05) !important;
}
.in-grid-tier-banner .igb-title { color: #1d1b18 !important; }
.in-grid-tier-banner .igb-badge {
    color: #716b62 !important;
    background: #f3eee5 !important;
    border: 1px solid #e6ddce !important;
}
.in-grid-tier-banner .igb-track { background: #e6ddce !important; }
.in-grid-tier-banner .igb-node { border-color: #d7cdbf !important; }
.in-grid-tier-banner .igb-node--on { border-color: #71313b !important; background: #71313b !important; }
.in-grid-tier-banner .igb-tier {
    color: #716b62 !important;
    background: #f3eee5 !important;
    border: 1px solid transparent !important;
}
.in-grid-tier-banner .igb-tier--on {
    color: #58242d !important;
    background: #fff !important;
    border-color: #d8bfc3 !important;
    box-shadow: none !important;
}
.in-grid-tier-banner .igb-msg { color: #45403a !important; }

/* Cart savings rows: two loud green gradient bars → calm ledger lines,
   the saved AMOUNT carries the green */
#cartFomoLineTop.cart-savings-fomo,
#cartBundleLineTop.cart-savings-fomo,
#cartFomoLineInline.cart-savings-fomo {
    background: #f3eee5 !important;
    border: 1px solid #e6ddce !important;
    color: #45403a !important;
    font-weight: 600 !important;
}
#cartFomoLineTop.cart-savings-fomo span:last-child,
#cartBundleLineTop.cart-savings-fomo span:last-child,
#cartFomoLineInline.cart-savings-fomo span:last-child {
    color: #58242d !important;
    font-weight: 800 !important;
}
#cartFomoDeadlineTop, #cartFomoDeadlineInline { color: #a39a8d !important; }

/* Bundle progress strip in cart: green slab → sleek neutral card with a
   thin progress accent. #progressText used to render INSIDE the 6px bar
   and clipped into a smudge — gone. */
.bundle-savings-strip {
    background: #ffffff !important;
    border: 1px solid #e6ddce !important;
    color: #45403a !important;
    padding: 9px 12px !important;
    border-radius: 12px !important;
}
#discountTierTitle { font-size: 13px !important; color: #1d1b18 !important; }
#milestoneMessage { color: #716b62 !important; }
.bundle-progress {
    background: #e6ddce !important;
    height: 4px !important;
    margin-top: 8px !important;
    border-radius: 999px !important;
}
.bundle-progress-fill {
    background: linear-gradient(90deg, #a96773, #71313b) !important;
    border-radius: 999px !important;
}
#progressText { display: none !important; }

/* Catch-all: ANY savings bar still wearing a green/blue gradient goes
   neutral — the saved amount alone carries the green */
.cart-savings-row.cart-savings-fomo {
    background: #f3eee5 !important;
    border: 1px solid #e6ddce !important;
    color: #45403a !important;
    font-weight: 600 !important;
}
.cart-savings-row.cart-savings-fomo span:last-child { color: #58242d !important; font-weight: 800 !important; }
.cart-savings-volume { color: #57514a !important; }
.cart-savings-volume span:last-child { color: #58242d !important; font-weight: 700 !important; }

/* Item prices are information, not actions: ink instead of green.
   Green in the cart now = saved amounts + the checkout button, nothing else. */
.cart-item-price-new { color: #1d1b18 !important; }
.video-upsell-price { color: #57514a !important; }

/* Combined-discount stack: one card, three jobs — count the deals, itemize
   them, say when they expire. Rows lose their own card chrome inside it. */
.discount-stack {
    background: #fff !important;
    border: 1px solid #e6ddce !important;
    border-radius: 12px !important;
    margin-bottom: 8px !important;
    overflow: hidden !important;
}
.discount-stack-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 9px 12px;
    font-size: 12.5px;
    color: #1d1b18;
    border-bottom: 1px dashed #e6ddce;
}
.discount-stack-header .dsh-left b { font-weight: 800; }
.discount-stack-header .dsh-right { font-weight: 600; color: #57514a; }
.discount-stack-header .dsh-right b { color: #58242d; font-weight: 800; font-size: 13.5px; }
.discount-stack .cart-savings-row.cart-savings-fomo {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    margin-bottom: 0 !important;
    padding: 8px 12px !important;
}
.discount-stack #cartFomoLineTop { border-bottom: 1px dashed #ece5d8 !important; }
/* The footer carries the deadline once — per-row repeat is noise */
.discount-stack #cartFomoDeadlineTop { display: none !important; }
.discount-stack-fomo {
    padding: 7px 12px 8px;
    font-size: 11px;
    font-weight: 600;
    color: #8a6a24;
    background: #faf5ea;
    border-top: 1px dashed #e9d9b4;
}
/* Inline remove control on the 45% row (proxies promoCouponCancelBtn) */
.dsh-label-wrap { display: inline-flex; align-items: center; gap: 8px; min-width: 0; }
.discount-stack .dsh-remove {
    background: none !important;
    border: none !important;
    padding: 0 !important;
    font-family: inherit;
    font-size: 10.5px;
    font-weight: 500;
    color: #a39a8d;
    text-decoration: underline;
    text-underline-offset: 2px;
    cursor: pointer;
    flex: 0 0 auto;
    -webkit-tap-highlight-color: transparent;
}
.discount-stack .dsh-remove:hover { color: #58242d; }
/* The 45% row hosts the remove control now — the widget's duplicate link
   goes quiet (the proxy clicks it programmatically, hidden still works) */
.promo-coupon-widget.is-applied .promo-coupon-cancel-btn { display: none !important; }

/* Promo widget applied-state: mint card → neutral confirmation, the ✓ keeps
   the green */
.promo-coupon-widget.is-applied {
    background: #ffffff !important;
    border: 1px solid #e6ddce !important;
}
.promo-coupon-widget.is-applied .promo-coupon-headline { color: #1d1b18 !important; }
.promo-coupon-widget.is-applied .promo-coupon-sub { color: #716b62 !important; }

/* Share card spark + links: informational → slate, not brand-green */
.share-gallery-card .share-card-header i {
    background: none !important;
    -webkit-text-fill-color: #57514a !important;
    color: #57514a !important;
}
.share-popup-header i { color: #57514a !important; }
:root { --ig-text-link: #45403a !important; }

/* Card avatar story-ring: emerald sweep → quiet slate hairline */
:root {
    --ig-gradient-start: #e6ddce !important;
    --ig-gradient-mid: #d7cdbf !important;
    --ig-gradient-end: #a39a8d !important;
}