/* KC-RSVP Diamond · Khal & Silvie · Black or White
   Viste los nodos que arma gala-rsvp-bridge.ts en KC-Center: placa de reserva, campos extra, pase y despedida.
   #rsvp es pliego de papel: la placa y el pase son tinta con texto papel y filetes plata.
   Todo va anclado a #rsvp, salvo .kc-rsvp-capture-clean, que el bridge pone en <html> antes de rasterizar el PNG.
   Sin KC-Center estos nodos no existen y nada de esto pinta.
   Sin sombras ni border-image: la captura del pase sale limpia. url() directo en la regla. */

/* El bridge esconde nodos con [hidden]: ningún display de esta hoja puede desmentirlo */
#rsvp [hidden] { display: none !important; }

/* ══════════ Placa de reserva: el nombre impreso en tinta sobre el papel ══════════ */
#rsvp .kc-rsvp-reservation {
  position: relative;
  max-width: 420px;
  margin: var(--kc-space-6) auto 0;
  padding: 36px 22px 28px;
  border: 1px solid #BFBAB0;
  border-radius: var(--bl-arch);
  background: #0A0A0B url('../../assets/page/bl-ink.webp');
  color: #F3F3F0;
  text-align: center;
}
#rsvp .kc-rsvp-reservation::before {
  content: ''; position: absolute; top: 8px; left: 50%;
  width: 8px; height: 8px; margin-left: -4px;
  background: #BFBAB0; transform: rotate(45deg);
}
#rsvp .kc-rsvp-reservation-eyebrow {
  margin: 0;
  font-family: var(--bl-font-ui); font-size: .66rem; letter-spacing: .26em; text-transform: uppercase;
  color: #BFBAB0;
}
#rsvp .kc-rsvp-reservation-name {
  margin: .28em 0 .18em;
  font-family: var(--kc-font-display); font-size: clamp(2rem, 9vw, 2.6rem); line-height: 1.15;
  color: #F3F3F0; overflow-wrap: anywhere; text-wrap: balance;
}
/* Píldora de pases: filete plata, nunca se parte en dos líneas */
#rsvp .kc-rsvp-reservation-passes,
#rsvp .kc-rsvp-ticket-host .kc-ticket-passes {
  display: inline-block; margin: 0; padding: 7px 16px;
  border: 1px solid #BFBAB0; background: transparent;
  font-family: var(--bl-font-ui); font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; white-space: nowrap;
  color: #F3F3F0;
}

/* ══════════ Campos extra: hairline de tinta sobre el papel ══════════ */
#rsvp .kc-rsvp-extra { margin-top: var(--kc-space-5); }
#rsvp .kc-rsvp-field-group { margin-bottom: var(--kc-space-4); }
#rsvp .kc-rsvp-field-group label {
  display: block; margin-bottom: var(--kc-space-2);
  font-family: var(--bl-font-ui); font-size: .7rem; letter-spacing: .24em; text-transform: uppercase;
  color: #5A5A58;
}
#rsvp .kc-rsvp-field-group input,
#rsvp .kc-rsvp-field-group textarea {
  display: block; width: 100%; min-height: 48px; padding: var(--kc-space-2) var(--kc-space-1);
  border: 0; border-bottom: 1px solid #5A5A58; border-radius: 0;
  background: transparent; color: #0A0A0B;
  font-family: var(--bl-font-ui); font-size: 16px; line-height: 1.5;
  -webkit-appearance: none; appearance: none;
}
#rsvp .kc-rsvp-field-group textarea { min-height: 96px; resize: vertical; }
#rsvp .kc-rsvp-field-group :is(input, textarea)::placeholder { color: #5A5A58; font-style: italic; opacity: 1; }
#rsvp .kc-rsvp-field-group :is(input, textarea):focus { outline: none; border-bottom-color: #0A0A0B; }
#rsvp .kc-rsvp-field-group :is(input, textarea):focus-visible { outline: 2px solid #0A0A0B; outline-offset: 3px; }

