diff --git a/README.md b/README.md
index 050e774..6aec5b0 100644
--- a/README.md
+++ b/README.md
@@ -20,6 +20,19 @@ Fociz is een compleet, modern webplatform gebouwd in **PHP 8 & MariaDB** voor da
 
 ---
 
+## 🚦 Omgevingsindicator (Dev vs Live)
+
+In de linkerbovenhoek van elk scherm bevindt zich een opvallende flashy badge met live radar-ping animatie:
+- **Development (Rood)**: Knippert rood met de tekst `DEVELOPMENT (DEV)` zodat u direct ziet dat u op de test/dev omgeving werkt.
+- **Live (Groen)**: Knippert groen met de tekst `LIVE (MAIN)` voor de productie-omgeving.
+
+### Hoe in te stellen per omgeving:
+In het bestand **`includes/env_badge.php`**:
+- **Op DEV**: `$environment = 'development';` *(staat standaard al zo ingesteld)*
+- **Op MAIN / LIVE**: `$environment = 'live';` *(of zet `APP_ENV="live"` in `.env`)*
+
+---
+
 ## 🚀 Kernmodules
 
 1. **Dagplanning & Focus (`/planner.php`)**:
diff --git a/auth/invite.php b/auth/invite.php
index c8d05f2..ed8d8d3 100644
--- a/auth/invite.php
+++ b/auth/invite.php
@@ -108,6 +108,8 @@ $pageTitle = "Fociz — Uitnodiging Accepteren";
 </head>
 <body class="min-h-screen flex items-center justify-center p-4 bg-gradient-to-br from-[#090d16] via-[#0f172a] to-[#090d16]">
 
+<?php require_once __DIR__ . '/../includes/env_badge.php'; ?>
+
 <div class="w-full max-w-lg bg-slate-900/90 border border-slate-800 rounded-2xl shadow-2xl backdrop-blur-xl p-8">
     <div class="text-center mb-8">
         <div class="inline-flex items-center justify-center w-14 h-14 rounded-2xl bg-emerald-500/10 border border-emerald-500/30 text-emerald-400 mb-3 shadow-lg shadow-emerald-500/10">
diff --git a/auth/login.php b/auth/login.php
index d0a697a..60e4328 100644
--- a/auth/login.php
+++ b/auth/login.php
@@ -121,6 +121,8 @@ $pageTitle = "Fociz — Inloggen";
 </head>
 <body class="min-h-screen flex items-center justify-center p-4 bg-gradient-to-br from-[#090d16] via-[#0f172a] to-[#090d16]">
 
+<?php require_once __DIR__ . '/../includes/env_badge.php'; ?>
+
 <div class="w-full max-w-md bg-slate-900/90 border border-slate-800 rounded-2xl shadow-2xl backdrop-blur-xl p-8">
     <!-- Header -->
     <div class="text-center mb-8">
diff --git a/auth/setup.php b/auth/setup.php
index 93caa89..a5b1ecd 100644
--- a/auth/setup.php
+++ b/auth/setup.php
@@ -92,6 +92,8 @@ $pageTitle = "Fociz — Eerste Initialisatie";
 </head>
 <body class="min-h-screen flex items-center justify-center p-4 bg-gradient-to-br from-[#090d16] via-[#0f172a] to-[#090d16]">
 
+<?php require_once __DIR__ . '/../includes/env_badge.php'; ?>
+
 <div class="w-full max-w-xl bg-slate-900/90 border border-slate-800 rounded-2xl shadow-2xl backdrop-blur-xl p-8">
     <!-- Header -->
     <div class="text-center mb-8">
