/* Tarefas: edicao inline, categorias redimensionaveis e resumo da Tela Inicial. */
#page-tarefas .topbar{align-items:flex-start}
.tarefa-composer{
  display:grid;
  grid-template-columns:minmax(220px,1fr) minmax(150px,220px) auto auto auto;
  align-items:center;
  gap:8px;
  padding:10px;
  margin-bottom:14px;
  background:var(--bg2);
  border:1px solid var(--accent-border);
  border-radius:var(--radius-lg);
}
.tarefa-composer[hidden]{display:none}
.tarefa-composer input[type="text"],
.tarefa-composer select{
  min-width:0;
  height:36px;
  padding:0 10px;
  background:var(--bg3);
  border:1px solid var(--border2);
  border-radius:var(--radius);
  color:var(--text);
  font:13px var(--font);
  outline:none;
}
.tarefa-composer input[type="text"]:focus,
.tarefa-composer select:focus{border-color:var(--accent)}
.tarefa-compose-home,
.quick-add-home{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:var(--text2);
  font:11px var(--font);
  white-space:nowrap;
  cursor:pointer;
}

#tarefas-list{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-start;
  gap:14px;
  width:100%;
  min-width:0;
}
.cat-section{
  position:relative;
  flex:0 0 auto;
  min-width:300px;
  max-width:min(760px,100%);
  margin:0;
  break-inside:auto;
}
.cat-section.dragging{opacity:.45}
.cat-section.drag-over{
  outline:2px dashed var(--accent);
  outline-offset:3px;
  border-radius:var(--radius-lg);
}
.cat-header{
  display:flex;
  align-items:center;
  gap:8px;
  min-height:42px;
  padding:7px 9px;
  margin:0;
  background:var(--task-cat-bg);
  border:1px solid var(--task-cat-border);
  border-radius:var(--radius-lg) var(--radius-lg) 0 0;
  cursor:default;
}
.cat-section.collapsed .cat-header{border-radius:var(--radius-lg)}
.cat-collapse-btn,
.cat-del,
.task-icon-btn,
.task-home-toggle,
.tarefa-del-btn,
.tarefa-check{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  border:0;
  cursor:pointer;
}
.cat-collapse-btn{
  width:24px;
  height:24px;
  padding:0;
  border-radius:6px;
  background:transparent;
  color:var(--text3);
}
.cat-collapse-btn:hover{background:var(--bg4);color:var(--text)}
.cat-collapse-btn svg{width:17px;height:17px}
.cat-dot{
  width:9px;
  height:9px;
  background:var(--task-cat-color);
  border-radius:50%;
}
.cat-name{
  min-width:0;
  flex:1;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--text);
  font-size:13px;
  font-weight:700;
}
.cat-drag-handle{cursor:grab;user-select:none}
.cat-drag-handle:active{cursor:grabbing}
.cat-count{
  color:var(--text3);
  font:10px var(--mono);
  white-space:nowrap;
}
.cat-del{
  width:28px;
  height:28px;
  padding:0;
  border-radius:6px;
  background:transparent;
  color:var(--text3);
  font-size:14px;
}
.cat-del svg{width:15px;height:15px}
.cat-del:hover{background:var(--bg4);color:var(--accent)}
.cat-task-list{
  overflow:hidden;
  border:1px solid var(--task-cat-border);
  border-top:0;
  border-radius:0 0 var(--radius-lg) var(--radius-lg);
}
.cat-width-handle{
  position:absolute;
  z-index:3;
  top:10px;
  right:-5px;
  bottom:10px;
  width:10px;
  cursor:ew-resize;
  touch-action:none;
}
.cat-width-handle::after{
  content:"";
  position:absolute;
  top:42%;
  left:4px;
  width:2px;
  height:34px;
  border-radius:2px;
  background:transparent;
  transition:background var(--tr);
}
.cat-section:hover .cat-width-handle::after{background:var(--border2)}
body.resizing-task-category,
body.resizing-task-category *{cursor:ew-resize!important;user-select:none!important}

