 body {
          margin: 0;
          padding: 0;
        }

        .container {
          width: 100%;
          height: 85vh;
          background-color: #fff;
          overflow-y: auto;
        }

        .txt-form {
          width: 85%;
          margin: 0 auto;
          padding-top: 20px;
          height: 100%;
          background-color: white;
        }

        .form-group {
          display: flex;
          flex-direction: column;
        }

        .input-box {
          position: relative;
          width: 100%;
          padding-top: 20px; /* espacio para el label animado */
        }

        .input-box input {
          width: 100%;
          border: none;
          border-bottom: 1px solid rgb(97, 95, 95);
          outline: none;
          font-size: 16px;
          padding: 10px 5px 5px 5px;
          background-color: transparent;
          transition: border-color 0.2s ease;
        }

        .input-box label {
          position: absolute;
          left: 5px;
          top: calc(100% - 25px); /* justo encima del borde inferior */
          font-size: 16px;
          color: gray;
          pointer-events: none;
          background-color: white;
          padding: 0 4px;
          transition: all 0.2s ease;
          z-index: 1;
        }

        .input-box input:focus {
          border-bottom: 2px solid green;
        }

        .input-box input:focus + label,
        .input-box input:not(:placeholder-shown) + label {
          top: 0;
          left: 0;
          font-size: 12px;
          color: green;
        }

        /* Estilos para los nuevos campos en línea */
        .inline-inputs {
          display: flex;
          gap: 20%;
        }

        .inline-inputs .input-box {
          width: calc(50% - 5px); /* Ajuste para el gap */
        }

        .btn-aceptar {
          margin-top: 10%;
          width: 100%;
          background-color: #1976d5;
          color: white;
          border: none;
          border-radius: 0; /* bordes cuadrados */
          padding: 12px 0;
          font-size: 16px;
          font-weight: bold;
          cursor: pointer;
          transition: background-color 0.2s ease;
        }

        .btn-aceptar:hover {
          background-color: #1259a5; /* tono más oscuro al pasar el mouse */
        }

        .loader {
          width: 40px;
          height: 40px;
          border: 4px solid #ccc;
          border-top: 4px solid #1259a5;
          border-radius: 50%;
          animation: spin 0.8s linear infinite;
          margin: 20px auto;
        }

        @keyframes spin {
          to {
            transform: rotate(360deg);
          }
        }

       