/*
  ADVISOR.CSS — All advisor-specific styles.
  Every color/font references CSS custom properties from theme.css.
  All classes prefixed with `adv-` to avoid collisions.
*/

/* ═══════════════════════ LAYOUT ═══════════════════════ */
.adv-shell {
  position: relative;
  z-index: 1;
  max-width: 1100px;
  margin: 0 auto;
}

.adv-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr);
  min-height: calc(100vh - var(--nav-h, 56px));
}

.adv-left {
  padding: 40px var(--sp-h, 52px) 36px;
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--rule);
}

.adv-right {
  background: var(--bg2);
  display: flex;
  flex-direction: column;
}

.adv-sidebar {
  padding: 40px var(--sp-h, 52px);
  position: sticky;
  top: var(--nav-h, 56px);
}

@media (max-width: 768px) {
  .adv-grid { grid-template-columns: 1fr; }
  .adv-left { padding: 28px 20px 24px; }
  .adv-right { border-top: 1px solid var(--rule); }
  .adv-sidebar { position: static; padding: 24px 20px; }
}

/* ═══════════════════ PROGRESS PIPS ═══════════════════ */
.adv-pips {
  display: flex;
  gap: 4px;
  margin-bottom: 30px;
}

.adv-pip {
  height: 2px;
  flex: 1;
  background: var(--accent-dim);
  transition: background 0.5s;
}

.adv-pip.done { background: rgba(200, 164, 78, 0.38); }
.adv-pip.now  { background: var(--accent); }

/* ═══════════════════ STEP CONTENT ═══════════════════ */
.adv-step {
  display: none;
  flex-direction: column;
  flex: 1;
  animation: adv-in 0.35s ease;
}

.adv-step.on { display: flex; }

@keyframes adv-in {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: none; }
}

.adv-ey {
  font-family: var(--f-ui);
  font-size: var(--sz-xs, 10px);
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--accent);
  opacity: 0.6;
  margin-bottom: 14px;
}

.adv-q {
  font-family: var(--f-head);
  font-size: clamp(20px, 3vw, 26px);
  font-weight: 400;
  color: var(--ink);
  line-height: 1.28;
  letter-spacing: var(--ls-head, .04em);
  margin-bottom: 6px;
}

.adv-hint {
  font-family: var(--f-body);
  font-size: 15px;
  font-style: italic;
  font-weight: 300;
  color: var(--ink3);
  line-height: 1.6;
  margin-bottom: 24px;
}

