create-steve-rogers 1.0.0 → 1.0.2

package/apps/SFMS/backend/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "sfms-backend",
+  "version": "1.0.0",
+  "description": "SFMS API — Express + MongoDB",
+  "type": "module",
+  "main": "src/server.js",
+  "scripts": {
+    "start": "node src/server.js",
+    "dev": "nodemon src/server.js"
+  },
+  "engines": {
+    "node": ">=18"
+  },
+  "dependencies": {
+    "bcryptjs": "^2.4.3",
+    "cors": "^2.8.5",
+    "dotenv": "^16.4.5",
+    "express": "^4.21.0",
+    "jsonwebtoken": "^9.0.2",
+    "mongoose": "^8.7.0",
+    "nodemon": "^3.1.14"
+  }
+}

package/apps/SFMS/backend/src/config/database.js

@@ -0,0 +1,7 @@
+import mongoose from 'mongoose';
+
+export async function connectMongo(uri) {
+  mongoose.set('strictQuery', true);
+  await mongoose.connect(uri);
+  return mongoose.connection;
+}

package/apps/SFMS/backend/src/config/env.js

@@ -0,0 +1,35 @@
+/** Central env with fallbacks (||) so missing vars degrade to safe defaults where possible. */
+
+const DEFAULT_BACKEND_PORT = 5000;
+
+function parsePort(raw, fallback) {
+  const n = Number(raw);
+  return Number.isFinite(n) && n > 0 ? n : fallback;
+}
+
+export const env = {
+  port: parsePort(
+    process.env.PORT || process.env.SFMS_BACKEND_PORT,
+    DEFAULT_BACKEND_PORT
+  ),
+  mongodbUri:
+    process.env.MONGODB_URI?.trim() ||
+    process.env.MONGO_URL?.trim() ||
+    process.env.DATABASE_URL?.trim() ||
+    '',
+  jwtSecret:
+    process.env.JWT_SECRET?.trim() ||
+    process.env.JWT_INGUFU?.trim() ||
+    '',
+  nodeEnv: process.env.NODE_ENV || 'development',
+};
+
+export function requireMongoUri() {
+  if (!env.mongodbUri) {
+    console.error(
+      'Missing MongoDB connection string. Set MONGODB_URI (or MONGO_URL / DATABASE_URL) in .env'
+    );
+    process.exit(1);
+  }
+  return env.mongodbUri;
+}

package/apps/SFMS/backend/src/middleware/authMiddleware.js

@@ -0,0 +1,32 @@
+import jwt from 'jsonwebtoken';
+import { env } from '../config/env.js';
+import { User } from '../models/User.js';
+
+function jwtSecret() {
+  return env.jwtSecret;
+}
+
+/** Validates Bearer JWT and attaches req.user */
+export async function protect(req, res, next) {
+  const header = req.headers.authorization;
+  const token = header?.startsWith('Bearer ') ? header.slice(7) : null;
+
+  if (!token) {
+    return res.status(401).json({ message: 'No token provided' });
+  }
+
+  try {
+    const secret = jwtSecret();
+    if (!secret) throw new Error('JWT_SECRET missing');
+
+    const payload = jwt.verify(token, secret);
+    const user = await User.findById(payload.id);
+    if (!user) {
+      return res.status(401).json({ message: 'User not found' });
+    }
+    req.user = { id: String(user._id), role: user.role };
+    next();
+  } catch {
+    return res.status(401).json({ message: 'Invalid or expired token' });
+  }
+}

package/apps/SFMS/backend/src/models/Payment.js

@@ -0,0 +1,12 @@
+import mongoose from 'mongoose';
+
+const paymentSchema = new mongoose.Schema(
+  {
+    student: { type: mongoose.Schema.Types.ObjectId, ref: 'Student', required: true },
+    amount: { type: Number, required: true, min: 0 },
+    paymentDate: { type: Date, required: true },
+  },
+  { timestamps: { createdAt: 'created_at', updatedAt: false } }
+);
+
+export const Payment = mongoose.model('Payment', paymentSchema);

package/apps/SFMS/backend/src/models/Student.js

