/* Campaign theme hooks. Add future campaign themes with body[data-campaign-theme="<id>"]. */

body[data-campaign-theme="stormlight"] {
  --campaign-bg-panel: rgba(10, 22, 34, 0.74);
  --campaign-bg-panel-soft: rgba(21, 42, 60, 0.54);
  --campaign-bg-control: rgba(231, 244, 255, 0.09);
  --campaign-border: rgba(176, 218, 246, 0.42);
  --campaign-border-strong: rgba(236, 248, 255, 0.64);
  --campaign-text: #e8f3fb;
  --campaign-text-muted: #b8cad7;
  --campaign-heading: #f7fbff;
  --campaign-link: #b7e4ff;
  --campaign-link-hover: #ffffff;
  --campaign-accent: #d8ecff;
  --campaign-accent-2: #9b8cff;
  --campaign-gold: #f1ce78;
  --campaign-shadow: rgba(1, 8, 16, 0.78);
  --campaign-glow: rgba(164, 220, 255, 0.28);

  color: var(--campaign-text);
}

body[data-campaign-theme="stormlight"]::before {
  background:
    radial-gradient(ellipse at 18% 8%, rgba(204, 232, 255, 0.14), transparent 34%),
    radial-gradient(ellipse at 82% 18%, rgba(120, 103, 214, 0.12), transparent 32%),
    linear-gradient(115deg, rgba(255, 255, 255, 0.035), transparent 30%, rgba(133, 191, 232, 0.055) 58%, transparent 82%),
    rgba(3, 9, 16, 0.2);
}

body[data-campaign-theme="stormlight"]::after {
  background:
    linear-gradient(to bottom, rgba(216, 237, 255, 0.04), rgba(2, 8, 17, 0.38)),
    radial-gradient(ellipse at center, rgba(74, 122, 158, 0.04) 0%, rgba(2, 8, 18, 0.46) 100%);
}

body[data-campaign-theme="stormlight"] #inner-wrapper {
  background:
    linear-gradient(180deg, rgba(17, 34, 50, 0.74), rgba(8, 17, 28, 0.82));
  color: var(--campaign-text);
  border-color: var(--campaign-border);
  backdrop-filter: blur(3px);
  box-shadow:
    0 24px 54px var(--campaign-shadow),
    0 0 34px rgba(147, 198, 231, 0.12);
}

body[data-campaign-theme="stormlight"] .content-shell {
  background:
    linear-gradient(180deg, rgba(16, 35, 53, 0.42), rgba(7, 16, 27, 0.56)),
    linear-gradient(135deg, rgba(217, 238, 255, 0.045), transparent 42%, rgba(132, 114, 221, 0.055));
}

body[data-campaign-theme="stormlight"] #top {
  background:
    linear-gradient(180deg, rgba(24, 47, 67, 0.72), rgba(8, 18, 30, 0.86));
  border-bottom: 1px solid var(--campaign-border);
}

body[data-campaign-theme="stormlight"] .tavern-logo a,
body[data-campaign-theme="stormlight"] h1,
body[data-campaign-theme="stormlight"] h2,
body[data-campaign-theme="stormlight"] h3,
body[data-campaign-theme="stormlight"] .markdown-body h1,
body[data-campaign-theme="stormlight"] .markdown-body h2,
body[data-campaign-theme="stormlight"] .markdown-body h3,
body[data-campaign-theme="stormlight"] .markdown-body h4,
body[data-campaign-theme="stormlight"] .page-heading h2,
body[data-campaign-theme="stormlight"] .campaign-hero-copy h2 {
  color: var(--campaign-heading);
  text-shadow: 0 0 16px rgba(171, 220, 255, 0.34), 0 2px 10px rgba(0, 0, 0, 0.8);
}

body[data-campaign-theme="stormlight"] .tagline,
body[data-campaign-theme="stormlight"] p,
body[data-campaign-theme="stormlight"] .markdown-body,
body[data-campaign-theme="stormlight"] .campaign-role,
body[data-campaign-theme="stormlight"] .sheet-muted {
  color: var(--campaign-text);
}

body[data-campaign-theme="stormlight"] .eyebrow,
body[data-campaign-theme="stormlight"] .campaign-kicker,
body[data-campaign-theme="stormlight"] .markdown-body li::marker,
body[data-campaign-theme="stormlight"] .reader-toc strong {
  color: var(--campaign-gold);
}

body[data-campaign-theme="stormlight"] a,
body[data-campaign-theme="stormlight"] .markdown-body a {
  color: var(--campaign-link);
}

body[data-campaign-theme="stormlight"] a:hover,
body[data-campaign-theme="stormlight"] .markdown-body a:hover {
  color: var(--campaign-link-hover);
}

