/* Shared across the newer Shooter Portal pages (Coaching Notes, Resources): the overlay/dialog and
   sharing-picker rules, copied from shooterstrings.css rather than having that already-shipped page
   load a new shared file - small, deliberate duplication, see backend AGENTS.md's Coaching Notes
   note for why. Also the Coaching Notes / Resources page-specific layout (category cards, note
   cards, resource list, unread badges). */

.ss-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); z-index: 10000; justify-content: center; align-items: center; }
.ss-box { background: #fff; border-radius: 8px; padding: 18px 20px; max-width: 94vw; max-height: 92vh; overflow: auto; position: relative; min-width: 320px; }
.ss-box h3 { font-size: 1.1em; margin: 0 0 12px; padding-right: 28px; padding-bottom: 8px; border-bottom: 1px solid #dee2e6; }
.ss-close { position: absolute; top: 10px; right: 14px; font-size: 1.3em; background: none; border: none; cursor: pointer; color: #888; line-height: 1; }
.ss-close:hover { color: #333; }

.ss-mini { border: none; background: none; color: #0069d9; font-size: 0.78em; padding: 0 2px; cursor: pointer; }
.ss-mini:hover { text-decoration: underline; }
.ss-mini:disabled { color: #999; cursor: default; text-decoration: none; }

.ss-share-opt { display: flex; gap: 8px; align-items: flex-start; margin: 0 0 10px; font-weight: normal; cursor: pointer; }
.ss-share-opt input { margin-top: 4px; }
.ss-share-opt small { display: block; color: #6c757d; }
.ss-share-head { font-weight: 700; font-size: 0.78em; text-transform: uppercase; letter-spacing: 0.04em; color: #495057; margin: 14px 0 6px; }
.ss-share-picker { margin: 2px 0 0 22px; border: 1px solid #dee2e6; border-radius: 5px; padding: 8px; background: #f8f9fa; }
.ss-share-picker.disabled { opacity: 0.5; }
.ss-share-picker-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; font-size: 0.85em; }
.ss-share-picker-head input { flex: 1; min-width: 0; font-size: 0.95em; padding: 2px 6px; border: 1px solid #ced4da; border-radius: 3px; }
.ss-share-list { max-height: 170px; overflow-y: auto; background: #fff; border: 1px solid #e6e9ec; border-radius: 3px; padding: 4px 8px; }
.ss-share-list label { display: flex; align-items: center; gap: 8px; margin: 0; padding: 2px 0; font-size: 0.88em; font-weight: normal; cursor: pointer; }
.ss-share-list label input { margin: 0; }
.ss-share-empty { padding: 8px 0; color: #6c757d; font-size: 0.85em; }

/* Coaching Notes */
.cn-category { margin-bottom: 16px; }
.cn-category-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.cn-category-head h4 { font-size: 1em; margin: 0; font-weight: 700; }
.cn-category-head small { color: #6c757d; font-weight: normal; }
.cn-notes { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.cn-note { border: 1px solid #e6e9ec; border-radius: 6px; padding: 8px 10px; background: #fdfdfe; }
.cn-note-owner { font-size: 0.82em; color: #495057; font-weight: 700; margin-bottom: 2px; }
.cn-note-text { white-space: pre-wrap; word-break: break-word; }
.cn-note-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 6px; font-size: 0.78em; color: #6c757d; }
.cn-share-tag { display: inline-block; padding: 1px 7px; border-radius: 10px; background: #e9ecef; color: #495057; }
.cn-share-tag.cn-share-private { background: #f8d7da; color: #842029; }
.cn-share-tag.cn-share-shared { background: #d1e7dd; color: #0f5132; }
.cn-note-actions { margin-left: auto; display: flex; gap: 10px; }
.cn-note-actions a { cursor: pointer; font-size: 0.85em; }
.cn-add { margin-top: 6px; }
.cn-add textarea { width: 100%; min-height: 56px; font-size: 0.92em; padding: 6px 8px; border: 1px solid #ced4da; border-radius: 4px; resize: vertical; box-sizing: border-box; }
.cn-add-row { display: flex; align-items: center; gap: 8px; margin-top: 6px; }
.cn-empty { color: #6c757d; font-size: 0.88em; padding: 10px 0; }

/* Update badges (shooterportal.html buttons) */
.portal-badge { display: inline-block; margin-left: 8px; padding: 1px 8px; border-radius: 10px; background: #dc3545; color: #fff; font-size: 0.78em; font-weight: 700; vertical-align: middle; }

/* Resources */
.res-list { display: flex; flex-direction: column; gap: 10px; }
.res-item { border: 1px solid #e6e9ec; border-radius: 6px; padding: 10px 12px; }
.res-name { font-weight: 700; }
.res-blurb { color: #495057; margin-top: 2px; white-space: pre-wrap; word-break: break-word; }
.res-meta { margin-top: 6px; font-size: 0.8em; color: #6c757d; display: flex; gap: 10px; align-items: center; }

/* Message Board */
.bb-post { margin-bottom: 12px; cursor: default; }
.bb-post-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; cursor: pointer; }
.bb-title { font-weight: 700; }
.bb-meta { font-size: 0.8em; color: #6c757d; margin-top: 2px; }
.bb-chevron { color: #6c757d; font-size: 0.8em; flex: none; margin-top: 3px; }
.bb-body { white-space: pre-wrap; word-break: break-word; margin-top: 10px; }
.bb-actions { display: flex; gap: 10px; margin-top: 6px; font-size: 0.85em; }
.bb-actions a, .cn-note-actions a { cursor: pointer; color: #0069d9; }
.bb-replies { margin-top: 12px; padding-left: 14px; border-left: 2px solid #e9ecef; display: flex; flex-direction: column; gap: 10px; }
.bb-reply-head { font-size: 0.82em; display: flex; gap: 8px; align-items: baseline; }
.bb-reply-head span { color: #6c757d; font-weight: normal; }
.bb-post input[type=text] { width: 100%; font-size: 1em; font-weight: 700; padding: 6px 8px; border: 1px solid #ced4da; border-radius: 4px; box-sizing: border-box; margin-bottom: 8px; }
.bb-post textarea, .bb-reply textarea { width: 100%; min-height: 56px; font-size: 0.92em; padding: 6px 8px; border: 1px solid #ced4da; border-radius: 4px; resize: vertical; box-sizing: border-box; }

/* Message Board - string references (a post/reply pointing at a shot string) */
.mb-string-row { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 0; }
.mb-string-chip { display: inline-flex; align-items: center; gap: 6px; background: #eef3f8; color: #33475b; border: 1px solid #d7e3ee; border-radius: 12px; padding: 3px 10px; font-size: 0.82em; }
.mb-string-clickable { cursor: pointer; }
.mb-string-clickable:hover { background: #dfeaf5; }
.mb-string-remove { cursor: pointer; color: #6c757d; font-size: 0.9em; line-height: 1; }
.mb-string-remove:hover { color: #dc3545; }
.mb-picker-filters { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.mb-picker-label { display: flex; flex-direction: column; gap: 3px; font-size: 0.78em; color: #495057; font-weight: 700; flex: 1; min-width: 140px; }
.mb-picker-label select { font-size: 0.95em; padding: 4px 6px; border: 1px solid #ced4da; border-radius: 3px; font-weight: normal; }
.mb-picker-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 4px 2px; font-size: 0.88em; border-bottom: 1px solid #f1f3f5; }
.mb-picker-row:last-child { border-bottom: none; }

/* Message Board - mentions (highlighting a member so they get a login notification) */
.mb-mention-row { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 0; }
.mb-mention-chip { display: inline-flex; align-items: center; gap: 6px; background: #cfe2ff; color: #084298; border: 1px solid #b6d4fe; border-radius: 12px; padding: 3px 10px; font-size: 0.82em; font-weight: 700; }
.mb-mention-remove { cursor: pointer; color: #084298; font-size: 0.9em; line-height: 1; font-weight: 700; }
.mb-mention-remove:hover { color: #dc3545; }
.mb-picker-search { width: 100%; font-size: 0.95em; padding: 4px 6px; border: 1px solid #ced4da; border-radius: 3px; box-sizing: border-box; margin-bottom: 10px; }

/* Message Board - polls */
.mb-poll { margin-top: 10px; padding: 10px 12px; border: 1px solid #e6e9ec; border-radius: 6px; background: #fbfcfd; }
.mb-poll-title { font-weight: 700; margin-bottom: 2px; }
.mb-poll-status { font-size: 0.8em; color: #6c757d; margin-bottom: 8px; }
.mb-poll-options { display: flex; flex-direction: column; gap: 8px; }
.mb-poll-option { display: flex; flex-direction: column; gap: 4px; cursor: pointer; }
.mb-poll-option-label-row { display: flex; align-items: center; gap: 8px; }
.mb-poll-option-label-row input { margin: 0; flex: none; }
.mb-poll-option-mine { font-weight: 700; }
.mb-poll-option-bar { display: flex; align-items: center; gap: 8px; margin-left: 22px; }
.mb-poll-option-bar .progress { flex: 1; height: 8px; }
.mb-poll-option-count { font-size: 0.78em; color: #6c757d; white-space: nowrap; }
.mb-poll-hidden-note, .mb-poll-locked-note { font-size: 0.78em; color: #6c757d; margin-left: 22px; }
.mb-poll-option-voters { font-size: 0.78em; color: #6c757d; margin-left: 22px; }
.mb-poll-add-option-row { display: flex; gap: 8px; margin-top: 10px; align-items: center; }
.mb-poll-add-option-row input { flex: 1; font-size: 0.9em; padding: 4px 6px; border: 1px solid #ced4da; border-radius: 3px; }
.mb-poll-actions { display: flex; gap: 10px; align-items: center; margin-top: 10px; flex-wrap: wrap; }

.mb-poll-builder { margin-top: 10px; padding: 10px 12px; border: 1px solid #e6e9ec; border-radius: 6px; background: #fbfcfd; }
.mb-poll-builder input[type=text] { width: 100%; font-size: 0.92em; padding: 5px 7px; border: 1px solid #ced4da; border-radius: 4px; box-sizing: border-box; }
.mb-poll-option-input-row { display: flex; gap: 6px; align-items: center; margin-top: 6px; }
.mb-poll-option-input-row input { flex: 1; }
.mb-poll-option-remove { cursor: pointer; color: #6c757d; font-size: 1em; }
.mb-poll-option-remove:hover { color: #dc3545; }
.mb-poll-builder-sub { margin: 4px 0 10px 22px; display: flex; flex-direction: column; gap: 4px; }
.mb-poll-builder-close { display: flex; align-items: center; gap: 8px; font-size: 0.88em; margin-top: 10px; }
.mb-poll-builder-close input[type=datetime-local] { font-size: 0.9em; padding: 3px 6px; border: 1px solid #ced4da; border-radius: 3px; }
.mb-poll-builder-row { margin-top: 10px; }