/* style.css - simple Kanban layout */
body { font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; margin:0; padding:0; background:#f4f6f8; color:#222; }
header { background:#2d6cdf; color:#fff; padding:12px 16px; display:flex; justify-content:space-between; align-items:center;}
header h1 { margin:0; font-size:1.1rem; }
.actions .btn { color:#fff; text-decoration:none; background:rgba(255,255,255,0.15); padding:6px 10px; border-radius:4px;}
.center { max-width:420px; margin:60px auto; background:#fff; padding:20px; border-radius:6px; box-shadow:0 2px 6px rgba(0,0,0,0.08);}
.add { padding:16px; background:#fff; margin:16px; border-radius:6px; box-shadow:0 1px 3px rgba(0,0,0,0.04);}
.add form label { display:block; margin-bottom:8px;}
.add input, .add textarea, .add select { width:100%; padding:8px; margin-top:4px; box-sizing:border-box;}
.board { display:flex; gap:12px; padding:16px; }
.column { flex:1; background:#fff; padding:10px; border-radius:6px; min-height:200px; box-shadow:0 1px 3px rgba(0,0,0,0.04);}
.column h3 { margin-top:0; font-size:0.95rem; }
.ticket { background:#fafafa; padding:10px; border-radius:6px; margin-bottom:10px; border:1px solid #eee;}
.ticket h4 { margin:0 0 6px 0; }
.ticket .meta { font-size:0.8rem; color:#666; margin-bottom:6px;}
.ticket-actions { margin-top:8px; }
.ticket-actions button { margin-left:6px; }
.error { color:#b00; }
button, .btn { cursor:pointer; }
.danger { background:#ffdddd; }
.sr-only { position: absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* Drag & Drop visual helpers */
.column.over { outline: 3px dashed rgba(45,108,223,0.4); background: linear-gradient(180deg, rgba(45,108,223,0.02), rgba(45,108,223,0.01)); }
.ticket.dragging { opacity: 0.6; transform: scale(0.98); box-shadow: 0 6px 18px rgba(0,0,0,0.12); }

@media (max-width:800px) {
  .board { flex-direction:column; }
}