/* „მასკოტი“ — მობილური აპი: „დააყენე აპი“ ზოლი, ბლოკი მშობლებისთვის, აპის რეჟიმი. */

.mascot-app-banner {
	position: fixed; z-index: 99990; left: 12px; right: 12px;
	bottom: calc(12px + env(safe-area-inset-bottom, 0px));
	display: flex; align-items: center; gap: 12px; padding: 12px 12px 12px 14px;
	background: var(--m-deep, #3A3E85); color: #fff; border-radius: 22px;
	box-shadow: 0 14px 40px rgba(20, 22, 60, .45), inset 0 0 0 1.5px rgba(255, 255, 255, .14);
	font: 500 15px/1.35 var(--m-font-body, var(--font, system-ui, sans-serif));
	animation: mascot-app-up .35s ease-out both;
}
.mascot-app-banner img { flex: none; width: 52px; height: 52px; border-radius: 14px; }
.mascot-app-banner__copy { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
html body .mascot-app-banner__copy strong { font: 700 16px/1.25 var(--m-font-head, var(--font, inherit)); color: #fff; }
.mascot-app-banner__copy span { opacity: .88; }
.mascot-app-banner .mascot-btn { flex: none; padding: 11px 18px; font-size: 16px; }
.mascot-app-banner__x {
	flex: none; width: 36px; height: 36px; border: 0; border-radius: 50%; padding: 0;
	background: rgba(255, 255, 255, .12); color: #fff; font: 400 24px/36px system-ui, sans-serif; cursor: pointer;
}
.mascot-app-banner__x:focus-visible { outline: 3px solid var(--m-blue, #26CAEF); outline-offset: 2px; }
html.mascot-has-app-banner body { padding-bottom: 96px; }
@keyframes mascot-app-up { from { transform: translateY(120%); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .mascot-app-banner { animation: none; } }
@media (max-width: 560px) {
	.mascot-app-banner { flex-wrap: wrap; row-gap: 10px; }
	.mascot-app-banner__copy { flex-basis: calc(100% - 124px); }
	.mascot-app-banner .mascot-btn { order: 4; flex: 1 1 100%; justify-content: center; }
}

/* ღილაკი: ლენდინგზე mascot-core.css არ იტვირთება, ამიტომ სტილი აქაცაა. */
.mascot-app-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 22px; border: 0; border-radius: 999px;
	background: var(--m-yellow, #FFD43B); color: var(--m-ink, #23264F) !important; font: 700 16px/1.2 var(--m-font-body, var(--font, system-ui, sans-serif));
	cursor: pointer; text-decoration: none; box-shadow: 0 6px 0 -1px rgba(0, 0, 0, .2); transition: transform .15s ease;
}
.mascot-app-btn:hover { transform: translateY(-2px); }
.mascot-app-btn:focus-visible { outline: 3px solid var(--m-blue, #26CAEF); outline-offset: 3px; }
.mascot-app-btn--ghost { background: transparent; box-shadow: inset 0 0 0 1.5px rgba(35, 38, 79, .3); }
.mascot-app-install [hidden] { display: none !important; }

/* მშობლის კარიბჭე ლენდინგზე */

/* [mascot_app_install] */
.mascot-app-install {
	display: flex; gap: 20px; align-items: flex-start; margin: 32px 0; padding: 22px;
	border-radius: 24px; background: rgba(71, 80, 149, .08); box-shadow: inset 0 0 0 1.5px rgba(71, 80, 149, .18);
}
.mascot-app-install img { flex: none; width: 72px; height: 72px; border-radius: 18px; }
.mascot-app-install h2 { margin: 0 0 6px; }
.mascot-app-install p { margin: 0 0 8px; }
.mascot-app-install .mascot-actions { margin-top: 14px; }
.mascot-app-install__how { font-weight: 600; }
body.mascot-kids-zone .mascot-app-install { background: rgba(255, 255, 255, .08); box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .18); }
@media (max-width: 560px) { .mascot-app-install { flex-direction: column; } }

/* აპის რეჟიმი: დაყენების შეთავაზება აღარ ჩანს. */
html.mascot-standalone .mascot-app-install { display: none; }

/* Play-ის აპი: გამოწერა და ფასები არ ჩანს (Google Play-ის წესი). */
.mascot-app-hidden,
html.mascot-in-play .mascot-plan--plus,
html.mascot-in-play .mascot-plan__price { display: none !important; }
.mascot-app-nobuy-page { max-width: 640px; margin: 48px auto; padding: 0 16px; }

/* კომპიუტერზე: „მასკოტი ტელეფონზე“ ღილაკი და QR კოდი */
.mascot-app-pill {
	position: fixed; z-index: 99980; right: 20px; bottom: 20px;
	display: flex; align-items: center; gap: 4px; padding: 6px 6px 6px 8px;
	background: var(--m-deep, #3A3E85); border-radius: 999px;
	box-shadow: 0 12px 32px rgba(20, 22, 60, .4), inset 0 0 0 1.5px rgba(255, 255, 255, .16);
	animation: mascot-app-up .35s ease-out both;
}
.mascot-app-pill__go {
	display: flex; align-items: center; gap: 10px; border: 0; background: transparent; cursor: pointer;
	padding: 2px 12px 2px 0; color: #fff; font: 700 16px/1.2 var(--m-font-body, var(--font, system-ui, sans-serif));
}
.mascot-app-pill__go img { width: 34px; height: 34px; border-radius: 10px; }
.mascot-app-pill__go:hover span { text-decoration: underline; text-underline-offset: 3px; }
.mascot-app-pill__go:focus-visible, .mascot-app-pill__x:focus-visible { outline: 3px solid var(--m-blue, #26CAEF); outline-offset: 2px; border-radius: 999px; }
.mascot-app-pill__x {
	width: 30px; height: 30px; border: 0; border-radius: 50%; padding: 0; cursor: pointer;
	background: rgba(255, 255, 255, .12); color: #fff; font: 400 20px/30px system-ui, sans-serif;
}
.mascot-app-qr-modal {
	position: fixed; inset: 0; z-index: 99995; display: flex; align-items: center; justify-content: center; padding: 16px;
	background: rgba(20, 22, 60, .6);
}
.mascot-app-qr-modal__box {
	position: relative; width: 100%; max-width: 420px; padding: 28px 28px 22px; border-radius: 28px; text-align: center;
	background: var(--m-deep, #3A3E85); color: #fff; font: 500 16px/1.5 var(--m-font-body, var(--font, system-ui, sans-serif));
	box-shadow: 0 24px 60px rgba(0, 0, 0, .35), inset 0 0 0 1.5px rgba(255, 255, 255, .14);
}
.mascot-app-qr-modal__box .mascot-app-banner__x { position: absolute; top: 14px; right: 14px; }
.mascot-app-qr-modal__icon { width: 64px; height: 64px; border-radius: 18px; }
html body .mascot-app-qr-modal__box h2 { margin: 10px 0 6px; color: #fff; font: 700 24px/1.25 var(--m-font-head, var(--font, inherit)); text-transform: none; letter-spacing: 0; }
html body .mascot-app-qr-modal__box p { margin: 0 0 16px; opacity: .92; font-size: 16px; line-height: 1.5; }
.mascot-app-qr { display: inline-block; padding: 14px; background: #fff; border-radius: 20px; line-height: 0; }
.mascot-app-qr img, .mascot-app-qr canvas { display: block; width: 184px; height: 184px; }
.mascot-app-qr__url { margin: 0; padding: 8px; color: #23264F; font-weight: 700; line-height: 1.4; }
html body .mascot-app-qr__steps { margin: 16px 0 0; padding: 0; list-style: none; text-align: left; font-size: 15px; }
.mascot-app-qr__steps li { margin: 6px 0; padding-left: 26px; position: relative; }
.mascot-app-qr__steps li::before { content: "★"; position: absolute; left: 4px; color: var(--m-yellow, #FFD43B); }
.mascot-app-install__qr { margin-top: 10px; }
.mascot-app-install__qr .mascot-app-qr { box-shadow: inset 0 0 0 1.5px rgba(35, 38, 79, .12); }
@media print { .mascot-app-pill, .mascot-app-banner { display: none !important; } }

/* ?mascot_app_check=1 */
.mascot-app-check { text-align: left; }
.mascot-app-check dl { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; margin: 12px 0 18px; font-size: 15px; }
.mascot-app-check dt { opacity: .75; }
.mascot-app-check dd { margin: 0; font-weight: 700; }
html body .mascot-app-check .mascot-app-check__note { font-size: 13px; opacity: .75; margin: 10px 0 0; }
