/* assets/style.css */
:root { --primary: #2c3e50; --accent: #3498db; --success: #27ae60; --bg: #f8f9fa; }
body { font-family: 'Segoe UI', sans-serif; margin: 0; background: var(--bg); color: #333; }
.auth-page { display: flex; justify-content: center; align-items: center; height: 100vh; }
.login-card { background: #fff; padding: 40px; border-radius: 12px; shadow: 0 10px 25px rgba(0,0,0,0.1); width: 350px; text-align: center; }
input { width: 100%; padding: 12px; margin: 10px 0; border: 1px solid #ddd; border-radius: 6px; box-sizing: border-box; }
button { background: var(--accent); color: #fff; border: none; padding: 12px 20px; border-radius: 6px; cursor: pointer; width: 100%; font-weight: bold; }

/* Dashboard Layout */
.wrapper { display: grid; grid-template-columns: 260px 1fr; min-height: 100vh; }
aside { background: var(--primary); color: #ecf0f1; padding: 20px; }
main { padding: 30px; overflow-y: auto; }
.nav-item { padding: 12px; color: #bdc3c7; text-decoration: none; display: block; border-radius: 4px; transition: 0.3s; }
.nav-item:hover, .nav-item.active { background: rgba(255,255,255,0.1); color: #fff; }

/* Drag & Drop Zone */
#drop-zone { border: 2px dashed #ccc; padding: 40px; text-align: center; border-radius: 10px; background: #fff; cursor: pointer; transition: 0.3s; margin-bottom: 20px; }
#drop-zone.hover { border-color: var(--accent); background: #ebf5fb; }
.status-badge { padding: 4px 8px; border-radius: 4px; font-size: 12px; font-weight: bold; }
.status-printed { background: #d4edda; color: #155724; }
.status-partial { background: #fff3cd; color: #856404; }
.status-new { background: #e2e3e5; color: #383d41; }