/*
 * Colors are literal (see tools-common.css's top note) — kept in sync with
 * salimpick-child-theme/assets/css/tokens.css by hand.
 */

.salimpick-electricity-bill__mode {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-bottom: 16px;
}

.salimpick-electricity-bill__mode-option {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 12px;
	border-radius: 8px;
	border: 1px solid #e8eae6;
	font-size: 14px;
	min-height: 44px;
	cursor: pointer;
}

.salimpick-electricity-bill__mode-option input {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
}

.salimpick-electricity-bill__hint {
	margin: -6px 0 12px;
	font-size: 12px;
	color: #6f746f;
}

.salimpick-electricity-bill__breakdown {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 4px 12px;
	margin: 10px 0;
	padding: 12px;
	border-radius: 8px;
	background: #f5f6f3;
	font-size: 13px;
}

.salimpick-electricity-bill__breakdown dt {
	color: #4d514c;
}

.salimpick-electricity-bill__breakdown dd {
	margin: 0;
	text-align: right;
	font-variant-numeric: tabular-nums;
}

.salimpick-electricity-bill__breakdown-total-label,
.salimpick-electricity-bill__breakdown-total-value {
	margin-top: 6px;
	padding-top: 6px;
	border-top: 1px solid #e0e2dd;
	font-weight: 700;
	color: #222222;
}

.salimpick-electricity-bill__diff {
	font-size: 16px;
	font-weight: 700;
}

.salimpick-electricity-bill__basis {
	margin-top: 14px;
	font-size: 12px;
	color: #6f746f;
}

.salimpick-electricity-bill__basis summary {
	cursor: pointer;
	color: #4d514c;
	font-weight: 600;
}

.salimpick-electricity-bill__basis ul {
	margin: 8px 0 0;
	padding-left: 18px;
}

.salimpick-electricity-bill__basis li {
	margin-bottom: 4px;
}

.salimpick-electricity-bill__basis a {
	color: #7f9c8a;
}