/* ==========================================================================
   NUPCIALI — Convite digital (10 modelos)
   Arquivo ÚNICO usado na tela (painel + página pública) e na página de exportação
   (invite_render.php -> wkhtmltopdf). Por isso usa um dialeto conservador:
   sem var(), gap, inset, clamp() ou color-mix().

   Escala: TUDO é em "em", relativo a .inv-frame. Na tela, .inv-frame ganha
   font-size = 1.852cqi (container query) => o cartão inteiro escala junto com a sua
   largura e o conteúdo nunca estoura (nem no celular, nem na miniatura do painel).
   Cores: cada tema define tinta / destaque / secundária explicitamente (nada de
   herdar de h2/p globais, que causava texto escuro em convites escuros).
   ========================================================================== */

.inv, .inv * { box-sizing: border-box; }
.inv {
  position: relative; display: block;
  width: 540px; max-width: 100%; aspect-ratio: 4 / 5.6;
  overflow: hidden; border-radius: 4px;
  font-family: 'Inter', Arial, sans-serif; line-height: 1.35; text-align: center;
  box-shadow: 0 30px 80px -24px rgba(15,15,15,.35), 0 12px 30px rgba(15,15,15,.12);
}
.inv-mini { width: 100%; height: 100%; aspect-ratio: auto; pointer-events: none; box-shadow: 0 8px 24px rgba(15,15,15,.12); }
.inv-frame {
  position: absolute; top: 0; right: 0; bottom: 0; left: 0;
  display: -webkit-flex; display: flex;
  -webkit-flex-direction: column; flex-direction: column;
  -webkit-align-items: center; align-items: center;
  -webkit-justify-content: center; justify-content: center;
  padding: 4.6em 4em; overflow: hidden; text-align: center; font-size: 10px;
}
@supports (font-size: 1cqi) {
  .inv { container-type: inline-size; }
  .inv-frame { font-size: 1.852cqi; }
}
.inv-body { position: relative; z-index: 2; width: 100%; }

/* Reset local: a cor vem SEMPRE do tema (evita herdar cor global de h2/p/em/strong) */
.inv h2, .inv p { margin: 0; padding: 0; }
.inv h2, .inv p, .inv em, .inv strong, .inv small { color: inherit; }

.inv-eyebrow { display: block; margin-bottom: 2.2em; font-size: 1.12em; font-weight: 500; letter-spacing: .34em; text-transform: uppercase; }
.inv-names { margin: 0 0 .45em; font-family: 'Playfair Display', Georgia, serif; font-weight: 500; font-size: 5.6em; line-height: 1.02; overflow-wrap: anywhere; }
.inv-names em { display: block; font-style: italic; }
.inv-amp { display: block; font-size: .5em; font-style: italic; line-height: 1.25; }
.inv-orn { display: block; width: 14em; height: 1.2em; margin: .5em auto 1.9em; line-height: 1.2em; font-size: 1em; text-align: center;
  background: -webkit-linear-gradient(left, currentColor, currentColor) left center / 5.6em 1px no-repeat, -webkit-linear-gradient(left, currentColor, currentColor) right center / 5.6em 1px no-repeat;
  background: linear-gradient(currentColor, currentColor) left center / 5.6em 1px no-repeat, linear-gradient(currentColor, currentColor) right center / 5.6em 1px no-repeat; }
.inv-orn:before { content: "\25C6"; font-size: .8em; }

.inv-date { margin-bottom: 2.2em; }
.inv-weekday { display: block; margin-bottom: .7em; font-size: 1.12em; letter-spacing: .36em; text-transform: uppercase; }
.inv-date-grid { display: table; margin: 0 auto; border-top: 1px solid; border-bottom: 1px solid; border-collapse: collapse; }
.inv-day { display: table-cell; vertical-align: middle; padding: .2em .28em .2em 0; font-family: 'Playfair Display', Georgia, serif; font-size: 5.4em; line-height: 1; font-weight: 500; }
.inv-month-year { display: table-cell; vertical-align: middle; padding: .5em 0; text-align: left; font-size: 1.18em; letter-spacing: .26em; line-height: 1.55; }
.inv-month-year span { display: block; }
.inv-time { display: block; margin-top: .9em; font-size: 1.12em; letter-spacing: .3em; }
.inv-time svg { width: 1.05em; height: 1.05em; margin-right: .45em; vertical-align: -.12em; }

