/* Adapters for a server-rendered site. Component look lives in bundle.css, values in tokens.css. */
[hidden] { display: none !important; }
html, body { height: 100%; }
h1, p, dl, dd { margin: 0; }
a { color: inherit; }
.eh-link { color: var(--ion); text-decoration: none; }
.eh-link:hover { text-decoration: underline; }
.eh-neg { color: var(--negative); }
.eh-between { justify-content: space-between; }
.eh-gap-top { margin-top: var(--space-2); }
.eh-gap-bottom { margin-bottom: var(--space-3); }
.eh-page { display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }
.eh-pagehead { flex-wrap: wrap; }
.eh-lede { color: var(--ink-200); font-size: 14px; line-height: 20px; }
.eh-lede b { color: var(--ink-100); font-weight: 500; }
.eh-pre { white-space: pre-wrap; overflow-wrap: anywhere; }
.eh-side { position: sticky; top: 0; height: 100vh; overflow-y: auto; scrollbar-width: none; }
.eh-side::-webkit-scrollbar { display: none; }
.eh-side__brand { text-decoration: none; }
.eh-main { min-height: 100vh; }

/* Store switcher is a real select inside the design system's control */
form.eh-store { position: relative; }
form.eh-store select { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--nav-ink); font-size: 13px; font-weight: 600; appearance: none; cursor: pointer; }
form.eh-store select option { background: var(--nav-bg); color: var(--nav-ink); }
form.eh-store:focus-within { box-shadow: var(--focus-ring); }
form.eh-store select:focus-visible { box-shadow: none; }

/* Links that look like segmented buttons */
.eh-seg { flex-wrap: wrap; max-width: 100%; }
.eh-seg a { display: inline-flex; align-items: center; height: 26px; padding: 0 var(--space-3); border-radius: 6px; color: var(--ink-300); font-size: 12px; font-weight: 600; text-decoration: none; }
.eh-seg a:hover { color: var(--ink-100); }
.eh-seg a[aria-pressed='true'] { background: var(--accent); color: var(--on-accent); font-weight: 600; }

/* Links used as buttons */
a.eh-btn { text-decoration: none; }
button.eh-ava { border: 0; cursor: pointer; padding: 0; }
button.eh-top__s { text-align: left; min-width: 0; }
.eh-top__s > span:not(.eh-kbd) { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
form { margin: 0; }

/* Hero */
.eh-hero { margin-bottom: 0; }
.eh-hero > .eh-panel > .eh-panel__b { padding: 0; }
.eh-herom { height: 100%; }
.eh-strip--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.eh-strip--3 > * + * { border-left: 0; }
.eh-strip--3 > * { border-right: 1px solid var(--line-100); border-bottom: 1px solid var(--line-100); }
.eh-strip--3 > *:nth-child(3n) { border-right: 0; }
.eh-strip--3 > *:nth-last-child(-n+3):nth-child(3n+1), .eh-strip--3 > *:nth-last-child(-n+3):nth-child(3n+1) ~ * { border-bottom: 0; }

/* Grids */
.eh-g-2-1 { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.eh-g-1-1 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.eh-cards { display: grid; gap: var(--space-3); grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.eh-lib { grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); }
.eh-span-all { grid-column: 1 / -1; }
.eh-sectionhead { display: flex; align-items: baseline; gap: var(--space-2); margin-top: var(--space-2); }

/* Chart */
.eh-chart { min-height: 240px; }
.eh-chart .eh-tip { white-space: nowrap; }

/* Days of the offer test */
.eh-days { display: grid; grid-template-columns: repeat(15, minmax(0, 1fr)); gap: 3px; }
.eh-day { height: 16px; border-radius: var(--radius-xs); background: var(--surface-300); }
.eh-day--pass { background: var(--positive); }

/* Forms */
.eh-form { max-width: 820px; }
.eh-form__row { display: grid; gap: var(--space-3); grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); align-items: end; }
.eh-form__row--end { grid-template-columns: minmax(0, 1fr) auto; }
.eh-span { grid-column: 1 / -1; }
.eh-input select { cursor: pointer; }
.eh-input input:focus-visible, .eh-input select:focus-visible, .eh-area textarea:focus-visible { box-shadow: none; }
.eh-input input[type='date'] { color-scheme: inherit; }
.eh-input--sm { height: var(--size-control-sm); padding: 0 var(--space-2); }
.eh-input--sm select { font-size: 12px; }
.eh-area { display: flex; padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); border: 1px solid var(--line-control); background: var(--surface-200); }
.eh-area:focus-within { box-shadow: var(--focus-ring); }
.eh-area textarea { flex: 1; min-width: 0; border: 0; outline: 0; resize: vertical; background: transparent; color: var(--ink-100); font: 13px/18px var(--font-sans); }
.eh-area textarea::placeholder { color: var(--ink-300); }
.eh-file { color: var(--ink-200); font-size: 13px; max-width: 100%; }
.eh-file::file-selector-button { height: var(--size-control-sm); margin-right: var(--space-2); padding: 0 var(--space-2); border-radius: var(--radius-sm); border: 1px solid var(--line-control); background: var(--surface-200); color: var(--ink-100); font: 500 12px var(--font-sans); cursor: pointer; }
.eh-switch--form { position: relative; }
.eh-switch--form input { position: absolute; opacity: 0; width: 32px; height: 18px; margin: 0; cursor: pointer; }
.eh-switch--form input:focus-visible + .eh-switch__t { box-shadow: var(--focus-ring); }
.eh-switch--form input:checked + .eh-switch__t { background: var(--accent); border-color: var(--accent); }
.eh-switch--form input:checked + .eh-switch__t::after { transform: translateX(14px); background: var(--on-accent); }
.eh-checks { display: flex; flex-wrap: wrap; gap: var(--space-3); border: 0; margin: 0; padding: 0; }
.eh-checks legend { padding: 0; margin-bottom: var(--space-2); }
.eh-checks--col { flex-direction: column; flex-wrap: nowrap; gap: var(--space-2); max-height: 220px; overflow-y: auto; padding: var(--space-half); }
.eh-filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--space-3); }
.eh-filters .eh-grow { flex-basis: 220px; }

