/* Gap analysis tool: extends quiz.css tokens and patterns. */

.ga-toolbar{
  position:sticky; top:65px; z-index:40;
  background:color-mix(in srgb, var(--bg) 92%, transparent);
  backdrop-filter:saturate(140%) blur(8px);
  border-bottom:1px solid var(--border);
}
.ga-toolbar-row{
  max-width:960px; margin:0 auto; padding:12px clamp(20px,5vw,64px);
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.ga-progress{ font-family:var(--mono); font-size:0.78rem; color:var(--fg-soft); display:flex; align-items:center; gap:10px; }
.ga-progress b{ color:var(--copper); }
.ga-bar{ width:120px; height:4px; background:var(--border); position:relative; overflow:hidden; }
.ga-bar-fill{ position:absolute; left:0; top:0; bottom:0; background:var(--copper); width:0%; transition:width .2s; }
.ga-actions{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.ga-save-state{ font-family:var(--mono); font-size:0.72rem; color:var(--fg-soft); min-width:70px; }
.ga-btn-sm{ font-family:var(--mono); font-size:0.76rem; letter-spacing:0.02em; border:1px solid var(--copper); color:var(--copper); background:none; padding:8px 16px; cursor:pointer; text-decoration:none; display:inline-block; }
.ga-btn-sm:hover{ background:var(--copper); color:var(--night); }
.ga-btn-sm:disabled{ opacity:0.35; cursor:not-allowed; }
.ga-btn-sm:disabled:hover{ background:none; color:var(--copper); }

.ga-banner{ font-family:var(--mono); font-size:0.82rem; padding:14px clamp(20px,5vw,64px); text-align:center; border-bottom:1px solid var(--border); }
.ga-banner.warn{ background:color-mix(in srgb, var(--copper) 14%, transparent); color:var(--fg); }

.ga-list{ padding:clamp(20px,4vw,40px) 0 clamp(60px,8vw,100px); }
.ga-annex{ margin-bottom:clamp(30px,4vw,48px); }
.ga-annex-head{ font-family:var(--display); font-weight:800; text-transform:uppercase; font-size:1.15rem; letter-spacing:0.01em; padding:14px 0; border-bottom:2px solid var(--copper); margin-bottom:6px; }

.ga-subpart{ border-top:1px solid var(--border); }
.ga-subpart-head{
  width:100%; text-align:left; background:none; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:16px 0; font-family:var(--mono); font-size:0.82rem; color:var(--fg); letter-spacing:0.02em;
}
.ga-subpart-head:hover{ color:var(--copper); }
.ga-subpart-head .count{ color:var(--fg-soft); font-size:0.76rem; flex-shrink:0; }
.ga-subpart-head .chev{ color:var(--copper); flex-shrink:0; transition:transform .15s; }
.ga-subpart.open .ga-subpart-head .chev{ transform:rotate(90deg); }
.ga-subpart-body{ display:none; padding-bottom:8px; }
.ga-subpart.open .ga-subpart-body{ display:block; }

.ga-item{ border-top:1px solid var(--border); padding:clamp(18px,3vw,26px) 0; display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:24px; }
.ga-item:first-of-type{ border-top:none; }
@media (max-width:760px){ .ga-item{ grid-template-columns:1fr; gap:16px; } }
.ga-item.locked{ opacity:0.55; }

.ga-item-id{ font-family:var(--mono); font-size:0.7rem; color:var(--copper); letter-spacing:0.04em; margin-bottom:6px; }
.ga-item-ref{ font-family:var(--mono); font-size:0.78rem; color:var(--fg-soft); white-space:pre-line; margin-bottom:8px; }
.ga-item-text{ font-family:var(--serif); font-size:0.96rem; color:var(--fg); white-space:pre-line; }

.ga-fields{ display:flex; flex-direction:column; gap:10px; }
.ga-field label{ display:block; font-family:var(--mono); font-size:0.68rem; letter-spacing:0.05em; text-transform:uppercase; color:var(--fg-soft); margin-bottom:4px; }
.ga-field select, .ga-field input[type="text"], .ga-field textarea{
  width:100%; font-family:var(--serif); font-size:0.9rem; color:var(--fg); background:var(--bg-panel);
  border:1px solid var(--border); padding:8px 10px; box-sizing:border-box;
}
.ga-field select:focus, .ga-field input:focus, .ga-field textarea:focus{ outline:2px solid var(--copper); outline-offset:1px; }
.ga-field textarea{ resize:vertical; min-height:44px; }
.ga-field select:disabled, .ga-field input:disabled, .ga-field textarea:disabled{ cursor:not-allowed; }

.ga-lock-note{ font-family:var(--mono); font-size:0.72rem; color:var(--copper); margin-top:4px; }

.ga-item-info{ grid-template-columns:1fr; background:var(--bg-panel); border-top:1px solid var(--border); }
.ga-item-info .ga-item-text{ font-size:0.88rem; color:var(--fg-soft); }
.ga-info-note{ font-family:var(--mono); font-size:0.72rem; color:var(--fg-soft); font-style:italic; margin-top:2px; }

/* status pill on select, colour-coded */
.ga-field select[data-status="Yes"]{ border-color:#5C8A5C; }
.ga-field select[data-status="Partial"]{ border-color:var(--copper); }
.ga-field select[data-status="No"]{ border-color:#B0473F; }

/* paywall modal reuses .modal-backdrop / .modal-box from quiz.css */
.ga-paywall-price{ font-family:var(--display); font-weight:800; font-size:2.2rem; color:var(--copper); margin:6px 0 14px; }
.ga-paywall-list{ margin:0 0 20px; padding:0; list-style:none; display:flex; flex-direction:column; gap:8px; }
.ga-paywall-list li{ font-size:0.88rem; color:var(--fg-soft); display:flex; gap:8px; }
.ga-paywall-list li::before{ content:"·"; color:var(--copper); flex-shrink:0; }
.ga-paywall-cta{ display:block; text-align:center; }

.ga-email-note{ font-family:var(--mono); font-size:0.72rem; color:var(--fg-soft); margin-top:16px; }