diff --git a/application/views/backend/index.html b/application/views/backend/index.html
deleted file mode 100644
index 221ac80d..00000000
--- a/application/views/backend/index.html
+++ /dev/null
@@ -1,10 +0,0 @@
-<html lang="en">
-<head>
-    <title>403 Forbidden</title>
-</head>
-<body>
-
-<p>Directory access is forbidden.</p>
-
-</body>
-</html>
diff --git a/application/views/backend/footer.php b/application/views/layouts/backend/backend_footer.php
similarity index 89%
rename from application/views/backend/footer.php
rename to application/views/layouts/backend/backend_footer.php
index 6509332c..0fb1c564 100644
--- a/application/views/backend/footer.php
+++ b/application/views/layouts/backend/backend_footer.php
@@ -49,7 +49,4 @@
     </div>
 </div>
 
-<script src="<?= asset_url('assets/js/backend.js') ?>"></script>
-<script src="<?= asset_url('assets/js/general_functions.js') ?>"></script>
-</body>
-</html>
+
diff --git a/application/views/backend/header.php b/application/views/layouts/backend/backend_header.php
similarity index 59%
rename from application/views/backend/header.php
rename to application/views/layouts/backend/backend_header.php
index a42148dd..18c2b2df 100755
--- a/application/views/backend/header.php
+++ b/application/views/layouts/backend/backend_header.php
@@ -1,48 +1,10 @@
 <?php
 /**
- * @var string $page_title
- * @var array $active_menu
  * @var array $privileges
+ * @var string $active_menu
  */
 ?>
 
-<!doctype html>
-<html lang="en">
-<head>
-    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-    <title><?= isset($page_title) ? $page_title : lang('backend_section') ?> | Easy!Appointments</title>
-    <link rel="stylesheet" type="text/css" href="<?= asset_url('assets/vendor/bootstrap/bootstrap.min.css') ?>">
-    <link rel="stylesheet" type="text/css" href="<?= asset_url('assets/vendor/jquery-ui-dist/jquery-ui.min.css') ?>">
-    <link rel="stylesheet" type="text/css" href="<?= asset_url('assets/vendor/trumbowyg/trumbowyg.min.css') ?>">
-    <link rel="stylesheet" type="text/css" href="<?= asset_url('assets/vendor/select2/select2.min.css') ?>">
-    <link rel="stylesheet" type="text/css" href="<?= asset_url('assets/css/backend.css') ?>">
-    <link rel="stylesheet" type="text/css" href="<?= asset_url('assets/css/general.css') ?>">
-    <link rel="icon" type="image/x-icon" href="<?= asset_url('assets/img/favicon.ico') ?>">
-    <link rel="icon" sizes="192x192" href="<?= asset_url('assets/img/logo.png') ?>">
-
-    <script>
-        // Global JavaScript Variables - Used in all backend pages.
-        var availableLanguages = <?= json_encode(config('available_languages')) ?>;
-        var EALang = <?= json_encode($this->lang->language) ?>;
-    </script>
-
-    <script src="<?= asset_url('assets/vendor/jquery/jquery.min.js') ?>"></script>
-    <script src="<?= asset_url('assets/vendor/@popperjs-core/popper.min.js') ?>"></script>
-    <script src="<?= asset_url('assets/vendor/bootstrap/bootstrap.min.js') ?>"></script>
-    <script src="<?= asset_url('assets/vendor/tippy.js/tippy-bundle.umd.min.js') ?>"></script>
-    <script src="<?= asset_url('assets/vendor/jquery-ui-dist/jquery-ui.min.js') ?>"></script>
-    <script src="<?= asset_url('assets/vendor/jquery-ui-touch-punch/jquery.ui.touch-punch.min.js') ?>"></script>
-    <script src="<?= asset_url('assets/vendor/moment/moment.min.js') ?>"></script>
-    <script src="<?= asset_url('assets/vendor/moment-timezone/moment-timezone-with-data.min.js') ?>"></script>
-    <script src="<?= asset_url('assets/vendor/datejs/date.min.js') ?>"></script>
-    <script src="<?= asset_url('assets/vendor/trumbowyg/trumbowyg.min.js') ?>"></script>
-    <script src="<?= asset_url('assets/vendor/select2/select2.min.js') ?>"></script>
-    <script src="<?= asset_url('assets/vendor/@fortawesome-fontawesome-free/fontawesome.min.js') ?>"></script>
-    <script src="<?= asset_url('assets/vendor/@fortawesome-fontawesome-free/solid.min.js') ?>"></script>
-</head>
-
-<body>
 <nav id="header" class="navbar navbar-expand-md navbar-dark">
     <div id="header-logo" class="navbar-brand">
         <img src="<?= base_url('assets/img/logo.png') ?>">
