/* accept² Shop — the assistant as a whole website.
   Desktop: a full-page app with a side menu. Phones: the app fills the screen, menu at the bottom. */
html.a2app, html.a2app body { height: 100%; margin: 0; overflow: hidden; background: radial-gradient(1200px 600px at 70% -10%, #E3ECFF 0%, #F5F7FB 55%) fixed, #F5F7FB; }
.app-bar { position: fixed; z-index: 1100; inset: 0 0 auto; height: 60px; display: flex; align-items: center; gap: 16px; padding: 0 22px;
  background: rgba(255,255,255,.82); border-bottom: 1px solid rgba(10,37,64,.08); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.app-brand { display: flex; align-items: center; gap: 8px; color: #0A2540; text-decoration: none; }
.app-brand .wordmark { font: 700 1.2rem/1 var(--font-display, 'Outfit'); }
.app-brand em { font-style: normal; padding: 3px 8px; border-radius: 99px; background: #0A2540; color: #fff; font: 600 .7rem/1 var(--font-body); letter-spacing: .04em; }
.app-engines { display: flex; gap: 6px; margin-left: auto; }
.app-issuer { display: flex; align-items: center; gap: 8px; font: 500 .78rem var(--font-body); color: #5A6478; }
.app-issuer select { height: 32px; padding: 0 8px; border: 1px solid #DCE3EE; border-radius: 9px; background: #fff; font: 500 .8rem var(--font-body); color: #0A2540; }
/* engine chips (bar, results, settings) */
.eng { display: inline-flex; align-items: center; padding: 3px 8px; border-radius: 99px; font: 600 .66rem/1 var(--font-body); font-style: normal; color: #fff; }
.eng--chatgpt { background: #10A37F; } .eng--gemini { background: linear-gradient(90deg, #4285F4, #9B72CB); } .eng--claude { background: #D97757; }
.eng.is-off { background: #C9D1DC; color: #fff; }
.eng-chips { display: inline-flex; flex-wrap: wrap; gap: 3px; margin-top: 3px; }
.eng-chips .eng { padding: 2px 6px; font-size: .58rem; }
.st-eng b { display: flex; align-items: center; gap: 6px; }
.st-eng b .eng-chips { margin: 0; }
.st-eng b .eng-chips .eng { font-size: 0; width: 10px; height: 10px; padding: 0; border-radius: 50%; }

/* the assistant fills the page under the bar */
html.a2app .phx--shop { top: 60px; background: none; -webkit-backdrop-filter: none; backdrop-filter: none; opacity: 1; place-items: stretch; }
html.a2app .phx--shop .phx__bubble { transform: none !important; width: 100%; height: 100%; align-items: stretch; transition: none; }
html.a2app .phx--shop .phx__bubble::before, html.a2app .phx__close, html.a2app .phx__close2, html.a2app .phx__note,
html.a2app .phx__btn, html.a2app .phx__status { display: none !important; }
html.a2app .phx--shop .phx__device { width: 100%; height: 100%; padding: 0; border-radius: 0; background: none; box-shadow: none; }
html.a2app .phx--shop .phx__screen { border-radius: 0; background: transparent; }
html.a2app .phx--shop .phx__body { padding-top: 14px; }
html.a2app .phx--shop .phx__body > * { max-width: 760px; margin-inline: auto; }

@media (min-width: 900px) {
  /* desktop: menu on the left, content centred, sheets as side panels */
  html.a2app .phx--shop .phx__screen { display: grid; grid-template-columns: 220px 1fr; grid-template-rows: 1fr; }
  html.a2app .phx--shop .phx__tabs { grid-column: 1; grid-row: 1; order: -1; flex-direction: column; justify-content: flex-start; gap: 4px; padding: 22px 12px;
    background: rgba(255,255,255,.7); border-top: 0; border-right: 1px solid rgba(10,37,64,.08); }
  html.a2app .phx--shop .phx__tabs button { flex: none; flex-direction: row; justify-content: flex-start; gap: 12px; width: 100%; min-height: 44px; padding: 0 14px;
    border-radius: 12px; font-size: .9rem; }
  html.a2app .phx--shop .phx__tabs button[aria-current="page"], html.a2app .phx--shop .phx__tabs button:hover { background: #EAF0FA; color: #1A4FC4; }
  html.a2app .phx--shop .phx__tabs button.phx__tab-ag { margin-top: 0; order: 9; margin-top: 12px; }
  html.a2app .phx--shop .phx__body { grid-column: 2; grid-row: 1; padding: 22px 32px 40px; scrollbar-width: thin; }
  html.a2app .phx--shop .shp-sheet { left: auto !important; right: 0; width: min(520px, 46vw); box-shadow: -20px 0 50px -20px rgba(10,37,64,.35); }
  html.a2app .phx--shop .shp-coach { display: none; }
}
@media (max-width: 899px) {
  .app-bar { height: 52px; padding: 0 12px; gap: 10px; }
  .app-issuer span { display: none; }
  .app-engines .eng { font-size: .58rem; padding: 3px 6px; }
  html.a2app .phx--shop { top: 52px; }
  html.a2app .phx--shop .phx__tabs { padding-bottom: calc(10px + env(safe-area-inset-bottom)); }
}
@media (max-width: 480px) { .app-brand .wordmark { display: none; } .app-issuer select { max-width: 120px; } }
/* the bar already carries the brand: no second logo inside the app */
html.a2app .phx--shop .shp-head--logo, html.a2app .phx--shop .shp-co__by { display: none; }
.st-eng b { gap: 8px; }
.st-eng b .eng-chips { flex: none; margin-right: 2px; }
@media (max-width: 600px) {
  .app-brand em { display: none; }
  .app-engines { gap: 5px; }
  .app-engines .eng { font-size: 0; width: 11px; height: 11px; padding: 0; border-radius: 50%; }
  .app-issuer select { max-width: 150px; }
}
.app-lang { padding: 6px 10px; border: 1px solid #DCE3EE; border-radius: 9px; background: #fff; color: #0A2540; font: 600 .78rem/1 var(--font-body); text-decoration: none; }
@media (max-width: 600px) { .app-lang { padding: 6px 7px; font-size: .7rem; } }
/* photo options (Wizard): compact tiles, not half-page squares */
html.a2app .phx--shop .shp-optgrid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important; gap: 10px; }
html.a2app .phx--shop .shp-optgrid button { min-height: 0; }
html.a2app .phx--shop .shp-optimg { aspect-ratio: auto; height: 110px; }
html.a2app .phx--shop .wz2-grid .shp-optimg { height: 96px; }
@media (min-width: 900px) {
  /* menu: Search, Compare, Agents, Orders on top; Settings on its own at the bottom */
  html.a2app .phx--shop .phx__tabs button[data-k="search"] { order: 1; }
  html.a2app .phx--shop .phx__tabs button[data-k="compare"] { order: 2; }
  html.a2app .phx--shop .phx__tabs button.phx__tab-ag { order: 3; margin-top: 0; }
  html.a2app .phx--shop .phx__tabs button[data-k="orders"] { order: 4; }
  html.a2app .phx--shop .phx__tabs button[data-k="settings"] { order: 10; margin-top: auto; border-top: 1px solid rgba(10,37,64,.08); border-radius: 0 0 12px 12px; padding-top: 4px; }
  html.a2app .phx--shop .phx__tabs button.phx__tab-ag .tk-logo { width: 26px; height: 26px; }
  html.a2app .phx--shop .phx__tabs button.phx__tab-ag .tk-logo img, html.a2app .phx--shop .phx__tabs button.phx__tab-ag .tk-logo svg { width: 16px; height: 16px; }
}
/* the app is exactly the window under the bar; only the content area scrolls (nothing is cut off) */
html.a2app .phx--shop { bottom: 0; height: auto; }
html.a2app .phx--shop .phx__bubble, html.a2app .phx--shop .phx__device, html.a2app .phx--shop .phx__screen { height: calc(100dvh - 60px); max-height: calc(100dvh - 60px); }
html.a2app .phx--shop .phx__body { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding-bottom: 48px; }
@media (min-width: 900px) { html.a2app .phx--shop .phx__screen { grid-template-rows: minmax(0, 1fr); } }
@media (max-width: 899px) {
  html.a2app .phx--shop .phx__bubble, html.a2app .phx--shop .phx__device, html.a2app .phx--shop .phx__screen { height: calc(100dvh - 52px); max-height: calc(100dvh - 52px); }
  html.a2app .phx--shop .phx__screen { display: flex; flex-direction: column; }
  html.a2app .phx--shop .phx__body { flex: 1 1 0; }
}

/* ===== calm: easy on the eyes ===== */
/* Hebrew typed in the search box: Aptos where installed (Office), else Assistant (clean Hebrew) */
html.a2app .shp-search input { font-family: Aptos, "Aptos Display", Assistant, "Segoe UI", Arial, sans-serif; font-size: 1rem; }
html.a2app .shp-search input:dir(rtl) { font-family: Aptos, Assistant, Arial, sans-serif; }
html.a2app.is-he .phx--shop, html.a2app.is-he .app-bar { font-family: Aptos, Assistant, var(--font-body); }

/* results first; context after */
html.a2app .phx--shop .phx__body { display: flex; flex-direction: column; }
html.a2app .phx--shop .phx__body > * { order: 5; flex: none; }
html.a2app .phx--shop .phx__body > .shp-rtop { order: 1; }
html.a2app .phx--shop .phx__body > .shp-chips { order: 2; }
html.a2app .phx--shop .phx__body > .shp-sort { order: 3; }
html.a2app .phx--shop .phx__body > .shp-count { order: 4; }
html.a2app .phx--shop .phx__body > .shp-sum { order: 7; }
html.a2app .phx--shop .phx__body > .ag-cta { order: 8; }
html.a2app .phx--shop .phx__body > .shp-browse { order: 9; }
html.a2app .phx--shop .phx__body > .shp-lanes { order: 6; }
html.a2app .phx--shop .shp-lanes:not(:has(.is-run)) { display: none; }   /* progress only while searching */

/* quieter controls */
html.a2app .phx--shop .shp-chips { gap: 6px; margin-top: 10px; }
html.a2app .phx--shop .shp-chips button { border-color: transparent; background: #EEF2F8; color: #5A6478; box-shadow: none; font-weight: 500; }
html.a2app .phx--shop .shp-chips button[aria-pressed="true"] { background: #E3ECFF; color: #1A4FC4; }
html.a2app .phx--shop .shp-sort { margin-top: 8px; background: none; padding: 0; gap: 18px; justify-content: flex-start; border-bottom: 1px solid #E6EBF2; border-radius: 0; }
html.a2app .phx--shop .shp-sort button { flex: none; padding: 8px 2px; border-radius: 0; background: none !important; box-shadow: none !important; color: #8792A2; font-weight: 500; border-bottom: 2px solid transparent; margin-bottom: -1px; }
html.a2app .phx--shop .shp-sort button[aria-pressed="true"], html.a2app .phx--shop .shp-sort button[aria-checked="true"], html.a2app .phx--shop .shp-sort button.is-on { color: #0A2540; border-bottom-color: #1A6BFF; }
html.a2app .phx--shop .shp-count { margin: 14px 2px 4px; color: #8792A2; font-size: .78rem; }

/* offers: light cards with room to breathe */
html.a2app .phx--shop .shp-o { margin-bottom: 10px; border: 1px solid #EEF1F6; box-shadow: none; border-radius: 16px; }
html.a2app .phx--shop .shp-o.is-best { border-color: #BFE3CF; }
html.a2app .phx--shop .shp-o__row { padding: 14px 16px; gap: 14px; }
html.a2app .phx--shop .shp-o__ph { width: 64px; height: 64px; }
html.a2app .phx--shop .wz-more { background: none; color: #1A6BFF; font-weight: 500; padding: 0 16px 12px; text-align: left; width: auto; }
html.a2app .phx--shop .eng-chips .eng { background: none; color: #8792A2; border: 1px solid #E1E6EE; }
html.a2app .phx--shop .shp-b--chk { background: #FFF6E5; color: #9A5B00; }
html.a2app .phx--shop .shp-chk { display: flex; align-items: center; gap: 5px; margin: 6px 0 2px; font-size: .74rem; color: #12A150; }

/* context after the results, as quiet text */
html.a2app .phx--shop .shp-sum { margin-top: 18px; border: 0; background: none; box-shadow: none; padding: 0 2px; color: #6B7689; font-size: .8rem; }
html.a2app .phx--shop .shp-sum > svg { display: none; }
html.a2app .phx--shop .ag-cta { margin-top: 12px; min-height: 0; padding: 10px 14px; border-radius: 12px; background: #EEF8F4; color: #0B6E4F; box-shadow: none; }
html.a2app .phx--shop .ag-cta small { color: #3D6B57; }
html.a2app .phx--shop .shp-browse { margin-top: 10px; }
html.a2app .phx--shop .shp-browse a { background: none; border: 0; padding: 2px 6px; color: #5A6478; text-decoration: underline; text-decoration-color: #D5DCE6; }
html.a2app .phx--shop .phx__body > * { width: 100%; max-width: 760px; margin-inline: auto; align-self: center; box-sizing: border-box; }

/* ===== web page (desktop): a clean home, everything else in the left pane ===== */
.tab-grp { display: none; }
@media (min-width: 900px) {
  html.a2app .phx--shop .phx__body > .shp-bubbles, html.a2app .phx--shop .phx__body > .shp-tools { display: none; }
  /* the home: just the question, Local/Global and the search box, a little above the middle */
  html.a2app .phx--shop .phx__body:has(> .shp-bubbles) { justify-content: flex-start; padding-top: 18vh; }
  html.a2app .phx--shop .phx__body:has(> .shp-bubbles) .shp-h { font-size: 2rem; text-align: center; margin-bottom: 18px; }
  html.a2app .phx--shop .phx__body:has(> .shp-bubbles) .shp-search { box-shadow: 0 10px 30px -18px rgba(10,37,64,.35); }
  html.a2app .phx--shop .phx__tabs { overflow-y: auto; }
  .tab-grp { display: flex; flex-direction: column; gap: 2px; order: 6; margin-top: 18px; padding-top: 12px; border-top: 1px solid rgba(10,37,64,.07); }
  .tab-grp--set { order: 11; margin-top: 4px; padding-top: 0; border-top: 0; }
  .tab-k { margin: 0 14px 6px; font: 600 .66rem/1 var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: #8792A2; }
  html.a2app .phx--shop .phx__tabs .tab-q, html.a2app .phx--shop .phx__tabs .tab-sub { position: relative; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 12px;
    width: 100%; min-height: 38px; padding: 0 14px; border: 0; border-radius: 10px; background: none; color: #5A6478; font: 500 .84rem/1 var(--font-body); cursor: pointer; text-align: left; }
  html.a2app .phx--shop .phx__tabs .tab-q:hover, html.a2app .phx--shop .phx__tabs .tab-sub:hover { background: #EEF2F8; color: #0A2540; }
  html.a2app .phx--shop .phx__tabs .tab-q svg { flex: none; color: #8792A2; }
  html.a2app .phx--shop .phx__tabs .tab-q .shp-n { position: static; margin-left: auto; }
  html.a2app .phx--shop .phx__tabs .tab-sub { min-height: 32px; padding-left: 48px; font-size: .8rem; }
}
html.a2app .phx--shop .phx__body > .shp-simof { order: 4; }
.eng--perplexity { background: #20808D; }