/* =========================
   KELSY — FUTURISTIC BYA AI
========================= */

#bya-chat{
    --kelsy-cyan:#4deeea;
    --kelsy-blue:#3b82f6;
    --kelsy-violet:#8b5cf6;
    --kelsy-night:#07111f;
    position:fixed;
    left:24px;
    top:92px;
    right:auto;
    bottom:auto;
    z-index:999999;
    font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

#chat-button{
    position:relative;
    width:68px;
    height:68px;
    padding:0;
    border:1px solid rgba(125,249,255,.72);
    border-radius:22px;
    background:
        radial-gradient(circle at 30% 20%,rgba(77,238,234,.42),transparent 36%),
        linear-gradient(145deg,#12233f 0%,#10285b 48%,#492b84 100%);
    color:#fff;
    cursor:pointer;
    box-shadow:
        0 0 0 6px rgba(77,238,234,.07),
        0 18px 42px rgba(1,8,20,.48),
        0 0 32px rgba(77,238,234,.32),
        inset 0 1px 1px rgba(255,255,255,.34);
    transition:transform .25s ease,box-shadow .25s ease;
    isolation:isolate;
}

#chat-button::before{
    content:"K";
    display:grid;
    place-items:center;
    width:100%;
    height:100%;
    font-size:28px;
    line-height:1;
    font-weight:750;
    letter-spacing:-1px;
    text-shadow:0 0 18px rgba(255,255,255,.8);
}

#chat-button::after{
    content:"";
    position:absolute;
    inset:-7px;
    z-index:-1;
    border:1px solid rgba(77,238,234,.28);
    border-radius:27px;
    animation:kelsyAura 2.8s ease-in-out infinite;
}

#chat-button:hover{
    transform:translateY(-3px) scale(1.04);
    box-shadow:
        0 0 0 7px rgba(77,238,234,.09),
        0 22px 48px rgba(1,8,20,.55),
        0 0 42px rgba(77,238,234,.46);
}

#chat-button:focus-visible,
#chat-close:focus-visible,
.chat-options button:focus-visible{
    outline:2px solid var(--kelsy-cyan);
    outline-offset:3px;
}

#chat-window{
    display:none !important;
    position:absolute;
    left:0;
    top:86px;
    right:auto;
    bottom:auto;
    width:390px;
    max-width:calc(100vw - 32px);
    overflow:hidden;
    color:#edfaff;
    background:
        radial-gradient(circle at 88% 4%,rgba(139,92,246,.22),transparent 30%),
        radial-gradient(circle at 8% 98%,rgba(77,238,234,.12),transparent 34%),
        linear-gradient(155deg,rgba(10,24,43,.98),rgba(5,14,28,.98));
    border:1px solid rgba(132,231,255,.25);
    border-radius:26px;
    box-shadow:
        0 28px 80px rgba(0,5,16,.62),
        0 0 44px rgba(59,130,246,.16),
        inset 0 1px 0 rgba(255,255,255,.12);
    backdrop-filter:blur(24px) saturate(145%);
    -webkit-backdrop-filter:blur(24px) saturate(145%);
    transform-origin:top left;
}

#chat-window.open{
    display:block !important;
    animation:kelsyOpen .32s cubic-bezier(.2,.82,.3,1);
}

.chat-header{
    position:relative;
    min-height:78px;
    padding:16px 54px 15px 72px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    background:
        linear-gradient(100deg,rgba(77,238,234,.12),rgba(59,130,246,.08) 50%,rgba(139,92,246,.14));
    border-bottom:1px solid rgba(132,231,255,.16);
    color:#fff;
    font-size:16px;
    font-weight:700;
    letter-spacing:.1px;
}

.chat-header::before{
    content:"K";
    position:absolute;
    left:18px;
    top:16px;
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    border:1px solid rgba(125,249,255,.58);
    border-radius:15px;
    background:linear-gradient(145deg,#17335d,#432779);
    box-shadow:0 0 22px rgba(77,238,234,.22);
    color:#fff;
    font-size:20px;
    font-weight:800;
}

.chat-header::after{
    content:"BYA AI Consultant  •  Online";
    margin-top:4px;
    color:#9eeff0;
    font-size:11px;
    font-weight:600;
    letter-spacing:.55px;
    text-transform:uppercase;
}

#chat-close{
    position:absolute;
    top:20px;
    right:18px;
    display:grid;
    place-items:center;
    width:34px;
    height:34px;
    border-radius:11px;
    color:#c9e8f4;
    font-size:24px;
    font-weight:300;
    line-height:1;
    cursor:pointer;
    transition:background .2s ease,color .2s ease,transform .2s ease;
}

#chat-close:hover{
    color:#fff;
    background:rgba(255,255,255,.1);
    transform:rotate(4deg);
}

#chat-messages{
    min-height:190px;
    max-height:330px;
    padding:20px 17px 10px;
    overflow-y:auto;
    scroll-behavior:smooth;
    scrollbar-width:thin;
    scrollbar-color:rgba(77,238,234,.3) transparent;
}

#chat-messages::-webkit-scrollbar{
    width:5px;
}

#chat-messages::-webkit-scrollbar-thumb{
    border-radius:10px;
    background:rgba(77,238,234,.3);
}

.bot-message,
.user-message{
    width:fit-content;
    max-width:86%;
    margin-bottom:13px;
    padding:12px 15px;
    border-radius:17px;
    font-size:14px;
    line-height:1.58;
    box-shadow:0 8px 22px rgba(0,0,0,.12);
    animation:kelsyMessage .28s ease both;
}

.bot-message{
    margin-right:auto;
    color:#eafaff;
    background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.055));
    border:1px solid rgba(170,237,255,.13);
    border-bottom-left-radius:5px;
}

