/* The theme stylesheet: it sets the base tokens to give a page its look. Two
 * themes, light only, chosen by a class on the body. The homeserver and the apps
 * serve different audiences, so each has its own look. */

/* The homeserver pages: black and white, system font, sharp edges. */
.theme-home {
  --font-body: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-head: var(--font-body);

  --fs-body: 1rem;
  --fs-h2: 1.05rem;
  --fs-h1: 1.5rem;
  --lh: 1.5;
  --h1-weight: 700;
  --h1-spacing: -0.01em;

  --bg: #ffffff;
  --surface: #ffffff;
  --sunk: #f2f2f2;
  --ink: #101010;
  --muted: #565656;
  --faint: #8a8a8a;
  --border: #d7d7d7;
  --border-strong: #101010;

  --accent: #101010;
  --accent-ink: #ffffff;
  --accent-weak: #f0f0f0;
  --danger: #a01a1a;

  --radius: 0px;
  --radius-sm: 0px;
  --shadow: none;
  --card-border: var(--border-strong);
}

/* A second homeserver, the mirror of the first: white on black, so the two are
 * easy to tell apart. */
.theme-home-dark {
  --font-body: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-head: var(--font-body);

  --fs-body: 1rem;
  --fs-h2: 1.05rem;
  --fs-h1: 1.5rem;
  --lh: 1.5;
  --h1-weight: 700;
  --h1-spacing: -0.01em;

  --bg: #0c0c0c;
  --surface: #0c0c0c;
  --sunk: #1c1c1c;
  --ink: #f2f2f2;
  --muted: #a6a6a6;
  --faint: #6a6a6a;
  --border: #333333;
  --border-strong: #f2f2f2;

  --accent: #f2f2f2;
  --accent-ink: #0c0c0c;
  --accent-weak: #242424;
  --danger: #ff7a7a;

  --radius: 0px;
  --radius-sm: 0px;
  --shadow: none;
  --card-border: var(--border-strong);
}
.theme-home-dark .tag { border: 1px solid var(--border-strong); }
.theme-home-dark a { text-decoration: none; }
.theme-home-dark a:hover { text-decoration: underline; }
.theme-home-dark .btn-primary:hover { filter: none; background: #ffffff; }

/* The apps: a cream page and a serif, sized for reading. */
.theme-book {
  --font-body: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, Charter, Georgia, serif;
  --font-head: var(--font-body);

  --fs-body: 1.075rem;
  --fs-h2: 1.2rem;
  --fs-h1: 1.65rem;
  --lh: 1.62;
  --h1-weight: 600;
  --h1-spacing: 0;

  --bg: #f4efe3;
  --surface: #fbf7ee;
  --sunk: #ece4d3;
  --ink: #2c2721;
  --muted: #6d6456;
  --faint: #a89c86;
  --border: #ddd3bf;
  --border-strong: #cabfa6;

  --accent: #8a3b2e;
  --accent-ink: #fbf7ee;
  --accent-weak: #efe3d5;
  --danger: #9a3324;

  --radius: 4px;
  --radius-sm: 3px;
  --shadow: 0 1px 2px rgba(60, 45, 30, 0.05);
  --card-border: var(--border);
}

/* Old-style figures suit the book; a link keeps a quiet underline on hover. */
.theme-book { font-variant-numeric: oldstyle-nums; }
.theme-book a { text-decoration: none; }
.theme-book a:hover { text-decoration: underline; }

/* The homeserver draws its tags and its primary button with a hard black edge. */
.theme-home .tag { border: 1px solid var(--border-strong); }
.theme-home a { text-decoration: none; }
.theme-home a:hover { text-decoration: underline; }
.theme-home .btn-primary:hover { filter: none; background: #000; }

/* The microblog: a bright sans on a cool grey page, a sky-blue accent, rounded
 * cards with a soft shadow. Set apart from the book's serif and the homeserver's
 * hard monochrome. */
.theme-bird {
  --font-body: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-head: var(--font-body);

  --fs-body: 1rem;
  --fs-small: 0.85rem;
  --fs-h2: 1.2rem;
  --fs-h1: 1.7rem;
  --lh: 1.45;
  --h1-weight: 800;
  --h1-spacing: -0.02em;

  --bg: #f2f5f7;
  --surface: #ffffff;
  --sunk: #eaeef0;
  --ink: #0f1419;
  --muted: #56687a;
  --faint: #8a9aa8;
  --border: #dde4e8;
  --border-strong: #c3ced6;

  --accent: #1d8ff0;
  --accent-ink: #ffffff;
  --accent-weak: #e6f2fd;
  --danger: #e0245e;

  --radius: 14px;
  --radius-sm: 6px;
  --shadow: 0 1px 3px rgba(15, 20, 25, 0.06);
  --card-border: var(--border);
}
.theme-bird a { text-decoration: none; }
.theme-bird a:hover { text-decoration: underline; }
.theme-bird .btn-primary { border-radius: 999px; font-weight: 700; }
.theme-bird button:not(.btn-primary):not(.btn-text):not(.act):not(.author):not(.remove) { border-radius: 999px; }