@@ -0,0 +1,12 @@
+import mongoose from 'mongoose';
+
+const studentSchema = new mongoose.Schema(
+  {
+    fullName: { type: String, required: true, trim: true },
+    className: { type: String, required: true, trim: true },
+    parentPhone: { type: String, required: true, trim: true },
+  },
+  { timestamps: { createdAt: 'created_at', updatedAt: false } }
+);
+
+export const Student = mongoose.model('Student', studentSchema);

package/apps/SFMS/backend/src/models/User.js

@@ -0,0 +1,13 @@
+import mongoose from 'mongoose';
+
+const userSchema = new mongoose.Schema(
+  {
+    name: { type: String, required: true, trim: true },
+    email: { type: String, required: true, unique: true, lowercase: true, trim: true },
+    password: { type: String, required: true, minlength: 6, select: false },
+    role: { type: String, enum: ['admin', 'staff'], default: 'admin' },
+  },
+  { timestamps: { createdAt: 'created_at', updatedAt: false } }
+);
+
+export const User = mongoose.model('User', userSchema);

package/apps/SFMS/backend/src/routes/authRoutes.js

@@ -0,0 +1,93 @@
+import { Router } from 'express';
+import bcrypt from 'bcryptjs';
+import jwt from 'jsonwebtoken';
+import { env } from '../config/env.js';
+import { User } from '../models/User.js';
+
+const router = Router();
+
+function jwtSecret() {
+  return env.jwtSecret;
+}
+
+function signToken(user) {
+  const secret = jwtSecret();
+  if (!secret) throw new Error('JWT_SECRET');
+  return jwt.sign({ id: String(user._id), role: user.role }, secret, { expiresIn: '7d' });
+}
+
+router.post('/register', async (req, res) => {
+  try {
+    const { name, email, password, role } = req.body;
+    if (!name || !email || !password) {
+      return res.status(400).json({ message: 'Name, email and password are required' });
+    }
+    if (String(password).length < 6) {
+      return res.status(400).json({ message: 'Password must be at least 6 characters' });
+    }
+
+    const exists = await User.findOne({ email: String(email).toLowerCase() });
+    if (exists) {
+      return res.status(409).json({ message: 'Email already registered' });
+    }
+
+    const hash = await bcrypt.hash(String(password), 12);
+    const user = await User.create({
+      name: String(name).trim(),
+      email: String(email).toLowerCase().trim(),
+      password: hash,
+      role: role === 'staff' ? 'staff' : 'admin',
+    });
+
+    const token = signToken(user);
+    return res.status(201).json({
+      token,
+      user: {
+        id: user._id,
+        name: user.name,
+        email: user.email,
+        role: user.role,
+        created_at: user.created_at,
+      },
+    });
+  } catch (err) {
+    console.error(err);
+    return res.status(500).json({ message: 'Registration failed' });
+  }
+});
+
+router.post('/login', async (req, res) => {
+  try {
+    const { email, password } = req.body;
+    if (!email || !password) {
+      return res.status(400).json({ message: 'Email and password are required' });
+    }
+
+    const user = await User.findOne({ email: String(email).toLowerCase() }).select('+password');
+    if (!user) {
+      return res.status(401).json({ message: 'Invalid email or password' });
+    }
+
+    const match = await bcrypt.compare(String(password), user.password);
+    if (!match) {
+      return res.status(401).json({ message: 'Invalid email or password' });
+    }
+
+    const token = signToken(user);
+    return res.json({
+      token,
+      user: {
+        id: user._id,
+        name: user.name,
+        email: user.email,
+        role: user.role,
+        created_at: user.created_at,
+      },
+    });
+  } catch (err) {
+    console.error(err);
+    return res.status(500).json({ message: 'Login failed' });
+  }
+});
+
+export default router;

package/apps/SFMS/backend/src/routes/paymentRoutes.js

