/**
 * Capa visual pública del tarificador.
 * No modifica estados, cálculos ni comportamiento del plugin.
 */

:where(.tvida-wrapper, .tvida-result-wrapper) {
	--svb-calc-ink: #111b1a;
	--svb-calc-teal: #176f69;
	--svb-calc-teal-dark: #0e5651;
	--svb-calc-mustard: #efb43e;
	--svb-calc-orange: #c9512d;
	--svb-calc-cream: #f7ecd0;
	--svb-calc-paper: #fffdf7;
	--svb-calc-error: #a72e24;
	--svb-calc-shadow: 5px 5px 0 var(--svb-calc-ink);
	color: var(--svb-calc-ink);
	font-family: inherit;
	font-size: clamp(1rem, 1.5vw, 1.15rem);
	margin-inline: auto;
	max-width: 68rem;
	width: 100%;
}

.tvida-wrapper *,
.tvida-result-wrapper * {
	box-sizing: border-box;
}

.tvida-quote-card,
.tvida-result-intro,
.tvida-result-summary,
.tvida-company-card,
.tvida-coverage-details,
.tvida-selection-feedback,
.tvida-result-legal {
	background: var(--svb-calc-paper);
	border: 2px solid var(--svb-calc-ink);
	border-radius: 1.5rem;
	box-shadow: var(--svb-calc-shadow);
}

.tvida-quote-card {
	position: relative;
	overflow: hidden;
	min-height: 34rem;
	padding: clamp(1.5rem, 5vw, 4rem);
}

.tvida-quote-card::before {
	display: block;
	width: 7rem;
	height: 0.75rem;
	margin-bottom: 2rem;
	background-color: var(--svb-calc-orange);
	background-image: radial-gradient(rgb(17 27 26 / 30%) 1px, transparent 1px);
	background-size: 6px 6px;
	content: "";
}

.tvida-form-progress {
	margin-bottom: clamp(1.5rem, 4vw, 2.5rem);
}

.tvida-form-progress__dot {
	width: 1.5rem;
	height: 1.5rem;
	background: var(--svb-calc-cream);
	border: 2px solid var(--svb-calc-ink);
	box-shadow: none;
}

.tvida-form-progress__dot.is-active,
.tvida-form-progress__dot.is-complete {
	background: var(--svb-calc-mustard);
	border-color: var(--svb-calc-ink);
}

.tvida-form-progress__line {
	height: 3px;
	background: var(--svb-calc-ink);
}

