/* style.css - layout minimal, moderno */
:root{
  --bg:#f7fafc;
  --card:#ffffff;
  --muted:#6b7280;
  --accent:#0284c7;
  --glass: rgba(255,255,255,0.7);
}

*{box-sizing:border-box}
body{
  margin:0;
  font-family:Inter,InterVar,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial;
  background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
  color:#0f172a;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* Topbar */
.topbar{
  max-width:1200px;
  margin:18px auto;
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:space-between;
  padding:14px;
}
.topbar h1{margin:0;font-size:20px}
.muted{color:var(--muted);font-size:12px;margin-top:4px}

/* Controls */
.controls{display:flex;gap:8px;align-items:center}
.controls input, .controls select{
  padding:8px 10px;border-radius:8px;border:1px solid #e6eef6;background:white;font-size:14px;
}
.controls button{background:var(--accent);color:white;padding:8px 12px;border-radius:8px;border:0;cursor:pointer}

/* Board */
.board{max-width:1200px;margin:8px auto;display:flex;gap:12px;padding:12px;overflow-x:auto}
.column{
  min-width:260px;background:var(--card);border-radius:10px;padding:12px;box-shadow:0 6px 18px rgba(10,20,30,0.06);
  display:flex;flex-direction:column;max-height:65vh;
}
.column h4{display:flex;justify-content:space-between;margin:0;padding-bottom:8px}
.task{
  background:linear-gradient(180deg,#ffffff,#fbfdff);
  padding:10px;border-radius:8px;border:1px solid #eef6fb;margin-bottom:10px;cursor:grab;
  box-shadow:0 4px 8px rgba(12,20,30,0.04);
}
.task .meta{font-size:12px;color:var(--muted);margin-top:6px;display:flex;justify-content:space-between}
.task .actions{margin-top:8px;display:flex;gap:6px}

/* Backlog aside */
.backlog{
  max-width:1200px;margin:8px auto;padding:12px;
}
.footer{max-width:1200px;margin:8px auto;color:var(--muted);font-size:12px;}

/* Modal */
.modal{position:fixed;inset:0;background:rgba(2,6,23,0.45);display:flex;align-items:center;justify-content:center;padding:16px}
.modal.hidden{display:none}
.modal-content{background:var(--card);padding:16px;border-radius:10px;width:100%;max-width:520px;display:flex;flex-direction:column;gap:8px}
.modal-content input, .modal-content textarea, .modal-content select{padding:8px;border-radius:8px;border:1px solid #e6eef6}
.modal-actions{display:flex;justify-content:flex-end;gap:8px}

/* Responsive */
@media (max-width:900px){
  .topbar{flex-direction:column;align-items:flex-start;gap:10px}
  .controls{flex-wrap:wrap}
}

/* Adições para auth, comentários e pequenos ajustes */
.hidden{display:none}
.comment{padding:8px;border-radius:8px;border:1px solid #eef6fb;margin-bottom:6px;background:#fff}
.close{background:transparent;border:0;cursor:pointer;align-self:flex-end}
.modal-content .small{font-size:12px}
.pagination{display:flex;gap:8px;align-items:center;margin-top:8px}
#comments-list{max-height:200px;overflow:auto;padding:8px;background:#f8fafc;border-radius:8px}
#comment-text{width:100%;min-height:60px;padding:8px;border-radius:8px;border:1px solid #e6eef6}