@php
    $bride = $invitation->bride ?? [
        'name' => 'Clarissa Anindya, S.E',
        'nickname' => 'Clarissa',
        'parents' => 'Bapak Ir. Bambang Hermanto & Ibu Hj. Ratna Sari',
        'photo' => $invitation->bride_photo_url ?? ($invitation->bride_photo ?? asset('templates/vip/exclusive09/assets/images/bride.svg')),
        'instagram' => $invitation->bride_instagram ?? '@clarissanindya',
    ];
    $groom = $invitation->groom ?? [
        'name' => 'Adrian Mahardika, S.T',
        'nickname' => 'Adrian',
        'parents' => 'Bapak H. Hendra Gunawan & Ibu Hj. Rina Marlina',
        'photo' => $invitation->groom_photo_url ?? ($invitation->groom_photo ?? asset('templates/vip/exclusive09/assets/images/groom.svg')),
        'instagram' => $invitation->groom_instagram ?? '@adrianmahardika',
    ];
    $coverPhoto = $invitation->cover_photo ?? ($invitation->hero_photo_url ?? asset('templates/vip/exclusive09/assets/images/cover.svg'));

    $events = $invitation->events ?? [
        [
            'title' => 'Akad Nikah',
            'date' => '2026-12-20',
            'start_time' => '08:00',
            'end_time' => '10:00',
            'timezone' => 'WIB',
            'venue' => 'Masjid Raya Al-Barkah',
            'address' => 'Jl. Pemuda No. 10, Jakarta Pusat',
            'maps_url' => 'https://maps.google.com',
        ],
        [
            'title' => 'Resepsi Pernikahan',
            'date' => '2026-12-20',
            'start_time' => '11:00',
            'end_time' => '14:00',
            'timezone' => 'WIB',
            'venue' => 'The Grand Ballroom Hotel Heritage',
            'address' => 'Jl. Thamrin Boulevard No. 45, Jakarta Pusat',
            'maps_url' => 'https://maps.google.com',
        ],
    ];
    $primaryEvent = $events[0] ?? null;
    $eventDate = $primaryEvent['date'] ?? '2026-12-20';
    $eventTime = $primaryEvent['start_time'] ?? '08:00';
    $carbonDate = \Carbon\Carbon::parse($eventDate);
    $formattedDate = $carbonDate->locale('id')->isoFormat('dddd, D MMMM Y');

    $galleries = $invitation->gallery ?? ($invitation->gallery_photos ?? [
        asset('templates/vip/exclusive09/assets/images/gallery-1.svg'),
        asset('templates/vip/exclusive09/assets/images/gallery-2.svg'),
        asset('templates/vip/exclusive09/assets/images/gallery-3.svg'),
        asset('templates/vip/exclusive09/assets/images/gallery-4.svg'),
        asset('templates/vip/exclusive09/assets/images/gallery-5.svg'),
        asset('templates/vip/exclusive09/assets/images/gallery-6.svg'),
    ]);

    $rawBankAccounts = !empty($invitation->bank_accounts) ? $invitation->bank_accounts : (!empty($invitation->gifts) ? $invitation->gifts : null);
    if (empty($rawBankAccounts) && !empty($invitation->bank_name)) {
        $rawBankAccounts = [
            [
                'bank_name' => $invitation->bank_name,
                'bank' => $invitation->bank_name,
                'account_number' => $invitation->bank_account ?? '',
                'number' => $invitation->bank_account ?? '',
                'account_holder' => $invitation->bank_holder ?? 'Mempelai',
                'name' => $invitation->bank_holder ?? 'Mempelai',
            ]
        ];
    }
    $gifts = !empty($rawBankAccounts) ? $rawBankAccounts : [
        [
            'bank_name' => 'Bank BCA',
            'bank' => 'Bank BCA',
            'account_number' => '1234567890',
            'number' => '1234567890',
            'account_holder' => 'Clarissa Anindya',
            'name' => 'Clarissa Anindya',
        ],
        [
            'bank_name' => 'Bank Mandiri',
            'bank' => 'Bank Mandiri',
            'account_number' => '9876543210',
            'number' => '9876543210',
            'account_holder' => 'Adrian Mahardika',
            'name' => 'Adrian Mahardika',
        ],
    ];
    $hasGifts = !empty($gifts) || !empty($invitation->qris_image_url) || !empty($invitation->qris_image);

    $stories = $invitation->stories ?? [
        [
            'year' => '2019',
            'title' => 'Pertemuan Pertama',
            'story' => 'Semesta mempertemukan kami dalam momen sederhana yang kemudian menjadi sangat berarti.',
        ],
        [
            'year' => '2021',
            'title' => 'Menumbuhkan Rasa',
            'story' => 'Kami belajar saling mengenal, menghargai perbedaan, dan bertumbuh bersama dalam pemahaman.',
        ],
        [
            'year' => '2026',
            'title' => 'Menuju Selamanya',
            'story' => 'Dengan restu keluarga tercinta, kami memutuskan melangkah bersama dalam ikatan suci pernikahan.',
        ],
    ];

    $defaultQuoteText = 'Dan di antara tanda-tanda kekuasaan-Nya ialah Dia menciptakan untukmu pasangan hidup dari jenismu sendiri, supaya kamu merasa tenteram kepadanya.';
    $defaultQuoteSource = 'QS. Ar-Rum: 21';
    $quoteText = !empty($invitation->quote) ? $invitation->quote : $defaultQuoteText;
    $quoteSource = !empty($invitation->quote_author) ? $invitation->quote_author : $defaultQuoteSource;

    $wishes = $invitation->wishes ?? [
        (object)[
            'name' => 'Keluarga Besar',
            'attendance' => 'Hadir',
            'message' => 'Barakallahu lakuma wa baraka alaikuma wa jama\'a bainakuma fii khoir. Selamat Adrian & Clarissa!',
            'created_at' => now()->subHours(2),
        ],
    ];

    $isDemoMode = request()->routeIs('template.demo*') || request()->is('demo/*') || !empty($invitation->is_demo);
    $liveUrl = $isDemoMode 
        ? route('template.demo.live', $template->slug ?? 'exclusive09') 
        : (!empty($invitation->slug) ? route('invitation.live', $invitation->slug) : '#');
    if ($guestName ?? null) {
        $liveUrl .= (str_contains($liveUrl, '?') ? '&' : '?') . 'to=' . urlencode($guestName);
    }
