/**
 * Bilassistenten – chat block above the smart365 search form.
 *
 * Desktop (>1000px) follows concept 2a: chat at the top of the black block,
 * separated from the filters by a divider.
 * Mobile (<=1000px) follows 3a (collapsed) and 3b (answer panel open).
 */

:root {
    --mb-assist-accent: var(--smart365-accent, #ffa800);
    --mb-assist-panel-bg: #f4f4f1;
    --mb-assist-input-bg: #e9eef6;
    --mb-assist-input-border: #cdd8e8;
    --mb-assist-rule: #2a2a2a;
}

#smart365-search-form .mb-assist {
    margin: 0 0 26px;
}

/* Intro row -------------------------------------------------------------- */

#smart365-search-form .mb-assist__intro {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 12px;
}

#smart365-search-form .mb-assist__dot {
    width: 6px;
    height: 6px;
    flex: 0 0 6px;
    border-radius: 50%;
    background: var(--mb-assist-accent);
}

#smart365-search-form .mb-assist__eyebrow {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--mb-assist-accent);
}

#smart365-search-form .mb-assist__hint {
    font-size: 12px;
    line-height: 1.4;
    color: #8d8d8d;
}

/* Answer panel – opens above the composer on first send ------------------- */

#smart365-search-form .mb-assist__panel {
    background: var(--mb-assist-panel-bg);
    margin-bottom: 12px;
}

#smart365-search-form .mb-assist__panel[hidden] {
    display: none;
}

/* The widget sizes itself to the conversation; the clamp is all we own. */
#smart365-search-form .mb-assist__widget {
    --mb-assist-h-min: 260px;
    --mb-assist-h-max: 560px;
}

#smart365-search-form .mb-assist__widget imagowidget-streaming-03 {
    width: 100%;
    min-height: var(--mb-assist-h-min);
    max-height: var(--mb-assist-h-max);
}

/* Composer --------------------------------------------------------------- */

#smart365-search-form .mb-assist__composer {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    padding: 0;
}

#smart365-search-form .mb-assist__input {
    flex: 1;
    min-width: 0;
    height: auto;
    background: var(--mb-assist-input-bg);
    border: 1px solid var(--mb-assist-input-border);
    border-radius: 20px;
    padding: 11px 18px;
    font-family: inherit;
    font-size: 13px;
    color: #111;
    outline: none;
}

#smart365-search-form .mb-assist__input::placeholder {
    color: #6b7686;
    opacity: 1;
}

/* Defensive: the parent theme styles form buttons aggressively, so pin every
   property that decides whether this stays a round icon button. */
#smart365-search-form .mb-assist__send {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 50% !important;
    padding: 0 !important;
    margin: 0;
    line-height: 0;
    font-size: 0;
    background: #c9cfd8;
    color: #333;
    box-shadow: none;
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;
    transition: background-color 0.2s, color 0.2s;
}

#smart365-search-form .mb-assist__send svg {
    display: block;
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    stroke: currentColor;
    fill: none;
}

#smart365-search-form .mb-assist__send:hover,
#smart365-search-form .mb-assist__send:focus-visible {
    background: var(--mb-assist-accent);
    color: #111;
}

/* Divider between assistant and filters ---------------------------------- */

#smart365-search-form .mb-assist-divider {
    display: flex;
    align-items: center;
    gap: 18px;
    margin: 26px 0;
}

#smart365-search-form .mb-assist-divider::before,
#smart365-search-form .mb-assist-divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--mb-assist-rule);
}

#smart365-search-form .mb-assist-divider span {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #7a7a7a;
}

/* Mobile: 3a collapsed / 3b expanded ------------------------------------- */

@media (max-width: 1000px) {
    #smart365-search-form .mb-assist__intro {
        gap: 8px 10px;
        margin-bottom: 10px;
    }

    #smart365-search-form .mb-assist__eyebrow {
        font-size: 10px;
    }

    /* Hint drops to its own line, as in 3a. */
    #smart365-search-form .mb-assist__hint {
        flex: 0 0 100%;
        margin: 0;
    }

    #smart365-search-form .mb-assist__composer {
        gap: 10px;
    }

    #smart365-search-form .mb-assist__input {
        border-radius: 22px;
        padding: 13px 18px;
        font-size: 14px;
    }

    #smart365-search-form .mb-assist__send {
        width: 44px;
        height: 44px;
        flex: 0 0 44px;
    }

    #smart365-search-form .mb-assist__send svg {
        width: 20px;
        height: 20px;
    }

    #smart365-search-form .mb-assist__widget {
        --mb-assist-h-min: 240px;
        --mb-assist-h-max: 460px;
    }

    #smart365-search-form .mb-assist-divider {
        gap: 12px;
        margin: 26px 0;
    }

    #smart365-search-form .mb-assist-divider span {
        font-size: 10px;
        letter-spacing: 0.12em;
    }
}

/* Queued send – the widget only accepts one message at a time. */
#smart365-search-form .mb-assist__send[disabled] {
    opacity: 0.55;
    cursor: default;
}

#smart365-search-form .mb-assist__send[disabled]:hover {
    background: #c9cfd8;
    color: #333;
}