/* TTB IQ chat window (PRO, Direct, GAP). The first part is the same as in parts.css. */
.iq-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.iq-launcher{position:fixed;right:24px;bottom:24px;z-index:80;display:inline-flex;align-items:center;gap:10px;height:48px;padding:0 20px;border:1px solid rgba(255,255,255,.22);border-radius:999px;background:#101311;color:#fff;font:600 14px/1 Arial,Helvetica,sans-serif;box-shadow:0 10px 30px rgba(0,0,0,.35);cursor:pointer;transition:background .2s ease}
.iq-launcher:hover,.iq-launcher:focus-visible{background:#2b312d}
.iq-launcher[hidden]{display:none}
.iq-drawer{position:fixed;inset:0 0 0 auto;margin:0;width:440px;max-width:100vw;height:100dvh;max-height:100dvh;padding:0;border:0;border-left:1px solid #dfe2dd;border-radius:0;background:#fff;color:#1c211e;box-shadow:-12px 0 40px rgba(0,0,0,.28);z-index:90;overflow:hidden}
.iq-drawer[open]{display:flex;flex-direction:column}
.iq-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;background:#101311;color:#fff}
.iq-head h2{margin:0;font-size:20px;font-weight:800;letter-spacing:-.01em;color:#fff}
.iq-head-tools{display:flex;align-items:center;gap:10px}
.iq-text-button{padding:6px 8px;border:0;background:transparent;color:rgba(255,255,255,.72);font:500 12px/1 Arial,Helvetica,sans-serif;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.iq-text-button:hover,.iq-text-button:focus-visible{color:#fff;background:transparent}
.iq-icon-button{display:grid;place-items:center;width:34px;height:34px;padding:0;border:0;border-radius:8px;background:rgba(255,255,255,.1);color:#fff;cursor:pointer}
.iq-icon-button:hover,.iq-icon-button:focus-visible{background:rgba(255,255,255,.2)}
.iq-vehicle{display:grid;gap:3px;margin:14px 20px 0;padding:10px 14px;border-radius:8px;background:#f1f2f1;font-size:13px}
.iq-vehicle[hidden]{display:none}
.iq-vehicle span{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#5d655f}
.iq-log{flex:1 1 auto;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:10px;padding:16px 20px}
.iq-turn{max-width:88%;padding:11px 14px;border-radius:12px;font-size:14px;line-height:1.55}
.iq-turn p{margin:0;white-space:pre-wrap}
.iq-turn.is-user{align-self:flex-end;background:#101311;color:#fff;border-bottom-right-radius:4px}
.iq-turn.is-assistant{align-self:flex-start;background:#f1f2f1;color:#1c211e;border-bottom-left-radius:4px}
.iq-turn.is-pending{color:#5d655f;font-style:italic}
.iq-link{display:inline-flex;align-items:center;margin:10px 8px 0 0;padding:8px 14px;border-radius:8px;background:#101311;color:#fff;font-size:13px;font-weight:600;text-decoration:none}
.iq-link:hover,.iq-link:focus-visible{background:#2b312d;color:#fff}
.iq-examples{display:grid;gap:8px;padding:0 20px 12px}
.iq-examples[hidden]{display:none}
.iq-examples button{padding:10px 14px;border:1px solid #dfe2dd;border-radius:8px;background:#fff;color:#1c211e;font:400 13px/1.4 Arial,Helvetica,sans-serif;text-align:left;cursor:pointer}
.iq-examples button:hover,.iq-examples button:focus-visible{background:#f1f2f1;color:#1c211e}
.iq-form{display:flex;align-items:flex-end;gap:8px;padding:12px 20px;border-top:1px solid #dfe2dd}
.iq-form textarea{flex:1;min-height:44px;max-height:140px;padding:11px 12px;resize:none;border:1px solid #cfd4cf;border-radius:8px;background:#fff;color:#101311;font:14px/1.45 Arial,Helvetica,sans-serif}
.iq-form textarea:focus{outline:none;border-color:#101311}
.iq-send{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:8px;background:#101311;color:#fff;font-size:18px;cursor:pointer}
.iq-send:hover:not(:disabled),.iq-send:focus-visible{background:#2b312d;color:#fff}
.iq-send:disabled{opacity:.4;cursor:default}
.iq-note{margin:0;padding:0 20px 16px;font-size:11px;line-height:1.5;color:#5d655f}
@media(max-width:560px){.iq-drawer{width:100%}.iq-launcher{right:14px;bottom:14px}}
/* TTB IQ drawer: above the sticky site header; link buttons keep white text. */
.iq-drawer{z-index:100000}
.iq-launcher{z-index:99999}
.iq-drawer a.iq-link,.iq-drawer a.iq-link:visited{color:#fff;text-decoration:none}
.iq-drawer a.iq-link:hover,.iq-drawer a.iq-link:focus-visible{color:#fff;background:#2b312d}
/* TTB IQ: the page's general button rules must not change the drawer's buttons. */
.iq-drawer .iq-text-button,.iq-drawer .iq-icon-button,.iq-drawer .iq-send,.iq-drawer .iq-examples button,.iq-launcher{box-shadow:none!important;text-transform:none!important;letter-spacing:normal!important;min-height:0!important}
.iq-drawer .iq-text-button{border:0!important;background:transparent!important;color:rgba(255,255,255,.78)!important;width:auto!important;height:auto!important;padding:6px 8px!important;font-size:12px!important;font-weight:500!important}
.iq-drawer .iq-text-button:hover,.iq-drawer .iq-text-button:focus-visible{color:#fff!important}
.iq-drawer .iq-icon-button{border:0!important;background:rgba(255,255,255,.12)!important;color:#fff!important;width:34px!important;height:34px!important;padding:0!important}
.iq-drawer .iq-icon-button:hover,.iq-drawer .iq-icon-button:focus-visible{background:rgba(255,255,255,.22)!important}
.iq-drawer .iq-icon-button svg{stroke:#fff;display:block}
.iq-drawer .iq-send{border:0!important;background:#101311!important;color:#fff!important;width:44px!important;height:44px!important;padding:0!important}
.iq-drawer .iq-send:disabled{opacity:.4}
.iq-drawer .iq-examples button{border:1px solid #dfe2dd!important;background:#fff!important;color:#1c211e!important;font-weight:400!important;padding:10px 14px!important}
.iq-drawer .iq-examples button:hover,.iq-drawer .iq-examples button:focus-visible{background:#f1f2f1!important}
.iq-launcher{border:1px solid rgba(255,255,255,.22)!important;background:#101311!important;color:#fff!important;border-radius:999px!important;font-weight:600!important}
.iq-launcher:hover,.iq-launcher:focus-visible{background:#2b312d!important}
.iq-drawer .iq-text-button{outline:0!important;border-radius:6px!important}
.iq-drawer .iq-text-button:focus-visible{outline:2px solid #fff!important;outline-offset:1px}

/* TTB IQ: a compact window in the corner (not the whole page height); the header button minimises it to the launcher. */
.iq-drawer{inset:auto 24px 24px auto;width:380px;height:min(580px,calc(100dvh - 48px));max-height:calc(100dvh - 48px);border:1px solid #dfe2dd;border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.iq-head{padding:14px 16px;border-radius:14px 14px 0 0}
.iq-head h2{font-size:18px}
.iq-vehicle{margin:10px 16px 0}
.iq-log{padding:12px 16px}
.iq-examples{padding:0 16px 10px}
.iq-form{padding:10px 16px}
.iq-note{padding:0 16px 12px}
@media(max-width:560px){.iq-drawer{inset:auto 0 0 0;width:100%;max-width:100%;height:min(72dvh,560px);border-radius:14px 14px 0 0}}

/* TTB IQ panel is a plain element now (no <dialog>): shown when not hidden. */
.iq-drawer[hidden]{display:none}
.iq-drawer:not([hidden]){display:flex;flex-direction:column}

/* a person has been asked for: staff answers, notes */
.iq-turn.is-staff{align-self:flex-start;background:#e8f1ff;color:#10233f;border-bottom-left-radius:4px}
.iq-turn .iq-who{display:block;margin-bottom:3px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#2a5aa8}
.iq-turn.is-note{align-self:center;max-width:94%;background:transparent;color:#5d655f;font-size:12px;text-align:center;font-style:italic}
.iq-launcher[data-new]::after{content:"";display:inline-block;width:9px;height:9px;margin-left:6px;border-radius:50%;background:#e5484d}
.iq-drawer .iq-text-button[hidden]{display:none!important}

/* the launcher sits higher up so it is not forgotten in the corner; the header link opens the same chat */
.iq-launcher{bottom:101px!important}
@media(max-width:560px){.iq-launcher{bottom:78px!important}}

/* header of the chat: the name on one line; "Talk to a person" and "Clear chat" in a slim row of their own, each on one line */
.iq-drawer .iq-head h2{white-space:nowrap;flex:1 1 auto}
.iq-drawer .iq-head-tools{flex:0 0 auto}
.iq-subhead{display:flex;align-items:center;gap:6px;padding:6px 14px;background:#161a17;border-bottom:1px solid rgba(255,255,255,.1)}
.iq-drawer .iq-subhead .iq-text-button{white-space:nowrap}

/* tablet / phone audit: 16px fields (iOS zoom), 44px tap targets, safe-area insets for the home indicator and notch */
@media(max-width:1024px){
 .iq-form textarea{font-size:16px}
 .iq-drawer .iq-icon-button{width:44px!important;height:44px!important}
 .iq-drawer .iq-text-button{min-height:44px!important}
 .iq-drawer .iq-examples button{min-height:44px!important}
 .iq-link{min-height:44px}
}
@media(min-width:561px) and (max-width:1024px){
 .iq-launcher{right:max(24px,env(safe-area-inset-right,0px));bottom:calc(101px + env(safe-area-inset-bottom,0px))!important}
 .iq-drawer{right:max(24px,env(safe-area-inset-right,0px));bottom:calc(24px + env(safe-area-inset-bottom,0px));max-height:calc(100dvh - 48px - env(safe-area-inset-bottom,0px))}
}
@media(max-width:560px){
 .iq-launcher{right:max(14px,env(safe-area-inset-right,0px));bottom:calc(78px + env(safe-area-inset-bottom,0px))!important}
 .iq-drawer{padding-bottom:env(safe-area-inset-bottom,0px);height:min(72vh,560px);height:min(72dvh,560px);max-height:calc(100vh - 16px);max-height:calc(100dvh - 16px)}
 .iq-subhead{flex-wrap:wrap}
 .iq-turn{max-width:92%}
 .iq-log{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
}

.iq-contact{display:grid;gap:8px;padding:12px 20px}
.iq-contact[hidden]{display:none}
.iq-contact-title{margin:0 0 2px;font:600 13px/1.4 Arial,Helvetica,sans-serif;color:#1c211e}
.iq-contact button,.iq-contact a{display:grid;gap:2px;padding:10px 14px;border:1px solid #dfe2dd;border-radius:8px;background:#fff;color:#1c211e;text-align:left;text-decoration:none;cursor:pointer;font:400 12px/1.4 Arial,Helvetica,sans-serif;box-shadow:none!important;text-transform:none!important;letter-spacing:normal!important}
.iq-contact strong{font-size:13px}
.iq-contact span{color:#5d625f}
.iq-contact button:hover,.iq-contact a:hover,.iq-contact button:focus-visible,.iq-contact a:focus-visible{background:#f1f2f1}

/* TTB IQ answers in light markdown: spacing between blocks, lists, code and tables that scroll inside the bubble. */
.iq-turn.is-assistant{max-width:96%}
.iq-turn>*+*{margin-top:8px}
.iq-turn ul,.iq-turn ol{margin:0;padding-left:20px}
.iq-turn li+li{margin-top:3px}
.iq-turn strong{font-weight:700}
.iq-turn code{padding:1px 5px;border-radius:4px;background:rgba(16,19,17,.08);font:12.5px/1.4 Consolas,Menlo,monospace}
.iq-table{overflow-x:auto}
.iq-table table{border-collapse:collapse;font-size:13px;line-height:1.4}
.iq-table th,.iq-table td{padding:6px 10px;border:1px solid #cfd4cf;text-align:left;vertical-align:top}
.iq-table th{background:#e6e9e6;font-weight:700}

/* Phone (Direct and Gap): the chat button is a small round button with only the icon (the text is still read out by screen readers); it took up half the width */
@media(max-width:600px){
 body:is(.direct,.gap) .iq-launcher{width:52px;height:52px;padding:0!important;justify-content:center;gap:0;right:14px!important;bottom:calc(16px + env(safe-area-inset-bottom,0px))!important}
 body:is(.direct,.gap) .iq-launcher>span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
 body:is(.direct,.gap) .iq-launcher[data-new]::after{position:absolute;top:10px;right:10px;margin:0}
}

/* Phone with the keyboard up: the chat is exactly the visible area (set by iq-chat.mjs), the input stays above the keyboard */
@media(max-width:560px){
 .iq-drawer.iq-kb{inset:auto 0 auto 0!important;top:var(--iq-top,0)!important;height:var(--iq-h,100dvh)!important;max-height:none!important;border-radius:0!important;padding-bottom:0}
 .iq-drawer.iq-kb .iq-examples,.iq-drawer.iq-kb [data-iq-vehicle]{display:none}
}

/* Typing on a phone: header and sub-header shrink so the conversation and the field have the room */
@media(max-width:560px){
 .iq-drawer.iq-kb .iq-head{padding:8px 14px;border-radius:0}
 .iq-drawer.iq-kb .iq-head h2{font-size:16px}
 .iq-drawer.iq-kb .iq-subhead{padding:2px 10px}
 .iq-drawer.iq-kb .iq-log{padding:8px 14px}
 .iq-drawer.iq-kb .iq-form{padding:8px 12px}
}

/* "Fråga TTB IQ" launcher: white pill with black text like every other button (2026-10-14) */
html body .iq-launcher.iq-launcher{background:#fff!important;color:#0b0f14!important;-webkit-text-fill-color:#0b0f14!important;border:1px solid #b9bec4!important;box-shadow:0 4px 16px rgba(20,24,26,.18)!important}
html body .iq-launcher.iq-launcher:hover,html body .iq-launcher.iq-launcher:focus-visible{background:#f3f4f6!important;border-color:#202124!important}
html body .iq-launcher.iq-launcher svg{color:#0b0f14!important;stroke:currentColor}

/* TTB IQ: photo attach (ID plate, registration document) */
.iq-form{position:relative}
html body .iq-attach{flex:none;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;margin:0 6px 0 0;padding:0;border:1px solid #b9bec4!important;border-radius:999px!important;background:#fff!important;color:#0b0f14!important;cursor:pointer;box-shadow:none!important}
html body .iq-attach:hover,html body .iq-attach:focus-visible{background:#f3f4f6!important;border-color:#202124!important}
html body .iq-attach:disabled{opacity:.5;cursor:default}
.iq-photo{display:flex;align-items:center;gap:10px;margin:0 14px 8px;padding:6px 8px;border:1px solid #d0d4d9;border-radius:12px;background:#fff;color:#0b0f14;font-size:13px}
.iq-photo[hidden]{display:none!important}
.iq-photo img{width:44px;height:44px;object-fit:cover;border-radius:8px;border:1px solid #d0d4d9}
.iq-photo span{flex:1;min-width:0;font-weight:600}
html body .iq-photo button{width:28px;height:28px;padding:0;border:1px solid #b9bec4!important;border-radius:50%!important;background:#fff!important;color:#0b0f14!important;font-size:18px;line-height:1;cursor:pointer;box-shadow:none!important}

/* TTB IQ: product cards in the answer and the details pop-up */
.iq-cards{display:flex;flex-direction:column;gap:8px;margin:10px 0 4px}
.iq-card{display:flex;gap:10px;align-items:flex-start;padding:10px;border:1px solid #d0d4d9;border-radius:12px;background:#fff;color:#0b0f14;cursor:pointer;text-align:left}
.iq-card:hover,.iq-card:focus-visible{border-color:#202124;outline:none}
.iq-card img{width:64px;height:64px;object-fit:contain;flex:none;border-radius:8px;background:#fff}
.iq-card-body{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.iq-card-body strong{font-size:14px;line-height:1.3}
.iq-card-art,.iq-card-why,.iq-card-stock{font-size:12.5px;color:#4b5159}
.iq-card-price{font-size:14px;font-weight:700}
.iq-card-stock.is-in,.iq-pop-stock.is-in{color:#1b7a33}
.iq-card-msg,.iq-pop-msg{font-size:12.5px;color:#a32020}
html body .iq-buy{align-self:flex-start;margin-top:4px;padding:8px 16px;border:1px solid #b9bec4!important;border-radius:999px!important;background:#fff!important;color:#0b0f14!important;font-weight:600;font-size:13.5px;cursor:pointer;box-shadow:none!important}
html body .iq-buy:hover{background:#f3f4f6!important;border-color:#202124!important}
html body .iq-buy.is-flash{background:#58b957!important;border-color:#58b957!important;color:#fff!important;transition:none}
html body .iq-buy:disabled{opacity:.6;cursor:default}
dialog.iq-pop{width:min(440px,calc(100vw - 32px));max-height:calc(100vh - 48px);overflow:auto;padding:18px;border:1px solid #d0d4d9;border-radius:16px;background:#fff;color:#0b0f14;box-shadow:0 20px 60px rgba(0,0,0,.25)}
dialog.iq-pop::backdrop{background:rgba(0,0,0,.45)}
.iq-pop-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:10px}
.iq-pop-head strong{font-size:16px;line-height:1.3}
html body .iq-pop-x{flex:none;width:32px;height:32px;padding:0;border:1px solid #b9bec4!important;border-radius:50%!important;background:#fff!important;color:#0b0f14!important;font-size:20px;line-height:1;cursor:pointer;box-shadow:none!important}
.iq-pop-img{display:block;width:100%;max-height:240px;object-fit:contain;margin:0 0 10px}
.iq-pop p{margin:6px 0}
.iq-pop-meta{color:#4b5159;font-size:13.5px}
.iq-pop-price{font-size:18px;font-weight:700}
.iq-pop-desc{font-size:13.5px;line-height:1.45;white-space:pre-line}
.iq-pop-refs{font-size:12.5px;color:#4b5159;word-break:break-word}

/* TTB IQ: enlarged window in the middle of the screen */
.iq-backdrop{position:fixed;inset:0;background:rgba(10,12,11,.55);z-index:99999}
html body aside.iq-drawer.is-wide{position:fixed!important;inset:auto!important;top:50%!important;left:50%!important;right:auto!important;bottom:auto!important;transform:translate(-50%,-50%)!important;width:min(1000px,calc(100vw - 40px))!important;height:min(88dvh,860px)!important;max-height:calc(100dvh - 40px)!important;border:1px solid #dfe2dd!important;border-radius:16px!important;box-shadow:0 30px 90px rgba(0,0,0,.45)!important;overflow:hidden!important}
html body aside.iq-drawer.is-wide .iq-log{padding-left:28px;padding-right:28px}
html body aside.iq-drawer.is-wide .iq-turn{max-width:760px}
html body aside.iq-drawer.is-wide .iq-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px}
@media(max-width:640px){html body .iq-wide-button{display:none!important}}

/* TTB IQ: the question about the vehicle open in the catalogue */
.iq-choices{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
html body .iq-choice{padding:9px 16px;border:1px solid #b9bec4!important;border-radius:999px!important;background:#fff!important;color:#0b0f14!important;font-weight:600;font-size:13.5px;cursor:pointer;box-shadow:none!important}
html body .iq-choice:hover,html body .iq-choice:focus-visible{background:#f3f4f6!important;border-color:#202124!important}

/* TTB IQ: the shared product row in the chat and the article page pop-up */
.iq-cards.parts-rows{display:flex;flex-direction:column;gap:10px;margin:10px 0 4px;max-width:100%}
.iq-cards .parts-row{width:100%;box-sizing:border-box}
dialog.iq-pop.is-article{width:min(980px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:14px;position:relative}
dialog.iq-pop.is-article .iq-pop-x{position:absolute;top:10px;right:10px;z-index:3}
dialog.iq-pop.is-article .iq-pop-body{padding-top:30px}
html body aside.iq-drawer.is-wide .iq-cards.parts-rows{display:flex;flex-direction:column}

/* TTB IQ: small tiles side by side (full article page opens as a pop-up) */
.iq-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:10px 0 4px}
.iq-tile{display:flex;flex-direction:column;gap:3px;padding:8px;border:1px solid #d0d4d9;border-radius:12px;background:#fff;color:#0b0f14;cursor:pointer;text-align:left;min-width:0}
.iq-tile:hover,.iq-tile:focus-visible{border-color:#202124;outline:none}
.iq-tile img{width:100%;height:84px;object-fit:contain;border-radius:8px;background:#fff}
.iq-tile-noimg{display:flex;align-items:center;justify-content:center;height:84px;border-radius:8px;background:#f3f4f6;color:#6b7078;font-size:12px}
.iq-tile strong{font-size:12.5px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.iq-tile-art{font-size:12px;color:#4b5159}
.iq-tile-price{font-size:13px;font-weight:700}
.iq-tile-stock{font-size:12px;color:#4b5159}
.iq-tile-stock.is-in{color:#1b7a33}
.iq-tile .iq-buy{align-self:stretch;margin-top:auto;padding:7px 8px;font-size:12.5px;text-align:center}
html body aside.iq-drawer.is-wide .iq-tiles{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}

/* TTB IQ: product tiles under a heading per kind of part */
.iq-groups{display:flex;flex-direction:column;gap:14px;margin:10px 0 4px}
.iq-group h4{margin:0 0 6px;font-size:14px;font-weight:700;color:#0b0f14;padding-bottom:4px;border-bottom:1px solid #d0d4d9}
.iq-group .iq-tiles{margin:0}

/* TTB IQ pop-up: the article page uses the catalogue's own layout (OE numbers in columns under the make) */
dialog.iq-pop .catalog-results .parts-number-grid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:16px 24px;align-items:start}
dialog.iq-pop .catalog-results .parts-number-group{display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:0!important;border:0!important}
dialog.iq-pop .catalog-results .parts-number-group strong{min-width:0;margin-bottom:2px}

/* TTB IQ pop-up: the close button is a plain round button that stays in view while the article scrolls */
html body dialog.iq-pop.is-article button.iq-pop-x{position:sticky!important;top:0!important;right:auto!important;float:none;margin:0 0 6px auto!important;z-index:6;width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;max-width:36px!important;padding:0!important;display:flex!important;align-items:center;justify-content:center;border:1px solid #b9bec4!important;border-radius:50%!important;background:#fff!important;color:#0b0f14!important;font-size:22px!important;line-height:1!important;box-shadow:0 1px 4px rgba(0,0,0,.18)!important;cursor:pointer;aspect-ratio:1/1;box-sizing:border-box}
html body dialog.iq-pop.is-article button.iq-pop-x:hover{background:#f3f4f6!important;border-color:#202124!important}
html body dialog.iq-pop.is-article{padding-top:10px}
html body dialog.iq-pop.is-article .iq-pop-body{padding-top:0}
.iq-vinfo-grid{display:grid;grid-template-columns:minmax(110px,38%) 1fr;margin:0;font-size:13.5px}.iq-vinfo-grid dt,.iq-vinfo-grid dd{margin:0;padding:8px 0;border-top:1px solid #eceeec}.iq-vinfo-grid dt{color:#5b625d}.iq-vinfo-grid dd{font-weight:600;color:#101311}
.iq-vinfo-title{display:grid;gap:2px;min-width:0}.iq-vinfo-eyebrow{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#5b625d}.iq-vinfo-title strong{font-size:16px;line-height:1.3;overflow-wrap:normal}.iq-vinfo-plate{font-size:13px;color:#5b625d;white-space:nowrap}
html body dialog.iq-vinfo-pop .iq-pop-x{flex:none;box-sizing:border-box;width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;max-height:36px!important;padding:0;border-radius:50%!important;display:inline-grid;place-items:center;line-height:1;font-size:20px;aspect-ratio:1/1}
.iq-more{display:inline-flex;margin:10px 0 0;padding:8px 16px;border:1px solid #0b0f14;border-radius:999px;background:#fff;color:#0b0f14;font-size:13px;font-weight:600;cursor:pointer}.iq-more:hover{background:#eef0ee}.iq-tile[hidden]{display:none}
.iq-mode{display:flex;gap:8px;padding:8px 16px 0}.iq-mode button{flex:1;padding:7px 12px;border:1px solid #0b0f14;border-radius:999px;background:#fff;color:#0b0f14;font-size:13px;font-weight:600;cursor:pointer}.iq-mode button.is-on{background:#e6e9e6}

/* the information text of an answer: a closed box of two lines with an arrow; the text is written behind it */
.iq-fold{position:relative}
.iq-fold-body{max-height:3.1em;overflow:hidden;transition:max-height .25s ease}
.iq-fold.is-open .iq-fold-body{max-height:200em}
.iq-fold:not(.is-open) .iq-fold-body{-webkit-mask-image:linear-gradient(#000 60%,transparent);mask-image:linear-gradient(#000 60%,transparent)}
.iq-fold-body p{margin:0}
.iq-fold-toggle{display:flex;align-items:center;justify-content:center;width:100%;min-height:32px;margin:2px 0 0;padding:0;border:0;background:transparent;color:#5d655f;cursor:pointer}
.iq-fold-toggle[hidden]{display:none}
.iq-fold-toggle svg{transition:transform .2s ease}
.iq-fold.is-open .iq-fold-toggle svg{transform:rotate(180deg)}
.iq-fold.is-writing .iq-fold-toggle svg{animation:iq-fold-pulse 1s ease-in-out infinite}
@keyframes iq-fold-pulse{0%,100%{opacity:.35}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){.iq-fold-body,.iq-fold-toggle svg{transition:none}.iq-fold.is-writing .iq-fold-toggle svg{animation:none}}
/* Bara delar: the information text of the answers already on the screen is hidden at once (Info + delar shows it again) */
.iq-info-off .iq-fold{display:none}
/* an answer with cards always has the full chat width, so the cards lie side by side as designed (a short or hidden text must not shrink the bubble to one column) */
.iq-turn.has-tiles{width:100%}
/* the open/close arrow of the information box: the same small round corner button as the close buttons of the pop-ups (white, thin grey ring, dark arrow), top right of the box */
.iq-fold{position:relative}
html body .iq-fold .iq-fold-body{padding-right:40px}
html body .iq-fold .iq-fold-toggle{position:absolute;top:0;right:0;flex:none;box-sizing:border-box;width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;margin:0!important;padding:0!important;border:1px solid #b9bec4!important;border-radius:50%!important;background:#fff!important;color:#0b0f14!important;box-shadow:none!important;display:inline-grid;place-items:center;cursor:pointer}
html body .iq-fold .iq-fold-toggle:hover{background:#f3f4f6!important;border-color:#202124!important}
html body .iq-fold .iq-fold-toggle:focus-visible{outline:2px solid #202124;outline-offset:2px}
html body .iq-fold .iq-fold-toggle[hidden]{display:none!important}
html body .iq-fold .iq-fold-toggle svg{display:block;width:12px;height:8px}

/* ===== TTB IQ chat: the design from the owner's mockup (2026-10-24). Sidebar (the buttons of the old slim row), speech bubbles with avatar and time, a "Recommended products" panel, the input row. Nothing here changes what is shown, only how. ===== */
.iq-drawer{border-radius:16px;overflow:hidden}
.iq-body{display:flex;flex-direction:column;flex:1 1 auto;min-height:0}
.iq-main{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;min-width:0;background:#fff}
html body .iq-drawer .iq-head{padding:16px 20px;background:#101311;border-radius:0}
html body .iq-drawer .iq-head h2{font-size:24px;font-weight:900;letter-spacing:.01em}
html body .iq-drawer .iq-icon-button{width:40px!important;height:40px!important;border-radius:10px!important;background:rgba(255,255,255,.1)!important}
/* the sidebar: a row under the header in the small window, a column on the left in the enlarged one */
html body .iq-drawer .iq-subhead{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 16px;background:#f6f6f7;border-bottom:1px solid #e5e7ea}
html body .iq-drawer .iq-subhead .iq-text-button{display:inline-flex;align-items:center;gap:8px;width:auto!important;min-height:40px!important;padding:8px 14px!important;border:1px solid #b9bec4!important;border-radius:999px!important;background:#fff!important;color:#0b0f14!important;font-size:13px!important;font-weight:600!important;text-decoration:none!important;white-space:nowrap}
html body .iq-drawer .iq-subhead .iq-text-button:hover,html body .iq-drawer .iq-subhead .iq-text-button:focus-visible{background:#f3f4f6!important;border-color:#202124!important;color:#0b0f14!important}
html body .iq-drawer .iq-subhead .iq-side-new{background:#101311!important;border-color:#101311!important;color:#fff!important}
html body .iq-drawer .iq-subhead .iq-side-new:hover,html body .iq-drawer .iq-subhead .iq-side-new:focus-visible{background:#2b312d!important;border-color:#2b312d!important;color:#fff!important}
html body aside.iq-drawer.is-wide .iq-body{flex-direction:row}
html body aside.iq-drawer.is-wide .iq-subhead{flex-direction:column;flex-wrap:nowrap;align-items:stretch;flex:0 0 270px;width:270px;padding:18px 16px;gap:6px;border-bottom:0;border-right:1px solid #e5e7ea;overflow-y:auto}
html body aside.iq-drawer.is-wide .iq-subhead .iq-text-button{justify-content:flex-start;min-height:44px!important;padding:10px 12px!important;border:0!important;border-radius:12px!important;background:transparent!important;font-size:14px!important}
html body aside.iq-drawer.is-wide .iq-subhead .iq-text-button:hover,html body aside.iq-drawer.is-wide .iq-subhead .iq-text-button:focus-visible{background:#ececee!important}
html body aside.iq-drawer.is-wide .iq-subhead .iq-side-new{min-height:48px!important;padding:12px 16px!important;margin-bottom:10px;background:#101311!important;font-size:15px!important}
html body aside.iq-drawer.is-wide .iq-subhead .iq-side-new:hover,html body aside.iq-drawer.is-wide .iq-subhead .iq-side-new:focus-visible{background:#2b312d!important}
/* messages */
.iq-log{padding:18px 20px;gap:14px;background:#fff}
.iq-turn{max-width:88%;padding:12px 16px;border-radius:18px;font-size:14.5px;line-height:1.55}
.iq-turn.is-user{border-bottom-right-radius:18px;background:#101311;color:#fff}
.iq-turn.is-assistant{position:relative;margin-left:52px;max-width:calc(100% - 52px);border-bottom-left-radius:18px;background:#efefef}
.iq-turn.is-assistant::before{content:var(--iq-avatar,"TTB\A IQ");white-space:pre;position:absolute;left:-52px;top:0;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#101311;color:#fff;font:900 10px/1.05 Arial,Helvetica,sans-serif;text-align:center;letter-spacing:.02em}
.iq-turn.is-assistant.has-tiles{width:calc(100% - 52px)}
.iq-time{display:block;margin-top:6px;font-size:11px;line-height:1;color:#7a8087;text-align:right}
.iq-turn.is-user .iq-time{color:rgba(255,255,255,.65)}
.iq-ticks{display:inline-flex;vertical-align:middle}
/* the products of an answer: one panel with a title, a heading per kind of part and the tiles side by side */
.iq-groups{gap:16px;margin:12px 0 2px;padding:14px;border:1px solid #e3e5e8;border-radius:16px;background:#fff}
.iq-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.iq-panel-head strong{font-size:15px;font-weight:800;color:#0b0f14}
.iq-group-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 8px;padding-bottom:6px;border-bottom:1px solid #e5e7ea}
.iq-group .iq-group-head h4{margin:0;padding:0;border:0;font-size:13.5px;font-weight:700;color:#0b0f14}
html body .iq-group .iq-more{margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;color:#0b0f14!important;font-size:13px;font-weight:700;box-shadow:none!important;white-space:nowrap}
html body .iq-group .iq-more:hover{background:transparent!important;text-decoration:underline}
.iq-tiles{gap:10px}
.iq-tile{padding:10px;gap:4px;border-color:#e3e5e8;border-radius:16px}
.iq-tile img,.iq-tile-noimg{height:96px;border-radius:10px}
.iq-tile-brand{margin-top:4px;font-size:12px;font-weight:800;letter-spacing:.02em;text-transform:uppercase;color:#0b0f14}
.iq-tile strong{font-size:13px;font-weight:500}
.iq-tile-art{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:12.5px;color:#0b0f14}
.iq-tile-chev{font-size:20px;line-height:1;color:#0b0f14}
/* the choice between parts only and information + parts, above the input */
.iq-mode{display:flex;justify-content:flex-end;gap:0;padding:8px 20px 0}
.iq-mode button{flex:none;padding:7px 18px;font-size:13px}
.iq-mode button:first-child{border-radius:999px 0 0 999px}
.iq-mode button:last-child{margin-left:-1px;border-radius:0 999px 999px 0}
/* the input row */
.iq-form{align-items:center;gap:10px;padding:12px 20px 6px;border-top:0}
html body .iq-attach{flex:none;width:46px;height:46px;margin:0;border-radius:12px!important}
.iq-form textarea{min-height:46px;padding:12px 14px;border-color:#d9dce0;border-radius:12px}
html body .iq-drawer .iq-send{width:48px!important;height:48px!important;border-radius:12px!important}
.iq-note{padding:0 20px 14px}
html body aside.iq-drawer.is-wide .iq-turn{max-width:760px}
html body aside.iq-drawer.is-wide .iq-turn.is-assistant{max-width:calc(100% - 52px)}
@media(max-width:560px){.iq-turn.is-assistant{margin-left:44px;max-width:calc(100% - 44px)}.iq-turn.is-assistant::before{left:-44px;width:34px;height:34px;font-size:9px}.iq-turn.is-assistant.has-tiles{width:calc(100% - 44px)}}
/* the two mode buttons keep their own colours in every shop: white with a dark ring, light grey when chosen (the page's general button rule must not turn them black) */
html body .iq-mode button{background:#fff!important;color:#0b0f14!important;-webkit-text-fill-color:#0b0f14!important;border:1px solid #0b0f14!important;box-shadow:none!important;text-transform:none!important;letter-spacing:normal!important;min-height:0!important}
html body .iq-mode button.is-on,html body .iq-mode button[aria-pressed="true"]{background:#e6e9e6!important}
html body .iq-mode button:hover{background:#f3f4f6!important}
html body .iq-mode button.is-on:hover{background:#dde1dd!important}
/* "Visa alla" sits after the last visible product of its group, so it is clear that more are listed */
html body .iq-group .iq-more{display:inline-flex;align-items:center;margin:12px 0 0!important;padding:8px 18px!important;border:1px solid #0b0f14!important;border-radius:999px!important;background:#fff!important;color:#0b0f14!important;font-size:13px;font-weight:600;box-shadow:none!important}
html body .iq-group .iq-more:hover{background:#f3f4f6!important;text-decoration:none}
/* saved conversations in the sidebar */
.iq-hist{width:100%;margin-top:6px}
.iq-hist[hidden]{display:none}
.iq-hist summary{list-style:none;cursor:pointer;padding:8px 4px;font:700 12.5px/1.4 Arial,Helvetica,sans-serif;color:#5d655f}
.iq-hist summary::-webkit-details-marker{display:none}
.iq-hist-list{display:flex;flex-direction:column;gap:2px;max-height:200px;overflow-y:auto}
html body .iq-hist-item{display:flex;align-items:center;gap:10px;width:100%;margin:0;padding:10px 12px;border:0!important;border-radius:10px!important;background:transparent!important;color:#0b0f14!important;font-size:13.5px;font-weight:500;text-align:left;cursor:pointer;box-shadow:none!important;text-transform:none!important;letter-spacing:normal!important;min-height:0!important}
html body .iq-hist-item span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html body .iq-hist-item:hover,html body .iq-hist-item:focus-visible{background:#ececee!important}
html body aside.iq-drawer.is-wide .iq-hist{margin-top:16px;padding-top:14px;border-top:1px solid #e5e7ea}
html body aside.iq-drawer.is-wide .iq-hist summary{pointer-events:none;padding:0 12px 8px}
html body aside.iq-drawer.is-wide .iq-hist-list{max-height:none}
html body aside:not(.is-wide).iq-drawer .iq-hist{flex:1 1 100%}
/* the launcher says that TTB IQ has answered while the chat was closed: a round green badge with a check at its corner (green as the cart button's confirmation) */
html body .iq-launcher[data-new]{position:fixed;overflow:visible!important}
html body .iq-launcher[data-new]::after{content:""!important;position:absolute!important;top:-8px!important;right:-6px!important;left:auto!important;bottom:auto!important;display:block!important;width:24px!important;height:24px!important;margin:0!important;border:2px solid #fff;border-radius:50%!important;background:#58b957 url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'><path d='M5 12.5l4.5 4.5L19 7.5'/></svg>") center/14px 14px no-repeat!important;box-shadow:0 2px 6px rgba(20,24,26,.28)}
.iq-hist-empty{margin:0;padding:6px 12px;font-size:12.5px;color:#7a8087}
html body .iq-hist-item{font-weight:500!important}
html body .iq-hist-item span{font-weight:500!important}
/* the conversation you are in is bold in the list of saved conversations */
html body .iq-hist-item.is-current,html body .iq-hist-item.is-current span{font-weight:800!important}
/* no black buttons: white pill, dark ring, dark text (the owner's rule); the header bar itself stays dark */
html body .iq-drawer .iq-subhead .iq-side-new,html body aside.iq-drawer.is-wide .iq-subhead .iq-side-new{background:#fff!important;color:#0b0f14!important;border:1px solid #0b0f14!important;border-radius:999px!important}
html body .iq-drawer .iq-subhead .iq-side-new:hover,html body .iq-drawer .iq-subhead .iq-side-new:focus-visible,html body aside.iq-drawer.is-wide .iq-subhead .iq-side-new:hover,html body aside.iq-drawer.is-wide .iq-subhead .iq-side-new:focus-visible{background:#f3f4f6!important;color:#0b0f14!important;border-color:#0b0f14!important}
html body .iq-drawer .iq-send{background:#fff!important;color:#0b0f14!important;border:1px solid #0b0f14!important;border-radius:999px!important}
html body .iq-drawer .iq-send:hover:not(:disabled),html body .iq-drawer .iq-send:focus-visible{background:#f3f4f6!important;color:#0b0f14!important}
html body .iq-drawer a.iq-link,html body .iq-drawer a.iq-link:visited{background:#fff!important;color:#0b0f14!important;border:1px solid #0b0f14!important;border-radius:999px!important;text-decoration:none}
html body .iq-drawer a.iq-link:hover,html body .iq-drawer a.iq-link:focus-visible{background:#f3f4f6!important;color:#0b0f14!important}
/* the saved conversations lie in a symmetric order: the icon never shrinks, every row has the same indent and height, the title is cut with dots */
html body .iq-hist-item{display:grid!important;grid-template-columns:18px minmax(0,1fr);align-items:center;column-gap:10px;min-height:40px!important;padding:8px 12px!important;text-align:left!important}
html body .iq-hist-item svg{display:block;width:18px!important;height:18px!important;min-width:18px;flex:none}
html body .iq-hist-item span{display:block;min-width:0;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* in the small window the two sidebar buttons lie side by side on one row (the enlarged window keeps them in a column) */
html body aside:not(.is-wide).iq-drawer .iq-subhead{flex-wrap:wrap} /* the history sits on its own row, so the two buttons keep their width and their text */
html body aside:not(.is-wide).iq-drawer .iq-subhead .iq-text-button{flex:1 1 0;min-width:0;justify-content:center;gap:6px;padding:8px 8px!important;font-size:12.5px!important}
html body aside:not(.is-wide).iq-drawer .iq-subhead .iq-text-button span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html body aside:not(.is-wide).iq-drawer .iq-subhead .iq-text-button svg{flex:none}
html body aside:not(.is-wide).iq-drawer .iq-subhead .iq-hist{flex:1 1 100%}
html body .iq-drawer .iq-offer{display:inline-block;margin:10px 0 2px;padding:9px 16px;background:#fff!important;color:#0b0f14!important;border:1px solid #0b0f14!important;border-radius:999px!important;font:inherit;font-size:14px;cursor:pointer}
html body .iq-drawer .iq-offer:hover,html body .iq-drawer .iq-offer:focus-visible{background:#f3f4f6!important;color:#0b0f14!important}
html body .iq-drawer .iq-pics{display:flex;flex-wrap:wrap;gap:6px;max-width:100%;margin:0 0 8px}
html body .iq-drawer .iq-pic{padding:0;border:1px solid #0b0f14;border-radius:10px;background:#fff;overflow:hidden;cursor:zoom-in;line-height:0}
html body .iq-drawer .iq-pic img{display:block;width:88px;height:88px;object-fit:cover}
.iq-pic-view{position:fixed;inset:0;z-index:2147483647;background:rgba(0,0,0,.82);display:flex;align-items:center;justify-content:center;cursor:zoom-out}
.iq-pic-view img{max-width:92vw;max-height:92vh;border-radius:8px;background:#fff}
/* vehicle information pop-up: design (owner 2026-10-24: tidy, no black buttons) */
html body dialog.iq-vinfo-pop{width:min(460px,calc(100vw - 32px));padding:22px 22px 20px;border-radius:18px;border:1px solid #e1e4e8}
html body dialog.iq-vinfo-pop .iq-pop-head{margin-bottom:14px;padding-bottom:14px;border-bottom:1px solid #eceeec;align-items:center}
html body dialog.iq-vinfo-pop > p{margin:0 0 18px;padding:14px 16px;border-radius:12px;background:#f5f7f9;color:#3b444c;font-size:14px;line-height:1.5}
html body dialog.iq-vinfo-pop .iq-myfleet{display:grid;gap:8px;margin-top:4px}
html body dialog.iq-vinfo-pop .iq-myfleet > strong{font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:#5b625d;margin-bottom:2px}
html body dialog.iq-vinfo-pop .iq-offer{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;box-sizing:border-box;margin:0;padding:11px 16px;background:#fff!important;color:#0b0f14!important;border:1px solid #c9ced4!important;border-radius:999px!important;font:inherit;font-size:14px;text-align:left;cursor:pointer;box-shadow:none!important;transition:background .12s,border-color .12s}
html body dialog.iq-vinfo-pop .iq-offer::after{content:"\203A";font-size:18px;line-height:1;color:#5b625d}
html body dialog.iq-vinfo-pop .iq-offer:hover,html body dialog.iq-vinfo-pop .iq-offer:focus-visible{background:#f3f4f6!important;border-color:#0b0f14!important;color:#0b0f14!important}
html body dialog.iq-vinfo-pop .iq-offer:disabled{opacity:.6;cursor:default}
html body dialog.iq-vinfo-pop .iq-vinfo-grid{margin-bottom:6px}
/* header button "Fordonsflotta": outlined pill in proportion with the icon buttons (owner 2026-10-24) */
html body .iq-drawer .iq-head-tools{align-items:center}
html body .iq-drawer .iq-fleet-button{display:inline-flex;align-items:center;height:34px;margin:0 6px 0 0;padding:0 14px;border:0!important;border-radius:8px!important;background:rgba(255,255,255,.12)!important;color:#fff!important;font:inherit;font-size:12.5px;font-weight:400;letter-spacing:normal!important;text-transform:none!important;white-space:nowrap;cursor:pointer;box-shadow:none!important}
html body .iq-drawer .iq-fleet-button:hover,html body .iq-drawer .iq-fleet-button:focus-visible{background:rgba(255,255,255,.22)!important;color:#fff!important}

/* TTB PRO chat header (mockup of the owner, 2026-10-24): ONE picture (brake disc) covers the whole top of the chat (header and the buttons under it), no black frame; glass buttons; light body below. The enlarged chat keeps its old look. */
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide)::before{content:"";position:absolute;left:0;right:0;top:0;height:176px;z-index:0;pointer-events:none;background-color:#050606;background-image:linear-gradient(180deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,.42) 100%),url("./pro-iq-head.jpg");background-repeat:no-repeat;background-size:100% 100%,auto 100%;background-position:0 0,0 0}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-docked::before{height:196px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:8px;box-sizing:border-box;min-height:70px;padding:12px 16px 12px 22px;background:transparent!important;border:0}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head h2{margin:0;font-size:24px;font-weight:900;letter-spacing:.01em;color:#fff;text-shadow:0 2px 16px rgba(0,0,0,.75)}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head-tools{display:flex;align-items:center;gap:8px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head .iq-icon-button,html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head .iq-fleet-button{height:40px!important;min-width:40px;margin:0!important;padding:0 12px!important;border:1px solid rgba(255,255,255,.16)!important;border-radius:12px!important;background:linear-gradient(180deg,rgba(46,48,47,.80),rgba(14,15,14,.86))!important;color:#fff!important;font:inherit;font-size:13px;font-weight:500;box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 4px 14px rgba(0,0,0,.35)!important;backdrop-filter:blur(6px)}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head .iq-icon-button{width:40px!important;padding:0!important;display:inline-grid;place-items:center}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head .iq-icon-button:hover,html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head .iq-fleet-button:hover,html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head .iq-icon-button:focus-visible,html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head .iq-fleet-button:focus-visible{background:linear-gradient(180deg,rgba(70,72,71,.9),rgba(26,27,26,.93))!important;border-color:rgba(255,255,255,.32)!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-body{background:transparent}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-subhead{position:relative;z-index:1;background:transparent!important;border-bottom:0!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-subhead .iq-hist summary{color:#d4d8db;text-shadow:0 1px 8px rgba(0,0,0,.7)}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-main{position:relative;z-index:1;background:#fff}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-docked .iq-head{min-height:92px;padding:14px 24px 14px 30px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-docked .iq-head h2{font-size:30px;margin-right:auto;padding-left:32%}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-docked .iq-head .iq-icon-button,html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-docked .iq-head .iq-fleet-button{height:46px!important;min-width:46px;font-size:14.5px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-docked .iq-head .iq-icon-button{width:46px!important}
@media(max-width:560px){html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head h2{font-size:21px}}
/* the customer's own messages are light, not black (owner 2026-10-24) */
html body .iq-turn.is-user{background:#e4e8ec!important;color:#0b0f14!important;border:1px solid #d3d9de}
html body .iq-turn.is-user .iq-time{color:#6a7279!important}
html body .iq-turn.is-user a{color:#0b0f14}
/* narrow floating chat: smaller title and buttons so that they fit */
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide):not(.is-docked) .iq-head h2{font-size:20px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide):not(.is-docked) .iq-head .iq-icon-button,html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide):not(.is-docked) .iq-head .iq-fleet-button{height:36px!important;min-width:36px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide):not(.is-docked) .iq-head .iq-icon-button{width:36px!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide):not(.is-docked) .iq-head .iq-fleet-button{font-size:12px;padding:0 10px!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide):not(.is-docked) .iq-head-tools{gap:5px}
/* the enlarged chat: the same picture in its header, not black */
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.is-wide .iq-head{background-color:#050606!important;background-image:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.42)),url("./pro-iq-head.jpg")!important;background-repeat:no-repeat!important;background-size:100% 100%,cover!important;background-position:0 0,0 35%!important;text-shadow:0 2px 14px rgba(0,0,0,.7)}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.is-wide .iq-head h2{color:#fff}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.is-wide .iq-head .iq-icon-button,html body:not(.zz-a):not(.zz-b) aside.iq-drawer.is-wide .iq-head .iq-fleet-button{border:1px solid rgba(255,255,255,.16)!important;border-radius:12px!important;background:linear-gradient(180deg,rgba(46,48,47,.80),rgba(14,15,14,.86))!important;color:#fff!important}
/* PRO chat: calm header (owner 2026-10-24): only enlarge/close in the picture, no example boxes */

html body:not(.zz-a):not(.zz-b) aside.iq-drawer .iq-examples,html body:not(.zz-a):not(.zz-b) aside.iq-drawer.is-docked:not(.is-wide) .iq-examples:not([hidden]){display:none!important}
/* the opened history list is a white panel under the picture */
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-hist[open] .iq-hist-list{position:relative;z-index:2;margin:6px -16px -12px;padding:8px 16px 10px;background:#fff;border-radius:0}
/* PRO chat header, round 3 (owner 2026-10-24): the picture runs under the whole top (the white chat area hides the rest), the disc fades in from the left instead of being cut flat, the fleet and info buttons sit in their own row under the title */
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide)::before,html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-docked::before{height:320px;background-image:linear-gradient(180deg,rgba(0,0,0,.08) 0,rgba(0,0,0,.4) 200px),linear-gradient(90deg,#050606 0,rgba(5,6,6,0) 120px),url("./pro-iq-head.jpg");background-size:100% 100%,100% 100%,auto 200px;background-position:0 0,0 0,34px 0;background-repeat:no-repeat}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head{flex-wrap:wrap;row-gap:10px;min-height:0;padding:14px 18px 6px 22px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head-tools{display:contents}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head h2{order:0;flex:1 1 auto;padding-left:0;margin:0}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head [data-iq-wide]{order:1}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head [data-iq-close]{order:2}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head [data-iq-info]{order:3;display:inline-grid!important;height:36px!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head [data-iq-fleet]{margin-left:0!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head [data-iq-info]{width:36px!important;min-width:36px!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-docked .iq-head{min-height:0;padding:16px 26px 8px 30px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-docked .iq-head h2{padding-left:0;font-size:30px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-docked .iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-docked .iq-head [data-iq-info]{height:40px!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-docked .iq-head [data-iq-info]{width:40px!important;min-width:40px!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head .iq-fleet-button::after{content:none}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head::after{content:"";order:2;flex:0 0 100%;height:0}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head h2,html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-docked .iq-head h2{text-align:center;padding-left:48px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head [data-iq-close]{order:1}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head [data-iq-info]{order:3}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head{justify-content:flex-start}
/* PRO chat header, round 4: title + menu (hamburger) + enlarge + close in the picture; fleet and vehicle info open from the menu */
.iq-menu-button{display:none!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head{position:relative;flex-wrap:nowrap;justify-content:flex-start;row-gap:0;min-height:70px;padding:14px 16px 14px 22px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-docked .iq-head{min-height:92px;padding:14px 24px 14px 30px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head::after{content:none;display:none}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head-tools{display:flex;align-items:center;gap:8px;margin-left:auto}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head h2,html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-docked .iq-head h2{flex:1 1 auto;text-align:left;padding-left:0;margin:0}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head .iq-menu-button{display:inline-grid!important;order:0}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head [data-iq-wide]{order:1}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head [data-iq-close]{order:2}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide) .iq-head [data-iq-info]{display:none!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-menu .iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-menu .iq-head [data-iq-info]{display:flex!important;align-items:center;position:absolute;right:16px;z-index:5;width:auto!important;min-width:190px;height:42px!important;padding:0 16px!important;justify-content:flex-start;background:#fff!important;color:#101311!important;border:1px solid #d9dde1!important;box-shadow:0 8px 24px rgba(0,0,0,.28)!important;backdrop-filter:none}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-menu .iq-head [data-iq-fleet]{top:calc(100% + 4px)}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-menu .iq-head [data-iq-info]{top:calc(100% + 52px)}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer:not(.is-wide).is-menu .iq-head [data-iq-info]::after{content:attr(aria-label);margin-left:10px;font-size:13px;font-weight:500}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head{z-index:6}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info]{color:#101311!important;background:#fff!important;font-size:13.5px!important;font-weight:500!important;gap:0}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info] svg{margin-right:10px}
/* PRO chat, round 5: the chrome takes little room, the conversation gets the space (owner 2026-10-24) */
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide) .iq-head,html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide).is-docked .iq-head{min-height:0;padding:10px 16px 6px 22px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide) .iq-head h2,html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide).is-docked .iq-head h2{font-size:24px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide) .iq-head .iq-icon-button,html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide).is-docked .iq-head .iq-icon-button{height:36px!important;width:36px!important;min-width:36px!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide)::before,html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide).is-docked::before{height:130px;background-size:100% 100%,100% 100%,auto 130px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide) .iq-subhead{position:relative;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;gap:8px;padding:6px 16px 10px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide) .iq-subhead .iq-text-button{flex:1 1 0;height:34px;min-height:0!important;padding:0 10px!important;font-size:12.5px!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide) .iq-subhead .iq-hist{flex:0 0 auto;width:auto;margin:0;position:static}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide) .iq-subhead .iq-hist summary{display:flex;align-items:center;height:34px;padding:0 14px;border:1px solid rgba(255,255,255,.3);border-radius:999px;background:rgba(10,12,12,.45);color:#fff;font-size:12.5px;white-space:nowrap}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide) .iq-subhead .iq-hist[open] .iq-hist-list{position:absolute;left:0;right:0;top:100%;margin:0;padding:8px 12px;max-height:240px;background:#fff;box-shadow:0 12px 28px rgba(0,0,0,.25);z-index:7}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide) .iq-note{margin:2px 0 0;font-size:11px;line-height:1.3;text-align:left}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide) .iq-form{padding-top:4px;padding-bottom:6px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide) .iq-mode{margin:4px auto}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide).is-menu .iq-head{z-index:20}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide).is-menu .iq-subhead{z-index:1}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info]{width:210px!important;min-width:210px!important;right:16px;left:auto;justify-content:flex-start}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet]{top:calc(100% - 2px)}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info]{top:calc(100% + 46px)}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide) .iq-subhead .iq-text-button{height:34px!important;min-height:34px!important;display:inline-flex;align-items:center;justify-content:center;gap:8px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide) .iq-subhead{z-index:5}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info]{display:flex!important;place-items:unset!important;align-items:center;justify-content:flex-start!important;text-align:left;width:170px!important;min-width:170px!important;height:36px!important;padding:0 14px!important;font:500 13px/1 Arial,Helvetica,sans-serif!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info] svg{display:none}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info]::after{margin-left:0;font:500 13px/1 Arial,Helvetica,sans-serif}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet]{top:calc(100% - 2px)}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info]{top:calc(100% + 40px)}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide) .iq-head .iq-menu-hist{display:none!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide) .iq-subhead .iq-hist summary{display:none}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide) .iq-subhead .iq-hist{flex:0 0 0;width:0;overflow:visible}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head .iq-menu-hist{display:flex!important;position:absolute;right:22px;z-index:5;top:calc(100% + 78px);width:190px!important;min-width:190px!important;height:38px!important;min-height:38px!important;box-sizing:border-box;align-items:center;justify-content:flex-start!important;padding:0 14px!important;background:#fff!important;color:#101311!important;border:1px solid #d9dde1!important;box-shadow:0 8px 24px rgba(0,0,0,.28)!important;font:500 13px/1 Arial,Helvetica,sans-serif!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info]{right:22px;width:190px!important;min-width:190px!important;height:38px!important;min-height:38px!important;box-sizing:border-box}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet]{top:calc(100% + 2px)}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info]{top:calc(100% + 40px)}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide) .iq-head,html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide).is-docked .iq-head{padding-right:24px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer:not(.is-wide).is-docked .iq-head{padding-top:14px;padding-right:30px}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head .iq-menu-hist{line-height:36px!important;padding-top:0!important;padding-bottom:0!important;align-items:center}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info]::after{line-height:36px}
/* one clean menu list: three rows in one panel with dividers */
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head .iq-menu-hist{display:flex!important;align-items:center;justify-content:flex-start!important;position:absolute;right:22px;left:auto;width:220px!important;min-width:220px!important;height:42px!important;min-height:42px!important;line-height:1!important;padding:0 18px!important;margin:0!important;box-sizing:border-box;background:#fff!important;color:#101311!important;border:0!important;border-bottom:1px solid #e6e8eb!important;border-radius:0!important;box-shadow:none!important;font:500 14px/1 Arial,Helvetica,sans-serif!important;text-align:left}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet]{top:calc(100% + 6px);border-radius:12px 12px 0 0!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info]{top:calc(100% + 48px)}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head .iq-menu-hist{top:calc(100% + 90px);border-bottom:0!important;border-radius:0 0 12px 12px!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info]::after{margin:0;line-height:1;font:500 14px/1 Arial,Helvetica,sans-serif}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet]:hover,html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info]:hover,html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head .iq-menu-hist:hover{background:#f1f3f5!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head .iq-menu-hist{border-left:1px solid #d9dde1!important;border-right:1px solid #d9dde1!important;z-index:30}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet]{border-top:1px solid #d9dde1!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head .iq-menu-hist{border-bottom:1px solid #d9dde1!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head .iq-menu-hist{display:grid!important;grid-auto-flow:column;justify-content:start!important;align-content:center!important;align-items:center!important;place-items:center start!important;padding:0 18px!important}
/* menu, dark glass like the header buttons: quiet, thin type, hairline dividers */
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head .iq-menu-hist{width:230px!important;min-width:230px!important;height:44px!important;min-height:44px!important;padding:0 20px!important;background:rgba(16,17,16,.94)!important;backdrop-filter:blur(10px);color:rgba(255,255,255,.92)!important;border:0!important;border-left:1px solid rgba(255,255,255,.14)!important;border-right:1px solid rgba(255,255,255,.14)!important;border-bottom:1px solid rgba(255,255,255,.08)!important;border-radius:0!important;box-shadow:none!important;font:400 13px/1 Arial,Helvetica,sans-serif!important;letter-spacing:.02em!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet]{top:calc(100% + 8px);border-top:1px solid rgba(255,255,255,.14)!important;border-radius:14px 14px 0 0!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info]{top:calc(100% + 52px)}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head .iq-menu-hist{top:calc(100% + 96px);border-bottom:1px solid rgba(255,255,255,.14)!important;border-radius:0 0 14px 14px!important;box-shadow:0 16px 36px rgba(0,0,0,.45)!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info]::after{font:400 13px/1 Arial,Helvetica,sans-serif;letter-spacing:.02em}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head .iq-menu-hist:hover{background:rgba(48,50,49,.96)!important;color:#fff!important}
/* never black buttons (owner): header icon buttons and the menu are light */
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer .iq-head .iq-icon-button{background:#f1f3f5!important;background-image:none!important;color:#0b0f14!important;border:1px solid #0b0f14!important;box-shadow:none!important;backdrop-filter:none!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer .iq-head .iq-icon-button:hover,html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer .iq-head .iq-icon-button:focus-visible{background:#fff!important;border-color:#0b0f14!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head .iq-menu-hist{background:#f1f3f5!important;backdrop-filter:none;color:#0b0f14!important;border-left:1px solid #0b0f14!important;border-right:1px solid #0b0f14!important;border-bottom:1px solid #c9ced4!important;font-weight:500!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet]{border-top:1px solid #0b0f14!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head .iq-menu-hist{border-bottom:1px solid #0b0f14!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head [data-iq-info],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head .iq-menu-hist:hover{background:#fff!important;color:#0b0f14!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer .iq-head .iq-icon-button svg,html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer .iq-head .iq-icon-button svg *{stroke:#0b0f14!important;color:#0b0f14!important}

/* the "save in the vehicle fleet?" question for a vehicle or axle that is not in the fleet yet */
.iq-fleet-ask{max-width:420px}
.iq-fleet-ask p{margin:14px 0 4px}
.iq-fleet-ask-row{display:flex;gap:10px;margin-top:12px}
/* quiet menu: white, hairline border, soft shadow, light type */
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head [data-iq-info],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head .iq-menu-hist{width:200px!important;min-width:200px!important;height:38px!important;min-height:38px!important;padding:0 18px!important;background:#fff!important;color:#2a3036!important;border:0!important;border-bottom:1px solid #eceef0!important;border-radius:0!important;box-shadow:none!important;font:300 13px/1 "Segoe UI",system-ui,Arial,sans-serif!important;letter-spacing:.01em!important;-webkit-font-smoothing:antialiased}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head [data-iq-info]::after{font:300 13px/1 "Segoe UI",system-ui,Arial,sans-serif!important;letter-spacing:.01em}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head [data-iq-fleet]{top:calc(100% + 8px);border-radius:12px 12px 0 0!important;box-shadow:0 -1px 0 #dfe2e6,-1px 0 0 #dfe2e6,1px 0 0 #dfe2e6!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head [data-iq-info]{top:calc(100% + 46px);box-shadow:-1px 0 0 #dfe2e6,1px 0 0 #dfe2e6!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head .iq-menu-hist{top:calc(100% + 84px);border-bottom:0!important;border-radius:0 0 12px 12px!important;box-shadow:-1px 0 0 #dfe2e6,1px 0 0 #dfe2e6,0 1px 0 #dfe2e6,0 14px 30px rgba(0,0,0,.28)!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head [data-iq-info],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head .iq-menu-hist:hover,html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head [data-iq-info],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head .iq-menu-hist:focus-visible{background:#f7f8f9!important;color:#0b0f14!important}
.iq-fleet-form{display:grid;gap:10px;margin-top:12px}
.iq-fleet-field{display:grid;gap:4px;font-size:13px}
.iq-fleet-field input,.iq-fleet-field select,.iq-fleet-field textarea{font:inherit;padding:8px 10px;border:1px solid #c9ccd1;border-radius:8px;background:#fff;color:inherit;box-sizing:border-box;width:100%}
.iq-fleet-field input[readonly]{background:#f3f4f6}
.iq-fleet-msg{min-height:1.2em;margin:0;font-size:13px}
/* empty chat: the opening text (owner 2026-10-24) */
.iq-welcome{display:none}
.iq-log:empty+.iq-welcome{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1 1 auto;min-height:150px;padding:24px 28px;text-align:center}
.iq-log:empty{flex:0 0 0!important;min-height:0!important;padding:0!important}
.iq-welcome-kicker{display:flex;align-items:center;gap:16px;width:100%;max-width:340px;margin:0 auto 18px;font:600 12px/1 Arial,Helvetica,sans-serif;letter-spacing:.2em;color:#5d655f;text-transform:uppercase}
.iq-welcome-kicker::before,.iq-welcome-kicker::after{content:"";flex:1;height:1px;background:#dfe2e6}
.iq-welcome h3{margin:0 0 12px;font:800 clamp(24px,2.3vw,32px)/1.12 Arial,Helvetica,sans-serif;letter-spacing:-.015em;color:#0b0f14;text-transform:none}
.iq-welcome p{margin:0;max-width:420px;font:400 15px/1.5 Arial,Helvetica,sans-serif;color:#5d655f}
.iq-drawer:not(.is-docked):not(.is-wide) .iq-welcome h3{font-size:22px}
/* all three menu rows identical: white, tone changes only on hover */
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head [data-iq-fleet],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head [data-iq-info],html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head .iq-menu-hist{background:#fff!important;background-image:none!important;color:#2a3036!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head [data-iq-fleet]:hover,html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head [data-iq-info]:hover,html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head .iq-menu-hist:hover{background:#eef0f2!important;color:#0b0f14!important}
/* TTB IQ is the star of the welcome (owner 2026-10-25) */
html body .iq-drawer .iq-welcome .iq-welcome-kicker{font:800 34px/1 Arial,Helvetica,sans-serif!important;letter-spacing:.14em!important;color:#5d655f!important;max-width:460px!important;margin-bottom:22px!important}
html body .iq-drawer:not(.is-docked):not(.is-wide) .iq-welcome .iq-welcome-kicker{font-size:28px!important}
html body .iq-drawer .iq-welcome h3{font-size:21px!important;white-space:nowrap;max-width:none!important}
html body .iq-drawer:not(.is-docked):not(.is-wide) .iq-welcome h3{font-size:18px!important}
/* hover: only the type gets heavier; background, lines and shadow never change */
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head [data-iq-fleet]{background:#fff!important;border-color:transparent!important;box-shadow:0 -1px 0 #dfe2e6,-1px 0 0 #dfe2e6,1px 0 0 #dfe2e6!important;}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head [data-iq-fleet]:hover{background:#fff!important;border-color:transparent!important;box-shadow:0 -1px 0 #dfe2e6,-1px 0 0 #dfe2e6,1px 0 0 #dfe2e6!important;font-weight:700!important;color:#0b0f14!important;}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head [data-iq-fleet]:focus{background:#fff!important;border-color:transparent!important;box-shadow:0 -1px 0 #dfe2e6,-1px 0 0 #dfe2e6,1px 0 0 #dfe2e6!important;}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head [data-iq-fleet]:active{background:#fff!important;border-color:transparent!important;box-shadow:0 -1px 0 #dfe2e6,-1px 0 0 #dfe2e6,1px 0 0 #dfe2e6!important;}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head [data-iq-fleet]:focus-visible{background:#fff!important;border-color:transparent!important;box-shadow:0 -1px 0 #dfe2e6,-1px 0 0 #dfe2e6,1px 0 0 #dfe2e6!important;font-weight:700!important;color:#0b0f14!important;}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head [data-iq-fleet]:hover::after{font-weight:700!important;color:#0b0f14!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head [data-iq-info]{background:#fff!important;border-color:transparent!important;box-shadow:-1px 0 0 #dfe2e6,1px 0 0 #dfe2e6!important;}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head [data-iq-info]:hover{background:#fff!important;border-color:transparent!important;box-shadow:-1px 0 0 #dfe2e6,1px 0 0 #dfe2e6!important;font-weight:700!important;color:#0b0f14!important;}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head [data-iq-info]:focus{background:#fff!important;border-color:transparent!important;box-shadow:-1px 0 0 #dfe2e6,1px 0 0 #dfe2e6!important;}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head [data-iq-info]:active{background:#fff!important;border-color:transparent!important;box-shadow:-1px 0 0 #dfe2e6,1px 0 0 #dfe2e6!important;}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head [data-iq-info]:focus-visible{background:#fff!important;border-color:transparent!important;box-shadow:-1px 0 0 #dfe2e6,1px 0 0 #dfe2e6!important;font-weight:700!important;color:#0b0f14!important;}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head [data-iq-info]:hover::after{font-weight:700!important;color:#0b0f14!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head .iq-menu-hist{background:#fff!important;border-color:transparent!important;box-shadow:-1px 0 0 #dfe2e6,1px 0 0 #dfe2e6,0 1px 0 #dfe2e6,0 14px 30px rgba(0,0,0,.28)!important;}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head .iq-menu-hist:hover{background:#fff!important;border-color:transparent!important;box-shadow:-1px 0 0 #dfe2e6,1px 0 0 #dfe2e6,0 1px 0 #dfe2e6,0 14px 30px rgba(0,0,0,.28)!important;font-weight:700!important;color:#0b0f14!important;}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head .iq-menu-hist:focus{background:#fff!important;border-color:transparent!important;box-shadow:-1px 0 0 #dfe2e6,1px 0 0 #dfe2e6,0 1px 0 #dfe2e6,0 14px 30px rgba(0,0,0,.28)!important;}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head .iq-menu-hist:active{background:#fff!important;border-color:transparent!important;box-shadow:-1px 0 0 #dfe2e6,1px 0 0 #dfe2e6,0 1px 0 #dfe2e6,0 14px 30px rgba(0,0,0,.28)!important;}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head .iq-menu-hist:focus-visible{background:#fff!important;border-color:transparent!important;box-shadow:-1px 0 0 #dfe2e6,1px 0 0 #dfe2e6,0 1px 0 #dfe2e6,0 14px 30px rgba(0,0,0,.28)!important;font-weight:700!important;color:#0b0f14!important;}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head .iq-menu-hist:hover::after{font-weight:700!important;color:#0b0f14!important}
/* B2C chat (Direct, Gap): no vehicle fleet; the menu holds Fordonsinformation and Tidigare konversationer */
aside.iq-drawer.iq-nofleet [data-iq-fleet]{display:none!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head [data-iq-info]{top:calc(100% + 8px)!important;border-radius:12px 12px 0 0!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-drawer.is-menu:not(.is-wide) .iq-head.iq-head.iq-head .iq-menu-hist{top:calc(100% + 46px)!important}
html body.gap .iq-drawer .iq-welcome .iq-welcome-kicker{font-size:24px!important;letter-spacing:.1em!important;white-space:nowrap}
/* phone keyboard open: a slim but tidy header, the picture still behind it */
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-kb:not(.is-wide)::before{height:92px!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-kb:not(.is-wide) .iq-head{min-height:0!important;padding:8px 12px 4px 16px!important;flex-wrap:nowrap!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-kb:not(.is-wide) .iq-head h2{font-size:18px!important;line-height:1.1}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-kb:not(.is-wide) .iq-head .iq-icon-button{width:32px!important;min-width:32px!important;height:32px!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-kb:not(.is-wide) .iq-subhead{padding:2px 12px 6px!important;gap:8px!important}
html body:not(.zz-a):not(.zz-b) aside.iq-drawer.iq-drawer.iq-drawer.iq-kb:not(.is-wide) .iq-subhead .iq-text-button{height:30px!important;min-height:30px!important;font-size:12px!important}
/* a phone has no room for the enlarged chat (its sidebar layout falls apart): no enlarge button there */
@media(max-width:700px){html body .iq-drawer [data-iq-wide]{display:none!important}}
/* the header and the input never shrink when the window is low or an answer is long: only the conversation in between scrolls */
html body aside.iq-drawer .iq-head,html body aside.iq-drawer .iq-subhead,html body aside.iq-drawer .iq-form,html body aside.iq-drawer .iq-mode,html body aside.iq-drawer .iq-note{flex-shrink:0!important}
html body aside.iq-drawer .iq-body,html body aside.iq-drawer .iq-main{min-height:0}
html body aside.iq-drawer .iq-log{min-height:0}
/* all prices for the staff (owner 2026-10-25): one quiet line under the product */
.ttb-staff-prices{margin:8px 0 0;padding:6px 10px;border-radius:8px;background:#f4f1e6;color:#5a4a00;font:500 12px/1.35 Arial,Helvetica,sans-serif;box-sizing:border-box;max-width:100%}
.ttb-staff-prices div{display:grid;grid-template-columns:auto 1fr;align-items:baseline;column-gap:10px;padding:3px 0}
.ttb-staff-prices div+div{border-top:1px solid rgba(90,74,0,.15)}
.ttb-staff-prices dt{margin:0;font-weight:600}
.ttb-staff-prices dd{margin:0;text-align:right;font-weight:700;min-width:0}
.ttb-staff-prices dd span{white-space:nowrap}
.ttb-staff-prices dd small{display:block;font-size:10.5px;font-weight:600;opacity:.8;white-space:nowrap}
.iq-tile .ttb-staff-prices{font-size:11px;padding:5px 8px}
/* product cards as rows (owner 2026-10-26): short lists and every list on a phone. Narrow chat (floating window, phone): picture left of brand, name, article number and stock, then price and buy button on one line, the staff price box underneath.
   Wide chat (docked in the start page, enlarged): picture left, text in the middle, price and buy button on the right. */
.iq-tiles.is-rows{grid-template-columns:1fr;gap:8px}
@media(max-width:700px){.iq-tiles{grid-template-columns:1fr}}
.iq-tiles.is-rows .iq-tile,.iq-tiles:not(.is-rows) .iq-tile.iq-never{}
.iq-tiles.is-rows .iq-tile{display:grid;grid-template-columns:68px minmax(0,1fr);grid-template-areas:"img brand" "img name" "img art" "img stock" "price price" "buy buy" "staff staff";column-gap:10px;row-gap:2px;align-items:center;padding:10px 12px}
.iq-tiles.is-rows .iq-tile>img,.iq-tiles.is-rows .iq-tile>.iq-tile-noimg{grid-area:img;width:68px;height:68px;object-fit:contain;margin:0;align-self:start}
.iq-tiles.is-rows .iq-tile-brand{grid-area:brand}
.iq-tiles.is-rows .iq-tile>strong{grid-area:name}
.iq-tiles.is-rows .iq-tile-art{grid-area:art}
.iq-tiles.is-rows .iq-tile-price{grid-area:price;justify-self:start;font-size:16px;margin-top:6px}
.iq-tiles.is-rows .iq-tile-stock{grid-area:stock}
.iq-tiles.is-rows .iq-buy{grid-area:buy;justify-self:stretch;width:auto;margin:6px 0 0;padding:0 14px;white-space:nowrap;text-align:center}
.iq-tiles.is-rows .ttb-staff-prices{grid-area:staff;margin:8px 0 0}
html body aside.iq-drawer.is-docked .iq-tiles.is-rows .iq-tile,html body aside.iq-drawer.is-wide .iq-tiles.is-rows .iq-tile{grid-template-columns:92px minmax(0,1fr) auto;grid-template-areas:"img brand price" "img name price" "img art buy" "img stock buy" "staff staff staff";column-gap:12px}
html body aside.iq-drawer.is-docked .iq-tiles.is-rows .iq-tile>img,html body aside.iq-drawer.is-wide .iq-tiles.is-rows .iq-tile>img,html body aside.iq-drawer.is-docked .iq-tiles.is-rows .iq-tile>.iq-tile-noimg,html body aside.iq-drawer.is-wide .iq-tiles.is-rows .iq-tile>.iq-tile-noimg{width:92px;height:76px}
html body aside.iq-drawer.is-docked .iq-tiles.is-rows .iq-tile-price,html body aside.iq-drawer.is-wide .iq-tiles.is-rows .iq-tile-price{justify-self:end;text-align:right;font-size:17px;margin-top:0}
html body aside.iq-drawer.is-docked .iq-tiles.is-rows .iq-buy,html body aside.iq-drawer.is-wide .iq-tiles.is-rows .iq-buy{margin:0}
html body aside.iq-drawer .iq-tiles.is-rows,html body aside.iq-drawer.is-wide .iq-tiles.is-rows,html body aside.iq-drawer.is-docked .iq-tiles.is-rows{grid-template-columns:minmax(0,1fr)!important} /* rows are one column in every chat size (the enlarged chat's tile grid must not win) */
@media(max-width:700px){html body aside.iq-drawer .iq-tiles{grid-template-columns:minmax(0,1fr)!important}}
/* in the wide chat the staff prices are one strip of four columns under the row, not four long lines */
html body aside.iq-drawer.is-docked .iq-tiles.is-rows .ttb-staff-prices,html body aside.iq-drawer.is-wide .iq-tiles.is-rows .ttb-staff-prices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 14px}
html body aside.iq-drawer.is-docked .iq-tiles.is-rows .ttb-staff-prices div,html body aside.iq-drawer.is-wide .iq-tiles.is-rows .ttb-staff-prices div{display:block;border-top:0;padding:2px 0}
html body aside.iq-drawer.is-docked .iq-tiles.is-rows .ttb-staff-prices dd,html body aside.iq-drawer.is-wide .iq-tiles.is-rows .ttb-staff-prices dd{text-align:left}
html body aside.iq-drawer.is-docked .iq-tiles.is-rows .ttb-staff-prices dd small,html body aside.iq-drawer.is-wide .iq-tiles.is-rows .ttb-staff-prices dd small{display:inline;margin-left:4px}
/* proportions of the row price (owner 2026-10-26): a number is 15 px, "Kontakta oss för pris" a quiet 12 px line */
.iq-tiles.is-rows .iq-tile-price,html body aside.iq-drawer.is-docked .iq-tiles.is-rows .iq-tile-price,html body aside.iq-drawer.is-wide .iq-tiles.is-rows .iq-tile-price{font-size:15px;line-height:1.2}
.iq-tiles .iq-tile-price.is-ask,html body aside.iq-drawer .iq-tiles.is-rows .iq-tile-price.is-ask{font-size:12px!important;font-weight:600;color:#5d655f;line-height:1.3}
/* "Kontakta oss" form (owner 2026-10-26): a small pop-up above everything, white pill buttons */
dialog.ttb-contact-pop{width:min(460px,calc(100vw - 32px));max-height:calc(100vh - 32px);padding:22px 22px 18px;border:0;border-radius:18px;background:#fff;color:#0b0f14;box-shadow:0 24px 70px rgba(0,0,0,.35);font:400 14px/1.45 Arial,Helvetica,sans-serif}
dialog.ttb-contact-pop::backdrop{background:rgba(8,10,10,.55)}
.ttb-contact-pop h3{margin:0 28px 6px 0;font:800 20px/1.2 Arial,Helvetica,sans-serif}
.ttb-contact-what{margin:0 0 12px;color:#5d655f;font-size:13px}
.ttb-contact-pop textarea{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid #d0d4d9;border-radius:12px;font:inherit;resize:vertical;min-height:110px}
.ttb-contact-note{margin:10px 0 0;color:#5d655f;font-size:12.5px}
.ttb-contact-err{margin:8px 0 0;color:#b42318;font-size:13px}
.ttb-contact-row{display:flex;justify-content:flex-end;gap:10px;margin-top:16px}
.ttb-contact-pop .ttb-contact-send,.ttb-contact-pop .ttb-contact-cancel{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 20px;border:1px solid #0b0f14;border-radius:999px;background:#fff;color:#0b0f14;font:600 14px/1 Arial,Helvetica,sans-serif;text-decoration:none;cursor:pointer}
.ttb-contact-pop .ttb-contact-send{background:#eef1f4}
.ttb-contact-pop .ttb-contact-send:hover,.ttb-contact-pop .ttb-contact-cancel:hover{background:#fff;font-weight:800}
.ttb-contact-pop .ttb-contact-send:disabled{opacity:.6;cursor:default}
.ttb-contact-x{position:absolute;top:10px;right:12px;width:32px;height:32px;border:0;border-radius:50%;background:transparent;color:#0b0f14;font:400 24px/1 Arial,sans-serif;cursor:pointer}
html body dialog.ttb-contact-pop .ttb-contact-x{background:#fff!important;color:#0b0f14!important;border:1px solid #c9ced4!important;box-shadow:none!important;padding:0!important;min-height:0!important;line-height:1!important}
html body dialog.ttb-contact-pop .ttb-contact-x:hover{border-color:#0b0f14!important;font-weight:700}
.iq-tile-price .iq-tile-vat{display:block;margin-top:2px;font-size:11px;font-weight:400;line-height:1.2;color:#6a726c;white-space:nowrap}

/* delete the saved conversations: a small white pill (no black buttons), red text when it is waiting for the second click */
html body .iq-hist-clear{display:block;margin:10px 12px 4px;padding:8px 14px;border:1px solid #0b0f14!important;border-radius:999px!important;background:#fff!important;color:#0b0f14!important;font:600 12.5px Arial,Helvetica,sans-serif!important;cursor:pointer}
html body .iq-hist-clear:hover{background:#eef0ee!important}
html body .iq-hist-clear.is-armed{border-color:#b3261e!important;color:#b3261e!important}

/* ===== TTB IQ voice (only present when the server hands out voice): a round microphone button like the attach button, and a thin status row with the end button ===== */
html body .iq-mic{flex:none;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;margin:0 6px 0 0;padding:0;border:1px solid #b9bec4!important;border-radius:999px!important;background:#fff!important;color:#0b0f14!important;cursor:pointer;box-shadow:none!important}
html body .iq-mic:hover,html body .iq-mic:focus-visible{background:#f3f4f6!important;border-color:#202124!important}
html body .iq-mic.is-on{background:#e6e9e6!important;border-color:#0b0f14!important}
.iq-voice-bar{display:flex;align-items:center;gap:10px;margin:0 16px 8px;padding:8px 12px;border:1px solid #d0d4d9;border-radius:999px;background:#fff;font-size:13px;color:#0b0f14}
.iq-voice-bar[hidden]{display:none}
.iq-voice-dot{flex:none;width:10px;height:10px;border-radius:50%;background:#8a9099}
.iq-voice-bar[data-state=listening] .iq-voice-dot{background:#1b7a33;animation:iq-voice-pulse 1.6s ease-in-out infinite}
.iq-voice-bar.is-hearing .iq-voice-dot{animation-duration:.5s}
.iq-voice-bar[data-state=processing] .iq-voice-dot{background:#b7791f;animation:iq-voice-pulse .8s ease-in-out infinite}
.iq-voice-bar[data-state=speaking] .iq-voice-dot{background:#0b0f14;animation:iq-voice-pulse 1s ease-in-out infinite}
.iq-voice-state{flex:1 1 auto;font-weight:600}
.iq-voice-clock{flex:none;color:#5d655f;font-variant-numeric:tabular-nums}
html body .iq-voice-stop{flex:none;padding:6px 14px;border:1px solid #0b0f14!important;border-radius:999px!important;background:#fff!important;color:#0b0f14!important;font-size:13px;font-weight:600;cursor:pointer;box-shadow:none!important}
html body .iq-voice-stop:hover,html body .iq-voice-stop:focus-visible{background:#f3f4f6!important}
@keyframes iq-voice-pulse{0%,100%{opacity:.45}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){.iq-voice-dot{animation:none!important}}

html body aside.iq-drawer .iq-wide-only{display:none}
html body aside.iq-drawer.is-wide .iq-wide-only{display:inline-flex}
html body aside.iq-drawer.is-wide.is-full{width:90vw!important;height:90dvh!important;max-height:90dvh!important}
html body aside.iq-drawer.is-wide.is-full .iq-turn{max-width:1100px}
html body aside.iq-drawer.is-wide.is-nosidebar .iq-subhead{display:none!important}
@media (max-width:700px){html body aside.iq-drawer .iq-full-button{display:none}}

html body aside.iq-drawer .iq-pane-l,html body aside.iq-drawer .iq-pane-r{display:contents}
html body aside.iq-drawer.is-wide.is-full .iq-main{flex-direction:row}
html body aside.iq-drawer.is-wide.is-full .iq-pane-l{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;min-height:0}
html body aside.iq-drawer.is-wide.is-full .iq-pane-r{display:flex;flex-direction:column;flex:0 0 clamp(320px,30vw,460px);min-height:0;padding:16px;gap:10px;border-left:1px solid #e5e7ea;background:#f6f6f7;overflow-y:auto}
html body aside.iq-drawer.is-wide.is-full .iq-pane-r .iq-form{flex:1 1 auto;min-height:220px;display:grid;grid-template-columns:auto auto 1fr auto;grid-template-rows:minmax(0,1fr) auto;gap:10px;padding:0;border:0}
html body aside.iq-drawer.is-wide.is-full .iq-pane-r .iq-form textarea{grid-column:1/-1;grid-row:1;height:100%;max-height:none;min-height:0;resize:none}
html body aside.iq-drawer.is-wide.is-full .iq-pane-r .iq-attach{grid-column:1;grid-row:2}
html body aside.iq-drawer.is-wide.is-full .iq-pane-r .iq-mic{grid-column:2;grid-row:2}
html body aside.iq-drawer.is-wide.is-full .iq-pane-r .iq-send{grid-column:4;grid-row:2}

html body aside.iq-drawer .iq-head h2 .iq-logo{display:block;height:30px;width:auto;max-width:100%}
html body aside.iq-drawer.is-wide .iq-head h2 .iq-logo{height:34px}
html body aside.iq-drawer .iq-turn.is-assistant::before{background-image:var(--iq-avatar-img,none);background-size:cover;background-position:center}
html body aside.iq-drawer[style*="--iq-avatar-img:url"] .iq-turn.is-assistant::before{content:""}

html body .iq-drawer .iq-welcome .iq-welcome-kicker .iq-logo{flex:0 0 auto;display:block;height:34px;width:auto}
html body .iq-drawer:not(.is-docked):not(.is-wide) .iq-welcome .iq-welcome-kicker .iq-logo{height:28px}

html body .iq-drawer .iq-welcome .iq-welcome-kicker{max-width:620px!important}
html body .iq-drawer .iq-welcome .iq-welcome-kicker .iq-logo{height:auto;width:320px;max-width:70%}
html body .iq-drawer:not(.is-docked):not(.is-wide) .iq-welcome .iq-welcome-kicker .iq-logo{height:auto;width:280px}

html body aside.iq-drawer .iq-head h2 .iq-logo{height:46px}
html body aside.iq-drawer.is-wide .iq-head h2 .iq-logo{height:54px}
@media(max-width:560px){html body aside.iq-drawer .iq-head h2 .iq-logo{height:38px}}