Selected option value always null in Laravel Livewire form submit

I am relatively new to Laravel Livewire and struggling with this. I have a form that has a single select input, and on submit, it goes to the store function of the Livewire component and I wish to capture the selected option to process the data further.

Now, the form renders correctly; the select input is populated dynamically.

1. On FIRST submit, the field value is always null, and when the livewire component, which includes the form, is reloaded, the select input loses its CSS, and I cannot figure out why.

2. On SECOND submit, I see that the select input selected option is captured, which I am doing through an "updated" method, but the public property is still null. Extremely confused about this.

How can I fix these two issues? I'm using Laravel Framework 8.33.1 and Livewire v2.4.1.

View

<form class="edit-profile m-b30" method="POST" wire:submit.prevent="store">
    <div class="row">
        <!-- Your Profile Views Chart -->
        <div class="col-lg-12 m-b30">
            <div class="widget-box">
                <div class="widget-inner">
                    <div class="row">
                        <div class="col-12">
                            <div class="heading-bx left">
                                <h2 class="title-head">Registration</span></h2>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-12">
                            <div class="ml-auto">
                                <h3>Course Details</h3>
                            </div>
                        </div>
                        <div class="form-group col-6">
                            <label class="col-form-label">Select Course</label>
                            <div>
                                <select class="form-control" name="course" wire:model="course">
                                    <option value="">Select Course</option>
                                    @foreach($courses as $course)
                                    <option value="{{ $course->id }}">{{ $course->Name }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="seperator"></div>
                        <div class="col-12">
                            <button class="btn" name="submit" type="submit">Apply</button>
                            <button class="btn-secondry" type="reset">Cancel</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>

Class

class ApplyOnlineComponent extends Component
{
    public $courses;
    public $course;

    public function render()
    {
        return view('livewire.apply-online-component')->layout('layouts.base');
    }

    public function resetInputFields()
    {
        $this->reset();
    }

    public function updatedCourse($value)
    {
        $this->course = $value;
        Log::info('Inside updated. Selected course:'.$this->course);
        dd($value); // Works on second submit
    }

    public function mount()
    {
        Log::info('Inside mount');
        $this->courses = Courses::all();
    }

    public function store()
    {
        Log::info('Inside store of online registration. 
            Selected course:'.$this->course); // This always null
    }
}