/**
 * Full Web Assistant v4.6.6 - Aberlour Style Design
 */

:root {
    color-scheme: light; /* v1.41.3: opt out of browser auto-dark inversion */
    --primary-color: #0d1f33;
    --secondary-color: #1e4a6e;
    --text-color: #1f2937;
    --title-text-color: #ffffff;
    --background-color: #ffffff;
    --user-message-color: #ff6b35;
    --user-message-text-color: #ffffff;
    --ai-message-color: #f7f9fc;
    --ai-message-text-color: #1f2937;
    --border-color: #e2eaf2;
    --button-color: #ff6b35;
    --button-text-color: #ffffff;
}

.fwa-assistant-container, .fwa-assistant-container * {
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
}

.fwa-assistant-container {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 15px;
    line-height: 1.5;
    color: var(--text-color);
}

/* Hide zoom button on desktop - only show on mobile */
.fwa-zoom-btn {
    display: none !important;
}

/* Trigger Button */
.fwa-assistant-trigger {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 999998;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 20px;
    border-radius: 50px;
    border: none;
    background: var(--trigger-color, #ff6b35);
    color: var(--trigger-text-color, #fff);
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    box-shadow: 0 4px 20px rgba(0,0,0,0.2);
    transition: transform 0.2s, box-shadow 0.2s;
    touch-action: manipulation;
    -webkit-tap-highlight-color: rgba(0,0,0,0.1);
}

.fwa-assistant-trigger:hover { transform: translateY(-2px); box-shadow: 0 6px 24px rgba(0,0,0,0.25); }
.fwa-assistant-trigger .fwa-icon { font-size: 18px; }

/* Chat Window */
.fwa-assistant-chat {
    display: none;
    flex-direction: column;
    background: var(--background-color);
    border-radius: 16px;
    box-shadow: 0 8px 40px rgba(0,0,0,0.2);
    overflow: hidden;
    z-index: 999999;
    border: 1px solid #e0e0e0;
}

/* When chat is visible (set by JS) */
.fwa-assistant-chat[data-visible="true"],
.fwa-assistant-chat[style*="display: flex"] {
    display: flex !important;
}

.fwa-assistant-container[data-mode="floating"] .fwa-assistant-chat {
    position: fixed;
    bottom: 24px;
    right: 24px;
    width: 480px;
    height: 680px;
    max-width: calc(100vw - 40px);
    max-height: calc(100dvh - 40px);
}

/* Modal */
.fwa-assistant-modal { display: none; position: fixed; inset: 0; z-index: 999999; }
.fwa-assistant-modal[data-visible="true"] { display: flex; align-items: center; justify-content: center; }
.fwa-assistant-modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.5); }
.fwa-assistant-modal-content { position: relative; z-index: 1; width: 90%; max-width: 550px; height: 85%; max-height: 750px; border-radius: 16px; overflow: hidden; }
.fwa-assistant-modal-content .fwa-assistant-chat { width: 100%; height: 100%; display: flex; flex-direction: column; border-radius: 16px; }

/* Inline */
.fwa-assistant-container[data-mode="inline"] .fwa-assistant-chat {
    width: 100%; min-height: 500px; border-radius: 16px; border: 1px solid var(--border-color);
    display: flex; flex-direction: column;
}

/* Unified Header */
.fwa-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 16px;
    background: var(--title-color, var(--primary-color)); /* v1.35.7: use title-color (header bg from appearance panel) */
    color: var(--title-text-color);
}

/* Sponsor Badge - Option D style */
.fwa-sponsor-badge {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding: 6px 16px 6px 16px;
    background: var(--title-color, var(--primary-color)); /* v1.35.7: match header */
    border-bottom: 1px solid rgba(255,255,255,0.1);
}
.fwa-sponsor-badge > .fwa-sponsor-logo,
.fwa-sponsor-badge > .fwa-sponsor-initials {
    flex-shrink: 0;
}
.fwa-sponsor-logo {
    height: 20px;
    width: auto;
    max-width: 40px;
    object-fit: contain;
    border-radius: 4px;
    background: rgba(255,255,255,0.9);
    padding: 2px;
}
.fwa-sponsor-initials {
    width: 22px;
    height: 22px;
    border-radius: 5px;
    background: rgba(255,255,255,0.9);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 600;
    color: var(--primary-color);
    text-transform: uppercase;
}
.fwa-sponsor-text {
    font-size: 13px;
    color: rgba(255,255,255,0.8);
}
.fwa-sponsor-text strong,
.fwa-sponsor-text a {
    color: #fff;
    font-weight: 600;
}
.fwa-sponsor-text a {
    text-decoration: none;
}
.fwa-sponsor-text a:hover {
    text-decoration: underline;
}

.fwa-header-logo img {
    height: 40px;
    width: auto;
    max-width: 96px;
    object-fit: contain;
    border-radius: 8px;
    background: rgba(255,255,255,0.9);
    padding: 4px;
}

.fwa-header-info {
    flex: 1;
    min-width: 0;    /* v1.36.0: allows text-overflow to work in flex context */
    overflow: hidden;
}

.fwa-header-info h3 {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    color: inherit;
    white-space: nowrap;       /* v1.36.0: prevent name wrapping in iframe */
    overflow: hidden;
    text-overflow: ellipsis;
}

.fwa-header-controls {
    display: flex;
    align-items: center;
    gap: 8px;
}

.fwa-header-badge {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: rgba(255,255,255,0.2);
    color: inherit;
    border: none;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    touch-action: manipulation;
}

.fwa-header-badge:hover { background: rgba(255,255,255,0.3); }
.fwa-badge-flag { font-size: 14px; }

/* Header badge when auto-translate is active */
.fwa-header-badge.translating {
    background: rgba(34, 197, 94, 0.3);
    animation: pulse-translate 2s infinite;
}

@keyframes pulse-translate {
    0%, 100% { background: rgba(34, 197, 94, 0.3); }
    50% { background: rgba(34, 197, 94, 0.5); }
}

.fwa-header-btn {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,0.2);
    border: none;
    border-radius: 8px;
    font-size: 14px;
    cursor: pointer;
    touch-action: manipulation;
    color: inherit;
}

.fwa-header-btn:hover { background: rgba(255,255,255,0.3); }
.fwa-close-btn { font-size: 20px; font-weight: 300; }

/* Messages */
.fwa-assistant-messages {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    -webkit-overflow-scrolling: touch;
}

.fwa-message { max-width: 100%; }

.fwa-message-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    font-size: 14px; /* v1.35.4: up from 12px */
    color: #6b7280;
}

.fwa-message-avatar { font-size: 18px; } /* v1.35.4: up from 16px */
.fwa-message-sender { font-weight: 600; color: var(--primary-color); font-size: 14px; } /* v1.35.4 */
.fwa-message-dot { opacity: 0.5; }
.fwa-message-label { font-style: italic; }
.fwa-message-time { }

.fwa-play-btn {
    margin-left: auto;
    background: none;
    border: none;
    font-size: 14px;
    cursor: pointer;
    opacity: 0.6;
    padding: 2px 6px;
    border-radius: 4px;
    touch-action: manipulation;
}
.fwa-play-btn:hover { opacity: 1; background: rgba(0,0,0,0.05); }

