/**
 * EMI Calculator — Sliders, tenure cards, bank comparison.
 * Component-paired with template-parts/shared/emi-widget.php
 *
 * @package NewTechPrice
 */

/* Range slider — Tailwind-like */
.ntp-emi-slider {
	-webkit-appearance: none;
	appearance: none;
	width: 100%;
	height: 8px;
	border-radius: 4px;
	background: linear-gradient(to right, var(--ntp-primary-color, #0a58ca) 0%, var(--ntp-primary-color, #0a58ca) var(--slider-pct, 50%), #e2e8f0 var(--slider-pct, 50%), #e2e8f0 100%);
	outline: none;
}

.ntp-emi-slider::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--ntp-primary-color, #0a58ca);
	cursor: pointer;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
	transition: transform 0.15s ease;
}

.ntp-emi-slider::-webkit-slider-thumb:hover {
	transform: scale(1.08);
}

.ntp-emi-slider::-moz-range-thumb {
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--ntp-primary-color, #0a58ca);
	cursor: pointer;
	border: none;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}

.dark .ntp-emi-slider {
	background: linear-gradient(to right, var(--ntp-primary-color, #0a58ca) 0%, var(--ntp-primary-color, #0a58ca) var(--slider-pct, 50%), #334155 var(--slider-pct, 50%), #334155 100%);
}

.dark .ntp-emi-slider::-webkit-slider-thumb {
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
}

/* Tenure cards */
.ntp-emi-tenure-card {
	transition: all 0.2s ease;
	cursor: pointer;
	min-width: 56px;
}

.ntp-emi-tenure-card:hover {
	background-color: rgba(10, 88, 202, 0.08);
	border-color: rgba(10, 88, 202, 0.4);
}

.ntp-emi-tenure-card.ntp-emi-tenure-active {
	background-color: var(--ntp-primary-color, #0a58ca);
	border-color: var(--ntp-primary-color, #0a58ca);
	color: #fff;
}

.dark .ntp-emi-tenure-card.ntp-emi-tenure-active {
	background-color: var(--ntp-primary-color, #0a58ca);
	border-color: var(--ntp-primary-color, #0a58ca);
}

/* Bank comparison — best deal highlight */
.ntp-emi-comparison-table tbody tr:first-child td:first-child {
	font-weight: 600;
}

.ntp-emi-comparison-table tbody tr:hover {
	background-color: rgba(10, 88, 202, 0.04);
}

.dark .ntp-emi-comparison-table tbody tr:hover {
	background-color: rgba(10, 88, 202, 0.08);
}

/* Donut chart — Principal (#3b82f6) and Interest (#f97316) */
.ntp-emi-donut-container {
	transform: rotate(-90deg);
}

.ntp-emi-donut-bg {
	stroke: #e2e8f0;
}

.dark .ntp-emi-donut-bg {
	stroke: #334155;
}

.ntp-emi-donut-principal,
.ntp-emi-donut-interest {
	transition: stroke-dasharray 0.4s ease, stroke-dashoffset 0.4s ease;
}

.ntp-emi-chart-wrap {
	min-width: 0;
}

/* Custom / Manual mode — distinct violet/independent styling */
.ntp-emi-custom-slider {
	background: linear-gradient(to right, #7c3aed 0%, #7c3aed var(--slider-pct, 40%), #e2e8f0 var(--slider-pct, 40%), #e2e8f0 100%) !important;
}

.dark .ntp-emi-custom-slider {
	background: linear-gradient(to right, #8b5cf6 0%, #8b5cf6 var(--slider-pct, 40%), #334155 var(--slider-pct, 40%), #334155 100%) !important;
}

.ntp-emi-custom-slider::-webkit-slider-thumb {
	background: #7c3aed;
	box-shadow: 0 2px 6px rgba(124, 58, 237, 0.4);
}

.ntp-emi-custom-slider::-webkit-slider-thumb:hover {
	background: #6d28d9;
}

.ntp-emi-custom-slider::-moz-range-thumb {
	background: #7c3aed;
	box-shadow: 0 2px 6px rgba(124, 58, 237, 0.4);
}

.ntp-emi-custom-wrap {
	transition: opacity 0.25s ease;
}

.dark .ntp-emi-custom-slider::-webkit-slider-thumb {
	background: #8b5cf6;
}

.dark .ntp-emi-custom-slider::-moz-range-thumb {
	background: #8b5cf6;
}