@charset "UTF-8";

/* Post Layout */
.p-post-body > * {
  --block-margin: 1.2em;

  margin: var(--block-margin, 0) 0;
}
.p-post-body :not(figure) a:not(.c-link-card) {
  text-decoration-line: underline;
  text-decoration-style: dashed;
  text-decoration-color: var(--color-theme-primary-500);
  text-underline-offset: 6px;
}
.p-post-body :not(figure) a:not(.c-link-card)[target="_blank"]::after {
  content: "";
  transform: translateY(3px);
  display: inline-block;
  width: 0.8em;
  aspect-ratio: 1;
  margin-left: 5px;
  color: var(--color-theme-primary-500);
  -webkit-mask-image: var(--icon-external-link);
  mask-image: var(--icon-external-link);
  mask-repeat: no-repeat;
  mask-size: contain;
  background-color: currentColor;
}
.p-post-body :not(.wp-block-image) a:not(.c-link-card):visited {
  text-decoration-color: var(--color-theme-complement-500);
}
.p-post-body :not(.wp-block-image) a:not(.c-link-card)[target="_blank"]:visited::after {
  color: var(--color-theme-complement-500);
}

/* Title */
h1.wp-block-post-title {
  padding-bottom: 10px;
  margin-bottom: 10px;
  font-size: var(--text-5xl);
  font-weight: var(--font-weight-heading);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  overflow-wrap: anywhere;
  word-break: keep-all;
  border-bottom: 2px solid var(--color-theme-primary-500);
}

/* Heading */
h2.wp-block-heading {
  padding: 5px 10px;
  color: var(--color-theme-body-invert);
  background-color: var(--color-theme-primary-500);
}
h3.wp-block-heading {
  padding-left: 10px;
  border-left: 4px solid var(--color-theme-primary-500);
}

/* Image */
.wp-element-caption {
  text-align: left;
}

/* Table */
.wp-block-table table {
}
.wp-block-table thead tr {
  background-color: var(--color-theme-primary-300);
}
.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
  background-color: unset;
}
.wp-block-table.is-style-stripes tbody tr:nth-child(even) {
  background-color: var(--color-theme-primary-300);
}
.wp-block-table :is(thead, tfoot, td, th) {
  border-color: var(--color-theme-border);
}

/* Code */
.wp-block-code {
  padding: 0;
}

/* List */
.wp-block-list {
  padding-left: 1.5em;
}
.wp-block-list > li {
  margin: calc(var(--block-margin, 0) / 4) 0;
}
ul.wp-block-list {
  list-style-type: disc;
}
ol.wp-block-list {
  list-style-type: decimal;
}

/* Code Block */
.wp-block-code {
  overflow: auto;
  overscroll-behavior-x: contain;
  max-height: 80vh;
  border-radius: var(--border-radius-md);
}

/* Code Block with Tabs */
.b-code-block {
  container: code-block / inline-size;
  overflow: hidden;
  color: var(--color-code-block-foreground);
  background-color: var(--color-code-block-background);
  border-radius: var(--border-radius-md);
}
.b-code-block__upper {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 5px;
  padding: 6px;
  font-size: var(--text-xs);
}
.b-code-block__upper-actions {
  order: 1;
  padding: 4px 8px;
}
.b-code-block__copy-button {
  display: grid;
  grid-template-columns: 16px auto;
  align-items: center;
  gap: 5px;
  font-weight: var(--font-weight-semibold);
}
.b-code-block .c-tab__controls {
  order: -1;
}
.b-code-block .c-tab__control-item {
  display: grid;
  grid-template-columns: 16px auto;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  font-weight: var(--font-weight-semibold);
  color: var(--color-theme-description);
  background-color: #323232;
  border-top: 2px solid transparent;
  border-bottom: none;
}
.b-code-block .c-tab__control-item span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.b-code-block .c-tab__control-item[aria-selected="true"] {
  color: var(--color-code-block-foreground);
  border-top-color: var(--color-theme-primary-500);
}
.b-code-block .c-tab__control-item:focus-visible {
  outline: none;
  box-shadow: none;
}
.b-code-block .c-tab__panel-item {
  padding: 0;
  border: none;
}
.b-code-block code.hljs {
  overflow: auto;
  overscroll-behavior-x: contain;
  max-height: 80vh;
  padding-top: 0;
}

/* Quote Block */
:is(.wp-block-quote, .b-block-quote) {
  --border-width: 6px;
  --icon-size: 18px;
  --icon-x-offset: 10px;
  --icon-y-offset: 5px;

  position: relative;
  padding: 20px 28px;
  background-color: var(--color-quote-background);
  border-left: var(--border-width, 1px) solid var(--color-quote-primary);
  border-radius: var(--border-radius-sm);
}
:is(.wp-block-quote, .b-block-quote)::before,
:is(.wp-block-quote, .b-block-quote)::after {
  content: "";
  position: absolute;
  display: inline-block;
  width: var(--icon-size);
  aspect-ratio: 1;
  color: var(--color-quote-primary);
  -webkit-mask-image: var(--icon-quote);
  mask-image: var(--icon-quote);
  mask-repeat: no-repeat;
  mask-size: contain;
  background-color: currentColor;
}
:is(.wp-block-quote, .b-block-quote)::before {
  top: var(--icon-y-offset, 0px);
  left: calc(var(--icon-y-offset, 0px) + var(--border-width, 1px));
  transform: rotate(180deg);
}
:is(.wp-block-quote, .b-block-quote)::after {
  bottom: var(--icon-y-offset, 0px);
  right: var(--icon-x-offset, 0px);
}
:is(.wp-block-quote, .b-block-quote .lazyblock-inner-blocks) > * {
  margin: var(--block-margin, 0) 0;
}
:is(.wp-block-quote, .b-block-quote .lazyblock-inner-blocks) > *:first-child {
  margin-top: 0;
}
:is(.wp-block-quote, .b-block-quote .lazyblock-inner-blocks) > *:last-child {
  margin-bottom: 0;
}

/* Callout Block */
.b-callout {
  display: grid;
  grid-template-columns: 100%;
  gap: 12px;
  padding: 20px 28px;
  background-color: var(--color-callout-background);
  border-left: 6px solid var(--color-callout-primary);
  border-radius: var(--border-radius-sm);
}
.b-callout[data-callout-type="information"] {
  --color-callout-primary: var(--color-info-primary);
  --color-callout-background: var(--color-info-background);
}
.b-callout[data-callout-type="warning"] {
  --color-callout-primary: var(--color-warning-primary);
  --color-callout-background: var(--color-warning-background);
}
.b-callout[data-callout-type="caution"] {
  --color-callout-primary: var(--color-caution-primary);
  --color-callout-background: var(--color-caution-background);
}
.b-callout[data-callout-type="annotation"] {
  --color-callout-primary: var(--color-annotation-primary);
  --color-callout-background: var(--color-annotation-background);
}
.b-callout__type {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  font-weight: var(--font-weight-semibold);
}
.b-callout__type svg {
  color: var(--color-callout-primary);
}
.b-callout .lazyblock-inner-blocks > * {
  margin: var(--block-margin, 0) 0;
}
.b-callout .lazyblock-inner-blocks > *:first-child {
  margin-top: 0;
}
.b-callout .lazyblock-inner-blocks > *:last-child {
  margin-bottom: 0;
}