/**
 * SmokyAI - Vape Theme Colors
 * Special color scheme for vape/smoking products
 */

/* Vape-inspired color palette */
:root {
    /* Vape/Smoke themed colors */
    --smokyai-vape-primary: #6a5acd;      /* Slate blue - vape vapor */
    --smokyai-vape-secondary: #9370db;     /* Medium slate blue */
    --smokyai-vape-accent: #20b2aa;        /* Light sea green - menthol */
    --smokyai-vape-warning: #ff6347;       /* Tomato - nicotine warning */
    --smokyai-vape-success: #32cd32;       /* Lime green - fresh */
    
    /* Smoke/vapor gradients */
    --smokyai-vapor-gradient: linear-gradient(135deg, #6a5acd 0%, #9370db 50%, #20b2aa 100%);
    --smokyai-smoke-gradient: linear-gradient(135deg, #2c3e50 0%, #34495e 50%, #5d6d7e 100%);
    --smokyai-menthol-gradient: linear-gradient(135deg, #20b2aa 0%, #48cae4 100%);
    --smokyai-nicotine-gradient: linear-gradient(135deg, #ff6347 0%, #ff7f50 100%);
}

/* Vape theme specific styling */
.smokyai-vape-theme {
    --smokyai-primary-color: var(--smokyai-vape-primary);
    --smokyai-primary-hover: #5a4fcf;
    --smokyai-accent-color: var(--smokyai-vape-accent);
    --smokyai-success-color: var(--smokyai-vape-success);
    --smokyai-warning-color: var(--smokyai-vape-warning);
}

/* Enhanced toggle button with vapor effect */
.smokyai-vape-theme .smokyai-chat-toggle {
    background: var(--smokyai-vapor-gradient);
    position: relative;
    overflow: hidden;
}

.smokyai-vape-theme .smokyai-chat-toggle::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);
    animation: vaporFloat 4s ease-in-out infinite;
    pointer-events: none;
}

@keyframes vaporFloat {
    0%, 100% { 
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.3;
    }
    50% { 
        transform: translate(-30%, -30%) scale(1.2);
        opacity: 0.1;
    }
}

/* Chat header with vape theme */
.smokyai-vape-theme .smokyai-chat-header {
    background: var(--smokyai-vapor-gradient);
    position: relative;
}

.smokyai-vape-theme .smokyai-chat-header::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><filter id="wave"><feTurbulence baseFrequency="0.02" numOctaves="3"/><feColorMatrix values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.1 0"/></filter></defs><rect width="100" height="100" filter="url(%23wave)"/></svg>');
    opacity: 0.3;
    pointer-events: none;
}

/* User messages with vape styling */
.smokyai-vape-theme .smokyai-message.user .smokyai-message-content {
    background: var(--smokyai-vapor-gradient);
    position: relative;
}

.smokyai-vape-theme .smokyai-message.user .smokyai-message-content::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 20px;
    height: 20px;
    background: radial-gradient(circle, rgba(255,255,255,0.3) 0%, transparent 70%);
    border-radius: 50%;
    animation: vaporBubble 2s ease-in-out infinite;
}

@keyframes vaporBubble {
    0%, 100% { 
        transform: scale(1) translateY(0);
        opacity: 0.6;
    }
    50% { 
        transform: scale(1.3) translateY(-5px);
        opacity: 0.2;
    }
}

/* Product cards with vape theme */
.smokyai-vape-theme .smokyai-product-card {
    position: relative;
    overflow: hidden;
}

.smokyai-vape-theme .smokyai-product-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(106, 90, 205, 0.03) 0%, transparent 50%);
    pointer-events: none;
}

.smokyai-vape-theme .smokyai-product-card:hover {
    box-shadow: 
        0 12px 40px rgba(106, 90, 205, 0.2),
        0 0 0 1px rgba(106, 90, 205, 0.3);
}

/* Vape-specific product highlights */
.smokyai-vape-theme .smokyai-product-highlight {
    background: var(--smokyai-vape-accent);
    position: relative;
}

.smokyai-vape-theme .smokyai-product-highlight.nicotine {
    background: var(--smokyai-nicotine-gradient);
}

.smokyai-vape-theme .smokyai-product-highlight.menthol {
    background: var(--smokyai-menthol-gradient);
}

.smokyai-vape-theme .smokyai-product-highlight.flavor {
    background: var(--smokyai-vapor-gradient);
}

/* Enhanced bucket titles for vape products */
.smokyai-vape-theme .smokyai-bucket-title.economy {
    background: var(--smokyai-smoke-gradient);
    color: white;
}

.smokyai-vape-theme .smokyai-bucket-title.mid {
    background: var(--smokyai-vapor-gradient);
    color: white;
}

.smokyai-vape-theme .smokyai-bucket-title.premium {
    background: var(--smokyai-menthol-gradient);
    color: white;
}

/* Send button with vapor effect */
.smokyai-vape-theme .smokyai-send-btn {
    background: var(--smokyai-vapor-gradient);
    position: relative;
}

.smokyai-vape-theme .smokyai-send-btn:hover {
    box-shadow: 
        0 6px 20px rgba(106, 90, 205, 0.4),
        0 0 30px rgba(106, 90, 205, 0.2);
}

/* Suggestion buttons with vape theme */
.smokyai-vape-theme .smokyai-suggestion-btn:hover {
    background: var(--smokyai-vapor-gradient);
    color: white;
    box-shadow: 
        0 6px 20px rgba(106, 90, 205, 0.3);
}

/* Typing indicator with vapor colors */
.smokyai-vape-theme .smokyai-typing-dot {
    background: var(--smokyai-vape-primary);
}

.smokyai-vape-theme .smokyai-typing-dot:nth-child(1) {
    background: var(--smokyai-vape-primary);
}

.smokyai-vape-theme .smokyai-typing-dot:nth-child(2) {
    background: var(--smokyai-vape-secondary);
}

.smokyai-vape-theme .smokyai-typing-dot:nth-child(3) {
    background: var(--smokyai-vape-accent);
}

/* Scrollbar with vape theme */
.smokyai-vape-theme .smokyai-chat-messages::-webkit-scrollbar-thumb {
    background: var(--smokyai-vapor-gradient);
}

/* Special effects for vape theme */
.smokyai-vape-theme .smokyai-chat-window {
    position: relative;
}

.smokyai-vape-theme .smokyai-chat-window::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 20% 80%, rgba(106, 90, 205, 0.03) 0%, transparent 50%),
        radial-gradient(circle at 80% 20%, rgba(32, 178, 170, 0.03) 0%, transparent 50%);
    pointer-events: none;
    z-index: 1;
}

.smokyai-vape-theme .smokyai-chat-messages {
    position: relative;
    z-index: 2;
}

/* Responsive adjustments for vape theme */
@media (max-width: 768px) {
    .smokyai-vape-theme .smokyai-chat-toggle {
        background: var(--smokyai-vape-primary);
    }
    
    .smokyai-vape-theme .smokyai-chat-header {
        background: var(--smokyai-vape-primary);
    }
}