@model PlanTempus.Application.Features.Employees.Components.EmployeeDetailHRViewModel

<swp-detail-grid>
    <!-- Left column -->
    <div>
        <!-- Contract & Documents -->
        <swp-card>
            <swp-section-label>@Model.LabelContractDocuments</swp-section-label>

            <swp-edit-section>
                <swp-edit-row>
                    <swp-edit-label>@Model.LabelContractType</swp-edit-label>
                    <swp-edit-select>
                        <select>
                            @foreach (var option in Model.ContractTypeOptions)
                            {
                                <option selected="@(option == Model.ContractType)">@option</option>
                            }
                        </select>
                    </swp-edit-select>
                </swp-edit-row>
                <swp-edit-row>
                    <swp-edit-label>@Model.LabelTerminationNotice</swp-edit-label>
                    <swp-edit-select>
                        <select>
                            @foreach (var option in Model.TerminationNoticeOptions)
                            {
                                <option selected="@(option == Model.TerminationNotice)">@option</option>
                            }
                        </select>
                    </swp-edit-select>
                </swp-edit-row>
                <swp-edit-row>
                    <swp-edit-label>@Model.LabelContractExpiry</swp-edit-label>
                    <swp-edit-value>@Model.ContractExpiry</swp-edit-value>
                </swp-edit-row>
            </swp-edit-section>

            <swp-document-list style="margin-top: var(--spacing-6);">
                @foreach (var doc in Model.Documents)
                {
                    <swp-document-item>
                        <i class="ph ph-file-pdf"></i>
                        <swp-document-info>
                            <swp-document-name>@doc.Name</swp-document-name>
                            <swp-document-meta>@doc.UploadDate</swp-document-meta>
                        </swp-document-info>
                        <swp-document-actions>
                            <swp-btn class="secondary sm">Vis</swp-btn>
                        </swp-document-actions>
                    </swp-document-item>
                }
            </swp-document-list>

            <swp-add-button>+ @Model.LabelUploadDocument</swp-add-button>
        </swp-card>

        <!-- Planned absence -->
        <swp-card>
            <swp-section-label>@Model.LabelPlannedAbsence</swp-section-label>
            <swp-simple-list>
                @foreach (var absence in Model.PlannedAbsences)
                {
                    <swp-simple-item>
                        <swp-simple-item-text>@absence.Dates</swp-simple-item-text>
                        <swp-status-badge class="@absence.TypeClass">@absence.Type</swp-status-badge>
                    </swp-simple-item>
                }
            </swp-simple-list>
            <swp-add-button>+ @Model.LabelAddAbsence</swp-add-button>
        </swp-card>
    </div>

    <!-- Right column -->
    <div>
        <!-- Certifications -->
        <swp-card>
            <swp-section-label>@Model.LabelCertifications</swp-section-label>
            <swp-document-list>
                @foreach (var cert in Model.Certifications)
                {
                    <swp-document-item>
                        <i class="ph ph-certificate"></i>
                        <swp-document-info>
                            <swp-document-name>@cert.Name</swp-document-name>
                            <swp-document-meta>@cert.ExpiryDate</swp-document-meta>
                        </swp-document-info>
                        <swp-document-actions>
                            <swp-status-badge class="@cert.StatusClass">@cert.Status</swp-status-badge>
                        </swp-document-actions>
                    </swp-document-item>
                }
            </swp-document-list>
            <swp-add-button>+ @Model.LabelAddCertification</swp-add-button>
        </swp-card>

        <!-- Courses -->
        <swp-card>
            <swp-section-label>@Model.LabelCourses</swp-section-label>

            <swp-subsection>
                <swp-subsection-title>@Model.LabelCompletedCourses</swp-subsection-title>
                <swp-document-list>
                    @foreach (var course in Model.CompletedCourses)
                    {
                        <swp-document-item>
                            <swp-document-info>
                                <swp-document-name>@course.Name</swp-document-name>
                                <swp-document-meta>@course.Provider · @course.Date</swp-document-meta>
                            </swp-document-info>
                        </swp-document-item>
                    }
                </swp-document-list>
            </swp-subsection>

            <swp-subsection>
                <swp-subsection-title>@Model.LabelPlannedCourses</swp-subsection-title>
                <swp-document-list>
                    @foreach (var course in Model.PlannedCourses)
                    {
                        <swp-document-item>
                            <swp-document-info>
                                <swp-document-name>@course.Name</swp-document-name>
                                <swp-document-meta>@course.Provider · @course.Date</swp-document-meta>
                            </swp-document-info>
                            @if (!string.IsNullOrEmpty(course.Status))
                            {
                                <swp-document-actions>
                                    <swp-status-badge class="enrolled">@course.Status</swp-status-badge>
                                </swp-document-actions>
                            }
                        </swp-document-item>
                    }
                </swp-document-list>
            </swp-subsection>

            <swp-add-button>+ @Model.LabelAddCourse</swp-add-button>
        </swp-card>
    </div>
</swp-detail-grid>

<!-- Vacation & Absence section -->
<swp-detail-grid style="margin-top: var(--spacing-8);">
    <swp-card>
        <swp-section-label>@Model.LabelVacationBalance</swp-section-label>
        <swp-edit-section>
            <swp-edit-row>
                <swp-edit-label>@Model.LabelVacationEarned</swp-edit-label>
                <swp-edit-value>@Model.VacationEarned</swp-edit-value>
            </swp-edit-row>
            <swp-edit-row>
                <swp-edit-label>@Model.LabelVacationUsed</swp-edit-label>
                <swp-edit-value>@Model.VacationUsed</swp-edit-value>
            </swp-edit-row>
            <swp-edit-row>
                <swp-edit-label>@Model.LabelVacationRemaining</swp-edit-label>
                <swp-edit-value style="font-weight: 600; color: var(--color-teal);">@Model.VacationRemaining</swp-edit-value>
            </swp-edit-row>
        </swp-edit-section>
    </swp-card>

    <swp-card>
        <swp-section-label>@Model.LabelAbsenceSickness</swp-section-label>
        <swp-edit-section>
            <swp-edit-row>
                <swp-edit-label>@Model.LabelSickDays2025</swp-edit-label>
                <swp-edit-value>@Model.SickDays2025</swp-edit-value>
            </swp-edit-row>
            <swp-edit-row>
                <swp-edit-label>@Model.LabelSickDays2024</swp-edit-label>
                <swp-edit-value>@Model.SickDays2024</swp-edit-value>
            </swp-edit-row>
            <swp-edit-row>
                <swp-edit-label>@Model.LabelChildSickDays2025</swp-edit-label>
                <swp-edit-value>@Model.ChildSickDays2025</swp-edit-value>
            </swp-edit-row>
            <swp-edit-row>
                <swp-edit-label>@Model.LabelMaternityLeave</swp-edit-label>
                <swp-edit-value>@Model.MaternityLeave</swp-edit-value>
            </swp-edit-row>
        </swp-edit-section>
    </swp-card>
</swp-detail-grid>
