/* Pick Tracker modal (Drop 2b-ii). Theme-aware tokens throughout so it reads
   on light and dark. Width follows the Commissioner Tools convention:
   min(960px, 99vw) — 96vw still caused horizontal scroll on iPad. */
.pt-overlay {
    position: fixed;
    inset: 0;
    z-index: 10000;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 4vh 8px;
    overflow-y: auto;
}
.pt-modal {
    width: min(960px, 99vw);
    background: var(--jt-bg-elevated, #fff);
    color: var(--jt-text-primary);
    border-radius: 12px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    max-height: 92vh;
}
.pt-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    border-bottom: 0.5px solid var(--jt-border-muted, #e5e7eb);
}
.pt-header h2 { font-size: 17px; font-weight: 600; margin: 0; }
.pt-close {
    background: transparent; border: none; font-size: 24px; line-height: 1;
    color: var(--jt-text-tertiary); cursor: pointer; padding: 0 4px;
}
.pt-close:hover { color: var(--jt-text-primary); }
.pt-body { padding: 16px 18px; overflow-y: auto; }

.pt-section-label {
    display: flex; align-items: center; gap: 8px;
    font-size: 13px; font-weight: 600; text-transform: uppercase;
    letter-spacing: 0.03em; color: var(--jt-text-secondary);
    margin-bottom: 8px;
}
.pt-count { font-weight: 500; color: var(--jt-text-tertiary); text-transform: none; }
.pt-help { font-size: 12px; color: var(--jt-text-secondary); margin: 0 0 8px; line-height: 1.5; }

.pt-paste {
    width: 100%; box-sizing: border-box;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 12px; line-height: 1.4;
    padding: 8px 10px; border-radius: 8px;
    border: 0.5px solid var(--jt-border-muted, #d1d5db);
    background: var(--jt-bg-subtle, rgba(0,0,0,.02));
    color: var(--jt-text-primary);
    resize: vertical;
}
.pt-paste-actions { display: flex; align-items: center; gap: 12px; margin-top: 8px; }
.pt-parse-result { font-size: 12px; color: var(--jt-text-secondary); }
.pt-unresolved {
    margin-top: 8px; padding: 8px 10px; border-radius: 6px;
    font-size: 12px; line-height: 1.5;
    background: var(--jt-accent-amber-subtle, rgba(245,158,11,.1));
    border: 0.5px solid var(--jt-accent-amber, #f59e0b);
    color: var(--jt-text-primary);
}

.pt-btn {
    font-size: 13px; font-weight: 500; padding: 7px 14px;
    border-radius: 7px; cursor: pointer; border: 0.5px solid transparent;
}
.pt-btn-primary {
    background: var(--jt-accent-purple, #7c6af7);
    border-color: var(--jt-accent-purple, #7c6af7); color: #fff;
}
.pt-btn-primary:hover { background: var(--jt-accent-purple-hover, #9180f9); }
.pt-btn-ghost {
    background: transparent; border-color: var(--jt-border-muted, #d1d5db);
    color: var(--jt-text-secondary); padding: 4px 10px; font-size: 12px;
}
.pt-btn-ghost:hover { background: var(--jt-bg-hover); color: var(--jt-text-primary); }
.pt-clear { margin-left: auto; }

.pt-marked-section { margin-top: 22px; }
.pt-marked-list {
    border: 0.5px solid var(--jt-border-muted, #e5e7eb);
    border-radius: 8px; overflow: hidden;
}
.pt-empty { padding: 16px; font-size: 13px; color: var(--jt-text-tertiary); text-align: center; }
.pt-row {
    display: flex; align-items: center; justify-content: space-between;
    padding: 8px 12px;
    border-bottom: 0.5px solid var(--jt-border-muted, #f0f0f0);
}
.pt-row:last-child { border-bottom: none; }
.pt-row-main { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; flex: 1 1 auto; min-width: 120px; }
.pt-row-name { font-weight: 500; font-size: 14px; }
.pt-row-meta { font-size: 12px; color: var(--jt-text-tertiary); }
.pt-row-attr { font-size: 12px; color: var(--jt-accent-purple, #7c6af7); }
.pt-unmark {
    font-size: 12px; padding: 3px 10px; border-radius: 5px;
    background: transparent; border: 0.5px solid var(--jt-border-muted, #d1d5db);
    color: var(--jt-text-secondary); cursor: pointer;
}
.pt-unmark:hover {
    background: var(--jt-accent-red-subtle, rgba(239,68,68,.1));
    border-color: var(--jt-accent-red, #ef4444);
    color: var(--jt-accent-red, #ef4444);
}

/* ── Marked-list inline attribution (assign team + round/cost so a pick
      appears on the board). Sits between the player name and the Undo button. */
.pt-row-attr-controls {
    display: flex; align-items: center; gap: 6px;
    flex: 0 1 auto; flex-wrap: nowrap;
}
.pt-attr-team {
    font-size: 12px; padding: 4px 6px; max-width: 180px;
    border-radius: 5px; cursor: pointer;
    border: 0.5px solid var(--jt-border-muted, #d1d5db);
    background: var(--jt-bg-elevated, #fff);
    color: var(--jt-text-primary);
}
.pt-attr-round, .pt-attr-cost {
    width: 56px; font-size: 12px; padding: 4px 6px;
    border-radius: 5px; box-sizing: border-box;
    border: 0.5px solid var(--jt-border-muted, #d1d5db);
    background: var(--jt-bg-subtle, rgba(0,0,0,.02));
    color: var(--jt-text-primary);
}
.pt-attr-assign {
    font-size: 12px; font-weight: 500; padding: 4px 12px;
    border-radius: 5px; cursor: pointer; white-space: nowrap;
    background: var(--jt-accent-purple, #7c6af7);
    border: 0.5px solid var(--jt-accent-purple, #7c6af7); color: #fff;
}
.pt-attr-assign:hover { background: var(--jt-accent-purple-hover, #9180f9); }

/* Unassigned (no franchise) marks won't reach the board — left accent + tint
   flags them as needing a team. Cleared once a franchise is assigned. */
.pt-row-unassigned {
    background: var(--jt-accent-amber-subtle, rgba(245,158,11,.08));
    box-shadow: inset 3px 0 0 var(--jt-accent-amber, #f59e0b);
}

/* Narrow widths: let the controls wrap under the name rather than overflow. */
@media (max-width: 600px) {
    .pt-row { flex-wrap: wrap; gap: 8px; }
    .pt-row-attr-controls { flex-basis: 100%; flex-wrap: wrap; }
    .pt-attr-team { max-width: none; flex: 1 1 auto; }
}
