/* ═══════════════════════════════════════════════════════════════════
   TAKEYS — Drawer éditable + toasts + inline edit
   ═══════════════════════════════════════════════════════════════════ */

/* ── Drawer ── */
#tk-drawer{position:fixed;inset:0;z-index:80;pointer-events:none}
#tk-drawer.open{pointer-events:auto}
.tk-drawer-backdrop{
  position:absolute;inset:0;background:rgba(10,8,6,0.45);
  opacity:0;transition:opacity .22s ease;backdrop-filter:blur(2px);
}
#tk-drawer.open .tk-drawer-backdrop{opacity:1}
.tk-drawer-panel{
  position:absolute;top:0;right:0;bottom:0;width:min(520px,90vw);
  background:var(--surface);border-left:1px solid var(--border);
  display:flex;flex-direction:column;
  transform:translateX(100%);transition:transform .26s cubic-bezier(.2,.8,.2,1);
  box-shadow:-8px 0 32px rgba(0,0,0,0.2);
}
#tk-drawer.open .tk-drawer-panel{transform:translateX(0)}

.tk-drawer-head{
  display:flex;align-items:flex-start;justify-content:space-between;
  padding:20px 24px 16px;border-bottom:1px solid var(--border);
  background:var(--bg-raised);
}
.tk-drawer-eyebrow{font-size:10px;letter-spacing:0.16em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.tk-drawer-title{font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:500;color:var(--text);letter-spacing:-0.01em;line-height:1.2}
.tk-drawer-title em{color:var(--accent-2);font-style:italic}
.tk-drawer-close{
  background:var(--surface);border:1px solid var(--border);color:var(--text-2);
  width:32px;height:32px;border-radius:8px;font-size:20px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.tk-drawer-close:hover{background:var(--surface-2);color:var(--text)}

.tk-drawer-body{
  flex:1;overflow-y:auto;padding:20px 24px;
}
.tk-drawer-foot{
  display:flex;align-items:center;gap:8px;
  padding:14px 24px;border-top:1px solid var(--border);
  background:var(--bg-raised);
}

/* Fields */
.tk-field{margin-bottom:18px}
.tk-field label{
  display:block;font-size:11px;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--muted);margin-bottom:6px;font-weight:500;
}
.tk-req{color:var(--danger)}
.tk-hint{font-size:11px;color:var(--muted);margin-top:4px;font-style:italic}

.tk-input,.tk-textarea,.tk-select{
  width:100%;background:var(--bg);border:1px solid var(--border);
  border-radius:7px;padding:9px 12px;color:var(--text);
  font-family:inherit;font-size:13.5px;outline:none;transition:border-color .12s;
}
.tk-input:focus,.tk-textarea:focus,.tk-select:focus{border-color:var(--accent-line)}
.tk-textarea{resize:vertical;line-height:1.5;min-height:80px}

/* Chips group */
.tk-chips{display:flex;gap:6px;flex-wrap:wrap}
.tk-chip{
  font-family:inherit;font-size:12px;
  padding:6px 12px;border-radius:18px;
  background:var(--bg);border:1px solid var(--border);color:var(--text-2);
  cursor:pointer;transition:all .12s;
}
.tk-chip:hover{border-color:var(--border-strong);color:var(--text)}
.tk-chip.active{background:var(--accent-dim);color:var(--accent-2);border-color:var(--accent-line);font-weight:500}

/* Checkbox */
.tk-field-inline{display:flex;align-items:center;justify-content:space-between;gap:12px}
.tk-checkbox{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:13px;color:var(--text)}
.tk-checkbox input{width:15px;height:15px;cursor:pointer;accent-color:var(--accent)}

/* Slider */
.tk-slider-wrap{display:flex;align-items:center;gap:12px}
.tk-slider{flex:1;accent-color:var(--accent)}
.tk-slider-val{font-size:13px;color:var(--text);min-width:50px;text-align:right}

/* Subtasks */
.tk-subtasks{display:flex;flex-direction:column;gap:6px}
.tk-subtask{
  display:flex;align-items:center;gap:10px;
  padding:6px 8px;background:var(--bg);border:1px solid var(--border);border-radius:6px;
}
.tk-subtask input[type="checkbox"]{accent-color:var(--accent);cursor:pointer}
.tk-input-inline{flex:1;background:none;border:none;outline:none;color:var(--text);font-family:inherit;font-size:13px}
.tk-subtask-del{
  background:none;border:none;color:var(--muted);cursor:pointer;font-size:16px;
  padding:0 6px;
}
.tk-subtask-del:hover{color:var(--danger)}
.tk-subtask-add{
  background:none;border:1px dashed var(--border-strong);color:var(--muted);
  padding:7px 12px;border-radius:6px;cursor:pointer;font-family:inherit;font-size:12px;
  text-align:left;margin-top:2px;
}
.tk-subtask-add:hover{color:var(--accent-2);border-color:var(--accent-line)}

/* Static / divider */
.tk-field-static label{margin-bottom:4px}
.tk-static-val{font-size:13px;color:var(--text);padding:6px 0}
.tk-divider{
  margin:22px 0 14px;padding-bottom:6px;border-bottom:1px solid var(--border);
  font-size:10px;letter-spacing:0.16em;text-transform:uppercase;color:var(--muted);font-weight:500;
}

/* Actions row */
.tk-actions-row{display:flex;gap:8px;flex-wrap:wrap}

/* Comments */
.tk-comments{display:flex;flex-direction:column;gap:10px}
.tk-comment{background:var(--bg);border:1px solid var(--border);border-radius:7px;padding:8px 12px}
.tk-comment-head{display:flex;justify-content:space-between;font-size:11px;margin-bottom:4px}
.tk-comment-head strong{color:var(--text);font-weight:500}
.tk-comment-head span{color:var(--muted)}
.tk-comment-body{font-size:13px;color:var(--text-2);line-height:1.5}
.tk-empty-mini{font-size:12px;color:var(--muted);font-style:italic;padding:6px 0}
.tk-comment-compose{display:flex;flex-direction:column;gap:6px;margin-top:4px}
.tk-comment-compose .btn{align-self:flex-end}

/* ── Clickable rows / cards ── */
.tk-editable{cursor:pointer;position:relative;transition:background .12s}
.tk-editable::after{
  content:'';position:absolute;top:50%;right:12px;transform:translateY(-50%);
  width:6px;height:6px;border-right:1.5px solid var(--muted);border-bottom:1.5px solid var(--muted);
  transform:translateY(-50%) rotate(-45deg);opacity:0;transition:opacity .12s;
}
.tk-editable:hover::after{opacity:0.6}

/* ── Kanban drag&drop ── */
.kc{user-select:none}
.kc.dragging{opacity:0.5;transform:rotate(1deg)}
.kanban-col.drag-over .kanban-body{
  background:var(--accent-dim);
  outline:2px dashed var(--accent-line);outline-offset:-4px;border-radius:6px;
}

/* Menage card dropzone for prestataire avatar drag */
.mc-prestataire{cursor:pointer}
.mc-prestataire.drag-over{
  background:var(--accent-dim);border-radius:6px;outline:2px dashed var(--accent);outline-offset:2px;
}
.avatar-xs.dragging,.avatar-md.dragging{opacity:0.5;cursor:grabbing}

/* Inline status pills that are clickable */
.mc-status .pill{cursor:pointer;transition:filter .12s}
.mc-status .pill:hover{filter:brightness(1.15)}

/* Inline edit feedback */
.tk-flash-ok{animation:tkFlashOk .8s ease}
@keyframes tkFlashOk{
  0%{background:var(--accent-dim)}
  100%{background:transparent}
}

/* Quick action dropdown */
.tk-menu{
  position:absolute;z-index:70;
  background:var(--surface);border:1px solid var(--border);border-radius:8px;
  box-shadow:var(--shadow-lg);padding:4px;min-width:180px;
  display:flex;flex-direction:column;gap:2px;
}
.tk-menu-item{
  padding:7px 10px;border-radius:5px;cursor:pointer;
  font-size:13px;color:var(--text);background:none;border:none;
  text-align:left;font-family:inherit;display:flex;align-items:center;gap:8px;
}
.tk-menu-item:hover{background:var(--surface-2)}
.tk-menu-item.danger{color:var(--danger)}
.tk-menu-divider{height:1px;background:var(--border);margin:3px 0}

/* Floating compose for "+ Nouveau" */
.tk-inline-form{
  background:var(--bg-raised);border:1px solid var(--accent-line);border-radius:8px;
  padding:12px;margin-bottom:10px;
}

/* Hover affordances on editable lists */
.msg-row.tk-editable:hover,
.men-row.tk-editable:hover,
.alert-detail.tk-editable:hover,
.menage-card.tk-editable:hover,
.guest-row.tk-editable:hover{
  background:var(--surface-2);
}

/* Drag handle cursor */
.avatar-xs[draggable="true"]{cursor:grab}
.avatar-md[draggable="true"]{cursor:grab}