/* =========================================================
   Fullpower Core — Buscador de neumáticos
   Estilo off-road / deportivo
   ========================================================= */

.fp-search-panel{
	--fp-cyan:#29abe2;
	--fp-cyan-hi:#4cc7f5;
	--fp-dark:#12171c;
	--fp-dark-2:#1b232b;
	--fp-line:#2c3945;
	--fp-text:#e8eef3;
	--fp-muted:#93a4b3;

	position:relative;
	width:100%;
	max-width:1240px;
	margin:0 auto 28px;
	background:
		linear-gradient(135deg, rgba(41,171,226,.07) 0%, transparent 42%),
		linear-gradient(180deg, var(--fp-dark-2) 0%, var(--fp-dark) 100%);
	border:1px solid var(--fp-line);
	border-radius:4px;
	box-shadow:0 18px 44px rgba(0,0,0,.32);
	overflow:hidden;
	box-sizing:border-box;
}

/* Franja diagonal superior, guiño motorsport */
.fp-search-panel::before{
	content:"";
	position:absolute;
	inset:0 0 auto 0;
	height:4px;
	background:repeating-linear-gradient(
		115deg,
		var(--fp-cyan) 0 22px,
		#0d7fae 22px 44px,
		transparent 44px 62px
	);
}

/* --- Cabecera --- */
.fp-search-panel__head{ padding:26px 30px 0; }
.fp-search-panel__kicker{
	display:inline-block;
	font-size:11px;
	font-weight:800;
	letter-spacing:.19em;
	text-transform:uppercase;
	color:var(--fp-cyan);
	margin-bottom:6px;
}
.fp-search-panel__title{
	margin:0 0 22px;
	font-size:clamp(22px, 2.6vw, 31px);
	font-weight:800;
	line-height:1.1;
	text-transform:uppercase;
	color:#fff;
}
.fp-search-panel__title::after{
	content:"";
	display:block;
	width:60px;
	height:3px;
	margin-top:12px;
	background:var(--fp-cyan);
	transform:skewX(-22deg);
}

/* --- Rejilla del formulario --- */
.fp-search-panel .fp-tire-search{
	display:grid;
	grid-template-columns:repeat(3, minmax(0,1fr)) minmax(210px, auto);
	gap:16px;
	align-items:end;
	padding:0 30px 8px;
}

.fp-search-panel .fp-search-field label{
	display:block;
	margin:0 0 8px;
	font-size:11px;
	font-weight:800;
	letter-spacing:.15em;
	text-transform:uppercase;
	color:var(--fp-muted);
}

