/* Finitions visuelles communes à toutes les déclarations détaillées. */
.declaration-page main {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 22%, rgba(193, 38, 105, .2), transparent 31rem),
    radial-gradient(circle at 88% 66%, rgba(116, 72, 182, .18), transparent 34rem),
    linear-gradient(180deg, #07132f 0%, #0a1536 48%, #050e26 100%);
}

.declaration-content {
  position: relative;
  isolation: isolate;
}

.declaration-content::before,
.declaration-content::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 300px;
  height: 300px;
  border: 1px solid rgba(242, 200, 111, .12);
  border-radius: 50%;
  filter: blur(.2px);
}

.declaration-content::before { top: 5%; left: -240px; box-shadow: 0 0 100px rgba(255, 94, 174, .15); }
.declaration-content::after { right: -240px; bottom: 12%; box-shadow: 0 0 100px rgba(122, 96, 220, .18); }

.declaration-card {
  border-color: rgba(242, 200, 111, .56);
  background:
    linear-gradient(rgba(17, 24, 58, .94), rgba(10, 18, 50, .97)),
    repeating-linear-gradient(0deg, transparent 0 34px, rgba(255, 255, 255, .018) 35px);
  box-shadow: 0 32px 90px rgba(0, 0, 0, .44), inset 0 0 55px rgba(255, 114, 181, .045);
}

.declaration-card::before,
.declaration-card::after { color: rgba(242, 200, 111, .13); }

.declaration-text { text-shadow: 0 2px 18px rgba(0, 0, 0, .35); }

.share-panel {
  position: relative;
  border-color: rgba(242, 200, 111, .44);
  background: linear-gradient(145deg, rgba(24, 36, 82, .96), rgba(13, 22, 58, .96));
  box-shadow: 0 20px 55px rgba(0, 0, 0, .28);
}

.share-heart {
  display: inline-grid;
  width: 46px;
  height: 46px;
  margin: -54px auto 13px;
  place-items: center;
  border: 1px solid rgba(242, 200, 111, .68);
  border-radius: 50%;
  background: #111b48;
  color: #ff72b5;
  font-size: 1.8rem;
}

.share-actions { gap: 14px; }
.share-button { min-width: 158px; border-color: rgba(242, 200, 111, .32); box-shadow: 0 8px 22px rgba(0, 0, 0, .18); }
.share-button.primary { background: linear-gradient(135deg, #ef3f91, #a94ee8); }
.share-button.facebook { background: linear-gradient(135deg, #263e83, #365fb6); }
.share-button.facebook span { font: 700 1.35rem Arial, sans-serif; }
.share-button:hover,.share-button:focus-visible { transform: translateY(-2px); }

.declaration-nav a { background: rgba(20, 31, 73, .76); }

@media (max-width: 640px) {
  .declaration-content::before,
  .declaration-content::after { width: 180px; height: 180px; }
  .declaration-card { padding-inline: 24px; }
  .declaration-text { font-size: 1.16rem; line-height: 1.82; }
  .share-actions { grid-template-columns: 1fr; }
  .share-button { width: 100%; min-width: 0; }
}

/* Fonds éditoriaux propres à chaque univers de lecture.
   Le voile ivoire protège la lisibilité du texte quelle que soit la photo. */
.declaration-page:not(.love-letter-page):not(.poem-detail-page) .declaration-card {
  background:
    linear-gradient(rgba(255, 250, 241, .88), rgba(255, 250, 241, .88)),
    url("../images/fonds-textes/fond-declarations-amour.webp") center / cover no-repeat;
}

.love-letter-page .declaration-card {
  background:
    linear-gradient(rgba(255, 252, 246, .89), rgba(255, 252, 246, .89)),
    url("../images/fonds-textes/fond-lettres-amour.webp") center / cover no-repeat;
}

.poem-detail-page .declaration-card {
  background:
    linear-gradient(rgba(255, 250, 241, .88), rgba(255, 250, 241, .88)),
    url("../images/fonds-textes/fond-poemes-amour.webp") center / cover no-repeat;
}

.declaration-page .declaration-card h2 { color: #2b1722; }
.declaration-page .declaration-card .declaration-text {
  color: #402630;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .82);
}
.declaration-page .declaration-card .declaration-signature { color: #a52359; }
.declaration-page .declaration-card::before,
.declaration-page .declaration-card::after { color: rgba(145, 44, 78, .16); }