.user-message{
    margin-left:auto;
    color:#fff;
    text-align:left;
    background:linear-gradient(135deg,#2469c8,#6d43c3);
    border:1px solid rgba(255,255,255,.16);
    border-bottom-right-radius:5px;
}

.chat-options{
    position:relative;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    padding:12px 16px 17px;
    border-top:1px solid rgba(132,231,255,.1);
    background:rgba(3,10,23,.28);
}

.chat-options button{
    flex:1 1 auto;
    min-height:39px;
    padding:9px 12px;
    border:1px solid rgba(107,222,241,.22);
    border-radius:12px;
    color:#dffbff;
    background:rgba(31,74,112,.28);
    font-size:12px;
    font-weight:650;
    cursor:pointer;
    transition:transform .2s ease,background .2s ease,border-color .2s ease;
}

.chat-options button:hover{
    transform:translateY(-1px);
    background:rgba(49,111,156,.4);
    border-color:rgba(77,238,234,.48);
}

@keyframes kelsyAura{
    0%,100%{transform:scale(.96);opacity:.48}
    50%{transform:scale(1.08);opacity:.9}
}

@keyframes kelsyOpen{
    from{opacity:0;transform:translateY(16px) scale(.94)}
    to{opacity:1;transform:translateY(0) scale(1)}
}

@keyframes kelsyMessage{
    from{opacity:0;transform:translateY(7px)}
    to{opacity:1;transform:translateY(0)}
}

@media(max-width:600px){
    #bya-chat{
        right:12px !important;
        bottom:12px !important;
    }

    #chat-button{
        width:60px;
        height:60px;
        border-radius:19px;
    }

    #chat-window{
        position:fixed !important;
        right:10px !important;
        bottom:82px !important;
        width:calc(100vw - 20px) !important;
        max-width:390px !important;
        max-height:calc(100dvh - 100px);
        border-radius:22px;
    }

    #chat-messages{
        max-height:calc(100dvh - 300px);
    }
}

@media(prefers-reduced-motion:reduce){
    #chat-button::after,
    #chat-window.open,
    .bot-message,
    .user-message{
        animation:none;
    }
}


/* =========================
   KELSY TRUE NEON GLASS
========================= */

#chat-button{
    border:1px solid rgba(126,249,255,.95);
    background:
        radial-gradient(circle at 35% 25%,rgba(255,255,255,.38),transparent 20%),
        linear-gradient(145deg,rgba(8,39,59,.86),rgba(37,30,88,.82));
    box-shadow:
        0 0 8px rgba(77,238,234,.9),
        0 0 24px rgba(77,238,234,.64),
        0 0 52px rgba(139,92,246,.38),
        inset 0 0 18px rgba(77,238,234,.2),
        inset 0 1px 1px rgba(255,255,255,.75);
}

#chat-button::before{
    color:#f5ffff;
    text-shadow:
        0 0 5px #ffffff,
        0 0 12px #4deeea,
        0 0 25px #4deeea;
}

#chat-button::after{
    border-color:rgba(77,238,234,.72);
    box-shadow:
        0 0 16px rgba(77,238,234,.5),
        inset 0 0 14px rgba(77,238,234,.18);
}

#chat-window{
    background:
        linear-gradient(
            145deg,
            rgba(13,32,51,.70),
            rgba(8,20,39,.58)
        );
    border:1px solid rgba(107,245,255,.82);
    box-shadow:
        0 0 7px rgba(77,238,234,.7),
        0 0 27px rgba(77,238,234,.32),
        0 0 58px rgba(139,92,246,.25),
        0 30px 90px rgba(0,4,14,.58),
        inset 0 0 35px rgba(107,245,255,.055),
        inset 0 1px 0 rgba(255,255,255,.42);
    backdrop-filter:blur(28px) saturate(180%);
    -webkit-backdrop-filter:blur(28px) saturate(180%);
}

#chat-window::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;
    border-radius:inherit;
    background:
        linear-gradient(
            115deg,
            rgba(255,255,255,.20),
            transparent 22%,
            transparent 72%,
            rgba(77,238,234,.10)
        );
}

#chat-window > *{
    position:relative;
    z-index:1;
}

.chat-header{
    background:
        linear-gradient(
            110deg,
            rgba(77,238,234,.16),
            rgba(59,130,246,.08) 48%,
            rgba(217,70,239,.14)
        );
    border-bottom:1px solid rgba(107,245,255,.48);
    box-shadow:
        0 4px 24px rgba(77,238,234,.08),
        inset 0 -1px 0 rgba(255,255,255,.08);
}

.chat-header::before{
    border-color:rgba(126,249,255,.95);
    background:
        linear-gradient(
            145deg,
            rgba(13,66,87,.78),
            rgba(70,38,122,.72)
        );
    box-shadow:
        0 0 8px rgba(77,238,234,.7),
        0 0 22px rgba(77,238,234,.42),
        inset 0 0 12px rgba(255,255,255,.12);
    text-shadow:
        0 0 5px #fff,
        0 0 14px #4deeea;
}

.chat-header::after{
    color:#b9ffff;
    text-shadow:0 0 10px rgba(77,238,234,.72);
}

#chat-messages{
    background:
        radial-gradient(
            circle at 12% 20%,
            rgba(77,238,234,.055),
            transparent 32%
        );
}

.bot-message{
    color:#f1fdff;
    background:
        linear-gradient(
            135deg,
            rgba(204,249,255,.14),
            rgba(126,160,255,.075)
        );
    border:1px solid rgba(166,246,255,.30);
    box-shadow:
        0 8px 25px rgba(0,0,0,.14),
        inset 0 1px 0 rgba(255,255,255,.16);
    backdrop-filter:blur(15px);
}

.user-message{
    background:
        linear-gradient(
            135deg,
            rgba(0,196,218,.82),
            rgba(103,65,201,.88)
        );
    border:1px solid rgba(191,251,255,.52);
    box-shadow:
        0 0 16px rgba(77,238,234,.18),
        inset 0 1px 0 rgba(255,255,255,.28);
}

.chat-options{
    background:rgba(4,15,29,.32);
    border-top-color:rgba(107,245,255,.28);
    backdrop-filter:blur(18px);
}

.chat-options button{
    color:#efffff;
    background:
        linear-gradient(
            135deg,
            rgba(77,238,234,.10),
            rgba(139,92,246,.10)
        );
    border:1px solid rgba(126,249,255,.42);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.10);
}

.chat-options button:hover{
    color:#fff;
    background:
        linear-gradient(
            135deg,
            rgba(77,238,234,.25),
            rgba(139,92,246,.22)
        );
    border-color:#7ef9ff;
    box-shadow:
        0 0 13px rgba(77,238,234,.28),
        inset 0 1px 0 rgba(255,255,255,.18);
}


/* =========================
   KELSY HUMAN HOSTESS MODE
========================= */

#bya-chat{
    right:18px !important;
    bottom:0 !important;
    width:270px;
    height:470px;
    pointer-events:none;
}

#chat-button{
    position:absolute !important;
    right:0 !important;
    bottom:0 !important;
    width:255px !important;
    height:450px !important;
    padding:0 !important;
    overflow:visible !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    transform:none !important;
    pointer-events:auto;
    filter:
        drop-shadow(0 18px 18px rgba(0,0,0,.22))
        drop-shadow(0 0 10px rgba(77,238,234,.10));
}

