/* AI Action Buttons */
.bajhi-action-icon-btn {
    transition: all 0.2s ease;
    background: transparent !important;
    border: none !important;
    color: #64748b !important;
}

.bajhi-action-icon-btn:hover {
    background: rgba(255, 255, 255, 0.05) !important;
    color: #e2e8f0 !important;
}

.bajhi-post-community-btn {
    background: transparent !important;
    border: none !important;
    color: #64748b !important;
}

.bajhi-post-community-btn:hover {
    background: rgba(255, 255, 255, 0.05) !important;
    color: #e2e8f0 !important;
}

.bajhi-remix-btn:hover {
    background: rgba(139, 92, 246, 0.1) !important;
    border-color: rgba(139, 92, 246, 0.5) !important;
    color: #c4b5fd !important;
}

.bajhi-community-file-preview iframe {
    background: #1e1e1e;
    border: 1px solid rgba(255, 255, 255, 0.05);
}

/* Force Clickability */
#bajhi-sticky-bottom,
#bajhi-sticky-bottom * {
    pointer-events: auto !important;
}

/* Correct UI Layout - Stats Injection FIX */
#bajhi-user-stats-container {
    display: block !important;
    min-height: 50px;
}

/* Modal Defaults */
.bajhi-modal {
    display: none !important;
}

/* ===== 1. FIXED: STICKY BOTTOM TRANSPARENCY ===== */
body #bajhi-sticky-bottom {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
    outline: none !important;
    pointer-events: auto !important;
    /* CHANGED FROM NONE TO AUTO */
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

#bajhi-sticky-bottom * {
    pointer-events: auto !important;
}

/* Chat Widget Color (User Request: #1b61e7) */
body #bajhi-sticky-bottom .bajhi-glass-box {
    background: #15191C !important;
    /* User Requested Dark Color */
    backdrop-filter: none !important;
    /* Remove blur for solid color if desired, or keep. User said "Use this color", usually implies solid. Keeping blur just in case but color is opaque? #1b61e7 is standard hex, opaque. */
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    pointer-events: auto !important;
}

/* ICONS: Square & High Contrast */
.bajhi-search-toolbar button,
.bajhi-search-toolbar label,
#bajhi-agent-toggle-wrap {
    width: 32px !important;
    height: 32px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 8px !important; /* Slightly more modern radius */
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    transition: all 0.2s ease !important;
}

.bajhi-search-toolbar button:hover,
.bajhi-search-toolbar label:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
}

.bajhi-search-toolbar i {
    font-size: 16px !important;
    color: #ffffff !important;
}

/* AGENT SELECTED STATE - Subtle Neutral Blue */
#bajhi-agent-checkbox:checked+label,
#bajhi-agent-checkbox:checked+#bajhi-agent-label {
    background-color: rgba(59, 130, 246, 0.2) !important;
    color: #fff !important;
    border: 1px solid rgba(59, 130, 246, 0.4) !important;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.15) !important;
    border-radius: 8px;
}

/* ===== 2. FIXED: AGENT ICON SIZING ===== */
#bajhi-agent-toggle-wrap {
    width: 38px !important;
    height: 38px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 8px;
    margin-right: 5px;
}

#bajhi-agent-toggle-wrap label {
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    cursor: pointer !important;
}

#bajhi-agent-toggle-wrap i {
    font-size: 18px !important;
    color: #fff !important;
}

/* ===== NEW: Chat Message Text Readability ===== */
.bm-message-content,
.bp-messages-content,
.bm-message-text,
.bajhi-chat-message-text,
.bajhi-chat-text,
.bp-better-messages-list .message-content,
.bm-chat-content .message-content {
    font-size: 18px !important;
    font-family: 'Inter', 'Roboto', 'Segoe UI', Arial, sans-serif !important;
    line-height: 1.6 !important;
    color: #e5e7eb !important;
}

.bm-message-content p,
.bp-messages-content p,
.bm-message-text p,
.bajhi-chat-message-text p,
.bajhi-chat-text p {
    font-size: 18px !important;
    line-height: 1.6 !important;
    margin-bottom: 10px !important;
}

/* ===== 3. FIXED: DESKTOP LAYOUT OVERLAP ===== */
@media (min-width: 769px) {

    /* Force Flex Container for Chat Interface */
    #bp-better-messages-wrap,
    .bp-better-messages-wrap {
        display: flex !important;
        flex-direction: row !important;
        align-items: stretch !important;
        position: relative !important;
    }

    /* Sidebar: Fixed Width, Left Side */
    .bp-messages-sidebar,
    #bp-messages-sidebar {
        width: 300px !important;
        min-width: 300px !important;
        max-width: 300px !important;
        flex-shrink: 0 !important;
        position: relative !important;
        z-index: 99 !important;
        background: #fff !important;
        border-right: 1px solid #eee !important;
    }

    /* Content: Remaining Width */
    .bp-messages-content,
    #bp-messages-content {
        width: calc(100% - 300px) !important;
        flex-grow: 1 !important;
        margin-left: 0 !important;
        position: relative !important;
    }
}

/* ===== 4. FIXED: MOBILE BLUR REMOVAL ===== */
@media (max-width: 768px) {

    .bajhi-mobile-chat-panel,
    .bp-messages-wrap,
    .bp-messages-mobile-scroll,
    #bp-better-messages-mobile {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        filter: none !important;
    }
}

/* ===== 5. FIXED: STATS VISIBILITY ===== */
.bajhi-user-stats-block {
    display: none !important;
}

#bajhi-user-stats-container {
    display: block !important;
    width: 100% !important;
}

/* Ensure the New Chat button area doesn't hide it */
.bp-messages-side-header,
#bajhi-new-chat-wrapper {
    overflow: visible !important;
}

/* ===== Space Nebula Social Media Cards ===== */
.wdm-card-v5 {
    --nebula-purple: #8b5cf6;
    --nebula-blue: #06b6d4;
    --nebula-pink: #ec4899;
    --space-dark: #0a0a0f;
    --card-bg: rgba(15, 18, 28, .85);
    --text: #e9edf6;
    --muted: #8b9bb4;
    --line: rgba(139, 156, 180, .15);
    --accent: #60a5fa;
    background: var(--card-bg);
    border: 1px solid var(--line);
    border-radius: 16px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%;
    box-shadow: 0 8px 32px rgba(0, 0, 0, .4), 0 0 0 1px rgba(139, 156, 180, .05);
    transition: all .3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
}

/* Nebula glow effect */
.wdm-card-v5::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: radial-gradient(ellipse at top right, rgba(139, 92, 246, .08) 0%, transparent 50%),
        radial-gradient(ellipse at bottom left, rgba(6, 182, 212, .06) 0%, transparent 50%);
    pointer-events: none;
    z-index: 0;
}

.wdm-card-v5:hover {
    transform: translateY(-4px) scale(1.02);
    border-color: rgba(139, 156, 180, .3);
    box-shadow: 0 20px 60px rgba(0, 0, 0, .6), 0 0 0 1px rgba(139, 156, 180, .1);
}

.wdm-card-v5 .product-element-top {
    position: relative;
    background: transparent;
    overflow: hidden;
    z-index: 1;
}

.wdm-card-v5 .product-image-link img,
.wdm-card-v5 .product-image-link picture,
.wdm-card-v5 .product-image-link .attachment-woocommerce_thumbnail {
    width: 100% !important;
    height: auto !important;
    max-height: 300px !important;
    object-fit: cover !important;
    object-position: top !important;
    transition: transform .4s cubic-bezier(0.4, 0, 0.2, 1);
    will-change: transform;
}

.wdm-card-v5:hover .product-image-link img {
    transform: scale(1.05);
}

/* Price overlay on image - middle left */
.wdm-card-v5 .price-overlay {
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(10, 10, 15, .9);
    border: 1px solid rgba(139, 156, 180, .3);
    padding: 4px 8px;
    border-radius: 8px;
    z-index: 3;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, .4);
}

.wdm-card-v5 .price-overlay .price,
.wdm-card-v5 .price-overlay .price ins {
    color: #eaf0ff;
    font-weight: 600;
    font-size: 12px;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .5);
}

.wdm-card-v5 .price-overlay .price del {
    color: rgba(255, 255, 255, .5);
    font-size: 12px;
    text-decoration: line-through;
    margin-right: 6px;
}

/* Compact social media style overlay */
.wdm-card-v5 .wdm-stats {
    position: absolute;
    left: 8px;
    right: 8px;
    bottom: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: rgba(10, 10, 15, 0.6);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    padding: 4px 8px;
    z-index: 10;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

.bajhi-preview-btn,
.bajhi-mobile-tab-btn.active {
    background: rgba(59, 130, 246, 0.15) !important;
    color: #4dabf7 !important;
    border-color: rgba(59, 130, 246, 0.4) !important;
    box-shadow: 0 0 10px rgba(59, 130, 246, 0.2);
}

.bajhi-mobile-tab-btn {
    background: rgba(45, 45, 48, 0.6) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    color: #9ca3af !important;
    border-radius: 8px !important;
    padding: 8px 12px !important;
    font-size: 14px !important;
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.bajhi-mobile-tab-btn:hover {
    background: rgba(63, 63, 70, 0.8) !important;
    color: #f3f4f6 !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
}

.bajhi-mobile-tab-btn.active {
    background: rgba(0, 122, 204, 0.12) !important;
    border: 1px solid rgba(0, 122, 204, 0.4) !important;
    color: #60a5fa !important;
    /* Brighter blue for visibility */
    box-shadow: 0 4px 12px rgba(0, 122, 204, 0.15);
}

/* Force vertical centering and allow shrinking for children */
.wdm-card-v5 .wdm-stats>* {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Remove old background from chips as container handles it now */
.wdm-card-v5 .wdm-owner {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-left: 2px;
}

.wdm-card-v5 .wdm-owner .avatar-wrap {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    overflow: hidden;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1);
    flex-shrink: 0;
    /* Prevent avatar squash */
}

.wdm-card-v5 .wdm-owner .name {
    font-size: 11px;
    font-weight: 600;
    color: #fff;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wdm-card-v5 .wdm-owner a {
    display: flex;
    /* Restore flex for the link */
    align-items: center;
    gap: 6px;
    text-decoration: none;
    color: inherit;
}

/* Store Follower Styles */
.wdm-card-v5 .store-follower-count {
    font-size: 10px;
    color: var(--muted);
    margin-left: 0;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wdm-card-v5 .bajhi-follow-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.1);
    color: var(--muted);
    margin-left: 8px;
    cursor: pointer;
    transition: transform 0.2s ease, background-color 0.2s ease, color 0.2s ease;
    /* Optimized transition properties */
    will-change: transform;
    /* Hint for GPU */
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 0 !important;
    line-height: 1 !important;
    flex-shrink: 0;
    transform: translateZ(0);
    /* Promote to layer */
}

.wdm-card-v5 .bajhi-follow-btn:hover {
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
    transform: scale(1.1);
}

.wdm-card-v5 .bajhi-follow-btn.following {
    background: var(--nebula-purple, #8b5cf6);
    color: #fff;
    border-color: transparent;
}

.wdm-card-v5.services-card .bajhi-follow-btn.following {
    background: var(--services-primary, #d946ef);
}

.wdm-card-v5.jobs-card .bajhi-follow-btn.following {
    background: var(--jobs-primary, #10b981);
}

.wdm-card-v5 .bajhi-follow-btn svg {
    width: 14px;
    height: 14px;
    display: block;
    pointer-events: none;
}

.wdm-card-v5 .chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 8px;
    border-radius: 20px;
    font-size: 11px;
    line-height: 1;
    font-weight: 500;
    color: #cbd5e1;
    background: transparent;
    border: none;
    transition: transform 0.2s ease, background-color 0.2s ease;
    will-change: transform;
    transform: translateZ(0);
}

.wdm-card-v5 .chip:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.05);
    transform: translateY(-1px);
}

.wdm-card-v5 .chip svg {
    width: 14px;
    height: 14px;
    opacity: 0.8;
    color: var(--stat-color, #cbd5e1);
    /* Use accent color for icon */
}

.wdm-card-v5 .chip:hover svg {
    opacity: 1;
}

/* Dynamic Accent Colors for Stats Icons */
.wdm-card-v5.agents-card .chip svg {
    color: var(--agents-accent);
}

.wdm-card-v5.services-card .chip svg {
    color: var(--services-primary);
}

.wdm-card-v5.jobs-card .chip svg {
    color: var(--jobs-primary);
}

.wdm-card-v5.websites-card .chip svg {
    color: var(--stat-color);
}


/* Compact content area */
.wdm-card-v5 .product-element-bottom {
    background: transparent;
    padding: 10px;
    color: var(--text);
    z-index: 1;
}

.wdm-card-v5 .wd-entities-title a,
.wdm-card-v5 .product-title a {
    color: var(--text);
    text-decoration: none;
    font-weight: 700;
    font-size: 14px;
    line-height: 1.3;
    display: block;
    overflow: visible;
}

.wdm-card-v5 .wd-entities-title a:hover {
    color: #fff;
}

.wdm-card-v5 .wd-product-cats {
    display: flex;
    gap: 6px;
    margin-top: 6px;
    flex-wrap: wrap;
}

.wdm-card-v5 .wd-product-cats a {
    color: var(--muted);
    font-size: 11px;
    text-decoration: none;
    background: rgba(139, 156, 180, .1);
    padding: 4px 8px;
    border-radius: 6px;
    border: 1px solid rgba(139, 156, 180, .2);
    transition: all .2s ease;
    display: inline-block;
}

.wdm-card-v5 .wd-product-cats a:hover {
    color: var(--text);
    background: rgba(139, 156, 180, .2);
    border-color: rgba(139, 156, 180, .3);
}

/* Limit to 2 tags */
.wdm-card-v5 .wd-product-cats a:nth-child(n+3) {
    display: none;
}

/* Categories and price row layout */
.wdm-card-v5 .wd-product-cats-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 6px;
}

.wdm-card-v5 .wd-product-cats {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    flex: 1;
}

.wdm-card-v5 .wd-product-price {
    flex-shrink: 0;
    text-align: right;
}

.wdm-card-v5 .wd-product-price .price,
.wdm-card-v5 .wd-product-price .price ins {
    color: #eaf0ff;
    font-weight: 600;
    font-size: 14px;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .5);
}


.wdm-card-v5 .wd-product-price .price del {
    color: rgba(255, 255, 255, .5);
    font-size: 14px;
    text-decoration: line-through;
    margin-right: 6px;
}

/* Mobile Grid Fix: Force 1 column */
@media (max-width: 768px) {

    .products,
    .dokan-products-list-view,
    .product-grid-item {
        grid-template-columns: 1fr !important;
        width: 100% !important;
        display: grid !important;
    }

    .product-grid-item {
        margin-bottom: 20px !important;
    }

    /* Ensure Chat Panel is usable on Mobile */
    #bp-better-messages-list,
    .bp-messages-wrap {
        height: auto !important;
        overflow-y: visible !important;
    }
}

/* Desktop Chat Scroll Fix */
@media (min-width: 769px) {

    .bp-messages-wrap .list-view,
    .bp-messages-wrap .chat-list,
    .bp-messages-thread-list,
    .bm-chat-content,
    .bm-messages-list {
        overflow-y: auto !important;
        max-height: 80vh;
        /* Adjust based on viewport */
        scrollbar-width: thin;
    }

    /* Custom Scrollbar */
    .bp-messages-wrap ::-webkit-scrollbar,
    .bm-chat-content ::-webkit-scrollbar {
        width: 6px;
        display: block;
    }

    .bp-messages-wrap ::-webkit-scrollbar-thumb,
    .bm-chat-content ::-webkit-scrollbar-thumb {
        background-color: rgba(255, 255, 255, 0.2);
        border-radius: 3px;
    }
}

/* Agents category styling - Deep Royal Blue / Indigo */
.wdm-card-v5.agents-card {
    --agents-accent: #818cf8;
    --agents-secondary: #6366f1;
    /* Stats Vars */
    --stat-bg: rgba(255, 255, 255, 0.08);
    --stat-border: rgba(255, 255, 255, 0.15);
    --stat-color: #fff;
    --stat-hover-bg: rgba(255, 255, 255, 0.12);
    --stat-hover-border: rgba(255, 255, 255, 0.25);

    background: rgba(10, 10, 15, 0.95);
    border-color: rgba(255, 255, 255, 0.08);
}

