/* Customer Orbit website chat. Light by default; follows the visitor's colour scheme. */
.co-chat, .livechat-launch, .co-invite {
    --co-bg: #ffffff; --co-fg: #1b1f24; --co-muted: #5a6572; --co-line: #d8dee6; --co-soft: #f3f6f9;
    --co-brand: #0f5c4d; --co-brand-fg: #ffffff; --co-visitor: #0f5c4d; --co-visitor-fg: #ffffff;
    --co-agent: #eef2f6; --co-agent-fg: #1b1f24; --co-danger: #b3261e; --co-focus: #1a73e8;
}
@media (prefers-color-scheme: dark) {
    .co-chat, .livechat-launch, .co-invite {
        --co-bg: #171b20; --co-fg: #e8ecf1; --co-muted: #a2adba; --co-line: #303842; --co-soft: #1f252c;
        --co-brand: #35b39a; --co-brand-fg: #062a23; --co-visitor: #2a8c78; --co-visitor-fg: #ffffff;
        --co-agent: #262d35; --co-agent-fg: #e8ecf1; --co-danger: #ff8a80; --co-focus: #8ab4f8;
    }
}
.co-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.co-chat[hidden], .co-chat [hidden] { display: none !important; }
.co-chat {
    position: fixed; right: 16px; bottom: 16px; z-index: 1100; width: min(380px, calc(100vw - 32px));
    height: min(560px, calc(100dvh - 32px)); display: flex; flex-direction: column; overflow: hidden;
    background: var(--co-bg); color: var(--co-fg); border: 1px solid var(--co-line); border-radius: 14px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, .28); font: 15px/1.45 system-ui, -apple-system, "Segoe UI", "Hind Siliguri", sans-serif;
}
.co-chat *, .co-chat *::before, .co-chat *::after { box-sizing: border-box; }
.co-chat button:focus-visible, .co-chat input:focus-visible, .co-chat textarea:focus-visible, .co-chat a:focus-visible,
.co-invite button:focus-visible,
.livechat-launch:focus-visible { outline: 3px solid var(--co-focus); outline-offset: 2px; }
.co-chat__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 14px; background: var(--co-brand); color: var(--co-brand-fg); }
.co-chat__who { display: flex; align-items: center; gap: 10px; min-width: 0; }
.co-chat__title { margin: 0; font-size: 16px; font-weight: 600; color: inherit; }
.co-chat__sub { margin: 0; font-size: 12.5px; opacity: .9; }
.co-chat__badge { display: inline-block; margin-left: 6px; padding: 0 7px; border-radius: 999px; font-size: 11.5px; background: rgba(255,255,255,.22); }
.co-chat__avatar { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; flex: 0 0 36px; background: rgba(255,255,255,.22); display: inline-flex; align-items: center; justify-content: center; }
.co-chat__actions { display: flex; gap: 4px; }
.co-chat__icon { width: 44px; height: 44px; border: 0; border-radius: 8px; background: transparent; color: inherit; cursor: pointer; font-size: 16px; }
.co-chat__icon:hover { background: rgba(255,255,255,.18); }
.co-chat__status { padding: 8px 14px; font-size: 13px; background: var(--co-soft); border-bottom: 1px solid var(--co-line); color: var(--co-muted); }
.co-chat__status[data-tone="error"] { color: var(--co-danger); }
.co-chat__form { display: flex; flex-direction: column; gap: 6px; padding: 14px; overflow-y: auto; }
.co-chat__form label { font-weight: 600; font-size: 13.5px; }
.co-chat__form input[type="text"], .co-chat__form input[type="tel"] { width: 100%; min-height: 44px; padding: 8px 10px; border: 1px solid var(--co-line); border-radius: 8px; background: var(--co-bg); color: var(--co-fg); font: inherit; }
.co-chat__hello { margin: 0 0 4px; }
.co-chat__hp { position: absolute; left: -9999px; height: 0; width: 0; opacity: 0; }
.co-chat__check { display: flex; gap: 8px; align-items: flex-start; font-weight: 400 !important; margin-top: 4px; }
.co-chat__check input { margin-top: 4px; width: 18px; height: 18px; flex: 0 0 18px; }
.co-chat__privacy { margin: 0; font-size: 12.5px; color: var(--co-muted); }
.co-chat__privacy a { color: var(--co-brand); text-decoration: underline; }
.co-chat__err { min-height: 0; color: var(--co-danger); font-size: 13px; }
.co-chat__primary { min-height: 46px; border: 0; border-radius: 10px; background: var(--co-brand); color: var(--co-brand-fg); font: inherit; font-weight: 600; cursor: pointer; }
.co-chat__primary[disabled] { opacity: .6; cursor: progress; }
.co-chat__body { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; }
.co-chat__log { flex: 1 1 auto; overflow-y: auto; padding: 12px; display: flex; flex-direction: column; gap: 8px; background: var(--co-soft); }
.co-msg { max-width: 86%; display: flex; gap: 8px; }
.co-msg__bubble { padding: 8px 12px; border-radius: 14px; white-space: pre-wrap; overflow-wrap: anywhere; }
.co-msg--visitor { align-self: flex-end; }
.co-msg--visitor .co-msg__bubble { background: var(--co-visitor); color: var(--co-visitor-fg); border-bottom-right-radius: 4px; }
.co-msg--agent .co-msg__bubble { background: var(--co-agent); color: var(--co-agent-fg); border-bottom-left-radius: 4px; border: 1px solid var(--co-line); }
.co-msg--agent .co-chat__avatar { width: 30px; height: 30px; flex-basis: 30px; background: var(--co-line); color: var(--co-fg); }
.co-msg__meta { font-size: 12px; color: var(--co-muted); margin-bottom: 2px; }
.co-msg--pending .co-msg__bubble { opacity: .65; }
.co-msg--failed .co-msg__bubble { border: 1px dashed var(--co-danger); }
.co-msg__retry { margin-top: 4px; background: none; border: 0; color: var(--co-danger); text-decoration: underline; cursor: pointer; font: inherit; min-height: 44px; }
.co-sys { align-self: center; text-align: center; font-size: 12.5px; color: var(--co-muted); padding: 2px 10px; }
.co-chat__composer { display: flex; gap: 8px; padding: 10px; border-top: 1px solid var(--co-line); background: var(--co-bg); }
.co-chat__composer textarea { flex: 1; resize: none; min-height: 44px; max-height: 120px; padding: 10px; border: 1px solid var(--co-line); border-radius: 10px; background: var(--co-bg); color: var(--co-fg); font: inherit; }
.co-chat__send { width: 46px; min-height: 44px; border: 0; border-radius: 10px; background: var(--co-brand); color: var(--co-brand-fg); cursor: pointer; }
.co-chat__fallback { padding: 14px; border-top: 1px solid var(--co-line); font-size: 14px; }
.co-chat__fallback a { color: var(--co-brand); text-decoration: underline; }
@media (max-width: 520px) {
    .co-chat { right: 0; bottom: 0; width: 100%; height: 100dvh; border-radius: 0; border: 0; z-index: 1200; }
}
/* Entrance animations are opacity-only on purpose: a transform on the container makes getBoundingClientRect() of the 44px controls
   inside it report float error (43.99997) for the animation's duration. Fading keeps every control exactly 44px in every frame. */
