/* ==========================================================
   DInvite — Tema "Islami Sakinah" (tanpa foto)
   Gading, hijau zamrud & emas. Pembuka: daun pintu masyrabiyah yang
   berayun terbuka, lentera gantung yang berpendar, masjid & bulan sabit
   berkilau, basmalah, dan pola bintang delapan.
   Semua foto disembunyikan oleh undangan.php ('no_photo' di includes/themes.php).
   Gerak dimatikan otomatis bila perangkat meminta gerak minimal.
   ========================================================== */
.t-islami {
    --bg: #fbf7ee; --bg-2: #f3ecdb; --card: #fffdf8; --ink: #173a33; --muted: #5f7069;
    --accent: #0f5a4a; --accent-2: #b98d3e; --on-accent: #fffdf8; --line: rgba(185,141,62,.32);
    --hero-rgb: 251,247,238; --tint-a: .86; --hero-ink: #173a33;
    --pattern: url(../../img/themes/islami/pola.svg) 0 0 / 60px 60px;
    --am-seam: linear-gradient(#f1d88f, #b98d3e, #f1d88f);
    color-scheme: light;
}
@keyframes isRise { from { opacity: 0; transform: translateY(24px) scale(.97); } }
@keyframes isFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes isShine { 0%, 60% { transform: translateX(-120%) skewX(-18deg); } 100% { transform: translateX(220%) skewX(-18deg); } }
@keyframes isGlow { 0%, 100% { text-shadow: 0 0 0 rgba(241,216,143,0); } 50% { text-shadow: 0 0 18px rgba(214,170,80,.45); } }
@keyframes isSpin { to { transform: rotate(360deg); } }

/* Huruf: Amiri untuk judul & tulisan Arab, nama bersambung anggun */
.t-islami .names { font-family: 'Pinyon Script', 'Great Vibes', cursive; font-weight: 400; color: var(--ink); }
.t-islami .names i { font-family: 'Amiri', serif; font-style: normal; font-size: .42em; color: var(--accent-2); vertical-align: middle; }
.t-islami .cover .names { font-size: clamp(3rem, 12.5vw, 4.5rem); line-height: 1.2; }
.t-islami .names--md { color: var(--accent); }
.t-islami .kicker { font-family: 'Amiri', serif; font-weight: 700; font-size: .82rem; letter-spacing: .26em; color: var(--accent-2); }
.t-islami .sec__title { font-family: 'Amiri', serif; font-weight: 700; font-size: 1.9rem; color: var(--accent); }
.t-islami .sec__title::after { content: ''; display: block; width: 220px; height: 36px; margin: .4rem auto 0; background: url(../../img/themes/islami/pembatas.svg) center / contain no-repeat; }
.t-islami .reveal .sec__title::after { transform: scaleX(.2); opacity: 0; transition: transform 1.2s cubic-bezier(.2,.7,.2,1) .25s, opacity 1s ease .25s; }
.t-islami .reveal.is-visible .sec__title::after { transform: none; opacity: 1; }
.t-islami .cover__date, .t-islami .hero__date, .t-islami .aside__date, .t-islami .thanks, .t-islami .countdown__date { font-family: 'Amiri', serif; font-style: italic; color: var(--accent); }
.t-islami .cover__to strong { font-family: 'Amiri', serif; font-weight: 700; color: var(--accent); }
.t-islami .quote { font-family: 'Amiri', serif; font-style: italic; font-size: 1.15rem; line-height: 1.85; color: var(--ink); }

/* Basmalah & doa (disisipkan islami.js) */
.isl-basmalah { margin: 0 0 .2rem; font-family: 'Amiri', serif; font-size: clamp(1.45rem, 6.4vw, 1.9rem); line-height: 1.6; color: var(--accent-2); animation: isGlow 5s ease-in-out infinite; }
.aside .isl-basmalah { font-size: 2.1rem; }
.isl-doa { margin: .1rem 0 .5rem; font-family: 'Amiri', serif; font-size: 1.45rem; color: var(--accent-2); }

/* Sampul: pintu masyrabiyah, lentera, masjid */
.t-islami .am-panel::before { background: url(../../img/themes/islami/pintu.svg) right center / auto 100% no-repeat, #0d4f41; }
.t-islami .cover::before { inset: 18px; border: 1.5px solid var(--line); border-radius: 0; z-index: 1; }
.t-islami .cover::after { inset: 25px; border: 1px solid rgba(185,141,62,.2); border-radius: 0; z-index: 1; opacity: 1; }
.t-islami .cover, .t-islami .page { background-color: var(--bg); background-image: var(--pattern); }
.t-islami .cover__inner { width: min(330px, calc(100vw - 64px)); gap: .75rem; padding: 1.7rem 1.2rem 1.5rem; border-radius: 170px 170px 16px 16px; background: var(--pattern), linear-gradient(#fffdf8, #fbf6ea);
    border: 1.5px solid #c79b45; box-shadow: inset 0 0 0 6px #fffdf8, inset 0 0 0 7px rgba(185,141,62,.45), 0 24px 50px -20px rgba(5,40,32,.65); }
.t-islami .cover__to { margin: .6rem 0 .5rem; }
@media (min-width: 960px) { .t-islami .cover__inner { width: 380px; } }
@media (max-height: 700px) { .t-islami .cover .tm-house { width: 110px; } .t-islami .cover__inner { padding-top: 1.2rem; gap: .5rem; } }
.t-islami .tm-band { display: none; }
.t-islami .tm-corner { width: clamp(62px, 17vw, 100px); }
.t-islami .tm-frame { z-index: 1; }
.t-islami .tm-house { filter: drop-shadow(0 14px 22px rgba(23,58,51,.18)); }
.t-islami .cover .tm-house { width: min(150px, 40vw); animation: isRise 1.4s ease both, isFloat 6s ease-in-out 1.4s infinite; }
.t-islami .hero .tm-house { width: min(170px, 46vw); }
.t-islami .aside .tm-house { width: 210px; }
.t-islami .tm-house--sm { width: 110px; }
.t-islami .am-garland { height: clamp(78px, 24vw, 128px); background-size: auto 100%; opacity: .95; }
.t-islami .cover .isl-basmalah { animation: isRise 1.1s ease .25s both, isGlow 5s ease-in-out 1.5s infinite; }
.t-islami .cover .kicker { animation: isRise 1.1s ease .4s both; }
.t-islami .cover .names { animation: isRise 1.2s ease .6s both; }
.t-islami .cover__date { animation: isRise 1.1s ease .85s both; }
.t-islami .cover__to { animation: isRise 1.1s ease 1.05s both; }
.t-islami .cover .ibtn { animation: isRise 1.1s ease 1.25s both; }

/* Bagian pembuka & panel kiri: cahaya keemasan lembut dengan bintang delapan berputar perlahan */
.t-islami .hero, .t-islami .aside {
    background: radial-gradient(ellipse at 50% 40%, rgba(241,216,143,.28), transparent 62%), var(--pattern), var(--bg);
    overflow: hidden;
}
.t-islami .hero::before { content: ''; position: absolute; left: 50%; top: 50%; width: 560px; height: 560px; margin: -280px 0 0 -280px; pointer-events: none; opacity: .5;
    background: conic-gradient(from 0deg, transparent 0 10deg, rgba(185,141,62,.08) 10deg 12deg, transparent 12deg 45deg, rgba(185,141,62,.08) 45deg 47deg, transparent 47deg 90deg);
    border-radius: 50%; animation: isSpin 90s linear infinite; }

/* Kartu gading bergaris emas, sudut lengkung mihrab di atas */
.t-islami .event, .t-islami .gift, .t-islami .rsvp, .t-islami .wish, .t-islami .qr-card, .t-islami .lstory__card {
    border-radius: 10px; border: 1px solid var(--line); background: var(--card);
    box-shadow: inset 0 0 0 4px var(--card), inset 0 0 0 5px rgba(185,141,62,.2), 0 16px 32px -24px rgba(23,58,51,.4);
}
.t-islami .event { position: relative; overflow: hidden; border-radius: 120px 120px 12px 12px; padding-top: 2.6rem; }
.t-islami .event::before { inset: 8px; border: 1px solid rgba(185,141,62,.22); border-radius: 112px 112px 6px 6px; }
.t-islami .event::after { content: ''; position: absolute; top: 0; bottom: 0; left: 0; width: 40%; background: linear-gradient(90deg, transparent, rgba(241,216,143,.22), transparent); animation: isShine 8s ease-in-out infinite; pointer-events: none; }
.t-islami .event h3 { font-family: 'Amiri', serif; font-weight: 700; font-size: 1.6rem; color: var(--accent); }
.t-islami .reveal .event, .t-islami .reveal .gift, .t-islami .reveal .person { opacity: 0; transform: translateY(22px); transition: opacity 1s ease, transform 1s cubic-bezier(.2,.7,.2,1); }
.t-islami .reveal.is-visible .event, .t-islami .reveal.is-visible .gift, .t-islami .reveal.is-visible .person { opacity: 1; transform: none; }
.t-islami .reveal.is-visible .event:nth-child(2), .t-islami .reveal.is-visible .gift:nth-child(2), .t-islami .reveal.is-visible .person:nth-of-type(2) { transition-delay: .25s; }
.t-islami .countdown div { border-radius: 10px; background: var(--card); border-color: var(--line); box-shadow: inset 0 -3px 0 rgba(185,141,62,.5); }
.t-islami .countdown b { font-family: 'Amiri', serif; font-weight: 700; color: var(--accent); }
.t-islami .divider { background: var(--accent-2); }

/* Tombol hijau zamrud dengan kilau emas */
.t-islami .ibtn { border-radius: 999px; }
.t-islami .ibtn--solid { position: relative; overflow: hidden; background: linear-gradient(180deg, #1a7360, #0d4f41); border-color: #b98d3e; color: #fffdf8; box-shadow: 0 10px 24px -12px rgba(15,90,74,.75); }
.t-islami .ibtn--solid::after { content: ''; position: absolute; top: 0; bottom: 0; left: 0; width: 45%; background: linear-gradient(90deg, transparent, rgba(241,216,143,.5), transparent); animation: isShine 4.5s ease-in-out infinite 1.5s; pointer-events: none; }
.t-islami .ibtn--solid:hover { background: linear-gradient(180deg, #208470, #0f5a4a); color: #fffdf8; }

/* Mempelai tanpa foto: nama dalam medali bintang delapan */
.t-islami .couple { gap: 1.5rem; }
.t-islami .person { position: relative; padding: 1.4rem 1rem 1.2rem; border-radius: 16px; background: var(--card); border: 1px solid var(--line); box-shadow: 0 16px 32px -26px rgba(23,58,51,.45); }
.t-islami .person::before { content: ''; display: block; width: 48px; height: 48px; margin: 0 auto .7rem; background: url(../../img/themes/islami/pembatas.svg) center / 220px 36px no-repeat; }
.t-islami .person .names--md { color: var(--accent); }
.t-islami .amp { font-family: 'Amiri', serif; font-style: italic; color: var(--accent-2); }

/* Love story (tanpa foto), galeri tidak tampil */
.t-islami .lstory::before { background: linear-gradient(var(--accent-2), var(--line) 85%, transparent); }
.t-islami .lstory__dot { background: var(--accent); box-shadow: 0 0 0 4px var(--bg), 0 0 0 5px var(--line); }
.t-islami .lstory__title, .t-islami .tale__title { font-family: 'Amiri', serif; font-weight: 700; color: var(--accent); }
.t-islami .tale__text::first-letter { font-family: 'Amiri', serif; color: var(--accent-2); }
.t-islami .sec--tint { background-color: var(--bg-2); background-image: var(--pattern); }
.t-islami .tag--hadir { color: var(--accent); }

@media (prefers-reduced-motion: reduce) {
    .t-islami .reveal .event, .t-islami .reveal .gift, .t-islami .reveal .person { opacity: 1; transform: none; }
    .t-islami .reveal .sec__title::after { transform: none; opacity: 1; }
}