export default function SettingsFixture() {
  return (
    <div>
      <div className="admin-page-header">
        <div>
          <h1 className="admin-page-title">Nastavení</h1>
        </div>
      </div>
      <div className="admin-tab-bar">
        <button className="admin-tab active">Role</button>
        <button className="admin-tab">Systém</button>
      </div>
      <div className="admin-card">
        <div className="admin-card-body">
          <div className="admin-table-responsive">
            <table className="admin-table">
              <thead>
                <tr>
                  <th>Název role</th>
                  <th>Popis</th>
                  <th>Oprávnění</th>
                  <th>Akce</th>
                </tr>
              </thead>
              <tbody>
                {Array.from({ length: 3 }, (_, i) => (
                  <tr key={i}>
                    <td className="fw-500">admin</td>
                    <td>Správa celého systému</td>
                    <td>
                      <span className="admin-badge admin-badge-info">
                        všechna
                      </span>
                    </td>
                    <td>
                      <div className="admin-table-actions">
                        <button className="admin-btn-icon" title="Upravit">
                          &#9998;
                        </button>
                      </div>
                    </td>
                  </tr>
                ))}
              </tbody>
            </table>
          </div>
        </div>
      </div>
      <div className="admin-card">
        <div className="admin-card-header">
          <h2 className="admin-card-title">Docházka</h2>
        </div>
        <div className="admin-card-body">
          <div className="admin-form">
            <div className="admin-form-row">
              <label className="admin-form-label">
                Limit pro přestávku (hodiny)
              </label>
              <input className="admin-form-input" readOnly value="6" />
              <label className="admin-form-label">
                Délka krátké přestávky (min)
              </label>
              <input className="admin-form-input" readOnly value="15" />
            </div>
          </div>
        </div>
      </div>
    </div>
  );
}