.inv-locations { margin-bottom: 2em; }
.inv-loc { margin-bottom: 1em; }
.inv-loc:last-child { margin-bottom: 0; }
.inv-loc-tag { display: block; margin-bottom: .35em; font-size: 1.08em; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; }
.inv-loc strong { display: block; font-family: 'Playfair Display', Georgia, serif; font-style: italic; font-weight: 500; font-size: 1.9em; line-height: 1.2; }
.inv-loc small { display: block; margin-top: .25em; font-size: 1.22em; line-height: 1.4; }

.inv-message { max-width: 22em; margin: 0 auto 1.9em; font-family: 'Cormorant Garamond', Georgia, serif; font-style: italic; font-size: 2.05em; line-height: 1.35; }

.inv-foot { padding-top: 1.2em; border-top: 1px solid; }
.inv-monogram { display: block; margin-bottom: .3em; font-family: 'Playfair Display', Georgia, serif; font-size: 1.8em; letter-spacing: .25em; }
.inv-url { display: block; font-size: 1.08em; letter-spacing: .16em; overflow-wrap: anywhere; }

/* Ornamentos (markup em render_invite) */
.inv-deco { position: absolute; z-index: 1; width: 19%; height: auto; opacity: .85; }
.inv-deco-tl { top: 2.4em; left: 2.4em; }
.inv-deco-br { bottom: 2.4em; right: 2.4em; }
.inv-crest { display: block; width: 7.5em; height: 5.6em; margin: 0 auto 1.8em; }
.inv-stamp { position: absolute; z-index: 2; top: 3em; right: 2.6em; padding: .6em 1.1em; border: 2px solid; font-size: 1em; font-weight: 600; letter-spacing: .25em; -webkit-transform: rotate(8deg); transform: rotate(8deg); }
.inv-glow { position: absolute; z-index: 0; width: 70%; height: 0; padding-bottom: 70%; border-radius: 50%; }
.inv-glow-1 { top: -22%; left: -22%; background: radial-gradient(circle, rgba(255,160,190,.65) 0%, rgba(255,160,190,0) 70%); }
.inv-glow-2 { bottom: -24%; right: -24%; background: radial-gradient(circle, rgba(176,123,172,.55) 0%, rgba(176,123,172,0) 70%); }
.inv-shape { position: absolute; z-index: 0; }
.inv-shape-1 { top: -9%; right: -9%; width: 38%; height: 0; padding-bottom: 38%; border-radius: 50%; background: #FF6B6B; opacity: .22; }
.inv-shape-2 { bottom: -7%; left: -7%; width: 26%; height: 0; padding-bottom: 26%; background: #141414; opacity: .07; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.inv-shape-3 { top: 42%; right: -1%; width: 1.2%; height: 14%; background: #E5483F; }
.inv-line { position: absolute; z-index: 1; width: 9%; height: 1px; background: #111; }
.inv-line-tl { top: 5%; left: 5%; }
.inv-line-br { bottom: 5%; right: 5%; }
.inv-line:after { content: ""; position: absolute; width: 1px; height: 0; padding-bottom: 100%; background: #111; }
.inv-line-tl:after { left: 0; top: 0; }
.inv-line-br:after { right: 0; bottom: 0; }

/* ---------- ETERNAL ---------- */
.inv-eternal { background: #FDF9F0; background-image: linear-gradient(180deg, #FDF9F0 0%, #F3E9D4 100%); color: #3B2E1F; }
.inv-eternal .inv-eyebrow, .inv-eternal .inv-weekday, .inv-eternal .inv-loc-tag, .inv-eternal .inv-monogram { color: #7A5E36; }
.inv-eternal .inv-amp { color: #7A5E36; }
.inv-eternal .inv-orn { color: #9C7A47; }
.inv-eternal .inv-time, .inv-eternal .inv-month-year, .inv-eternal .inv-loc small, .inv-eternal .inv-url, .inv-eternal .inv-message { color: #5C4830; }
.inv-eternal .inv-date-grid, .inv-eternal .inv-foot { border-color: rgba(138,110,69,.5); }
.inv-eternal .inv-names { font-family: 'Playfair Display', Georgia, serif;  }

/* ---------- BOTANIC ---------- */
.inv-botanic { background: #F8F5EC; background-image: linear-gradient(180deg, #F8F5EC 0%, #E5EBD3 100%); color: #2E3A2A; }
.inv-botanic .inv-eyebrow, .inv-botanic .inv-weekday, .inv-botanic .inv-loc-tag, .inv-botanic .inv-monogram { color: #55703F; }
.inv-botanic .inv-amp { color: #55703F; }
.inv-botanic .inv-orn { color: #6F8760; }
.inv-botanic .inv-time, .inv-botanic .inv-month-year, .inv-botanic .inv-loc small, .inv-botanic .inv-url, .inv-botanic .inv-message { color: #4A5D3F; }
.inv-botanic .inv-date-grid, .inv-botanic .inv-foot { border-color: rgba(85,112,63,.45); }
.inv-botanic .inv-names { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 6.3em; font-weight: 500; }

/* ---------- MINIMAL ---------- */
.inv-minimal { background: #FFFFFF; color: #111111; }
.inv-minimal .inv-eyebrow, .inv-minimal .inv-weekday, .inv-minimal .inv-loc-tag, .inv-minimal .inv-monogram { color: #111111; }
.inv-minimal .inv-amp { color: #111111; }
.inv-minimal .inv-orn { color: #767676; }
.inv-minimal .inv-time, .inv-minimal .inv-month-year, .inv-minimal .inv-loc small, .inv-minimal .inv-url, .inv-minimal .inv-message { color: #555555; }
.inv-minimal .inv-date-grid, .inv-minimal .inv-foot { border-color: #111111; }
.inv-minimal .inv-names { font-family: 'Inter', Arial, sans-serif; font-weight: 700; letter-spacing: -.04em; text-transform: uppercase; font-size: 4.9em; line-height: 1.02; }
.inv-minimal .inv-names em, .inv-minimal .inv-amp { font-style: normal; }

/* ---------- AURORA ---------- */
.inv-aurora { background: #FFE9E4; background-image: linear-gradient(135deg, #FFE9E4 0%, #F3DCEB 55%, #DCD3F2 100%); color: #3B2A4A; }
.inv-aurora .inv-eyebrow, .inv-aurora .inv-weekday, .inv-aurora .inv-loc-tag, .inv-aurora .inv-monogram { color: #7B427A; }
.inv-aurora .inv-amp { color: #7B427A; }
.inv-aurora .inv-orn { color: #8E4F8A; }
.inv-aurora .inv-time, .inv-aurora .inv-month-year, .inv-aurora .inv-loc small, .inv-aurora .inv-url, .inv-aurora .inv-message { color: #5E4A6F; }
.inv-aurora .inv-date-grid, .inv-aurora .inv-foot { border-color: rgba(138,78,134,.45); }
.inv-aurora .inv-names { font-family: 'Playfair Display', Georgia, serif;  }

/* ---------- DOURADO ---------- */
.inv-dourado { background: #14100B; background-image: radial-gradient(ellipse at top, #2A2016 0%, #0A0807 75%); color: #F1E6C8; }
.inv-dourado .inv-eyebrow, .inv-dourado .inv-weekday, .inv-dourado .inv-loc-tag, .inv-dourado .inv-monogram { color: #E3C25A; }
.inv-dourado .inv-amp { color: #E3C25A; }
.inv-dourado .inv-orn { color: #E3C25A; }
.inv-dourado .inv-time, .inv-dourado .inv-month-year, .inv-dourado .inv-loc small, .inv-dourado .inv-url, .inv-dourado .inv-message { color: #D2C6A6; }
.inv-dourado .inv-date-grid, .inv-dourado .inv-foot { border-color: rgba(227,194,90,.55); }
.inv-dourado .inv-names { font-family: 'Cinzel', Georgia, serif; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; font-size: 4.9em; }
.inv-dourado .inv-names em, .inv-dourado .inv-amp { font-style: normal; }

/* ---------- PRAIA ---------- */
.inv-praia { background: #E4F0F4; background-image: linear-gradient(180deg, #E4F0F4 0%, #F7EFDC 100%); color: #17414F; }
.inv-praia .inv-eyebrow, .inv-praia .inv-weekday, .inv-praia .inv-loc-tag, .inv-praia .inv-monogram { color: #1F6F8B; }
.inv-praia .inv-amp { color: #1F6F8B; }
.inv-praia .inv-orn { color: #2B7F9D; }
.inv-praia .inv-time, .inv-praia .inv-month-year, .inv-praia .inv-loc small, .inv-praia .inv-url, .inv-praia .inv-message { color: #3F5F6B; }
.inv-praia .inv-date-grid, .inv-praia .inv-foot { border-color: rgba(31,111,139,.45); }
.inv-praia .inv-names { font-family: 'Playfair Display', Georgia, serif;  }

/* ---------- RUSTICO ---------- */
.inv-rustico { background: #EBDFC8; background-image: radial-gradient(rgba(60,40,20,.08) 1px, transparent 1px); background-size: 4px 4px; color: #3B2A1E; }
.inv-rustico .inv-eyebrow, .inv-rustico .inv-weekday, .inv-rustico .inv-loc-tag, .inv-rustico .inv-monogram { color: #7A4A2E; }
.inv-rustico .inv-amp { color: #7A4A2E; }
.inv-rustico .inv-orn { color: #8B5A3C; }
.inv-rustico .inv-time, .inv-rustico .inv-month-year, .inv-rustico .inv-loc small, .inv-rustico .inv-url, .inv-rustico .inv-message { color: #5E4A38; }
.inv-rustico .inv-date-grid, .inv-rustico .inv-foot { border-color: rgba(122,74,46,.55); }
.inv-rustico .inv-names { font-family: 'Lora', Georgia, serif; font-weight: 600; font-size: 5.1em; }

/* ---------- MODERNO ---------- */
.inv-moderno { background: #FFFFFF; color: #141414; }
.inv-moderno .inv-eyebrow, .inv-moderno .inv-weekday, .inv-moderno .inv-loc-tag, .inv-moderno .inv-monogram { color: #C8332F; }
.inv-moderno .inv-amp { color: #C8332F; }
.inv-moderno .inv-orn { color: #E5483F; }
.inv-moderno .inv-time, .inv-moderno .inv-month-year, .inv-moderno .inv-loc small, .inv-moderno .inv-url, .inv-moderno .inv-message { color: #555555; }
.inv-moderno .inv-date-grid, .inv-moderno .inv-foot { border-color: #141414; }
.inv-moderno .inv-names { font-family: 'Manrope', Arial, sans-serif; font-weight: 800; letter-spacing: -.035em; text-transform: uppercase; font-size: 5.1em; }
.inv-moderno .inv-names em, .inv-moderno .inv-amp { font-style: normal; }

/* ---------- VINTAGE ---------- */
.inv-vintage { background: #F4EAD5; background-image: linear-gradient(180deg, #F4EAD5 0%, #E7D8BA 100%); color: #3A2B20; }
.inv-vintage .inv-eyebrow, .inv-vintage .inv-weekday, .inv-vintage .inv-loc-tag, .inv-vintage .inv-monogram { color: #7C5538; }
.inv-vintage .inv-amp { color: #7C5538; }
.inv-vintage .inv-orn { color: #8E5F3A; }
.inv-vintage .inv-time, .inv-vintage .inv-month-year, .inv-vintage .inv-loc small, .inv-vintage .inv-url, .inv-vintage .inv-message { color: #5F4B3B; }
.inv-vintage .inv-date-grid, .inv-vintage .inv-foot { border-color: rgba(124,85,56,.55); }
.inv-vintage .inv-names { font-family: 'Cormorant Garamond', Georgia, serif; font-weight: 600; font-size: 6.2em; }

/* ---------- IMPERIAL ---------- */
.inv-imperial { background: #2F1512; background-image: linear-gradient(180deg, #34170F 0%, #1E0D0B 100%); color: #F3EAD7; }
.inv-imperial .inv-eyebrow, .inv-imperial .inv-weekday, .inv-imperial .inv-loc-tag, .inv-imperial .inv-monogram { color: #D9B77A; }
.inv-imperial .inv-amp { color: #D9B77A; }
.inv-imperial .inv-orn { color: #D9B77A; }
.inv-imperial .inv-time, .inv-imperial .inv-month-year, .inv-imperial .inv-loc small, .inv-imperial .inv-url, .inv-imperial .inv-message { color: #D5C2B0; }
.inv-imperial .inv-date-grid, .inv-imperial .inv-foot { border-color: rgba(217,183,122,.55); }
.inv-imperial .inv-names { font-family: 'Playfair Display', Georgia, serif; font-weight: 500; letter-spacing: .05em; text-transform: uppercase; font-size: 5em; }
.inv-imperial .inv-names em, .inv-imperial .inv-amp { font-style: normal; }

/* Toques de cada modelo */
.inv-eternal .inv-frame:after { content: ""; position: absolute; top: 2.2em; right: 2.2em; bottom: 2.2em; left: 2.2em; border: 1px solid rgba(138,110,69,.55); pointer-events: none; }
.inv-eternal .inv-frame:before { content: ""; position: absolute; top: 2.8em; right: 2.8em; bottom: 2.8em; left: 2.8em; border: 1px solid rgba(138,110,69,.22); pointer-events: none; }
.inv-botanic .inv-deco { color: #7A8B6A; }
.inv-minimal .inv-orn { width: 5em; height: 2px; margin-bottom: 2.2em; background: #111; }
.inv-minimal .inv-orn:before { content: none; }
.inv-minimal .inv-amp { font-weight: 300; }
.inv-dourado .inv-frame:after { content: ""; position: absolute; top: 2.2em; right: 2.2em; bottom: 2.2em; left: 2.2em; border: 1px solid rgba(227,194,90,.6); pointer-events: none; }
.inv-dourado .inv-frame:before { content: ""; position: absolute; top: 2.8em; right: 2.8em; bottom: 2.8em; left: 2.8em; border: 1px solid rgba(227,194,90,.22); pointer-events: none; }
.inv-dourado .inv-crest, .inv-imperial .inv-crest { color: #E3C25A; }
.inv-dourado .inv-amp, .inv-dourado .inv-names em { font-family: 'Cinzel', Georgia, serif; }
.inv-dourado .inv-message, .inv-imperial .inv-message { color: #E8DDC3; }
.inv-praia .inv-deco { color: #2B7F9D; }
.inv-praia .inv-frame:after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 7%; background: #EBDDBC; opacity: .75; pointer-events: none; }
.inv-rustico .inv-stamp { color: #7A4A2E; }
.inv-rustico .inv-frame:after { content: ""; position: absolute; top: 2em; right: 2em; bottom: 2em; left: 2em; border: 2px dashed rgba(122,74,46,.5); pointer-events: none; }
.inv-moderno .inv-orn { width: 5em; height: .5em; margin-bottom: 2em; background: #FF6B6B; }
.inv-moderno .inv-orn:before { content: none; }
.inv-moderno .inv-eyebrow { color: #C8332F; }
.inv-vintage .inv-frame:after { content: ""; position: absolute; top: 1.8em; right: 1.8em; bottom: 1.8em; left: 1.8em; border: 3px double rgba(124,85,56,.6); pointer-events: none; }
.inv-vintage .inv-crest { color: #7C5538; }
.inv-imperial .inv-frame:after { content: ""; position: absolute; top: 2em; right: 2em; bottom: 2em; left: 2em; border: 1px solid rgba(217,183,122,.6); pointer-events: none; }
.inv-imperial .inv-frame:before { content: ""; position: absolute; top: 2.6em; right: 2.6em; bottom: 2.6em; left: 2.6em; border: 1px solid rgba(217,183,122,.2); pointer-events: none; }
