/* In-flow placement keeps the site's navigation and contact links clear. */
.portfolio-chat {
  color: var(--ink, var(--c-222922));
  font: 14px/1.6 var(--sans, 'DM Sans', Arial, sans-serif);
  margin-block: 0 48px;
  min-width: 0;
}
.portfolio-chat *, .portfolio-chat *::before, .portfolio-chat *::after { box-sizing: border-box; }
.portfolio-chat [hidden] { display: none !important; }
.portfolio-chat button, .portfolio-chat textarea { font: inherit; }
.portfolio-chat button { cursor: pointer; }
.portfolio-chat button:disabled { cursor: default; opacity: .65; }
.portfolio-chat-toggle, .portfolio-chat-send {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 17px;
  border: 1px solid var(--forest, var(--c-294537));
  border-radius: 3px;
  background: var(--forest, var(--c-294537));
  color: var(--paper, var(--c-f6f5ef));
  font-size: 13px;
  font-weight: 500;
}
.portfolio-chat-toggle:hover, .portfolio-chat-send:not(:disabled):hover { background: var(--ink, var(--c-222922)); }
.portfolio-chat-panel {
  width: min(100%, 440px);
  margin-top: 14px;
  padding: 22px;
  border: 1px solid var(--line, var(--c-d9ddd2));
  border-radius: 4px;
  background: var(--paper, var(--c-f6f5ef));
  overflow-wrap: anywhere;
}
.portfolio-chat-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.portfolio-chat-title { font: 400 30px/1.2 var(--serif, 'Instrument Serif', Georgia, serif); letter-spacing: -.5px; margin: 0; }
.portfolio-chat-close, .portfolio-chat-starter {
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid var(--line, var(--c-d9ddd2));
  border-radius: 3px;
  background: transparent;
  color: inherit;
  font-size: 12px;
}
.portfolio-chat-close { flex-shrink: 0; }
.portfolio-chat-close:hover, .portfolio-chat-starter:not(:disabled):hover { background: var(--light, var(--c-e8eddf)); }
.portfolio-chat-intro { margin: 16px 0 9px; }
.portfolio-chat-privacy { color: var(--chat-muted, var(--muted, var(--c-535e50))); font-size: 12px; margin: 0 0 16px; }
.portfolio-chat-starters { display: flex; flex-wrap: wrap; gap: 7px; }
.portfolio-chat-starter { max-width: 100%; text-align: left; overflow-wrap: anywhere; }
.portfolio-chat-transcript {
  position: relative;
  scroll-behavior: auto;
  max-height: 270px;
  max-height: min(32dvh, 270px);
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-gutter: stable;
  scrollbar-color: var(--c-819775) transparent;
  margin-block: 18px;
}
.portfolio-chat-transcript:empty { margin-block: 12px; }
.portfolio-chat-entry { padding: 12px; border-top: 1px solid var(--line, var(--c-d9ddd2)); }
.portfolio-chat-entry-user { background: var(--light, var(--c-e8eddf)); border-radius: 3px; }
.portfolio-chat-speaker { display: block; font-size: 11px; font-weight: 600; margin-bottom: 5px; }
.portfolio-chat-message { margin: 0; white-space: pre-wrap; }
.portfolio-chat-sources { margin: 10px 0 0; padding-left: 18px; font-size: 12px; }
.portfolio-chat-sources a { text-decoration: underline; text-underline-offset: 3px; }
.portfolio-chat-sources a { display: inline-block; padding-block: 5px; }
.portfolio-chat-label { display: block; font-size: 12px; margin-bottom: 6px; }
.portfolio-chat-input {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 72px;
  max-height: 180px;
  resize: vertical;
  border: 1px solid var(--c-929e89);
  border-radius: 3px;
  padding: 10px;
  background: var(--chat-field, var(--c-fffef9));
  color: inherit;
  font-size: 16px !important;
}
.portfolio-chat-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 9px; }
.portfolio-chat-limit { color: var(--chat-muted, var(--muted, var(--c-535e50))); font-size: 11px; }
.portfolio-chat-status { margin: 12px 0; font-size: 13px; }
.portfolio-chat-status:empty { margin: 0; }
.portfolio-chat :is(button, a, textarea, [tabindex]):focus-visible { outline: 2px solid var(--c-9f6b37); outline-offset: 3px; }
@media (max-width: 600px) {
  .portfolio-chat { margin-bottom: 32px; }
  .portfolio-chat-panel { padding: 16px; }
  .portfolio-chat-title { font-size: 28px; }
}
@media print { .portfolio-chat { display: none !important; } }

/* Three stable suggestion slots; one changes gently, only while visible. */
.portfolio-chat-starters{display:grid;grid-template-columns:minmax(0,1fr);gap:7px}
.portfolio-chat-starter{width:100%;min-height:54px;line-height:1.5}
.portfolio-chat-suggestion-actions{display:flex;flex-wrap:wrap;gap:14px;margin:10px 0 18px}
.portfolio-chat-more{padding:6px 0;border:0;background:none;color:inherit;text-decoration:underline;text-underline-offset:4px;font-size:11px;min-height:32px}
@media(prefers-reduced-motion:no-preference){.portfolio-chat-starter{transition:opacity .5s ease,transform .5s cubic-bezier(.3,.7,.3,1),filter .5s ease}.portfolio-chat-starter.is-swapping,.portfolio-chat-starter.is-replacing{opacity:0;transform:translateY(8px) scale(.98);filter:blur(2px)}}
.portfolio-chat-starters{margin-bottom:18px}

.portfolio-chat-keyboard-hint{font-size:11px;line-height:1.6;color:var(--chat-muted,var(--muted));margin:8px 0 0}