body[data-campaign-theme="stormlight"] nav#primary {
  background:
    linear-gradient(90deg, rgba(5, 13, 24, 0.88), rgba(16, 33, 52, 0.9), rgba(5, 13, 24, 0.88));
  border-top-color: var(--campaign-border);
  border-bottom-color: var(--campaign-border);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

body[data-campaign-theme="stormlight"] nav#primary ul.main-menu a::after,
body[data-campaign-theme="stormlight"] nav#primary ul.main-menu .nav-tool-button::after {
  background: linear-gradient(90deg, var(--campaign-link), var(--campaign-gold));
  box-shadow: 0 0 10px var(--campaign-glow);
}

body[data-campaign-theme="stormlight"] .main-menu .dropdown-menu,
body[data-campaign-theme="stormlight"] .site-search,
body[data-campaign-theme="stormlight"] .auth-panel,
body[data-campaign-theme="stormlight"] .markdown-panel,
body[data-campaign-theme="stormlight"] .metadata-list,
body[data-campaign-theme="stormlight"] .reader-toc,
body[data-campaign-theme="stormlight"] .campaign-card,
body[data-campaign-theme="stormlight"] .campaign-section-card,
body[data-campaign-theme="stormlight"] .focus-card,
body[data-campaign-theme="stormlight"] .battle-control-card,
body[data-campaign-theme="stormlight"] .battle-card,
body[data-campaign-theme="stormlight"] .prep-panel,
body[data-campaign-theme="stormlight"] .adventure-preview-block,
body[data-campaign-theme="stormlight"] .character-sheet-panel,
body[data-campaign-theme="stormlight"] .link-preview-popover {
  background:
    linear-gradient(180deg, rgba(30, 54, 76, 0.72), rgba(10, 22, 36, 0.84));
  border-color: var(--campaign-border);
  color: var(--campaign-text);
  box-shadow: 0 14px 32px rgba(1, 8, 16, 0.42), 0 0 22px rgba(133, 202, 245, 0.08);
}

body[data-campaign-theme="stormlight"] .campaign-card:hover,
body[data-campaign-theme="stormlight"] .campaign-section-card:hover,
body[data-campaign-theme="stormlight"] .focus-card:hover {
  border-color: var(--campaign-border-strong);
  box-shadow: 0 18px 34px rgba(1, 8, 16, 0.5), 0 0 24px var(--campaign-glow);
}

body[data-campaign-theme="stormlight"] .campaign-hero,
body[data-campaign-theme="stormlight"] .campaign-hero-fallback {
  border-bottom-color: var(--campaign-border);
  background:
    linear-gradient(180deg, rgba(183, 228, 255, 0.045), rgba(5, 12, 22, 0.26)),
    linear-gradient(135deg, rgba(26, 52, 76, 0.22), rgba(7, 14, 25, 0.34) 66%, rgba(32, 30, 69, 0.22));
}

body[data-campaign-theme="stormlight"] .campaign-hero img {
  filter: brightness(0.82) contrast(1.04);
}

body[data-campaign-theme="stormlight"] .buttonsubmit,
body[data-campaign-theme="stormlight"] button,
body[data-campaign-theme="stormlight"] .reader-actions a,
body[data-campaign-theme="stormlight"] .reader-actions button {
  border-color: rgba(216, 236, 255, 0.52);
  background: linear-gradient(180deg, rgba(47, 83, 112, 0.95), rgba(17, 35, 55, 0.98));
  color: #f7fbff;
  box-shadow: 0 4px 12px rgba(3, 10, 18, 0.34);
}

body[data-campaign-theme="stormlight"] .buttonsubmit:hover,
body[data-campaign-theme="stormlight"] button:hover,
body[data-campaign-theme="stormlight"] .reader-actions a:hover,
body[data-campaign-theme="stormlight"] .reader-actions button:hover {
  border-color: var(--campaign-gold);
  background: linear-gradient(180deg, rgba(79, 113, 145, 0.98), rgba(27, 51, 78, 0.98));
  color: #ffffff;
  box-shadow: 0 0 16px var(--campaign-glow);
}

body[data-campaign-theme="stormlight"] input,
body[data-campaign-theme="stormlight"] textarea,
body[data-campaign-theme="stormlight"] select {
  background: var(--campaign-bg-control);
  border-color: var(--campaign-border);
  color: var(--campaign-text);
}

body[data-campaign-theme="stormlight"] input:focus,
body[data-campaign-theme="stormlight"] textarea:focus,
body[data-campaign-theme="stormlight"] select:focus {
  border-color: var(--campaign-link);
  box-shadow: 0 0 12px var(--campaign-glow);
}