/* Table helpers */
.eh-table td.eh-wrap { white-space: normal; min-width: 160px; }
.eh-table th[aria-sort='ascending']::after { content: ' ↑'; }
.eh-table th[aria-sort='descending']::after { content: ' ↓'; }
.eh-cell { width: 60px; height: var(--size-control-sm); padding: 0 var(--space-1); border: 1px solid var(--line-control); border-radius: var(--radius-sm); background: var(--surface-200); color: var(--ink-100); font: 13px var(--font-mono); text-align: center; }
.eh-cell--select { width: auto; max-width: 180px; text-align: left; font-family: var(--font-sans); }
.eh-tick { width: 16px; height: 16px; margin: 0; accent-color: var(--accent-text); vertical-align: middle; }

/* Inline notices */
.eh-notice { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-2) var(--space-3); border: 1px solid var(--line-200); border-radius: var(--radius-md); background: var(--surface-100); color: var(--ink-200); font-size: 13px; line-height: 18px; }
.eh-notice__i { flex: none; display: grid; place-items: center; width: 24px; height: 24px; border-radius: var(--radius-sm); background: var(--warning-soft); color: var(--warning); }
.eh-notice__i--negative { background: var(--negative-soft); color: var(--negative); }
.eh-notice__i--positive { background: var(--positive-soft); color: var(--positive); }

/* Toasts and command palette */
.eh-toasts { position: fixed; right: var(--space-6); bottom: var(--space-6); z-index: var(--z-toast); display: flex; flex-direction: column; gap: var(--space-2); max-width: min(420px, calc(100vw - 32px)); }
.eh-cmdwrap { position: fixed; inset: 0; z-index: var(--z-modal); display: flex; justify-content: center; align-items: flex-start; padding: 12vh var(--space-4) var(--space-4); background: rgba(7, 8, 10, .6); }
.eh-cmd__list { max-height: 50vh; overflow-y: auto; }
a.eh-cmd__i { text-decoration: none; }

