/**
 * Shois Chat Button — T03 Gradient Sunset Template
 *
 * Warm orange-to-pink gradient theme with vibrant accents.
 * Type: Bubble Popup
 *
 * Base structural styles are provided by widget-base.css.
 * This file only overrides CSS custom properties and
 * adds template-specific visual tweaks.
 *
 * @package ShoisChatButton
 */

.shcb-template-gradient-sunset {
    --scb-primary: #f97316;
    --scb-secondary: #ea580c;
    --scb-bg: #ffffff;
    --shcb-header-bg: linear-gradient(135deg, #f97316 0%, #ec4899 100%);
    --shcb-header-text: #ffffff;
    --scb-text: #1e293b;
    --scb-text-light: #64748b;
    --shcb-cta-bg: #f97316;
    --shcb-cta-text: #ffffff;
    --scb-shadow-btn: 0 4px 20px rgba(249, 115, 22, 0.4);
}

.shcb-template-gradient-sunset .shcb-trigger-btn {
    background: linear-gradient(135deg, #f97316 0%, #ec4899 100%);
}

.shcb-template-gradient-sunset .shcb-trigger-btn:hover {
    box-shadow: 0 6px 24px rgba(249, 115, 22, 0.45);
}

.shcb-template-gradient-sunset .shcb-popup-header {
    background: linear-gradient(135deg, #f97316 0%, #ec4899 100%);
}

.shcb-template-gradient-sunset .shcb-chip {
    color: #f97316;
    background: rgba(249, 115, 22, 0.08);
    border-color: rgba(249, 115, 22, 0.25);
}

.shcb-template-gradient-sunset .shcb-chip:hover {
    background: rgba(249, 115, 22, 0.15);
}

.shcb-template-gradient-sunset .shcb-agent-card:hover {
    border-color: #f97316;
    box-shadow: 0 2px 8px rgba(249, 115, 22, 0.1);
}

/* ─── Dark Mode ─────────────────────────────────────── */
@media (prefers-color-scheme: dark) {
    .shcb-template-gradient-sunset {
        --scb-bg: #1e1e1e;
        --scb-text: #e5e5e5;
        --scb-text-light: #a0a0a0;
    }

    .shcb-template-gradient-sunset .shcb-agent-card {
        background: #2a2a2a;
        border-color: #3a3a3a;
    }

    .shcb-template-gradient-sunset .shcb-popup-footer {
        border-top-color: #333;
    }
}