@endphp
<!doctype html>
<html lang="id">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <title>Undangan Pernikahan | {{ $groom['nickname'] ?? 'Adrian' }} &amp; {{ $bride['nickname'] ?? 'Clarissa' }}</title>
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=DM+Sans:wght@300;400;500&display=swap" rel="stylesheet">
  <link rel="stylesheet" href="{{ asset('templates/vip/exclusive09/css/style.css') }}">
  <style>
    /* Cover overlay */
    #coverOverlay {
      position: fixed;
      inset: 0;
      z-index: 99999;
      display: flex;
      align-items: center;
      justify-content: center;
      background: radial-gradient(circle at 50% 30%, #2c2723, #151311 80%);
      color: #fff;
      padding: 24px;
      text-align: center;
      transition: opacity 0.8s ease, visibility 0.8s;
    }
    #coverOverlay.hidden-cover {
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
    }
    body.is-locked {
      overflow: hidden;
      height: 100vh;
    }
    .cover-card-inner {
      max-width: 440px;
      width: 100%;
      padding: 36px 24px;
      border: 1px solid rgba(212,175,106,0.3);
      border-radius: 20px;
      background: rgba(26,23,20,0.85);
      backdrop-filter: blur(8px);
    }
    .music-btn-floating {
      position: fixed;
      bottom: 24px;
      right: 24px;
      z-index: 9999;
      width: 44px;
      height: 44px;
      border-radius: 50%;
      background: #1a1714;
      color: #d4af6a;
      border: 1px solid #d4af6a;
      display: grid;
      place-items: center;
      box-shadow: 0 8px 20px rgba(0,0,0,0.4);
      cursor: pointer;
      transition: all 0.3s ease;
    }
    .music-btn-floating.rotating {
      animation: spinMusic 4s linear infinite;
    }
    @keyframes spinMusic {
      from { transform: rotate(0deg); }
      to { transform: rotate(360deg); }
    }
    .toast-copy {
      position: fixed;
      bottom: 30px;
      left: 50%;
      transform: translateX(-50%) translateY(30px);
      background: #1a1714;
      color: #d4af6a;
      border: 1px solid #d4af6a;
      font-weight: 600;
      padding: 10px 24px;
      border-radius: 999px;
      font-size: 0.8rem;
      letter-spacing: 0.05em;
      opacity: 0;
      pointer-events: none;
      transition: all 0.3s ease;
      z-index: 999999;
    }
    .toast-copy.show {
      opacity: 1;
      transform: translateX(-50%) translateY(0);
    }
    .hidden {
      display: none !important;
    }
  </style>
