/* Reference cases (2026-09-03, Section 3B decision-review + BVA reference
   cases). The "Save case to my preparation" entrance on BVA Search results,
   the decision modal and the decision page; the inline save/connect chooser
   under each; and the Reference cases section of My Preparation. Tokens
   only; BUTTON LAW on every action (2px accent border, hover to primary,
   44px); 16px inputs; dark mode through the tokens. */

/* Entrance buttons (each page's own button rule is overridden by the
   more specific selectors below, so the accent border always wins). */
.bvas-result-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-3); }
.bvas-refcase-btn, .bvd-refcase-btn, .refc-btn,
.bvas-modal-actions .bvas-refcase-btn, .bvd-actions .bvd-refcase-btn, .bvas-preview .bvas-refcase-btn {
  display: inline-flex; align-items: center; justify-content: center; text-align: center;
  min-height: 44px; padding: var(--space-2) var(--space-4);
  border: 2px solid var(--color-accent); border-radius: var(--radius-sm);
  background: var(--color-surface); color: var(--color-primary);
  font: inherit; font-size: var(--text-body); font-weight: 700; cursor: pointer; text-decoration: none;
}
.bvas-refcase-btn:hover, .bvd-refcase-btn:hover, .refc-btn:hover,
.bvas-refcase-btn:focus-visible, .bvd-refcase-btn:focus-visible, .refc-btn:focus-visible,
.bvas-modal-actions .bvas-refcase-btn:hover, .bvd-actions .bvd-refcase-btn:hover { border-color: var(--color-primary); background: var(--color-surface); }
.bvas-refcase-btn:focus-visible, .bvd-refcase-btn:focus-visible, .refc-btn:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.bvas-refcase-btn:disabled, .bvd-refcase-btn:disabled, .refc-btn:disabled { opacity: .55; cursor: not-allowed; }
.bvas-refcase-btn[aria-expanded="true"], .bvd-refcase-btn[aria-expanded="true"] { border-color: var(--color-primary); }
.refc-btn-quiet { font-weight: 600; }
.refc-btn-danger { color: var(--color-danger); }
.bvas-preview .bvas-refcase-btn { color: var(--color-primary); }

/* The inline chooser */
.refc-mount { margin-top: var(--space-3); }
.refc-mount[hidden] { display: none; }
.refc-panel { border: 2px solid var(--color-accent); border-radius: var(--radius-md); background: var(--color-surface); color: var(--color-text); padding: var(--space-4); text-align: left; }
.bvas-preview .refc-panel, .bvas-preview .refc-panel * { color: var(--color-text); }
.refc-h { margin: 0 0 var(--space-1); font-size: var(--text-md); line-height: 1.3; color: var(--color-text-strong, var(--color-text)); }
.refc-h:focus { outline: none; }
.refc-meta { margin: 0 0 var(--space-3); font-size: var(--text-sm); color: var(--color-text-muted); overflow-wrap: anywhere; }
.refc-lede { margin: 0 0 var(--space-3); font-size: var(--text-body); line-height: 1.55; }
.refc-notice { margin: var(--space-2) 0 var(--space-3); padding: var(--space-3) var(--space-4); border-left: 4px solid var(--color-accent); background: color-mix(in srgb, var(--color-accent) 8%, transparent); font-size: var(--text-body); line-height: 1.5; }
.refc-notice-err { border-left-color: var(--color-danger); background: color-mix(in srgb, var(--color-danger) 8%, transparent); }
.refc-notice a, .refc-status a { color: var(--color-primary); font-weight: 600; }
.refc-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-3); }
.refc-status { margin: var(--space-2) 0 0; min-height: 1.3em; font-size: var(--text-body); line-height: 1.5; }
.refc-status-ok { color: var(--color-success); font-weight: 600; }
.refc-status-err { color: var(--color-danger); font-weight: 600; }
.refc-state { font-size: var(--text-sm); font-weight: 600; color: var(--color-text); }