.wdm-card-v5.agents-card::before {
    background: radial-gradient(ellipse at top right, rgba(129, 140, 248, .2) 0%, transparent 50%),
        radial-gradient(ellipse at bottom left, rgba(99, 102, 241, .15) 0%, transparent 50%);
}

.wdm-card-v5.agents-card .wd-product-cats a {
    background: rgba(129, 140, 248, .15);
    border-color: rgba(129, 140, 248, .3);
    color: #e0e7ff;
}

.wdm-card-v5.agents-card .wd-product-cats a:hover {
    background: rgba(129, 140, 248, .25);
    border-color: rgba(129, 140, 248, .5);
    color: #fff;
}

.wdm-card-v5.agents-card .wdm-btn {
    /* Inherit glassmorphic vars from card scope */
}

.wdm-card-v5.agents-card .wdm-btn:hover {
    box-shadow: 0 8px 25px rgba(129, 140, 248, .25);
}



/* CTA Buttons */
.wdm-card-v5 .wdm-cta {
    display: flex;
    gap: 6px;
    margin-top: 12px;
    align-items: stretch;
    flex-wrap: nowrap;
    min-height: 28px;
}

.wdm-card-v5 .wdm-cta .wdm-btn {
    flex: 1 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px 10px;
    border-radius: 6px;
    font-weight: 700;
    font-size: 11px;
    letter-spacing: 0.5px;
    text-decoration: none;
    position: relative;
    overflow: hidden;
    transition: all .3s ease;
    cursor: pointer;
    min-height: 32px;

    /* Glassmorphic Base - No Borders */
    background: rgba(255, 255, 255, 0.15) !important;
    border: none !important;
    box-shadow: none !important;
    color: #fff !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

/* New Product Labels Style */
.wdm-card-v5 .product-labels .product-label {
    background: var(--stat-bg, rgba(255, 255, 255, 0.1)) !important;
    border: 1px solid var(--stat-border, rgba(255, 255, 255, 0.2)) !important;
    color: var(--stat-color, #fff) !important;
    backdrop-filter: blur(10px) !important;
    border-radius: 6px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.wdm-card-v5 .wdm-cta .wdm-btn.is-preview,
.wdm-card-v5 .wdm-cta .wdm-btn.is-launch,
.wdm-card-v5 .wdm-cta .wdm-btn.is-hire,
.wdm-card-v5 .wdm-cta .wdm-btn.is-apply {
    flex: 1 !important;
}

/* Better Messages Live Chat button styling - positioned after CTA buttons */
.wdm-card-v5 .wdm-cta .bm-lc-button {
    flex: 0 0 15% !important;
    width: 15% !important;
    max-width: 15% !important;
    min-width: 15% !important;
    padding: 0 !important;
    min-height: 32px;
    background: rgba(255, 255, 255, 0.15) !important;
    border: none !important;
    box-shadow: none !important;
    color: #fff;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    cursor: pointer;
    transition: all 0.2s ease;
    backdrop-filter: blur(10px);
}

.wdm-card-v5 .bm-lc-button:hover {
    background: rgba(255, 255, 255, 0.12) !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
    color: #fff !important;
}

.wdm-card-v5 .bm-lc-button:active {
    transform: scale(0.95);
}

/* Better Messages button text styling */
.wdm-card-v5 .bm-lc-button .bm-button-text {
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
}


/* Websites category styling - Cyan / Sky Pop */
.wdm-card-v5.websites-card .wdm-btn.is-launch {
    /* Inherit glassmorphic */
}

.wdm-card-v5.websites-card .wdm-btn.is-launch:hover {
    box-shadow: 0 8px 25px rgba(34, 211, 238, .25);
}

/* Services category styling */
.wdm-card-v5.services-card {
    --services-primary: #d946ef;
    --services-accent: #f0abfc;
    /* Stats Vars */
    --stat-bg: rgba(255, 255, 255, 0.08);
    --stat-border: rgba(255, 255, 255, 0.15);
    --stat-color: #fff;
    --stat-hover-bg: rgba(255, 255, 255, 0.12);
    --stat-hover-border: rgba(255, 255, 255, 0.25);

    background: rgba(10, 10, 15, 0.95);
    border-color: rgba(255, 255, 255, 0.08);
}

.wdm-card-v5.services-card::before {
    background: radial-gradient(ellipse at top right, rgba(217, 70, 239, .1) 0%, transparent 50%),
        radial-gradient(ellipse at bottom left, rgba(168, 85, 247, .08) 0%, transparent 50%);
}

.wdm-card-v5.services-card .wdm-btn.is-hire {
    /* Inherit glassmorphic */
}

.wdm-card-v5.services-card .wdm-btn.is-hire:hover {
    box-shadow: 0 8px 25px rgba(217, 70, 239, .25);
}

/* Jobs category styling */
.wdm-card-v5.jobs-card {
    --jobs-primary: #10b981;
    --jobs-accent: #34d399;
    /* Stats Vars */
    --stat-bg: rgba(255, 255, 255, 0.08);
    --stat-border: rgba(255, 255, 255, 0.15);
    --stat-color: #fff;
    --stat-hover-bg: rgba(255, 255, 255, 0.12);
    --stat-hover-border: rgba(255, 255, 255, 0.25);

    background: rgba(10, 10, 15, 0.95);
    border-color: rgba(255, 255, 255, 0.08);
}

.wdm-card-v5.jobs-card {
    --stat-bg: rgba(255, 255, 255, 0.08);
    --stat-border: rgba(255, 255, 255, 0.15);
    --stat-color: #fff;
    --stat-hover-bg: rgba(255, 255, 255, 0.12);
    --stat-hover-border: rgba(255, 255, 255, 0.25);

    background: rgba(10, 10, 15, 0.95);
    border-color: rgba(255, 255, 255, 0.08);
}

.wdm-card-v5.jobs-card::before {
    background: radial-gradient(ellipse at top right, rgba(16, 185, 129, .15) 0%, transparent 50%),
        radial-gradient(ellipse at bottom left, rgba(5, 150, 105, .1) 0%, transparent 50%);
}

.wdm-card-v5.jobs-card .wdm-btn.is-apply {
    /* Inherit glassmorphic */
}

.wdm-card-v5.jobs-card .wdm-btn.is-apply:hover {
    box-shadow: 0 8px 25px rgba(16, 185, 129, .25);
}

.wdm-card-v5.jobs-card .wd-product-cats a {
    background: rgba(16, 185, 129, .15);
    color: #6ee7b7;
    border-color: rgba(16, 185, 129, .3);
}

/* Button hover effects - REMOVED ANIMATIONS FOR PERF */
.wdm-card-v5 .wdm-btn:hover {
    opacity: 0.9;
}

.wdm-card-v5 .wdm-btn:active {
    opacity: 0.8;
}

/* Preview button */
.wdm-card-v5 .is-preview {
    /* Inherit glassmorphic defaults from .wdm-btn */
}

.wdm-card-v5 .is-preview:hover {
    /* Handled by .wdm-btn:hover */
}

/* Launch button */
.wdm-card-v5 .is-launch {
    /* Inherit glassmorphic defaults from .wdm-btn */
}

.wdm-card-v5 .is-launch:hover {
    /* Handled by .wdm-btn:hover */
}

/* REMOVED SHINE EFFECT ::before block */

/* Button text shadow for better readability */
.wdm-card-v5 .wdm-btn {
    text-shadow: 0 1px 3px rgba(0, 0, 0, .3);
}


/* ====================================
                                                                                                                                                                 NEW GLASSMORPHIC ACTION BAR
                                                                                                                                                                 ==================================== */
.wdm-card-v5 .wd-buttons {
    display: flex;
    flex-direction: column;
    gap: 6px;
    /* Compacting gap */
    position: absolute;
    top: 16px;
    right: 16px;
    z-index: 9999 !important;
    background: rgba(15, 23, 42, 0.7);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    padding: 4px;
    /* Compacting padding */
    border-radius: 24px;
    /* Slightly tighter radius for compact look */
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    opacity: 0;
    transform: translateX(10px);
    pointer-events: none;
}

/* Mobile Fix: Always show icons on touch devices */
@media (max-width: 1024px) {
    .wdm-card-v5 .wd-buttons {
        opacity: 1 !important;
        transform: translateX(0) !important;
        top: 10px !important;
        right: 10px !important;
        gap: 6px !important;
        padding: 4px !important;
    }

    .wdm-card-v5 .wd-buttons .wd-action-btn,
    .wdm-card-v5 .wd-buttons .woodmart-add-btn {
        width: 32px !important;
        height: 32px !important;
    }

    .wdm-card-v5 .wd-buttons .wd-action-btn svg {
        width: 16px !important;
        height: 16px !important;
    }
}

/* Enable pointer events on buttons */
.wdm-card-v5 .wd-buttons .wd-action-btn,
.wdm-card-v5 .wd-buttons .woodmart-add-btn {
    pointer-events: auto !important;
}


/* Show on hover */
.wdm-card-v5:hover .wd-buttons {
    opacity: 1;
    transform: translateX(0);
}

/* Common Icon Button Style */
.wdm-card-v5 .wd-buttons .wd-action-btn,
.wdm-card-v5 .wd-buttons .woodmart-add-btn {
    width: 34px !important;
    /* Compacting size */
    height: 34px !important;
    border-radius: 50% !important;
    background: transparent !important;
    border: none !important;
    color: #cbd5e1 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
}

.wdm-card-v5 .wd-buttons .wd-action-btn:hover,
.wdm-card-v5 .wd-buttons .woodmart-add-btn:hover {
    color: #fff !important;
    background: rgba(255, 255, 255, 0.1) !important;
    transform: scale(1.1);
}

.wdm-card-v5 .wd-buttons .wd-action-btn svg {
    width: 18px;
    height: 18px;
    stroke-width: 2;
}

/* Tooltip style */
.wdm-card-v5 .wd-tooltip-label {
    position: absolute;
    right: 100%;
    top: 50%;
    transform: translateY(-50%) translateX(-8px);
    background: #0f172a;
    color: #fff;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 11px;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: all 0.2s ease;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    margin-right: 6px;
}

.wdm-card-v5 .wd-action-btn:hover .wd-tooltip-label {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
}

/* --- Modals --- */
.bajhi-checkout-popup {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.85);
    z-index: 20000;
    /* Extremely high z-index */
    justify-content: center;
    align-items: center;
    backdrop-filter: blur(8px);
}

.bajhi-checkout-content {
    background: #111;
    width: 90%;
    max-width: 600px;
    height: 80vh;
    border-radius: 16px;
    border: 2px solid #818cf8;
    /* Agent/Service color match */
    position: relative;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.bajhi-checkout-popup.website-theme .bajhi-checkout-content {
    border-color: #06b6d4;
    box-shadow: 0 25px 50px -12px rgba(6, 182, 212, 0.25);
}

.bajhi-checkout-popup.services-theme .bajhi-checkout-content {
    border-color: #d946ef;
    box-shadow: 0 25px 50px -12px rgba(217, 70, 239, 0.25);
}

.bajhi-checkout-close {
    position: absolute;
    top: 10px;
    right: 15px;
    color: rgba(255, 255, 255, 0.6);
    cursor: pointer;
    font-size: 28px;
    line-height: 1;
    z-index: 1000;
    /* Increased z-index */
    background: rgba(0, 0, 0, 0.5);
    width: 30px;
    height: 30px;
    border-radius: 50%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.bajhi-checkout-close:hover {
    color: #fff;
    background: rgba(0, 0, 0, 0.8);
    transform: scale(1.1);
}

.bajhi-checkout-iframe,
.bajhi-preview-iframe {
    width: 100%;
    height: 100%;
    border: none;
    background: transparent;
    /* Changed from #fff to allow dark mode from embed */
}

/* Preview Modal Specifics */
.bajhi-preview-popup .bajhi-preview-content {
    background: #000;
    width: 95vw;
    height: 95vh;
    max-width: none;
    /* Full screen override */
    border-radius: 8px;
    border: 1px solid #333;
    position: relative;
    box-shadow: 0 0 50px rgba(0, 0, 0, 0.8);
    display: flex;
    flex-direction: column;
}

/* Mobile Fix: Optimized Performance */
@media (max-width: 1024px) {
    .wdm-card-v5 .wd-buttons {
        opacity: 1 !important;
        transform: translateX(0) !important;
        top: 10px !important;
        right: 10px !important;
        gap: 6px !important;
        padding: 4px !important;
        /* Disable blur on mobile for scroll performance */
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: rgba(15, 23, 42, 0.9) !important;
        /* Opaque fallback */
    }

    .wdm-card-v5 .wd-buttons .wd-action-btn,
    .wdm-card-v5 .wd-buttons .woodmart-add-btn {
        width: 32px !important;
        height: 32px !important;
        background: rgba(255, 255, 255, 0.05);
        /* Simpler bg */
    }

    .wdm-card-v5 .wd-buttons .wd-action-btn svg {
        width: 16px !important;
        height: 16px !important;
    }

    /* Disable heavy effects on card itself and overlays */
    .wdm-card-v5,
    .wdm-card-v5 .price-overlay,
    .wdm-card-v5 .wdm-stats {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        /* Use simpler transform for list scrolling */
        will-change: transform;
        transform: translateZ(0);
        box-shadow: none !important;
        /* Remove expensive shadows */
    }

    /* Ensure stats bg is opaque since blur is gone */
    .wdm-card-v5 .wdm-stats {
        background: rgba(15, 23, 42, 0.95);
    }
}

/* --- NEW: Hide Stats on Mobile (User Request) --- */
@media (max-width: 768px) {
    .bajhi-user-stats-block {
        display: none !important;
    }
}

/* --- NEW: Chat Right Sidebar (Files) --- */
.bajhi-chat-right-sidebar {
    width: 300px !important;
    min-width: 300px !important;
    background: #111318;
    border-left: 1px solid rgba(255, 255, 255, 0.08);
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    overflow-x: hidden;
    flex-shrink: 0;
}

.bajhi-chat-with-sidebar .bp-messages-content {
    margin-right: 640px;
    /* Adjust margin to match sidebar */
}

.bajhi-sidebar-header {
    padding: 15px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    font-weight: 700;
    color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.bajhi-sidebar-content {
    padding: 10px;
}

.bajhi-chat-files-response {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 10px;
    padding: 10px 0;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,0.1) transparent;
}
.bajhi-chat-files-response::-webkit-scrollbar {
    height: 4px;
}
.bajhi-chat-files-response::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.1);
    border-radius: 4px;
}
.bajhi-file-chip {
    flex-shrink: 0;
    white-space: nowrap;
}

#bajhi-chat-inner-stream {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 15px;
    padding-bottom: 350px !important;
    /* Added extra bottom padding so last message stays visible above widget */
}

.bajhi-file-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 6px;
    margin-bottom: 8px;
    cursor: pointer;
    transition: all 0.2s;
}

.bajhi-file-item:hover {
    background: rgba(255, 255, 255, 0.1);
}

.bajhi-file-icon {
    color: #8b5cf6;
}

.bajhi-file-name {
    font-size: 12px;
    color: #ccc;
    word-break: break-all;
}

/* Mobile Sidebar */
@media (max-width: 768px) {
    .bajhi-chat-right-sidebar {
        position: fixed;
        top: 0;
        right: -180px;
        /* Hidden (Compact) */
        height: 100vh;
        width: 180px;
        max-width: 48%;
        background: #0f172a;
        box-shadow: -5px 0 15px rgba(0, 0, 0, 0.5);
        transition: right 0.3s ease;
        z-index: 2147483647;
        /* Matches Left Sidebar */
    }

    .bajhi-chat-right-sidebar.active {
        right: 0;
    }

    /* Reset Flex behavior on mobile so it floats */
    .bajhi-chat-with-sidebar .bp-messages-content {
        margin-right: 0 !important;
    }

    #bajhi-chat-interface {
        position: relative;
        /* Ensure absolute children work */
    }
}

