/**
 * SofaScore Match Report — Post Styles
 *
 * Enqueued via wp_enqueue_style on single posts with _aiseo_ss_generated meta.
 * Previously inline <style> in post content, but WP Rocket "Remove Unused CSS"
 * was stripping it. External file is safe from RUCSS optimisation.
 *
 * @package AiSeoAutoPublish\SofaScore
 * @since   1.9.160
 */

/* ── Title centering ─────────────────────────── */
.single-post .entry-title,
.single-post .post-title,
.single-post .page-title {
  text-align: center !important;
}

/* alpha86 — Hide the theme's H1 on SS Reporter posts.
 * The article body already starts with its own scoreboard
 * <h2> ("Team A 3-12 Team B"), which is both shorter and
 * more informative than the WordPress page title ("科羅拉多
 * 洛磯 3-12 洛杉磯道奇｜MLB賽後戰報（2026-04-21）"). Having
 * both stacked vertically is duplicative and pushes the
 * score below the fold on mobile. */
body.aiseo-ss-reporter .entry-header .entry-title,
body.aiseo-ss-reporter header.entry-header h1,
body.aiseo-ss-reporter .post-title,
body.aiseo-ss-reporter h1.page-hero-title {
  display: none !important;
}

/* ── Report wrapper ──────────────────────────── */
.ss-report-wrap {
  max-width: 840px;
  margin: 0 auto;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* ── Card base ───────────────────────────────── */
.ss-report-card {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  padding: 24px 28px;
  margin-bottom: 22px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, .06);
}

.ss-report-card h3 {
  margin: 0 0 18px;
  font-size: 1.2em;
  color: #1f2937;
  border-bottom: 2px solid #f3f4f6;
  padding-bottom: 12px;
}

