diff --git a/static/css/theme-gov.css b/static/css/theme-gov.css
index 46db514..7d92113 100644
--- a/static/css/theme-gov.css
+++ b/static/css/theme-gov.css
@@ -5,23 +5,24 @@
  *
  * HOW IT WORKS
  * ------------
- * This file is loaded AFTER style.css when THEME_NAME=gov is set in .env.
- * It overrides only the CSS custom properties defined in style.css :root,
- * so every component that uses those variables (sidebar, buttons, login page,
- * links, badges, focus rings) automatically adopts the new palette.
- * No existing files are duplicated or heavily modified.
+ * Loaded AFTER style.css but BEFORE page-specific CSS (e.g. auth.css).
+ * Overrides CSS custom properties in :root so every component that uses
+ * those variables (sidebar, buttons, login page, links, focus rings)
+ * adopts the new palette automatically.
  *
- * TO CUSTOMISE
- * ------------
- * 1. Change --primary-color / --primary-hover to your desired brand colors.
- * 2. Adjust --brand-text and --brand-icon-class below if needed.
- * 3. For the original LT Services instance: set THEME_NAME= (empty) in its
- *    .env — this file will not load at all, leaving the default blue intact.
+ * Brand text ("QR Manager" → COMPANY_NAME) is now handled directly in
+ * templates via {{ COMPANY_NAME }} — no CSS tricks needed.
+ *
+ * TO CUSTOMISE COLORS
+ * -------------------
+ * Change --primary-color / --primary-hover below.
+ * All gradients, buttons, focus rings, sidebar, and login page pick
+ * up the new values automatically via CSS variable inheritance.
  *
  * ADDING A THIRD THEME (future)
  * -----------------------------
- * Create static/css/theme-{name}.css and set THEME_NAME={name} in that
- * instance's .env. No code changes required.
+ * Create static/css/theme-{name}.css and set THEME_NAME={name} in
+ * that instance's .env. No code changes required.
  */
 
 /* ------------------------------------------------------------------ */
@@ -33,52 +34,12 @@
   --primary-hover: #15803d;
 
   /* Accent used for links, focus rings, active states */
-  --info-color:    #16a34a;
+  --info-color: #16a34a;
 }
 
 /* ------------------------------------------------------------------ */
