/* ===== Project Team · Workforce Planner (project-team.js, 2026-10) =====
   Every class here is pt- prefixed; nothing restyles an existing class.
   Avatar sizing runs off one custom property (--pt-size) so the same markup
   serves 18px hero chips, 22px project cards and 34px Project Data rows.
   --pt-sep is the ring that separates overlapping avatars: white on light
   surfaces, charcoal inside the dark dashboard hero. */

/* ---------- avatars + stacks ---------- */
.pt-av{position:relative;width:var(--pt-size,26px);height:var(--pt-size,26px);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff;font-family:var(--font);font-size:calc(var(--pt-size,26px) * 0.4);font-weight:700;letter-spacing:0.02em;line-height:1;box-shadow:0 0 0 2px var(--pt-sep,#fff);user-select:none;cursor:default;font-variant-numeric:tabular-nums}
/* Lead = brand-red ring with a hairline gap, readable at any size. */
.pt-av-lead{box-shadow:0 0 0 1.5px var(--pt-sep,#fff),0 0 0 3px #E70000}
.pt-av-more{background:var(--gray-200,#E5E5E5);color:var(--gray-700,#404040);font-family:var(--mono);font-size:calc(var(--pt-size,26px) * 0.36);letter-spacing:-0.02em}
.pt-stack{display:inline-flex;align-items:center;vertical-align:middle;padding:3px 0 3px 3px;--pt-size:26px}
.pt-stack .pt-av+.pt-av{margin-left:calc(var(--pt-size,26px) * -0.14)}
.pt-ghost{display:inline-flex;align-items:center;gap:5px;height:var(--pt-size,26px);padding:0 9px;border:1px dashed var(--gray-300,#D4D4D4);border-radius:999px;background:transparent;color:var(--gray-400,#A3A3A3);font-family:var(--font);font-size:11px;font-weight:500;line-height:1;white-space:nowrap;vertical-align:middle}
.pt-ghost i{font-size:9.5px}
/* All Projects card row: centre the label against the avatar stack. */
.proj-card-meta-row:has(> .proj-card-meta-val > .pt-stack),
.proj-card-meta-row:has(> .proj-card-meta-val > .pt-ghost){align-items:center}

/* ---------- dashboard hero chips (dark photo overlay) ---------- */
.pt-hero{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;vertical-align:middle;--pt-sep:#1A1A1F}
.pt-hero-chip{display:inline-flex;align-items:center;gap:7px;height:26px;max-width:260px;margin:0;padding:0 11px 0 4px;background:rgba(255,255,255,0.12);border:1px solid rgba(255,255,255,0.24);border-radius:20px;color:#fff;font-family:var(--font);font-size:11px;font-weight:600;letter-spacing:0.01em;line-height:1;text-shadow:0 1px 2px rgba(0,0,0,0.35);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;transition:background .15s,border-color .15s}
.pt-hero-chip:hover{background:rgba(255,255,255,0.2);border-color:rgba(255,255,255,0.42)}
.pt-hero-chip:focus-visible{outline:2px solid #fff;outline-offset:2px}
.pt-hero-tag{display:inline-flex;align-items:center;height:18px;padding:0 6px;border-radius:10px;background:#E70000;color:#fff;font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.08em;text-shadow:none;flex-shrink:0}
.pt-hero-tag-est{background:rgba(255,255,255,0.2)}
.pt-hero-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pt-hero-more{font-family:var(--mono);font-size:10px;color:rgba(255,255,255,0.72)}
.pt-hero-est{padding-right:8px}
.pt-hero .pt-stack{padding:0 0 0 2px}
.pt-hero .pt-av{cursor:pointer;text-shadow:none}
.pt-hero .pt-av-more{background:rgba(255,255,255,0.22);color:#fff}
.pt-hero-add{padding:0 11px;border-style:dashed;background:rgba(255,255,255,0.06);color:rgba(255,255,255,0.85)}
.pt-hero-add i{font-size:9.5px}

/* ---------- Project Data card ---------- */
.pt-group+.pt-group{margin-top:14px}
.pt-group-head{display:flex;align-items:center;gap:7px;margin-bottom:7px;font-size:10px;font-weight:700;color:var(--gray-500,#737373);text-transform:uppercase;letter-spacing:0.08em}
.pt-dot{width:6px;height:6px;border-radius:50%;background:var(--gray-400,#A3A3A3);flex-shrink:0}
.pt-group-lead .pt-dot,.pt-section-lead .pt-dot{background:#E70000}
.pt-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:16px;padding:0 5px;border-radius:8px;background:var(--gray-100,#F5F5F5);color:var(--gray-600,#525252);font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:0;font-variant-numeric:tabular-nums}
.pt-person{display:flex;align-items:center;gap:12px;padding:9px 11px;border:1px solid var(--gray-200,#E5E5E5);border-radius:10px;background:#fff}
.pt-person+.pt-person{margin-top:6px}
.pt-person-lead{border-color:rgba(231,0,0,0.22);background:linear-gradient(90deg,rgba(231,0,0,0.045),#fff 70%)}
.pt-person-main{flex:1;min-width:0}
.pt-person-name{display:flex;align-items:center;gap:6px;min-width:0;font-size:13px;font-weight:700;color:var(--gray-900,#171717)}
.pt-ellipsis{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pt-person-email{margin-top:1px;font-size:11px;color:var(--gray-500,#737373);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pt-person-load{margin-top:3px;font-size:10.5px;color:var(--gray-500,#737373)}
.pt-person-load b{font-family:var(--mono);font-weight:600;color:var(--gray-800,#262626);font-variant-numeric:tabular-nums}
.pt-you{flex-shrink:0;padding:1px 6px;border-radius:8px;background:rgba(231,0,0,0.08);color:#E70000;font-size:9px;font-weight:700;letter-spacing:0.04em;text-transform:uppercase}
.pt-group-none{padding:8px 11px;border:1px dashed var(--gray-200,#E5E5E5);border-radius:10px;font-size:12px;color:var(--gray-400,#A3A3A3)}
.pt-card-empty{padding:20px 16px;border:1px dashed var(--gray-300,#D4D4D4);border-radius:12px;background:var(--gray-50,#FAFAFA);text-align:center;font-size:12px;line-height:1.5;color:var(--gray-500,#737373)}
.pt-card-empty>i{display:block;margin-bottom:8px;font-size:20px;color:var(--gray-300,#D4D4D4)}
.pt-card-empty-title{margin-bottom:2px;font-size:13px;font-weight:700;color:var(--gray-800,#262626)}

/* ---------- edit modal ---------- */
.pt-modal-intro{margin:-6px 0 14px;font-size:12px;line-height:1.5;color:var(--gray-500,#737373)}
.pt-modal-ro{display:flex;align-items:center;gap:7px;padding:8px 11px;border-radius:8px;background:var(--gray-50,#FAFAFA);border:1px solid var(--gray-200,#E5E5E5)}
.pt-modal-loading{padding:26px 4px;font-size:12px;color:var(--gray-400,#A3A3A3)}
.pt-section{padding:13px 14px;border:1px solid var(--gray-200,#E5E5E5);border-radius:12px;background:var(--gray-50,#FAFAFA)}
.pt-section+.pt-section{margin-top:12px}
.pt-section-lead{border-color:rgba(231,0,0,0.22);background:linear-gradient(180deg,rgba(231,0,0,0.035),rgba(231,0,0,0.01))}
.pt-section-head{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.pt-section-title{font-size:12.5px;font-weight:700;color:var(--gray-900,#171717)}
.pt-section-hint{margin-left:auto;font-size:11px;color:var(--gray-400,#A3A3A3);text-align:right}
.pt-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-height:32px;margin-bottom:10px}
.pt-chip{display:inline-flex;align-items:center;gap:7px;max-width:100%;padding:3px;background:#fff;border:1px solid var(--gray-200,#E5E5E5);border-radius:999px;font-size:12px;font-weight:600;color:var(--gray-800,#262626);animation:pt-fade .16s ease}
.pt-chip .pt-av{box-shadow:none}
.pt-chip-lead{border-color:rgba(231,0,0,0.35)}
.pt-chip-ro{padding-right:11px}
.pt-chip-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pt-chip-meta{flex-shrink:0;font-size:10.5px;font-weight:500;color:var(--gray-400,#A3A3A3)}
.pt-chip-x{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:22px;height:22px;margin:0;padding:0;border:none;border-radius:50%;background:transparent;color:var(--gray-400,#A3A3A3);font-size:10.5px;cursor:pointer;transition:background .12s,color .12s}
.pt-chip-x:hover{background:rgba(231,0,0,0.08);color:#E70000}
.pt-chip-x:focus-visible{outline:2px solid #E70000;outline-offset:1px}
.pt-chips-none{font-size:12px;font-style:italic;color:var(--gray-400,#A3A3A3)}
.pt-add-select{font-size:12.5px}
@keyframes pt-fade{from{opacity:0;transform:translateY(2px)}to{opacity:1;transform:none}}

@media (max-width:768px){
  .pt-section-head{flex-wrap:wrap}
  .pt-section-hint{flex-basis:100%;margin-left:14px;text-align:left}
  .pt-hero-chip{max-width:200px}
}

/* The project hero is charcoal (+ cover photo); the legacy status chip was
   tuned for a light header and all but vanished beside the team chips. */
body .dash-header .dash-status-chip{background:rgba(255,255,255,0.12);border-color:rgba(255,255,255,0.22);color:#fff}
body .dash-header .dash-status-chip.pursuit::before{background:#FF5A5A}
body .dash-header .dash-status-chip.active::before{background:#34D399}
body .dash-header .dash-status-chip.awarded::before{background:#60A5FA}