/* ============================================================
   The Tech Pad — Account settings overlay styles
   (settings-account.js renders the "My account" card)
   ============================================================ */

#ttp-acct-toast {
  position: fixed;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2147483647;
  padding: 11px 18px;
  border-radius: 10px;
  font: 600 13.5px/1.4 Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .25);
  display: none;
  max-width: 90vw;
}
#ttp-acct-toast.ok { background: #0b6b4f; color: #fff; }
#ttp-acct-toast.err { background: #b42318; color: #fff; }

/* Account card — compact, matches native .settings-card rhythm, lives INSIDE
   .page-card.settings-page (the content column beside the sidebar). */
.ttp-acct-card {
  border: 1px solid #dce6e1;
  border-radius: 16px;
  background: #fbfdfc;
  padding: 18px 20px;
  margin: 0 0 20px;
}
.ttp-acct-card h3 { font-size: 15px; font-weight: 700; margin: 0 0 2px; color: #0b2f27; }
.ttp-acct-card .ttp-acct-sub { font-size: 12px; color: #6d7e76; margin: 0 0 14px; }
.ttp-acct-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px 14px; }
.ttp-acct-field { display: flex; flex-direction: column; gap: 4px; }
.ttp-acct-label { font-size: 11.5px; font-weight: 600; color: #47655b; }
.ttp-acct-field input {
  border: 1px solid #cfdcd6; border-radius: 8px; padding: 7px 10px;
  font: 13px/1.4 Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  color: #0b2f27; background: #fff; width: 100%;
}
.ttp-acct-field input:focus { outline: none; border-color: #0b6b4f; box-shadow: 0 0 0 3px rgba(11, 107, 79, .12); }
.ttp-acct-field input[readonly] { background: #eef2f0; color: #64807a; }
.ttp-acct-actions { display: flex; gap: 10px; margin-top: 13px; align-items: center; flex-wrap: wrap; }
.ttp-acct-btn { border: none; border-radius: 8px; padding: 8px 15px; font: 600 12.5px Inter, system-ui, sans-serif; cursor: pointer; }
.ttp-acct-btn.primary { background: #0b6b4f; color: #fff; }
.ttp-acct-btn.primary:hover { background: #095a43; }
.ttp-acct-btn.ghost { background: #fff; color: #0b2f27; border: 1px solid #cfe3da; }
.ttp-acct-btn:disabled { opacity: .55; cursor: default; }
.ttp-acct-hr { border: none; border-top: 1px solid #e6eeea; margin: 20px 0 16px; }
.ttp-acct-note { font-size: 12px; color: #64807a; margin-top: 8px; }

/* Recovery landing: cover the native page so the reset form is the focus. */
body.ttp-acct-recovery #root, body.ttp-acct-recovery .dashboard { opacity: .25; pointer-events: none; }
body.ttp-acct-recovery #ttp-acct-card {
  max-width: 460px;
  margin: 8vh auto 0;
  box-shadow: 0 18px 50px rgba(11, 47, 39, .18);
}

/* ---- Compact the native settings page (General settings / Timezone) ---- */
.page-card.settings-page { padding: 18px 20px; }
.page-card.settings-page .section-heading { margin-bottom: 14px; }
.page-card.settings-page .settings-form { gap: 10px; }
.page-card.settings-page .settings-card { padding: 14px 16px; gap: 16px; border-radius: 12px; }
.page-card.settings-page .settings-card h3 { font-size: 15px; margin: 4px 0; }
.page-card.settings-page .settings-card p { font-size: 11.5px; }
.page-card.settings-page .settings-icon { width: 38px; height: 38px; }