/**
 * Content table baseline.
 *
 * Ports the designed table look from the Drupal theme (Bootstrap `.table`:
 * comfortable cell padding, light horizontal row rules, no vertical grid,
 * bold header row) so tables editors create in the Classic editor land
 * style-correct with no per-table formatting. Loaded on BOTH the front end
 * and the TinyMCE editor canvas (add_editor_style) from one source, so the
 * authoring view matches the published page.
 *
 * Front end: scoped to the page-body container so it cannot touch The Events
 * Calendar month-view tables (.tribe-*) or other chrome. Imported tables that
 * carry their own inline background/border keep it (parity with live Drupal);
 * this only governs cell rhythm and row rules.
 *
 * Editor canvas: the TinyMCE iframe body is body.mce-content-body; the only
 * tables there are the ones the editor is building.
 */

.sfzc-page-content table:not([class*="tribe-"]),
body.mce-content-body table {
    width: 100%;
    margin: 0 0 1rem;
    border-collapse: collapse;
    background-color: transparent;
    /* GeneratePress ships `table, td, th { border: 1px solid rgba(0,0,0,.1) }`
       and `table { border-width: 1px 0 0 1px }`. Drupal has neither, so without
       these two resets an imported table whose inline style sets border-color or
       border-style but no width lands on GP's asymmetric frame - a hairline on
       top and left only. Reset to the CSS initials, which is what Drupal falls
       back to; inline styles still outrank both. Do not fold these into
       `border: 0` - a zero width erases the frame instead of restoring it. */
    border-style: none;
    border-width: medium;
}

.sfzc-page-content table:not([class*="tribe-"]) th,
.sfzc-page-content table:not([class*="tribe-"]) td,
body.mce-content-body table th,
body.mce-content-body table td {
    padding: 0.75rem;
    vertical-align: top;
    border: 0;
    border-top: 1px solid #dee2e6;
    text-align: left;
}

.sfzc-page-content table:not([class*="tribe-"]) thead th,
body.mce-content-body table thead th {
    vertical-align: bottom;
    border-top: 0;
    border-bottom: 2px solid #dee2e6;
}

.sfzc-page-content table:not([class*="tribe-"]) th,
body.mce-content-body table th {
    font-weight: 700;
}

/* Tables imported from Drupal carrying the legacy border="1" attribute. Drupal
   renders the browser's presentational grid there, because nothing in its CSS
   sets a cell border beyond the top rule. On WP that hint is outranked twice
   over - by GeneratePress's blanket border and by the `border: 0` cell reset
   above, which has to stay because it is what suppresses GP's grid on every
   other table. So reproduce the grid explicitly. Values are Drupal's computed
   output, not an approximation of it. */
.sfzc-page-content table[border="1"]:not([class*="tribe-"]),
body.mce-content-body table[border="1"] {
    border: 1px outset gray;
}

.sfzc-page-content table[border="1"]:not([class*="tribe-"]) th,
.sfzc-page-content table[border="1"]:not([class*="tribe-"]) td,
body.mce-content-body table[border="1"] th,
body.mce-content-body table[border="1"] td {
    border: 1px inset gray;
    border-top: 1px solid #dee2e6;
}

/* Below desktop width, a table wider than the column scrolls inside its own box
   instead of widening the page - fixed widths set in a table's own code included
   (trk-214 table row 1, WebOps 2026-09-25). These tables have no wrapper element
   (none of the 50 in page or practice-centre content), so the table itself becomes
   the scroll box. The second rule keeps short tables full width, which a block-level
   table otherwise loses; tables with a header row are left to the first rule so the
   header and body columns stay one grid. Page and practice-centre content only -
   event pages are left out, because their layout widens its own containers.
   Desktop, 1200 and up, is untouched. */
@media (max-width: 1199px) {
    .sfzc-page-content table:not([class*="tribe-"]) {
        display: block;
        max-width: 100%;
        overflow-x: auto;
    }
    .sfzc-page-content table:not([class*="tribe-"]):not(:has(> thead)) > tbody {
        display: table;
        width: 100%;
    }
}