:root {
    --primary: #2c3e50;
    --secondary: #27ae60;
    --danger: #e74c3c;
    --light: #f4f7f6;
}

body {
    font-family: 'Inter', 'Segoe UI', sans-serif;
    background-color: var(--light);
    color: var(--primary);
    margin: 0;
}

.container {
    max-width: 1100px;
    margin: 40px auto;
    background: white;
    padding: 30px;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
}

input, select {
    width: 100%;
    padding: 12px;
    margin: 8px 0 20px 0;
    border: 1px solid #ddd;
    border-radius: 6px;
    transition: 0.3s;
}

input:focus { border-color: var(--secondary); outline: none; }

button {
    background: var(--secondary);
    color: white;
    border: none;
    padding: 12px 25px;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
    width: 100%;
}

button:hover { background: #219150; }

table { width: 100%; border-collapse: collapse; margin-top: 20px; }
th { background: var(--primary); color: white; padding: 15px; text-align: left; }
td { padding: 15px; border-bottom: 1px solid #eee; }

/* Status Labels */
.status-pending { background: #fff3cd; color: #856404; padding: 4px 10px; border-radius: 20px; font-size: 12px; }
.status-approved { background: #d4edda; color: #155724; padding: 4px 10px; border-radius: 20px; font-size: 12px; }