body[data-campaign-theme="stormlight"] .markdown-body h1,
body[data-campaign-theme="stormlight"] .markdown-body h2 {
  border-bottom-color: var(--campaign-border);
}

body[data-campaign-theme="stormlight"] .markdown-body h2 {
  color: #dcefff;
}

body[data-campaign-theme="stormlight"] .markdown-body h3::before {
  border-color: rgba(216, 236, 255, 0.78);
  background: rgba(155, 140, 255, 0.24);
  box-shadow: 0 0 10px rgba(183, 228, 255, 0.28);
}

body[data-campaign-theme="stormlight"] .markdown-body blockquote {
  border-left-color: var(--campaign-link);
  background: rgba(183, 228, 255, 0.08);
  color: var(--campaign-text);
}

body[data-campaign-theme="stormlight"] .markdown-body code,
body[data-campaign-theme="stormlight"] .markdown-body pre {
  border-color: var(--campaign-border);
  background: rgba(2, 9, 18, 0.52);
  color: #f0f8ff;
}

body[data-campaign-theme="stormlight"] table,
body[data-campaign-theme="stormlight"] .markdown-body table {
  border-color: var(--campaign-border);
}

body[data-campaign-theme="stormlight"] th,
body[data-campaign-theme="stormlight"] .markdown-body th {
  background: rgba(42, 73, 101, 0.72);
  color: var(--campaign-heading);
}

body[data-campaign-theme="stormlight"] td,
body[data-campaign-theme="stormlight"] .markdown-body td {
  border-color: rgba(176, 218, 246, 0.2);
}

body[data-campaign-theme="stormlight"] .flash-message {
  border-color: var(--campaign-border);
  background: rgba(21, 43, 64, 0.86);
  color: var(--campaign-text);
}

body[data-campaign-theme="stormlight"] footer {
  color: var(--campaign-text-muted);
}

body[data-campaign-theme="jtr"] {
  --campaign-bg-panel: rgba(19, 25, 24, 0.84);
  --campaign-bg-panel-soft: rgba(39, 48, 44, 0.64);
  --campaign-bg-control: rgba(236, 232, 215, 0.08);
  --campaign-border: rgba(177, 197, 205, 0.36);
  --campaign-border-strong: rgba(230, 232, 206, 0.62);
  --campaign-text: #ece8d7;
  --campaign-text-muted: #c9c2aa;
  --campaign-heading: #f5f0d8;
  --campaign-link: #cfe6f3;
  --campaign-link-hover: #fff4b5;
  --campaign-gold: #d6b661;
  --campaign-rune: #99b7c3;
  --campaign-ember: #d78b52;

  color: var(--campaign-text);
}

body[data-campaign-theme="jtr"]::before {
  background:
    radial-gradient(ellipse at 18% 6%, rgba(188, 207, 206, 0.1), transparent 30%),
    linear-gradient(140deg, rgba(185, 215, 226, 0.05), transparent 40%, rgba(214, 182, 97, 0.045) 72%, transparent 100%),
    rgba(0, 0, 0, 0.3);
}

body[data-campaign-theme="jtr"]::after {
  background:
    linear-gradient(to bottom, rgba(198, 216, 224, 0.04), rgba(0, 0, 0, 0.42)),
    radial-gradient(ellipse at center, transparent 0%, rgba(0, 0, 0, 0.54) 100%);
}

body[data-campaign-theme="jtr"] #inner-wrapper {
  background:
    linear-gradient(180deg, rgba(29, 37, 35, 0.84), rgba(9, 13, 13, 0.9));
  border-color: var(--campaign-border);
  color: var(--campaign-text);
  backdrop-filter: blur(3px);
  box-shadow:
    0 24px 54px rgba(0, 0, 0, 0.72),
    0 0 28px rgba(153, 183, 195, 0.09);
}

body[data-campaign-theme="jtr"] .content-shell {
  background:
    linear-gradient(180deg, rgba(34, 43, 37, 0.58), rgba(12, 17, 15, 0.72)),
    linear-gradient(135deg, rgba(153, 183, 195, 0.045), transparent 46%, rgba(215, 139, 82, 0.055));
}

