/* ============================================================
   Wifisafe – Consultar Precio Peplink
   ============================================================ */

/* Ocultar precio en listados para productos Peplink
   (el filtro PHP ya vacía el HTML; esta regla es un respaldo) */
.peplink-sin-precio .price { display: none !important; }

/* ── Wrapper principal ────────────────────────────────────── */
.peplink-consulta-wrap {
	margin-top: 1.5rem;
	padding: 1.5rem 1.75rem;
	border: 1px solid #e0e0e0;
	border-left: 4px solid #003087; /* azul corporativo Peplink */
	border-radius: 6px;
	background: #f9fbff;
	font-family: inherit;
}

/* ── Título ───────────────────────────────────────────────── */
.peplink-consulta-titulo {
	margin: 0 0 .35rem;
	font-size: 1.15rem;
	font-weight: 700;
	color: #003087;
}

/* ── Descripción ──────────────────────────────────────────── */
.peplink-consulta-desc {
	margin: 0 0 1.1rem;
	font-size: .9rem;
	color: #555;
}

/* ── Mensaje de respuesta ─────────────────────────────────── */
.peplink-consulta-msg {
	padding: .75rem 1rem;
	border-radius: 4px;
	margin-bottom: 1rem;
	font-size: .9rem;
	line-height: 1.5;
}
.peplink-consulta-msg.success {
	background: #eaf7ee;
	border: 1px solid #a8dbb4;
	color: #276337;
}
.peplink-consulta-msg.error {
	background: #fdecea;
	border: 1px solid #f5b8b3;
	color: #8b1a13;
}

/* ── Campos ───────────────────────────────────────────────── */
.peplink-campo {
	margin-bottom: .85rem;
}

.peplink-campo label {
	display: block;
	margin-bottom: .3rem;
	font-size: .85rem;
	font-weight: 600;
	color: #333;
}

.peplink-campo input[type="text"],
.peplink-campo input[type="email"],
.peplink-campo input[type="tel"] {
	width: 100%;
	max-width: 420px;
	padding: .55rem .75rem;
	border: 1px solid #ccc;
	border-radius: 4px;
	font-size: .95rem;
	transition: border-color .2s;
	box-sizing: border-box;
	background: #fff;
}

.peplink-campo input:focus {
	outline: none;
	border-color: #003087;
	box-shadow: 0 0 0 2px rgba(0, 48, 135, .15);
}

/* ── Botón enviar ─────────────────────────────────────────── */
.peplink-btn-enviar {
	display: inline-block;
	margin-top: .4rem;
	padding: .65rem 1.5rem;
	background: #003087;
	color: #fff !important;
	border: none;
	border-radius: 4px;
	font-size: .95rem;
	font-weight: 600;
	cursor: pointer;
	transition: background .2s, opacity .2s;
}

.peplink-btn-enviar:hover {
	background: #00419e;
}

.peplink-btn-enviar:disabled,
.peplink-btn-enviar.enviando {
	opacity: .65;
	cursor: not-allowed;
}

/* ── Botón en el loop (listado tienda) ────────────────────── */
a.peplink-btn-loop,
.peplink-btn-loop.button {
	background: #003087;
	color: #fff !important;
	border-color: #003087;
}
a.peplink-btn-loop:hover,
.peplink-btn-loop.button:hover {
	background: #00419e;
	border-color: #00419e;
}

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width: 600px) {
	.peplink-consulta-wrap {
		padding: 1rem 1.1rem;
	}
	.peplink-campo input[type="text"],
	.peplink-campo input[type="email"],
	.peplink-campo input[type="tel"] {
		max-width: 100%;
	}
}