#chat-button::before,
#chat-button::after{
    display:none !important;
    content:none !important;
}

#chat-button img{
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:center bottom;
    pointer-events:none;
    transition:
        transform .35s ease,
        filter .35s ease;
}

#chat-button:hover img{
    transform:translateY(-4px);
    filter:
        drop-shadow(0 22px 20px rgba(0,0,0,.26))
        drop-shadow(0 0 14px rgba(77,238,234,.16));
}

#kelsy-welcome{
    position:absolute;
    right:205px;
    bottom:350px;
    width:max-content;
    max-width:230px;
    padding:12px 17px;
    border:1px solid rgba(255,255,255,.72);
    border-radius:18px 18px 4px 18px;
    color:#10233d;
    background:rgba(255,255,255,.90);
    box-shadow:
        0 14px 40px rgba(3,15,31,.20),
        inset 0 1px 0 rgba(255,255,255,.92);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    font-size:14px;
    font-weight:650;
    line-height:1.4;
    opacity:0;
    transform:translateY(8px) scale(.96);
    animation:
        kelsyHumanEnter .55s .65s ease forwards,
        kelsyWelcomeFloat 3s 1.3s ease-in-out infinite;
    pointer-events:none;
}

#chat-window{
    position:absolute !important;
    right:235px !important;
    bottom:28px !important;
    width:370px !important;
    max-width:calc(100vw - 315px) !important;
    color:#14263e !important;
    background:rgba(255,255,255,.88) !important;
    border:1px solid rgba(255,255,255,.86) !important;
    box-shadow:
        0 24px 65px rgba(5,18,37,.24),
        inset 0 1px 0 rgba(255,255,255,.95) !important;
    backdrop-filter:blur(24px) saturate(145%) !important;
    -webkit-backdrop-filter:blur(24px) saturate(145%) !important;
}

#chat-window.open + *{
    pointer-events:auto;
}

#chat-window.open{
    pointer-events:auto;
}

.chat-header{
    color:#12233d !important;
    background:rgba(255,255,255,.45) !important;
    border-bottom:1px solid rgba(25,77,104,.10) !important;
    box-shadow:none !important;
}

.chat-header::before{
    color:#fff !important;
    background:linear-gradient(145deg,#174b69,#473477) !important;
}

.chat-header::after{
    color:#287181 !important;
    text-shadow:none !important;
}

#chat-close{
    color:#315069 !important;
}

#chat-messages{
    background:transparent !important;
}

.bot-message{
    color:#172b43 !important;
    background:rgba(232,244,248,.92) !important;
    border:1px solid rgba(70,130,150,.12) !important;
}

.user-message{
    color:#fff !important;
    background:linear-gradient(135deg,#176f86,#514092) !important;
}

.chat-options{
    background:rgba(245,250,252,.66) !important;
    border-top:1px solid rgba(25,77,104,.10) !important;
}

.chat-options button{
    color:#15334b !important;
    background:rgba(255,255,255,.72) !important;
    border:1px solid rgba(28,115,133,.20) !important;
}

@keyframes kelsyHumanEnter{
    from{
        opacity:0;
        transform:translateY(15px) scale(.94);
    }
    to{
        opacity:1;
        transform:translateY(0) scale(1);
    }
}

@keyframes kelsyWelcomeFloat{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-4px)}
}

@media(max-width:760px){
    #bya-chat{
        right:2px !important;
        width:170px;
        height:315px;
    }

    #chat-button{
        width:165px !important;
        height:295px !important;
    }

    #kelsy-welcome{
        right:128px;
        bottom:232px;
        max-width:175px;
        padding:9px 12px;
        font-size:12px;
    }

    #chat-window{
        position:fixed !important;
        right:8px !important;
        bottom:10px !important;
        width:calc(100vw - 16px) !important;
        max-width:none !important;
        max-height:calc(100dvh - 20px);
    }

    #chat-window.open ~ #chat-button{
        opacity:.16;
        pointer-events:none;
    }

    #chat-window.open ~ #kelsy-welcome{
        display:none;
    }
}



/* =========================
   KELSY TRANSPARENT WAVE MODE
========================= */

#chat-window{
    color:#effcff !important;
    background:transparent !important;
    border:1px solid rgba(74,222,255,.92) !important;
    box-shadow:
        0 0 5px rgba(74,222,255,.95),
        0 0 16px rgba(43,190,255,.58),
        0 0 38px rgba(38,113,255,.34),
        inset 0 0 12px rgba(74,222,255,.12) !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
}

#chat-window::before{
    background:
        linear-gradient(
            105deg,
            transparent 0%,
            rgba(80,231,255,.10) 22%,
            transparent 43%,
            transparent 72%,
            rgba(91,111,255,.10) 88%,
            transparent 100%
        ) !important;
}

.chat-header{
    color:#f3fdff !important;
    background:transparent !important;
    border-bottom:1px solid rgba(74,222,255,.42) !important;
    box-shadow:
        0 5px 18px rgba(48,187,255,.08) !important;
    text-shadow:
        0 0 7px rgba(125,239,255,.72) !important;
}

.chat-header::before{
    color:#fff !important;
    background:transparent !important;
    border:1px solid rgba(74,222,255,.88) !important;
    box-shadow:
        0 0 7px rgba(74,222,255,.80),
        0 0 18px rgba(45,147,255,.42) !important;
}

.chat-header::after{
    color:#9df2ff !important;
    text-shadow:
        0 0 8px rgba(74,222,255,.75) !important;
}

#chat-close{
    color:#c8f8ff !important;
    background:transparent !important;
    text-shadow:
        0 0 7px rgba(74,222,255,.75);
}

#chat-messages{
    background:transparent !important;
}

.bot-message,
.user-message{
    color:#f1fcff !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    text-shadow:
        0 1px 3px rgba(0,0,0,.95),
        0 0 6px rgba(27,72,105,.75);
}

.user-message{
    color:#95f4ff !important;
    text-align:right !important;
}

.chat-options{
    background:transparent !important;
    border-top:1px solid rgba(74,222,255,.34) !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
}

.chat-options button{
    color:#dffcff !important;
    background:transparent !important;
    border:1px solid rgba(74,222,255,.58) !important;
    box-shadow:
        0 0 8px rgba(74,222,255,.16),
        inset 0 0 8px rgba(74,222,255,.06) !important;
    text-shadow:
        0 0 6px rgba(74,222,255,.38);
}

