{extends file="layout.tpl"}

{block name="content"}
<div class="login-wrapper">
    <div class="login-card">
        <div class="login-header">
            <div class="login-logo">
                <i class="bi bi-collection-play-fill"></i>
            </div>
            <h1>Playlist Panel</h1>
            <p>Zaloguj się do panelu administracyjnego</p>
        </div>

        {if $error|default:false}
        <div class="alert alert-danger">
            <i class="bi bi-exclamation-circle me-2"></i>{$error}
        </div>
        {/if}

        <form method="post" class="login-form">
            <div class="form-floating mb-3">
                <input type="text" 
                       name="username" 
                       id="username" 
                       class="form-control" 
                       placeholder="Nazwa użytkownika"
                       value="{$username|default:''}"
                       autocomplete="username"
                       required 
                       autofocus>
                <label for="username">
                    <i class="bi bi-person me-2"></i>Nazwa użytkownika
                </label>
            </div>

            <div class="form-floating mb-3">
                <input type="password" 
                       name="password" 
                       id="password" 
                       class="form-control" 
                       placeholder="Hasło"
                       autocomplete="current-password"
                       required>
                <label for="password">
                    <i class="bi bi-lock me-2"></i>Hasło
                </label>
            </div>

            <div class="form-check mb-4">
                <input type="checkbox" name="remember" id="remember" class="form-check-input" value="1">
                <label class="form-check-label" for="remember">
                    Zapamiętaj mnie
                </label>
            </div>

            <button type="submit" class="btn btn-primary btn-lg w-100">
                <i class="bi bi-box-arrow-in-right me-2"></i>Zaloguj się
            </button>
        </form>

        <div class="login-footer">
            <small class="text-muted">
                &copy; {$smarty.now|date_format:"%Y"} Playlist Manager
            </small>
        </div>
    </div>
</div>
{/block}
