/**
 * assets/css/blocks.css
 * Block editor front-end overrides & block-specific styles
 * @package Tribune_News
 */

/* Core: Paragraph */
.wp-block-paragraph.has-drop-cap:not(:focus)::first-letter {
  font-family: var(--font-display);
  font-size: 4.5rem;
  font-weight: 900;
  line-height: 0.75;
  float: left;
  margin: 0.1em 0.12em 0 0;
  color: var(--c-red);
}

/* Core: Image */
.wp-block-image img {
  border-radius: var(--radius-sm);
}
.wp-block-image figcaption {
  font-family: var(--font-ui);
  font-size: .8rem;
  color: var(--c-gray-600);
  text-align: center;
  margin-top: .5rem;
}

/* Core: Quote */
.wp-block-quote {
  border-left: 4px solid var(--c-red);
  padding: 1rem 1.5rem;
  background: var(--c-gray-100);
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1.2rem;
  margin: 1.5rem 0;
  color: var(--c-gray-800);
}
.wp-block-quote cite,
.wp-block-quote footer {
  font-family: var(--font-ui);
  font-style: normal;
  font-size: .82rem;
  color: var(--c-gray-600);
  margin-top: .5rem;
  display: block;
}
.wp-block-quote::before {
  content: '\201C';
  font-size: 3rem;
  line-height: 0;
  vertical-align: -0.6em;
  color: var(--c-red);
  margin-right: .1em;
}

/* Core: Pullquote */
.wp-block-pullquote {
  border-top: 4px solid var(--c-ink);
  border-bottom: 4px solid var(--c-ink);
  padding: 2rem;
  text-align: center;
  margin: 2rem 0;
}
.wp-block-pullquote blockquote {
  font-family: var(--font-display);
  font-size: 1.5rem;
  font-style: italic;
  color: var(--c-ink);
}
.wp-block-pullquote cite {
  font-family: var(--font-ui);
  font-size: .82rem;
  color: var(--c-gray-600);
  font-style: normal;
  display: block;
  margin-top: 1rem;
  text-transform: uppercase;
  letter-spacing: .08em;
}

/* Core: Separator */
.wp-block-separator {
  border: none;
  border-top: 2px solid var(--c-gray-200);
  margin: 2.5rem 0;
}
.wp-block-separator.is-style-wide {
  border-top-color: var(--c-red);
  border-top-width: 3px;
}
.wp-block-separator.is-style-dots {
  border: none;
  text-align: center;
  color: var(--c-gray-400);
}
.wp-block-separator.is-style-dots::before {
  content: '• • •';
  font-size: 1.2rem;
  letter-spacing: .5em;
}

/* Core: Buttons */
.wp-block-button__link {
  background: var(--c-red);
  color: #fff;
  font-family: var(--font-ui);
  font-weight: 700;
  font-size: .875rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  border-radius: var(--radius-sm);
  padding: 12px 24px;
  transition: background 0.22s ease;
}
.wp-block-button__link:hover { background: var(--c-red-dark); }
.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent;
  border: 2px solid var(--c-red);
  color: var(--c-red);
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: var(--c-red);
  color: #fff;
}

/* Core: Table */
.wp-block-table table {
  width: 100%;
  border-collapse: collapse;
  font-size: .9375rem;
}
.wp-block-table th,
.wp-block-table td {
  padding: 10px 16px;
  border: 1px solid var(--c-gray-200);
  text-align: left;
}
.wp-block-table thead th {
  background: var(--c-ink);
  color: #fff;
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.wp-block-table tr:nth-child(even) { background: var(--c-gray-100); }

/* Core: Cover */
.wp-block-cover {
  border-radius: var(--radius-sm);
  overflow: hidden;
  min-height: 300px;
}
.wp-block-cover__inner-container {
  font-family: var(--font-display);
}

/* Core: Columns */
.wp-block-columns {
  gap: var(--gap);
}

/* Core: Code */
.wp-block-code code {
  font-family: 'Courier New', monospace;
  font-size: .875rem;
  background: var(--c-gray-100);
  padding: 1.5rem;
  display: block;
  border-radius: var(--radius-sm);
  border-left: 3px solid var(--c-red);
  overflow-x: auto;
}

/* Core: Media & Text */
.wp-block-media-text .wp-block-media-text__media img {
  border-radius: var(--radius-sm);
}

/* Core: Group with background */
.wp-block-group.has-background {
  padding: 2rem;
  border-radius: var(--radius-sm);
}

/* Tribune custom: Alert box */
.wp-block-tribune-alert {
  padding: 1rem 1.5rem;
  border-left: 4px solid var(--c-red);
  background: #fff5f5;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  margin: 1.5rem 0;
  font-family: var(--font-ui);
  font-size: .9rem;
}

/* Alignments */
.alignfull {
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  max-width: 100vw;
  width: 100vw;
}
.alignwide {
  margin-left: calc(-120px);
  margin-right: calc(-120px);
}

@media (max-width: 900px) {
  .alignwide {
    margin-left: 0;
    margin-right: 0;
  }
}
