/* Document defaults: fonts, theme tokens, element resets. */
@font-face {
  font-family: Vazir;
  src: url('/assets/vazirmatn.woff2') format('woff2');
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --bg: #fff;
  --surface: #fff;
  --soft: #f6f6f5;
  --soft2: #ededeb;
  --text: #171717;
  --muted: #777976;
  --line: #e9e9e7;
  --inverse: #fff;
  --accent: #ffd95f;
  --shadow: 0 12px 45px #00000012;
  --map-water: #b7d9e8;
}

html[data-theme=dark] {
  --bg: #111;
  --surface: #161616;
  --soft: #222;
  --soft2: #2d2d2d;
  --text: #f5f5f5;
  --muted: #9c9c9c;
  --line: #303030;
  --inverse: #111;
  --shadow: 0 12px 45px #0005;
  --map-water: #153345;
  color-scheme: dark;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: Vazir,Tahoma,sans-serif;
  background: var(--bg);
  color: var(--text);
  font-size: 14px;
}

button,
input,
textarea,
select {
  font: inherit;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

button {
  cursor: pointer;
  color: inherit;
}

button {
  border: 0;
  background: none;
}

button:hover {
  opacity: .78;
}

button:disabled {
  opacity: .45;
  cursor: wait;
}

a {
  color: inherit;
  text-decoration: none;
}

input,
textarea,
select {
  color: var(--text);
  background: var(--surface);
}

svg {
  width: 21px;
  height: 21px;
  display: block;
}

i {
  display: inline-flex;
  font-style: normal;
}

button:focus-visible,
a:focus-visible {
  outline: 3px solid #e4b529;
  outline-offset: 4px;
}

input:focus,
textarea:focus,
select:focus {
  outline: 2px solid #a5a5a5;
  outline-offset: 2px;
}

h1,
h2,
h3,
h4,
p {
  margin: 0;
}

small {
  font-size: 11px;
  color: var(--muted);
}