diff --git a/application/views/layouts/backend/backend_layout.php b/application/views/layouts/backend/backend_layout.php
new file mode 100644
index 00000000..67a2368f
--- /dev/null
+++ b/application/views/layouts/backend/backend_layout.php
@@ -0,0 +1,56 @@
+<?php
+/**
+ * @var string $page_title
+ * @var string $page_path
+ * @var array $active_menu
+ * @var array $privileges
+ */
+?>
+
+<!doctype html>
+<html lang="en">
+<head>
+    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <title><?= $page_title ?? lang('backend_section') ?> | Easy!Appointments</title>
+    <link rel="stylesheet" type="text/css" href="<?= asset_url('assets/vendor/bootstrap/bootstrap.min.css') ?>">
+    <link rel="stylesheet" type="text/css" href="<?= asset_url('assets/vendor/jquery-ui-dist/jquery-ui.min.css') ?>">
+    <link rel="stylesheet" type="text/css" href="<?= asset_url('assets/vendor/trumbowyg/trumbowyg.min.css') ?>">
+    <link rel="stylesheet" type="text/css" href="<?= asset_url('assets/vendor/select2/select2.min.css') ?>">
+    <link rel="stylesheet" type="text/css" href="<?= asset_url('assets/css/backend.css') ?>">
+    <link rel="stylesheet" type="text/css" href="<?= asset_url('assets/css/general.css') ?>">
+    <link rel="icon" type="image/x-icon" href="<?= asset_url('assets/img/favicon.ico') ?>">
+    <link rel="icon" sizes="192x192" href="<?= asset_url('assets/img/logo.png') ?>">
+
+    <script>
+        // Global JavaScript Variables - Used in all backend pages.
+        var availableLanguages = <?= json_encode(config('available_languages')) ?>;
+        var EALang = <?= json_encode($this->lang->language) ?>;
+    </script>
+
+    <script src="<?= asset_url('assets/vendor/jquery/jquery.min.js') ?>"></script>
+    <script src="<?= asset_url('assets/vendor/@popperjs-core/popper.min.js') ?>"></script>
+    <script src="<?= asset_url('assets/vendor/bootstrap/bootstrap.min.js') ?>"></script>
+    <script src="<?= asset_url('assets/vendor/tippy.js/tippy-bundle.umd.min.js') ?>"></script>
+    <script src="<?= asset_url('assets/vendor/jquery-ui-dist/jquery-ui.min.js') ?>"></script>
+    <script src="<?= asset_url('assets/vendor/jquery-ui-touch-punch/jquery.ui.touch-punch.min.js') ?>"></script>
+    <script src="<?= asset_url('assets/vendor/moment/moment.min.js') ?>"></script>
+    <script src="<?= asset_url('assets/vendor/moment-timezone/moment-timezone-with-data.min.js') ?>"></script>
+    <script src="<?= asset_url('assets/vendor/datejs/date.min.js') ?>"></script>
+    <script src="<?= asset_url('assets/vendor/trumbowyg/trumbowyg.min.js') ?>"></script>
+    <script src="<?= asset_url('assets/vendor/select2/select2.min.js') ?>"></script>
+    <script src="<?= asset_url('assets/vendor/@fortawesome-fontawesome-free/fontawesome.min.js') ?>"></script>
+    <script src="<?= asset_url('assets/vendor/@fortawesome-fontawesome-free/solid.min.js') ?>"></script>
+</head>
+<body>
+<script src="<?= asset_url('assets/js/backend.js') ?>"></script>
+<script src="<?= asset_url('assets/js/general_functions.js') ?>"></script>
+
+<?php require __DIR__ . '/backend_header.php' ?>
+
+<?php require $page_path ?>
+
+<?php require __DIR__ . '/backend_footer.php' ?>
+
+</body>
+</html>
diff --git a/application/views/backend/calendar.php b/application/views/pages/calendar/calendar_page.php
similarity index 92%
rename from application/views/backend/calendar.php
rename to application/views/pages/calendar/calendar_page.php
index 6a18f85b..2d5f1d4e 100755
--- a/application/views/backend/calendar.php
+++ b/application/views/pages/calendar/calendar_page.php
@@ -133,23 +133,16 @@
         </div>
     </div>
 
