/**
 * paragraph-citation.css
 * Styles du paragraphe Citation (bundle : citation).
 * Réf. Figma : L - Line Quotes (node 17968:32273)
 */

/* ── Lignes verticales de bordure (2px, self-stretch) ────────────────────── */
.para-citation__line {
  width: 2px;
  align-self: stretch;
  flex-shrink: 0;
}

.para-citation__line--duo {
  background-color: var(--tw-color-surface-zone-duo, #80c3e2);
}

.para-citation__line--uno {
  background-color: var(--tw-color-surface-zone-uno, #023c48);
}

/* ── Texte de la citation (Body/Standard/Normal 16px/24px) ───────────────── */
.para-citation__text,
.para-citation__text p {
  margin: 0;
  font-family: var(--tw-font-ff-body);
  font-weight: 400;
  font-size: var(--tw-text-fs-sd, 16px);
  line-height: 24px;
  color: var(--tw-color-content-main-alt, #000000);
}

/* ── Date : nettoyage du rendu Drupal (field wrapper + time) ─────────────── */
.para-citation__date .field__item {
  display: contents;
}

.para-citation__date .datetime {
  font-family: var(--tw-font-ff-body);
  font-weight: 500;
  font-size: var(--tw-text-fs-sm, 14px);
  line-height: 20px;
  color: var(--tw-color-content-complement, rgba(0, 0, 0, 0.64));
}

/* ── Avatar responsive (override dimensions SDC) ─────────────────────────── */
/* mobile : pleine largeur, carré via aspect-ratio */
.para-citation__avatar-col .avatar {
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
}

/* sm ≥640px (tablet) : 232×232px */
@media (min-width: 640px) {
  .para-citation__avatar-col .avatar {
    width: 232px;
    height: 232px;
    aspect-ratio: auto;
  }
}

/* xl ≥1280px : 168×168px */
@media (min-width: 1280px) {
  .para-citation__avatar-col .avatar {
    width: 168px;
    height: 168px;
  }
}

/* 2xl ≥1536px : 224×224px */
@media (min-width: 1536px) {
  .para-citation__avatar-col .avatar {
    width: 224px;
    height: 224px;
  }
}