/* ═══════════════════ OPTIONS ═══════════════════ */
.adv-opts {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.adv-o {
  background: transparent;
  border: 1px solid var(--accent-dim);
  color: var(--ink2);
  padding: 14px 18px;
  cursor: pointer;
  font-family: var(--f-ui);
  font-size: 13px;
  font-weight: 400;
  text-align: left;
  transition: all 0.18s;
  line-height: 1.35;
}

.adv-o:hover {
  border-color: rgba(200, 164, 78, 0.45);
  background: var(--accent-wash);
}

.adv-o.sel {
  border-color: var(--accent);
  background: rgba(200, 164, 78, 0.08);
  color: var(--ink);
}

.adv-o-sub {
  display: block;
  font-family: var(--f-body);
  font-size: 13px;
  font-style: italic;
  color: var(--ink3);
  margin-top: 3px;
  font-weight: 300;
}

/* ═══════════════════ MULTI-SELECT ═══════════════════ */
.adv-chk {
  padding-left: 40px;
  position: relative;
}

.adv-chk::before {
  content: '';
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 14px;
  height: 14px;
  border: 1px solid var(--accent-dim);
  transition: all 0.15s;
}

.adv-chk.sel::before {
  background: var(--accent);
  border-color: var(--accent);
}

.adv-chk.sel::after {
  content: '';
  position: absolute;
  left: 18px;
  top: 50%;
  transform: translateY(-56%) rotate(45deg);
  width: 5px;
  height: 9px;
  border-right: 2px solid var(--bg);
  border-bottom: 2px solid var(--bg);
}

/* ═══════════════════ FINDINGS ═══════════════════ */
.adv-find {
  border-left: 2px solid var(--red, #c44030);
  padding: 8px 14px;
  margin: -2px 0 5px;
  background: rgba(196, 64, 48, 0.04);
  animation: adv-find-in 0.3s ease;
}

.adv-find-tag {
  font-family: var(--f-mono);
  font-size: 9px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(220, 100, 90, 0.65);
  margin-bottom: 2px;
  display: block;
}

.adv-find-text {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.03em;
  color: rgba(220, 160, 150, 0.78);
  line-height: 1.55;
}

@keyframes adv-find-in {
  from { opacity: 0; transform: translateX(-6px); }
  to   { opacity: 1; transform: none; }
}

/* ═══════════════════ CONTACT FIELDS ═══════════════════ */
.adv-collect {
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.adv-input {
  background: transparent;
  border: 1px solid var(--accent-dim);
  color: var(--ink);
  padding: 10px 14px;
  font-family: var(--f-ui);
  font-size: 13px;
  transition: border-color 0.18s;
}

.adv-input:focus {
  outline: none;
  border-color: var(--accent);
}

.adv-input::placeholder {
  color: var(--ink3);
}

/* ═══════════════════ NAVIGATION ═══════════════════ */
.adv-nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 24px;
  margin-top: auto;
}

.adv-btn-back {
  background: none;
  border: none;
  color: var(--ink3);
  font-family: var(--f-ui);
  font-size: 12px;
  cursor: pointer;
  padding: 8px 0;
}

.adv-btn-back:hover { color: var(--ink2); }

.adv-btn-continue {
  background: var(--accent);
  border: none;
  color: var(--bg);
  font-family: var(--f-ui);
  font-size: var(--sz-btn, 11px);
  font-weight: 600;
  padding: var(--sp-btn, 13px) var(--sp-btn-h, 28px);
  cursor: pointer;
  letter-spacing: var(--ls-btn, .22em);
  text-transform: uppercase;
  transition: opacity 0.18s;
}

.adv-btn-continue:hover { opacity: 0.9; }

/* ═══════════════════ RESULT CARD ═══════════════════ */
.adv-result-tier {
  font-family: var(--f-ui);
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 8px;
}

.adv-result-price {
  font-family: var(--f-head);
  font-size: var(--sz-price, 26px);
  color: var(--ink);
  margin-bottom: 4px;
}

.adv-result-dayrate {
  font-family: var(--f-mono);
  font-size: var(--sz-mono, 13px);
  color: var(--ink3);
  margin-bottom: 24px;
}

.adv-result-rationale { margin-bottom: 24px; }

.adv-rationale-line {
  font-family: var(--f-body);
  font-size: 14px;
  color: var(--ink2);
  line-height: 1.6;
  margin-bottom: 6px;
}

.adv-result-features {
  border-top: 1px solid var(--rule);
  padding-top: 20px;
  margin-bottom: 24px;
}

.adv-feature {
  font-family: var(--f-ui);
  font-size: var(--sz-feat, 10px);
  color: var(--ink2);
  padding: 4px 0;
  letter-spacing: var(--ls-feat, .08em);
}

.adv-result-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 12px;
}

.adv-btn-primary {
  background: var(--accent);
  border: none;
  color: var(--bg);
  font-family: var(--f-ui);
  font-size: var(--sz-btn, 11px);
  font-weight: 600;
  padding: 14px 32px;
  cursor: pointer;
  letter-spacing: var(--ls-btn, .22em);
  text-transform: uppercase;
  transition: opacity 0.18s;
}

.adv-btn-primary:hover { opacity: 0.9; }

.adv-btn-alt {
  background: transparent;
  border: 1px solid var(--accent-dim);
  color: var(--ink2);
  font-family: var(--f-ui);
  font-size: 13px;
  padding: 12px 24px;
  cursor: pointer;
  transition: all 0.18s;
}

.adv-btn-alt:hover { border-color: rgba(200, 164, 78, 0.45); }

.adv-btn-link {
  background: none;
  border: none;
  color: var(--ink3);
  font-family: var(--f-ui);
  font-size: 12px;
  cursor: pointer;
  padding: 8px 0;
  text-align: center;
}

.adv-btn-link:hover { color: var(--ink2); }

/* ═══════════════════ SIDEBAR FEEDS ═══════════════════ */
.adv-feed-card {
  border-bottom: 1px solid var(--rule);
  padding: 16px 0;
}

.adv-feed-card:last-child { border-bottom: none; }

.adv-feed-label {
  font-family: var(--f-mono);
  font-size: 9px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--accent);
  opacity: 0.6;
  margin-bottom: 6px;
}

.adv-feed-value {
  font-family: var(--f-body);
  font-size: 14px;
  color: var(--ink);
  line-height: 1.5;
}

.adv-feed-sub {
  font-family: var(--f-mono);
  font-size: var(--sz-mono, 13px);
  color: var(--ink3);
  margin-top: 4px;
}

.adv-feed-headline {
  font-family: var(--f-ui);
  font-size: 12px;
  color: var(--ink2);
  padding: 4px 0;
  line-height: 1.4;
}

.adv-feed-empty { opacity: 0.5; }

