/* whatsapp-section.css — Scaliffy WhatsApp Provisioning */
.wa-section{margin:1.5rem 0;padding:1.25rem;border:2px solid rgba(26,26,26,.15);border-radius:18px;background:linear-gradient(145deg,rgba(247,241,230,.98),rgba(242,233,220,.78));box-shadow:0 20px 48px -38px rgba(56,42,34,.55);color:#1A1A1A}
.wa-head{display:flex;align-items:center;gap:.8rem;padding-bottom:1rem;border-bottom:2px solid rgba(26,26,26,.12)}
.wa-head>div{flex:1}
.wa-head p{margin:0 0 .18rem;color:#3D3329;font:700 .62rem/1.2 JetBrains Mono,monospace;letter-spacing:.12em;text-transform:uppercase}
.wa-head h3{margin:0;color:#111;font:700 1rem/1.25 Space Grotesk,sans-serif}
.wa-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#DCF8C6;color:#075E54;border:2px solid rgba(7,94,84,.22)}.wa-mark svg{width:22px;height:22px;fill:currentColor}
.wa-status-badge{padding:.38rem .65rem;border-radius:999px;font:700 .64rem/1 Space Grotesk,sans-serif;border:1px solid rgba(26,26,26,.12)}
.wa-status-badge.is-connected{background:#C8E6C9;color:#0A3314;border-color:#0D4A1F}
.wa-status-badge.is-provisioning{background:#F5E8C9;color:#6B3F00;border-color:#8A5C12}
.wa-status-badge.is-disconnected{background:rgba(26,26,26,.08);color:#3D3630}
.wa-status-badge.is-error{background:#F8E1DB;color:#7B150A;border-color:#A13B2C}
.wa-body{padding-top:1rem}
.wa-step{display:grid;grid-template-columns:30px minmax(0,1fr);gap:.7rem;padding:1rem;border:2px solid rgba(26,26,26,.12);border-radius:14px;background:rgba(255,255,255,.48)}
.wa-section .wa-step-no{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:#1A1A1A;color:#FFF!important;-webkit-text-fill-color:#FFF!important;opacity:1!important;font:700 .72rem/1 JetBrains Mono,monospace}
.wa-step h4,.wa-step label>b{display:block;margin:0 0 .35rem;color:#111;font:700 .86rem/1.3 Space Grotesk,sans-serif}
.wa-step p,.wa-step label>span{display:block;margin:0 0 .7rem;color:#302820;font-size:.74rem;line-height:1.55}
.wa-phone-row{display:flex;align-items:stretch;gap:.45rem;margin:.5rem 0}
.wa-phone-row input{min-width:0;flex:1;min-height:42px;padding:0 .75rem;border:2px solid rgba(26,26,26,.22);border-radius:10px;background:#FFFDF8;color:#1A1A1A;font:500 .82rem/1 JetBrains Mono,monospace;outline:none}
.wa-phone-row input:focus{border-color:#25D366;box-shadow:0 0 0 3px rgba(37,211,102,.18)}
.wa-prefix{display:flex;align-items:center;min-height:42px;padding:0 .6rem;border:2px solid rgba(26,26,26,.22);border-right:0;border-radius:10px 0 0 10px;background:#F5F0E8;color:#302820;font:700 .78rem/1 JetBrains Mono,monospace}
.wa-phone-row button{min-height:42px;padding:0 .95rem;border:0;border-radius:10px;background:#075E54;color:#FFF;font:700 .75rem/1 Space Grotesk,sans-serif;cursor:pointer}
.wa-phone-row button:disabled{opacity:.3;cursor:not-allowed}
.wa-otp-row{display:flex;align-items:stretch;gap:.45rem;margin:.5rem 0}
.wa-otp-row input{width:140px;min-height:48px;padding:0 .75rem;border:2px solid rgba(26,26,26,.22);border-radius:10px;background:#FFFDF8;color:#1A1A1A;font:700 1.1rem/1 JetBrains Mono,monospace;text-align:center;letter-spacing:.3em;outline:none}
.wa-otp-row input:focus{border-color:#25D366;box-shadow:0 0 0 3px rgba(37,211,102,.18)}
.wa-otp-row button{min-height:48px;padding:0 1.2rem;border:0;border-radius:10px;background:#25D366;color:#111;font:700 .78rem/1 Space Grotesk,sans-serif;cursor:pointer}
.wa-otp-row button:disabled{opacity:.3;cursor:not-allowed}
.wa-feedback{min-height:1.2rem;margin:.55rem 0 0!important;font-size:.7rem!important;color:#302820!important}
.wa-feedback.is-success{color:#0A3314!important;font-weight:700}
.wa-feedback.is-error{color:#7B150A!important;font-weight:700}
.wa-connected-info{padding:.75rem 1rem;background:#F0FAF1;border:1px solid #90D5A0;border-radius:12px;color:#0A3314;font-size:.78rem;line-height:1.5}
.wa-connected-info strong{display:block;margin-bottom:.2rem;font:700 .85rem/1.3 Space Grotesk,sans-serif}

/* Messenger Page adapter — the blue rail is reserved for Meta-owned steps. */
#messengerSection{border-left:5px solid #0866ff}
.ms-onboarding{margin-top:.8rem;padding:1rem;border:1px solid rgba(8,102,255,.24);border-left:4px solid #0866ff;background:#fffdf8;color:#1a1a1a}
.ms-onboarding[hidden]{display:none}
.ms-onboarding-head{display:flex;align-items:center;gap:.7rem}
.ms-onboarding-head>div{display:grid;gap:.1rem}
.ms-onboarding-head small{color:#62564b;font:700 .58rem/1.2 JetBrains Mono,monospace;letter-spacing:.12em;text-transform:uppercase}
.ms-onboarding-head strong{font:700 .88rem/1.3 Space Grotesk,sans-serif}
.ms-onboarding-pulse{width:10px;height:10px;border:3px solid rgba(8,102,255,.2);border-radius:50%;background:#0866ff;box-shadow:0 0 0 5px rgba(8,102,255,.1)}
.ms-onboarding>p{margin:.65rem 0;color:#4b4036;font-size:.72rem;line-height:1.55}
.ms-page-list{display:grid;gap:.5rem;margin-top:.7rem}
.ms-page-card{position:relative;display:grid;grid-template-columns:42px minmax(0,1fr);align-items:center;gap:.7rem;min-height:62px;padding:.6rem .72rem;border:2px solid #d7cec2;background:#fff;color:#1a1a1a;cursor:pointer;outline:none}
.ms-page-card::after{content:"";position:absolute;right:.8rem;width:14px;height:14px;border:2px solid #9b9186;border-radius:50%;background:#fff}
.ms-page-card:hover{border-color:#8aaef0}
.ms-page-card:focus-visible{border-color:#0866ff;box-shadow:0 0 0 3px rgba(8,102,255,.2)}
.ms-page-card.is-selected{border-color:#0866ff;background:#f4f8ff}
.ms-page-card.is-selected::after{border:4px solid #0866ff;width:10px;height:10px}
.ms-page-avatar{display:grid;place-items:center;width:42px;height:42px;overflow:hidden;border:1px solid #cfc6ba;background:#eee8df;color:#3f352d;font:700 .88rem/1 Space Grotesk,sans-serif}
.ms-page-avatar img{width:100%;height:100%;object-fit:cover}
.ms-page-meta{display:grid;gap:.18rem;padding-right:2rem}
.ms-page-meta strong{overflow:hidden;color:#17130f;font:700 .8rem/1.25 Space Grotesk,sans-serif;text-overflow:ellipsis;white-space:nowrap}
.ms-page-meta span{color:#6b6157;font:600 .58rem/1.3 JetBrains Mono,monospace}
.ms-page-actions{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-top:.75rem;padding-top:.75rem;border-top:1px solid #ded6cc}
.ms-page-actions[hidden]{display:none}
.ms-page-actions>span{color:#554a40;font-size:.66rem;line-height:1.4}
.ms-page-actions button,.ms-retry,.ms-retry-btn{min-height:38px;padding:0 .9rem;border:0;background:#0866ff;color:#fff;font:700 .7rem/1 Space Grotesk,sans-serif;cursor:pointer}
.ms-page-actions button:disabled{opacity:.4;cursor:not-allowed}
.ms-page-actions button:focus-visible,.ms-retry:focus-visible,.ms-retry-btn:focus-visible,.ms-connected-actions button:focus-visible{outline:3px solid rgba(8,102,255,.3);outline-offset:2px}
.ms-page-empty{margin:.7rem 0 0!important;padding:.8rem;border:1px solid #e1b26d;background:#fff8e8;color:#6f4200!important}
.ms-progress{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.35rem;margin-top:.85rem}
.ms-progress[hidden]{display:none}
.ms-progress span{position:relative;padding-top:1rem;color:#80756a;font:600 .58rem/1.35 Space Grotesk,sans-serif;text-align:center}
.ms-progress span::before{content:"";position:absolute;top:0;left:50%;width:8px;height:8px;border:2px solid #bdb4aa;border-radius:50%;background:#fff;transform:translateX(-50%)}
.ms-progress span::after{content:"";position:absolute;top:5px;right:50%;width:100%;height:2px;background:#d8d0c7;z-index:-1}
.ms-progress span:first-child::after{display:none}
.ms-progress span.is-active,.ms-progress span.is-done{color:#174c9e}
.ms-progress span.is-active::before,.ms-progress span.is-done::before{border-color:#0866ff;background:#0866ff}
.ms-progress span.is-done::after,.ms-progress span.is-active::after{background:#0866ff}
.ms-retry,.ms-retry-btn{margin-top:.65rem;background:#7b3f00}
.ms-connected-actions{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:.65rem}
.ms-connected-actions button{min-height:34px;padding:0 .75rem;border:1px solid #3267aa;background:#fff;color:#174c9e;font:700 .66rem/1 Space Grotesk,sans-serif;cursor:pointer}
.ms-connected-actions #messengerDisconnectBtn{border-color:rgba(155,32,20,.45);color:#8d2115}

@media (max-width:560px){
  .ms-page-actions{align-items:stretch;flex-direction:column}
  .ms-page-actions button{width:100%}
  .ms-progress span{font-size:.52rem}
}

@media (prefers-reduced-motion:reduce){
  .ms-onboarding *{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}