.chat-options button:hover{
    color:#fff !important;
    background:rgba(37,151,210,.10) !important;
    border-color:#79efff !important;
    box-shadow:
        0 0 8px rgba(74,222,255,.62),
        0 0 18px rgba(48,126,255,.30),
        inset 0 0 10px rgba(74,222,255,.10) !important;
}

#kelsy-welcome{
    color:#f2fdff !important;
    background:transparent !important;
    border:1px solid rgba(74,222,255,.90) !important;
    box-shadow:
        0 0 5px rgba(74,222,255,.82),
        0 0 16px rgba(48,156,255,.42),
        inset 0 0 9px rgba(74,222,255,.08) !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    text-shadow:
        0 1px 3px rgba(0,0,0,.95),
        0 0 7px rgba(74,222,255,.55);
}



/* =========================
   KELSY LIVE AI INPUT
========================= */

#chat-form{
    display:flex;
    align-items:center;
    gap:9px;
    padding:12px 14px 14px;
    border-top:1px solid rgba(74,222,255,.42);
    background:transparent;
}

#chat-input{
    flex:1;
    min-width:0;
    height:43px;
    padding:0 14px;
    border:1px solid rgba(74,222,255,.65);
    border-radius:13px;
    outline:none;
    color:#f1fdff;
    background:transparent;
    box-shadow:
        0 0 8px rgba(74,222,255,.18),
        inset 0 0 8px rgba(74,222,255,.06);
    font:inherit;
    font-size:14px;
    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

#chat-input::placeholder{
    color:rgba(213,248,255,.68);
}

#chat-input:focus{
    border-color:#7ef4ff;
    box-shadow:
        0 0 7px rgba(74,222,255,.72),
        0 0 18px rgba(48,126,255,.28),
        inset 0 0 8px rgba(74,222,255,.08);
}

#chat-send{
    height:43px;
    padding:0 17px;
    border:1px solid rgba(74,222,255,.85);
    border-radius:13px;
    color:#ecfeff;
    background:transparent;
    box-shadow:
        0 0 8px rgba(74,222,255,.28),
        inset 0 0 8px rgba(74,222,255,.07);
    font:inherit;
    font-size:13px;
    font-weight:700;
    cursor:pointer;
    transition:
        transform .2s ease,
        box-shadow .2s ease;
}

#chat-send:hover{
    transform:translateY(-1px);
    box-shadow:
        0 0 8px rgba(74,222,255,.72),
        0 0 19px rgba(48,126,255,.34);
}

#chat-send:disabled,
#chat-input:disabled{
    cursor:wait;
    opacity:.55;
}

.kelsy-typing{
    display:flex;
    align-items:center;
    gap:5px;
    min-height:22px;
}

.kelsy-typing span{
    width:6px;
    height:6px;
    border-radius:50%;
    background:#77eeff;
    box-shadow:0 0 7px rgba(74,222,255,.82);
    animation:kelsyTyping 1.1s infinite ease-in-out;
}

.kelsy-typing span:nth-child(2){
    animation-delay:.16s;
}

.kelsy-typing span:nth-child(3){
    animation-delay:.32s;
}

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

@keyframes kelsyTyping{
    0%,60%,100%{
        opacity:.35;
        transform:translateY(0);
    }

    30%{
        opacity:1;
        transform:translateY(-3px);
    }
}



/* KELSY READABLE FLOATING DIALOGUES */

.bot-message{
    color:#10283d !important;
    background:rgba(239,251,255,.88) !important;
    border:1px solid rgba(159,239,255,.68) !important;
    box-shadow:
        0 7px 20px rgba(2,20,35,.18),
        0 0 10px rgba(74,222,255,.12),
        inset 0 1px 0 rgba(255,255,255,.92) !important;
    backdrop-filter:blur(12px) !important;
    -webkit-backdrop-filter:blur(12px) !important;
    text-shadow:none !important;
}

.user-message{
    color:#ffffff !important;
    background:rgba(16,79,113,.88) !important;
    border:1px solid rgba(105,231,255,.72) !important;
    box-shadow:
        0 7px 20px rgba(2,20,35,.20),
        0 0 11px rgba(74,222,255,.18),
        inset 0 1px 0 rgba(255,255,255,.18) !important;
    backdrop-filter:blur(12px) !important;
    -webkit-backdrop-filter:blur(12px) !important;
    text-shadow:none !important;
}



/* =========================
   KELSY HUMAN ENTRANCE
========================= */

#bya-chat{
    opacity:0;
    transform:translateY(108%);
    animation:
        kelsySlideIntoView
        .95s
        3s
        cubic-bezier(.18,.82,.28,1)
        forwards;
    will-change:transform,opacity;
}

#chat-button img{
    transform-origin:center bottom;
    animation:
        kelsyLivingPresence
        4.8s
        2.15s
        ease-in-out
        infinite;
}

@keyframes kelsySlideIntoView{
    0%{
        opacity:0;
        transform:translateY(108%);
    }

    62%{
        opacity:1;
        transform:translateY(-2.5%);
    }

    82%{
        transform:translateY(1%);
    }

    100%{
        opacity:1;
        transform:translateY(0);
    }
}

@keyframes kelsyLivingPresence{
    0%,100%{
        transform:translateY(0) rotate(0deg);
    }

    50%{
        transform:translateY(-3px) rotate(.15deg);
    }
}

@media(prefers-reduced-motion:reduce){
    #bya-chat{
        opacity:1;
        transform:none;
        animation:none;
    }

    #chat-button img{
        animation:none;
    }
}



.bot-message,
.user-message{
    white-space:pre-wrap;
    overflow-wrap:anywhere;
}



/* KELSY CLICKABLE WELCOME */

#kelsy-welcome{
    pointer-events:auto !important;
    cursor:pointer;
    user-select:none;
    transition:
        transform .22s ease,
        border-color .22s ease,
        box-shadow .22s ease;
}

#kelsy-welcome:hover{
    border-color:#9af5ff !important;
    box-shadow:
        0 0 7px rgba(74,222,255,.95),
        0 0 21px rgba(48,156,255,.58),
        inset 0 0 10px rgba(74,222,255,.10) !important;
}

#kelsy-welcome:focus-visible{
    outline:2px solid #92f5ff;
    outline-offset:4px;
}



