/* Hadef UI upgrades: pitch package. Components and flags live in
   /static/js/pitch-upgrades.js. Every rule here is gated on html.ui-<flag>, so a
   flag set to false leaves the page exactly as it was. No new colours: each
   value below resolves to a token the page already defines (.lgp tokens on the
   example package, the page :root and design-tokens.css on the share page). */

html[class*="ui-pitch_"] [data-ui-upgrade^="pitch_"]{
  --pu-ink: var(--lgp-ink, var(--hadef-ink));
  --pu-muted: var(--lgp-muted, var(--hadef-muted));
  --pu-line: var(--lgp-line, var(--line, var(--border)));
  --pu-accent: var(--lgp-orange, var(--hadef-accent));
  --pu-accent-dark: var(--hadef-accent-dark);
  --pu-accent-soft: var(--accent-soft);
  --pu-surface: var(--lgp-panel, var(--surface, var(--hadef-cream)));
  --pu-paper: var(--lgp-paper, var(--cream));
  --pu-green: var(--lgp-green, var(--hadef-green, var(--hadef-accent-dark)));
  --pu-radius: 10px;
  --pu-pill: 999px;
  --pu-sans: 'Plus Jakarta Sans', system-ui, sans-serif;
  --pu-mono: 'JetBrains Mono', ui-monospace, monospace;
  --pu-ease: cubic-bezier(0.23, 1, 0.32, 1);
  --pu-shadow: 0 1px 2px rgba(28,25,23,0.04), 0 8px 24px rgba(28,25,23,0.06);
}
/* The example package is drawn with square corners; follow it. */
html[class*="ui-pitch_"] .lgp [data-ui-upgrade^="pitch_"]{--pu-radius:0;--pu-pill:0}

