#generar-url {
   display: block;
   margin: 20px auto;
   padding: 10px 20px;
   background-color: #007bff;
   color: white;
   border: none;
   border-radius: 5px;
   cursor: pointer;
   transition: background-color 0.3s ease;
 }

 #generar-url:hover {
   background-color: #0056b3;
 }

 #enviar-url {
    display: block;
    margin: 20px auto;
    padding: 10px 20px;
    background-color: #0b1c26;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease;
  }

  #enviar-url:hover {
    background-color: #0056b3;
  }

  #enviar-url:disabled {
    background-color: #cccccc; /* Color de fondo gris claro */
    cursor: not-allowed; /* Cursor que indica que el botón no se puede pulsar */
    color: #888888;

}

 /* Estilos para el div de la URL */
 #resumen {
   margin: 20px 5px;
   padding: 15px;
   border: 1px solid #ccc;
   border-radius: 5px;
   background-color: #f8f9fa;
 }

 #copiar-icon {
   display: block;
   margin: 20px auto;
   padding: 10px 20px;
   background-color: #007bff;
   color: white;
   border: none;
   border-radius: 5px;
   cursor: pointer;
   transition: background-color 0.3s ease;
   cursor: pointer;
  }


  #formulario-envio {
    background-color: #f9f9f9; /* Color de fondo para el formulario */
    padding: 20px;             /* Espaciado interno */
    border-radius: 8px;        /* Bordes redondeados */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Sombra para darle un efecto elevado */
    width: 100%;
    max-width: 400px;          /* Ancho máximo del formulario */
    margin: 20px auto;         /* Centra el formulario horizontalmente */
}

#formulario-envio input[type="text"],
#formulario-envio input[type="email"],
#formulario-envio input[type="tel"],
#formulario-envio input[type="provincia"] {
    width: 100%;                     /* Ocupa todo el ancho disponible */
    padding: 10px;                   /* Espaciado interno */
    margin-bottom: 10px;             /* Espaciado entre los elementos */
    border: 1px solid #ccc;          /* Borde */
    border-radius: 4px;              /* Bordes ligeramente redondeados */
    font-size: 14px;                 /* Tamaño de letra */
    box-sizing: border-box;          /* Asegura que padding y border estén incluidos en el tamaño total */
}

#formulario-envio div {
    margin-bottom: 15px;             /* Espaciado entre contenedores div */
}

#formulario-envio label {
    margin-right: 10px;              /* Espaciado a la derecha de las etiquetas */
    font-size: 14px;                 /* Tamaño de letra */
    cursor: pointer;                 /* Cambia el cursor al pasar el ratón */
}

#formulario-envio input[type="radio"],
#formulario-envio input[type="checkbox"] {
    margin-right: 5px;               /* Espaciado a la derecha de los input radio y checkbox */
}

#mensaje-exito {
    display: none; /* Esto mantendrá el mensaje oculto inicialmente */
    background-color: #4CAF50; /* Color de fondo verde */
    color: white; /* Texto en blanco */
    border-radius: 5px; /* Esquinas redondeadas */
    padding: 15px; /* Espaciado interno */
    text-align: center; /* Centrar el texto */
    font-size: 1.2em; /* Tamaño del texto */
    margin: 20px 0; /* Espaciado alrededor del mensaje */
    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1); /* Una sombra suave alrededor del mensaje */
}

.error-message {
    color: red;
    font-size: 12px;
    margin-top: 4px;
    display: block;
}