@php
    $meterValue = $meterValue ?? old('meter_reading');
    $nextMeterValue = $nextMeterValue ?? old('next_meter_reading');
    $nextDateValue = $nextDateValue ?? old('next_service_date');
    $meterId = $meterId ?? 'grgMeterReading';
    $nextMeterId = $nextMeterId ?? 'grgNextMeterReading';
    $nextDateId = $nextDateId ?? 'grgNextServiceDate';
    $hintId = $hintId ?? 'grgMeterHint';
    $rowId = $rowId ?? 'grgMeterReadingRow';
    $colClass = $colClass ?? 'col-12 col-sm-6 col-lg-3';
    $hidden = $hidden ?? false;
@endphp
<div @class([$colClass => $colClass !== '', 'd-none' => $hidden]) id="{{ $rowId }}" data-grg-service-meter-group>
    <div class="gpo-lbl">
        Current reading (km)
        @if(!empty($showRequiredMarks))<span class="text-danger">*</span>@endif
    </div>
    <input type="number" class="gpo-inp" name="meter_reading" id="{{ $meterId }}" min="0" step="0.01"
        placeholder="e.g. 174872" value="{{ $meterValue !== null && $meterValue !== '' ? $meterValue : '' }}"
        inputmode="decimal" autocomplete="off">
</div>
<div @class([$colClass => $colClass !== '', 'd-none' => $hidden]) data-grg-service-meter-group>
    <div class="gpo-lbl">
        Next reading (km)
        @if(!empty($showRequiredMarks))<span class="text-danger">*</span>@endif
    </div>
    <input type="number" class="gpo-inp" name="next_meter_reading" id="{{ $nextMeterId }}" min="0" step="0.01"
        placeholder="e.g. 177872" value="{{ $nextMeterValue !== null && $nextMeterValue !== '' ? $nextMeterValue : '' }}"
        inputmode="decimal" autocomplete="off">
</div>
<div @class([$colClass => $colClass !== '', 'd-none' => $hidden]) data-grg-service-meter-group>
    <div class="gpo-lbl">
        Next service date
        @if(!empty($showRequiredMarks))<span class="text-danger">*</span>@endif
    </div>
    <input type="date" class="gpo-inp" name="next_service_date" id="{{ $nextDateId }}"
        value="{{ $nextDateValue !== null && $nextDateValue !== '' ? $nextDateValue : '' }}">
</div>
<div @class([
    'gs-ro-meter-hint-wrap',
    'col-12' => $colClass !== '',
    'd-none' => $hidden,
]) data-grg-service-meter-group>
    <div class="grg-meter-context-card" id="{{ $hintId }}" role="status" aria-live="polite" hidden></div>
</div>