/* WhatsApp Business Platform (Meta Cloud API) dashboard page */
.fw-wba{display:flex;flex-direction:column;gap:1.25rem;margin-bottom:1.5rem}
.fw-wba-panel{padding:1.25rem;border:1px solid rgba(0,0,0,.08);border-radius:1rem;background:var(--fw-surface,#fff)}
.fw-wba-head{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.fw-wba-head h2{margin:0 0 .25rem;font-size:1.1rem;font-weight:700}
.fw-wba-head p{margin:0;max-width:60ch;font-size:.85rem}
.fw-wba-head-actions{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.fw-wba-head-actions select{min-width:220px;width:auto}
.fw-wba-notice{padding:1rem 1.25rem;border-radius:.8rem;background:#fff4e5;color:#7a4b00}
.fw-wba-empty{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:2rem 1rem;color:#6b7280;text-align:center}
.fw-wba-empty i{font-size:2rem}
.fw-wba-accounts{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem}
.fw-wba-account{display:flex;flex-direction:column;gap:.5rem;padding:1rem;border:1px solid rgba(0,0,0,.08);border-radius:.9rem}
.fw-wba-account.is-active{border-color:#0866ff;box-shadow:0 0 0 3px rgba(8,102,255,.12)}
.fw-wba-account h3{margin:0;font-size:1rem;font-weight:700;overflow-wrap:anywhere}
.fw-wba-account-top{display:flex;align-items:center;justify-content:space-between}
.fw-wba-avatar{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;border-radius:50%;background:linear-gradient(135deg,#0866ff,#25d366);color:#fff;font-size:1.25rem}
.fw-wba-state{font-size:.75rem;font-weight:600;padding:.15rem .55rem;border-radius:999px;background:#e9f8ef;color:#13653a}
.fw-wba-account:not([data-status=connected]) .fw-wba-state{background:#fde8e8;color:#9b1c1c}
.fw-wba-phone{font-size:.9rem;color:#4b5563}
.fw-wba-facts{display:grid;grid-template-columns:auto 1fr;gap:.2rem .75rem;margin:0;font-size:.8rem}
.fw-wba-facts dt{font-weight:500;color:#6b7280}.fw-wba-facts dd{margin:0}
.fw-wba-quality{font-weight:700}.q-green{color:#13653a}.q-yellow{color:#a16207}.q-red{color:#b91c1c}
.fw-wba-error{margin:0;padding:.4rem .6rem;border-radius:.5rem;background:#fde8e8;color:#9b1c1c;font-size:.8rem;overflow-wrap:anywhere}
.fw-wba-actions{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:auto}
.fw-wba-own summary{cursor:pointer;font-size:.8rem;color:#0866ff}
.fw-wba-copy{display:flex;flex-direction:column;gap:.2rem;margin:.4rem 0;font-size:.8rem}
.fw-wba-filters{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1rem}
.fw-wba-templates{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem}
.fw-wba-template{display:flex;flex-direction:column;gap:.5rem;padding:1rem;border:1px solid rgba(0,0,0,.08);border-radius:.9rem}
.fw-wba-template-top{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.fw-wba-template-top strong{overflow-wrap:anywhere}
.fw-wba-template-meta{font-size:.75rem;color:#6b7280}
.fw-wba-badge{font-size:.7rem;font-weight:700;padding:.15rem .5rem;border-radius:999px;background:#eef2f7;color:#374151;white-space:nowrap}
.s-approved{background:#e9f8ef;color:#13653a}.s-pending,.s-in_appeal{background:#fff4e5;color:#7a4b00}.s-rejected,.s-disabled,.s-paused{background:#fde8e8;color:#9b1c1c}
.fw-wba-bubble{display:flex;flex-direction:column;gap:.35rem;padding:.7rem .8rem;border-radius:.2rem .9rem .9rem .9rem;background:#dcf8c6;color:#111;font-size:.85rem;white-space:pre-wrap;overflow-wrap:anywhere}
[dir=rtl] .fw-wba-bubble{border-radius:.9rem .2rem .9rem .9rem}
.fw-wba-bubble-header{font-weight:700}
.fw-wba-bubble-media{padding:1.25rem;border-radius:.5rem;background:rgba(0,0,0,.08);text-align:center;font-size:.75rem}
.fw-wba-bubble-footer{font-size:.75rem;color:#4b5563}
.fw-wba-bubble-buttons{display:flex;flex-direction:column;gap:.25rem;margin-top:.25rem}
.fw-wba-bubble-buttons span{padding:.35rem;border-top:1px solid rgba(0,0,0,.1);color:#0866ff;text-align:center;font-weight:600}
.fw-wba-backdrop{position:fixed;inset:0;z-index:1080;display:flex;align-items:center;justify-content:center;padding:1rem;background:rgba(15,23,42,.5)}
.fw-wba-dialog{display:flex;flex-direction:column;width:min(560px,100%);max-height:94vh;overflow:auto;padding:1.25rem;border-radius:1rem;background:var(--fw-surface,#fff);color:inherit;box-shadow:0 25px 60px rgba(0,0,0,.3)}
.fw-wba-dialog.is-wide{width:min(980px,100%)}
.fw-wba-dialog>header{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.fw-wba-dialog>header h3{margin:0;font-size:1.05rem;font-weight:700}
.fw-wba-form,.fw-wba-builder-main{display:flex;flex-direction:column;gap:.85rem}
.fw-wba-field{display:flex;flex-direction:column;gap:.3rem;margin:0;font-size:.85rem}
.fw-wba-field>span{font-weight:600}
.fw-wba-form fieldset,.fw-wba-builder fieldset{display:flex;flex-direction:column;gap:.6rem;padding:.75rem;border:1px solid rgba(0,0,0,.08);border-radius:.7rem}
.fw-wba-form legend,.fw-wba-builder legend{float:none;width:auto;margin:0 0 .25rem;padding:0 .25rem;font-size:.85rem;font-weight:700}
.fw-wba-builder{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:1.25rem;align-items:start}
.fw-wba-builder aside{position:sticky;top:0;display:flex;flex-direction:column;gap:.5rem}
.fw-wba-row3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}
.fw-wba-body-tools{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.fw-wba-examples{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.5rem}
.fw-wba-button-row{display:grid;grid-template-columns:150px 1fr 1fr 1fr auto;gap:.4rem;align-items:center}
.fw-wba-check{display:flex;gap:.5rem;align-items:flex-start;font-size:.85rem}
.fw-wba-option{display:flex;flex-direction:column;gap:.6rem}
.fw-wba-option h4{margin:0;font-size:.95rem;font-weight:700}
.fw-wba-fb{background:#1877f2;border-color:#1877f2}
.fw-wba-or{display:flex;align-items:center;gap:.75rem;margin:1rem 0;color:#6b7280;font-size:.8rem}
.fw-wba-or::before,.fw-wba-or::after{content:"";flex:1;height:1px;background:rgba(0,0,0,.1)}
.fw-wba-settings summary{cursor:pointer}
.fw-wba-settings .fw-wba-form{margin-top:1rem;max-width:640px}
.is-busy{opacity:.6;pointer-events:none}
@media (max-width:860px){.fw-wba-builder{grid-template-columns:1fr}.fw-wba-builder aside{position:static}.fw-wba-row3{grid-template-columns:1fr}.fw-wba-button-row{grid-template-columns:1fr 1fr}}