/* KELSY READ-ALOUD CONTROL */
.kelsy-read-aloud{
    display:block;
    width:auto;
    margin-top:9px;
    padding:5px 9px;
    border:1px solid rgba(43,200,220,.55);
    border-radius:999px;
    color:#075f73;
    background:rgba(235,253,255,.92);
    font:600 11px/1.2 Inter,Arial,sans-serif;
    cursor:pointer;
    box-shadow:none;
    transition:
        background .2s ease,
        color .2s ease,
        border-color .2s ease;
}

.kelsy-read-aloud:hover{
    color:#ffffff;
    background:#118ca2;
    border-color:#118ca2;
}

/* =========================================================
   KELSY RESPONSIVE CHAT SIZING
   Auto Large after first visitor message
   Small / Medium / Large / Full Screen
========================================================= */

#chat-window{
    transition:
        width .28s ease,
        height .28s ease,
        max-width .28s ease,
        max-height .28s ease,
        right .28s ease,
        bottom .28s ease;
}

/* SMALL */
#chat-window.kelsy-size-small{
    position:absolute !important;
    right:235px !important;
    bottom:28px !important;
    width:370px !important;
    max-width:calc(100vw - 315px) !important;
}

/* MEDIUM */
#chat-window.kelsy-size-medium{
    position:absolute !important;
    right:20px !important;
    bottom:28px !important;
    width:min(560px,calc(100vw - 48px)) !important;
    max-width:none !important;
}

/* LARGE + AUTOMATIC FIRST-MESSAGE EXPANSION */
#chat-window.kelsy-size-large,
#chat-window.kelsy-expanded:not(.kelsy-size-small):not(.kelsy-size-medium):not(.kelsy-size-full){
    position:absolute !important;
    right:20px !important;
    bottom:24px !important;
    width:min(760px,calc(100vw - 48px)) !important;
    max-width:none !important;
}

#chat-window.kelsy-size-large #chat-messages,
#chat-window.kelsy-expanded:not(.kelsy-size-small):not(.kelsy-size-medium):not(.kelsy-size-full) #chat-messages{
    max-height:55vh !important;
}

/* FULL SCREEN */
#chat-window.kelsy-size-full{
    position:fixed !important;
    inset:16px !important;
    width:auto !important;
    height:auto !important;
    max-width:none !important;
    max-height:none !important;
    border-radius:22px !important;
}

#chat-window.kelsy-size-full #chat-messages{
    max-height:calc(100dvh - 245px) !important;
    min-height:calc(100dvh - 330px) !important;
}

/* Future visible resize control bar */
.kelsy-size-controls{
    display:flex;
    align-items:center;
    gap:5px;
    position:absolute;
    top:17px;
    right:58px;
    z-index:5;
}

.kelsy-size-controls button{
    min-width:29px;
    height:29px;
    padding:0 7px;
    border:1px solid rgba(116,229,255,.55);
    border-radius:8px;
    color:#dffbff;
    background:rgba(5,35,54,.62);
    font:700 10px/1 Inter,Arial,sans-serif;
    cursor:pointer;
    backdrop-filter:blur(8px);
}

.kelsy-size-controls button:hover,
.kelsy-size-controls button.active{
    color:#fff;
    background:rgba(17,140,162,.88);
    border-color:#8ef3ff;
}

/* MOBILE: active conversation becomes near-full-screen */
@media(max-width:760px){

    #chat-window.kelsy-expanded,
    #chat-window.kelsy-size-medium,
    #chat-window.kelsy-size-large,
    #chat-window.kelsy-size-full{
        position:fixed !important;
        left:6px !important;
        right:6px !important;
        top:6px !important;
        bottom:6px !important;
        width:auto !important;
        height:auto !important;
        max-width:none !important;
        max-height:none !important;
        border-radius:18px !important;
    }

    #chat-window.kelsy-expanded #chat-messages,
    #chat-window.kelsy-size-medium #chat-messages,
    #chat-window.kelsy-size-large #chat-messages,
    #chat-window.kelsy-size-full #chat-messages{
        max-height:calc(100dvh - 245px) !important;
    }

    .kelsy-size-controls{
        top:13px;
        right:52px;
        gap:3px;
    }

    .kelsy-size-controls button{
        min-width:26px;
        padding:0 5px;
        font-size:9px;
    }
}


/* =========================================================
   KELSY SMALL MODE — ALWAYS-VISIBLE RESTORE BUTTON
========================================================= */

#chat-window.kelsy-size-small .kelsy-size-controls{
    top:22px !important;
    right:58px !important;
    width:auto !important;
    display:block !important;
}

#chat-window.kelsy-size-small .kelsy-size-controls button{
    display:none !important;
}

/* Reuse existing Large control as the restore button */
#chat-window.kelsy-size-small .kelsy-size-controls button[data-kelsy-size="large"]{
    display:block !important;
    width:auto !important;
    min-width:82px !important;
    height:32px !important;
    padding:0 11px !important;
    font-size:0 !important;
    white-space:nowrap;
}

#chat-window.kelsy-size-small .kelsy-size-controls button[data-kelsy-size="large"]::after{
    content:"↗ Expand";
    font-size:11px;
    font-weight:700;
}

@media(max-width:760px){
    #chat-window.kelsy-size-small .kelsy-size-controls{
        top:14px !important;
        right:50px !important;
    }
}


/* =========================================================
   KELSY FINAL SMALL + FULL SCREEN FIX
========================================================= */

#chat-window.kelsy-size-small .chat-header{
    min-height:118px !important;
    padding-bottom:52px !important;
}

#chat-window.kelsy-size-small .kelsy-size-controls{
    display:flex !important;
    left:12px !important;
    right:12px !important;
    top:auto !important;
    bottom:10px !important;
    width:auto !important;
    justify-content:center !important;
    gap:5px !important;
}

#chat-window.kelsy-size-small .kelsy-size-controls button{
    display:block !important;
    min-width:38px !important;
    width:auto !important;
    height:30px !important;
    padding:0 8px !important;
    font-size:10px !important;
}

#chat-window.kelsy-size-small .kelsy-size-controls button::after{
    content:none !important;
}

#bya-chat:has(#chat-window.kelsy-size-full){
    position:fixed !important;
    inset:0 !important;
    width:100vw !important;
    height:100dvh !important;
    transform:none !important;
    animation:none !important;
}

#bya-chat:has(#chat-window.kelsy-size-full) #chat-window{
    position:fixed !important;
    left:12px !important;
    right:12px !important;
    top:12px !important;
    bottom:12px !important;
    width:auto !important;
    height:auto !important;
    max-width:none !important;
    max-height:none !important;
}

