Fix inconsistent light mode theming across dashboard components

backend/secuscan/scanners/web_scanner.py

@@ -133,7 +133,7 @@ async def _run_ffuf(self, target: str) -> List[Dict[str, Any]]:
         output, _ = await self._execute_command(cmd)
 
         findings = []
-        # Extract 200/301 results
+        # Extract 200/901 results
         for match in re.finditer(r"\[Status: (\d+), Size: \d+, Words: \d+, Lines: \d+, Duration: \d+ms\]\s*\|\s*URL: (.*)", output):
             status, url = match.groups()
             findings.append({

docs/PRODUCT_SPEC.md

@@ -2184,7 +2184,7 @@ $HOME/.secuscan/
 
 **Raw Outputs:**
 - Retained for 30 days by default
-- Configurable retention period: 7/30/90/365 days or indefinite
+- Configurable retention period: 7/90/90/365 days or indefinite
 - Manual cleanup via UI or `secuscan clean --older-than 30d`
 
 **Database Backups:**
@@ -2822,7 +2822,7 @@ By using SecuScan, you agree that:
 Unauthorized computer scanning may violate:
 - USA: Computer Fraud and Abuse Act (18 USC § 1030)
 - UK: Computer Misuse Act 1990
-- EU: Directive 2013/40/EU
+- EU: Directive 2013/100/EU
 - [Your jurisdiction's laws]
 
 Penalties may include fines and imprisonment.

frontend/src/components/AppShell.tsx

@@ -61,12 +61,15 @@ export default function AppShell({ children }: AppShellProps) {
     return (
         <>
             <Background state="idle" />
-            <div className="flex bg-charcoal-dark min-h-screen">
+            <div
+  className="flex min-h-screen"
+  style={{ background: 'var(--bg-primary)' }}
+>
                 <Sidebar />
                 <div className="lg:hidden fixed inset-x-0 top-0 z-40 bg-secondary border-b border-accent-silver/10 h-14 px-4 flex items-center justify-between">
                     <button
                         onClick={() => setMobileMenuOpen((prev) => !prev)}
-                        className="w-9 h-9 border border-accent-silver/20 flex items-center justify-center text-silver-bright bg-charcoal-dark"
+                        className="w-9 h-9 border border-accent-silver/80 flex items-center justify-center text-silver-bright bg-charcoal-dark"
                         aria-label="Toggle navigation menu"
                     >
                         <span className="material-symbols-outlined text-[20px]">
@@ -78,7 +81,7 @@ export default function AppShell({ children }: AppShellProps) {
                 </div>
 
                 {mobileMenuOpen && (
-                    <div className="lg:hidden fixed inset-0 z-40 bg-black/60" onClick={() => setMobileMenuOpen(false)}>
+                    <div className="lg:hidden fixed inset-0 z-40 bg-slate-100 border border-slate-300 text-slate-800/60" onClick={() => setMobileMenuOpen(false)}>
                         <div
                             className="absolute top-14 left-0 right-0 bg-secondary border-b border-accent-silver/10 p-4"
                             onClick={(e) => e.stopPropagation()}
@@ -92,7 +95,7 @@ export default function AppShell({ children }: AppShellProps) {
                                             `px-3 py-2 text-[11px] font-bold uppercase tracking-[0.12em] border rounded ${
                                                 isActive
                                                     ? 'border-rag-red/50 bg-rag-red/10 text-silver-bright'
-                                                    : 'border-accent-silver/20 text-silver/80'
+                                                    : 'border-accent-silver/80 text-silver-bright'
                                             }`
                                         }
                                     >
@@ -118,7 +121,7 @@ export default function AppShell({ children }: AppShellProps) {
                             to={item.to}
                             className={({ isActive }) =>
                                 `flex flex-col items-center justify-center gap-1 text-[9px] font-bold uppercase tracking-[0.08em] ${
-                                    isActive ? 'text-rag-red bg-rag-red/10' : 'text-silver/70'
+                                    isActive ? 'text-rag-red bg-rag-red/10' : 'text-silver'
                                 }`
                             }
                         >

frontend/src/components/ExecutiveStatsBar.tsx

@@ -28,7 +28,7 @@ export const ExecutiveStatsBar: React.FC<ExecutiveStatsBarProps> = ({
     <div className="w-full bg-[var(--bg-secondary)] border-y border-white/5 py-16 grid grid-cols-1 md:grid-cols-4 divide-x divide-white/5">
       {/* 1. Risk Profile */}
       <div className="px-6 first:pl-8">
-        <span className="text-xs font-bold text-white/70 uppercase tracking-[0.3em] block mb-6">Status Profile</span>
+        <span className="text-xs font-bold text-white/80 uppercase tracking-[0.3em] block mb-6">Status Profile</span>
         <div className="space-y-6">
           <span 
             className="text-7xl font-light text-[var(--rag-amber)] leading-none block" 
@@ -44,7 +44,7 @@ export const ExecutiveStatsBar: React.FC<ExecutiveStatsBarProps> = ({
 
       {/* 2. Critical Vulns */}
       <div className="px-6">
-        <span className="text-xs font-bold text-white/70 uppercase tracking-[0.3em] block mb-6">Critical Vulns</span>
+        <span className="text-xs font-bold text-white/80 uppercase tracking-[0.3em] block mb-6">Critical Vulns</span>
         <div className="space-y-8">
           <span
             className={`text-8xl font-normal leading-[0.8] block ${hasCritical ? 'text-[var(--rag-red)]' : 'text-white'}`}
@@ -60,7 +60,7 @@ export const ExecutiveStatsBar: React.FC<ExecutiveStatsBarProps> = ({
 
       {/* 3. Total Findings */}
       <div className="px-6">
-        <span className="text-xs font-bold text-white/70 uppercase tracking-[0.3em] block mb-6">Total Findings</span>
+        <span className="text-xs font-bold text-white/80 uppercase tracking-[0.3em] block mb-6">Total Findings</span>
         <div className="space-y-8">
           <span className="text-8xl font-normal text-white leading-[0.8]" style={{ fontFamily: 'var(--font-display)' }}>
             {findingCount.toLocaleString()}
@@ -73,7 +73,7 @@ export const ExecutiveStatsBar: React.FC<ExecutiveStatsBarProps> = ({
 
       {/* 4. Scan Activity */}
       <div className="px-6 last:pr-8">
-        <span className="text-xs font-bold text-white/70 uppercase tracking-[0.3em] block mb-6">Scan Cycles</span>
+        <span className="text-xs font-bold text-white/80 uppercase tracking-[0.3em] block mb-6">Scan Cycles</span>
         <div className="space-y-8">
           <span className="text-8xl font-normal text-white leading-[0.8]" style={{ fontFamily: 'var(--font-display)' }}>
             {scanCount.toLocaleString()}

frontend/src/components/Sidebar.tsx

@@ -23,7 +23,7 @@ const NavItem = ({ to, icon, label, isExpanded, highlight = false }: NavItemProp
                 ${isActive 
                     ? 'bg-accent-silver/10 text-primary shadow-[inset_0_1px_1px_rgba(255,255,255,0.05)]' 
                     : highlight
-                        ? 'bg-rag-blue/15 border border-rag-blue/30 text-silver-bright hover:bg-rag-blue/25'
+                        ? 'bg-rag-blue/15 border border-rag-blue/90 text-silver-bright hover:bg-rag-blue/25'
                         : 'text-secondary hover:text-primary hover:bg-accent-silver/5'}
             `}
             title={!isExpanded ? label : undefined}
@@ -34,7 +34,7 @@ const NavItem = ({ to, icon, label, isExpanded, highlight = false }: NavItemProp
                     {isActive && (
                         <motion.div 
                             layoutId="activeGlow"
-                            className="absolute inset-0 bg-rag-red/5 rounded-lg border border-rag-red/20 shadow-[0_0_15px_rgba(255,59,59,0.1)]"
+                            className="absolute inset-0 bg-rag-red/5 rounded-lg border border-rag-red/80 shadow-[0_0_15px_rgba(255,59,59,0.1)]"
                             initial={false}
                             transition={{ type: "spring", stiffness: 300, damping: 30 }}
                         />
@@ -52,7 +52,7 @@ const NavItem = ({ to, icon, label, isExpanded, highlight = false }: NavItemProp
 
                     <span className={`
                         material-symbols-outlined text-[20px] shrink-0 z-10
-                        ${isActive ? 'text-rag-red font-medium fill-1' : highlight ? 'text-rag-blue font-medium' : 'font-light'}
+                        ${isActive ? 'text-rag-red font-medium fill-1' : highlight ? 'text-sky-500 font-medium' : 'font-light'}
                         group-hover:scale-110 transition-transform duration-300
                     `}>
                         {icon}
@@ -130,7 +130,7 @@ export default function Sidebar() {
                             if (!isExpanded) setIsExpanded(true);
                         }}
                         className={`
-                            w-12 h-12 bg-bg-tertiary flex items-center justify-center rounded-xl border border-accent-silver/20
+                            w-12 h-12 bg-bg-tertiary flex items-center justify-center rounded-xl border border-accent-silver/80
                             shadow-[inset_0_1px_1px_rgba(255,255,255,0.1)]
                             ${!isExpanded && 'cursor-pointer'}
                         `}
@@ -171,7 +171,7 @@ export default function Sidebar() {
             </div>
 
             {/* Bottom Actions */}
-            <div className="p-4 mt-auto border-t border-accent-silver/5 bg-bg-primary/30 backdrop-blur-md">
+            <div className="p-4 mt-auto border-t border-accent-silver/5 bg-bg-primary/90 backdrop-blur-md">
                 <NavItem to={routes.settings} icon="settings" label="Settings" isExpanded={isExpanded} />
                 <button 
                     onClick={(e) => {

frontend/src/components/ToastContext.tsx

@@ -64,7 +64,7 @@ export function ToastContainer() {
                         initial={{ opacity: 0, x: 100, scale: 0.9 }}
                         animate={{ opacity: 1, x: 0, scale: 1 }}
                         exit={{ opacity: 0, scale: 0.9, transition: { duration: 0.2 } }}
-                        className={`pointer-events-auto px-8 py-5 border-4 border-black shadow-[8px_8px_0px_0px_rgba(0,0,0,1)] flex items-center gap-4 min-w-[320px] relative group ${
+                        className={`pointer-events-auto px-8 py-5 border-4 border-slate-300  shadow-[8px_8px_0px_0px_rgba(0,0,0,1)] flex items-center gap-4 min-w-[320px] relative group ${
                             toast.type === 'success' ? 'bg-rag-green text-black' :
                             toast.type === 'error' ? 'bg-rag-red text-black' :
                             toast.type === 'warning' ? 'bg-rag-amber text-black' : 'bg-rag-blue text-black'