Compare commits

..

1 Commits

Author SHA1 Message Date
Flatlogic Bot
5ad44943de Auto commit: 2026-01-25T11:21:00.233Z 2026-01-25 11:21:00 +00:00
13 changed files with 1155 additions and 463 deletions

View File

@ -0,0 +1,8 @@
</div> <!-- End Container -->
<footer style="text-align:center; padding: 2rem 0; color: var(--text-muted); font-size: 0.9rem; margin-top: 2rem;">
<p>&copy; <?php echo date('Y'); ?> لوجستيك برو. جميع الحقوق محفوظة.</p>
</footer>
</body>
</html>

106
admin/includes/header.php Normal file
View File

@ -0,0 +1,106 @@
<?php
session_start();
// Mock Authentication for Prototype
if (!isset($_SESSION['user_id'])) {
// For demo simplicity, we auto-login or redirect to a simple login page.
// Let's assume auto-login for this interaction to show the dashboard immediately
// as requested by the user who wants to "see" it.
$_SESSION['user_id'] = 1;
$_SESSION['user_role'] = 'admin';
}
require_once __DIR__ . '/../../db/config.php';
$pdo = db();
?>
<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>لوحة التحكم | لوجستيك برو</title>
<!-- Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;800&family=Cairo:wght@400;600;700&display=swap" rel="stylesheet">
<!-- FontAwesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<!-- Custom CSS (Reused) -->
<link rel="stylesheet" href="../assets/css/custom.css">
<style>
/* Admin Specific Overrides */
body {
background-color: #f8fafc;
}
.admin-nav {
background: var(--primary);
color: white;
padding: 1rem 0;
margin-bottom: 2rem;
}
.admin-nav .nav-link {
color: rgba(255,255,255,0.8);
margin-left: 1.5rem;
text-decoration: none;
font-weight: 600;
}
.admin-nav .nav-link:hover, .admin-nav .nav-link.active {
color: var(--accent);
}
.admin-card {
background: white;
border-radius: 8px;
padding: 1.5rem;
border: 1px solid var(--border);
box-shadow: 0 2px 4px rgba(0,0,0,0.05);
margin-bottom: 1.5rem;
}
.stat-value {
font-size: 2rem;
font-weight: 800;
color: var(--primary);
}
.stat-label {
color: var(--text-muted);
font-size: 0.9rem;
}
.table-custom {
width: 100%;
border-collapse: collapse;
}
.table-custom th, .table-custom td {
padding: 1rem;
text-align: right;
border-bottom: 1px solid var(--border);
}
.table-custom th {
background: #f1f5f9;
font-weight: 600;
color: var(--primary);
}
.badge {
padding: 0.25rem 0.5rem;
border-radius: 4px;
font-size: 0.8rem;
}
.badge-new { background: #fee2e2; color: #991b1b; }
.badge-contacted { background: #fef3c7; color: #92400e; }
.badge-closed { background: #dcfce7; color: #166534; }
</style>
</head>
<body>
<nav class="admin-nav">
<div class="container" style="display:flex; justify-content:space-between; align-items:center;">
<a href="index.php" style="color:white; font-size:1.25rem; font-weight:800; text-decoration:none;">
لوجستيك<span style="color:var(--accent)">برو</span> | الإدارة
</a>
<div>
<a href="index.php" class="nav-link"><i class="fa-solid fa-gauge"></i> الرئيسية</a>
<a href="quotes.php" class="nav-link"><i class="fa-solid fa-file-invoice"></i> الطلبات (Leads)</a>
<a href="services.php" class="nav-link"><i class="fa-solid fa-boxes-stacked"></i> الخدمات</a>
<a href="../index.php" class="nav-link" target="_blank"><i class="fa-solid fa-external-link"></i> الموقع</a>
</div>
</div>
</nav>
<div class="container">

107
admin/index.php Normal file
View File

@ -0,0 +1,107 @@
<?php
require_once 'includes/header.php';
// Fetch Stats
$stats = [
'quotes_total' => 0,
'quotes_new' => 0,
'shipments_total' => 0,
'services_total' => 0
];
try {
$stats['quotes_total'] = $pdo->query("SELECT COUNT(*) FROM quotes")->fetchColumn();
$stats['quotes_new'] = $pdo->query("SELECT COUNT(*) FROM quotes WHERE status = 'new'")->fetchColumn();
$stats['shipments_total'] = $pdo->query("SELECT COUNT(*) FROM shipments")->fetchColumn(); // Might fail if table doesn't exist yet
$stats['services_total'] = $pdo->query("SELECT COUNT(*) FROM services")->fetchColumn();
// Fetch Recent Quotes
$stmt = $pdo->query("SELECT * FROM quotes ORDER BY created_at DESC LIMIT 5");
$recent_quotes = $stmt->fetchAll(PDO::FETCH_ASSOC);
} catch (Exception $e) {
// Graceful fallback if tables missing
$error = $e->getMessage();
}
?>
<div style="display:flex; justify-content:space-between; align-items:center; margin-bottom:1.5rem;">
<h2 style="margin:0; color:var(--primary);">لوحة القيادة</h2>
<a href="quotes.php" class="btn btn-primary">عرض كل الطلبات</a>
</div>
<?php if (isset($error)): ?>
<div style="background:#fee2e2; color:#991b1b; padding:1rem; border-radius:8px; margin-bottom:1rem;">
خطأ في قاعدة البيانات: <?php echo htmlspecialchars($error); ?>
</div>
<?php endif; ?>
<div class="grid-3" style="margin-bottom:2rem;">
<!-- New Quotes Stat -->
<div class="admin-card" style="border-top: 4px solid #ef4444;">
<div class="stat-label">طلبات تسعير جديدة</div>
<div class="stat-value"><?php echo $stats['quotes_new']; ?></div>
<small style="color:var(--text-muted)">من أصل <?php echo $stats['quotes_total']; ?> طلب</small>
</div>
<!-- Active Shipments -->
<div class="admin-card" style="border-top: 4px solid var(--accent);">
<div class="stat-label">شحنات مسجلة</div>
<div class="stat-value"><?php echo $stats['shipments_total']; ?></div>
<small style="color:var(--text-muted)">في النظام</small>
</div>
<!-- Services -->
<div class="admin-card" style="border-top: 4px solid var(--primary);">
<div class="stat-label">الخدمات المفعلة</div>
<div class="stat-value"><?php echo $stats['services_total']; ?></div>
<small style="color:var(--text-muted)">خدمات معروضة للعملاء</small>
</div>
</div>
<h3 style="margin-bottom:1rem; color:var(--primary);">آخر طلبات التسعير (Leads)</h3>
<div class="admin-card" style="padding:0; overflow:hidden;">
<table class="table-custom">
<thead>
<tr>
<th>#</th>
<th>العميل</th>
<th>رقم الهاتف</th>
<th>الخدمة المطلوبة</th>
<th>الحالة</th>
<th>التاريخ</th>
</tr>
</thead>
<tbody>
<?php if (!empty($recent_quotes)): ?>
<?php foreach ($recent_quotes as $q): ?>
<tr>
<td><?php echo $q['id']; ?></td>
<td><?php echo htmlspecialchars($q['customer_name']); ?></td>
<td><?php echo htmlspecialchars($q['customer_phone']); ?></td>
<td>
<?php
// Fetch service name simply or join in query. For now, simple ID check
echo $q['service_id'] ? 'خدمة #' . $q['service_id'] : 'عام';
?>
</td>
<td>
<span class="badge badge-<?php echo $q['status']; ?>">
<?php echo $q['status'] == 'new' ? 'جديد' : ($q['status'] == 'contacted' ? 'تم التواصل' : 'مغلق'); ?>
</span>
</td>
<td><?php echo date('Y-m-d', strtotime($q['created_at'])); ?></td>
</tr>
<?php endforeach; ?>
<?php else: ?>
<tr>
<td colspan="6" style="text-align:center; padding:2rem; color:var(--text-muted);">
لا توجد طلبات تسعير حتى الآن.
</td>
</tr>
<?php endif; ?>
</tbody>
</table>
</div>
<?php require_once 'includes/footer.php'; ?>

82
admin/quotes.php Normal file
View File

@ -0,0 +1,82 @@
<?php
require_once 'includes/header.php';
// Handle Status Update (Simple Toggle for demo)
if (isset($_GET['action']) && isset($_GET['id']) && $_GET['action'] == 'mark_contacted') {
$stmt = $pdo->prepare("UPDATE quotes SET status = 'contacted' WHERE id = ?");
$stmt->execute([$_GET['id']]);
// Redirect to remove query param
echo "<script>window.location='quotes.php';</script>";
}
// Fetch All Quotes
$stmt = $pdo->query("SELECT q.*, s.title_ar as service_name
FROM quotes q
LEFT JOIN services s ON q.service_id = s.id
ORDER BY q.created_at DESC");
$quotes = $stmt->fetchAll(PDO::FETCH_ASSOC);
?>
<div style="display:flex; justify-content:space-between; align-items:center; margin-bottom:1.5rem;">
<h2 style="margin:0; color:var(--primary);">إدارة طلبات التسعير (Leads)</h2>
</div>
<div class="admin-card" style="padding:0; overflow:hidden;">
<table class="table-custom">
<thead>
<tr>
<th>#</th>
<th>العميل</th>
<th>التواصل</th>
<th>الخدمة</th>
<th>الرسالة</th>
<th>الحالة</th>
<th>إجراءات</th>
</tr>
</thead>
<tbody>
<?php if (!empty($quotes)): ?>
<?php foreach ($quotes as $q): ?>
<tr>
<td><?php echo $q['id']; ?></td>
<td><?php echo htmlspecialchars($q['customer_name']); ?></td>
<td>
<div><i class="fa-solid fa-phone"></i> <?php echo htmlspecialchars($q['customer_phone']); ?></div>
<?php if ($q['customer_email']): ?>
<div style="font-size:0.85rem; color:var(--text-muted);"><i class="fa-solid fa-envelope"></i> <?php echo htmlspecialchars($q['customer_email']); ?></div>
<?php endif; ?>
</td>
<td><?php echo htmlspecialchars($q['service_name'] ?? 'عام'); ?></td>
<td style="max-width:300px;">
<?php echo nl2br(htmlspecialchars($q['message'])); ?>
<br>
<small style="color:var(--text-muted)"><?php echo date('Y-m-d H:i', strtotime($q['created_at'])); ?></small>
</td>
<td>
<span class="badge badge-<?php echo $q['status']; ?>">
<?php echo $q['status'] == 'new' ? 'جديد' : ($q['status'] == 'contacted' ? 'تم التواصل' : 'مغلق'); ?>
</span>
</td>
<td>
<?php if ($q['status'] == 'new'): ?>
<a href="quotes.php?action=mark_contacted&id=<?php echo $q['id']; ?>" class="btn btn-primary" style="padding:0.25rem 0.5rem; font-size:0.8rem;">
<i class="fa-solid fa-check"></i> تم التواصل
</a>
<?php else: ?>
<span style="color:var(--text-muted);"><i class="fa-solid fa-check-double"></i> مكتمل</span>
<?php endif; ?>
</td>
</tr>
<?php endforeach; ?>
<?php else: ?>
<tr>
<td colspan="7" style="text-align:center; padding:2rem; color:var(--text-muted);">
لا توجد طلبات حتى الآن.
</td>
</tr>
<?php endif; ?>
</tbody>
</table>
</div>
<?php require_once 'includes/footer.php'; ?>

74
admin/services.php Normal file
View File

@ -0,0 +1,74 @@
<?php
require_once 'includes/header.php';
// Handle Add Service
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['add_service'])) {
$title = $_POST['title'];
$desc = $_POST['description'];
$price = $_POST['price'];
$icon = $_POST['icon'];
$stmt = $pdo->prepare("INSERT INTO services (title_ar, description_ar, price_start, icon_class) VALUES (?, ?, ?, ?)");
$stmt->execute([$title, $desc, $price, $icon]);
echo "<script>window.location='services.php';</script>";
}
// Fetch Services
$services = $pdo->query("SELECT * FROM services ORDER BY id DESC")->fetchAll(PDO::FETCH_ASSOC);
?>
<div style="display:flex; justify-content:space-between; align-items:center; margin-bottom:1.5rem;">
<h2 style="margin:0; color:var(--primary);">إدارة الخدمات (Custom Fields)</h2>
<button onclick="document.getElementById('add-form').style.display='block'" class="btn btn-primary">
<i class="fa-solid fa-plus"></i> إضافة خدمة جديدة
</button>
</div>
<!-- Add Form (Hidden by default) -->
<div id="add-form" class="admin-card" style="display:none; border-left: 4px solid var(--accent);">
<h3 style="margin-top:0;">إضافة خدمة جديدة</h3>
<form method="POST">
<div style="display:grid; grid-template-columns: 1fr 1fr; gap:1rem;">
<div>
<label>اسم الخدمة (عربي)</label>
<input type="text" name="title" class="tracking-input" required style="width:100%; box-sizing:border-box;">
</div>
<div>
<label>أيقونة (FontAwesome)</label>
<input type="text" name="icon" class="tracking-input" placeholder="fa-ship" value="fa-box" style="width:100%; box-sizing:border-box;">
</div>
<div style="grid-column: span 2;">
<label>وصف الخدمة</label>
<textarea name="description" class="tracking-input" rows="3" style="width:100%; box-sizing:border-box;"></textarea>
</div>
<div>
<label>سعر يبدأ من ($)</label>
<input type="number" name="price" class="tracking-input" step="0.01" style="width:100%; box-sizing:border-box;">
</div>
</div>
<div style="margin-top:1rem; text-align:left;">
<button type="button" onclick="document.getElementById('add-form').style.display='none'" class="btn" style="background:#ccc; color:#333;">إلغاء</button>
<button type="submit" name="add_service" class="btn btn-primary">حفظ الخدمة</button>
</div>
</form>
</div>
<!-- Services List -->
<div class="grid-3">
<?php foreach ($services as $s): ?>
<div class="admin-card" style="position:relative;">
<div style="font-size:2rem; color:var(--accent); margin-bottom:1rem;">
<i class="fa-solid <?php echo htmlspecialchars($s['icon_class']); ?>"></i>
</div>
<h3 style="margin:0 0 0.5rem;"><?php echo htmlspecialchars($s['title_ar']); ?></h3>
<p style="color:var(--text-muted); font-size:0.9rem; margin-bottom:1rem; min-height:3rem;">
<?php echo htmlspecialchars($s['description_ar']); ?>
</p>
<div style="font-weight:800; color:var(--primary);">
يبدأ من $<?php echo number_format($s['price_start'], 2); ?>
</div>
</div>
<?php endforeach; ?>
</div>
<?php require_once 'includes/footer.php'; ?>

View File

@ -1,346 +1,104 @@
/* Custom Theme: Navy & Gold */
:root { :root {
--color-bg: #ffffff; --primary-navy: #0A192F;
--color-text: #1a1a1a; --accent-gold: #C5A059;
--color-primary: #2563EB; /* Vibrant Blue */ --bg-light: #F8F9FA;
--color-secondary: #000000; --text-dark: #1A202C;
--color-accent: #A3E635; /* Lime Green */ --border-color: #E2E8F0;
--color-surface: #f8f9fa;
--font-heading: 'Space Grotesk', sans-serif;
--font-body: 'Inter', sans-serif;
--border-width: 2px;
--shadow-hard: 5px 5px 0px #000;
--shadow-hover: 8px 8px 0px #000;
--radius-pill: 50rem;
--radius-card: 1rem;
} }
body { body {
font-family: var(--font-body); font-family: 'Inter', system-ui, -apple-system, sans-serif;
background-color: var(--color-bg); background-color: var(--bg-light);
color: var(--color-text); color: var(--text-dark);
overflow-x: hidden; direction: rtl;
text-align: right;
} }
h1, h2, h3, h4, h5, h6, .navbar-brand {
font-family: var(--font-heading);
letter-spacing: -0.03em;
}
/* Utilities */
.text-primary { color: var(--color-primary) !important; }
.bg-black { background-color: #000 !important; }
.text-white { color: #fff !important; }
.shadow-hard { box-shadow: var(--shadow-hard); }
.border-2-black { border: var(--border-width) solid #000; }
.py-section { padding-top: 5rem; padding-bottom: 5rem; }
/* Navbar */
.navbar { .navbar {
background: rgba(255, 255, 255, 0.9); background-color: var(--primary-navy);
backdrop-filter: blur(10px); border-bottom: 2px solid var(--accent-gold);
border-bottom: var(--border-width) solid transparent;
transition: all 0.3s;
padding-top: 1rem;
padding-bottom: 1rem;
} }
.navbar.scrolled { .navbar-brand, .nav-link {
border-bottom-color: #000; color: #ffffff !important;
padding-top: 0.5rem;
padding-bottom: 0.5rem;
} }
.brand-text { .nav-link:hover {
font-size: 1.5rem; color: var(--accent-gold) !important;
font-weight: 800;
} }
.nav-link {
font-weight: 500;
color: var(--color-text);
margin-left: 1rem;
position: relative;
}
.nav-link:hover, .nav-link.active {
color: var(--color-primary);
}
/* Buttons */
.btn {
font-weight: 700;
font-family: var(--font-heading);
padding: 0.8rem 2rem;
border-radius: var(--radius-pill);
border: var(--border-width) solid #000;
transition: all 0.2s cubic-bezier(0.25, 1, 0.5, 1);
box-shadow: var(--shadow-hard);
}
.btn:hover {
transform: translate(-2px, -2px);
box-shadow: var(--shadow-hover);
}
.btn:active {
transform: translate(2px, 2px);
box-shadow: 0 0 0 #000;
}
.btn-primary {
background-color: var(--color-primary);
border-color: #000;
color: #fff;
}
.btn-primary:hover {
background-color: #1d4ed8;
border-color: #000;
color: #fff;
}
.btn-outline-dark {
background-color: #fff;
color: #000;
}
.btn-cta {
background-color: var(--color-accent);
color: #000;
}
.btn-cta:hover {
background-color: #8cc629;
color: #000;
}
/* Hero Section */
.hero-section { .hero-section {
min-height: 100vh; background-color: var(--primary-navy);
padding-top: 80px; color: #ffffff;
} padding: 100px 0;
position: relative;
.background-blob {
position: absolute;
border-radius: 50%;
filter: blur(80px);
opacity: 0.6;
z-index: 1;
}
.blob-1 {
top: -10%;
right: -10%;
width: 600px;
height: 600px;
background: radial-gradient(circle, var(--color-accent), transparent);
}
.blob-2 {
bottom: 10%;
left: -10%;
width: 500px;
height: 500px;
background: radial-gradient(circle, var(--color-primary), transparent);
}
.highlight-text {
background: linear-gradient(120deg, transparent 0%, transparent 40%, var(--color-accent) 40%, var(--color-accent) 100%);
background-repeat: no-repeat;
background-size: 100% 40%;
background-position: 0 88%;
padding: 0 5px;
}
.dot { color: var(--color-primary); }
.badge-pill {
display: inline-block;
padding: 0.5rem 1rem;
border: 2px solid #000;
border-radius: 50px;
font-weight: 700;
background: #fff;
box-shadow: 4px 4px 0 #000;
font-family: var(--font-heading);
font-size: 0.9rem;
}
/* Marquee */
.marquee-container {
overflow: hidden; overflow: hidden;
white-space: nowrap;
border-top: 2px solid #000;
border-bottom: 2px solid #000;
} }
.rotate-divider { .hero-section::after {
transform: rotate(-2deg) scale(1.05); content: "";
position: absolute;
bottom: 0;
right: 0;
width: 100%;
height: 4px;
background: var(--accent-gold);
}
.btn-gold {
background-color: var(--accent-gold);
color: var(--primary-navy);
font-weight: 600;
border: none;
padding: 12px 30px;
border-radius: 4px;
transition: all 0.3s ease;
}
.btn-gold:hover {
background-color: #b38f4d;
color: #ffffff;
transform: translateY(-2px);
}
.card {
border: 1px solid var(--border-color);
border-radius: 4px;
box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
.tracking-card {
margin-top: -50px;
z-index: 10; z-index: 10;
position: relative; position: relative;
margin-top: -50px;
margin-bottom: 30px;
} }
.marquee-content { .status-badge {
display: inline-block; padding: 5px 15px;
animation: marquee 20s linear infinite;
font-family: var(--font-heading);
font-weight: 700;
font-size: 1.5rem;
letter-spacing: 2px;
}
@keyframes marquee {
0% { transform: translateX(0); }
100% { transform: translateX(-50%); }
}
/* Portfolio Cards */
.project-card {
border: 2px solid #000;
border-radius: var(--radius-card);
overflow: hidden;
background: #fff;
transition: transform 0.3s ease;
box-shadow: var(--shadow-hard);
height: 100%;
display: flex;
flex-direction: column;
}
.project-card:hover {
transform: translateY(-10px);
box-shadow: 8px 8px 0 #000;
}
.card-img-holder {
height: 250px;
display: flex;
align-items: center;
justify-content: center;
border-bottom: 2px solid #000;
position: relative;
font-size: 4rem;
}
.placeholder-art {
transition: transform 0.3s ease;
}
.project-card:hover .placeholder-art {
transform: scale(1.2) rotate(10deg);
}
.bg-soft-blue { background-color: #e0f2fe; }
.bg-soft-green { background-color: #dcfce7; }
.bg-soft-purple { background-color: #f3e8ff; }
.bg-soft-yellow { background-color: #fef9c3; }
.category-tag {
position: absolute;
top: 15px;
right: 15px;
background: #000;
color: #fff;
padding: 5px 12px;
border-radius: 20px; border-radius: 20px;
font-size: 0.75rem; font-size: 0.85rem;
font-weight: 700; font-weight: 600;
} }
.card-body { padding: 1.5rem; } .status-on-way { background-color: #EBF8FF; color: #2B6CB0; }
.status-delivered { background-color: #F0FFF4; color: #2F855A; }
.status-pending { background-color: #FFFAF0; color: #9C4221; }
.link-arrow { .section-title {
text-decoration: none; color: var(--primary-navy);
color: #000;
font-weight: 700; font-weight: 700;
display: inline-flex; margin-bottom: 40px;
align-items: center;
margin-top: auto;
}
.link-arrow i { transition: transform 0.2s; margin-left: 5px; }
.link-arrow:hover i { transform: translateX(5px); }
/* About */
.about-image-stack {
position: relative; position: relative;
height: 400px;
width: 100%;
}
.stack-card {
position: absolute;
width: 80%;
height: 100%;
border-radius: var(--radius-card);
border: 2px solid #000;
box-shadow: var(--shadow-hard);
left: 10%;
transform: rotate(-3deg);
background-size: cover;
}
/* Forms */
.form-control {
border: 2px solid #000;
border-radius: 0.5rem;
padding: 1rem;
font-weight: 500;
background: #f8f9fa;
}
.form-control:focus {
box-shadow: 4px 4px 0 var(--color-primary);
border-color: #000;
background: #fff;
}
/* Animations */
.animate-up {
opacity: 0;
transform: translateY(30px);
animation: fadeUp 0.8s ease forwards;
}
.delay-100 { animation-delay: 0.1s; }
.delay-200 { animation-delay: 0.2s; }
@keyframes fadeUp {
to {
opacity: 1;
transform: translateY(0);
}
}
/* Social */
.social-links a {
transition: transform 0.2s;
display: inline-block; display: inline-block;
} }
.social-links a:hover {
transform: scale(1.2) rotate(10deg); .section-title::after {
color: var(--color-accent) !important; content: "";
} position: absolute;
bottom: -10px;
/* Responsive */ right: 0;
@media (max-width: 991px) { width: 40px;
.rotate-divider { height: 3px;
transform: rotate(0); background: var(--accent-gold);
margin-top: 0;
margin-bottom: 2rem;
}
.hero-section {
padding-top: 120px;
text-align: center;
min-height: auto;
padding-bottom: 100px;
}
.display-1 { font-size: 3.5rem; }
.blob-1 { width: 300px; height: 300px; right: -20%; }
.blob-2 { width: 300px; height: 300px; left: -20%; }
} }

View File

@ -0,0 +1,44 @@
CREATE TABLE IF NOT EXISTS services (
id INT AUTO_INCREMENT PRIMARY KEY,
title_ar VARCHAR(255) NOT NULL,
description_ar TEXT,
icon_class VARCHAR(50),
price_start DECIMAL(10,2) DEFAULT 0.00,
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);
CREATE TABLE IF NOT EXISTS quotes (
id INT AUTO_INCREMENT PRIMARY KEY,
service_id INT,
customer_name VARCHAR(255) NOT NULL,
customer_phone VARCHAR(50),
customer_email VARCHAR(255),
message TEXT,
status ENUM('new', 'contacted', 'closed') DEFAULT 'new',
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);
-- Seed Services if empty
INSERT INTO services (title_ar, description_ar, icon_class, price_start)
SELECT * FROM (SELECT 'الشحن البحري', 'حلول شحن بحري موثوقة لمختلف الأحجام والحاويات (FCL/LCL) مع ضمان الوصول الآمن.', 'fa-ship', 500.00) AS tmp
WHERE NOT EXISTS (
SELECT title_ar FROM services WHERE title_ar = 'الشحن البحري'
) LIMIT 1;
INSERT INTO services (title_ar, description_ar, icon_class, price_start)
SELECT * FROM (SELECT 'الشحن الجوي', 'نقل جوي سريع وآمن للبضائع المستعجلة والقيمة لجميع مطارات العالم.', 'fa-plane', 1200.00) AS tmp
WHERE NOT EXISTS (
SELECT title_ar FROM services WHERE title_ar = 'الشحن الجوي'
) LIMIT 1;
INSERT INTO services (title_ar, description_ar, icon_class, price_start)
SELECT * FROM (SELECT 'التخزين واللوجستيات', 'مستودعات آمنة ومجهزة بأحدث أنظمة التتبع والإدارة للتحكم بالمخزون.', 'fa-warehouse', 200.00) AS tmp
WHERE NOT EXISTS (
SELECT title_ar FROM services WHERE title_ar = 'التخزين واللوجستيات'
) LIMIT 1;
INSERT INTO services (title_ar, description_ar, icon_class, price_start)
SELECT * FROM (SELECT 'التخليص الجمركي', 'فريق متخصص لإنهاء كافة الإجراءات الجمركية بسرعة وفعالية لضمان تدفق البضائع.', 'fa-file-signature', 150.00) AS tmp
WHERE NOT EXISTS (
SELECT title_ar FROM services WHERE title_ar = 'التخليص الجمركي'
) LIMIT 1;

13
includes/footer.php Normal file
View File

@ -0,0 +1,13 @@
<footer>
<div class="container">
<p>&copy; <?php echo date('Y'); ?> Logistic Pro. All rights reserved.</p>
<p>PHP Powered Secure Fast</p>
</div>
</footer>
<!-- Scripts -->
<!-- <script src="assets/js/main.js"></script> -->
<?php if (isset($extra_scripts)) echo $extra_scripts; ?>
</body>
</html>

132
includes/header.php Normal file
View File

@ -0,0 +1,132 @@
<?php
// includes/header.php
if (!isset($page_title)) {
$page_title = 'لوجستيك برو | حلول الشحن الذكية';
}
?>
<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?php echo htmlspecialchars($page_title); ?></title>
<!-- SEO Meta Tags -->
<meta name="description" content="<?php echo htmlspecialchars($page_description ?? 'تتبع شحنتك بسهولة مع لوجستيك برو. خدمات شحن بحري وجوي وتخليص جمركي بأعلى المعايير.'); ?>">
<!-- Fonts: Inter for numbers/English, System UI for Arabic fallback -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
<!-- FontAwesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<!-- Custom/Theme Styles -->
<link rel="stylesheet" href="assets/css/custom.css">
<!-- Note: We are moving inline styles to assets/css/custom.css -->
<style>
/* Critical CSS or variables */
:root {
--primary: #0A192F; /* Deep Navy */
--accent: #C5A059; /* Elegant Gold */
--bg-light: #F8F9FA;
--surface: #FFFFFF;
--text-dark: #1E293B;
--text-muted: #64748B;
--border: #E2E8F0;
}
* { box-sizing: border-box; }
body {
margin: 0;
font-family: 'Inter', system-ui, -apple-system, sans-serif;
background-color: var(--bg-light);
color: var(--text-dark);
line-height: 1.6;
}
/* Utility */
.container {
max-width: 1200px;
margin: 0 auto;
padding: 0 1.5rem;
}
.btn {
display: inline-block;
padding: 0.8rem 1.5rem;
border-radius: 4px;
font-weight: 600;
text-decoration: none;
transition: all 0.2s;
cursor: pointer;
border: none;
}
.btn-primary {
background-color: var(--accent);
color: white;
}
.btn-primary:hover {
background-color: #b08d4b;
}
/* Navbar Styles (needed for include/nav.php) */
.navbar {
background-color: var(--primary);
height: 70px;
display: flex;
align-items: center;
border-bottom: 1px solid rgba(255,255,255,0.1);
}
.nav-content {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
}
.logo {
font-size: 1.5rem;
font-weight: 800;
color: var(--accent);
text-decoration: none;
letter-spacing: -0.5px;
}
.nav-links {
display: flex;
gap: 2rem;
}
.nav-links a {
color: rgba(255,255,255,0.8);
text-decoration: none;
font-weight: 500;
font-size: 0.95rem;
transition: color 0.2s;
}
.nav-links a:hover, .nav-links a.active {
color: var(--accent);
}
/* Footer */
footer {
background: var(--primary);
color: rgba(255,255,255,0.6);
padding: 3rem 0;
text-align: center;
font-size: 0.9rem;
margin-top: auto;
}
/* Layout fix for sticky footer */
body {
min-height: 100vh;
display: flex;
flex-direction: column;
}
</style>
<?php if (isset($extra_styles)) echo $extra_styles; ?>
</head>
<body>
<?php require_once __DIR__ . '/nav.php'; ?>

29
includes/nav.php Normal file
View File

@ -0,0 +1,29 @@
<?php
// includes/nav.php - Dynamic Navigation Menu
$current_page = basename($_SERVER['PHP_SELF']);
$menu_items = [
'index.php' => 'الرئيسية',
'services.php' => 'الخدمات',
'quote.php' => 'طلب تسعير',
'#' => 'تتبع الشحنة', // Placeholder
'contact.php' => 'اتصل بنا', // Placeholder or future
];
?>
<!-- Navigation -->
<nav class="navbar">
<div class="container nav-content">
<a href="index.php" class="logo">
<i class="fa-solid fa-anchor"></i> لوجستيك برو
</a>
<div class="nav-links">
<?php foreach ($menu_items as $link => $label): ?>
<a href="<?php echo $link; ?>" class="<?php echo ($link === $current_page) ? 'active' : ''; ?>">
<?php echo $label; ?>
</a>
<?php endforeach; ?>
</div>
<a href="quote.php" class="btn btn-primary">عميل جديد؟</a>
</div>
</nav>

342
index.php
View File

@ -1,150 +1,198 @@
<?php <?php
declare(strict_types=1); // Database connection
@ini_set('display_errors', '1'); require_once 'db/config.php';
@error_reporting(E_ALL); $pdo = db();
@date_default_timezone_set('UTC');
$phpVersion = PHP_VERSION; // Handle Search logic if needed (POST request)
$now = date('Y-m-d H:i:s'); $tracking_result = null;
if ($_SERVER['REQUEST_METHOD'] === 'POST' && !empty($_POST['tracking_number'])) {
$tracking_number = trim($_POST['tracking_number']);
$stmt = $pdo->prepare("SELECT * FROM shipments WHERE tracking_number = ?");
$stmt->execute([$tracking_number]);
$tracking_result = $stmt->fetch(PDO::FETCH_ASSOC);
}
$page_title = 'لوجستيك برو | حلول الشحن الذكية';
$extra_styles = '
<style>
/* Hero Section */
.hero {
background-color: var(--primary);
color: white;
padding: 5rem 0 8rem;
text-align: center;
position: relative;
overflow: hidden;
}
.hero::after {
content: "";
position: absolute;
bottom: -50px;
left: 0;
width: 100%;
height: 100px;
background: var(--bg-light);
transform: skewY(-2deg);
}
.hero h1 {
font-size: 3rem;
font-weight: 800;
margin-bottom: 1rem;
line-height: 1.2;
}
.hero p {
font-size: 1.125rem;
color: rgba(255,255,255,0.7);
max-width: 600px;
margin: 0 auto 3rem;
}
/* Tracking Box */
.tracking-box {
background: var(--surface);
max-width: 700px;
margin: -4rem auto 4rem; /* Overlap hero */
padding: 2rem;
border-radius: 8px;
box-shadow: 0 10px 30px rgba(0,0,0,0.1);
position: relative;
z-index: 10;
}
.tracking-form {
display: flex;
gap: 1rem;
}
.tracking-input {
flex: 1;
padding: 1rem;
border: 2px solid var(--border);
border-radius: 4px;
font-size: 1rem;
outline: none;
transition: border-color 0.2s;
}
.tracking-input:focus {
border-color: var(--accent);
}
/* Tracking Result */
.result-card {
margin-top: 2rem;
padding: 1.5rem;
border: 1px solid var(--border);
border-radius: 4px;
background: #f1f5f9;
}
.status-badge {
display: inline-block;
padding: 0.25rem 0.75rem;
border-radius: 50px;
font-size: 0.85rem;
font-weight: 600;
}
.status-transit { background: #DBEAFE; color: #1E40AF; }
.status-delivered { background: #D1FAE5; color: #065F46; }
/* Features/Services Preview */
.section-title {
text-align: center;
margin-bottom: 3rem;
}
.section-title h2 {
font-size: 2rem;
color: var(--primary);
margin-bottom: 0.5rem;
}
.grid-3 {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 2rem;
padding-bottom: 4rem;
}
.feature-card {
background: var(--surface);
padding: 2rem;
border-radius: 8px;
border: 1px solid var(--border);
transition: transform 0.2s;
}
.feature-card:hover {
transform: translateY(-5px);
border-color: var(--accent);
}
.feature-icon {
font-size: 2rem;
color: var(--accent);
margin-bottom: 1rem;
}
</style>
';
require_once 'includes/header.php';
?> ?>
<!doctype html>
<html lang="en"> <!-- Hero -->
<head> <section class="hero">
<meta charset="utf-8" /> <div class="container">
<meta name="viewport" content="width=device-width, initial-scale=1" /> <h1>شريكك الاستراتيجي<br>في عالم اللوجستيات</h1>
<title>New Style</title> <p>نقدم حلول شحن متكاملة، آمنة، وسريعة لربط أعمالك بالعالم.</p>
<?php </div>
// Read project preview data from environment </section>
$projectDescription = $_SERVER['PROJECT_DESCRIPTION'] ?? '';
$projectImageUrl = $_SERVER['PROJECT_IMAGE_URL'] ?? ''; <!-- Tracking Section -->
?> <section class="container">
<?php if ($projectDescription): ?> <div class="tracking-box">
<!-- Meta description --> <h3 style="margin-top:0; color:var(--primary);">تتبع شحنتك</h3>
<meta name="description" content='<?= htmlspecialchars($projectDescription) ?>' /> <form class="tracking-form" method="POST">
<!-- Open Graph meta tags --> <input type="text" name="tracking_number" class="tracking-input" placeholder="أدخل رقم التتبع (مثال: SHP-1001)" required value="<?php echo htmlspecialchars($_POST['tracking_number'] ?? ''); ?>">
<meta property="og:description" content="<?= htmlspecialchars($projectDescription) ?>" /> <button type="submit" class="btn btn-primary">بحث</button>
<!-- Twitter meta tags --> </form>
<meta property="twitter:description" content="<?= htmlspecialchars($projectDescription) ?>" />
<?php endif; ?> <?php if ($tracking_result): ?>
<?php if ($projectImageUrl): ?> <div class="result-card">
<!-- Open Graph image --> <div style="display:flex; justify-content:space-between; align-items:center; margin-bottom:1rem;">
<meta property="og:image" content="<?= htmlspecialchars($projectImageUrl) ?>" /> <strong>رقم الشحنة: <?php echo htmlspecialchars($tracking_result['tracking_number']); ?></strong>
<!-- Twitter image --> <span class="status-badge <?php echo $tracking_result['status'] == 'Delivered' ? 'status-delivered' : 'status-transit'; ?>">
<meta property="twitter:image" content="<?= htmlspecialchars($projectImageUrl) ?>" /> <?php echo htmlspecialchars($tracking_result['status']); ?>
<?php endif; ?> </span>
<link rel="preconnect" href="https://fonts.googleapis.com"> </div>
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <p><i class="fa-solid fa-location-dot"></i> الموقع الحالي: <?php echo htmlspecialchars($tracking_result['current_location']); ?></p>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap" rel="stylesheet"> <p><i class="fa-regular fa-clock"></i> آخر تحديث: <?php echo htmlspecialchars($tracking_result['updated_at']); ?></p>
<style> </div>
:root { <?php elseif ($_SERVER['REQUEST_METHOD'] === 'POST'): ?>
--bg-color-start: #6a11cb; <div class="result-card" style="color:red;">
--bg-color-end: #2575fc; عذراً، لم يتم العثور على شحنة بهذا الرقم.
--text-color: #ffffff; </div>
--card-bg-color: rgba(255, 255, 255, 0.01); <?php endif; ?>
--card-border-color: rgba(255, 255, 255, 0.1); </div>
} </section>
body {
margin: 0; <!-- Features -->
font-family: 'Inter', sans-serif; <section class="container">
background: linear-gradient(45deg, var(--bg-color-start), var(--bg-color-end)); <div class="section-title">
color: var(--text-color); <h2>لماذا تختارنا؟</h2>
display: flex; <p style="color:var(--text-muted)">خدمات مصممة لتنمية أعمالك</p>
justify-content: center; </div>
align-items: center; <div class="grid-3">
min-height: 100vh; <div class="feature-card">
text-align: center; <i class="fa-solid fa-ship feature-icon"></i>
overflow: hidden; <h3>شحن بحري</h3>
position: relative; <p class="text-muted">حلول اقتصادية للشحنات الكبيرة عبر المحيطات مع تتبع مباشر.</p>
} <a href="services.php" style="color:var(--accent); text-decoration:none;">المزيد &larr;</a>
body::before { </div>
content: ''; <div class="feature-card">
position: absolute; <i class="fa-solid fa-plane-departure feature-icon"></i>
top: 0; <h3>شحن جوي</h3>
left: 0; <p class="text-muted">أسرع وسيلة لنقل بضائعك الحساسة والمستعجلة لأي مكان.</p>
width: 100%; <a href="services.php" style="color:var(--accent); text-decoration:none;">المزيد &larr;</a>
height: 100%; </div>
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><path d="M-10 10L110 10M10 -10L10 110" stroke-width="1" stroke="rgba(255,255,255,0.05)"/></svg>'); <div class="feature-card">
animation: bg-pan 20s linear infinite; <i class="fa-solid fa-boxes-stacked feature-icon"></i>
z-index: -1; <h3>تخزين ذكي</h3>
} <p class="text-muted">مستودعات آمنة ونظام إدارة مخزون متطور لخدمتك.</p>
@keyframes bg-pan { <a href="services.php" style="color:var(--accent); text-decoration:none;">المزيد &larr;</a>
0% { background-position: 0% 0%; } </div>
100% { background-position: 100% 100%; } </div>
} </section>
main {
padding: 2rem; <?php require_once 'includes/footer.php'; ?>
}
.card {
background: var(--card-bg-color);
border: 1px solid var(--card-border-color);
border-radius: 16px;
padding: 2rem;
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.1);
}
.loader {
margin: 1.25rem auto 1.25rem;
width: 48px;
height: 48px;
border: 3px solid rgba(255, 255, 255, 0.25);
border-top-color: #fff;
border-radius: 50%;
animation: spin 1s linear infinite;
}
@keyframes spin {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
.hint {
opacity: 0.9;
}
.sr-only {
position: absolute;
width: 1px; height: 1px;
padding: 0; margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap; border: 0;
}
h1 {
font-size: 3rem;
font-weight: 700;
margin: 0 0 1rem;
letter-spacing: -1px;
}
p {
margin: 0.5rem 0;
font-size: 1.1rem;
}
code {
background: rgba(0,0,0,0.2);
padding: 2px 6px;
border-radius: 4px;
font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
footer {
position: absolute;
bottom: 1rem;
font-size: 0.8rem;
opacity: 0.7;
}
</style>
</head>
<body>
<main>
<div class="card">
<h1>Analyzing your requirements and generating your website…</h1>
<div class="loader" role="status" aria-live="polite" aria-label="Applying initial changes">
<span class="sr-only">Loading…</span>
</div>
<p class="hint"><?= ($_SERVER['HTTP_HOST'] ?? '') === 'appwizzy.com' ? 'AppWizzy' : 'Flatlogic' ?> AI is collecting your requirements and applying the first changes.</p>
<p class="hint">This page will update automatically as the plan is implemented.</p>
<p>Runtime: PHP <code><?= htmlspecialchars($phpVersion) ?></code> — UTC <code><?= htmlspecialchars($now) ?></code></p>
</div>
</main>
<footer>
Page updated: <?= htmlspecialchars($now) ?> (UTC)
</footer>
</body>
</html>

169
quote.php Normal file
View File

@ -0,0 +1,169 @@
<?php
require_once 'db/config.php';
require_once 'mail/MailService.php';
$message_sent = false;
$error_msg = '';
$services = [];
// Fetch services for dropdown
try {
$pdo = db();
$stmt = $pdo->query("SELECT id, title_ar FROM services ORDER BY id ASC");
$services = $stmt->fetchAll(PDO::FETCH_ASSOC);
} catch (Exception $e) {
// Silent fail for dropdown, but log it
error_log("DB Error: " . $e->getMessage());
}
// Handle Form Submission
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
$name = trim($_POST['name'] ?? '');
$email = trim($_POST['email'] ?? '');
$phone = trim($_POST['phone'] ?? '');
$service_id = (int)($_POST['service_id'] ?? 0);
$details = trim($_POST['message'] ?? '');
if (empty($name) || empty($email)) {
$error_msg = 'يرجى ملء الاسم والبريد الإلكتروني.';
} else {
try {
// 1. Save to DB
$stmt = $pdo->prepare("INSERT INTO quotes (customer_name, customer_email, customer_phone, service_id, message) VALUES (?, ?, ?, ?, ?)");
$stmt->execute([$name, $email, $phone, $service_id, $details]);
// 2. Send Email
// Using MailService as per context
$admin_email = getenv('MAIL_TO') ?: getenv('MAIL_FROM'); // Fallback
if ($admin_email) {
MailService::sendMail(
$admin_email,
"طلب تسعير جديد: $name",
"<p>عميل جديد طلب تسعير.</p><ul><li>الاسم: $name</li><li>Email: $email</li><li>الهاتف: $phone</li><li>التفاصيل: $details</li></ul>",
"طلب تسعير جديد من $name"
);
}
$message_sent = true;
} catch (Exception $e) {
$error_msg = 'حدث خطأ أثناء إرسال الطلب. يرجى المحاولة لاحقاً.';
error_log($e->getMessage());
}
}
}
$selected_service = isset($_GET['service']) ? (int)$_GET['service'] : 0;
$page_title = 'طلب عرض سعر - شركة الشحن واللوجستيات';
$extra_styles = '
<style>
.quote-box {
background: var(--surface);
padding: 3rem;
border-radius: 8px;
box-shadow: 0 4px 20px rgba(0,0,0,0.05);
border-top: 5px solid var(--accent);
max-width: 800px;
margin: 4rem auto;
}
h1 { margin-top: 0; color: var(--primary); text-align: center; }
.form-group { margin-bottom: 1.5rem; }
label { display: block; margin-bottom: 0.5rem; font-weight: 600; }
input, select, textarea {
width: 100%;
padding: 0.8rem;
border: 1px solid var(--border);
border-radius: 4px;
font-family: inherit;
box-sizing: border-box;
}
input:focus, select:focus, textarea:focus {
outline: none;
border-color: var(--accent);
box-shadow: 0 0 0 2px rgba(197, 160, 89, 0.2);
}
.btn-submit {
background: var(--accent);
color: white;
border: none;
padding: 1rem 2rem;
font-size: 1.1rem;
font-weight: 700;
border-radius: 4px;
cursor: pointer;
width: 100%;
transition: background 0.3s;
}
.btn-submit:hover { background: #b08d4b; }
.alert {
padding: 1rem;
border-radius: 4px;
margin-bottom: 2rem;
text-align: center;
}
.alert-success { background: #d1fae5; color: #065f46; border: 1px solid #a7f3d0; }
.alert-error { background: #fee2e2; color: #991b1b; border: 1px solid #fecaca; }
</style>
';
require_once 'includes/header.php';
?>
<div class="container">
<div class="quote-box">
<h1>طلب عرض سعر</h1>
<p style="text-align: center; color: #64748B; margin-bottom: 2rem;">املأ النموذج أدناه وسيقوم فريق المبيعات بالتواصل معك في أقرب وقت.</p>
<?php if ($message_sent): ?>
<div class="alert alert-success">
تم استلام طلبك بنجاح! سنتواصل معك قريباً.
</div>
<?php elseif ($error_msg): ?>
<div class="alert alert-error">
<?php echo htmlspecialchars($error_msg); ?>
</div>
<?php endif; ?>
<?php if (!$message_sent): ?>
<form method="POST" action="quote.php">
<div class="form-group">
<label for="name">الاسم الكامل *</label>
<input type="text" id="name" name="name" required placeholder="محمد أحمد">
</div>
<div class="form-group" style="display: grid; grid-template-columns: 1fr 1fr; gap: 1rem;">
<div>
<label for="email">البريد الإلكتروني *</label>
<input type="email" id="email" name="email" required placeholder="name@company.com">
</div>
<div>
<label for="phone">رقم الهاتف</label>
<input type="text" id="phone" name="phone" placeholder="05xxxxxxxx">
</div>
</div>
<div class="form-group">
<label for="service_id">نوع الخدمة المطلوبة</label>
<select id="service_id" name="service_id">
<option value="0">-- اختر الخدمة --</option>
<?php foreach ($services as $s): ?>
<option value="<?php echo $s['id']; ?>" <?php echo ($selected_service == $s['id']) ? 'selected' : ''; ?>>
<?php echo htmlspecialchars($s['title_ar']); ?>
</option>
<?php endforeach; ?>
<option value="-1">أخرى / استشارة عامة</option>
</select>
</div>
<div class="form-group">
<label for="message">تفاصيل الشحنة / الرسالة</label>
<textarea id="message" name="message" rows="5" placeholder="أذكر الوزن التقريبي، الوجهة، وأي تفاصيل أخرى..."></textarea>
</div>
<button type="submit" class="btn-submit">إرسال الطلب</button>
</form>
<?php endif; ?>
</div>
</div>
<?php require_once 'includes/footer.php'; ?>

122
services.php Normal file
View File

@ -0,0 +1,122 @@
<?php
require_once 'db/config.php';
$pdo = db();
$stmt = $pdo->query("SELECT * FROM services ORDER BY id ASC");
$services = $stmt->fetchAll(PDO::FETCH_ASSOC);
$page_title = 'خدماتنا - شركة الشحن واللوجستيات';
$page_description = 'استكشف خدمات الشحن البحري والجوي والتخليص الجمركي. حلول لوجستية متكاملة لعملك.';
$extra_styles = '
<style>
/* Page Header */
.page-header {
background-color: var(--primary);
color: white;
text-align: center;
padding: 3rem 1rem;
margin-bottom: 2rem;
}
.page-header h1 {
margin: 0;
font-size: 2.5rem;
color: var(--accent);
}
.page-header p {
opacity: 0.9;
max-width: 600px;
margin: 1rem auto 0;
}
/* Services Grid */
.services-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 2rem;
padding-bottom: 4rem;
}
.service-card {
background: var(--surface);
border: 1px solid var(--border);
border-radius: 4px;
padding: 2rem;
transition: transform 0.2s, box-shadow 0.2s;
text-align: center;
}
.service-card:hover {
transform: translateY(-5px);
box-shadow: 0 10px 20px rgba(0,0,0,0.05);
border-color: var(--accent);
}
.icon-box {
width: 70px;
height: 70px;
background: rgba(197, 160, 89, 0.1);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 1.5rem;
color: var(--accent);
font-size: 1.75rem;
}
.service-title {
font-size: 1.25rem;
font-weight: 700;
margin-bottom: 1rem;
color: var(--primary);
}
.service-desc {
font-size: 0.95rem;
color: #64748B;
margin-bottom: 1.5rem;
}
.service-price {
font-weight: 700;
color: var(--text-dark);
margin-bottom: 1.5rem;
display: block;
}
.btn-outline {
display: inline-block;
padding: 0.75rem 1.5rem;
border: 2px solid var(--accent);
color: var(--accent);
text-decoration: none;
font-weight: 600;
border-radius: 4px;
transition: all 0.3s;
}
.btn-outline:hover {
background: var(--accent);
color: white;
}
</style>
';
require_once 'includes/header.php';
?>
<header class="page-header">
<h1>خدماتنا اللوجستية</h1>
<p>نقدم حلولاً متكاملة لتلبية جميع احتياجات النقل والتخزين الخاصة بك بأعلى معايير الجودة.</p>
</header>
<main class="container">
<div class="services-grid">
<?php foreach($services as $svc): ?>
<div class="service-card">
<div class="icon-box">
<i class="fas <?php echo htmlspecialchars($svc['icon_class']); ?>"></i>
</div>
<h3 class="service-title"><?php echo htmlspecialchars($svc['title_ar']); ?></h3>
<p class="service-desc"><?php echo htmlspecialchars($svc['description_ar']); ?></p>
<span class="service-price">تبدأ من <?php echo number_format($svc['price_start'], 0); ?> ريال</span>
<br>
<a href="quote.php?service=<?php echo $svc['id']; ?>" class="btn-outline">اطلب الخدمة الآن</a>
</div>
<?php endforeach; ?>
</div>
</main>
<?php require_once 'includes/footer.php'; ?>