@@ -0,0 +1,117 @@
+import { Router } from 'express';
+import mongoose from 'mongoose';
+import { Payment } from '../models/Payment.js';
+import { Student } from '../models/Student.js';
+import { protect } from '../middleware/authMiddleware.js';
+
+const router = Router();
+router.use(protect);
+
+function toApi(doc) {
+  if (!doc) return null;
+  const o = doc.toObject ? doc.toObject() : doc;
+  const st = o.student && typeof o.student === 'object' ? o.student : null;
+  return {
+    id: o._id,
+    student_id: o.student?._id ?? o.student,
+    amount: o.amount,
+    payment_date: o.paymentDate?.toISOString?.().slice(0, 10) ?? o.paymentDate,
+    created_at: o.created_at,
+    student: st
+      ? {
+          id: st._id,
+          full_name: st.fullName,
+          class: st.className,
+          parent_phone: st.parentPhone,
+        }
+      : undefined,
+  };
+}
+
+router.get('/', async (req, res) => {
+  try {
+    const rows = await Payment.find()
+      .populate('student', 'fullName className parentPhone')
+      .sort({ paymentDate: -1 });
+    return res.json(rows.map(toApi));
+  } catch (err) {
+    console.error(err);
+    return res.status(500).json({ message: 'Failed to list payments' });
+  }
+});
+
+router.post('/', async (req, res) => {
+  try {
+    const { student_id, amount, payment_date } = req.body;
+    if (!student_id || amount === undefined || amount === null || !payment_date) {
+      return res.status(400).json({ message: 'Student, amount and payment date are required' });
+    }
+    if (!mongoose.Types.ObjectId.isValid(student_id)) {
+      return res.status(400).json({ message: 'Invalid student id' });
+    }
+    const student = await Student.findById(student_id);
+    if (!student) return res.status(404).json({ message: 'Student not found' });
+
+    const num = Number(amount);
+    if (Number.isNaN(num) || num < 0) {
+      return res.status(400).json({ message: 'Amount must be a valid non-negative number' });
+    }
+
+    const payment = await Payment.create({
+      student: student_id,
+      amount: num,
+      paymentDate: new Date(payment_date),
+    });
+    await payment.populate('student', 'fullName className parentPhone');
+    return res.status(201).json(toApi(payment));
+  } catch (err) {
+    console.error(err);
+    return res.status(500).json({ message: 'Failed to create payment' });
+  }
+});
+
+router.put('/:id', async (req, res) => {
+  try {
+    const { student_id, amount, payment_date } = req.body;
+    const patch = {};
+    if (student_id !== undefined) {
+      if (!mongoose.Types.ObjectId.isValid(student_id)) {
+        return res.status(400).json({ message: 'Invalid student id' });
+      }
+      const student = await Student.findById(student_id);
+      if (!student) return res.status(404).json({ message: 'Student not found' });
+      patch.student = student_id;
+    }
+    if (amount !== undefined) {
+      const num = Number(amount);
+      if (Number.isNaN(num) || num < 0) {
+        return res.status(400).json({ message: 'Amount must be a valid non-negative number' });
+      }
+      patch.amount = num;
+    }
+    if (payment_date !== undefined) patch.paymentDate = new Date(payment_date);
+
+    const payment = await Payment.findByIdAndUpdate(req.params.id, patch, {
+      new: true,
+      runValidators: true,
+    }).populate('student', 'fullName className parentPhone');
+    if (!payment) return res.status(404).json({ message: 'Payment not found' });
+    return res.json(toApi(payment));
+  } catch (err) {
+    console.error(err);
+    return res.status(500).json({ message: 'Failed to update payment' });
+  }
+});
+
+router.delete('/:id', async (req, res) => {
+  try {
+    const payment = await Payment.findByIdAndDelete(req.params.id);
+    if (!payment) return res.status(404).json({ message: 'Payment not found' });
+    return res.json({ message: 'Deleted', id: req.params.id });
+  } catch (err) {
+    console.error(err);
+    return res.status(500).json({ message: 'Failed to delete' });
+  }
+});
+
+export default router;

package/apps/SFMS/backend/src/routes/reportRoutes.js