.tarefa-item{
  display:flex;
  align-items:flex-start;
  gap:8px;
  min-width:0;
  padding:8px 8px 8px 10px;
  background:var(--bg2);
  border:0;
  border-left:3px solid var(--task-cat-color);
  border-bottom:1px solid var(--border);
}
.tarefa-item:last-of-type{border-radius:0}
.tarefa-item:hover{background:var(--bg3)}
.tarefa-item.done{opacity:.58}
.tarefa-item.overdue{border-left-color:var(--red)}
.tarefa-check{
  width:19px;
  height:19px;
  margin-top:5px;
  padding:0;
  border:2px solid var(--border2);
  border-radius:5px;
  background:transparent;
  color:#fff;
}
.tarefa-check.checked{background:var(--green);border-color:var(--green)}
.tarefa-check svg{display:none;width:12px;height:12px}
.tarefa-check.checked svg{display:block}
.tarefa-body{flex:1;min-width:0;cursor:text}
.tarefa-title-input,
.tarefa-notes-input,
.tarefa-date-input,
.tarefa-cat-select{
  box-sizing:border-box;
  min-width:0;
  border:1px solid transparent;
  border-radius:6px;
  outline:none;
  background:transparent;
  color:var(--text);
  font-family:var(--font);
  transition:background var(--tr),border-color var(--tr);
}
.tarefa-title-input{
  display:block;
  width:100%;
  padding:3px 5px;
  font-size:13px;
  font-weight:600;
}
.tarefa-title-input:hover,
.tarefa-notes-input:hover,
.tarefa-date-input:hover,
.tarefa-cat-select:hover{background:var(--bg4)}
.tarefa-title-input:focus,
.tarefa-notes-input:focus,
.tarefa-date-input:focus,
.tarefa-cat-select:focus{background:var(--bg);border-color:var(--accent)}
.tarefa-item.done .tarefa-title-input{text-decoration:line-through;color:var(--text3)}
.tarefa-inline-meta{
  display:grid;
  grid-template-columns:minmax(90px,120px) 128px minmax(90px,1fr);
  gap:5px;
  margin-top:2px;
}
.tarefa-date-input,
.tarefa-notes-input,
.tarefa-cat-select{
  width:100%;
  height:26px;
  padding:2px 5px;
  color:var(--text3);
  font-size:10px;
}
.tarefa-date-input{font-family:var(--mono)}
.tarefa-cat-select{cursor:pointer}
.tarefa-date-input.overdue{color:var(--red)}
.tarefa-notes-input::placeholder{color:var(--text3);opacity:.72}
.task-home-toggle,
.tarefa-del-btn{
  width:28px;
  height:28px;
  margin-top:1px;
  padding:0;
  border-radius:7px;
  background:transparent;
  color:var(--text3);
  opacity:.45;
}
.task-home-toggle svg,
.tarefa-del-btn svg{width:15px;height:15px}
.task-home-toggle:hover,
.task-home-toggle.active{background:var(--accent-bg);color:var(--accent);opacity:1}
.tarefa-del-btn:hover{background:rgba(242,95,92,.1);color:var(--red);opacity:1}
.tarefa-item:hover .task-home-toggle,
.tarefa-item:hover .tarefa-del-btn,
.task-home-toggle:focus-visible,
.tarefa-del-btn:focus-visible{opacity:1}
.cat-empty{
  padding:14px;
  border-left:3px solid var(--task-cat-color);
  color:var(--text3);
  font-size:12px;
}
.add-tarefa-row{
  display:block;
  width:100%;
  padding:9px 13px;
  border:0;
  border-left:3px solid var(--task-cat-color);
  background:var(--bg2);
  color:var(--text3);
  text-align:left;
  font:12px var(--font);
  cursor:pointer;
}
.add-tarefa-row:hover{background:var(--bg3);color:var(--accent)}
.quick-add-wrap{
  display:grid;
  grid-template-columns:minmax(100px,1fr) auto 32px 32px;
  align-items:center;
  gap:6px;
  padding:8px;
  border:0;
  border-left:3px solid var(--task-cat-color);
  border-bottom:1px solid var(--border);
  background:var(--bg3);
}
.quick-add-input{
  width:100%;
  min-width:0;
  height:32px;
  box-sizing:border-box;
  padding:5px 8px;
  background:var(--bg2);
  border:1px solid var(--accent-border);
  border-radius:var(--radius);
  color:var(--text);
  font:13px var(--font);
  outline:none;
}
.task-icon-btn{
  width:32px;
  height:32px;
  padding:0;
  border:1px solid var(--border2);
  border-radius:var(--radius);
  background:var(--bg4);
  color:var(--text2);
  font-size:15px;
}
.task-save-btn{border-color:var(--green);background:var(--green);color:#fff}
.task-empty{width:100%}

.home-focus-tasks{margin:18px 0 16px}
.home-focus-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:8px;
}
.home-focus-title{
  color:var(--text3);
  font-size:11px;
  font-weight:700;
  letter-spacing:.7px;
  text-transform:uppercase;
}
.home-focus-count{color:var(--text3);font:10px var(--mono)}
.home-focus-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));
  gap:10px;
}
.home-focus-group{
  min-width:0;
  overflow:hidden;
  border:1px solid var(--border);
  border-top:3px solid var(--task-group-color,var(--accent));
  border-radius:var(--radius);
  background:var(--bg2);
}
.home-focus-group-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:8px 10px;
  border-bottom:1px solid var(--border);
  color:var(--text2);
  font-size:11px;
  font-weight:700;
}
.home-focus-row{
  display:grid;
  grid-template-columns:20px minmax(0,1fr) auto;
  align-items:center;
  gap:7px;
  min-height:38px;
  padding:6px 9px;
  border-bottom:1px solid var(--border);
}
.home-focus-row:last-child{border-bottom:0}
.home-focus-row:hover{background:var(--bg3)}
.home-focus-check{
  width:18px;
  height:18px;
  padding:0;
  border:2px solid var(--border2);
  border-radius:5px;
  background:transparent;
  color:#fff;
  cursor:pointer;
}
.home-focus-check:hover{border-color:var(--green)}
.home-focus-body{min-width:0;cursor:pointer}
.home-focus-task-title{
  overflow:hidden;
  color:var(--text);
  font-size:12px;
  font-weight:600;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.home-focus-task-note{
  overflow:hidden;
  margin-top:1px;
  color:var(--text3);
  font-size:10px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.home-focus-date{color:var(--text3);font:10px var(--mono);white-space:nowrap}
.home-focus-row.overdue .home-focus-date{color:var(--red)}
.home-focus-empty{
  padding:18px;
  border:1px dashed var(--border2);
  border-radius:var(--radius-lg);
  color:var(--text3);
  font-size:12px;
  text-align:center;
}

@media(max-width:900px){
  .tarefa-composer{grid-template-columns:minmax(180px,1fr) minmax(140px,190px) auto}
  .tarefa-compose-home{grid-column:1/2}
}
@media(max-width:768px){
  .tarefa-composer{grid-template-columns:1fr 1fr}
  .tarefa-composer input[type="text"]{grid-column:1/-1}
  .tarefa-compose-home{grid-column:1/-1}
  #tarefas-list{display:block}
  .cat-section{
    width:100%!important;
    max-width:100%;
    min-width:0;
    margin-bottom:12px;
  }
  .cat-width-handle{display:none}
  .tarefa-inline-meta{grid-template-columns:minmax(80px,110px) 118px minmax(70px,1fr)}
  .task-home-toggle,.tarefa-del-btn{opacity:.85}
  .home-focus-grid{grid-template-columns:1fr}
}
@media(max-width:430px){
  .tarefa-composer{grid-template-columns:1fr}
  .tarefa-composer input[type="text"],
  .tarefa-compose-home{grid-column:auto}
  .tarefa-item{gap:6px;padding-left:7px;padding-right:6px}
  .tarefa-inline-meta{grid-template-columns:1fr 1fr}
  .tarefa-notes-input{grid-column:1/-1}
  .tarefa-date-input,.tarefa-notes-input,.tarefa-cat-select{height:28px}
  .quick-add-wrap{grid-template-columns:minmax(80px,1fr) 32px 32px}
  .quick-add-home{grid-column:1/-1;grid-row:2}
}
