/* MYTIZI_WEB_CHAT_V2_GUEST */
:root {
    --mwc-accent: #3d67f2;
    --mwc-accent-strong: #3156d8;
    --mwc-surface: rgba(255,255,255,.97);
    --mwc-surface-soft: #f5f7fb;
    --mwc-text: #172036;
    --mwc-muted: #778098;
    --mwc-line: rgba(26,39,68,.10);
    --mwc-shadow: 0 22px 70px rgba(27,42,82,.22), 0 8px 22px rgba(27,42,82,.10);
}
.mytizi-web-chat, .mytizi-web-chat * { box-sizing: border-box; }
.mwc-launcher {
    position: fixed; z-index: 2147482000; right: max(24px, env(safe-area-inset-right)); bottom: max(24px, env(safe-area-inset-bottom));
    display: inline-flex; align-items: center; gap: 9px; min-height: 52px; padding: 8px 17px 8px 12px;
    border: 1px solid rgba(255,255,255,.25); border-radius: 999px; color: #fff; background: linear-gradient(135deg, var(--mwc-accent), #6382f6);
    box-shadow: 0 15px 38px rgba(61,103,242,.32); font: 650 14px/1.2 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.mwc-launcher:hover { transform: translateY(-2px); box-shadow: 0 18px 44px rgba(61,103,242,.4); }
.mwc-launcher:active { transform: translateY(0) scale(.98); }
.mwc-launcher-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.16); }
.mwc-launcher svg, .mwc-header-actions svg, .mwc-attach svg, .mwc-send svg, .mwc-viewer-close svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.mwc-badge { min-width: 21px; height: 21px; padding: 0 5px; display: inline-grid; place-items: center; border-radius: 999px; background: #ff4d61; color: #fff; font-size: 11px; box-shadow: 0 0 0 3px rgba(255,255,255,.18); }
.mwc-backdrop { position: fixed; inset: 0; z-index: 2147482001; background: rgba(11,18,34,.16); backdrop-filter: blur(1px); }
.mwc-panel {
    position: fixed; z-index: 2147482002; top: 18px; right: 18px; bottom: 18px; width: min(420px, calc(100vw - 36px));
    display: grid; grid-template-rows: auto auto minmax(0,1fr) auto auto auto auto; overflow: hidden;
    background: var(--mwc-surface); color: var(--mwc-text); border: 1px solid rgba(255,255,255,.65); border-radius: 24px; box-shadow: var(--mwc-shadow);
    transform: translateX(calc(100% + 44px)); opacity: 0; pointer-events: none; transition: transform .28s cubic-bezier(.2,.8,.2,1), opacity .2s ease, width .25s ease;
    font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
}
.mwc-panel.is-open { transform: translateX(0); opacity: 1; pointer-events: auto; }
.mwc-panel.is-expanded { width: min(680px, calc(100vw - 36px)); }
.mwc-header { display: flex; align-items: center; justify-content: space-between; min-height: 78px; padding: 14px 16px 13px 18px; border-bottom: 1px solid var(--mwc-line); background: rgba(255,255,255,.82); backdrop-filter: blur(18px); }
.mwc-agent { display: flex; align-items: center; gap: 11px; min-width: 0; }
.mwc-agent-avatar{width:42px;height:42px;position:relative;overflow:hidden;flex:0 0 42px;border-radius:14px;background:transparent;box-shadow:none}
.mwc-brand-logo{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;object-position:center}
.mwc-brand-logo-dark{display:none}
html[data-theme="dark"] .mwc-brand-logo-light,body[data-theme="dark"] .mwc-brand-logo-light,#app[data-theme="dark"] .mwc-brand-logo-light{display:none}
html[data-theme="dark"] .mwc-brand-logo-dark,body[data-theme="dark"] .mwc-brand-logo-dark,#app[data-theme="dark"] .mwc-brand-logo-dark{display:block}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .mwc-brand-logo-light{display:none}:root:not([data-theme="light"]) .mwc-brand-logo-dark{display:block}}
.mwc-agent > span:last-child { display: grid; min-width: 0; gap: 4px; }
.mwc-agent strong { font-size: 15px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.mwc-agent small { display: flex; align-items: center; gap: 6px; color: var(--mwc-muted); font-size: 12px; }
.mwc-agent i { width: 8px; height: 8px; border-radius: 50%; background: #8c94a7; box-shadow: 0 0 0 3px rgba(140,148,167,.12); }
.mwc-agent i.online { background:#2eb67d; box-shadow:0 0 0 3px rgba(46,182,125,.13); }
.mwc-agent i.error { background:#ff6875; box-shadow:0 0 0 3px rgba(255,104,117,.12); }
.mwc-agent i.offline { background:#f5ad42; box-shadow:0 0 0 3px rgba(245,173,66,.13); }
.mwc-header-actions { display:flex; gap:4px; }
.mwc-header-actions button, .mwc-viewer-close { width:38px; height:38px; display:grid; place-items:center; border:0; border-radius:12px; background:transparent; color:var(--mwc-muted); cursor:pointer; }
.mwc-header-actions button:hover { background:var(--mwc-surface-soft); color:var(--mwc-text); }
.mwc-context { margin: 10px 14px 0; padding: 10px 12px; border-radius: 13px; background: #eef3ff; color: #48618d; font-size: 12px; }
.mwc-messages { min-height:0; overflow:auto; overscroll-behavior:contain; padding: 18px 16px 22px; scroll-behavior:smooth; background: linear-gradient(180deg, rgba(248,250,254,.8), rgba(244,247,252,.58)); }
.mwc-message { display:flex; flex-direction:column; align-items:flex-start; margin: 0 0 16px; }
.mwc-message.customer { align-items:flex-end; }
.mwc-message.system { align-items:center; }
.mwc-message-meta { display:flex; gap:8px; align-items:center; margin: 0 3px 6px; color:var(--mwc-muted); font-size:11px; }
.mwc-message.customer .mwc-message-meta { flex-direction:row-reverse; }
.mwc-bubble { max-width: 84%; padding: 11px 13px; border-radius: 16px 16px 16px 5px; background:#fff; border:1px solid var(--mwc-line); box-shadow:0 3px 10px rgba(37,53,89,.05); font-size:14px; line-height:1.55; word-break:break-word; }
.mwc-message.customer .mwc-bubble { color:#fff; background:linear-gradient(145deg,var(--mwc-accent),#5879ef); border-color:transparent; border-radius:16px 16px 5px 16px; }
.mwc-message.system .mwc-bubble { max-width:92%; color:var(--mwc-muted); background:rgba(231,235,244,.72); border:0; border-radius:999px; font-size:12px; }
.mwc-images { display:grid; gap:6px; width:min(284px,82%); margin-top:6px; overflow:hidden; border-radius:16px; }
.mwc-images-2 { grid-template-columns:1fr 1fr; }
.mwc-images-3 { grid-template-columns:1fr 1fr; }
.mwc-images-3 .mwc-image:first-child { grid-row:span 2; }
.mwc-image { position:relative; display:block; min-height:112px; padding:0; overflow:hidden; border:1px solid var(--mwc-line); border-radius:13px; background:#e9edf5; cursor:zoom-in; }
.mwc-image img { width:100%; height:100%; min-height:112px; max-height:240px; display:block; object-fit:cover; }
.mwc-image span { position:absolute; right:7px; bottom:7px; padding:4px 7px; border-radius:999px; color:#fff; background:rgba(10,16,29,.58); opacity:0; transform:translateY(3px); transition:.18s ease; font-size:10px; }
.mwc-image:hover span { opacity:1; transform:none; }
.mwc-session-ended { margin:16px auto 0; width:max-content; max-width:90%; padding:7px 10px; border-radius:999px; background:rgba(125,135,158,.10); color:var(--mwc-muted); text-align:center; font-size:11px; }
.mwc-empty { min-height:100%; display:grid; align-content:center; justify-items:center; gap:8px; padding:36px 28px; color:var(--mwc-muted); text-align:center; }
.mwc-empty strong { color:var(--mwc-text); font-size:15px; }
.mwc-empty p { max-width:290px; margin:0; font-size:13px; line-height:1.6; }
.mwc-empty button { margin-top:4px; padding:8px 12px; border:0; border-radius:10px; color:#fff; background:var(--mwc-accent); cursor:pointer; }
.mwc-loading-ring { width:24px; height:24px; border:2px solid rgba(61,103,242,.16); border-top-color:var(--mwc-accent); border-radius:50%; animation:mwc-spin .8s linear infinite; }
@keyframes mwc-spin { to { transform:rotate(360deg); } }
.mwc-file-strip { display:flex; gap:7px; overflow:auto; padding:8px 12px 4px; border-top:1px solid var(--mwc-line); background:var(--mwc-surface); }
.mwc-file-chip { display:flex; align-items:center; gap:7px; min-width:0; max-width:200px; padding:7px 7px 7px 10px; border-radius:10px; background:#edf2ff; color:#526892; font-size:11px; }
.mwc-file-chip > span { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.mwc-file-chip button { width:20px; height:20px; flex:0 0 auto; border:0; border-radius:50%; color:#66728a; background:rgba(255,255,255,.75); cursor:pointer; }
.mwc-error { margin:7px 12px 0; padding:8px 10px; border-radius:10px; background:#fff0f1; color:#b33b49; font-size:11px; line-height:1.45; }
.mwc-composer { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:end; gap:7px; padding:10px 11px; border-top:1px solid var(--mwc-line); background:var(--mwc-surface); }
.mwc-composer textarea { width:100%; min-height:44px; max-height:116px; resize:none; padding:11px 12px; border:1px solid var(--mwc-line); border-radius:14px; outline:0; color:var(--mwc-text); background:var(--mwc-surface-soft); font:400 14px/1.45 inherit; transition:border .18s ease, box-shadow .18s ease, background .18s ease; }
.mwc-composer textarea:focus { border-color:rgba(61,103,242,.42); background:#fff; box-shadow:0 0 0 3px rgba(61,103,242,.08); }
.mwc-attach, .mwc-send { width:44px; height:44px; display:grid; place-items:center; border:0; border-radius:14px; cursor:pointer; transition:.16s ease; }
.mwc-attach { color:#5e6b85; background:var(--mwc-surface-soft); }
.mwc-attach:hover { color:var(--mwc-accent); background:#edf2ff; }
.mwc-send { color:#fff; background:linear-gradient(145deg,var(--mwc-accent),#5678ef); box-shadow:0 6px 16px rgba(61,103,242,.22); }
.mwc-send:hover { transform:translateY(-1px); }
.mwc-composer button:disabled, .mwc-composer textarea:disabled { opacity:.55; cursor:not-allowed; }
.mwc-footnote { padding:0 14px 9px; color:#9aa2b4; background:var(--mwc-surface); text-align:center; font-size:10px; letter-spacing:.02em; }
.mwc-viewer { position:fixed; inset:0; z-index:2147483000; display:grid; place-items:center; background:rgba(4,8,17,.94); }
.mwc-viewer[hidden] { display:none; }
.mwc-viewer-stage { width:100%; height:100%; display:grid; place-items:center; overflow:auto; }
.mwc-viewer-stage img { max-width:88vw; max-height:86vh; object-fit:contain; transform-origin:center; transition:transform .12s ease; user-select:none; -webkit-user-drag:none; }
.mwc-viewer-close { position:absolute; z-index:2; top:max(18px,env(safe-area-inset-top)); right:max(18px,env(safe-area-inset-right)); color:#fff; background:rgba(255,255,255,.12); }
.mwc-viewer-tools { position:absolute; z-index:2; bottom:max(20px,env(safe-area-inset-bottom)); left:50%; display:flex; transform:translateX(-50%); overflow:hidden; border:1px solid rgba(255,255,255,.15); border-radius:999px; background:rgba(23,28,41,.78); backdrop-filter:blur(12px); }
.mwc-viewer-tools button { min-width:48px; height:40px; padding:0 12px; border:0; border-right:1px solid rgba(255,255,255,.12); color:#fff; background:transparent; cursor:pointer; }
.mwc-viewer-tools button:last-child { border-right:0; }
html.mwc-chat-open, html.mwc-viewer-open { overscroll-behavior:none; }
@media (max-width: 720px) {
    .mwc-launcher { right:max(14px,env(safe-area-inset-right)); bottom:max(15px,env(safe-area-inset-bottom)); min-height:48px; padding:7px 14px 7px 8px; }
    .mwc-launcher-icon { width:34px; height:34px; }
    .mwc-panel, .mwc-panel.is-expanded { inset:0; width:100%; max-width:none; border:0; border-radius:0; }
    .mwc-header { padding-top:max(12px,env(safe-area-inset-top)); min-height:72px; }
    .mwc-header-actions [data-mwc-expand] { display:none; }
    .mwc-messages { padding:16px 12px 18px; }
    .mwc-bubble { max-width:88%; }
    .mwc-images { width:min(78vw,300px); }
    .mwc-composer { padding-bottom:max(10px,env(safe-area-inset-bottom)); }
    .mwc-footnote { display:none; }
    .mwc-backdrop { display:none; }
}
@media (prefers-color-scheme: dark) {
    :root { --mwc-surface:rgba(22,27,39,.98); --mwc-surface-soft:#202638; --mwc-text:#f3f5fb; --mwc-muted:#9aa5bc; --mwc-line:rgba(255,255,255,.09); --mwc-shadow:0 25px 80px rgba(0,0,0,.5); }
    .mwc-header { background:rgba(22,27,39,.9); }
    .mwc-messages { background:linear-gradient(180deg,rgba(18,23,34,.92),rgba(20,25,37,.86)); }
    .mwc-bubble { background:#242b3d; }
    .mwc-message.customer .mwc-bubble { background:linear-gradient(145deg,#496fe9,#5c7cf0); }
    .mwc-composer textarea:focus { background:#252c3f; }
    .mwc-file-chip { background:#28334d; color:#b9c6e5; }
    .mwc-error { background:#3b242b; color:#ff9eaa; }
    .mwc-context { background:#27324c; color:#b9c8ec; }
}

/* MYTIZI_WEB_CHAT_V2_GUEST_FIX3_OPTIMISTIC_SEND_BRAND_LOGO */
.mwc-message-meta-tail{display:inline-flex;align-items:center;gap:7px}
.mwc-delivery{font:inherit;font-size:11px;line-height:1.2}
.mwc-delivery.is-sending{opacity:.68}
button.mwc-delivery.is-failed{border:0;padding:0;background:transparent;color:#ef4444;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.mwc-message.is-sending .mwc-bubble,.mwc-message.is-sending .mwc-images{opacity:.72}
.mwc-message.is-failed .mwc-bubble,.mwc-message.is-failed .mwc-images{opacity:.82}
.mwc-message.is-sending .mwc-image img,.mwc-message.is-failed .mwc-image img{filter:saturate(.92)}

/* MYTIZI_CC_WEB_CHAT_V2_FIX3_ADAPTER */
.mwc-launcher {
    bottom: max(calc(var(--tabbar-h, 66px) + 18px), calc(env(safe-area-inset-bottom) + 18px));
}
.mwc-agent-avatar {
    background: #fff;
    padding: 4px;
}
.mwc-brand-logo {
    object-fit: contain;
    border-radius: 10px;
}
@media (max-width: 720px) {
    .mwc-launcher {
        right: max(12px, env(safe-area-inset-right));
        bottom: max(calc(var(--tabbar-h, 66px) + 12px), calc(env(safe-area-inset-bottom) + 12px));
    }
}