#bya-chat:has(#chat-window.kelsy-size-full) #chat-messages{
    max-height:calc(100dvh - 245px) !important;
}


/* =========================================================
   KELSY TWO-MODE FINAL OVERRIDE
   REGULAR | FULL SCREEN
========================================================= */

#chat-window.kelsy-mode-regular{
    position:absolute !important;
    left:auto !important;
    top:auto !important;
    right:235px !important;
    bottom:28px !important;
    width:370px !important;
    height:auto !important;
    max-width:calc(100vw - 315px) !important;
    max-height:none !important;
}

/* Chat is moved directly under BODY in full-screen mode */
body > #chat-window.kelsy-mode-full{
    position:fixed !important;
    display:flex !important;
    flex-direction:column !important;
    left:12px !important;
    right:12px !important;
    top:12px !important;
    bottom:12px !important;
    width:auto !important;
    height:auto !important;
    max-width:none !important;
    max-height:none !important;
    z-index:2147483647 !important;
    border-radius:20px !important;
}

body > #chat-window.kelsy-mode-full #chat-messages{
    flex:1 1 auto !important;
    min-height:0 !important;
    height:auto !important;
    max-height:none !important;
    overflow-y:auto !important;
}

.kelsy-size-controls{
    display:flex !important;
    position:absolute !important;
    top:20px !important;
    right:58px !important;
    left:auto !important;
    bottom:auto !important;
    width:auto !important;
    gap:5px !important;
    z-index:50 !important;
}

.kelsy-size-controls button{
    display:block !important;
    width:auto !important;
    min-width:0 !important;
    height:31px !important;
    padding:0 9px !important;
    font-size:10px !important;
    white-space:nowrap !important;
}

.kelsy-size-controls button::after{
    content:none !important;
}

@media(max-width:760px){

    #chat-window.kelsy-mode-regular{
        position:fixed !important;
        left:8px !important;
        right:8px !important;
        top:auto !important;
        bottom:10px !important;
        width:auto !important;
        max-width:none !important;
    }

    body > #chat-window.kelsy-mode-full{
        left:4px !important;
        right:4px !important;
        top:4px !important;
        bottom:4px !important;
        border-radius:16px !important;
    }

    .kelsy-size-controls{
        top:16px !important;
        right:50px !important;
    }

    .kelsy-size-controls button{
        padding:0 6px !important;
        font-size:9px !important;
    }
}


/* =========================================================
   KELSY FINAL POSITION — TOP LEFT
   Desktop + mobile floating assistant
   ========================================================= */

#bya-chat{
    left:24px !important;
    top:92px !important;
    right:auto !important;
    bottom:auto !important;
}

@media(max-width:760px){
    #bya-chat{
        left:8px !important;
        top:76px !important;
        right:auto !important;
        bottom:auto !important;
    }
}


/* =========================================================
   KELSY WELCOME TEXT — KEEP INSIDE LEFT EDGE
   Kelsy remains in current top-left position.
   ========================================================= */

#kelsy-welcome{
    left:155px !important;
    right:auto !important;
    top:18px !important;
    bottom:auto !important;
    white-space:nowrap;
}

/* Mobile */
@media(max-width:760px){
    #kelsy-welcome{
        left:125px !important;
        right:auto !important;
        top:12px !important;
        bottom:auto !important;
        max-width:180px;
        white-space:normal;
    }
}


/* =========================================================
   KELSY WELCOME — FINAL HEAD-SIDE POSITION
   ========================================================= */

#kelsy-welcome{
    left:190px !important;
    right:auto !important;
    top:150px !important;
    bottom:auto !important;
    white-space:nowrap !important;
}

/* Mobile */
@media(max-width:760px){
    #kelsy-welcome{
        left:145px !important;
        right:auto !important;
        top:105px !important;
        bottom:auto !important;
        max-width:175px !important;
        white-space:normal !important;
    }
}


/* =========================================================
   KELSY WELCOME — APPROVED HEAD-SIDE POSITION
   Matches approved layout: bubble beside Kelsy's head.
   ========================================================= */

#kelsy-welcome{
    left:165px !important;
    top:55px !important;
    right:auto !important;
    bottom:auto !important;
    white-space:nowrap !important;
}

@media(max-width:760px){
    #kelsy-welcome{
        left:130px !important;
        top:42px !important;
        right:auto !important;
        bottom:auto !important;
        max-width:175px !important;
        white-space:normal !important;
    }
}


/* =========================================================
   KELSY APPROVED FINAL LAYOUT
   Far left + mirrored + welcome above open palm
   IMPORTANT: Does NOT change Kelsy's existing size.
   ========================================================= */

/* Keep the entire Kelsy unit safely inside the left edge */
#bya-chat{
    position:fixed !important;
    left:24px !important;
    top:92px !important;
    right:auto !important;
    bottom:auto !important;
}

/*
 * MIRROR ONLY KELSY'S IMAGE.
 * Her open palm now points inward/right toward the page.
 */
#chat-button img{
    transform:scaleX(-1) !important;
    transform-origin:center center !important;
}

/* Keep hover mirrored too — do not let hover flip her back */
#chat-button:hover img{
    transform:scaleX(-1) translateY(-4px) !important;
}

/*
 * WELCOME BUBBLE
 * Positioned on Kelsy's RIGHT,
 * immediately above the open palm.
 */
#kelsy-welcome{
    position:absolute !important;

    left:205px !important;
    top:150px !important;

    right:auto !important;
    bottom:auto !important;

    width:145px !important;
    max-width:145px !important;

    padding:10px 13px !important;

    white-space:normal !important;
    text-align:left !important;

    font-size:12px !important;
    line-height:1.35 !important;

    z-index:5 !important;
}

/* =========================================================
   MOBILE
   Same visual relationship:
   Kelsy left → palm right → message above palm
   ========================================================= */

@media(max-width:760px){

    #bya-chat{
        left:8px !important;
        top:76px !important;
        right:auto !important;
        bottom:auto !important;
    }

    #chat-button img{
        transform:scaleX(-1) !important;
    }

    #chat-button:hover img{
        transform:scaleX(-1) !important;
    }

    #kelsy-welcome{
        left:138px !important;
        top:92px !important;

        right:auto !important;
        bottom:auto !important;

        width:125px !important;
        max-width:125px !important;

        padding:8px 10px !important;
        font-size:11px !important;
        line-height:1.3 !important;
    }
}