/* ── Header card (dark gradient) ─────────────── */
.ss-report-header.ss-report-card {
  background: linear-gradient(135deg, #0f172a 0%, #1e3a5f 50%, #1a5276 100%);
  color: #fff;
  text-align: center;
  padding: 36px 28px;
  border: none;
  box-shadow: 0 4px 20px rgba(15, 23, 42, .25);
}

.ss-report-header p {
  color: rgba(255, 255, 255, .75) !important;
  margin: 4px 0;
}

.ss-report-header h2 {
  color: #fff !important;
  text-shadow: 0 2px 8px rgba(0, 0, 0, .3);
  font-size: 2.2em !important;
  letter-spacing: .5px;
  margin: 18px 0 8px !important;
}

/* ── Tables ───────────────────────────────────── */
.ss-report-card table {
  width: 100%;
  border-collapse: collapse;
}

.ss-report-card th {
  padding: 10px 8px;
  font-weight: 600;
  font-size: .95em;
}

.ss-report-card td {
  padding: 8px;
  vertical-align: middle;
}

/* ── Collapsible details ─────────────────────── */
.ss-report-card details > summary {
  cursor: pointer;
  font-weight: 600;
  padding: 10px 0;
  color: #1a73e8;
  user-select: none;
}

.ss-report-card details > summary:hover {
  color: #1557b0;
}

.ss-report-card details[open] > summary {
  margin-bottom: 12px;
}

/* ── Lineups columns ─────────────────────────── */
.ss-report-lineup--home,
.ss-report-lineup--away {
  display: inline-block;
  vertical-align: top;
  width: 48%;
  min-width: 280px;
}

@media (max-width: 640px) {
  .ss-report-lineup--home,
  .ss-report-lineup--away {
    width: 100%;
  }
}

/* ── Stat bars ────────────────────────────────── */
.ss-stat-bar {
  height: 6px;
  border-radius: 3px;
  background: #e5e7eb;
  overflow: hidden;
  margin-top: 4px;
}

.ss-stat-fill-home {
  height: 100%;
  background: #1a73e8;
  border-radius: 3px;
  float: left;
}

.ss-stat-fill-away {
  height: 100%;
  background: #e53935;
  border-radius: 3px;
  float: right;
}


/* alpha79 — AI narrative + betting analysis blocks */

.aiseo-ss-narrative {
  background: linear-gradient(135deg, #fff7ed 0%, #fef3c7 100%);
  border-left: 5px solid #d97706;
  border-radius: 10px;
  padding: 22px 28px 18px;
  margin: 24px 0;
  line-height: 1.85;
  font-size: 1.05rem;
  color: #1f2937;
  box-shadow: 0 2px 10px -4px rgba(217, 119, 6, 0.2);
}
.aiseo-ss-narrative h3 {
  margin: 0 0 14px;
  font-size: 1.35rem;
  color: #92400e;
  font-weight: 800;
}
.aiseo-ss-narrative h4 {
  margin: 18px 0 8px;
  font-size: 1.1rem;
  color: #b45309;
  font-weight: 700;
  border: none;
  padding: 0;
}
.aiseo-ss-narrative h4:first-of-type { margin-top: 0; }
.aiseo-ss-narrative p {
  margin: 0 0 12px;
  color: #374151;
}

.aiseo-ss-betting {
  background: linear-gradient(135deg, #ecfdf5 0%, #f0fdf4 100%);
  border: 1px solid #86efac;
  border-left: 5px solid #059669;
  border-radius: 10px;
  padding: 22px 26px;
  margin: 24px 0;
  font-size: 1rem;
}
.aiseo-ss-betting h3 {
  margin: 0 0 8px;
  font-size: 1.35rem;
  color: #065f46;
  font-weight: 800;
}
.aiseo-ss-betting h4 {
  margin: 18px 0 8px;
  font-size: 1.05rem;
  color: #047857;
  font-weight: 700;
  border: none;
  padding: 0;
}
.aiseo-ss-betting__intro {
  color: #374151;
  font-size: .95rem;
  margin: 4px 0 16px;
  line-height: 1.6;
}
.aiseo-ss-betting__block {
  background: #fff;
  border-radius: 8px;
  padding: 14px 16px;
  margin-bottom: 14px;
  border: 1px solid #d1fae5;
}
.aiseo-ss-betting table {
  width: 100%;
  border-collapse: collapse;
  font-size: .95rem;
  margin: 6px 0 10px;
}
.aiseo-ss-betting th,
.aiseo-ss-betting td {
  text-align: left;
  padding: 8px 12px;
  border-bottom: 1px solid #e5e7eb;
}
.aiseo-ss-betting th {
  background: #f0fdf4;
  color: #065f46;
  font-weight: 700;
  font-size: .9rem;
}
.aiseo-ss-betting__hit td {
  background: #dcfce7;
  font-weight: 600;
}
.aiseo-ss-betting__verdict {
  margin: 6px 0 0;
  font-size: .95rem;
  color: #047857;
  font-weight: 500;
}
.aiseo-ss-betting__disclaimer {
  margin: 16px 0 0;
  padding: 10px 14px;
  background: #fef2f2;
  border-left: 3px solid #dc2626;
  color: #991b1b;
  font-size: .85rem;
  border-radius: 6px;
  line-height: 1.6;
}

/* alpha101 — Mobile enrichment for SS Reporter posts.
 * Previous mobile look felt thin (just paragraphs + small headings).
 * Add visual weight: bigger gold-accent section headings, navy
 * gradient backgrounds for narrative section, larger emoji icons,
 * tighter card boundaries. */
@media (max-width: 768px) {
    /* Larger gold-accent H3 section headings */
    .ss-report-card h3 {
        font-size: 1.35em;
        padding-left: 14px;
        border-left: 4px solid #fbbf24;
        line-height: 1.4;
        background: linear-gradient(90deg, rgba(251, 191, 36, .08), transparent 60%);
        padding-top: 8px;
        padding-bottom: 8px;
        margin: 24px -8px 18px;
        border-radius: 4px;
    }

    /* Narrative section (專家戰評) gets a navy-tinted bg + gold side stripe */
    .ss-report-narrative {
        background: linear-gradient(135deg, #f8fafc 0%, #fef9c3 100%) !important;
        border-left: 5px solid #fbbf24 !important;
        padding: 22px 20px !important;
        border-radius: 14px !important;
        box-shadow: 0 4px 16px rgba(10, 31, 68, .06);
        margin: 20px -4px;
    }

    /* Make h4 inside narrative pop more on mobile */
    .ss-report-narrative h4 {
        font-size: 1.1em !important;
        color: #92400e !important;
        font-weight: 800 !important;
        margin-top: 18px !important;
        padding-bottom: 6px;
        border-bottom: 1px dashed rgba(251, 191, 36, .4);
    }

    /* Ensure stat tables don't overflow */
    .ss-report-stats table {
        font-size: .9em;
        width: 100%;
    }
    .ss-report-stats {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Bigger card padding for tap-comfort */
    .ss-report-card {
        padding: 18px 16px;
    }
}

/* ── alpha88 — Post-footer breadcrumb + CTA ─── */
.aiseo-mr-postfooter {
  margin: 40px 0 24px;
  padding: 22px 26px;
  background: linear-gradient(135deg, #f8fafc 0%, #eff6ff 100%);
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  box-shadow: 0 2px 10px rgba(30, 58, 138, .05);
}

.aiseo-mr-postfooter-label {
  font-size: .78em;
  font-weight: 700;
  color: #6b7280;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 10px;
}

.aiseo-mr-postfooter-crumbs {
  font-size: .95em;
  color: #4b5563;
  line-height: 1.6;
  margin-bottom: 18px;
}

.aiseo-mr-postfooter-crumbs a {
  color: #2563eb;
  text-decoration: none;
  font-weight: 500;
}

.aiseo-mr-postfooter-crumbs a:hover {
  text-decoration: underline;
  color: #1e40af;
}

.aiseo-mr-postfooter-crumbs .sep {
  margin: 0 8px;
  color: #9ca3af;
}

.aiseo-mr-postfooter-cta-wrap {
  text-align: left;
}

.aiseo-mr-postfooter-cta {
  display: inline-block;
  padding: 12px 24px;
  background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%);
  color: #fff !important;
  text-decoration: none !important;
  border-radius: 10px;
  font-weight: 700;
  font-size: 1em;
  box-shadow: 0 4px 12px rgba(37, 99, 235, .28);
  transition: all .18s ease;
}

.aiseo-mr-postfooter-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(37, 99, 235, .38);
  color: #fff !important;
}

@media (max-width: 600px) {
  .aiseo-mr-postfooter {
    padding: 18px 20px;
    border-radius: 12px;
  }
  .aiseo-mr-postfooter-crumbs {
    font-size: .88em;
  }
  .aiseo-mr-postfooter-cta {
    display: block;
    text-align: center;
  }
}