/* Desktop Flex Layout for Sidebar */
@media (min-width: 769px) {
    .bajhi-chat-interface {
        display: flex;
        flex-direction: row;
        height: 100%;
        overflow: hidden;
        width: 100%;
    }

    #bajhi-chat-sidebar,
    .bp-messages-sidebar {
        /* Existing Sidebar styles */
        flex-shrink: 0;
    }

    #bajhi-chat-stream,
    #bp-message-thread-content {
        flex: 1;
        min-width: 0;
        /* Flexbox trick */
        position: relative;
    }

    .bajhi-chat-right-sidebar {
        width: 300px !important;
        min-width: 300px !important;
        overflow-y: auto;
        overflow-x: hidden;
        background: #111318;
        border-left: 1px solid rgba(255, 255, 255, 0.08);
        display: flex;
        flex-direction: column;
        flex-shrink: 0;
    }

    .bajhi-chat-right-sidebar.active {
        width: 300px !important;
    }
}

/* Files Toggle Button (Mobile) */
.bajhi-files-toggle {
    display: none;
    padding: 5px 10px;
    background: rgba(139, 92, 246, 0.15);
    border: 1px solid rgba(139, 92, 246, 0.3);
    color: #a78bfa;
    border-radius: 4px;
    font-size: 12px;
    cursor: pointer;
    margin-left: auto;
}

@media (max-width: 768px) {
    .bajhi-files-toggle {
        display: inline-block;
    }
}

/* --- NEW: @ Mention Popup --- */
.bajhi-mention-popup {
    position: fixed;
    /* Or absolute relative to something */
    width: 300px;
    background: #1e1e24;
    /* Darker bg */
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
    z-index: 999999;
    display: none;
    flex-direction: column;
    overflow: hidden;
}

.bajhi-mention-tabs {
    display: flex;
    background: #15151a;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.bajhi-mention-tab {
    flex: 1;
    padding: 10px;
    text-align: center;
    color: #aaa;
    font-size: 12px;
    cursor: pointer;
    font-weight: 600;
}

.bajhi-mention-tab.active {
    color: #fff;
    background: #8b5cf6;
    /* Accent */
}

.bajhi-mention-list {
    max-height: 250px;
    overflow-y: auto;
    padding: 0;
    margin: 0;
    list-style: none;
}

.bajhi-mention-item {
    padding: 8px 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    color: #ddd;
    font-size: 13px;
}

.bajhi-mention-item:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}

.bajhi-mention-img {
    width: 24px;
    height: 24px;
    border-radius: 4px;
    object-fit: cover;
    background: #333;
}



/* Item 3: Fix Desktop New User Chat Panel Content (Top Align) */
#bajhi-chat-stream,
#bajhi-chat-inner-stream {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
}

/* Item 4: Fix Conversation List Overlap & Full Width */
.bp-messages-thread-list-item {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding: 12px 15px !important;
    overflow: visible !important;
    /* Ensure image isn't cut */
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.bp-messages-thread-list-item .avatar {
    overflow: visible !important;
    flex-shrink: 0 !important;
}

.bp-messages-thread-list-item .content {
    flex: 1 !important;
    min-width: 0 !important;
}

/* POST TO COMMUNITY BUTTON STYLE */
.bajhi-post-community-btn:hover {
    opacity: 0.8 !important;
    text-decoration: underline !important;
}

.bajhi-post-community-btn i {
    margin-right: 4px !important;
}

/* Share Dropdown Styles */
.bajhi-share-btn-wrap {
    position: relative !important;
}

.bajhi-share-dropdown {
    position: absolute !important;
    bottom: 100% !important;
    left: 0 !important;
    margin-bottom: 8px !important;
    background: #1e1e24 !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 12px !important;
    min-width: 200px !important;
    padding: 6px !important;
    display: none;
    flex-direction: column !important;
    gap: 4px !important;
    z-index: 1000 !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5) !important;
    backdrop-filter: blur(10px) !important;
}

.bajhi-share-dropdown.visible {
    display: flex !important;
}

.bajhi-share-dropdown-item {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 8px 12px !important;
    color: #e2e8f0 !important;
    text-decoration: none !important;
    font-size: 13px !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
    cursor: pointer !important;
    white-space: nowrap !important;
}

.bajhi-share-dropdown-item:hover {
    background: rgba(255, 255, 255, 0.08) !important;
    color: #fff !important;
}

.bajhi-share-dropdown-item i {
    width: 16px !important;
    text-align: center !important;
    color: #8b5cf6 !important;
}

/* Community Iframe Renderer Styles */
.bajhi-community-iframe-container {
    margin-top: 15px !important;
}

.grid-mode .wdm-card-v5 {
    padding: 10px !important;
    border-radius: 12px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

border-radius: 12px !important;
overflow: hidden !important;
background: rgba(0, 0, 0, 0.2) !important;
}

.bajhi-community-iframe-header {
    padding: 8px 12px !important;
    background: rgba(255, 255, 255, 0.05) !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.bajhi-community-iframe-header a {
    color: #a78bfa !important;
    font-size: 12px !important;
    text-decoration: none !important;
}

/* Fullscreen Preview Styling */
.bajhi-fullscreen-active {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 999999 !important;
    margin: 0 !important;
    border-radius: 0 !important;
    display: flex !important;
    flex-direction: column !important;
}

.bajhi-fullscreen-active .bajhi-preview-iframe,
.bajhi-fullscreen-active .bajhi-inline-editor-container {
    flex: 1 !important;
    height: auto !important;
}

/* Ensure Action Buttons are Clickable */
.bajhi-edit-inline-btn,
.bajhi-fullscreen-inline-btn,
.bajhi-save-inline-btn,
.bajhi-cancel-inline-btn {
    position: relative !important;
    z-index: 50 !important;
    pointer-events: auto !important;
}


/* Force Mini Chat Widget Visibility */
.bp-better-messages-list {
    display: block !important;
    z-index: 999999 !important;
}

/* Force Mobile Chat Icon Visibility */
#bp-better-messages-mini-mobile-open,
.bp-better-messages-mini-mobile-open,
.bpbm-mobile-open-left,
.bpbm-mobile-open-right {
    display: none !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 9999999 !important;
    /* Fixed position to ensure it stays on screen if logic tries to hide it */
    position: fixed !important;
    bottom: 20px !important;
    /* Adjust left/right based on user pref or default lelf */
    !important;
}

/* Show BM icon on desktop only (>768px), hidden on mobile */
@media (min-width: 769px) {

    #bp-better-messages-mini-mobile-open,
    .bp-better-messages-mini-mobile-open,
    .bpbm-mobile-open-left,
    .bpbm-mobile-open-right {
        display: block !important;
        left: 10px !important;
    }
}

/* Hidden Trigger Container */
.bajhi-bm-trigger {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

/* Prevent layout shift */
html {
    scrollbar-gutter: stable;
}

/* Sticky Bottom Bar - MODERN BLUE GLASS (Removed for 'Blend' Look) */
body #bajhi-sticky-bottom {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    width: 94%;
    max-width: 700px;
    border-radius: 20px;
    padding: 0;
    z-index: 999991 !important;
    display: flex;
    align-items: flex-end;
    /* Align bottom */
    gap: 10px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.1);
    transition: bottom 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease, transform 0.2s ease;
    opacity: 1;
    pointer-events: auto;
}

body #bajhi-sticky-bottom:hover {
    box-shadow:
        0 12px 40px rgba(0, 0, 0, 0.7),
        0 0 0 1px rgba(139, 92, 246, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

body #bajhi-sticky-bottom.bajhi-hidden {
    bottom: -100px;
    opacity: 0 !important;
    visibility: hidden !important;
    /* pointer-events: none !important; */
}

/* Inputs - COMPACT MODERN */
#bajhi-sticky-input-wrap {
    flex-grow: 1;
    position: relative;
    display: flex;
    align-items: center;
    border: none !important;
    /* REQ 1: Hide Border */
    box-shadow: none !important;
}

#bajhi-sticky-input {
    width: 100%;
    background: transparent !important;
    /* Transparent to show container blur */
    border: none;
    color: #fff !important;
    caret-color: #fff !important;
    /* REQ: Visible Cursor */
    padding: 10px 10px 10px 5px;
    /* Added left padding */
    font-size: 15px;
    font-weight: 500;
    outline: none;
    cursor: text;
    letter-spacing: 0.02em;
}

#bajhi-sticky-input::placeholder {
    color: rgba(255, 255, 255, 0.7);
    font-weight: 400;
}

#bajhi-sticky-input:focus::placeholder {
    color: rgba(255, 255, 255, 0.5);
}

#bajhi-sticky-btn {
    background: transparent !important;
    /* No Color */
    color: white;
    border: none;
    width: 40px;
    height: 40px;
    min-width: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: none !important;
    /* No Shadow */
    transition: all 0.2s ease;
    font-size: 18px;
}

#bajhi-sticky-btn:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    transform: scale(1.1);
}

/* AI MENU & CHAT CSS */
#bajhi-ai-menu-btn {
    background: transparent;
    border: none;
    color: #ccc;
    font-size: 18px;
    padding: 0 12px;
    cursor: pointer;
    transition: color 0.2s, transform 0.2s;
    height: 100%;
    display: flex;
    align-items: center;
}

#bajhi-ai-menu-btn:hover {
    color: #fff;
    transform: rotate(90deg);
}

#bajhi-ai-menu-dropdown {
    position: absolute;
    bottom: 70px;
    left: 0;
    width: 220px;
    background: #1e1e24;
    border: 1px solid #333;
    border-radius: 16px;
    padding: 8px;
    display: none;
    flex-direction: column;
    z-index: 2147483648;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(10px);
}

#bajhi-ai-menu-dropdown.visible {
    display: flex;
    animation: slideUpFade 0.2s ease-out;
}

@keyframes slideUpFade {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.bajhi-ai-menu-item {
    padding: 12px 16px;
    color: #ddd;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.2s;
    border-radius: 8px;
}

.bajhi-ai-menu-item:hover {
    background: #2a2a35;
    color: #fff;
}

.bajhi-ai-menu-item i {
    width: 20px;
    text-align: center;
    color: #8b5cf6;
    font-size: 16px;
}

/* Chat UI in Search Panel */
.bajhi-chat-interface {
    display: flex;
    flex-direction: row;
    height: 100%;
}

/* REQ 6: Chat Layout - Mobile Stacked, Desktop Row */
@media (max-width: 768px) {
    .bajhi-chat-interface {
        display: flex !important;
        flex-direction: column !important;
        height: 100% !important;
        margin-top: 0 !important;
        overflow: hidden;
        border-radius: 0 !important;
    }
}

/* Layout Order for Mobile: Profile/List First, then Stream */
#bajhi-chat-sidebar {
    order: 1;
    /* REQ 3: Profile/List on Top */
    height: auto;
    min-height: 80px;
    max-height: none;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
}

#bajhi-chat-list {
    flex: 1 !important;
    height: auto !important;
    overflow-y: auto !important;
    display: block !important;
    min-height: 0 !important;
    /* Firefox flex fix */
}

#bajhi-chat-stream {
    order: 2;
    flex: 1;
    height: 100%;
    /* Take up full remaining height */
    min-height: calc(100vh - 160px);
    /* Enlarge stream on mobile */
    display: flex;
    flex-direction: column;
    margin-top: 0 !important;
    padding-top: 10px !important;
}

#bajhi-search-panel-toggle {
    display: none !important;
}

.bajhi-chat-right-sidebar {
    order: 3;
    height: auto;
    min-height: 150px;
    display: flex;
    /* Always visible on desktop, hidden via mobile media query */
}

@media (min-width: 992px) {
    .bajhi-chat-interface {
        display: grid !important;
        grid-template-columns: 260px 1fr 260px !important;
        gap: 0;
        height: 90vh !important;
    }

    #bajhi-chat-sidebar {
        order: unset;
        height: 100% !important;
        max-height: none !important;
        min-height: 0 !important;
        border-right: 1px solid rgba(255, 255, 255, 0.05);
        width: auto !important;
    }

    #bajhi-chat-stream {
        order: unset;
        height: 100% !important;
        max-height: none !important;
        min-height: 0 !important;
        width: 100% !important;
    }

    /* Ensure right sidebar is visible on desktop */
    .bajhi-chat-right-sidebar {
        display: flex !important;
        order: unset;
        height: 100% !important;
        max-height: none !important;
        min-height: 0 !important;
        width: 260px !important;
        min-width: 260px !important;
    }
}

.bajhi-chat-right-sidebar {
    order: unset;
    height: 100%;
    display: flex !important;
    border-left: 1px solid rgba(255, 255, 255, 0.05);
}

.bajhi-chat-interface>div:first-child {
    border-right: 1px solid rgba(255, 255, 255, 0.05);
}

.bajhi-chat-interface>div:last-child {
    border-left: 1px solid rgba(255, 255, 255, 0.05);
}

.bajhi-chat-message {
    display: flex !important;
    margin-bottom: 8px;
    max-width: 100%;
    line-height: 1.4;
    font-size: 16px !important;
    align-items: flex-start !important;
    position: relative;
    animation: fadeIn 0.3s ease;
    word-wrap: break-word;
    word-break: break-word;
}

.bajhi-chat-message.user {
    flex-direction: row !important;
    justify-content: flex-end !important;
    align-self: flex-end !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    max-width: 85%;
    gap: 8px;
}

.bajhi-chat-message.user .bajhi-chat-bubble {
    order: 1 !important;
}

.bajhi-chat-message.user .bajhi-chat-avatar {
    order: 2 !important;
    margin-left: 12px !important;
    margin-right: 0 !important;
}

.bajhi-chat-message.ai {
    flex-direction: row !important;
    justify-content: flex-start !important;
    margin-right: auto !important;
    max-width: 90%;
    gap: 8px;
}

.bajhi-chat-bubble {
    padding: 6px 10px;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.08);
    position: relative;
    max-width: max-content;
}

.bajhi-chat-message.user .bajhi-chat-bubble {
    background: transparent !important;
    color: #94a3b8 !important;
    border-radius: 0 !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: right !important;
}

.bajhi-chat-message.ai .bajhi-chat-bubble {
    background: transparent !important;
    color: #e2e8f0;
    border-radius: 0;
    padding: 0;
    border: none !important;
    box-shadow: none !important;
    max-width: calc(100% - 40px);
}

.bajhi-chat-text {
    white-space: pre-wrap;
    margin: 0;
    padding: 0;
}

.bajhi-chat-text p {
    margin: 0 0 10px 0 !important;
    padding: 0 !important;
}

.bajhi-chat-text p:first-child {
    margin-top: 0 !important;
}

.bajhi-chat-text p:last-child {
    margin-bottom: 0 !important;
}

.bajhi-chat-avatar {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    flex-shrink: 0;
}

.bajhi-chat-message.user .bajhi-chat-avatar {
    margin-left: 0;
}

.bajhi-chat-message.ai .bajhi-chat-avatar {
    margin-right: 0;
}

.bajhi-chat-avatar {
    border-radius: 50%;
    background: transparent !important;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #fff;
    flex-shrink: 0;
    align-self: flex-start;
    /* Keep avatar top-aligned with text */
}

.bajhi-chat-avatar.user-avatar {
    order: 2;
    margin-left: 12px;
}

.bajhi-chat-avatar.ai-avatar {
    order: 0;
}

.bajhi-chat-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

/* Typing Indicator spacing */
.bajhi-typing-indicator {
    margin-left: 44px;
    /* Align with AI bubble start */
}

.bajhi-typing-indicator {
    display: flex;
    gap: 5px;
    padding: 10px 0 10px 38px;
}

.bajhi-typing-dot {
    width: 6px;
    height: 6px;
    background: #666;
    border-radius: 50%;
    animation: bounce 1.4s infinite ease-in-out both;
}

.bajhi-typing-dot:nth-child(1) {
    animation-delay: -0.32s;
}

.bajhi-typing-dot:nth-child(2) {
    animation-delay: -0.16s;
}

@keyframes bounce {

    0%,
    80%,
    100% {
        transform: scale(0);
    }

    40% {
        transform: scale(1);
    }
}

#bajhi-sticky-btn:hover {
    transform: scale(1.05);
    box-shadow: 0 6px 20px rgba(139, 92, 246, 0.5);
}

