/* Shared TG dialog (tgConfirm / tgAlert / tgPrompt). Replaces native
   browser confirm()/alert()/prompt() with in-app modals so the app's
   chrome stays consistent. Lazy-injected by dialog.js on first use. */

#tg-dialog{
  position:fixed; inset:0;
  display:none;
  align-items:center; justify-content:center;
  background:rgba(20,20,20,.42);
  z-index:10001;
  font-family:'Source Sans Pro',system-ui,sans-serif;
}
#tg-dialog.open{display:flex;}

#tg-dialog .tg-dialog-modal{
  background:var(--surface,#fff);
  border:1px solid var(--border,#E2E4EC);
  min-width:320px; max-width:480px;
  display:flex; flex-direction:column;
  box-shadow:0 8px 28px rgba(0,0,0,.18);
}

#tg-dialog .tg-dialog-head{
  padding:14px 20px 6px;
}
#tg-dialog .tg-dialog-title{
  font-size:14px; font-weight:600;
  color:var(--text-1,#1C1C1E);
  margin:0;
  letter-spacing:.01em;
}

#tg-dialog .tg-dialog-body{
  padding:6px 20px 16px;
  font-size:13px; line-height:1.5;
  color:var(--text-1,#1C1C1E);
  white-space:pre-wrap;
  max-height:60vh; overflow-y:auto;
}

#tg-dialog .tg-dialog-input{
  width:100%; box-sizing:border-box;
  margin-top:10px;
  padding:7px 10px;
  border:1px solid var(--border,#E2E4EC);
  font-size:13px; font-family:inherit;
  background:var(--surface,#fff); color:var(--text-1,#1C1C1E);
  outline:none;
}
#tg-dialog .tg-dialog-input:focus{border-color:var(--accent,#5F7D09);}

#tg-dialog .tg-dialog-foot{
  display:flex; gap:8px;
  justify-content:flex-end;
  padding:10px 20px 14px;
  border-top:1px solid var(--border,#E2E4EC);
}

/* Self-contained button styling so the dialog works in any host page,
   including standalone apps that don't load tg-design-system.css. */
#tg-dialog button{
  padding:7px 14px;
  font-size:12px; font-family:inherit;
  letter-spacing:.02em; line-height:1;
  cursor:pointer; border-radius:0;
}
#tg-dialog .tg-dialog-ok{
  background:var(--accent,#5F7D09); color:#fff; border:1px solid var(--accent,#5F7D09);
}
#tg-dialog .tg-dialog-ok.danger{
  background:#C53030; border-color:#C53030;
}
#tg-dialog .tg-dialog-cancel{
  background:var(--surface,#fff); color:var(--text-2,#6B6E7A);
  border:1px solid var(--border,#E2E4EC);
}
#tg-dialog button:hover{opacity:.92;}
#tg-dialog button:focus{outline:none;box-shadow:0 0 0 2px rgba(95,125,9,.25);}
