/* ================================================================
   WooCommerce AI Sales Assistant — chatbot.css v1.4.0
   Author: creatywniwsieci.pl
   
   CSS class map (must match chatbot.js and chatbot-widget.php):
     .wooaic-toggle          — floating toggle button
     .wooaic-overlay         — click-away backdrop
     .wooaic-chat            — popup window
     .wooaic-header          — header bar
     .wooaic-btn-clear       — clear conv. button in header
     .wooaic-btn-close       — close button in header
     .wooaic-messages        — scrollable messages area
     .wooaic-quick-actions   — quick-action buttons strip
     .wooaic-quick-btn       — individual quick-action chip
     .wooaic-file-preview    — staged-file strip
     .wooaic-input-area      — bottom input row
     .wooaic-input           — textarea
     .wooaic-btn-send        — send button
     .wooaic-btn-attach      — attach-file label
     .wooaic-msg             — message row
     .wooaic-msg-user        — user bubble alignment
     .wooaic-msg-bot         — bot bubble alignment
     .wooaic-bubble          — bubble itself
     .wooaic-btn-cart        — Add to cart inside product card
   
   EVERY property uses !important for full theme isolation.
   ================================================================ */

/* ── Block page scroll when chat is open on mobile ── */
html.wooaic-no-scroll,
body.wooaic-no-scroll {
    overflow: hidden !important;
    position: fixed !important;
    width: 100% !important;
    height: 100% !important;
}

/* ── CSS custom properties (overridden at priority 200 by PHP) ── */
:root {
    --wooaic-primary:       #D4855E;
    --wooaic-primary-dark:  #bf6e48;
    --wooaic-primary-a07:   rgba(212,133,94,.07);
    --wooaic-primary-a15:   rgba(212,133,94,.15);
    --wooaic-bg:            #f9f9f9;
    --wooaic-surface:       #ffffff;
    --wooaic-border:        #ebebeb;
    --wooaic-text:          #0a0a0a;
    --wooaic-muted:         #888888;
    --wooaic-bot-bg:        #f0f0f0;
    --wooaic-radius:        20px;
    --wooaic-z:             999999;
    --wooaic-width:         380px;
    --wooaic-height:        580px;
}

/* ── Global box-sizing reset inside plugin scope ── */
.wooaic-toggle, .wooaic-toggle *,
.wooaic-chat,   .wooaic-chat *,
.wooaic-chat *::before, .wooaic-chat *::after {
    box-sizing: border-box !important;
}

/* ================================================================
   OVERLAY — semi-transparent backdrop, click to close
   ================================================================ */
.wooaic-overlay {
    display: none !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: calc(var(--wooaic-z) - 1) !important;
    background: transparent !important;
}
/* Click-trap on all sizes; tinted backdrop only on mobile */
.wooaic-overlay.is-open {
    display: block !important;
}
@media (max-width: 480px) {
    .wooaic-overlay.is-open {
        background: rgba(0,0,0,.35) !important;
    }
}
.wooaic-overlay.is-open { display: block !important; }

/* ================================================================
   TOGGLE BUTTON
   ================================================================ */
.wooaic-toggle {
    position: fixed !important;
    bottom:   var(--wooaic-offset-y, 24px) !important;
    right:    var(--wooaic-offset-x, 24px) !important;
    left:     auto !important;
    top:      auto !important;
    z-index:  var(--wooaic-z, 999999) !important;

    width:      56px !important;
    height:     56px !important;
    min-width:  56px !important;
    max-width:  260px !important;
    min-height: 56px !important;
    max-height: 56px !important;
    padding:    0 !important;
    gap:        10px !important;

    background:    var(--wooaic-primary) !important;
    border-radius: 999px !important;
    border:        none !important;
    box-shadow:    0 4px 20px rgba(0,0,0,.22), 0 1px 4px rgba(0,0,0,.12) !important;
    cursor:        pointer !important;
    display:       flex !important;
    align-items:   center !important;
    justify-content: center !important;
    margin:        0 !important;
    transition:    transform .2s cubic-bezier(.34,1.56,.64,1), box-shadow .2s !important;
    outline:       none !important;
    appearance:    none !important;
    text-decoration: none !important;
}
.wooaic-toggle-left { right: auto !important; left: var(--wooaic-offset-x, 24px) !important; }
.wooaic-toggle.has-label {
    width:   auto !important;
    padding: 0 22px 0 18px !important;
}

.wooaic-toggle:hover,
.wooaic-toggle:focus-visible {
    transform:  scale(1.06) !important;
    box-shadow: 0 8px 32px rgba(0,0,0,.3) !important;
    outline:    none !important;
}

