{% extends "base.html" %}
{% block title %}Dashboard - Студент{% endblock %}

{% block content %}
<div class="row">
    <div class="col-12">
        <h2>Добредојде, {{ user_name }}!</h2>
        <p class="lead">Студентска контролна табла</p>
    </div>
</div>

<!-- Главни картички -->
<div class="row mt-4">
    <div class="col-md-4 mb-3">
        <div class="card h-100">
            <div class="card-header bg-primary text-white">
                <h5><i class="bi bi-flask"></i> Хемиски елементи</h5>
            </div>
            <div class="card-body">
                <p>Истражете ги достапните хемиски елементи и нивните својства</p>
                <a href="/elements" class="btn btn-primary">Прегледај елементи</a>
            </div>
        </div>
    </div>
    
    <div class="col-md-4 mb-3">
        <div class="card h-100">
            <div class="card-header bg-success text-white">
                <h5><i class="bi bi-tools"></i> Лабораториска опрема</h5>
            </div>
            <div class="card-body">
                <p>Запознајте се со достапната лабораториска опрема</p>
                <a href="/equipment" class="btn btn-success">Прегледај опрема</a>
            </div>
        </div>
    </div>
    
    <div class="col-md-4 mb-3">
        <div class="card h-100">
            <div class="card-header bg-danger text-white">
                <h5><i class="bi bi-radioactive"></i> Виртуелна лабораторија</h5>
            </div>
            <div class="card-body">
                <p>Симулирајте хемиски реакции и учествувајте во експерименти</p>
                <a href="/laboratory" class="btn btn-danger">Отвори лабораторија</a>
            </div>
        </div>
    </div>
</div>

<!-- Втор ред картички -->
<div class="row">
    <div class="col-md-4 mb-3">
        <div class="card h-100">
            <div class="card-header bg-warning text-dark">
                <h5><i class="bi bi-journal-text"></i> Мои експерименти</h5>
            </div>
            <div class="card-body">
                <p>Прегледајте ги експериментите во кои сте учествувале</p>
                <a href="/my-experiments" class="btn btn-warning">Види експерименти</a>
            </div>
        </div>
    </div>
    
    
    
    <div class="col-md-4 mb-3">
        <div class="card h-100">
            <div class="card-header text-white" style="background: linear-gradient(45deg, #667eea, #764ba2);">
                <h5><i class="bi bi-graph-up"></i> Мој напредок</h5>
            </div>
            <div class="card-body">
                <p>Следете го вашиот напредок и активности</p>
                <a href="/my-experiments" class="btn btn-secondary">Види напредок</a>
            </div>
        </div>
    </div>
</div>
{% endblock %}