.ntw-fr {
	max-width: 680px;
	padding: 20px;
	border: 1px solid #e2e2e2;
	border-radius: 8px;
	background: #fff;
	box-sizing: border-box;
}

.ntw-fr *,
.ntw-fr *::before,
.ntw-fr *::after {
	box-sizing: border-box;
}

.ntw-fr__label,
.ntw-fr__currency-label,
.ntw-fr__result-label {
	display: block;
	margin-bottom: 8px;
	font-weight: 600;
}

.ntw-fr__options { display: block; width: 100%; margin-bottom: 18px; }

.ntw-fr__currency-label { display: block; margin: 0 0 8px; font-weight: 600; }

.ntw-fr__currency { display: block; width: 100%; min-width: 0; padding: 10px 12px; border: 1px solid #cfcfcf; border-radius: 5px; background: #fff; font-size: 15px; }

.ntw-fr__row { display: flex; gap: 10px; }

.ntw-fr__input-wrap { position: relative; flex: 1; min-width: 0; }

.ntw-fr__currency-symbol { position: absolute; top: 50%; left: 14px; transform: translateY(-50%); font-weight: 600; z-index: 1; }

.ntw-fr__input-wrap .ntw-fr__currency-symbol:not([hidden]) + .ntw-fr__input { padding-left: 58px; }

.ntw-fr__input {
	min-width: 0;
	flex: 1;
	padding: 12px 14px;
	border: 1px solid #cfcfcf;
	border-radius: 5px;
	font-size: 16px;
}

.ntw-fr__input:focus,
.ntw-fr__button:focus-visible,
.ntw-fr__copy:focus-visible,
.ntw-fr__result:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

.ntw-fr__button,
.ntw-fr__copy {
	padding: 12px 16px;
	border: 0;
	border-radius: 5px;
	cursor: pointer;
	font-size: 15px;
}

.ntw-fr__button {
	white-space: nowrap;
}

.ntw-fr__message {
	min-height: 22px;
	margin-top: 8px;
	font-size: 14px;
}

.ntw-fr__result-wrap {
	margin-top: 16px;
}

.ntw-fr__result {
	padding: 14px;
	border: 1px solid #e2e2e2;
	border-radius: 5px;
	line-height: 1.6;
	overflow-wrap: anywhere;
}

.ntw-fr__copy {
	margin-top: 10px;
}

@media (max-width: 600px) {
	.ntw-fr__options { display: block; }

	.ntw-fr__currency { width: 100%; }

	.ntw-fr__row { flex-direction: column; }

	.ntw-fr__button {
		width: 100%;
	}
}

.ntw-fr__options{display:block;width:100%;margin-bottom:18px;}
