{{-- Upcoming meetings: Today / Tomorrow / Upcoming (personal involvement) --}}
<div class="dd-meetings-panel" id="dd-meetings-panel" aria-live="polite">
    <div class="dd-meetings-panel__hero">
        <div class="dd-meetings-panel__hero-top">
            <span class="dd-meetings-panel__icon" aria-hidden="true"><i class="fas fa-calendar-alt"></i></span>
            <div class="dd-meetings-panel__hero-text">
                <h2 class="dd-meetings-panel__title">
                    <a href="{{ route('meeting-workspace.dashboard') }}" class="dd-meetings-panel__title-link" id="dd-meetings-planner-link">
                        Upcoming meetings
                    </a>
                </h2>
                <p class="dd-meetings-panel__subtitle">Your meetings · organizer, participant, or signatory</p>
            </div>
        </div>
        <div class="dd-meetings-panel__hero-count-wrap">
            <span class="dd-meetings-panel__hero-count" id="dd-meetings-hero-count">—</span>
            <span class="dd-meetings-panel__hero-count-label">listed</span>
        </div>
    </div>

    <div class="dd-meetings-body" id="dd-meetings-body">
        <div class="dd-meetings-loading" id="dd-meetings-loading">
            <div class="dd-meetings-spinner" aria-hidden="true"></div>
            <span>Loading meetings…</span>
        </div>
        <div class="dd-meetings-empty" id="dd-meetings-empty" hidden>
            <i class="fas fa-calendar-check" aria-hidden="true"></i>
            <span>No upcoming meetings for you.</span>
        </div>
        <div class="dd-meetings-error" id="dd-meetings-error" hidden>
            <i class="fas fa-exclamation-triangle"></i>
            <span id="dd-meetings-error-text">Could not load meetings.</span>
            <button type="button" class="btn btn-sm btn-outline-secondary" id="dd-meetings-retry">Retry</button>
        </div>
        <div class="dd-meetings-groups" id="dd-meetings-groups" hidden></div>
    </div>

    <div class="dd-meetings-panel__footer">
        <button type="button" class="dd-meetings-refresh" id="dd-meetings-refresh" title="Refresh meetings">
            <i class="fas fa-sync-alt" aria-hidden="true"></i>
            <span>Refresh</span>
        </button>
        <a href="{{ route('meeting-workspace.dashboard') }}" class="dd-meetings-all-link" id="dd-meetings-all-link" title="Open Meeting Workspace">
            <i class="fas fa-external-link-alt"></i>
            <span>Planner</span>
        </a>
    </div>
</div>