/* ══════════ Confirmar: placa de tinta; la espera es un barrido que cruza ══════════ */
#rsvp #kc-rsvp-submit,
#rsvp .kc-rsvp-update {
  display: block; width: 100%; min-height: 52px; margin-top: var(--kc-space-4);
  border: 1px solid #0A0A0B; border-radius: 0;
  background: #0A0A0B; color: #F3F3F0;
  font-family: var(--bl-font-ui); font-size: .74rem; font-weight: 500; letter-spacing: .2em; text-transform: uppercase;
  cursor: pointer;
  transition: background-color 220ms var(--kc-ease), color 220ms var(--kc-ease);
}
#rsvp #kc-rsvp-submit:active:not(:disabled) { transform: scale(.98); }
#rsvp #kc-rsvp-submit:focus-visible, #rsvp .kc-rsvp-update:focus-visible { outline: 2px solid #0A0A0B; outline-offset: 4px; }
#rsvp form[aria-busy="true"] #kc-rsvp-submit {
  cursor: progress; opacity: 1;
  background: linear-gradient(105deg, #0A0A0B 0%, #0A0A0B 38%, #4A4A4C 50%, #0A0A0B 62%, #0A0A0B 100%) 0 0 / 260% 100%;
}
@media (prefers-reduced-motion: no-preference) {
  #rsvp form[aria-busy="true"] #kc-rsvp-submit { animation: blBarridoEspera 1.4s linear infinite; }
}
@keyframes blBarridoEspera { from { background-position: 100% 0; } to { background-position: -160% 0; } }
/* Actualizar: el mismo filo, en hueco, al ancho del pase */
#rsvp .kc-rsvp-update { max-width: 400px; margin-inline: auto; background: transparent; color: #0A0A0B; }

/* ══════════ El pase: arcada de tinta con filete plata doble ══════════ */
#rsvp .kc-rsvp-ticket-host { max-width: 400px; margin: var(--kc-space-6) auto 0; text-align: center; }
#rsvp .kc-rsvp-ticket-host .kc-ticket {
  position: relative; overflow: hidden; isolation: isolate;
  margin: 0; padding: 56px 26px 30px;
  border: 1px solid #BFBAB0; border-radius: var(--bl-arch);
  background: #0A0A0B url('../../assets/page/bl-ink.webp');
  color: #F3F3F0;
}
#rsvp .kc-rsvp-ticket-host .kc-ticket::after {
  content: ''; position: absolute; inset: 8px; z-index: 1; pointer-events: none;
  border: 1px solid rgba(191,186,176,.45); border-radius: inherit;
}
#rsvp .kc-rsvp-ticket-host .kc-ticket > :not(.kc-ticket-particles) { position: relative; z-index: 2; }
#rsvp .kc-ticket-particles, #rsvp .kc-tp { display: none; }

#rsvp .kc-ticket-header { margin: 0 0 10px; }
#rsvp .kc-ticket-crown-ornament {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--bl-font-ui); font-size: .64rem; letter-spacing: .3em; text-transform: uppercase; white-space: nowrap;
  color: #BFBAB0;
}
#rsvp .kc-ticket-crown-ornament::before,
#rsvp .kc-ticket-crown-ornament::after { content: ''; width: 22px; height: 1px; background: linear-gradient(90deg, transparent, #BFBAB0); }
#rsvp .kc-ticket-crown-ornament::after { transform: scaleX(-1); }
#rsvp .kc-ticket-status { margin: 0; font-family: var(--kc-font-body); font-style: italic; font-size: 1rem; color: #A3A3A0; }
#rsvp .kc-ticket-event {
  margin: 6px 0 0;
  font-family: var(--kc-font-display); font-weight: 400; font-size: clamp(2.1rem, 9.4vw, 2.6rem); line-height: 1.15;
  color: #F3F3F0; overflow-wrap: anywhere; text-wrap: balance;
}
#rsvp .kc-ticket-celebrant {
  margin: 4px 0 0;
  font-family: var(--bl-font-ui); font-size: .66rem; letter-spacing: .3em; text-transform: uppercase;
  color: #BFBAB0;
}
/* Regla plata con rombo: el texto «· · ◆ · ·» del contrato queda como respaldo invisible */
#rsvp .kc-ticket-rule {
  position: relative; width: 210px; height: 9px; margin: 18px auto;
  background: linear-gradient(to right, transparent, #BFBAB0 18%, #F3F3F0 50%, #BFBAB0 82%, transparent) center / 100% 1px no-repeat;
}
#rsvp .kc-ticket-rule span {
  display: block; width: 7px; height: 7px; margin: 1px auto 0;
  overflow: hidden; font-size: 0; color: transparent;
  background: #BFBAB0; transform: rotate(45deg);
}
#rsvp .kc-ticket-guest-label {
  margin: 0;
  font-family: var(--bl-font-ui); font-size: .6rem; letter-spacing: .24em; text-transform: uppercase;
  color: #BFBAB0;
}
#rsvp .kc-ticket-guest {
  margin: 4px 0 12px;
  font-family: var(--kc-font-display); font-size: clamp(1.7rem, 7.4vw, 2.1rem); line-height: 1.2;
  color: #F3F3F0; overflow-wrap: anywhere; text-wrap: balance;
}
#rsvp .kc-ticket-date {
  margin: 14px 0 0;
  font-family: var(--bl-font-ui); font-size: .66rem; letter-spacing: .26em; text-transform: uppercase;
  color: #A3A3A0;
}
/* QR: panel papel con filete plata. Módulos de tinta sobre papel: se escanea sin ayuda. */
#rsvp .kc-ticket-qr-wrap { display: flex; flex-direction: column; align-items: center; gap: 10px; margin: 20px auto 0; }
#rsvp .kc-ticket-qr-frame {
  display: flex; align-items: center; justify-content: center;
  box-sizing: border-box; width: 206px; height: 206px; padding: 0;
  border: 1px solid #BFBAB0; background: #F3F3F0;
}
#rsvp .kc-ticket-qr-img { display: block; width: 180px; height: 180px; }
#rsvp .kc-ticket-qr-img svg { display: block; width: 100%; height: 100%; }
#rsvp .kc-ticket-qr-hint {
  margin: 0;
  font-family: var(--bl-font-ui); font-size: .58rem; letter-spacing: .2em; text-transform: uppercase;
  color: #A3A3A0;
}
#rsvp .kc-ticket-id {
  margin: 14px 0 0;
  font-family: var(--bl-font-ui); font-size: .56rem; letter-spacing: .22em; text-transform: uppercase; font-variant-numeric: tabular-nums;
  color: #A3A3A0;
}
#rsvp .kc-ticket-brand {
  margin: 8px 0 0;
  font-family: var(--bl-font-ui); font-size: .5rem; letter-spacing: .22em; text-transform: uppercase;
  color: #8E8A82;
}
/* Guardar pase: placa de tinta sobre el papel, hermana del pase (no entra a la captura) */
#rsvp .kc-ticket-share { display: flex; justify-content: center; margin-top: 20px; }
#rsvp .kc-ticket-share-btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: min(100%, 17rem); min-height: 50px; padding: 12px 24px;
  border: 1px solid #0A0A0B; border-radius: 0;
  background: #0A0A0B; color: #F3F3F0;
  font-family: var(--bl-font-ui); font-size: .7rem; letter-spacing: .22em; text-transform: uppercase;
  cursor: pointer;
}
#rsvp .kc-ticket-share-btn:focus-visible { outline: 2px solid #0A0A0B; outline-offset: 4px; }
#rsvp .kc-ticket-share-btn:active { transform: scale(.98); }
#rsvp .kc-ticket-share .kc-open-reload { background: transparent; color: #0A0A0B; }

