/* V2 12 Okt: palet minimalis Abdi — warna keras biru/navy diganti token --ui-* (cadangan nilai paket V1). */
/* WWA3 2 Nov: penampil mengikuti contoh WhatsApp Web yang disetujui Abdi (warna WA, bukan palet Portal). */
.wa-status{color:var(--ui-warn,#876930);margin:0 0 8px;min-height:0}.wa-status:empty{display:none}
.wa-web{display:grid;grid-template-columns:minmax(260px,380px) minmax(0,1fr);min-height:420px;border:1px solid #D1D7DB;border-radius:10px;overflow:hidden;background:#FFFFFF;color:#111B21;font-size:14px}
.wa-web [hidden]{display:none!important}
.wa-web button{min-height:0;padding:0;background:transparent;color:inherit;font:inherit;border-radius:0;border:0;cursor:pointer}
.wa-chats{display:flex;flex-direction:column;min-width:0;min-height:0;border-right:1px solid #E9EDEF}
.wa-head{display:flex;align-items:center;gap:12px;min-height:60px;padding:0 16px;background:#F0F2F5}
.wa-head-title{flex:1;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wa-web .wa-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;color:#54656F;font-size:18px}
.wa-web .wa-icon:hover{background:#E9EDEF}.wa-head-link{color:#008069;font-size:13px;text-decoration:none;white-space:nowrap}
.wa-find-area{display:flex;flex-direction:column;gap:4px;padding:8px 12px 4px}
.wa-web .wa-find{border:0;background:#F0F2F5;border-radius:8px;padding:9px 14px;min-height:38px}
.wa-web .wa-link{align-self:flex-start;color:#008069;font-size:13px;padding:2px 2px}.wa-web .wa-link:hover{text-decoration:underline}
.wa-filters{display:flex;gap:6px;padding:4px 12px 8px;overflow-x:auto}
.wa-web .wa-filter{white-space:nowrap;background:#F0F2F5;color:#54656F;border-radius:16px;padding:6px 12px;font-size:13px}
.wa-web .wa-filter[aria-pressed=true]{background:#D9FDD3;color:#008069;font-weight:600}
.wa-list{flex:1;min-height:0;overflow:auto}.wa-empty{padding:16px;color:#667781}
.wa-web .wa-chat{display:flex;align-items:center;gap:12px;width:100%;padding:0 0 0 14px;text-align:left}
.wa-web .wa-chat:hover,.wa-web .wa-chat[aria-pressed=true]{background:#F0F2F5}
.wa-avatar{flex:none;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:#FFFFFF;font-weight:700;font-size:16px;background:#6A7FDB}
.wa-thread-head .wa-avatar{width:40px;height:40px;font-size:14px}
.wa-chat-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;padding:12px 14px 12px 0;border-bottom:1px solid #E9EDEF}
.wa-line{display:flex;justify-content:space-between;align-items:center;gap:8px;min-width:0}
.wa-name{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wa-time{flex:none;font-size:12px;color:#667781}
.wa-preview{color:#667781;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.wa-unread .wa-name{font-weight:700}.wa-unread .wa-time{color:#1FA855;font-weight:600}.wa-unread .wa-preview{color:#111B21}
.wa-dot{flex:none;width:12px;height:12px;border-radius:50%;background:#25D366}
.wa-web .wa-more{margin:8px auto;padding:6px 14px;border-radius:16px;background:#F0F2F5;color:#54656F;font-size:13px}
.wa-thread{display:flex;flex-direction:column;min-width:0;min-height:0;background:#EFEAE2}
.wa-head-text{flex:1;min-width:0;display:flex;flex-direction:column}.wa-head-text h2{margin:0;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wa-sub{font-size:13px;color:#667781}.wa-web .wa-back{display:none}
.wa-body{position:relative;flex:1;min-height:0;display:flex;flex-direction:column}
.wa-timeline{flex:1;min-height:0;overflow:auto;padding:16px 7%;display:flex;flex-direction:column;gap:4px}
.wa-placeholder{align-self:center;margin:auto;color:#54656F;background:#FFFFFF;padding:8px 14px;border-radius:8px}
.wa-day{align-self:center;background:#FFFFFF;color:#54656F;font-size:12.5px;padding:5px 12px;border-radius:8px;margin:8px 0;box-shadow:0 1px .5px #0B141A21}
.wa-bubble{position:relative;align-self:flex-start;max-width:65%;padding:6px 9px 8px;border-radius:8px;background:#FFFFFF;color:#111B21;box-shadow:0 1px .5px #0B141A21;overflow-wrap:anywhere}
.wa-outgoing{align-self:flex-end;background:#D9FDD3}.wa-sender{display:block;font-size:12.5px;font-weight:600;color:#A5317A}
.wa-text{margin:0;white-space:pre-wrap;line-height:1.4;color:inherit}.wa-deleted{font-style:italic;color:#667781}
.wa-meta{float:right;margin:6px 0 -4px 10px;font-size:11px;color:#667781}.wa-tick{margin-left:4px;color:#667781}
.wa-pending[data-kiriman=terkirim] .wa-tick{color:#53BDEB}.wa-pending-note{clear:both;margin:4px 0 0;font-size:12px;color:#876930}
.wa-bubble blockquote{margin:2px 0 6px;padding:4px 8px;border-left:4px solid #06CF9C;border-radius:4px;background:#0B141A0D;font-size:13px;color:#54656F}
.wa-web .wa-reply{position:absolute;top:2px;right:2px;width:26px;height:26px;border-radius:50%;background:#FFFFFF;color:#54656F;opacity:0}
.wa-bubble:hover .wa-reply,.wa-web .wa-reply:focus-visible{opacity:1}
.wa-media{margin-bottom:4px}.wa-media img{display:block;max-width:100%;max-height:330px;object-fit:contain;border-radius:6px}.wa-media img.wa-sticker{max-width:160px;background:transparent}
.wa-player{display:flex;flex-direction:column;align-items:flex-start;gap:4px;max-width:100%}.wa-media video{display:block;max-width:100%;max-height:330px;border-radius:6px}.wa-media audio{display:block;width:100%;min-width:220px}
.wa-media-tools{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}.wa-web .wa-chip{padding:3px 10px;border-radius:12px;background:#0B141A0D;color:#54656F;font-size:12px}
.wa-media-error{color:var(--ui-warn,#876930);margin:4px 0 0;font-size:12px}
.wa-web .wa-fresh{position:absolute;right:24px;bottom:12px;padding:6px 12px;border-radius:16px;background:#FFFFFF;color:#008069;font-size:13px;font-weight:600;box-shadow:0 1px 3px #0B141A40}
.wa-compose{background:#F0F2F5;padding:8px 16px}.wa-compose-row{display:flex;gap:10px;align-items:flex-end}
.wa-web .wa-compose textarea{flex:1;resize:none;border:0;border-radius:8px;padding:10px 14px;max-height:140px;line-height:1.4;background:#FFFFFF}
.wa-web .wa-send{flex:none;width:42px;height:42px;border-radius:50%;background:#00A884;color:#FFFFFF;display:grid;place-items:center;font-size:18px}
.wa-compose-note{margin:4px 0;text-align:center;font-size:13px;color:#54656F}.wa-compose-note a{color:#008069}
.wa-quote{display:flex;align-items:center;gap:8px;margin-bottom:6px;padding:6px 10px;border-left:4px solid #06CF9C;border-radius:6px;background:#FFFFFF;color:#54656F;font-size:13px}.wa-quote span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wa-search-panel{position:absolute;inset:0;overflow:auto;padding:12px 16px;background:#FFFFFF}
.wa-search-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px}
.wa-search-row{display:flex;gap:8px;align-items:center}.wa-search-row input{flex:1}.wa-web .wa-search>.wa-search-row>input[type=search],.wa-web .wa-search>.wa-search-row>button{min-height:40px;margin:0}.wa-web .wa-search>.wa-search-row>button{flex:none;padding:0 16px;border-radius:8px;background:#008069;color:#FFFFFF;font-weight:600}.wa-advanced{margin:8px 0;color:#54656F;font-size:13px}.wa-advanced[open]{display:grid;gap:6px}
.wa-search-results{display:flex;flex-direction:column;gap:6px;padding:8px 0}.wa-search-results .wa-bubble{max-width:100%;align-self:stretch}.wa-search-count{margin:0;color:#667781;font-size:13px}
.wa-c0{background:#6A7FDB}.wa-c1{background:#E0864A}.wa-c2{background:#3FA796}.wa-c3{background:#B5579B}.wa-c4{background:#8A8F3C}.wa-c5{background:#4A90C2}.wa-c6{background:#C25E5E}.wa-c7{background:#5B8C5A}
.wa-sender.wa-c0{background:none;color:#4A5FC1}.wa-sender.wa-c1{background:none;color:#B35A1F}.wa-sender.wa-c2{background:none;color:#1F7A6B}.wa-sender.wa-c3{background:none;color:#A5317A}.wa-sender.wa-c4{background:none;color:#6B7020}.wa-sender.wa-c5{background:none;color:#2A6E9E}.wa-sender.wa-c6{background:none;color:#A33C3C}.wa-sender.wa-c7{background:none;color:#3D6E3C}
.wa-exception-form label{display:block;margin-bottom:12px}
@media(max-width:760px){.wa-web{grid-template-columns:minmax(0,1fr);border-radius:0}.wa-web .wa-thread{display:none}.wa-web.wa-open .wa-chats{display:none}.wa-web.wa-open .wa-thread{display:flex}.wa-web .wa-back{display:grid}.wa-bubble{max-width:85%}.wa-timeline{padding:12px}.wa-web .wa-reply{opacity:1}}