/* Website assistant: floating button and chat panel (text, voice, property cards). Site tokens from ofoq.css. */
.sa-fab { position: fixed; z-index: 1030; inset-inline-end: 1.25rem; bottom: 5.25rem; width: 56px; height: 56px; border-radius: 999px; border: 0; background: var(--primary-color, #004dfa); color: #fff; display: grid; place-items: center; box-shadow: 0 8px 24px rgba(7, 19, 48, .25); cursor: pointer; transition: transform .2s; }
.sa-fab:hover { transform: translateY(-2px); background: var(--hover-color, #003ecb); }
.sa-fab:focus-visible, .sa-panel button:focus-visible, .sa-panel input:focus-visible, .sa-panel a:focus-visible { outline: 2px solid var(--of-blue-300, #7fa6ff); outline-offset: 2px; }
.sa-fab svg { width: 26px; height: 26px; }
.sa-panel { position: fixed; z-index: 1031; inset-inline-end: 1.25rem; bottom: 5.25rem; width: min(400px, calc(100vw - 2.5rem)); height: min(620px, calc(100vh - 7rem)); background: #fff; border: 1px solid var(--of-line, #e6eaf2); border-radius: 14px; box-shadow: 0 20px 50px rgba(7, 19, 48, .25); display: flex; flex-direction: column; overflow: hidden; font-family: var(--of-font-text, system-ui, sans-serif); color: var(--of-body, #3d4a63); }
.sa-panel[hidden], .sa-fab[hidden] { display: none; }
.sa-head { display: flex; align-items: center; gap: .5rem; padding: .75rem 1rem; background: var(--of-navy, #071330); color: #fff; }
.sa-head strong { flex: 1; font-family: var(--of-font-display, inherit); font-size: 1rem; font-weight: 600; }
.sa-head button { background: transparent; border: 0; color: #fff; font-size: 1.4rem; line-height: 1; cursor: pointer; padding: .25rem .5rem; }
.sa-log { flex: 1; overflow-y: auto; padding: 1rem; display: flex; flex-direction: column; gap: .6rem; background: var(--of-soft, #f5f7fc); }
.sa-msg { max-width: 88%; padding: .55rem .8rem; border-radius: 12px; font-size: .92rem; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.sa-msg.user { align-self: flex-end; background: var(--primary-color, #004dfa); color: #fff; border-end-end-radius: 4px; }
.sa-msg.bot { align-self: flex-start; background: #fff; border: 1px solid var(--of-line, #e6eaf2); border-end-start-radius: 4px; }
.sa-msg.err { align-self: center; background: #fff4ed; color: var(--of-danger, #c2410c); font-size: .85rem; }
.sa-cards { display: flex; flex-direction: column; gap: .5rem; align-self: stretch; }
.sa-card { display: flex; gap: .6rem; background: #fff; border: 1px solid var(--of-line, #e6eaf2); border-radius: 10px; padding: .5rem; }
.sa-card img.sa-thumb { width: 84px; height: 72px; object-fit: cover; border-radius: 6px; flex: none; background: var(--of-line, #e6eaf2); }
.sa-card .sa-body { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: .15rem; font-size: .82rem; }
.sa-card .sa-name { font-weight: 600; color: var(--of-navy, #071330); font-size: .9rem; }
.sa-card .sa-num { color: var(--of-muted-strong, #56637a); margin-inline-end: .35rem; }
.sa-card .sa-price { color: var(--primary-color, #004dfa); font-weight: 600; }
.sa-card .sa-free { color: var(--of-success, #0f7b55); }
.sa-card .sa-none { color: var(--of-danger, #c2410c); }
.sa-card a.sa-open { align-self: flex-start; margin-top: .2rem; font-weight: 600; color: var(--primary-color, #004dfa); text-decoration: none; }
.sa-card a.sa-open:hover { text-decoration: underline; }
.sa-gallery { display: flex; gap: .3rem; flex-wrap: wrap; margin-top: .3rem; }
.sa-gallery img { width: 56px; height: 44px; object-fit: cover; border-radius: 4px; }
.sa-chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.sa-chips button { background: #fff; border: 1px solid var(--of-line-strong, #c5cedd); border-radius: 999px; padding: .3rem .7rem; font-size: .8rem; cursor: pointer; color: var(--of-navy, #071330); }
.sa-chips button:hover { border-color: var(--primary-color, #004dfa); }
.sa-form { display: flex; gap: .4rem; padding: .6rem; border-top: 1px solid var(--of-line, #e6eaf2); background: #fff; }
.sa-form input { flex: 1; min-width: 0; border: 1px solid var(--of-line-strong, #c5cedd); border-radius: 999px; padding: .55rem .9rem; font-size: .92rem; }
.sa-form button { flex: none; width: 42px; height: 42px; border-radius: 999px; border: 0; display: grid; place-items: center; cursor: pointer; background: var(--of-blue-100, #e5edff); color: var(--primary-color, #004dfa); }
.sa-form button.sa-send { background: var(--primary-color, #004dfa); color: #fff; }
.sa-form button.sa-rec { background: var(--of-danger, #c2410c); color: #fff; animation: sa-pulse 1.2s infinite; }
.sa-form button:disabled { opacity: .5; cursor: default; }
.sa-form svg { width: 20px; height: 20px; }
.sa-typing { align-self: flex-start; color: var(--of-muted, #64748b); font-size: .82rem; }
@keyframes sa-pulse { 50% { box-shadow: 0 0 0 6px rgba(194, 65, 12, .2); } }
@media (max-width: 575.98px) {
    .sa-fab { inset-inline-end: 1rem; bottom: 4.75rem; }
    .sa-panel { inset: auto 0 0 0; width: 100%; height: min(88vh, 640px); border-radius: 14px 14px 0 0; }
}
@media (prefers-reduced-motion: reduce) { .sa-fab, .sa-form button.sa-rec { transition: none; animation: none; } }