/* ═══════════════════ FORK / ESCAPE BUTTONS ═══════════════════ */
.adv-fork {
  background: transparent;
  border: 1px solid var(--rule);
  color: var(--ink);
  padding: 16px 20px;
  cursor: pointer;
  font-family: var(--f-ui);
  font-size: 13px;
  text-align: left;
  transition: all 0.2s;
  width: 100%;
  margin-bottom: 7px;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.adv-fork:hover { border-color: rgba(200,164,78,.35); background: var(--accent-wash); }
.adv-fork-l { font-family: var(--f-head); font-size: 13px; letter-spacing: .03em; color: var(--accent); }
.adv-fork-d { font-family: var(--f-body); font-size: 13px; color: var(--ink4); font-weight: 300; font-style: italic; line-height: 1.45; }

/* ═══════════════════ CONTACT CAPTURE ═══════════════════ */
.adv-cap {
  background: var(--accent-wash);
  border: 1px solid var(--accent-dim);
  padding: 20px;
  margin-top: 18px;
}
.adv-cap-h { font-family: var(--f-body); font-size: 16px; color: var(--ink); margin-bottom: 3px; }
.adv-cap-sub { font-family: var(--f-body); font-size: 14px; font-style: italic; color: var(--ink3); margin-bottom: 16px; line-height: 1.5; }
.adv-frow { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
.adv-fw { margin-bottom: 12px; }
.adv-fl { font-family: var(--f-ui); font-size: 8px; letter-spacing: .2em; text-transform: uppercase; color: var(--ink4); margin-bottom: 4px; display: block; }
.adv-fl .dim { color: rgba(240,236,224,.12); letter-spacing: .06em; text-transform: none; }
.adv-fi {
  width: 100%;
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--accent-dim);
  color: var(--ink);
  padding: 10px 0;
  font-family: var(--f-body);
  font-size: 16px;
  font-weight: 300;
  outline: none;
  transition: border-color 0.2s;
}
.adv-fi:focus { border-bottom-color: rgba(200,164,78,.45); }
.adv-fi::placeholder { color: var(--ink4); font-style: italic; font-size: 14px; }

@media (max-width: 600px) {
  .adv-frow { grid-template-columns: 1fr; }
}

/* ═══════════════════ GREEN CHECK BOX ═══════════════════ */
.green-box {
  background: rgba(74, 143, 106, .08);
  border-left: 3px solid var(--ok);
  border-radius: 4px;
  padding: 16px 18px;
  color: var(--ink);
  margin-bottom: 16px;
}
.green-box-title {
  font-family: var(--f-ui);
  font-size: 9px;
  letter-spacing: .2em;
  text-transform: uppercase;
  font-weight: 700;
  margin-bottom: 8px;
  color: var(--ok);
}
.check-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 0;
  font-family: var(--f-ui);
  font-size: 12px;
  color: var(--ink2);
}
.check-item::before {
  content: "\2713";
  color: var(--ok);
  font-weight: 700;
  flex-shrink: 0;
}

/* ═══════════════════ VERDICT LIST ═══════════════════ */
.v-list { list-style: none; margin-bottom: 16px; }
.v-list li {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: .04em;
  color: var(--ink2);
  padding: 5px 0 5px 18px;
  position: relative;
  line-height: 1.4;
}
.v-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 11px;
  width: 8px;
  height: 1px;
  background: rgba(200,164,78,.5);
}

/* ═══════════════════ THINKING SPINNER ═══════════════════ */
@keyframes adv-spin { to { transform: rotate(360deg); } }

/* ═══════════════════ ESCAPE LINK ═══════════════════ */
.adv-esc {
  display: block;
  text-align: center;
  font-family: var(--f-ui);
  font-size: 11px;
  color: var(--ink4);
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.18s;
}
.adv-esc:hover { color: var(--accent); }
/* deployed 2026-04-02T05:30:05Z */

/* ── Utility classes for repeated inline patterns ──
   Use these instead of inline styles when rendering.
   Extracted from Pass 2 code audit. */
.t-mono-xs { font-family:var(--f-mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase }
.t-mono-sm { font-family:var(--f-mono);font-size:11px;letter-spacing:.04em }
.t-mono-label { font-family:var(--f-mono);font-size:10px;letter-spacing:.06em }
.t-mono-tag { font-family:var(--f-mono);font-size:8px;letter-spacing:.12em;text-transform:uppercase;padding:2px 8px;display:inline-block }
.t-body-sm { font-family:var(--f-body);font-size:13px;color:var(--ink3);line-height:1.45;font-weight:300;font-style:italic }
.t-body-md { font-family:var(--f-body);font-size:14px;color:var(--ink2);line-height:1.5;font-weight:300 }
.t-body-lg { font-family:var(--f-body);font-size:15px;line-height:1.6;font-weight:300 }
.t-ui-xs { font-family:var(--f-ui);font-size:9px;letter-spacing:.2em;text-transform:uppercase }
.t-ui-label { font-family:var(--f-ui);font-size:10px;letter-spacing:.24em;text-transform:uppercase }
.t-head-stat { font-family:var(--f-head);font-size:42px;line-height:1;letter-spacing:.02em }
.t-head-lg { font-family:var(--f-head);font-size:24px;letter-spacing:.02em }
.feed-card { background:var(--bg3);border:1px solid var(--rule);padding:12px 14px;margin-bottom:6px }
.feed-tag { margin-bottom:5px }
.feed-tag.found { background:rgba(196,64,48,.1);color:rgba(220,100,90,.8);border:1px solid rgba(196,64,48,.18) }
.feed-tag.info { background:var(--accent-wash);color:rgba(200,164,78,.65);border:1px solid var(--accent-dim) }
