/* Zenya: one professional finish, loaded last.
   Earlier sheets (zenya-context, overview-polish, site-polish) set layout and
   behaviour; this sheet only sets type scale, colour and control styling so
   the guide reads as part of the product. Minimum text size is 11px. */
body.ek-refresh {
  --zp-ink: #102b40;
  --zp-ink-2: #3c5568;
  --zp-muted: #5d7282;
  --zp-teal: #087f78;
  --zp-teal-2: #066d68;
  --zp-soft: #effaf6;
  --zp-line: #d8e8e4;
}

/* Panel shell */
body.ek-refresh .zenya-dock-panel { background: #fff; border: 1px solid var(--zp-line); border-radius: 18px; box-shadow: 0 24px 60px -30px rgba(16, 43, 64, .35); color: var(--zp-ink); font-family: Inter, system-ui, sans-serif; }
body.ek-refresh .zenya-dock-panel::before { border-color: var(--zp-line); }
body.ek-refresh .zenya-dock-panel.is-hero { height: 600px; padding: 20px 20px 16px; backdrop-filter: none; }

/* Header */
body.ek-refresh .zenya-dock-panel header .ekr-eyebrow { font: 600 11px/1.3 Inter, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--zp-teal); }
body.ek-refresh .zenya-dock-panel header h2 { font: 600 22px/1.1 'Space Grotesk', Inter, sans-serif; letter-spacing: -.02em; color: var(--zp-ink); margin: 4px 0 0; }
body.ek-refresh .zenya-dock-panel header [data-dock-shrink] { font: 500 12px Inter, sans-serif; color: var(--zp-muted); background: transparent; border: 1px solid var(--zp-line); border-radius: 999px; padding: 6px 12px; }
body.ek-refresh .zenya-dock-panel header [data-dock-shrink]:hover { color: var(--zp-teal); border-color: #9fcfc6; }

/* Page context */
body.ek-refresh .zenya-dock-panel .zenya-page-context { gap: 6px; border-bottom: 1px solid var(--zp-line); padding-bottom: 12px; margin-top: 12px; }
body.ek-refresh .zenya-dock-panel .zenya-context { font: 500 12px/1.4 Inter, sans-serif; color: var(--zp-muted); }

/* Every small control shares one pill style */
body.ek-refresh .zenya-dock-panel .zenya-page-context button,
body.ek-refresh .zenya-dock-panel .ekr-quick-questions button,
body.ek-refresh .zenya-dock-panel .zenya-guide-suggestions button,
body.ek-refresh .zenya-dock-panel .zenya-depth-actions button,
body.ek-refresh .zenya-dock-panel .ekr-voice-controls button {
  font: 500 12px/1.2 Inter, sans-serif; color: var(--zp-ink-2); background: var(--zp-soft); border: 1px solid #cfe5df; border-radius: 999px; padding: 7px 12px; min-height: 32px; transition: background .15s ease, border-color .15s ease, color .15s ease;
}
body.ek-refresh .zenya-dock-panel .zenya-page-context button:hover,
body.ek-refresh .zenya-dock-panel .ekr-quick-questions button:hover,
body.ek-refresh .zenya-dock-panel .zenya-guide-suggestions button:hover,
body.ek-refresh .zenya-dock-panel .zenya-depth-actions button:hover:not(:disabled),
body.ek-refresh .zenya-dock-panel .ekr-voice-controls button:hover:not(:disabled) { background: #dff3ec; border-color: #9fcfc6; color: var(--zp-teal-2); }
body.ek-refresh .zenya-dock-panel button[aria-pressed="true"] { background: var(--zp-teal); border-color: var(--zp-teal); color: #fff; }
body.ek-refresh .zenya-dock-panel button:disabled { opacity: .45; cursor: not-allowed; }
body.ek-refresh .zenya-dock-panel button:focus-visible,
body.ek-refresh .zenya-dock-panel input:focus-visible,
body.ek-refresh .zenya-dock-panel summary:focus-visible,
body.ek-refresh .zenya-dock-panel a:focus-visible { outline: 2px solid var(--zp-teal); outline-offset: 2px; }

/* Answer */
body.ek-refresh .zenya-dock-panel .zenya-dock-live .ekr-eyebrow { font: 600 11px/1.3 Inter, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: var(--zp-muted); }
body.ek-refresh .zenya-dock-panel .zenya-dock-answer h3 { font: 600 17px/1.3 'Space Grotesk', Inter, sans-serif; color: var(--zp-ink); margin: 6px 0; }
body.ek-refresh .zenya-dock-panel .zenya-dock-live > p { font: 400 14px/1.65 Inter, sans-serif; color: var(--zp-ink-2); }
body.ek-refresh .zenya-dock-panel .ekr-quick-questions,
body.ek-refresh .zenya-dock-panel .zenya-guide-suggestions,
body.ek-refresh .zenya-dock-panel .zenya-depth-actions,
body.ek-refresh .zenya-dock-panel .ekr-voice-controls { display: flex; flex-wrap: wrap; gap: 6px; }
body.ek-refresh .zenya-dock-panel .zenya-dock-details summary { font: 600 12px Inter, sans-serif; color: var(--zp-teal); cursor: pointer; }
body.ek-refresh .zenya-dock-panel .zenya-dock-details,
body.ek-refresh .zenya-dock-panel [data-guide-meta] { font-size: 12px; color: var(--zp-muted); }
body.ek-refresh .zenya-dock-panel [data-guide-links] a { font: 500 12px Inter, sans-serif; color: var(--zp-teal); }
body.ek-refresh .zenya-dock-panel .zenya-conversation-line { background: var(--zp-soft); border: 1px solid #cfe5df; border-radius: 12px; }
body.ek-refresh .zenya-dock-panel .zenya-conversation-line p { font-size: 13px; color: var(--zp-ink-2); }

/* Ask */
body.ek-refresh .zenya-dock-panel .ekr-guide-ask label { font: 600 12px Inter, sans-serif; color: var(--zp-ink); }
body.ek-refresh .zenya-dock-panel .ekr-guide-ask > div { display: flex; gap: 6px; }
body.ek-refresh .zenya-dock-panel .ekr-guide-ask input { font: 400 14px Inter, sans-serif; color: var(--zp-ink); min-height: 42px; padding: 0 12px; border: 1px solid #c9dcd7; border-radius: 10px; background: #fff; }
body.ek-refresh .zenya-dock-panel .ekr-guide-ask input:focus { border-color: var(--zp-teal); outline: 2px solid rgba(8, 127, 120, .2); outline-offset: 0; }
body.ek-refresh .zenya-dock-panel .ekr-guide-ask button[type="submit"] { font: 600 13px Inter, sans-serif; color: #fff; background: var(--zp-teal); border: 0; border-radius: 10px; min-height: 42px; padding: 0 14px; }
body.ek-refresh .zenya-dock-panel .ekr-guide-ask button[type="submit"]:hover { background: var(--zp-teal-2); }

/* Voice and footer: present but quiet */
body.ek-refresh .zenya-dock-panel .ekr-voice-controls button { background: transparent; }
body.ek-refresh .zenya-dock-panel .ekr-speech-note { font: 400 11px/1.4 Inter, sans-serif; color: var(--zp-muted); }
body.ek-refresh .zenya-dock-panel footer { font: 500 11px/1.4 Inter, sans-serif; color: var(--zp-muted); border-top: 1px solid var(--zp-line); padding-top: 10px; }
body.ek-refresh .zenya-dock-panel footer a { color: var(--zp-teal); font-weight: 600; }

/* Hero mode: give the answer room; the note repeats the footer. */
body.ek-refresh .zenya-dock-panel.is-hero .ekr-speech-note { display: none; }
body.ek-refresh .zenya-dock-panel.is-hero .zenya-dock-body { flex: 1 1 auto; min-height: 150px; }

/* Avatar stage labels */
body.ek-refresh .ekr-avatar-stage .ekr-avatar-name { background: rgba(255, 255, 255, .92); border: 1px solid var(--zp-line); border-radius: 12px; padding: 8px 12px; box-shadow: 0 10px 24px -18px rgba(16, 43, 64, .4); max-width: calc(100% - 32px); }
body.ek-refresh .ekr-avatar-name b { font: 600 14px/1.2 'Space Grotesk', Inter, sans-serif; color: var(--zp-ink); }
body.ek-refresh .ekr-avatar-name span { font: 400 11px/1.3 Inter, sans-serif; color: var(--zp-muted); white-space: normal; }
body.ek-refresh .ekr-avatar-name .ekr-dot { background: var(--zp-teal); }
body.ek-refresh .ekr-avatar-stage .ekr-avatar-toggle { font: 600 12px Inter, sans-serif; color: #fff; background: var(--zp-teal); border: 0; border-radius: 999px; padding: 9px 16px; box-shadow: 0 10px 24px -10px rgba(8, 127, 120, .55); }
body.ek-refresh .ekr-avatar-status { font: 500 11px Inter, sans-serif; color: var(--zp-muted); }

@media (max-width: 600px) {
  body.ek-refresh .zenya-dock-panel.is-hero { height: auto; min-height: 520px; }
  body.ek-refresh .zenya-dock-panel .zenya-dock-live > p { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  body.ek-refresh .zenya-dock-panel button { transition: none; }
}

/* "Following page" toggle: pressed state stays legible. */
body.ek-refresh .zenya-dock-panel .zenya-page-context [data-dock-follow][aria-pressed="true"] { background: var(--zp-teal); border-color: var(--zp-teal); color: #fff; }

/* Homepage hero: the panel sits inside the hero card, so it must fit it,
   and its heading follows the same scale as the floating sidebar. */
body.ek-refresh.eg-home #main-content .zenya-dock-panel.is-hero { height: 572px; }
body.ek-refresh.ekr-home .zenya-dock-panel.is-hero header h2 { font-size: 22px; letter-spacing: -.02em; }
body.ek-refresh.ekr-home .zenya-dock-panel.is-hero header .ekr-eyebrow { font-size: 11px; color: var(--zp-teal); }
body.ek-refresh.ekr-home .zenya-dock-panel.is-hero header [data-dock-shrink] { font-size: 12px; background: transparent; }
body.ek-refresh.ekr-home .zenya-dock-panel.is-hero .zenya-context { font-size: 12px; }
body.ek-refresh.ekr-home .zenya-dock-panel.is-hero .zenya-page-context button { font-size: 12px; }
body.ek-refresh.ekr-home .zenya-dock-panel.is-hero .zenya-page-context [data-dock-follow][aria-pressed="true"] { background: var(--zp-teal); border-color: var(--zp-teal); color: #fff; }
body.ek-refresh.ekr-home .zenya-dock-panel.is-hero .zenya-depth-actions button { background: var(--zp-soft); border-color: #cfe5df; }
body.ek-refresh.ekr-home .zenya-dock-panel.is-hero footer { font-size: 11px; }

/* ── Homepage hero: a welcoming first hello, not a control panel ────────
   The floating sidebar elsewhere keeps every control; in the hero Zenya
   shows a greeting, a short answer and one way to ask. */
body.ek-refresh.eg-home #main-content .zenya-dock-panel.is-hero { height: auto; max-height: 600px; padding: 22px 22px 16px; display: flex; flex-direction: column; gap: 12px; }
body.ek-refresh.eg-home .zenya-dock-panel.is-hero header [data-dock-shrink],
body.ek-refresh.eg-home .zenya-dock-panel.is-hero .zenya-page-context,
body.ek-refresh.eg-home .zenya-dock-panel.is-hero .zenya-dock-details,
body.ek-refresh.eg-home .zenya-dock-panel.is-hero .zenya-guide-suggestions,
body.ek-refresh.eg-home .zenya-dock-panel.is-hero .zenya-pathway-picker,
body.ek-refresh.eg-home .zenya-dock-panel.is-hero [data-guide-parts],
body.ek-refresh.eg-home .zenya-dock-panel.is-hero [data-zenya-replay],
body.ek-refresh.eg-home .zenya-dock-panel.is-hero [data-zenya-stop],
body.ek-refresh.eg-home .zenya-dock-panel.is-hero .zenya-dock-live .ekr-eyebrow { display: none !important; }
body.ek-refresh.eg-home .zenya-dock-panel.is-hero header h2 { font-size: 26px; margin-top: 2px; }
body.ek-refresh.eg-home .zenya-dock-panel.is-hero header .ekr-eyebrow { font-size: 11px; }

/* Greeting as a chat bubble in brand teal. */
body.ek-refresh.eg-home .zenya-dock-panel.is-hero .zenya-conversation-line { background: #effaf6 !important; border: 1px solid #cfe5df !important; border-radius: 16px 16px 16px 4px; padding: 12px 14px; margin: 0; }
body.ek-refresh.eg-home .zenya-dock-panel.is-hero .zenya-conversation-line p { font: 400 14px/1.55 Inter, sans-serif; color: var(--zp-ink) !important; margin: 0; }

/* A short answer: four lines, then "Tell me more". */
body.ek-refresh.eg-home .zenya-dock-panel.is-hero .zenya-dock-body { flex: 0 1 auto; min-height: 0; max-height: none; overflow: visible; }
body.ek-refresh.eg-home .zenya-dock-panel.is-hero .zenya-dock-answer h3 { font-size: 16px; margin: 0 0 4px; }
body.ek-refresh.eg-home .zenya-dock-panel.is-hero .zenya-dock-live > p { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; margin: 0; }
body.ek-refresh.eg-home .zenya-dock-panel.is-hero .ekr-quick-questions { margin-top: 10px; }
body.ek-refresh.eg-home .zenya-dock-panel.is-hero .ekr-voice-controls { justify-content: flex-start; }
body.ek-refresh.eg-home .zenya-dock-panel.is-hero .ekr-voice-controls button { min-height: 28px; padding: 4px 10px; font-size: 11.5px; border-color: transparent; color: var(--zp-muted); }
body.ek-refresh.eg-home .zenya-dock-panel.is-hero footer { padding-top: 8px; }

/* The panel already introduces her, so the floating tag steps aside. */
body.ek-refresh.eg-home .eg-hero-guide:has(.zenya-dock-panel.is-hero:not([hidden])) .ekr-avatar-name { display: none; }
body.ek-refresh.eg-home #main-content .zenya-dock-panel.is-hero { max-height: none; }
body.ek-refresh.eg-home .zenya-dock-panel.is-hero .zenya-dock-body { flex: 0 0 auto !important; height: auto !important; }
body.ek-refresh.eg-home .zenya-dock-panel.is-hero .zenya-depth-actions [data-guide-style] { display: none !important; }
body.ek-refresh.eg-home .zenya-dock-panel.is-hero .zenya-depth-actions,
body.ek-refresh.eg-home .zenya-dock-panel.is-hero .ekr-guide-ask { flex: 0 0 auto; }

/* One dropdown for Zenya's questions, depth and voice controls. */
body.ek-refresh .zenya-dock-panel .eg-zenya-menu { border: 1px solid var(--zp-line); border-radius: 12px; background: #fff; }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu > summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; font: 600 13px Inter, sans-serif; color: var(--zp-ink); }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu > summary::-webkit-details-marker { display: none; }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu > summary::after { content: ''; width: 8px; height: 8px; border-right: 2px solid var(--zp-teal); border-bottom: 2px solid var(--zp-teal); transform: rotate(45deg) translateY(-2px); transition: transform .2s ease; }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu[open] > summary::after { transform: rotate(-135deg) translateY(-2px); }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu > summary:hover { color: var(--zp-teal); }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body { display: grid; gap: 10px; padding: 4px 14px 14px; border-top: 1px solid var(--zp-line); }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body .ekr-quick-questions { margin-top: 10px !important; }
@media (prefers-reduced-motion: reduce) { body.ek-refresh .zenya-dock-panel .eg-zenya-menu > summary::after { transition: none; } }

/* The dropdown floats over Zenya's answer instead of growing her panel,
   so opening it never pushes the page or the sidebar layout. */
body.ek-refresh .zenya-dock-panel .eg-zenya-menu { position: relative; }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body { position: absolute; left: -1px; right: -1px; bottom: calc(100% + 6px); z-index: 6; background: #fff; border: 1px solid var(--zp-line); border-radius: 12px; padding: 12px 14px 14px; box-shadow: 0 18px 40px -18px rgba(16, 43, 64, .35); max-height: 320px; overflow-y: auto; }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu[open] > summary { border-radius: 12px; background: var(--zp-soft); }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body .ekr-quick-questions { margin-top: 0 !important; }

/* The floating dock never shows the avatar loading label over page content. */
body.ek-refresh .zenya-dock-avatar .ekr-avatar-status { display: none !important; }

/* Dropdown as a tidy menu: labelled groups of full-width rows. */
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body { gap: 0; padding: 8px; }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body > * { display: grid !important; grid-template-columns: minmax(0, 1fr); gap: 2px; margin: 0 !important; padding: 6px 0; }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body > * + * { border-top: 1px solid var(--zp-line); }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body > *::before { display: block; padding: 4px 10px 6px; font: 600 10.5px Inter, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: var(--zp-muted); }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body .ekr-quick-questions::before { content: "Suggested questions"; }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body .zenya-depth-actions::before { content: "This answer"; }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body .ekr-voice-controls::before { content: "Voice"; }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body button { display: flex; justify-content: space-between; align-items: center; width: 100%; text-align: left; min-height: 36px; padding: 8px 10px !important; margin: 0 !important; border: 0 !important; border-radius: 9px !important; background: transparent !important; font: 500 13.5px Inter, sans-serif !important; color: var(--zp-ink) !important; box-shadow: none !important; }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body button[hidden] { display: none !important; }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body button:hover:not(:disabled) { background: var(--zp-soft) !important; color: var(--zp-teal-2) !important; }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body .ekr-quick-questions button::after { content: "\2197"; color: var(--zp-teal); font-size: 12px; }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body button:disabled { opacity: .45; }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body button[aria-pressed="true"] { color: var(--zp-teal-2) !important; background: var(--zp-soft) !important; }

/* The menu opens over Zenya's answer and scrolls within her panel; its
   height is fitted to the room available (see enterprise-gateway.js). */
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body { overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #9fcfc6 transparent; }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body::-webkit-scrollbar { width: 6px; }
body.ek-refresh .zenya-dock-panel .eg-zenya-menu-body::-webkit-scrollbar-thumb { background: #9fcfc6; border-radius: 6px; }