@media (prefers-reduced-motion: no-preference) { .co-chat { animation: co-pop .16s ease-out; } @keyframes co-pop { from { opacity: 0; } } }

/* Floating contact buttons: three compact controls in one stack — Live Chat (top), Messenger, WhatsApp
   (DOM order = visual order = tab order; the dock is column-direction and anchored at the bottom, so
   the first child renders highest). */
.chat-dock { position: fixed; right: 14px; bottom: 16px; z-index: 1000; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.chat-dock .chat-float { position: static; width: 46px; height: 46px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
    background: #fff; border: 1px solid rgba(0,0,0,.12); box-shadow: 0 2px 8px rgba(0,0,0,.22); font-size: 22px; text-decoration: none; cursor: pointer; padding: 0; }
.chat-dock .chat-float i { margin: 0; }
.chat-dock .livechat-launch img { width: 26px; height: 26px; border-radius: 6px; display: block; }
@media (prefers-color-scheme: dark) { .chat-dock .chat-float { background: #232a31; border-color: rgba(255,255,255,.18); } }
.chat-dock .chat-float:focus-visible { outline: 3px solid #1a73e8; outline-offset: 2px; }
@media (max-width: 991.98px) { .chat-dock { bottom: 60px; } } /* clear the site's 44px mobile bottom bar (.fixed_bottom, hidden from lg up) */
@media (max-width: 991.98px) { .chat-dock.chat-dock--flush { bottom: 16px; } } /* layouts without that bar */
@media (max-width: 520px) {
    .chat-dock { right: 10px; gap: 8px; }
    .chat-dock .chat-float { width: 44px; height: 44px; font-size: 20px; }
    .chat-dock .livechat-launch img { width: 24px; height: 24px; }
}

/* Proactive invitation: first child of the dock, so it sits directly above the icon stack and grows upward (the dock is
   anchored at the bottom, so showing it moves nothing else). Never covers the icons; dismissible; no layout shift. */
.co-invite[hidden] { display: none !important; }
.co-invite { position: relative; box-sizing: border-box; width: 292px; max-width: calc(100vw - 28px); padding: 12px 40px 12px 14px; margin-bottom: 2px;
    background: var(--co-bg); color: var(--co-fg); border: 1px solid var(--co-line); border-radius: 14px; box-shadow: 0 8px 24px rgba(0, 0, 0, .22);
    font: 14.5px/1.5 system-ui, -apple-system, "Segoe UI", "Hind Siliguri", "Noto Sans Bengali", sans-serif; cursor: pointer; }
.co-invite *, .co-invite *::before, .co-invite *::after { box-sizing: border-box; }
.co-invite::after { content: ""; position: absolute; right: 17px; bottom: -7px; width: 12px; height: 12px; transform: rotate(45deg);
    background: var(--co-bg); border-right: 1px solid var(--co-line); border-bottom: 1px solid var(--co-line); }
.co-invite__text { margin: 0 0 10px; }
.co-invite__cta { min-height: 44px; padding: 8px 16px; border: 0; border-radius: 10px; background: var(--co-brand); color: var(--co-brand-fg); font: inherit; font-weight: 600; cursor: pointer; }
.co-invite__close { position: absolute; top: 2px; right: 2px; width: 44px; height: 44px; border: 0; border-radius: 10px; background: transparent; color: var(--co-fg); opacity: .8;
    font-size: 26px; line-height: 1; cursor: pointer; }
.co-invite__close:hover { background: var(--co-soft); opacity: 1; }
@media (prefers-reduced-motion: no-preference) {
    .co-invite[data-mode]:not([data-again]) { animation: co-invite-in .28s ease-out both; }
    @keyframes co-invite-in { from { opacity: 0; } to { opacity: 1; } }
}
@media (max-width: 520px) { .co-invite { width: 300px; padding: 9px 38px 9px 12px; font-size: 14px; line-height: 1.45; } .co-invite__text { margin-bottom: 7px; } }
/* Pill: the one-row fallback used when the card would cover a page control. The full copy stays in the DOM for assistive tech. */
.co-invite.co-invite--pill { display: flex; align-items: center; width: auto; max-width: calc(100vw - 28px); padding: 0 0 0 4px; gap: 2px; border-radius: 999px; }
.co-invite--pill .co-invite__text { position: absolute; width: 1px; height: 1px; margin: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.co-invite--pill .co-invite__cta { border-radius: 999px; padding: 8px 18px; white-space: nowrap; }
.co-invite--pill .co-invite__close { position: static; flex: 0 0 44px; }
.co-invite--pill::after, .co-invite[data-lift]::after { display: none; } /* no pointer once it sits clear of the icons */

/* The Bookstore auth pages overflow the mobile viewport by ~23px (negative-margin rows), which pushes right-anchored
   fixed controls off-screen. Clip only the horizontal overflow on pages that carry the contact dock. */
html:has(.chat-dock), body:has(.chat-dock) { overflow-x: clip; }