:root {
    --vp-chat-maroon: #6f0d18;
    --vp-chat-deep: #3b0710;
    --vp-chat-gold: #e5bb58;
    --vp-chat-cream: #fff9ef;
    --vp-chat-border: rgba(111,13,24,.14);
}

.vp-chat-assistant {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 5000;
    font-family: Arial, Helvetica, sans-serif;
}

.vp-chat-launcher {
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 50%;
    background: linear-gradient(135deg, #760d1a, #4c0811);
    color: #fff8e8;
    width: 58px;
    height: 58px;
    min-height: 58px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 12px 35px rgba(45,5,10,.28);
}

.vp-chat-launcher-icon {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #f4d578;
    color: #6f0d18;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 20px;
}

.vp-chat-panel {
    position: absolute;
    right: 0;
    bottom: 66px;
    width: min(390px, calc(100vw - 32px));
    height: min(620px, calc(100vh - 110px));
    background: var(--vp-chat-cream);
    border: 1px solid var(--vp-chat-border);
    border-radius: 20px;
    box-shadow: 0 25px 70px rgba(32,3,7,.30);
    overflow: hidden;
    display: grid;
    grid-template-rows: auto minmax(0,1fr) auto auto auto;
}

.vp-chat-panel[hidden] { display: none !important; }

.vp-chat-header {
    min-height: 74px;
    padding: 14px 16px;
    background: linear-gradient(135deg, #6f0d18, #42070f);
    color: white;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.vp-chat-header strong {
    display: block;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 18px;
    color: #f5d677;
}
.vp-chat-header span { display:block; margin-top:3px; font-size:12px; opacity:.85; }
.vp-chat-close {
    width: 36px; height:36px; border-radius:50%; border:1px solid rgba(255,255,255,.2);
    background:rgba(255,255,255,.08); color:#fff; font-size:24px; line-height:1; cursor:pointer;
}

.vp-chat-messages {
    overflow-y: auto;
    padding: 17px 14px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    overscroll-behavior: contain;
}
.vp-chat-message { display:flex; }
.vp-chat-message.user { justify-content:flex-end; }
.vp-chat-bubble {
    max-width: 86%;
    border-radius: 16px 16px 16px 5px;
    padding: 11px 13px;
    line-height: 1.45;
    font-size: 14px;
    white-space: pre-wrap;
    overflow-wrap:anywhere;
    background:#f0e5d5;
    color:#301315;
}
.vp-chat-message.user .vp-chat-bubble {
    border-radius:16px 16px 5px 16px;
    background:#74101b;
    color:#fff;
}
.vp-chat-message.loading .vp-chat-bubble { opacity:.65; font-style:italic; }

.vp-chat-actions {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:10px;
}
.vp-chat-action-link {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    max-width:100%;
    padding:7px 10px;
    border:1px solid rgba(111,13,24,.20);
    border-radius:999px;
    background:#fffdf8;
    color:#74101b;
    font-size:12px;
    font-weight:700;
    line-height:1.2;
    text-decoration:none;
    white-space:normal;
}
.vp-chat-action-link:hover,
.vp-chat-action-link:focus-visible {
    background:#74101b;
    color:#fff;
    border-color:#74101b;
}

.vp-chat-suggestions {
    padding: 0 12px 10px;
    display:flex;
    gap:7px;
    overflow-x:auto;
}
.vp-chat-suggestions button {
    flex:0 0 auto;
    border:1px solid rgba(111,13,24,.16);
    background:#fffdf8;
    color:#64101a;
    padding:8px 10px;
    border-radius:999px;
    font-size:12px;
    cursor:pointer;
}

.vp-chat-form {
    border-top:1px solid rgba(111,13,24,.12);
    padding:10px;
    display:grid;
    grid-template-columns:minmax(0,1fr) 42px;
    align-items:end;
    gap:8px;
    background:#fffdf9;
}
.vp-chat-form textarea {
    width:100%;
    box-sizing:border-box;
    resize:none;
    max-height:120px;
    min-height:42px;
    border:1px solid rgba(111,13,24,.18);
    border-radius:13px;
    background:#fff;
    color:#2f1617;
    padding:10px 12px;
    font:inherit;
    outline:none;
}
.vp-chat-form textarea:focus { border-color:#a97a22; box-shadow:0 0 0 3px rgba(229,187,88,.16); }
.vp-chat-send {
    width:42px; height:42px; border:0; border-radius:12px;
    background:#73101b; color:#f8d774; cursor:pointer; font-size:18px;
}
.vp-chat-send:disabled { opacity:.5; cursor:not-allowed; }
.vp-chat-note {
    padding:0 12px 10px;
    background:#fffdf9;
    color:#7a6761;
    font-size:10px;
    line-height:1.35;
}

.sr-only {
    position:absolute !important; width:1px !important; height:1px !important; padding:0 !important;
    margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important;
    white-space:nowrap !important; border:0 !important;
}

@media (max-width: 760px) {
    .vp-chat-assistant { right: 14px; bottom: calc(84px + env(safe-area-inset-bottom)); }
    .vp-chat-launcher { width:48px; height:48px; min-height:48px; padding:7px; border-radius:50%; }
    .vp-chat-launcher-label { display:none; }
    .vp-chat-launcher-icon { width:32px; height:32px; }
    .vp-chat-panel {
        position:fixed;
        left:10px;
        right:10px;
        bottom:calc(78px + env(safe-area-inset-bottom));
        width:auto;
        height:min(68vh, 590px);
        border-radius:18px;
    }
}

/* Hover helper for the compact chat launcher. */
.vp-chat-launcher::before {
    content: attr(data-tooltip);
    position: absolute;
    right: calc(100% + 12px);
    top: 50%;
    transform: translateY(-50%) translateX(6px);
    padding: 9px 12px;
    border-radius: 9px;
    background: #3f0710;
    color: #fff8e8;
    font: 700 13px/1.2 Arial, Helvetica, sans-serif;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    box-shadow: 0 10px 28px rgba(35,3,8,.22);
    transition: opacity .16s ease, transform .16s ease, visibility .16s ease;
}

.vp-chat-launcher::after {
    content: "";
    position: absolute;
    right: calc(100% + 5px);
    top: 50%;
    transform: translateY(-50%);
    border: 7px solid transparent;
    border-left-color: #3f0710;
    opacity: 0;
    visibility: hidden;
    transition: opacity .16s ease, visibility .16s ease;
}

.vp-chat-launcher:hover::before,
.vp-chat-launcher:focus-visible::before,
.vp-chat-launcher:hover::after,
.vp-chat-launcher:focus-visible::after {
    opacity: 1;
    visibility: visible;
}

.vp-chat-launcher:hover::before,
.vp-chat-launcher:focus-visible::before {
    transform: translateY(-50%) translateX(0);
}

@media (hover: none) {
    .vp-chat-launcher::before,
    .vp-chat-launcher::after {
        display: none;
    }
}

/* Keep floating chat above the fixed copyright footer. */
.vp-chat-assistant {
    bottom: 70px;
}

@media (max-width: 760px) {
    .vp-chat-assistant {
        bottom: calc(132px + env(safe-area-inset-bottom));
    }
    .vp-chat-panel {
        bottom: calc(128px + env(safe-area-inset-bottom));
    }
}


/* Mobile: copyright footer is hidden; keep chat above bottom app navigation only. */
@media (max-width: 760px) {
    .vp-chat-assistant {
        bottom: calc(84px + env(safe-area-inset-bottom)) !important;
    }
    .vp-chat-panel {
        bottom: calc(78px + env(safe-area-inset-bottom)) !important;
    }
}