/**
 * Trill Chat Lite — Chat Launcher (lazy-load bootstrap)
 *
 * Minimal launcher-only styles loaded on page load. The full chat-widget.css
 * bundle is loaded dynamically on first click via chat-launcher.js.
 *
 * Kept in sync with chat-widget.css ".trcl-chat-toggle / .trcl-launcher-*"
 * rules so the button looks identical before and after the lazy load — no
 * visual shift when the full widget initialises.
 *
 * @package TrillChatLite
 * @since 1.2.3
 * @license GPL-2.0-or-later
 */

/* ========================================
   Launcher container
   ======================================== */

.trcl-chat-widget {
    position: fixed;
    bottom: 20px;
    /* right/left set dynamically via wp_add_inline_style based on widget_position setting */
    right: 20px;
    left: auto;
    z-index: 99999;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    font-size: 14px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

.trcl-chat-widget * {
    box-sizing: border-box;
}

/* ========================================
   Launcher button
   ======================================== */

/*
 * Launcher button — no outer circle.
 * The logo (bubble + tail + graph) floats directly on the page, with a
 * shape-aware drop-shadow applied to the SVG for depth on light backgrounds.
 */
.trcl-chat-toggle {
    width: 52px;
    height: 52px;
    border-radius: 0;
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    box-shadow: none;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible;
    transition: transform 0.2s ease, filter 0.2s ease;
    -webkit-tap-highlight-color: transparent;
}

.trcl-chat-toggle:hover {
    transform: scale(1.05);
}

.trcl-chat-toggle:hover .trcl-launcher-svg {
    filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.28));
}

.trcl-chat-toggle:focus-visible {
    outline: 2px solid var(--trcl-primary, #10B981);
    outline-offset: 4px;
    border-radius: 8px;
}

.trcl-launcher-svg {
    width: 100%;
    height: 100%;
    display: block;
    /* Drop-shadow follows the bubble silhouette (not a rectangular box) */
    filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.22));
}

/*
 * The bubble fill inherits the configured widget colour.
 * Nodes (white) and amber accent are hardcoded in the SVG and stay fixed.
 */
.trcl-launcher-bubble {
    fill: var(--trcl-primary, #10B981);
}

/* ========================================
   NoScript fallback
   ======================================== */

.trcl-noscript-message {
    position: fixed;
    bottom: 20px;
    right: 20px;
    left: auto;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 12px 16px;
    font-size: 13px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    z-index: 99999;
}

/* ========================================
   Classic bubble launcher (v2.1)
   ======================================== */

.trcl-chat-toggle--bubble {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--trcl-primary, #10B981);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}

.trcl-chat-toggle--bubble:hover {
    transform: scale(1.05);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3);
}

.trcl-chat-toggle--bubble .trcl-bubble-icon {
    width: 26px;
    height: 26px;
    display: block;
}