@media (max-width: 768px) {
    #bajhi-sticky-bottom {
        width: 100% !important;
        box-sizing: border-box !important;
        max-width: none !important;
        border-radius: 0 !important;
        border-left: none !important;
        border-right: none !important;
        bottom: 0 !important;
        left: 0 !important;
        transform: none !important;
        background: transparent !important;
        box-shadow: none !important;
        padding-bottom: env(safe-area-inset-bottom) !important;
        height: auto;
        display: flex;
        flex-direction: column;
        transition: height 0s !important;
        /* Prevent jerky shifts */
    }

    html.bajhi-chat-open,
    body.bajhi-chat-open {
        overflow: hidden !important;
        height: 100% !important;
        height: 100dvh !important;
        position: fixed !important;
        width: 100% !important;
        top: 0 !important;
        overscroll-behavior: none !important;
    }

    body.bajhi-chat-open #bajhi-sticky-bottom {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        height: 100% !important;
        height: 100dvh !important;
        bottom: auto !important;
        transform: none !important;
        z-index: 200000 !important;
        background: transparent !important;
        margin: 0 !important;
        pointer-events: none !important;
        display: flex !important;
        flex-direction: column-reverse !important;
    }

    body.bajhi-chat-open #bajhi-sticky-outer-wrapper {
        flex-shrink: 0 !important;
        pointer-events: auto !important;
    }

    #bajhi-sticky-bottom.bajhi-hidden {
        bottom: -150px !important;
        transform: translateY(100%) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    #bajhi-chat-interface {
        width: 100% !important;
        height: 100dvh !important;
        flex: 1 !important;
        min-height: 0 !important;
        max-height: 100dvh !important;
        margin: 0 !important;
        position: relative !important;
        transform: none !important;
        display: flex !important;
        flex-direction: column !important;
        border-radius: 0 !important;
        overflow: hidden !important;
        pointer-events: auto !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    #bajhi-search-overlay {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
}

/* Magic Button (Floating Search Toggle) */
#bajhi-magic-btn {
    position: fixed !important;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%) scale(0.8) translateY(20px) !important;
    width: 60px;
    /* Increased from 48px */
    height: 60px;
    /* Increased from 48px */
    background: rgba(26, 93, 221, 0.6) !important;
    /* Updated to #1A5DDD with more contrast */
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    color: white !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 26px !important;
    /* Slightly bigger sparkles */
    box-shadow: 0 8px 32px rgba(26, 93, 221, 0.4) !important;
    cursor: pointer !important;
    z-index: 1000000 !important;
    /* Ensure it stays above sticky bar (999991) */
    opacity: 0 !important;
    visibility: hidden !important;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

/* Hidden Touch Area for Mobile */
#bajhi-magic-btn::before {
    content: '';
    position: absolute;
    top: -15px;
    left: -15px;
    right: -15px;
    bottom: -15px;
    border-radius: 50%;
}

#bajhi-magic-btn.visible {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateX(-50%) scale(1) translateY(0) !important;
}

#bajhi-magic-btn:hover {
    transform: translateX(-50%) scale(1.1) translateY(0) !important;
    box-shadow: 0 6px 20px rgba(139, 92, 246, 0.6) !important;
}

.bajhi-sparkle-icon {
    display: inline-block;
    animation: bajhi-sparkle-glow 2s infinite ease-in-out;
    filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.8));
    font-size: 22px;
}

@keyframes bajhi-sparkle-glow {

    0%,
    100% {
        transform: scale(1);
        filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.8));
    }

    50% {
        transform: scale(1.2);
        filter: drop-shadow(0 0 15px rgba(255, 255, 255, 1)) brightness(1.2);
    }
}

@media (max-width: 768px) {
    #bajhi-magic-btn {
        width: 48px;
        /* Force original size on mobile */
        height: 48px;
        font-size: 20px !important;
        bottom: 70px !important;
        left: 50%;
        transform: translateX(-50%) scale(0.8) translateY(20px) !important;
    }

    #bajhi-magic-btn.visible {
        transform: translateX(-50%) scale(1) translateY(0) !important;
    }
}

/* Legacy search item styles (kept for backward compat) */
.bajhi-search-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 15px;
    border-bottom: 1px solid #2a2a30;
    cursor: pointer;
    transition: background 0.2s;
}

.bajhi-search-item:last-child {
    border-bottom: none;
}

.bajhi-search-item:hover {
    background: #2a2a30;
}

.bajhi-search-item img {
    width: 40px;
    height: 40px;
    border-radius: 4px;
    object-fit: cover;
}

.bajhi-search-item .info {
    display: flex;
    flex-direction: column;
}

.bajhi-search-item .title {
    font-size: 14px;
    color: #fff;
    font-weight: 500;
}

.bajhi-search-item .price {
    font-size: 12px;
    color: #aaa;
}

.bajhi-no-results {
    padding: 15px;
    text-align: center;
    color: #aaa;
    font-size: 13px;
}

/* Remove focus outlines for a cleaner look */
#bajhi-sticky-input:focus,
#bajhi-sticky-btn:focus,
#bajhi-sticky-bottom *:focus {
    outline: none !important;
    box-shadow: none !important;
    -webkit-tap-highlight-color: transparent;
}

#bajhi-sticky-input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}



/* Loading Overlay with Quote */
#bajhi-slide-loader {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #0d0d12;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 99999 !important;
    color: #fff;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s;
    padding: 40px;
    text-align: center;
}

#bajhi-slide-loader.visible {
    opacity: 1;
    visibility: visible;
}



.bajhi-quote-text {
    font-size: 18px;
    line-height: 1.5;
    margin-bottom: 20px;
    color: #e2e8f0;
    font-style: italic;
    font-weight: 300;
    max-width: 500px;
}

.bajhi-quote-author {
    font-size: 14px;
    color: #94a3b8;
    margin-bottom: 30px;
}

.bajhi-loader-spinner {
    width: 40px;
    height: 40px;
    border: 3px solid rgba(139, 92, 246, 0.3);
    border-top-color: #8b5cf6;
    border-radius: 50%;
    animation: bajhi-spin 1s linear infinite;
}

@keyframes bajhi-spin {
    to {
        transform: rotate(360deg);
    }
}


/* SEARCH OVERLAY - Full Screen with Blur Backdrop */
#bajhi-search-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(5, 5, 10, 0.82);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 9000;
    /* Use opacity transition instead of display:none for instant visibility */
    display: block;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s ease;
}

#bajhi-search-overlay.visible {
    opacity: 1;
    pointer-events: auto;
}

/* Dark Mode Scrollbar */
#bajhi-search-results-panel::-webkit-scrollbar,
#bajhi-current-results::-webkit-scrollbar {
    width: 65px;
}

/* Premium Onboarding Screen */
#bajhi-onboarding-screen {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100%;
    padding: 40px 20px;
    text-align: center;
    animation: bajhiFadeInUp 0.6s ease-out;
}

@keyframes bajhiFadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.bajhi-onboarding-brand {
    margin-bottom: 30px;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.bajhi-onboarding-sparkle {
    font-size: 50px;
    margin-bottom: 20px;
    text-shadow: 0 0 20px rgba(26, 93, 221, 0.5);
    animation: bajhiSparkleFloat 3s ease-in-out infinite;
}

@keyframes bajhiSparkleFloat {

    0%,
    100% {
        transform: translateY(0) scale(1);
    }

    50% {
        transform: translateY(-10px) scale(1.1);
    }
}

.bajhi-onboarding-logo {
    max-width: 180px;
    height: auto;
    filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.3));
}

.bajhi-onboarding-text-logo {
    font-size: 64px;
    /* A bit smaller */
    font-weight: 400;
    /* Righteous is a single-weight display font */
    color: #fff;
    letter-spacing: -1px;
    font-family: 'Righteous', 'Segoe UI', cursive, sans-serif;
    line-height: 1;
    margin-bottom: 20px;
    filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.2));
    display: inline-block;
}

.bajhi-onboarding-sparkle {
    width: 60px;
    height: 60px;
    background: #1A5DDD;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    margin-bottom: 25px;
    box-shadow: 0 0 20px rgba(26, 93, 221, 0.4);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    animation: bajhiSparkleGlow 2s ease-in-out infinite;
}

@keyframes bajhiSparkleGlow {

    0%,
    100% {
        transform: scale(1);
        box-shadow: 0 0 20px rgba(26, 93, 221, 0.4);
    }

    50% {
        transform: scale(1.05);
        box-shadow: 0 0 35px rgba(26, 93, 221, 0.6);
    }
}

.bajhi-onboarding-headline {
    font-size: 32px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 40px;
    max-width: 600px;
    line-height: 1.2;
    letter-spacing: -0.5px;
}

.bajhi-onboarding-recent-section {
    width: 100%;
    max-width: 800px;
}

.bajhi-onboarding-recent-header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 20px;
    color: #64748b;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.bajhi-onboarding-recent-header::before,
.bajhi-onboarding-recent-header::after {
    content: "";
    flex: 1;
    height: 1px;
    background: rgba(255, 255, 255, 0.05);
    max-width: 100px;
}

.bajhi-onboarding-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
    margin-bottom: 25px;
}

.bajhi-onboarding-card {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    padding: 16px;
    text-align: left;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    backdrop-filter: blur(8px);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 100px;
}

.bajhi-onboarding-card:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(26, 93, 221, 0.4);
    transform: translateY(-4px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.bajhi-card-preview {
    color: #e2e8f0;
    font-size: 13px;
    line-height: 1.4;
    margin-bottom: 12px;
    font-weight: 500;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.bajhi-card-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #64748b;
    font-size: 11px;
}

.bajhi-card-date i {
    margin-right: 4px;
}

.bajhi-card-files span {
    background: rgba(255, 255, 255, 0.05);
    padding: 2px 6px;
    border-radius: 4px;
}

.bajhi-onboarding-ghost-btn {
    background: transparent !important;
    border: none !important;
    color: rgba(255, 255, 255, 0.3) !important;
    /* Dim text color */
    padding: 10px 20px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
}

.bajhi-onboarding-ghost-btn:hover {
    color: rgba(255, 255, 255, 0.6) !important;
    transform: translateY(-1px);
}

/* Mobile Adjustments */
@media (max-width: 768px) {
    .bajhi-onboarding-grid {
        grid-template-columns: 1fr;
    }

    .bajhi-onboarding-headline {
        font-size: 24px;
    }

    .bajhi-onboarding-screen {
        padding: 20px 15px;
    }
}

#bajhi-search-results-panel::-webkit-scrollbar-track,
#bajhi-current-results::-webkit-scrollbar-track {
    background: #0a0a0f;
}

#bajhi-search-results-panel::-webkit-scrollbar-thumb,
#bajhi-current-results::-webkit-scrollbar-thumb {
    background: #333;
    border-radius: 3px;
}

#bajhi-search-results-panel::-webkit-scrollbar-thumb:hover,
#bajhi-current-results::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* Firefox Scrollbar Support */
#bajhi-search-results-panel,
#bajhi-current-results {
    scrollbar-width: thin;
    scrollbar-color: #333 #0a0a0f;
}

/* GLOBAL LAYOUT STABILITY */
/* GLOBAL LAYOUT STABILITY - Force Scrollbar & Reset Padding */
html,
body {
    overflow-y: scroll !important;
    scrollbar-gutter: stable !important;
    padding-right: 0 !important;
    /* Prevent JS libraries from adding padding */
}

/* Slick Horizontal Scrollbar for Vendors */
.bajhi-vendors-grid::-webkit-scrollbar {
    display: block;
    /* Show it now */
    height: 4px;
}

.bajhi-vendors-grid::-webkit-scrollbar-track {
    background: transparent;
}

.bajhi-vendors-grid::-webkit-scrollbar-thumb {
    background: #444;
    border-radius: 4px;
}

.bajhi-vendors-grid {
    scrollbar-width: thin;
    scrollbar-color: #444 transparent;
}

/* Fix wobble/flicker */
.wdm-card-v5,
.wdm-card-v5 img {
    backface-visibility: hidden;
    transform: translateZ(0);
    /* Removed will-change to prevent wobble */
}


#bajhi-search-results-panel {
    position: fixed !important;
    bottom: 65px !important;
    left: 0 !important;
    right: 0 !important;
    margin: 0 auto;
    width: 100% !important;
    max-width: 1400px !important;
    background: #0a0a0f !important;
    color: #e0e0e0 !important;
    border-radius: 20px 20px 0 0 !important;
    box-shadow: 0 -15px 80px rgba(0, 0, 0, 0.9), 0 0 0 1px rgba(139, 92, 246, 0.2) !important;
    display: none;
    z-index: 100100 !important;
    height: 85vh !important;
    max-height: calc(100vh - 120px) !important;
    overflow: hidden !important;
    padding: 0 !important;
    border: 1px solid #2a2a35 !important;
    border-bottom: none !important;
    flex-direction: column;
}

#bajhi-search-results-panel.visible {
    display: flex !important;
    flex-direction: column !important;
}

/* Full Width Stretching for Parent Panel */
#bajhi-search-results-panel.preview-active {
    max-width: none !important;
    width: 100% !important;
    height: 100vh !important;
    max-height: 100vh !important;
    bottom: 0 !important;
    border-radius: 0 !important;
    z-index: 100101 !important;
    /* Ensure it stays on top */
}

@media (max-width: 768px) {
    #bajhi-search-results-panel {
        width: 100% !important;
        max-width: 100% !important;
        left: 0 !important;
        transform: none !important;
        border-radius: 0 !important;
        border: none !important;
        bottom: 0 !important;
        top: 46px !important;
        /* Avoid WP admin bar */
        height: calc(100dvh - 46px) !important;
        max-height: none !important;
    }

    /* Mobile 1-Col for Related Products */
    /* Mobile 1-Col for Related Products */
    .related.products ul.products,
    section.related.products ul.products,
    .related-and-upsells .products,
    .related-and-upsells ul.products {
        grid-template-columns: 1fr !important;
        display: grid !important;
    }

    .related.products ul.products li.product,
    section.related.products ul.products li.product,
    .related-and-upsells .products .product,
    .related-and-upsells ul.products li.product {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }
}

#bajhi-search-results-panel.visible {
    display: flex;
    flex-direction: column;
}

/* Product Slide Panel - Right to Left */
#bajhi-product-slide-panel {
    position: fixed;
    top: 0;
    right: -100%;
    width: 100%;
    max-width: 600px;
    height: 100vh;
    padding: 0;
    background: #0a0a0f;
    z-index: 2147483647 !important;
    /* Highest priority (Above Sticky) */
    transition: right 0.3s ease-out;
    overflow: visible !important;
    /* Changed from hidden so button can bleed out if necessary */
}

/* PREVIEW MODE WIDTH ADJUSTMENT */
#bajhi-product-slide-panel.is-preview-mode {
    width: 90% !important;
    max-width: 90% !important;
}

@media (max-width: 768px) {
    #bajhi-product-slide-panel.is-preview-mode {
        width: 100% !important;
        max-width: 100% !important;
    }
}

#bajhi-product-slide-panel.visible {
    right: 0;
}

#bajhi-product-slide-panel iframe {
    width: 100%;
    height: 100%;
    border: none;
}

/* Special Pill Style (Icons Only) */


#bajhi-product-slide-close {
    position: absolute !important;
    top: 20px !important;
    left: -50px !important;
    right: auto !important;
    width: 40px;
    height: 40px;
    background: rgba(0, 0, 0, 0.6);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    color: #fff;
    font-size: 24px;
    cursor: pointer;
    z-index: 99999 !important;
    display: none !important;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

#bajhi-product-slide-panel.visible #bajhi-product-slide-close {
    display: flex !important;
}

#bajhi-product-slide-close:hover {
    background: rgba(139, 92, 246, 0.8);
    transform: scale(1.1);
}

/* Dark Scrollbar for Side Panel */
#bajhi-product-slide-panel iframe {
    color-scheme: dark;
}

/* HIDE Overlays when Panel is Open */
body.bajhi-panel-open #bajhi-chat-history,
body.bajhi-panel-open #bp-better-messages-mini-mobile-open,
body.bajhi-panel-open .wd-toolbar,
body.bajhi-panel-open #wpadminbar {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    /* pointer-events: none !important; */
    z-index: -1 !important;
}

@media (max-width: 768px) {
    #bajhi-product-slide-close {
        top: 10px !important;
        left: 10px !important;
        /* Move inside on mobile so it doesn't go off-screen */
        right: auto !important;
        width: 35px;
        height: 35px;
        font-size: 20px;
    }
}