/* Connections shown on a saved case */
.refc-conn { border: 1px solid var(--color-border); border-left: 4px solid var(--color-accent); border-radius: var(--radius-sm); background: var(--color-bg-alt, var(--color-bg)); padding: var(--space-3) var(--space-4); margin: var(--space-3) 0; }
.refc-conn-h { margin: 0 0 var(--space-1); font-size: var(--text-body); font-weight: 700; color: var(--color-text-strong, var(--color-text)); overflow-wrap: anywhere; }
.refc-tags { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: var(--space-2) 0; }
.refc-tag { display: inline-block; padding: 4px 10px; border-radius: 999px; font-size: var(--text-sm); font-weight: 600; border: 1px solid var(--color-accent); color: var(--color-text); background: var(--color-surface); overflow-wrap: anywhere; }
.refc-note { margin: var(--space-2) 0 0; font-size: var(--text-body); line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.refc-note strong { display: block; font-size: var(--text-sm); text-transform: uppercase; letter-spacing: .04em; color: var(--color-text-muted); margin-bottom: 2px; }
.refc-passage { margin: var(--space-2) 0 0; }
.refc-passage summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; font-weight: 600; color: var(--color-primary); }
.refc-passage-text { margin: var(--space-2) 0 0; padding: var(--space-3); border-left: 3px solid var(--color-border); font-size: var(--text-body); line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
.refc-passage-hint { margin: var(--space-1) 0 0; font-size: var(--text-xs); color: var(--color-text-muted); }

/* The connection form (shared by the chooser and My Preparation) */
.refc-form { margin-top: var(--space-3); padding-top: var(--space-3); border-top: 1px dashed var(--color-border); }
.refc-form h4 { margin: 0 0 var(--space-2); font-size: var(--text-body); color: var(--color-text-strong, var(--color-text)); }
.refc-field { margin: 0 0 var(--space-3); }
.refc-field label, .refc-label { display: block; font-weight: 700; font-size: var(--text-body); margin-bottom: var(--space-1); color: var(--color-text-strong, var(--color-text)); }
.refc-select, .refc-input, .refc-textarea { width: 100%; max-width: 640px; min-height: 44px; font: inherit; font-size: 16px; padding: var(--space-2) var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: var(--color-bg); color: var(--color-text); }
.refc-textarea { min-height: 96px; resize: vertical; }
.refc-select:focus-visible, .refc-input:focus-visible, .refc-textarea:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.refc-hint { display: block; margin-top: var(--space-1); font-size: var(--text-sm); color: var(--color-text-muted); line-height: 1.45; }
.refc-field-error { display: block; margin-top: var(--space-1); font-size: var(--text-sm); color: var(--color-danger); font-weight: 600; }
.refc-field-error[hidden] { display: none; }
.refc-checks { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); margin: var(--space-2) 0; }
.refc-checks label { display: inline-flex; align-items: center; gap: var(--space-2); min-height: 44px; font-size: var(--text-body); }
.refc-checks input { width: 22px; height: 22px; accent-color: var(--color-primary); margin: 0; }
.refc-conflict { margin: var(--space-3) 0; padding: var(--space-3) var(--space-4); border: 1px solid var(--color-warning); border-radius: var(--radius-sm); background: color-mix(in srgb, var(--color-warning) 10%, transparent); }
.refc-conflict h5 { margin: 0 0 var(--space-2); font-size: var(--text-body); }
.refc-conflict dl { margin: 0 0 var(--space-3); }
.refc-conflict dt { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: .04em; color: var(--color-text-muted); margin-top: var(--space-2); }
.refc-conflict dd { margin: 2px 0 0; font-size: var(--text-body); white-space: pre-wrap; overflow-wrap: anywhere; }

/* My Preparation section */
.refc-section { border: 2px solid var(--color-accent); border-radius: var(--radius-md); background: var(--color-surface); padding: var(--space-4); margin: 0 0 var(--space-5); }
.refc-section .rq-head p { margin: var(--space-1) 0 0; font-size: var(--text-body); line-height: 1.5; }
.refc-list { margin-top: var(--space-3); }
.refc-case { border: 1px solid var(--color-border); border-left: 4px solid var(--color-accent); border-radius: var(--radius-sm); background: var(--color-surface); padding: var(--space-4); margin: 0 0 var(--space-3); }
.refc-case:focus { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.refc-case-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: var(--space-2) var(--space-4); }
.refc-cite { margin: 0; font-size: var(--text-md); line-height: 1.3; color: var(--color-text-strong, var(--color-text)); }
.refc-cite a { color: var(--color-primary); text-decoration: none; }
.refc-cite a:hover { text-decoration: underline; }
.refc-case-meta { margin: var(--space-1) 0 0; font-size: var(--text-sm); color: var(--color-text-muted); }
.refc-empty { margin: var(--space-3) 0; padding: var(--space-4); border: 1px dashed var(--color-border); border-radius: var(--radius-sm); font-size: var(--text-body); color: var(--color-text-muted); }
.refc-group-h { margin: var(--space-4) 0 var(--space-2); font-size: var(--text-body); font-weight: 700; color: var(--color-text-strong, var(--color-text)); }

@media (max-width: 640px) {
  .refc-actions .refc-btn, .refc-actions .bvas-refcase-btn { flex: 1 1 45%; }
  .refc-select, .refc-input, .refc-textarea { max-width: none; }
  .refc-case-head { flex-direction: column; }
}