/* ===== CMO Hub — đen ấm + cam, glassmorphism (đồng bộ style.css) ===== */
.cmo-ver{font-size:11px;font-weight:700;color:var(--muted);background:rgba(255,255,255,.07);
  border:1px solid var(--glass-line);border-radius:var(--radius-pill);padding:4px 12px;vertical-align:middle;margin-left:10px}

/* sub-tabs (giống digital_ads) */
.subtabs{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 16px;border-bottom:1px solid var(--glass-line);padding-bottom:14px}
.subtabs a{padding:8px 16px;border-radius:var(--radius-sm);font-size:13.5px;font-weight:700;color:var(--muted);
  background:rgba(255,255,255,.05);border:1px solid var(--glass-line);white-space:nowrap;transition:.16s}
.subtabs a:hover{background:var(--p-soft);color:var(--p)}
.subtabs a.on{background:var(--fill);color:var(--fill-ink);border-color:transparent}

/* toolbar sửa */
.cmo-toolbar{display:flex;align-items:center;gap:10px;margin:0 0 18px;flex-wrap:wrap}
.cmo-toolbar .sp{flex:1}
.cmo-store-note{font-size:11.5px;color:var(--muted)}
.cmo-btn{border:1px solid var(--glass-line);background:rgba(255,255,255,.07);color:var(--ink);
  padding:8px 16px;border-radius:var(--radius-pill);font-size:12.5px;cursor:pointer;font-weight:700;
  backdrop-filter:blur(8px);transition:.16s;font-family:inherit}
