/* =========================================================
   Match single (nfu_match_single)
   scope: .nfu-matchSingle
========================================================= */

.nfu-matchSingle {
  --nfu-primary: #1b2988;
  --nfu-secondary: #f4f6ff;
  --nfu-accent: #f2b705;
  --nfu-text: #0b102a;
  --nfu-border: #d7dbf0;

  --nfu-radius: 18px;
  --nfu-shadow: 0 18px 44px rgba(0, 0, 0, 0.18);
  margin-top: var(--wp--preset--spacing--60);
  padding-right: var(--wp--style--root--padding-right);
  padding-left: var(--wp--style--root--padding-left);
}

/* Heroは既存Topicsの .nfu-topic__hero を使う想定。
   Matchだけ微妙に雰囲気変えたいなら、この補助クラスで上書き。 */
.nfu-topic__hero--match {
  /* Topicsの雰囲気に寄せた暗めグラデ */
  background:
    radial-gradient(
      900px 360px at 18% 20%,
      rgba(27, 41, 136, 0.35),
      transparent 60%
    ),
    linear-gradient(
      180deg,
      rgba(11, 16, 42, 0.85) 0%,
      rgba(11, 16, 42, 0.92) 60%,
      rgba(11, 16, 42, 0.98) 100%
    );
  box-shadow: inset 0 -1px 0 rgba(27, 41, 136, 0.35);
}

.nfu-matchSingle__heroInner {
  background: radial-gradient(
    ellipse at 0% 40%,
    rgb(0 194 255 / 22%),
    rgba(6, 16, 42, 0) 40%
  );
}

/* -----------------------------
   Shell
------------------------------ */
.nfu-matchSingle__shell {
  padding: 40px 0 70px;
}

.nfu-matchSingle__shellInner {
  max-width: 1280px;
  margin: 0 auto;
}

/* -----------------------------
   Card
------------------------------ */
.nfu-matchSingleCard {
  background: #fff;
  border: 1px solid rgba(215, 219, 240, 0.95);
  border-radius: var(--nfu-radius);
  box-shadow: var(--nfu-shadow);
  overflow: hidden;
  padding: 50px;
}

/* chips（あなたのPHPに合わせる） */
.nfu-matchSingleCard__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  margin-bottom: 20px;
}

.nfu-matchSingleCard__chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.04em;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(27, 41, 136, 0.1);
  color: var(--nfu-primary);
  border: 1px solid rgba(27, 41, 136, 0.14);
}

/* meta */
.nfu-matchSingleCard__meta {
  display: grid;
  gap: 20px;
}

.nfu-matchSingleCard__date {
  margin: 0;
  line-height: 1.06;
  color: var(--nfu-text);
}

.nfu-matchSingleCard__dateMain {
  font-size: clamp(34px, 3.1vw, 48px);
  font-weight: 900;
  letter-spacing: 0.01em;
}

.nfu-matchSingleCard__dateSub {
  font-size: 14px;
  font-weight: 800;
  opacity: 0.72;
  margin-left: 10px;
}

/* kickoff / venue（福岡大の「小ラベル + 値」風） */
.nfu-matchSingleCard__kickoff,
.nfu-matchSingleCard__venue {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--nfu-text);
  font-size: 16px;
  font-weight: 600;
}

.nfu-matchSingleCard__kickLabel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 22px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.06em;
  color: var(--nfu-primary);
  background: rgba(27, 41, 136, 0.1);
  border: 1px solid rgba(27, 41, 136, 0.14);
}

.nfu-matchSingleCard__kickTime {
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.02em;
}

.nfu-matchSingleCard__pin {
  font-size: 14px;
  transform: translateY(-1px);
}

.nfu-matchSingleCard__venueText {
  font-size: 14px;
  font-weight: 800;
  opacity: 0.92;
}

.nfu-matchSingleCard__rule {
  height: 1px;
  background: rgba(215, 219, 240, 0.95);
  margin: 18px 0 22px;
}

/* -----------------------------
   Score（1枚目の見た目に戻す本丸）
------------------------------ */
.nfu-matchSingleCard__score {
  display: grid;
  grid-template-columns: 1fr 220px 1fr;
  align-items: center;
  gap: 18px;
  padding: 8px 0 6px;
}

.nfu-matchSingleCard__team {
  text-align: center;
}

.nfu-matchSingleCard__scoreNum {
  font-size: clamp(44px, 4.2vw, 68px);
  font-weight: 900;
  letter-spacing: 0.02em;
  color: var(--nfu-primary);
  line-height: 1;
}

.nfu-matchSingleCard__teamName {
  margin-top: 6px;
  font-size: 20px;
  font-weight: 900;
  color: var(--nfu-text);
  opacity: 0.92;
}

.nfu-matchSingleCard__scoreMid {
  text-align: center;
  display: grid;
  gap: 15px;
}

.nfu-matchSingleCard__halfLine {
  display: flex;
  justify-content: center;
  align-items: baseline;
  gap: 10px;
}

