.whatsapp-card{padding:22px;border:1px solid var(--line);border-radius:20px;background:var(--surface-field)}
.whatsapp-module-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;margin-bottom:14px}
.whatsapp-module-heading .settings-module-icon{margin-bottom:0;flex-shrink:0}
.whatsapp-module-status{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:10px;font-size:12px;line-height:1.4;font-weight:500;color:var(--text-secondary);text-align:left;min-width:0}
.whatsapp-module-status::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:0 0 6px}
.whatsapp-module-status[data-state=connected]{color:var(--text-success);background:var(--surface-success)}
.whatsapp-module-status[data-state=disconnected],.whatsapp-module-status[data-state=connecting],.whatsapp-module-status[data-state=pending],.whatsapp-module-status[data-state=unavailable]{color:var(--text-warning);background:var(--surface-warning)}
.whatsapp-module-status[data-state=error]{color:var(--text-error);background:var(--surface-error)}
.whatsapp-heading{display:flex;align-items:center;gap:14px}.whatsapp-heading strong{font-size:16px;display:block}.whatsapp-symbol{display:grid;place-items:center;flex:0 0 44px;height:44px;border-radius:14px;background:var(--surface-hover);color:var(--text-link)}.whatsapp-symbol svg{width:24px;height:24px}
.whatsapp-state{display:block;font-size:13px;color:var(--text-secondary);margin-top:5px}
.whatsapp-card[data-state=connected]{--whatsapp-status-text:var(--text-success);--whatsapp-status-surface:var(--surface-success)}
.whatsapp-card[data-state=disconnected],.whatsapp-card[data-state=connecting],.whatsapp-card[data-state=pending],.whatsapp-card[data-state=unavailable]{--whatsapp-status-text:var(--text-warning);--whatsapp-status-surface:var(--surface-warning)}
.whatsapp-card .whatsapp-state{color:var(--whatsapp-status-text,var(--text-secondary))}
.whatsapp-card .whatsapp-symbol{color:var(--whatsapp-status-text,var(--text-secondary));background:var(--whatsapp-status-surface,var(--surface-hover))}
.whatsapp-description{font-size:14px;line-height:1.6;color:var(--text-secondary);margin:18px 0}.whatsapp-actions{display:flex;flex-wrap:wrap;gap:10px}.whatsapp-actions button{min-height:44px;padding:10px 18px}.whatsapp-settings [hidden],.whatsapp-qr-dialog [hidden]{display:none!important}
.whatsapp-qr-dialog{width:440px;max-width:calc(100vw - 24px);color:var(--text-primary)}.whatsapp-qr-dialog header{display:flex;align-items:center;justify-content:space-between;gap:12px}.whatsapp-qr-dialog h2{font-size:22px;margin:0}.whatsapp-qr-dialog p{font-size:14px;line-height:1.6;color:var(--text-secondary)}.whatsapp-qr{display:grid;place-items:center;min-height:264px;border:1px solid var(--line);border-radius:18px;background:var(--surface-field);padding:12px;margin:18px 0}.whatsapp-qr img{width:240px;max-width:100%;height:auto;background:white;padding:8px;border-radius:8px}.whatsapp-qr span{font-size:14px;color:var(--text-secondary);text-align:center}
/* Connection settings and QR pairing share compact controls. */
.whatsapp-settings .whatsapp-card{padding:16px;border-radius:16px}
.whatsapp-settings .whatsapp-heading{gap:10px;align-items:center}
.whatsapp-settings .whatsapp-heading>div{min-width:0}
.whatsapp-settings .whatsapp-heading strong{font-size:15px;line-height:1.35;overflow-wrap:anywhere}
.whatsapp-settings .whatsapp-symbol{flex-basis:40px;height:40px;border-radius:12px}
.whatsapp-settings .whatsapp-symbol svg{width:22px;height:22px}
.whatsapp-settings .whatsapp-state{display:inline-flex;align-items:center;gap:6px;font-size:11px;line-height:1.4;margin-top:6px;padding:4px 8px;border-radius:8px;background:var(--whatsapp-status-surface,var(--surface-hover));overflow-wrap:anywhere}
.whatsapp-settings .whatsapp-state::before{content:'';width:5px;height:5px;flex:0 0 5px;border-radius:50%;background:currentColor}
.whatsapp-settings .whatsapp-description{margin:12px 0;font-size:12px;line-height:1.5}
.whatsapp-settings .whatsapp-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;border-top:1px solid var(--line);padding-top:12px}
.whatsapp-settings .whatsapp-actions button{min-width:0;width:100%;min-height:44px;height:auto;margin:0;padding:10px 12px;font-size:12px;line-height:1.35;white-space:normal}
.whatsapp-settings .whatsapp-actions [data-connect]:not([hidden]){grid-column:1/-1}
.whatsapp-qr-dialog{box-sizing:border-box;width:392px;border-radius:22px;max-height:calc(100dvh - 24px)}
.whatsapp-qr-dialog .mobile-dialog-scroll{padding:16px}
.whatsapp-qr-dialog header{gap:10px;align-items:center}
.whatsapp-qr-dialog h2{font-size:20px;line-height:1.3;min-width:0}
.whatsapp-qr-dialog header button{flex-shrink:0;min-height:44px;padding:8px 12px;font-size:12px;box-shadow:none}
.whatsapp-qr-dialog p{font-size:12px;line-height:1.5;margin:12px 0;color:var(--text-secondary)}
.whatsapp-qr-dialog .whatsapp-qr{box-sizing:border-box;width:100%;min-height:256px;margin:12px 0 0;padding:8px;border-radius:14px;background:white;overflow:hidden}
.whatsapp-qr-dialog .whatsapp-qr img{box-sizing:border-box;width:240px;max-width:100%;height:auto;padding:8px;border-radius:0}
.whatsapp-qr-dialog .whatsapp-qr span{font-size:12px;line-height:1.5;color:#344054;padding:12px}
.whatsapp-qr-dialog [data-retry]{width:100%;min-height:44px;margin-top:12px;padding:10px 12px;font-size:12px;white-space:normal}
@media(max-width:600px){
 .settings-panel .whatsapp-settings .whatsapp-actions button{font-size:11px}
 .whatsapp-qr-dialog.mobile-scroll-shell{padding:6px}
 .whatsapp-qr-dialog .mobile-dialog-scroll{padding:12px}
 .whatsapp-qr-dialog h2{font-size:18px}
 .whatsapp-qr-dialog .whatsapp-qr{min-height:240px}
}
