diff --git a/resources/views/Feedback&Complain.blade.php b/resources/views/Feedback&Complain.blade.php
index 08ae2e5..7e3dc02 100644
--- a/resources/views/Feedback&Complain.blade.php
+++ b/resources/views/Feedback&Complain.blade.php
@@ -1,111 +1,170 @@
 @extends('layouts.studentportalnav')
 
-@section('title','Feedback & Complaint')
+@section('title', 'Feedback & Complaint')
 
 @section('content')
 
+<!-- Bootstrap 5 -->
+<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
+
+<!-- Font Awesome -->
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+
+<!-- Google Font -->
+<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
+
 <style>
-body{
-    background:#f6f7fb;
+:root {
+    --theme-navy: #2D355B;        /* Primary Navy */
+    --theme-navy-dark: #1F2541;   /* Dark Navy */
+    --theme-red: #822424;         /* Primary Accent Red */
+    --theme-red-hover: #df2c3e;   /* Red Hover */
+    --theme-yellow: #FFEA85;      /* Accent Yellow/Gold */
+    --bg-light: #F6F6F6;          /* Page Background */
+    --white: #ffffff;
+}
+
+body {
+    font-family: 'Poppins', sans-serif;
+    background: var(--bg-light);
 }
 
 /* Header */
-.feedback-header{
-    background:linear-gradient(135deg,#5E244E,#4a1c3e);
-    color:white;
-    padding:40px;
-    border-radius:20px;
-    margin-bottom:35px;
-    box-shadow:0 15px 35px rgba(0,0,0,.12);
+.feedback-header {
+    background: linear-gradient(135deg, #2B293F 0%, #94A6F959 100%) !important;
+    color: var(--white);
+    padding: 35px 30px;
+    border-radius: 16px;
+    margin-bottom: 30px;
+    box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15);
+    border-left: 5px solid var(--theme-red);
 }
 
-.feedback-header h2{
-    font-weight:700;
+.feedback-header h2 {
+    font-weight: 700;
 }
 
-.feedback-header p{
-    color:#ddd;
+.feedback-header p {
+    color: rgba(255, 255, 255, 0.85);
+    margin-bottom: 0;
 }
 
 /* Cards */
-.feedback-card{
-    background:#fff;
-    border-radius:20px;
-    border:none;
-    padding:30px;
-    box-shadow:0 10px 30px rgba(0,0,0,.08);
-    height:100%;
+.feedback-card {
+    background: var(--white);
+    border: 1px solid #e2e8f0;
+    border-radius: 16px;
+    padding: 30px;
+    box-shadow: 0 4px 15px rgba(0, 0, 0, .04);
+    height: 100%;
 }
 
-.card-title{
-    color:#5E244E;
-    font-weight:700;
-    margin-bottom:25px;
+.card-title {
+    color: var(--theme-navy);
+    font-weight: 700;
+    margin-bottom: 25px;
 }
 
-.card-title i{
-    color:#d4af37;
-    margin-right:8px;
+.card-title i {
+    color: var(--theme-red);
+    margin-right: 8px;
+}
+
+/* Form Controls */
+.form-label {
+    font-weight: 600;
+    color: var(--theme-navy);
+    font-size: 14px;
 }
 
-/* Inputs */
 .form-control,
-.form-select{
-    border-radius:15px;
-    padding:12px;
-    border:1px solid #ddd;
+.form-select {
+    border-radius: 10px;
+    padding: 12px 15px;
+    border: 1px solid #cbd5e1;
+    font-size: 14px;
 }
 
 .form-control:focus,
-.form-select:focus{
-    border-color:#744a68;
-    box-shadow:0 0 0 .2rem rgba(94,36,78,.15);
+.form-select:focus {
+    border-color: var(--theme-navy);
+    box-shadow: 0 0 0 0.25rem rgba(45, 53, 91, 0.15);
 }
 
-/* Button */
-.submit-btn{
-    background:#5E244E;
-    color:white;
-    border:none;
-    border-radius:50px;
-    padding:12px 30px;
-    font-weight:600;
+/* Buttons */
+.submit-btn {
+    background: var(--theme-red) !important;
+    color: var(--white) !important;
+    border: none;
+    border-radius: 8px;
+    padding: 12px 30px;
+    font-weight: 600;
+    transition: all 0.2s ease;
+    width: 100%;
 }
 
-.submit-btn:hover{
-    background:#4a1c3e;
-    color:#fff;
+.submit-btn:hover {
+    background: var(--theme-red-hover) !important;
+    color: var(--white) !important;
 }
 
-/* History */
-.history-card{
-    margin-top:35px;
-    background:white;
-    border-radius:20px;
-    overflow:hidden;
-    box-shadow:0 10px 30px rgba(0,0,0,.08);
+/* History Card */
+.history-card {
+    margin-top: 35px;
+    background: var(--white);
+    border: 1px solid #e2e8f0;
+    border-radius: 16px;
+    overflow: hidden;
+    box-shadow: 0 4px 15px rgba(0, 0, 0, .04);
 }
 
-.history-head{
-    background:#5E244E;
-    color:white;
-    padding:18px 25px;
+.history-head {
+    background: var(--theme-navy);
+    color: var(--white);
+    padding: 18px 25px;
 }
 
-.badge-status{
-    padding:7px 15px;
-    border-radius:50px;
-    font-size:13px;
+.history-head h5 {
+    font-weight: 700;
+    margin: 0;
 }
 
-.pending{
-    background:#fff3cd;
-    color:#856404;
+.table th {
+    background: #f8fafc;
+    color: var(--theme-navy);
+    font-weight: 600;
+    border-bottom: 2px solid #e2e8f0;
+    padding: 14px 20px;
 }
 
-.resolved{
-    background:#d1e7dd;
-    color:#0f5132;
+.table td {
+    vertical-align: middle;
+    padding: 14px 20px;
+}
+
+/* Status Badges */
+.badge-status {
+    padding: 6px 14px;
+    border-radius: 30px;
+    font-size: 12px;
+    font-weight: 600;
+    display: inline-block;
+}
+
+.pending {
+    background: rgba(255, 234, 133, 0.4);
+    color: #856404;
+}
+
+.resolved {
+    background: #d1e7dd;
+    color: #0f5132;
+}
+
+@media(max-width:768px) {
+    .feedback-header, .feedback-card {
+        padding: 25px;
+    }
 }
 </style>
 
@@ -113,89 +172,21 @@ body{
 
     <!-- Header -->
     <div class="feedback-header">
-        <h2><i class="fas fa-comments"></i> Feedback & Complaint</h2>
-        <p> Share your suggestions, feedback, or complaints with the
-            Automobile Engineering Academy management team.</p>
+        <h2 class="mb-1"><i class="fas fa-comments me-2" style="color: var(--theme-yellow);"></i> Feedback & Complaint</h2>
+        <p>Share your suggestions, feedback, or complaints with the Automobile Engineering Academy management team.</p>
     </div>
 
-    <div class="row g-4">
-        <!-- Feedback Form -->
-        <div class="col-lg-6">
-            <div class="feedback-card">
-                <h4 class="card-title"><i class="fas fa-star"></i> Submit Feedback</h4>
-                <form id="feedbackForm" action="{{ route('feedback.store') }}" method="POST">
-    @csrf
-    <div class="mb-3">
-        <label class="form-label"> Feedback Type </label>
-        <!-- Added name="feedback_type" -->
-        <select class="form-select" id="feedbackType" name="feedback_type" required>
-            <option value=""> Select Type </option>
-            <option value="Course">Course</option>
-            <option value="Lecturer">Lecturer </option>
-            <option value="Workshop">Workshop </option>
-            <option value="Facilities"> Facilities </option>
-        </select>
-    </div>
-    <div class="mb-3">
-        <label class="form-label">Subject </label>
-        <!-- Added name="subject" -->
-        <input type="text" class="form-control" id="feedbackSubject" name="subject" placeholder="Enter subject" required>
-    </div>
-    <div class="mb-3">
-        <label class="form-label">Your Feedback </label>
-        <!-- Added name="feedback_text" -->
-        <textarea class="form-control" id="feedbackText" name="feedback_text" rows="5" placeholder="Write your feedback" required></textarea>
-    </div>
-    <button type="submit" class="submit-btn">
-        <i class="fas fa-paper-plane"></i>Submit Feedback
-    </button>
-</form>
-            </div>
-        </div>
-
-        <!-- Complaint Form -->
-        <!-- <div class="col-lg-6">
-            <div class="feedback-card">
-                <h4 class="card-title"><i class="fas fa-exclamation-triangle"></i> Submit Complaint</h4>
-                <form id="complaintForm">
-                    <div class="mb-3">
-                        <label class="form-label"> Complaint Category</label>
-                        <select class="form-select" id="complaintCategory" required>
-                            <option value="">Select Category </option>
-                            <option value="Academic Issue"> Academic Issue</option>
-                            <option value="Staff Issue">Staff Issue </option>
-                            <option value="Technical Issue">Technical Issue</option>
-                            <option value="Other">Other</option>
-                        </select>
-                    </div>
-                    <div class="mb-3">
-                        <label class="form-label"> Complaint Title </label>
-                        <input type="text" class="form-control" id="complaintTitle" placeholder="Enter complaint title" required>
-                    </div>
-                    <div class="mb-3">
-                        <label class="form-label"> Complaint Details</label>
-                        <textarea class="form-control" id="complaintDetails" rows="5" placeholder="Explain your complaint" required></textarea>
-                    </div>
-                    <button type="submit" class="submit-btn">
-                        <i class="fas fa-paper-plane"></i>Submit Complaint
-                    </button>
-                </form>
-            </div>
-        </div>
-    </div> -->
-    <form id="feedbackForm" action="{{ route('feedback.store') }}" method="POST">
-    @csrf
-
-   
+    <!-- Alert Messages (Validation & Success) -->
     @if(session('success'))
-        <div class="alert alert-success alert-dismissible fade show" role="alert">
-            {{ session('success') }}
+        <div class="alert alert-success alert-dismissible fade show rounded-3 mb-4" role="alert">
+            <i class="fas fa-check-circle me-2"></i>{{ session('success') }}
+            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
         </div>
     @endif
- 
+
     @if ($errors->any())
-        <div class="alert alert-danger">
-            <ul class="mb-0">
+        <div class="alert alert-danger rounded-3 mb-4">
+            <ul class="mb-0 ps-3">
                 @foreach ($errors->all() as $error)
                     <li>{{ $error }}</li>
                 @endforeach
@@ -203,40 +194,89 @@ body{
         </div>
     @endif
 
-    <div class="mb-3">
-        <label class="form-label"> Feedback Type </label>
-        <select class="form-select" id="feedbackType" name="feedback_type" required>
-            <option value=""> Select Type </option>
-            <option value="Course" {{ old('feedback_type') == 'Course' ? 'selected' : '' }}>Course</option>
-            <option value="Lecturer" {{ old('feedback_type') == 'Lecturer' ? 'selected' : '' }}>Lecturer</option>
-            <option value="Workshop" {{ old('feedback_type') == 'Workshop' ? 'selected' : '' }}>Workshop</option>
-            <option value="Facilities" {{ old('feedback_type') == 'Facilities' ? 'selected' : '' }}>Facilities</option>
-        </select>
-    </div>
+    <div class="row g-4">
+        <!-- Feedback Form -->
+        <div class="col-lg-6">
+            <div class="feedback-card">
+                <h4 class="card-title"><i class="fas fa-star"></i> Submit Feedback</h4>
+                
+                <form id="feedbackForm" action="{{ route('feedback.store') }}" method="POST">
+                    @csrf
+                    
+                    <div class="mb-3">
+                        <label class="form-label"> Feedback Type </label>
+                        <select class="form-select" id="feedbackType" name="feedback_type" required>
+                            <option value=""> Select Type </option>
+                            <option value="Course" {{ old('feedback_type') == 'Course' ? 'selected' : '' }}>Course</option>
+                            <option value="Lecturer" {{ old('feedback_type') == 'Lecturer' ? 'selected' : '' }}>Lecturer </option>
+                            <option value="Workshop" {{ old('feedback_type') == 'Workshop' ? 'selected' : '' }}>Workshop </option>
+                            <option value="Facilities" {{ old('feedback_type') == 'Facilities' ? 'selected' : '' }}> Facilities </option>
+                        </select>
+                    </div>
 
-    <div class="mb-3">
-        <label class="form-label">Subject </label>
-        <input type="text" class="form-control" id="feedbackSubject" name="subject" value="{{ old('subject') }}" placeholder="Enter subject" required>
-    </div>
+                    <div class="mb-3">
+                        <label class="form-label">Subject </label>
+                        <input type="text" class="form-control" id="feedbackSubject" name="subject" value="{{ old('subject') }}" placeholder="Enter subject" required>
+                    </div>
 
-    <div class="mb-3">
-        <label class="form-label">Your Feedback </label>
-        <textarea class="form-control" id="feedbackText" name="feedback_text" rows="5" placeholder="Write your feedback" required>{{ old('feedback_text') }}</textarea>
-    </div>
+                    <div class="mb-4">
+                        <label class="form-label">Your Feedback </label>
+                        <textarea class="form-control" id="feedbackText" name="feedback_text" rows="5" placeholder="Write your feedback" required>{{ old('feedback_text') }}</textarea>
+                    </div>
 
-    <button type="submit" class="submit-btn">
-        <i class="fas fa-paper-plane"></i> Submit Feedback
-    </button>
-</form>
+                    <button type="submit" class="submit-btn shadow-sm">
+                        <i class="fas fa-paper-plane me-2"></i>Submit Feedback
+                    </button>
+                </form>
+            </div>
+        </div>
+
+        <!-- Complaint Form -->
+        <div class="col-lg-6">
+            <div class="feedback-card">
+                <h4 class="card-title"><i class="fas fa-exclamation-triangle"></i> Submit Complaint</h4>
+                
+                <form id="complaintForm" action="{{ route('feedback.store') }}" method="POST">
+                    @csrf
+                    <input type="hidden" name="is_complaint" value="1"> <!-- IF NEEDED FOR BACKEND -->
+
+                    <div class="mb-3">
+                        <label class="form-label"> Complaint Category</label>
+                        <select class="form-select" id="complaintCategory" name="complaint_category" required>
+                            <option value="">Select Category </option>
+                            <option value="Academic Issue"> Academic Issue</option>
+                            <option value="Staff Issue">Staff Issue </option>
+                            <option value="Technical Issue">Technical Issue</option>
+                            <option value="Other">Other</option>
+                        </select>
+                    </div>
+
+                    <div class="mb-3">
+                        <label class="form-label"> Complaint Title </label>
+                        <input type="text" class="form-control" id="complaintTitle" name="complaint_title" placeholder="Enter complaint title" required>
+                    </div>
+
+                    <div class="mb-4">
+                        <label class="form-label"> Complaint Details</label>
+                        <textarea class="form-control" id="complaintDetails" name="complaint_details" rows="5" placeholder="Explain your complaint" required></textarea>
+                    </div>
+
+                    <button type="submit" class="submit-btn shadow-sm">
+                        <i class="fas fa-paper-plane me-2"></i>Submit Complaint
+                    </button>
+                </form>
+            </div>
+        </div>
+    </div>
 
     <!-- Previous History Table -->
     <div class="history-card">
         <div class="history-head">
-            <h4 class="mb-0"><i class="fas fa-history"></i> Previous Requests</h4>
+            <h5><i class="fas fa-history me-2" style="color: var(--theme-yellow);"></i> Previous Requests</h5>
         </div>
 
         <div class="table-responsive">
-            <table class="table table-hover mb-0">
+            <table class="table table-hover align-middle mb-0">
                 <thead>
                     <tr>
                         <th> Type </th>
@@ -248,16 +288,16 @@ body{
             
                 <tbody id="historyTableBody">
                     <tr>
-                        <td>Feedback</td>
+                        <td><span class="fw-semibold" style="color: var(--theme-navy);">Feedback</span></td>
                         <td>Workshop Equipment </td>
                         <td>10 July 2026</td>
-                        <td><span class="badge-status resolved"> Resolved</span></td>
+                        <td><span class="badge-status resolved"><i class="fas fa-check me-1"></i> Resolved</span></td>
                     </tr>
                     <tr>
-                        <td>Complaint</td>
+                        <td><span class="fw-semibold" style="color: var(--theme-navy);">Complaint</span></td>
                         <td>Class Schedule Issue </td>
                         <td>05 July 2026 </td>
-                        <td><span class="badge-status pending"> Pending </span></td>
+                        <td><span class="badge-status pending"><i class="fas fa-clock me-1"></i> Pending </span></td>
                     </tr>
                 </tbody>
             </table>
@@ -266,6 +306,4 @@ body{
 
 </div>
 
-
-
 @endsection
\ No newline at end of file
diff --git a/resources/views/StudentPortal.blade.php b/resources/views/StudentPortal.blade.php
index 5723811..199fd6c 100644
--- a/resources/views/StudentPortal.blade.php
+++ b/resources/views/StudentPortal.blade.php
@@ -1,311 +1,295 @@
 @extends('layouts.studentportalnav')
 
-@section('title','Dashboard')
+@section('title', 'Dashboard')
 
 @section('content')
 
 <style>
-:root{
-    --primary:#5E244E;
-    --secondary:#8B3A74;
-    --light:#f5f6fb;
-    --dark:#2d2d2d;
+:root {
+    --theme-navy: #2D355B;        /* Primary Dark Navy */
+    --theme-footer-navy: #1F2541; /* Darker Navy */
+    --theme-red: #822424;         /* Primary Accent Red */
+    --theme-red-hover: #df2c3e;   /* Red Hover State */
+    --theme-yellow: #FFEA85;      /* Accent Gold/Yellow */
+    --theme-bg: #F6F6F6;          /* Page Background */
+    --text-dark: #333333;
 }
 
-body{
-    background:var(--light);
+body {
+    background-color: var(--theme-bg);
+    color: var(--text-dark);
 }
 
 /* Header */
-.dashboard-header{
-    display:flex;
-    justify-content:space-between;
-    align-items:center;
-    margin-bottom:30px;
+.dashboard-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 30px;
+    padding-bottom: 15px;
+    border-bottom: 2px solid #e2e8f0;
 }
 
-.dashboard-header h2{
-    font-weight:700;
-    color:var(--dark);
+.dashboard-header h2 {
+    font-weight: 700;
+    color: var(--theme-navy);
+    margin-bottom: 5px;
 }
 
-.dashboard-header p{
-    color:#777;
-    margin:0;
+.dashboard-header p {
+    color: #6c757d;
+    margin: 0;
+    font-size: 0.95rem;
 }
 
-.avatar{
-    width:55px;
-    height:55px;
-    border-radius:50%;
-    background:var(--primary);
-    color:#fff;
-    display:flex;
-    align-items:center;
-    justify-content:center;
-    font-weight:bold;
-    font-size:20px;
+.avatar {
+    width: 55px;
+    height: 55px;
+    border-radius: 50%;
+    background: var(--theme-navy);
+    color: var(--theme-yellow);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-weight: bold;
+    font-size: 20px;
+    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
 }
 
 /* Statistic Cards */
-
-.stat-card{
-    background:#fff;
-    border-radius:15px;
-    padding:25px;
-    box-shadow:0 8px 20px rgba(0,0,0,.08);
-    transition:.3s;
-    height:100%;
+.stat-card {
+    background: #ffffff;
+    border-radius: 12px;
+    padding: 24px;
+    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
+    transition: all 0.3s ease;
+    height: 100%;
+    border: 1px solid #e2e8f0;
 }
 
-.stat-card:hover{
-    transform:translateY(-6px);
+.stat-card:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 8px 20px rgba(45, 53, 91, 0.12);
+    border-color: var(--theme-navy);
 }
 
-.stat-icon{
-    width:60px;
-    height:60px;
-    border-radius:12px;
-    display:flex;
-    justify-content:center;
-    align-items:center;
-    color:#fff;
-    font-size:22px;
-    margin-bottom:20px;
+.stat-icon {
+    width: 55px;
+    height: 55px;
+    border-radius: 10px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    color: #ffffff;
+    font-size: 22px;
+    margin-bottom: 16px;
 }
 
-.stat-card h3{
-    font-weight:700;
-    margin-bottom:5px;
+.stat-card h3 {
+    font-weight: 700;
+    color: var(--theme-navy);
+    margin-bottom: 4px;
 }
 
-.stat-card p{
-    color:#777;
-    margin:0;
+.stat-card p {
+    color: #6c757d;
+    font-size: 0.9rem;
+    font-weight: 600;
+    margin: 0;
 }
 
 /* Services */
-
-.section-title{
-    font-size:24px;
-    font-weight:bold;
-    margin:40px 0 20px;
+.section-title {
+    font-size: 22px;
+    font-weight: 700;
+    color: var(--theme-navy);
+    margin: 40px 0 20px;
+    display: flex;
+    align-items: center;
+    gap: 10px;
 }
 
-.service-card{
-    background:#fff;
-    border-radius:15px;
-    padding:30px;
-    text-align:center;
-    transition:.3s;
-    box-shadow:0 8px 20px rgba(0,0,0,.08);
-    height:100%;
+.section-title::before {
+    content: '';
+    display: inline-block;
+    width: 5px;
+    height: 24px;
+    background-color: var(--theme-red);
+    border-radius: 2px;
 }
 
-.service-card:hover{
-    transform:translateY(-8px);
+.service-card {
+    background: #ffffff;
+    border-radius: 12px;
+    padding: 30px 20px;
+    text-align: center;
+    transition: all 0.3s ease;
+    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
+    height: 100%;
+    border: 1px solid #e2e8f0;
 }
 
-.service-card i{
-    font-size:45px;
-    color: #6C2B2E;
-    margin-bottom:20px;
+.service-card:hover {
+    transform: translateY(-6px);
+    box-shadow: 0 8px 22px rgba(0,0,0,0.1);
+    border-color: var(--theme-red);
 }
 
-.service-card h5{
-    font-weight:700;
-    color: #773939;
+.service-card i {
+    font-size: 40px;
+    color: var(--theme-red);
+    margin-bottom: 16px;
+    transition: transform 0.3s ease, color 0.3s ease;
 }
 
-.service-card p{
-    color:#777;
-    font-size:14px;
+.service-card:hover i {
+    transform: scale(1.1);
+    color: var(--theme-red-hover);
+}
+
+.service-card h5 {
+    font-weight: 700;
+    color: var(--theme-navy);
+    margin-bottom: 10px;
+}
+
+.service-card p {
+    color: #6c757d;
+    font-size: 13.5px;
+    margin: 0;
+    line-height: 1.5;
 }
 </style>
 
 <div class="container-fluid">
 
-<div class="dashboard-header">
-
-<div>
-<h2>Welcome Back,  student
-<p>Manage your academic activities from your dashboard.</p>
-</div>
-
-<!-- <div class="avatar">
-S
-</div> -->
-
-</div>
-
-<!-- Statistics -->
-
-<div class="row g-4">
-
-<div class="col-lg-3 col-md-6">
-<div class="stat-card">
-
-<div class="stat-icon" style="background:#5E244E;">
-<i class="fa-solid fa-book"></i>
-</div>
-
-<h3>6</h3>
-<p>Enrolled Courses</p>
-
-</div>
-</div>
-
-<div class="col-lg-3 col-md-6">
-<div class="stat-card">
-
-<div class="stat-icon" style="background:#0d9488;">
-<i class="fa-solid fa-file-lines"></i>
-</div>
-
-<h3>3</h3>
-<p>Assignments</p>
-
-</div>
-</div>
-
-<div class="col-lg-3 col-md-6">
-<div class="stat-card">
-
-<div class="stat-icon" style="background:#d97706;">
-<i class="fa-solid fa-chart-column"></i>
-</div>
-
-<h3>78%</h3>
-<p>Average Result</p>
-
-</div>
-</div>
-
-<div class="col-lg-3 col-md-6">
-<div class="stat-card">
-
-<div class="stat-icon" style="background:#dc2626;">
-<i class="fa-solid fa-bell"></i>
-</div>
-
-<h3>2</h3>
-<p>Exam Notices</p>
-
-</div>
-</div>
-
-</div>
-
-<!-- Services -->
-
-<div class="section-title">
-Student Services
-</div>
-
-<div class="row g-4">
-
-<div class="col-lg-4 col-md-6"  >
-<a href="/mycourse" class="text-decoration-none" style="color:#5E244E">
-
-<div class="service-card">
-
-<i class="fa-solid fa-book"></i>
-
-<h5>My Courses</h5>
-
-<p>Access all learning materials and course content.</p>
-
-</div>
-
-</a>
-</div>
-
-<div class="col-lg-4 col-md-6" >
-<a href="/timetable" class="text-decoration-none" style="color:#5E244E">
-
-<div class="service-card">
-
-<i class="fa-solid fa-calendar-days"></i>
-
-<h5>Class Timetable</h5>
-
-<p>View your weekly lecture timetable.</p>
-
-</div>
-
-</a>
-</div>
-
-<div class="col-lg-4 col-md-6">
-<a href="/Assignments" class="text-decoration-none" style="color:#5E244E">
-
-<div class="service-card">
-
-<i class="fa-solid fa-file-lines"></i>
-
-<h5>Assignments</h5>
-
-<p>Submit and manage assignments.</p>
-
-</div>
-
-</a>
-</div>
-
-<div class="col-lg-4 col-md-6">
-<a href="/results" class="text-decoration-none" style="color:#5E244E">
-
-<div class="service-card">
-
-<i class="fa-solid fa-square-poll-vertical"></i>
-
-<h5>Exam Results</h5>
-
-<p>Check semester examination results.</p>
-
-</div>
-
-</a>
-</div>
-
-<div class="col-lg-4 col-md-6">
-<a href="/Feedback&Complain" class="text-decoration-none"style="color:#5E244E">
-
-<div class="service-card">
-
-<i class="fa-solid fa-comments"></i>
-
-<h5>Feedback & Complaint</h5>
-
-<p>Send feedback and contact administration.</p>
-
-</div>
-
-</a>
-</div>
-
-<div class="col-lg-4 col-md-6">
-
- <a href="/StudentProfile" class="text-decoration-none"style="color:#5E244E">
-
-<div class="service-card">
-
-<i class="fa-solid fa-user"></i>
- 
-<!-- <a href="{{ route('StudentProfile') }}" class="text-decoration-none"style="color:#5E244E">
-    <div class="service-card">
-    <i class="fas fa-user"></i> Profile
-</a> -->
-<h5>Student Profile</h5>
-
-<p>Update your personal information.</p>
-
-</div>
-
-</a>
-</div>
-
-</div>
+    <!-- Dashboard Header -->
+    <div class="dashboard-header">
+        <div>
+            <h2>Welcome Back, {{ Auth::check() ? Auth::user()->first_name : 'Student' }}!</h2>
+            <p>Manage your academic activities and course updates from your dashboard.</p>
+        </div>
+
+        @if(Auth::check())
+            <div class="avatar" title="{{ Auth::user()->first_name }}">
+                {{ strtoupper(substr(Auth::user()->first_name, 0, 1)) }}
+            </div>
+        @endif
+    </div>
+
+    <!-- Statistics Cards -->
+    <div class="row g-4">
+
+        <div class="col-lg-3 col-md-6">
+            <div class="stat-card">
+                <div class="stat-icon" style="background: var(--theme-navy);">
+                    <i class="fa-solid fa-book"></i>
+                </div>
+                <h3>6</h3>
+                <p>Enrolled Courses</p>
+            </div>
+        </div>
+
+        <div class="col-lg-3 col-md-6">
+            <div class="stat-card">
+                <div class="stat-icon" style="background: #0d9488;">
+                    <i class="fa-solid fa-file-lines"></i>
+                </div>
+                <h3>3</h3>
+                <p>Assignments</p>
+            </div>
+        </div>
+
+        <div class="col-lg-3 col-md-6">
+            <div class="stat-card">
+                <div class="stat-icon" style="background: #d97706;">
+                    <i class="fa-solid fa-chart-column"></i>
+                </div>
+                <h3>78%</h3>
+                <p>Average Result</p>
+            </div>
+        </div>
+
+        <div class="col-lg-3 col-md-6">
+            <div class="stat-card">
+                <div class="stat-icon" style="background: var(--theme-red);">
+                    <i class="fa-solid fa-bell"></i>
+                </div>
+                <h3>2</h3>
+                <p>Exam Notices</p>
+            </div>
+        </div>
+
+    </div>
+
+    <!-- Student Services Section -->
+    <div class="section-title">
+        Student Services
+    </div>
+
+    <div class="row g-4">
+
+        <div class="col-lg-4 col-md-6">
+            <a href="/mycourse" class="text-decoration-none">
+                <div class="service-card">
+                    <i class="fa-solid fa-book"></i>
+                    <h5>My Courses</h5>
+                    <p>Access all learning materials, lectures, and course content.</p>
+                </div>
+            </a>
+        </div>
+
+        <div class="col-lg-4 col-md-6">
+            <a href="/timetable" class="text-decoration-none">
+                <div class="service-card">
+                    <i class="fa-solid fa-calendar-days"></i>
+                    <h5>Class Timetable</h5>
+                    <p>View your weekly lecture schedule and upcoming classes.</p>
+                </div>
+            </a>
+        </div>
+
+        <div class="col-lg-4 col-md-6">
+            <a href="/results" class="text-decoration-none">
+                <div class="service-card">
+                    <i class="fa-solid fa-square-poll-vertical"></i>
+                    <h5>Exam Results</h5>
+                    <p>Check semester examination marks and performance reports.</p>
+                </div>
+            </a>
+        </div>
+
+        <div class="col-lg-4 col-md-6">
+            <a href="/Studentguidelines" class="text-decoration-none">
+                <div class="service-card">
+                    <i class="fa-solid fa-book-open"></i>
+                    <h5>Student Guidelines</h5>
+                    <p>Read campus rules, regulations, and academic guidelines.</p>
+                </div>
+            </a>
+        </div>
+
+        <div class="col-lg-4 col-md-6">
+            <a href="/Feedback&Complain" class="text-decoration-none">
+                <div class="service-card">
+                    <i class="fa-solid fa-comments"></i>
+                    <h5>Feedback & Complaint</h5>
+                    <p>Send feedback or submit inquiries directly to administration.</p>
+                </div>
+            </a>
+        </div>
+
+        <div class="col-lg-4 col-md-6">
+            <a href="/StudentProfile" class="text-decoration-none">
+                <div class="service-card">
+                    <i class="fa-solid fa-user"></i>
+                    <h5>Student Profile</h5>
+                    <p>Manage and update your personal student profile details.</p>
+                </div>
+            </a>
+        </div>
+
+    </div>
 
 </div>
 
diff --git a/resources/views/StudentProfile.blade.php b/resources/views/StudentProfile.blade.php
index c76821d..dc056c4 100644
--- a/resources/views/StudentProfile.blade.php
+++ b/resources/views/StudentProfile.blade.php
@@ -4,239 +4,206 @@
 
 @section('content')
 
-<style>
+<!-- Bootstrap 5 -->
+<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
 
-body{
-    background:#f6f7fb;
+<!-- Font Awesome -->
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+
+<!-- Google Font -->
+<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
+
+<style>
+:root {
+    --theme-navy: #2D355B;        /* Primary Navy */
+    --theme-navy-dark: #1F2541;   /* Dark Navy */
+    --theme-red: #822424;         /* Primary Accent Red */
+    --theme-red-hover: #df2c3e;   /* Red Hover */
+    --theme-yellow: #FFEA85;      /* Accent Yellow/Gold */
+    --bg-light: #F6F6F6;          /* Page Background */
+    --white: #ffffff;
 }
 
+body {
+    font-family: 'Poppins', sans-serif;
+    background: var(--bg-light);
+}
 
 /* Header */
-
-.profile-header{
-
-    background:linear-gradient(135deg,#5E244E,#4a1c3e);
-    color:#fff;
-    border-radius:20px;
-    padding:40px;
-    margin-bottom:35px;
-    box-shadow:0 15px 35px rgba(0,0,0,.15);
-
+.profile-header {
+    background: linear-gradient(135deg, var(--theme-navy) 0%, var(--theme-navy-dark) 100%) !important;
+    color: var(--white);
+    border-radius: 16px;
+    padding: 35px 30px;
+    margin-bottom: 30px;
+    box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15);
+    border-left: 5px solid var(--theme-red);
 }
 
-
-.profile-header h2{
-
-    font-weight:700;
-
+.profile-header h2 {
+    font-weight: 700;
 }
 
-
-.profile-header p{
-
-    color:#ddd;
-
+.profile-header p {
+    color: rgba(255, 255, 255, 0.85);
+    margin-bottom: 0;
 }
 
-
-
 /* Profile Card */
-
-.profile-card{
-
-    background:#fff;
-    border-radius:20px;
-    padding:30px;
-    box-shadow:0 10px 30px rgba(0,0,0,.08);
-    height:100%;
-
+.profile-card {
+    background: var(--white);
+    border-radius: 16px;
+    padding: 30px;
+    border: 1px solid #e2e8f0;
+    box-shadow: 0 4px 15px rgba(0, 0, 0, .04);
+    height: 100%;
 }
 
-
-
 /* Student Image */
-
-.profile-image{
-
-    width:150px;
-    height:150px;
-    border-radius:50%;
-    object-fit:cover;
-    border:6px solid #d4af37;
-
+.profile-image {
+    width: 140px;
+    height: 140px;
+    border-radius: 50%;
+    object-fit: cover;
+    border: 4px solid var(--theme-navy);
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
 }
 
-
-.student-name{
-
-    color:#5E244E;
-    font-weight:700;
-    margin-top:15px;
-
+.student-name {
+    color: var(--theme-navy);
+    font-weight: 700;
+    margin-top: 15px;
 }
 
-
-.student-id{
-
-    background:#5E244E;
-    color:#fff;
-    padding:8px 20px;
-    border-radius:50px;
-    display:inline-block;
-    font-size:14px;
-
+.student-id {
+    background: var(--theme-navy);
+    color: var(--white);
+    padding: 8px 20px;
+    border-radius: 50px;
+    display: inline-block;
+    font-size: 13px;
+    font-weight: 600;
+    letter-spacing: 0.5px;
 }
 
-
-
 /* Information */
-
-.info-title{
-
-    color:#5E244E;
-    font-weight:700;
-    border-bottom:2px solid #d4af37;
-    padding-bottom:10px;
-    margin-bottom:20px;
-
+.info-title {
+    color: var(--theme-navy);
+    font-weight: 700;
+    border-bottom: 2px solid var(--theme-yellow);
+    padding-bottom: 10px;
+    margin-bottom: 20px;
 }
 
-
-.info-row{
-
-    display:flex;
-    justify-content:space-between;
-    padding:12px 0;
-    border-bottom:1px solid #eee;
-
+.info-title i {
+    color: var(--theme-red);
+    margin-right: 8px;
 }
 
-
-.label{
-
-    color:#777;
-
+.info-row {
+    display: flex;
+    justify-content: space-between;
+    padding: 12px 0;
+    border-bottom: 1px solid #f1f5f9;
 }
 
-
-.value{
-
-    font-weight:600;
-    color:#333;
-
+.info-row:last-child {
+    border-bottom: none;
 }
 
-
-
-/* Course */
-
-.course-box{
-
-    background:#5E244E;
-    color:#fff;
-    padding:25px;
-    border-radius:20px;
-
+.label {
+    color: #64748b;
+    font-weight: 500;
 }
 
-
-.course-box h4{
-
-    color:#d4af37;
-    font-weight:700;
-
+.value {
+    font-weight: 600;
+    color: #1e293b;
 }
 
-
-.course-item{
-
-    margin-top:12px;
-
+/* Course Box */
+.course-box {
+    background: linear-gradient(135deg, var(--theme-navy) 0%, var(--theme-navy-dark) 100%);
+    color: var(--white);
+    padding: 30px;
+    border-radius: 16px;
+    box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15);
+    height: 100%;
 }
 
-
-.course-item i{
-
-    color:#d4af37;
-    width:25px;
-
+.course-box h4 {
+    color: var(--theme-yellow);
+    font-weight: 700;
+    margin-bottom: 20px;
+    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
+    padding-bottom: 10px;
 }
 
-
-
-/* Button */
-
-.edit-btn{
-
-    background:#d4af37;
-    color:white;
-    border:none;
-    border-radius:50px;
-    padding:12px 30px;
-    font-weight:600;
-
+.course-item {
+    margin-top: 14px;
+    font-size: 15px;
+    color: rgba(255, 255, 255, 0.9);
 }
 
-
-.edit-btn:hover{
-
-    background:#c49d20;
-    color:#fff;
-
+.course-item i {
+    color: var(--theme-yellow);
+    width: 28px;
 }
 
+/* Buttons */
+.edit-btn {
+    background: var(--theme-red) !important;
+    color: var(--white) !important;
+    border: none;
+    border-radius: 8px;
+    padding: 10px 25px;
+    font-weight: 600;
+    transition: all 0.2s ease;
+}
 
+.edit-btn:hover {
+    background: var(--theme-red-hover) !important;
+    color: var(--white) !important;
+}
+
+@media(max-width:768px) {
+    .profile-header, .profile-card, .course-box {
+        padding: 25px;
+    }
+}
 </style>
 
-
-
 <div class="container py-4">
 
-
     <!-- Header -->
-
     <div class="profile-header">
-
-
         <h2>
-
-            <i class="fas fa-user-graduate"></i>
-
+            <i class="fas fa-user-graduate me-2" style="color: var(--theme-yellow);"></i>
             Student Profile
-
         </h2>
-
-
         <p>
-
             Manage your personal information and academic details.
-
         </p>
-
-
     </div>
 
     <div class="row g-4">
 
-
         <!-- Profile Left -->
-
         <div class="col-lg-4">
-        <div class="profile-card text-center">
-                 <img src="https://i.pravatar.cc/300"
-                     class="profile-image">
-                <h3 class="student-name">Kasun Perera </h3>
+            <div class="profile-card text-center">
+                <img src="https://i.pravatar.cc/300" class="profile-image mb-2">
+                <h3 class="student-name">Kasun Perera</h3>
 
-              <span class="student-id">
+                <span class="student-id my-2">
                     Student ID : AEA20260045
                 </span>
-                <hr>
+                <hr class="my-3" style="color: #cbd5e1;">
 
-            <button class="edit-btn mt-3">
-              <i class="fas fa-edit"></i> Edit Profile </button>
+                <button class="edit-btn shadow-sm">
+                    <i class="fas fa-edit me-1"></i> Edit Profile
+                </button>
             </div>
-       </div>
-
+        </div>
 
         <!-- Details -->
         <div class="col-lg-8">
@@ -247,62 +214,33 @@ body{
                 </h4>
 
                 <div class="info-row">
-                    <span class="label">
-                        Full Name
-                    </span>
-                    <span class="value">
-                        Kasuni Perera
-                    </span>
+                    <span class="label">Full Name</span>
+                    <span class="value">Kasuni Perera</span>
                 </div>
 
-
                 <div class="info-row">
-                    <span class="label">
-                        NIC / Passport
-                    </span>
-                    <span class="value">
-                        200012345678
-                    </span>
+                    <span class="label">NIC / Passport</span>
+                    <span class="value">200012345678</span>
                 </div>
 
-
                 <div class="info-row">
-                    <span class="label">
-                        Date of Birth
-                    </span>
-                    <span class="value">
-                        15 March 2000
-                    </span>
+                    <span class="label">Date of Birth</span>
+                    <span class="value">15 March 2000</span>
                 </div>
 
-
                 <div class="info-row">
-                    <span class="label">
-                        Gender
-                    </span>
-                    <span class="value">
-                        Male
-                    </span>
+                    <span class="label">Gender</span>
+                    <span class="value">Male</span>
                 </div>
 
-
                 <div class="info-row">
-                    <span class="label">
-                        Email
-                    </span>
-                    <span class="value">
-                        student@email.com
-                    </span>
+                    <span class="label">Email</span>
+                    <span class="value">student@email.com</span>
                 </div>
 
-
                 <div class="info-row">
-                    <span class="label">
-                        Phone
-                    </span>
-                    <span class="value">
-                        +94 77 1234567
-                    </span>
+                    <span class="label">Phone</span>
+                    <span class="value">+94 77 1234567</span>
                 </div>
 
             </div>
@@ -311,8 +249,6 @@ body{
 
     <div class="row g-4 mt-1">
 
-
-
         <!-- Education -->
         <div class="col-lg-6">
             <div class="profile-card">
@@ -321,66 +257,41 @@ body{
                     Educational Background
                 </h4>
                 <div class="info-row">
-                    <span class="label">
-                        Qualification
-                    </span>
-
-                    <span class="value">
-                        NVQ Level 4
-                    </span>
+                    <span class="label">Qualification</span>
+                    <span class="value">NVQ Level 4</span>
                 </div>
                 <div class="info-row">
-                    <span class="label">
-                        Institute
-                    </span>
-                    <span class="value">
-                        ABC Technical College
-                    </span>
+                    <span class="label">Institute</span>
+                    <span class="value">ABC Technical College</span>
                 </div>
-
-
-
-
                 <div class="info-row">
-                    <span class="label">
-                        Year Completed
-                    </span>
-                    <span class="value">
-                        2025
-                    </span>
+                    <span class="label">Year Completed</span>
+                    <span class="value">2025</span>
                 </div>
-
             </div>
         </div>
 
-
-
-
-
-
         <!-- Course Details -->
-
-
         <div class="col-lg-6">
             <div class="course-box">
-                <h4><i class="fas fa-car"></i>Course Details</h4>
+                <h4><i class="fas fa-car me-2"></i>Course Details</h4>
 
-            <div class="course-item">
-            <i class="fas fa-book"></i> Diploma in Automobile Engineering  </div>
-            <div class="course-item"> <i class="fas fa-calendar"></i> Duration : 2 Years</div>
-
-            <div class="course-item">
-                    <i class="fas fa-layer-group"></i>Current Semester : Semester 2
-             </div>
-
-           <div class="course-item">
-                    <i class="fas fa-user-tie"></i>
-                    Trainer : Mr. Nimal Silva
+                <div class="course-item">
+                    <i class="fas fa-book"></i> Diploma in Automobile Engineering
+                </div>
+                <div class="course-item">
+                    <i class="fas fa-calendar"></i> Duration : 2 Years
+                </div>
+                <div class="course-item">
+                    <i class="fas fa-layer-group"></i> Current Semester : Semester 2
+                </div>
+                <div class="course-item">
+                    <i class="fas fa-user-tie"></i> Trainer : Mr. Nimal Silva
                 </div>
             </div>
         </div>
+
     </div>
 </div>
 
-
 @endsection
\ No newline at end of file
diff --git a/resources/views/Studentguidelines.blade.php b/resources/views/Studentguidelines.blade.php
index 306db9e..da55c99 100644
--- a/resources/views/Studentguidelines.blade.php
+++ b/resources/views/Studentguidelines.blade.php
@@ -4,469 +4,348 @@
 
 @section('content')
 
+<!-- Bootstrap 5 -->
+<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
+
+<!-- Font Awesome -->
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+
+<!-- Google Font -->
+<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
+
 <style>
+:root {
+    --theme-navy: #2D355B;        /* Primary Navy */
+    --theme-navy-dark: #1F2541;   /* Dark Navy */
+    --theme-red: #822424;         /* Primary Accent Red */
+    --theme-red-hover: #df2c3e;   /* Red Hover */
+    --theme-yellow: #FFEA85;      /* Accent Yellow/Gold */
+    --bg-light: #F6F6F6;          /* Page Background */
+    --white: #ffffff;
+}
 
-body{
-    background:#f6f7fb;
+body {
+    font-family: 'Poppins', sans-serif;
+    background: var(--bg-light);
 }
 
 /*==========================
-Hero
+Hero Section
 ===========================*/
-
-.guideline-hero{
-    background:linear-gradient(135deg,#5E244E,#4a1c3e);
-    border-radius:20px;
-    padding:45px;
-    color:#fff;
-    margin-bottom:35px;
-    box-shadow:0 18px 40px rgba(0,0,0,.12);
+.guideline-hero {
+    background: linear-gradient(135deg, #2B293F 0%, #94A6F959 100%) !important;
+    border-radius: 16px;
+    padding: 35px 30px;
+    color: var(--white);
+    margin-bottom: 30px;
+    box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15);
+    border-left: 5px solid var(--theme-red);
 }
 
-.guideline-hero h2{
-    font-weight:700;
-    margin-bottom:10px;
+.guideline-hero h2 {
+    font-weight: 700;
+    margin-bottom: 10px;
 }
 
-.guideline-hero p{
-    color:#ececec;
-    margin-bottom:0;
-    font-size:15px;
+.guideline-hero p {
+    color: rgba(255, 255, 255, 0.85);
+    margin-bottom: 0;
+    font-size: 15px;
 }
 
 /*==========================
-Cards
+Guide Cards
 ===========================*/
-
-.guide-card{
-
-    background:#fff;
-    border:none;
-    border-radius:20px;
-    box-shadow:0 10px 30px rgba(0,0,0,.08);
-    transition:.3s;
-    overflow:hidden;
-    height:100%;
-
+.guide-card {
+    background: var(--white);
+    border: 1px solid #e2e8f0;
+    border-radius: 16px;
+    box-shadow: 0 4px 15px rgba(0, 0, 0, .04);
+    transition: all 0.3s ease;
+    overflow: hidden;
+    height: 100%;
 }
 
-.guide-card:hover{
-
-    transform:translateY(-6px);
-
+.guide-card:hover {
+    transform: translateY(-4px);
+    border-color: var(--theme-navy);
+    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.08);
 }
 
-.card-head{
-
-    background:#5E244E;
-    color:#fff;
-    padding:18px 22px;
-
+.card-head {
+    background: #753636;
+    color: var(--white);
+    padding: 18px 22px;
 }
 
-.card-head h5{
-
-    margin:0;
-    font-weight:600;
-
+.card-head h5 {
+    margin: 0;
+    font-weight: 600;
 }
 
-.card-head i{
-
-    color:#d4af37;
-    margin-right:10px;
-
+.card-head i {
+    color: var(--theme-yellow);
+    margin-right: 10px;
 }
 
-.card-body{
-
-    padding:22px;
-
+.card-body {
+    padding: 22px;
 }
 
-.card-body ul{
-
-    padding-left:20px;
-
+.card-body ul {
+    padding-left: 20px;
+    margin-bottom: 0;
 }
 
-.card-body li{
-
-    margin-bottom:10px;
-    color:#555;
+.card-body li {
+    margin-bottom: 10px;
+    color: #475569;
+}
 
+.card-body li:last-child {
+    margin-bottom: 0;
 }
 
 /*==========================
-Alert
+Notice Alert Box
 ===========================*/
-
-.notice{
-
-    background:#fff7e4;
-    border-left:6px solid #d4af37;
-    border-radius:16px;
-    padding:22px;
-    margin-top:35px;
-    box-shadow:0 8px 25px rgba(0,0,0,.06);
-
+.notice {
+    background: rgba(255, 234, 133, 0.2);
+    border-left: 5px solid var(--theme-red);
+    border-radius: 16px;
+    padding: 22px;
+    margin-top: 35px;
+    box-shadow: 0 4px 15px rgba(0, 0, 0, .03);
 }
 
-.notice h5{
-
-    color:#5E244E;
-    font-weight:700;
-
+.notice h5 {
+    color: var(--theme-navy);
+    font-weight: 700;
 }
 
-.notice p{
-
-    margin-bottom:0;
-    color:#555;
-
+.notice p {
+    margin-bottom: 0;
+    color: #475569;
 }
 
 /*==========================
-Contact
+Contact Box
 ===========================*/
-
-.contact-card{
-
-    margin-top:35px;
-    border-radius:20px;
-    background:#4a1c3e;
-    color:#fff;
-    padding:35px;
-    box-shadow:0 12px 35px rgba(0,0,0,.12);
-
+.contact-card {
+    margin-top: 30px;
+    border-radius: 16px;
+    background: linear-gradient(135deg, #2B293F 0%, #94A6F959 100%) !important;
+    color: var(--white);
+    padding: 35px;
+    box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15);
 }
 
-.contact-card h4{
-
-    color:#d4af37;
-    font-weight:700;
-
+.contact-card h4 {
+    color: var(--theme-yellow);
+    font-weight: 700;
 }
 
-.contact-item{
-
-    margin-top:18px;
-    font-size:15px;
-
+.contact-item {
+    margin-top: 18px;
+    font-size: 15px;
 }
 
-.contact-item i{
-
-    color:#d4af37;
-    width:28px;
-
+.contact-item i {
+    color: var(--theme-yellow);
+    width: 28px;
 }
 
+@media(max-width:768px) {
+    .guideline-hero, .contact-card {
+        padding: 25px;
+    }
+}
 </style>
 
 <div class="container py-4">
 
     <!-- Hero -->
-
     <div class="guideline-hero">
-
         <h2>
-            <i class="fas fa-book-open"></i>
+            <i class="fas fa-book-open me-2" style="color: var(--theme-yellow);"></i>
             Student Guidelines
         </h2>
-
         <p>
             Welcome to the Automobile Engineering Academy. These guidelines are
             designed to help every student maintain professionalism, safety,
             discipline, and academic excellence throughout the training programme.
         </p>
-
     </div>
 
+    <!-- Guidelines Cards -->
     <div class="row g-4">
 
         <!-- Classroom -->
-
         <div class="col-lg-6">
-
             <div class="guide-card">
-
                 <div class="card-head">
-
                     <h5>
                         <i class="fas fa-chalkboard-teacher"></i>
                         Classroom Rules
                     </h5>
-
                 </div>
-
                 <div class="card-body">
-
                     <ul>
-
                         <li>Attend every class on time.</li>
-
                         <li>Maintain discipline and respect lecturers.</li>
-
                         <li>Switch mobile phones to silent mode.</li>
-
                         <li>Complete all assignments before deadlines.</li>
-
                         <li>Keep classrooms clean and organized.</li>
-
                     </ul>
-
                 </div>
-
             </div>
-
         </div>
 
         <!-- Workshop -->
-
         <div class="col-lg-6">
-
             <div class="guide-card">
-
                 <div class="card-head">
-
                     <h5>
                         <i class="fas fa-tools"></i>
                         Workshop Safety
                     </h5>
-
                 </div>
-
                 <div class="card-body">
-
                     <ul>
-
                         <li>Wear PPE before entering workshops.</li>
-
                         <li>Follow instructor safety instructions.</li>
-
                         <li>Never operate equipment without permission.</li>
-
                         <li>Report damaged tools immediately.</li>
-
                         <li>Keep workstations clean after practical sessions.</li>
-
                     </ul>
-
                 </div>
-
             </div>
-
         </div>
 
         <!-- Attendance -->
-
         <div class="col-lg-6">
-
             <div class="guide-card">
-
                 <div class="card-head">
-
                     <h5>
                         <i class="fas fa-user-check"></i>
                         Attendance Policy
                     </h5>
-
                 </div>
-
                 <div class="card-body">
-
                     <ul>
-
                         <li>Minimum attendance requirement is 80%.</li>
-
                         <li>Medical leave must be supported by documents.</li>
-
                         <li>Repeated absence may affect examinations.</li>
-
                         <li>Late arrivals will be recorded.</li>
-
                         <li>Inform the administration if absent.</li>
-
                     </ul>
-
                 </div>
-
             </div>
-
         </div>
 
         <!-- Dress -->
-
         <div class="col-lg-6">
-
             <div class="guide-card">
-
                 <div class="card-head">
-
                     <h5>
                         <i class="fas fa-user-tie"></i>
                         Uniform & PPE
                     </h5>
-
                 </div>
-
                 <div class="card-body">
-
                     <ul>
-
                         <li>Wear academy uniform during lectures.</li>
-
                         <li>Safety shoes are compulsory.</li>
-
                         <li>Use gloves and safety glasses.</li>
-
                         <li>Long hair must be tied properly.</li>
-
                         <li>ID card must be visible at all times.</li>
-
                     </ul>
-
                 </div>
-
             </div>
-
         </div>
 
         <!-- Assessment -->
-
         <div class="col-lg-6">
-
             <div class="guide-card">
-
                 <div class="card-head">
-
                     <h5>
                         <i class="fas fa-file-alt"></i>
                         Assessment Rules
                     </h5>
-
                 </div>
-
                 <div class="card-body">
-
                     <ul>
-
                         <li>Submit assignments before due dates.</li>
-
                         <li>No plagiarism is permitted.</li>
-
                         <li>Bring required materials for practical tests.</li>
-
                         <li>Follow examination regulations.</li>
-
                         <li>Maintain academic honesty.</li>
-
                     </ul>
-
                 </div>
-
             </div>
-
         </div>
 
         <!-- Conduct -->
-
         <div class="col-lg-6">
-
             <div class="guide-card">
-
                 <div class="card-head">
-
                     <h5>
                         <i class="fas fa-handshake"></i>
                         Student Conduct
                     </h5>
-
                 </div>
-
                 <div class="card-body">
-
                     <ul>
-
                         <li>Respect staff and fellow students.</li>
-
                         <li>Protect academy property.</li>
-
                         <li>Do not smoke inside the campus.</li>
-
                         <li>Avoid discrimination and harassment.</li>
-
                         <li>Represent the academy professionally.</li>
-
                     </ul>
-
                 </div>
-
             </div>
-
         </div>
 
     </div>
 
     <!-- Notice -->
-
     <div class="notice">
-
         <h5>
-            <i class="fas fa-exclamation-circle text-warning"></i>
+            <i class="fas fa-exclamation-circle me-1" style="color: var(--theme-red);"></i>
             Important Notice
         </h5>
-
         <p>
-
             Students who fail to follow academy regulations may face disciplinary
             action according to the Automobile Engineering Academy Student Policy.
-
         </p>
-
     </div>
 
     <!-- Contact -->
-
     <div class="contact-card">
-
         <h4>
-
-            <i class="fas fa-headset"></i>
+            <i class="fas fa-headset me-2"></i>
             Student Support
-
         </h4>
-
-        <p class="mt-3">
-
+        <p class="mt-3 text-white-50">
             If you have any questions regarding academic regulations,
             attendance, workshop safety, or student services, please contact
             the Student Affairs Office.
-
         </p>
 
         <div class="contact-item">
-
             <i class="fas fa-envelope"></i>
             support@academy.lk
-
         </div>
 
         <div class="contact-item">
-
             <i class="fas fa-phone"></i>
             +94 11 234 5678
-
         </div>
 
         <div class="contact-item">
-
             <i class="fas fa-map-marker-alt"></i>
             Automobile Engineering Academy
-
         </div>
-
     </div>
 
 </div>
diff --git a/resources/views/help_code.blade.php b/resources/views/help_code.blade.php
new file mode 100644
index 0000000..a03b8fc
--- /dev/null
+++ b/resources/views/help_code.blade.php
@@ -0,0 +1,466 @@
+<!-- feedback controller function  -->
+
+ 
+ 
+
+<!-- use Illuminate\Http\Request;
+use App\Models\Feedback;
+use App\Models\user; -->
+
+ 
+ 
+<!-- // public function feedback(Request $request) 
+// {
+   
+//     $request->validate([
+//         'feedback_type' => 'required',
+//         'subject' => 'required|string|max:255',
+//         'feedback_text' => 'required|string',
+//     ]);
+ 
+   
+//     Feedback::create([
+//     'student_id'    => auth()->id(), 
+//     'feedback_type' => $request->feedback_type,
+//     'subject'       => $request->subject,
+//     'feedback_text' => $request->feedback_text,
+//     'status'        => 'Pending', 
+// ]);
+
+//     return redirect()->back()->with('success', 'Feedback submitted successfully!');
+// }
+
+
+//  public function feedback(Request $request) 
+// {
+//     $request->validate([
+//         'feedback_type' => 'required',
+//         'subject'       => 'required|string|max:255',
+//         'feedback_text' => 'required|string',
+//     ]);
+
+     
+//     $studentLogId = session('student_portal_log_id');
+
+    
+//     if (!$studentLogId) {
+//         return redirect('/students')->with('error', 'Please login first to submit feedback!');
+//     }
+
+//     Feedback::create([
+//         'student_id'    => $studentLogId,  
+//         'feedback_type' => $request->feedback_type,
+//         'subject'       => $request->subject,
+//         'feedback_text' => $request->feedback_text,
+//         'status'        => 'Pending', 
+//     ]);
+
+//     return redirect('/Feedback&Complain')->back()->with('success', 'Feedback submitted successfully!');}
+// -->
+
+
+########### ########### ########### ########### ########### ########### ########### ########### 
+
+
+<!-- js table data view -->
+
+
+<!-- JavaScript to handle Submissions -->
+<!-- <script>
+  document.addEventListener('DOMContentLoaded', function() {
+    const tableBody = document.getElementById('historyTableBody');
+
+    
+    function getFormattedDate() {
+        const options = { day: '2-digit', month: 'long', year: 'numeric' };
+        return new Date().toLocaleDateString('en-GB', options);
+    }
+
+   
+    document.getElementById('feedbackForm').addEventListener('submit', function(e) {
+        e.preventDefault();
+
+        const subject = document.getElementById('feedbackSubject').value;
+        const date = getFormattedDate();
+
+         
+        const newRow = document.createElement('tr');
+        newRow.innerHTML = `
+            <td>Feedback</td>
+            <td>${subject}</td>
+            <td>${date}</td>
+            <td><span class="badge-status pending"> Pending </span></td>
+        `;
+
+         
+        tableBody.insertBefore(newRow, tableBody.firstChild);
+
+        
+        this.reset();
+        alert('Feedback submitted successfully!');
+    });
+
+    // 2. Complaint Form Submission
+    document.getElementById('complaintForm').addEventListener('submit', function(e) {
+        e.preventDefault();
+
+        const title = document.getElementById('complaintTitle').value;
+        const date = getFormattedDate();
+
+        const newRow = document.createElement('tr');
+        newRow.innerHTML = `
+            <td>Complaint</td>
+            <td>${title}</td>
+            <td>${date}</td>
+            <td><span class="badge-status pending"> Pending </span></td>
+        `;
+
+        tableBody.insertBefore(newRow, tableBody.firstChild);
+
+        this.reset();
+        alert('Complaint submitted successfully!');
+    });
+});
+</script>  -->
+
+
+
+########### ########### ########### ########### ########### ########### ########### ########### 
+
+<!-- student view profile blade -->
+
+
+
+<!-- @extends('layouts.studentportalnav')
+
+@section('title', 'Student Profile')
+
+@section('content')
+
+<style>
+
+body{
+    background:#f6f7fb;
+}
+
+
+/* Header */
+
+.profile-header{
+
+    background:linear-gradient(135deg,#5E244E,#4a1c3e);
+    color:#fff;
+    border-radius:20px;
+    padding:40px;
+    margin-bottom:35px;
+    box-shadow:0 15px 35px rgba(0,0,0,.15);
+
+}
+
+
+.profile-header h2{
+
+    font-weight:700;
+
+}
+
+
+.profile-header p{
+
+    color:#ddd;
+
+}
+
+
+
+/* Profile Card */ 
+
+.profile-card{
+
+    background:#fff;
+    border-radius:20px;
+    padding:30px;
+    box-shadow:0 10px 30px rgba(0,0,0,.08);
+    height:100%;
+
+}
+
+
+
+/* Student Image */
+
+.profile-image{
+
+    width:150px;
+    height:150px;
+    border-radius:50%;
+    object-fit:cover;
+    border:6px solid #d4af37;
+
+}
+
+
+.student-name{
+
+    color:#5E244E;
+    font-weight:700;
+    margin-top:15px;
+
+}
+
+
+.student-id{
+
+    background:#5E244E;
+    color:#fff;
+    padding:8px 20px;
+    border-radius:50px;
+    display:inline-block;
+    font-size:14px;
+
+}
+
+
+
+/* Information */
+
+.info-title{
+
+    color:#5E244E;
+    font-weight:700;
+    border-bottom:2px solid #d4af37;
+    padding-bottom:10px;
+    margin-bottom:20px;
+
+}
+
+
+.info-row{
+
+    display:flex;
+    justify-content:space-between;
+    padding:12px 0;
+    border-bottom:1px solid #eee;
+
+}
+
+
+.label{
+
+    color:#777;
+
+}
+
+
+.value{
+
+    font-weight:600;
+    color:#333;
+
+}
+
+
+
+/* Course */
+
+.course-box{
+
+    background:#5E244E;
+    color:#fff;
+    padding:25px;
+    border-radius:20px;
+
+}
+
+
+.course-box h4{
+
+    color:#d4af37;
+    font-weight:700;
+
+}
+
+
+.course-item{
+
+    margin-top:12px;
+
+}
+
+
+.course-item i{
+
+    color:#d4af37;
+    width:25px;
+
+}
+
+
+
+/* Button */
+
+.edit-btn{
+
+    background:#d4af37;
+    color:white;
+    border:none;
+    border-radius:50px;
+    padding:12px 30px;
+    font-weight:600;
+
+}
+
+
+.edit-btn:hover{
+
+    background:#c49d20;
+    color:#fff;
+
+}
+
+
+</style>
+
+
+
+<div class="container py-4">
+
+
+  Header -->
+
+    <!-- <div class="profile-header">
+    <h2> <i class="fas fa-user-graduate"></i>Student Profile </h2>
+        <p>Manage your personal information and academic details. </p>
+    </div>
+
+
+<div class="col-lg-4">
+    <div class="profile-card text-center">
+       
+        <img src="{{ !empty($student->image) ? asset($student->image) : 'https://i.pravatar.cc/300' }}" 
+             class="profile-image" alt="Profile Image">
+             
+        <h3 class="student-name">{{ $student->full_name }}</h3>
+
+        <span class="student-id">
+            Student ID : {{ $student->student_id }}
+        </span>
+        <hr>
+
+        <button class="edit-btn mt-3">
+            <i class="fas fa-edit"></i> Edit Profile 
+        </button>
+    </div>
+</div>
+
+ Details -->
+<!-- <div class="col-lg-8">
+    <div class="profile-card">
+        <h4 class="info-title">
+            <i class="fas fa-user"></i>
+            Personal Information
+        </h4>
+
+        <div class="info-row">
+            <span class="label">Full Name</span>
+            <span class="value">{{ $student->full_name }}</span>
+        </div>
+
+        <div class="info-row">
+            <span class="label">NIC / Passport</span>
+            <span class="value">{{ $student->nic_passport }}</span>
+        </div>
+
+        <div class="info-row">
+            <span class="label">Date of Birth</span>
+            <span class="value">
+                {{ date('d F Y', strtotime($student->date_of_birth)) }}
+            </span>
+        </div>
+
+        <div class="info-row">
+            <span class="label">Gender</span>
+            <span class="value">{{ $student->gender }}</span>
+        </div>
+
+        <div class="info-row">
+            <span class="label">Email</span>
+            <span class="value">{{ $student->email }}</span>
+        </div>
+
+        <div class="info-row">
+            <span class="label">Phone</span>
+            <span class="value">{{ $student->phone }}</span>
+        </div>
+    </div>
+</div>
+
+<div class="row g-4 mt-1"> -->
+    <!-- Education -->
+    <!-- <div class="col-lg-6">
+        <div class="profile-card">
+            <h4 class="info-title">
+                <i class="fas fa-graduation-cap"></i>
+                Educational Background
+            </h4>
+            <div class="info-row">
+                <span class="label">Qualification</span>
+                <span class="value">{{ $student->qualification }}</span>
+            </div>
+            <div class="info-row">
+                <span class="label">Institute</span>
+                <span class="value">{{ $student->institute }}</span>
+            </div>
+            <div class="info-row">
+                <span class="label">Year Completed</span>
+                <span class="value">{{ $student->year_completed }}</span>
+            </div>
+        </div>
+    </div> -->
+
+    <!-- Course Details -->
+    <!-- <div class="col-lg-6">
+        <div class="course-box">
+            <h4><i class="fas fa-car"></i>Course Details</h4>
+
+            <div class="course-item">
+                <i class="fas fa-book"></i> {{ $student->course_name }}
+            </div>
+            <div class="course-item"> 
+                <i class="fas fa-calendar"></i> Duration : {{ $student->duration }}
+            </div>
+            <div class="course-item">
+                <i class="fas fa-layer-group"></i> Current Semester : {{ $student->current_semester }}
+            </div>
+            <div class="course-item">
+                <i class="fas fa-user-tie"></i> Trainer : {{ $student->trainer_name }}
+            </div>
+        </div>
+    </div>
+</div>
+
+
+ 
+@endsection     -->
+
+########### ########### ########### ########### ########### ########### ########### ########### 
+
+<!-- // Home Page
+Route::get('/', function () {
+    return view('welcome');
+});
+
+ 
+// Route::get('/StudentProfile', [studentsController::class, 'showProfile'])->name('StudentProfile');
+
+Route::post('/studentlogout', [studentportalnavController::class, 'logout']);
+
+// Route::post('/feedback', [FeedbackController ::class, 'feedback'])->name('feedback.store'); -->
+<!-- 
+Route::post('/feedback/store', [FeedbackController::class, 'feedback']) ->middleware('auth') ->name('feedback.store');
+
+ 
+Route::post('/contact-submit', [ContactMsgController::class, 'store'])->name('contact.store'); -->
+
+
+
diff --git a/resources/views/layouts/studentportalnav.blade.php b/resources/views/layouts/studentportalnav.blade.php
index 113f9ee..e3ac99c 100644
--- a/resources/views/layouts/studentportalnav.blade.php
+++ b/resources/views/layouts/studentportalnav.blade.php
@@ -4,32 +4,35 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <meta name="csrf-token" content="{{ csrf_token() }}">
-    <title>Responsive Student Portal</title>
+    <title>@yield('title', 'Student Portal - Automobile Academic')</title>
      
-    <!-- Font Awesome Icons -->
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+    <!-- Font Awesome Icons & Bootstrap 5 -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css">
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
     
     <style>
-        /* Global Root Variables */
+        /* Global Root Variables based on Master Layout */
         :root {
-            --primary: #642326;  
-            --background: #f5f6fb;
+            --theme-navy: #2D355B;        /* Primary Dark Navy */
+            --theme-footer-navy: #1F2541; /* Dark Navy for active/hover states */
+            --theme-red: #822424;         /* Primary Accent Red */
+            --theme-red-hover: #df2c3e;   /* Red Hover state */
+            --theme-yellow: #FFEA85;      /* Accent Yellow/Gold */
+            --theme-bg: #F6F6F6;          /* Light Background */
             --sidebar-width: 260px;
-            --text-color: #333333;
-            --sidebar-bg: #282d55;
+            --text-dark: #333333;
         }
 
         * {
             margin: 0;
             padding: 0;
             box-sizing: border-box;
-            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+            font-family: 'Segoe UI', sans-serif;
         }
 
         body {
-            background-color: var(--background);
-            color: var(--text-color);
+            background-color: var(--theme-bg);
+            color: var(--text-dark);
             display: flex;
             min-height: 100vh;
             overflow-x: hidden;
@@ -39,7 +42,7 @@
         .sidebar {
             width: var(--sidebar-width);
             height: 100vh;
-            background: var(--sidebar-bg);
+            background: var(--theme-navy);
             color: #fff;
             position: fixed;
             top: 0;
@@ -49,51 +52,37 @@
             z-index: 1030;
             display: flex;
             flex-direction: column;
+            box-shadow: 2px 0 10px rgba(0,0,0,0.1);
         }
 
         .sidebar .brand {
-            padding: 0 24px 24px;
+            padding: 0 24px 20px;
             font-weight: 700;
-            font-size: 1.2rem;
-            border-bottom: 1px solid rgba(255,255,255,.12);
+            font-size: 1.25rem;
+            color: #ffffff;
+            border-bottom: 1px solid rgba(255,255,255,.15);
             margin-bottom: 12px;
             display: flex;
             align-items: center;
         }
 
-        /* User Profile Section inside Sidebar */
-        .sidebar-user-profile {
-            padding: 15px 24px;
-            border-bottom: 1px solid rgba(255,255,255,.12);
-            margin-bottom: 15px;
-        }
-        
-        .sidebar-user-profile .dropdown-toggle {
-            display: flex;
-            align-items: center;
-            gap: 10px;
-            color: #fff;
-            text-decoration: none;
-            font-size: 0.95rem;
-        }
-
         .sidebar .nav {
             display: flex;
             flex-direction: column;
             flex-grow: 1;
             overflow-y: auto;
-            color: #2e2750;
         }
 
         .sidebar .nav-link {
-            color: rgba(255,255,255,.75);
+            color: rgba(255, 255, 255, 0.85);
             padding: 14px 24px;
-            font-size: .95rem;
+            font-size: 0.95rem;
+            font-weight: 600;
             display: flex;
             align-items: center;
             gap: 12px;
-            transition: .2s;
-            border-left: 3px solid transparent;
+            transition: all 0.2s ease;
+            border-left: 4px solid transparent;
             text-decoration: none;
         }
 
@@ -102,26 +91,53 @@
             text-align: center; 
         }
 
+        /* Hover & Active states matched to Main Theme */
         .sidebar .nav-link:hover {
-            background: rgba(255,255,255,.06);
-            color: #fff;
+            background: rgba(255, 255, 255, 0.08);
+            color: var(--theme-yellow) !important;
+            padding-left: 28px;
         }
 
         .sidebar .nav-link.active {
-            background: rgba(255,255,255,.1);
-            color: #fff;
-            border-left: 3px solid #fff;
-            font-weight: 600;
-        }
-        
-        .sidebar .logout-link {
-            color: rgba(255,255,255,.6);
-            margin-top: auto; 
+            background: var(--theme-footer-navy);
+            color: var(--theme-yellow) !important;
+            border-left: 4px solid #F73F52;
+            font-weight: 700;
         }
 
-        .sidebar .logout-link:hover {
+        /* User Profile Section inside Sidebar */
+        .sidebar-user-profile {
+            padding: 15px 24px;
+            border-top: 1px solid rgba(255,255,255,.15);
+            margin-top: auto;
+            background: var(--theme-footer-navy);
+        }
+        
+        .sidebar-user-profile .user-dropdown-toggle {
+            display: flex;
+            align-items: center;
+            gap: 10px;
             color: #fff;
-            background: rgba(220,53,69,.25);
+            text-decoration: none;
+            font-size: 0.95rem;
+            transition: color 0.2s ease;
+        }
+
+        .sidebar-user-profile .user-dropdown-toggle:hover {
+            color: var(--theme-yellow);
+        }
+
+        /* Custom Theme Buttons */
+        .btn-theme-register {
+            background-color: var(--theme-red);
+            color: white;
+            border: 1px solid #ffffff;
+            transition: background-color 0.2s ease;
+        }
+
+        .btn-theme-register:hover {
+            background-color: var(--theme-red-hover);
+            color: white;
         }
 
         /* ---------- Main Content Layout ---------- */
@@ -130,16 +146,17 @@
             width: calc(100% - var(--sidebar-width));
             min-height: 100vh;
             padding: 40px;
-            background: var(--background);
+            background: var(--theme-bg);
             transition: all 0.3s ease;
         }
 
         /* Mobile Header Toggle Bar */
         .mobile-header {
             display: none;
-            background: #fff;
-            padding: 15px 20px;
-            box-shadow: 0 2px 5px rgba(0,0,0,0.05);
+            background: var(--theme-navy);
+            color: #ffffff;
+            padding: 12px 20px;
+            box-shadow: 0 2px 8px rgba(0,0,0,0.15);
             align-items: center;
             justify-content: space-between;
             position: fixed;
@@ -152,18 +169,22 @@
         .sidebar-toggle {
             background: none;
             border: none;
-            font-size: 1.5rem;
+            font-size: 1.4rem;
             cursor: pointer;
-            color: var(--sidebar-bg);
+            color: #ffffff;
             display: flex;
             align-items: center;
             justify-content: center;
         }
 
+        .sidebar-toggle:hover {
+            color: var(--theme-yellow);
+        }
+
         .mobile-brand {
             font-weight: 700;
             font-size: 1.1rem;
-            color: #333;
+            color: #ffffff;
         }
 
         /* Overlay Background when sidebar open on Mobile */
@@ -174,7 +195,7 @@
             left: 0;
             right: 0;
             bottom: 0;
-            background: rgba(0,0,0,0.4);
+            background: rgba(0,0,0,0.5);
             z-index: 1025;
             opacity: 0;
             transition: opacity 0.3s ease;
@@ -185,7 +206,7 @@
             opacity: 1;
         }
 
-      
+        /* Responsive Breakpoints */
         @media (max-width: 991px) {
             .sidebar {
                 left: calc(-1 * var(--sidebar-width)); 
@@ -197,7 +218,7 @@
 
             .main {
                 margin-left: 0;  
-                padding: 90px 20px 20px 20px;  
+                padding: 85px 20px 20px 20px;  
                 width: 100%;
             }
 
@@ -214,22 +235,24 @@
         <button class="sidebar-toggle" id="toggleBtn" aria-label="Toggle Sidebar">
             <i class="fa-solid fa-bars"></i>
         </button>
-        <div class="mobile-brand">Student Portal</div>
+        <div class="mobile-brand">
+            <i class="fa-solid fa-car-side me-1"></i> AutoEdu Portal
+        </div>
         
-        <!-- Mobile View User Profile Header Dropdown -->
+        <!-- Mobile View User Profile Dropdown -->
         <div class="mobile-user-profile">
             @if(Auth::check())
                 <div class="dropdown">
-                    <a class="text-dark  no-toggle-icon" href="#" role="button" id="userMenuMobile" data-bs-toggle="dropdown" aria-expanded="false">
-                        <i class="fa-solid fa-circle-user" style="font-size: 35px; color: var(--sidebar-bg);"></i>
-                         <strong>{{ Auth::user()->first_name }}</strong>
+                    <a class="text-white text-decoration-none dropdown-toggle d-flex align-items-center gap-2" href="#" role="button" id="userMenuMobile" data-bs-toggle="dropdown" aria-expanded="false">
+                        <i class="fa-solid fa-circle-user" style="font-size: 26px; color: var(--theme-yellow);"></i>
+                        <span class="fw-semibold small">{{ Auth::user()->first_name }}</span>
                     </a>
                     <ul class="dropdown-menu dropdown-menu-end shadow" aria-labelledby="userMenuMobile">
-                        <li class="px-3 py-2 ">
-                            <!-- <small class="text-muted">Signed in as</small><br> -->
-                            <!-- <strong>{{ Auth::user()->first_name }}</strong> -->
+                        <li>
+                            <a class="dropdown-item" href="/StudentProfile">
+                                <i class="fa-solid fa-user me-2"></i> Profile
+                            </a>
                         </li>
-                        <li><a class="dropdown-item mt-1" href="/StudentProfile"><i class="fa-solid fa-user me-2"></i> Profile</a></li>
                         <li><hr class="dropdown-divider"></li>
                         <li>
                             <button type="button" onclick="submitLogout()" class="dropdown-item text-danger w-100 text-start border-0 bg-transparent">
@@ -239,7 +262,7 @@
                     </ul>
                 </div>
             @else
-                <a href="/signin" class="btn btn-sm btn-outline-dark"><i class="fa-solid fa-right-to-bracket"></i></a>
+                <a href="/signin" class="btn btn-sm btn-outline-light"><i class="fa-solid fa-right-to-bracket me-1"></i> Sign In</a>
             @endif
         </div>
     </header>
@@ -250,51 +273,44 @@
     <!-- Sidebar Navigation -->
     <aside class="sidebar" id="sidebar">
         <div class="brand">
-            <i class="fa-solid fa-graduation-cap"></i>&nbsp;&nbsp;Student Portal
+            <i class="fa-solid fa-car-side me-2"></i> AutoEdu
         </div>
-
-        <!-- Sidebar Active User Profile Details (Desktop View) -->
-       
         
+        <!-- Navigation Links -->
         <nav class="nav">
-            <a href="/Dashboard" class="nav-link ">
-                <i class="fa-solid fa-gauge"></i>Dashboard
+            <a href="/Dashboard" class="nav-link {{ request()->is('Dashboard*') ? 'active' : '' }}">
+                <i class="fa-solid fa-gauge"></i> Dashboard
             </a>
-            <a href="/mycourse" class="nav-link">
-                <i class="fa-solid fa-book"></i>My Courses
+            <a href="/mycourse" class="nav-link {{ request()->is('mycourse*') ? 'active' : '' }}">
+                <i class="fa-solid fa-book"></i> My Courses
             </a>
-            <a href="/timetable" class="nav-link">
-                <i class="fa-solid fa-calendar-days"></i>Class Timetable
+            <a href="/timetable" class="nav-link {{ request()->is('timetable*') ? 'active' : '' }}">
+                <i class="fa-solid fa-calendar-days"></i> Class Timetable
             </a>
-            <!-- <a href="/Assignments" class="nav-link">
-                <i class="fa-solid fa-file-lines"></i>Assignments
-            </a> -->
-            <a href="/results" class="nav-link">
-                <i class="fa-solid fa-square-poll-vertical"></i>Exam Results
+            <a href="/results" class="nav-link {{ request()->is('results*') ? 'active' : '' }}">
+                <i class="fa-solid fa-square-poll-vertical"></i> Exam Results
             </a>
-             
-            <a href="/Studentguidelines" class="nav-link">
-                <i class="fa-solid fa-book-open"></i>Student Guidelines
+            <a href="/Studentguidelines" class="nav-link {{ request()->is('Studentguidelines*') ? 'active' : '' }}">
+                <i class="fa-solid fa-book-open"></i> Student Guidelines
             </a>
-            <a href="/Feedback&Complain" class="nav-link">
-                <i class="fa-solid fa-comments"></i>Feedback & Complain
+            <a href="/Feedback&Complain" class="nav-link {{ request()->is('Feedback&Complain*') ? 'active' : '' }}">
+                <i class="fa-solid fa-comments"></i> Feedback & Complain
             </a>
-            <a href="/StudentProfile" class="nav-link">
-                <i class="fa-solid fa-user"></i>Student Profile
+            <a href="/StudentProfile" class="nav-link {{ request()->is('StudentProfile*') ? 'active' : '' }}">
+                <i class="fa-solid fa-user"></i> Student Profile
             </a>
-            
-            
         </nav>
 
-          <div class="sidebar-user-profile">
+        <!-- Sidebar User Profile (Desktop View Footer) -->
+        <div class="sidebar-user-profile">
             @if(Auth::check())
                 @php
                     $displayName = Auth::user()->first_name . ' ' . Auth::user()->last_name;
                 @endphp
-                <div class="dropdown">
-                    <a class="dropdown-toggle" href="#" role="button" id="userMenuDesktop" data-bs-toggle="dropdown" aria-expanded="false">
-                        <i class="fa-solid fa-circle-user" style="font-size: 24px;"></i>
-                        <span class="user-profile-name text-truncate" style="max-width: 160px;">{{ $displayName }}</span>
+                <div class="dropdown dropup">
+                    <a class="user-dropdown-toggle dropdown-toggle" href="#" role="button" id="userMenuDesktop" data-bs-toggle="dropdown" aria-expanded="false">
+                        <i class="fa-solid fa-circle-user" style="font-size: 24px; color: var(--theme-yellow);"></i>
+                        <span class="text-truncate" style="max-width: 150px;">{{ $displayName }}</span>
                     </a>
                     
                     <ul class="dropdown-menu dropdown-menu-start shadow w-100" aria-labelledby="userMenuDesktop">
@@ -305,20 +321,19 @@
                         </li>
                         <li><hr class="dropdown-divider"></li>
                         <li>
-                            <a href="#" onclick="submitLogout(); return false;" class="nav-link logout-link mt-auto" style="color:black;">
-                                <i class="fa-solid fa-right-from-bracket"></i>Logout
-                            </a>
+                            <button type="button" onclick="submitLogout()" class="dropdown-item text-danger border-0 bg-transparent w-100 text-start">
+                                <i class="fa-solid fa-right-from-bracket me-2"></i> Logout
+                            </button>
                         </li>
                     </ul>
                 </div>
             @else
-                <div class="d-flex gap-2 px-2">
+                <div class="d-flex gap-2">
                     <a href="/signin" class="btn btn-outline-light btn-sm w-50">Sign In</a>
-                    <a href="/signup" class="btn btn-warning btn-sm w-50">Register</a>
+                    <a href="/signup" class="btn btn-theme-register btn-sm w-50">Register</a>
                 </div>
             @endif
         </div>
-        
     </aside>
 
     <!-- Main Content Area -->
@@ -326,58 +341,56 @@
         @yield('content')
     </main>
     
-    <!-- Sidebar Toggle JavaScript -->
+    <!-- Scripts -->
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
+
     <script>
+        // Sidebar Toggle Logic
         const toggleBtn = document.getElementById('toggleBtn');
         const sidebar = document.getElementById('sidebar');
         const overlay = document.getElementById('sidebarOverlay');
 
-        // Function to toggle sidebar view
         toggleBtn.addEventListener('click', () => {
             sidebar.classList.toggle('show');
             overlay.classList.toggle('show');
         });
 
-        // Close sidebar if user clicks outside of it
         overlay.addEventListener('click', () => {
             sidebar.classList.remove('show');
             overlay.classList.remove('show');
         });
+
+        // Dynamic Logout Logic
+        function submitLogout() {
+            const tokenEl = document.querySelector('meta[name="csrf-token"]');
+
+            fetch('/studentlogout', { 
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                    'Accept': 'application/json',
+                    'X-CSRF-TOKEN': tokenEl ? tokenEl.getAttribute('content') : ''
+                }
+            })
+            .then(res => {
+                if (!res.ok) {
+                    return res.text().then(text => { throw new Error(text) });
+                }
+                return res.json();
+            })
+            .then(data => {
+                if (data.success) {
+                    alert('Logged out successfully!');
+                    window.location.href = '/students'; 
+                } else {
+                    alert('Logout failed. Please try again.');
+                }
+            })
+            .catch(err => {
+                console.error('Error:', err);
+                alert('Server side error occurred during logout.');
+            });
+        }
     </script>
-    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
-
-    <script>
-       function submitLogout() {
-    const tokenEl = document.querySelector('meta[name="csrf-token"]');
-
-    fetch('/studentlogout', { 
-        method: 'POST',
-        headers: {
-            'Content-Type': 'application/json',
-            'Accept': 'application/json',
-            'X-CSRF-TOKEN': tokenEl ? tokenEl.getAttribute('content') : ''
-        }
-    })
-    .then(res => {
-        if (!res.ok) {
-            return res.text().then(text => { throw new Error(text) });
-        }
-        return res.json();
-    })
-    .then(data => {
-        if (data.success) {
-            alert('Logged out successfully!');
-            window.location.href = '/students'; 
-        } else {
-            alert('Logout failed. Please try again.');
-        }
-    })
-    .catch(err => {
-        console.error('Error:', err);
-        alert('Server side error occurred during logout.');
-    });
-}
-
-</script>
 </body>
 </html>
\ No newline at end of file
diff --git a/resources/views/mycourse.blade.php b/resources/views/mycourse.blade.php
index a84c3ff..66e7ad4 100644
--- a/resources/views/mycourse.blade.php
+++ b/resources/views/mycourse.blade.php
@@ -4,46 +4,39 @@
 
 @section('content')
 
-
-
- 
-
-<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
-<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
-<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
-
 <style>
 :root {
-    --purple-main: #5E244E;
-    --purple-dark: #4a1c3e;
-    --purple-light: #744a68;
-    --gold-accent: #D4AF37;
-    --gold-hover: #b8972e;
-    --bg-light: #f8fafc;
+    --theme-navy: #2D355B;        /* Primary Navy */
+    --theme-navy-dark: #1F2541;   /* Dark Navy */
+    --theme-red: #822424;         /* Primary Accent Red */
+    --theme-red-hover: #df2c3e;   /* Red Hover */
+    --theme-yellow: #FFEA85;      /* Accent Yellow/Gold */
+    --bg-light: #F6F6F6;          /* Page Background */
     --white: #ffffff;
 }
 
 body {
     background: var(--bg-light);
-    font-family: 'Poppins', sans-serif;
+    font-family: 'Segoe UI', sans-serif;
 }
 
 .main-portal-content {
-    padding: 20px 15px;
+    padding: 10px 5px;
     min-height: 100vh;
     transition: all 0.3s ease;
 }
 
 /* Premium Hero Section */
 .hero {
-    background: linear-gradient(135deg, var(--purple-main) 0%, var(--purple-dark) 100%) !important;
+    background: linear-gradient(135deg, #2B293F 0%, #94A6F959 100%) !important;
     color: var(--white) !important;
-    border-radius: 20px; 
-    padding: 30px 20px;
+    border-radius: 16px; 
+    padding: 35px 30px;
     margin-bottom: 30px;
-    box-shadow: 0 10px 30px rgba(74, 28, 62, 0.15);
+    box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15);
     position: relative;
     overflow: hidden;
+    border-left: 5px solid var(--theme-red);
 }
 
 .hero::after {
@@ -60,33 +53,34 @@ body {
 
 /* Course Card */
 .course-card {
-    border: none !important;
-    border-radius: 20px !important; 
+    border: 1px solid #e2e8f0 !important;
+    border-radius: 16px !important; 
     overflow: hidden;
-    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05) !important; 
+    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05) !important; 
     background: var(--white);
     margin-bottom: 30px;
 }
 
 .course-card img {
-    height: 200px;
+    height: 240px;
     object-fit: cover;
     width: 100%;
 }
 
 /* Sidebar Info Boxes */
 .info-box {
-    border-radius: 16px !important; 
+    border-radius: 12px !important; 
     padding: 20px 24px;
     background: var(--white);
-    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important; 
-    border: 1px solid rgba(94, 36, 78, 0.05) !important;
+    box-shadow: 0 4px 12px rgba(219, 240, 99, 0.04) !important; 
+    border: 1px solid #e2e8f0 !important;
     transition: all 0.3s ease;
 }
 
 .info-box:hover {
     transform: translateY(-3px);
-    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06) !important;
+    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08) !important;
+    border-color: var(--theme-navy) !important;
 }
 
 .stat-icon {
@@ -95,97 +89,118 @@ body {
     display: flex;
     align-items: center;
     justify-content: center;
-    border-radius: 12px;
+    border-radius: 10px;
     font-size: 18px;
-    background: rgba(94, 36, 78, 0.08);
-    color: var(--purple-main);
+    background: var(--theme-red) !important;
+    color:  #ffff8d;
 }
 
 /* Modules Card */
 .module-card {
-    border: 1px solid rgba(94, 36, 78, 0.06) !important;
-    border-radius: 16px !important; 
-    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    border: 1px solid #e2e8f0 !important;
+    border-radius: 14px !important; 
+    transition: all 0.3s ease;
     background: var(--white);
-    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02) !important;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03) !important;
 }
 
 .module-card:hover {
-    transform: translateY(-5px);
-    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.08) !important;
-    border-color: var(--purple-light) !important;
+    transform: translateY(-4px);
+    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.08) !important;
+    border-color: var(--theme-red) !important;
 }
 
 /* Progress bar customizations */
 .progress {
     height: 10px !important;
     border-radius: 50px !important;
-    background-color: #f1f5f9 !important;
+    background-color: #e2e8f0 !important;
 }
 
 .progress-bar {
     border-radius: 50px !important;
-    background: linear-gradient(90deg, var(--gold-accent), #f4d05e) !important;
+    background: linear-gradient(90deg, var(--theme-red), var(--theme-red-hover)) !important;
 }
 
 /* Status Badges */
 .status {
     font-size: 11px;
-    font-weight: 600;
-    padding: 5px 14px;
+    font-weight: 700;
+    padding: 6px 14px;
     border-radius: 50px;
     text-transform: uppercase;
     letter-spacing: 0.5px;
 }
 
-.completed { background: rgba(94, 36, 78, 0.1); color: var(--purple-main); }
-.progressing { background: rgba(212, 175, 55, 0.15); color: #9c7e1c; }
-.locked { background: #f1f5f9; color: #64748b; }
+.completed { background: rgba(45, 53, 91, 0.12); color: var(--theme-navy); }
+.progressing { background: rgba(247, 63, 82, 0.15); color: var(--theme-red); }
+.locked { background: #e2e8f0; color: #64748b; }
 
 /* Custom Buttons */
-.btn-gold {
-    background-color: var(--gold-accent) !important; 
-    border-color: var(--gold-accent) !important;
+.btn-theme-red {
+    background-color: var(--theme-red) !important; 
+    border-color: var(--theme-red) !important;
     color: #fff !important;
-    border-radius: 10px;
+    border-radius: 8px;
     font-weight: 600;
+    transition: all 0.2s ease;
+}
+.btn-theme-red:hover { 
+    background-color: var(--theme-red-hover) !important; 
+    border-color: var(--theme-red-hover) !important; 
 }
-.btn-gold:hover { background-color: var(--gold-hover) !important; }
 
-.btn-purple {
-    background-color: var(--purple-main) !important;
-    border-color: var(--purple-main) !important;
+.btn-theme-navy {
+    background-color: var(--theme-navy) !important;
+    border-color: var(--theme-navy) !important;
     color: #fff !important;
-    border-radius: 10px;
-    font-weight: 500;
+    border-radius: 8px;
+    font-weight: 600;
+    transition: all 0.2s ease;
+}
+.btn-theme-navy:hover { 
+    background-color: var(--theme-navy-dark) !important; 
 }
-.btn-purple:hover { background-color: var(--purple-dark) !important; }
 
 .btn-continue {
-    background-color: #fff !important;
-    color: var(--purple-main) !important;
-    border-radius: 10px;
+    background-color: var(--theme-red) !important;
+    color: #ffffff !important;
+    border-radius: 8px;
+    transition: all 0.2s ease;
+}
+.btn-continue:hover { 
+    background-color: var(--theme-red-hover) !important; 
+}
+
+/* Section Title Indicator */
+.section-title-wrapper {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    margin: 30px 0 20px;
+}
+
+.section-title-wrapper::before {
+    content: '';
+    display: inline-block;
+    width: 5px;
+    height: 24px;
+    background-color: var(--theme-red);
+    border-radius: 2px;
 }
-.btn-continue:hover { background-color: #f1f5f9 !important; }
 
 /* Responsive Media Queries */
 @media (min-width: 768px) {
     .main-portal-content {
-        padding: 34px;
+        padding: 10px;
     }
     .hero {
-        padding: 45px;
+        padding: 40px;
     }
     .course-card img {
         height: 280px;
     }
 }
-
-@media (min-width: 992px) {
-    .main-portal-content {
-        margin-left: 18px;
-    }
-}
 </style>
 
 <div class="main-portal-content">
@@ -202,7 +217,7 @@ body {
                     </a>
                 </div>
                 <div class="col-lg-3 col-md-4 text-center d-none d-md-block">
-                    <i class="fa-solid fa-car-side" style="font-size:100px; opacity:.2; color: var(--gold-accent);"></i>
+                    <i class="fa-solid fa-car-side" style="font-size: 157px;opacity: 0.35;color: #8C080F;"></i>
                 </div>
             </div>
         </div>
@@ -219,22 +234,22 @@ body {
                     <div class="card-body p-4">
                         <div class="d-flex flex-wrap justify-content-between align-items-start gap-2 mb-3">
                             <div>
-                                <h3 class="fw-bold text-dark mb-1">AE101</h3>
+                                <h3 class="fw-bold mb-1" style="color: var(--theme-navy);">AE101</h3>
                                 <p class="text-muted small mb-0">
-                                    <i class="fa-solid fa-building me-1" style="color: var(--purple-light);"></i> Automotive Engineering Department
+                                    <i class="fa-solid fa-building me-1" style="color: var(--theme-red);"></i> Automotive Engineering Department
                                 </p>
                             </div>
-                            <span class="badge bg-dark px-3 py-2 rounded-pill">Diploma</span>
+                            <span class="badge px-3 py-2 rounded-pill" style="background-color: var(--theme-navy); color: var(--theme-yellow);">Diploma</span>
                         </div>
 
                         <p class="text-secondary small lh-base">
-                            Master engine diagnostics, suspension systems, transmission technology, electrical systems and hybrid vehicle maintenance.
+                            Master engine diagnostics, suspension systems, transmission technology, electrical systems, and hybrid vehicle maintenance through hands-on training and theoretical modules.
                         </p>
 
                         <div class="mt-4">
                             <div class="d-flex justify-content-between mb-2 small">
-                                <span class="text-dark fw-semibold">Overall Progress</span>
-                                <span class="fw-bold" style="color: var(--purple-main);">55%</span>
+                                <span class="fw-semibold" style="color: var(--theme-navy);">Overall Progress</span>
+                                <span class="fw-bold" style="color: var(--theme-red);">55%</span>
                             </div>
                             <div class="progress">
                                 <div class="progress-bar" style="width:55%"></div>
@@ -244,9 +259,9 @@ body {
                 </div>
 
                 <!-- Modules Header -->
-                <div class="my-4">
-                    <h4 class="fw-bold text-dark">
-                        <i class="fa-solid fa-list-check me-2" style="color: var(--gold-accent);"></i> Course Modules
+                <div class="section-title-wrapper">
+                    <h4 class="fw-bold mb-0" style="color: var(--theme-navy);">
+                        Course Modules
                     </h4>
                 </div>
 
@@ -258,13 +273,13 @@ body {
                             <div class="card-body p-4 d-flex flex-column justify-content-between">
                                 <div>
                                     <div class="d-flex justify-content-between align-items-start gap-2 mb-2">
-                                        <h6 class="fw-bold text-dark mb-0">Engine Fundamentals</h6>
+                                        <h6 class="fw-bold mb-0" style="color: var(--theme-navy);">Engine Fundamentals</h6>
                                         <span class="status completed">Completed</span>
                                     </div>
-                                    <p class="text-muted small">Learn engine parts and working principles.</p>
+                                    <p class="text-muted small mb-0">Learn engine parts and working principles.</p>
                                 </div>
-                                <div class="mt-3">
-                                    <button class="btn btn-purple w-100 btn-sm py-2">Review Module</button>
+                                <div class="mt-4">
+                                    <button class="btn btn-theme-navy w-100 btn-sm py-2">Review Module</button>
                                 </div>
                             </div>
                         </div>
@@ -276,13 +291,13 @@ body {
                             <div class="card-body p-4 d-flex flex-column justify-content-between">
                                 <div>
                                     <div class="d-flex justify-content-between align-items-start gap-2 mb-2">
-                                        <h6 class="fw-bold text-dark mb-0">Transmission Systems</h6>
+                                        <h6 class="fw-bold mb-0" style="color: var(--theme-navy);">Transmission Systems</h6>
                                         <span class="status progressing">In Progress</span>
                                     </div>
-                                    <p class="text-muted small">Manual & Automatic transmission systems.</p>
+                                    <p class="text-muted small mb-0">Manual & Automatic transmission systems.</p>
                                 </div>
-                                <div class="mt-3">
-                                    <button class="btn btn-gold w-100 btn-sm py-2">Continue Learning</button>
+                                <div class="mt-4">
+                                    <button class="btn btn-theme-red w-100 btn-sm py-2">Continue Learning</button>
                                 </div>
                             </div>
                         </div>
@@ -297,9 +312,9 @@ body {
                                         <h6 class="fw-bold text-secondary mb-0">Brake Systems</h6>
                                         <span class="status locked"><i class="fa fa-lock me-1"></i> Locked</span>
                                     </div>
-                                    <p class="text-muted small">Complete previous module to unlock.</p>
+                                    <p class="text-muted small mb-0">Complete previous module to unlock.</p>
                                 </div>
-                                <div class="mt-3">
+                                <div class="mt-4">
                                     <button class="btn btn-secondary w-100 btn-sm py-2" disabled>Locked</button>
                                 </div>
                             </div>
@@ -315,9 +330,9 @@ body {
                                         <h6 class="fw-bold text-secondary mb-0">Hybrid Technology</h6>
                                         <span class="status locked"><i class="fa fa-lock me-1"></i> Locked</span>
                                     </div>
-                                    <p class="text-muted small">Learn EV and Hybrid systems.</p>
+                                    <p class="text-muted small mb-0">Learn EV and Hybrid systems.</p>
                                 </div>
-                                <div class="mt-3">
+                                <div class="mt-4">
                                     <button class="btn btn-secondary w-100 btn-sm py-2" disabled>Locked</button>
                                 </div>
                             </div>
@@ -334,7 +349,7 @@ body {
                         <div class="info-box d-flex align-items-center">
                             <div class="stat-icon"><i class="fa fa-book"></i></div>
                             <div class="ms-3">
-                                <h5 class="fw-bold mb-0" style="color: var(--purple-dark);">12</h5>
+                                <h5 class="fw-bold mb-0" style="color: var(--theme-navy);">12</h5>
                                 <span class="text-muted small">Modules Available</span>
                             </div>
                         </div>
@@ -344,7 +359,7 @@ body {
                         <div class="info-box d-flex align-items-center">
                             <div class="stat-icon"><i class="fa fa-clock"></i></div>
                             <div class="ms-3">
-                                <h5 class="fw-bold mb-0" style="color: var(--purple-dark);">2 Years</h5>
+                                <h5 class="fw-bold mb-0" style="color: var(--theme-navy);">2 Years</h5>
                                 <span class="text-muted small">Course Duration</span>
                             </div>
                         </div>
@@ -354,7 +369,7 @@ body {
                         <div class="info-box d-flex align-items-center">
                             <div class="stat-icon"><i class="fa fa-award"></i></div>
                             <div class="ms-3">
-                                <h5 class="fw-bold mb-0" style="color: var(--purple-dark);">NVQ Level 5</h5>
+                                <h5 class="fw-bold mb-0" style="color: var(--theme-navy);">NVQ Level 5</h5>
                                 <span class="text-muted small">Qualification</span>
                             </div>
                         </div>
@@ -367,5 +382,4 @@ body {
     </div>
 </div>
 
-<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
 @endsection
\ No newline at end of file
diff --git a/resources/views/results.blade.php b/resources/views/results.blade.php
index c0bad4e..47914b3 100644
--- a/resources/views/results.blade.php
+++ b/resources/views/results.blade.php
@@ -4,523 +4,373 @@
 
 @section('content')
 
-<style>
+<!-- Bootstrap 5 -->
+<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
 
-body{
-    background:#f6f7fb;
+<!-- Font Awesome -->
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+
+<!-- Google Font -->
+<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
+
+<style>
+:root {
+    --theme-navy: #2D355B;        /* Primary Navy */
+    --theme-navy-dark: #1F2541;   /* Dark Navy */
+    --theme-red: #822424;         /* Primary Accent Red */
+    --theme-red-hover: #df2c3e;   /* Red Hover */
+    --theme-yellow: #FFEA85;      /* Accent Yellow/Gold */
+    --bg-light: #F6F6F6;          /* Page Background */
+    --white: #ffffff;
+}
+
+body {
+    font-family: 'Poppins', sans-serif;
+    background: var(--bg-light);
 }
 
 /* =======================
-Hero
+Hero Section
 ======================= */
-
-.result-hero{
-
-    background:linear-gradient(135deg,#5E244E,#4a1c3e);
-    color:#fff;
-    border-radius:20px;
-    padding:40px;
-    margin-bottom:30px;
-    box-shadow:0 15px 35px rgba(0,0,0,.15);
-
+.result-hero {
+    background: linear-gradient(135deg, #2B293F 0%, #94A6F959 100%) !important;
+    color: var(--white);
+    border-radius: 16px;
+    padding: 35px 30px;
+    margin-bottom: 30px;
+    box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15);
+    border-left: 5px solid var(--theme-red);
 }
 
-.result-hero h2{
-
-    font-weight:700;
-
+.result-hero h2 {
+    font-weight: 700;
 }
 
-.result-hero p{
-
-    color:#ddd;
-    margin-bottom:0;
-
+.result-hero p {
+    color: rgba(255, 255, 255, 0.85);
+    margin-bottom: 0;
 }
 
 /* =======================
 Summary Cards
 ======================= */
-
-.summary-card{
-
-    background:#fff;
-    border:none;
-    border-radius:20px;
-    padding:25px;
-    text-align:center;
-    box-shadow:0 10px 25px rgba(0,0,0,.08);
-    transition:.3s;
-
+.summary-card {
+    background: var(--white);
+    border: 1px solid #e2e8f0;
+    border-radius: 16px;
+    padding: 25px;
+    text-align: center;
+    box-shadow: 0 4px 15px rgba(0, 0, 0, .04);
+    transition: all 0.3s ease;
 }
 
-.summary-card:hover{
-
-    transform:translateY(-5px);
-
+.summary-card:hover {
+    transform: translateY(-4px);
+    border-color: var(--theme-navy);
+    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.08);
 }
 
-.summary-card i{
-
-    font-size:40px;
-    color:#5E244E;
-    margin-bottom:15px;
-
+.summary-card i {
+    font-size: 36px;
+    color: var(--theme-red);
+    margin-bottom: 12px;
 }
 
-.summary-card h3{
-
-    color:#5E244E;
-    font-weight:700;
-
+.summary-card h3 {
+    color: var(--theme-navy);
+    font-weight: 700;
+    margin-bottom: 4px;
 }
 
-.summary-card small{
-
-    color:#777;
-
+.summary-card small {
+    color: #64748b;
+    font-weight: 500;
 }
 
 /* =======================
 Result Table
 ======================= */
-
-.result-card{
-
-    margin-top:35px;
-    background:#fff;
-    border-radius:20px;
-    overflow:hidden;
-    box-shadow:0 10px 30px rgba(0,0,0,.08);
-
+.result-card {
+    margin-top: 30px;
+    background: var(--white);
+    border: 1px solid #e2e8f0;
+    border-radius: 16px;
+    overflow: hidden;
+    box-shadow: 0 4px 15px rgba(0, 0, 0, .04);
 }
 
-.table-head{
-
-    background:#5E244E;
-    color:#fff;
-    padding:18px 25px;
-
+.table-head {
+    background: var(--theme-navy);
+    color: var(--white);
+    padding: 18px 25px;
 }
 
-.table{
-
-    margin-bottom:0;
-
+.table {
+    margin-bottom: 0;
 }
 
-.table th{
-
-    background:#744a68;
-    color:#fff;
-    border:none;
-
+.table th {
+    background: #f8fafc;
+    color: var(--theme-navy);
+    font-weight: 600;
+    border-bottom: 2px solid #e2e8f0;
+    padding: 14px 20px;
 }
 
-.table td{
-
-    vertical-align:middle;
-
+.table td {
+    vertical-align: middle;
+    padding: 14px 20px;
 }
 
-.grade{
-
-    padding:7px 15px;
-    border-radius:30px;
-    font-weight:600;
-    color:#fff;
-    display:inline-block;
-
+.grade {
+    padding: 5px 14px;
+    border-radius: 30px;
+    font-weight: 600;
+    font-size: 13px;
+    color: var(--white);
+    display: inline-block;
 }
 
-.a{
-
-    background:#28a745;
-
+.grade.a {
+    background: var(--theme-navy);
 }
 
-.b{
-
-    background:#17a2b8;
-
+.grade.b {
+    background: var(--theme-red);
 }
 
-.c{
-
-    background:#ffc107;
-    color:#222;
-
+.grade.c {
+    background: #e67e22;
 }
 
-.fail{
-
-    background:#dc3545;
+.grade.fail {
+    background: #dc3545;
+}
 
+.status-pass {
+    color: #198754;
+    font-weight: 600;
 }
 
 /* =======================
 Progress
 ======================= */
+.progress {
+    height: 10px;
+    border-radius: 20px;
+    background-color: #e2e8f0;
+}
 
-.progress{
-
-    height:10px;
-    border-radius:20px;
+.progress-bar-navy {
+    background-color: var(--theme-navy) !important;
+}
 
+.progress-bar-red {
+    background-color: var(--theme-red) !important;
 }
 
 /* =======================
-Download
+Download Card
 ======================= */
-
-.download-card{
-
-    margin-top:30px;
-    background:#4a1c3e;
-    color:#fff;
-    border-radius:20px;
-    padding:30px;
-    display:flex;
-    justify-content:space-between;
-    align-items:center;
-    flex-wrap:wrap;
-
+.download-card {
+    margin-top: 30px;
+    background: linear-gradient(135deg, #2B293F 0%, #94A6F959 100%) !important;
+    color: var(--white);
+    border-radius: 16px;
+    padding: 30px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    flex-wrap: wrap;
+    gap: 15px;
+    box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15);
 }
 
-.download-card h4{
-
-    color:#d4af37;
-    font-weight:700;
-
+.download-card h4 {
+    color: var(--theme-yellow);
+    font-weight: 700;
+    margin-bottom: 6px;
 }
 
-.btn-result{
-
-    background:#d4af37;
-    color:#fff;
-    border:none;
-    border-radius:50px;
-    padding:12px 30px;
-    font-weight:600;
-
+.btn-result {
+    background-color: var(--theme-red) !important;
+    color: var(--white) !important;
+    border: none;
+    border-radius: 8px;
+    padding: 10px 24px;
+    font-weight: 600;
+    transition: all 0.2s ease;
 }
 
-.btn-result:hover{
-
-    background:#c49d20;
-    color:#fff;
-
+.btn-result:hover {
+    background-color: var(--theme-red-hover) !important;
+    color: var(--white) !important;
 }
 
+@media(max-width:768px) {
+    .result-hero {
+        padding: 25px;
+    }
+}
 </style>
 
 <div class="container py-4">
 
-    <!-- Hero -->
-
+    <!-- Hero Section -->
     <div class="result-hero">
-
         <h2>
-
-            <i class="fas fa-award"></i>
-
+            <i class="fas fa-award me-2" style="color: var(--theme-yellow);"></i>
             Academic Results
-
         </h2>
-
         <p>
-
-            View your examination results and academic performance.
-
+            View your examination results and overall academic performance.
         </p>
-
     </div>
 
-    <!-- Summary -->
-
-    <div class="row">
-
-        <div class="col-md-4 mb-4">
-
+    <!-- Summary Cards -->
+    <div class="row g-4">
+        <div class="col-md-4">
             <div class="summary-card">
-
                 <i class="fas fa-chart-line"></i>
-
                 <h3>82%</h3>
-
                 <small>Overall Average</small>
-
             </div>
-
         </div>
 
-        <div class="col-md-4 mb-4">
-
+        <div class="col-md-4">
             <div class="summary-card">
-
                 <i class="fas fa-medal"></i>
-
                 <h3>3.65</h3>
-
                 <small>Current GPA</small>
-
             </div>
-
         </div>
 
-        <div class="col-md-4 mb-4">
-
+        <div class="col-md-4">
             <div class="summary-card">
-
-                <i class="fas fa-book"></i>
-
+                <i class="fas fa-book-open"></i>
                 <h3>6 / 6</h3>
-
                 <small>Modules Passed</small>
-
             </div>
-
         </div>
-
     </div>
 
     <!-- Result Table -->
-
     <div class="result-card">
-
         <div class="table-head">
-
-            <h4 class="mb-0">
-
+            <h5 class="mb-0 fw-bold">
                 Semester Results
-
-            </h4>
-
+            </h5>
         </div>
 
-        <table class="table table-hover">
-
-            <thead>
-
-            <tr>
-
-                <th>Module</th>
-                <th>Marks</th>
-                <th>Grade</th>
-                <th>Status</th>
-
-            </tr>
-
-            </thead>
-
-            <tbody>
-
-            <tr>
-
-                <td>Engine Technology</td>
-
-                <td>91</td>
-
-                <td>
-
-                    <span class="grade a">
-
-                        A+
-
-                    </span>
-
-                </td>
-
-                <td>Pass</td>
-
-            </tr>
-
-            <tr>
-
-                <td>Brake Systems</td>
-
-                <td>84</td>
-
-                <td>
-
-                    <span class="grade a">
-
-                        A
-
-                    </span>
-
-                </td>
-
-                <td>Pass</td>
-
-            </tr>
-
-            <tr>
-
-                <td>Electrical Systems</td>
-
-                <td>79</td>
-
-                <td>
-
-                    <span class="grade b">
-
-                        B+
-
-                    </span>
-
-                </td>
-
-                <td>Pass</td>
-
-            </tr>
-
-            <tr>
-
-                <td>Transmission Systems</td>
-
-                <td>74</td>
-
-                <td>
-
-                    <span class="grade b">
-
-                        B
-
-                    </span>
-
-                </td>
-
-                <td>Pass</td>
-
-            </tr>
-
-            <tr>
-
-                <td>Workshop Practice</td>
-
-                <td>88</td>
-
-                <td>
-
-                    <span class="grade a">
-
-                        A
-
-                    </span>
-
-                </td>
-
-                <td>Pass</td>
-
-            </tr>
-
-            <tr>
-
-                <td>Industrial Safety</td>
-
-                <td>81</td>
-
-                <td>
-
-                    <span class="grade a">
-
-                        A-
-
-                    </span>
-
-                </td>
-
-                <td>Pass</td>
-
-            </tr>
-
-            </tbody>
-
-        </table>
-
+        <div class="table-responsive">
+            <table class="table table-hover align-middle">
+                <thead>
+                    <tr>
+                        <th>Module</th>
+                        <th>Marks</th>
+                        <th>Grade</th>
+                        <th>Status</th>
+                    </tr>
+                </thead>
+
+                <tbody>
+                    <tr>
+                        <td class="fw-semibold" style="color: var(--theme-navy);">Engine Technology</td>
+                        <td>91</td>
+                        <td>
+                            <span class="grade a">A+</span>
+                        </td>
+                        <td><span class="status-pass"><i class="fas fa-check-circle me-1"></i>Pass</span></td>
+                    </tr>
+
+                    <tr>
+                        <td class="fw-semibold" style="color: var(--theme-navy);">Brake Systems</td>
+                        <td>84</td>
+                        <td>
+                            <span class="grade a">A</span>
+                        </td>
+                        <td><span class="status-pass"><i class="fas fa-check-circle me-1"></i>Pass</span></td>
+                    </tr>
+
+                    <tr>
+                        <td class="fw-semibold" style="color: var(--theme-navy);">Electrical Systems</td>
+                        <td>79</td>
+                        <td>
+                            <span class="grade b">B+</span>
+                        </td>
+                        <td><span class="status-pass"><i class="fas fa-check-circle me-1"></i>Pass</span></td>
+                    </tr>
+
+                    <tr>
+                        <td class="fw-semibold" style="color: var(--theme-navy);">Transmission Systems</td>
+                        <td>74</td>
+                        <td>
+                            <span class="grade b">B</span>
+                        </td>
+                        <td><span class="status-pass"><i class="fas fa-check-circle me-1"></i>Pass</span></td>
+                    </tr>
+
+                    <tr>
+                        <td class="fw-semibold" style="color: var(--theme-navy);">Workshop Practice</td>
+                        <td>88</td>
+                        <td>
+                            <span class="grade a">A</span>
+                        </td>
+                        <td><span class="status-pass"><i class="fas fa-check-circle me-1"></i>Pass</span></td>
+                    </tr>
+
+                    <tr>
+                        <td class="fw-semibold" style="color: var(--theme-navy);">Industrial Safety</td>
+                        <td>81</td>
+                        <td>
+                            <span class="grade a">A-</span>
+                        </td>
+                        <td><span class="status-pass"><i class="fas fa-check-circle me-1"></i>Pass</span></td>
+                    </tr>
+                </tbody>
+            </table>
+        </div>
     </div>
 
-    <!-- Performance -->
-
-    <div class="result-card mt-4">
-
+    <!-- Performance Bars -->
+    <div class="result-card">
         <div class="table-head">
-
-            <h4 class="mb-0">
-
+            <h5 class="mb-0 fw-bold">
                 Overall Performance
-
-            </h4>
-
+            </h5>
         </div>
 
         <div class="p-4">
-
-            <p class="mb-2">
-
-                Course Completion
-
-            </p>
-
+            <div class="d-flex justify-content-between mb-2">
+                <span class="fw-semibold" style="color: var(--theme-navy);">Course Completion</span>
+                <span class="fw-bold" style="color: var(--theme-navy);">82%</span>
+            </div>
             <div class="progress mb-4">
-
-                <div class="progress-bar bg-success"
-
-                     style="width:82%">
-
-                </div>
-
+                <div class="progress-bar progress-bar-navy" style="width:82%"></div>
             </div>
 
-            <p class="mb-2">
-
-                Attendance Score
-
-            </p>
-
+            <div class="d-flex justify-content-between mb-2">
+                <span class="fw-semibold" style="color: var(--theme-navy);">Attendance Score</span>
+                <span class="fw-bold" style="color: var(--theme-red);">90%</span>
+            </div>
             <div class="progress">
-
-                <div class="progress-bar bg-warning"
-
-                     style="width:90%">
-
-                </div>
-
+                <div class="progress-bar progress-bar-red" style="width:90%"></div>
             </div>
-
         </div>
-
     </div>
 
-    <!-- Download -->
-
+    <!-- Download Section -->
     <div class="download-card">
-
         <div>
-
-            <h4>
-
-                Download Official Result Sheet
-
-            </h4>
-
+            <h4>Download Official Result Sheet</h4>
             <p class="mb-0">
-
-                Download your latest semester examination results in PDF format.
-
+                Get your latest semester examination results in official PDF format.
             </p>
-
         </div>
 
-        <button class="btn btn-result">
-
-            <i class="fas fa-download"></i>
-
-            Download PDF
-
+        <button class="btn btn-result shadow-sm">
+            <i class="fas fa-download me-2"></i>Download PDF
         </button>
-
     </div>
 
 </div>
diff --git a/resources/views/signin.blade.php b/resources/views/signin.blade.php
index 7d2deb1..89e8707 100644
--- a/resources/views/signin.blade.php
+++ b/resources/views/signin.blade.php
@@ -3,26 +3,50 @@
 @section('title', 'Student Login')
 
 @push('styles')
+<!-- Google Font -->
+<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
+
 <style>
-    body {
-        background: #f5f7fb;
+    :root {
+        --theme-navy: #2D355B;        /* Primary Navy */
+        --theme-navy-dark: #1F2541;   /* Dark Navy */
+        --theme-red: #822424;         /* Primary Accent Red */
+        --theme-red-hover: #df2c3e;   /* Red Hover */
+        --theme-yellow: #FFEA85;      /* Accent Yellow/Gold */
+        --bg-light: #F6F6F6;          /* Page Background */
+        --white: #ffffff;
     }
-    * {
-        font-family: 'Arial', Helvetica, sans-serif;
-         transform: scale(0.95);
+
+    body {
+        background: var(--bg-light);
+        font-family: 'Poppins', sans-serif;
     }
 
     /* LEFT PANEL */
     .left-panel {
         min-height: 100vh;
-        background: #f8f9fa;
+        background: linear-gradient(135deg, var(--theme-navy) 0%, var(--theme-navy-dark) 100%);
         display: flex;
         justify-content: center;
         align-items: center;
+        color: var(--white);
+        border-right: 5px solid var(--theme-red);
     }
 
     .left-panel img {
-        max-width: 450px;
+        max-width: 400px;
+        filter: drop-shadow(0 10px 15px rgba(0,0,0,0.3));
+    }
+
+    .left-panel h2 {
+        color: var(--white);
+        font-size: 28px;
+        margin-top: 20px;
+    }
+
+    .left-panel p {
+        color: rgba(255, 255, 255, 0.8);
+        font-size: 15px;
     }
 
     /* RIGHT PANEL */
@@ -32,106 +56,103 @@
         justify-content: center;
         align-items: center;
         padding: 40px;
+        background: var(--bg-light);
+        scale: 0.7;
     }
 
     /* LOGIN BOX */
     .box {
         width: 100%;
-        max-width: 500px;
-        background: #ffffff;
-        padding: 45px;
-        border-radius: 18px;
-        box-shadow: 0 15px 40px rgba(0,0,0,0.12);
+        max-width: 480px;
+        background: var(--white);
+        padding: 45px 40px;
+        border-radius: 16px;
+        box-shadow: 0 10px 30px rgba(31, 37, 65, 0.08);
+        border: 1px solid #e2e8f0;
     }
 
     /* TITLE */
     .headline {
         text-align: center;
-        font-size: 32px;
+        font-size: 28px;
         font-weight: 700;
-        color: #222;
+        color: var(--theme-navy);
         margin-bottom: 35px;
     }
 
-    /* INPUT */
+    /* INPUT CONTAINER */
     .input-container {
         position: relative;
-        margin-bottom: 25px;
-        font-size: 22px;
-        font-family: arial;
+        margin-bottom: 28px;
     }
 
     .input-container input {
         width: 100%;
-        height: 50px;
-        padding: 12px 0;
+        height: 48px;
+        padding: 10px 0 5px 0;
         border: none;
-        border-bottom: 2px solid #ddd;
+        border-bottom: 2px solid #cbd5e1;
         background: transparent;
         outline: none;
-        font-size: 22px;
-        font-family: arial;
-         
+        font-size: 16px;
+        color: #1e293b;
+        transition: all 0.3s ease;
     }
 
     .input-container label {
         position: absolute;
-        top: 15px;
+        top: 12px;
         left: 0;
-        color: #744a68;
-        transition: .3s;
+        color: #64748b;
+        transition: 0.3s ease;
         pointer-events: none;
-        font-size: 22px;
-        font-family: arial;
-        
+        font-size: 15px;
     }
 
     /* FLOATING LABEL & VALIDATION STATES */
-    .input-container input:focus,
-    .input-container input:valid {
-        border-bottom-color: #744a68;
-        font-size: 20px;
-        font-family: arial;
+    .input-container input:focus {
+        border-bottom-color: var(--theme-navy);
     }
 
     .input-container input:focus + label,
     .input-container input:not(:placeholder-shown) + label {
         top: -12px;
         font-size: 12px;
-        color: #744a68;
+        color: var(--theme-navy);
         font-weight: 600;
     }
 
     /* FORGOT PASSWORD */
     .forgot-link {
-        color: #744a68;
-        font-size: 16px;
+        color: var(--theme-red);
+        font-size: 14px;
         text-decoration: none;
         font-weight: 500;
+        padding-left: 37%;
         transition: color 0.2s ease-in-out;
     }
 
     .forgot-link:hover {
         text-decoration: underline;
-        color: #5E244E;
+        color: var(--theme-red-hover);
     }
 
     /* BUTTON */
     .btn-primary {
-        height: 50px;
+        height: 48px;
         width: 100%;
         font-size: 16px;
         font-weight: 600;
-        background: #5E244E;
+        background: var(--theme-red) !important;
         border: none;
-        color: white;
-        /* border-radius: 8px; */
-        transition: background 0.2s ease-in-out, transform 0.1s ease;
+        color: var(--white) !important;
+        border-radius: 8px;
+        transition: all 0.2s ease;
     }
 
     .btn-primary:hover, .btn-primary:focus {
-        background: #4a1c3e;
-        color: white;
+        background: var(--theme-red-hover) !important;
+        box-shadow: 0 4px 12px rgba(130, 36, 36, 0.3);
     }
 
     .btn-primary:active {
@@ -141,22 +162,25 @@
     /* BOTTOM TEXT */
     .dontacc {
         text-align: center;
+        margin-top: 15px;
     }
 
     .dontacc p {
-        color: #666;
+        color: #64748b;
+        font-size: 14px;
     }
 
     .dontacc a {
-        color: #744a68;
+        color: var(--theme-navy);
         text-decoration: none;
         font-weight: 600;
-        font-size: 16px;
-  font-family: arial;
+        font-size: 15px;
+        transition: color 0.2s ease;
     }
 
     .dontacc a:hover {
         text-decoration: underline;
+        color: var(--theme-navy-dark);
     }
 
     /* RESPONSIVE DESIGN */
@@ -171,14 +195,11 @@
         }
 
         .box {
-            padding: 30px;
+            padding: 35px 25px;
         }
 
         .headline {
-            font-size: 28px;
-            color: #5E244E;
-            font-weight: bold;
-            font-family: Arial;
+            font-size: 24px;
         }
     }
 </style>
@@ -188,17 +209,9 @@
 <div class="container-fluid">
     <div class="row min-vh-100">
 
-        <!-- <div class="col-lg-6 left-panel">
-            <div class="text-center">
-                <img src="{{ asset('images/login-banner.png') }}" class="img-fluid mb-4" alt="Automobile Engineering Academy">
-                <h2 class="fw-bold">Automobile Engineering Academy</h2>
-                <p class="text-muted px-5">
-                    Driving Innovation Through Education, Research and Technology.
-                </p>
-            </div>
-        </div> -->
+    
 
-        <div class="col-lg-6 right-panel">
+        <div class="col-lg-6 right-panel col-12 mx-auto">
             <div class="box">
                 <h2 class="headline">Student Sign In</h2>
 
@@ -221,17 +234,16 @@
                         @enderror
                     </div>
 
-                     
+                    
 
-                    <button type="submit" class="btn btn-primary mb-4">
+                    <button type="submit" class="btn btn-primary mb-4 shadow-sm">
                         Sign In
                     </button>
-
-                    <div class="d-flex justify-content-end mb-4"  style="gap: 10px;padding-top: 10px; padding-left: 190px;">
+                     <div class="d-flex justify-content-end mb-4">
                         <a href="{{ url('/password/reset') }}" class="forgot-link">Forgot Password?</a>
                     </div>
 
-                    <div class="dontacc" style="padding-top: 10px; "    >
+                    <div class="dontacc">
                         <!-- <p class="mb-1">Don't have an account?</p> -->
                         <a href="{{ url('/signup') }}">Create Student Account</a>
                     </div>
diff --git a/resources/views/signup.blade.php b/resources/views/signup.blade.php
index 08ff522..fde396c 100644
--- a/resources/views/signup.blade.php
+++ b/resources/views/signup.blade.php
@@ -37,6 +37,7 @@
         padding: 45px;
         border-radius: 18px;
         box-shadow: 0 15px 40px rgba(0,0,0,0.12);
+        scale : 0.72
     }
 
     /* TITLE */
diff --git a/resources/views/timetable.blade.php b/resources/views/timetable.blade.php
index 6c3f39b..bc2a8c1 100644
--- a/resources/views/timetable.blade.php
+++ b/resources/views/timetable.blade.php
@@ -14,372 +14,350 @@
 <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
 
 <style>
-body{
-    font-family:'Poppins',sans-serif;
-    background:#f4f7fc;
+:root {
+    --theme-navy: #2D355B;        /* Primary Navy */
+    --theme-navy-dark: #1F2541;   /* Dark Navy */
+    --theme-red: #822424;         /* Primary Accent Red */
+    --theme-red-hover: #df2c3e;   /* Red Hover */
+    --theme-yellow: #FFEA85;      /* Accent Yellow/Gold */
+    --bg-light: #F6F6F6;          /* Page Background */
+    --white: #ffffff;
 }
 
-.page-header{
-    background:linear-gradient(135deg,#9954b8,#4f3d5b));
-    color:#fff;
-    padding:45px;
-    border-radius:20px;
-    background-color: #5E244E;
-    margin-bottom:30px;
+body {
+    font-family: 'Poppins', sans-serif;
+    background: var(--bg-light);
 }
 
-.page-header h2{
-    font-weight:700;
+/* Page Header Hero Section */
+.page-header {
+    background: linear-gradient(135deg, #2B293F 0%, #94A6F959 100%) !important;
+    color: var(--white);
+    padding: 35px 30px;
+    border-radius: 16px;
+    margin-bottom: 30px;
+    box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15);
+    border-left: 5px solid var(--theme-red);
 }
 
-.page-header p{
-    opacity:.9;
+.page-header h2 {
+    font-weight: 700;
 }
 
-.info-card{
-    border:none;
-    border-radius:15px;
-    box-shadow:0 10px 30px rgba(0,0,0,.08);
+.page-header p {
+    opacity: .85;
 }
 
-.table-card{
-    background:#fff;
-    border-radius:20px;
-    box-shadow:0 10px 30px rgba(0,0,0,.08);
-    overflow:hidden;
+/* Info Cards & Wrapper */
+.info-card {
+    background: var(--white);
+    border: 1px solid #e2e8f0;
+    border-radius: 16px;
+    box-shadow: 0 4px 15px rgba(0, 0, 0, .04);
 }
 
-.table thead{
-    background:#0d6efd;
-    color:#fff;
+.today-card {
+    background: var(--white);
+    border: 1px solid #e2e8f0;
+    border-radius: 16px;
+    box-shadow: 0 4px 15px rgba(0, 0, 0, .04);
+    padding: 25px;
+    height: 100%;
+}
+
+.today-card h5, 
+.info-card h5 {
+    font-weight: 600;
+    color: var(--theme-navy);
+}
+
+/* Timetable Card Section */
+.table-card {
+    background: var(--white);
+    border: 1px solid #e2e8f0;
+    border-radius: 16px;
+    box-shadow: 0 4px 15px rgba(0, 0, 0, .04);
+    overflow: hidden;
+}
+
+.table thead {
+    background: var(--theme-navy);
+    color: var(--white);
+}
+
+.table thead th {
+    font-weight: 600;
+    padding: 15px 10px;
 }
 
 .table td,
-.table th{
-    text-align:center;
-    vertical-align:middle;
-    min-width:140px;
+.table th {
+    text-align: center;
+    vertical-align: middle;
+    min-width: 140px;
 }
 
-.badge-theory{
-    background:#0d6efd;
+.table tbody th {
+    background-color: #f8fafc;
+    color: var(--theme-navy);
+    font-weight: 600;
 }
 
-.badge-practical{
-    background:#198754;
+/* Updated Status Badges */
+.badge-theory {
+    background: var(--theme-navy) !important;
+    color: var(--white) !important;
 }
 
-.badge-workshop{
-    background:#fd7e14;
+.badge-practical {
+    background: var(--theme-red) !important;
+    color: var(--white) !important;
 }
 
-.badge-break{
-    background:#ffc107;
-    color:#000;
+.badge-workshop {
+    background: #e67e22 !important; /* Workshop Accent */
+    color: var(--white) !important;
 }
 
-.table tbody tr:hover{
-    background:#f8fbff;
-    transition:.3s;
+.badge-break {
+    background: var(--theme-yellow) !important;
+    color: var(--theme-navy-dark) !important;
+    font-weight: 600;
 }
 
-.legend span{
-    margin-right:15px;
+.table tbody tr:hover {
+    background: rgba(45, 53, 91, 0.02);
+    transition: .3s;
 }
 
-.legend .badge{
-    padding:8px 12px;
+.lunch-row {
+    background-color: rgba(255, 234, 133, 0.25) !important;
+    color: var(--theme-navy-dark);
+    font-weight: 600;
 }
 
-.today-card{
-    background:white;
-    border-radius:15px;
-    box-shadow:0 10px 25px rgba(0,0,0,.08);
-    padding:25px;
-    height:100%;
+.legend span {
+    margin-right: 12px;
+    display: inline-block;
+    margin-bottom: 8px;
 }
 
-.today-card h5{
-    font-weight:600;
+.legend .badge {
+    padding: 8px 14px;
+    font-size: 12px;
 }
 
-.download-btn{
-    border-radius:50px;
-    padding:10px 25px;
+/* Custom Buttons */
+.download-btn {
+    border-radius: 8px;
+    padding: 10px 22px;
+    background-color: var(--theme-red) !important;
+    color: var(--white) !important;
+    border: none;
+    font-weight: 500;
+    transition: all 0.2s ease;
 }
 
-@media(max-width:768px){
-
-.table td,
-.table th{
-    font-size:13px;
-    min-width:120px;
+.download-btn:hover {
+    background-color: var(--theme-red-hover) !important;
+    color: var(--white) !important;
 }
 
-.page-header{
-    padding:25px;
-}
+@media(max-width:768px) {
+    .table td,
+    .table th {
+        font-size: 13px;
+        min-width: 120px;
+    }
+
+    .page-header {
+        padding: 25px;
+    }
 }
 </style>
 
 <div class="container py-4">
 
     <!-- Header -->
-
     <div class="page-header">
-
-        <div class="d-flex justify-content-between align-items-center flex-wrap">
-
+        <div class="d-flex justify-content-between align-items-center flex-wrap gap-3">
             <div>
-
-                <h2><i class="fas fa-calendar-alt me-2"></i>My Class Timetable</h2>
-
+                <h2 class="mb-1"><i class="fas fa-calendar-alt me-2" style="color: var(--theme-yellow);"></i>My Class Timetable</h2>
                 <p class="mb-0">
                     Automobile Engineering Academy Student Portal
                 </p>
-
             </div>
 
-            <button class="btn btn-light download-btn" onclick="window.print()">
-                <i class="fas fa-print me-2"></i>Print
+            <button class="btn download-btn shadow-sm" onclick="window.print()">
+                <i class="fas fa-print me-2"></i>Print Timetable
             </button>
-
         </div>
-
     </div>
 
+    <!-- Top Grid Info -->
     <div class="row g-4 mb-4">
 
+        <!-- Today's Schedule Card -->
         <div class="col-lg-4">
-
             <div class="today-card">
-
                 <h5 class="mb-3">
-                    <i class="fas fa-clock text-primary me-2"></i>
-                    Today's Classes
+                    <i class="fas fa-clock me-2" style="color: var(--theme-red);"></i>
+                    Today's Schedule
                 </h5>
 
-                <div class="mb-3">
-
+                <div class="mb-3 p-2 rounded" style="background: #f8fafc; border-left: 3px solid var(--theme-navy);">
                     <strong>08:30 - 10:30</strong><br>
-
-                    <span class="badge badge-theory">
-                        Theory
-                    </span>
-
-                    Engine Fundamentals
-
+                    <span class="badge badge-theory me-1">Theory</span>
+                    <span>Engine Fundamentals</span>
                 </div>
 
-                <div class="mb-3">
-
+                <div class="mb-3 p-2 rounded" style="background: #f8fafc; border-left: 3px solid #e67e22;">
                     <strong>10:45 - 12:30</strong><br>
+                    <span class="badge badge-workshop me-1">Workshop</span>
+                    <span>Practical Session</span>
+                </div>
 
-                    <span class="badge badge-workshop">
-                        Workshop
-                    </span>
+                <div class="p-2 rounded" style="background: #f8fafc; border-left: 3px solid var(--theme-red);">
+                    <strong>01:30 - 03:30</strong><br>
+                    <span class="badge badge-practical me-1">Practical</span>
+                    <span>Electrical System</span>
+                </div>
+            </div>
+        </div>
 
-                    Practical Session
+        <!-- Legend Card -->
+        <div class="col-lg-8">
+            <div class="info-card p-4 h-100 d-flex flex-column justify-content-between">
+                <div>
+                    <h5 class="mb-3">
+                        <i class="fas fa-info-circle me-2" style="color: var(--theme-navy);"></i>
+                        Timetable Legend
+                    </h5>
 
+                    <div class="legend mb-2">
+                        <span>
+                            <span class="badge badge-theory">Theory</span>
+                        </span>
+                        <span>
+                            <span class="badge badge-practical">Practical</span>
+                        </span>
+                        <span>
+                            <span class="badge badge-workshop">Workshop</span>
+                        </span>
+                        <span>
+                            <span class="badge badge-break">Break</span>
+                        </span>
+                    </div>
                 </div>
 
                 <div>
-
-                    <strong>01:30 - 03:30</strong><br>
-
-                    <span class="badge badge-practical">
-                        Practical
-                    </span>
-
-                    Electrical System
-
+                    <hr class="text-muted">
+                    <p class="mb-0 text-muted small">
+                        <i class="fas fa-exclamation-circle me-1" style="color: var(--theme-red);"></i>
+                        Please arrive at least 15 minutes before each class. Attendance is compulsory for all practical sessions.
+                    </p>
                 </div>
-
             </div>
-
-        </div>
-
-        <div class="col-lg-8">
-
-            <div class="info-card p-4 h-100">
-
-                <h5 class="mb-3">
-                    <i class="fas fa-info-circle text-primary me-2"></i>
-                    Timetable Legend
-                </h5>
-
-                <div class="legend">
-
-                    <span>
-                        <span class="badge badge-theory">Theory</span>
-                    </span>
-
-                    <span>
-                        <span class="badge badge-practical">Practical</span>
-                    </span>
-
-                    <span>
-                        <span class="badge badge-workshop">Workshop</span>
-                    </span>
-
-                    <span>
-                        <span class="badge badge-break">Break</span>
-                    </span>
-
-                </div>
-
-                <hr>
-
-                <p class="mb-0 text-muted">
-                    Please arrive at least 15 minutes before each class.
-                    Attendance is compulsory for all practical sessions.
-                </p>
-
-            </div>
-
         </div>
 
     </div>
 
-    <!-- Timetable -->
-
+    <!-- Timetable Grid -->
     <div class="table-card">
-
         <div class="table-responsive">
-
             <table class="table table-bordered align-middle mb-0">
-
                 <thead>
-
-                <tr>
-
-                    <th>Time</th>
-
-                    <th>Monday</th>
-
-                    <th>Tuesday</th>
-
-                    <th>Wednesday</th>
-
-                    <th>Thursday</th>
-
-                    <th>Friday</th>
-
-                </tr>
-
+                    <tr>
+                        <th>Time</th>
+                        <th>Monday</th>
+                        <th>Tuesday</th>
+                        <th>Wednesday</th>
+                        <th>Thursday</th>
+                        <th>Friday</th>
+                    </tr>
                 </thead>
-
                 <tbody>
+                    <tr>
+                        <th>08:30 - 10:30</th>
+                        <td>
+                            <span class="badge badge-theory mb-1">Theory</span><br>
+                            Engine Fundamentals
+                        </td>
+                        <td>
+                            <span class="badge badge-practical mb-1">Practical</span><br>
+                            Engine Lab
+                        </td>
+                        <td>
+                            <span class="badge badge-theory mb-1">Theory</span><br>
+                            Transmission
+                        </td>
+                        <td>
+                            <span class="badge badge-workshop mb-1">Workshop</span><br>
+                            Engine Repair
+                        </td>
+                        <td>
+                            <span class="badge badge-theory mb-1">Theory</span><br>
+                            Vehicle Safety
+                        </td>
+                    </tr>
 
-                <tr>
+                    <tr>
+                        <th>10:45 - 12:30</th>
+                        <td>
+                            <span class="badge badge-workshop mb-1">Workshop</span><br>
+                            Service Practice
+                        </td>
+                        <td>
+                            <span class="badge badge-theory mb-1">Theory</span><br>
+                            Electrical
+                        </td>
+                        <td>
+                            <span class="badge badge-practical mb-1">Practical</span><br>
+                            Diagnostics
+                        </td>
+                        <td>
+                            <span class="badge badge-theory mb-1">Theory</span><br>
+                            Fuel System
+                        </td>
+                        <td>
+                            <span class="badge badge-workshop mb-1">Workshop</span><br>
+                            Engine Assembly
+                        </td>
+                    </tr>
 
-                    <th>08:30 - 10:30</th>
-
-                    <td>
-                        <span class="badge badge-theory">Theory</span><br>
-                        Engine Fundamentals
-                    </td>
-
-                    <td>
-                        <span class="badge badge-practical">Practical</span><br>
-                        Engine Lab
-                    </td>
-
-                    <td>
-                        <span class="badge badge-theory">Theory</span><br>
-                        Transmission
-                    </td>
-
-                    <td>
-                        <span class="badge badge-workshop">Workshop</span><br>
-                        Engine Repair
-                    </td>
-
-                    <td>
-                        <span class="badge badge-theory">Theory</span><br>
-                        Vehicle Safety
-                    </td>
-
-                </tr>
-
-                <tr>
-
-                    <th>10:45 - 12:30</th>
-
-                    <td>
-                        <span class="badge badge-workshop">Workshop</span><br>
-                        Service Practice
-                    </td>
-
-                    <td>
-                        <span class="badge badge-theory">Theory</span><br>
-                        Electrical
-                    </td>
-
-                    <td>
-                        <span class="badge badge-practical">Practical</span><br>
-                        Diagnostics
-                    </td>
-
-                    <td>
-                        <span class="badge badge-theory">Theory</span><br>
-                        Fuel System
-                    </td>
-
-                    <td>
-                        <span class="badge badge-workshop">Workshop</span><br>
-                        Engine Assembly
-                    </td>
-
-                </tr>
-
-                <tr class="table-warning">
-
-                    <th>12:30 - 01:30</th>
-
-                    <td colspan="5">
-                        🍴 LUNCH BREAK
-                    </td>
-
-                </tr>
-
-                <tr>
-
-                    <th>01:30 - 03:30</th>
-
-                    <td>
-                        <span class="badge badge-practical">Practical</span><br>
-                        Electrical System
-                    </td>
-
-                    <td>
-                        <span class="badge badge-workshop">Workshop</span><br>
-                        Welding
-                    </td>
-
-                    <td>
-                        <span class="badge badge-theory">Theory</span><br>
-                        Auto Electronics
-                    </td>
-
-                    <td>
-                        <span class="badge badge-practical">Practical</span><br>
-                        Brake System
-                    </td>
-
-                    <td>
-                        <span class="badge badge-theory">Theory</span><br>
-                        Revision
-                    </td>
-
-                </tr>
+                    <tr class="lunch-row">
+                        <th>12:30 - 01:30</th>
+                        <td colspan="5">
+                            🍴 LUNCH BREAK
+                        </td>
+                    </tr>
 
+                    <tr>
+                        <th>01:30 - 03:30</th>
+                        <td>
+                            <span class="badge badge-practical mb-1">Practical</span><br>
+                            Electrical System
+                        </td>
+                        <td>
+                            <span class="badge badge-workshop mb-1">Workshop</span><br>
+                            Welding
+                        </td>
+                        <td>
+                            <span class="badge badge-theory mb-1">Theory</span><br>
+                            Auto Electronics
+                        </td>
+                        <td>
+                            <span class="badge badge-practical mb-1">Practical</span><br>
+                            Brake System
+                        </td>
+                        <td>
+                            <span class="badge badge-theory mb-1">Theory</span><br>
+                            Revision
+                        </td>
+                    </tr>
                 </tbody>
-
             </table>
-
         </div>
-
     </div>
 
 </div>