.nfu-matchSingleCard__halfLabel {
  font-size: 16px;
  font-weight: 900;
  color: rgba(11, 16, 42, 0.6);
}

.nfu-matchSingleCard__halfScore {
  font-size: 16px;
  font-weight: 900;
  color: var(--nfu-text);
}

/* -----------------------------
   Breakdown table（あなたのHTML：.nfu-matchBreakdown を直でスタイル）
------------------------------ */
.nfu-matchSingleCard__table {
  margin-top: 20px;
}

.nfu-matchBreakdown {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid rgba(215, 219, 240, 0.95);
  border-radius: 12px;
  overflow: hidden;
}

/* ===== 追加：前後半テーブル用（既存デザインを崩さず微調整） ===== */
.nfu-matchBreakdown--half {
  table-layout: fixed;
}

/* 5列になるので、中央ラベル列を少し絞る（見た目が福岡大寄りになる） */
.nfu-matchBreakdown--half .nfu-matchBreakdown__th--label,
.nfu-matchBreakdown--half .nfu-matchBreakdown__td--label {
  width: 18%;
}

/* 前半/後半ヘッダーは少しだけ控えめに（既存の見た目に寄せる） */
.nfu-matchBreakdown__th--half {
  font-size: 12px;
  letter-spacing: 0.06em;
}

.nfu-matchBreakdown__th,
.nfu-matchBreakdown__td {
  padding: 12px 14px;
  border-top: 1px solid rgba(215, 219, 240, 0.95);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.3;
  text-align: center;
}

.nfu-matchBreakdown thead .nfu-matchBreakdown__th {
  background: rgba(244, 246, 255, 0.85);
  font-weight: 900;
  color: var(--nfu-text);
}

.nfu-matchBreakdown__td--label {
  font-weight: 900;
  color: rgba(11, 16, 42, 0.72);
  letter-spacing: 0.06em;
}

.nfu-matchBreakdown__rowTotal .nfu-matchBreakdown__td {
  background: rgba(244, 246, 255, 0.55);
  font-weight: 900;
}

.nfu-matchBreakdown__note {
  display: flex;
  justify-content: end;
  margin: 15px 0 0;
  font-size: 12px;
  font-weight: 800;
  color: rgba(11, 16, 42, 0.65);
}

/* -----------------------------
   After (memo + button)
------------------------------ */
.nfu-matchSingleCard__after {
  margin-top: 25px;
  padding-top: 18px;
  border-top: 1px solid rgba(215, 219, 240, 0.95);
  display: grid;
  gap: 18px;
}

.nfu-matchSingleCard__noteTitle {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.06em;
  color: rgba(11, 16, 42, 0.65);
}

.nfu-matchSingleCard__noteBody {
  font-size: 13px;
  font-weight: 700;
  color: rgba(11, 16, 42, 0.86);
  line-height: 1.8;
}

.nfu-matchSingleCard__actions {
  display: flex;
  justify-content: flex-start;
}

.nfu-matchSingleCard__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 18px;
  border-radius: 999px;
  background: var(--nfu-primary);
  color: #fff;
  font-weight: 900;
  font-size: 13px;
  text-decoration: none;
  box-shadow: 0 10px 22px rgba(27, 41, 136, 0.22);
  transition:
    border-color 0.18s ease,
    background 0.18s ease,
    transform 0.18s ease;
}

.nfu-matchSingleCard__btn:hover {
  background: var(--nfu-primary);
  border-color: var(--nfu-primary);
  transform: translateY(-1px);
}

.nfu-matchSingleCard__actions br {
  display: none;
}

/* -----------------------------
   Responsive
------------------------------ */
@media (max-width: 1024px) {
  .nfu-matchSingleCard {
    padding: 38px 32px 26px;
  }

  .nfu-matchSingleCard__score {
    grid-template-columns: 1fr 200px 1fr;
  }
}

@media (max-width: 768px) {
  .nfu-matchSingle__shell {
    padding: 40px 0 56px;
  }

  .nfu-matchSingleCard {
    max-width: 100%;
    padding: 30px 18px 22px;
    border-radius: 16px;
  }

  .nfu-matchSingleCard__score {
    grid-template-columns: 1fr 150px 1fr;
    gap: 12px;
  }

  .nfu-matchSingleCard__scoreMid {
    order: 0;
  }
}

@media (max-width: 425px) {
  .nfu-matchSingleCard__dateMain {
    font-size: 32px;
  }

  .nfu-matchBreakdown__th,
  .nfu-matchBreakdown__td {
    padding: 10px 10px;
    font-size: 12px;
  }

  .nfu-matchSingleCard__scoreNum {
    font-size: 30px;
  }

  .nfu-matchSingleCard__teamName {
    font-size: 14px;
  }

  .nfu-matchSingleCard__halfLabel,
  .nfu-matchSingleCard__halfScore {
    font-size: 14px;
  }
}