#bajhi-product-slide-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    z-index: 100500;
    /* Above Search Panel */
    display: none;
    pointer-events: auto;
    /* Catch clicks */
}

#bajhi-product-slide-overlay.visible {
    display: block;
}

#bajhi-chat-history {
    position: fixed;
    bottom: 32px;
    /* Gap of ~3px below sticky bar (at 70px) assuming ~35px height */
    left: 50%;
    transform: translateX(-50%);
    width: 94%;
    max-width: 700px;
    /* Match input width */
    z-index: 2147483646;
    /* Just below input */
    display: flex;
    flex-direction: row;
    overflow-x: auto;
    gap: 8px;
    padding: 0;
    background: transparent;
    /* Removed Container Background */
    border: none;
    scrollbar-width: none;
    pointer-events: auto;
    transition: bottom 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease;
    box-shadow: none;
}

#bajhi-chat-history.bajhi-hidden {
    bottom: -100px;
    opacity: 0;
    pointer-events: none;
}

/* REQ 1: Search Widget Width same as Conversation Mid Panel */
/* On desktop, center column is sandwiched between 200px sidebars. */
/* Since this is FIXED positioned, we try to mimic that or center it. */
/* User asked for "same as conversation mid panel". */
@media (min-width: 992px) {
    #bajhi-sticky-bottom {
        /* REQ 1: JS-Sync will handle these properties on desktop */
        /* REQ: Restore Visible Glassmorphic Background */
        background: rgba(20, 20, 25, 0.85) !important;
        backdrop-filter: blur(15px) !important;
        -webkit-backdrop-filter: blur(15px) !important;
        border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
        box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.5) !important;

        margin: 0 !important;
        border-radius: 12px 12px 0 0;
        z-index: 99999 !important;
        /* Ensure on top */
    }

    #bajhi-sticky-bottom .bajhi-glass-box {
        width: 100% !important;
        box-sizing: border-box !important;
        max-width: 100%;
        /* Fill the calculated width */
        margin: 0 !important;
        border-radius: 20px !important;
        background: transparent !important;
        /* Let parent handle bg */
        box-shadow: none !important;
    }
}

.bajhi-history-label {
    display: none;
}

/* Hide label for cleaner look */

/* Removed Duplicate History CSS */

/* PRODUCTS GRID STABILITY */
.bajhi-products-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    padding: 20px;
    min-height: 400px;
    background: transparent !important;
    border: none !important;
}

@media (max-width: 768px) {
    .bajhi-products-grid {
        grid-template-columns: 1fr !important;
        gap: 15px;
        padding: 10px;
    }
}

/* FORCE IMAGE STABILITY */
.bajhi-products-grid .wdm-card-v5 img,
.bajhi-products-grid .product img {
    height: auto !important;
    width: 100%;
    /* object-fit: cover; REMOVED to show full image */
    transition: transform 0.3s;
}

#bajhi-chat-history::-webkit-scrollbar {
    display: none;
}

#bajhi-chat-history:empty {
    display: none;
}

.bajhi-history-label {
    font-size: 9px;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
    flex-shrink: 0;
}

.bajhi-history-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: rgba(10, 15, 30, 0.65) !important;
    /* Darkish Blur for Item */
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 20px;
    font-size: 12px;
    color: #e0e0e0 !important;
    /* Off-white Text */
    white-space: nowrap;
    cursor: pointer;
    transition: all 0.2s;
    flex-shrink: 0;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.bajhi-history-pill:hover {
    background: #234b9a !important;
    /* Lighter Blue on Hover */
    border-color: rgba(255, 255, 255, 0.2);
    color: #fff !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
    transform: translateY(-1px);
}

.bajhi-history-pill i {
    font-size: 10px;
    opacity: 0.8;
    color: rgba(255, 255, 255, 0.8) !important;
}

.bajhi-search-header {
    padding: 12px 16px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #8b5cf6;
    font-weight: 700;
    background: #161620;
    border-bottom: 1px solid #2a2a35;
    position: sticky;
    top: 0;
    z-index: 10;
}

/* FORCE VENDORS HORIZONTAL */
.bajhi-vendors-grid {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    width: 100% !important;
    padding-bottom: 10px !important;
    /* Space for scrollbar */
    -webkit-overflow-scrolling: touch !important;
}

.bajhi-vendor-card {
    display: inline-flex !important;
    flex: 0 0 240px !important;
    width: 240px !important;
    min-width: 240px !important;
    max-width: 240px !important;
    height: 80px !important;
    align-items: center !important;
    background: #1a1a22 !important;
    margin-right: 12px !important;
    padding: 10px !important;
    box-sizing: border-box !important;
    border: 1px solid #333 !important;
    border-radius: 10px !important;
}

/* Image Fix */
/* Quick View - REMOVE COMPLETELY */
.wd-quick-view-icon,
.quick-view-button,
.wd-quick-view-btn,
.woodmart-quick-view-btn,
a[data-original-title="Quick view"],
.wd-buttons .wd-quick-view-icon {
    display: none !important;
    visibility: hidden !important;
    /* pointer-events: none !important; */
    opacity: 0 !important;
    width: 0 !important;
}

/* Vendor Image Fix - TARGET ALL POTENTIAL SELECTORS */
.bajhi-vendor-card img,
.product-author img,
.vendor-user-image,
.vendor-info img,
.dokan-store-products .dokan-store-list .store-content .store-info .store-data h2 a img,
.product-grid-item .vendor-image img {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    flex-shrink: 0 !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    object-position: center !important;
    transform: none !important;
    aspect-ratio: 1 / 1 !important;
}

.bajhi-vendor-card .vendor-info {
    flex: 1 !important;
    min-width: 0 !important;
    /* Allow text truncate */
    display: flex !important;
    flex-direction: column !important;
}

/* GLOBAL Search Close - Targeted via Class */
.bajhi-styled-close-btn {
    position: fixed !important;
    /* Fixed relative to viewport (on mobile this is key) */
    z-index: 2147483647 !important;
    display: none !important;
    top: 20px;
    right: 20px;
    width: 44px !important;
    height: 44px !important;
    background: rgba(255, 255, 255, 0.1) !important;
    backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 50% !important;
    color: #fff !important;
    font-size: 20px !important;
    line-height: 1 !important;
    cursor: pointer !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5) !important;
}

/* Visibility Logic - ONLY show when parent has .visible class */
#bajhi-search-results-panel.visible .bajhi-styled-close-btn {
    display: flex !important;
}

/* Desktop Overrides for Close Button (Back to Absolute inside panel) */
@media (min-width: 769px) {
    .bajhi-styled-close-btn {
        position: absolute !important;
        display: flex !important;
        /* Visible on desktop whenever panel is flex */
        top: 15px !important;
        right: 15px !important;
    }
}

.bajhi-vendor-card .vendor-name {
    font-weight: 600;
    color: #fff;
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bajhi-vendor-card .vendor-meta {
    font-size: 11px;
    color: #888;
    display: flex;
    gap: 8px;
}

.bajhi-vendor-card .vendor-meta .rating {
    color: #ffc107;
}

/* PRODUCT GRID - 4 Columns Desktop, 3 Tablet, 2 Small, 1 Mobile */
.bajhi-products-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    /* 4 columns desktop */
    gap: 12px;
    padding: 12px 16px;
}

/* Ensure wdm-card-v5 cards fit in grid */
.bajhi-products-grid .wdm-card-v5 {
    width: 100% !important;
    max-width: 100% !important;
}

@media (max-width: 1024px) {
    .bajhi-products-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 768px) {
    .bajhi-products-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 500px) {
    .bajhi-products-grid {
        grid-template-columns: 1fr;
    }
}

.bajhi-product-card {
    background: #1a1a22;
    border-radius: 10px;
    border: 1px solid #2a2a35;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.2s;
}

.bajhi-product-card:hover {
    border-color: #8b5cf6;
    transform: translateY(-2px);
}

.bajhi-product-card .prod-img {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    background: #222;
}

.bajhi-product-card .prod-info {
    padding: 10px;
}

.bajhi-product-card .prod-title {
    font-size: 13px;
    font-weight: 600;
    color: #e0e0e0;
    line-height: 1.3;
    margin-bottom: 4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.bajhi-product-card .prod-price {
    font-size: 14px;
    font-weight: 700;
    color: #8b5cf6;
}

/* FIX: VENDOR IMAGES HEIGHT OVERRIDE - FORCE */
body .bajhi-products-grid .wdm-card-v5 img,
body .bajhi-products-grid .product img,
body .bajhi-products-grid .bajhi-product-img,
body .bajhi-search-item img {
    /* Added vendor search item selector */
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    /* Allow full height */
    object-fit: contain !important;
    /* Show full image */
    aspect-ratio: auto !important;
    /* Remove forced square */
}

/* LIQUID GLASS CLOSE BUTTON - TARGET BOTH ID AND CLASS */
#bajhi-product-slide-close,
.bajhi-product-slide-close,
#bajhi-search-close {
    background: rgba(255, 255, 255, 0.1) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    color: #fff !important;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: none;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    z-index: 2147483647 !important;
}

#bajhi-product-slide-panel.visible #bajhi-product-slide-close,
#bajhi-search-results-panel.visible #bajhi-search-close {
    display: flex !important;
}

#bajhi-product-slide-close:hover,
.bajhi-product-slide-close:hover,
#bajhi-search-close:hover {
    background: rgba(255, 255, 255, 0.2) !important;
    transform: rotate(90deg);
}

/* HIDE DUPLICATE SHARE ICONS - AGGRESSIVE */
.wd-action-btn.bajhi-share-link,
.wd-action-btn.wd-share-btn,
.wd-action-btn.share,
.woodmart-social-icons,
.wd-buttons .wd-action-btn>a[href*="facebook"],
.wd-buttons .wd-action-btn>a[href*="twitter"],
.wd-buttons .wd-action-btn>a[href*="linkedin"] {
    display: none !important;
}

/* Load More Button */
.bajhi-load-more-btn {
    display: block;
    width: calc(100% - 32px);
    margin: 0 16px 16px;
    padding: 10px;
    background: #2a2a35;
    border: 1px solid #3a3a45;
    color: #aaa;
    border-radius: 8px;
    cursor: pointer;
    font-size: 13px;
    transition: all 0.2s;
}

.bajhi-load-more-btn:hover {
    background: #3a3a45;
    color: #fff;
}

.bajhi-no-results {
    padding: 20px;
    text-align: center;
    color: #666;
    font-size: 14px;
}

/* Sticky Popup Modal - Dark */
#bajhi-sticky-popup-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(10px);
    z-index: 2147483647;
    justify-content: center;
    align-items: center;
}

#bajhi-sticky-popup-overlay.active {
    display: flex;
}

#bajhi-sticky-popup-content {
    width: 95%;
    max-width: 1000px;
    height: 85vh;
    background: #1a1a1a;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
    border: 1px solid #333;
    animation: bajhiPopIn 0.3s cubic-bezier(0.18, 0.89, 0.32, 1.28);
}

@keyframes bajhiPopIn {
    from {
        transform: scale(0.9);
        opacity: 0;
    }

    to {
        transform: scale(1);
        opacity: 1;
    }
}

#bajhi-popup-close {
    position: absolute;
    top: 10px;
    right: 15px;
    background: rgba(0, 0, 0, 0.5);
    color: #fff;
    border: none;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    font-size: 20px;
    cursor: pointer;
    z-index: 10;
    z-index: 10;
    display: none;
    /* Hide by default */
    align-items: center;
    justify-content: center;
    transition: background 0.2s;
}

#bajhi-sticky-popup-overlay.active #bajhi-popup-close {
    display: flex;
}

#bajhi-popup-close:hover {
    background: #d32f2f;
}

#bajhi-popup-frame {
    width: 100%;
    height: 100%;
    display: block;
    background: #1a1a1a !important;
    /* Dark bg for popup content */
}

.bajhi-popup-loaded #bajhi-popup-frame {
    background: #1a1a1a !important;
}

/* AGENT MODE & UI STYLES */
#bajhi-sticky-input-wrap {
    padding-right: 5px;
    /* Adjustment */
}

#bajhi-agent-toggle-wrap {
    display: flex;
    align-items: center;
    margin-left: 8px;
    cursor: pointer;
}

#bajhi-agent-checkbox {
    display: none;
}

#bajhi-agent-label {
    color: #888;
    font-size: 18px;
    padding: 5px;
    transition: all 0.3s;
    cursor: pointer;
}

#bajhi-agent-checkbox:checked+#bajhi-agent-label {
    color: #8b5cf6;
    /* Purple Active */
    text-shadow: 0 0 10px rgba(139, 92, 246, 0.6);
    transform: scale(1.1);
}

/* FIX: Chat Layout Overlap - Re-restored to flex via base class */
.bajhi-chat-message {
    width: 100% !important;
    position: relative !important;
    margin-bottom: 20px !important;
}

.bajhi-chat-message.user {
    text-align: right;
}

.bajhi-chat-message.ai {
    text-align: left;
}

.bajhi-agent-status {
    clear: both !important;
    display: block !important;
    margin-top: 5px !important;
}

/* ATTACHMENT BUTTON */
/* ATTACHMENT BUTTON - FIX for Blue Background */
#bajhi-attach-btn {
    background: transparent;
    border: none;
    color: rgba(255, 255, 255, 0.8) !important;
    /* Visible on Blue */
    font-size: 16px;
    padding: 8px;
    cursor: pointer;
    transition: color 0.2s;
    margin-left: 5px;
}

#bajhi-attach-btn:hover {
    color: #fff !important;
}

#bajhi-attach-btn:hover {
    color: #fff;
}

/* FILE PREVIEW */
#bajhi-file-preview {
    position: absolute;
    top: -40px;
    left: 20px;
    background: rgba(40, 40, 50, 0.95);
    border: 1px solid #444;
    border-radius: 8px;
    padding: 6px 12px;
    display: none;
    /* Hidden Default */
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: #ddd;
    z-index: 100;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
}

#bajhi-remove-file {
    background: transparent;
    border: none;
    color: #ff5555;
    cursor: pointer;
    padding: 0;
    margin-left: 5px;
}