@@ -0,0 +1,59 @@
+import { Router } from 'express';
+import { Payment } from '../models/Payment.js';
+import { protect } from '../middleware/authMiddleware.js';
+
+const router = Router();
+router.use(protect);
+
+function toApi(doc) {
+  const o = doc.toObject ? doc.toObject() : doc;
+  const st = o.student && typeof o.student === 'object' ? o.student : null;
+  return {
+    id: o._id,
+    student_id: o.student?._id ?? o.student,
+    amount: o.amount,
+    payment_date: o.paymentDate?.toISOString?.().slice(0, 10) ?? o.paymentDate,
+    created_at: o.created_at,
+    student: st
+      ? { id: st._id, full_name: st.fullName, class: st.className }
+      : undefined,
+  };
+}
+
+router.get('/', async (req, res) => {
+  try {
+    const { start, end } = req.query;
+    if (!start || !end) {
+      return res.status(400).json({ message: 'Query params start and end (yyyy-mm-dd) are required' });
+    }
+
+    const startDate = new Date(String(start));
+    const endDate = new Date(String(end));
+    if (Number.isNaN(startDate.getTime()) || Number.isNaN(endDate.getTime())) {
+      return res.status(400).json({ message: 'Invalid date format; use yyyy-mm-dd' });
+    }
+
+    // Iherezo ry'itariki: umunsi wuzura (intera ndangagaciro)
+    endDate.setHours(23, 59, 59, 999);
+
+    const rows = await Payment.find({
+      paymentDate: { $gte: startDate, $lte: endDate },
+    })
+      .populate('student', 'fullName className')
+      .sort({ paymentDate: -1 });
+
+    const total = rows.reduce((sum, row) => sum + (row.amount || 0), 0);
+
+    return res.json({
+      start: String(start),
+      end: String(end),
+      payments: rows.map(toApi),
+      total_amount_paid: total,
+    });
+  } catch (err) {
+    console.error(err);
+    return res.status(500).json({ message: 'Failed to build report' });
+  }
+});
+
+export default router;

package/apps/SFMS/backend/src/routes/studentRoutes.js

@@ -0,0 +1,79 @@
+import { Router } from 'express';
+import { Student } from '../models/Student.js';
+import { protect } from '../middleware/authMiddleware.js';
+
+const router = Router();
+router.use(protect);
+
+function toApi(doc) {
+  if (!doc) return null;
+  const o = doc.toObject ? doc.toObject() : doc;
+  return {
+    id: o._id,
+    full_name: o.fullName,
+    class: o.className,
+    parent_phone: o.parentPhone,
+    created_at: o.created_at,
+  };
+}
+
+router.get('/', async (req, res) => {
+  try {
+    const rows = await Student.find().sort({ created_at: -1 });
+    return res.json(rows.map(toApi));
+  } catch (err) {
+    console.error(err);
+    return res.status(500).json({ message: 'Failed to list students' });
+  }
+});
+
+router.post('/', async (req, res) => {
+  try {
+    const { full_name, class: className, parent_phone } = req.body;
+    if (!full_name || !className || !parent_phone) {
+      return res.status(400).json({ message: 'Full name, class and parent phone are required' });
+    }
+    const student = await Student.create({
+      fullName: String(full_name).trim(),
+      className: String(className).trim(),
+      parentPhone: String(parent_phone).trim(),
+    });
+    return res.status(201).json(toApi(student));
+  } catch (err) {
+    console.error(err);
+    return res.status(500).json({ message: 'Failed to create student' });
+  }
+});
+
+router.put('/:id', async (req, res) => {
+  try {
+    const { full_name, class: className, parent_phone } = req.body;
+    const patch = {};
+    if (full_name !== undefined) patch.fullName = String(full_name).trim();
+    if (className !== undefined) patch.className = String(className).trim();
+    if (parent_phone !== undefined) patch.parentPhone = String(parent_phone).trim();
+
+    const student = await Student.findByIdAndUpdate(req.params.id, patch, {
+      new: true,
+      runValidators: true,
+    });
+    if (!student) return res.status(404).json({ message: 'Student not found' });
+    return res.json(toApi(student));
+  } catch (err) {
+    console.error(err);
+    return res.status(500).json({ message: 'Failed to update student' });
+  }
+});
+
+router.delete('/:id', async (req, res) => {
+  try {
+    const student = await Student.findByIdAndDelete(req.params.id);
+    if (!student) return res.status(404).json({ message: 'Student not found' });
+    return res.json({ message: 'Deleted', id: req.params.id });
+  } catch (err) {
+    console.error(err);
+    return res.status(500).json({ message: 'Failed to delete' });
+  }
+});
+
+export default router;