-    <div id="calendar"><!-- Dynamically Generated Content --></div>
+    <div id="calendar">
+        <!-- Dynamically Generated Content -->
+    </div>
 </div>
 
+<!-- Page Components -->
 
-<!-- MANAGE APPOINTMENT MODAL -->
-
-<?php require __DIR__ . '/../modals/manage_appointment_modal.php' ?>
-
-<!-- MANAGE UNAVAILABLE MODAL -->
-
-<?php require __DIR__ . '/../modals/manage_unavailable_modal.php' ?>
-
-<!-- SELECT GOOGLE CALENDAR MODAL -->
-
-<?php require __DIR__ . '/../modals/select_google_calendar_modal.php' ?>
-
-<!-- WORKING PLAN EXCEPTIONS MODAL -->
-
-<?php require __DIR__ . '/../modals/working_plan_exceptions_modal.php' ?>
+<?= component('manage_appointment_modal') ?>
+<?= component('manage_appointment_modal') ?>
+<?= component('manage_unavailable_modal') ?>
+<?= component('select_google_calendar_modal') ?>
+<?= component('working_plan_exceptions_modal') ?>
 
diff --git a/application/views/backend/customers.php b/application/views/pages/customers/customers_page.php
similarity index 100%
rename from application/views/backend/customers.php
rename to application/views/pages/customers/customers_page.php
diff --git a/application/views/backend/services.php b/application/views/pages/services/services_page.php
similarity index 100%
rename from application/views/backend/services.php
rename to application/views/pages/services/services_page.php
diff --git a/application/views/backend/settings.php b/application/views/pages/settings/settings_page.php
similarity index 100%
rename from application/views/backend/settings.php
rename to application/views/pages/settings/settings_page.php
diff --git a/application/views/backend/users.php b/application/views/pages/users/users_page.php
similarity index 99%
rename from application/views/backend/users.php
rename to application/views/pages/users/users_page.php
index aa7e3aaa..1ec5cc71 100755
--- a/application/views/backend/users.php
+++ b/application/views/pages/users/users_page.php
@@ -503,7 +503,6 @@
                             <div class="form-group">
                                 <label for="secretary-city">
                                     <?= lang('city') ?>
-
                                 </label>
                                 <input id="secretary-city" class="form-control" maxlength="256">
                             </div>
@@ -518,7 +517,6 @@
                             <div class="form-group">
                                 <label for="secretary-zip-code">
                                     <?= lang('zip_code') ?>
-
                                 </label>
                                 <input id="secretary-zip-code" class="form-control" maxlength="64">
                             </div>
@@ -726,7 +724,6 @@
                             <div class="form-group">
                                 <label for="admin-zip-code">
                                     <?= lang('zip_code') ?>
-
                                 </label>
                                 <input id="admin-zip-code" class="form-control" maxlength="64">
                             </div>
