body { 
    font-family: system-ui, sans-serif; 
    background-color: #f4f6f9; 
    color: #333; 
    margin: 0; 
    padding: 2rem; 
}
.container {
     max-width: 1200px; 
     margin: 0 auto; 
    }
h1, h2 { 
    color: #1e293b; 
}
.card { 
    background: #fff; 
    border-radius: 8px; 
    box-shadow: 0 2px 4px rgba(0,0,0,0.05); 
    padding: 1.5rem; margin-bottom: 2rem;
 }
.form-grid { 
    display: grid; 
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); 
    gap: 1rem; 
    margin-bottom: 1rem; 
}
input { width: 100%; 
    padding: 0.75rem; 
    border: 1px solid #ccc; 
    border-radius: 4px; 
    box-sizing: border-box; 
}
.form-actions { 
    display: flex;
    gap: 1rem; 
    }
button { padding: 0.75rem 1.5rem; 
    border: none; 
    border-radius: 4px; 
    color: #fff; 
    cursor: pointer; 
}
button[type="submit"] { background-color: #3b82f6; }
button[type="button"] { background-color: #64748b; }
.table-container { 
    overflow-x: auto; 
}
table { 
    width: 100%; 
    border-collapse: collapse; 
    margin-top: 1rem;
 }
th, td { 
    padding: 0.75rem; 
    text-align: left;
    border-bottom: 1px solid #e2e8f0; 
    }
th { 
    background-color: #f8fafc; 
}
.action-btn {
    background: none;
    border: 1px solid;
    border-radius: 4px;
    padding: 0.25rem 0.5rem;
    cursor: pointer;
    margin: 0;
}
.action-buttons-container {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.edit-btn {
     color: #f59e0b; 
     border-color: #f59e0b; 
    }
.delete-btn { 
    color: #ef4444; 
    border-color: #ef4444;
 }
 /* Add these styles to admin.css to make status buttons visible */
.status-done-btn {
    color: #22c55e;
    border-color: #22c55e;
}

.status-canceled-btn {
    color: #64748b;
    border-color: #64748b;
}
