<?php
	require_once $_SERVER['DOCUMENT_ROOT'] . '/includes/session_bootstrap.php';
?>
<!--
Author: Wspólnie
Author URL: https://togethere.cloud
-->
<!DOCTYPE html>
<html>
<head>
	<title>Dyscypliny | kontakt: wspolpraca@togethere.cloud</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta charset="utf-8">
	<meta name="keywords" content="projekty przyszłości"/>
	<link rel="stylesheet" href="/css/header.css" type="text/css" media="all"/>
	<link rel="stylesheet" href="/css/footer.css" type="text/css" media="all"/>
	<link href="/css/font-awesome.min.css" rel="stylesheet" type="text/css" media="all">
	<link href="/css/style.css" rel="stylesheet" type="text/css" media="all"/>
	<link href="//fonts.googleapis.com/css?family=Lato:400,500,600,700,800,900" rel="stylesheet">
	<style>
		body {
			background: linear-gradient(135deg, #e3f2fd 0%, #ffffff 100%);
			min-height: 100vh;
		}

		h1 {
			color: #1976d2;
			padding: 30px;
			margin-bottom: 30px;
			text-align: center;
			font-size: 2.5em;
			text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1);
		}

		.disciplines-container {
			max-width: 1200px;
			margin: 0 auto;
			padding: 40px 20px;
		}

		.disciplines-grid {
			display: grid;
			grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
			gap: 30px;
			margin-top: 40px;
		}

		.discipline-card {
			background: white;
			border-radius: 15px;
			padding: 40px 30px;
			text-align: center;
			box-shadow: 0 10px 30px rgba(100, 181, 246, 0.2);
			transition: all 0.3s ease;
			cursor: pointer;
			text-decoration: none;
			display: block;
			border: 3px solid transparent;
		}

		.discipline-card:hover {
			transform: translateY(-10px);
			box-shadow: 0 15px 40px rgba(100, 181, 246, 0.4);
			border-color: #42a5f5;
		}

		.discipline-icon {
			font-size: 5em;
			margin-bottom: 20px;
		}

		.discipline-card h2 {
			color: #1976d2;
			font-size: 1.8em;
			margin-bottom: 15px;
			font-weight: 700;
		}

		.discipline-card p {
			color: #2c3e50;
			font-size: 1.1em;
			line-height: 1.6;
			margin-bottom: 20px;
		}

		.discipline-btn {
			display: inline-block;
			padding: 12px 30px;
			background: linear-gradient(135deg, #42a5f5, #1976d2);
			color: white;
			border-radius: 8px;
			font-weight: 600;
			text-decoration: none;
			transition: all 0.3s ease;
			margin-top: 10px;
		}

		.discipline-btn:hover {
			background: linear-gradient(135deg, #1976d2, #0d47a1);
			transform: scale(1.05);
		}

		@media (max-width: 768px) {
			.disciplines-grid {
				grid-template-columns: 1fr;
				gap: 20px;
			}

			h1 {
				font-size: 2em;
				padding: 20px;
			}

			.discipline-card {
				padding: 30px 20px;
			}

			.discipline-icon {
				font-size: 4em;
			}
		}
	</style>
</head>
<body>
	<!-- Tutaj PHP sprawdza sesje czy zalogowany i wczytuje z /global/navLogged.html lun /global/navNoLogged.html -->
    <?php
        if (!empty($_SESSION['logged_in'])) {
            include $_SERVER['DOCUMENT_ROOT'].'/global/navLogined.php';
        } else {
            include $_SERVER['DOCUMENT_ROOT'].'/global/navNoLogined.php';
        }
    ?>

	<main>
		<div class="disciplines-container">
			<h1>🎮 Nasze Dyscypliny</h1>

			<div class="disciplines-grid">
				<a href="/disciplines/table-football" class="discipline-card">
					<div class="discipline-icon">⚽</div>
					<h2>Piłkarzyki</h2>
					<p>Klasyczna gra stołowa, która wymaga precyzji, refleksu i strategii. Rywalizuj w intensywnych meczach!</p>
					<span class="discipline-btn">Zobacz więcej</span>
				</a>

				<a href="/disciplines/ping-pong" class="discipline-card">
					<div class="discipline-icon">🏓</div>
					<h2>Ping-Pong</h2>
					<p>Szybka i dynamiczna gra w tenisa stołowego. Pokaż swoje umiejętności i zostań mistrzem rakiety!</p>
					<span class="discipline-btn">Zagraj teraz!</span>
				</a>

				<a href="/disciplines/rock-paper-scissors" class="discipline-card">
					<div class="discipline-icon">✊✋✌️</div>
					<h2>Kamień, Papier, Nożyce</h2>
					<p>Prosta, ale wymagająca strategii gra. Czytaj przeciwnika i pokonuj go w pojedynkach!</p>
					<span class="discipline-btn">Zobacz więcej</span>
				</a>
			</div>
		</div>
	</main>	  
	
	<?php
        if (!empty($_SESSION['logged_in'])) {
            include $_SERVER['DOCUMENT_ROOT'].'/global/footerLogined.php';
        } else {
            include $_SERVER['DOCUMENT_ROOT'].'/global/footerNoLogined.php';
        }
    ?>
</body>
</html>