/* =========================================================
   MÒDUL: Tasques (Avui / Urgent / Semiurgent)
   Parteix de base.css (variables, tipografia, botons genèrics).
   ========================================================= */

.carrils{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px;align-items:start}
@media(max-width:900px){.carrils{grid-template-columns:1fr}}

.carril{border-radius:var(--radi);overflow:hidden;background:var(--card);border:1px solid var(--linia);box-shadow:var(--ombra)}
.carril-cap{padding:15px 18px;display:flex;align-items:center;gap:10px;background:var(--card)}
.carril-cap .punt-color{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.c-avui .punt-color{background:var(--verd-fort)}
.c-urgent .punt-color{background:var(--vermell)}
.c-semiurgent .punt-color{background:var(--blau-fort)}
.carril-cap h2{font-size:14px;font-weight:700;color:var(--tinta)}
.bt-periodiques-mini{font-size:13px;width:22px;height:22px;border-radius:7px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.bt-periodiques-mini:hover{background:var(--lila-clar,#f5eefa)}
.carril-cap .comptador{margin-left:auto;background:#f1f3f2;color:var(--gris);border-radius:20px;min-width:22px;text-align:center;padding:2px 9px;font-size:11.5px;font-weight:700}
.c-avui .comptador{background:var(--verd-clar);color:var(--verd-fort)}
.c-urgent .comptador{background:var(--vermell-clar);color:var(--vermell)}
.c-semiurgent .comptador{background:var(--blau-clar);color:var(--blau-fort)}

.carril-cos{padding:12px;min-height:90px;max-height:62vh;overflow-y:auto;transition:background .15s;scrollbar-width:thin;scrollbar-color:var(--linia-forta) transparent}
.carril-cos::-webkit-scrollbar{width:6px}
.carril-cos::-webkit-scrollbar-track{background:transparent}
.carril-cos::-webkit-scrollbar-thumb{background:var(--linia-forta);border-radius:10px}
.carril-cos::-webkit-scrollbar-thumb:hover{background:var(--gris-clar)}
.carril-cos::-webkit-scrollbar-button{display:none;width:0;height:0}
.carril-cos.arrossegant-sobre{background:var(--verd-clar);box-shadow:inset 0 0 0 2px var(--verd-mig)}

/* ---------- Secció separada: Pendent de resposta (mateixos 3 nivells
   d'urgència que "A fer", agrupats a banda, en una franja pròpia
   taronja perquè es distingeixi clarament — no és només una línia
   discreta, és un bloc contingut amb el seu propi padding) ---------- */
.pendents-resposta-wrap{margin-top:22px;padding:16px;border-radius:14px;background:var(--taronja-clar);border:1px solid #ffe0b8}
.pendents-resposta-titol{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;font-weight:800;color:var(--taronja);margin-bottom:12px}
.pendents-resposta-titol .comptador{background:#fff;color:var(--taronja);border-radius:20px;min-width:20px;text-align:center;padding:2px 9px;font-size:11.5px}
.carrils-pend .carril{border-top-color:var(--taronja)}
.carrils-pend .punt-color{background:var(--taronja) !important}
.carrils-pend .comptador{background:var(--taronja-clar) !important;color:var(--taronja) !important}
@media(max-width:480px){.pendents-resposta-wrap{padding:12px}.pendents-resposta-titol{font-size:12px}}

/* ---------- Targeta de tasca ---------- */
.tasca{border:1px solid var(--linia);border-radius:var(--radi-petit);margin-bottom:9px;background:#fff;transition:box-shadow .16s,transform .16s,border-color .16s;cursor:grab}
.tasca:hover{border-color:var(--linia-forta);box-shadow:var(--ombra-hover);transform:translateY(-1px)}
.tasca.arrossegant{opacity:.4}

.tasca-cap{padding:12px 13px;display:flex;align-items:flex-start;gap:10px;cursor:pointer}
.chk{width:20px;height:20px;border:2px solid #ccd4cf;border-radius:7px;flex-shrink:0;margin-top:1px;transition:.15s;position:relative}

.tasca.tasca-completant{opacity:.55;transition:opacity .5s ease}
.tasca-completant .chk{background:var(--verd-fort);border-color:var(--verd-fort);transform:scale(1.1)}
.tasca-completant .chk::after{content:'✓';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:13px;font-weight:800;animation:check-apareix .25s ease-out}
.tasca-completant .t-titol{text-decoration:line-through;color:var(--gris-clar)}
@keyframes check-apareix{from{transform:scale(0)}to{transform:scale(1)}}
.chk:hover{border-color:var(--verd-mig);background:var(--verd-clar)}

.t-cos{flex:1;min-width:0}
.t-titol{font-size:13.5px;font-weight:600;line-height:1.4;color:var(--tinta)}
.t-meta{display:flex;gap:6px;align-items:center;margin-top:7px;flex-wrap:wrap}
.pill.ajorn{background:var(--taronja-clar);color:var(--taronja)}
.pill.periodica{background:var(--lila-clar);color:var(--lila)}
.pill.delegada,.pill.peticio-de{cursor:pointer;transition:.15s}
.pill.delegada{background:var(--taronja-clar);color:var(--taronja)}
.pill.peticio-de{background:var(--lila-clar);color:var(--lila)}
.pill.delegada:hover,.pill.peticio-de:hover{filter:brightness(.92)}

/* ---------- Accessos ràpids a la banda dreta de la targeta tancada ---------- */
.t-accions-rapides{display:flex;gap:2px;flex-shrink:0;margin-top:1px}
.icon-bt-mini{width:27px;height:27px;display:inline-flex;align-items:center;justify-content:center;border-radius:7px;border:none;background:transparent;color:var(--gris);font-size:13px;text-decoration:none;transition:.15s;opacity:.5}
.icon-bt-mini:hover{opacity:1;background:#f1f3f2}
.icon-bt-mini.actiu{opacity:1;color:var(--taronja);background:var(--taronja-clar)}
@media(max-width:480px){.icon-bt-mini{width:24px;height:24px;font-size:12px}}

/* ---------- Detall desplegable ---------- */
.t-detall{padding:0 13px 13px 43px;display:none}
.t-detall.obert{display:block;animation:desplega .15s ease-out}
@keyframes desplega{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.t-detall textarea{width:100%;min-height:64px;border:1px solid var(--linia-forta);border-radius:10px;padding:9px 10px;resize:vertical;background:#fbfcfb}
.t-detall .t-input-titol{width:100%;margin-bottom:8px;padding:9px 10px;border:1px solid var(--linia-forta);border-radius:10px;background:#fbfcfb;font-size:13.5px;font-weight:700}
.t-detall .t-input-titol:focus{background:#fff}
.t-detall .t-select-linia{width:100%;margin-bottom:8px;padding:8px 10px;border:1px solid var(--linia-forta);border-radius:10px;background:#fbfcfb;font-size:12.5px}
.t-detall .t-select-linia:focus{background:#fff}
.t-detall textarea:focus{background:#fff}
.t-detall input[type=url]{width:100%;margin-top:8px;padding:9px 10px;border:1px solid var(--linia-forta);border-radius:10px;background:#fbfcfb}
.t-detall input[type=url]:focus{background:#fff}

.t-detall .accions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;align-items:center}
.t-detall .accions .guardar{background:var(--verd-fort);color:#fff;border:1px solid var(--verd-fort);border-radius:9px;padding:8px 15px;font-size:12px;font-weight:700;transition:.15s;display:inline-flex;align-items:center;gap:6px}
.t-detall .accions .guardar:hover{background:var(--verd-mig)}

.accions-icones{display:flex;gap:6px;flex-wrap:wrap}
.icon-bt{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border-radius:9px;border:1px solid var(--linia-forta);background:#fff;font-size:15px;flex-shrink:0;text-decoration:none;transition:.15s}
.icon-bt:hover{background:#f4f5f4}
.icon-bt.tog-resposta{color:var(--taronja);border-color:var(--taronja-clar,#ffe6cc)}
.icon-bt.tog-resposta:hover{background:var(--taronja-clar,#ffe6cc)}
.icon-bt.delegar{color:var(--lila);border-color:var(--lila-clar)}
.icon-bt.delegar:hover{background:var(--lila-clar)}
.icon-bt.crear-modul{color:var(--blau-fort);border-color:var(--blau-clar)}
.icon-bt.crear-modul:hover{background:var(--blau-clar)}
.icon-bt.moure-bloc{color:var(--teal);border-color:var(--teal-clar)}
.icon-bt.moure-bloc:hover{background:var(--teal-clar)}

.moure-bloc-fila{display:flex;gap:7px;margin-top:9px;flex-wrap:wrap}
.moure-bloc-opcio{flex:1;min-width:100px;padding:8px;font-size:11.5px;font-weight:700;color:var(--teal);background:var(--teal-clar);border-radius:9px}
.moure-bloc-opcio:hover{filter:brightness(.95)}
.icon-bt.esborrar{color:var(--gris);margin-left:auto}
.icon-bt.esborrar:hover{color:var(--vermell);background:var(--vermell-clar);border-color:#f3c6c6}
@media(max-width:480px){.icon-bt{width:32px;height:32px;font-size:14px}.icon-bt.esborrar{margin-left:0}}

.delegar-fila{margin-top:9px;padding:9px;background:var(--lila-clar);border-radius:10px}
.delegar-persones{max-height:170px;overflow-y:auto;display:flex;flex-direction:column;gap:2px;margin-bottom:8px}
.delegar-carregant{font-size:12px;color:var(--gris);padding:6px}
.delegar-persona-item{display:flex;align-items:center;gap:8px;font-size:12.5px;padding:6px 7px;border-radius:7px;cursor:pointer;transition:.12s}
.delegar-persona-item:hover{background:#fff}
.delegar-persona-item input{width:15px;height:15px;flex-shrink:0}
.delegar-accions-fila{display:flex;gap:7px}
.delegar-confirmar{background:var(--lila);color:#fff;border-radius:8px;padding:7px 12px;font-size:11.5px;font-weight:700}
.delegar-confirmar:hover{background:#571a80}
.delegar-cancelar{color:var(--gris);font-size:11.5px;padding:7px 10px}
.delegar-cancelar:hover{color:var(--vermell)}

/* ---------- Camp per afegir tasca ---------- */
.tasques-cerca-fila{display:flex;flex-wrap:wrap;gap:9px;align-items:center;margin-bottom:14px}
#cerca-tasques{flex:1;min-width:220px;padding:9px 14px;border:1px solid var(--linia-forta);border-radius:20px;background:#fbfcfb;font-size:12.5px}
#cerca-tasques:focus{background:#fff;border-color:var(--verd-mig)}
.tasques-filtre-linia{display:flex;flex-wrap:wrap;gap:6px}
.filtre-linia-bt{font-size:11px;font-weight:700;padding:6px 12px;border-radius:20px;border:1px solid var(--linia-forta);background:#fbfcfb;color:var(--gris)}
.filtre-linia-bt:hover{background:#fff}
.filtre-linia-bt.on{background:currentColor;color:#fff !important;border-color:transparent}
.filtre-linia-bt[data-linia="totes"].on{background:#2c2c2c;color:#fff !important}

.afegir-card{padding:9px 12px 12px}
.afegir-fila-simple{display:flex;gap:7px}
.afegir-titol{flex:1;padding:10px 12px;border:1.5px dashed var(--linia-forta);border-radius:var(--radi-petit);background:transparent;transition:.15s}
.afegir-titol:focus{border-style:solid;border-color:var(--verd-mig);background:#fff}
.afegir-titol::placeholder{color:var(--gris-clar)}
.afegir-bt{width:38px;flex-shrink:0;border:1.5px solid var(--verd-mig);border-radius:var(--radi-petit);background:var(--verd-clar);color:var(--verd-fort);font-size:17px;font-weight:700}
.afegir-bt:hover{background:var(--verd-fort);color:#fff}

.afegir-expandit{margin-top:8px;padding:10px;background:#fbfcfb;border:1px solid var(--linia);border-radius:var(--radi-petit);display:flex;flex-direction:column;gap:7px;animation:afegir-apareix .15s ease-out}
@keyframes afegir-apareix{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.afegir-desc{width:100%;resize:vertical;border:1px solid var(--linia-forta);border-radius:8px;padding:7px 9px;font-family:inherit;font-size:12.5px;background:#fff}
.afegir-linia{border:1px solid var(--linia-forta);border-radius:8px;padding:7px 9px;font-size:12px;background:#fff}
.afegir-accions-exp{display:flex;gap:7px}
.afegir-confirmar{background:var(--verd-fort);color:#fff;border-radius:8px;padding:7px 14px;font-size:11.5px;font-weight:700}
.afegir-confirmar:hover{background:var(--verd-mig)}
.afegir-cancelar{color:var(--gris);font-size:11.5px;padding:7px 10px}
.afegir-cancelar:hover{color:var(--vermell)}

.t-data{font-size:10px;color:var(--gris-clar);margin-top:3px}

/* ---------- Tasca ja completada avui: gris, amb botó de revertir ---------- */
.separador-acabades{border-top:1px dashed var(--linia);margin:4px 13px}
.tasca-acabada{opacity:.6}
.tasca-cap-acabada{cursor:default}
.chk-fet{background:#dfe3e1;border-color:#dfe3e1;position:relative}
.chk-fet::after{content:'';position:absolute;left:5px;top:2px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.t-titol-acabada{text-decoration:line-through;color:var(--gris)}
.pill.acabada{background:#eef1f0;color:var(--gris)}
.bt-revertir{color:var(--gris);align-self:flex-start;margin-top:1px}
.bt-revertir:hover{color:var(--verd-fort);background:var(--verd-clar)}

/* ---------- Resum plegable de les acabades (evita una paret de
   tatxades quan n'hi ha moltes, típic amb periòdiques) ---------- */
.toggle-acabades{display:flex;align-items:center;gap:6px;width:100%;padding:9px 13px;font-size:11.5px;font-weight:700;color:var(--gris);background:transparent}
.toggle-acabades:hover{color:var(--verd-fort);background:var(--verd-clar)}
.toggle-acabades .fletxa-acabades{transition:transform .15s;margin-left:auto}
.toggle-acabades.obert .fletxa-acabades{transform:rotate(180deg)}
.llista-acabades{border-top:1px dashed var(--linia)}

/* ---------- Confeti: celebració grossa en buidar els tres carrils ---------- */
.confeti-peca{position:fixed;top:-20px;width:9px;height:9px;border-radius:2px;z-index:300;pointer-events:none;animation:confeti-caure linear forwards}
@keyframes confeti-caure{
  0%{transform:translateY(0) rotate(0deg);opacity:1}
  100%{transform:translateY(105vh) rotate(540deg);opacity:.3}
}

/* ---------- Tasques de tercers (dins del mòdul de Tasques) ---------- */
.tt-wrap{margin-top:20px;padding-top:18px;border-top:1px solid var(--linia)}
.tt-titol{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.tt-icona{width:32px;height:32px;border-radius:10px;background:linear-gradient(135deg,var(--teal),var(--blau-fort));display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}
.tt-titol-txt{font-size:14.5px;font-weight:800;color:var(--tinta)}
.tt-sub{font-size:11px;color:var(--gris);font-weight:500}

.tt-tabs{display:flex;gap:8px;margin-bottom:12px}
.tt-tab{font-size:12px;font-weight:700;color:var(--gris);background:#f2f4f3;border-radius:20px;padding:6px 14px;display:flex;align-items:center;gap:6px}
.tt-tab .comptador{background:rgba(0,0,0,.08);border-radius:20px;padding:0 6px;font-size:10px}
.tt-tab.on{background:var(--verd-fort);color:#fff}
.tt-tab.on .comptador{background:rgba(255,255,255,.25)}

.tt-panell{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:8px}

.tt-card{border:1px solid var(--linia);border-radius:10px;padding:9px 11px;background:#fff}
.tt-card-cap{display:flex;align-items:center;gap:6px;margin-bottom:7px}
.tt-card-qui{display:flex;flex-direction:column;line-height:1.2;min-width:0;flex:1}
.tt-card-etiq{font-size:8.5px;color:var(--gris-clar);font-weight:600}
.tt-card-nom{font-size:11px;font-weight:700;color:var(--tinta);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tt-card .avatar-mini{width:22px;height:22px;font-size:9px;flex-shrink:0}
.tt-card .pill{font-size:9px;padding:2px 7px;flex-shrink:0}
.tt-card-titol{font-size:11.5px;font-weight:600;color:var(--tinta);line-height:1.35;margin-bottom:6px}
.tt-card-pills{margin-bottom:6px}
.tt-card-pills .pill-vencuda{background:var(--vermell-clar);color:var(--vermell)}
.tt-card .pp-item-comentari{font-size:10px;margin-bottom:6px}
.tt-card-accions{display:flex;flex-wrap:wrap;gap:4px}
.tt-card-accions .pp-bt-accio{font-size:9.5px;padding:4px 7px;flex:1 1 auto;white-space:nowrap}

@media(max-width:480px){
  .tt-panell{grid-template-columns:1fr}
}