/* ---------- pitch_section_tabs (shadcn/ui Tabs, line variant) ---------- */
html.ui-pitch_section_tabs .pu-tabs{position:sticky;top:var(--pu-tabs-top,0px);z-index:49;margin:0 0 20px;background:var(--pu-paper);border-bottom:1px solid var(--pu-line);font-family:var(--pu-sans)}
html.ui-pitch_section_tabs .wrap > .pu-tabs{margin-left:-22px;margin-right:-22px;padding:0 22px}
html.ui-pitch_section_tabs .lgp .pu-tabs{margin:0;padding:0 max(20px, calc((100% - 1180px) / 2))}
html.ui-pitch_section_tabs .pu-tabs-list{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
html.ui-pitch_section_tabs .pu-tabs-list::-webkit-scrollbar{display:none}
html.ui-pitch_section_tabs .pu-tab{position:relative;flex:0 0 auto;display:inline-flex;align-items:center;min-height:44px;padding:0 12px;color:var(--pu-muted);font-size:13.5px;font-weight:600;text-decoration:none;white-space:nowrap;transition:color 160ms var(--pu-ease)}
html.ui-pitch_section_tabs .pu-tab::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:2px;background:var(--pu-accent);transform:scaleX(0);transform-origin:center;transition:transform 200ms var(--pu-ease)}
html.ui-pitch_section_tabs .pu-tab:hover{color:var(--pu-ink)}
html.ui-pitch_section_tabs .pu-tab[aria-current="true"]{color:var(--pu-ink)}
html.ui-pitch_section_tabs .pu-tab[aria-current="true"]::after{transform:scaleX(1)}
html.ui-pitch_section_tabs .pu-tab:focus-visible{outline:2px solid var(--pu-accent);outline-offset:-4px;border-radius:var(--pu-radius)}
html.ui-pitch_section_tabs .lgp .pu-tab{font-family:var(--pu-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase}
@media (max-width:640px){
  html.ui-pitch_section_tabs .wrap > .pu-tabs{margin-left:-18px;margin-right:-18px;padding:0 10px}
  html.ui-pitch_section_tabs .lgp .pu-tabs{padding:0 6px}
  html.ui-pitch_section_tabs .pu-tab{padding:0 10px;font-size:13px}
  html.ui-pitch_section_tabs .pu-tab::after{left:10px;right:10px}
}
html.ui-pitch_section_tabs [id^="pu-sec-"]:focus{outline:none}

/* ---------- pitch_completeness (prompt-kit Steps) ---------- */
html.ui-pitch_completeness .pu-elements{margin:0 0 22px;padding:16px 18px;background:var(--pu-surface);border:1px solid var(--pu-line);border-radius:14px;color:var(--pu-ink);font-family:var(--pu-sans)}
html.ui-pitch_completeness .lgp .pu-elements{margin:30px 0 0;max-width:720px;border-radius:0}
html.ui-pitch_completeness .pu-elements-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:12px}
html.ui-pitch_completeness .pu-elements-title{margin:0;font-family:var(--pu-sans);font-size:15px;font-weight:600;letter-spacing:-0.01em;line-height:1.3;color:var(--pu-ink)}
html.ui-pitch_completeness .pu-elements-count{font-family:var(--pu-mono);font-weight:700;color:var(--pu-accent-dark)}
html.ui-pitch_completeness .is-complete .pu-elements-count{color:var(--pu-green)}
html.ui-pitch_completeness .pu-elements-meter{display:flex;gap:3px}
html.ui-pitch_completeness .pu-elements-meter span{width:14px;height:6px;border-radius:2px;background:var(--pu-line)}
html.ui-pitch_completeness .pu-elements-meter span.is-on{background:var(--pu-accent)}
html.ui-pitch_completeness .is-complete .pu-elements-meter span.is-on{background:var(--pu-green)}
html.ui-pitch_completeness .pu-elements-steps{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
html.ui-pitch_completeness .pu-step{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:4px 11px 4px 6px;border:1px solid var(--pu-line);border-radius:var(--pu-pill);background:var(--pu-paper);color:var(--pu-ink);font-size:12.5px;font-weight:600;line-height:1;text-decoration:none;transition:border-color 160ms var(--pu-ease),transform 160ms var(--pu-ease)}
html.ui-pitch_completeness a.pu-step:hover{border-color:var(--pu-accent)}
html.ui-pitch_completeness a.pu-step:active{transform:scale(0.97)}
html.ui-pitch_completeness a.pu-step:focus-visible{outline:2px solid var(--pu-accent);outline-offset:2px}
html.ui-pitch_completeness .pu-step-mark{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:var(--pu-pill);background:var(--pu-green);color:var(--pu-surface)}
html.ui-pitch_completeness .pu-step.is-missing{color:var(--pu-muted);border-style:dashed}
html.ui-pitch_completeness .pu-step.is-missing .pu-step-mark{background:transparent;border:1px dashed var(--pu-muted)}
html.ui-pitch_completeness .pu-elements-note{margin:10px 0 0 !important;font-size:12.5px;line-height:1.5;color:var(--pu-muted)}
html.ui-pitch_completeness .lgp .pu-step,html.ui-pitch_completeness .lgp .pu-elements-note{font-family:var(--pu-mono)}

/* ---------- pitch_quote_source (beautifului.dev inline source + shadcn/ui Hover Card) ---------- */
html.ui-pitch_quote_source .pu-source{position:relative;display:inline-block;vertical-align:baseline;font-style:normal}
html.ui-pitch_quote_source .hook > .pu-source{display:block;margin-top:16px}
html.ui-pitch_quote_source [data-pu-replaced="pitch_quote_source"]{display:none}
html.ui-pitch_quote_source .pu-source-chip{appearance:none;display:inline-flex;align-items:center;gap:7px;max-width:100%;min-height:32px;padding:4px 12px 4px 4px;border:1px solid var(--pu-line);border-radius:var(--pu-radius);background:var(--pu-surface);color:var(--pu-ink);font:600 12.5px/1.3 var(--pu-sans);cursor:pointer;text-align:left;transition:border-color 160ms var(--pu-ease),transform 160ms var(--pu-ease)}
html.ui-pitch_quote_source .pu-source-chip:hover,html.ui-pitch_quote_source .is-open > .pu-source-chip{border-color:var(--pu-accent)}
html.ui-pitch_quote_source .pu-source-chip:active{transform:scale(0.97)}
html.ui-pitch_quote_source .pu-source-chip:focus-visible{outline:2px solid var(--pu-accent);outline-offset:2px}
html.ui-pitch_quote_source .pu-source-kicker{flex:0 0 auto;align-self:flex-start;padding:4px 8px;border-radius:calc(var(--pu-radius) - 4px);background:var(--pu-accent-soft);color:var(--pu-accent-dark);font-family:var(--pu-mono);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
html.ui-pitch_quote_source .pu-source-name{min-width:0;padding:3px 0;overflow-wrap:anywhere}
html.ui-pitch_quote_source .hook .pu-source-chip{border-color:rgba(248,245,240,0.22);background:rgba(248,245,240,0.08);color:var(--cream)}
html.ui-pitch_quote_source .hook .pu-source-chip:hover,html.ui-pitch_quote_source .hook .is-open > .pu-source-chip{border-color:var(--pu-accent)}
html.ui-pitch_quote_source .hook .pu-source-kicker{background:var(--pu-accent);color:var(--surface)}
html.ui-pitch_quote_source .pu-source-card{position:absolute;z-index:60;top:calc(100% + 8px);left:0;display:flex;flex-direction:column;gap:6px;width:min(320px, calc(100vw - 32px));padding:14px 16px;background:var(--pu-surface);color:var(--pu-ink);border:1px solid var(--pu-line);border-radius:var(--pu-radius);box-shadow:var(--pu-shadow);font:400 13px/1.5 var(--pu-sans);text-align:left;white-space:normal;transform-origin:top left;animation:pu-pop-in 180ms var(--pu-ease)}
html.ui-pitch_quote_source .pu-source-card[hidden]{display:none}
html.ui-pitch_quote_source .pu-source-card-kicker{font-family:var(--pu-mono);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--pu-muted)}
html.ui-pitch_quote_source .pu-source-card-name{font-size:14px;font-weight:700;line-height:1.35}
html.ui-pitch_quote_source .pu-source-card-meta{color:var(--pu-muted);font-size:12.5px}
html.ui-pitch_quote_source .pu-source-card-state{color:var(--pu-green);font-family:var(--pu-mono);font-size:11px;font-weight:700}
html.ui-pitch_quote_source .pu-source-card-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
html.ui-pitch_quote_source .pu-source-card-link{display:inline-flex;align-items:center;min-height:34px;padding:6px 11px;border:1px solid var(--pu-ink);border-radius:var(--pu-radius);background:var(--pu-ink);color:var(--pu-surface);font-size:12.5px;font-weight:700;text-decoration:none}
html.ui-pitch_quote_source .pu-source-card-link.is-quiet{background:transparent;color:var(--pu-ink);border-color:var(--pu-line)}
html.ui-pitch_quote_source .pu-source-card-link:focus-visible{outline:2px solid var(--pu-accent);outline-offset:2px}
@keyframes pu-pop-in{from{opacity:0;transform:scale(0.96) translateY(-4px)}to{opacity:1;transform:none}}

/* ---------- pitch_copy (shadcn/ui Sonner toast) ---------- */
html.ui-pitch_copy .pu-copy{appearance:none;display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:5px 11px;border:1px solid var(--pu-line);border-radius:var(--pu-radius);background:var(--pu-surface);color:var(--pu-ink);font:600 12.5px/1.2 var(--pu-sans);cursor:pointer;transition:border-color 160ms var(--pu-ease),transform 160ms var(--pu-ease)}
html.ui-pitch_copy .pu-copy:hover{border-color:var(--pu-accent)}
html.ui-pitch_copy .pu-copy:active{transform:scale(0.97)}
html.ui-pitch_copy .pu-copy:focus-visible{outline:2px solid var(--pu-accent);outline-offset:2px}
html.ui-pitch_copy .pu-copy.is-copied{border-color:var(--pu-green);color:var(--pu-green)}
html.ui-pitch_copy .pu-copy.is-small{margin-top:10px;min-height:30px;padding:4px 10px;color:var(--pu-muted);font-size:12px;font-weight:500}
html.ui-pitch_copy .pu-copy.is-small:hover{color:var(--pu-ink)}
html.ui-pitch_copy .lgp .pu-copy{font-family:var(--pu-mono)}
html.ui-pitch_copy .lgp .pu-copy.is-small{display:flex;margin-top:12px}
html.ui-pitch_copy .pu-copy-row{display:flex;justify-content:flex-end;margin:0 0 18px}
html.ui-pitch_copy .pu-copy-row.is-start{justify-content:flex-start;margin:-2px 0 16px}
html.ui-pitch_copy .pu-toaster{position:fixed;z-index:10001;right:24px;bottom:24px;display:flex;flex-direction:column;align-items:flex-end;gap:8px;pointer-events:none}
html.ui-pitch_copy .pu-toast{display:flex;align-items:center;gap:10px;max-width:min(360px, calc(100vw - 32px));padding:12px 16px;background:var(--hadef-ink);color:var(--hadef-cream);border-radius:var(--pu-radius);box-shadow:var(--pu-shadow);font:600 13.5px/1.4 var(--pu-sans);opacity:0;transform:translateY(8px);transition:opacity 220ms var(--pu-ease),transform 220ms var(--pu-ease)}
html.ui-pitch_copy .pu-toast.is-in{opacity:1;transform:none}
html.ui-pitch_copy .pu-toast-mark{flex:0 0 auto;width:8px;height:8px;border-radius:2px;background:var(--hadef-accent)}
@media (max-width:640px){
  html.ui-pitch_copy .pu-toaster{left:16px;right:16px;bottom:16px;align-items:center}
}

/* ---------- motion and print ---------- */
@media (prefers-reduced-motion: reduce){
  html[class*="ui-pitch_"] [data-ui-upgrade^="pitch_"],
  html[class*="ui-pitch_"] [data-ui-upgrade^="pitch_"] *,
  html[class*="ui-pitch_"] .pu-tab::after,
  html[class*="ui-pitch_"] .pu-toast,
  html[class*="ui-pitch_"] .pu-source-card{transition:none !important;animation:none !important}
}
@media print{
  html[class*="ui-pitch_"] .pu-tabs,
  html[class*="ui-pitch_"] .pu-copy,
  html[class*="ui-pitch_"] .pu-copy-row,
  html[class*="ui-pitch_"] .pu-toaster,
  html[class*="ui-pitch_"] .pu-source-card{display:none !important}
}
