/* The product's own confirm and prompt. Replaces window.confirm/prompt, which
   are headed "senditto.dev says", cannot be styled, and block the page. */

.sd-ask { position: fixed; inset: 0; z-index: 3000; display: grid; place-items: center; padding: 20px; }
.sd-ask-backdrop {
  position: absolute; inset: 0; border: 0; cursor: pointer;
  background: rgba(8, 10, 16, 0.55); backdrop-filter: blur(2px);
  animation: sdAskFade .14s ease;
}
.sd-ask-box {
  position: relative; width: min(460px, 100%);
  border-radius: 16px; padding: 26px 28px 22px;
  background: var(--panel, #fff); color: inherit;
  border: 1px solid rgba(127, 137, 158, 0.22);
  box-shadow: 0 24px 60px rgba(8, 10, 16, 0.3);
  animation: sdAskIn .16s cubic-bezier(.2, .8, .3, 1);
}
.sd-ask-box.is-danger { border-top: 3px solid #dc2626; }
.sd-ask-box h2 { margin: 0 0 8px; font-size: 18px; letter-spacing: -0.01em; }
.sd-ask-box p { margin: 0 0 12px; font-size: 13.5px; line-height: 1.6; color: var(--muted, #7c8598); }
.sd-ask-warn { color: #b91c1c !important; font-weight: 500; }

.sd-ask-field { display: block; font-size: 12px; color: var(--muted, #7c8598); margin: 16px 0 4px; }
.sd-ask-field b { color: inherit; font-weight: 600; }
.sd-ask-field input {
  display: block; width: 100%; margin-top: 6px;
  padding: 10px 12px; border-radius: 9px; font: inherit; font-size: 14px;
  border: 1px solid rgba(127, 137, 158, 0.3); background: transparent; color: inherit;
}
.sd-ask-field input:focus {
  outline: none; border-color: #2f6df6; box-shadow: 0 0 0 3px rgba(47, 109, 246, 0.14);
}

.sd-ask-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 20px; }
.sd-ask-btn {
  padding: 9px 15px; border-radius: 9px; font: inherit; font-size: 13.5px; font-weight: 500;
  border: 1px solid rgba(127, 137, 158, 0.28); background: transparent; color: inherit; cursor: pointer;
}
.sd-ask-btn:hover { background: rgba(127, 137, 158, 0.1); }
.sd-ask-btn.primary { background: #2f6df6; border-color: #2f6df6; color: #fff; }
.sd-ask-btn.primary:hover { background: #2860e0; }
.sd-ask-btn.danger { background: #dc2626; border-color: #dc2626; color: #fff; }
.sd-ask-btn.danger:hover { background: #b91c1c; }
.sd-ask-btn:disabled { opacity: .45; cursor: not-allowed; }
.sd-ask-btn:disabled:hover { background: #dc2626; }

@keyframes sdAskFade { from { opacity: 0 } }
@keyframes sdAskIn { from { opacity: 0; transform: translateY(6px) scale(.985) } }

html[data-theme="dark"] {
  .sd-ask-box { background: #141922; }
}