.fp-search-panel .fp-search-field select{
	width:100%;
	min-height:56px;
	padding:12px 42px 12px 16px;
	border:1px solid var(--fp-line);
	border-radius:3px;
	background-color:#0d1216;
	background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2329abe2' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M5 9l7 7 7-7'/%3E%3C/svg%3E");
	background-repeat:no-repeat;
	background-position:right 15px center;
	background-size:15px;
	color:var(--fp-text);
	font:inherit;
	font-weight:600;
	appearance:none;
	-webkit-appearance:none;
	transition:border-color .16s ease, box-shadow .16s ease;
}
.fp-search-panel .fp-search-field select:hover:not(:disabled){ border-color:#3d5162; }
.fp-search-panel .fp-search-field select:focus{
	outline:none;
	border-color:var(--fp-cyan);
	box-shadow:0 0 0 3px rgba(41,171,226,.22);
}
.fp-search-panel .fp-search-field select:disabled{ opacity:.42; cursor:not-allowed; }
.fp-search-panel .fp-search-field select option{ background:#0d1216; color:var(--fp-text); }

.fp-search-panel .fp-profile-optional{
	font-size:10px;
	font-weight:700;
	letter-spacing:.06em;
	color:var(--fp-cyan);
	text-transform:none;
}

/* --- Botón --- */
.fp-search-panel .fp-search-submit button{
	width:100%;
	min-height:56px;
	padding:14px 26px;
	border:0;
	border-radius:3px;
	background:linear-gradient(135deg, var(--fp-cyan-hi) 0%, var(--fp-cyan) 55%, #1189bd 100%);
	color:#06222f;
	font:inherit;
	font-size:14px;
	font-weight:900;
	letter-spacing:.07em;
	text-transform:uppercase;
	cursor:pointer;
	box-shadow:0 6px 18px rgba(41,171,226,.32);
	transition:transform .13s ease, box-shadow .16s ease, filter .16s ease;
}
.fp-search-panel .fp-search-submit button:hover{
	filter:brightness(1.08);
	transform:translateY(-2px);
	box-shadow:0 10px 26px rgba(41,171,226,.44);
}
.fp-search-panel .fp-search-submit button:active{ transform:translateY(0); }
.fp-search-panel .fp-search-submit button:focus-visible{ outline:3px solid #fff; outline-offset:2px; }

/* --- Nota inferior --- */
.fp-search-panel .fp-search-note{
	margin:0;
	padding:18px 30px 24px;
	border-top:1px solid rgba(255,255,255,.06);
	font-size:13.5px;
	line-height:1.6;
	color:var(--fp-muted);
}
.fp-search-panel .fp-search-note strong{ color:var(--fp-cyan); font-weight:800; }

/* --- Error --- */
.fp-search-error{
	padding:14px 18px;
	border-left:4px solid #29abe2;
	border-radius:0 3px 3px 0;
	background:#f2f7fa;
	color:#1d2a35;
}

.fp-search-field[hidden]{ display:none !important; }

/* ===================== Resultados ===================== */
.fp-tire-results{ margin-top:28px; }
.fp-tire-results > h2{
	margin-bottom:22px;
	font-weight:800;
	text-transform:uppercase;
}

/* ================ Precios por cantidad ================ */
.fp-quantity-pricing{
	margin:20px 0;
	padding:18px;
	border:1px solid #e2e8ed;
	border-left:4px solid #29abe2;
	border-radius:0 6px 6px 0;
	background:#fbfdfe;
}
.fp-quantity-pricing-grid{
	display:grid;
	grid-template-columns:repeat(3, minmax(0,1fr));
	gap:12px;
	margin:12px 0 8px;
}
.fp-quantity-pricing-card{
	display:flex;
	flex-direction:column;
	gap:3px;
	padding:12px;
	border:1px solid #e2e8ed;
	border-radius:4px;
	background:#fff;
	transition:border-color .16s ease, transform .16s ease;
}
.fp-quantity-pricing-card:hover{ border-color:#29abe2; transform:translateY(-2px); }
.fp-quantity-pricing-card .fp-qty{
	font-weight:800;
	font-size:11px;
	letter-spacing:.13em;
	text-transform:uppercase;
	color:#5d7183;
}
.fp-quantity-pricing-card .fp-discount{ font-weight:900; font-size:19px; color:#0d7fae; }
.fp-quantity-pricing-card .fp-unit,
.fp-quantity-pricing-card .fp-total{ font-size:.9em; color:#3b4a57; }

/* ===================== Responsive ===================== */
@media (max-width:1024px){
	.fp-search-panel .fp-tire-search{ grid-template-columns:repeat(3, minmax(0,1fr)); }
	.fp-search-panel .fp-search-submit{ grid-column:1 / -1; }
}

@media (max-width:782px){
	.fp-search-panel{ border-radius:0; }
	.fp-search-panel__head{ padding:22px 20px 0; }
	.fp-search-panel .fp-tire-search{
		grid-template-columns:1fr;
		gap:14px;
		padding:0 20px 8px;
	}
	.fp-search-panel .fp-search-field select,
	.fp-search-panel .fp-search-submit button{
		min-height:54px;
		font-size:16px; /* evita el zoom automático en iOS */
	}
	.fp-search-panel .fp-search-note{ padding:16px 20px 22px; font-size:13px; }
	.fp-quantity-pricing-grid{ grid-template-columns:1fr; }
}

@media (prefers-reduced-motion:reduce){
	.fp-search-panel *,
	.fp-quantity-pricing-card{ transition:none !important; }
	.fp-search-panel .fp-search-submit button:hover{ transform:none; }
}