/* App download bottom sheet (js/app-promo.js) */
.app-promo{
	--ap-paper:#fffaf2; --ap-ink:#2a2018; --ap-ink-2:#6b5946; --ap-line:#eadfcd;
	--ap-gold:#d4b073; --ap-brown:#7d5c3c; --ap-espresso:#2b1d12; --ap-pill:#f4eadb;
	position:fixed; inset:0; z-index:10060;
	font-family:'IBM Plex Sans Arabic','Noto Naskh Arabic',Tahoma,sans-serif;
	direction:rtl; text-align:right;
}
body.night .app-promo{
	--ap-paper:#1d1712; --ap-ink:#f1e6d4; --ap-ink-2:#c3b29a; --ap-line:#3a2e22;
	--ap-pill:#2b221a;
}
.app-promo-backdrop{
	position:absolute; inset:0;
	background:rgba(28,19,11,.5);
	opacity:0; transition:opacity .3s ease;
	-webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px);
}
.app-promo-sheet{
	position:absolute; left:0; right:0; bottom:0;
	max-width:520px; margin:0 auto;
	padding:14px 20px calc(18px + env(safe-area-inset-bottom, 0px));
	background:
		radial-gradient(120% 70% at 100% 0, rgba(212,176,115,.22), transparent 60%),
		var(--ap-paper);
	color:var(--ap-ink);
	border-radius:24px 24px 0 0;
	box-shadow:0 -18px 50px -12px rgba(43,29,18,.45);
	transform:translateY(105%);
	transition:transform .42s cubic-bezier(.2,.9,.25,1);
	box-sizing:border-box;
}
.app-promo.is-open .app-promo-backdrop{ opacity:1; }
.app-promo.is-open .app-promo-sheet{ transform:translateY(0); }

.app-promo-handle{
	display:block; width:42px; height:5px; margin:0 auto 12px;
	border-radius:5px; background:var(--ap-line);
}
.app-promo-x{
	position:absolute; top:14px; left:14px;
	width:34px; height:34px; padding:0;
	display:flex; align-items:center; justify-content:center;
	border:0; border-radius:50%;
	background:var(--ap-pill); color:var(--ap-ink-2); cursor:pointer;
}
.app-promo-x svg{ width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; }

.app-promo-head{ display:flex; align-items:center; gap:14px; margin:4px 0 12px; padding-left:40px; }
.app-promo-icon{
	flex:0 0 auto; width:64px; height:64px;
	border-radius:16px; background:#fff;
	box-shadow:0 8px 20px -8px rgba(43,29,18,.45), 0 0 0 1px rgba(43,29,18,.06);
	object-fit:contain; padding:4px; box-sizing:border-box;
}
.app-promo-title{
	margin:0 0 4px; padding:0;
	font-family:inherit; font-size:20px; font-weight:700; line-height:1.35;
	color:var(--ap-ink); letter-spacing:0;
}
.app-promo-rating{ margin:0; font-size:13.5px; color:var(--ap-ink-2); line-height:1.5; }
.app-promo-rating span{ color:#c9962f; }
.app-promo-desc{ margin:0 0 12px; font-size:15px; line-height:1.8; color:var(--ap-ink-2); }

.app-promo-pills{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 18px; padding:0; list-style:none; }
.app-promo-pills li{
	padding:5px 12px 5px 14px; border-radius:999px;
	background:var(--ap-pill); border:1px solid var(--ap-line);
	font-size:13px; font-weight:600; color:var(--ap-ink); line-height:1.6;
}
.app-promo-pills li:before{ content:"✓"; margin-left:6px; color:var(--ap-brown); font-weight:700; }
body.night .app-promo-pills li:before{ color:var(--ap-gold); }

.app-promo-cta{
	display:flex; flex-direction:column; align-items:center; justify-content:center;
	width:100%; min-height:54px; padding:10px 16px; box-sizing:border-box;
	border-radius:16px;
	background:linear-gradient(135deg, var(--ap-espresso), #5a3f27);
	color:#fff8ec !important; text-decoration:none !important;
	font-size:17px; font-weight:700; line-height:1.3;
	box-shadow:0 12px 24px -12px rgba(43,29,18,.7), inset 0 1px 0 rgba(255,255,255,.12);
}
.app-promo-cta small{ font-size:12px; font-weight:500; color:var(--ap-gold-soft, #e9d3a6); opacity:.9; }
body.night .app-promo-cta{ background:linear-gradient(135deg, #d4b073, #b48b4f); color:#24180e !important; }
body.night .app-promo-cta small{ color:#3a2819; }
.app-promo-cta:focus-visible, .app-promo-later:focus-visible, .app-promo-x:focus-visible{
	outline:3px solid var(--ap-gold); outline-offset:2px;
}
.app-promo-later{
	display:block; width:100%; margin-top:6px; padding:10px;
	background:transparent; border:0; cursor:pointer;
	font-family:inherit; font-size:15px; color:var(--ap-ink-2);
}

@media (prefers-reduced-motion: reduce){
	.app-promo-sheet, .app-promo-backdrop{ transition:none; }
}
@media (min-width:600px){
	.app-promo-sheet{ bottom:16px; border-radius:24px; padding-bottom:20px; }
}