/* Listen button */
.fwa-listen-btn {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 5px;
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    padding: 5px 14px; /* v1.35.4: larger tap target */
    font-size: 13px;   /* v1.35.4: up from 11px */
    font-weight: 600;  /* v1.35.4: bolder */
    color: #374151;    /* v1.35.4: darker for visibility */
    cursor: pointer;
    touch-action: manipulation;
    transition: all 0.2s;
}
.fwa-listen-btn:hover { background: #e5e7eb; border-color: #d1d5db; }
.fwa-listen-btn:active { transform: scale(0.95); }
.fwa-listen-icon { font-size: 14px; } /* v1.35.4 */

/* Stop button state */
.fwa-listen-btn.speaking {
    background: #fee2e2;
    border-color: #fca5a5;
    color: #dc2626;
}

.fwa-listen-btn.speaking:hover {
    background: #fecaca;
    border-color: #f87171;
}

/* TTS Consent Popup */
.fwa-tts-consent-popup {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 1000010;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.fwa-tts-consent-popup.visible { display: flex; }

.fwa-tts-consent-box {
    background: #fff;
    border-radius: 16px;
    padding: 24px;
    max-width: 340px;
    text-align: center;
    box-shadow: 0 20px 50px rgba(0,0,0,0.3);
    animation: popIn 0.3s ease;
}

@keyframes popIn {
    from { transform: scale(0.9); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

.fwa-tts-consent-icon { font-size: 40px; margin-bottom: 12px; }
.fwa-tts-consent-box p { margin: 0 0 8px; color: #374151; }
.fwa-tts-consent-box p strong { color: #111827; }
.fwa-tts-consent-note { font-size: 13px; color: #6b7280 !important; margin-bottom: 16px !important; }

.fwa-tts-consent-buttons {
    display: flex;
    gap: 10px;
    justify-content: center;
}

.fwa-tts-btn-yes, .fwa-tts-btn-no {
    padding: 12px 20px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    touch-action: manipulation;
    border: none;
    transition: all 0.2s;
}

.fwa-tts-btn-yes {
    background: var(--primary-color, #0d1f33);
    color: #fff;
}
.fwa-tts-btn-yes:hover { opacity: 0.9; }

.fwa-tts-btn-no {
    background: #f3f4f6;
    color: #374151;
    border: 1px solid #d1d5db;
}
.fwa-tts-btn-no:hover { background: #e5e7eb; }

.fwa-message-bubble {
    padding: 14px 18px;
    border-radius: 16px;
    background: var(--ai-message-color);
    color: var(--ai-message-text-color);
    border: 1px solid #e5e7eb;
}

.fwa-message-user .fwa-message-bubble {
    background: var(--user-message-color);
    color: var(--user-message-text-color);
    border-color: transparent;
}

.fwa-message-user { align-items: flex-end; display: flex; flex-direction: column; }
.fwa-message-user .fwa-message-meta { flex-direction: row-reverse; width: 100%; }
.fwa-message-user .fwa-message-meta .fwa-listen-btn { margin-left: 0; margin-right: auto; }
.fwa-message-user .fwa-message-sender { color: var(--text-color); }

/* Message body - Professional paragraph formatting */
.fwa-message-body {
    line-height: 1.65;
    font-size: 15px;
}
.fwa-message-body p { 
    margin: 0 0 14px; 
}
.fwa-message-body p:last-child { 
    margin: 0; 
}
.fwa-message-body a { 
    color: var(--primary-color); 
    text-decoration: underline;
    cursor: pointer;
}
.fwa-message-body a:hover {
    opacity: 0.8;
}
.fwa-message-user .fwa-message-body a {
    color: #fff;
    text-decoration: underline;
}

/* Headings in responses */
.fwa-message-body h3.fwa-heading,
.fwa-message-body h4.fwa-heading {
    margin: 16px 0 8px 0;
    font-weight: 700;
    color: var(--text-color);
}
.fwa-message-body h3.fwa-heading {
    font-size: 1.1em;
}
.fwa-message-body h4.fwa-heading {
    font-size: 1.05em;
}
.fwa-message-body h3.fwa-heading:first-child,
.fwa-message-body h4.fwa-heading:first-child {
    margin-top: 0;
}

/* Lists in responses */
.fwa-message-body ul.fwa-list,
.fwa-message-body ol.fwa-list {
    margin: 12px 0;
    padding-left: 24px;
}
.fwa-message-body ul.fwa-list {
    list-style-type: disc;
}
.fwa-message-body ol.fwa-list {
    list-style-type: decimal;
}
.fwa-message-body .fwa-list li {
    margin-bottom: 8px;
    padding-left: 4px;
    line-height: 1.5;
}
.fwa-message-body .fwa-list li:last-child {
    margin-bottom: 0;
}
.fwa-message-body .fwa-list li strong {
    color: var(--primary-color);
}

/* Nested sublists (bullets under numbered items) */
.fwa-message-body ul.fwa-sublist {
    margin: 6px 0 12px 0;
    padding-left: 20px;
    list-style-type: disc;
}
.fwa-message-body .fwa-sublist li {
    margin-bottom: 4px;
    font-size: 0.95em;
}

/* Legacy list support */
.fwa-message-body ul, 
.fwa-message-body ol {
    margin: 10px 0;
    padding-left: 22px;
}
.fwa-message-body li {
    margin-bottom: 6px;
}
.fwa-message-body strong,
.fwa-message-body b {
    font-weight: 600;
}
.fwa-message-body .fwa-source-ref { 
    margin-top: 12px; 
    font-size: 13px; 
    color: #6b7280; 
    border-top: 1px solid #e5e7eb; 
    padding-top: 8px; 
}

/* Language Change Notification */
.fwa-language-notification {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 16px;
    margin: 8px auto;
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.1), rgba(139, 92, 246, 0.1));
    border: 1px solid rgba(99, 102, 241, 0.3);
    border-radius: 20px;
    font-size: 13px;
    color: #4f46e5;
    max-width: fit-content;
    animation: notif-fade-in 0.3s ease;
}
.fwa-lang-notif-icon {
    font-size: 18px;
}
.fwa-lang-notif-text {
    font-weight: 500;
}
.fwa-lang-notif-text strong {
    font-weight: 700;
}
@keyframes notif-fade-in {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Typing Indicator - "Thinking ForWord..." */
.fwa-typing-indicator {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    background: var(--ai-message-color);
    border-radius: 16px;
    border: 1px solid #e5e7eb;
    max-width: fit-content;
}

.fwa-typing-text {
    font-size: 14px;
    font-weight: 500;
    color: #4b5563;
    display: flex;
    align-items: center;
    gap: 2px;
}

.fwa-typing-text .fwa-brand {
    color: var(--primary-color, #0d1f33);
    font-weight: 600;
}

.fwa-typing-dots {
    display: inline-flex;
    gap: 3px;
    margin-left: 2px;
}

.fwa-typing-dot {
    width: 5px;
    height: 5px;
    background: var(--primary-color, #0d1f33);
    border-radius: 50%;
    animation: fwa-dot-fade 1.4s ease-in-out infinite;
}

.fwa-typing-dot:nth-child(2) { animation-delay: 0.2s; }
.fwa-typing-dot:nth-child(3) { animation-delay: 0.4s; }

@keyframes fwa-dot-fade {
    0%, 100% { opacity: 0.3; transform: scale(0.8); }
    50% { opacity: 1; transform: scale(1); }
}

/* Suggested Questions - Compact & Collapsible */
.fwa-questions-wrapper {
    border-top: 1px solid #fcd34d;
    background: linear-gradient(135deg, #fef9c3 0%, #fef3c7 100%);
}

.fwa-questions-toggle {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 16px;
    background: linear-gradient(135deg, #fde047 0%, #facc15 100%);
    border: none;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    color: #713f12;
    touch-action: manipulation;
    transition: all 0.2s;
}

.fwa-questions-toggle:hover { background: linear-gradient(135deg, #facc15 0%, #eab308 100%); }
.fwa-q-icon { font-size: 14px; }
.fwa-q-title { flex: 1; text-align: left; font-size: 13px; }
.fwa-q-hint { font-size: 10px; font-weight: 400; opacity: 0.8; }
.fwa-q-badge { background: #ca8a04; color: #fff; padding: 2px 7px; border-radius: 10px; font-size: 10px; font-weight: 700; }
.fwa-q-chevron { transition: transform 0.2s; font-size: 10px; }
.fwa-questions-toggle.expanded .fwa-q-chevron { transform: rotate(180deg); }

.fwa-questions-content {
    display: none;
    padding: 10px 14px;
    gap: 6px;
    background: #fffef5;
}

.fwa-questions-content.expanded { display: flex; flex-direction: column; }

.fwa-question-btn {
    padding: 8px 12px;
    background: #fff;
    border: 1px solid #fcd34d;
    border-radius: 6px;
    text-align: left;
    cursor: pointer;
    font-size: 12px;
    color: #78350f;
    touch-action: manipulation;
    transition: all 0.15s;
}

.fwa-question-btn:hover { background: #fef9c3; border-color: #eab308; transform: translateX(3px); }

/* Input Area */
.fwa-input-area {
    padding: 12px 16px 16px;
    border-top: 1px solid #e5e7eb;
    background: #fff;
}

.fwa-input-row {
    display: flex;
    gap: 0;
    margin-bottom: 12px;
    align-items: flex-end; /* v1.38.5: children sit at bottom, not stretched */
}

.fwa-input {
    flex: 1;
    padding: 12px 14px;
    border: 1px solid #d1d5db;
    border-radius: 10px 0 0 10px;
    font-size: 15px;
    font-family: inherit;
    resize: none;
    outline: none;
    min-height: 44px;
    max-height: 250px;
    overflow-y: auto;
    transition: height 0.1s ease;
    caret-color: #1f2937; /* Black cursor for visibility */
}

.fwa-input:focus { border-color: var(--primary-color); }

/* Listening state indicator */
.fwa-speak-btn.listening {
    background: #fee2e2 !important;
    border-color: #ef4444 !important;
    color: #dc2626 !important;
    animation: pulse-listening 1.5s infinite;
}

@keyframes pulse-listening {
    0%, 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.4); }
    50% { box-shadow: 0 0 0 8px rgba(239, 68, 68, 0); }
}

.fwa-send-btn {
    padding: 0 20px;
    background: var(--button-color);
    color: var(--button-text-color);
    border: none;
    border-radius: 0 10px 10px 0;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    touch-action: manipulation;
    /* v1.38.5: completely fixed size — never grows with textarea */
    width: 72px;
    min-width: 72px;
    max-width: 72px;
    height: 46px;
    min-height: 46px;
    max-height: 46px;
    flex-shrink: 0;
    flex-grow: 0;
    align-self: flex-end;
    /* Override any flex stretch */
    box-sizing: border-box;
    overflow: hidden;
    white-space: nowrap;
}

.fwa-send-btn:hover { opacity: 0.9; }
.fwa-send-btn:disabled { opacity: 0.5; }

/* Control Buttons */
.fwa-controls {
    display: flex;
    justify-content: center;
    gap: 5px;
    margin-bottom: 6px;
}

.fwa-ctrl-btn {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 9px;
    background: #fff;
    border: 1px solid #d1d5db;
    border-radius: 13px;
    font-size: 11px;
    font-weight: 500;
    color: #374151;
    cursor: pointer;
    touch-action: manipulation;
    min-height: 28px;
}

.fwa-ctrl-btn:hover { background: #f9fafb; border-color: #9ca3af; }
.fwa-ctrl-btn:active { transform: scale(0.97); }
.fwa-ctrl-btn.listening { background: #fee2e2; border-color: #ef4444; color: #dc2626; }
.fwa-ctrl-btn.active { background: #fff3ed; border-color: #ff6b35; color: #e55a2b; }
.fwa-translate-btn.active { background: #dcfce7; border-color: #22c55e; color: #166534; }

.fwa-ctrl-icon { font-size: 12px; }

/* Listen Button on Messages - at far right of meta line */
.fwa-message-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
}

.fwa-listen-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 14px;
    border: 1px solid #e5e7eb;
    background: white;
    font-size: 11px;
    font-weight: 500;
    color: #6b7280;
    cursor: pointer;
    transition: all 0.2s;
    touch-action: manipulation;
    margin-left: auto;
}

.fwa-listen-btn:hover {
    background: #f3f4f6;
    border-color: #9ca3af;
}

.fwa-listen-btn.playing {
    background: #dbeafe;
    border-color: #ff6b35;
    color: #1d4ed8;
}

.fwa-message-bubble {
    position: relative;
}

/* Branding with Exit Fast button */
.fwa-branding {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    font-size: 12px;
    color: #6b7280;
    font-weight: 500;
    padding: 8px 12px;
    position: relative;
    min-height: 34px; /* v1.42.1: keeps footer height when text is the only child */
}

/* v1.42.1: the credit is now absolutely centred in the footer, so it stays
   dead-centre no matter which buttons render around it. Previously the flex
   row centred the whole GROUP (Contact Human + credit together), pushing
   "Powered By" right of centre whenever Contact Human was present - visible
   in embedded/mobile layouts, which never received the v1.40.6 desktop grid
   fix. Buttons now flow from the left; Exit Fast keeps its absolute right. */
.fwa-branding-text {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    white-space: nowrap;
    text-align: center;
}

.fwa-branding a { 
    color: var(--primary-color); 
    text-decoration: underline;
    text-decoration-style: dotted;
    text-underline-offset: 2px;
    font-weight: 700;
    transition: all 0.2s;
}
.fwa-branding a:hover { 
    color: var(--secondary-color);
    text-decoration-style: solid;
}

/* v1.63.44: contact panel, "send a message" toggle outside home mode. */
.fwa-contact-msg-toggle {
    display: block;
    width: 100%;
    margin-top: 9px;
    padding: 10px 12px;
    border: 1.5px solid #d4d4d8;
    border-radius: 10px;
    background: #fff;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

/* Exit Fast Button */
.fwa-exit-fast-btn {
    position: absolute;
    right: 12px;
    background: #dc2626;
    color: white;
    border: none;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    gap: 4px;
}

.fwa-exit-fast-btn:hover {
    background: #b91c1c;
    transform: scale(1.05);
}

/* Modals */
.fwa-modal {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 1000001;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.fwa-modal.visible { display: flex; }

.fwa-modal-box {
    background: #fff;
    border-radius: 16px;
    padding: 20px;
    width: 100%;
    max-width: 450px;
    max-height: 80vh;
    overflow-y: auto;
    box-shadow: 0 20px 50px rgba(0,0,0,0.3);
}

.fwa-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.fwa-modal-head h3 { margin: 0; font-size: 18px; }

.fwa-modal-x {
    width: 32px; height: 32px;
    background: #f3f4f6;
    border: none;
    border-radius: 50%;
    font-size: 20px;
    cursor: pointer;
}

.fwa-lang-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    margin-bottom: 16px;
}

.fwa-lang-opt {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px;
    border: 2px solid #e5e7eb;
    border-radius: 10px;
    cursor: pointer;
    touch-action: manipulation;
    min-height: 44px;
}

.fwa-lang-opt:hover { border-color: #a5b4fc; background: #f5f7ff; }
.fwa-lang-opt.selected { border-color: #6366f1; background: #eef2ff; }
.fwa-lang-flag { font-size: 22px; }
.fwa-lang-name { font-weight: 600; font-size: 13px; }
.fwa-lang-native { font-size: 11px; color: #6b7280; }

.fwa-voice-grid {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 250px;
    overflow-y: auto;
    margin-bottom: 16px;
}

.fwa-voice-opt {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px;
    border: 2px solid #e5e7eb;
    border-radius: 10px;
    cursor: pointer;
    touch-action: manipulation;
}

.fwa-voice-opt:hover { border-color: #a5b4fc; }
.fwa-voice-opt.selected { border-color: #6366f1; background: #eef2ff; }

.fwa-voice-info { display: flex; align-items: center; gap: 10px; }
.fwa-voice-icon { font-size: 18px; }
.fwa-voice-name { font-weight: 600; font-size: 13px; }
.fwa-voice-lang { font-size: 11px; color: #6b7280; }

.fwa-voice-test {
    padding: 6px 12px;
    background: #f3f4f6;
    border: none;
    border-radius: 6px;
    font-size: 11px;
    cursor: pointer;
}

.fwa-speed-ctrl {
    padding: 14px;
    background: #f9fafb;
    border-radius: 10px;
    margin-bottom: 16px;
}

.fwa-speed-ctrl label { display: block; margin-bottom: 8px; font-weight: 500; }

#speed-slider {
    width: 100%;
    height: 6px;
    -webkit-appearance: none;
    background: #e5e7eb;
    border-radius: 3px;
}

#speed-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 18px; height: 18px;
    background: var(--primary-color);
    border-radius: 50%;
    cursor: pointer;
}

.fwa-modal-close-btn {
    width: 100%;
    padding: 12px;
    background: #f3f4f6;
    border: none;
    border-radius: 10px;
    font-weight: 600;
    cursor: pointer;
}

/* Language Confirmation Popup */
.fwa-lang-confirm-content {
    text-align: center;
    padding: 20px;
    max-height: 90vh;
    overflow-y: auto;
}

.fwa-lang-confirm-title {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 12px;
}

.fwa-lang-confirm-text {
    color: #6b7280;
    font-size: 13px;
    margin-bottom: 10px;
    text-align: left;
    font-weight: 600;
}

.fwa-lang-other-title {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #e5e7eb;
}

.fwa-lang-confirm-buttons {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 8px;
}

.fwa-lang-other-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 6px;
}

.fwa-lang-confirm-btn {
    padding: 12px 16px;
    background: #f3f4f6;
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    text-align: left;
}

.fwa-lang-confirm-btn:hover {
    background: #fff3ed;
    border-color: #6366f1;
}

.fwa-lang-detected {
    background: #dcfce7;
    border-color: #22c55e;
}

.fwa-lang-detected:hover {
    background: #bbf7d0;
    border-color: #16a34a;
}

.fwa-lang-other {
    padding: 10px 12px;
    font-size: 12px;
}

.fwa-lang-confirm-cancel {
    padding: 10px 20px;
    background: transparent;
    border: none;
    color: #6b7280;
    font-size: 14px;
    cursor: pointer;
}

.fwa-lang-confirm-cancel:hover {
    color: #374151;
}

/* Toast */
.fwa-toast {
    position: fixed;
    bottom: 100px;
    left: 50%;
    transform: translateX(-50%);
    background: #1f2937;
    color: #fff;
    padding: 12px 24px;
    border-radius: 8px;
    font-size: 14px;
    z-index: 1000010;
    animation: fadeIn 0.3s;
}

@keyframes fadeIn { from { opacity: 0; transform: translate(-50%, 10px); } to { opacity: 1; transform: translate(-50%, 0); } }

/* Text Sizes - Increased for better readability */
.fwa-text-small .fwa-message-body { font-size: 15px; line-height: 1.5; }
.fwa-text-medium .fwa-message-body { font-size: 17px; line-height: 1.5; }
.fwa-text-large .fwa-message-body { font-size: 20px; line-height: 1.6; }

/* Mobile - Fullscreen immersive experience */
@media (max-width: 768px) {
    .fwa-assistant-trigger { padding: 12px 16px; bottom: 16px; right: 16px; }
    
    /* Show zoom button on mobile only */
    .fwa-zoom-btn {
        display: flex !important;
    }
    
    /* Fullscreen chat on mobile - use 100% instead of vh for keyboard compatibility */
    .fwa-assistant-container[data-mode="floating"] .fwa-assistant-chat,
    .fwa-assistant-container[data-mode="modal"] .fwa-assistant-chat {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        height: 100% !important;
        max-width: 100% !important;
        max-height: 100% !important;
        border-radius: 0 !important;
        z-index: 1000000 !important;
    }
    
    .fwa-assistant-modal[data-visible="true"] { padding: 0; }
    .fwa-assistant-modal[data-visible="true"] .fwa-assistant-modal-backdrop { display: none; }
    .fwa-assistant-modal[data-visible="true"] .fwa-assistant-modal-content { 
        width: 100% !important; 
        height: 100% !important; 
        max-width: 100% !important; 
        max-height: 100% !important; 
        border-radius: 0 !important; 
    }
    
    /* MOBILE HEADER - Bigger, more professional */
    .fwa-header { 
        padding: 12px 14px !important; 
        gap: 10px !important;
        min-height: auto !important;
    }
    .fwa-header-logo img {
        height: 36px !important;
        width: 36px !important;
        padding: 3px !important;
        border-radius: 8px !important;
    }
    .fwa-header-info h3 { 
        font-size: 17px !important; 
        line-height: 1.2 !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .fwa-header-controls {
        gap: 6px !important;
    }
    .fwa-header-badge {
        padding: 6px 10px !important;
        font-size: 12px !important;
        gap: 4px !important;
        border-radius: 6px !important;
    }
    .fwa-badge-flag { font-size: 14px !important; }
    .fwa-header-btn {
        width: 34px !important;
        height: 34px !important;
        font-size: 13px !important;
        border-radius: 8px !important;
    }
    .fwa-close-btn { font-size: 20px !important; }
    
    /* 5 buttons in a row on mobile */
    .fwa-controls { 
        display: grid !important;
        grid-template-columns: repeat(5, 1fr) !important;
        gap: 5px !important;
        padding: 8px !important;
        margin-bottom: 0 !important;
    }
    
    .fwa-ctrl-btn { 
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 3px !important;
        padding: 5px 2px !important;
        min-height: 40px !important;
        border-radius: 9px !important;
    }
    
    .fwa-ctrl-icon { font-size: 14px !important; }
    .fwa-ctrl-text { 
        display: block !important; 
        font-size: 9px !important; 
        text-align: center !important;
        line-height: 1.2 !important;
        font-weight: 500 !important;
    }
    
    /* Bigger input area on mobile */
    .fwa-input-area { 
        padding: 10px 12px !important; 
    }
    .fwa-input-row { 
        gap: 8px !important; 
        margin-bottom: 8px !important; 
    }
    .fwa-input { 
        font-size: 17px !important; 
        min-height: 48px !important;
        padding: 12px 14px !important;
        border-radius: 12px !important;
    }
    .fwa-send-btn { 
        min-height: 48px !important; 
        padding: 10px 18px !important; 
        font-size: 16px !important;
        font-weight: 600 !important;
        border-radius: 12px !important;
    }
    
    /* Better message readability on mobile */
    .fwa-message-body { font-size: 17px; line-height: 1.6; }
    .fwa-text-small .fwa-message-body { font-size: 17px; }
    .fwa-text-medium .fwa-message-body { font-size: 19px; }
    .fwa-text-large .fwa-message-body { font-size: 22px; }
    
    /* Message bubbles bigger padding */
    .fwa-message-bubble {
        padding: 14px 16px !important;
        border-radius: 14px !important;
    }
    .fwa-message-meta {
        font-size: 12px !important;
        margin-bottom: 6px !important;
    }
    
    /* Branding */
    .fwa-branding { 
        font-size: 10px !important; 
        padding: 8px 0 !important;
        margin: 0 !important;
    }
    
    .fwa-branding .fwa-contact-human-btn {
        font-size: 9px !important;
        padding: 3px 8px !important;
    }
    
    .fwa-branding .fwa-exit-fast-btn {
        font-size: 9px !important;
        padding: 3px 8px !important;
    }
    
    /* Suggested questions bigger */
    .fwa-questions-toggle {
        padding: 10px 14px !important;
        font-size: 13px !important;
    }
    .fwa-questions-wrapper {
        margin: 0 !important;
    }
    .fwa-question-btn {
        font-size: 14px !important;
        padding: 10px 14px !important;
    }
    
    /* Messages area takes remaining space */
    .fwa-assistant-messages {
        flex: 1 !important;
        min-height: 0 !important;
    }
    
    /* ============================================
       ZOOM LEVELS - Mobile Only Accessibility
       ============================================ */
    
    /* ZOOM LEVEL 1 (Zoom +) - 1.15x scale */
    .fwa-zoom-1 .fwa-header { padding: 14px 16px !important; gap: 12px !important; }
    .fwa-zoom-1 .fwa-header-logo img { height: 42px !important; width: 42px !important; }
    .fwa-zoom-1 .fwa-header-info h3 { font-size: 19px !important; }
    .fwa-zoom-1 .fwa-header-badge { padding: 7px 12px !important; font-size: 14px !important; }
    .fwa-zoom-1 .fwa-badge-flag { font-size: 16px !important; }
    .fwa-zoom-1 .fwa-header-btn { width: 40px !important; height: 40px !important; font-size: 15px !important; }
    .fwa-zoom-1 .fwa-close-btn { font-size: 24px !important; }
    
    .fwa-zoom-1 .fwa-ctrl-btn { min-height: 60px !important; padding: 10px 3px !important; }
    .fwa-zoom-1 .fwa-ctrl-icon { font-size: 22px !important; }
    .fwa-zoom-1 .fwa-ctrl-text { font-size: 10px !important; }
    
    .fwa-zoom-1 .fwa-input { font-size: 19px !important; min-height: 54px !important; padding: 14px 16px !important; }
    .fwa-zoom-1 .fwa-send-btn { min-height: 54px !important; padding: 12px 20px !important; font-size: 18px !important; }
    
    .fwa-zoom-1 .fwa-message-body { font-size: 19px !important; line-height: 1.6 !important; }
    .fwa-zoom-1 .fwa-message-bubble { padding: 16px 18px !important; }
    .fwa-zoom-1 .fwa-message-meta { font-size: 14px !important; }
    
    .fwa-zoom-1 .fwa-questions-toggle { font-size: 15px !important; padding: 12px 16px !important; }
    .fwa-zoom-1 .fwa-question-btn { font-size: 16px !important; padding: 12px 16px !important; }
    .fwa-zoom-1 .fwa-branding { font-size: 12px !important; }
    
    /* ZOOM LEVEL 2 (Zoom ++) - 1.3x scale */
    .fwa-zoom-2 .fwa-header { padding: 16px 18px !important; gap: 14px !important; }
    .fwa-zoom-2 .fwa-header-logo img { height: 48px !important; width: 48px !important; }
    .fwa-zoom-2 .fwa-header-info h3 { font-size: 22px !important; }
    .fwa-zoom-2 .fwa-header-badge { padding: 8px 14px !important; font-size: 16px !important; }
    .fwa-zoom-2 .fwa-badge-flag { font-size: 18px !important; }
    .fwa-zoom-2 .fwa-header-btn { width: 46px !important; height: 46px !important; font-size: 17px !important; }
    .fwa-zoom-2 .fwa-close-btn { font-size: 28px !important; }
    
    .fwa-zoom-2 .fwa-controls { grid-template-columns: repeat(5, 1fr) !important; gap: 4px !important; }
    .fwa-zoom-2 .fwa-ctrl-btn { min-height: 68px !important; padding: 10px 2px !important; }
    .fwa-zoom-2 .fwa-ctrl-icon { font-size: 26px !important; }
    .fwa-zoom-2 .fwa-ctrl-text { font-size: 11px !important; }
    
    .fwa-zoom-2 .fwa-input { font-size: 22px !important; min-height: 60px !important; padding: 16px 18px !important; }
    .fwa-zoom-2 .fwa-send-btn { min-height: 60px !important; padding: 14px 22px !important; font-size: 20px !important; }
    
    .fwa-zoom-2 .fwa-message-body { font-size: 22px !important; line-height: 1.7 !important; }
    .fwa-zoom-2 .fwa-message-bubble { padding: 18px 20px !important; border-radius: 16px !important; }
    .fwa-zoom-2 .fwa-message-meta { font-size: 16px !important; }
    
    .fwa-zoom-2 .fwa-questions-toggle { font-size: 17px !important; padding: 14px 18px !important; }
    .fwa-zoom-2 .fwa-question-btn { font-size: 18px !important; padding: 14px 18px !important; }
    .fwa-zoom-2 .fwa-branding { font-size: 13px !important; }
}

/* Extra small devices */
@media (max-width: 380px) {
    .fwa-ctrl-btn { 
        padding: 6px 2px !important; 
        min-height: 48px !important;
    }
    .fwa-ctrl-text { font-size: 8px !important; }
    .fwa-ctrl-icon { font-size: 16px !important; }
    .fwa-header-info h3 { font-size: 15px !important; }
    .fwa-header-badge { padding: 5px 8px !important; font-size: 11px !important; }
}

/* iOS safe areas */
@supports (padding-top: env(safe-area-inset-top)) {
    @media (max-width: 768px) {
        .fwa-header {
            padding-top: calc(10px + env(safe-area-inset-top)) !important;
        }
        .fwa-input-area {
            padding-bottom: calc(8px + env(safe-area-inset-bottom)) !important;
        }
    }
}

/* Prevent body scroll when chat is open - ONLY on mobile */
@media (max-width: 768px) {
    body.fwa-chat-open { 
        overflow: hidden !important; 
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
    }
}

.fwa-iframe-body { background: transparent !important; }

/* v1.14.0 feedback buttons */
.fwa-feedback { margin-left: auto; display: inline-flex; gap: 6px; } /* v1.35.4 */
.fwa-feedback button {
    background: transparent; border: 1px solid transparent; cursor: pointer;
    font-size: 17px; /* v1.35.4: up from 13px */
    padding: 3px 7px; border-radius: 6px; opacity: 0.7; /* v1.35.4: more visible */
    transition: opacity .15s, background .15s, border-color .15s;
}
.fwa-feedback button:hover { opacity: 1; background: rgba(0,0,0,0.04); }
.fwa-feedback button.active { opacity: 1; border-color: rgba(0,0,0,0.1); background: rgba(0,0,0,0.04); }
.fwa-feedback.voted button { cursor: default; }

/* v1.14.0 lead capture modal */
.fwa-lead-modal.fwa-modal { display: none; }
.fwa-lead-modal.fwa-modal.visible { display: flex; }
.fwa-lead-box { max-width: 420px; width: 92%; }
.fwa-lead-body { padding: 14px 18px 18px; display: flex; flex-direction: column; gap: 10px; }
.fwa-lead-body p { margin: 0 0 4px; color: #4a5568; font-size: 13px; }
.fwa-lead-body label { display: flex; flex-direction: column; font-size: 12px; font-weight: 600; color: #374151; gap: 4px; }
.fwa-lead-body input, .fwa-lead-body textarea {
    font: inherit; font-weight: 400; padding: 8px 10px; border: 1px solid #d1d5db;
    border-radius: 6px; width: 100%; box-sizing: border-box; font-size: 13px;
}
.fwa-lead-body textarea { resize: vertical; min-height: 60px; }
.fwa-lead-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 4px; }
.fwa-lead-actions button { cursor: pointer; }
.fwa-lead-status { font-size: 12px; color: #4a5568; min-height: 16px; text-align: center; }

/* v1.15.0 hands-free voice mode */
.fwa-hf-btn {
    font-size: 10px !important; padding: 3px 7px !important;
    background: #0F6E56 !important; color: #ffffff !important;
    border-color: #0F6E56 !important; position: relative !important;
    display: inline-flex !important; align-items: center !important; gap: 3px !important;
}
.fwa-hf-btn::before {
    content: ''; display: inline-block; width: 6px; height: 6px;
    border-radius: 50%; background: #ffffff;
}
.fwa-hf-btn.active { background: #E8755A !important; border-color: #E8755A !important; }
.fwa-hf-btn.active::before { animation: fwa-hf-btn-blink 1.2s ease-in-out infinite; }
@keyframes fwa-hf-btn-blink { 0%, 100% { opacity: 1; } 50% { opacity: 0.3; } }

.fwa-hf-overlay {
    position: absolute; inset: 0; background: #ffffff;
    display: none; flex-direction: column; align-items: center; justify-content: center;
    padding: 24px 20px; gap: 14px; z-index: 20;
}
.fwa-hf-overlay.active { display: flex; }

.fwa-hf-mic {
    width: 96px; height: 96px; border-radius: 50%;
    background: #0F6E56; display: flex; align-items: center; justify-content: center;
    position: relative; cursor: pointer; border: 0; padding: 0;
    transition: background 0.3s;
}
.fwa-hf-mic:focus-visible { outline: 3px solid #E8755A; outline-offset: 4px; }
.fwa-hf-mic svg { fill: #ffffff; width: 40px; height: 40px; }
.fwa-hf-mic.pulse::before, .fwa-hf-mic.pulse::after {
    content: ''; position: absolute; inset: -10px; border-radius: 50%;
    border: 2px solid #0F6E56; opacity: 0.55;
    animation: fwa-hf-pulse 1.8s ease-out infinite;
}
.fwa-hf-mic.pulse::after { animation-delay: 0.9s; }
@keyframes fwa-hf-pulse {
    0% { transform: scale(0.95); opacity: 0.6; }
    100% { transform: scale(1.45); opacity: 0; }
}
.fwa-hf-mic.thinking { background: #64748b; }
.fwa-hf-mic.thinking svg { display: none; }
.fwa-hf-mic.thinking .fwa-hf-dots { display: flex; }
.fwa-hf-dots { display: none; gap: 5px; position: absolute; }
.fwa-hf-dots span {
    width: 9px; height: 9px; background: #ffffff; border-radius: 50%;
    animation: fwa-hf-dot 1.2s ease-in-out infinite;
}
.fwa-hf-dots span:nth-child(2) { animation-delay: 0.15s; }
.fwa-hf-dots span:nth-child(3) { animation-delay: 0.3s; }
@keyframes fwa-hf-dot { 0%, 100% { opacity: 0.3; transform: translateY(0); } 50% { opacity: 1; transform: translateY(-4px); } }

.fwa-hf-wave { display: none; gap: 5px; align-items: center; height: 36px; }
.fwa-hf-wave.active { display: flex; }
.fwa-hf-wave span {
    width: 5px; background: #0F6E56; border-radius: 3px;
    animation: fwa-hf-wave 0.9s ease-in-out infinite;
}
.fwa-hf-wave span:nth-child(1) { height: 16px; animation-delay: 0s; }
.fwa-hf-wave span:nth-child(2) { height: 26px; animation-delay: 0.1s; }
.fwa-hf-wave span:nth-child(3) { height: 34px; animation-delay: 0.2s; }
.fwa-hf-wave span:nth-child(4) { height: 26px; animation-delay: 0.3s; }
.fwa-hf-wave span:nth-child(5) { height: 20px; animation-delay: 0.15s; }
.fwa-hf-wave span:nth-child(6) { height: 30px; animation-delay: 0.05s; }
.fwa-hf-wave span:nth-child(7) { height: 16px; animation-delay: 0.25s; }
@keyframes fwa-hf-wave { 0%, 100% { transform: scaleY(0.3); } 50% { transform: scaleY(1); } }

.fwa-hf-status {
    font-size: 14px; font-weight: 500; color: #111827;
    text-align: center; min-height: 20px;
}
.fwa-hf-transcript {
    font-size: 13px; color: #111827; text-align: center;
    min-height: 44px; max-width: 280px; line-height: 1.55;
    padding: 0 8px;
}
.fwa-hf-transcript.placeholder { color: #9ca3af; font-style: italic; }
.fwa-hf-hint { font-size: 11px; color: #9ca3af; min-height: 14px; }
.fwa-hf-exit {
    font-size: 11px; padding: 5px 14px;
    background: #ffffff; border: 0.5px solid #e5e7eb; border-radius: 6px;
    color: #6b7280; cursor: pointer;
}
.fwa-hf-exit:hover { border-color: #ef4444; color: #ef4444; }
.fwa-hf-error {
    font-size: 12px; color: #ef4444; text-align: center;
    max-width: 280px; line-height: 1.5;
}

.fwa-hf-active-badge {
    font-size: 10px; background: #E8755A; padding: 3px 7px;
    border-radius: 4px; font-weight: 500;
}

/* ==========================================================================
   v1.15.1 Pulse rings voice indicator (replaces the v1.15.0 mic icon)
   ========================================================================== */

.fwa-hf-rings {
    width: 130px; height: 130px;
    position: relative;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; border: 0; padding: 0; background: transparent;
}
.fwa-hf-rings:focus-visible { outline: 3px solid #E8755A; outline-offset: 6px; border-radius: 50%; }
.fwa-hf-core {
    width: 34px; height: 34px; border-radius: 50%;
    background: #0F6E56;
    z-index: 3; position: relative;
    box-shadow: 0 0 14px rgba(15, 110, 86, 0.3);
    transition: background 0.4s, transform 0.4s, opacity 0.4s, box-shadow 0.4s;
    will-change: transform;
}
.fwa-hf-ring {
    position: absolute; border-radius: 50%;
    border: 2px solid #0F6E56;
    opacity: 0;
    transition: border-color 0.4s;
    will-change: transform, opacity;
}
.fwa-hf-ring-1 { inset: 38px; }
.fwa-hf-ring-2 { inset: 20px; }
.fwa-hf-ring-3 { inset: 2px; }

.fwa-hf-rings[data-state="idle"] .fwa-hf-core,
.fwa-hf-rings[data-state="listening"] .fwa-hf-core,
.fwa-hf-rings[data-state="deciding"] .fwa-hf-core {
    animation: fwa-hf-breathe 2.4s ease-in-out infinite;
}
@keyframes fwa-hf-breathe {
    0%, 100% { transform: scale(1); opacity: 0.9; }
    50% { transform: scale(1.1); opacity: 1; }
}

.fwa-hf-rings[data-state="listening"] .fwa-hf-ring,
.fwa-hf-rings[data-state="deciding"] .fwa-hf-ring {
    animation: fwa-hf-inhale 2.2s ease-in infinite;
}
.fwa-hf-rings[data-state="listening"] .fwa-hf-ring-1,
.fwa-hf-rings[data-state="deciding"] .fwa-hf-ring-1 { animation-delay: 0s; }
.fwa-hf-rings[data-state="listening"] .fwa-hf-ring-2,
.fwa-hf-rings[data-state="deciding"] .fwa-hf-ring-2 { animation-delay: 0.73s; }
.fwa-hf-rings[data-state="listening"] .fwa-hf-ring-3,
.fwa-hf-rings[data-state="deciding"] .fwa-hf-ring-3 { animation-delay: 1.46s; }

.fwa-hf-rings[data-state="hearing"] .fwa-hf-core {
    animation: fwa-hf-react 0.5s ease-in-out infinite;
    box-shadow: 0 0 22px rgba(15, 110, 86, 0.5);
}
.fwa-hf-rings[data-state="hearing"] .fwa-hf-ring {
    animation: fwa-hf-inhale 1.1s ease-in infinite;
    border-width: 2.5px;
}
.fwa-hf-rings[data-state="hearing"] .fwa-hf-ring-1 { animation-delay: 0s; }
.fwa-hf-rings[data-state="hearing"] .fwa-hf-ring-2 { animation-delay: 0.37s; }
.fwa-hf-rings[data-state="hearing"] .fwa-hf-ring-3 { animation-delay: 0.74s; }
@keyframes fwa-hf-react { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.18); } }

.fwa-hf-rings[data-state="thinking"] { animation: fwa-hf-spin 1.8s linear infinite; }
.fwa-hf-rings[data-state="thinking"] .fwa-hf-core {
    background: #888780; transform: scale(0.78); opacity: 0.75;
    box-shadow: 0 0 10px rgba(136, 135, 128, 0.3);
}
.fwa-hf-rings[data-state="thinking"] .fwa-hf-ring-1 {
    opacity: 1; border-color: transparent;
    border-top-color: #888780;
    border-right-color: rgba(136, 135, 128, 0.4);
}
@keyframes fwa-hf-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

.fwa-hf-rings[data-state="speaking"] .fwa-hf-core {
    background: #E8755A;
    animation: fwa-hf-core-speak 0.5s ease-in-out infinite;
    box-shadow: 0 0 20px rgba(232, 117, 90, 0.55);
}
.fwa-hf-rings[data-state="speaking"] .fwa-hf-ring {
    animation: fwa-hf-exhale 1.6s ease-out infinite;
    border-color: #E8755A;
}
.fwa-hf-rings[data-state="speaking"] .fwa-hf-ring-1 { animation-delay: 0s; }
.fwa-hf-rings[data-state="speaking"] .fwa-hf-ring-2 { animation-delay: 0.53s; }
.fwa-hf-rings[data-state="speaking"] .fwa-hf-ring-3 { animation-delay: 1.06s; }
@keyframes fwa-hf-core-speak { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.15); } }

.fwa-hf-rings[data-state="opening"] .fwa-hf-core {
    background: #1D9E75;
    animation: fwa-hf-opening 0.6s ease-out infinite;
    transform: scale(1.3);
    box-shadow: 0 0 24px rgba(29, 158, 117, 0.6);
}
.fwa-hf-rings[data-state="opening"] .fwa-hf-ring {
    animation: fwa-hf-exhale 0.9s ease-out infinite;
    border-color: #1D9E75;
    border-width: 2.5px;
}
.fwa-hf-rings[data-state="opening"] .fwa-hf-ring-1 { animation-delay: 0s; }
.fwa-hf-rings[data-state="opening"] .fwa-hf-ring-2 { animation-delay: 0.3s; }
.fwa-hf-rings[data-state="opening"] .fwa-hf-ring-3 { animation-delay: 0.6s; }
@keyframes fwa-hf-opening { 0%, 100% { transform: scale(1.3); } 50% { transform: scale(1.4); } }

@keyframes fwa-hf-inhale {
    0% { transform: scale(1.7); opacity: 0; }
    25% { opacity: 0.85; }
    100% { transform: scale(0.5); opacity: 0; }
}
@keyframes fwa-hf-exhale {
    0% { transform: scale(0.5); opacity: 0; }
    25% { opacity: 0.85; }
    100% { transform: scale(1.7); opacity: 0; }
}

/* Decision buttons: Open / Hear more */
.fwa-hf-decision {
    display: none; gap: 10px; flex-wrap: wrap; justify-content: center;
    max-width: 300px; margin-top: 2px;
}
.fwa-hf-decision.visible { display: flex; }
.fwa-hf-btn-open {
    font-size: 12px; font-weight: 500; font-family: inherit;
    padding: 8px 14px; border-radius: 7px;
    background: #E8755A; color: #ffffff; border: none; cursor: pointer;
    display: inline-flex; align-items: center; gap: 6px;
    transition: background 0.2s;
}
.fwa-hf-btn-open:hover { background: #D85A30; }
.fwa-hf-btn-more {
    font-size: 12px; font-weight: 500; font-family: inherit;
    padding: 8px 14px; border-radius: 7px;
    background: #ffffff; color: #4b5563; border: 0.5px solid #d1d5db;
    cursor: pointer; transition: border-color 0.2s;
}
.fwa-hf-btn-more:hover { border-color: #9ca3af; color: #1f2937; }

/* Small ring pulse next to the language badge when hands-free is active */
.fwa-header-badge .fwa-hf-indicator {
    display: none;
    width: 10px; height: 10px;
    position: relative;
    margin-right: 4px;
    flex-shrink: 0;
}
.fwa-header-badge.fwa-hf-on .fwa-hf-indicator { display: inline-block; }
.fwa-hf-indicator-core {
    width: 4px; height: 4px; border-radius: 50%;
    background: currentColor;
    position: absolute; top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    animation: fwa-hf-ind-pulse 1.2s ease-in-out infinite;
}
.fwa-hf-indicator-ring {
    position: absolute; inset: 0;
    border-radius: 50%;
    border: 1px solid currentColor;
    animation: fwa-hf-ind-ring 1.5s ease-in infinite;
}
@keyframes fwa-hf-ind-pulse { 0%,100%{opacity:0.7;transform:translate(-50%,-50%) scale(1);} 50%{opacity:1;transform:translate(-50%,-50%) scale(1.2);} }
@keyframes fwa-hf-ind-ring { 0%{transform:scale(1.3);opacity:0;} 30%{opacity:1;} 100%{transform:scale(0.3);opacity:0;} }

/* ============================================================
   v1.37.0: Email builder chip
   ============================================================ */

.fwa-email-chip {
    margin: 10px 16px 4px;
    background: #f0faf6;
    border: 1px solid rgba(15, 110, 86, 0.28);
    border-radius: 14px;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.fwa-ec-header {
    display: flex;
    align-items: center;
    gap: 8px;
}

.fwa-ec-icon {
    font-size: 16px;
    line-height: 1;
    flex-shrink: 0;
}

.fwa-ec-title {
    font-size: 14px;
    font-weight: 700;
    color: #0F6E56;
    line-height: 1.3;
}

.fwa-ec-progress {
    font-size: 11px;
    font-weight: 600;
    color: #888884;
    background: rgba(15,110,86,0.08);
    border-radius: 100px;
    padding: 2px 8px;
    flex-shrink: 0;
}

.fwa-ec-text {
    font-size: 13px;
    color: #4a4a47;
    line-height: 1.6;
    margin: 0;
}

.fwa-ec-input {
    width: 100%;
    padding: 9px 12px;
    border: 1px solid rgba(15,110,86,0.3);
    border-radius: 8px;
    font-size: 14px;
    font-family: inherit;
    color: #111110;
    background: #ffffff;
    outline: none;
    box-sizing: border-box;
}

.fwa-ec-input:focus {
    border-color: #0F6E56;
    box-shadow: 0 0 0 3px rgba(15,110,86,0.1);
}

.fwa-ec-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.fwa-ec-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px 16px;
    border-radius: 100px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    border: none;
    transition: background 0.2s, color 0.2s;
    font-family: inherit;
    line-height: 1;
    white-space: nowrap;
}

.fwa-ec-btn--primary {
    background: #0F6E56;
    color: #ffffff !important;
}

.fwa-ec-btn--primary:hover {
    background: #0a5a46;
    color: #ffffff !important;
}

.fwa-ec-btn--ghost {
    background: #ffffff;
    color: #0F6E56;
    border: 1px solid rgba(15,110,86,0.3);
}

.fwa-ec-btn--ghost:hover {
    background: #e8f6f1;
}

/* ============================================================
   v1.37.2: Email setup chip
   ============================================================ */

.fwa-setup-chip {
    margin: 8px 16px 4px;
    background: #f7f7f5;
    border: 1px solid rgba(0,0,0,0.1);
    border-radius: 14px;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.fwa-setup-card {
    border: 1px solid #E3E3E0;
    border-radius: 10px;
    overflow: hidden;
    background: #ffffff;
}

.fwa-setup-card--open {
    border-color: #0F6E56;
}

.fwa-setup-card__header {
    width: 100%;
    background: none;
    border: none;
    padding: 11px 14px;
    display: flex;
    align-items: flex-start;
    gap: 8px;
    cursor: pointer;
    text-align: left;
    font-family: inherit;
}

.fwa-setup-card__header:hover {
    background: #f0faf6;
}

.fwa-setup-card__name {
    font-size: 14px;
    font-weight: 700;
    color: #111110;
    flex-shrink: 0;
    min-width: 80px;
}

.fwa-setup-card__who {
    font-size: 12px;
    color: #888884;
    line-height: 1.4;
    flex: 1;
}

.fwa-setup-card__arrow {
    font-size: 10px;
    color: #888884;
    flex-shrink: 0;
    margin-top: 2px;
}

.fwa-setup-steps {
    margin: 0;
    padding: 0 14px 4px 30px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fwa-setup-steps li {
    font-size: 13px;
    color: #4a4a47;
    line-height: 1.6;
    padding: 2px 0;
}

.fwa-setup-steps li strong {
    color: #111110;
    font-weight: 600;
}

.fwa-setup-open-btn {
    display: block;
    margin: 10px 14px 14px;
    text-align: center;
    width: calc(100% - 28px);
    box-sizing: border-box;
}

/* ============================================================
   v1.40.0 — Environment-based layout for the iframe endpoint
   ------------------------------------------------------------
   An iframe is a window-inside-a-window, so chat.css's width
   media queries read the iframe's own narrow width (~480px) and
   wrongly apply the mobile layout even when the chat is a desktop
   pop-up. The bubble loader knows the REAL device and tags the
   iframe body with .fwa-env-desktop or .fwa-env-mobile.

   .fwa-env-desktop re-asserts the full desktop layout regardless
   of the iframe's width, so a desktop pop-up looks exactly like
   the native plugin. .fwa-env-mobile (a genuine phone, where the
   bubble is fullscreen) simply lets the existing mobile media
   query do its job. These mirror the desktop rules above and use
   !important to outrank the !important mobile media-query rules.
   ============================================================ */
.fwa-env-desktop .fwa-controls {
    display: flex !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    padding: 0 !important;
    margin-bottom: 10px !important;
    grid-template-columns: none !important;
}
.fwa-env-desktop .fwa-ctrl-btn {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 10px 14px !important;
    min-height: 48px !important;
    border-radius: 24px !important;
    font-size: 16px !important;
}
.fwa-env-desktop .fwa-ctrl-icon { font-size: 18px !important; }
.fwa-env-desktop .fwa-header { padding: 11px 16px !important; gap: 12px !important; }
.fwa-env-desktop .fwa-header-logo img { height: 40px !important; max-width: 96px !important; }
.fwa-env-desktop .fwa-header-info h3 { font-size: 20px !important; }
.fwa-env-desktop .fwa-sponsor-text { font-size: 13px !important; }
/* v1.40.6: footer is a proper three-column grid (Contact Human | Powered By |
   optional Exit Fast). This places each item in its own track so they can
   never overlap or steal each other's clicks - the previous absolute-positioned
   Contact Human sat under the centred Powered By text, which both looked wrong
   and intercepted the button click. */
.fwa-env-desktop .fwa-branding {
    display: grid !important;
    grid-template-columns: 1fr auto 1fr !important;
    align-items: center !important;
    column-gap: 8px !important;
    padding: 10px 12px !important;
    /* v1.42.1: was static - must stay a positioning context now that the
       centred .fwa-branding-text is position:absolute, otherwise the credit
       would centre against the whole widget instead of the footer. */
    position: relative !important;
    font-size: 13px !important;
}
.fwa-env-desktop .fwa-branding .fwa-contact-human-btn {
    position: static !important;
    transform: none !important;
    left: auto !important;
    top: auto !important;
    grid-column: 1 !important;
    justify-self: start !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    background: #22c55e !important;
    padding: 6px 12px !important;
    border-radius: 4px !important;
    border: none !important;
    cursor: pointer !important;
}
.fwa-env-desktop .fwa-branding .fwa-contact-human-btn:hover { background: #16a34a !important; }
.fwa-env-desktop .fwa-branding .fwa-branding-text {
    /* v1.42.1: span all columns - the credit is absolutely centred now, and
       an abspos grid child uses its assigned grid AREA as containing block,
       so pinning it to the empty middle column threw the centring off. */
    grid-column: 1 / -1 !important;
    justify-self: center !important;
}
.fwa-env-desktop .fwa-branding .fwa-exit-fast-btn {
    grid-column: 3 !important;
    justify-self: end !important;
}

/* ============================================================================
 * v1.43.0: NHS health layer
 * ========================================================================== */
.fwa-health-entry { margin: 10px 0 4px; }
    font-size: 13px;
    color: var(--text-color, #1f2937);
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}
.fwa-health-beta {
    background: #fdf3e7;
    color: #8a5a13;
    border: 1px solid #f3e2c8;
    border-radius: 10px;
    padding: 1px 8px;
    font-size: 11px;
    white-space: nowrap;
}
.fwa-health-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0; }
.fwa-health-chip {
    background: var(--background-color, #fff);
    border: 1.5px solid var(--border-color, #e2eaf2);
    border-radius: 18px;
    padding: 7px 13px;
    font-size: 13px;
    font-weight: 600;
    color: var(--primary-color, #0d1f33);
    cursor: pointer;
    font-family: inherit;
    line-height: 1.2;
}
.fwa-health-chip:hover {
    border-color: var(--button-color, #ff6b35);
    color: var(--button-color, #ff6b35);
}
.fwa-health-safeline {
    background: #fdecec;
    border: 1px solid #f2c4c4;
    color: #b32d2d;
    border-radius: 10px;
    padding: 9px 12px;
    font-size: 12.5px;
    line-height: 1.45;
    margin: 8px 0;
}
.fwa-health-pcform { margin: 8px 0; }
.fwa-health-pclabel { font-size: 13px; color: var(--text-color, #1f2937); margin-bottom: 6px; line-height: 1.45; }
.fwa-health-pcrow { display: flex; gap: 8px; }
.fwa-health-pcrow input {
    flex: 1;
    min-width: 0;
    border: 1.5px solid var(--input-border, #e2eaf2);
    background: var(--input-background, #fff);
    border-radius: 10px;
    padding: 9px 12px;
    font-size: 14px;
    font-family: inherit;
    text-transform: uppercase;
}
.fwa-health-pcrow input:focus { outline: 2px solid var(--button-color, #ff6b35); border-color: var(--button-color, #ff6b35); }
.fwa-health-pcrow button {
    background: var(--button-color, #ff6b35);
    color: var(--button-text-color, #fff);
    border: none;
    border-radius: 10px;
    padding: 9px 16px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
}
.fwa-health-pcrow button:disabled { opacity: .65; cursor: wait; }
.fwa-health-reshead { font-size: 13.5px; color: var(--text-color, #1f2937); margin: 10px 0 4px; line-height: 1.45; }
.fwa-health-approx { color: #8a5a13; font-size: 12px; }
.fwa-health-card {
    position: relative;
    background: var(--background-color, #fff);
    border: 1px solid var(--border-color, #e2eaf2);
    border-radius: 12px;
    padding: 11px 13px;
    margin: 6px 0;
}
.fwa-health-card h4 { margin: 0 0 3px; font-size: 14px; color: var(--primary-color, #0d1f33); padding-right: 64px; }
.fwa-health-card p { margin: 0; font-size: 12.5px; color: #5b6b78; line-height: 1.45; }
.fwa-health-dist {
    position: absolute;
    top: 10px;
    right: 12px;
    background: var(--ai-message-color, #f7f9fc);
    color: var(--primary-color, #0d1f33);
    border-radius: 12px;
    padding: 2px 9px;
    font-size: 11.5px;
    font-weight: 700;
}
.fwa-health-tel { display: inline-block; margin-top: 6px; color: var(--button-color, #ff6b35); font-weight: 700; font-size: 13px; text-decoration: none; }
.fwa-health-map { display: inline-block; margin-top: 6px; margin-left: 14px; color: var(--button-color, #ff6b35); font-weight: 700; font-size: 13px; text-decoration: none; }
.fwa-health-none {
    background: var(--ai-message-color, #f7f9fc);
    border: 1px solid var(--border-color, #e2eaf2);
    border-radius: 10px;
    padding: 9px 12px;
    font-size: 13px;
    line-height: 1.45;
    margin: 8px 0;
}
.fwa-health-attrib { font-size: 11px; color: #7b8a96; text-align: center; margin: 6px 0 2px; line-height: 1.4; }

/* ============================================================================
 * v1.47.0: Ask Isa parity - buttons, listen states, and the print stylesheet
 * ========================================================================== */
.fwa-parity-btn .fwa-ctrl-icon { margin-right: 4px; }
.fwa-parity-emergency { border-color: #f2c4c4 !important; color: #b32d2d !important; }
.fwa-parity-listen {
    display: inline-flex; align-items: center; gap: 5px;
    background: var(--primary-color, #0d1f33); color: #fff;
    border: none; border-radius: 16px; padding: 5px 13px;
    font-size: 12.5px; cursor: pointer; font-family: inherit;
    margin: 4px 0 8px; align-self: flex-start;
}
.fwa-listen-playing { background: var(--button-color, #ff6b35) !important; }
.fwa-emergency-panel { margin-top: 8px; }

/* v1.65.3: language picker, the wait notice and the pressed-card state. */
.fwa-lang-wait-note{
    display: flex;
    gap: 8px;
    align-items: flex-start;
    margin: 10px 0 14px;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(108, 63, 166, .10);
    font-size: 12.5px;
    line-height: 1.5;
}
.fwa-lang-opt.fwa-lang-busy{ opacity: .92; }
.fwa-lang-working{
    display: flex;
    align-items: center;
    gap: 7px;
    margin-top: 4px;
    font-size: 11.5px;
    font-weight: 700;
    color: #6C3FA6;
}
.fwa-lang-spin{
    width: 13px;
    height: 13px;
    flex: none;
    border-radius: 50%;
    border: 2px solid rgba(108, 63, 166, .30);
    border-top-color: #6C3FA6;
    animation: fwaLangSpin .8s linear infinite;
}
@keyframes fwaLangSpin{ to { transform: rotate(360deg); } }
/* The spinner is decoration; the words beside it carry the meaning, and
   role="status" announces them. So it stops rather than being the only
   sign of progress for somebody who cannot tolerate motion. */
@media (prefers-reduced-motion: reduce){
    .fwa-lang-spin{ animation: none; border-top-color: rgba(108,63,166,.30); }
}

/* Print / Save: the printout shows the WHOLE conversation, nothing else.
 * A third-party organisation can hand this to someone as a signposting
 * sheet, so every message, card and phone number must be on the paper. */
@media print {
    body.fwa-printing * { visibility: hidden !important; }
    body.fwa-printing .fwa-assistant-messages,
    body.fwa-printing .fwa-assistant-messages * { visibility: visible !important; }
    /* v1.63.4: the messages container was position:absolute for print, but
       absolutely-positioned content does NOT paginate - the browser renders
       only the first page and clips everything below (so a long Support
       Services list vanished after the first card). STATIC flow lets tall
       content break across as many pages as it needs. The visibility trick
       above already hides everything else, so no positioning is required. */
    body.fwa-printing .fwa-assistant-messages {
        position: static !important;
        width: auto !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        background: #fff !important;
        padding: 10mm !important;
    }
    /* v1.63.4: any scrollable/fixed-height ancestor of the messages area would
       otherwise clip the flow back to its own height when printing. Release
       height and overflow on the whole widget chain so the full conversation
       can paginate. */
    body.fwa-printing .fwa-assistant-container,
    body.fwa-printing .fwa-assistant-window,
    body.fwa-printing .fwa-assistant-chat {
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        position: static !important;
    }
    body.fwa-printing .fwa-listen-btn,
    body.fwa-printing .fwa-parity-listen,
    body.fwa-printing .fwa-health-chips,
    body.fwa-printing .fwa-health-pcform,
    body.fwa-printing .fwa-typing { display: none !important; }
    /* v1.65.2: THIS was why a 55-event list printed two events and stopped.
       page-break-inside:avoid on .fwa-message tells the browser to keep the
       whole message on one page. A short reply obliges. A results list taller
       than a sheet of paper cannot, so the browser keeps what fits and drops
       the rest - silently, and it looks like the data was never there.
       Break-avoid now applies only to things that genuinely fit on a page:
       an individual card or row. The message itself may flow over as many
       pages as it needs. */
    body.fwa-printing .fwa-message { page-break-inside: auto; }
    body.fwa-printing .fwa-health-card,
    body.fwa-printing .fwa-ev-row { page-break-inside: avoid; }

    /* v1.63.3: Support Services, Activities and Have Your Say results are tall
       stacked lists. Without explicit print rules the browser clipped them at
       the first page break instead of flowing them on (the pasted list would
       not print). Force every listing subtree to be visible, unclipped, and to
       break BETWEEN cards rather than through them. */
    /* v1.65.2: the events list and its rows, added in 1.63.48 and never given
       print rules. Same fault as the Support Services lists in 1.63.3, and
       worth saying out loud: every new results list needs a line here, or it
       prints the first page and quietly loses the rest. */
    body.fwa-printing .fwa-ev-list,
    body.fwa-printing .fwa-ev-row,
    body.fwa-printing .fwa-ev-body,
    body.fwa-printing .fwa-message-body,
    body.fwa-printing .fwa-message-bubble,
    body.fwa-printing .fwa-support-contacts,
    body.fwa-printing .fwa-support-servicelist,
    body.fwa-printing .fwa-support-servicefoot,
    body.fwa-printing .fwa-act-list,
    body.fwa-printing .fwa-act-foot,
    body.fwa-printing .fwa-vol-card,
    body.fwa-printing .fwa-support-contact {
        overflow: visible !important;
        max-height: none !important;
        height: auto !important;
    }
    body.fwa-printing .fwa-support-contact,
    body.fwa-printing .fwa-vol-card { page-break-inside: avoid; }
    /* Buttons that only make sense on screen shouldn't print. Keep the PDF
       download link visible - it's useful on paper. */
    body.fwa-printing .fwa-support-more,
    body.fwa-printing .fwa-ev-more,
    body.fwa-printing .fwa-act-more,
    body.fwa-printing .fwa-hys-more,
    body.fwa-printing .fwa-ev-progress,
    body.fwa-printing .fwa-tr-wait,
    body.fwa-printing .fwa-tr-quiet { display: none !important; }

    /* Links print as text on paper, so the underline and colour are noise.
       The date pill keeps its shape because it is what makes the list
       scannable when somebody is holding the sheet. */
    body.fwa-printing .fwa-ev-link { text-decoration: none !important; color: #000 !important; }
    body.fwa-printing .fwa-ev-pill { border: 1px solid #999 !important; }

    /* v1.65.7: this is why an embedded widget printed exactly one page while
       the same conversation printed in full on the assistant's own site.

       The 1.63.4 unclipping rules above are body.fwa-printing .fwa-assistant-chat,
       which is two classes. Two things outrank them:

         - body.fwa-bubble-mode.fwa-chat-open .fwa-assistant-chat, three
           classes, which pins the panel to height:100vh in an embed;
         - .fwa-home-on .fwa-assistant-chat from the Menu Home Screen's
           injected styles, which is a tie on specificity but is added to the
           head at runtime, so it wins on source order and caps the height at
           760px while flex-sizing the message area with min-height:0.

       Either one clips the flow back to a single screen, and a clipped flow
       prints as a single page with the rest silently dropped. So these print
       rules are stated again at a specificity nothing else in the widget
       reaches, and lay the whole chain out as ordinary blocks, which is what
       paginates most reliably. The doubled .fwa-printing is deliberate: it is
       what lifts these above the runtime styles without having to chase every
       future selector that might be added there. */
    /* v1.65.9: THE root cause of the one-page print from an embed, and the
       piece 1.65.7 missed. The iframe document sets html, body { overflow:
       hidden } - correct on screen, because the widget manages its own
       scrolling and the page behind must not gain a scrollbar. But overflow
       hidden on the ROOT gives the browser nothing to paginate: it prints one
       viewport and stops, however tall the content inside is. The native site
       has no such rule, which is why the same conversation printed in full
       there and stopped at one sheet in an embed. Unclipping the widget chain
       was necessary but could never be sufficient while the root stayed shut. */
    html,
    body.fwa-printing {
        overflow: visible !important;
        height: auto !important;
        max-height: none !important;
        position: static !important;
    }
    html body.fwa-printing.fwa-printing .fwa-assistant-container,
    html body.fwa-printing.fwa-printing .fwa-assistant-window,
    html body.fwa-printing.fwa-printing .fwa-assistant-container .fwa-assistant-chat,
    html body.fwa-printing.fwa-printing .fwa-assistant-chat {
        position: static !important;
        display: block !important;
        width: auto !important;
        max-width: none !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
        inset: auto !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }
    html body.fwa-printing.fwa-printing .fwa-assistant-messages {
        position: static !important;
        display: block !important;
        width: auto !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
        flex: none !important;
    }
    /* Laying the message area out as blocks drops the flex gap, so restore the
       spacing directly or the printed sheet reads as one solid slab. */
    html body.fwa-printing.fwa-printing .fwa-assistant-messages > .fwa-message {
        margin-bottom: 8px !important;
    }
    /* The header is sticky furniture on screen and repeats or floats oddly on
       paper; the date and assistant name are already in the print header. */
    body.fwa-printing .fwa-header,
    body.fwa-printing .fwa-input-area,
    body.fwa-printing .fwa-branding,
    body.fwa-printing .fwa-home-urgent { display: none !important; }
}

/* ============================================================================
 * v1.48.0: Guide Tiles + control row layout matching Ask Isa, compact for a
 * small widget window.
 * ========================================================================== */
/* v1.48.6: the Guide Tiles now carry the demo's own palette so the plugin
 * looks like the HTML we built, not a theme-tinted approximation. These are
 * dedicated tile variables, NOT the widget theme vars, so the client's header
 * colours no longer bleed into the tiles. Any site can still override a single
 * variable (e.g. --fwa-tile-accent) to re-skin the whole set. */
.fwa-assistant-messages {
    --fwa-tile-card:          #ffffff;
    --fwa-tile-border:        #dbe6ee;
    --fwa-tile-heading:       #123a5c;   /* navy labels + door titles */
    --fwa-tile-muted:         #5b6b78;   /* door subtitles, Back */
    --fwa-tile-door-hover:    #0e7c86;   /* teal, matches the demo doors */
    --fwa-tile-accent:        #7b2d8b;   /* purple, the tiles' own identity */
    --fwa-tile-accent-soft:   #f3e9f6;   /* icon chip fill */
    --fwa-tile-accent-bg:     #faf5fc;   /* active tile + wee wrap fill */
    --fwa-tile-accent-border: #dcc3e6;   /* wee chip borders */
}
/* v1.59.4: the :not() exception matters. Without it, a health entry the menu
   has revealed (fwa-home-reveal) stayed hidden whenever the tiles module had
   stamped this class on the container - the invisible-finder bug. */
.fwa-tiles-hide-health .fwa-health-entry:not(.fwa-home-reveal) { display: none; }

.fwa-tile-doors { display: flex; gap: 10px; margin: 10px 0 4px; }
.fwa-tile-door {
    flex: 1; background: var(--fwa-tile-card);
    border: 1.5px solid var(--fwa-tile-border); border-radius: 12px;
    padding: 13px 11px; cursor: pointer; text-align: left; font-family: inherit;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.fwa-tile-door:hover { border-color: var(--fwa-tile-door-hover); }
.fwa-tile-door b { display: block; font-size: 13.5px; color: var(--fwa-tile-heading); margin-bottom: 3px; }
.fwa-tile-door small { font-size: 11.5px; color: var(--fwa-tile-muted); }

.fwa-tile-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin: 8px 0; }
.fwa-tile {
    background: var(--fwa-tile-card);
    border: 1.5px solid var(--fwa-tile-border); border-radius: 12px;
    padding: 12px 10px; cursor: pointer; font-family: inherit;
    display: flex; align-items: center; gap: 9px; text-align: left;
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.fwa-tile:hover { border-color: var(--fwa-tile-accent); box-shadow: 0 2px 8px rgba(123, 45, 139, .14); }
.fwa-tile-active { border-color: var(--fwa-tile-accent); background: var(--fwa-tile-accent-bg); }
.fwa-tile-ic {
    font-size: 19px; width: 30px; height: 30px; border-radius: 8px;
    background: var(--fwa-tile-accent-soft); color: var(--fwa-tile-accent);
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.fwa-tile span:last-child { font-size: 12.5px; font-weight: 700; color: var(--fwa-tile-heading); letter-spacing: .02em; }
.fwa-tile-back {
    background: none; border: 1.5px dashed var(--fwa-tile-border);
    border-radius: 16px; padding: 6px 12px; font-size: 12.5px; color: var(--fwa-tile-muted);
    cursor: pointer; font-family: inherit; margin-top: 2px;
}
.fwa-tile-back:hover { border-color: var(--fwa-tile-door-hover); }

.fwa-weewrap {
    background: var(--fwa-tile-accent-bg);
    border: 1px dashed var(--fwa-tile-accent-border);
    border-radius: 12px; padding: 10px; margin: 2px 0 8px;
}
.fwa-weewrap p { font-size: 12px; font-weight: 600; color: var(--fwa-tile-accent); margin: 0 0 7px; }
.fwa-wees { display: flex; flex-wrap: wrap; gap: 7px; }
.fwa-wee {
    background: var(--fwa-tile-card);
    border: 1.5px solid var(--fwa-tile-accent-border); border-radius: 16px;
    padding: 6px 12px; font-size: 12.5px; cursor: pointer;
    color: var(--fwa-tile-heading); font-family: inherit;
    transition: border-color .15s ease, color .15s ease;
}
.fwa-wee:hover { border-color: var(--fwa-tile-accent); color: var(--fwa-tile-accent); }

/* Control row: Ask Isa order, compact so it wraps to two tidy lines in a
 * 400px widget: Auto-Translate, Print/Save, Share, Different Search,
 * EMERGENCY NUMBERS, Clear. Speak stays first; Zoom last. */
.fwa-controls { flex-wrap: wrap; justify-content: center; gap: 5px; }
.fwa-controls .fwa-ctrl-btn { padding: 4px 9px; font-size: 11px; }
.fwa-controls .fwa-ctrl-icon { font-size: 12px; }
.fwa-speak-btn { order: 0; }
.fwa-translate-btn { order: 1; }
.fwa-parity-btn { order: 2; }
.fwa-parity-emergency { order: 5; }
.fwa-controls [data-action="clear"] { order: 6; }
.fwa-zoom-btn { order: 7; }

/* ============================================================================
 * v1.50.0: Connect menu home screen. All rules are scoped under .fwa-home-on
 * (added by the home module only when the setting is on) or to elements the
 * module itself creates, so existing deployments render exactly as before.
 * ========================================================================== */

/* ---- the eight tiles ---- */
.fwa-home-menu {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 9px;
    margin: 6px 0 10px;
}
.fwa-home-tile {
    background: #fff;
    border: 1px solid #E7E4EF;
    border-radius: 14px;
    padding: 12px 6px 10px;
    text-align: center;
    cursor: pointer;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .05);
    font-family: inherit;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
}
.fwa-home-tile:hover,
.fwa-home-tile:focus-visible {
    border-color: var(--fwa-primary, #6C3FA6);
}
.fwa-home-tile-ic { font-size: 21px; line-height: 1; }
.fwa-home-tile-tx {
    font-size: 11.5px;
    font-weight: 700;
    line-height: 1.2;
    color: inherit;
}

/* ---- events: date range picker and date-pill rows (v1.63.48) ---- */
.fwa-ev-dates {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: 7px;
    align-items: end;
    margin-top: 9px;
}
.fwa-ev-dates label { display: block; font-size: 11px; font-weight: 700; color: #5b6b78; }
.fwa-ev-dates label span { display: block; margin-bottom: 3px; }
.fwa-ev-dates input {
    width: 100%;
    border: 1px solid #CFC5DC;
    border-radius: 10px;
    padding: 9px 8px;
    font: inherit;
    font-size: 13px;
    background: #fff;
    color: #17131E;
}
.fwa-ev-go {
    border: 0;
    border-radius: 10px;
    padding: 10px 15px;
    background: #6C3FA6;
    color: #fff;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
    min-height: 40px;
}
.fwa-ev-go:hover { background: #4D2A73; }
.fwa-ev-quick { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.fwa-ev-quick button {
    border: 1px solid #E0D8EB;
    background: #FAF7FD;
    color: #4D2A73;
    border-radius: 999px;
    padding: 7px 12px;
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}
.fwa-ev-quick button:hover { border-color: #6C3FA6; }

.fwa-ev-count { font-weight: 400; color: #5b6b78; }
.fwa-ev-list { margin-top: 10px; }
.fwa-ev-row {
    display: flex;
    gap: 11px;
    align-items: flex-start;
    padding-top: 11px;
    margin-top: 11px;
    border-top: 1px solid #EFE7F4;
}
.fwa-ev-row:first-child { border-top: 0; margin-top: 0; padding-top: 0; }
.fwa-ev-pill {
    flex: none;
    width: 52px;
    border-radius: 10px;
    background: #F3E9F6;
    padding: 7px 4px;
    text-align: center;
    line-height: 1.15;
}
.fwa-ev-pill-d { display: block; font-size: 18px; font-weight: 800; color: #4D2A73; }
.fwa-ev-pill-m { display: block; font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #6C3FA6; }
.fwa-ev-pill-to { display: block; font-size: 10px; color: #5b6b78; margin-top: 2px; }
.fwa-ev-pill-today { background: #6C3FA6; }
.fwa-ev-pill-today .fwa-ev-pill-d,
.fwa-ev-pill-today .fwa-ev-pill-m,
.fwa-ev-pill-today .fwa-ev-pill-to { color: #fff; }
.fwa-ev-pill-t { display: block; font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: #fff; }
.fwa-ev-body { min-width: 0; }
.fwa-ev-name { font-size: 14.5px; font-weight: 700; color: #123a5c; line-height: 1.3; }
.fwa-ev-meta { font-size: 12.5px; color: #5b6b78; margin-top: 2px; }
.fwa-ev-sum { font-size: 13px; color: #4a4a55; line-height: 1.45; margin-top: 3px; }
.fwa-ev-link { display: inline-block; margin-top: 5px; font-size: 13px; font-weight: 700; color: #6C3FA6; text-decoration: none; border-bottom: 1px solid #DCC3E6; }
.fwa-ev-link:hover { color: #4D2A73; border-bottom-color: #6C3FA6; }
.fwa-ev-more {
    display: block;
    width: 100%;
    margin-top: 12px;
    padding: 11px;
    border: 1px solid #DCD3E8;
    border-radius: 10px;
    background: #fff;
    font: inherit;
    font-size: 13.5px;
    font-weight: 800;
    color: #4D2A73;
    cursor: pointer;
    min-height: 44px;
}
.fwa-ev-more:hover { background: #F7F4FC; }
.fwa-ev-progress { margin-top: 10px; }
.fwa-ev-sofar { font-size: 12.5px; font-weight: 700; color: #5b6b78; text-align: center; }
.fwa-ev-track { height: 5px; border-radius: 999px; background: #E6DDEF; margin-top: 8px; overflow: hidden; }
.fwa-ev-track i { display: block; height: 100%; background: #6C3FA6; transition: width .2s ease; }
.fwa-hc .fwa-ev-track { border: 1px solid #000; background: #fff; }
.fwa-hc .fwa-ev-track i { background: #000; }
.fwa-ev-foot { margin-top: 12px; }

/* ---- keyword search box, inside the chat bubble (v1.63.49) ---- */
.fwa-kw-row { display: flex; gap: 7px; margin-top: 9px; }
.fwa-kw-input {
    flex: 1;
    min-width: 0;
    border: 1px solid #CFC5DC;
    border-radius: 11px;
    padding: 10px 12px;
    font: inherit;
    font-size: 13.5px;
    background: #fff;
    color: #17131E;
}
.fwa-kw-input:focus { outline: none; border-color: #6C3FA6; box-shadow: 0 0 0 3px rgba(108,63,166,.14); }
.fwa-kw-go {
    border: 0;
    border-radius: 11px;
    padding: 10px 16px;
    background: #6C3FA6;
    color: #fff;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
    min-height: 44px;
}
.fwa-kw-go:hover { background: #4D2A73; }
.fwa-kw-egs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.fwa-kw-egs button {
    border: 1px solid #E0D8EB;
    background: #FAF7FD;
    color: #4D2A73;
    border-radius: 999px;
    padding: 7px 12px;
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}
.fwa-kw-egs button:hover { border-color: #6C3FA6; }
.fwa-hc .fwa-ev-pill { background: #000 !important; }
.fwa-hc .fwa-ev-pill span { color: #fff !important; }

/* ---- home screen chips: Feedback and Subscribe (v1.63.45) ----
   Outlined, not solid. The crisis bar sits directly below and is
   deliberately quiet; two saturated buttons above it would take the eye
   first, and these are the two least urgent things on the screen. */
.fwa-home-chips {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin: 12px 0 0;
}
.fwa-home-chips.fwa-home-chips-one { grid-template-columns: minmax(0, 1fr); }
.fwa-home-chip {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 44px;          /* tap target, same floor as the crisis bar */
    padding: 8px 10px;
    border-radius: 12px;
    background: #fff;
    font: inherit;
    font-size: 13.5px;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}
.fwa-home-chip-ic { font-size: 15px; line-height: 1; }
.fwa-home-chip-fb  { border: 1.5px solid #B9C6E4; color: #2350A9; }
.fwa-home-chip-sub { border: 1.5px solid #D3C3E4; color: #7A59A6; }
.fwa-home-chip-fb:hover  { background: #F2F5FC; border-color: #2350A9; }
.fwa-home-chip-sub:hover { background: #F7F4FC; border-color: #7A59A6; }
.fwa-hc .fwa-home-chip { border: 2px solid #000 !important; color: #000 !important; }

/* ---- the feedback card ---- */
.fwa-fb-title { font-weight: 800; color: #5A2E8D; font-size: 15px; margin-bottom: 3px; }
.fwa-fb-q { font-size: 13.5px; line-height: 1.45; margin: 0 0 10px; }
.fwa-fb-faces { display: flex; gap: 8px; margin-bottom: 12px; }
.fwa-fb-face {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1.5px solid #DCD3E8;
    background: #fff;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
}
.fwa-fb-face-on { border-color: #6C3FA6; background: #F3E9F6; }
.fwa-fb-lab { display: block; font-size: 12.5px; font-weight: 700; margin-bottom: 7px; }
.fwa-fb-about { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 11px; }
.fwa-fb-chip {
    border: 1.5px solid #CFC5DC;
    background: #fff;
    color: #4D2A73;
    border-radius: 999px;
    padding: 9px 14px;
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    min-height: 40px;
}
.fwa-fb-chip:hover { border-color: #6C3FA6; }
.fwa-fb-chip-on { background: #6C3FA6; border-color: #6C3FA6; color: #fff; }
.fwa-hc .fwa-fb-chip { border: 2px solid #000 !important; color: #000 !important; background: #fff !important; }
.fwa-hc .fwa-fb-chip-on { background: #000 !important; color: #fff !important; }
.fwa-fb-input, .fwa-fb-select {
    display: block;
    width: 100%;
    margin-top: 4px;
    border: 1px solid #CFC5DC;
    border-radius: 9px;
    padding: 9px 10px;
    font: inherit;
    background: #fff;
    color: #17131E;
}
.fwa-fb-send {
    width: 100%;
    border: 0;
    border-radius: 10px;
    padding: 11px 13px;
    background: #6C3FA6;
    color: #fff;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}
.fwa-fb-send[disabled] { opacity: .6; cursor: default; }
.fwa-fb-status { min-height: 18px; font-size: 12px; margin-top: 6px; }
.fwa-fb-error { color: #B42336; }
.fwa-fb-done { font-weight: 800; color: #1d6b3f; font-size: 14.5px; }
.fwa-fb-doneq { font-size: 13px; color: #5b6b78; margin: 6px 0 0; }

/* ---- urgent help bar above the input ---- */
.fwa-home-urgent {
    display: block;
    width: calc(100% - 24px);
    margin: 0 12px 8px;
    background: #FDE8EC;
    border: 1px solid #F3C6D0;
    color: #C63A4E;
    border-radius: 12px;
    padding: 9px 12px;
    font-size: 12.5px;
    font-weight: 700;
    text-align: center;
    cursor: pointer;
    font-family: inherit;
}
.fwa-home-urgent:hover { background: #FBDCE3; }

/* ---- crisis card ---- */
.fwa-home-crisis-head { display: block; color: #C63A4E; margin-bottom: 6px; }
.fwa-home-crisis-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid rgba(198, 58, 78, .15);
}
.fwa-home-crisis-row:last-child { border-bottom: none; }
.fwa-home-crisis-row small { display: block; opacity: .75; }
.fwa-home-crisis-row a {
    background: #C63A4E;
    color: #fff !important;
    font-weight: 700;
    font-size: 12px;
    border-radius: 14px;
    padding: 6px 12px;
    text-decoration: none;
    white-space: nowrap;
}

/* v1.63.15: fuller directory below the four core numbers. Visually calmer
   (not red pills) so the four life-safety numbers above stay dominant. */
.fwa-crisis-dir-head {
    display: block; margin: 14px 0 6px; padding-top: 12px;
    border-top: 1px solid rgba(198,58,78,.25);
    font-weight: 700; color: #7a2a3a; font-size: 13px;
}
.fwa-crisis-dir-row { padding: 8px 0; border-bottom: 1px solid rgba(0,0,0,.06); }
.fwa-crisis-dir-row:last-child { border-bottom: none; }
.fwa-crisis-dir-top { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.fwa-crisis-dir-top b { font-size: 13px; color: #1f2937; }
.fwa-crisis-dir-tel {
    color: #C63A4E !important; font-weight: 700; font-size: 13px;
    text-decoration: none; white-space: nowrap;
}
.fwa-crisis-dir-tel:hover { text-decoration: underline; }
.fwa-crisis-dir-row small { display: block; color: #555; opacity: .85; font-size: 12px; margin-top: 2px; }
.fwa-crisis-dir-web { display: inline-block; margin-top: 3px; color: #6d28d9; font-size: 12px; font-weight: 600; text-decoration: none; }
.fwa-crisis-dir-web:hover { text-decoration: underline; }

/* ---- mic beside Send ---- */
.fwa-mic-btn {
    display: none; /* shown by the home module, with a fallback when unsupported */
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1.5px solid #D8CEE9;
    background: #fff;
    font-size: 17px;
    cursor: pointer;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    padding: 0;
}
.fwa-mic-btn.fwa-mic-show { display: inline-flex; }
.fwa-mic-btn.fwa-mic-on {
    background: #C63A4E;
    border-color: #C63A4E;
    animation: fwaMicPulse 1s infinite;
}
@keyframes fwaMicPulse {
    50% { box-shadow: 0 0 0 8px rgba(198, 58, 78, .18); }
}
@media (prefers-reduced-motion: reduce) {
    .fwa-mic-btn.fwa-mic-on { animation: none; }
}

/* ---- menu mode: the menu is the single front door ----
 * The health finder, events picker, guide-tile doors and suggested-question
 * pills all normally self-inject under the welcome message. With the menu
 * on they stay hidden until their tile reveals them, so the opening screen
 * matches the agreed design exactly. Display only: nothing is removed. */
.fwa-home-on .fwa-health-entry:not(.fwa-home-reveal) { display: none !important; }
.fwa-home-on .fwa-support-entry:not(.fwa-home-reveal) { display: none !important; }
.fwa-home-on .fwa-events-entry:not(.fwa-home-reveal) { display: none !important; }
.fwa-home-on .fwa-tile-doors { display: none !important; }
.fwa-home-on .fwa-tiles-stage { display: none !important; }
.fwa-home-on .fwa-questions-wrapper { display: none !important; }

/* Toolbar trim: Speak is replaced by the mic, Zoom and the translate pill
 * come off the row (auto-translate itself stays on underneath). */
.fwa-home-on .fwa-speak-btn { display: none !important; }
.fwa-home-on [data-action="zoom"] { display: none !important; }
.fwa-home-on .fwa-translate-btn { display: none !important; }
.fwa-home-hidden { display: none !important; }

/* ---- high contrast (header toggle) ----
 * WCAG-minded: solid blacks, 2px borders, no tints. Scoped to .fwa-hc so it
 * only ever applies when the person turns it on. */
.fwa-hc .fwa-assistant-messages { background: #fff !important; }
.fwa-hc .fwa-message-bubble {
    border: 2px solid #000 !important;
    background: #fff !important;
    color: #000 !important;
}
.fwa-hc .fwa-message-user .fwa-message-bubble {
    background: #000 !important;
    color: #fff !important;
}
.fwa-hc .fwa-home-tile { border: 2px solid #000 !important; }
.fwa-hc .fwa-home-tile-tx { color: #000 !important; }
.fwa-hc .fwa-input {
    border: 2px solid #000 !important;
    color: #000 !important;
    background: #fff !important;
}
.fwa-hc .fwa-send-btn {
    background: #000 !important;
    color: #fff !important;
    border: 2px solid #000 !important;
}
.fwa-hc .fwa-mic-btn { border: 2px solid #000 !important; }
.fwa-hc .fwa-ctrl-btn {
    border: 2px solid #000 !important;
    color: #000 !important;
    background: #fff !important;
}
.fwa-hc .fwa-home-urgent { border: 2px solid #C63A4E !important; }
.fwa-hc .fwa-health-chip,
.fwa-hc .fwa-events-chip,
.fwa-hc .fwa-home-crisis-row a { border: 2px solid #000 !important; }

/* ============================================================================
 * v1.50.3: completed Connect South Ayrshire presentation layer.
 * Everything remains scoped to .fwa-home-on, so the default layout and every
 * existing client stay untouched while Menu Home Screen is off.
 * ========================================================================== */
.fwa-assistant-container.fwa-home-on .fwa-assistant-chat {
    --title-color: #6C3FA6;
    --primary-color: #6C3FA6;
    --button-color: #6C3FA6;
    --button-text-color: #ffffff;
    --background-color: #F4F0FB;
    border-radius: 26px !important;
    border: 4px solid #E5DDF2 !important;
    overflow: hidden !important;
}
/* v1.51.1: closed genuinely means closed - see the matching note in the
   JS critical layer. */
.fwa-assistant-container.fwa-home-on .fwa-assistant-chat[data-visible="false"] { display: none !important; }
/* v1.51.1: A+ text sizing in home mode. The Connect layer pins sizes with
   !important, which silently defeated the A+ button (classes applied but
   nothing visibly changed - Colin caught it on the iframe). These re-open
   the sizes tier by tier for everything a reader actually reads. */
.fwa-assistant-container.fwa-home-on.fwa-text-medium .fwa-message-body { font-size: 17px !important; }
.fwa-assistant-container.fwa-home-on.fwa-text-medium .fwa-home-tile-tx { font-size: 13.5px !important; }
.fwa-assistant-container.fwa-home-on.fwa-text-medium .fwa-home-urgent { font-size: 13.5px !important; }
.fwa-assistant-container.fwa-home-on.fwa-text-medium .fwa-input { font-size: 16px !important; }
.fwa-assistant-container.fwa-home-on.fwa-text-medium .fwa-ctrl-text { font-size: 13px !important; }
.fwa-assistant-container.fwa-home-on.fwa-text-medium .fwa-health-chip,
.fwa-assistant-container.fwa-home-on.fwa-text-medium .fwa-events-chip { font-size: 14px !important; }
.fwa-assistant-container.fwa-home-on.fwa-text-large .fwa-message-body { font-size: 20px !important; line-height: 1.6 !important; }
.fwa-assistant-container.fwa-home-on.fwa-text-large .fwa-home-tile-tx { font-size: 15px !important; }
.fwa-assistant-container.fwa-home-on.fwa-text-large .fwa-home-urgent { font-size: 15px !important; }
.fwa-assistant-container.fwa-home-on.fwa-text-large .fwa-input { font-size: 18px !important; }
.fwa-assistant-container.fwa-home-on.fwa-text-large .fwa-ctrl-text { font-size: 14.5px !important; }
.fwa-assistant-container.fwa-home-on.fwa-text-large .fwa-health-chip,
.fwa-assistant-container.fwa-home-on.fwa-text-large .fwa-events-chip { font-size: 15.5px !important; }
.fwa-assistant-container.fwa-home-on.fwa-text-large .fwa-branding .fwa-contact-human-btn,
.fwa-assistant-container.fwa-home-on.fwa-text-large .fwa-branding .fwa-exit-fast-btn { font-size: 12px !important; }
/* v1.51.3: fluid height - see the matching note in the JS critical layer.
   Aim for the room available minus a 56px margin, cap at 720px, floor at
   520px, never overflow. Computes to exactly 720px on roomy screens, so
   nothing changes there; fixes the squash on 1366x768 / 1280x720 laptops
   at 100% zoom. */
.fwa-assistant-container[data-mode="floating"].fwa-home-on .fwa-assistant-chat {
    /* v1.52.9: margin cut 56px to 24px, so the window sits taller and uses the
       room that was being given away. */
    height: clamp(520px, calc(100dvh - 24px), 760px);
    max-height: calc(100dvh - 12px);
}
/* v1.52.1: trimmed to fit. At 150% Windows display scaling - a normal
   setting, and what Windows recommends on many laptops - the browser only
   reports about 580px of height, so the old sizing left the welcome message
   and two tile rows unreachable behind a scrollbar. Nothing is removed here;
   everything is simply tighter. The urgent help bar is deliberately NOT
   trimmed: 44px is the minimum tap target and it is the crisis path. */
.fwa-assistant-container.fwa-home-on .fwa-header {
    background: #6C3FA6 !important;
    color: #ffffff !important;
    /* v1.63.42: 62px, up from 56px. 1.63.41 had already spent the padding
       to fit a 38px logo, so a bigger one needs the bar itself to grow. */
    min-height: 62px !important;
    padding: 5px 12px !important;
    gap: 8px !important;
}
.fwa-assistant-container.fwa-home-on .fwa-sponsor-badge,
.fwa-assistant-container.fwa-home-on .fwa-lead-btn { display: none !important; }
/* v1.50.7: language badge and close button restored. This block in
   chat.css (not the JS-injected critical layer) was the actual source of
   the "no languages, no close button" bug - it has higher specificity
   than the critical layer's single-class selector, so it was winning
   even after the critical layer was fixed. Header is now: language
   (flag + word), text size, close. High contrast is not injected for
   Connect, so no rule is needed for it here. */
/* v1.53.2: language badge and A+ slimmed so the assistant name stops being
   cut off. These are not the crisis path, so under 44px is fine. The urgent
   help bar stays 44px and is untouched. */
.fwa-assistant-container.fwa-home-on .fwa-header-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    height: 30px !important;
    padding: 0 8px !important;
    border: 0 !important;
    border-radius: 9px !important;
    background: rgba(255,255,255,.18) !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    flex: 0 0 auto !important;
    white-space: nowrap !important;
}
.fwa-assistant-container.fwa-home-on .fwa-header-controls { gap: 6px !important; }
.fwa-assistant-container.fwa-home-on .fwa-header-info h3 {
    color: #ffffff !important;
    font-size: 17px !important;
    font-weight: 750 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}
.fwa-assistant-container.fwa-home-on .fwa-header-btn {
    width: 32px !important;
    min-width: 32px !important;
    height: 30px !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 9px !important;
    background: rgba(255,255,255,.18) !important;
    color: #ffffff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}
.fwa-assistant-container.fwa-home-on .fwa-close-btn {
    width: 28px !important;
    min-width: 28px !important;
    height: 30px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px !important;
    color: #fff !important;
    background: transparent !important;
}
.fwa-home-initial {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    border-radius: 12px;
    background: #ffffff;
    color: #6C3FA6;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 800;
}
/* v1.63.40: the logo is drawn again. It was hidden here and in the injected
   critical layer, so a client could set one and never see it; the letter
   avatar stood in for it. Connect's mark is a wide wordmark, not a square
   badge, so it is sized by height with room to run sideways rather than
   squeezed into a 42px box. */
/* v1.63.41: option 3. The language button keeps its flag and drops the
   word, which is what buys the room for the bigger logo. The span is
   hidden rather than removed, so the language script still writes to it
   and putting the word back is one rule. The button carries an explicit
   aria-label in the templates, so a screen reader still announces what
   it does. */
.fwa-assistant-container.fwa-home-on .fwa-header-badge [data-lang-name] {
    display: none !important;
}
.fwa-assistant-container.fwa-home-on .fwa-header-logo {
    display: flex !important;
    align-items: center !important;
    flex: 0 1 auto !important;
    min-width: 0 !important;
    /* Both of these are needed. iframe.php pins the wrapper to a 56px
       square for desktop, and a rule that only sets display would leave
       that square in place and box the wordmark in. */
    width: auto !important;
    height: auto !important;
}
.fwa-assistant-container.fwa-home-on .fwa-header-logo img {
    width: auto !important;
    height: 44px !important;
    max-width: 148px !important;
    /* The mark has its own off-white background, so it keeps a small white
       chip rather than sitting straight on the purple header. */
    background: #ffffff !important;
    padding: 3px 6px !important;
    border-radius: 10px !important;
    object-fit: contain !important;
    display: block !important;
}
.fwa-assistant-container.fwa-home-on .fwa-assistant-messages {
    background: #F4F0FB !important;
    padding: 8px 12px 6px !important;
    gap: 8px !important;
}
.fwa-assistant-container.fwa-home-on .fwa-assistant-messages > .fwa-message:first-child .fwa-message-meta {
    display: none !important;
}
.fwa-assistant-container.fwa-home-on .fwa-assistant-messages > .fwa-message:first-child .fwa-message-bubble {
    padding: 9px 11px !important;
    font-size: 14px !important;
    line-height: 1.42 !important;
    background: #ffffff !important;
    color: #17131E !important;
    border: 1px solid #E1DCE9 !important;
    border-radius: 17px !important;
    /* v1.52.2: tightened. The welcome bubble is the single biggest content
       item in the menu - at 150% Windows scaling it was eating 100px of a
       254px space, which is why the bottom tile row could not be reached.
       Same words, tighter box. */
    padding: 8px 11px !important;
    box-shadow: none !important;
}
.fwa-assistant-container.fwa-home-on .fwa-assistant-messages > .fwa-message:first-child .fwa-message-body {
    font-size: 13.5px !important;
    line-height: 1.38 !important;
}
.fwa-assistant-container.fwa-home-on .fwa-home-menu {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    /* v1.63.40: every row the same height, so a label that wraps to two
       lines cannot make its own row taller than the one above it. */
    grid-auto-rows: 1fr !important;
    align-items: stretch !important;
    gap: 10px 11px !important;
    margin: 0 !important;
}
.fwa-assistant-container.fwa-home-on .fwa-home-tile {
    height: 100% !important;
    justify-content: center !important;
    min-height: 56px !important;
    padding: 7px 4px 6px !important;
    border: 1px solid #E2DDE9 !important;
    border-radius: 16px !important;
    color: #15101B !important;
    box-shadow: 0 5px 14px rgba(52, 38, 72, .07) !important;
    gap: 5px !important;
}
.fwa-assistant-container.fwa-home-on .fwa-home-tile-ic { font-size: 19px !important; }
.fwa-assistant-container.fwa-home-on .fwa-home-tile-tx {
    font-size: 13px !important;
    line-height: 1.14 !important;
    font-weight: 800 !important;
    /* Two lines' worth of space whether the label uses one or two, so
       "Volunteering" and "Activities/Events" sit at the same height. */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    min-height: 2.28em !important;
}
.fwa-assistant-container.fwa-home-on .fwa-home-urgent {
    width: calc(100% - 28px) !important;
    margin: 0 14px 9px !important;
    min-height: 44px !important;
    border-radius: 13px !important;
    background: #FDE9ED !important;
    border: 1px solid #F3BFC9 !important;
    color: #CE394D !important;
    font-size: 13px !important;
}
.fwa-assistant-container.fwa-home-on .fwa-input-area {
    background: #ffffff !important;
    border-top: 1px solid #E6E0EE !important;
    padding: 12px 14px 0 !important;
}
.fwa-assistant-container.fwa-home-on .fwa-input-row {
    align-items: center !important;
    gap: 8px !important;
    margin: 0 0 9px !important;
}
.fwa-assistant-container.fwa-home-on .fwa-input {
    min-width: 0 !important;
    min-height: 48px !important;
    height: 48px !important;
    max-height: 120px !important;
    border: 1.5px solid #D9CDEA !important;
    border-radius: 25px !important;
    padding: 11px 16px !important;
    background: #ffffff !important;
    font-size: 15px !important;
    line-height: 24px !important;
}
.fwa-assistant-container.fwa-home-on .fwa-mic-btn {
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    border-radius: 50% !important;
    border: 1.5px solid #D9CDEA !important;
    background: #ffffff !important;
    color: #5B4C67 !important;
    font-size: 20px !important;
}
.fwa-assistant-container.fwa-home-on .fwa-send-btn {
    width: auto !important;
    min-width: 80px !important;
    max-width: none !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 18px !important;
    border-radius: 25px !important;
    background: #6C3FA6 !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 800 !important;
}
.fwa-assistant-container.fwa-home-on .fwa-controls {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 9px !important;
    margin: 0 0 10px !important;
    padding: 0 !important;
}
/* v1.52.8: Print / Save and Start again, down 35% (45px to 22px) at Colin's
   request, handing the height back to the tiles. This is the rule that
   actually governs these buttons - it is more specific than the JS critical
   layer, so earlier attempts to trim them elsewhere had no effect at all.
   These two are the least urgent controls in the widget, which is why they
   are the ones that give. The urgent help bar stays 44px. */
.fwa-assistant-container.fwa-home-on .fwa-controls .fwa-ctrl-btn,
.fwa-assistant-container.fwa-home-on .fwa-controls .fwa-parity-btn {
    width: 100% !important;
    min-height: 22px !important;
    height: 22px !important;
    padding: 0 7px !important;
    border: none !important;
    border-radius: 8px !important;
    background: #F1EAFB !important;
    color: #4F237D !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    font-weight: 750 !important;
}
.fwa-assistant-container.fwa-home-on .fwa-controls .fwa-ctrl-icon { font-size: 14px !important; }
.fwa-assistant-container.fwa-home-on .fwa-controls .fwa-ctrl-text { font-size: 13px !important; font-weight: 750 !important; }
/* v1.50.7: footer trimmed from 76px to 48px, Colin's chosen option after
   flagging it looked too heavy. Still comfortably above the 44px minimum
   tap size for Contact Human and Exit Fast. This is the block that was
   actually rendering; the equivalent rule in the JS-injected critical
   layer was already trimmed but this one, being more specific, was the
   one winning. */
.fwa-assistant-container.fwa-home-on .fwa-branding {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 0 !important;
    min-height: 48px !important;
    margin: 0 -14px !important;
    padding: 0 !important;
    position: relative !important;
    background: var(--fwa-foot-credit, #7A59A6) !important;
    overflow: hidden !important;
}
.fwa-assistant-container.fwa-home-on .fwa-branding .fwa-contact-human-btn,
.fwa-assistant-container.fwa-home-on .fwa-branding .fwa-exit-fast-btn,
.fwa-assistant-container.fwa-home-on .fwa-branding .fwa-branding-text {
    position: static !important;
    inset: auto !important;
    transform: none !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 5px 6px !important;
    border: none !important;
    border-radius: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    line-height: 1.15 !important;
    white-space: normal !important;
    font-size: 10.5px !important;
    font-weight: 750 !important;
    text-decoration: none !important;
    box-shadow: none !important;
}
.fwa-assistant-container.fwa-home-on .fwa-branding .fwa-contact-human-btn {
    grid-column: 1 !important;
    background: var(--fwa-foot-contact, #2350A9) !important;
    color: #ffffff !important;
}
.fwa-assistant-container.fwa-home-on .fwa-branding .fwa-branding-text {
    grid-column: 2 !important;
    background: var(--fwa-foot-credit, #7A59A6) !important;
    color: #ffffff !important;
    flex-direction: column !important;
}
.fwa-assistant-container.fwa-home-on .fwa-branding .fwa-branding-text a {
    color: #ffffff !important;
    text-decoration: none !important;
}
.fwa-assistant-container.fwa-home-on .fwa-branding .fwa-exit-fast-btn {
    grid-column: 3 !important;
    background: var(--fwa-foot-exit, #CF394D) !important;
    color: #ffffff !important;
    cursor: pointer !important;
}
.fwa-assistant-container.fwa-home-on .fwa-contact-title {
    color: #5A2E8D;
    font-weight: 800;
    font-size: 16px;
    margin-bottom: 5px;
}
.fwa-assistant-container.fwa-home-on .fwa-contact-copy,
.fwa-assistant-container.fwa-home-on .fwa-contact-later { margin: 0 0 9px; }
.fwa-assistant-container.fwa-home-on .fwa-contact-call {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #2F876D;
    color: #fff !important;
    text-decoration: none;
    font-weight: 800;
    border-radius: 12px;
    padding: 12px 14px;
}
/* v1.63.44: the "send a message" route offered while the office is open.
   Deliberately a quieter button than Call: phoning is still the faster way
   to reach a person during opening hours, and this sits under it rather
   than competing with it. */
.fwa-assistant-container.fwa-home-on .fwa-contact-msg-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-top: 9px;
    padding: 11px 13px;
    border: 1.5px solid #CFC5DC;
    border-radius: 12px;
    background: #fff;
    color: #4D2A73;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}
.fwa-assistant-container.fwa-home-on .fwa-contact-msg-toggle:hover {
    border-color: #6C3FA6;
    background: #F7F4FC;
}
.fwa-assistant-container.fwa-home-on .fwa-contact-form { display: grid; gap: 9px; margin-top: 10px; }
.fwa-assistant-container.fwa-home-on .fwa-contact-form label { display: grid; gap: 4px; font-size: 12.5px; font-weight: 700; }
.fwa-assistant-container.fwa-home-on .fwa-contact-form input,
.fwa-assistant-container.fwa-home-on .fwa-contact-form textarea {
    width: 100%;
    border: 1px solid #CFC5DC;
    border-radius: 9px;
    padding: 9px 10px;
    font: inherit;
    background: #fff;
    color: #17131E;
}
.fwa-assistant-container.fwa-home-on .fwa-contact-form button {
    border: none;
    border-radius: 10px;
    padding: 11px 13px;
    background: #6C3FA6;
    color: #fff;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}
.fwa-assistant-container.fwa-home-on .fwa-contact-form-status { min-height: 18px; font-size: 12px; }
.fwa-assistant-container.fwa-home-on .fwa-contact-form-error { color: #B42336; }
.fwa-assistant-container.fwa-home-on .fwa-contact-form-success {
    padding: 12px;
    border-radius: 10px;
    background: #EAF6F1;
    color: #216A55;
    font-weight: 750;
}

@media (max-width: 520px) {
    .fwa-assistant-container.fwa-home-on .fwa-header-info h3 { font-size: 16px !important; }
    .fwa-assistant-container.fwa-home-on .fwa-home-tile { min-height: 54px !important; }
    .fwa-assistant-container.fwa-home-on .fwa-home-tile-tx { font-size: 12.5px !important; }
    .fwa-assistant-container.fwa-home-on .fwa-assistant-messages { padding-left: 14px !important; padding-right: 14px !important; }
    .fwa-assistant-container.fwa-home-on .fwa-branding .fwa-contact-human-btn,
    .fwa-assistant-container.fwa-home-on .fwa-branding .fwa-exit-fast-btn,
    .fwa-assistant-container.fwa-home-on .fwa-branding .fwa-branding-text { font-size: 11px !important; }
}

/* v1.53.3: bigger bottom buttons on mobile only, at Colin's request. Scoped
   to body.fwa-env-mobile, which the iframe sets only on a real phone (coarse
   pointer plus a small screen), so desktop is completely unaffected - it keeps
   the compact sizes from 1.52.8 and 1.52.9. The text box, mic and Send stay at
   38px as asked; only the toolbar and footer grow ~20%. The urgent help bar
   stays 44px, untouched, still the crisis path. */
body.fwa-env-mobile .fwa-assistant-container.fwa-home-on .fwa-controls .fwa-ctrl-btn,
body.fwa-env-mobile .fwa-assistant-container.fwa-home-on .fwa-controls .fwa-parity-btn {
    min-height: 28px !important;
    height: 28px !important;
}
body.fwa-env-mobile .fwa-assistant-container.fwa-home-on .fwa-controls .fwa-ctrl-text { font-size: 13px !important; }
body.fwa-env-mobile .fwa-assistant-container.fwa-home-on .fwa-controls .fwa-ctrl-icon { font-size: 13px !important; }
/* v1.54.0: mobile footer up 15% at Colin's request (41px to 47px). */
body.fwa-env-mobile .fwa-assistant-container.fwa-home-on .fwa-branding {
    min-height: 47px !important;
    height: 47px !important;
}
body.fwa-env-mobile .fwa-assistant-container.fwa-home-on .fwa-branding .fwa-contact-human-btn,
body.fwa-env-mobile .fwa-assistant-container.fwa-home-on .fwa-branding .fwa-exit-fast-btn,
body.fwa-env-mobile .fwa-assistant-container.fwa-home-on .fwa-branding .fwa-branding-text {
    min-height: 47px !important;
    height: 47px !important;
    font-size: 13.5px !important;
    padding: 6px 7px !important;
}


/* v1.50.5: Connect home screen toolbar hard stop.
 * Only Print / Save and Start again may be visible. This deliberately sits
 * at the very end so cached/legacy toolbar display rules cannot win. */
.fwa-assistant-container.fwa-home-on .fwa-controls .fwa-ctrl-btn.fwa-home-hidden,
.fwa-assistant-container.fwa-home-on .fwa-controls .fwa-parity-btn.fwa-home-hidden,
.fwa-assistant-container.fwa-home-on .fwa-controls [hidden] {
    display: none !important;
}

/* ---------------------------------------------------------------------------
   v1.52.2: Colin's trim of the bottom strips (the yellow area in his
   screenshot). The input row, the Print/Save + Start again toolbar and the
   footer were together eating 153px of a ~524px window at 150% Windows
   scaling. Every pixel taken here is a pixel handed back to the tiles.
   Held to sensible floors: the input stays 38px so it is still comfortable
   to type in, and the toolbar buttons stay 34px. The urgent help bar above
   is untouched at 44px - crisis path, minimum tap target.
   --------------------------------------------------------------------------- */
.fwa-assistant-container.fwa-home-on .fwa-input-area {
    padding: 7px 12px 0 !important;
    gap: 6px !important;
}
.fwa-assistant-container.fwa-home-on .fwa-input-row { gap: 6px !important; }
.fwa-assistant-container.fwa-home-on .fwa-input {
    min-height: 38px !important;
    height: 38px !important;
    padding: 8px 12px !important;
    font-size: 14px !important;
}
.fwa-assistant-container.fwa-home-on .fwa-send-btn {
    min-height: 38px !important;
    height: 38px !important;
    padding: 0 14px !important;
    font-size: 13.5px !important;
}
.fwa-assistant-container.fwa-home-on .fwa-mic-btn {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    font-size: 15px !important;
}
.fwa-assistant-container.fwa-home-on .fwa-controls { gap: 6px !important; }
/* v1.52.8: Print / Save and Start again taken down 35% (34px to 22px) at
   Colin's request, handing the space back to the tiles. These are the two
   least urgent controls in the widget, which is why they are the ones that
   give. The urgent help bar stays at 44px. */
.fwa-assistant-container.fwa-home-on .fwa-ctrl-btn {
    min-height: 22px !important;
    height: 22px !important;
    padding: 0 7px !important;
    border-radius: 8px !important;
}
.fwa-assistant-container.fwa-home-on .fwa-ctrl-text { font-size: 11px !important; }
.fwa-assistant-container.fwa-home-on .fwa-ctrl-icon { font-size: 11px !important; }
/* v1.52.9: footer down 20% (43px to 34px) at Colin's request. The three
   buttons keep their full width, so they are still easy targets - it is only
   the height that gives. */
.fwa-assistant-container.fwa-home-on .fwa-branding {
    min-height: 34px !important;
    height: 34px !important;
}
.fwa-assistant-container.fwa-home-on .fwa-branding .fwa-contact-human-btn,
.fwa-assistant-container.fwa-home-on .fwa-branding .fwa-exit-fast-btn,
.fwa-assistant-container.fwa-home-on .fwa-branding .fwa-branding-text {
    min-height: 34px !important;
    height: 34px !important;
    font-size: 9.5px !important;
    padding: 3px 5px !important;
}
.fwa-assistant-container.fwa-home-on .fwa-branding .fwa-contact-human-btn,
.fwa-assistant-container.fwa-home-on .fwa-branding .fwa-exit-fast-btn,
.fwa-assistant-container.fwa-home-on .fwa-branding .fwa-branding-text {
    font-size: 10.5px !important;
    padding: 4px 6px !important;
}

/* ---------------------------------------------------------------------------
   v1.53.4: always fullscreen on a real phone.

   The only fullscreen rule used to be body.fwa-bubble-mode.fwa-chat-open,
   which matches only the one-line bubble embed. On the direct-visit portal
   page (no ?bubble=1) that class is never set, so after a close and reopen
   the widget fell back to the floating 420px home-mode panel and sat short
   inside the portal with a big gap. Scoping to body.fwa-env-mobile - which
   the page sets only on a genuine phone - makes it fill the screen on every
   open, on both the portal and the bubble, and never touches desktop.
   This is deliberately last and specific so it wins over the 420px home rule.
   --------------------------------------------------------------------------- */
body.fwa-env-mobile.fwa-chat-open .fwa-assistant-container.fwa-home-on .fwa-assistant-chat,
body.fwa-env-mobile .fwa-assistant-container.fwa-home-on .fwa-assistant-chat[data-visible="true"] {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-width: none !important;
    max-height: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* ---------------------------------------------------------------------------
   v1.55.0: Volunteering Finder. New fwa-vol-* classes, styled to sit with
   the events module. Attribution line is required whenever results show.
   --------------------------------------------------------------------------- */
.fwa-vol-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.fwa-vol-chip {
    border: 1.5px solid #CBB9E6; background: #fff; color: #4D2A73;
    border-radius: 16px; padding: 6px 12px; font-size: 12.5px; font-weight: 800;
    cursor: pointer; font-family: inherit;
}
.fwa-vol-chip:hover { background: #6C3FA6; border-color: #6C3FA6; color: #fff; }
.fwa-vol-card {
    background: #fff; border: 1px solid #E7E4EF; border-radius: 12px;
    padding: 10px 12px; margin-top: 8px;
}
.fwa-vol-title { font-weight: 800; font-size: 13.5px; }
.fwa-vol-org   { font-weight: 800; font-size: 11.5px; color: #4D2A73; margin: 1px 0 4px; }
.fwa-vol-snip  { font-size: 12px; line-height: 1.5; color: #555; margin-bottom: 8px; }
.fwa-vol-go {
    display: inline-block; background: #6C3FA6; color: #fff !important;
    font-weight: 800; font-size: 12px; border-radius: 16px; padding: 6px 13px;
    text-decoration: none;
}
.fwa-vol-go:hover { background: #4D2A73; }
/* v1.63.9: activity card action row with See full details + Directions */
.fwa-vol-actions { display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-top:4px; }
.fwa-vol-dir {
    display:inline-flex; align-items:center; gap:5px;
    background:#f3eefe; color:#6d28d9; border:1px solid #d8c9fb;
    border-radius:8px; padding:7px 12px; font-weight:600; font-size:13px;
    text-decoration:none;
}
.fwa-vol-dir:hover { background:#e9dffb; }
/* v1.63.14: Public Services info cards (Council / Transport / Emergency / NHS) */
.fwa-ps-head { font-weight:700; color:#4a2f86; margin-bottom:8px; font-size:15px; }
.fwa-ps-card { background:#faf7ff; border:1px solid #ece4fb; border-radius:10px; padding:11px 13px; margin:8px 0; }
.fwa-ps-cardh { font-weight:700; color:#1f2937; font-size:14px; margin-bottom:3px; }
.fwa-ps-cardp { color:#555; font-size:13.5px; line-height:1.45; margin-bottom:6px; }
.fwa-ps-acts { display:flex; flex-wrap:wrap; gap:10px; }
.fwa-ps-tel, .fwa-ps-mail { color:#6d28d9; font-weight:600; text-decoration:none; font-size:13.5px; }
.fwa-ps-tel:hover, .fwa-ps-mail:hover { text-decoration:underline; }
.fwa-ps-web { color:#6d28d9; font-weight:600; text-decoration:none; font-size:13.5px; }
.fwa-ps-web:hover { text-decoration:underline; }
.fwa-ps-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.fwa-vol-more { display: block; text-align: center; font-weight: 800; font-size: 12px; color: #4D2A73; margin-top: 8px; }
.fwa-vol-attr { font-size: 10.5px; color: #6b6a76; text-align: center; margin-top: 6px; }

/* ============================================================================
 * v1.60.0: Support Services finder (sibling of the NHS health layer)
 * ========================================================================== */
.fwa-support-entry { margin: 10px 0 4px; }
.fwa-support-intro {
    font-size: 13px;
    color: var(--text-color, #1f2937);
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}
.fwa-support-beta {
    background: #eef4ff;
    color: #2451a6;
    border: 1px solid #d3e0f7;
    border-radius: 10px;
    padding: 1px 8px;
    font-size: 11px;
    white-space: nowrap;
}
.fwa-support-chips {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin: 8px 0;
}
.fwa-support-tile {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 6px;
    min-height: 74px;
    padding: 10px 6px;
    background: var(--background-color, #fff);
    border: 1.5px solid var(--border-color, #e2eaf2);
    border-radius: 12px;
    cursor: pointer;
    font-family: inherit;
    line-height: 1.2;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.fwa-support-tile:hover {
    border-color: var(--button-color, #ff6b35);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .08);
}
.fwa-support-tile-ic { font-size: 22px; line-height: 1; }
.fwa-support-tile-label {
    font-size: 11.5px;
    font-weight: 700;
    color: var(--primary-color, #0d1f33);
}
/* Narrow widgets (very small phones): drop to 2 across so labels don't crush. */
@media (max-width: 340px) {
    .fwa-support-chips { grid-template-columns: repeat(2, 1fr); }
}
.fwa-support-card {
    background: var(--ai-message-color, #f7f9fc);
    border: 1px solid var(--border-color, #e2eaf2);
    border-radius: 12px;
    padding: 12px 14px;
    margin: 10px 0;
}
.fwa-support-cardhead { font-size: 15px; margin-bottom: 6px; }
.fwa-support-blurb { font-size: 13px; color: var(--text-color, #1f2937); line-height: 1.45; margin-bottom: 10px; }
.fwa-support-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.fwa-support-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1.5px solid var(--border-color, #e2eaf2);
    background: var(--background-color, #fff);
    color: var(--primary-color, #0d1f33);
    border-radius: 18px;
    padding: 8px 14px;
    font-size: 13px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    text-decoration: none;
    line-height: 1.2;
}
.fwa-support-btn:hover { border-color: var(--button-color, #ff6b35); color: var(--button-color, #ff6b35); }
.fwa-support-btn-primary {
    background: var(--button-color, #0d7377);
    border-color: var(--button-color, #0d7377);
    color: #fff;
}
.fwa-support-btn-primary:hover { color: #fff; opacity: 0.92; }
.fwa-support-btn-again { margin-top: 10px; }
.fwa-support-contacts { margin: 10px 0; }
.fwa-support-contacts-lead { font-size: 12.5px; color: var(--text-color, #6b7280); margin-bottom: 8px; line-height: 1.45; }
.fwa-support-contact {
    border: 1px solid var(--border-color, #e2eaf2);
    background: var(--background-color, #fff);
    border-radius: 10px;
    padding: 9px 12px;
    margin-bottom: 6px;
}
.fwa-support-contact-name { font-weight: 700; font-size: 13.5px; color: var(--primary-color, #0d1f33); }
.fwa-support-contact-desc { font-size: 12px; color: var(--text-color, #6b7280); margin-top: 2px; line-height: 1.4; }
.fwa-support-contact-phone { font-size: 12.5px; margin-top: 4px; }
.fwa-support-contact-phone a, .fwa-support-contact-link a { color: var(--button-color, #0d7377); text-decoration: none; }
.fwa-support-contact-phone a:hover, .fwa-support-contact-link a:hover { text-decoration: underline; }
.fwa-support-contact-link { font-size: 12px; margin-top: 3px; }
.fwa-support-contact-email { font-size: 12.5px; margin-top: 3px; }
.fwa-support-contact-email a { color: var(--button-color, #0d7377); text-decoration: none; }
.fwa-support-contact-email a:hover { text-decoration: underline; }
.fwa-support-contact-notes { font-size: 11.5px; color: var(--text-color, #6b7280); margin-top: 4px; line-height: 1.4; font-style: italic; }
.fwa-support-contact-desc {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.fwa-support-servicelist { margin: 4px 0; }
.fwa-support-servicefoot { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.fwa-support-more { }
/* When the tiles doors are showing (non-menu mode), keep the support entry
   hidden until revealed, matching the health entry rule. */
.fwa-tiles-hide-health .fwa-support-entry:not(.fwa-home-reveal) { display: none; }

/* ============================================================================
 * v1.61.1: translation wait notice (shown only when a translation is slow)
 * ========================================================================== */
.fwa-tr-wait {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--ai-message-color, #f7f9fc);
    border: 1px solid var(--border-color, #e2eaf2);
    border-radius: 12px;
    padding: 11px 13px;
    margin: 10px 0;
}
.fwa-tr-wait-spin {
    width: 20px; height: 20px; flex-shrink: 0;
    border: 2.5px solid var(--border-color, #e2eaf2);
    border-top-color: var(--button-color, #0d7377);
    border-radius: 50%;
    animation: fwa-tr-spin .8s linear infinite;
}
@keyframes fwa-tr-spin { to { transform: rotate(360deg); } }
.fwa-tr-wait-text { display: block; }
.fwa-tr-wait-text[dir="rtl"] { text-align: right; }
.fwa-tr-wait-text b { display: block; font-size: 13.5px; font-weight: 700; color: var(--primary-color, #0d1f33); }
.fwa-tr-wait-text small { display: block; font-size: 12px; color: var(--text-color, #6b7280); margin-top: 2px; line-height: 1.4; }
@media (prefers-reduced-motion: reduce) {
    .fwa-tr-wait-spin { animation-duration: 2s; }
}

/* v1.67.0: the quiet notice for a progressive top-up. Deliberately not a
   card: no border, no fill, no heading weight. The results beside it are
   already readable, so this has to read as a footnote rather than as an
   instruction to stop and wait. When the language has no pre-written word
   (20 of the 45 offered), the spinner appears alone and the row centres
   itself rather than leaving a gap where text would have been. */
.fwa-tr-quiet {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 6px 0 2px;
    padding: 0 2px;
    min-height: 18px;
    font-size: 12px;
    color: var(--text-color, #6b7280);
    opacity: .85;
}
.fwa-tr-quiet[dir="rtl"] { flex-direction: row-reverse; }
.fwa-tr-quiet-spin {
    width: 13px; height: 13px; flex-shrink: 0;
    border: 2px solid var(--border-color, #e2eaf2);
    border-top-color: var(--button-color, #0d7377);
    border-radius: 50%;
    animation: fwa-tr-spin .8s linear infinite;
}
.fwa-tr-quiet-tx { line-height: 1.3; }
@media (prefers-reduced-motion: reduce) {
    .fwa-tr-quiet-spin { animation-duration: 2s; }
}

/* v1.62.0: Local Activities list containers (cards reuse .fwa-vol-card) */
.fwa-act-list { margin-top: 6px; }
.fwa-act-foot { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }

/* v1.62.7: Activities pickers as tile grids inside chat bubbles */
.fwa-act-grid { margin-top: 9px; }
.fwa-act-tile-count { font-size: 10px; color: var(--text-color, #6b7280); font-weight: 700; }

/* v1.63.36: structured opening-hours card ------------------------------ */
.fwa-hours-card{
    background:#ffffff;
    border:1px solid #e2d3ec;
    border-radius:14px;
    padding:16px 18px;
    margin:10px 0 4px;
    max-width:420px;
    box-shadow:0 1px 3px rgba(76,42,115,.06);
}
.fwa-hours-head{display:flex;align-items:center;gap:9px;margin-bottom:12px;}
.fwa-hours-ic{
    display:inline-flex;align-items:center;justify-content:center;
    width:30px;height:30px;border-radius:50%;background:#f3e9f6;font-size:15px;flex:none;
}
.fwa-hours-title{font-size:16px;font-weight:600;color:#4D2A73;}
.fwa-hours-loc{
    padding-top:12px;margin-top:12px;border-top:1px solid #efe7f4;
}
.fwa-hours-loc:first-of-type{border-top:0;margin-top:0;padding-top:0;}
.fwa-hours-name{font-size:15px;font-weight:600;color:#123a5c;margin-bottom:2px;}
.fwa-hours-name::before{content:"\1F4CD";margin-right:6px;font-size:13px;}
.fwa-hours-when{font-size:14px;color:#5b6b78;margin-bottom:3px;}
.fwa-hours-addr{font-size:13px;color:#6C3FA6;text-decoration:none;border-bottom:1px solid #dcc3e6;}
.fwa-hours-addr:hover{color:#4D2A73;border-bottom-color:#6C3FA6;}
.fwa-hours-call{
    display:flex;align-items:center;justify-content:center;gap:8px;
    margin-top:14px;padding:11px;border-radius:10px;
    background:#6C3FA6;color:#ffffff !important;text-decoration:none;
    font-size:15px;font-weight:600;
}
.fwa-hours-call::before{content:"\1F4DE";font-size:15px;}
.fwa-hours-call:hover{background:#4D2A73;}
