/*
 * VibeCMS Global Article Content Contract v1
 * Independent of any theme. Loaded on article detail pages only.
 * Goal: one readable H2 + table language across every supported theme.
 */

/* Article body targets used by current + legacy themes. */
body.article-page :is(
  .article-content-compact,
  .t26-article-body,
  .m26-article-body,
  .m26-media-body,
  .rn-article-body-v2,
  .wn-article-body-v2,
  .az-ce-article-body,
  .mag-article__body
) h2 {
  margin: 34px 0 12px !important;
  font-size: 28px !important;
  line-height: 1.2 !important;
  letter-spacing: -0.38px !important;
  font-weight: 700 !important;
  color: inherit;
}

/*
 * Responsive table language derived from the proven 2026Mobilitas visual
 * contract but implemented globally, so no theme depends on Mobilitas CSS.
 * Existing legacy wrappers and Mobilitas wrappers are supported; raw tables
 * remain horizontally scrollable without JavaScript.
 */
body.article-page :is(
  .article-content-compact,
  .t26-article-body,
  .m26-article-body,
  .m26-media-body,
  .rn-article-body-v2,
  .wn-article-body-v2,
  .az-ce-article-body,
  .mag-article__body
) :is(.table-responsive,.m26-table-scroll,.vcm-article-table-scroll) {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 24px 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  border: 1px solid #e1e4e8;
  border-radius: 7px;
  background: #fff;
  box-sizing: border-box;
}

body.article-page :is(
  .article-content-compact,
  .t26-article-body,
  .m26-article-body,
  .m26-media-body,
  .rn-article-body-v2,
  .wn-article-body-v2,
  .az-ce-article-body,
  .mag-article__body
) table {
  width: 100% !important;
  max-width: 100%;
  margin: 24px 0;
  border: 1px solid #e1e4e8;
  border-radius: 7px;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: #fff;
  color: #20242a;
  font-size: 15px;
  line-height: 1.45;
}

/* Tables already inside a scrolling shell use the shell border/margin. */
body.article-page :is(
  .article-content-compact,
  .t26-article-body,
  .m26-article-body,
  .m26-media-body,
  .rn-article-body-v2,
  .wn-article-body-v2,
  .az-ce-article-body,
  .mag-article__body
) :is(.table-responsive,.m26-table-scroll,.vcm-article-table-scroll) > table {
  min-width: 600px;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
}

/* Raw tables receive their own horizontal scrolling surface. */
body.article-page :is(
  .article-content-compact,
  .t26-article-body,
  .m26-article-body,
  .m26-media-body,
  .rn-article-body-v2,
  .wn-article-body-v2,
  .az-ce-article-body,
  .mag-article__body
) > table {
  display: block;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
}

body.article-page :is(
  .article-content-compact,
  .t26-article-body,
  .m26-article-body,
  .m26-media-body,
  .rn-article-body-v2,
  .wn-article-body-v2,
  .az-ce-article-body,
  .mag-article__body
) table th,
body.article-page :is(
  .article-content-compact,
  .t26-article-body,
  .m26-article-body,
  .m26-media-body,
  .rn-article-body-v2,
  .wn-article-body-v2,
  .az-ce-article-body,
  .mag-article__body
) table td {
  padding: 11px 13px !important;
  border: 0 !important;
  border-right: 1px solid #e6e8eb !important;
  border-bottom: 1px solid #e6e8eb !important;
  vertical-align: top;
  text-align: left;
  white-space: normal;
  overflow-wrap: anywhere;
}

body.article-page :is(
  .article-content-compact,
  .t26-article-body,
  .m26-article-body,
  .m26-media-body,
  .rn-article-body-v2,
  .wn-article-body-v2,
  .az-ce-article-body,
  .mag-article__body
) table thead th {
  background: #f4f5f7 !important;
  font-weight: 700 !important;
  color: #171a1f;
}

body.article-page :is(
  .article-content-compact,
  .t26-article-body,
  .m26-article-body,
  .m26-media-body,
  .rn-article-body-v2,
  .wn-article-body-v2,
  .az-ce-article-body,
  .mag-article__body
) table tbody tr:nth-child(even) > :is(td,th) {
  background: #fafbfc;
}

body.article-page :is(
  .article-content-compact,
  .t26-article-body,
  .m26-article-body,
  .m26-media-body,
  .rn-article-body-v2,
  .wn-article-body-v2,
  .az-ce-article-body,
  .mag-article__body
) table tr > :last-child {
  border-right: 0 !important;
}
body.article-page :is(
  .article-content-compact,
  .t26-article-body,
  .m26-article-body,
  .m26-media-body,
  .rn-article-body-v2,
  .wn-article-body-v2,
  .az-ce-article-body,
  .mag-article__body
) table tbody tr:last-child > * {
  border-bottom: 0 !important;
}

@media (max-width: 767px) {
  body.article-page :is(
    .article-content-compact,
    .t26-article-body,
    .m26-article-body,
    .m26-media-body,
    .rn-article-body-v2,
    .wn-article-body-v2,
    .az-ce-article-body,
    .mag-article__body
  ) h2 {
    margin-top: 28px !important;
    font-size: 24px !important;
    line-height: 1.18 !important;
    letter-spacing: -0.25px !important;
  }

  body.article-page :is(
    .article-content-compact,
    .t26-article-body,
    .m26-article-body,
    .m26-media-body,
    .rn-article-body-v2,
    .wn-article-body-v2,
    .az-ce-article-body,
    .mag-article__body
  ) :is(.table-responsive,.m26-table-scroll,.vcm-article-table-scroll) > table {
    min-width: 520px;
  }

  body.article-page :is(
    .article-content-compact,
    .t26-article-body,
    .m26-article-body,
    .m26-media-body,
    .rn-article-body-v2,
    .wn-article-body-v2,
    .az-ce-article-body,
    .mag-article__body
  ) table {
    font-size: 13.5px;
  }
  body.article-page :is(
    .article-content-compact,
    .t26-article-body,
    .m26-article-body,
    .m26-media-body,
    .rn-article-body-v2,
    .wn-article-body-v2,
    .az-ce-article-body,
    .mag-article__body
  ) table :is(th,td) {
    padding: 9px 10px !important;
  }
}
