<!-- Supported Formats Info Card -->
<div class="card bg-base-200 w-full max-w-md mb-5 mt-5">
  <div class="card-body p-4">
    <h3 class="card-title text-sm">Supported Import Formats</h3>
    <ul class="text-xs space-y-1">
      <li><strong>✅ Google Maps:</strong> Records.json, Semantic History, Phone Takeout (.json)</li>
      <li><strong>✅ GPX:</strong> Track files (.gpx)</li>
      <li><strong>✅ GeoJSON:</strong> Feature collections (.json)</li>
      <li><strong>✅ OwnTracks:</strong> Recorder files (.rec)</li>
      <li><strong>✅ KML:</strong> KML files (.kml, .kmz)</li>
    </ul>
    <div class="text-xs text-gray-500 mt-2">
      File format is automatically detected during upload.
    </div>
    <% if current_user.trial? %>
      <div class="text-xs text-orange-600 mt-2 font-medium">
        Trial limitations: Max 5 imports, 10MB per file.
        <br>
        Current imports: <%= current_user.imports.count %>/5
      </div>
    <% end %>
  </div>
</div>

<%= form_with model: import, class: "contents", data: {
  controller: "direct-upload",
  direct_upload_url_value: rails_direct_uploads_url,
  direct_upload_user_trial_value: current_user.trial?,
  direct_upload_current_imports_count_value: current_user.imports.count,
  direct_upload_target: "form"
} do |form| %>
  <label class="form-control w-full max-w-xs my-5">
    <div class="label">
      <span class="label-text">Select one or multiple files</span>
    </div>
    <%= form.file_field :files,
        multiple: true,
        direct_upload: true,
        class: "file-input file-input-bordered w-full max-w-xs",
        data: { direct_upload_target: "input" } %>
    <div class="text-sm text-gray-500 mt-2">
      Files will be uploaded directly to storage. Please be patient during upload.
    </div>
  </label>

  <div class="inline">
    <%= form.submit class: "rounded-lg py-3 px-5 bg-blue-600 text-white inline-block font-medium cursor-pointer",
        data: { direct_upload_target: "submit" } %>
  </div>
<% end %>
