.post-content .post-text .glightbox-post,
.page-content .glightbox-post,
.landing-content .glightbox-post,
.cookies-warning .text .glightbox-post {
    cursor: zoom-in;
}

.post-content .post-text .post-image-grid,
.page-content .post-image-grid,
.landing-content .post-image-grid,
.cookies-warning .text .post-image-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0.75rem;
    margin: 1rem 0;
}

.post-content .post-text .post-image-grid-item,
.page-content .post-image-grid-item,
.landing-content .post-image-grid-item,
.cookies-warning .text .post-image-grid-item,
.post-content .post-text .post-image-grid-item > p,
.page-content .post-image-grid-item > p,
.landing-content .post-image-grid-item > p,
.cookies-warning .text .post-image-grid-item > p,
.post-content .post-text .post-image-grid-item > figure,
.page-content .post-image-grid-item > figure,
.landing-content .post-image-grid-item > figure,
.cookies-warning .text .post-image-grid-item > figure,
.post-content .post-text .post-image-grid-item > div,
.page-content .post-image-grid-item > div,
.landing-content .post-image-grid-item > div,
.cookies-warning .text .post-image-grid-item > div {
    margin: 0;
}

.post-content .post-text .post-image-grid-item img,
.page-content .post-image-grid-item img,
.landing-content .post-image-grid-item img,
.cookies-warning .text .post-image-grid-item img {
    width: 100% !important;
    height: auto !important;
}

.post-content .post-text .post-image-grid-item .glightbox-post,
.page-content .post-image-grid-item .glightbox-post,
.landing-content .post-image-grid-item .glightbox-post,
.cookies-warning .text .post-image-grid-item .glightbox-post {
    display: block;
}

@media (max-width: 767.98px) {
    .post-content .post-text .post-image-grid,
    .page-content .post-image-grid,
    .landing-content .post-image-grid,
    .cookies-warning .text .post-image-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.625rem;
    }
}