/* =========================================================
   KELSY FINAL FINE-TUNE
   Kelsy slightly higher + bubble directly over open palm
   ========================================================= */

/* Move whole Kelsy unit slightly UP */
#bya-chat{
    top:72px !important;
}

/* Keep Kelsy mirrored */
#chat-button img{
    transform:scaleX(-1) !important;
}

#chat-button:hover img{
    transform:scaleX(-1) translateY(-4px) !important;
}

/* Bring message DOWN directly above her open palm */
#kelsy-welcome{
    left:205px !important;
    top:205px !important;
    right:auto !important;
    bottom:auto !important;
}

/* Mobile fine-tune */
@media(max-width:760px){

    #bya-chat{
        top:66px !important;
    }

    #kelsy-welcome{
        left:138px !important;
        top:135px !important;
        right:auto !important;
        bottom:auto !important;
    }
}


/* =========================================================
   KELSY FINAL POSITION TUNE
   Higher Kelsy + message directly over open palm
   ========================================================= */

/* Move Kelsy farther UP */
#bya-chat{
    top:45px !important;
}

/* Keep her mirrored */
#chat-button img{
    transform:scaleX(-1) !important;
}

#chat-button:hover img{
    transform:scaleX(-1) translateY(-4px) !important;
}

/* Message closer to and directly above open palm */
#kelsy-welcome{
    left:195px !important;
    top:225px !important;
    right:auto !important;
    bottom:auto !important;
}

/* Mobile */
@media(max-width:760px){

    #bya-chat{
        top:48px !important;
    }

    #kelsy-welcome{
        left:132px !important;
        top:148px !important;
        right:auto !important;
        bottom:auto !important;
    }
}


/* KELSY — REPEAT PREVIOUS POSITION MOVEMENT */

/* Another 27px UP */
#bya-chat{
    top:18px !important;
}

/* Keep Kelsy mirrored */
#chat-button img{
    transform:scaleX(-1) !important;
}

#chat-button:hover img{
    transform:scaleX(-1) translateY(-4px) !important;
}

/* Another 10px LEFT + 20px DOWN */
#kelsy-welcome{
    left:185px !important;
    top:245px !important;
    right:auto !important;
    bottom:auto !important;
}


/* KELSY — NEXT POSITION ADJUSTMENT */

/* Kelsy farther UP */
#bya-chat{
    top:-9px !important;
}

/* Text closer to palm: LEFT + DOWN */
#kelsy-welcome{
    left:175px !important;
    top:265px !important;
    right:auto !important;
    bottom:auto !important;
}


/* KELSY — MOVE HIGHER ONLY */
#bya-chat{
    top:-36px !important;
}


/* KELSY — DOUBLE MOVE UP */
#bya-chat{
    top:-90px !important;
}


/* KELSY — HIGHER + SLIGHTLY LARGER */

#bya-chat{
    top:-90px !important;
    width:285px !important;
    height:495px !important;
}

#chat-button{
    width:270px !important;
    height:475px !important;
}

/* Keep mirrored direction */
#chat-button img{
    transform:scaleX(-1) !important;
}

#chat-button:hover img{
    transform:scaleX(-1) translateY(-4px) !important;
}

/* TEXT POSITION UNCHANGED */
#kelsy-welcome{
    left:175px !important;
    top:265px !important;
}


/* KELSY — DOUBLE THE PREVIOUS SIZE INCREASE */

#bya-chat{
    top:-90px !important;
    width:300px !important;
    height:520px !important;
}

#chat-button{
    width:285px !important;
    height:500px !important;
}

/* Keep Kelsy mirrored */
#chat-button img{
    transform:scaleX(-1) !important;
}

#chat-button:hover img{
    transform:scaleX(-1) translateY(-4px) !important;
}

/* Text stays exactly where it was */
#kelsy-welcome{
    left:175px !important;
    top:265px !important;
}


/* KELSY — LARGER SIZE */

#bya-chat{
    top:-90px !important;
    width:350px !important;
    height:600px !important;
}

#chat-button{
    width:330px !important;
    height:580px !important;
}

/* Keep Kelsy mirrored */
#chat-button img{
    transform:scaleX(-1) !important;
}

#chat-button:hover img{
    transform:scaleX(-1) translateY(-4px) !important;
}

/* Keep welcome text at current position */
#kelsy-welcome{
    left:175px !important;
    top:265px !important;
}


/* KELSY — MOVE MUCH FARTHER UP ONLY */
#bya-chat{
    top:-340px !important;
}

/* Keep current size */
#chat-button{
    width:330px !important;
    height:580px !important;
}

/* Keep mirrored */
#chat-button img{
    transform:scaleX(-1) !important;
}

#chat-button:hover img{
    transform:scaleX(-1) translateY(-4px) !important;
}

/* Text position unchanged */
#kelsy-welcome{
    left:175px !important;
    top:265px !important;
}


/* KELSY — SLIGHTLY DOWN FROM LOGO */
#bya-chat{
    top:-300px !important;
}


/* KELSY — MOVE DOWN 80PX ONLY */
#bya-chat{
    top:-220px !important;
}


/* KELSY TEXT — LOWER + RIGHT ONLY */
#kelsy-welcome{
    left:210px !important;
    top:310px !important;
    right:auto !important;
    bottom:auto !important;
}


/* KELSY TEXT — MOVE ONTO PALM */
#kelsy-welcome{
    left:240px !important;
    top:350px !important;
    right:auto !important;
    bottom:auto !important;
}


/* KELSY TEXT — MORE DOWN + SLIGHTLY RIGHT */
#kelsy-welcome{
    left:250px !important;
    top:390px !important;
    right:auto !important;
    bottom:auto !important;
}


/* =========================================================
   KELSY + TEXT — LOCKED TOGETHER
   Move complete unit 30px DOWN
   Do not change individual text position.
   ========================================================= */

#bya-chat{
    top:-190px !important;
}

/*
LOCKED RELATIONSHIP:
Kelsy size remains unchanged.
Text remains:
left:250px
top:390px
*/



/* KELSY — FINAL SMALLER DESKTOP SIZE */
@media (min-width:761px){

    #bya-chat{
        top:-190px !important;
        width:285px !important;
        height:495px !important;
    }

    #chat-button{
        width:270px !important;
        height:475px !important;
    }

    #chat-button img{
        transform:scaleX(-1) !important;
    }

    #chat-button:hover img{
        transform:scaleX(-1) translateY(-4px) !important;
    }

    #kelsy-welcome{
        left:205px !important;
        top:319px !important;
        right:auto !important;
        bottom:auto !important;
    }
}


