/* 快步云杯 / FLYING CUP brand theme v1.3. Shared production override for /tools pages. */
:root {
  --fc-navy: #173d66;
  --fc-navy-2: #285888;
  --fc-blue: #285888;
  --fc-blue-soft: rgba(40, 88, 136, 0.11);
  --fc-gold: #e8b848;
  --fc-orange: #e8b848;
  --fc-orange-soft: rgba(232, 184, 72, 0.16);
  --fc-paper: #f3f5f8;
  --fc-surface: #ffffff;
  --fc-line: #d8e0ea;
  --fc-text: #101b30;
  --fc-muted: #5f6e86;

  --bg-deep: var(--fc-paper);
  --bg-surface: var(--fc-surface);
  --bg-raised: #eef4fa;
  --text-main: var(--fc-text);
  --text-mid: #3a4a66;
  --text-mute: var(--fc-muted);
  --text-low: #9badbe;
  --border: #e0e7ef;
  --border-mid: #c7d6e6;
  --rule: #e9eef4;
  --acc-go: var(--fc-orange);
  --acc-go-soft: var(--fc-orange-soft);
  --acc-live: var(--fc-blue);
  --info-blue: var(--fc-blue);
  --info-blue-soft: var(--fc-blue-soft);
  --shadow-card: 0 10px 28px rgba(2, 10, 29, 0.07);
}

html,
body {
  background: var(--fc-paper) !important;
  color: var(--fc-text) !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: 1;
  border-top: 5px solid var(--fc-gold);
  background: transparent;
  z-index: -1;
}

header.app-bar,
.tools-bar {
  background: rgba(255, 255, 255, 0.92) !important;
  border-bottom: 1px solid var(--fc-line) !important;
  box-shadow: 0 8px 24px rgba(17, 54, 94, 0.06);
}

.app-bar-inner,
.tools-bar {
  min-height: 58px;
}

.brand-mark {
  min-width: 150px;
  padding-left: 18px !important;
  border-left-color: var(--fc-line) !important;
}

.brand-mark::before {
  content: "快步云杯";
  display: block;
  width: auto;
  height: auto;
  color: var(--fc-navy);
  font-size: 17px;
  font-weight: 850;
  letter-spacing: -0.02em;
  line-height: 1.05;
}

.brand-mark::after {
  content: "FLYING CUP";
  display: block;
  margin-top: 4px;
  color: var(--fc-blue);
  font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.18em;
  line-height: 1;
}

.brand-mark .glyph,
.brand-mark .sub {
  display: none !important;
}

.tools-bar .glyph {
  color: var(--fc-navy) !important;
}

.tools-bar .glyph em,
.brand-mark .glyph em,
nav.primary a.active,
.sub-nav a.active {
  color: var(--fc-orange) !important;
}

nav.primary a,
.sub-nav a,
.tools-bar nav a {
  color: var(--fc-muted) !important;
}

nav.primary a:hover,
.sub-nav a:hover,
.tools-bar nav a:hover {
  background: #edf4fb !important;
  color: var(--fc-navy) !important;
}

nav.primary a.active,
.sub-nav a.active,
.tools-bar nav a.active {
  background: var(--fc-orange-soft) !important;
  color: var(--fc-navy) !important;
  box-shadow: inset 3px 0 0 var(--fc-orange);
}

.live-pill .dot,
.tools-bar .dot {
  background: var(--fc-orange) !important;
  box-shadow: 0 0 0 4px rgba(244, 160, 31, 0.15), 0 0 16px rgba(244, 160, 31, 0.38) !important;
}

.live-pill .live,
.tools-bar .live-l {
  color: var(--fc-blue) !important;
}

.user-pill,
.live-pill,
.tools-bar .live,
.tools-bar .back-link {
  color: var(--fc-muted) !important;
}

.btn {
  border-radius: 6px !important;
  border-color: #c7d6e6 !important;
  color: var(--fc-navy) !important;
  background: #fff !important;
}

