Bugfixes

frontend/src/components/ProfielPopup.jsx

@@ -2,8 +2,6 @@ import { useState } from "react";
 import { useApp } from "../context/AppContext.jsx";
 import { RED } from "../constants/index.js";
 
-const TEAL = "linear-gradient(135deg, #7c3aed, #a855f7)";
-const TEAL_SHADOW = "0 4px 14px rgba(124,58,237,0.4)";
 
 function initials(naam = "") {
   const parts = naam.trim().split(/\s+/);
@@ -149,7 +147,7 @@ export default function ProfielPopup({ onClose }) {
             <div style={{ display: "flex", flexDirection: "column", alignItems: "center", padding: "24px 18px 20px", gap: 6 }}>
               <div style={{
                 width: 72, height: 72, borderRadius: "50%", overflow: "hidden",
-                background: avatar ? "transparent" : TEAL,
+                background: avatar ? "transparent" : T.accentGradient,
                 display: "flex", alignItems: "center", justifyContent: "center",
                 fontSize: 24, fontWeight: 800, color: "#fff",
                 boxShadow: "0 0 20px rgba(124,58,237,0.4)", marginBottom: 4,
@@ -163,10 +161,10 @@ export default function ProfielPopup({ onClose }) {
               <div style={{ fontSize: 13, color: T.muted }}>{currentUser?.email}</div>
               <button onClick={() => setView("profiel")} style={{
                 marginTop: 8, padding: "9px 24px",
-                background: TEAL,
+                background: T.accentGradient,
                 border: "none", borderRadius: 10, color: "#fff",
                 fontWeight: 700, fontSize: 13, cursor: "pointer",
-                boxShadow: TEAL_SHADOW,
+                boxShadow: T.cardShadow,
               }}>Profiel bewerken</button>
             </div>
 
@@ -189,7 +187,7 @@ export default function ProfielPopup({ onClose }) {
                 <label style={{ cursor: "pointer", position: "relative", display: "block" }} title="Klik om foto te uploaden">
                   <div style={{
                     width: 64, height: 64, borderRadius: "50%", overflow: "hidden",
-                    background: avatar ? "transparent" : TEAL,
+                    background: avatar ? "transparent" : T.accentGradient,
                     display: "flex", alignItems: "center", justifyContent: "center",
                     fontSize: 20, fontWeight: 800, color: "#fff",
                   }}>
@@ -229,7 +227,7 @@ export default function ProfielPopup({ onClose }) {
               {profielErr && <div style={{ fontSize: 12, color: RED }}>{profielErr}</div>}
               {profielOk  && <div style={{ fontSize: 12, color: "#10b981" }}>Profiel opgeslagen.</div>}
               <button onClick={saveProfiel} disabled={profielBusy} style={{
-                padding: "11px", background: TEAL,
+                padding: "11px", background: T.accentGradient,
                 border: "none", borderRadius: 10, color: "#fff", fontWeight: 700,
                 fontSize: 13, cursor: profielBusy ? "default" : "pointer", opacity: profielBusy ? 0.7 : 1,
               }}>{profielBusy ? "Opslaan…" : "Opslaan"}</button>
@@ -252,7 +250,7 @@ export default function ProfielPopup({ onClose }) {
               {pwErr && <div style={{ fontSize: 12, color: RED }}>{pwErr}</div>}
               {pwOk  && <div style={{ fontSize: 12, color: "#10b981" }}>Wachtwoord gewijzigd.</div>}
               <button onClick={saveWachtwoord} disabled={pwBusy} style={{
-                padding: "11px", background: TEAL,
+                padding: "11px", background: T.accentGradient,
                 border: "none", borderRadius: 10, color: "#fff", fontWeight: 700,
                 fontSize: 13, cursor: pwBusy ? "default" : "pointer", opacity: pwBusy ? 0.7 : 1,
               }}>{pwBusy ? "Opslaan…" : "Opslaan"}</button>