@import 'wizard-layout.css';
@import 'wizard-progress-item.css';
@import 'wizard-section-title.css';

.shopify-marker {
	display: inline-block;
	user-select: none;
	pointer-events: none;
}

.shopify-item {
	display: inline-block;
	padding: 0px 8px;
	margin: 0 4px 2px 0;
	background: var(--lumo-primary-color);
	color: var(--lumo-primary-contrast-color);
	border-radius: 30px;
	user-select: none;
	pointer-events: none;
}

.shopify-wrapper {
	pointer-events: none;
}

body {
	background-color: #F9FAFB;
}

html {
	--flow-ui-menu-color: rgba(27, 43, 65, 0.72);
	--flow-ui-menu-color-active: hsl(173, 100%, 35%);
	--flow-ui-menu-bg: #FFFFFF;
	/*
	--flow-ui-submenu-bg: #2547B5;
	*/
	--flow-ui-menu-icon-bg: none;
	--flow-ui-menu-icon-bg-active: none;
	--flow-ui-menu-item-bg: none;
	--flow-ui-menu-item-bg-active: none;
	--flow-ui-main-bg: #FFFFFF;
	
	--lumo-primary-text-color: #0f0f0f;
	--lumo-body-text-color: #0f0f0f;
	--lumo-primary-color: hsl(173, 100%, 35%) !important;
	--lumo-primary-color-10pct: hsla(173, 100%, 35%, 0.1) !important;
	--lumo-primary-color-20pct: hsla(173, 100%, 35%, 0.2) !important;
	--lumo-primary-color-50pct: hsla(173, 100%, 35%, 0.5) !important;
	--lumo-primary-color-70pct: hsla(173, 100%, 35%, 0.7) !important;
	--lumo-primary-color-80pct: hsla(173, 100%, 35%, 0.8) !important;
	--lumo-primary-color-90pct: hsla(173, 100%, 35%, 0.9) !important;
	--lumo-font-family: 'Quicksand', 'Montserrat', 'Arial', 'Helvetica',
		'sans-serif' !important;
	font-family: var(--lumo-font-family) !important;
	--lumo-disable-text-color: hsl(0, 0%, 75%) !important;
}

p {
	font-size: var(--lumo-font-size-l);
}

p.subtitle {
	font-weight: 500;
	margin-bottom: var(--lumo-space-m);
	font-size: var(--lumo-font-size-l);
	margin: 0 auto;
}

p.subtitle-big {
	font-size: var(--lumo-font-size-xl);
	font-weight: 500;
	margin: 10px auto 2px auto;
}

p.help-description {
	font-size: var(--lumo-font-size-s);
	margin: 0;
	padding-left: var(--lumo-space-l);
}

.price {
	font-size: var(--lumo-font-size-xl);
	font-weight: 600;
	margin: var(--lumo-space-m) auto var(--lumo-space-s) auto;
	color: var(--lumo-shade-80pct);
}

.price span {
	font-weight: 500;
	color: var(--lumo-shade);
}

.activate-description {
	font-size: var(--lumo-font-size-xs);
	margin: var(--lumo-space-m) auto;
}

.app-menu-item:hover, .app-menu-item[highlight] {
	text-decoration: none;
}