body[data-campaign-theme="jtr"] .main-menu .dropdown-menu,
body[data-campaign-theme="jtr"] .site-search,
body[data-campaign-theme="jtr"] .auth-panel,
body[data-campaign-theme="jtr"] .markdown-panel,
body[data-campaign-theme="jtr"] .metadata-list,
body[data-campaign-theme="jtr"] .reader-toc,
body[data-campaign-theme="jtr"] .campaign-card,
body[data-campaign-theme="jtr"] .campaign-section-card,
body[data-campaign-theme="jtr"] .focus-card,
body[data-campaign-theme="jtr"] .battle-control-card,
body[data-campaign-theme="jtr"] .battle-card,
body[data-campaign-theme="jtr"] .prep-panel,
body[data-campaign-theme="jtr"] .adventure-preview-block,
body[data-campaign-theme="jtr"] .character-sheet-panel,
body[data-campaign-theme="jtr"] .link-preview-popover {
  background:
    linear-gradient(180deg, rgba(34, 43, 37, 0.78), rgba(12, 17, 15, 0.88));
  border-color: var(--campaign-border);
  color: var(--campaign-text);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(230, 232, 206, 0.04);
}

body[data-campaign-theme="jtr"] nav#primary {
  background:
    linear-gradient(90deg, rgba(6, 9, 9, 0.88), rgba(28, 36, 32, 0.9), rgba(6, 9, 9, 0.88));
  border-color: var(--campaign-border);
}

body[data-campaign-theme="jtr"] #top {
  background:
    linear-gradient(180deg, rgba(34, 42, 39, 0.72), rgba(10, 14, 14, 0.86));
  border-bottom: 1px solid var(--campaign-border);
}

body[data-campaign-theme="jtr"] h1,
body[data-campaign-theme="jtr"] h2,
body[data-campaign-theme="jtr"] h3,
body[data-campaign-theme="jtr"] .markdown-body h1,
body[data-campaign-theme="jtr"] .markdown-body h2,
body[data-campaign-theme="jtr"] .markdown-body h3,
body[data-campaign-theme="jtr"] .tavern-logo a {
  color: var(--campaign-heading);
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.82);
}

body[data-campaign-theme="jtr"] a,
body[data-campaign-theme="jtr"] .markdown-body a {
  color: var(--campaign-link);
}

body[data-campaign-theme="jtr"] a:hover,
body[data-campaign-theme="jtr"] .markdown-body a:hover {
  color: var(--campaign-link-hover);
}

body[data-campaign-theme="jtr"] .eyebrow,
body[data-campaign-theme="jtr"] .campaign-kicker,
body[data-campaign-theme="jtr"] .markdown-body li::marker {
  color: var(--campaign-gold);
}

body[data-campaign-theme="jtr"] nav#primary ul.main-menu a::after,
body[data-campaign-theme="jtr"] nav#primary ul.main-menu .nav-tool-button::after {
  background: linear-gradient(90deg, var(--campaign-rune), var(--campaign-gold), var(--campaign-ember));
}

body[data-campaign-theme="jtr"] .buttonsubmit,
body[data-campaign-theme="jtr"] button,
body[data-campaign-theme="jtr"] .reader-actions a,
body[data-campaign-theme="jtr"] .reader-actions button {
  border-color: rgba(214, 182, 97, 0.56);
  background: linear-gradient(180deg, rgba(70, 79, 73, 0.92), rgba(30, 36, 34, 0.96));
  color: #fff7d4;
}

body[data-campaign-theme="jtr"] .buttonsubmit:hover,
body[data-campaign-theme="jtr"] button:hover,
body[data-campaign-theme="jtr"] .reader-actions a:hover,
body[data-campaign-theme="jtr"] .reader-actions button:hover {
  border-color: var(--campaign-link);
  background: linear-gradient(180deg, rgba(82, 96, 97, 0.94), rgba(38, 45, 42, 0.96));
  color: #fff9da;
  box-shadow: 0 0 14px rgba(153, 183, 195, 0.18);
}

body[data-campaign-theme="jtr"] .campaign-hero,
body[data-campaign-theme="jtr"] .campaign-hero-fallback {
  border-bottom-color: var(--campaign-border);
  background:
    linear-gradient(180deg, rgba(153, 183, 195, 0.045), rgba(8, 11, 11, 0.36)),
    linear-gradient(135deg, rgba(38, 48, 45, 0.34), rgba(12, 15, 15, 0.48) 66%, rgba(92, 57, 34, 0.3));
}

body[data-campaign-theme="jtr"] input,
body[data-campaign-theme="jtr"] textarea,
body[data-campaign-theme="jtr"] select {
  background: var(--campaign-bg-control);
  border-color: var(--campaign-border);
  color: var(--campaign-text);
}

body[data-campaign-theme="jtr"] input:focus,
body[data-campaign-theme="jtr"] textarea:focus,
body[data-campaign-theme="jtr"] select:focus {
  border-color: var(--campaign-link);
  box-shadow: 0 0 12px rgba(153, 183, 195, 0.2);
}
