<?php
/**
 * Template Name: Dashboard
 * data-page="dashboard"
 * Requires login — handled by JS.
 *
 * @package NeonKickLive
 */

get_header();
?>

	<header class="topbar">
		<h1>DASHBOARD</h1>
	</header>

	<div id="dashboard-skeleton" class="profile-shell" aria-hidden="true">
		<section class="profile-hero">
			<div class="skeleton skeleton-logo skeleton-logo--xl"></div>
			<h2><span class="skeleton skeleton-text skeleton-text--med" style="width:180px;display:inline-block;"></span></h2>
			<p><span class="skeleton skeleton-text skeleton-text--short" style="width:160px;display:inline-block;"></span></p>
		</section>
		<div class="profile-stats">
			<div class="stat"><strong class="skeleton skeleton-score skeleton-score--xl"></strong><span class="skeleton skeleton-text skeleton-text--tiny" style="width:70px;display:inline-block;margin-top:8px;"></span></div>
			<div class="stat"><strong class="skeleton skeleton-score skeleton-score--xl"></strong><span class="skeleton skeleton-text skeleton-text--tiny" style="width:70px;display:inline-block;margin-top:8px;"></span></div>
			<div class="stat"><strong class="skeleton skeleton-score skeleton-score--xl"></strong><span class="skeleton skeleton-text skeleton-text--tiny" style="width:70px;display:inline-block;margin-top:8px;"></span></div>
		</div>
		<div class="card"><div class="card-title"><span class="skeleton skeleton-text skeleton-text--tiny" style="width:120px;display:inline-block;"></span></div>
			<div class="match-list" style="padding:0;">
				<div class="match-row skeleton-row" aria-hidden="true"><span class="skeleton skeleton-dot"></span><div class="home"><span class="skeleton skeleton-logo"></span><span class="skeleton skeleton-text skeleton-text--short"></span></div><div class="center"><span class="skeleton skeleton-pill"></span><span class="skeleton skeleton-text skeleton-text--tiny"></span></div><div class="away"><span class="skeleton skeleton-text skeleton-text--short"></span><span class="skeleton skeleton-logo"></span></div><span class="skeleton skeleton-star"></span></div>
				<div class="match-row skeleton-row" aria-hidden="true"><span class="skeleton skeleton-dot"></span><div class="home"><span class="skeleton skeleton-logo"></span><span class="skeleton skeleton-text skeleton-text--short"></span></div><div class="center"><span class="skeleton skeleton-pill"></span><span class="skeleton skeleton-text skeleton-text--tiny"></span></div><div class="away"><span class="skeleton skeleton-text skeleton-text--short"></span><span class="skeleton skeleton-logo"></span></div><span class="skeleton skeleton-star"></span></div>
				<div class="match-row skeleton-row" aria-hidden="true"><span class="skeleton skeleton-dot"></span><div class="home"><span class="skeleton skeleton-logo"></span><span class="skeleton skeleton-text skeleton-text--short"></span></div><div class="center"><span class="skeleton skeleton-pill"></span><span class="skeleton skeleton-text skeleton-text--tiny"></span></div><div class="away"><span class="skeleton skeleton-text skeleton-text--short"></span><span class="skeleton skeleton-logo"></span></div><span class="skeleton skeleton-star"></span></div>
				<div class="match-row skeleton-row" aria-hidden="true"><span class="skeleton skeleton-dot"></span><div class="home"><span class="skeleton skeleton-logo"></span><span class="skeleton skeleton-text skeleton-text--short"></span></div><div class="center"><span class="skeleton skeleton-pill"></span><span class="skeleton skeleton-text skeleton-text--tiny"></span></div><div class="away"><span class="skeleton skeleton-text skeleton-text--short"></span><span class="skeleton skeleton-logo"></span></div><span class="skeleton skeleton-star"></span></div>
			</div>
		</div>
		<div class="menu-list" aria-hidden="true">
			<div class="menu-item skeleton-menu"><span class="skeleton skeleton-logo"></span><span class="skeleton skeleton-menu-text"></span><span class="chev skeleton skeleton-chevron"></span></div>
			<div class="menu-item skeleton-menu"><span class="skeleton skeleton-logo"></span><span class="skeleton skeleton-menu-text"></span><span class="chev skeleton skeleton-chevron"></span></div>
			<div class="menu-item skeleton-menu"><span class="skeleton skeleton-logo"></span><span class="skeleton skeleton-menu-text"></span><span class="chev skeleton skeleton-chevron"></span></div>
		</div>
	</div>

	<div id="dashboard-content" class="profile-shell" hidden>
		<div id="dash-root"></div>
	</div>

<?php get_footer(); ?>