<div class="dam-widget-modal" id="dam-widget-modal">
  <div class="dam-widget-modal__backdrop"></div>
  <div class="dam-widget-modal__content">
    <div class="dam-widget-modal__header">
      <h3 class="dam-widget-modal__title">Select Media</h3>
      <div class="dam-widget-modal__header-actions">
        <label class="dam-widget-modal__upload-btn button">
          <input type="file" id="dam-widget-upload-input" multiple accept="image/*,video/*,audio/*,.pdf,.doc,.docx,.xls,.xlsx,.ppt,.pptx" hidden>
          Upload Files
        </label>
        <button type="button" class="dam-widget-modal__close" aria-label="Close">&times;</button>
      </div>
    </div>

    <div class="dam-widget-modal__body">
      <div class="dam-widget-modal__sidebar">
        <div class="dam-widget-modal__filters">
          <input
            type="search"
            name="search"
            placeholder="Search media..."
            class="dam-widget-modal__search"
            id="dam-widget-search"
          >
          <select name="type" class="dam-widget-modal__type-filter" id="dam-widget-type-filter">
            <option value="">All types</option>
          </select>
        </div>

        <div class="dam-widget-modal__folders-header">
          <h4>Folders</h4>
        </div>
        <ul class="dam-widget-modal__folders" id="dam-widget-folders">
          <li class="dam-widget-modal__folder dam-widget-modal__folder--active" data-folder="">
            <button type="button">All Media</button>
          </li>
        </ul>

        <div class="dam-widget-modal__collections-header">
          <h4>Collections</h4>
        </div>
        <ul class="dam-widget-modal__collections" id="dam-widget-collections">
        </ul>
      </div>

      <div class="dam-widget-modal__main">
        <div class="dam-widget-modal__grid" id="dam-widget-grid">
          <div class="dam-widget-modal__loading">
            <div class="dam-widget-modal__spinner"></div>
            <p>Loading media...</p>
          </div>
        </div>
      </div>
    </div>

    <div class="dam-widget-modal__footer">
      <div class="dam-widget-modal__selection-info">
        <span id="dam-widget-selection-count">0</span> selected
      </div>
      <div class="dam-widget-modal__footer-actions">
        <button type="button" class="dam-widget-modal__cancel button">Cancel</button>
        <button type="button" class="dam-widget-modal__confirm button button--primary" disabled>Select</button>
      </div>
    </div>
  </div>
</div>