.cmo-btn:hover{background:var(--p-soft);color:var(--p);border-color:var(--p)}
.cmo-btn.ghost{color:var(--muted)}
.cmo-btn.mini{padding:3px 10px;font-size:11px;margin-left:8px;vertical-align:middle}
.cmo-btn.big{background:var(--fill);color:#fff;border:0;padding:13px 20px;font-size:14px;width:100%;box-shadow:var(--shadow-sm)}
.cmo-btn.big:hover{filter:brightness(1.1);color:#fff}
.cmo-btn.big:disabled{opacity:.6;cursor:wait}
body.cmo-editing #cmo-edit-toggle{background:var(--fill);color:#fff;border-color:transparent}
.edit-only{display:none}
body.cmo-editing .edit-only{display:inline-block}
.del-x{cursor:pointer;color:#f87171;font-weight:800;margin-left:8px;display:none;background:none;border:0;font-size:13px}
body.cmo-editing .del-x{display:inline-block}
[contenteditable="true"]{outline:1px dashed rgba(255,122,26,.55);outline-offset:2px;border-radius:4px;min-width:24px}

/* lưới 2 cột */
.cmo-g2{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}
.cmo-sub{font-size:12px;color:var(--muted);margin:-6px 0 14px}

/* content map strip */
.cmap-strip{display:flex;gap:8px 22px;flex-wrap:wrap;align-items:center;margin-bottom:18px;font-size:13px;padding:14px 20px}
.cmap-strip b{color:var(--ink)}
.cmap-strip .ci{display:flex;align-items:center;gap:7px;white-space:nowrap}
.cmap-strip .ci .n{font-weight:800;font-size:15px}
.ok{color:#4ade80}.warn{color:#fbbf24}.bad{color:#f87171}

/* phễu */
.cvr-total{float:right;font-size:11.5px;background:var(--p-soft);color:var(--p);border-radius:var(--radius-pill);padding:3px 11px}
.fstep{margin-bottom:13px}
.fstep .fl{display:flex;align-items:baseline;gap:8px;font-size:13px;margin-bottom:5px}
.fstep .fl b{color:var(--ink)}
.fstep .fl small{color:var(--muted);font-size:11px}
.fstep .fl .fv{margin-left:auto;font-weight:800;font-size:15px;color:var(--ink)}
.fstep .fl .fcvr{font-size:11px;font-weight:700;border-radius:var(--radius-pill);padding:2px 9px;background:rgba(255,255,255,.08);color:var(--muted)}
.fstep .fbar{height:9px;border-radius:6px;background:rgba(255,255,255,.08);overflow:hidden}
.fstep .fbar>i{display:block;height:100%;border-radius:6px;background:var(--fill);transition:width .6s var(--ease-ios)}

/* bảng */
#tbl-channels td:first-child,#tbl-campaigns td:first-child{font-weight:700;color:var(--ink)}
.chip.good{background:rgba(74,222,128,.16);color:#4ade80}
.chip.weak{background:rgba(248,113,113,.16);color:#f87171}
.chip.mid{background:rgba(251,191,36,.16);color:#fbbf24}
.chip.st-active{background:rgba(74,222,128,.16);color:#4ade80}
.chip.st-completed{background:rgba(109,179,242,.18);color:#9cc9f7}
.chip.st-draft{background:rgba(255,255,255,.10);color:#a8aec2}
.chip.st-paused{background:rgba(251,191,36,.16);color:#fbbf24}

/* điểm nghẽn */
.bn{border:1px solid var(--glass-line);border-left:3px solid var(--p2);border-radius:var(--radius-sm);
  padding:12px 14px;margin-bottom:10px;background:rgba(255,255,255,.04)}
.bn .bt{display:flex;gap:8px;align-items:center;font-size:11px;font-weight:800;letter-spacing:.5px;margin-bottom:5px;color:var(--muted)}
.bn h4{font-size:13.5px;color:var(--ink);margin-bottom:3px}
.bn p{font-size:12px;color:var(--muted)}
.bn.sev-high{border-left-color:#f87171}.bn.sev-mid{border-left-color:#fbbf24}

/* ===== Bản đồ chiến lược ===== */
.strat-tabs{margin-bottom:18px}
.scard{background:var(--glass);border:1px solid var(--glass-line);border-radius:var(--radius);
  padding:18px 20px;box-shadow:var(--shadow-sm);backdrop-filter:blur(14px) saturate(140%)}
.sgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.scard h3{font-size:15px;color:var(--ink);margin-bottom:4px}
.scard .stag{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.6px;border-radius:var(--radius-pill);
  padding:2px 10px;margin-bottom:8px;background:var(--p-soft);color:var(--p)}
.stag.tofu{background:rgba(109,179,242,.18);color:#9cc9f7}
.stag.mofu{background:rgba(251,191,36,.16);color:#fbbf24}
.stag.bofu{background:rgba(74,222,128,.16);color:#4ade80}
.scard p{font-size:12.5px;color:var(--muted);margin-bottom:8px}
.kvrow{font-size:12.5px;margin-bottom:6px}
.kvrow b{color:var(--p)}
.kvrow span{color:#cfc9c0}
.msgbox{border:1px solid var(--glass-line);border-radius:var(--radius-sm);padding:9px 12px;font-size:12.5px;
  background:rgba(255,255,255,.04);margin:8px 0;color:#d9d3ca}
.msgbox b{color:var(--ink)}
.topics{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.topics span{font-size:11.5px;border:1px solid var(--glass-line);border-radius:var(--radius-pill);
  padding:3px 11px;background:rgba(255,255,255,.05);color:#cfc9c0}
.col3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-top:10px}
.col3 .cbx{border-radius:var(--radius-sm);padding:10px 12px;font-size:12px}
.cbx b{display:block;margin-bottom:4px;font-size:11.5px}
.cbx.strong{background:rgba(74,222,128,.10);border:1px solid rgba(74,222,128,.25);color:#cde9d4}
.cbx.weakx{background:rgba(248,113,113,.10);border:1px solid rgba(248,113,113,.25);color:#ecd0d0}
.cbx.aim{background:rgba(255,122,26,.10);border:1px solid rgba(255,122,26,.3);color:#ecd9c8}
.cbx.strong b{color:#4ade80}.cbx.weakx b{color:#f87171}.cbx.aim b{color:var(--p)}
.jstage{display:flex;gap:14px;padding:13px 0;border-bottom:1px dashed rgba(255,255,255,.12)}
.jstage:last-child{border:0}
.jstage .jn{width:34px;height:34px;border-radius:50%;background:var(--fill);color:#fff;font-weight:800;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:14px}
.jstage h4{font-size:13.5px;color:var(--ink)}
.jstage p{font-size:12px;color:var(--muted);margin-top:2px}
.jstage .jm{font-size:11px;color:var(--p);font-weight:700;margin-top:4px}
.banlist{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.banlist span{background:rgba(248,113,113,.14);color:#f8a5a5;border:1px solid rgba(248,113,113,.3);
  border-radius:var(--radius-pill);padding:4px 14px;font-size:12.5px;font-weight:700}
.ab-st{font-size:10.5px;font-weight:800;border-radius:var(--radius-pill);padding:2px 10px}
.ab-st.win{background:rgba(74,222,128,.16);color:#4ade80}
.ab-st.fail{background:rgba(248,113,113,.16);color:#f87171}
.ab-st.run{background:rgba(251,191,36,.16);color:#fbbf24}

/* ===== Inbox ===== */
.inbox-grid{display:grid;grid-template-columns:280px 1.4fr 1fr;gap:14px;align-items:start}
.ib-list h2,.ib-conv h2{font-size:14px}
.ib-lead{border:1px solid var(--glass-line);border-radius:var(--radius-sm);padding:10px 12px;margin-bottom:9px;
  cursor:pointer;background:rgba(255,255,255,.04);transition:.15s}
.ib-lead:hover{border-color:var(--p)}
.ib-lead.on{border-color:var(--p);background:var(--p-soft)}
.ib-lead .ln{font-size:13px;font-weight:800;color:var(--ink);display:flex;gap:6px;align-items:center}
.ib-lead .lp{font-size:11.5px;color:var(--muted);margin:3px 0 6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ib-badges{display:flex;gap:5px;flex-wrap:wrap}
.ib-badges span{font-size:9.5px;font-weight:800;border-radius:6px;padding:1px 7px;letter-spacing:.4px}
.hb-hot{background:rgba(248,113,113,.18);color:#f87171}
.hb-warm{background:rgba(251,191,36,.16);color:#fbbf24}
.hb-cold{background:rgba(109,179,242,.18);color:#9cc9f7}
.hb-src{background:rgba(255,255,255,.08);color:#a8aec2}
.hb-stt{background:rgba(74,222,128,.16);color:#4ade80}
#ib-conv-head{border-bottom:1px solid var(--glass-line);padding-bottom:10px;margin-bottom:12px}
#ib-conv-head h3{font-size:15px;color:var(--ink)}
#ib-conv-head .meta{font-size:11.5px;color:var(--muted);margin-top:3px}
#ib-conv-head .acts{margin-top:8px;display:flex;gap:6px;flex-wrap:wrap}
#ib-msgs{max-height:300px;overflow-y:auto;margin-bottom:12px}
.msg{max-width:88%;border-radius:var(--radius-sm);padding:9px 13px;font-size:12.5px;margin-bottom:9px;line-height:1.5}
.msg.kh{background:rgba(255,255,255,.07);border:1px solid var(--glass-line);color:#e7e2da}
.msg.shop{background:var(--p-soft);border:1px solid rgba(255,122,26,.3);margin-left:auto;color:#f0e3d4}
.msg .who{font-size:9.5px;font-weight:800;letter-spacing:.6px;color:var(--muted);display:block;margin-bottom:3px}
.ib-reply textarea{width:100%;min-height:74px;background:rgba(255,255,255,.05);border:1px solid var(--glass-line);
  border-radius:var(--radius-sm);color:var(--ink);font-family:inherit;font-size:13px;padding:10px 12px;resize:vertical}
.ib-toolbar{font-size:12px;color:var(--muted);margin-bottom:8px;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.ib-toolbar b{color:var(--p)}
.ib-actions{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
.ib-actions select{flex:1;min-width:160px}
.ib-ai{display:flex;flex-direction:column;gap:14px}
.panel.dark{background:linear-gradient(140deg,rgba(38,22,10,.92),rgba(20,12,8,.94));border-color:rgba(255,122,26,.25)}
.panel.dark h2{color:var(--p)}
.ai-kv{font-size:12px;margin-bottom:7px;color:#cfc9c0}
.ai-kv b{color:var(--ink)}
.ai-draft-txt{font-size:12.5px;color:#e7dccd;font-style:italic;line-height:1.6;max-height:220px;overflow-y:auto;white-space:pre-wrap}
.ib-ai .use{margin-top:10px}

/* ===== Báo cáo ===== */
.cmo-filterbar{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:18px;padding:14px 18px}
.cmo-filterbar label{font-size:11px;color:var(--muted);font-weight:700;display:flex;flex-direction:column;gap:5px;flex:1;min-width:140px}
select,.ai-form select{background:rgba(255,255,255,.06);border:1px solid var(--glass-line);color:var(--ink);
  border-radius:var(--radius-sm);padding:8px 10px;font-size:12.5px;font-family:inherit}
select option{background:#1a140f;color:var(--ink)}
.rp-act{display:flex;align-items:center;gap:10px;border:1px solid var(--glass-line);border-radius:var(--radius-sm);
  padding:11px 13px;margin-bottom:9px;background:rgba(255,255,255,.04);font-size:12.5px}
.rp-act .risk{font-size:9.5px;font-weight:800;border-radius:6px;padding:2px 8px;flex-shrink:0;letter-spacing:.4px}
.risk.high{background:rgba(248,113,113,.18);color:#f87171}
.risk.med{background:rgba(251,191,36,.16);color:#fbbf24}
.rp-act .cat{color:var(--p);font-weight:800;flex-shrink:0}
.rp-act .tx{flex:1;color:#d9d3ca}
.gate{margin-bottom:12px}
.gate .gl{display:flex;font-size:12.5px;margin-bottom:5px}
.gate .gl b{color:var(--ink)}
.gate .gl span{margin-left:auto;font-weight:800}
.gate .gbar{height:10px;border-radius:6px;background:rgba(255,255,255,.08);overflow:hidden;position:relative}
.gate .gbar>i{display:block;height:100%;border-radius:6px}
.gate .gbar .lim{position:absolute;top:-2px;bottom:-2px;width:2px;background:#fff;opacity:.7}

/* ===== Trợ lý AI ===== */
.ai-grid{align-items:start}
.ai-form{display:flex;flex-direction:column;gap:12px}
.ai-form label{font-size:11px;color:var(--muted);font-weight:800;display:flex;flex-direction:column;gap:6px;letter-spacing:.4px;text-transform:uppercase}
.ai-form textarea{min-height:96px;background:rgba(255,255,255,.05);border:1px solid var(--glass-line);
  border-radius:var(--radius-sm);color:var(--ink);font-family:inherit;font-size:13px;padding:10px 12px;resize:vertical}
.ai-quick{margin-top:18px;border-top:1px dashed var(--glass-line);padding-top:14px}
.ai-quick h3{font-size:12.5px;color:var(--p);margin-bottom:10px}
#ai-quick-chips{display:flex;flex-wrap:wrap;gap:7px}
#ai-quick-chips button{border:1px solid var(--glass-line);background:rgba(255,255,255,.05);color:#cfc9c0;
  border-radius:var(--radius-pill);padding:6px 13px;font-size:12px;cursor:pointer;font-family:inherit;transition:.15s}
#ai-quick-chips button:hover{border-color:var(--p);color:var(--p)}
.ai-result{min-height:320px;font-size:13.5px;line-height:1.7;color:#e7e2da;white-space:pre-wrap}
.ai-result .ai-empty{color:var(--muted);text-align:center;padding:90px 20px;font-size:13px;white-space:normal}
.ai-result .ai-warn{background:rgba(251,191,36,.12);border:1px solid rgba(251,191,36,.3);border-radius:var(--radius-sm);
  padding:10px 13px;font-size:12px;color:#fbe3a8;margin-bottom:12px;white-space:normal}
.ai-loading{color:var(--p);text-align:center;padding:80px 0;font-size:13px}
.ai-loading i{display:inline-block;animation:spin 1s linear infinite;font-style:normal}
@keyframes spin{to{transform:rotate(360deg)}}

/* ===== Mobile ===== */
@media(max-width:900px){
  .cmo-g2,.sgrid,.col3{grid-template-columns:1fr}
  .inbox-grid{grid-template-columns:1fr}
  #ib-msgs{max-height:240px}
}
@media(max-width:700px){
  .subtabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:10px}
  .subtabs::-webkit-scrollbar{display:none}
  .cmo-toolbar{gap:7px}
  .cmo-store-note{display:none}
  .cmap-strip{gap:6px 14px;font-size:12px}
  .strat-tabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .strat-tabs::-webkit-scrollbar{display:none}
  .cmo-filterbar label{min-width:46%}
}