.tvida-step-kicker {
	color: var(--svb-calc-orange);
	font-size: 0.95rem;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.tvida-form-step h2,
.tvida-result-wrapper h2,
.tvida-result-wrapper h3 {
	color: var(--svb-calc-ink);
	font-family: inherit;
	font-weight: 800;
	letter-spacing: -0.025em;
	line-height: 1.05;
}

.tvida-form-step h2 {
	font-size: clamp(2rem, 5vw, 3.5rem);
}

.tvida-capital-block {
	background: var(--svb-calc-cream);
	background-image: radial-gradient(rgb(17 27 26 / 12%) 1px, transparent 1px);
	background-size: 8px 8px;
	border: 2px solid var(--svb-calc-ink);
	border-radius: 1.25rem;
	padding: clamp(1rem, 3vw, 2rem);
}

.tvida-capital-control {
	gap: clamp(0.65rem, 2vw, 1.25rem);
}

.tvida-capital-button {
	display: inline-grid;
	width: 3.75rem;
	min-width: 3.75rem;
	height: 3.75rem;
	padding: 0;
	place-items: center;
	color: var(--svb-calc-ink);
	background: var(--svb-calc-mustard);
	border: 2px solid var(--svb-calc-ink);
	border-radius: 0.9rem;
	box-shadow: 3px 3px 0 var(--svb-calc-ink);
	font: inherit;
	font-size: 1.8rem;
	font-weight: 900;
}

.tvida-capital-input-wrap {
	min-width: 0;
}

.tvida-capital-input-wrap input {
	color: var(--svb-calc-teal-dark);
	background: var(--svb-calc-paper);
	border: 2px solid var(--svb-calc-ink);
	border-radius: 0.9rem;
	font-size: clamp(1.8rem, 7vw, 3.25rem);
	font-weight: 900;
	letter-spacing: -0.04em;
}

.tvida-field label {
	color: var(--svb-calc-ink);
	font-weight: 750;
	font-size: 1.05em;
}

.tvida-field input:not([type="checkbox"]),
.tvida-field select,
.tvida-field textarea,
.tvida-date-mask {
	min-height: 3.75rem;
	color: var(--svb-calc-ink);
	background: var(--svb-calc-paper);
	border: 2px solid var(--svb-calc-ink);
	border-radius: 0.8rem;
	font: inherit;
	font-size: 1.05em;
	padding: 0.8rem 1rem;
}

.tvida-field input::placeholder,
.tvida-field textarea::placeholder {
	color: #58615f;
	opacity: 1;
}

.tvida-field input[type="checkbox"] {
	width: 1.5rem;
	height: 1.5rem;
	accent-color: var(--svb-calc-teal);
}

.tvida-field--checkbox a,
.tvida-result-wrapper a {
	color: var(--svb-calc-teal-dark);
	font-weight: 700;
	text-decoration-thickness: 0.1em;
	text-underline-offset: 0.18em;
}

.tvida-actions {
	gap: 0.9rem;
	margin-top: 2rem;
}

.tvida-button,
.tvida-choice-button,
.tvida-back-button {
	min-height: 3.75rem;
	padding: 0.95rem 1.5rem;
	color: var(--svb-calc-ink);
	background: var(--svb-calc-mustard);
	border: 2px solid var(--svb-calc-ink);
	border-radius: 0.9rem;
	box-shadow: 3px 3px 0 var(--svb-calc-ink);
	font: inherit;
	font-weight: 850;
	font-size: 1.05em;
	line-height: 1.2;
	text-decoration: none;
}

.tvida-button--primary,
.tvida-button--accent,
.tvida-choice-button {
	color: var(--svb-calc-ink);
	background: var(--svb-calc-mustard);
}

.tvida-back-button {
	background: var(--svb-calc-paper);
}

.tvida-button:hover,
.tvida-choice-button:hover,
.tvida-back-button:hover,
.tvida-capital-button:hover {
	color: var(--svb-calc-ink);
	background: #f5c963;
	transform: translate(1px, 1px);
	box-shadow: 2px 2px 0 var(--svb-calc-ink);
}

.tvida-button:focus-visible,
.tvida-choice-button:focus-visible,
.tvida-back-button:focus-visible,
.tvida-capital-button:focus-visible,
.tvida-field input:focus-visible,
.tvida-field select:focus-visible,
.tvida-field textarea:focus-visible,
.tvida-capital-input-wrap input:focus-visible {
	outline: 3px solid var(--svb-calc-orange);
	outline-offset: 3px;
}

.tvida-step-error {
	padding: 0.75rem 1rem;
	color: var(--svb-calc-error);
	background: #fff2ef;
	border: 2px solid var(--svb-calc-error);
	border-radius: 0.75rem;
	font-weight: 700;
}

.tvida-processing-state {
	color: var(--svb-calc-ink);
	background: rgb(255 253 247 / 96%);
}

.tvida-result-intro,
.tvida-result-summary,
.tvida-company-card,
.tvida-coverage-details,
.tvida-selection-feedback,
.tvida-result-legal {
	padding: clamp(1.25rem, 4vw, 2.5rem);
}

.tvida-company-card {
	overflow: hidden;
	border-radius: 1.25rem;
}

.tvida-company-card--best,
.tvida-company-card.is-best {
	border-color: var(--svb-calc-orange);
}

.tvida-company-card--selected,
.tvida-company-card.is-selected {
	background: #edf8f5;
	border-color: var(--svb-calc-teal);
}

.tvida-company-card__logo img {
	width: auto;
	max-width: 10rem;
	height: auto;
	max-height: 3.25rem;
	object-fit: contain;
}

.tvida-company-card__title {
	color: var(--svb-calc-ink);
	font-weight: 850;
}

.tvida-price-main {
	color: var(--svb-calc-orange);
	font-weight: 900;
	letter-spacing: -0.035em;
	font-size: clamp(1.75rem, 4vw, 2.75rem);
}

.tvida-coverage-option {
	background: var(--svb-calc-cream);
	border: 1px solid var(--svb-calc-ink);
	border-radius: 0.9rem;
}

@media (max-width: 37.5rem) {
	.tvida-quote-card,
	.tvida-result-intro,
	.tvida-result-summary,
	.tvida-company-card,
	.tvida-coverage-details,
	.tvida-selection-feedback,
	.tvida-result-legal {
		box-shadow: 3px 3px 0 var(--svb-calc-ink);
	}

	.tvida-capital-button {
		width: 3rem;
		min-width: 3rem;
		height: 3rem;
	}

	.tvida-actions,
	.tvida-company-card__actions {
		flex-direction: column;
	}

	.tvida-button,
	.tvida-choice-button,
	.tvida-back-button {
		width: 100%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.tvida-wrapper *,
	.tvida-result-wrapper * {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}
}
