/*
 * ICT Shift — Fluent Cart cart drawer: corner layout + dark scheme.
 * Enqueued site-wide by the account-portal plugin (handle fcpa-cart-drawer),
 * versioned with the plugin, statically edge-cacheable.
 *
 * A) Corner layout (both schemes): the FC cart open button and the Chatwoot
 *    chat bubble both anchor 20px from the bottom-right corner. The FC
 *    button only renders when the cart is not empty, when it sits directly
 *    beneath the chat bubble (chat z-index 2147483000 vs cart 999) and is
 *    hidden by it.
 *    A1. Stack the cart button 16px above the bubble, centered on its axis:
 *        right 24 = 20 + (64-56)/2, bottom 100 = 20 + 64 + 16.
 *    A2a. While the drawer is OPEN (>=1024px): the chat bubble and an
 *        already-open chat panel slide left of the 500px drawer (right:
 *        520px = 500 + 20 gap) so chat and cart are usable at the same time.
 *    A2b. <1024px: the drawer is (nearly) full-width, so the bubble/panel
 *        are hidden while it is open (the chat session persists and they
 *        return to the corner on close).
 *    The "body" prefix makes the rules cascade-order independent: a plain
 *    class selector (0,1,0) loses the tie when this file loads before/after
 *    FC's cart-drawer.css; "body" (0,1,1) beats it either way.
 *    :has() is supported in all current browsers; without it these rules
 *    are inert (old overlap returns, nothing breaks).
 *
 * B) Dark scheme: Fluent Cart exposes its drawer theme as
 *    --fct-cart-drawer-* custom properties (cart-drawer.css :root).
 *    Re-mapping them under html.astra-color-scheme-dark (the class the
 *    Astra color switch keeps in step, see exports/site-builder/header-code.html)
 *    beats every consumer rule without a specificity fight. The handful of
 *    colors FC hard-codes (variant gray, total, additional info, stepper
 *    borders/icons, loader overlay) are overridden explicitly, mirroring
 *    FC's own selector chains.
 *    The file is scheme-independent (rules are dark-scoped no-ops in light
 *    mode), so one cached static asset serves both color schemes.
 */

/* A1) Stack the cart-drawer open button above the Chatwoot bubble. */
body .fct-cart-drawer-open-btn {
    bottom: 100px;
    right: 24px;
}

/* A2a) Desktop: while the drawer is open, slide chat left of the drawer. */
@media (min-width: 1024px) {
    body:has(.fct-cart-drawer.open) .woot-widget-bubble,
    body:has(.fct-cart-drawer.open) #cw-widget-holder {
        right: 520px;
    }
}

/* A2b) <1024px: the drawer is (nearly) full-width — hide chat while open. */
@media (max-width: 1023px) {
    body:has(.fct-cart-drawer.open) .woot-widget-bubble,
    body:has(.fct-cart-drawer.open) #cw-widget-holder {
        display: none;
    }
}

/* B1) Open button + badge (the button lives outside .fct-cart-drawer). */
html.astra-color-scheme-dark body {
    --fct-cart-drawer-open-btn-bg-color: var(--ast-global-color-5);
    --fct-cart-drawer-badge-bg-color: var(--ast-global-color-7);
}

/* B2) Drawer scope: re-map FC theme variables to the Astra dark palette. */
html.astra-color-scheme-dark body .fct-cart-drawer {
    --fct-cart-drawer-bg: var(--ast-global-color-5);
    --fct-cart-drawer-border-color: var(--ast-global-color-6);
    --fct-cart-drawer-primary-text-color: var(--ast-global-color-2);
    --fct-cart-drawer-secondary-text-color: var(--ast-global-color-3);
    --fct-cart-drawer-close-btn-color: var(--ast-global-color-3);
    --fct-cart-drawer-footer-action-bg-color: var(--ast-global-color-5);
    --fct-cart-drawer-quantity-bg-color: var(--ast-global-color-4);
    --fct-cart-drawer-quantity-color: var(--ast-global-color-2);
    --fct-cart-drawer-quantity-border-color: var(--ast-global-color-6);
    --fct-cart-drawer-quantity-btn-bg: transparent;
    --fct-cart-drawer-quantity-btn-color: var(--ast-global-color-2);
    --fct-cart-drawer-quantity-btn-hover-bg: var(--ast-global-color-6);
    --fct-cart-drawer-btn-bg-color: var(--ast-global-color-7);
    --fct-cart-drawer-btn-text-color: var(--ast-global-color-2);
    --fct-cart-drawer-btn-border-color: var(--ast-global-color-7);
    --fct-cart-item-delete-btn-bg-color: transparent;
    --fct-cart-item-delete-btn-hover-bg-color: var(--ast-global-color-6);
    --fct-cart-item-delete-btn-border-color: var(--ast-global-color-6);
    --fct-cart-item-delete-btn-color: var(--ast-global-color-3);
    --fct-view-cart-btn-bg-color: var(--ast-global-color-5);
    --fct-view-cart-drawer-btn-color: var(--ast-global-color-2);
    --fct-view-cart-drawer-btn-border-color: var(--ast-global-color-6);
    --fct-view-cart-drawer-btn-hover-bg: var(--ast-global-color-6);
}

/* B3) Hard-coded colors FC does not expose via variables — mirror FC's
   selector chains so these win regardless of source order. */
html.astra-color-scheme-dark body .fct-cart-drawer-list .fct-cart-item .fct-cart-item-details .fct-cart-item-variant {
    color: var(--ast-global-color-3);
}
html.astra-color-scheme-dark body .fct-cart-drawer-list .fct-cart-item .fct-cart-item-details .fluent-cart-cart-list-item-additional-info {
    color: var(--ast-global-color-2);
}
html.astra-color-scheme-dark body .fct-cart-drawer-list .fct-cart-item .fct-cart-item-details .fluent-cart-cart-list-item-additional-info span {
    color: var(--ast-global-color-3);
}
html.astra-color-scheme-dark body .fct-cart-drawer .fct-cart-total-wrapper {
    color: var(--ast-global-color-3);
}
html.astra-color-scheme-dark body .fct-cart-drawer .fct-cart-total-wrapper [data-fluent-cart-cart-total-price] {
    color: var(--ast-global-color-2);
}
html.astra-color-scheme-dark body .fct-cart-drawer .fct-cart-drawer-footer {
    border-top-color: var(--ast-global-color-6);
}
html.astra-color-scheme-dark body .fct-cart-drawer .fct-loader-wrap {
    background-color: var(--ast-global-color-5);
}
html.astra-color-scheme-dark body .fct-cart-item-quantity .qty-value {
    background-color: transparent;
    color: var(--ast-global-color-2);
}
html.astra-color-scheme-dark body .fct-cart-item-quantity .decrease-btn,
html.astra-color-scheme-dark body .fct-cart-item-quantity .increase-btn {
    border-color: var(--ast-global-color-6);
}
html.astra-color-scheme-dark body .fct-cart-item-quantity .qty-btn svg {
    fill: var(--ast-global-color-2);
}
html.astra-color-scheme-dark body .fct-cart-drawer-open-btn img {
    filter: invert(1);
}