/* SVG / span inside toggle */
.wooaic-toggle .wooaic-icon-open,
.wooaic-toggle .wooaic-icon-close {
    display:      flex !important;
    align-items:  center !important;
    pointer-events: none !important;
    flex-shrink:  0 !important;
}
.wooaic-toggle .wooaic-icon-open svg,
.wooaic-toggle .wooaic-icon-close {
    width:  22px !important;
    height: 22px !important;
    fill:   #fff !important;
    color:  #fff !important;
    display: block !important;
}
.wooaic-toggle .wooaic-icon-open svg path,
.wooaic-toggle .wooaic-icon-close path { fill: #fff !important; }

/* Hide label when chat is open — show X only, shrink to circle */
.wooaic-toggle.is-open .wooaic-toggle-label { display: none !important; }
.wooaic-toggle.is-open {
    width:      56px !important;
    min-width:  56px !important;
    max-width:  56px !important;
    padding:    0 !important;
    justify-content: center !important;
}

.wooaic-toggle .wooaic-icon-open img {
    width:         30px !important;
    height:        30px !important;
    object-fit:    cover !important;
    border-radius: 50% !important;
    display:       block !important;
}
/* Open/close swap */
.wooaic-toggle .wooaic-icon-close { display: none !important; }
.wooaic-toggle.is-open .wooaic-icon-open  { display: none !important; }
.wooaic-toggle.is-open .wooaic-icon-close { display: flex !important; }

/* Notification badge */
.wooaic-badge {
    position:   absolute !important;
    top:        0 !important;
    right:      0 !important;
    background: #ef4444 !important;
    color:      #fff !important;
    font-size:  10px !important;
    font-weight:700 !important;
    line-height:1.4 !important;
    border-radius: 10px !important;
    padding:    1px 5px !important;
    border:     2px solid #fff !important;
    min-width:  18px !important;
    text-align: center !important;
    display:    none !important;
    pointer-events: none !important;
}

/* ================================================================
   CHAT WINDOW — popup
   ================================================================ */
.wooaic-chat {
    position:     fixed !important;
    bottom:       calc(var(--wooaic-offset-y, 24px) + 70px) !important;
    right:        var(--wooaic-offset-x, 20px) !important;
    left:         auto !important;
    top:          auto !important;
    z-index:      var(--wooaic-z) !important;

    width:        var(--wooaic-width, 380px) !important;
    max-width:    calc(100vw - 24px) !important;
    height:       var(--wooaic-height, 560px) !important;
    max-height:   calc(100vh - 116px) !important;
    min-width:    280px !important;
    min-height:   300px !important;

    background:    var(--wooaic-bg) !important;
    border-radius: 24px !important;
    border:        1px solid rgba(0,0,0,.07) !important;
    box-shadow:    0 24px 64px rgba(0,0,0,.14), 0 4px 16px rgba(0,0,0,.06) !important;

    display:        flex !important;
    flex-direction: column !important;
    overflow:       hidden !important;
    margin:         0 !important;
    padding:        0 !important;
    float:          none !important;

    /* Popup animation — starts hidden */
    transform-origin: bottom right !important;
    transform:  scale(.88) translateY(10px) !important;
    opacity:    0 !important;
    pointer-events: none !important;
    transition: transform .22s cubic-bezier(.34,1.56,.64,1), opacity .18s ease !important;

    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif !important;
    font-size:   14px !important;
    line-height: 1.5 !important;
    color:       var(--wooaic-text) !important;
}
.wooaic-chat-left { right: auto !important; left: var(--wooaic-offset-x, 20px) !important; transform-origin: bottom left !important; }

/* Visible state */
.wooaic-chat.is-open {
    transform:      scale(1) translateY(0) !important;
    opacity:        1 !important;
    pointer-events: all !important;
}

/* Inline / shortcode embed */
.wooaic-chat.wooaic-inline {
    position:    relative !important;
    bottom:      auto !important;
    right:       auto !important;
    left:        auto !important;
    top:         auto !important;
    width:       100% !important;
    max-width:   100% !important;
    height:      var(--wooaic-height, 560px) !important;
    max-height:  80vh !important;
    min-height:  300px !important;
    transform:   none !important;
    opacity:     1 !important;
    pointer-events: all !important;
    border-radius: 12px !important;
    box-shadow:  0 4px 24px rgba(0,0,0,.10) !important;
}

/* Full-page shortcode embed — [wooaic_fullpage]
   Designed as a dedicated page experience, not just a larger bubble.
   Two-column layout on desktop: sidebar left + conversation right.
   Single column on mobile. */

/* Reset bubble positioning for fullpage context */
.wooaic-chat.wooaic-fullpage {
    position:     static !important;
    bottom:       auto !important;
    right:        auto !important;
    left:         auto !important;
    top:          auto !important;
    transform:    none !important;
    width:        100% !important;
    max-width:    100% !important;
    height:       auto !important;
    max-height:   none !important;
    min-height:   none !important;
    border-radius: 0 !important;
    box-shadow:   none !important;
    opacity:      1 !important;
    pointer-events: all !important;
    display:      grid !important;
    grid-template-columns: 260px 1fr !important;
    grid-template-rows: auto 1fr auto !important;
    grid-template-areas:
        "sidebar header"
        "sidebar messages"
        "sidebar input" !important;
    min-height:   calc(100vh - 200px) !important;
    background:   #f5f5f5 !important;
    border:       1px solid #e5e5e5 !important;
    border-radius: 20px !important;
    overflow:     hidden !important;
}

/* Header — spans right columns only */
.wooaic-chat.wooaic-fullpage .wooaic-header {
    grid-area:    header !important;
    border-bottom: 1px solid rgba(255,255,255,.1) !important;
    border-radius: 0 !important;
    padding:      16px 24px !important;
}

/* Messages area */
.wooaic-chat.wooaic-fullpage .wooaic-messages {
    grid-area:    messages !important;
    max-height:   none !important;
    height:       100% !important;
    min-height:   400px !important;
    padding:      24px 32px !important;
    background:   #ffffff !important;
}

/* Input area */
.wooaic-chat.wooaic-fullpage .wooaic-input-area {
    grid-area:    input !important;
    background:   #ffffff !important;
    border-top:   1px solid #f0f0f0 !important;
    padding:      16px 24px !important;
    border-radius: 0 !important;
}

.wooaic-chat.wooaic-fullpage .wooaic-input {
    border-radius: 12px !important;
    font-size:    15px !important;
    padding:      12px 16px !important;
}

/* ── Fullpage sidebar ── */
.wooaic-fp-sidebar {
    grid-area:    sidebar;
    background:   #fafafa;
    border-right: 1px solid #ebebeb;
    padding:      24px 16px;
    display:      flex;
    flex-direction: column;
    gap:          8px;
    overflow-y:   auto;
}

.wooaic-fp-brand {
    display:      flex;
    align-items:  center;
    gap:          10px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #ebebeb;
}

.wooaic-fp-brand-logo {
    width:        32px; height: 32px;
    background:   #1a1a1a;
    border-radius: 9px;
    display:      flex; align-items: center; justify-content: center;
    font-size:    12px; font-weight: 800; color: #fff;
    letter-spacing: -.03em;
}
img.wooaic-fp-brand-logo-img {
    width: 32px; height: 32px;
    border-radius: 9px;
    object-fit: contain;
    background: #fff;
    flex-shrink: 0;
}

.wooaic-fp-brand-name {
    font-size:    14px; font-weight: 700;
    color:        #1a1a1a;
    letter-spacing: -.03em;
}

.wooaic-fp-section-title {
    font-size:    10px; font-weight: 600;
    color:        #aaaaaa;
    text-transform: uppercase; letter-spacing: .08em;
    padding:      4px 12px;
    margin-top:   8px;
}

.wooaic-fp-quick-btn {
    display:      flex; align-items: center; gap: 10px;
    padding:      10px 12px;
    border-radius: 10px;
    font-size:    13px; color: #444444;
    cursor:       pointer;
    transition:   background .15s, color .15s;
    border:       none; background: transparent; width: 100%; text-align: left;
    font-family:  inherit;
}
.wooaic-fp-quick-btn:hover {
    background:   rgba(0,0,0,.05);
    color:        #000000;
}
.wooaic-fp-quick-btn-icon {
    font-size:    16px; flex-shrink: 0;
    width:        28px; height: 28px;
    background:   rgba(0,0,0,.06);
    border-radius: 7px;
    display:      flex; align-items: center; justify-content: center;
}

.wooaic-fp-spacer { flex: 1; }

.wooaic-fp-footer {
    font-size:    11px; color: #bbbbbb;
    text-align:   center; padding-top: 16px;
    border-top:   1px solid #ebebeb;
}

/* Fullpage: bubble styles are larger */
.wooaic-chat.wooaic-fullpage .wooaic-bubble {
    max-width:    70% !important;
    font-size:    14px !important;
    line-height:  1.6 !important;
}

.wooaic-chat.wooaic-fullpage .wooaic-product-cards-row {
    gap:          12px !important;
}

/* Mobile fullpage: single column */
@media (max-width: 768px) {
    .wooaic-chat.wooaic-fullpage {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "header"
            "messages"
            "input" !important;
        border-radius: 12px !important;
        min-height:   calc(100dvh - 120px) !important;
    }
    .wooaic-fp-sidebar { display: none !important; }
    .wooaic-chat.wooaic-fullpage .wooaic-messages { padding: 16px !important; }
    .wooaic-chat.wooaic-fullpage .wooaic-input-area { padding: 12px 16px !important; }
}


/* Mobile: full screen */
@media (max-width: 480px) {
    .wooaic-chat:not(.wooaic-inline) {
        right:         0 !important;
        left:          0 !important;
        bottom:        0 !important;
        width:         100vw !important;
        max-width:     100vw !important;
        max-height:    92dvh !important;
        border-radius: var(--wooaic-radius) var(--wooaic-radius) 0 0 !important;
        transform-origin: bottom center !important;
    }
    .wooaic-toggle { bottom: 16px !important; right: 16px !important; }
    .wooaic-toggle-left { right: auto !important; left: 16px !important; }
}

/* Hide on mobile when option disabled */
@media (max-width: 767px) {
    .wooaic-hide-mobile { display: none !important; }
}

/* ================================================================
   HEADER
   ================================================================ */
.wooaic-header {
    background:      var(--wooaic-primary) !important;
    color:           #fff !important;
    padding:         14px 18px !important;
    display:         flex !important;
    align-items:     center !important;
    justify-content: space-between !important;
    flex-shrink:     0 !important;
    min-height:      64px !important;
    border:          none !important;
    border-radius:   24px 24px 0 0 !important;
    margin:          0 !important;
    box-shadow:      none !important;
}
.wooaic-header-info {
    display:     flex !important;
    align-items: center !important;
    gap:         10px !important;
    flex:        1 !important;
    min-width:   0 !important;
    margin:      0 !important;
    padding:     0 !important;
}
.wooaic-avatar {
    width:       38px !important;
    height:      38px !important;
    min-width:   38px !important;
    background:  var(--wooaic-primary) !important;
    border-radius: 10px !important;
    display:     flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    overflow:    hidden !important;
    margin:      0 !important;
    padding:     6px !important;
    border:      none !important;
}
.wooaic-avatar svg  { width: 100% !important; height: 100% !important; display: block !important; fill: #fff !important; }
.wooaic-avatar img  { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; border-radius: 50% !important; }
.wooaic-avatar path { fill: #fff !important; }

.wooaic-title {
    font-weight:     700 !important;
    font-size:       15px !important;
    line-height:     1.2 !important;
    color:           #fff !important;
    margin:          0 !important;
    padding:         0 !important;
    white-space:     nowrap !important;
    overflow:        hidden !important;
    text-overflow:   ellipsis !important;
    max-width:       180px !important;
}
.wooaic-status {
    font-size:   11px !important;
    opacity:     .88 !important;
    display:     flex !important;
    align-items: center !important;
    gap:         5px !important;
    color:       #fff !important;
    margin:      2px 0 0 !important;
    padding:     0 !important;
}
.wooaic-dot {
    display:      inline-block !important;
    width:        7px !important;
    height:       7px !important;
    background:   #4ade80 !important;
    border-radius: 50% !important;
    flex-shrink:  0 !important;
    border:       none !important;
    margin:       0 !important;
    padding:      0 !important;
    animation:    wooaic-pulse 2s infinite !important;
}
@keyframes wooaic-pulse { 0%,100%{opacity:1} 50%{opacity:.4} }

.wooaic-header-actions {
    display:     flex !important;
    gap:         4px !important;
    flex-shrink: 0 !important;
    margin:      0 !important;
    padding:     0 !important;
}
.wooaic-btn-clear,
.wooaic-btn-close {
    box-sizing:   border-box !important;
    width:        32px !important;
    height:       32px !important;
    min-width:    32px !important;
    max-width:    32px !important;
    min-height:   32px !important;
    max-height:   32px !important;
    background:   rgba(255,255,255,.08) !important;
    background-image: none !important;
    border:       none !important;
    outline:      none !important;
    border-radius:10px !important;
    cursor:       pointer !important;
    display:      flex !important;
    align-items:  center !important;
    justify-content: center !important;
    padding:      0 !important;
    margin:       0 !important;
    font-size:    0 !important;
    line-height:  0 !important;
    flex-shrink:  0 !important;
    box-shadow:   none !important;
    appearance:   none !important;
    transition:   background .14s !important;
    color:        #fff !important;
}
.wooaic-btn-clear:hover,
.wooaic-btn-close:hover { background: rgba(255,255,255,.35) !important; }
.wooaic-btn-clear svg,
.wooaic-btn-close svg   { width: 15px !important; height: 15px !important; display: block !important; fill: #fff !important; }
.wooaic-btn-clear path,
.wooaic-btn-close path  { fill: #fff !important; }

/* ================================================================
   MESSAGES
   ================================================================ */
.wooaic-messages {
    flex:          1 !important;
    overflow-y:    auto !important;
    overflow-x:    hidden !important;
    padding:       14px 14px 6px !important;
    display:       flex !important;
    flex-direction:column !important;
    gap:           10px !important;
    background:    #ffffff !important;
    scroll-behavior: smooth !important;
    margin:        0 !important;
    border:        none !important;
}
.wooaic-messages::-webkit-scrollbar       { width: 4px !important; }
.wooaic-messages::-webkit-scrollbar-track { background: transparent !important; }
.wooaic-messages::-webkit-scrollbar-thumb { background: var(--wooaic-border) !important; border-radius: 4px !important; }

.wooaic-msg {
    display:        flex !important;
    flex-direction: column !important;
    max-width:      82% !important;
    margin:         0 !important;
    padding:        0 !important;
    animation:      wooaic-fadein .16s ease !important;
}
@keyframes wooaic-fadein { from{opacity:0;transform:translateY(4px)} to{opacity:1;transform:none} }

.wooaic-msg-user { align-self: flex-end !important;  align-items: flex-end !important;  }
.wooaic-msg-bot  { align-self: flex-start !important; align-items: flex-start !important; }

.wooaic-bubble {
    padding:      9px 13px !important;
    border-radius:18px !important;
    font-size:    14px !important;
    line-height:  1.52 !important;
    word-break:   break-word !important;
    margin:       0 !important;
    border:       none !important;
    box-shadow:   none !important;
    max-width:    100% !important;
}
.wooaic-msg-user .wooaic-bubble {
    background:               var(--wooaic-primary) !important;
    color:                    #fff !important;
    border-bottom-right-radius: 4px !important;
}
.wooaic-msg-bot .wooaic-bubble {
    background:              var(--wooaic-bot-bg) !important;
    color:                   var(--wooaic-text) !important;
    border-bottom-left-radius: 4px !important;
}
.wooaic-msg-time {
    font-size:  10px !important;
    color:      var(--wooaic-muted) !important;
    margin-top: 3px !important;
    padding:    0 4px !important;
}

/* Typing dots */
.wooaic-msg-typing .wooaic-bubble {
    display:     flex !important;
    align-items: center !important;
    gap:         4px !important;
    padding:     11px 14px !important;
}
.wooaic-tdot {
    width:        7px !important;
    height:       7px !important;
    border-radius:50% !important;
    background:   var(--wooaic-muted) !important;
    display:      inline-block !important;
    flex-shrink:  0 !important;
    animation:    wooaic-bounce 1.2s infinite ease-in-out !important;
}
.wooaic-tdot:nth-child(2) { animation-delay: .2s !important; }
.wooaic-tdot:nth-child(3) { animation-delay: .4s !important; }
@keyframes wooaic-bounce { 0%,80%,100%{transform:scale(.7);opacity:.5} 40%{transform:scale(1);opacity:1} }

.wooaic-msg-error .wooaic-bubble { background: #fee2e2 !important; color: #991b1b !important; }

/* ================================================================
   PRODUCT CARDS
   ================================================================ */
/* ── Product table ── */
/* ── Rich product cards (list layout, responsive) ── */
.wooaic-cards-list {
    display:        flex !important;
    flex-direction: column !important;
    gap:            8px !important;
    margin-top:     8px !important;
    width:          100% !important;
}

/* Results counter header */
.wooaic-cards-header {
    display:         flex !important;
    justify-content: space-between !important;
    align-items:     center !important;
    padding:         6px 10px !important;
    background:      var(--wooaic-surface) !important;
    border-radius:   8px !important;
    font-size:       12px !important;
}
.wooaic-cards-label {
    font-weight:     600 !important;
    color:           var(--wooaic-text) !important;
}
.wooaic-cards-counter {
    font-weight:     700 !important;
    color:           var(--wooaic-primary) !important;
    font-size:       13px !important;
}

/* Estimated total */
.wooaic-est-total {
    display:         flex !important;
    justify-content: space-between !important;
    align-items:     center !important;
    padding:         8px 12px !important;
    background:      var(--wooaic-surface) !important;
    border:          1px solid var(--wooaic-border) !important;
    border-radius:   8px !important;
    font-size:       13px !important;
    margin-top:      4px !important;
}
.wooaic-est-label {
    color:           var(--wooaic-muted, #6b7280) !important;
    font-weight:     500 !important;
}
.wooaic-est-value {
    font-weight:     700 !important;
    color:           var(--wooaic-text) !important;
    font-size:       14px !important;
}

/* Sticky cart bar above input */
.wooaic-sticky-cart {
    display:         flex !important;
    justify-content: space-between !important;
    align-items:     center !important;
    padding:         8px 12px !important;
    background:      var(--wooaic-surface) !important;
    border-top:      1px solid var(--wooaic-border) !important;
    gap:             8px !important;
    flex-shrink:     0 !important;
}
.wooaic-sticky-cart-info {
    display:         flex !important;
    flex-direction:  column !important;
    gap:             2px !important;
    min-width:       0 !important;
    flex:            1 !important;
}
.wooaic-sticky-cart-total {
    font-size:       12px !important;
    color:           var(--wooaic-text) !important;
}
.wooaic-sticky-cart-total strong {
    font-size:       14px !important;
    color:           var(--wooaic-primary) !important;
}
.wooaic-sticky-cart-count {
    font-size:       11px !important;
    color:           var(--wooaic-muted, #6b7280) !important;
}
.wooaic-sticky-btn {
    flex-shrink:     0 !important;
    font-size:       12px !important;
    padding:         6px 14px !important;
    border-radius:   8px !important;
    white-space:     nowrap !important;
}
.wooaic-pcard {
    display:        flex !important;
    flex-direction: row !important;
    gap:            10px !important;
    background:     var(--wooaic-bg) !important;
    border:         1px solid var(--wooaic-border) !important;
    border-radius:  10px !important;
    padding:        10px !important;
    box-sizing:     border-box !important;
    width:          100% !important;
    overflow:       hidden !important;
}
.wooaic-pcard-img-wrap {
    flex-shrink: 0 !important;
    width:       56px !important;
    height:      56px !important;
}
.wooaic-pcard-img-wrap img {
    width:        56px !important;
    height:       56px !important;
    object-fit:   cover !important;
    border-radius:6px !important;
    display:      block !important;
    border:       none !important;
}
.wooaic-pcard-body {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 3px !important;
}
.wooaic-pcard-name {
    font-size:       12px !important;
    font-weight:     700 !important;
    color:           var(--wooaic-text) !important;
    text-decoration: none !important;
    line-height:     1.3 !important;
    display:         -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow:        hidden !important;
    word-break:      break-word !important;
}
.wooaic-pcard-name:hover { color: var(--wooaic-primary) !important; text-decoration: underline !important; }
.wooaic-pcard-price {
    font-size:   13px !important;
    font-weight: 700 !important;
    color:       var(--wooaic-primary) !important;
}
.wooaic-pcard-reason {
    font-size:   11px !important;
    color:       #555 !important;
    font-style:  italic !important;
    line-height: 1.4 !important;
    word-break:  break-word !important;
}
.wooaic-pcard-desc {
    font-size:          11px !important;
    color:              var(--wooaic-muted) !important;
    line-height:        1.4 !important;
    display:            -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow:           hidden !important;
    word-break:         break-word !important;
}
.wooaic-pcard-actions {
    display:     flex !important;
    flex-wrap:   wrap !important;
    gap:         5px !important;
    margin-top:  4px !important;
    align-items: center !important;
}

/* ── Qty stepper ── */
.wooaic-qty-wrap {
    display:     inline-flex !important;
    align-items: center !important;
    border:      1px solid var(--wooaic-border) !important;
    border-radius: 7px !important;
    overflow:    hidden !important;
    height:      26px !important;
}
.wooaic-qty-btn {
    box-sizing:   border-box !important;
    background:   transparent !important;
    border:       none !important;
    outline:      none !important;
    padding:      0 7px !important;
    margin:       0 !important;
    font-size:    14px !important;
    line-height:  26px !important;
    cursor:       pointer !important;
    color:        var(--wooaic-muted) !important;
    transition:   background .12s !important;
    min-width:    24px !important;
}
.wooaic-qty-btn:hover { background: var(--wooaic-surface) !important; color: var(--wooaic-primary) !important; }
.wooaic-qty-input {
    box-sizing:   border-box !important;
    width:        36px !important;
    border:       none !important;
    border-left:  1px solid var(--wooaic-border) !important;
    border-right: 1px solid var(--wooaic-border) !important;
    outline:      none !important;
    text-align:   center !important;
    font-size:    11px !important;
    font-weight:  600 !important;
    padding:      0 2px !important;
    margin:       0 !important;
    height:       24px !important;
    color:        var(--wooaic-text) !important;
    background:   transparent !important;
    -moz-appearance: textfield !important;
}
.wooaic-qty-input::-webkit-outer-spin-button,
.wooaic-qty-input::-webkit-inner-spin-button { -webkit-appearance: none !important; margin: 0 !important; }
.wooaic-btn-cart {
    box-sizing:      border-box !important;
    background:      var(--wooaic-primary) !important;
    background-image:none !important;
    color:           #fff !important;
    border:          none !important;
    outline:         none !important;
    border-radius:   999px !important;
    padding:         5px 14px !important;
    margin:          0 !important;
    font-size:       11px !important;
    font-weight:     600 !important;
    line-height:     1.4 !important;
    cursor:          pointer !important;
    display:         inline-block !important;
    box-shadow:      none !important;
    text-decoration: none !important;
    text-transform:  none !important;
    letter-spacing:  0 !important;
    appearance:      none !important;
    width:           auto !important;
    height:          auto !important;
    white-space:     nowrap !important;
    transition:      background .14s !important;
}
.wooaic-btn-cart:hover    { background: var(--wooaic-primary-dark) !important; color: #fff !important; }
.wooaic-btn-cart.added    { background: #16a34a !important; cursor: default !important; }
.wooaic-btn-cart:disabled { opacity: .6 !important; cursor: wait !important; }
.wooaic-btn-view {
    font-size:       11px !important;
    color:           var(--wooaic-muted) !important;
    text-decoration: none !important;
    display:         inline-block !important;
    margin:          0 !important;
    padding:         5px 8px !important;
    border:          1px solid var(--wooaic-border) !important;
    border-radius:   7px !important;
    white-space:     nowrap !important;
}
.wooaic-btn-view:hover { color: var(--wooaic-primary) !important; border-color: var(--wooaic-primary) !important; }

/* ── Add all to cart ──────────────────────────────────────────── */
.wooaic-add-all-wrap {
    text-align:    left !important;
    padding:       2px 0 4px !important;
    margin-top:    0 !important;
}
.wooaic-btn-add-all {
    display:         inline-flex !important;
    align-items:     center !important;
    gap:             2px !important;
    width:           auto !important;
    font-size:       12px !important;
    font-weight:     600 !important;
    letter-spacing:  .2px !important;
    color:           #fff !important;
    background:      var(--wooaic-primary) !important;
    border:          none !important;
    border-radius:   7px !important;
    padding:         7px 14px !important;
    cursor:          pointer !important;
    transition:      all .2s ease !important;
    white-space:     nowrap !important;
    box-shadow:      0 1px 4px rgba(0,0,0,.12) !important;
    text-transform:  none !important;
}
.wooaic-btn-add-all:hover {
    background:  var(--wooaic-primary-dark, var(--wooaic-primary)) !important;
    box-shadow:  0 2px 6px rgba(0,0,0,.18) !important;
}
.wooaic-btn-add-all:active {
    box-shadow:  0 1px 3px rgba(0,0,0,.12) !important;
}
.wooaic-btn-add-all.added {
    background:  #16a34a !important;
    cursor:      default !important;
    box-shadow:  0 1px 4px rgba(22,163,74,.25) !important;
}
.wooaic-btn-add-all:disabled {
    opacity:     .65 !important;
    cursor:      wait !important;
    transform:   none !important;
}

/* ================================================================
   QUICK ACTIONS
   ================================================================ */
.wooaic-quick-actions {
    padding:     8px 12px !important;
    display:     flex !important;
    flex-wrap:   wrap !important;
    gap:         6px !important;
    border-top:  1px solid var(--wooaic-border) !important;
    background:  #ffffff !important;
    flex-shrink: 0 !important;
    margin:      0 !important;
}
.wooaic-quick-actions:empty { display: none !important; border: none !important; padding: 0 !important; }

.wooaic-quick-btn {
    box-sizing:      border-box !important;
    background:      var(--wooaic-surface) !important;
    background-image:none !important;
    border:          1px solid var(--wooaic-border) !important;
    border-radius:   999px !important;
    padding:         6px 14px !important;
    margin:          0 !important;
    font-size:       12px !important;
    font-family:     -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-weight:     500 !important;
    line-height:     1.4 !important;
    cursor:          pointer !important;
    color:           var(--wooaic-text) !important;
    text-decoration: none !important;
    text-transform:  none !important;
    letter-spacing:  0 !important;
    box-shadow:      none !important;
    outline:         none !important;
    white-space:     nowrap !important;
    display:         inline-flex !important;
    align-items:     center !important;
    flex-shrink:     0 !important;
    opacity:         1 !important;
    visibility:      visible !important;
    appearance:      none !important;
    width:           auto !important;
    height:          auto !important;
    transition:      background .12s, border-color .12s, color .12s !important;
}
.wooaic-quick-btn:hover,
.wooaic-quick-btn:focus-visible {
    background:   var(--wooaic-primary) !important;
    border-color: var(--wooaic-primary) !important;
    color:        #fff !important;
    outline:      none !important;
}

/* ================================================================
   FILE PREVIEW STRIP
   ================================================================ */
.wooaic-file-preview {
    display:     none;       /* JS shows/hides via .show()/.hide() */
    flex-wrap:   wrap !important;
    gap:         6px !important;
    padding:     6px 12px !important;
    background:  #f9fafb !important;
    border-top:  1px solid #f0f0f0 !important;
    flex-shrink: 0 !important;
    margin:      0 !important;
}
.wooaic-file-preview.active { display: flex !important; }

.wooaic-file-chip {
    display:      flex !important;
    align-items:  center !important;
    gap:          5px !important;
    padding:      3px 7px 3px 3px !important;
    background:   #fff !important;
    border:       1px solid var(--wooaic-border) !important;
    border-radius:7px !important;
    font-size:    11px !important;
    color:        #374151 !important;
    max-width:    160px !important;
    margin:       0 !important;
    box-shadow:   none !important;
}
.wooaic-chip-thumb {
    width: 28px !important; height: 28px !important; object-fit: cover !important;
    border-radius: 4px !important; flex-shrink: 0 !important; display: block !important;
    margin: 0 !important; border: none !important;
}
.wooaic-chip-pdf {
    width: 28px !important; height: 28px !important; background: #fee2e2 !important;
    border-radius: 4px !important; flex-shrink: 0 !important; color: #dc2626 !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    margin: 0 !important; border: none !important;
}
.wooaic-chip-pdf svg { width: 14px !important; height: 14px !important; display: block !important; }
.wooaic-chip-name {
    flex: 1 !important; overflow: hidden !important; text-overflow: ellipsis !important;
    white-space: nowrap !important; font-weight: 500 !important; margin: 0 !important; padding: 0 !important;
}
.wooaic-chip-size { color: #9ca3af !important; flex-shrink: 0 !important; margin: 0 !important; }
.wooaic-file-remove {
    box-sizing: border-box !important; background: none !important; border: none !important;
    outline: none !important; padding: 0 !important; margin: 0 !important;
    cursor: pointer !important; color: #9ca3af !important; display: flex !important;
    flex-shrink: 0 !important; line-height: 0 !important; appearance: none !important; transition: color .12s !important;
}
.wooaic-file-remove:hover { color: #ef4444 !important; }
.wooaic-file-remove svg   { width: 11px !important; height: 11px !important; display: block !important; }

.wooaic-sent-img {
    max-width: 180px !important; max-height: 160px !important; border-radius: 9px !important;
    object-fit: cover !important; display: block !important; margin: 2px 0 0 !important;
    border: 2px solid var(--wooaic-primary-a15) !important;
}
.wooaic-sent-pdf {
    display: flex !important; align-items: center !important; gap: 6px !important;
    padding: 5px 9px !important; background: var(--wooaic-primary) !important;
    color: #fff !important; border-radius: 9px !important; font-size: 12px !important;
    font-weight: 500 !important; margin: 2px 0 0 !important;
}

/* ================================================================
   INPUT AREA
   ================================================================ */
.wooaic-input-area {
    display:     flex !important;
    align-items: flex-end !important;
    gap:         7px !important;
    padding:     12px 14px !important;
    border-top:  1px solid rgba(0,0,0,.05) !important;
    background:  #ffffff !important;
    flex-shrink: 0 !important;
    margin:      0 !important;
    box-shadow:  none !important;
    border-bottom: none !important;
    border-left:   none !important;
    border-right:  none !important;
}
.wooaic-input {
    flex:         1 !important;
    border:       1px solid #e0e0e0 !important;
    border-radius:24px !important;
    padding:      10px 16px !important;
    font-size:    14px !important;
    font-family:  -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    resize:       none !important;
    outline:      none !important;
    box-shadow:   none !important;
    max-height:   96px !important;
    overflow-y:   auto !important;
    line-height:  1.4 !important;
    color:        var(--wooaic-text) !important;
    background:   #fff !important;
    display:      block !important;
    box-sizing:   border-box !important;
    margin:       0 !important;
    appearance:   none !important;
    transition:   border-color .14s !important;
}
.wooaic-input:focus            { border-color: var(--wooaic-primary) !important; }
.wooaic-input::placeholder     { color: var(--wooaic-muted) !important; opacity: 1 !important; }

.wooaic-btn-send {
    box-sizing:      border-box !important;
    width:           38px !important;
    height:          38px !important;
    min-width:       38px !important;
    max-width:       38px !important;
    min-height:      38px !important;
    max-height:      38px !important;
    background:      var(--wooaic-primary) !important;
    background-image:none !important;
    border:          none !important;
    outline:         none !important;
    border-radius:   50% !important;
    cursor:          pointer !important;
    display:         flex !important;
    align-items:     center !important;
    justify-content: center !important;
    padding:         0 !important;
    margin:          0 !important;
    flex-shrink:     0 !important;
    box-shadow:      none !important;
    font-size:       0 !important;
    line-height:     0 !important;
    appearance:      none !important;
    overflow:        hidden !important;
    opacity:         1 !important;
    transition:      background .14s, transform .1s !important;
    color:           #fff !important;
}
.wooaic-btn-send:hover           { background: var(--wooaic-primary-dark) !important; }
.wooaic-btn-send:active          { transform: scale(.91) !important; }
.wooaic-btn-send.is-disabled     { opacity: .38 !important; cursor: not-allowed !important; pointer-events: none !important; }
.wooaic-btn-send svg             { width: 17px !important; height: 17px !important; display: block !important; fill: #fff !important; flex-shrink: 0 !important; }
.wooaic-btn-send svg path        { fill: #fff !important; }

.wooaic-btn-attach {
    box-sizing:      border-box !important;
    display:         flex !important;
    align-items:     center !important;
    justify-content: center !important;
    width:           34px !important;
    height:          34px !important;
    min-width:       34px !important;
    border-radius:   8px !important;
    cursor:          pointer !important;
    flex-shrink:     0 !important;
    color:           var(--wooaic-muted) !important;
    background:      none !important;
    border:          none !important;
    padding:         0 !important;
    margin:          0 !important;
    opacity:         1 !important;
    transition:      color .14s, background .14s !important;
}
.wooaic-btn-attach:hover { color: var(--wooaic-primary) !important; background: var(--wooaic-primary-a07) !important; }
.wooaic-btn-attach svg   { width: 17px !important; height: 17px !important; display: block !important; fill: none !important; stroke: currentColor !important; }

/* ================================================================
   FOOTER
   ================================================================ */
.wooaic-footer {
    text-align:  center !important;
    font-size:   10px !important;
    color:       var(--wooaic-muted) !important;
    padding:     4px 0 8px !important;
    background:  var(--wooaic-bg) !important;
    flex-shrink: 0 !important;
    margin:      0 !important;
    border:      none !important;
}
.wooaic-footer a { color: var(--wooaic-muted) !important; text-decoration: none !important; }
.wooaic-footer a:hover { color: var(--wooaic-primary) !important; }

/* ================================================================
   LEAD CAPTURE FORM
   ================================================================ */
.wooaic-lead-form  { margin-top: 10px !important; display: flex !important; flex-direction: column !important; gap: 6px !important; }
.wooaic-lead-form input {
    box-sizing: border-box !important; border: 1px solid var(--wooaic-border) !important;
    border-radius: 8px !important; padding: 7px 12px !important; font-size: 13px !important;
    font-family: inherit !important; outline: none !important; color: var(--wooaic-text) !important;
    background: #fff !important; box-shadow: none !important; appearance: none !important;
    width: 100% !important; display: block !important; margin: 0 !important;
}
.wooaic-lead-form input:focus  { border-color: var(--wooaic-primary) !important; }
.wooaic-lead-submit {
    box-sizing: border-box !important; background: var(--wooaic-primary) !important;
    background-image: none !important; color: #fff !important; border: none !important;
    outline: none !important; border-radius: 8px !important; padding: 7px 14px !important;
    font-size: 13px !important; font-weight: 600 !important; cursor: pointer !important;
    display: inline-flex !important; margin: 0 !important; box-shadow: none !important;
    text-decoration: none !important; text-transform: none !important; appearance: none !important;
    line-height: 1.4 !important; width: auto !important; transition: background .14s !important;
}
.wooaic-lead-submit:hover    { background: var(--wooaic-primary-dark) !important; }
.wooaic-lead-submit:disabled { opacity: .6 !important; cursor: wait !important; }
.wooaic-lead-result  { font-size: 12px !important; margin: 0 !important; }
.wooaic-lead-success { font-size: 13px !important; color: #16a34a !important; font-weight: 600 !important; margin: 0 !important; }

/* ================================================================
   v2.1 — RICH MARKDOWN FORMATTING IN BOT MESSAGES
   ================================================================ */
.wooaic-msg-bot .wooaic-bubble h3.wooaic-h,
.wooaic-msg-bot .wooaic-bubble h4.wooaic-h {
    margin: 8px 0 4px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: var(--wooaic-color) !important;
}
.wooaic-msg-bot .wooaic-bubble ul.wooaic-ul,
.wooaic-msg-bot .wooaic-bubble ol.wooaic-ol {
    margin: 6px 0 6px 16px !important;
    padding: 0 !important;
}
.wooaic-msg-bot .wooaic-bubble li {
    margin: 2px 0 !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}
.wooaic-msg-bot .wooaic-bubble code.wooaic-code {
    background: rgba(0,0,0,.07) !important;
    border-radius: 3px !important;
    padding: 1px 5px !important;
    font-size: 12px !important;
    font-family: monospace !important;
}
.wooaic-msg-bot .wooaic-bubble table.wooaic-table {
    border-collapse: collapse !important;
    width: 100% !important;
    font-size: 12px !important;
    margin: 8px 0 !important;
    border-radius: 6px !important;
    overflow: hidden !important;
}
.wooaic-msg-bot .wooaic-bubble table.wooaic-table th {
    background: var(--wooaic-color) !important;
    color: #fff !important;
    padding: 6px 8px !important;
    text-align: left !important;
    font-weight: 600 !important;
}
.wooaic-msg-bot .wooaic-bubble table.wooaic-table td {
    padding: 5px 8px !important;
    border-bottom: 1px solid rgba(0,0,0,.06) !important;
}
.wooaic-msg-bot .wooaic-bubble table.wooaic-table tr:nth-child(even) td {
    background: rgba(0,0,0,.02) !important;
}
.wooaic-msg-bot .wooaic-bubble a.wooaic-link {
    color: var(--wooaic-color) !important;
    text-decoration: underline !important;
}
.wooaic-msg-bot .wooaic-bubble hr.wooaic-hr {
    border: none !important;
    border-top: 1px solid rgba(0,0,0,.1) !important;
    margin: 8px 0 !important;
}

/* Streaming dots inside bubble (before first text) */
.wooaic-streaming-dots {
    display: flex !important;
    gap: 4px !important;
    padding: 2px 0 !important;
}

/* ── Wishlist button ── */
.wooaic-btn-wishlist {
    box-sizing:   border-box !important;
    background:   transparent !important;
    border:       1px solid #f9a8d4 !important;
    color:        #db2777 !important;
    border-radius:7px !important;
    padding:      4px 8px !important;
    font-size:    11px !important;
    cursor:       pointer !important;
    display:      inline-flex !important;
    align-items:  center !important;
    gap:          4px !important;
    transition:   background .15s, color .15s, border-color .15s !important;
    outline:      none !important;
    margin:       0 !important;
    line-height:  1.4 !important;
    white-space:  nowrap !important;
}
.wooaic-btn-wishlist:hover { background: #fdf2f8 !important; border-color: #db2777 !important; }
.wooaic-btn-wishlist.loading { opacity: .6 !important; cursor: wait !important; }
.wooaic-btn-wishlist.added {
    background:     #fdf2f8 !important;
    border-color:   #db2777 !important;
    color:          #9d174d !important;
    pointer-events: none !important;
}
.wooaic-btn-wishlist.added .wooaic-heart { fill: #db2777 !important; }
.wooaic-heart {
    width:       13px !important;
    height:      13px !important;
    flex-shrink: 0 !important;
    transition:  fill .15s !important;
}
.wooaic-wishlist-label { font-weight: 600 !important; }

/* ── Stock status badges ── */
.wooaic-stock-ok {
    display:       inline-block !important;
    font-size:     10px !important;
    font-weight:   600 !important;
    color:         #15803d !important;
    background:    #dcfce7 !important;
    border-radius: 4px !important;
    padding:       2px 6px !important;
    white-space:   nowrap !important;
}
.wooaic-stock-none {
    display:       inline-block !important;
    font-size:     10px !important;
    font-weight:   600 !important;
    color:         #dc2626 !important;
    background:    #fee2e2 !important;
    border-radius: 4px !important;
    padding:       2px 6px !important;
    white-space:   nowrap !important;
}

/* ── Admin save spinner ── */
@keyframes wooaic-spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

/* ================================================================
   CONVERSATION HISTORY PANEL
   ================================================================ */
.wooaic-history-panel {
    margin:          0 0 12px !important;
    background:      var(--wooaic-surface) !important;
    border:          1px solid var(--wooaic-border) !important;
    border-radius:   10px !important;
    overflow:        hidden !important;
}
.wooaic-history-title {
    padding:         8px 12px !important;
    font-size:       11px !important;
    font-weight:     700 !important;
    color:           var(--wooaic-muted) !important;
    text-transform:  uppercase !important;
    letter-spacing:  .05em !important;
    border-bottom:   1px solid var(--wooaic-border) !important;
    background:      var(--wooaic-bg) !important;
}
.wooaic-history-list {
    display:         flex !important;
    flex-direction:  column !important;
    gap:             0 !important;
}
.wooaic-history-item {
    padding:         10px 12px !important;
    border-bottom:   1px solid var(--wooaic-border) !important;
    cursor:          default !important;
}
.wooaic-history-item:last-child { border-bottom: none !important; }
.wooaic-hist-header {
    display:         flex !important;
    align-items:     center !important;
    gap:             6px !important;
    margin-bottom:   4px !important;
}
.wooaic-hist-icon  { font-size: 13px !important; }
.wooaic-hist-ago   { font-size: 11px !important; color: var(--wooaic-muted) !important; font-weight: 600 !important; }
.wooaic-hist-msgs  { font-size: 10px !important; color: var(--wooaic-muted) !important; margin-left: auto !important; }
.wooaic-hist-summary {
    font-size:       12px !important;
    color:           var(--wooaic-text) !important;
    line-height:     1.45 !important;
    margin-bottom:   6px !important;
}
.wooaic-hist-thumbs {
    display:         flex !important;
    gap:             4px !important;
    margin-bottom:   6px !important;
}
.wooaic-hist-thumbs img {
    width:           36px !important;
    height:          36px !important;
    object-fit:      cover !important;
    border-radius:   5px !important;
    border:          1px solid var(--wooaic-border) !important;
}
.wooaic-hist-load {
    font-size:       11px !important;
    color:           var(--wooaic-primary) !important;
    background:      none !important;
    border:          none !important;
    padding:         0 !important;
    cursor:          pointer !important;
    font-weight:     600 !important;
    text-decoration: underline !important;
}
.wooaic-hist-load:hover { opacity: .75 !important; }

/* ================================================================
   COMPARISON BADGE ON PRODUCT CARDS
   ================================================================ */
.wooaic-compare-badge {
    display:         inline-block !important;
    background:      var(--wooaic-primary) !important;
    color:           #fff !important;
    font-size:       9px !important;
    font-weight:     800 !important;
    padding:         1px 5px !important;
    border-radius:   4px !important;
    margin-right:    4px !important;
    vertical-align:  middle !important;
    letter-spacing:  .05em !important;
}

/* ================================================================
   RECOMMENDATIONS WIDGET (shortcode)
   ================================================================ */
.wooaic-recs-widget {
    margin:       24px 0 !important;
}
.wooaic-recs-title {
    font-size:    18px !important;
    font-weight:  700 !important;
    margin:       0 0 16px !important;
    color:        #111 !important;
}
.wooaic-recs-grid {
    display:      grid !important;
    grid-template-columns: repeat(var(--wooaic-recs-cols, 3), 1fr) !important;
    gap:          16px !important;
}
@media (max-width: 768px) {
    .wooaic-recs-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 480px) {
    .wooaic-recs-grid { grid-template-columns: 1fr !important; }
}
.wooaic-rec-card {
    border:          1px solid #e5e7eb !important;
    border-radius:   10px !important;
    overflow:        hidden !important;
    background:      #fff !important;
    transition:      box-shadow .2s !important;
}
.wooaic-rec-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.1) !important; }
.wooaic-rec-img-wrap {
    display:         block !important;
    aspect-ratio:    1 !important;
    overflow:        hidden !important;
    background:      #f9fafb !important;
}
.wooaic-rec-img-wrap img {
    width:           100% !important;
    height:          100% !important;
    object-fit:      cover !important;
    transition:      transform .25s !important;
}
.wooaic-rec-card:hover .wooaic-rec-img-wrap img { transform: scale(1.04) !important; }
.wooaic-rec-body {
    padding:         12px !important;
}
.wooaic-rec-name {
    display:         block !important;
    font-size:       13px !important;
    font-weight:     600 !important;
    color:           #111 !important;
    text-decoration: none !important;
    margin-bottom:   4px !important;
    line-height:     1.35 !important;
}
.wooaic-rec-name:hover { color: var(--wooaic-primary, #7c3aed) !important; }
.wooaic-rec-price {
    font-size:       14px !important;
    font-weight:     700 !important;
    color:           var(--wooaic-primary, #7c3aed) !important;
    margin-bottom:   10px !important;
}
.wooaic-rec-btn-cart {
    width:           100% !important;
    background:      var(--wooaic-primary, #7c3aed) !important;
    color:           #fff !important;
    border:          none !important;
    border-radius:   7px !important;
    padding:         8px 0 !important;
    font-size:       12px !important;
    font-weight:     600 !important;
    cursor:          pointer !important;
    transition:      opacity .15s !important;
}
.wooaic-rec-btn-cart:hover   { opacity: .88 !important; }
.wooaic-rec-btn-cart.added   { background: #16a34a !important; pointer-events: none !important; }
.wooaic-rec-btn-cart:disabled { opacity: .6 !important; cursor: wait !important; }
.wooaic-rec-btn-view {
    display:         block !important;
    text-align:      center !important;
    width:           100% !important;
    background:      transparent !important;
    color:           var(--wooaic-primary, #7c3aed) !important;
    border:          1px solid var(--wooaic-primary, #7c3aed) !important;
    border-radius:   7px !important;
    padding:         7px 0 !important;
    font-size:       12px !important;
    font-weight:     600 !important;
    text-decoration: none !important;
    transition:      background .15s, color .15s !important;
    box-sizing:      border-box !important;
}
.wooaic-rec-btn-view:hover {
    background: var(--wooaic-primary, #7c3aed) !important;
    color: #fff !important;
}

/* ================================================================
   VARIANT SELECTORS
   ================================================================ */
.wooaic-pcard-sku {
    font-size:       10px !important;
    color:           var(--wooaic-muted) !important;
    margin-bottom:   4px !important;
}
.wooaic-variant-row {
    display:         flex !important;
    align-items:     center !important;
    gap:             6px !important;
    margin-bottom:   4px !important;
}
.wooaic-variant-label {
    font-size:       11px !important;
    font-weight:     600 !important;
    color:           var(--wooaic-muted) !important;
    white-space:     nowrap !important;
    min-width:       55px !important;
}
.wooaic-variant-select {
    flex:            1 !important;
    font-size:       12px !important;
    border:          1px solid var(--wooaic-border) !important;
    border-radius:   6px !important;
    padding:         4px 6px !important;
    background:      var(--wooaic-bg) !important;
    color:           var(--wooaic-text) !important;
    cursor:          pointer !important;
    min-width:       0 !important;
}
.wooaic-btn-choose-variant {
    display:         inline-block !important;
    background:      var(--wooaic-primary) !important;
    color:           #fff !important;
    border:          none !important;
    border-radius:   8px !important;
    padding:         8px 14px !important;
    font-size:       12px !important;
    font-weight:     600 !important;
    cursor:          pointer !important;
    text-decoration: none !important;
    text-align:      center !important;
}
.wooaic-btn-choose-variant:hover { opacity: .88 !important; color: #fff !important; }

/* ── Toast notification ── */
.wooaic-toast {
    position: absolute;
    bottom: 70px;
    left: 50%;
    transform: translateX(-50%) translateY(8px);
    background: #222;
    color: #fff;
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 13px;
    white-space: nowrap;
    opacity: 0;
    transition: opacity .25s, transform .25s;
    pointer-events: none;
    z-index: 9999;
}
.wooaic-toast a { color: #adf; margin-left: 4px; }
.wooaic-toast-show {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
    pointer-events: auto;
}

/* ── Wishlist button added state ── */
.wooaic-btn-wishlist.added .wooaic-wishlist-label { color: #e05; }
.wooaic-btn-wishlist.loading { opacity: .6; pointer-events: none; }

/* ── Side-by-side comparison ── */
.wooaic-compare-wrap {
    display: flex;
    gap: 10px;
    margin-top: 10px;
    overflow-x: auto;
    padding-bottom: 4px;
}
.wooaic-compare-col {
    flex: 1 1 160px;
    min-width: 150px;
    max-width: 220px;
    background: var(--wooaic-bg-card, #fff);
    border: 1px solid var(--wooaic-border, #e8e8e8);
    border-radius: 10px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.wooaic-compare-col .wooaic-pcard-img-wrap img {
    width: 100%;
    height: 110px;
    object-fit: contain;
    padding: 8px;
    background: #f9f9f9;
}
.wooaic-compare-body {
    padding: 8px 10px 10px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
}
.wooaic-compare-reason {
    font-size: 11px;
    color: #666;
    font-style: italic;
    margin-top: 4px;
    border-top: 1px solid var(--wooaic-border, #eee);
    padding-top: 4px;
}
.wooaic-compare-actions {
    margin-top: auto;
    padding-top: 8px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* ================================================================
   FULLPAGE — PRODUCT PANEL (sidebar accumulated products)
   ================================================================ */
.wooaic-fp-products {
    display:        flex;
    flex-direction: column;
    gap:            8px;
    overflow-y:     auto;
    flex:           1;
    padding-bottom: 8px;
}
.wooaic-fp-products:empty::after {
    content:    "Produkty pojawią się tutaj podczas rozmowy";
    font-size:  11px;
    color:      #cccccc;
    text-align: center;
    padding:    20px 8px;
    line-height: 1.5;
    display:    block;
}
.wooaic-fp-product-item {
    display:        flex;
    align-items:    center;
    gap:            8px;
    padding:        8px 10px;
    background:     #ffffff;
    border:         1px solid #ebebeb;
    border-radius:  12px;
    transition:     border-color .15s;
}
.wooaic-fp-product-item:hover {
    border-color:   #D4855E;
}
.wooaic-fp-product-img {
    width:          40px;
    height:         40px;
    object-fit:     cover;
    border-radius:  8px;
    flex-shrink:    0;
    display:        block;
    background:     #f0f0f0;
}
.wooaic-fp-product-info {
    flex:           1;
    min-width:      0;
}
.wooaic-fp-product-name {
    font-size:      12px;
    font-weight:    600;
    color:          var(--wooaic-text);
    line-height:    1.3;
    white-space:    nowrap;
    overflow:       hidden;
    text-overflow:  ellipsis;
    text-decoration: none;
    display:        block;
}
.wooaic-fp-product-name:hover { color: #D4855E; }
.wooaic-fp-product-price {
    font-size:      12px;
    font-weight:    700;
    color:          #D4855E;
    margin-top:     1px;
}
.wooaic-fp-product-add {
    flex-shrink:    0;
    width:          28px;
    height:         28px;
    border-radius:  50%;
    background:     var(--wooaic-primary);
    border:         none;
    color:          #fff;
    font-size:      16px;
    line-height:    1;
    cursor:         pointer;
    display:        flex;
    align-items:    center;
    justify-content: center;
    transition:     background .15s, transform .1s;
    padding:        0;
}
.wooaic-fp-product-add:hover   { background: var(--wooaic-primary-dark, #bf6e48); transform: scale(1.1); }
.wooaic-fp-product-add.added   { background: #34c759; cursor: default; }
.wooaic-fp-product-add:disabled { opacity: .5; cursor: wait; }

/* ── Toggle pill text label ── */
.wooaic-toggle-label {
    color:          #ffffff;
    font-size:      13px;
    font-weight:    600;
    white-space:    nowrap;
    margin-left:    4px;
    letter-spacing: -.01em;
    font-family:    -apple-system, BlinkMacSystemFont, "SF Pro Display", sans-serif;
}