/* KELSY — FINAL SMALLER MOBILE SIZE */
@media (max-width:760px){

    #bya-chat{
        width:210px !important;
        height:365px !important;
    }

    #chat-button{
        width:195px !important;
        height:345px !important;
    }

    #chat-button img{
        transform:scaleX(-1) !important;
    }

    #chat-button:hover img{
        transform:scaleX(-1) !important;
    }

    #kelsy-welcome{
        left:148px !important;
        top:230px !important;
        right:auto !important;
        bottom:auto !important;
        width:105px !important;
        max-width:105px !important;
        font-size:11px !important;
        line-height:1.25 !important;
    }
}


/* KELSY — FINAL MOBILE POSITION DOWN */
@media (max-width:760px){
    #bya-chat{
        top:-120px !important;
    }
}


/* KELSY — FINAL MOBILE REFINEMENT */
@media (max-width:760px){

    #bya-chat{
        width:170px !important;
        height:294px !important;
        translate:-22px 35px !important;
    }

    #chat-button{
        width:155px !important;
        height:274px !important;
    }

    #kelsy-welcome{
        left:118px !important;
        top:184px !important;
        width:84px !important;
        max-width:84px !important;
        font-size:10px !important;
        line-height:1.25 !important;
    }
}


/* KELSY — MOBILE MOVE ME HINT */

.kelsy-drag-hint{
    display:none;
}

@media (max-width:760px){

    #chat-button{
        position:relative !important;
    }

    .kelsy-drag-hint{
        display:block;
        position:absolute;
        left:50%;
        top:78%;
        transform:translate(-50%,-50%);
        z-index:20;
        padding:5px 10px;
        border:1px solid rgba(77,238,234,.75);
        border-radius:999px;
        background:rgba(4,18,32,.84);
        color:#ffffff;
        font-size:10px;
        font-weight:800;
        line-height:1;
        white-space:nowrap;
        pointer-events:none;
        box-shadow:0 0 12px rgba(77,238,234,.35);
        transition:opacity .2s ease;
    }

    .kelsy-drag-hint.is-hidden{
        opacity:0;
    }
}


/* KELSY — MOBILE INTERACTION REPAIR */

.kelsy-drag-hint{
    display:none !important;
}

@media (max-width:760px){

    #bya-chat{
        z-index:2147483000 !important;
        pointer-events:auto !important;
    }

    #chat-button{
        position:relative !important;
        z-index:2 !important;
        pointer-events:auto !important;
        touch-action:none !important;
        cursor:grab !important;
    }

    #chat-button:active{
        cursor:grabbing !important;
    }

    #chat-button img{
        pointer-events:none !important;
        user-select:none !important;
        -webkit-user-select:none !important;
        -webkit-user-drag:none !important;
    }

    #kelsy-welcome{
        z-index:3 !important;
        pointer-events:auto !important;
        touch-action:manipulation !important;
    }

    #chat-window{
        pointer-events:auto !important;
    }
}


/* KELSY — FINAL PROPORTIONAL MOBILE CHAT */
@media (max-width:760px){

    #chat-window.kelsy-mode-regular{
        position:fixed !important;
        left:auto !important;
        right:10px !important;
        top:auto !important;
        bottom:10px !important;
        width:min(64vw,230px) !important;
        max-width:230px !important;
        height:auto !important;
        max-height:48dvh !important;
        border-radius:16px !important;
        overflow:hidden !important;
    }

    #chat-window.kelsy-mode-regular #chat-messages{
        min-height:100px !important;
        max-height:calc(48dvh - 165px) !important;
        overflow-y:auto !important;
    }

    #chat-window.kelsy-mode-regular .chat-header{
        min-height:52px !important;
        padding:11px 42px 11px 13px !important;
    }

    #chat-window.kelsy-mode-regular #chat-form{
        padding:10px !important;
    }
}


/* KELSY — FINAL DESKTOP LEFT WITH CHAT RIGHT */
@media (min-width:1025px){

    #bya-chat{
        position:fixed !important;
        left:24px !important;
        right:auto !important;
    }

    #kelsy-welcome{
        left:205px !important;
        right:auto !important;
    }

    #chat-window.kelsy-mode-regular{
        position:absolute !important;
        left:calc(100% + 14px) !important;
        right:auto !important;
        top:auto !important;
        bottom:-55px !important;
        width:370px !important;
        max-width:calc(100vw - 340px) !important;
    }
}


/* KELSY — FINAL DARK TYPING AREA */

#chat-window #chat-form{
    background:#061321 !important;
    border-top:1px solid rgba(77,238,234,.35) !important;
    box-shadow:0 -8px 20px rgba(0,0,0,.28) !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
}

#chat-window #chat-input{
    background:#0b1d2e !important;
    color:#ffffff !important;
    border:1px solid rgba(77,238,234,.55) !important;
    caret-color:#4deeea !important;
    opacity:1 !important;
    text-shadow:none !important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.025) !important;
}

#chat-window #chat-input::placeholder{
    color:#aebfcd !important;
    opacity:1 !important;
}

#chat-window #chat-input:focus{
    background:#0d2438 !important;
    border-color:#4deeea !important;
    outline:none !important;
    box-shadow:
        0 0 0 2px rgba(77,238,234,.18),
        0 0 14px rgba(77,238,234,.16) !important;
}

#chat-window #chat-send{
    background:#0d2b40 !important;
    color:#ffffff !important;
    border:1px solid rgba(77,238,234,.65) !important;
}


/* KELSY — MOBILE CHAT ABOVE IMAGE */
@media (max-width:760px){

    #chat-button{
        z-index:2 !important;
    }

    #kelsy-welcome{
        z-index:3 !important;
    }

    #chat-window{
        z-index:1000 !important;
    }

    #chat-window.open{
        z-index:1000 !important;
        isolation:isolate !important;
    }

    #chat-window.open #chat-form,
    #chat-window.open #chat-input,
    #chat-window.open #chat-send{
        position:relative !important;
        z-index:1001 !important;
    }
}

/*
 * TEMPORARY PUBLIC KELSY DISABLE
 * 2026-09-28
 *
 * Kelsy backend and code remain intact.
 * Remove this block when Kelsy is ready to return.
 */
#kelsy-welcome,
#chat-button,
#chat-window {
    display: none !important;
}