/* Romantic Floral -  blush/ivory palette, a script display face for the
   couple's names, warm dusty-rose accents. */

@font-face {
  font-family: 'Parisienne';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/assets/fonts/parisienne-400.woff2') format('woff2');
}

@font-face {
  font-family: 'Cormorant';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url('/assets/fonts/cormorant-var.woff2') format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url('/assets/fonts/inter-var.woff2') format('woff2');
}

[data-theme="romantic-floral"] {
  --serif: 'Parisienne', cursive;
  --label: 'Cormorant', serif;
  --sans: 'Inter', sans-serif;
  --ink: #5c3a3a;
  --paper: #fbeee9;
  --muted: #c98a8a;

  --hero-overlay: rgba(0, 0, 0, .2);
  --hero-fg: #fff;
  --hero-cta-border: rgba(255, 255, 255, .7);

  --toolbar-bg: #fff8f6;
  --toolbar-border: #f0dcd5;

  --gallery-placeholder-bg: #f6e4de;

  --lightbox-bg: #fff8f6;
  --lightbox-border: #f0dcd5;
  --lightbox-caption: rgba(92, 58, 58, .6);

  --slideshow-bg: #000;
  --slideshow-control-bg: rgba(255, 255, 255, .1);
  --slideshow-control-fg: #fff;

  --toast-bg: #5c3a3a;
  --toast-fg: #fff8f6;
}

/* The script face renders noticeably bigger than the other themes' display
   faces at the same font-size, so it's scaled down to keep the hero title
   from overwhelming the layout. */
[data-theme="romantic-floral"] .hero__title {
  font-size: clamp(40px, 7vw, 84px);
  font-weight: 400;
  letter-spacing: 0;
}

[data-theme="romantic-floral"] .toolbar__title h2 {
  font-weight: 500;
  font-style: italic;
}