package/apps/SFMS/backend/src/server.js

@@ -0,0 +1,34 @@
+import 'dotenv/config';
+import express from 'express';
+import cors from 'cors';
+import { env, requireMongoUri } from './config/env.js';
+import { connectMongo } from './config/database.js';
+import authRoutes from './routes/authRoutes.js';
+import studentRoutes from './routes/studentRoutes.js';
+import paymentRoutes from './routes/paymentRoutes.js';
+import reportRoutes from './routes/reportRoutes.js';
+
+const app = express();
+
+app.use(cors({ origin: true, credentials: true }));
+app.use(express.json());
+
+app.get('/api/health', (req, res) => {
+  res.json({ ok: true, app: 'SFMS' });
+});
+
+app.use('/api', authRoutes);
+app.use('/api/students', studentRoutes);
+app.use('/api/payments', paymentRoutes);
+app.use('/api/reports', reportRoutes);
+
+app.use((req, res) => {
+  res.status(404).json({ message: 'Not found' });
+});
+
+await connectMongo(requireMongoUri());
+console.log('MongoDB connected');
+
+app.listen(env.port, () => {
+  console.log(`Server listening on http://localhost:${env.port}`);
+});

package/apps/SFMS/frontend/.env.example

@@ -0,0 +1,8 @@
+# Dev server — fixed port; strictPort fails if busy (no random port)
+VITE_DEV_SERVER_PORT=5173
+
+# Where Vite proxies /api in dev (matches backend default)
+VITE_API_PROXY_TARGET=http://localhost:5000
+
+# Production or custom API origin (optional; empty = relative /api)
+# VITE_API_BASE_URL=https://api.example.com

package/apps/SFMS/frontend/dist/assets/index-B08X8imN.css

