:root{--wt-accent:#facc15; --wt-bg:#111827; --wt-bg-2:#1f2937; --wt-text:#f9fafb; --wt-muted:#9ca3af; --wt-panel-shadow:0 12px 40px rgba(0,0,0,.55);}
.wt-tsz-floating{position:fixed;bottom:20px;z-index:99999;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;}
.wt-pos-right{right:20px;} .wt-pos-left{left:20px;}

.wt-tsz-button{width:56px;height:56px;border-radius:999px;background:var(--wt-accent);color:#111827;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 30px rgba(0,0,0,.4);cursor:pointer;position:relative;border:2px solid rgba(0,0,0,.25);}
.wt-tsz-button .wt-dot{position:absolute;top:8px;right:10px;width:10px;height:10px;background:#22c55e;border-radius:999px;box-shadow:0 0 0 2px rgba(0,0,0,.35);}

.wt-tsz-panel{position:absolute;bottom:70px;right:0;width:340px;max-height:70vh;background:var(--wt-bg-2);color:var(--wt-text);border-radius:14px;overflow:hidden;transform:translateY(10px);opacity:0;pointer-events:none;transition:.2s;box-shadow:var(--wt-panel-shadow);border:1px solid #374151;}
.wt-pos-left .wt-tsz-panel{left:0;right:auto;} .wt-tsz-panel.open{transform:translateY(0);opacity:1;pointer-events:auto;}

.wt-tsz-header{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:linear-gradient(90deg,var(--wt-accent),#f59e0b);color:#111827;flex-wrap:wrap;gap:6px}
.wt-title{font-weight:700}
.wt-close{background:rgba(0,0,0,.1);border:0;color:#111827;font-size:20px;cursor:pointer;border-radius:8px;padding:2px 8px}

.wt-agent{display:flex;align-items:center;gap:8px}
.wt-agent-avatar{width:24px;height:24px;border-radius:999px;object-fit:cover;display:inline-block;background:#e5e7eb;border:2px solid rgba(0,0,0,.3)}

.wt-tabs{display:flex;border-bottom:1px solid #374151;background:var(--wt-bg-2);}
.wt-tab{flex:1;padding:10px;border:0;background:transparent;cursor:pointer;font-weight:700;border-bottom:2px solid transparent;color:var(--wt-muted);letter-spacing:.2px}
.wt-tab.active{border-bottom-color:var(--wt-accent);color:var(--wt-accent);}

.wt-tab-content{padding:12px;} .wt-tab-content.hidden{display:none;}

.wt-messages{height:280px;overflow:auto;background:var(--wt-bg);border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:10px;border:1px solid #374151}
.wt-messages::-webkit-scrollbar{width:8px} .wt-messages::-webkit-scrollbar-thumb{background:#374151;border-radius:8px}

.wt-bubble{max-width:80%;padding:8px 10px;border-radius:12px;background:#23262d;box-shadow:0 1px 2px rgba(0,0,0,.25);}
.wt-bubble .meta{font-size:11px;color:var(--wt-muted);margin-bottom:4px;}
.wt-bubble.user{align-self:flex-end;background:var(--wt-accent);color:#111827}
.wt-bubble.agent{background:#374151;color:#f3f4f6}
.wt-bubble.system{opacity:.8;font-style:italic}

.wt-inputs{margin-top:10px;display:flex;flex-direction:column;gap:8px}
.wt-row{display:flex;gap:8px}
.wt-row input{flex:1;padding:10px 12px;border:1px solid #374151;border-radius:10px;background:#0b1220;color:var(--wt-text)}
.wt-row input::placeholder{color:#6b7280}
.wt-send{padding:10px 12px;border-radius:10px;border:0;background:var(--wt-accent);color:#111827;cursor:pointer;font-weight:800;box-shadow:0 4px 14px rgba(250,204,21,.25)}
.wt-send:hover{filter:brightness(1.05)}

.wt-zoom-wrap{display:flex;flex-direction:column;gap:10px;color:var(--wt-text)}
.wt-zoom-line{font-size:14px;display:flex;align-items:center;gap:8px;opacity:.95}
.wt-zoom-line strong{color:var(--wt-accent)}
.wt-zoom-actions{display:flex;gap:8px;flex-wrap:wrap}
.wt-zoom-actions button{padding:8px 10px;border-radius:10px;border:1px solid #374151;background:#0b1220;color:var(--wt-text);cursor:pointer;transition:.2s;display:inline-flex;align-items:center;gap:6px}
.wt-zoom-actions .icon{font-size:14px;line-height:1}
.wt-zoom-actions button:hover{background:#1f2937}
.wt-request-zoom{flex:1;background:var(--wt-accent)!important;color:#111827!important;border:0!important;font-weight:800;text-transform:uppercase;letter-spacing:.2px}

.wt-typing{margin-top:6px;font-size:12px;color:#cbd5e1;display:flex;align-items:center;gap:6px}
.wt-typing .dot{width:6px;height:6px;border-radius:999px;background:#9ca3af;display:inline-block;animation: wt-bounce 1.2s infinite ease-in-out both}
.wt-typing .dot:nth-child(1){animation-delay:-0.32s}
.wt-typing .dot:nth-child(2){animation-delay:-0.16s}
@keyframes wt-bounce{0%,80%,100%{transform:scale(0)}40%{transform:scale(1)}}

.hidden{display:none}
.wt-name[disabled]{background:#0b1220;color:#6b7280;cursor:not-allowed}


/* --- iOS: Ngăn zoom khi focus input/textarea --- */
@supports (-webkit-touch-callout: none) {
  .wt-tsz-widget input[type="text"],
  .wt-tsz-widget input[type="search"],
  .wt-tsz-widget input[type="tel"],
  .wt-tsz-widget input[type="email"],
  .wt-tsz-widget input[type="url"],
  .wt-tsz-widget textarea,
  .wt-tsz-widget .wt-tsz-input {
    font-size: 16px !important;   /* chìa khóa để iOS không phóng to */
    line-height: 1.35;
    -webkit-text-size-adjust: 100%;
  }

  /* tránh double-tap zoom trên nút gửi */
  .wt-tsz-widget button,
  .wt-tsz-widget .wt-tsz-send {
    touch-action: manipulation;
  }
}

/* Nếu theme đang set font nhỏ, đảm bảo tối thiểu trên mobile */
@media (max-width: 812px) {
  .wt-tsz-widget input,
  .wt-tsz-widget textarea {
    font-size: 16px !important;
  }
}

/* --- iOS fix #1: bảo đảm computed font-size >= 16px trong toàn widget --- */
.wt-tsz-widget,
.wt-tsz-widget * {
  -webkit-text-size-adjust: 100%;
}

.wt-tsz-widget {
  font-size: 16px; /* gốc 16 để các input dùng 1rem không < 16 */
}

/* input/textarea trong widget luôn >= 16px và KHÔNG bị thu nhỏ bởi transform */
@supports (-webkit-touch-callout: none) {
  .wt-tsz-widget input[type="text"],
  .wt-tsz-widget input[type="search"],
  .wt-tsz-widget input[type="tel"],
  .wt-tsz-widget input[type="email"],
  .wt-tsz-widget input[type="url"],
  .wt-tsz-widget textarea,
  .wt-tsz-widget .wt-tsz-input {
    font-size: 1rem !important;  /* 1rem = 16px do đã set ở .wt-tsz-widget */
    line-height: 1.4;
    min-height: 44px;             /* target size chuẩn iOS */
  }

  /* Nếu widget có container bị scale/transform, tắt hiệu lực lên input */
  .wt-tsz-widget [style*="transform"],
  .wt-tsz-widget .wt-tsz-panel {
    transform: none !important;
  }

  .wt-tsz-widget button,
  .wt-tsz-widget .wt-tsz-send {
    touch-action: manipulation;
  }
}

/* mobile đảm bảo không bị theme override */
@media (max-width: 820px) {
  .wt-tsz-widget input,
  .wt-tsz-widget textarea {
    font-size: 16px !important;
  }
}

/* iOS fix #3: tăng padding để cảm giác lớn hơn, không cần zoom */
.wt-tsz-widget .wt-tsz-input,
.wt-tsz-widget textarea {
  padding: 12px 14px !important;
  border-radius: 10px;
}