/* New UI additions to the export's CSS. Copied to static/newsroom/ by build_static.py.
   Press release HTML brings its own images (fixed width attributes) and tables; keep them inside the text column. */
.ar-body img { max-width: 100%; height: auto; }
.ar-body table { display: block; max-width: 100%; overflow-x: auto; }
/* long unbroken URLs in release text (e.g. PR Newswire source links) wrap instead of widening the page */
.ar-body { overflow-wrap: break-word; }
.ar-body a { overflow-wrap: anywhere; }
/* weather icon before the temperature in the weather widgets (live weather, weather.py) */
.nw-data-icon { display: inline-block; width: 1em; height: 1em; vertical-align: -0.12em; margin-right: 0.3em; color: var(--ink-soft); }  /* .nw-icon is display: block */
/* hidden article picture (older than 25 h, db_articles.IMAGE_MAX_AGE): transparent placeholder, light site colour */
img[src$="/bild-platzhalter.png"] { background: color-mix(in srgb, var(--accent) 10%, var(--canvas)); }
/* daybreak: the category strips (5:1, made for short names) hold article headlines: at most two lines, the strip grows to fit */
.db-cats .nw-card-overlay .nw-card-thumb { position: absolute; inset: 0; aspect-ratio: auto !important; }
.db-cats .nw-card-overlay .nw-overlay { position: relative; min-height: 100%; }
.db-cats .nw-card-overlay { aspect-ratio: auto; min-height: 4.5em; }
.db-cats .nw-card-overlay .nw-card-title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
/* daybreak: the 21:8 hero is too low for a headline on phones */
@media (max-width: 760px) { .db-hero .nw-card-overlay .nw-card-thumb { aspect-ratio: 4 / 3 !important; } }

/* newsletter and comment forms (submitted locally, newsroom.js): send button and thank-you note */
.ar-comment-actions { display: flex; justify-content: flex-end; margin-top: var(--space-sm); }
.nw-form-thanks { margin: var(--space-sm) 0 0; }

/* guide article without subheadings: no contents column */
.ar-guide.no-toc { grid-template-columns: minmax(0, 1fr); }

/* frame-and-light hero: dark gradient under the white headline (the design's grey box is replaced by real photos);
   on phones a taller picture, so the headline and teaser fit inside it */
.fl-hero .nw-card-overlay::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(to top, rgba(0, 0, 0, .8) 0%, rgba(0, 0, 0, .45) 45%, rgba(0, 0, 0, 0) 80%); }
.fl-hero .nw-card-overlay .nw-overlay { z-index: 1; }
@media (max-width: 760px) {
  .fl-hero .nw-card-overlay .nw-card-thumb { aspect-ratio: 4 / 5 !important; }
  .fl-hero .nw-card-overlay .nw-overlay { width: auto; right: var(--space-lg); left: var(--space-lg); bottom: var(--space-lg); }
}