/* Input text must stay readable on every surface and state. */
.portfolio-chat-input{color:var(--ink,var(--c-222922));-webkit-text-fill-color:currentColor;caret-color:currentColor}
.portfolio-chat-input::placeholder{color:var(--chat-muted,var(--c-535e50));opacity:1}
.portfolio-chat-input:disabled{color:var(--ink,var(--c-222922));opacity:.7}
.contact .portfolio-chat-input{color:var(--c-f3f7ee);background:var(--c-13251b);border-color:var(--c-7d9475)}

/* Waiting for the agent: pulsing dots plus a short, changing status line. */
.portfolio-chat-pending{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px}
.portfolio-chat-pending .portfolio-chat-speaker{flex-basis:100%;margin-bottom:0}
.portfolio-chat-dots{display:inline-flex;gap:5px;align-items:center;height:14px}
.portfolio-chat-dots i{width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.35}
.portfolio-chat-pending-text{font-size:13px;color:var(--chat-muted,var(--muted,var(--c-535e50)));transition:opacity .22s ease,transform .22s ease}
.portfolio-chat-pending-text.is-changing{opacity:0;transform:translateY(3px)}
@media(prefers-reduced-motion:no-preference){
  .portfolio-chat-dots i{animation:portfolio-chat-pulse 1.1s ease-in-out infinite}
  .portfolio-chat-dots i:nth-child(2){animation-delay:.16s}
  .portfolio-chat-dots i:nth-child(3){animation-delay:.32s}
  .portfolio-chat-pending{animation:portfolio-chat-arrive .3s ease both}
}
@keyframes portfolio-chat-pulse{0%,80%,100%{opacity:.25;transform:translateY(0) scale(.85)}40%{opacity:1;transform:translateY(-3px) scale(1)}}
@keyframes portfolio-chat-arrive{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* Sending the conversation to Jakub: quick replies and the inline contact form. */
.portfolio-chat-intake{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.portfolio-chat-intake-primary,.portfolio-chat-intake-secondary{min-height:40px;padding:8px 14px;border-radius:3px;font-size:13px;font-weight:500}
.portfolio-chat-intake-primary{border:1px solid var(--forest,var(--c-294537));background:var(--forest,var(--c-294537));color:var(--paper,var(--c-f6f5ef))}
.portfolio-chat-intake-primary:not(:disabled):hover{filter:brightness(1.08)}
.portfolio-chat-intake-secondary{border:1px solid var(--line,var(--c-d9ddd2));background:transparent;color:inherit}
.portfolio-chat-intake-form{display:grid;grid-template-columns:1fr 1fr;gap:10px 12px;padding:14px;border:1px solid var(--line,var(--c-d9ddd2));border-radius:4px;background:var(--light,var(--c-e8eddf))}
.portfolio-chat-intake-intro,.portfolio-chat-intake-note,.portfolio-chat-intake-error,.portfolio-chat-intake-actions{grid-column:1/-1;margin:0}
.portfolio-chat-intake-intro{font-size:13px}
.portfolio-chat-intake-field{display:grid;gap:4px;font-size:12px}
.portfolio-chat-intake-input{width:100%;min-height:40px;padding:8px 10px;border:1px solid var(--c-929e89);border-radius:3px;background:var(--chat-field,var(--c-fffef9));color:var(--ink,var(--c-222922));-webkit-text-fill-color:currentColor;font:inherit;font-size:16px}
.portfolio-chat-intake-note{font-size:11px;color:var(--chat-muted,var(--muted,var(--c-535e50)))}
.portfolio-chat-intake-error{font-size:12px;color:var(--c-b5562f)}
.portfolio-chat-intake-error:empty{display:none}
.portfolio-chat-intake-actions{display:flex;flex-wrap:wrap;gap:8px}
.portfolio-chat-intake-trap{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.contact .portfolio-chat-intake-input{color:var(--c-f3f7ee);background:var(--c-13251b);border-color:var(--c-7d9475)}
.contact .portfolio-chat-intake-error{color:var(--c-f0b08f)}
@media(max-width:600px){.portfolio-chat-intake-form{grid-template-columns:1fr}}

a.portfolio-chat-intake-primary{display:inline-flex;align-items:center;text-decoration:none}

/* "Email chat to Jakub" sits to the right of Send, in the same button style (outline). */
.portfolio-chat-buttons{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}
.portfolio-chat-share{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 17px;border:1px solid var(--forest,#294537);border-radius:3px;background:transparent;color:inherit;font-size:13px;font-weight:500;transition:background .2s ease,color .2s ease}
.portfolio-chat-share:not(:disabled):hover{background:var(--light,#e8eddf)}
.portfolio-chat-share:disabled{opacity:.45}
/* Agent answers: short paragraphs, bullet lists and bold labels. */
.portfolio-chat-rich{white-space:normal}
.portfolio-chat-rich p{margin:0 0 8px}
.portfolio-chat-rich p:last-child,.portfolio-chat-rich ul:last-child{margin-bottom:0}
.portfolio-chat-rich ul{margin:0 0 8px;padding-left:18px}
.portfolio-chat-rich li{margin:0 0 6px}
.portfolio-chat-strong{font-weight:600}
@media(max-width:600px){.portfolio-chat-actions{flex-wrap:wrap}.portfolio-chat-buttons{width:100%;justify-content:stretch}.portfolio-chat-buttons>*{flex:1}}

.portfolio-chat-intro-email{text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.portfolio-chat-intro-email:hover{text-decoration-thickness:2px}

.portfolio-chat-intake-primary.is-waiting{opacity:.6;cursor:progress}
