/* AI Agent (Bulk Sender → AI Agent) and the inbox's "AI agent for this chat". Shared pieces: whatsapp-tools.css. */

/* the list */
.wai-empty{padding:48px 20px}
.wai-empty-ico{width:60px;height:60px;border-radius:18px;display:grid;place-items:center;margin:0 auto 14px;background:linear-gradient(135deg,#eef2ff,#f5f3ff);color:#6d28d9}
.wai-empty-points{list-style:none;padding:0;margin:22px auto 0;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 20px;font-size:12.5px;color:#475467}
.wai-empty-points li{display:inline-flex;align-items:center;gap:6px}
.wai-empty-points svg{color:#079455}
.wai-table td{vertical-align:middle}
.wai-table td small{display:block;font-size:12px;color:var(--we-muted);margin-top:2px}
.wai-table td small.wai-err{color:#b42318;display:flex;align-items:center;gap:4px;max-width:340px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wai-err svg{flex-shrink:0}
.wai-prov{display:inline-flex;align-items:center;border-radius:999px;padding:2px 9px;font-size:12px;font-weight:600;background:#f2f4f7;color:#344054;white-space:nowrap}
.wai-prov.gemini{background:#eff4ff;color:#1d4ed8}
.wai-prov.openai{background:#ecfdf3;color:#067647}
.wai-prov.claude{background:#fef6ee;color:#b93815}
.wai-table td small.wai-model{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11.5px}
.wai-table td:first-child{min-width:170px}
.wai-table td small.wai-model{white-space:nowrap}
.wai-status{white-space:nowrap;margin:0}
.wai-list-hint{margin:0}
.wai-list-hint svg{vertical-align:-2px;color:#6d28d9}

/* the wizard */
.wai-steps .wt-step{cursor:pointer}
.wai-steps .wt-step:hover span{color:#1d2939}
.wai-main{min-width:0}
.wai-step .wt-card-title{display:flex;align-items:center;gap:7px}
.wai-step .wt-card-title svg{color:#6d28d9}
.wai-step .wt-seg{margin:0 0 16px}
.wai-step .wt-toggle{margin-bottom:12px}
.wai-seg-tone,.wai-seg-fallback{grid-auto-columns:minmax(0,1fr)}
.wai-bar{display:flex;align-items:center;gap:10px;margin-top:16px;flex-wrap:wrap}
.wai-bar-gap{flex:1}
.wai-bar .btn{min-width:108px;justify-content:center}
.wai-instr-head{display:flex;align-items:flex-end;justify-content:space-between;gap:8px 12px;flex-wrap:wrap;margin:6px 0 6px}
.wai-instr-head .wt-label{margin:0}
.wai-instr{width:100%;min-height:230px;font-size:13px;line-height:1.55;resize:vertical}
.wai-under{margin:-8px 0 16px}

/* step 2: model */
.wai-providers{margin:0 0 16px}
.wai-providers .wt-tile{width:auto;flex:1 1 150px;min-height:96px;align-items:flex-start;justify-content:flex-start;padding:12px 14px;gap:2px;text-align:left;position:relative}
.wai-providers .wt-tile strong{font-size:14px;color:#1d2939}
.wai-providers .wt-tile small{font-size:11.5px;color:var(--we-muted);font-weight:400}
.wai-logo{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;margin-bottom:6px}
.wai-logo.gemini{background:#eff4ff;color:#2563eb}
.wai-logo.openai{background:#ecfdf3;color:#079455}
.wai-logo.claude{background:#fef6ee;color:#e04f16}
.wai-tile-ok{position:absolute;top:10px;right:10px;display:inline-flex;align-items:center;gap:3px;font-style:normal;font-size:10.5px;font-weight:600;color:#067647;background:#ecfdf3;border-radius:999px;padding:1px 7px}
.wai-key{border:1px solid #eef0f5;background:#fcfcfd;border-radius:12px;padding:14px;margin:0 0 16px}
.wai-key.ok{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:#f6fef9;border-color:#d1fadf}
.wai-key.ok>div:nth-child(2){flex:1;min-width:180px}
.wai-key strong{display:block;font-size:13px;color:#1d2939}
.wai-key.ok small{display:block;font-size:12px;color:var(--we-muted);margin-top:2px}
.wai-key-ico{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#dcfae6;color:#079455;flex-shrink:0}
.wai-key-actions{display:flex;gap:6px}
.wai-key .wt-field{margin-bottom:8px}
.wai-key-input{display:flex;gap:8px}
.wai-key-input .input{flex:1;min-width:0}
.wai-key-input .btn{flex-shrink:0}
.wai-key .wt-hint{display:flex;align-items:center;gap:4px}
.wai-crm-key{margin:0 0 4px}
.wai-seconds{max-width:260px}

/* step 3: knowledge */
.wai-add{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 16px}
.wai-add-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:76px;border:1.5px dashed #c7d2fe;background:#f8f9ff;color:#3730a3;border-radius:12px;padding:12px 8px;font-size:12.5px;font-weight:600;transition:background .15s,border-color .15s}
.wai-add-btn:hover{background:#eef2ff;border-color:#818cf8}
.wai-sources{list-style:none;margin:0 0 16px;padding:0;border:1px solid #eef0f5;border-radius:12px;overflow:hidden}
.wai-sources li{display:grid;grid-template-columns:32px minmax(0,1fr) auto auto;gap:10px;align-items:center;padding:10px 10px 10px 12px;border-top:1px solid #f2f4f7;background:#fff}
.wai-sources li:first-child{border-top:0}
.wai-src-ico{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:#f2f4f7;color:#475467}
.wai-src-ico.text{background:#eff4ff;color:#2563eb}
.wai-src-ico.url{background:#ecfdf3;color:#079455}
.wai-src-ico.faq{background:#fdf2fa;color:#c11574}
.wai-src-ico.file{background:#fef6ee;color:#e04f16}
.wai-src-main{min-width:0}
.wai-src-main strong{display:block;font-size:13px;color:#1d2939;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wai-src-main small{display:block;font-size:11.5px;color:var(--we-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wai-src-main small.wai-trim{color:#b54708;display:flex;align-items:center;gap:4px;white-space:normal}
.wai-src-cat{font-size:11.5px;font-weight:600;background:#f4f3ff;color:#5925dc;border-radius:999px;padding:2px 9px;white-space:nowrap;max-width:140px;overflow:hidden;text-overflow:ellipsis}
.wai-sources-empty{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;border:1px dashed #d0d5dd;border-radius:12px;padding:22px 16px;margin:0 0 16px;color:#98a2b3}
.wai-sources-empty strong{color:#344054;font-size:13.5px}
.wai-sources-empty small{color:var(--we-muted);font-size:12px}
.wai-cats{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 16px}
.wai-cat{border:1px solid #e4e7ec;background:#fff;border-radius:999px;padding:5px 12px;font-size:12px;font-weight:600;color:#475467}
.wai-cat:hover{border-color:#a5b4fc}
.wai-cat.on{background:#4f46e5;border-color:#4f46e5;color:#fff}
.wai-source-form .wt-field:last-of-type{margin-bottom:4px}
.wai-faq{display:grid;gap:10px;margin:0 0 10px}
.wai-faq-row{border:1px solid #eef0f5;border-radius:10px;padding:12px 12px 2px;background:#fcfcfd}
.wai-faq-row .wt-field{margin-bottom:10px}
.wai-source-form>.btn.sm{margin:0 0 14px}
.wai-drop{position:relative;display:flex;align-items:center;justify-content:center;gap:10px;border:1.5px dashed #c7d2fe;background:#f8f9ff;color:#3730a3;border-radius:12px;padding:20px 14px;font-size:13px;font-weight:600;cursor:pointer;text-align:center;overflow-wrap:anywhere}
.wai-drop:focus-within{outline:2px solid #6366f1;outline-offset:2px}
.wai-drop input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}

/* the side: checklist and test chat. The bottom room lets the test chat's send button scroll clear of the floating Cord AI launcher. */
.wai-side{min-width:0;padding-bottom:76px}
.wai-side>.wt-card+.wt-card{margin-top:0}
.wai-hours .wt-days{margin:0 0 14px}
.wai-check-link{border:0;background:none;padding:0;margin:0;text-align:left;color:inherit;font:inherit;cursor:pointer}
.wai-check-link:hover strong{text-decoration:underline}
.wt-checklist small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wt-warn{display:flex;align-items:flex-start;gap:6px;line-height:1.5}
.wt-warn svg{flex-shrink:0;margin-top:2px}
.wai-ready{margin-top:14px;background:#ecfdf3;border:1px solid #abefc6;color:#067647;border-radius:9px;padding:9px 12px;font-size:12px;display:flex;gap:6px;align-items:center}
.wai-test-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.wai-test-head .wt-card-title{margin:0}
.wai-test .wt-card-sub{margin:4px 0 12px}
.wai-chat{background:#efeae2;border-radius:12px;padding:12px;height:300px;overflow-y:auto;display:flex;flex-direction:column;gap:8px}
.wai-msg{max-width:86%;padding:7px 10px;border-radius:10px;font-size:13px;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere;box-shadow:0 1px 1px rgba(11,20,26,.08);color:#111b21}
.wai-msg.customer{align-self:flex-end;background:#d9fdd3;border-top-right-radius:3px}
.wai-msg.agent{align-self:flex-start;background:#fff;border-top-left-radius:3px}
.wai-msg.error{background:#fef3f2;color:#b42318}
.wai-msg em{color:#667781}
.wai-msg small{display:flex;align-items:flex-start;gap:4px;margin-top:5px;font-size:11px;color:#667781;white-space:normal}
.wai-msg small svg{flex-shrink:0;margin-top:2px}
.wai-typing{display:flex;gap:4px;padding:11px 12px}
.wai-typing span{width:6px;height:6px;border-radius:50%;background:#98a2b3;animation:waiDot 1.2s infinite}
.wai-typing span:nth-child(2){animation-delay:.2s}
.wai-typing span:nth-child(3){animation-delay:.4s}
@keyframes waiDot{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
.wai-chat-empty{margin:auto;color:#667781;font-size:12.5px;display:flex;gap:6px;align-items:center;text-align:center}
.wai-chat-input{display:flex;gap:8px;margin-top:10px}
.wai-chat-input .input{flex:1;min-width:0}
.wai-chat-input .btn{flex-shrink:0}

/* the inbox's dialog */
.wai-chat-state{display:flex;gap:12px;align-items:flex-start;border-radius:12px;padding:14px;border:1px solid #eef0f5;background:#f9fafb;margin:0 0 12px}
.wai-chat-state strong{display:block;font-size:14px;color:#1d2939}
.wai-chat-state small{display:block;font-size:12.5px;color:#475467;margin-top:3px;line-height:1.5}
.wai-chat-state-ico{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;background:#f2f4f7;color:#667085}
.wai-chat-state.on{background:#f5f3ff;border-color:#ddd6fe}
.wai-chat-state.on .wai-chat-state-ico{background:#ede9fe;color:#6d28d9}
.wai-chat-state.handoff{background:#fffaeb;border-color:#fedf89}
.wai-chat-state.handoff .wai-chat-state-ico{background:#fef0c7;color:#b54708}

@media(max-width:900px){.wai-add{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){
  .wai-steps{gap:6px}
  .wai-steps .wt-step:not(.on) span{display:none}
  .wai-steps .wt-step-line{width:12px}
  .wai-step .wt-seg{grid-auto-flow:row}
  .wai-step .wai-seg-tone,.wai-step .wai-seg-status{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wai-bar .btn{min-width:0;flex:1 1 auto}
  .wai-bar-gap{display:none}
  .wai-sources li{grid-template-columns:32px minmax(0,1fr) auto}
  .wai-src-cat{grid-column:2;grid-row:2;justify-self:start;margin-top:-4px}
  .wai-sources li .we-icon-btn{grid-column:3;grid-row:1}
  .wai-key-input{flex-wrap:wrap}
  .wai-key-input .input{flex-basis:100%}
  .wai-chat{height:260px}
  .wai-table td small.wai-err{max-width:200px}
}
@media(prefers-reduced-motion:reduce){.wai-typing span{animation:none}.wai-add-btn{transition:none}}
