/* Web theme variables, global element defaults and touch/overflow primitives. */
:root {
  --tg-bg: #e7ebf0;
  --tg-panel: #ffffff;
  --tg-header: #229ed9;
  --tg-header-text: #ffffff;
  --tg-user: #dcf8c6;
  --tg-bot: #ffffff;
  --tg-admin: #f0f0ff;
  --tg-text: #1f2937;
  --tg-border: #d7dde6;
  --danger: #d9534f;
  --surface-0: #ffffff;
  --surface-1: #f5f9fc;
  --surface-2: #eef5fa;
  --surface-3: #e5eef6;
  --text-muted: #5f6f7f;
  --page-start: #f8fbff;
  --page-mid: #dcebf8;
  --page-end: #c8ddf2;
  --page-shadow: rgba(31, 41, 55, 0.12);
  --md-bottom-nav-gap: max(0px, calc(env(safe-area-inset-bottom, 0px) - 28px));
  --md-bottom-nav-clearance: calc(86px + var(--md-bottom-nav-gap));
}

:root[data-theme="dark"] {
  --tg-bg: #1a2129;
  --tg-panel: #1e2731;
  --tg-header: #263847;
  --tg-header-text: #eef3f7;
  --tg-user: #283c35;
  --tg-bot: #202a34;
  --tg-admin: #252d3b;
  --tg-text: #e6edf2;
  --tg-border: #34414d;
  --danger: #ef8a7a;
  --surface-0: #1c242d;
  --surface-1: #222b35;
  --surface-2: #2a3440;
  --surface-3: #171e26;
  --text-muted: #a4b0bb;
  --page-start: #1c242d;
  --page-mid: #202933;
  --page-end: #25303a;
  --page-shadow: rgba(0, 0, 0, 0.24);
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  width: 100%;
  height: 100%;
  font-family: "Segoe UI", "Noto Sans", sans-serif;
  color: var(--tg-text);
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

html,
body,
button,
input,
textarea,
a {
  transition:
    background-color 0.22s ease,
    border-color 0.22s ease,
    color 0.22s ease,
    box-shadow 0.22s ease;
}

body.install-prompt-open {
  overflow: hidden;
}

body.install-image-viewer-open {
  overflow: hidden;
}

a,
button,
input,
label,
select,
textarea {
  touch-action: manipulation;
}
