/* afrah-fs-092 */ /* afrah-fs-092c */
/* صفحة العرس 2.8 — «بيت العرس» و«السهرة»، وفرحة هي الزر. Loaded after wedding-noir.css. */
.wn-s-night{--bg:#070B22;--s1:#0E1438;--s2:#141C4A;--ln:#1E2758;--ln2:#283266;--ln3:#2F3A73;--t2:#D4D8F2;--mu:#9EA4C8}
.wn-s-night,html:has(.wn-s-night){background:#070B22}
.wn-s-house{--s1:#17120D;--ln3:#4A3D24}

/* ---------- the opening: knock on the door / tap the moon ---------- */
.wn-in2{position:fixed;inset:0;z-index:90;display:grid;place-items:center;background:#000;overflow:hidden;transition:opacity .6s}
.wn-in2 .wn-skbg{position:absolute;inset:0;background-size:cover;background-position:center;transform-origin:51% 66%;transition:transform 1.8s cubic-bezier(.6,.05,.3,1)}
.wn-s-night .wn-in2 .wn-skbg{transform-origin:24% 14%}
.wn-in2 .wn-flash{position:absolute;inset:0;background:radial-gradient(circle at 50% 62%,#fff4cf,#f3c46c 45%,rgba(243,196,108,0) 75%);opacity:0;transition:opacity .7s .9s;pointer-events:none}
.wn-s-night .wn-in2 .wn-flash{background:radial-gradient(circle at 24% 14%,#fff7dc,#f0d79c 35%,rgba(11,18,48,0) 75%)}
.wn-knock{position:absolute;left:50%;top:69%;transform:translate(-50%,-50%);width:96px;height:96px;border-radius:50%;border:0;background:none;cursor:pointer;color:#fff4dc;padding:0}
.wn-s-night .wn-knock{left:24%;top:14%;width:84px;height:84px}
.wn-knock i,.wn-knock::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(255,236,190,.9);animation:wnk 2.2s infinite}
.wn-knock::after{animation-delay:1.1s}
.wn-knock span{position:absolute;top:100%;left:50%;transform:translateX(-50%);margin-top:4px;white-space:nowrap;font:800 13px/1.4 'Zain',sans-serif;text-shadow:0 1px 8px rgba(0,0,0,.9)}
@keyframes wnk{0%{transform:scale(.5);opacity:1}100%{transform:scale(1.4);opacity:0}}
.wn-in2 em{position:absolute;top:8%;inset-inline:0;text-align:center;font:700 37px/1.15 'Aref Ruqaa',serif;font-style:normal;color:#4a2d18;text-shadow:0 1px 0 rgba(255,240,210,.7);transition:opacity .5s}
.wn-s-night .wn-in2 em{top:22%;color:var(--gl);text-shadow:0 0 18px rgba(240,215,156,.55)}
.wn-in2 .wn-wel{position:absolute;inset:0;display:grid;place-content:center;font:700 31.5px/1.3 'Aref Ruqaa',serif;color:#4a2d18;opacity:0;transition:opacity .6s 1.4s;pointer-events:none}
.wn-s-night .wn-in2 .wn-wel{color:#1b2154}
.wn-in2.in .wn-skbg{transform:scale(3.3)}
.wn-in2.in .wn-flash,.wn-in2.in .wn-wel{opacity:1}
.wn-in2.in .wn-knock,.wn-in2.in em{opacity:0}
.wn-in2.out{opacity:0;pointer-events:none}
html.wn-noin .wn-in2{display:none}

/* ---------- the invitation card ---------- */
.wn-s-house .wn-card{border-radius:120px 120px 10px 10px;border-color:#5a4a2c;background:repeating-linear-gradient(0deg,transparent 0 46px,rgba(120,90,55,.18) 46px 47px),linear-gradient(180deg,#efe3cc,#d8c5a3);color:#4a3424;box-shadow:inset 0 0 0 6px rgba(255,255,255,.22),inset 0 0 0 7px rgba(140,105,60,.4),0 24px 50px rgba(0,0,0,.6);padding-top:56px}
.wn-s-house .wn-card .wn-hosts,.wn-s-house .wn-card .wn-insh,.wn-s-house .wn-card .wn-when{color:#5b4330}
.wn-s-house .wn-card .wn-hosts b{color:#3b2414}
.wn-s-house .wn-names{color:#3b2414;background:none;-webkit-text-fill-color:#3b2414}
.wn-s-house .wn-names span{color:#3b2414;-webkit-text-fill-color:#3b2414;background:none}
.wn-s-house .wn-names svg{fill:#b3263a}
.wn-s-house .wn-card .wn-c{display:none}
.wn-s-house .wn-cd>div{background:linear-gradient(180deg,#e4d4b5,#cdb68f);border-color:transparent;color:#3b2414;box-shadow:inset 0 -2px 0 rgba(90,60,30,.25)}
.wn-s-house .wn-cd b{color:#3b2414;-webkit-text-fill-color:#3b2414;background:none}
.wn-s-house .wn-cd small,.wn-s-house .wn-date *{color:#6b4f35}
.wn-s-night .wn-card{border-color:#3a4688;background:radial-gradient(120% 60% at 50% 0,rgba(240,215,156,.12),transparent 60%),linear-gradient(180deg,#141c4a,#0b1131);box-shadow:0 0 0 1px rgba(240,215,156,.2),0 24px 50px rgba(0,0,0,.6)}
.wn-s-night .wn-cfl{opacity:.45;filter:hue-rotate(195deg) saturate(.6) brightness(1.2)}
.wn-s-night .wn-cd>div{background:rgba(240,215,156,.08);border-color:rgba(240,215,156,.22)}
.wn-moon{display:block;width:92px;height:92px;margin:10px auto 2px;border-radius:50%;background:radial-gradient(circle at 40% 38%,#fff7dc,#f0d79c 55%,#c9a45c);box-shadow:0 0 34px rgba(240,215,156,.45);position:relative;overflow:hidden}
.wn-moon::after{content:"";position:absolute;inset:0;border-radius:50%;background:#0b1131;transform:translateX(var(--ph,40%))}

/* the cover in «بيت العرس»/«السهرة» */
.wn-s-house .wn-cv::after,.wn-s-night .wn-cv::after{content:"";position:absolute;inset:auto 0 0;height:45%;background:linear-gradient(transparent,var(--bg));z-index:1;pointer-events:none}

/* ---------- Farha is the button ---------- */
.wn-zg-btn{border:0;padding:0;cursor:pointer;transition:transform .2s}
.wn-zg-btn:active{transform:scale(.97)}
.wn-zg-btn::after{content:"اكبسوا عليّ";position:absolute;bottom:14px;inset-inline-end:14px;font:800 11px/1 'Zain',sans-serif;color:#2a1d0e;background:var(--gl);border-radius:999px;padding:5px 10px;box-shadow:0 0 0 0 rgba(232,207,138,.6);animation:wnpl 1.8s infinite}
@keyframes wnpl{70%{box-shadow:0 0 0 10px rgba(232,207,138,0)}100%{box-shadow:0 0 0 0 rgba(232,207,138,0)}}
.wn-hint{margin:2px 0 0;text-align:center;font-size:11.5px;color:var(--gl);font-weight:700}
.wn-bub{margin:10px auto 6px;max-width:300px;background:rgba(255,250,240,.96);color:#3a2a1c;border-radius:16px 16px 16px 4px;padding:8px 14px;font-size:14px;line-height:1.5;text-align:center;box-shadow:0 8px 20px rgba(0,0,0,.25)}
.wn-s-night .wn-bub{background:#1d2766;color:#eef0ff;border:1px solid rgba(240,215,156,.3)}
.wn-lnk{background:none;border:0;padding:2px 0;font:700 12px/1.4 'Zain',sans-serif;color:var(--gl);cursor:pointer;text-decoration:none;background-image:linear-gradient(currentColor,currentColor);background-size:0 1px;background-repeat:no-repeat;background-position:100% 100%;transition:background-size .3s}
.wn-lnk:hover{background-size:100% 1px}

/* RSVP: Farha holds the envelope; the wax seal says «Confirm» */
.wn-rs{margin:30px 16px 0;padding:20px 16px 18px;border-radius:24px;background:radial-gradient(100% 60% at 50% 0%,#2e2116,#120d09);border:1px solid var(--ln3);text-align:center}
.wn-s-night .wn-rs{background:radial-gradient(100% 60% at 50% 0%,#1c2766,#090d24)}
.wn-env{display:block;margin:0 auto;border:0;background:none;padding:0;cursor:pointer;transition:transform .2s}
.wn-env img{width:200px;height:auto;filter:drop-shadow(0 10px 18px rgba(0,0,0,.45))}
.wn-env:hover{transform:translateY(-3px)}
.wn-rs.open .wn-env{width:110px;margin-bottom:-6px}
.wn-rs.open .wn-env img{width:110px}
.wn-rsf{display:grid;gap:10px;justify-items:center;margin-top:8px;animation:wnup .5s both}
@keyframes wnup{from{opacity:0;transform:translateY(10px)}}
.wn-rsf .wn-f{display:grid;gap:4px;width:100%;text-align:start;font-size:11.5px;color:var(--mu);font-weight:700}
.wn-rsf .wn-f input{border:0;border-bottom:1px solid rgba(232,207,138,.45);background:transparent;color:var(--tx);font:inherit;font-size:15.5px;padding:4px 2px}
.wn-rsf .wn-tk-n{width:100%;margin:0}
.wn-rsf .wn-tk-n label{color:var(--tx);border-color:rgba(232,207,138,.35);height:34px}
.wn-rsf .wn-tk-n button{background:transparent;border:1px solid rgba(232,207,138,.5);color:var(--gl)}
.wn-rsf .wn-tk-n input{color:var(--tx)}
.wn-sealb{position:relative;width:118px;height:118px;border:0;background:none;padding:0;cursor:pointer;transition:transform .25s}
.wn-sealb img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 14px rgba(0,0,0,.5))}
.wn-sealb span{position:absolute;inset:0;display:grid;place-content:center;font:italic 600 21px/1 'Cormorant Garamond','Times New Roman',Georgia,serif;letter-spacing:.02em;color:rgba(255,228,228,.9);text-shadow:0 -1px 0 rgba(0,0,0,.45),0 1px 0 rgba(255,255,255,.22)}
.wn-s-night .wn-sealb span{color:rgba(80,52,14,.85);text-shadow:0 1px 0 rgba(255,240,200,.6)}
.wn-sealb:hover{transform:rotate(-4deg) scale(1.04)}
.wn-sealb.pr{animation:wnpress .6s}
@keyframes wnpress{40%{transform:scale(.85)}}
.wn-sealb:disabled{opacity:.7}

/* Wishes: Farha flies them */
.wn-wrow{display:grid!important;grid-template-columns:minmax(0,1fr) 84px;align-items:end;gap:8px}
.wn-plane{border:0;background:none;padding:0;cursor:pointer;transition:transform .2s}
.wn-plane img{width:84px;height:auto}
.wn-plane:hover{transform:translateY(-3px) rotate(-3deg)}
.wn-fly{position:fixed;z-index:95;width:46px;pointer-events:none;animation:wnfly 1.6s ease-in forwards}
@keyframes wnfly{to{transform:translate(-240px,-320px) rotate(-25deg);opacity:0}}
.wn-s-night .wn-wl figure{border-radius:14px 14px 22px 22px;background:radial-gradient(circle at 50% 75%,#fff3c4,#f7b54d 60%,#c46a1d);color:#4a2a0c;box-shadow:0 0 26px rgba(247,181,77,.55);border:0}
.wn-s-night .wn-wl figure blockquote,.wn-s-night .wn-wl figure figcaption{color:#4a2a0c}

/* Venue: two Farha tiles */
.wn-duo{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.wn-ft{display:grid;justify-items:center;gap:2px;border-radius:18px;padding:8px 4px 10px;background:linear-gradient(180deg,rgba(232,207,138,.08),rgba(232,207,138,.02));border:1px solid rgba(232,207,138,.18);color:var(--tx);text-decoration:none;cursor:pointer;font:inherit;transition:transform .2s}
.wn-ft:hover{transform:translateY(-3px)}
.wn-ft img{width:92px;height:auto;max-height:120px;object-fit:contain}
.wn-ft b{font-size:13px;color:var(--gl)}
.wn-ft small{font-size:10.5px;color:var(--mu)}
.wn-share-l{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;color:var(--mu)}

/* the story card we draw is shown here before sharing */
.wn-st{position:fixed;inset:0;z-index:96;display:grid;place-items:center;background:rgba(0,0,0,.78);padding:16px}
.wn-st[hidden]{display:none}
.wn-st-b{display:grid;gap:10px;justify-items:center;max-width:320px;width:100%}
.wn-st img{width:100%;max-width:280px;border-radius:16px;box-shadow:0 20px 40px rgba(0,0,0,.6)}
.wn-st .wn-st-a{display:flex;gap:12px;align-items:center}
.wn-st .wn-go{border:1px solid rgba(232,207,138,.6);background:rgba(232,207,138,.1);color:var(--gl);border-radius:16px 16px 4px 16px;padding:6px 16px;font:800 13px/1.4 'Zain',sans-serif;cursor:pointer}

/* everything slimmer (the new button system) */
.wn .wn-btn{height:auto;padding:6px 14px;font-size:11.5px}
.wn-bar a,.wn-bar button{min-height:38px;font-size:10px}
.wn-chips a{font-size:11px}
@media (prefers-reduced-motion:reduce){.wn-knock i,.wn-knock::after,.wn-zg-btn::after{animation:none}.wn-in2 .wn-skbg{transition:none}}
.wn-s-night .wn-letter{background:linear-gradient(180deg,#18225a,#0f1640);color:#eef0ff;border:1px solid rgba(240,215,156,.25)}
.wn-s-night .wn-letter .wn-ruq,.wn-s-night .wn-letter .wn-sig{color:var(--gl)}
.wn-s-night .wn-letter p{color:#dfe3ff}
html,body{overflow-x:clip}
