/*
 * Core blocks inside an article's prose (new posts written in the block editor).
 * Only WordPress block classes are styled here; the article design itself is
 * marqira.css (.prose) and theme.css. Loaded on single posts by inc/47-blog.php.
 */

/* Block-library sets figure margins; inside prose the flow spacing comes from .prose > * + *. */
.prose
  :where(
    figure,
    .wp-block-image,
    .wp-block-table,
    .wp-block-embed,
    .wp-block-gallery,
    .wp-block-video,
    .wp-block-audio
  ) {
  margin-inline: 0;
  margin-block-end: 0;
}
.prose .wp-block-image :where(img, svg) {
  max-width: 100%;
  vertical-align: bottom;
}
.prose .wp-block-image.aligncenter,
.prose .wp-block-image .aligncenter {
  margin-inline: auto;
  text-align: center;
}
.prose .alignleft {
  float: left;
  margin: 0.35em 1.4em 0.6em 0;
}
.prose .alignright {
  float: right;
  margin: 0.35em 0 0.6em 1.4em;
}
.prose .wp-block-image.is-style-rounded img {
  border-radius: 1rem;
}

/* Tables: the same look as Markdown tables (no block-library box borders). */
.prose .wp-block-table {
  overflow: visible;
}
.prose .wp-block-table .table-wrap {
  overflow-x: auto;
}
.prose .wp-block-table :is(thead, tfoot) {
  border: 0;
}
.prose .wp-block-table :is(th, td) {
  border: 0;
  border-block-end: 1px solid var(--sp-line);
  padding: 0.65rem 0.8rem;
}
.prose .wp-block-table th {
  border-block-end-color: var(--sp-line-strong);
}
.prose .wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
  background: rgb(255 255 255 / 0.03);
}
.prose .wp-block-table table.has-fixed-layout {
  table-layout: fixed;
}

/* Quotes. */
.prose .wp-block-quote > :first-child {
  margin-block-start: 0;
}
.prose .wp-block-quote > * + * {
  margin-block-start: 0.7em;
}
.prose :is(.wp-block-quote, .wp-block-pullquote) cite {
  display: block;
  font-size: var(--step--1);
  font-style: normal;
  color: var(--ink-300);
}
.prose .wp-block-pullquote {
  margin-inline: 0;
  text-align: start;
  font-size: inherit;
  line-height: inherit;
}
.prose .wp-block-pullquote blockquote {
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
}
.prose .wp-block-pullquote p {
  font-size: var(--step-1);
  line-height: 1.5;
}

/* Lists from the List block use the design's bullets (marqira.css); nested lists keep spacing. */
.prose :is(ul, ol) :is(ul, ol) {
  margin-block-start: 0.45em;
}

/* Buttons. */
.prose .wp-block-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}
.prose .wp-block-buttons > .wp-block-button {
  margin: 0;
}
.prose .wp-block-button__link:hover,
.prose .wp-block-button__link:focus-visible {
  color: var(--ink-900);
  background: var(--white);
}
.prose .wp-block-button.is-style-outline .wp-block-button__link {
  border: 1px solid var(--sp-line-strong);
  background: transparent;
  color: var(--white);
}
.prose .wp-block-button.is-style-outline .wp-block-button__link:hover {
  border-color: var(--volt-400);
  color: var(--volt-400);
  background: transparent;
}

/* Embeds, code and details. */
.prose .wp-block-embed iframe {
  max-width: 100%;
  border-radius: var(--sp-r-s);
}
.prose .wp-block-code code {
  display: block;
  white-space: pre;
}
.prose .wp-block-details summary {
  color: var(--white);
  font-weight: var(--weight-strong);
  cursor: pointer;
}
.prose .wp-block-columns {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
}
.prose .wp-block-column {
  flex: 1 1 16rem;
  min-width: 0;
}
.prose .has-text-align-center {
  text-align: center;
}
.prose .has-text-align-right {
  text-align: end;
}