/* Popup de criação de conta gratuita Daiki Circle — mostrado no fim de
   uma marcação/compra a quem ainda não tem conta (ver assets/
   create-account-popup.js e marcacao-estado.html, curso-estado.html,
   encomenda-estado.html, carrinho-estado.html). Modal central, mesmo
   espírito do welcome-overlay já usado em circle/dashboard.html.
   Tokens com fallback (var(--red,#CC0000)) para funcionar em qualquer
   página, tal como assets/cookie-consent.css. */

.cap-overlay {
  position: fixed; inset: 0; z-index: 2000;
  background: rgba(17, 17, 17, .55);
  display: flex; align-items: center; justify-content: center; padding: 24px;
  opacity: 0; transition: opacity .25s;
}
.cap-overlay.open { opacity: 1; }
.cap-modal {
  background: var(--white, #fff); max-width: 420px; width: 100%;
  padding: 40px 36px; text-align: center;
  transform: translateY(12px); transition: transform .25s;
  border-top: 3px solid var(--red, #CC0000);
}
.cap-overlay.open .cap-modal { transform: translateY(0); }
.cap-modal h2 {
  font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 1.5rem;
  margin-bottom: 12px; color: var(--black, #111);
}
.cap-modal p {
  font-size: .86rem; color: var(--grey, #555); line-height: 1.65; margin-bottom: 22px;
}
.cap-modal input {
  width: 100%; padding: 12px 14px; border: 1px solid var(--border, #E2E2E2);
  font-family: inherit; font-size: .9rem; box-sizing: border-box; margin-bottom: 14px;
}
/* Textarea de mensagem (ver assets/message-provider-popup.js) — mesmo
   padrão visual dos inputs acima, só que redimensionável em altura. */
.cap-modal textarea {
  width: 100%; padding: 12px 14px; border: 1px solid var(--border, #E2E2E2);
  font-family: inherit; font-size: .9rem; box-sizing: border-box; margin-bottom: 10px;
  resize: vertical;
}
.mpp-hint { font-size: .68rem; color: var(--grey2, #888); margin: 0 0 18px; line-height: 1.5; }
.cap-modal .cap-submit {
  width: 100%; background: var(--red, #CC0000); color: #fff; border: none;
  font-family: 'Jost', sans-serif; font-size: .72rem; letter-spacing: .16em; text-transform: uppercase;
  padding: 14px; cursor: pointer; transition: background .2s;
}
.cap-modal .cap-submit:hover { background: var(--red-h, #E60000); }
.cap-modal .cap-submit:disabled { opacity: .5; cursor: default; }
.cap-modal .cap-skip {
  display: block; margin: 16px auto 0; background: none; border: none;
  color: var(--grey2, #888); font-family: 'Jost', sans-serif; font-size: .74rem;
  cursor: pointer; text-decoration: underline;
}
.cap-modal .cap-skip:hover { color: var(--grey, #555); }
.cap-msg { font-size: .78rem; color: var(--red, #CC0000); min-height: 1.1em; margin-top: 10px; }
.cap-msg.ok { color: #2E7D32; }