.btn:hover {
  border-color: var(--fc-blue) !important;
  color: var(--fc-navy) !important;
  background: #edf4fb !important;
}

.btn.primary,
.btn.success,
button.primary,
button[type="submit"] {
  border-color: var(--fc-orange) !important;
  background: var(--fc-gold) !important;
  color: #13233a !important;
  font-weight: 700;
}

.section,
.panel,
.card,
.summary-card,
.stat-card,
.metric,
.team-card,
.tournament-header,
.milestone-card,
.kpi,
.toolbar,
.table-wrap,
.modal,
.login-card {
  background: #fff !important;
  border-color: var(--fc-line) !important;
  color: var(--fc-text) !important;
  box-shadow: var(--shadow-card);
}

.tournament-header,
.section,
.panel,
.card,
.milestone-card,
.summary-card,
.stat-card,
.metric,
.team-card {
  border-radius: 8px !important;
}

.tournament-header,
.section h3,
.phase-section h3 {
  border-color: rgba(47, 118, 168, 0.18) !important;
}

.tournament-header {
  border-left: 5px solid var(--fc-orange) !important;
}

.section h3::before,
.phase-section h3::before,
.login-card .pretitle::before,
.tools-bar nav a.active::before,
nav.primary a.active::before {
  color: var(--fc-orange) !important;
}

input:not([type]),
input[type="text"],
input[type="password"],
input[type="number"],
input[type="date"],
input[type="time"],
input[type="file"],
select,
textarea,
.input {
  background: #fff !important;
  color: var(--fc-text) !important;
  border-color: #c8d6e5 !important;
  border-radius: 6px !important;
}

input:focus,
select:focus,
textarea:focus,
.input:focus {
  border-color: var(--fc-blue) !important;
  box-shadow: 0 0 0 3px rgba(47, 118, 168, 0.14) !important;
}

input::placeholder,
textarea::placeholder {
  color: #8da0b3 !important;
}

table,
thead,
tbody,
tr,
td,
th {
  color: var(--fc-text);
}

thead th,
.age-group-table th,
table.budget-grid th {
  background: #eef4fa !important;
  color: var(--fc-muted) !important;
}

td,
.age-group-table td,
table.budget-grid td {
  color: var(--fc-text) !important;
  border-color: #e5edf5 !important;
}

.status-badge,
.pill,
.tag,
.badge,
.size-tag,
.deadline-tag {
  border-radius: 4px !important;
}

.status-badge.status-recruiting,
.deadline-tag.imminent,
.summary-card.partial {
  background: var(--fc-orange-soft) !important;
  color: #9c5b00 !important;
  border-color: rgba(244, 160, 31, 0.35) !important;
}

.status-badge.status-in_progress,
.deadline-tag.upcoming,
.summary-card.aggregate {
  background: var(--fc-blue-soft) !important;
  color: var(--fc-navy-2) !important;
  border-color: rgba(47, 118, 168, 0.28) !important;
}

#loginPage {
  background: var(--fc-paper) !important;
}

#loginPage::before {
  opacity: 0.45 !important;
  background-image:
    linear-gradient(rgba(17, 54, 94, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(17, 54, 94, 0.05) 1px, transparent 1px) !important;
}

.login-card::after {
  content: "快步云杯  ·  FLYING CUP";
  display: block;
  height: auto;
  margin-top: 22px;
  color: var(--fc-blue);
  font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.14em;
}

.login-card::before {
  background: var(--fc-blue) !important;
  border-right: 72px solid var(--fc-gold);
}

.login-card h1,
h1,
h2,
h3 {
  color: var(--fc-navy) !important;
}

.version-tag,
#toast {
  color: var(--fc-muted) !important;
}

