/* Navy theme for the web tools so they match the homepage, the shared header and the iOS app.
   Each tool page sets <body data-tool="…"> and links this file after its own CSS. */

/* ── College Coach Emailer ── */
body[data-tool="emailer"] {
  --bg: #011432; --bg2: #0d2552; --bg3: #071d45; --stone: #071d45;
  --border: rgba(255, 255, 255, .12); --border2: rgba(255, 255, 255, .22);
  --text: #f5f7fa; --muted: #b0bcd2; --muted2: #c9d4e8; --slate: #c9d4e8; --sky: #b0bcd2;
  --accent: #fd5b02; --accent2: #ff7a2e; --orng: #fd5b02; --blue: #8fb3ff; --green: #34c47c; --red: #ff7b7b;
  background: #011432; color: #f5f7fa; color-scheme: dark;
}
body[data-tool="emailer"] input, body[data-tool="emailer"] select, body[data-tool="emailer"] textarea {
  background: #061a3e; color: #f5f7fa; border-color: rgba(255, 255, 255, .2);
}
body[data-tool="emailer"] ::placeholder { color: #7f8fae; }
body[data-tool="emailer"] .pitch { background: linear-gradient(135deg, #12306a, #0d2552); border: 1px solid rgba(253, 91, 2, .45); }

/* ── College Coach Directory ── */
body[data-tool="directory"] {
  --ink: #f5f7fa; --muted: #b0bcd2; --rule: rgba(255, 255, 255, .12); --cream: #0d2552;
  background: #011432; color: #f5f7fa; color-scheme: dark;
  font-family: 'DM Sans', system-ui, -apple-system, sans-serif;
}
body[data-tool="directory"] main, body[data-tool="directory"] > .wrap { padding-top: 24px; padding-bottom: 32px; }
body[data-tool="directory"] h1 { font-weight: 900; letter-spacing: -.03em; }
body[data-tool="directory"] h2 { font-weight: 800; letter-spacing: -.01em; }
body[data-tool="directory"] .price, body[data-tool="directory"] .stats b { color: #fff; }
body[data-tool="directory"] .stats { border-radius: 16px; overflow: hidden; }
body[data-tool="directory"] .stats div { padding: 18px; }
body[data-tool="directory"] .buy { border-radius: 999px; box-shadow: 0 10px 30px rgba(253, 91, 2, .3); transition: background .15s, transform .15s; }
body[data-tool="directory"] .buy:hover { background: #ff7a2e; transform: translateY(-1px); }
body[data-tool="directory"] main a:not(.buy) { color: #ff7a2e; }
body[data-tool="directory"] li::marker { color: #fd5b02; }

/* ── Play Diagrammer ── */
body[data-tool="diagram"] {
  --bg-a: #011432; --bg-b: #011432; --panel: #0d2552; --card: #071d45;
  --border: rgba(255, 255, 255, .12); --ink: #f5f7fa; --muted: #b0bcd2; --accent: #fd5b02; --danger: #ff7b7b;
  color-scheme: dark; background: #011432; color: #f5f7fa;
}
body[data-tool="diagram"] input, body[data-tool="diagram"] select, body[data-tool="diagram"] textarea {
  background: #061a3e; color: #f5f7fa; border-color: rgba(255, 255, 255, .2);
}
body[data-tool="diagram"] ::placeholder { color: #7f8fae; }

/* ── Film Room (its base theme is dark; recolor it to the brand navy) ── */
body[data-tool="filmroom"] {
  --bg: #011432; --surface: #0d2552; --surface2: #12306a; --line: rgba(255, 255, 255, .12);
  --text: #f5f7fa; --muted: #b0bcd2; --orange: #fd5b02;
  background: #011432; color: #f5f7fa;
}
body[data-tool="filmroom"] .topbar { min-height: 64px; padding: 14px 3.4%; background: #071d45; }
body[data-tool="filmroom"] .button { background: #12306a; border-color: rgba(255, 255, 255, .2); }
body[data-tool="filmroom"] .button:hover { background: #1a3d80; }
body[data-tool="filmroom"] .button.quiet, body[data-tool="filmroom"] .quiet { background: transparent; }
body[data-tool="filmroom"] .button.primary, body[data-tool="filmroom"] .primary { background: #fd5b02; border-color: #fd5b02; color: #fff; }
body[data-tool="filmroom"] input, body[data-tool="filmroom"] select, body[data-tool="filmroom"] textarea { background: #061a3e; }
body[data-tool="filmroom"] th { background: #071d45; }
body[data-tool="filmroom"] .event-button { background: #12306a; border-color: rgba(255, 255, 255, .16); }
body[data-tool="filmroom"] .screen { background: #000a1c; }
body[data-tool="filmroom"] h1 { font: 900 clamp(32px, 4vw, 46px)/1.1 'DM Sans', system-ui, sans-serif; letter-spacing: -.03em; text-transform: none; }
body[data-tool="filmroom"] .video-empty h2, body[data-tool="filmroom"] .stat-box strong { font-family: 'DM Sans', system-ui, sans-serif; font-weight: 800; }
body[data-tool="filmroom"] .cloudbar { background: #071d45; border: 1px solid rgba(255, 255, 255, .12); border-radius: 12px; }
body[data-tool="filmroom"] dialog { background: #0d2552; }
body[data-tool="diagram"] button, body[data-tool="diagram"] select, body[data-tool="diagram"] .file-button {
  background: #12306a; color: #f5f7fa; border-color: rgba(255, 255, 255, .16);
}
body[data-tool="diagram"] button:hover, body[data-tool="diagram"] .file-button:hover { border-color: rgba(255, 255, 255, .45); }
body[data-tool="diagram"] button:disabled { opacity: .45; }
body[data-tool="diagram"] button.active, body[data-tool="diagram"] button.selected,
body[data-tool="diagram"] [data-command="play"], body[data-tool="diagram"] .primary-button { background: #fd5b02; border-color: #fd5b02; color: #fff; }
body[data-tool="diagram"] [data-command="record"], body[data-tool="diagram"] .download-button { background: transparent; border-color: #fd5b02; color: #ff7a2e; }
body[data-tool="diagram"] .frame-card textarea { background: #061a3e; color: #f5f7fa; }
body[data-tool="diagram"] dialog { background: #0d2552 !important; color: #f5f7fa; }
body[data-tool="diagram"] .frame-top button { background: #12306a; }
body[data-tool="diagram"] .controls-panel { border-color: rgba(255, 255, 255, .12); }

/* ── Schedules ── */
body[data-tool="schedules"] {
  --ink: #f5f7fa; --muted: #b0bcd2; --rule: rgba(255, 255, 255, .12); --cream: #011432; --win: #34c47c;
  background: #011432; color: #f5f7fa; color-scheme: dark;
  font-family: 'DM Sans', system-ui, -apple-system, sans-serif;
}
body[data-tool="schedules"] .top { background: #071d45; box-shadow: none; border-bottom: 1px solid rgba(255, 255, 255, .1); }
body[data-tool="schedules"] .game, body[data-tool="schedules"] .empty, body[data-tool="schedules"] .table,
body[data-tool="schedules"] .promo { background: #0d2552; border-color: rgba(255, 255, 255, .1); }
body[data-tool="schedules"] .game { border-radius: 14px; }
body[data-tool="schedules"] .filters input, body[data-tool="schedules"] .filters select { background: #061a3e; color: #f5f7fa; border-color: rgba(255, 255, 255, .2); }
body[data-tool="schedules"] .follow { background: transparent; }
body[data-tool="schedules"] .follow.on { background: #fd5b02; color: #fff; }
body[data-tool="schedules"] main a:not(.follow):not(.getapp):not(.tname), body[data-tool="schedules"] .link { color: #ff7a2e; }
body[data-tool="schedules"] .logo { background: #fff; }
body[data-tool="schedules"] .logo.blank { color: #011432; }
body[data-tool="schedules"] th { background: #071d45; color: #b0bcd2; }
body[data-tool="schedules"] tr, body[data-tool="schedules"] td { border-color: rgba(255, 255, 255, .08); }
body[data-tool="schedules"] a.tname { color: #f5f7fa; }
body[data-tool="schedules"] a.tname:hover { color: #ff7a2e; }
