export default function TripsFixture() {
  return (
    <div>
      <div className="admin-page-header">
        <div>
          <h1 className="admin-page-title">Kniha jízd</h1>
          <p className="admin-page-subtitle">duben 2025</p>
        </div>
        <div className="admin-page-actions">
          <button className="admin-btn admin-btn-primary">Přidat jízdu</button>
        </div>
      </div>
      <div className="admin-grid admin-grid-4">
        <div className="admin-stat-card info">
          <div className="admin-stat-icon info">
            <svg
              width="22"
              height="22"
              viewBox="0 0 24 24"
              fill="none"
              stroke="currentColor"
              strokeWidth="2"
            >
              <line x1="12" y1="20" x2="12" y2="10" />
              <line x1="18" y1="20" x2="18" y2="4" />
              <line x1="6" y1="20" x2="6" y2="16" />
            </svg>
          </div>
          <div className="admin-stat-content">
            <span className="admin-stat-value">12</span>
            <span className="admin-stat-label">Počet jízd</span>
          </div>
        </div>
        <div className="admin-stat-card">
          <div className="admin-stat-icon">
            <svg
              width="22"
              height="22"
              viewBox="0 0 24 24"
              fill="none"
              stroke="currentColor"
              strokeWidth="2"
            >
              <path d="M22 12h-4l-3 9L9 3l-3 9H2" />
            </svg>
          </div>
          <div className="admin-stat-content">
            <span className="admin-stat-value">1 240 km</span>
            <span className="admin-stat-label">Celkem naježděno</span>
          </div>
        </div>
        <div className="admin-stat-card success">
          <div className="admin-stat-icon success">
            <svg
              width="22"
              height="22"
              viewBox="0 0 24 24"
              fill="none"
              stroke="currentColor"
              strokeWidth="2"
            >
              <rect x="1" y="3" width="15" height="13" rx="2" ry="2" />
              <path d="M16 8h2a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-1" />
              <circle cx="5.5" cy="18" r="2" />
              <circle cx="18.5" cy="18" r="2" />
              <path d="M8 18h8" />
            </svg>
          </div>
          <div className="admin-stat-content">
            <span className="admin-stat-value">980 km</span>
            <span className="admin-stat-label">Služební</span>
          </div>
        </div>
        <div className="admin-stat-card warning">
          <div className="admin-stat-icon warning">
            <svg
              width="22"
              height="22"
              viewBox="0 0 24 24"
              fill="none"
              stroke="currentColor"
              strokeWidth="2"
            >
              <path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" />
              <polyline points="9 22 9 12 15 12 15 22" />
            </svg>
          </div>
          <div className="admin-stat-content">
            <span className="admin-stat-value">260 km</span>
            <span className="admin-stat-label">Soukromé</span>
          </div>
        </div>
      </div>
      <div className="admin-card mt-6">
        <div className="admin-card-header flex-between">
          <h2 className="admin-card-title">Poslední jízdy</h2>
          <a className="admin-btn admin-btn-secondary admin-btn-sm">
            Zobrazit historii
          </a>
        </div>
        <div className="admin-card-body">
          <div className="admin-table-responsive">
            <table className="admin-table">
              <thead>
                <tr>
                  <th>Datum</th>
                  <th>Vozidlo</th>
                  <th>Trasa</th>
                  <th>Vzdálenost</th>
                </tr>
              </thead>
              <tbody>
                {Array.from({ length: 4 }, (_, i) => (
                  <tr key={i}>
                    <td className="admin-mono">1. 4. 2025</td>
                    <td>
                      <span className="admin-badge">1A2 3456</span>
                    </td>
                    <td>Praha → Brno</td>
                    <td className="admin-mono">
                      <strong>200 km</strong>
                    </td>
                  </tr>
                ))}
              </tbody>
            </table>
          </div>
        </div>
      </div>
    </div>
  );
}