@media (max-width: 880px) {
  body.menu-open nav.primary {
    background: #fff !important;
    border-color: var(--fc-line) !important;
    box-shadow: 0 18px 38px rgba(17, 54, 94, 0.10);
  }
  .brand-mark::before {
    width: 110px;
  }
}

@media (max-width: 540px) {
  .app-bar-inner {
    gap: 10px !important;
    justify-content: space-between;
  }
  .live-pill .sep,
  .live-pill .date {
    display: none !important;
  }
  .brand-mark {
    min-width: 118px;
    margin-left: 0 !important;
    padding-left: 10px !important;
  }
  .brand-mark::before {
    width: 102px;
    height: 34px;
  }
  .user-pill,
  .version-tag {
    display: none !important;
  }
}

html[data-brand="flying-cup"] a.more {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

html[data-brand="flying-cup"] nav.primary a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

/* Scheduler is a standalone React tool with inline styles. Keep its mobile layout
   aligned with the shared Flying Cup tools theme. */
@media (max-width: 640px) {
  #root > div > div:nth-child(2) {
    flex-direction: column !important;
  }
  #root > div > div:nth-child(2) > div:first-child {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    display: flex !important;
    overflow-x: auto !important;
    border-right: 0 !important;
    border-bottom: 1px solid var(--fc-line) !important;
    background: #fff !important;
    padding: 0 10px !important;
  }
  #root > div > div:nth-child(2) > div:first-child > div {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: max-content !important;
    border-left: 0 !important;
    border-bottom: 3px solid transparent !important;
    padding: 12px 14px !important;
  }
  #root > div > div:nth-child(2) > div:first-child > div:first-child {
    border-bottom-color: var(--fc-orange) !important;
  }
  #root > div > div:nth-child(2) > div:nth-child(2) {
    width: 100% !important;
    max-width: 100% !important;
    padding: 20px 16px 32px !important;
  }
  #root > div > div:first-child {
    flex-wrap: wrap !important;
    gap: 10px !important;
    padding: 12px 16px !important;
  }
}

/* ============================================================
   UI polish (make-interfaces-feel-better) — 2026-06-27
   全套 /tools 页共享（17 页引用本主题）。纯追加视觉细节，不改任何布局/逻辑。
   ============================================================ */
/* #8 字体平滑：macOS 文字更清晰锐利 */
html { -moz-osx-font-smoothing: grayscale; }
/* #12 按压触感：所有 .btn 按下回弹 scale 0.96（各页按钮原本无任何 :active 反馈）。
   transition 含 transform/scale 才能可中断；!important 统一覆盖各页 inline .btn transition。 */
.btn {
  transition: border-color .14s, background .14s, color .14s, box-shadow .14s, transform .14s, scale .12s !important;
}
.btn:active:not(:disabled) { scale: 0.96; }
/* #10 文本换行：标题均衡、提示/正文避免行尾孤字 */
h1, h2, h3 { text-wrap: balance; }
.field-hint, .modal-sub, .empty-state, .login-card .lead { text-wrap: pretty; }

/* 流失客户跟进属于快步云体育母品牌；保留工具业务布局，只切换品牌壳。 */
html[data-brand="kby-sports"] {
  --fc-navy: #06132f;
  --fc-navy-2: #084868;
  --fc-blue: #084868;
  --fc-blue-soft: rgba(8, 72, 104, 0.10);
  --fc-gold: #e8a838;
  --fc-orange: #e8a838;
  --fc-orange-soft: rgba(232, 168, 56, 0.15);
  --fc-paper: #f3f5f8;
  --fc-text: #101b30;
  --fc-muted: #5f6e86;
}

html[data-brand="kby-sports"] body::before {
  border-top-color: #78b8e8;
}

html[data-brand="kby-sports"] .kby-suite-bar {
  border-bottom-color: #084868 !important;
}

@media (max-width: 720px) {
  html[data-brand="kby-sports"] .kby-suite-bar {
    margin-inline: -12px !important;
  }
}