.post-content .post-text,
.page-content,
.landing-content,
.cookies-warning .text {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.post-content .post-text .text-left,
.page-content .text-left,
.landing-content .text-left,
.cookies-warning .text .text-left,
.post-content .post-text .align-left,
.page-content .align-left,
.landing-content .align-left,
.cookies-warning .text .align-left,
.post-content .post-text .ql-align-left,
.page-content .ql-align-left,
.landing-content .ql-align-left,
.cookies-warning .text .ql-align-left,
.post-content .post-text .alignleft,
.page-content .alignleft,
.landing-content .alignleft,
.cookies-warning .text .alignleft {
    text-align: left !important;
}

.post-content .post-text .text-center,
.page-content .text-center,
.landing-content .text-center,
.cookies-warning .text .text-center,
.post-content .post-text .align-center,
.page-content .align-center,
.landing-content .align-center,
.cookies-warning .text .align-center,
.post-content .post-text .ql-align-center,
.page-content .ql-align-center,
.landing-content .ql-align-center,
.cookies-warning .text .ql-align-center,
.post-content .post-text .aligncenter,
.page-content .aligncenter,
.landing-content .aligncenter,
.cookies-warning .text .aligncenter {
    text-align: center !important;
}

.post-content .post-text .text-right,
.page-content .text-right,
.landing-content .text-right,
.cookies-warning .text .text-right,
.post-content .post-text .align-right,
.page-content .align-right,
.landing-content .align-right,
.cookies-warning .text .align-right,
.post-content .post-text .ql-align-right,
.page-content .ql-align-right,
.landing-content .ql-align-right,
.cookies-warning .text .ql-align-right,
.post-content .post-text .alignright,
.page-content .alignright,
.landing-content .alignright,
.cookies-warning .text .alignright {
    text-align: right !important;
}

.post-content .post-text .text-justify,
.page-content .text-justify,
.landing-content .text-justify,
.cookies-warning .text .text-justify,
.post-content .post-text .align-justify,
.page-content .align-justify,
.landing-content .align-justify,
.cookies-warning .text .align-justify,
.post-content .post-text .ql-align-justify,
.page-content .ql-align-justify,
.landing-content .ql-align-justify,
.cookies-warning .text .ql-align-justify,
.post-content .post-text .alignjustify,
.page-content .alignjustify,
.landing-content .alignjustify,
.cookies-warning .text .alignjustify {
    text-align: justify !important;
}

.post-content .post-text figure.image,
.page-content figure.image,
.landing-content figure.image,
.cookies-warning .text figure.image {
    display: table;
    margin: 1rem auto;
    max-width: 100%;
}

.post-content .post-text figure.image figcaption,
.page-content figure.image figcaption,
.landing-content figure.image figcaption,
.cookies-warning .text figure.image figcaption {
    display: table-caption;
    caption-side: bottom;
    text-align: center;
    font-size: var(--f-size-13);
    opacity: 0.8;
    padding-top: 0.25rem;
}

.post-content .post-text figure.image.image-style-align-left,
.page-content figure.image.image-style-align-left,
.landing-content figure.image.image-style-align-left,
.cookies-warning .text figure.image.image-style-align-left {
    float: left;
    margin: 0.35rem 1rem 0.75rem 0;
}

.post-content .post-text figure.image.image-style-align-right,
.page-content figure.image.image-style-align-right,
.landing-content figure.image.image-style-align-right,
.cookies-warning .text figure.image.image-style-align-right {
    float: right;
    margin: 0.35rem 0 0.75rem 1rem;
}

.post-content .post-text figure.image.image-style-align-center,
.page-content figure.image.image-style-align-center,
.landing-content figure.image.image-style-align-center,
.cookies-warning .text figure.image.image-style-align-center {
    margin-left: auto;
    margin-right: auto;
}

.post-content .post-text img,
.page-content img,
.landing-content img,
.cookies-warning .text img {
    max-width: 100%;
    height: auto;
}

.post-content .post-text img.align-left,
.page-content img.align-left,
.landing-content img.align-left,
.cookies-warning .text img.align-left {
    float: left;
    margin: 0.35rem 1rem 0.75rem 0;
}

.post-content .post-text img.alignleft,
.page-content img.alignleft,
.landing-content img.alignleft,
.cookies-warning .text img.alignleft {
    float: left;
    margin: 0.35rem 1rem 0.75rem 0;
}

.post-content .post-text img.align-right,
.page-content img.align-right,
.landing-content img.align-right,
.cookies-warning .text img.align-right {
    float: right;
    margin: 0.35rem 0 0.75rem 1rem;
}

.post-content .post-text img.alignright,
.page-content img.alignright,
.landing-content img.alignright,
.cookies-warning .text img.alignright {
    float: right;
    margin: 0.35rem 0 0.75rem 1rem;
}

.post-content .post-text img.align-center,
.page-content img.align-center,
.landing-content img.align-center,
.cookies-warning .text img.align-center {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.post-content .post-text img.aligncenter,
.page-content img.aligncenter,
.landing-content img.aligncenter,
.cookies-warning .text img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.post-content .post-text figure.alignleft,
.page-content figure.alignleft,
.landing-content figure.alignleft,
.cookies-warning .text figure.alignleft {
    float: left;
    margin: 0.35rem 1rem 0.75rem 0;
}

.post-content .post-text figure.alignright,
.page-content figure.alignright,
.landing-content figure.alignright,
.cookies-warning .text figure.alignright {
    float: right;
    margin: 0.35rem 0 0.75rem 1rem;
}

.post-content .post-text figure.aligncenter,
.page-content figure.aligncenter,
.landing-content figure.aligncenter,
.cookies-warning .text figure.aligncenter {
    margin-left: auto;
    margin-right: auto;
}

.post-content .post-text p[style*="text-align"] img,
.page-content p[style*="text-align"] img,
.landing-content p[style*="text-align"] img,
.cookies-warning .text p[style*="text-align"] img {
    display: inline-block;
}

.post-content .post-text p[style*="text-align"] > .glightbox-post,
.page-content p[style*="text-align"] > .glightbox-post,
.landing-content p[style*="text-align"] > .glightbox-post,
.cookies-warning .text p[style*="text-align"] > .glightbox-post,
.post-content .post-text .text-center > .glightbox-post,
.page-content .text-center > .glightbox-post,
.landing-content .text-center > .glightbox-post,
.cookies-warning .text .text-center > .glightbox-post,
.post-content .post-text .aligncenter > .glightbox-post,
.page-content .aligncenter > .glightbox-post,
.landing-content .aligncenter > .glightbox-post,
.cookies-warning .text .aligncenter > .glightbox-post {
    display: inline-block;
}

.post-content .post-text p[style*="text-align: center"] img,
.page-content p[style*="text-align: center"] img,
.landing-content p[style*="text-align: center"] img,
.cookies-warning .text p[style*="text-align: center"] img {
    margin-left: auto;
    margin-right: auto;
}

.post-content .post-text > div[style*="overflow-x"],
.page-content > div[style*="overflow-x"],
.landing-content > div[style*="overflow-x"],
.cookies-warning .text > div[style*="overflow-x"] {
    margin: 1rem 0;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
}

/* === Rich content tables ============================================
   TinyMCE shows framed tables in the editor, but on the public side the
   old borders were near-invisible (#f2f2f2) with no header tint or row
   striping. Give article tables a clear, polished frame: visible borders,
   a tinted header row, zebra striping, hover feedback, a rounded outer
   frame and horizontal scrolling on narrow screens. Inline styles authored
   in the editor keep winning (higher specificity), so per-table overrides
   are preserved. */

/* Horizontal-scroll frame injected around each table by prepareArticleContent(). */
.post-content .post-text .post-table-wrap,
.page-content .post-table-wrap,
.landing-content .post-table-wrap,
.cookies-warning .text .post-table-wrap {
    margin: 1.5rem 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border: 0.063rem solid var(--classic-border, #d8dde5);
    border-radius: 0.5rem;
}

.post-content .post-text table,
.page-content table,
.landing-content table,
.cookies-warning .text table {
    border-collapse: collapse;
    width: 100%;
    min-width: max-content;
    max-width: none !important;
    table-layout: auto;
    margin: 1.5rem 0;
    font-size: var(--f-size-14);
    border: 0.063rem solid var(--classic-border, #d8dde5);
}

/* Inside the scroll frame the border lives on the wrapper, so the table
   itself drops it to avoid a doubled edge (selectors kept at the same
   specificity as the base table rule so the reset actually applies). */
.post-content .post-text .post-table-wrap > table,
.page-content .post-table-wrap > table,
.landing-content .post-table-wrap > table,
.cookies-warning .text .post-table-wrap > table {
    margin: 0;
    border: 0;
}

.post-content .post-text table th,
.page-content table th,
.landing-content table th,
.cookies-warning .text table th,
.post-content .post-text table td,
.page-content table td,
.landing-content table td,
.cookies-warning .text table td {
    padding: 0.625rem 0.875rem;
    border: 0.063rem solid var(--classic-border, #d8dde5);
    vertical-align: top;
}

.post-content .post-text table th,
.page-content table th,
.landing-content table th,
.cookies-warning .text table th {
    background-color: rgba(0, 0, 0, 0.04);
    font-weight: 700;
    text-align: left;
}

.post-content .post-text table tbody tr:nth-child(even),
.page-content table tbody tr:nth-child(even),
.landing-content table tbody tr:nth-child(even),
.cookies-warning .text table tbody tr:nth-child(even) {
    background-color: rgba(0, 0, 0, 0.022);
}

.post-content .post-text table tbody tr:hover,
.page-content table tbody tr:hover,
.landing-content table tbody tr:hover,
.cookies-warning .text table tbody tr:hover {
    background-color: rgba(0, 0, 0, 0.038);
}

.post-content .post-text table caption,
.page-content table caption,
.landing-content table caption,
.cookies-warning .text table caption {
    caption-side: bottom;
    padding: 0.5rem 0.25rem 0;
    font-size: var(--f-size-13);
    opacity: 0.75;
    text-align: center;
}

/* Dark mode: swap to the dark border token and lighten the tints. */
.dark-mode .post-content .post-text .post-table-wrap,
.dark-mode .page-content .post-table-wrap,
.dark-mode .landing-content .post-table-wrap,
.dark-mode .cookies-warning .text .post-table-wrap,
.dark-mode .post-content .post-text table,
.dark-mode .page-content table,
.dark-mode .landing-content table,
.dark-mode .cookies-warning .text table,
.dark-mode .post-content .post-text table th,
.dark-mode .page-content table th,
.dark-mode .landing-content table th,
.dark-mode .cookies-warning .text table th,
.dark-mode .post-content .post-text table td,
.dark-mode .page-content table td,
.dark-mode .landing-content table td,
.dark-mode .cookies-warning .text table td {
    border-color: var(--classic-border, #2d3746);
}

.dark-mode .post-content .post-text table th,
.dark-mode .page-content table th,
.dark-mode .landing-content table th,
.dark-mode .cookies-warning .text table th {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .post-content .post-text table tbody tr:nth-child(even),
.dark-mode .page-content table tbody tr:nth-child(even),
.dark-mode .landing-content table tbody tr:nth-child(even),
.dark-mode .cookies-warning .text table tbody tr:nth-child(even) {
    background-color: rgba(255, 255, 255, 0.03);
}

.dark-mode .post-content .post-text table tbody tr:hover,
.dark-mode .page-content table tbody tr:hover,
.dark-mode .landing-content table tbody tr:hover,
.dark-mode .cookies-warning .text table tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.06);
}

@media (max-width: 767.98px) {
    .post-content .post-text table th,
    .page-content table th,
    .landing-content table th,
    .cookies-warning .text table th,
    .post-content .post-text table td,
    .page-content table td,
    .landing-content table td,
    .cookies-warning .text table td {
        padding: 0.45rem 0.6rem;
        font-size: var(--f-size-13);
        line-height: 1.5;
    }
}
