/* Bright & Animated Modern Theme */

#wn-chat-button {
    position: fixed; bottom: 25px; right: 25px;
    width: 68px; height: 68px;
    background: linear-gradient(135deg, #0284c7, #2563eb);
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 10px 25px rgba(37, 99, 235, 0.45);
    z-index: 999999;
    display: flex; align-items: center; justify-content: center;
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    animation: wnPulse 2.5s infinite;
}

#wn-chat-button:hover {
    transform: scale(1.12) rotate(5deg);
}

@keyframes wnPulse {
    0% { box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.6); }
    70% { box-shadow: 0 0 0 18px rgba(37, 99, 235, 0); }
    100% { box-shadow: 0 0 0 0 rgba(37, 99, 235, 0); }
}

.wn-robot-svg { width: 50px; height: 50px; }
.wn-robot-svg-mini { width: 38px; height: 38px; }

.wn-antenna-glow {
    animation: wnGlow 1.5s infinite alternate;
}
@keyframes wnGlow {
    from { fill: #ff3366; filter: drop-shadow(0 0 2px #ff3366); }
    to { fill: #38bdf8; filter: drop-shadow(0 0 8px #38bdf8); }
}

.wn-eye-blink {
    animation: wnBlink 3.5s infinite;
}
@keyframes wnBlink {
    0%, 90%, 100% { transform: scaleY(1); }
    95% { transform: scaleY(0.1); }
}

.wn-badge {
    position: absolute; top: -3px; right: -3px;
    background: #ef4444; color: white; border-radius: 50%;
    width: 20px; height: 20px; font-size: 11px; font-weight: bold;
    display: flex; align-items: center; justify-content: center;
    border: 2px solid #fff;
}

#wn-chat-box {
    display: flex; position: fixed; bottom: 100px; right: 25px;
    width: 400px; height: 600px; max-width: calc(100vw - 30px); max-height: calc(100vh - 120px);
    background: #ffffff; border-radius: 20px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.16); z-index: 999999;
    flex-direction: column; overflow: hidden;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    animation: wnPopIn 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes wnPopIn {
    from { opacity: 0; transform: translateY(30px) scale(0.95); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.wn-chat-header {
    background: linear-gradient(135deg, #0284c7, #1d4ed8);
    color: #ffffff; padding: 16px 20px; display: flex; align-items: center; justify-content: space-between;
}
.wn-header-info { display: flex; align-items: center; gap: 12px; }
.wn-avatar-box {
    width: 42px; height: 42px; background: rgba(255,255,255,0.2);
    border-radius: 50%; display: flex; align-items: center; justify-content: center;
}
.wn-header-title { font-weight: 700; font-size: 16px; color: #ffffff; }
.wn-header-status { font-size: 12px; color: #e0f2fe; display: flex; align-items: center; gap: 6px; }
.wn-dot { width: 8px; height: 8px; background: #22c55e; border-radius: 50%; box-shadow: 0 0 6px #22c55e; }
.wn-close-btn { background: none; border: none; color: #fff; font-size: 22px; cursor: pointer; opacity: 0.85; transition: opacity 0.2s; }
.wn-close-btn:hover { opacity: 1; }

.wn-quick-contacts {
    background: #f1f5f9; border-bottom: 1px solid #e2e8f0;
    padding: 8px 16px; font-size: 12px; color: #334155; display: flex; justify-content: space-between;
}
.wn-quick-contacts a { color: #0284c7; text-decoration: none; font-weight: 600; }

.wn-chat-messages {
    flex: 1; padding: 18px; overflow-y: auto; font-size: 14px;
    display: flex; flex-direction: column; gap: 14px; background: #f8fafc;
}
.wn-msg { padding: 12px 16px; border-radius: 16px; max-width: 88%; line-height: 1.5; word-wrap: break-word; }
.wn-user {
    background: #0284c7; color: #ffffff; align-self: flex-end;
    border-bottom-right-radius: 4px; box-shadow: 0 3px 10px rgba(2, 132, 199, 0.25);
}
.wn-bot {
    background: #ffffff; color: #1e293b; align-self: flex-start;
    border-bottom-left-radius: 4px; border: 1px solid #e2e8f0;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

.wn-suggestions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.wn-chip {
    background: #f1f5f9; color: #0f172a; font-size: 12px; font-weight: 500; padding: 7px 12px;
    border-radius: 20px; cursor: pointer; border: 1px solid #cbd5e1; transition: all 0.2s;
}
.wn-chip:hover { background: #0284c7; color: white; border-color: #0284c7; transform: translateY(-1px); }

.wn-custom-response { font-size: 13px; line-height: 1.5; }
.wn-price-cards { display: flex; flex-direction: column; gap: 10px; margin-top: 8px; }
.wn-price-card {
    background: #f8fafc; border: 1px solid #cbd5e1; border-radius: 12px; padding: 10px 12px; position: relative;
}
.wn-price-card.wn-featured {
    background: #f0f9ff; border: 2px solid #0284c7; box-shadow: 0 4px 12px rgba(2, 132, 199, 0.15);
}
.wn-card-badge {
    display: inline-block; background: #94a3b8; color: white; font-size: 10px; font-weight: bold; padding: 2px 8px; border-radius: 10px; margin-bottom: 4px;
}
.wn-featured .wn-card-badge { background: #0284c7; }
.wn-card-title { font-weight: 700; font-size: 13px; color: #0f172a; }
.wn-card-price { font-weight: 800; font-size: 15px; color: #ef4444; margin: 2px 0; }
.wn-price-card ul { margin: 4px 0 0 16px; padding: 0; font-size: 11px; color: #475569; }

.wn-service-list { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.wn-service-item {
    background: #f1f5f9; padding: 8px 10px; border-radius: 8px; border-left: 3px solid #0284c7; font-size: 12px;
}

.wn-chat-input { display: flex; padding: 14px; border-top: 1px solid #e2e8f0; background: #ffffff; align-items: center; gap: 10px; }
.wn-chat-input input {
    flex: 1; border: 1px solid #cbd5e1; padding: 11px 16px; border-radius: 25px;
    outline: none; font-size: 14px; color: #0f172a; transition: border-color 0.2s; background: #f8fafc;
}
.wn-chat-input input:focus { border-color: #0284c7; background: #fff; }
.wn-chat-input button {
    background: #0284c7; color: #fff; border: none; width: 42px; height: 42px;
    border-radius: 50%; cursor: pointer; display: flex; align-items: center; justify-content: center;
    transition: background 0.2s, transform 0.2s;
}
.wn-chat-input button:hover { background: #1d4ed8; transform: scale(1.05); }
.wn-chat-input button svg { width: 20px; height: 20px; fill: white; }
/* v7.0.1: visible panel uses flex; [hidden] still takes precedence. */
/* v7 accessibility and hardening overrides */
#wn-chat-box[hidden] { display:none !important; }
#wn-chat-button { border:0; padding:0; }
#wn-chat-box { box-sizing:border-box; }
#wn-chat-box *, #wn-chat-box *::before, #wn-chat-box *::after { box-sizing:border-box; }
#wn-chat-box .wn-msg { white-space:pre-wrap; overflow-wrap:anywhere; }
#wn-chat-box .wn-ai-note { text-align:center; padding:5px 8px 8px; color:#64748b; background:#fff; font-size:10px; }
#wn-chat-box .wn-close-btn, #wn-chat-button { font-family:inherit; }
#wn-chat-box .wn-avatar-box { font-size:27px; }
#wn-chat-button:focus-visible, #wn-chat-box button:focus-visible, #wn-chat-box input:focus-visible { outline:3px solid #fbbf24; outline-offset:2px; }
#wn-chat-box .wn-chat-messages { min-height:0; }
#wn-chat-box .wn-chat-input input { min-width:0; width:100%; }
#wn-chat-box .wn-chat-input button:disabled { cursor:wait; opacity:.5; }
#wn-chat-box .wn-quick-contacts { gap:10px; flex-wrap:wrap; }
@media (max-width:480px) { #wn-chat-button { width:58px; height:58px; right:15px; bottom:16px; } #wn-chat-box { right:10px; bottom:84px; width:calc(100vw - 20px); height:min(620px, calc(100dvh - 104px)); max-height:calc(100dvh - 104px); border-radius:16px; } }
@media (prefers-reduced-motion:reduce) { #wn-chat-button, #wn-chat-box, .wn-antenna-glow, .wn-eye-blink { animation:none !important; transition:none !important; } }

/* 7.0.2: ensure theme CSS cannot hide the submit icon. */
#wn-chat-box #wn-send-trigger { background:#0284c7 !important; border:0 !important; padding:0 !important; flex:0 0 42px; display:flex !important; align-items:center; justify-content:center; }
#wn-chat-box #wn-send-trigger svg { display:block !important; width:21px !important; height:21px !important; fill:#fff !important; opacity:1 !important; }
#wn-chat-box #wn-send-trigger svg path { fill:#fff !important; }

/* 7.0.4: three contact methods, mobile-friendly */
#wn-chat-box .wn-quick-contacts { display:flex; align-items:center; justify-content:space-between; gap:5px; padding:9px 10px; flex-wrap:wrap; font-size:11px; }
#wn-chat-box .wn-quick-contacts span { white-space:nowrap; }
/* Human handoff 7.1 */
#wn-chat-box .wn-handoff-bar{display:flex;align-items:center;gap:8px;padding:7px 12px;background:#eff6ff;border-bottom:1px solid #dbeafe}#wn-chat-box #wn-human-trigger{border:1px solid #60a5fa;border-radius:16px;padding:7px 12px;background:white;color:#075ca0;font-weight:700;font-size:12px;cursor:pointer}#wn-chat-box #wn-live-badge{font-size:11px;color:#0369a1}#wn-chat-box #wn-human-panel{padding:12px;background:#f8fafc;border-bottom:1px solid #cbd5e1;max-height:280px;overflow:auto;font-size:12px}#wn-chat-box #wn-human-panel[hidden]{display:none!important}#wn-chat-box .wn-human-title{font-size:15px;font-weight:700;color:#075ca0}#wn-chat-box .wn-human-links{display:flex;gap:8px;margin:8px 0}#wn-chat-box .wn-human-links a{background:#e0f2fe;padding:9px 12px;border-radius:12px;text-decoration:none;font-weight:600}#wn-chat-box #wn-human-panel label{display:block;margin:8px 0;font-size:12px}#wn-chat-box #wn-human-panel input{width:100%;padding:8px;border:1px solid #cbd5e1;border-radius:8px;background:white}#wn-chat-box #wn-human-request{background:#0284c7;color:#fff;border:0;border-radius:9px;padding:9px 12px;cursor:pointer}#wn-chat-box #wn-human-ai{background:transparent;border:0;color:#075ca0;text-decoration:underline;padding:9px;cursor:pointer}#wn-chat-box .wn-human-privacy{font-size:10px;color:#64748b}

/* v7.1.1: clean, single contact entry point; direct contacts remain inside the human panel. */
#wn-chat-box .wn-handoff-bar { justify-content:center; padding:10px 14px; background:#f0f7ff; }
#wn-chat-box #wn-human-trigger { width:100%; border:1px solid #bfdbfe; border-radius:12px; background:#fff; color:#075ca0; padding:10px 12px; font-size:13px; box-shadow:0 2px 6px rgba(2,132,199,.07); }
#wn-chat-box #wn-human-trigger:hover { background:#e0f2fe; border-color:#60a5fa; }
#wn-chat-box .wn-handoff-bar:has(#wn-live-badge:not(:empty)) #wn-human-trigger { width:auto; flex:1; }

/* v7.1.2: compact contacts + contextual human handoff displayed inside conversation. */
#wn-chat-box .wn-handoff-bar{display:none!important}
#wn-chat-box .wn-quick-contacts{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:9px 12px;background:#f1f5f9;border-bottom:1px solid #e2e8f0;flex-wrap:nowrap!important;white-space:nowrap;font-size:11px;line-height:1.4}
#wn-chat-box .wn-quick-contacts a{color:#0569a8;text-decoration:none;font-weight:650;white-space:nowrap;min-width:0}
#wn-chat-box .wn-quick-contacts a:first-child{flex-shrink:0}
#wn-chat-box .wn-quick-contacts a:last-child{overflow:hidden;text-overflow:ellipsis;display:block}
#wn-chat-box #wn-human-panel.wn-human-card{flex:0 0 auto;align-self:stretch;max-height:none;overflow:visible;padding:14px;border:1px solid #bfdbfe;border-radius:16px;background:linear-gradient(180deg,#eff6ff,#fff);box-shadow:0 3px 10px rgba(2,132,199,.07);font-size:12px}
#wn-chat-box .wn-human-card p{margin:8px 0;line-height:1.5}
#wn-chat-box .wn-human-card .wn-human-links a{display:inline-flex;align-items:center;justify-content:center;border-radius:10px;background:#0284c7;color:white;padding:9px 12px;flex:1}
#wn-chat-box .wn-human-card .wn-human-links a+ a{background:#e0f2fe;color:#0369a1}
#wn-chat-box .wn-human-details{margin-top:10px;padding:10px;border:1px solid #dbeafe;border-radius:10px;background:white}
#wn-chat-box .wn-human-details summary{font-weight:700;cursor:pointer;color:#075ca0}
#wn-chat-box #wn-human-ai{margin-top:6px}
#wn-chat-box .wn-live-status:not([hidden]){padding:7px 12px;background:#e0f2fe;color:#075ca0;font-size:12px;font-weight:600}
@media(max-width:380px){#wn-chat-box .wn-quick-contacts{font-size:10px;padding:8px}#wn-chat-box .wn-quick-contacts a:first-child span{display:none}}


/* v7.2.0 — service shortcuts: fixed 2-column layout; no orphaned pill rows. */
#wn-chat-box .wn-service-shortcuts { width:100%; flex:0 0 auto; min-width:0; padding:2px 0 4px; }
#wn-chat-box .wn-shortcuts-heading { display:flex; align-items:center; justify-content:space-between; gap:6px; margin:0 1px 10px; font-size:12px; font-weight:750; color:#334155; }
#wn-chat-box .wn-shortcuts-hint { color:#94a3b8; font-size:10px; font-weight:500; white-space:nowrap; }
#wn-chat-box .wn-shortcuts-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; width:100%; }
#wn-chat-box .wn-service-link { display:flex; align-items:center; gap:7px; min-width:0; min-height:45px; padding:9px 10px; background:#fff; border:1px solid #e0e9f3; border-radius:12px; text-decoration:none!important; color:#164566!important; box-shadow:0 2px 7px rgba(15,67,110,.035); transition:background .2s,border-color .2s,transform .2s,box-shadow .2s; }
#wn-chat-box .wn-service-link:hover { background:#f0f9ff; border-color:#7dd3fc; transform:translateY(-1px); box-shadow:0 5px 12px rgba(2,132,199,.10); }
#wn-chat-box .wn-service-link:focus-visible { outline:3px solid #fbbf24; outline-offset:2px; }
#wn-chat-box .wn-service-icon { display:inline-flex; flex:0 0 23px; align-items:center; justify-content:center; font-size:17px; line-height:1; }
#wn-chat-box .wn-service-label { min-width:0; flex:1; font-size:11.5px; font-weight:650; line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#wn-chat-box .wn-service-arrow { flex:0 0 auto; font-size:13px; color:#94a3b8; }
#wn-chat-box .wn-service-link-price { grid-column:1/-1; background:linear-gradient(100deg,#eaf6ff,#f6fbff); border-color:#b9def7; }
#wn-chat-box .wn-service-link-price .wn-service-label { font-size:12.5px; color:#075e9d; }
#wn-chat-box .wn-service-link-price .wn-service-arrow { margin-left:auto; color:#0284c7; }
@media(max-width:380px){ #wn-chat-box .wn-shortcuts-grid {gap:6px;} #wn-chat-box .wn-service-link {padding:8px 6px;gap:4px;} #wn-chat-box .wn-service-icon {flex-basis:20px;font-size:15px;} #wn-chat-box .wn-service-label {font-size:10.5px;} #wn-chat-box .wn-service-arrow {font-size:11px;} }

/* v7.2.1: service buttons trigger AI conversation, not navigation */
#wn-chat-box button.wn-service-link { font-family:inherit; width:100%; cursor:pointer; text-align:left; appearance:none; -webkit-appearance:none; box-sizing:border-box; }
#wn-chat-box .wn-inline-more { display:inline-block; margin-top:10px; padding:7px 12px; background:#eaf6ff; color:#0769a5!important; border:1px solid #b8dcf5; border-radius:9px; font-weight:700; text-decoration:none!important; }
#wn-chat-box .wn-inline-more:hover { background:#d8efff; text-decoration:underline!important; }


/* v7.3.0 — polished minimal conversational interface */
#wn-chat-box { width:420px; height:620px; border-radius:20px; border:1px solid rgba(226,232,240,.9); box-shadow:0 24px 75px rgba(15,23,42,.20),0 2px 12px rgba(15,23,42,.07); }
#wn-chat-box .wn-chat-header { position:relative; min-height:64px; flex:0 0 64px; padding:10px 16px 10px 20px; background:linear-gradient(110deg,#087fc2,#1557bf); align-items:center; }
#wn-chat-box .wn-header-info { gap:0; align-items:center; }
#wn-chat-box .wn-header-title { font-size:15px; line-height:1.35; font-weight:700; letter-spacing:.1px; }
#wn-chat-box .wn-header-status { font-size:11px; margin-top:2px; color:#e9f6ff; }
#wn-chat-box .wn-dot { width:7px;height:7px;box-shadow:none; }
#wn-chat-box .wn-close-btn { position:absolute; top:10px; right:11px; width:32px; height:32px; padding:0; border:0; border-radius:9px; background:rgba(255,255,255,.11); color:#fff; font-size:24px; line-height:1; display:flex; align-items:center; justify-content:center; opacity:1; transition:background .18s ease; }
#wn-chat-box .wn-close-btn:hover { background:rgba(255,255,255,.23); }
#wn-chat-box .wn-quick-contacts { display:none!important; }
#wn-chat-box .wn-chat-messages { padding:17px 18px; gap:13px; background:#f7f9fc; scrollbar-color:#cad5e2 transparent; scrollbar-width:thin; }
#wn-chat-box .wn-msg { max-width:94%; padding:12px 14px; border-radius:14px; line-height:1.57; font-size:13px; }
#wn-chat-box .wn-bot { background:#fff; border:1px solid #e7edf4; box-shadow:0 2px 9px rgba(15,23,42,.035); border-bottom-left-radius:5px; }
#wn-chat-box .wn-user { background:#1276c2; border-bottom-right-radius:5px; box-shadow:none; }
#wn-chat-box .wn-shortcuts-heading { margin:4px 0 10px; font-size:12px; letter-spacing:.05px; }
#wn-chat-box .wn-shortcuts-hint { color:#8696a9; font-size:10.5px; }
#wn-chat-box .wn-shortcuts-grid { gap:8px; }
#wn-chat-box button.wn-service-link { display:flex; min-height:47px; gap:9px; padding:10px 11px; border-radius:11px; background:#fff; border:1px solid #e1e8f1; box-shadow:0 1px 3px rgba(15,23,42,.025); color:#25425d!important; transition:background .16s,border-color .16s,box-shadow .16s; }
#wn-chat-box button.wn-service-link:hover { background:#f4f9ff; border-color:#b1d7f5; transform:none; box-shadow:0 3px 9px rgba(22,101,171,.07); }
#wn-chat-box .wn-service-icon { display:none!important; }
#wn-chat-box .wn-service-label { min-width:0; font-size:12px; font-weight:600; line-height:1.38; white-space:normal; overflow:visible; text-overflow:clip; overflow-wrap:break-word; }
#wn-chat-box .wn-service-arrow { margin-left:auto; color:#91a9be; font-size:18px; font-weight:400; }
#wn-chat-box button.wn-service-link-price { background:#f0f7ff; border-color:#c8e1f7; }
#wn-chat-box .wn-service-link-price .wn-service-label { font-size:12px; color:#075e9d; }
#wn-chat-box .wn-chat-input { background:#fff; }
#wn-chat-box .wn-inline-more { border-radius:9px; font-size:12px; }
@media(max-width:480px){ #wn-chat-box { width:calc(100vw - 20px); max-width:420px; height:min(620px,calc(100dvh - 104px)); } #wn-chat-box .wn-chat-messages {padding:14px;} }
@media(max-width:350px){ #wn-chat-box .wn-shortcuts-grid {gap:6px;} #wn-chat-box button.wn-service-link { padding:9px 7px;gap:4px;} #wn-chat-box .wn-service-label {font-size:11px;} }

/* v7.3.1 — Restore compact assistant robot in header only. */
#wn-chat-box .wn-header-info { display:flex; align-items:center; gap:10px; padding-right:42px; min-width:0; }
#wn-chat-box .wn-header-robot { display:inline-flex; flex:0 0 38px; width:38px; height:38px; border-radius:12px; background:rgba(255,255,255,.16); align-items:center; justify-content:center; box-shadow:inset 0 0 0 1px rgba(255,255,255,.12); }
#wn-chat-box .wn-header-robot .wn-robot-svg-mini { display:block; width:32px; height:32px; }
#wn-chat-box .wn-chat-header { padding-left:14px; }