.cogio-qr-generator{
	max-width: 720px;
	margin: 1.25rem 0;
	padding: 1rem;
	border: 1px solid rgba(0,0,0,.12);
	border-radius: .5rem;
}

.cogio-qr-generator__label{
	display:block;
	font-weight:600;
	margin-bottom:.5rem;
}

.cogio-qr-generator__controls{
	display:flex;
	gap:.5rem;
	flex-wrap:wrap;
	align-items:center;
}

.cogio-qr-generator__input{
	flex: 1 1 320px;
	min-width: 220px;
	padding:.6rem .75rem;
	border: 1px solid rgba(0,0,0,.22);
	border-radius: .4rem;
}

.cogio-qr-generator__button,
.cogio-qr-generator__download{
	padding:.6rem .9rem;
	border: 1px solid rgba(0,0,0,.22);
	border-radius: .4rem;
	cursor:pointer;
}

.cogio-qr-generator__button:disabled,
.cogio-qr-generator__download:disabled{
	opacity:.6;
	cursor:not-allowed;
}

.cogio-qr-generator__help{
	margin:.5rem 0 0;
	font-size: .95em;
	opacity: .85;
}

.cogio-qr-generator__output{
	margin-top: 1rem;
	display:flex;
	flex-direction: column;
	gap: .75rem;
	align-items:flex-start;
}

.cogio-qr-generator__qrcode{
	width: fit-content;
	max-width: 100%;
	padding: .75rem;
	background: #fff;
	border: 1px dashed rgba(0,0,0,.25);
	border-radius: .5rem;
}

.cogio-qr-generator__actions{
	display:flex;
	gap:.75rem;
	align-items:center;
	flex-wrap:wrap;
}

.cogio-qr-generator__status{
	font-size: .95em;
	opacity: .9;
}

.cogio-qr-generator__noscript{
	margin-top:.75rem;
	padding:.75rem;
	border-left: 4px solid rgba(0,0,0,.25);
	background: rgba(0,0,0,.04);
}