/* Tela manual da WhatsApp Cloud API no padrão da tela WhatsApp Business Platform. */
.cloud-api-page{background:var(--settings-bg,#101113)}
.cloud-api-page .cloud-api-main{width:min(1040px,100%);padding:24px 32px 56px;color:#e7e9ed}
.cloud-api-page .cloudx-back{display:inline-flex;align-items:center;gap:6px;color:#6ba4ff;font-size:14px;font-weight:570;text-decoration:none}
.cloud-api-page .cloudx-back:hover{color:#8db9ff}
.cloudx-hero{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,380px);gap:28px;align-items:center;margin:22px 0 26px;padding:34px 36px;overflow:hidden;border:1px solid rgba(190,195,202,.19);border-radius:14px;background:radial-gradient(circle at 88% 40%,rgba(37,211,102,.08),transparent 32%),radial-gradient(circle at 6% 0%,rgba(91,156,255,.08),transparent 36%),linear-gradient(135deg,#17191d,#121316 60%,#0f1012)}
.cloudx-eyebrow{display:inline-flex;align-items:center;gap:8px;color:#8fb7f9;font-size:11px;font-weight:650;letter-spacing:.1em;text-transform:uppercase}
.cloudx-eyebrow::before{content:"";width:8px;height:8px;border-radius:50%;background:#6ba4ff;box-shadow:0 0 0 4px rgba(107,164,255,.16)}
.cloud-api-page .cloudx-hero h1{margin:14px 0 10px;color:#f1f3f5;font-size:28px;font-weight:680;letter-spacing:-.4px;line-height:34px;outline:0}
.cloudx-hero-copy>p{max-width:520px;margin:0;color:#9aa2ac;font-size:14px;line-height:21px}
.cloudx-trust{display:grid;gap:9px;margin:22px 0 0;padding:0;list-style:none;color:#c8cdd3;font-size:12.5px}
.cloudx-trust li{display:flex;align-items:center;gap:8px}
.cloudx-trust li::before{content:"✓";display:grid;flex:0 0 auto;place-items:center;width:16px;height:16px;border-radius:50%;background:rgba(101,213,138,.16);color:#65d58a;font-size:10px;font-weight:800}
.cloudx-steps{display:grid;gap:12px;margin:0;padding:18px;list-style:none;border:1px solid rgba(190,195,202,.14);border-radius:12px;background:rgba(10,11,13,.55)}
.cloudx-steps li{display:grid;grid-template-columns:30px 1fr;gap:12px;align-items:center}
.cloudx-steps b{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:rgba(107,164,255,.14);color:#8fb7f9;font-size:12px;font-weight:700}
.cloudx-steps li:last-child b{background:rgba(101,213,138,.16);color:#65d58a}
.cloudx-steps strong{display:block;color:#e4e6e9;font-size:13px;font-weight:620}
.cloudx-steps small{display:block;margin-top:1px;color:#8f97a1;font-size:12px}
.cloud-api-page .cloud-api-main>p[role=status]:empty{display:none}
.cloud-api-page .cloud-api-main>p[role=status]{margin:0 0 14px;color:#9ea6b0;font-size:13px}
.cloud-api-page .cloud-api-main>p[role=alert]{margin:0 0 14px;padding:11px 14px;border:1px solid rgba(239,125,125,.35);border-radius:9px;background:rgba(239,125,125,.08);color:#f3b6b6;font-size:13px}
.cloud-api-page .cloud-api-main section{margin:0 0 18px;padding:24px 26px;border:1px solid rgba(190,195,202,.16);border-radius:12px;background:#16171a}
.cloud-api-page .cloud-api-main h2{margin:0 0 4px;color:#e4e6e9;font-size:18px;font-weight:660;letter-spacing:-.2px}
.cloud-api-page .cloud-api-main section>p{color:#8f97a1;font-size:13px;line-height:19px}
.cloud-api-page .cloud-api-main fieldset{margin:14px 0 0}
.cloud-api-page .cloud-api-main legend{margin:0 0 14px;color:#9aa2ac;font-size:13px;font-weight:500}
.cloud-api-page .cloud-api-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 18px}
.cloud-api-page label[for=cloud-accessToken]{grid-column:1/-1}
.cloud-api-page .cloud-api-main label{margin:0;color:#cfd3d8;font-size:13px;font-weight:560}
.cloud-api-page .cloud-api-main input:not([type=checkbox]),.cloud-api-page .cloud-api-main select{min-height:42px;margin-top:7px;padding:9px 12px;border:1px solid #34363b;border-radius:9px;background:#0f1012;color:#e7e9ed}
.cloud-api-page .cloud-api-main input:not([type=checkbox]):focus,.cloud-api-page .cloud-api-main select:focus{border-color:#6ba4ff;outline:0;box-shadow:0 0 0 3px rgba(107,164,255,.18)}
.cloudx-hint{display:block;margin-top:6px;color:#7d858f;font-size:11.5px;font-weight:400;line-height:16px}
.cloud-api-page .cloud-api-main button{min-height:38px;margin:14px 10px 0 0;padding:0 16px;border:1px solid #34363b;border-radius:8px;background:#222327;color:#e4e6e9;font-weight:600}
.cloud-api-page .cloud-api-main button:hover:not(:disabled){border-color:#4a4d54;background:#2a2c31}
.cloud-api-page .cloud-api-main button[type=submit]{border-color:#6ba4ff;background:#6ba4ff;color:#0d1621;box-shadow:0 8px 20px #3471cb2e}
.cloud-api-page .cloud-api-main button[type=submit]:hover:not(:disabled){border-color:#82b2ff;background:#82b2ff}
.cloud-api-page .cloud-api-main section ul{display:grid;gap:10px;margin:14px 0 0;padding:0;list-style:none}
.cloud-api-page .cloud-api-main section li{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px 14px;border:1px solid #2c2e33;border-radius:10px;background:#111215}
.cloud-api-page .cloud-api-main section li button{margin:0}
.cloud-api-page .cloud-api-metadata{gap:14px;margin-top:14px}
.cloud-api-page .cloud-api-metadata>div{padding:12px 14px;border:1px solid #2c2e33;border-radius:10px;background:#111215}
@media (max-width:860px){.cloudx-hero{grid-template-columns:1fr;padding:26px 22px}.cloud-api-page .cloud-api-fields{grid-template-columns:1fr}.cloud-api-page .cloud-api-main{padding:18px 16px 40px}}
