.r7-pwa-controls {
	position: fixed;
	z-index: 9998;
	left: 16px;
	bottom: 16px;
	display: grid;
	justify-items: start;
	max-width: min(360px, calc(100vw - 32px));
	gap: 10px;
	font-family: "Roboto Condensed", sans-serif;
}

.r7-pwa-controls [hidden] {
	display: none !important;
}

.r7-pwa-notice,
.r7-pwa-install {
	box-sizing: border-box;
	width: 100%;
	padding: 12px 14px;
	background: #ffffff;
	border: 1px solid #d5d9d7;
	border-radius: 8px;
	color: #2d3335;
	box-shadow: 0 8px 24px rgb(24 35 29 / 16%);
	font-size: 15px;
	line-height: 1.4;
}

.r7-pwa-notice--offline {
	border-left: 4px solid #b56a00;
}

.r7-pwa-notice--update {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.r7-pwa-action {
	min-height: 42px;
	padding: 9px 15px;
	background: #2f6f3e !important;
	border: 1px solid #2f6f3e !important;
	border-radius: 6px;
	color: #ffffff !important;
	font: 700 15px/1.2 "Roboto Condensed", sans-serif;
	cursor: pointer;
}

.r7-pwa-action:hover,
.r7-pwa-action:focus-visible {
	background: #245a32 !important;
	border-color: #245a32 !important;
}

.r7-pwa-action:focus-visible {
	outline: 3px solid rgb(47 111 62 / 30%);
	outline-offset: 2px;
}

.r7-pwa-install {
	width: auto;
	max-width: 100%;
}

.r7-pwa-install__ios {
	max-width: 310px;
	margin: 10px 0 0;
	color: #4a504d;
}

@media (max-width: 600px) {
	.r7-pwa-controls {
		bottom: 12px;
		left: 12px;
		right: 12px;
		max-width: none;
	}

	.r7-pwa-install,
	.r7-pwa-action--install {
		width: 100%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.r7-pwa-controls *,
	.r7-pwa-controls *::before,
	.r7-pwa-controls *::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}
}