/* TRANSiA dialogs — the in-app replacement for window.alert/confirm/prompt.
   Loaded by both layouts, so the styling has to stand on its own: the public
   layout has its own palette and does not load dashboard.css. Every colour
   below therefore falls back to a literal when the variable is absent. */

.txdlg-backdrop{
  position:fixed;inset:0;z-index:10000;
  display:flex;align-items:center;justify-content:center;padding:20px;
  background:rgba(15,23,42,.55);
  opacity:0;transition:opacity .16s ease;
}
.txdlg-backdrop.is-open{opacity:1}

.txdlg{
  background:var(--white,#fff);
  border-radius:16px;
  width:100%;max-width:420px;
  padding:26px 26px 20px;
  box-shadow:0 30px 80px rgba(15,23,42,.35);
  text-align:center;
  transform:translateY(8px) scale(.97);
  transition:transform .16s ease;
  font-family:'Inter',system-ui,sans-serif;
  color:var(--text,#2D3748);
}
.txdlg-backdrop.is-open .txdlg{transform:none}

.txdlg-icon{
  width:52px;height:52px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 14px;font-size:22px;
}
.txdlg-icon.is-danger{background:#FEE2E2;color:#B91C1C}
.txdlg-icon.is-warning{background:#FEF3C7;color:#B45309}
.txdlg-icon.is-info{background:rgba(59,130,246,.12);color:#2563EB}
.txdlg-icon.is-success{background:rgba(34,197,94,.14);color:#15803D}

.txdlg-title{
  font-family:'Poppins',system-ui,sans-serif;
  font-size:18px;font-weight:700;line-height:1.3;margin:0 0 6px;
}
.txdlg-msg{
  color:var(--text-light,#64748B);font-size:14px;line-height:1.6;margin:0;
  white-space:pre-line;   /* messages carry \n for a second paragraph */
  word-break:break-word;
}

.txdlg-field{margin-top:16px;text-align:left}
.txdlg-field label{display:block;font-size:12px;font-weight:700;margin-bottom:6px}
.txdlg-field input,.txdlg-field textarea{
  width:100%;padding:11px 12px;font:inherit;font-size:14px;
  border:1px solid var(--border,#E2E8F0);border-radius:10px;
  background:var(--white,#fff);color:inherit;resize:vertical;
}
.txdlg-field input:focus,.txdlg-field textarea:focus{
  outline:none;border-color:var(--primary,#00B894);
  box-shadow:0 0 0 3px rgba(0,184,148,.18);
}

.txdlg-actions{display:flex;gap:10px;justify-content:center;margin-top:20px}
.txdlg-btn{
  flex:1;padding:11px 18px;border-radius:10px;border:0;cursor:pointer;
  font:inherit;font-size:14px;font-weight:700;line-height:1.2;
  transition:filter .15s ease;
}
.txdlg-btn:hover{filter:brightness(.94)}
.txdlg-btn:focus-visible{outline:2px solid var(--primary,#00B894);outline-offset:2px}
.txdlg-btn-cancel{background:var(--bg-soft,#F1F5F9);color:var(--text,#2D3748);border:1px solid var(--border,#E2E8F0)}
.txdlg-btn-ok{background:var(--primary,#00B894);color:#fff}
.txdlg-btn-ok.is-danger{background:#DC2626}
.txdlg-btn-ok.is-warning{background:#D97706}

@media (max-width:420px){
  .txdlg{padding:22px 18px 16px}
  .txdlg-actions{flex-direction:column-reverse}
}

/* Honour both the OS setting and the account-level accessibility toggle. */
@media (prefers-reduced-motion:reduce){
  .txdlg-backdrop,.txdlg{transition:none}
}
[data-motion="reduced"] .txdlg-backdrop,
[data-motion="reduced"] .txdlg{transition:none}

/* ========== TOAST ==========
   Companion to TX.toast(). Bottom-centre on desktop so it never covers the
   topbar controls, and full-width just above the thumb on small screens. */
.txtoast-host{
  position:fixed;left:50%;bottom:26px;transform:translateX(-50%);
  z-index:1200;display:flex;flex-direction:column;gap:8px;align-items:center;
  pointer-events:none;width:max-content;max-width:calc(100vw - 32px);
}
.txtoast{
  background:#0F172A;color:#fff;
  font-family:'Inter',system-ui,sans-serif;font-size:13.5px;font-weight:600;
  padding:11px 18px;border-radius:11px;
  box-shadow:0 16px 40px rgba(15,23,42,.28);
  opacity:0;transform:translateY(10px);transition:opacity .2s ease,transform .2s ease;
  max-width:100%;text-align:center;
}
.txtoast.in{opacity:1;transform:translateY(0)}
.txtoast-error{background:#B91C1C}
.txtoast-success{background:#15803D}

@media (max-width:520px){
  .txtoast-host{left:16px;right:16px;bottom:18px;transform:none;width:auto}
  .txtoast{width:100%}
}

@media (prefers-reduced-motion:reduce){ .txtoast{transition:none} }
[data-motion="reduced"] .txtoast{transition:none}