@@ -0,0 +1 @@
+*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:DM Sans,system-ui,sans-serif;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}:root{color-scheme:light;--surface: #f8fafc;--panel: rgba(255,255,255,.94);--border: rgba(148,163,184,.24);--text-title: #0f172a;--text-body: #475569;--accent: #0d9488;--accent-dark: #0f766e;--shadow-soft: 0 24px 80px rgba(15,23,42,.08)}html{scroll-behavior:smooth}body{min-height:100vh;--tw-bg-opacity: 1;background-color:rgb(248 250 252 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(15 23 42 / var(--tw-text-opacity, 1));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-image:radial-gradient(circle at top left,rgba(13,148,136,.18),transparent 24%),radial-gradient(circle at bottom right,rgba(14,165,233,.11),transparent 20%),linear-gradient(180deg,#f8fbfd,#f1f5f9)}*{box-sizing:border-box}.app-shell{display:flex;min-height:100vh;flex-direction:column;background-color:transparent}@media (min-width: 768px){.app-shell{flex-direction:row}}.app-sidebar{width:100%;flex-shrink:0;border-width:1px;--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);--tw-backdrop-blur: blur(24px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}@media (min-width: 768px){.app-sidebar{width:18rem}}.app-sidebar{border-color:#94a3b8b3;background-color:#ffffffeb}.app-brand{border-bottom-width:1px;padding:1.5rem;border-color:#94a3b8b3}.app-brand-name{font-family:Outfit,system-ui,sans-serif;font-size:1.5rem;line-height:2rem;font-weight:800;letter-spacing:-.025em;--tw-text-opacity: 1;color:rgb(15 23 42 / var(--tw-text-opacity, 1))}.app-brand-subtitle{margin-top:.25rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(100 116 139 / var(--tw-text-opacity, 1))}.app-nav{display:flex;flex-wrap:wrap;gap:.75rem;padding:1rem}.app-nav-link{border-radius:9999px;padding:.5rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:600;--tw-text-opacity: 1;color:rgb(71 85 105 / var(--tw-text-opacity, 1));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s}.app-nav-link:hover{--tw-bg-opacity: 1;background-color:rgb(241 245 249 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(15 23 42 / var(--tw-text-opacity, 1))}.app-nav-link.active{--tw-bg-opacity: 1;background-color:rgb(15 23 42 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1));--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.app-user-panel{margin-top:auto;border-top-width:1px;padding:1.5rem;border-color:#94a3b8b3}.app-user-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(71 85 105 / var(--tw-text-opacity, 1))}.app-user-action{margin-top:.75rem;width:100%;border-radius:1rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(203 213 225 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(248 250 252 / var(--tw-bg-opacity, 1));padding:.75rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:600;--tw-text-opacity: 1;color:rgb(51 65 85 / var(--tw-text-opacity, 1));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.app-user-action:hover{--tw-bg-opacity: 1;background-color:rgb(241 245 249 / var(--tw-bg-opacity, 1))}.app-content{flex:1 1 0%;padding:1.25rem 1rem 2rem}@media (min-width: 768px){.app-content{padding-left:2rem;padding-right:2rem;padding-top:2rem}}.app-header{margin-bottom:1.5rem}.page-title{font-family:Outfit,system-ui,sans-serif;font-size:1.875rem;line-height:2.25rem;font-weight:700;letter-spacing:-.025em;--tw-text-opacity: 1;color:rgb(15 23 42 / var(--tw-text-opacity, 1))}@media (min-width: 768px){.page-title{font-size:2.25rem;line-height:2.5rem}}.page-subtitle{margin-top:.75rem;max-width:42rem;line-height:1.75rem;--tw-text-opacity: 1;color:rgb(71 85 105 / var(--tw-text-opacity, 1))}.panel-card{border-radius:32px;border-width:1px;padding:1.5rem;--tw-shadow: 0 24px 80px rgba(15,23,42,.08);--tw-shadow-colored: 0 24px 80px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);border-color:#94a3b8cc;background-color:#fffffff2}.panel-card-alt{border-radius:32px;border-width:1px;padding:1.5rem;border-color:#94a3b8b3;background-color:#f8fafce6}.stat-grid{margin-top:2rem;display:grid;gap:1.25rem}@media (min-width: 640px){.stat-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}.stat-card{border-radius:28px;border-width:1px;background-image:linear-gradient(to bottom right,var(--tw-gradient-stops));--tw-gradient-from: #fff var(--tw-gradient-from-position);--tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);--tw-gradient-to: #f8fafc var(--tw-gradient-to-position);padding:1.5rem;--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);border-color:#94a3b8b3}.stat-label{font-size:.75rem;line-height:1rem;font-weight:600;text-transform:uppercase;letter-spacing:.24em;--tw-text-opacity: 1;color:rgb(100 116 139 / var(--tw-text-opacity, 1))}.stat-value{margin-top:1rem;font-size:1.875rem;line-height:2.25rem;font-weight:700;--tw-text-opacity: 1;color:rgb(15 23 42 / var(--tw-text-opacity, 1))}.stat-link{margin-top:1.25rem;display:inline-flex;font-size:.875rem;line-height:1.25rem;font-weight:500;--tw-text-opacity: 1;color:rgb(71 85 105 / var(--tw-text-opacity, 1));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.stat-link:hover{--tw-text-opacity: 1;color:rgb(15 23 42 / var(--tw-text-opacity, 1))}.form-card{border-radius:32px;border-width:1px;padding:1.5rem;--tw-shadow: 0 20px 55px rgba(15,23,42,.06);--tw-shadow-colored: 0 20px 55px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);border-color:#94a3b8cc;background-color:#fffffff2}.input-field{width:100%;border-radius:1rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(226 232 240 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(248 250 252 / var(--tw-bg-opacity, 1));padding:.75rem 1rem;--tw-text-opacity: 1;color:rgb(15 23 42 / var(--tw-text-opacity, 1));outline:2px solid transparent;outline-offset:2px;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s}.input-field:focus{--tw-border-opacity: 1;border-color:rgb(13 148 136 / var(--tw-border-opacity, 1));--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000);--tw-ring-opacity: 1;--tw-ring-color: rgb(13 148 136 / var(--tw-ring-opacity, 1))}.input-group>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.form-actions{display:flex;flex-wrap:wrap;gap:.75rem}.btn-primary{display:inline-flex;align-items:center;justify-content:center;border-radius:1rem;--tw-bg-opacity: 1;background-color:rgb(13 148 136 / var(--tw-bg-opacity, 1));padding:.75rem 1.25rem;font-size:.875rem;line-height:1.25rem;font-weight:600;--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1));--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s}.btn-primary:hover{--tw-bg-opacity: 1;background-color:rgb(15 118 110 / var(--tw-bg-opacity, 1))}.btn-secondary{display:inline-flex;align-items:center;justify-content:center;border-radius:1rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(203 213 225 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));padding:.75rem 1.25rem;font-size:.875rem;line-height:1.25rem;font-weight:600;--tw-text-opacity: 1;color:rgb(51 65 85 / var(--tw-text-opacity, 1));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s}.btn-secondary:hover{--tw-bg-opacity: 1;background-color:rgb(241 245 249 / var(--tw-bg-opacity, 1))}.btn-destructive{display:inline-flex;align-items:center;justify-content:center;border-radius:1rem;--tw-bg-opacity: 1;background-color:rgb(220 38 38 / var(--tw-bg-opacity, 1));padding:.75rem 1.25rem;font-size:.875rem;line-height:1.25rem;font-weight:600;--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s}.btn-destructive:hover{--tw-bg-opacity: 1;background-color:rgb(185 28 28 / var(--tw-bg-opacity, 1))}.table-shell{overflow-x:auto;border-radius:28px;border-width:1px;--tw-border-opacity: 1;border-color:rgb(226 232 240 / var(--tw-border-opacity, 1));background-color:#fffffff2;--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.table-head{--tw-bg-opacity: 1;background-color:rgb(241 245 249 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(71 85 105 / var(--tw-text-opacity, 1))}.table-row{border-top-width:1px;--tw-border-opacity: 1;border-color:rgb(241 245 249 / var(--tw-border-opacity, 1));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s}.table-row:hover{--tw-bg-opacity: 1;background-color:rgb(248 250 252 / var(--tw-bg-opacity, 1))}.table-cell{padding:1rem}.placeholder-card{border-radius:28px;border-width:1px;border-style:dashed;--tw-border-opacity: 1;border-color:rgb(203 213 225 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(248 250 252 / var(--tw-bg-opacity, 1));padding:3rem 1.5rem;text-align:center;--tw-text-opacity: 1;color:rgb(100 116 139 / var(--tw-text-opacity, 1))}.auth-page{display:flex;min-height:100vh;align-items:center;justify-content:center;padding:2.5rem 1rem}.auth-card{width:100%;max-width:56rem;overflow:hidden;border-radius:40px;border-width:1px;--tw-shadow: 0 30px 120px rgba(15,23,42,.12);--tw-shadow-colored: 0 30px 120px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);border-color:#94a3b8cc;background-color:#fffffff2}.auth-split{display:grid;gap:1.5rem}@media (min-width: 768px){.auth-split{grid-template-columns:1.1fr .9fr}}.auth-side{display:none;flex-direction:column;justify-content:center;gap:1rem;border-top-right-radius:40px;border-bottom-right-radius:40px;--tw-bg-opacity: 1;background-color:rgb(13 148 136 / var(--tw-bg-opacity, 1));padding:3rem 2.5rem;--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}@media (min-width: 768px){.auth-side{display:flex}}.auth-logo{font-family:Outfit,system-ui,sans-serif;font-size:2.25rem;line-height:2.5rem;font-weight:900}.auth-copy{margin-top:1rem;font-size:.875rem;line-height:1.75rem;color:#f1f5f9e6}.auth-panel{padding:2rem}@media (min-width: 640px){.auth-panel{padding:2.5rem}}.auth-switcher{display:flex;gap:.75rem;border-radius:9999px;--tw-bg-opacity: 1;background-color:rgb(241 245 249 / var(--tw-bg-opacity, 1));padding:.25rem}.auth-switcher button{flex:1 1 0%;border-radius:9999px;padding:.5rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:600;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s}.auth-switcher button.active{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(15 23 42 / var(--tw-text-opacity, 1));--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.fixed{position:fixed}.inset-0{top:0;right:0;bottom:0;left:0}.z-50{z-index:50}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.flex{display:flex}.table{display:table}.table-cell{display:table-cell}.table-row{display:table-row}.grid{display:grid}.h-14{height:3.5rem}.w-full{width:100%}.min-w-full{min-width:100%}.max-w-2xl{max-width:42rem}.max-w-md{max-width:28rem}.flex-col{flex-direction:column}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}.space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.5rem * var(--tw-space-x-reverse));margin-left:calc(.5rem * calc(1 - var(--tw-space-x-reverse)))}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem * var(--tw-space-y-reverse))}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.space-y-5>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.25rem * var(--tw-space-y-reverse))}.space-y-6>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem * var(--tw-space-y-reverse))}.whitespace-nowrap{white-space:nowrap}.rounded-3xl{border-radius:1.5rem}.rounded-\[26px\]{border-radius:26px}.rounded-\[28px\]{border-radius:28px}.border{border-width:1px}.border-amber-100{--tw-border-opacity: 1;border-color:rgb(254 243 199 / var(--tw-border-opacity, 1))}.border-red-100{--tw-border-opacity: 1;border-color:rgb(254 226 226 / var(--tw-border-opacity, 1))}.border-slate-200{--tw-border-opacity: 1;border-color:rgb(226 232 240 / var(--tw-border-opacity, 1))}.bg-amber-50{--tw-bg-opacity: 1;background-color:rgb(255 251 235 / var(--tw-bg-opacity, 1))}.bg-black\/40{background-color:#0006}.bg-red-50{--tw-bg-opacity: 1;background-color:rgb(254 242 242 / var(--tw-bg-opacity, 1))}.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}.from-slate-50{--tw-gradient-from: #f8fafc var(--tw-gradient-from-position);--tw-gradient-to: rgb(248 250 252 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.to-cyan-50{--tw-gradient-to: #ecfeff var(--tw-gradient-to-position)}.to-slate-100{--tw-gradient-to: #f1f5f9 var(--tw-gradient-to-position)}.to-teal-50{--tw-gradient-to: #f0fdfa var(--tw-gradient-to-position)}.p-4{padding:1rem}.px-4{padding-left:1rem;padding-right:1rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.text-left{text-align:left}.font-display{font-family:Outfit,system-ui,sans-serif}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.leading-7{line-height:1.75rem}.tracking-\[0\.35em\]{letter-spacing:.35em}.tracking-\[0\.3em\]{letter-spacing:.3em}.text-amber-700{--tw-text-opacity: 1;color:rgb(180 83 9 / var(--tw-text-opacity, 1))}.text-amber-800{--tw-text-opacity: 1;color:rgb(146 64 14 / var(--tw-text-opacity, 1))}.text-red-600{--tw-text-opacity: 1;color:rgb(220 38 38 / var(--tw-text-opacity, 1))}.text-red-700{--tw-text-opacity: 1;color:rgb(185 28 28 / var(--tw-text-opacity, 1))}.text-sfms-ink{--tw-text-opacity: 1;color:rgb(15 23 42 / var(--tw-text-opacity, 1))}.text-slate-100\/80{color:#f1f5f9cc}.text-slate-500{--tw-text-opacity: 1;color:rgb(100 116 139 / var(--tw-text-opacity, 1))}.text-slate-600{--tw-text-opacity: 1;color:rgb(71 85 105 / var(--tw-text-opacity, 1))}.text-slate-700{--tw-text-opacity: 1;color:rgb(51 65 85 / var(--tw-text-opacity, 1))}.text-slate-900{--tw-text-opacity: 1;color:rgb(15 23 42 / var(--tw-text-opacity, 1))}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.disabled\:opacity-50:disabled{opacity:.5}@media (min-width: 640px){.sm\:w-auto{width:auto}.sm\:flex-row{flex-direction:row}.sm\:items-center{align-items:center}.sm\:justify-between{justify-content:space-between}}@media (min-width: 768px){.md\:w-auto{width:auto}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-\[1\.1fr_1\.1fr_auto\]{grid-template-columns:1.1fr 1.1fr auto}.md\:flex-row{flex-direction:row}.md\:items-center{align-items:center}.md\:justify-between{justify-content:space-between}}