diff --git a/includes/env_badge.php b/includes/env_badge.php
new file mode 100644
index 0000000..6e7fcd3
--- /dev/null
+++ b/includes/env_badge.php
@@ -0,0 +1,69 @@
+<?php
+/**
+ * =========================================================================
+ * FOCIZ OMGEVINGSINDICATOR (DEV VS MAIN/LIVE)
+ * =========================================================================
+ * 
+ * Dit bestandje bepaalt de flashy notificatie links bovenin het scherm.
+ * 
+ * - OP DE DEV OMGEVING:  $environment = 'development';  (Rood met 'Development' + radar ping)
+ * - OP DE MAIN OMGEVING: $environment = 'live';         (Groen met 'Live' + radar ping)
+ * 
+ * U kunt de waarde hieronder aanpassen, of instellen via APP_ENV in .env.
+ */
+
+// Bepaal de omgeving: 'development' of 'live' (of 'main')
+$environment = 'development'; // <-- ZET DIT OP DE MAIN SERVER OP 'live'
+
+// Optionele fallback als het in .env gedefinieerd is
+if (getenv('APP_ENV')) {
+    $envVal = strtolower(trim(getenv('APP_ENV')));
+    if (in_array($envVal, ['live', 'production', 'prod', 'main'])) {
+        $environment = 'live';
+    } elseif (in_array($envVal, ['dev', 'development', 'staging', 'test'])) {
+        $environment = 'development';
+    }
+}
+
+$isLive = in_array(strtolower($environment), ['live', 'production', 'prod', 'main']);
+?>
+
+<!-- FLASHY OMGEVINGSINDICATOR LINKS BOVENIN -->
+<div id="fociz-env-badge" class="fixed top-2.5 left-2.5 z-[9999] pointer-events-auto select-none transition-all duration-300 hover:scale-105">
+    <?php if ($isLive): ?>
+        <!-- LIVE OMGEVING (GROEN) -->
+        <div class="flex items-center space-x-2 px-3 py-1 rounded-full bg-slate-950/95 border border-emerald-500/70 shadow-lg shadow-emerald-500/25 backdrop-blur-md group">
+            <!-- Pulsing Green Radar Indicator -->
+            <span class="relative flex h-2.5 w-2.5">
+                <span class="animate-ping absolute inline-flex h-full w-full rounded-full bg-emerald-400 opacity-80"></span>
+                <span class="relative inline-flex rounded-full h-2.5 w-2.5 bg-emerald-500 shadow-sm shadow-emerald-500"></span>
+            </span>
+
+            <span class="text-[11px] font-black tracking-wider text-emerald-400 uppercase flex items-center space-x-1">
+                <span>Live</span>
+            </span>
+
+            <span class="hidden sm:inline-block text-[9px] font-mono font-bold px-1.5 py-0.2 rounded bg-emerald-500/20 text-emerald-300 border border-emerald-500/30">
+                MAIN
+            </span>
+        </div>
+    <?php else: ?>
+        <!-- DEVELOPMENT OMGEVING (ROOD) -->
+        <div class="flex items-center space-x-2 px-3 py-1 rounded-full bg-slate-950/95 border border-red-500/70 shadow-lg shadow-red-500/30 backdrop-blur-md group">
+            <!-- Pulsing Red Radar Indicator -->
+            <span class="relative flex h-2.5 w-2.5">
+                <span class="animate-ping absolute inline-flex h-full w-full rounded-full bg-red-400 opacity-80"></span>
+                <span class="relative inline-flex rounded-full h-2.5 w-2.5 bg-red-500 shadow-sm shadow-red-500"></span>
+            </span>
+
+            <span class="text-[11px] font-black tracking-wider text-red-400 uppercase flex items-center space-x-1">
+                <span>Development</span>
+            </span>
+
+            <span class="hidden sm:inline-block text-[9px] font-mono font-bold px-1.5 py-0.2 rounded bg-red-500/20 text-red-300 border border-red-500/30">
+                DEV
+            </span>
+        </div>
+    <?php endif; ?>
+</div>
+
diff --git a/includes/header.php b/includes/header.php
index 1a2e3d7..ebc807a 100644
--- a/includes/header.php
+++ b/includes/header.php
@@ -45,15 +45,19 @@ $currentPage = basename($_SERVER['PHP_SELF']);
         ::-webkit-scrollbar-thumb { background: #334155; border-radius: 4px; }
         ::-webkit-scrollbar-thumb:hover { background: #475569; }
     </style>
-</head>
 <body class="min-h-screen flex flex-col antialiased selection:bg-emerald-500 selection:text-white">
 
+<?php 
+// Include flashy omgevingsindicator (Dev = Rood, Live = Groen)
+require_once __DIR__ . '/env_badge.php'; 
+?>
+
 <?php if ($currentUser): ?>
 <header class="sticky top-0 z-40 bg-[#0c121e]/90 backdrop-blur-md border-b border-slate-800/80">
     <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
         <div class="flex items-center justify-between h-16">
-            <!-- Brand Logo -->
-            <div class="flex items-center space-x-6">
+            <!-- Brand Logo (met linker padding zodat het badge vrij staat) -->
+            <div class="flex items-center space-x-6 pl-28 sm:pl-36">
                 <a href="/planner.php" class="flex items-center space-x-2.5 group">
                     <div class="w-9 h-9 rounded-xl bg-gradient-to-tr from-emerald-600 to-teal-400 flex items-center justify-center text-slate-950 font-black text-lg shadow-md shadow-emerald-500/20 group-hover:scale-105 transition">
                         F