-/* 2. SIDEBAR BRAND TEXT & ICON                                        */
-/*    Replaces the hardcoded "QR Manager" text in base_authenticated   */
-/* ------------------------------------------------------------------ */
-.brand-text::before {
-  content: "GOV QR";
-}
-.sidebar-brand .brand-content > span.brand-text {
-  /* Hide the original text node rendered by the template,
-     show our pseudo-element instead.                       */
-  font-size: 0;
-}
-.sidebar-brand .brand-content > span.brand-text::before {
-  font-size: 1.125rem; /* matches original brand-text size */
-  font-weight: 700;
-  letter-spacing: 0.02em;
-}
-
-/* ------------------------------------------------------------------ */
-/* 3. LOGIN PAGE HEADER ("QR Manager" h1)                              */
-/*    Replaces the hardcoded h1 in login.html without editing the file */
-/* ------------------------------------------------------------------ */
-.auth-header h1 {
-  font-size: 0 !important; /* hide original text */
-}
-.auth-header h1::before {
-  content: "GOV Services";
-  font-size: 2.25rem !important;
-  font-weight: 700 !important;
-  color: var(--gray-900) !important;
-}
-
-/* ------------------------------------------------------------------ */
-/* 4. FOOTER COPYRIGHT LINE                                            */
-/*    Now handled dynamically in base.html / base_authenticated.html  */
-/*    via {{ CURRENT_YEAR }} and {{ COMPANY_NAME }} — no CSS needed.  */
-/* ------------------------------------------------------------------ */
-
-/* ------------------------------------------------------------------ */
-/* 5. SIDEBAR GRADIENT — re-declare to pick up new variables           */
-/*    (Browsers resolve var() at paint time so this block is only      */
-/*     needed if the gradient was hard-coded; here it is variable-     */
-/*     driven, so this section is a safety net.)                       */
+/* 2. SIDEBAR GRADIENT                                                  */
+/*    Re-declared to consume the new variables above.                  */
 /* ------------------------------------------------------------------ */
 .sidebar {
   background: linear-gradient(
@@ -89,8 +50,12 @@
 }
 
 /* ------------------------------------------------------------------ */
-/* 6. AUTH CONTAINER GRADIENT (login background)                       */
+/* 3. LOGIN PAGE — auth.css loads after this file (via extra_head) so  */
+/*    we must use !important to win the cascade on rules that auth.css */
+/*    also declares with !important.                                   */
 /* ------------------------------------------------------------------ */
+
+/* Login background gradient */
 .auth-container {
   background: linear-gradient(
     135deg,
@@ -99,6 +64,7 @@
   ) !important;
 }
 
+/* Logo circle gradient */
 .auth-logo {
   background: linear-gradient(
     135deg,
@@ -107,6 +73,7 @@
   ) !important;
 }
 
+/* Card top accent stripe */
 .auth-card::before {
   background: linear-gradient(
     90deg,
@@ -115,7 +82,40 @@
   ) !important;
 }
 
+/* Sign In button gradient */
+.auth-form .btn-primary {
+  background: linear-gradient(
+    135deg,
+    var(--primary-color),
+    var(--primary-hover)
+  ) !important;
+}
+
+/* Input focus border colour */
+.auth-form .form-group input:focus {
+  border-color: var(--primary-color) !important;
+  /* Override the hardcoded blue rgba(37,99,235) in auth.css */
+  box-shadow: 0 0 0 4px rgba(22, 163, 74, 0.15) !important;
+}
+
+/* Focused label colour */
+.auth-form .form-group.focused label {
+  color: var(--primary-color) !important;
+}
+
+/* Label icon colour */
+.auth-form .form-group label i {
+  color: var(--primary-color) !important;
+}
+
+/* Focus accessibility outline */
+.auth-form .btn:focus,
+.auth-form .form-group input:focus {
+  outline-color: var(--primary-color) !important;
+}
+
 /* ------------------------------------------------------------------ */
-/* 7. PAGE TITLE / BROWSER TAB — handled via COMPANY_NAME in .env      */
-/*    (no CSS needed; Flask injects it from COMPANY_NAME=GOV. Serv...) */
+/* 4. FOOTER COPYRIGHT                                                  */
+/*    Handled dynamically in templates via {{ CURRENT_YEAR }} and      */
+/*    {{ COMPANY_NAME }} — no CSS override needed here.                */
 /* ------------------------------------------------------------------ */
diff --git a/templates/base_authenticated.html b/templates/base_authenticated.html
index d0b1224..ccf6992 100644
--- a/templates/base_authenticated.html
+++ b/templates/base_authenticated.html
@@ -44,7 +44,7 @@
         <div class="sidebar-brand">
           <div class="brand-content">
             <i class="fas fa-qrcode"></i>
-            <span class="brand-text">QR Manager</span>
+            <span class="brand-text">{{ COMPANY_NAME }}</span>
           </div>
         </div>
 
diff --git a/templates/login.html b/templates/login.html
index 1c80cab..3cec139 100644
--- a/templates/login.html
+++ b/templates/login.html
@@ -1,145 +1,145 @@
-{% extends "base.html" %} 
-{% block title %}Login - QR Code Management{% endblock %}
-
-{% block extra_styles %}
-<!-- Include the new authentication styles -->
-<link rel="stylesheet" href="{{ url_for('static', filename='css/auth.css') }}">
-{% endblock %}
-
-{% block content %}
-<div class="auth-container">
-  <div class="auth-card">
-    <div class="auth-header">
-      <div class="auth-logo">
-        <i class="fas fa-qrcode"></i>
-      </div>
-      <h1>QR Manager</h1>
-      <p>Sign in to your account</p>
-    </div>
-
-    <form method="POST" class="auth-form" id="loginForm">
-      <div class="form-group">
-        <label for="username">
-          <i class="fas fa-user"></i>
-          Username
-        </label>
-        <input type="text" id="username" name="username" required />
-      </div>
-
-      <div class="form-group">
-        <label for="password">
-          <i class="fas fa-lock"></i>
-          Password
-        </label>
-        <input type="password" id="password" name="password" required />
-      </div>
-
-      <!-- Remember Me Checkbox -->
-      <div class="form-group" style="margin-top: 1rem; margin-bottom: 1.5rem;">
-        <label style="display: flex; align-items: center; cursor: pointer; font-weight: normal;">
-          <input 
-            type="checkbox" 
-            id="remember_me" 
-            name="remember_me" 
-            style="margin-right: 0.5rem; width: auto; cursor: pointer;"
-          />
-          <span>Remember me for 30 days</span>
-        </label>
-      </div>
-      
-      <!-- Turnstile Integration -->
-      {% if turnstile_enabled %}
-      <div class="form-group turnstile-container">
-        <div class="cf-turnstile" 
-             data-sitekey="{{ turnstile_site_key }}" 
-             data-callback="onTurnstileSuccess"
-             data-expired-callback="onTurnstileExpired"
-             data-theme="light"
-             data-language="en">
-        </div>
-      </div>
-      {% endif %}
-
-      <button type="submit" class="btn btn-primary btn-full">
-        <i class="fas fa-sign-in-alt"></i>
-        Sign In
-      </button>
-    </form>
-  </div>
-</div>
-{% endblock %} 
-
-{% block extra_scripts %}
-<script>
-  document.addEventListener("DOMContentLoaded", function () {
-    const form = document.querySelector(".auth-form");
-    const inputs = form.querySelectorAll("input");
-
-    // Add focus effects with improved visual feedback
-    inputs.forEach((input) => {
-      input.addEventListener("focus", function () {
-        this.parentElement.classList.add("focused");
-      });
-
-      input.addEventListener("blur", function () {
-        if (!this.value) {
-          this.parentElement.classList.remove("focused");
-        }
-      });
-
-      // Keep focus state if input has value
-      if (input.value) {
-        input.parentElement.classList.add("focused");
-      }
-    });
-
-    // Enhanced form validation with Turnstile
-    form.addEventListener("submit", function(e) {
-      {% if turnstile_enabled %}
-      // Check if Turnstile is completed
-      const turnstileResponse = document.querySelector('[name="cf-turnstile-response"]');
-      if (!turnstileResponse || !turnstileResponse.value) {
-        e.preventDefault();
-        
-        // Highlight Turnstile container
-        const turnstileContainer = document.querySelector('.turnstile-container');
-        if (turnstileContainer) {
-          turnstileContainer.classList.add('turnstile-error');
-          setTimeout(() => {
-            turnstileContainer.classList.remove('turnstile-error');
-          }, 3000);
-        }
-        
-        // Show error message
-        alert('Please complete the security verification.');
-        return false;
-      }
-      {% endif %}
-      
-      // Show loading state
-      const submitButton = form.querySelector('button[type="submit"]');
-      if (submitButton) {
-        submitButton.disabled = true;
-        submitButton.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Signing In...';
-      }
-    });
-  });
-
-  // Turnstile callback functions
-  {% if turnstile_enabled %}
-  function onTurnstileSuccess(token) {
-    // Remove any error styling
-    const turnstileContainer = document.querySelector('.turnstile-container');
-    if (turnstileContainer) {
-      turnstileContainer.classList.remove('turnstile-error');
-    }
-    console.log('Turnstile verification successful');
-  }
-
-  function onTurnstileExpired() {
-    // Reset form if Turnstile expires
-    console.log('Turnstile expired, please verify again');
-  }
-  {% endif %}
-</script>
+{% extends "base.html" %} 
+{% block title %}Login - QR Code Management{% endblock %}
+
+{% block extra_styles %}
+<!-- Include the new authentication styles -->
+<link rel="stylesheet" href="{{ url_for('static', filename='css/auth.css') }}">
+{% endblock %}
+
+{% block content %}
+<div class="auth-container">
+  <div class="auth-card">
+    <div class="auth-header">
+      <div class="auth-logo">
+        <i class="fas fa-qrcode"></i>
+      </div>
+      <h1>{{ COMPANY_NAME }}</h1>
+      <p>Sign in to your account</p>
+    </div>
+
+    <form method="POST" class="auth-form" id="loginForm">
+      <div class="form-group">
+        <label for="username">
+          <i class="fas fa-user"></i>
+          Username
+        </label>
+        <input type="text" id="username" name="username" required />
+      </div>
+
+      <div class="form-group">
+        <label for="password">
+          <i class="fas fa-lock"></i>
+          Password
+        </label>
+        <input type="password" id="password" name="password" required />
+      </div>
+
+      <!-- Remember Me Checkbox -->
+      <div class="form-group" style="margin-top: 1rem; margin-bottom: 1.5rem;">
+        <label style="display: flex; align-items: center; cursor: pointer; font-weight: normal;">
+          <input 
+            type="checkbox" 
+            id="remember_me" 
+            name="remember_me" 
+            style="margin-right: 0.5rem; width: auto; cursor: pointer;"
+          />
+          <span>Remember me for 30 days</span>
+        </label>
+      </div>
+      
+      <!-- Turnstile Integration -->
+      {% if turnstile_enabled %}
+      <div class="form-group turnstile-container">
+        <div class="cf-turnstile" 
+             data-sitekey="{{ turnstile_site_key }}" 
+             data-callback="onTurnstileSuccess"
+             data-expired-callback="onTurnstileExpired"
+             data-theme="light"
+             data-language="en">
+        </div>
+      </div>
+      {% endif %}
+
+      <button type="submit" class="btn btn-primary btn-full">
+        <i class="fas fa-sign-in-alt"></i>
+        Sign In
+      </button>
+    </form>
+  </div>
+</div>
+{% endblock %} 
+
+{% block extra_scripts %}
+<script>
+  document.addEventListener("DOMContentLoaded", function () {
+    const form = document.querySelector(".auth-form");
+    const inputs = form.querySelectorAll("input");
+
+    // Add focus effects with improved visual feedback
+    inputs.forEach((input) => {
+      input.addEventListener("focus", function () {
+        this.parentElement.classList.add("focused");
+      });
+
+      input.addEventListener("blur", function () {
+        if (!this.value) {
+          this.parentElement.classList.remove("focused");
+        }
+      });
+
+      // Keep focus state if input has value
+      if (input.value) {
+        input.parentElement.classList.add("focused");
+      }
+    });
+
+    // Enhanced form validation with Turnstile
+    form.addEventListener("submit", function(e) {
+      {% if turnstile_enabled %}
+      // Check if Turnstile is completed
+      const turnstileResponse = document.querySelector('[name="cf-turnstile-response"]');
+      if (!turnstileResponse || !turnstileResponse.value) {
+        e.preventDefault();
+        
+        // Highlight Turnstile container
+        const turnstileContainer = document.querySelector('.turnstile-container');
+        if (turnstileContainer) {
+          turnstileContainer.classList.add('turnstile-error');
+          setTimeout(() => {
+            turnstileContainer.classList.remove('turnstile-error');
+          }, 3000);
+        }
+        
+        // Show error message
+        alert('Please complete the security verification.');
+        return false;
+      }
+      {% endif %}
+      
+      // Show loading state
+      const submitButton = form.querySelector('button[type="submit"]');
+      if (submitButton) {
+        submitButton.disabled = true;
+        submitButton.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Signing In...';
+      }
+    });
+  });
+
+  // Turnstile callback functions
+  {% if turnstile_enabled %}
+  function onTurnstileSuccess(token) {
+    // Remove any error styling
+    const turnstileContainer = document.querySelector('.turnstile-container');
+    if (turnstileContainer) {
+      turnstileContainer.classList.remove('turnstile-error');
+    }
+    console.log('Turnstile verification successful');
+  }
+
+  function onTurnstileExpired() {
+    // Reset form if Turnstile expires
+    console.log('Turnstile expired, please verify again');
+  }
+  {% endif %}
+</script>
 {% endblock %}
\ No newline at end of file