/* Notes board */
.eh-board { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(200px, 1fr); gap: var(--space-3); overflow-x: auto; padding-bottom: var(--space-2); align-items: start; }
.eh-board__c { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-2); background: var(--surface-100); border: 1px solid var(--line-200); border-radius: var(--radius-md); }
.eh-board__h { display: flex; justify-content: space-between; align-items: center; padding: var(--space-1) var(--space-2); }
.eh-notecard { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-3); background: var(--surface-200); border: 1px solid var(--line-100); border-radius: var(--radius-sm); }
.eh-notecard__t { font-size: 13px; line-height: 18px; font-weight: 500; text-decoration: none; }
.eh-notecard__t:hover { color: var(--accent-text); }

/* Spy, copy, library */
.eh-clamp { display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; white-space: pre-wrap; overflow-wrap: anywhere; }
.eh-copy { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--line-100); }
.eh-copy:last-child { border-bottom: 0; }
.eh-cr--static { cursor: default; }
.eh-cr--static:hover { transform: none; }
.eh-cr__art img, .eh-cr__art video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: var(--bg-000); }
.eh-cr__audio { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-3); padding: var(--space-2); color: var(--ink-300); }
.eh-cr__audio audio { width: 100%; }
.eh-video { display: block; width: 100%; max-height: 460px; object-fit: contain; background: var(--bg-000); border-radius: var(--radius-sm); }
.eh-edit { display: grid; grid-template-columns: minmax(0, 280px) minmax(0, 1fr); gap: var(--space-4); align-items: start; }
.eh-dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-2) var(--space-4); align-items: baseline; }
.eh-dl dd { overflow-wrap: anywhere; }

/* Sign-in */
.eh-auth { min-height: 100%; display: grid; place-items: center; padding: var(--space-4); background-color: var(--bg-100); }
.eh-auth__box { display: flex; flex-direction: column; gap: var(--space-4); width: min(100%, 380px); }
.eh-auth__logo { display: flex; justify-content: center; }

@media (min-width: 1600px) { .eh-days { grid-template-columns: repeat(30, minmax(0, 1fr)); } }
@media (max-width: 1100px) {
  .eh-hero, .eh-g-2-1, .eh-g-1-1, .eh-edit { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .eh-shell { grid-template-columns: minmax(0, 1fr); }
  .eh-side { position: static; height: auto; overflow: visible; border-right: 0; border-bottom: 1px solid var(--line-100); }
  .eh-side { gap: var(--space-2); }
  .eh-nav { flex-direction: row; overflow-x: auto; scrollbar-width: none; margin: 0 calc(var(--space-3) * -1); padding: 0 var(--space-3); }
  .eh-nav::-webkit-scrollbar { display: none; }
  .eh-nav a { flex: none; }
  .eh-nav__g, .eh-side__foot { display: none; }
  .eh-main { min-height: 0; }
  .eh-top { padding: 0 var(--space-4); }
  .eh-top__s { min-width: 0; }
  .eh-top__s .eh-kbd { display: none; }
  .eh-canvas { padding: var(--space-4); }
  .eh-strip--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .eh-strip--3 > *, .eh-strip--3 > *:nth-child(3n), .eh-strip--3 > *:nth-last-child(-n+3):nth-child(3n+1), .eh-strip--3 > *:nth-last-child(-n+3):nth-child(3n+1) ~ * { border-right: 1px solid var(--line-100); border-bottom: 1px solid var(--line-100); }
  .eh-strip--3 > *:nth-child(2n) { border-right: 0; }
  .metric-xl { font-size: 36px; line-height: 40px; }
  .metric-lg { font-size: 22px; line-height: 28px; }
  .eh-funnel__r { grid-template-columns: 64px minmax(0, 1fr) 52px 44px; gap: var(--space-2); }
  .eh-wf__v { font-size: 10px; }
  .eh-wf__l { font-size: 10px; }
  .eh-toasts { right: var(--space-4); bottom: var(--space-4); }
}

/* Crew */
.eh-command { display: flex; gap: var(--space-2); }
.eh-input--lg { flex: 1; min-width: 0; height: var(--size-control-lg); }
.eh-input--lg input { font-size: 14px; }
.eh-steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.eh-step { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-3) var(--space-4); min-width: 0; }
.eh-step .eh-badge { align-self: flex-start; }
.eh-step + .eh-step { border-left: 1px solid var(--line-100); }
.eh-items { display: grid; gap: var(--space-3); grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }
.eh-item__body { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-3); min-width: 0; }
.eh-item__body details summary { cursor: pointer; color: var(--ink-300); font-size: 12px; }
.eh-item__body details[open] summary { margin-bottom: var(--space-2); }
@media (max-width: 900px) {
  .eh-steps { grid-template-columns: minmax(0, 1fr); }
  .eh-step + .eh-step { border-left: 0; border-top: 1px solid var(--line-100); }
}
@media (max-width: 760px) { .eh-command { flex-direction: column; } .eh-input--lg { flex: none; } }