@media (max-width: 600px) {
    #bajhi-sticky-bottom {
        padding: 0 !important;
        bottom: 0 !important;
        height: auto !important;
        /* Allow expansion */
        min-height: 60px !important;
        padding-bottom: 20px !important;
        /* Safety for iPhone Home Bar */
        background: rgba(26, 62, 130, 0.45) !important;
        /* Blue Glass Mobile */
        backdrop-filter: blur(15px) !important;
        -webkit-backdrop-filter: blur(15px) !important;
        border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
        border-radius: 20px 20px 0 0 !important;
        /* Rounded Top */
        display: flex !important;
        align-items: center !important;
    }

    #bajhi-sticky-input-wrap,
    #bajhi-sticky-form,
    #bajhi-sticky-input,
    #bajhi-sticky-btn {
        height: 100% !important;
        border-radius: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    #bajhi-sticky-input-wrap {
        width: 100% !important;
        background: transparent !important;
    }

    #bajhi-sticky-input {
        font-size: 16px !important;
        /* Prevent iOS zoom */
        padding: 0 15px !important;
        background: transparent !important;
        color: #fff !important;
        caret-color: #fff !important;
        /* VISIBLE BLINKING CURSOR */
    }

    #bajhi-sticky-btn {
        width: 50px !important;
        background: transparent !important;
        color: #fff !important;
    }

    #bp-better-messages-mini-mobile-open,
    .bp-better-messages-mini-mobile-open,
    .bp-better-messages-mini-chat-toggler {
        /* bottom: 160px !important; */
    }

    /* Mobile Specific Close Button Override */
    .bajhi-styled-close-btn {
        top: auto !important;
        bottom: 160px !important;
        /* +45px from 115px */
        right: 20px !important;
        position: fixed !important;
    }

    /* Move History Up (Above Sticky Bar) & Add Padding */
    #bajhi-chat-history {
        bottom: 0 !important;
        /* Shifted down to match sticky bar */
        margin-bottom: 60px !important;
        width: 100% !important;
        padding: 0 10px !important;
        left: 0 !important;
        transform: none !important;
        justify-content: flex-start;
        /* Transparent Container for Mobile too */
        background: transparent !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        border-top: none !important;
    }

    /* Hide conflicting text header */
    #bajhi-products-header {
        display: none !important;
    }

    /* Remove Top Padding to Panel so it's fullscreen but with WP Admin spacing */
    #bajhi-search-results-panel {
        height: 100% !important;
        height: 100dvh !important;
        bottom: 0 !important;
        border-radius: 0 !important;
        z-index: 99990 !important;
        /* Fix: Ensure below sticky bar (MaxInt) */
    }

    /* Desktop Panel Fix */
    @media (min-width: 769px) {
        #bajhi-search-results-panel {
            z-index: 99990 !important;
            padding-bottom: 100px !important;
            /* Fix: Prevent overlap with sticky bar */
        }
    }

    /* Relocate Product Slide Close Button to Bottom Right (Liquid Glass) */
    #bajhi-product-slide-close {
        top: auto !important;
        /* bottom: 160px !important; */
        /* +45px from 115px */
        right: 20px !important;
        left: auto !important;
        position: fixed !important;
        z-index: 2147483647 !important;
        width: 44px !important;
        height: 44px !important;
        background: rgba(255, 255, 255, 0.1) !important;
        backdrop-filter: blur(10px) !important;
        border: 1px solid rgba(255, 255, 255, 0.2) !important;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.6) !important;
        display: none !important;
        align-items: center;
        justify-content: center;
        color: #fff !important;
    }

    /* Force Display Flex when Visible */
    #bajhi-search-results-panel.visible #bajhi-search-close,
    #bajhi-product-slide-panel.visible #bajhi-product-slide-close {
        display: flex !important;
    }

    /* GLOBAL: Better Messages Icon Position (Desktop & Mobile) */
    /* User requested explicit 'bottom' padding/position for both */
    #bp-better-messages-mini-mobile-open,
    .bp-better-messages-mini-mobile-open,
    .bp-better-messages-mini-chat-toggler {
        /* z-index: 2147483640 !important; */
        /* Ensure it's above search bar but below popup */
    }

    /* HIDE Sticky Elements when Chat is OPEN (Mobile Active Mode) */
    body.bp-better-messages-mobile-active #bajhi-sticky-bottom,
    body.bp-better-messages-mobile-active #bp-better-messages-mini-mobile-open,
    body.bp-better-messages-mobile-active .bp-better-messages-mini-mobile-open,
    body.bp-better-messages-mobile-active .bp-better-messages-mini-chat-toggler {
        display: none !important;
        z-index: -1 !important;
        opacity: 0 !important;
        /* pointer-events: none !important; */
    }

    /* Ensure Conversation View is Topmost and Opaque */
    .bp-messages-thread {
        z-index: 2147483650 !important;
        /* Highest priority */
        position: relative !important;
        background: #111 !important;
        /* Ensure no transparency in dark mode */
    }

    /* FORCE 3-COLUMN GRID IN CHAT (Desktop ONLY) */
}

/* CHAT STREAM - Scrollable Content Area */

/* CHAT STREAM - Scrollable Content Area */
/* CHAT STREAM - Scrollable Content Area */
#bajhi-chat-stream {
    flex: 1;
    min-height: 0;
    overflow: hidden !important;
    /* Stream container should not scroll itself */
    display: flex !important;
    flex-direction: row !important;
    /* ALWAYS horizontal split */
    padding: 0 !important;
    margin: 0 !important;
    position: relative;
}

#bajhi-chat-main {
    flex: 1;
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    min-width: 0;
    background: #13151a;
}

#bajhi-file-preview-panel {
    display: none;
    /* Hidden by default */
    width: 45%;
    height: 100%;
    flex-shrink: 0;
    border-left: 1px solid rgba(255, 255, 255, 0.07);
    background: #111318;
    flex-direction: column;
    overflow: hidden;
}

/* --- CHAT INTERFACE DESKTOP DEFAULTS (Horizontal Sidebar) --- */
/* --- CHAT INTERFACE: DESKTOP (Left Sidebar, Right Content) --- */
/* --- REWRITTEN CHAT INTERFACE CSS (Unified & Clean) --- */

/* 1. MAIN CONTAINER */
/* 1. MAIN CONTAINER */
/* DESKTOP STYLES (Base) */

.bajhi-chat-interface {
    display: flex;
    height: 100%;
    min-height: 0;
    /* Crucial for nested flex scroll */
    flex: 1;
    overflow: hidden;
    /* Ensure content doesn't spill out */
    flex-direction: row !important;
}

/* 2. SIDEBAR (Desktop Default: Vertical Column on Left) */
#bajhi-chat-sidebar {
    width: 280px !important;
    height: 100% !important;
    background: rgba(0, 0, 0, 0.25);
    border-right: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-bottom: none !important;
    display: flex;
    flex-direction: column !important;
    padding: 15px;
    flex-shrink: 0;
    overflow: hidden;
    /* Inner elements handle scroll */
}

/* 3. NEW CHAT BUTTON (Desktop Default) */
#bajhi-new-chat-btn {
    width: 100% !important;
    background: #8b5cf6;
    color: #fff;
    border: none;
    padding: 12px;
    border-radius: 8px;
    margin-bottom: 12px !important;
    margin-right: 0 !important;
    cursor: pointer;
    font-weight: 600;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 13px;
    flex-shrink: 0;
    transition: background 0.2s;
    position: relative;
    z-index: 10;
    pointer-events: auto !important;
}

#bajhi-new-chat-btn:hover {
    background: #7c3aed;
}

/* 4. CHAT LIST (Desktop Default: Vertical Scroll) */
#bajhi-chat-list {
    display: flex;
    flex-direction: column !important;
    gap: 6px;
    overflow-y: auto;
    overflow-x: hidden;
    flex: 1;
    /* Scrollbar Styling */
    scrollbar-width: thin;
    padding-right: 4px;
}

#bajhi-chat-list::-webkit-scrollbar {
    width: 4px;
}

#bajhi-chat-list::-webkit-scrollbar-thumb {
    background: #555;
    border-radius: 2px;
}

/* Dark Scrollbar for Chat List */
#bajhi-chat-list {
    scrollbar-color: #555 transparent;
}

#bajhi-chat-list::-webkit-scrollbar-thumb {
    background: #444;
    border-radius: 2px;
}

/* SESSION ITEMS (Vertical Style) */
.bajhi-history-session {
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(255, 255, 255, 0.05);
    padding: 10px;
    border-radius: 8px;
    font-size: 13px;
    color: #ccc;
    cursor: pointer;
    transition: background 0.2s;
    width: 100%;
}

.bajhi-history-session:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}

.bajhi-history-session.active {
    background: rgba(139, 92, 246, 0.2);
    border: 1px solid rgba(139, 92, 246, 0.3);
    color: #fff;
}

/* Product Grid Default (Desktop) */
.bajhi-products-grid,
#bajhi-products-wrap {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    width: 100%;
}

/* END DESKTOP STYLES */
/* NUCLEAR CSS FIX FOR MOBILE GRID & CHAT */
@media screen and (max-width: 768px) {

    /* Mobile Flexible Grid Fallback */
    body #bajhi-chat-stream .bajhi-products-grid,
    body #bajhi-chat-stream .products,
    body #bajhi-chat-stream .dokan-products-view,
    body #bajhi-search-results-panel #bajhi-products-wrap,
    body #bajhi-products-wrap,
    body .bajhi-products-grid {
        display: block !important;
        grid-template-columns: unset !important;
    }



    /* Mobile Chat Layout overrides */
    #bajhi-chat-interface {
        flex-direction: column !important;
        /* Stack Vertical */
    }

    #bajhi-chat-sidebar {
        width: 100% !important;
        height: 60px !important;
        min-height: 60px !important;
        flex-direction: row !important;
        /* Horizontal Sidebar on Mobile */
        overflow-x: auto !important;
        /* Scrollable Horizontal */
        overflow-y: hidden !important;
        padding: 10px 15px !important;
        border-right: none !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
        display: flex !important;
    }

    #bajhi-chat-list {
        flex-direction: row !important;
        /* Horizontal List */
        overflow-x: auto !important;
        overflow-y: hidden !important;
        width: auto !important;
        flex: 1 !important;
    }

    #bajhi-new-chat-btn {
        width: auto !important;
        min-width: 100px !important;
        margin-bottom: 0 !important;
        margin-right: 15px !important;
        padding: 0 15px !important;
        display: inline-flex !important;
        align-items: center !important;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2) !important;
        flex: 0 0 auto !important;
    }

    /* Hide History Headers on Mobile to save space */
    #bajhi-chat-list>div[style*="text-transform:uppercase"] {
        display: none !important;
    }

    .bajhi-history-session {
        display: inline-flex !important;
        align-items: center !important;
        width: auto !important;
        max-width: 160px !important;
        margin-bottom: 0 !important;
        margin-right: 10px !important;
        background: rgba(255, 255, 255, 0.08) !important;
        border: 1px solid rgba(255, 255, 255, 0.05) !important;
        flex-shrink: 0 !important;
        height: 36px !important;
        white-space: nowrap !important;
    }

    /* ====== MOBILE CHAT HEADER - COMPLETE REDESIGN ====== */

    /* Profile container - compact horizontal layout */
    #bajhi-profile-container {
        padding: 8px 12px !important;
        gap: 10px !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        flex-wrap: nowrap !important;
        overflow: hidden !important;
    }

    /* Profile avatar - fixed size */
    #bajhi-profile-container img {
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        min-height: 32px !important;
        flex-shrink: 0 !important;
        border-radius: 50% !important;
    }

    /* User info container - take available space */
    #bajhi-profile-container>div:first-child {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        flex: 1 !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    /* Hide username text & "User" label on mobile */
    #bajhi-profile-container>div>div {
        display: none !important;
    }

    /* Files toggle button - consistent icon size */
    #bajhi-files-header-toggle {
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        min-height: 32px !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: 16px !important;
        flex-shrink: 0 !important;
        background: rgba(255, 255, 255, 0.1) !important;
        border-radius: 8px !important;
        border: none !important;
    }

    /* Sidebar header wrapper */
    #bajhi-chat-sidebar>div:first-child {
        padding: 0 !important;
        flex-shrink: 0 !important;
    }

    /* Buttons container - horizontal on mobile */
    #bajhi-chat-sidebar>div:first-child>div:last-child {
        padding: 8px 12px !important;
        display: flex !important;
        flex-direction: row !important;
        gap: 8px !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
    }

    /* New Chat button - icon only, uniform size */
    #bajhi-new-chat-btn {
        width: 36px !important;
        min-width: 36px !important;
        max-width: 36px !important;
        height: 36px !important;
        min-height: 36px !important;
        max-height: 36px !important;
        padding: 0 !important;
        font-size: 0 !important;
        /* Hide text */
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 8px !important;
        flex-shrink: 0 !important;
        background: rgba(59, 130, 246, 0.2) !important;
        border: 1px solid rgba(59, 130, 246, 0.3) !important;
    }

    #bajhi-new-chat-btn i {
        font-size: 14px !important;
        color: #3b82f6 !important;
    }

    /* New Workflow button - icon only on mobile */
    #bajhi-new-workflow-btn-js {
        width: 36px !important;
        min-width: 36px !important;
        max-width: 36px !important;
        height: 36px !important;
        min-height: 36px !important;
        max-height: 36px !important;
        padding: 0 !important;
        font-size: 0 !important;
        /* Hide text */
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 8px !important;
        flex-shrink: 0 !important;
        margin-top: 0 !important;
        background: rgba(255, 255, 255, 0.05) !important;
        border: 1px solid rgba(255, 255, 255, 0.1) !important;
    }

    #bajhi-new-workflow-btn-js i {
        font-size: 14px !important;
        color: #ccc !important;
    }

    /* Connect Apps button - icon only on mobile */
    #bajhi-sidebar-connect-apps-btn {
        width: 36px !important;
        min-width: 36px !important;
        max-width: 36px !important;
        height: 36px !important;
        min-height: 36px !important;
        max-height: 36px !important;
        padding: 0 !important;
        font-size: 0 !important;
        /* Hide text */
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 8px !important;
        flex-shrink: 0 !important;
        margin-top: 0 !important;
    }

    #bajhi-sidebar-connect-apps-btn i {
        font-size: 14px !important;
        width: auto !important;
        text-align: center !important;
    }

    /* Chat list header - ensure chat items display well */
    #bajhi-chat-list {
        padding: 8px !important;
    }

    /* ====== MOBILE HEADER BAR - 5 ICONS ====== */
    #bajhi-mobile-header-bar {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 6px !important;
        padding: 8px !important;
        background: rgba(20, 20, 20, 0.98) !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
        position: sticky !important;
        top: 0 !important;
        z-index: 100 !important;
        flex-shrink: 0 !important;
        box-sizing: border-box !important;
        max-width: 100% !important;
    }

    #bajhi-mobile-header-bar button {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        min-height: 36px !important;
        max-width: 36px !important;
        max-height: 36px !important;
        padding: 0 !important;
        border: none !important;
        border-radius: 10px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        cursor: pointer !important;
        transition: all 0.2s ease !important;
        flex-shrink: 0 !important;
    }

    #bajhi-mobile-header-bar button i {
        font-size: 16px !important;
    }

    /* Liquid glass styling for all icon buttons on mobile header */
    #bajhi-mobile-profile-btn,
    #bajhi-mobile-newchat-btn,
    #bajhi-mobile-workflows-btn,
    #bajhi-mobile-history-btn {
        background: rgba(255, 255, 255, 0.1) !important;
        backdrop-filter: blur(10px) !important;
        -webkit-backdrop-filter: blur(10px) !important;
        border: 1px solid rgba(255, 255, 255, 0.2) !important;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
    }

    #bajhi-mobile-profile-btn i,
    #bajhi-mobile-newchat-btn i,
    #bajhi-mobile-workflows-btn i,
    #bajhi-mobile-history-btn i {
        color: #fff !important;
    }

    /* Files /Sidebar Toggle button - content will be dynamic */
    #bajhi-mobile-files-btn {
        background: transparent !important;
        width: auto !important;
        height: auto !important;
        min-width: unset !important;
        min-height: unset !important;
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        padding: 0 !important;
        margin-right: auto !important;
    }

    #bajhi-mobile-files-btn img {
        width: 36px !important;
        height: 36px !important;
        border-radius: 50% !important;
        border: 1.5px solid rgba(255, 255, 255, 0.2) !important;
    }

    #bajhi-mobile-files-btn .user-meta {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        line-height: 1.2 !important;
        max-width: 90px !important;
        overflow: hidden !important;
    }

    #bajhi-mobile-files-btn .user-name,
    #bajhi-mobile-files-btn .user-plan {
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        max-width: 100% !important;
    }

    /* Close Chat button - liquid glass */
    #bajhi-mobile-close-btn {
        background: rgba(255, 255, 255, 0.1) !important;
        backdrop-filter: blur(10px) !important;
        -webkit-backdrop-filter: blur(10px) !important;
        border: 1px solid rgba(255, 255, 255, 0.2) !important;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
    }

    #bajhi-mobile-close-btn i {
        color: #fff !important;
    }

    #bajhi-mobile-files-btn .user-name {
        font-size: 13px !important;
        font-weight: 600 !important;
        color: #fff !important;
    }

    #bajhi-mobile-files-btn .user-plan {
        font-size: 10px !important;
        color: #888 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
    }

    /* Active state for toggle buttons */
    #bajhi-mobile-header-bar button.active {
        transform: scale(1.05) !important;
        box-shadow: 0 0 10px rgba(255, 255, 255, 0.2) !important;
    }

    /* Hide original right sidebar toggle button on mobile */
    #bajhi-search-results-panel>#bajhi-custom-files-toggle {
        display: none !important;
    }

    /* Hide original sidebar header on mobile since we have the new header bar */
    #bajhi-chat-sidebar>div:first-child {
        display: none !important;
    }

    /* Mobile sidebar - slide in from left */
    #bajhi-chat-sidebar {
        position: absolute !important;
        left: 0 !important;
        top: 0 !important;
        width: 180px !important;
        max-width: 48% !important;
        height: 100% !important;
        bottom: 0 !important;
        z-index: 2147483647 !important;
        background: #0f172a !important;
        /* Ensure solid background */
        transform: translateX(-100%) !important;
        transition: transform 0.3s ease !important;
    }

    @media screen and (max-width: 768px) {

        /* FIX IMAGE ICON ALIGNMENT ON MOBILE RESULTS */
        .wdm-card-v5 .product-image-link {
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
            overflow: hidden !important;
            aspect-ratio: 1/1 !important;
        }

        .wdm-card-v5 .product-image-link img {
            width: 100% !important;
            height: 100% !important;
            object-fit: cover !important;
        }
    }

    #bajhi-chat-sidebar.mobile-visible {
        transform: translateX(0) !important;
        z-index: 2147483647 !important;
        /* Force sidebar to top */
    }

    /* Show original header in sidebar when opened */
    #bajhi-chat-sidebar.mobile-visible>div:first-child {
        display: block !important;
        padding-top: 15px !important;
    }

    #bajhi-mobile-sidebar-overlay {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        background: rgba(0, 0, 0, 0.5) !important;
        z-index: 99998 !important;
        display: none !important;
    }

    /* Mobile Chat List Fix */
    #bajhi-chat-list {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        height: auto !important;
        overflow-y: auto !important;
        display: flex !important;
        flex-direction: column !important;
    }
}

