/* SHIFT Design homepage AI quote-assistant widget (#shift-qa) styles.
   Moved out of an inline <style> block on index.html on 2026-09-06 so the
   site's Content-Security-Policy needs no style-src exceptions. Loaded
   ONLY on index.html - same reasoning as shift-tools.js being its own
   bundle rather than bloating every page (see shift-deploy-command memory).
*/
#shift-qa{--orange:#BF360C;--orange-soft:rgba(191,54,12,.10);--ink:#141312;--paper:#F6F2EA;--paper-2:#fff;--line:#e7e1d6;--muted:#6f675b;
          --display:"Bricolage Grotesque","Archivo Black",system-ui,sans-serif;--body:"Hanken Grotesk",system-ui,-apple-system,sans-serif;
          font-family:var(--body);color:var(--ink);width:100%;scroll-margin-top:96px}
        #shift-qa *{box-sizing:border-box}
        #shift-qa .sqa-card{background:var(--paper-2);border:1px solid var(--line);border-radius:20px;overflow:hidden;
          box-shadow:0 24px 60px -30px rgba(20,19,18,.30);display:flex;flex-direction:column;height:min(70vh,560px)}
        #shift-qa .sqa-hd{display:flex;align-items:center;gap:11px;padding:16px 18px;border-bottom:1px solid var(--line)}
        #shift-qa .sqa-mark{width:20px;height:20px;background:var(--orange);clip-path:polygon(26% 0,100% 0,74% 100%,0 100%);flex-shrink:0}
        #shift-qa .sqa-title{font-family:var(--display);font-weight:800;font-size:1.02rem;line-height:1.05;letter-spacing:-.01em}
        #shift-qa .sqa-sub{font-size:.78rem;color:var(--muted);margin-top:2px}
        #shift-qa .sqa-msgs{flex:1;overflow-y:auto;padding:20px 18px 6px;display:flex;flex-direction:column;gap:13px}
        #shift-qa .sqa-row{display:flex;max-width:90%}
        #shift-qa .sqa-row.you{align-self:flex-end;justify-content:flex-end}
        #shift-qa .sqa-row.bot{align-self:flex-start}
        #shift-qa .sqa-bub{padding:11px 14px;border-radius:15px;font-size:.92rem;line-height:1.5}
        #shift-qa .bot .sqa-bub{background:var(--paper);border:1px solid var(--line);border-bottom-left-radius:5px}
        #shift-qa .you .sqa-bub{background:var(--orange);color:#fff;border-bottom-right-radius:5px}
        #shift-qa .sqa-bub strong{font-weight:600}
        #shift-qa .sqa-typing{display:none;align-self:flex-start}#shift-qa .sqa-typing.on{display:flex}
        #shift-qa .sqa-typing .sqa-bub{display:flex;gap:5px;align-items:center}
        #shift-qa .sqa-dot{width:6px;height:6px;border-radius:50%;background:var(--orange);opacity:.5;animation:sqabln 1.2s infinite ease-in-out}
        #shift-qa .sqa-dot:nth-child(2){animation-delay:.18s}#shift-qa .sqa-dot:nth-child(3){animation-delay:.36s}
        @keyframes sqabln{0%,80%,100%{transform:translateY(0);opacity:.4}40%{transform:translateY(-4px);opacity:1}}
        #shift-qa .sqa-chips{display:flex;flex-wrap:wrap;gap:7px;padding:2px 18px 8px}
        #shift-qa .sqa-chip{font-family:var(--display);font-weight:600;font-size:.78rem;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:50px;padding:10px 14px;cursor:pointer;transition:.18s}
        #shift-qa .sqa-chip:hover{background:var(--orange);color:#fff;border-color:var(--orange)}
        #shift-qa .sqa-cta{padding:0 18px 10px}
        #shift-qa .sqa-cta button{width:100%;font-family:var(--display);font-weight:700;font-size:.92rem;color:#fff;background:var(--orange);border:none;border-radius:11px;padding:12px;cursor:pointer;transition:.18s;display:flex;align-items:center;justify-content:center;gap:8px}
        #shift-qa .sqa-cta button:hover{background:var(--ink)}#shift-qa .sqa-cta button:disabled{opacity:.6;cursor:not-allowed}
        #shift-qa .sqa-inp{display:flex;gap:9px;align-items:flex-end;padding:13px 14px;border-top:1px solid var(--line)}
        #shift-qa .sqa-inp textarea{flex:1;resize:none;font-family:var(--body);font-size:1rem;color:var(--ink);border:1px solid var(--line);border-radius:11px;padding:10px 12px;max-height:110px;outline:none;background:var(--paper-2)}
        #shift-qa .sqa-inp textarea:focus{border-color:var(--orange);box-shadow:0 0 0 3px var(--orange-soft)}
        #shift-qa .sqa-send{font-family:var(--display);font-weight:700;font-size:.9rem;color:#fff;background:var(--orange);border:none;border-radius:11px;padding:10px 15px;cursor:pointer;display:flex;align-items:center;gap:6px;transition:.18s;white-space:nowrap}
        #shift-qa .sqa-send:hover{background:var(--ink)}#shift-qa .sqa-send:disabled{opacity:.5;cursor:not-allowed}
        #shift-qa .sqa-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
        #shift-qa .sqa-fallback{text-align:center;font-size:.8rem;color:var(--muted);margin:12px 0 0}
        #shift-qa .sqa-fallback a{color:var(--orange);font-weight:600;text-decoration:none}
        #shift-qa .sqa-fallback a:hover{text-decoration:underline}
        /* attachments: pending tray, the paperclip, and thumbs inside a sent bubble */
        #shift-qa .sqa-tray{display:flex;flex-wrap:wrap;gap:7px;padding:0 14px 10px}
        #shift-qa .sqa-tray:empty{display:none}
        #shift-qa .sqa-pill{position:relative;display:inline-flex;align-items:center;gap:7px;max-width:215px;background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:5px 27px 5px 5px;font-size:.78rem}
        #shift-qa .sqa-pill img{width:30px;height:30px;object-fit:cover;border-radius:6px;flex-shrink:0}
        #shift-qa .sqa-doc{width:30px;height:30px;border-radius:6px;background:var(--orange-soft);color:var(--orange);display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:700;font-size:.58rem;flex-shrink:0;text-transform:uppercase}
        #shift-qa .sqa-pill b{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
        #shift-qa .sqa-x{position:absolute;top:2px;right:2px;width:21px;height:21px;border:none;background:transparent;color:var(--muted);cursor:pointer;border-radius:5px;font-size:1.05rem;line-height:1;padding:0}
        #shift-qa .sqa-x:hover{background:var(--orange);color:#fff}
        @media (pointer:coarse){#shift-qa .sqa-x{width:30px;height:30px;font-size:1.25rem}#shift-qa .sqa-pill{padding-right:34px}}
        #shift-qa .sqa-clip{flex-shrink:0;width:44px;height:44px;border:1px solid var(--line);background:var(--paper-2);border-radius:11px;color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.18s;padding:0}
        #shift-qa .sqa-clip:hover{border-color:var(--orange);color:var(--orange);background:var(--orange-soft)}
        #shift-qa .sqa-clip:disabled{opacity:.45;cursor:not-allowed}
        #shift-qa .sqa-clip svg{width:19px;height:19px}
        #shift-qa .sqa-note{padding:0 18px 8px;margin:0;font-size:.76rem;color:var(--muted)}
        #shift-qa .sqa-note:empty{display:none}
        #shift-qa .sqa-card.is-drag{outline:2px dashed var(--orange);outline-offset:-7px}
        #shift-qa .sqa-att{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
        #shift-qa .sqa-att img{width:104px;height:104px;object-fit:cover;border-radius:9px;display:block}
        #shift-qa .sqa-att .sqa-attfile{display:inline-flex;align-items:center;gap:6px;max-width:100%;font-size:.78rem;padding:6px 10px;border-radius:9px;background:rgba(255,255,255,.2)}
        #shift-qa .sqa-att .sqa-attfile span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