/* Apertura: el pase sube desde el papel y se asienta. Una sola vez. */
@media (prefers-reduced-motion: no-preference) {
  #rsvp .kc-rsvp-ticket-host .kc-ticket { animation: blPaseAbre .9s var(--kc-ease) both; }
  #rsvp .kc-ticket-share { animation: blSubeSuave .7s var(--kc-ease) .8s both; }
}
@keyframes blPaseAbre { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes blSubeSuave { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* ══════════ Despedida (declinó): la placa de tinta, sin QR ══════════ */
#rsvp .kc-rsvp-farewell {
  max-width: 400px; margin: var(--kc-space-6) auto 0; padding: 28px 24px;
  border: 1px solid #BFBAB0; border-radius: 0;
  background: #0A0A0B url('../../assets/page/bl-ink.webp');
  text-align: center; color: #F3F3F0;
}
#rsvp .kc-rsvp-farewell-eyebrow { margin: 0; font-family: var(--bl-font-ui); font-size: .66rem; letter-spacing: .26em; text-transform: uppercase; color: #BFBAB0; }
#rsvp .kc-rsvp-farewell-guest { margin: 10px 0 6px; font-family: var(--kc-font-display); font-size: clamp(1.7rem, 7.4vw, 2.1rem); line-height: 1.2; overflow-wrap: anywhere; }
#rsvp .kc-rsvp-farewell-body { margin: 0; font-family: var(--kc-font-body); font-style: italic; font-size: 1.05rem; line-height: 1.55; color: #D9D8D3; }
#rsvp .kc-rsvp-farewell-brand { margin: 14px 0 0; font-family: var(--bl-font-ui); font-size: .5rem; letter-spacing: .22em; text-transform: uppercase; color: #A3A3A0; }

/* ══════════ Galería (la inyecta KC-Center en #captura): sección de tinta, filete plata ══════════ */
#captura .kc-gallery-cta__link {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 48px; padding: 0 var(--kc-space-5);
  border: 1px solid #BFBAB0; border-radius: 0;
  background: transparent; color: #F3F3F0; opacity: 1; text-decoration: none;
  font-family: var(--bl-font-ui); font-size: .74rem; letter-spacing: .2em; text-transform: uppercase;
}

/* Captura del PNG: sin animación, sin transform, sin sombras (la placa usa solo filetes) */
.kc-rsvp-capture-clean #rsvp .kc-rsvp-ticket-host .kc-ticket { animation: none !important; transform: none !important; }