/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://yourdomain.com/
 Description:  Child theme de GeneratePress
 Author:       Tu Nombre o Empresa
 Author URI:   https://yourdomain.com/
 Template:     generatepress
 Version:      1.0
*/

/* Aquí comenzará tu CSS personalizado */

    .page-header-image {
	display: none;
}

/*BENEFICIOS*/
.beneficios {
	height: 250px;
}

.datos-oficina {
	font-family: Montserrat;
}

.titulo-oficina h3{
	color: #1D1D1B;
	font-size: 18px;
	font-weight: 700;
}

.direccion-oficina a {
	color: #1D1D1B;
	font-size: 14px;
}

.direccion-oficina a:hover{
	color: #ED6D2F;
}

.whatsapp-oficina a {
	color: #1D1D1B;
	font-size: 14px;
}

.whatsapp-oficina a:hover {
	color: #ED6D2F;
}

.correo-oficina a {
	color: #1D1D1B;
	font-size: 14px;
}

.correo-oficina a:hover {
	color: #ED6D2F;
}

    body {
      margin: 0;
      font-family: 'Montserrat', sans-serif;
      background: #f5f5f5;
    }

    .barra-progreso {
      position: relative;
      top: 0;
      left: 0;
      width: 100%;
      height: 8px;
      background: #e0e0e0;
      z-index: 9999;
    }

    .barra-progreso .progreso {
      height: 100%;
      background: #004aad;
      width: 0%;
      transition: width 0.3s ease;
    }

    .barra-progreso-text {
      position: relative;
      left: 50%;
      text-align: center;    
      transform: translateX(-50%);
      font-size: 14px;
      font-weight: bold;
      color: #333;
      z-index: 9999;
    }
    

    .form-paso {
      height: 100%;
      display: none;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      transition: all 0.5s ease;
    }

    .form-paso.active {
      display: flex;
      padding: 50px 0;
    }

    .formulario {
      width: 100%;
      max-width: 70%;
      background: white;
      padding: 2em;
      border-radius: 10px;
      box-shadow: 0 0 10px rgba(0,0,0,0.1);
    }

    .formulario h2 {
      margin-bottom: 1em;
      color: #1D1D1B;
    }

    .formulario label {
      display: block;
      margin-top: 1em;
      font-weight: bold;
      color: #1D1D1B;
    }

    .formulario input, .formulario select, .formulario textarea {
      width: 100%;
      padding: 0.8em;
      margin-top: 0.3em;
      border: 1px solid #ccc;
      border-radius: 8px;
      font-size: 14px;
    }

    .navegacion-formulario {
      margin-top: 2em;
      display: flex;
      justify-content: space-between;
    }

    .navegacion-formulario button {
      background: #ED6D2F;
      color: white;
      padding: 0.8em 1.5em;
      border: none;
      border-radius: 8px;
      font-size: 16px;
      cursor: pointer;
    }

    .navegacion-formulario button:hover {
      background: #1D1D1B;
    }

    /* Fondos distintos */
    .fondo-paso-1 {
  background: linear-gradient(to bottom, #000 0%, #bf9039 100%);}
    .fondo-paso-2 { background: #333333; }
    .fondo-paso-3 { background: linear-gradient(to bottom, #c6c6c6 20%, #f8f7f7 80%);}
    .fondo-paso-4 { background: #e9da71; }
    .fondo-paso-5 { background: #b2afa7; }
    .fondo-paso-6 { background: #000000; }
    
    .form-row {
      display: flex;
      flex-wrap: wrap;
      gap: 1em;
      margin-top: 1em;
    }
    
    .form-group {
      flex: 1;
      min-width: 150px;
    }
    
    .form-group label {
      font-weight: bold;
      display: block;
      margin-bottom: 0.3em;
    }
    
    .form-group input,
    .form-group select{
      width: 100%;
      padding: 0.7em;
      border: 1px solid #ccc;
      border-radius: 8px;
      height: 40px;
    }
    
    
    .form-group textarea {
      width: 100%;
      padding: 0.7em;
      border: 1px solid #ccc;
      border-radius: 8px;
    
    }
    
    .form-group input[type="date"] {
        width: 100%;
    }
    
    .checkbox-group {
      display: flex;
      flex-wrap: wrap;
      gap: 1em;
      margin-top: 0.5em;
    }
    
    .checkbox-group label {
      font-weight: normal;
      display: flex;
      align-items: center;
      font-size: 14px;
    }
    
    .checkbox-group input {
      margin-right: 0.5em;
      font-size: 8px;
    }

    .campo-invalido {
      border: 2px solid red !important;
      background-color: #ffe5e5;
    }

    .checkbox-privacidad {
      display: flex;
      align-items: flex-start;
      gap: 0.1em;
      margin-top: 1em;
      font-size: 14px;
      line-height: 1;
      width: 100%;
    }
    
    .checkbox-privacidad input[type="checkbox"] {
      margin-top: 0;
      flex-shrink: 0;
      width: 12px;
    }
    
    .checkbox-privacidad label {
      display: inline;
      font-weight: normal;
      width: 100%;
      margin-top: 0;
    }
    
    .checkbox-privacidad a {
      color: #004aad;
      text-decoration: underline;
    }
    
    .checkbox-privacidad a:hover {
      color: #ED6D2F;
    }

    
    /* Responsive: en móvil los inputs se apilan */
    @media (max-width: 600px) {
      .form-row {
        flex-direction: column;
      }
    
  .formulario {
    width: 90%; /* más estrecho en móvil */
    padding: 1.5em; /* un poco menos de padding para pantallas pequeñas */
    max-width: 100%; /* que no limite ancho en móviles */
  }
  
  .checkbox-group input[type="checkbox"] {
      width: 12px;
    }
  
}

#confirmacion-container {
  max-width: 1000px;
  margin: 0 auto;
  padding: 2em;
}

#confirmacion-container h2 {
  text-align: center;
  margin-bottom: 2em;
}

.encabezado-solicitud {
  background: #f8f9fa;
  padding: 1.5em 2em;
  margin-bottom: 3em;
  border-left: 4px solid #0077cc;
  border-radius: 8px;
}

.seccion-solicitud {
  margin-bottom: 3em;
}

.seccion-solicitud h3 {
  font-size: 1.4em;
  margin-bottom: 1em;
  color: #333;
  border-bottom: 2px solid #0077cc;
  padding-bottom: 0.5em;
}

.fila-datos {
  display: flex;
  flex-wrap: wrap;
  gap: 1em;
  margin-bottom: 1em;
}

.dato {
  flex: 1 1 22%;
  min-width: 200px;
  background: #f4f4f4;
  padding: 1em;
  border-radius: 8px;
  font-size: 14px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.boton-descargar-container {
  display: flex;
  justify-content: center;
  margin: 2em 0;
}

.boton-descargar {
  display: inline-block;    
  background-color: #0077cc;
  color: white;
  border: none;
  padding: 1em 2em;
  border-radius: 8px;
  font-size: 16px;
  cursor: pointer;
  transition: background-color 0.3s;
  text-align: center;
}

.boton-descargar:hover {
  background-color: #005fa3;
}

.seccion-solicitud {
  padding-bottom: 2em;
  border-bottom: 1px solid #ddd;
  margin-bottom: 3em;
}

.lista-documentos {
  margin-left: 1em;
  padding-left: 1em;
  list-style: disc;
}

.no-print {
  display: block;
  text-align: center;
}

@media print {
  .no-print {
    display: none !important;
  }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* === Estilos para la tabla de solicitudes === */
.filtros-container {
  margin-bottom: 1.5em;
  display: flex;
  gap: 1em;
  flex-wrap: wrap;
}

.filtros-container select,
.filtros-container input,
.filtros-container button {
  padding: 0.4em 0.6em;
  font-size: 1em;
}

#tabla-solicitudes-container {
  margin-top: 2em;
  font-family: sans-serif;
}

#tabla-solicitudes {
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
  margin-top: 1em;
}

#tabla-solicitudes th,
#tabla-solicitudes td {
  text-align: left;
  padding: 10px;
  border: 1px solid #ccc;
}

#tabla-solicitudes th {
  cursor: pointer;
  background-color: #f0f0f0;
}

#tabla-solicitudes tr:hover {
  background-color: #f1f1f1;
}

#tabla-solicitudes a {
  color: #0077cc;
  text-decoration: none;
  font-weight: 500;
}

#tabla-solicitudes a:hover {
  text-decoration: underline;
}

.boton-volver-consulta {
  display: inline-block;
  margin-bottom: 2em;
  padding: 10px 20px;
  background-color: #0077cc;
  color: #fff;
  text-decoration: none;
  border-radius: 5px;
  font-weight: 500;
  font-size: 16px;
  transition: background-color 0.3s ease;
}

.boton-volver-consulta:hover {
  background-color: #005fa3;
}