/* Tabs that are links (Spy: ads / sites) */
.eh-tabs--links { margin-bottom: var(--space-5); }
.eh-tabs--links a { position: relative; display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-3) 0; color: var(--ink-300); font-size: 13px; line-height: 18px; font-weight: 500; text-decoration: none; }
.eh-tabs--links a:hover { color: var(--ink-100); }
.eh-tabs--links a[aria-selected='true'] { color: var(--ink-100); }
.eh-tabs--links a[aria-selected='true']::after { content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--accent-text); }
.eh-sep { border: 0; border-top: 1px solid var(--line-100); margin: var(--space-4) 0; }
.eh-strip--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: var(--space-3); }
@media (max-width: 760px) {
  .eh-strip--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .eh-strip--4 > * + * { border-left: 0; }
  .eh-strip--4 > * { border-bottom: 1px solid var(--line-100); }
  .eh-strip--4 > *:nth-child(odd) { border-right: 1px solid var(--line-100); }
}

/* Offer preview: real-width pages scaled into panels */
.eh-previews { display: grid; grid-template-columns: 420px minmax(0, 1fr); gap: var(--space-3); align-items: start; }
.eh-device { position: relative; overflow: hidden; border-radius: var(--radius-sm); border: 1px solid var(--line-200); background: #fff; }
.eh-device iframe { border: 0; display: block; transform-origin: 0 0; }
.eh-device--phone { width: 390px; height: 760px; }
.eh-device--phone iframe { width: 390px; height: 760px; }
.eh-device--desk { width: 100%; aspect-ratio: 1280 / 820; }
.eh-device--desk iframe { width: 1280px; height: 820px; transform: scale(var(--desk-scale, .5)); }
@media (max-width: 1100px) { .eh-previews { grid-template-columns: minmax(0, 1fr); } .eh-device--desk { display: none; } }

/* Offer view */
.eh-facts { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: var(--space-2) var(--space-4); margin: 0; font-size: 13px; line-height: 18px; }
.eh-facts dt { color: var(--ink-300); }
.eh-facts dd { margin: 0; }
.eh-details summary { cursor: pointer; color: var(--accent-text); font-size: 13px; }
.eh-blocks { display: grid; gap: var(--space-2); }
.eh-blockrow { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-3); border: 1px solid var(--line-100); border-radius: var(--radius-sm); background: var(--surface-100); }
.eh-blockrow--off { opacity: .55; }
.eh-blockrow__h { display: flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; }
.eh-thumbs { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.eh-thumbs img { width: 72px; height: 72px; object-fit: cover; border-radius: var(--radius-xs); border: 1px solid var(--line-100); }
.eh-steps--8 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 900px) { .eh-steps--8 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Product gallery */
.eh-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: var(--space-3); }
.eh-gallery__item { margin: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.eh-gallery__item img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: var(--radius-md); border: 1px solid var(--line-100); background: var(--surface-200); }
.eh-gallery__item figcaption { justify-content: space-between; }
.eh-cell--text { width: 100%; min-width: 180px; text-align: left; font-family: var(--font-sans); }

.eh-refs { display: flex; flex-wrap: wrap; gap: var(--space-2); max-height: 228px; overflow-y: auto; }
.eh-ref { position: relative; width: 72px; height: 72px; border: 2px solid var(--line-200); border-radius: var(--radius-sm); overflow: hidden; cursor: pointer; }
.eh-ref img { width: 100%; height: 100%; object-fit: cover; display: block; }
.eh-ref input { position: absolute; top: 4px; left: 4px; }
.eh-ref:has(input:checked) { border-color: var(--volt); box-shadow: 0 0 0 2px var(--volt); }