#bajhi-mobile-sidebar-overlay.visible {
    display: block !important;
}

/* ====== REDUCED CONVERSATION PADDING ====== */
#bajhi-chat-stream {
    padding-left: 8px !important;
    padding-right: 8px !important;
}

#bajhi-chat-messages {
    padding-left: 6px !important;
    padding-right: 6px !important;
}

.bajhi-message-row {
    padding-left: 4px !important;
    padding-right: 4px !important;
}

/* Reduce input area padding */
#bajhi-sticky-input-wrapper,
.bajhi-input-wrapper {
    padding-left: 8px !important;
    padding-right: 8px !important;
}





/* FIX: Stats Overlap - Make it sticky at bottom */
.bajhi-user-stats-block {
    /* Sticky removed */
    background: #0a0a0a !important;
    z-index: 50 !important;
    width: 100% !important;
    box-shadow: 0 -5px 15px rgba(0, 0, 0, 0.5) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.15) !important;
}

/* FIX: Text Padding from Icon */
/* FIX: Text Padding from Icon & Width */
.bajhi-chat-message .bajhi-chat-bubble,
.bajhi-chat-message .bajhi-chat-bubble-content {
    max-width: 100% !important;
    width: auto !important;
    display: block !important;
    font-size: 17px !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
}

.bajhi-chat-message.user .bajhi-chat-bubble,
.bajhi-chat-message.ai .bajhi-chat-bubble,
.bajhi-chat-message.ai .bajhi-chat-bubble-content {
    margin: 0 !important;
    width: auto !important;
    display: inline-block !important;
}

/* MOBILE REFINEMENTS: Full width & Top avatars */
@media screen and (max-width: 768px) {
    #bajhi-chat-inner-stream {
        padding: 10px !important;
    }

    .bajhi-chat-message {
        display: flex !important;
        flex-direction: row !important;
        width: auto !important;
        max-width: 90% !important;
        margin-bottom: 20px !important;
        align-items: flex-start !important;
        /* Avatar top-aligned with text */
        padding: 0 !important;
        background: none !important;
        border: none !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
        position: relative !important;
    }

    .bajhi-chat-message.ai {
        align-self: flex-start !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .bajhi-chat-message.user {
        flex-direction: row !important;
        justify-content: flex-end !important;
        align-self: flex-end !important;
        align-items: flex-end !important;
        /* User avatar bottom-aligned */
        margin-right: 0 !important;
        margin-left: auto !important;
    }

    /* AI avatar: smaller on mobile */
    .bajhi-chat-avatar {
        position: static !important;
        width: 20px !important;
        height: 20px !important;
        min-width: 20px !important;
        margin-bottom: 0 !important;
        transform: none !important;
        flex-shrink: 0 !important;
        margin-right: 6px !important;
        margin-left: 0 !important;
    }

    .bajhi-chat-message.user .bajhi-chat-avatar {
        margin-left: 6px !important;
        margin-right: 0 !important;
    }

    /* AI bubble: standard width */
    .bajhi-chat-bubble {
        max-width: 100% !important;
        margin: 0 !important;
        padding: 8px 12px !important;
        border-radius: 14px !important;
        box-sizing: border-box !important;
        float: none !important;
        font-size: 14px !important;
        line-height: 1.5 !important;
    }

    .bajhi-chat-message.user .bajhi-chat-bubble {
        background: transparent !important;
        color: #94a3b8 !important;
        border-radius: 0 !important;
        border: none !important;
        box-shadow: none !important;
    }

    .bajhi-chat-message.ai .bajhi-chat-bubble {
        background: rgba(255, 255, 255, 0.05) !important;
        border-radius: 14px 14px 14px 4px !important;
    }

    /* Resume chat container - compact on mobile */
    #bajhi-resume-chat-container {
        display: inline-flex !important;
        align-items: center !important;
        margin-top: 4px !important;
    }

    #bajhi-resume-chat-container .bajhi-resume-btn {
        padding: 2px 6px !important;
        font-size: 10px !important;
        margin-left: 4px !important;
        border-radius: 4px !important;
    }
}


#bajhi-sticky-bottom .bajhi-glass-box {
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}


/* Fix Mobile "Below Screen" by ensuring high z-index and bottom placement */
@media screen and (max-width: 768px) {
    #bajhi-sticky-bottom {
        bottom: 0 !important;
        z-index: 2147483647 !important;
        /* MAX Z-INDEX */
        padding-bottom: env(safe-area-inset-bottom, 10px) !important;
        background: transparent !important;
        /* REMOVED BACKGROUND */
        /* pointer-events: none !important; */
        /* Ensure clicks pass through empty areas */
    }
}


/* Blinking Cursor for Input */
@keyframes bajhi-blink {

    0%,
    100% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }
}

#bajhi-fake-typing-cursor {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: #fff;
    font-size: 18px;
    font-weight: 300;
    pointer-events: none;
    animation: bajhi-blink 1s infinite;
    z-index: 15;
    display: none;
    /* Controlled by JS */
}

/* Mobile Padding Fixes */
@media only screen and (max-width: 768px) {

    #bajhi-chat-inner-stream,
    .bajhi-sidebar-content {
        padding-bottom: 80px !important;
        /* Ensure content clears widget */
    }

    /* Raise Better Messages Icon */
    #bp-better-messages-chat-icon,
    .bp-better-messages-chat-icon {
        bottom: 90px !important;
        /* Move above search widget substantially */
    }
}

/* FORCE TRANSPARENT BACKGROUNDS on Input */
#bajhi-sticky-input-wrap,
#bajhi-sticky-input-wrap textarea,
.bajhi-search-input-wrapper,
.bajhi-search-input-wrapper textarea {
    background-color: transparent !important;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    -webkit-appearance: none;
    appearance: none;
}

/* Ensure Typing Cursor is visible and blinking */
#bajhi-fake-typing-cursor {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: #fff;
    font-size: 18px;
    font-weight: 300;
    pointer-events: none;
    animation: bajhi-blink 1s infinite;
    z-index: 9999;
    display: none;
    /* JS toggles this */
    line-height: 1;
}

@keyframes bajhi-blink {

    0%,
    100% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }
}



/* FIX: Force Mobile Icons Visibility */
@media only screen and (max-width: 600px) {

    #bajhi-voice-btn,
    #bajhi-file-trigger,
    #bajhi-ai-menu-btn,
    .bajhi-search-toolbar button,
    .bajhi-search-toolbar label {
        display: inline-flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        color: #999 !important;
        /* Ensure contrast */
    }

    #bajhi-sticky-submit {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* FIX: Ensure the CONTAINER is visible too */
    .bajhi-search-toolbar {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        height: auto !important;
    }

    #bajhi-sticky-submit {
        display: flex !important;
    }
}


/* Chip Styling used in Rich Input */
.bajhi-placeholder-chip {
    background: rgba(99, 102, 241, 0.2);
    color: #a5b4fc;
    border: 1px dashed rgba(99, 102, 241, 0.6);
    border-radius: 4px;
    padding: 2px 6px;
    margin: 0 2px;
    cursor: text;
    display: inline-block;
    vertical-align: middle;
}

.bajhi-placeholder-chip:hover,
.bajhi-placeholder-chip:focus {
    background: rgba(99, 102, 241, 0.4);
    border-color: #a5b4fc;
    outline: none;
}

/* Hide textarea when rich input is active */
.bajhi-search-input-wrapper.rich-mode #bajhi-sticky-input {
    display: none !important;
}

.bajhi-search-input-wrapper.rich-mode #bajhi-rich-input {
    display: block !important;
}


#bajhi-agent-checkbox:checked+#bajhi-agent-pill {
    background: rgba(255, 255, 255, 0.15) !important;
}


/* HIDE duplicate plug icon that gets injected before search input */
#bajhi-plug-btn {
    display: none !important;
}

/* Ensure ALL toolbar icons have consistent blue box styling */
#bajhi-ai-menu-btn,
#bajhi-file-trigger,
#bajhi-schedule-btn,
#bajhi-recurring-btn,
#bajhi-guest-plug-btn,
#bajhi-voice-btn,
#bajhi-sticky-submit {
    background: rgba(255, 255, 255, 0.05) !important;
    border: none !important;
    color: #fff !important;
    font-size: 14px !important;
    cursor: pointer !important;
    padding: 0 !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 32px !important;
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    flex-shrink: 0 !important;
    transition: all 0.2s ease;
}

#bajhi-sticky-submit.bajhi-stop-btn {
    background: #ef4444 !important;
    /* Red */
}

#bajhi-sticky-submit.bajhi-stop-btn i {
    color: #fff !important;
}

/* Agent toggle pill - wider for text */
#bajhi-agent-pill {
    background: rgba(255, 255, 255, 0.05) !important;
    border: none !important;
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    padding: 0 16px !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    min-width: 75px !important;
    border-radius: 8px !important;
    white-space: nowrap !important;
    transition: all 0.2s ease !important;
    flex-shrink: 0 !important;
}

#bajhi-agent-checkbox:checked+#bajhi-agent-pill {
    background: linear-gradient(135deg, #8b5cf6, #6366f1) !important;
}

/* Ensure icon colors inside buttons */
#bajhi-ai-menu-btn i,
#bajhi-file-trigger i,
#bajhi-schedule-btn i,
#bajhi-recurring-btn i,
#bajhi-guest-plug-btn i,
#bajhi-voice-btn i,
#bajhi-sticky-submit i,
#bajhi-agent-pill i {
    color: #fff !important;
    font-size: 14px !important;
    line-height: 1 !important;
}


@media (min-width: 769px) {}


#bajhi-sticky-input:focus,
#bajhi-sticky-input:active {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* Remove old overrides that might conflict */
.bajhi-search-input-wrapper {
    border: none !important;
    background: transparent !important;
}

/* FORCE ICONS ON MOBILE */
/* FORCE ICONS ON MOBILE */
@media screen and (max-width: 768px) {
    #bajhi-sticky-input-wrap {
        border: none !important;
        box-shadow: none !important;
    }

    /* Redundant saftey */


    .bajhi-glass-box {
        padding: 8px 10px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
    }

}

/* MODAL SAFETY: Ensure they are hidden by default unless JS shows them */
#bajhi-schedule-modal,
#bajhi-recurring-modal,
#bajhi-tasks-list-modal {
    display: none;
}


#bajhi-sticky-input:focus,
#bajhi-sticky-input:active {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

.bajhi-mention-item:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    color: #fff !important;
}

input[name="username"].woocommerce-Input {
    background-color: #1a1a1a !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.bajhi-post-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 10px;
    border-radius: 5px;
    background-color: #8b5cf6;
    /* Purple */
    color: white;
    text-decoration: none;
    font-size: 12px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.bajhi-post-btn:hover {
    background-color: #7c3aed;
    /* Darker purple */
}

.bajhi-community-iframe-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 99999;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.bajhi-community-iframe-container.active {
    opacity: 1;
    visibility: visible;
}

.bajhi-community-iframe-container iframe {
    border: none;
    border-radius: 10px;
    width: 90%;
    height: 90%;
    max-width: 800px;
    max-height: 600px;
    background: white;
    /* Ensure iframe background is white */
}

.bajhi-community-iframe-container .close-btn {
    position: absolute;
    top: 20px;
    right: 20px;
    background: white;
    border: none;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
    cursor: pointer;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}


/* Desktop Grid Layout - Full Width Aware */
#bajhi-chat-interface.bajhi-chat-search-results {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}

/* 3-Column Grid for Desktop, 1-Column for Mobile */
.bajhi-products-grid.grid-mode {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 15px !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
}


@media (max-width: 768px) {
    .bajhi-products-grid.grid-mode {
        grid-template-columns: 1fr !important;
    }
}

/* Query Folding */
.bajhi-query-container {
    position: relative;
    margin-bottom: 2px;
}
.bajhi-folded-query {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.5;
    transition: max-height 0.3s ease;
}
.bajhi-folded-query.expanded {
    -webkit-line-clamp: unset;
}
.bajhi-query-toggle-btn {
    background: transparent !important;
    border: none !important;
    color: rgba(255, 255, 255, 0.4) !important;
    font-size: 14px !important;
    cursor: pointer !important;
    padding: 2px !important;
    margin: 4px auto 0 auto !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    width: 100%;
}
.bajhi-query-toggle-btn:hover {
    color: rgba(255, 255, 255, 0.8) !important;
}
.bajhi-query-toggle-btn i {
    transition: transform 0.3s ease;
}
.bajhi-query-toggle-btn.expanded i {
    transform: rotate(180deg);
}

/* Spinner Removal overrides */
.bajhi-thinking-stream i.fa-spinner {
    display: none !important;
}

/* --- Agent Thinking Shimmer (Wave) --- */
@keyframes bajhi-shimmer {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

.bajhi-thinking-stream {
    background: linear-gradient(90deg, 
        rgba(59, 130, 246, 0.8) 0%, 
        rgba(139, 92, 246, 0.9) 25%, 
        rgba(236, 72, 153, 0.8) 50%, 
        rgba(139, 92, 246, 0.9) 75%, 
        rgba(59, 130, 246, 0.8) 100%
    );
    background-size: 200% auto;
    color: transparent !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    animation: bajhi-shimmer 2s linear infinite;
    font-weight: 600;
    display: inline-block;
}

/* Horizontal File Links Chip Style */
.bajhi-chat-files-response {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin-top: 12px !important;
}

.bajhi-file-chip {
    color: #94a3b8 !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    padding: 4px 10px !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    transition: all 0.2s ease !important;
}

.bajhi-file-chip:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}

#bajhi-chat-interface {
    display: grid !important;
    grid-template-columns: 260px 1fr 260px;
    height: 90vh;
    width: calc(100% - 60px) !important;
    overflow: hidden;
    background: #13151a;
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 14px;
    position: fixed !important;
    top: 5vh !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    right: auto !important;
    bottom: auto !important;
    z-index: 99999 !important;
    box-shadow: 0 32px 80px rgba(0, 0, 0, 0.7);
    /* Safari: prevent auto text-size inflation when page is zoomed out */
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

/* Safari font-size clamp for chat text elements */
#bajhi-chat-interface .bajhi-chat-text,
#bajhi-chat-interface .bajhi-chat-bubble,
#bajhi-chat-interface .bajhi-chat-message,
#bajhi-chat-interface textarea,
#bajhi-chat-interface input {
    font-size: clamp(13px, 1rem, 16px) !important;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

/* Desktop Controls Styling */
#bajhi-chat-desktop-controls {
    display: flex;
}

@media (max-width: 768px) {
    #bajhi-chat-desktop-controls {
        display: none !important;
    }
}

.bajhi-desktop-btn {
    transition: all 0.2s ease;
}

.bajhi-desktop-btn:hover {
    background: rgba(255, 255, 255, 0.2) !important;
    transform: translateY(-1px);
}


/* Sidebar Management - Desktop */
#bajhi-chat-interface.sidebar-collapsed {
    grid-template-columns: 70px 1fr 70px !important;
}

#bajhi-chat-interface.preview-active {
    grid-template-columns: 70px 1fr 70px !important;
}

#bajhi-chat-interface.sidebar-collapsed #bajhi-chat-sidebar,
#bajhi-chat-interface.preview-active #bajhi-chat-sidebar {
    width: 70px !important;
    opacity: 1 !important;
    overflow: hidden !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 1001;
    background: transparent;
}

