/*
 * Стилі фронту плагіна.
 *
 * Таблиця й калькулятор навмисно НЕ стилізуються тут: вони віддають ті самі
 * класи, що й старий сайт, а правила для них уже лежать у темі (legacy.css).
 * Тут — лише те, чого на старому сайті не було: графік на Chart.js.
 */

.bestrate-chart {
	margin: 20px 0 30px;
}

.bestrate-chart__periods {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-bottom: 12px;
}

.bestrate-chart__period {
	padding: 6px 14px;
	font: inherit;
	font-size: 14px;
	color: #322e42;
	cursor: pointer;
	background: #ededed;
	border: 1px solid #dbdfec;
	border-radius: 3px;
}

.bestrate-chart__period:hover {
	background: #e2e6e9;
}

.bestrate-chart__period.is-active {
	color: #fff;
	background: #83c608;
	border-color: #83c608;
}

.bestrate-chart__canvas {
	position: relative;
}

.bestrate-chart__empty {
	margin: 10px 0 0;
	font-size: 14px;
	color: #646970;
}

.bestrate-rate {
	font-weight: 700;
	white-space: nowrap;
}