/* ══════════════════════════════════════
   SHARED COMPONENTS
══════════════════════════════════════ */

/* ── Avatar ── */
.avatar{
  width:28px;height:28px;border-radius:50%;
  background:var(--amber);display:flex;align-items:center;justify-content:center;
  font-family:'Syne',sans-serif;font-size:10px;font-weight:800;
  color:var(--white);flex-shrink:0;
}
.avatar.sm{width:22px;height:22px;font-size:9px;}
.avatar.xs{width:18px;height:18px;font-size:8px;}

/* ── Button: New ── */
.btn-new{
  font-family:'Syne',sans-serif;font-size:11px;font-weight:700;
  letter-spacing:.8px;text-transform:uppercase;
  background:var(--amber);color:var(--white);
  padding:8px 14px;border-radius:var(--r);
  border:none;cursor:pointer;display:flex;align-items:center;gap:6px;
  transition:background .2s;flex-shrink:0;-webkit-appearance:none;
}
.btn-new:active{background:var(--amber-lt);}
.btn-new svg{width:14px;height:14px;flex-shrink:0;}
/* icon-only on mobile */
.btn-new-label{display:inline;}

/* ── Toast ── */
.toast-wrap{
  position:fixed;bottom:calc(var(--bot-h) + 12px + var(--safe-b));right:16px;
  z-index:900;display:flex;flex-direction:column;gap:7px;pointer-events:none;
}
.toast{
  background:var(--ink);color:var(--bg);
  padding:10px 16px;border-radius:var(--r);
  font-family:'Syne',sans-serif;font-size:11px;font-weight:700;letter-spacing:.3px;
  box-shadow:0 4px 16px rgba(14,14,12,.25);
  animation:toastIn .3s ease;pointer-events:auto;
  display:flex;align-items:center;gap:8px;
}
.toast.success{background:var(--green);}
.toast.warn{background:var(--amber);}
@keyframes toastIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}

/* ── Divider ── */
.divider{height:1px;background:var(--line);margin:14px 0;}

/* ── Shell ── */
.shell{flex:1;display:flex;overflow:hidden;min-height:0;}

/* ── Main ── */
.main{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0;}

/* ── Priority badges ── */
.priority-badge{
  font-family:'Syne',sans-serif;font-size:7px;font-weight:700;
  letter-spacing:1.5px;text-transform:uppercase;
  padding:2px 6px;border-radius:100px;flex-shrink:0;margin-top:1px;
}
.p-low{background:#f0f0ec;color:var(--muted);}
.p-medium{background:rgba(217,123,43,.1);color:var(--amber);}
.p-high{background:rgba(184,60,43,.08);color:var(--red);}
.p-critical{background:var(--red);color:var(--white);}

/* ── Tag ── */
.tag{
  font-family:'Syne',sans-serif;font-size:8px;font-weight:700;
  letter-spacing:1px;text-transform:uppercase;padding:2px 6px;border-radius:100px;
}

/* ══ Confirm Modal ══ */
@keyframes confirmFadeIn{from{opacity:0}to{opacity:1}}
.confirm-modal-card{
  background:var(--white);border-radius:8px;width:100%;max-width:380px;
  padding:28px 24px 20px;margin:16px;text-align:center;
  box-shadow:0 16px 48px rgba(14,14,12,.2);
  animation:confirmSlideIn .2s ease;
}
@keyframes confirmSlideIn{from{opacity:0;transform:scale(.95) translateY(8px)}to{opacity:1;transform:scale(1) translateY(0)}}
.confirm-modal-icon{margin-bottom:14px;}
.confirm-modal-title{
  font-family:'Syne',sans-serif;font-size:16px;font-weight:800;
  color:var(--ink);letter-spacing:-.3px;margin-bottom:6px;
}
.confirm-modal-message{
  font-size:13px;font-weight:300;color:var(--muted);line-height:1.5;
  margin-bottom:20px;max-width:300px;margin-left:auto;margin-right:auto;
}
.confirm-modal-btns{display:flex;gap:8px;justify-content:center;}
.confirm-modal-btn{
  flex:1;max-width:160px;padding:10px 20px;border-radius:var(--r);
  font-family:'Syne',sans-serif;font-size:11px;font-weight:700;
  letter-spacing:.5px;cursor:pointer;transition:all .2s;border:1px solid var(--line);
}
.confirm-modal-btn.cancel{background:transparent;color:var(--muted);}
.confirm-modal-btn.cancel:hover{border-color:var(--ink2);color:var(--ink2);}
.confirm-modal-btn.confirm{border:none;}
.confirm-modal-btn.confirm:hover{opacity:.9;}