</head>
<body class="is-locked">
  @include('templates.partials.preview-banner')

  <!-- COVER OVERLAY -->
  <div id="coverOverlay">
    <div class="cover-card-inner">
      <p class="eyebrow" style="color: #d4af6a; letter-spacing: 0.25em;">THE WEDDING CELEBRATION OF</p>
      <h1 style="font-family: 'Cormorant Garamond', serif; font-size: 2.8rem; color: #fff; margin: 12px 0;">
        {{ $groom['nickname'] ?? 'Adrian' }} <i style="color: #d4af6a;">&amp;</i> {{ $bride['nickname'] ?? 'Clarissa' }}
      </h1>
      <p style="color: #d4af6a; font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; margin-bottom: 24px;">{{ $formattedDate }}</p>

      <div style="margin: 20px 0; padding: 12px; border: 1px dashed rgba(212,175,106,0.4); border-radius: 12px; background: rgba(0,0,0,0.3);">
        <small style="color: #a89f91; font-size: 11px; display: block;">Kepada Yth. Bapak/Ibu/Saudara/i:</small>
        <b style="color: #fff; font-size: 1.2rem; display: block; margin-top: 4px;">{{ $guestName ?? 'Tamu Undangan' }}</b>
      </div>

      <button type="button" class="btn gold" onclick="openInvitation()" style="cursor: pointer;">Buka Undangan</button>
    </div>
  </div>

  <nav class="nav">
    <a class="brand" href="#home"><span>JK</span> JANOER KOENING <small>EXCLUSIVE WEDDING INVITATION</small></a>
    <button id="menu" type="button">☰</button>
    <div id="links">
      <a href="#couple">Mempelai</a>
      <a href="#story">Kisah Kami</a>
      <a href="#event">Acara</a>
      <a href="#gallery">Galeri</a>
      <a href="#rsvp">RSVP</a>
    </div>
  </nav>

  <main id="mainContent">
    <header class="hero" id="home">
      <div class="intro">
        <p class="eyebrow">THE WEDDING OF</p>
        <h1>{{ $groom['nickname'] ?? 'Adrian' }} <i>&amp;</i><br>{{ $bride['nickname'] ?? 'Clarissa' }}</h1>
        <p class="eyebrow">{{ strtoupper($formattedDate) }}</p>
        <div class="rule">✦</div>
        <p>Dengan penuh rasa syukur, kami mengundang Anda menjadi bagian dari hari istimewa kami.</p>
        <p style="font-size: 12px; color: #d4af6a; margin-top: 6px;">Kepada Yth. <b>{{ $guestName ?? 'Bapak/Ibu/Saudara/i' }}</b></p>
        <a class="btn gold" href="#invitation">Lihat Undangan ↓</a>
      </div>
      <img class="cover" src="{{ $coverPhoto }}" alt="Foto Mempelai">
    </header>

    <!-- SECTION COUNTDOWN -->
    @if(!method_exists($invitation, 'isSectionVisible') || $invitation->isSectionVisible('countdown'))
    <section class="section center" id="invitation">
      <p class="eyebrow">BISMILLAHIRRAHMANIRRAHIM</p>
      <div class="ornament">❦</div>
      <h2>Assalamu’alaikum<br><em>Warahmatullahi Wabarakatuh</em></h2>
      <p class="narrow">Dengan memohon rahmat dan ridho Allah SWT, kami bermaksud menyelenggarakan pernikahan putra-putri kami. Kehadiran dan doa restu Anda akan menjadi kebahagiaan bagi kami.</p>
      <div class="count">
        <div><b id="days">00</b><small>Hari</small></div>
        <div><b id="hours">00</b><small>Jam</small></div>
        <div><b id="minutes">00</b><small>Menit</small></div>
        <div><b id="seconds">00</b><small>Detik</small></div>
      </div>
    </section>
    @endif

    <!-- SECTION MEMPELAI -->
    @if(!method_exists($invitation, 'isSectionVisible') || $invitation->isSectionVisible('couple'))
    <section class="section" id="couple">
      <div class="center">
        <p class="eyebrow">TWO SOULS, ONE STORY</p>
        <h2>Memperkenalkan <em>Kami</em></h2>
      </div>
      <div class="couples">
        <article>
          <img src="{{ $groom['photo'] }}" alt="{{ $groom['name'] }}">
          <p class="eyebrow">THE GROOM</p>
          <h3>{{ $groom['name'] }}</h3>
          <p>{{ $groom['parents'] }}</p>
          @if(!empty($groom['instagram']))
          <small><a href="https://instagram.com/{{ ltrim($groom['instagram'], '@') }}" target="_blank" rel="noopener" style="color: inherit; text-decoration: none;">{{ $groom['instagram'] }}</a></small>
          @endif
        </article>
        <div class="amp">&amp;</div>
        <article>
          <img src="{{ $bride['photo'] }}" alt="{{ $bride['name'] }}">
          <p class="eyebrow">THE BRIDE</p>
          <h3>{{ $bride['name'] }}</h3>
          <p>{{ $bride['parents'] }}</p>
          @if(!empty($bride['instagram']))
          <small><a href="https://instagram.com/{{ ltrim($bride['instagram'], '@') }}" target="_blank" rel="noopener" style="color: inherit; text-decoration: none;">{{ $bride['instagram'] }}</a></small>
          @endif
        </article>
      </div>
    </section>
    @endif

    <!-- SECTION QUOTE -->
    @if(!method_exists($invitation, 'isSectionVisible') || $invitation->isSectionVisible('quote'))
    <section class="quote center">
      <p class="eyebrow">A PROMISE FOR A LIFETIME</p>
      <blockquote>“{{ $quoteText }}”</blockquote>
      <p>{{ $quoteSource }}</p>
    </section>
    @endif

    <!-- SECTION KISAH -->
    @if((!method_exists($invitation, 'isSectionVisible') || $invitation->isSectionVisible('story')) && !empty($stories) && count($stories) > 0)
    <section class="section" id="story">
      <div class="center">
        <p class="eyebrow">OUR JOURNEY</p>
        <h2>Kisah <em>Kami</em></h2>
        <p class="narrow">Beberapa bab kecil yang membawa kami menuju hari istimewa ini.</p>
      </div>
      <div class="timeline">
        @foreach($stories as $idx => $st)
        <article>
          <b>0{{ $idx + 1 }}</b>
          <div>
            <small>{{ $st['year'] ?? '' }} · MOMEN</small>
            <h3>{{ $st['title'] ?? 'Kisah Kami' }}</h3>
            <p>{{ $st['story'] ?? ($st['description'] ?? '') }}</p>
          </div>
        </article>
        @endforeach
      </div>
    </section>
    @endif

    <!-- SECTION ACARA -->
    @if(!method_exists($invitation, 'isSectionVisible') || $invitation->isSectionVisible('event'))
    <section class="section center soft" id="event">
      <p class="eyebrow">SAVE THE DATE</p>
      <h2>Hari Bahagia <em>Kami</em></h2>
      <div class="events">
        @foreach($events as $ev)
        @php
            $evCarbon = !empty($ev['date']) ? \Carbon\Carbon::parse($ev['date']) : $carbonDate;
        @endphp
        <article>
          <p class="eyebrow">{{ strtoupper($ev['title'] ?? 'ACARA') }}</p>
          <h3>{{ $evCarbon->locale('id')->isoFormat('dddd, D MMMM Y') }}</h3>
          <p>{{ $ev['start_time'] ?? '08:00' }} WIB — {{ $ev['end_time'] ?? 'Selesai' }}</p>
          <hr>
          <h3>{{ $ev['venue'] ?? '' }}</h3>
          <p>{{ $ev['address'] ?? '' }}</p>
          @if(!empty($ev['maps_url']))
          <a href="{{ $ev['maps_url'] }}" target="_blank" rel="noopener">Lihat Lokasi ↗</a>
          @endif
        </article>
        @endforeach
      </div>

      @if(!method_exists($invitation, 'isSectionVisible') || $invitation->isSectionVisible('streaming'))
      <div style="margin-top: 35px;">
        <a class="btn gold" href="{{ $liveUrl }}">Saksikan Live Streaming ↗</a>
      </div>
      @endif
    </section>
    @endif

    <!-- SECTION GALERI -->
    @if((!method_exists($invitation, 'isSectionVisible') || $invitation->isSectionVisible('gallery')) && !empty($galleries) && count($galleries) > 0)
    <section class="section" id="gallery">
      <div class="center">
        <p class="eyebrow">MOMENTS TO KEEP</p>
        <h2>Galeri <em>Kenangan</em></h2>
      </div>
      <div class="gallery">
        @foreach($galleries as $idx => $gPhoto)
        <button type="button" class="photo" data-src="{{ $gPhoto }}">
          <img src="{{ $gPhoto }}" alt="Foto galeri {{ $idx + 1 }}">
        </button>
        @endforeach
      </div>
    </section>
    @endif

    <!-- SECTION HADIAH -->
    @if((!method_exists($invitation, 'isSectionVisible') || $invitation->isSectionVisible('gift')) && $hasGifts)
    <section class="section center">
      <p class="eyebrow">A TOKEN OF LOVE</p>
      <h2>Tanda Kasih <em>Anda</em></h2>
      
      <div style="margin: 20px 0;">
        <button type="button" class="btn" onclick="toggleGiftAccordion(this)">
          <span class="gift-btn-label">Buka Rekening &amp; Hadiah</span>
        </button>
      </div>

      <div id="gift-accordion-content" class="hidden">
        @foreach($gifts as $idx => $g)
        <div class="bank" style="margin-bottom: 20px;">
          <div class="ornament">♡</div>
          <p class="eyebrow">BANK TRANSFER</p>
          <h3>{{ $g['bank_name'] ?? ($g['bank'] ?? 'Bank') }}</h3>
          <b id="account-{{ $idx }}">{{ $g['account_number'] ?? ($g['number'] ?? '') }}</b>
          <p>a.n. {{ $g['account_holder'] ?? ($g['name'] ?? 'Mempelai') }}</p>
          <button type="button" class="btn" onclick="copyGift('account-{{ $idx }}')">Salin Nomor Rekening</button>
        </div>
        @endforeach

        @if(!empty($invitation->address))
        <div class="bank" style="margin-top: 20px;">
          <p class="eyebrow">KIRIM KADO FISIK</p>
          <p id="alamatKirim" style="margin: 10px 0;">{{ $invitation->address }}</p>
          <button type="button" class="btn" onclick="copyText('alamatKirim')">Salin Alamat</button>
        </div>
        @endif
      </div>
    </section>
    @endif

    <!-- SECTION RSVP -->
    @if((!method_exists($invitation, 'isSectionVisible') || $invitation->isSectionVisible('wishes')) && ($invitation->is_rsvp_active ?? true))
    <section class="section soft" id="rsvp">
      <div class="center">
        <p class="eyebrow">LET US KNOW</p>
        <h2>Konfirmasi <em>Kehadiran</em></h2>
        <p class="narrow">Kehadiran dan doa Anda akan menjadi kebahagiaan bagi kami.</p>
      </div>
      <form id="rsvpForm" method="POST" action="{{ !empty($invitation->slug) ? route('invitation.wish', $invitation->slug) : '#' }}">
        @csrf
        <label>Nama Anda
          <input name="name" value="{{ $guestName ?? '' }}" required placeholder="Nama lengkap">
        </label>
        <label>Konfirmasi Kehadiran
          <select name="attendance" required>
            <option value="Hadir" selected>InsyaAllah hadir</option>
            <option value="Tidak Hadir">Mohon maaf, belum dapat hadir</option>
          </select>
        </label>
        <label>Ucapan &amp; Doa
          <textarea name="message" rows="4" placeholder="Tuliskan ucapan terbaik..."></textarea>
        </label>
        <button type="submit" class="btn gold">Kirim Ucapan ↗</button>
      </form>

      <div id="wishes">
        @foreach($wishes as $w)
        <article class="wish">
          <b>{{ $w->name }} · {{ ucfirst($w->attendance ?? 'Hadir') }}</b>
          <p>{{ $w->message }}</p>
        </article>
        @endforeach
      </div>
    </section>
    @endif

    <!-- CLOSING -->
    <section class="closing center">
      <p class="eyebrow">WITH LOVE AND GRATITUDE</p>
      <h2>Merangkai hari ini,<br><em>menuju selamanya.</em></h2>
      <div class="rule">✦</div>
      <p>Terima kasih atas doa dan restu yang diberikan.</p>
      <h3>{{ $groom['nickname'] ?? 'Adrian' }} <i>&amp;</i> {{ $bride['nickname'] ?? 'Clarissa' }}</h3>
    </section>
  </main>

  <footer>
    <span class="brand"><span>JK</span> JANOER KOENING <small>EXCLUSIVE WEDDING INVITATION</small></span>
    <p>Crafted with love · &copy; {{ date('Y') }} Janoer Koening</p>
    <div style="margin-top: 14px;">
      <a href="http://janoerkoening.com" target="_blank" rel="noopener noreferrer" style="display: inline-block;">
        <img src="{{ asset('assets/brand/logo.png') }}" alt="Janoer Koening" style="height: 24px; opacity: 0.85;">
      </a>
    </div>
  </footer>

  <div id="lightbox">
    <button id="close" type="button">×</button>
    <img alt="Foto galeri diperbesar">
  </div>

  <div id="toastCopy" class="toast-copy">Tersalin ✓</div>

  @if(!empty($invitation->audio_url))
  <audio id="weddingMusicPlayer" src="{{ $invitation->audio_url }}" preload="auto" loop></audio>
  <button id="floatingMusicBtn" class="music-btn-floating" onclick="toggleMusic()" aria-label="Toggle Musik">
    ♫
  </button>
  @endif

  <script>
    // Navigation toggle
    const menu = document.getElementById('menu');
    const links = document.getElementById('links');
    if (menu && links) menu.addEventListener('click', () => links.classList.toggle('open'));

    // Countdown
    const eventTimeStr = "{{ $eventDate }}T{{ $eventTime }}:00";
    const weddingDate = new Date(eventTimeStr).getTime() || new Date("2026-12-20T08:00:00+07:00").getTime();
    function tick() {
      let d = Math.max(0, weddingDate - Date.now());
      [['days', 86400000], ['hours', 3600000], ['minutes', 60000], ['seconds', 1000]].forEach(([id, unit], i) => {
        let e = document.getElementById(id);
        if (e) {
          let n = i === 0 ? Math.floor(d / unit) : i === 1 ? Math.floor(d / unit) % 24 : i === 2 ? Math.floor(d / unit) % 60 : Math.floor(d / unit) % 60;
          e.textContent = String(n).padStart(2, '0');
        }
      });
    }
    tick(); setInterval(tick, 1000);

    // Buka Undangan
    function openInvitation() {
      const cover = document.getElementById('coverOverlay');
      if (cover) {
        cover.classList.add('hidden-cover');
        document.body.classList.remove('is-locked');
      }
      playMusic();
    }

    // Music
    let isPlaying = false;
    function playMusic() {
      const audio = document.getElementById('weddingMusicPlayer');
      const btn = document.getElementById('floatingMusicBtn');
      if (audio) {
        audio.play().then(() => {
          isPlaying = true;
          if (btn) btn.classList.add('rotating');
        }).catch(() => {
          isPlaying = false;
        });
      }
    }
    function toggleMusic() {
      const audio = document.getElementById('weddingMusicPlayer');
      const btn = document.getElementById('floatingMusicBtn');
      if (!audio) return;
      if (isPlaying) {
        audio.pause();
        isPlaying = false;
        if (btn) btn.classList.remove('rotating');
      } else {
        audio.play();
        isPlaying = true;
        if (btn) btn.classList.add('rotating');
      }
    }

    // Accordion Gift
    function toggleGiftAccordion(btn) {
      const content = document.getElementById('gift-accordion-content');
      if (content) {
        content.classList.toggle('hidden');
        const label = btn.querySelector('.gift-btn-label');
        if (label) {
          label.textContent = content.classList.contains('hidden') 
            ? 'Buka Rekening & Hadiah' 
            : 'Tutup Rekening';
        }
      }
    }

    // Toast & Clipboard
    function showToast(msg) {
      const toast = document.getElementById('toastCopy');
      if (toast) {
        toast.textContent = msg;
        toast.classList.add('show');
        setTimeout(() => toast.classList.remove('show'), 1800);
      }
    }
    function copyGift(elId) {
      const el = document.getElementById(elId);
      if (el) {
        let text = el.textContent.replace(/\s/g, '');
        navigator.clipboard.writeText(text).then(() => {
          showToast('Nomor Rekening Tersalin ✓');
        }).catch(() => {
          showToast('Nomor: ' + text);
        });
      }
    }
    function copyText(elId) {
      const el = document.getElementById(elId);
      if (el) {
        let text = el.textContent.trim();
        navigator.clipboard.writeText(text).then(() => {
          showToast('Alamat Tersalin ✓');
        }).catch(() => {
          showToast('Alamat: ' + text);
        });
      }
    }

    // Lightbox
    const light = document.getElementById('lightbox');
    if (light) {
      document.querySelectorAll('.photo').forEach(b => b.addEventListener('click', () => {
        light.querySelector('img').src = b.dataset.src;
        light.classList.add('open');
      }));
      document.getElementById('close').addEventListener('click', () => light.classList.remove('open'));
      light.addEventListener('click', e => { if (e.target === light) light.classList.remove('open'); });
    }

    // RSVP Fallback
    const form = document.getElementById('rsvpForm');
    const w = document.getElementById('wishes');
    if (form && w) {
      form.addEventListener('submit', e => {
        const action = form.getAttribute('action');
        if (!action || action === '#') {
          e.preventDefault();
          let d = new FormData(form), a = document.createElement('article');
          a.className = 'wish';
          let b = document.createElement('b');
          b.textContent = (d.get('name') || 'Tamu Undangan') + ' · ' + (d.get('attendance') || 'Hadir');
          let p = document.createElement('p');
          p.textContent = d.get('message') || 'Terima kasih atas undangan dan doa baiknya.';
          a.append(b, p);
          w.prepend(a);
          form.reset();
          showToast('Ucapan terkirim (Demo) ✓');
        }
      });
    }
  </script>
</body>
</html>