#bajhi-chat-interface.preview-active #bajhi-chat-right-sidebar {
    opacity: 1 !important;
    display: flex !important;
    border-left: 1px solid #2d2d2d !important;
}

/* Hovering effects removed for fixed workspace layout */

/* Hide labels and UI noise in mini-mode */
/* Labels and UI noise always visible in Workspace mode */
#bajhi-chat-interface.sidebar-collapsed #bajhi-chat-sidebar #bajhi-plan-section-styled,
#bajhi-chat-interface.sidebar-collapsed #bajhi-chat-sidebar .user-name,
#bajhi-chat-interface.sidebar-collapsed #bajhi-chat-sidebar .user-plan,
#bajhi-chat-interface.sidebar-collapsed #bajhi-chat-sidebar .bajhi-sidebar-content,
#bajhi-chat-interface.preview-active .bajhi-chat-right-sidebar span,
#bajhi-chat-interface.preview-active .bajhi-chat-right-sidebar #bajhi-sidebar-menus .bajhi-category-btn div,
#bajhi-chat-interface.preview-active .bajhi-chat-right-sidebar #bajhi-files-list {
    opacity: 1 !important;
    display: flex !important;
    pointer-events: auto !important;
}

#bajhi-chat-interface.sidebar-collapsed #bajhi-chat-sidebar:hover #bajhi-plan-section-styled,
#bajhi-chat-interface.sidebar-collapsed #bajhi-chat-sidebar:hover .bajhi-sidebar-content,
#bajhi-chat-interface.preview-active #bajhi-chat-sidebar:hover #bajhi-plan-section-styled,
#bajhi-chat-interface.preview-active #bajhi-chat-sidebar:hover .bajhi-sidebar-content,
#bajhi-chat-interface.preview-active .bajhi-chat-right-sidebar:hover span,
#bajhi-chat-interface.preview-active .bajhi-chat-right-sidebar:hover #bajhi-sidebar-menus .bajhi-category-btn div,
#bajhi-chat-interface.preview-active .bajhi-chat-right-sidebar:hover #bajhi-files-list,
#bajhi-chat-interface.sidebar-collapsed .bajhi-chat-right-sidebar:hover span,
#bajhi-chat-interface.sidebar-collapsed .bajhi-chat-right-sidebar:hover #bajhi-sidebar-menus .bajhi-category-btn div,
#bajhi-chat-interface.sidebar-collapsed .bajhi-chat-right-sidebar:hover #bajhi-files-list {
    opacity: 1;
    pointer-events: auto;
}

#bajhi-chat-interface.sidebar-collapsed #bajhi-chat-sidebar:hover #bajhi-plan-section-styled,
#bajhi-chat-interface.sidebar-collapsed #bajhi-chat-sidebar:hover .user-name,
#bajhi-chat-interface.sidebar-collapsed #bajhi-chat-sidebar:hover .user-plan,
#bajhi-chat-interface.sidebar-collapsed #bajhi-chat-sidebar:hover .bajhi-sidebar-content {
    opacity: 1;
    pointer-events: auto;
}

/* Transition for all buttons in sidebar */
#bajhi-chat-interface #bajhi-chat-sidebar button {
    transition: all 0.2s;
    overflow: hidden;
    white-space: nowrap;
}

/* No font-size hiding in Workspace mode */
#bajhi-chat-interface.sidebar-collapsed #bajhi-chat-sidebar button,
#bajhi-chat-interface.preview-active #bajhi-chat-sidebar button {
    font-size: 13px !important;
    width: 100% !important;
    height: auto !important;
}

#bajhi-chat-interface.preview-active .bajhi-chat-right-sidebar button,
#bajhi-chat-interface.preview-active .bajhi-file-item {
    font-size: 0 !important;
    width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 10px 12px 10px auto !important;
    /* Flush right */
    border-radius: 8px !important;
}

#bajhi-chat-interface.sidebar-collapsed #bajhi-chat-sidebar button i,
#bajhi-chat-interface.preview-active #bajhi-chat-sidebar button i,
#bajhi-chat-interface.preview-active .bajhi-chat-right-sidebar button i,
#bajhi-chat-interface.preview-active .bajhi-file-item i {
    font-size: 18px !important;
    margin: 0 !important;
    display: block !important;
}

#bajhi-chat-interface.sidebar-collapsed #bajhi-chat-sidebar:hover button,
#bajhi-chat-interface.preview-active #bajhi-chat-sidebar:hover button {
    font-size: 13px !important;
    width: 100% !important;
    height: auto !important;
    padding: 10px !important;
    justify-content: flex-start !important;
    margin: 8px 0 !important;
}

#bajhi-chat-interface.preview-active .bajhi-chat-right-sidebar:hover button,
#bajhi-chat-interface.preview-active .bajhi-chat-right-sidebar:hover .bajhi-file-item {
    font-size: 13px !important;
    width: 100% !important;
    height: auto !important;
    padding: 10px !important;
    justify-content: flex-start !important;
    margin: 8px 0 !important;
}

#bajhi-chat-interface.sidebar-collapsed #bajhi-chat-sidebar:hover button i,
#bajhi-chat-interface.preview-active #bajhi-chat-sidebar:hover button i,
#bajhi-chat-interface.preview-active .bajhi-chat-right-sidebar:hover button i,
#bajhi-chat-interface.preview-active .bajhi-chat-right-sidebar:hover .bajhi-file-item i {
    margin-right: 10px !important;
    margin-left: 0 !important;
}

/* Preview Header Actions */
.bajhi-preview-header-actions {
    display: flex;
    gap: 10px;
    align-items: center;
}

.bajhi-preview-btn {
    background: none !important;
    border: none !important;
    color: #fff !important;
    padding: 2px 6px;
    font-size: 24px;
    /* Even bigger icons */
    cursor: pointer;
    display: flex;
    align-items: center;
    transition: 0.2s;
    box-shadow: none !important;
}

.bajhi-preview-btn:hover {
    opacity: 0.7;
    transform: scale(1.1);
}

.bajhi-preview-btn.save {
    background: none !important;
    border: none !important;
    color: #fff !important;
}

.bajhi-preview-editor-textarea {
    flex: 1;
    width: 100%;
    background: #111318;
    color: #d4d4d4;
    border: none;
    padding: 20px;
    font-family: 'Fira Code', 'Consolas', monospace;
    font-size: 13px;
    line-height: 1.6;
    resize: none;
    outline: none;
    display: none;
}

#bajhi-chat-interface.sidebar-collapsed #bajhi-chat-sidebar:hover button {
    text-indent: 0;
    width: 100% !important;
    height: auto !important;
    padding: 8px !important;
    justify-content: flex-start !important;
    margin: 10px 0 !important;
}

#bajhi-chat-interface.sidebar-collapsed #bajhi-chat-sidebar:hover button i {
    margin-right: 8px !important;
}

/* 50/50 Split & Auto-Collapse Sidebars for Preview */
#bajhi-chat-interface.preview-active {
    width: 100% !important;
    max-width: none !important;
    max-height: 100vh !important;
    height: 100vh !important;
    top: 0 !important;
    left: 0 !important;
    transform: none !important;
    border-radius: 0 !important;
}

#bajhi-chat-interface.preview-active #bajhi-file-preview-panel {
    width: 50% !important;
    display: flex !important;
}

@media (max-width: 768px) {
    #bajhi-chat-interface.preview-active #bajhi-file-preview-panel {
        width: 100% !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        height: 100% !important;
        z-index: 100001 !important;
    }
}

/* Full-screen body lock when chat open */
body.bajhi-chat-open {
    overflow: hidden !important;
}

#bajhi-chat-interface.sidebar-collapsed .bajhi-chat-right-sidebar {
    width: 70px !important;
    opacity: 1 !important;
    border-left: 1px solid rgba(255, 255, 255, 0.05) !important;
}

/* Sidebar Toggle Button (Inside stream header) */
#bajhi-sidebar-toggle-btn {
    position: absolute;
    top: 15px;
    left: 15px;
    z-index: 100;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: #fff;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
}

#bajhi-chat-list .bajhi-history-session:hover {
    background: rgba(255, 255, 255, 0.1);
}

/* Unified Mobile Aesthetics */
@media (max-width: 768px) {

    #bajhi-chat-sidebar,
    .bajhi-chat-right-sidebar {
        backdrop-filter: blur(14px) !important;
        background: rgba(15, 23, 42, 0.8) !important;
        border-left: 1px solid rgba(255, 255, 255, 0.1) !important;
        border-right: 1px solid rgba(255, 255, 255, 0.1) !important;
    }

    #bajhi-chat-interface i {
        color: #e2e8f0 !important;
        /* Unified Icon Color */
        filter: drop-shadow(0 0 5px rgba(167, 139, 250, 0.3)) !important;
    }

    .bajhi-chat-message {
        background: transparent !important;
        /* Remove outer background on mobile */
        backdrop-filter: none !important;
        border: none !important;
        border-radius: 0 !important;
        padding: 0 !important;
        margin-bottom: 20px !important;
        box-shadow: none !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: flex-start !important;
        gap: 12px !important;
    }

    .bajhi-chat-bubble {
        background: rgba(255, 255, 255, 0.1) !important;
        backdrop-filter: blur(12px) !important;
        padding: 12px 16px !important;
        width: auto !important;
        max-width: 85% !important;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important;
    }

    .bajhi-chat-message.user {
        flex-direction: row !important;
        justify-content: flex-end !important;
        align-items: flex-end !important;
        margin-left: auto !important;
        margin-right: 0 !important;
        max-width: 100% !important;
        /* Override desktop 85% */
    }

    .bajhi-chat-message.user .bajhi-chat-bubble {
        order: 1 !important;
    }

    .bajhi-chat-message.user .bajhi-chat-avatar {
        order: 2 !important;
        margin-left: 8px !important;
        margin-right: 0 !important;
    }

    .bajhi-chat-message.user .bajhi-chat-bubble {
        background: transparent !important;
        border: none !important;
        color: #94a3b8 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        text-align: right !important;
    }

    .bajhi-chat-message.ai {
        align-items: flex-start !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100% !important;
        /* Override desktop 85% */
    }

    .bajhi-chat-message.ai .bajhi-chat-bubble {
        border-radius: 2px 14px 14px 14px !important;
    }

    .bajhi-chat-avatar {
        width: 20px !important;
        height: 20px !important;
        border-radius: 50% !important;
        border: 1px solid rgba(255, 255, 255, 0.1) !important;
        background-color: transparent !important;
        /* Fix double background */
        margin-bottom: 4px !important;
    }

    .bajhi-chat-avatar.user-avatar {
        background-color: transparent !important;
    }

    #bajhi-sticky-bottom {
        backdrop-filter: blur(12px) !important;
        background: rgba(15, 23, 42, 0.95) !important;
        margin-top: 0 !important;
        border-top: 1px solid rgba(255, 255, 255, 0.15) !important;
        padding-bottom: env(safe-area-inset-bottom, 10px) !important;
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        z-index: 99 !important;
    }
}

/* Chat Stream (Middle) */
#bajhi-sidebar-toggle-btn:hover {
    background: rgba(255, 255, 255, 0.2);
}

/* Chat Stream (Middle) */
#bajhi-chat-stream {
    grid-column: 2;
    display: flex !important;
    flex-direction: row !important;
    /* Force side-by-side */
    height: 100% !important;
    width: 100% !important;
    overflow: hidden !important;
    position: relative;
    background: #13151a;
    margin: 0 !important;
    padding: 0 !important;
}

/* Left Sidebar */
#bajhi-chat-sidebar {
    grid-column: 1;
    border-right: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

/* FIX: Mobile Stream Visibility & Flex */
/* Ensure inner stream allows content to expand */
#bajhi-chat-inner-stream {
    flex: 1 1 auto !important;
    padding: 28px 32px !important;
    overflow-y: auto !important;
    scroll-behavior: smooth;
    min-height: 0 !important;
    display: flex;
    flex-direction: column;
    background: #13151a;
    font-size: 17px;
    color: #e0e0e0;
}

/* Right Sidebar (Files) - Desktop */
.bajhi-chat-right-sidebar {
    grid-column: 3;
    width: 300px !important;
    min-width: 300px !important;
    overflow-y: auto;
    overflow-x: hidden;
    border-left: 1px solid rgba(255, 255, 255, 0.08);
    background: #111318;
    display: flex;
    flex-direction: column;
    flex-shrink: 0 !important;
}

.bajhi-chat-right-sidebar.active {
    width: 700px !important;
}

/* Fix grid when open */
/* Desktop Sidebar widths */
#bajhi-chat-sidebar {
    width: 260px;
}

.bajhi-chat-right-sidebar {
    width: 300px;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    #bajhi-chat-interface.sidebar-collapsed #bajhi-chat-sidebar {
        display: none !important;
    }

    #bajhi-chat-interface {
        display: flex !important;
        flex-direction: column !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        padding-bottom: 0 !important;
        border-radius: 0 !important;
        border: none !important;
    }

    #bajhi-chat-sidebar {
        height: auto;
        max-height: 60px;
        /* Collapsed header only? Or just allow full functionality */
        flex-shrink: 0;
    }

    #bajhi-chat-stream {
        flex: 1 !important;
        width: 100% !important;
    }

    .bajhi-chat-message {
        margin-bottom: 8px !important;
    }

    #bajhi-chat-interface svg,
    #bajhi-sticky-bottom svg,
    .bajhi-message-actions svg {
        color: #e2e8f0 !important;
        fill: #e2e8f0 !important;
    }

    /* Mobile Drawer for Files */
    .bajhi-chat-right-sidebar {
        position: fixed !important;
        top: 0;
        right: 0;
        bottom: 0;
        width: 85% !important;
        max-width: 320px;
        z-index: 1000;
        transform: translateX(100%);
        transition: transform 0.3s ease;
        border-left: 1px solid #333;
        height: 100% !important;
    }

    .bajhi-chat-right-sidebar.active {
        width: 85% !important;
        /* Override desktop width */
        transform: translateX(0);
    }

    /* Overlay when files open */
    /* Overlay completely hidden - use pointer-events:none to not interfere with layout */
    .bajhi-files-overlay {
        display: none !important;
        visibility: hidden !important;
        /* pointer-events: none !important; */
        position: absolute !important;
        width: 0 !important;
        height: 0 !important;
    }

    .bajhi-files-overlay.active {
        display: block;
    }

    .bajhi-related-agents-grid::-webkit-scrollbar {
        display: none;
    }

    .bajhi-related-agents-grid {
        -ms-overflow-style: none;
        scrollbar-width: none;
    }

    .bajhi-community-preview-block iframe {
        background: white;
    }

    .bajhi-community-preview-block {
        margin-bottom: 15px;
    }
}

/* Community Post Preview Enhancements */
.bajhi-community-iframe-trigger:hover {
    background: rgba(59, 130, 246, 0.05) !important;
    text-shadow: 0 0 10px rgba(59, 130, 246, 0.5);
}

.bajhi-community-preview-block iframe {
    transition: box-shadow 0.3s ease;
}

.bajhi-community-preview-block:hover iframe {
    box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.5);
}

/* Load More Button Styling */
.bajhi-load-more-btn {
    background: #3b82f6 !important;
    border: none !important;
    color: #fff !important;
    padding: 8px 20px !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    margin: 10px 0 !important;
}

.bajhi-load-more-btn:hover {
    background: #2563eb !important;
    transform: translateY(-2px) !important;
}

.bajhi-load-more-btn-minimal {
    background: transparent !important;
    border: none !important;
    color: #64748b !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    cursor: pointer !important;
    text-decoration: none !important;
    padding: 5px 10px !important;
    transition: all 0.2s ease !important;
    opacity: 0.7;
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
}

.bajhi-load-more-btn-minimal:hover {
    opacity: 1;
    color: #3b82f6 !important;
}

.bajhi-chat-search-results {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}

.bajhi-products-grid.grid-mode {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 15px !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
}

.grid-mode .wdm-card-v5 {
    padding: 10px !important;
    border-radius: 12px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    margin: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

@media (max-width: 768px) {
    .bajhi-products-grid.grid-mode {
        grid-template-columns: 1fr !important;
    }
}