/* ──────────────────────────────────────────────────────────
   Readable tables inside post / prose content (single blog post, etc.).

   The site runs a dark theme on a pre-built tailwind.min.css. The post
   template used inline prose-* utilities for tables, and two of them
   collided: prose-headings:text-white / prose-thead:text-emerald-dark set
   the header TEXT to the very same emerald-dark (#1a3325) used for the
   header BACKGROUND, so header cells rendered dark-on-dark and the text
   vanished.

   This file is now the single source of truth for table styling — the
   template delegates all table colours/layout here. Header contrast uses
   !important so a stale Tailwind build, a cached stylesheet, or an
   author-applied inline colour can never collapse the header text into
   its background again.
   ────────────────────────────────────────────────────────── */
.prose table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.75rem 0;
    background-color: #ffffff;
    color: #1a3325; /* emerald-dark */
    font-size: 0.95rem;
}

.prose table th,
.prose table td {
    padding: 0.75rem 1rem;
    border: 1px solid #d1d5db; /* gray-300 */
    text-align: left;
    vertical-align: top;
    line-height: 1.5;
}

/* Header cells — covers both <thead> cells and first-column row headers */
.prose table thead th,
.prose table thead td,
.prose table tbody th {
    background-color: #1a3325 !important; /* emerald-dark */
    color: #f5f0e8 !important;            /* cream — must always win so the header text stays readable */
    font-weight: 600;
}

/* If the editor's "Header section" is on but the header cells were left blank,
   collapse them so the table doesn't show an empty dark bar. Filled header
   cells are unaffected and stay visible (cream on emerald-dark). */
.prose table thead th:empty,
.prose table thead td:empty {
    background-color: transparent !important; /* override the header !important so blank cells still collapse */
    border: 0;
    padding: 0;
}

/* Data cells: light background, dark text */
.prose table tbody td {
    background-color: #ffffff;
    color: #1a3325;
}

/* Zebra striping for easier scanning */
.prose table tbody tr:nth-child(even) td {
    background-color: #f3f4f6; /* gray-100 */
}

/* Links inside table cells must stay readable on the light background */
.prose table a {
    color: #2d5a3d; /* emerald */
    text-decoration: underline;
}

/* Let wide tables scroll horizontally on small screens instead of overflowing */
@media (max-width: 640px) {
    .prose table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}