/* ================================================================
   PWA INSTALL BANNER — Listcell
   Banner sutil no rodapé para guiar a instalação do app.
   Aparece acima da bottom-nav em mobile; oculto em desktop.
================================================================ */

.lc-pwa-banner {
	position: fixed;
	bottom: calc(var(--nav-h, 64px) + env(safe-area-inset-bottom, 0px) + 10px);
	left: 12px;
	right: 12px;
	background: #ffffff;
	border-radius: 16px;
	border-top: 3px solid #ff7a1a;
	box-shadow:
		0 -1px 0 rgba(0, 0, 0, .05),
		0 6px 32px rgba(0, 0, 0, .14);
	padding: 12px 14px 12px 16px;
	display: flex;
	align-items: center;
	gap: 12px;
	z-index: 199;

	/* Estado inicial: invisível */
	opacity: 0;
	transform: translateY(22px);
	pointer-events: none;
	transition:
		opacity .3s ease,
		transform .38s cubic-bezier(.34, 1.56, .64, 1);
}

/* Estado visível */
.lc-pwa-banner.lc-pwa--visible {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

/* Desktop: browser já oferece instalação nativa na barra de endereço */
@media (min-width: 769px) {
	.lc-pwa-banner { display: none !important; }
}

/* Páginas de painel (sem bottom-nav móvel): ancorar direto no fundo */
body:has(.lc-panel-wrap) .lc-pwa-banner,
body:has(.lc-team-sidebar) .lc-pwa-banner {
	bottom: calc(env(safe-area-inset-bottom, 0px) + 12px);
}

/* ── Botão fechar ───────────────────────────────────────────────── */
.lc-pwa-close {
	position: absolute;
	top: 7px;
	right: 7px;
	background: none;
	border: none;
	color: #b0bec5;
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
	width: 26px;
	height: 26px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	padding: 0;
	transition: color .15s, background .15s;
	-webkit-tap-highlight-color: transparent;
}
.lc-pwa-close:hover  { color: #4a5568; background: #f1f5f9; }
.lc-pwa-close:active { background: #e2e8f0; }

/* ── Logo ───────────────────────────────────────────────────────── */
.lc-pwa-logo {
	width: 46px;
	height: 46px;
	border-radius: 11px;
	object-fit: contain;
	flex-shrink: 0;
	background: #f0f5ff;
	padding: 3px;
	border: 1px solid #e8edf5;
}

.lc-pwa-logo-fallback {
	width: 46px;
	height: 46px;
	border-radius: 11px;
	background: linear-gradient(135deg, #ff7a1a 0%, #f4511e 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	color: #fff;
	font-size: 21px;
}

/* ── Bloco de texto ─────────────────────────────────────────────── */
.lc-pwa-text {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 3px;
	padding-right: 18px; /* espaço livre para o botão X */
}

.lc-pwa-title {
	display: block;
	font-size: 13px;
	font-weight: 700;
	color: #0b1e36;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.lc-pwa-desc {
	display: block;
	font-size: 11px;
	color: #718096;
	line-height: 1.5;
}
.lc-pwa-desc em {
	font-style: normal;
	font-weight: 600;
	color: #4a5568;
}

/* ── Ícone de compartilhar do iOS — pulsa suavemente ────────────── */
.lc-pwa-share-icon {
	display: inline-block;
	color: #ff7a1a;
	font-size: 11px;
	vertical-align: middle;
	animation: lc-pwa-share-bounce 2s ease-in-out infinite;
}

@keyframes lc-pwa-share-bounce {
	0%, 100% { transform: translateY(0);    }
	50%       { transform: translateY(-3px); }
}

/* ── Botão instalar (Android / Chrome) ──────────────────────────── */
.lc-pwa-install-btn {
	flex-shrink: 0;
	background: #ff7a1a;
	color: #fff;
	border: none;
	border-radius: 20px;
	padding: 9px 20px;
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
	letter-spacing: .01em;
	white-space: nowrap;
	transition: background .15s, transform .1s;
	-webkit-tap-highlight-color: transparent;
}
.lc-pwa-install-btn:hover  { background: #f4511e; }
.lc-pwa-install-btn:active { transform: scale(.96); }
