/* Buscador de RUC (consulta-ruc.html).
   Usa los custom properties de marca definidos en frontV2.css (--primary,
   --secondary). Es una hoja chica y propia de esta página: el resto del sitio no
   tiene ningún componente parecido, así que no hay nada que reutilizar. */

.ruc-tool {
  background: #fff;
  border: 1px solid rgba(7, 71, 180, 0.15);
  border-radius: 0.75rem;
  box-shadow: 0 1rem 2.5rem rgba(7, 71, 180, 0.08);
  padding: 1.75rem;
}

.ruc-label {
  display: block;
  font-weight: 700;
  color: var(--primary);
  margin-bottom: 0.5rem;
}

/* En pantallas chicas el input y el botón se apilan: un botón de 120px al lado de
   un input en un celular deja el campo del RUC inservible. */
.ruc-input-group {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.ruc-input {
  flex: 1 1 14rem;
  min-width: 0;
  border: 1px solid #d3dced;
  border-radius: 0.5rem;
  padding: 0.75rem 1rem;
  font-size: 1.05rem;
  color: #1c2b46;
  background: #fff;
}

.ruc-input:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(7, 71, 180, 0.15);
}

.ruc-submit {
  flex: 0 0 auto;
  border: none;
  border-radius: 0.5rem;
  padding: 0.75rem 1.5rem;
  font-weight: 700;
  color: #fff;
  background-color: var(--secondary);
  cursor: pointer;
  transition: transform 0.15s ease, opacity 0.15s ease;
}

.ruc-submit:hover:not(:disabled) {
  transform: translateY(-2px);
}

.ruc-submit:disabled {
  opacity: 0.65;
  cursor: progress;
}

.ruc-ayuda,
.ruc-cuota,
.ruc-fuente {
  display: block;
  font-size: 0.85rem;
  color: #6c7a94;
}

.ruc-ayuda {
  margin-top: 0.5rem;
}

.ruc-cuota {
  margin: 0.75rem 0 0;
  font-weight: 600;
}

.ruc-fuente {
  margin: 1.5rem 0 0;
  padding-top: 1rem;
  border-top: 1px solid #eef1f7;
}

/* Mensajes */

.ruc-alerta {
  margin: 1rem 0 0;
  padding: 0.85rem 1rem;
  border-radius: 0.5rem;
  border-left: 4px solid;
  font-size: 0.95rem;
}

.ruc-alerta--error {
  background: #fdf0f0;
  border-color: var(--secondary);
  color: #8a2b2c;
}

.ruc-alerta--limite {
  background: #fff8e8;
  border-color: #e0a800;
  color: #7a5c00;
}

/* Resultado */

.ruc-resultado {
  margin-top: 1.5rem;
}

.ruc-resultado-titulo {
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #6c7a94;
  margin-bottom: 1rem;
}

/* Dos columnas en desktop (etiqueta / valor), apiladas en celular: una grilla de
   dos columnas con una razón social larga rompe el ancho en pantallas chicas. */
.ruc-datos {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.25rem 1.5rem;
  margin: 0;
  padding: 1.25rem;
  background: #f7f9fc;
  border-radius: 0.5rem;
}

@media (min-width: 576px) {
  .ruc-datos {
    grid-template-columns: minmax(9rem, auto) 1fr;
  }
}

.ruc-dt {
  font-weight: 600;
  color: #6c7a94;
  font-size: 0.9rem;
  margin: 0;
}

.ruc-dd {
  margin: 0 0 0.75rem;
  color: #1c2b46;
  overflow-wrap: anywhere;
}

.ruc-dd:last-child {
  margin-bottom: 0;
}

.ruc-dd--destacado {
  font-weight: 700;
  font-size: 1.1rem;
}

.ruc-dd--si {
  color: #1e7d4f;
  font-weight: 600;
}

.ruc-dd--no {
  color: #a05a00;
  font-weight: 600;
}

/* Llamado a la acción posterior al resultado */

.ruc-cta {
  margin-top: 1.25rem;
  padding: 1.25rem;
  border-radius: 0.5rem;
  border: 1px solid rgba(7, 71, 180, 0.15);
  background: #f2f6ff;
}

.ruc-cta-titulo {
  font-weight: 700;
  color: var(--primary);
  margin-bottom: 0.5rem;
}

.ruc-cta-texto {
  font-size: 0.95rem;
  color: #3d4c68;
  margin-bottom: 1rem;
}

.ruc-cta-boton {
  display: inline-block;
  background-color: var(--secondary);
  color: #fff;
  font-weight: 700;
  padding: 0.65rem 1.35rem;
  border-radius: 0.5rem;
  text-decoration: none;
}

.ruc-cta-boton:hover,
.ruc-cta-boton:focus {
  color: #fff;
  text-decoration: none;
  transform: translateY(-2px);
}