/* =========================================
   TB LIVE CHAT WIDGET - MOBILE SAFE FINAL
   Fix: chat never covers mobile bottom nav / Telegram viewport
========================================= */

:root{
    --tb-mobile-safe-bottom: env(safe-area-inset-bottom, 0px);
    --tb-mobile-nav-height: 0px;
    --tb-chat-gap: 18px;
    --tb-chat-bottom-offset: calc(var(--tb-mobile-nav-height) + var(--tb-mobile-safe-bottom) + var(--tb-chat-gap));
    --tb-chat-z: 99990;
}

.tb-live-chat-toggle,
.tb-live-chat-window,
.tb-live-chat-window *{
    box-sizing:border-box;
}

.tb-live-chat-toggle{
    position:fixed;
    right:24px;
    bottom:max(24px, calc(var(--tb-chat-bottom-offset) - var(--tb-mobile-safe-bottom)));
    width:68px;
    height:68px;
    border-radius:24px;
    border:0;
    background:linear-gradient(135deg,#ef0012,#b3000d);
    color:#fff;
    z-index:var(--tb-chat-z);
    cursor:pointer;
    box-shadow:0 20px 45px rgba(239,0,18,.35);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
    transform:translateZ(0);
    transition:transform .18s ease, opacity .18s ease, visibility .18s ease, bottom .18s ease;
}

.tb-live-chat-toggle:hover{transform:translateY(-2px) translateZ(0);}
.tb-live-chat-toggle-icon{line-height:1;}

.tb-live-chat-badge{
    position:absolute;
    right:-5px;
    top:-5px;
    min-width:24px;
    height:24px;
    border-radius:999px;
    background:#06101f;
    border:2px solid #fff;
    color:#fff;
    display:grid;
    place-items:center;
    font-size:12px;
    font-weight:900;
}

.tb-live-chat-badge[hidden]{display:none!important;}

.tb-live-chat-window{
    position:fixed;
    right:24px;
    bottom:calc(110px + var(--tb-mobile-nav-height));
    width:390px;
    max-width:calc(100vw - 30px);
    height:min(640px, calc(100dvh - 150px - var(--tb-mobile-nav-height)));
    max-height:calc(100dvh - 150px - var(--tb-mobile-nav-height));
    min-height:360px;
    background:#fff;
    border-radius:28px;
    overflow:hidden;
    z-index:calc(var(--tb-chat-z) + 1);
    display:none;
    flex-direction:column;
    box-shadow:0 25px 70px rgba(0,0,0,.25);
    transform:translateZ(0);
}

.tb-live-chat-window.active{display:flex;}

body.tb-live-chat-is-open .tb-live-chat-toggle{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:scale(.86) translateZ(0);
}

.tb-live-chat-head{
    flex:0 0 auto;
    min-height:96px;
    padding:20px 22px;
    background:linear-gradient(135deg,#050b17,#0f1b33);
    color:#fff;
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
}

.tb-live-chat-agent-wrap{
    display:flex;
    align-items:center;
    gap:12px;
    min-width:0;
}

.tb-live-chat-agent-photo{
    width:42px;
    height:42px;
    min-width:42px;
    border-radius:50%;
    overflow:hidden;
    background:#172033;
    display:grid;
    place-items:center;
    color:#fff;
    font-weight:900;
    border:2px solid rgba(255,255,255,.2);
}

.tb-live-chat-agent-photo[hidden]{display:none!important;}

.tb-live-chat-agent-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.tb-live-chat-head h3{
    margin:0;
    font-size:24px;
    line-height:1.1;
    letter-spacing:-.5px;
}

.tb-live-chat-close{
    width:34px;
    min-width:34px;
    height:34px;
    border-radius:12px;
    border:0;
    background:rgba(255,255,255,.10);
    color:#fff;
    font-size:22px;
    line-height:1;
    cursor:pointer;
}

.tb-chat-admin-online{
    display:flex;
    align-items:center;
    gap:7px;
    margin-top:8px;
    color:#d1d5db;
    font-size:13px;
    min-width:0;
}
.tb-chat-admin-online[hidden]{display:none!important;}

.tb-chat-admin-online span{
    width:9px;
    min-width:9px;
    height:9px;
    border-radius:50%;
    background:#22c55e;
    box-shadow:0 0 0 5px rgba(34,197,94,.14);
}

.tb-chat-admin-online b{color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.tb-chat-admin-online em{font-style:normal;color:#cbd5e1;white-space:nowrap;}

.tb-live-chat-body{
    flex:1 1 auto;
    min-height:0;
    overflow:auto;
    padding:18px;
    background:#f7f7f8;
    display:flex;
    flex-direction:column;
    gap:12px;
    -webkit-overflow-scrolling:touch;
}

.tb-chat-empty{
    margin:auto;
    color:#9ca3af;
    font-weight:800;
    text-align:center;
}

.tb-chat-msg{
    max-width:85%;
    padding:14px 16px;
    border-radius:18px;
    line-height:1.5;
    font-size:14px;
    word-break:break-word;
}

.tb-chat-msg.customer{
    align-self:flex-end;
    background:#ef0012;
    color:#fff;
    border-bottom-right-radius:7px;
}

.tb-chat-msg-row.admin{
    align-self:flex-start;
    display:flex;
    align-items:flex-end;
    gap:8px;
    max-width:92%;
}

.tb-chat-msg-avatar{
    width:32px;
    height:32px;
    min-width:32px;
    border-radius:50%;
    overflow:hidden;
    background:#172033;
    color:#fff;
    display:grid;
    place-items:center;
    font-size:13px;
    font-weight:900;
}

.tb-chat-msg-avatar img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.tb-chat-msg.admin{
    align-self:flex-start;
    background:#fff;
    color:#111827;
    border:1px solid #eceef3;
    border-bottom-left-radius:7px;
}

.tb-live-chat-form{
    flex:0 0 auto;
    padding:14px;
    border-top:1px solid #ececec;
    display:flex;
    gap:10px;
    background:#fff;
}

.tb-live-chat-form textarea{
    flex:1;
    min-width:0;
    height:56px;
    resize:none;
    border:1px solid #e5e7eb;
    border-radius:18px;
    padding:15px;
    outline:0;
    font-size:14px;
    line-height:1.35;
}

.tb-live-chat-form textarea:focus{
    border-color:#ef0012;
    box-shadow:0 0 0 4px rgba(239,0,18,.08);
}

.tb-live-chat-form button{
    width:58px;
    min-width:58px;
    height:58px;
    border:0;
    border-radius:18px;
    background:#ef0012;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 12px 24px rgba(239,0,18,.22);
    cursor:pointer;
}

.tb-live-chat-form button svg{
    width:28px;
    height:28px;
    fill:none;
    stroke:currentColor;
    stroke-width:2.4;
    stroke-linecap:round;
    stroke-linejoin:round;
}

@media(max-width:768px){
    :root{
        --tb-chat-gap:12px;
    }

    .tb-live-chat-toggle{
        right:18px;
        bottom:calc(var(--tb-chat-bottom-offset) + 4px);
        width:60px;
        height:60px;
        border-radius:22px;
        font-size:25px;
        box-shadow:0 14px 32px rgba(239,0,18,.33);
    }

    .tb-live-chat-badge{
        right:-4px;
        top:-4px;
        min-width:22px;
        height:22px;
        font-size:11px;
    }

    .tb-live-chat-window{
        left:12px;
        right:12px;
        bottom:calc(var(--tb-mobile-nav-height) + var(--tb-mobile-safe-bottom) + 12px);
        width:auto;
        max-width:none;
        height:auto;
        min-height:0;
        max-height:calc(var(--tb-viewport-height, 100dvh) - var(--tb-mobile-nav-height) - var(--tb-mobile-safe-bottom) - 24px);
        border-radius:22px;
    }

    .tb-live-chat-head{
        min-height:78px;
        padding:16px 16px 14px;
        align-items:center;
    }

    .tb-live-chat-head h3{
        font-size:21px;
    }

    .tb-live-chat-agent-photo{
        width:38px;
        height:38px;
        min-width:38px;
    }

    .tb-chat-admin-online{
        margin-top:6px;
        font-size:12px;
    }

    .tb-live-chat-close{
        width:36px;
        min-width:36px;
        height:36px;
        border-radius:13px;
        background:rgba(255,255,255,.14);
    }

    .tb-live-chat-body{
        padding:14px;
        gap:10px;
        max-height:calc(var(--tb-viewport-height, 100dvh) - var(--tb-mobile-nav-height) - var(--tb-mobile-safe-bottom) - 210px);
    }

    .tb-chat-msg{
        max-width:86%;
        padding:11px 13px;
        border-radius:16px;
        font-size:13px;
    }

    .tb-chat-msg-row.admin{max-width:94%;}
    .tb-chat-msg-avatar{width:29px;height:29px;min-width:29px;font-size:12px;}

    .tb-live-chat-form{
        padding:10px 10px 12px;
        gap:8px;
    }

    .tb-live-chat-form textarea{
        height:48px;
        border-radius:16px;
        padding:13px 14px;
        font-size:13px;
    }

    .tb-live-chat-form button{
        width:50px;
        min-width:50px;
        height:50px;
        border-radius:17px;
    }

    .tb-live-chat-form button svg{
        width:25px;
        height:25px;
    }

    body.tb-live-chat-keyboard-open .tb-live-chat-window{
        bottom:10px;
        max-height:calc(var(--tb-viewport-height, 100dvh) - 20px);
    }

    body.tb-live-chat-keyboard-open .tb-live-chat-body{
        max-height:calc(var(--tb-viewport-height, 100dvh) - 158px);
    }
}

@media(max-width:390px){
    .tb-live-chat-window{left:8px;right:8px;border-radius:20px;}
    .tb-live-chat-toggle{right:14px;width:58px;height:58px;}
    .tb-live-chat-head h3{font-size:19px;}
}

/* Admin name visible on customer live chat side */
.tb-chat-msg-stack {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    max-width: min(82%, 340px);
}

.tb-chat-msg-row.admin .tb-chat-msg-stack {
    max-width: calc(100% - 48px);
}

.tb-chat-msg-name {
    display: inline-flex;
    align-items: center;
    min-height: 18px;
    padding-left: 4px;
    color: #14532d;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .01em;
}

.tb-chat-msg-row.admin .tb-chat-msg.admin {
    max-width: 100%;
}

/* FINAL MOBILE SAFE POSITION */
@media(max-width:768px){
    .tb-live-chat-toggle{
        right:22px!important;
        bottom:calc(var(--tb-mobile-nav-height, 72px) + env(safe-area-inset-bottom, 0px) + 20px)!important;
        width:56px!important;
        height:56px!important;
        border-radius:20px!important;
        z-index:700!important;
    }
    .tb-live-chat-window{
        bottom:calc(var(--tb-mobile-nav-height, 72px) + env(safe-area-inset-bottom, 0px) + 14px)!important;
        z-index:800!important;
    }
    body.tb-live-chat-keyboard-open .tb-live-chat-window{
        bottom:10px!important;
    }
}

/* === TB MARKET LIVECHAT PREMIUM CLEANUP: avatar, time, readable bubbles === */
.tb-live-chat-window{
    border:1px solid rgba(226,232,240,.95);
}

.tb-live-chat-head{
    min-height:88px;
    padding:18px 20px;
    align-items:center;
}

.tb-live-chat-agent-photo,
.tb-chat-msg-avatar{
    position:relative;
    overflow:hidden;
    isolation:isolate;
    background:linear-gradient(135deg,#0f172a,#1e293b);
    box-shadow:0 8px 20px rgba(15,23,42,.18);
}

.tb-live-chat-agent-photo img,
.tb-chat-msg-avatar img{
    position:absolute;
    inset:0;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center!important;
    border-radius:inherit;
    z-index:2;
}

.tb-live-chat-agent-photo span,
.tb-chat-avatar-initial{
    position:absolute;
    inset:0;
    display:grid;
    place-items:center;
    color:#fff;
    font-weight:950;
    line-height:1;
    z-index:1;
    text-transform:uppercase;
}

.tb-live-chat-agent-photo span[hidden],
.tb-chat-msg-avatar img[hidden]{
    display:none!important;
}

.tb-live-chat-agent-photo{
    width:50px;
    height:50px;
    min-width:50px;
    border:3px solid rgba(255,255,255,.20);
}

.tb-live-chat-head h3{
    font-size:22px;
    letter-spacing:-.3px;
}

.tb-live-chat-body{
    background:linear-gradient(180deg,#f8fafc 0%,#f3f4f6 100%);
    padding:18px 16px 16px;
}

.tb-chat-msg{
    display:grid;
    gap:6px;
    box-shadow:0 8px 20px rgba(15,23,42,.05);
}

.tb-chat-msg-text{
    display:block;
}

.tb-chat-msg.customer{
    min-width:46px;
    max-width:78%;
    background:linear-gradient(135deg,#ef0012,#d6000f);
    border-radius:18px 18px 6px 18px;
    padding:12px 14px 7px;
    text-align:left;
}

.tb-chat-msg.customer time{
    display:block;
    margin-top:2px;
    color:rgba(255,255,255,.76);
    font-size:10px;
    font-weight:800;
    text-align:right;
    line-height:1;
}

.tb-chat-msg-row.admin{
    align-items:flex-end;
    gap:9px;
    max-width:94%;
}

.tb-chat-msg-avatar{
    width:36px;
    height:36px;
    min-width:36px;
    border:2px solid #fff;
}

.tb-chat-msg-meta{
    display:flex;
    align-items:center;
    gap:8px;
    min-height:18px;
    padding-left:2px;
}

.tb-chat-msg-name{
    min-height:0;
    padding-left:0;
    color:#14532d;
    font-size:11px;
    font-weight:950;
    max-width:170px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.tb-chat-msg-meta time{
    color:#94a3b8;
    font-size:10px;
    font-weight:800;
    line-height:1;
}

.tb-chat-msg.admin{
    background:#ffffff;
    color:#111827;
    border:1px solid #e8edf4;
    border-radius:18px 18px 18px 6px;
    padding:12px 14px;
    max-width:100%;
}

.tb-live-chat-form{
    border-top:1px solid #e8edf4;
    background:#fff;
}

.tb-live-chat-form textarea{
    background:#f8fafc;
    border-color:#e2e8f0;
}

@media(max-width:768px){
    .tb-live-chat-agent-photo{width:44px;height:44px;min-width:44px;}
    .tb-live-chat-head{min-height:82px;padding:15px 15px 14px;}
    .tb-live-chat-head h3{font-size:20px;}
    .tb-chat-msg-row.admin{max-width:96%;}
    .tb-chat-msg.customer{max-width:82%;}
    .tb-chat-msg-avatar{width:32px;height:32px;min-width:32px;}
}

/* Prevent mobile keyboard zoom/jump in live chat */
.livechat-widget input,.livechat-widget textarea,.livechat-panel input,.livechat-panel textarea{font-size:16px!important;line-height:1.35!important}.livechat-panel{max-height:min(72vh,620px)}@supports (height:100dvh){.livechat-panel{max-height:min(72dvh,620px)}}

/* =========================================================
   TB Market global mobile no-zoom fix
   Prevents iOS Safari / Telegram WebView from zooming when
   focusing inputs. Keep form controls at least 16px.
   ========================================================= */
html {
    -webkit-text-size-adjust: 100% !important;
    text-size-adjust: 100% !important;
    touch-action: manipulation;
}
body {
    -webkit-text-size-adjust: 100% !important;
    text-size-adjust: 100% !important;
}
input,
select,
textarea,
button,
.input,
.form-control,
.admin-input,
.admin-select,
.admin-textarea,
.admin-form input,
.admin-form select,
.admin-form textarea,
.search-input,
.qty-input,
.pos-input,
.pos-search,
.mobile-input,
.tg-input,
.tma-input,
.courier-input,
.scanner-input {
    font-size: 16px !important;
}
input[type="date"],
input[type="datetime-local"],
input[type="email"],
input[type="month"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="time"],
input[type="url"],
select,
textarea {
    min-height: 38px;
}
a, button, [role="button"], input, select, textarea {
    touch-action: manipulation;
}
@media (max-width: 768px) {
    input,
    select,
    textarea,
    button,
    .form-control,
    .admin-input,
    .admin-select,
    .admin-textarea,
    .search-input,
    .pos-input,
    .scanner-input {
        font-size: 16px !important;
    }
}

/* Package 29: guest-capable live support widget */
.tb-live-chat-subtitle{display:block;margin-top:3px;font-size:11px;color:rgba(255,255,255,.72);font-weight:600;line-height:1.35}.tb-live-chat-guest-fields{display:grid;grid-template-columns:1fr;gap:7px;width:100%;padding:10px 12px 0}.tb-live-chat-guest-fields input{width:100%;height:36px;border:1px solid rgba(148,163,184,.35);border-radius:12px;background:#fff;color:#0f172a;padding:0 11px;font-size:13px;outline:none}.tb-live-chat-guest-fields input:focus{border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.12)}.tb-live-chat-input-row{display:flex;align-items:flex-end;gap:8px;width:100%;padding:10px 12px 12px}.tb-live-chat-input-row textarea{flex:1;min-height:42px;max-height:120px}.tb-live-chat-input-row button{flex:0 0 auto}.tb-chat-empty strong{display:block;color:#0f172a;font-size:14px;margin-bottom:4px}.tb-chat-empty span{display:block;color:#64748b;font-size:12px;line-height:1.35}@media(max-width:640px){.tb-live-chat-guest-fields{padding:8px 10px 0}.tb-live-chat-input-row{padding:8px 10px 10px}.tb-live-chat-guest-fields input{height:34px;font-size:12px}}