/* BE MODE AI CUSTOMER SERVICE V2.3 — glass support-agent launcher + collision-safe positioning */
.bm-ai-root,
.bm-ai-root * {
    box-sizing: border-box;
}

.bm-ai-root {
    --bm-ai-ink: #171717;
    --bm-ai-muted: #73736e;
    --bm-ai-line: rgba(23, 23, 23, 0.09);
    --bm-ai-glass: rgba(255, 255, 255, 0.72);
    --bm-ai-glass-strong: rgba(255, 255, 255, 0.88);
    --bm-ai-glass-soft: rgba(255, 255, 255, 0.56);
    --bm-ai-dark-glass: rgba(23, 23, 23, 0.58);
    --bm-ai-avoid-bottom: 0px;
    position: fixed;
    right: 16px;
    bottom: calc(16px + env(safe-area-inset-bottom, 0px) + var(--bm-ai-avoid-bottom));
    z-index: 46;
    font-family: inherit;
    color: var(--bm-ai-ink);
    transition: bottom 220ms ease;
}


.bm-ai-launcher {
    position: relative;
    display: grid;
    width: 54px;
    height: 54px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.38);
    border-radius: 18px;
    background: var(--bm-ai-dark-glass);
    color: #fff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.20), 0 12px 30px rgba(18, 18, 18, 0.16);
    -webkit-backdrop-filter: blur(18px) saturate(150%);
    backdrop-filter: blur(18px) saturate(150%);
    cursor: pointer;
    transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.bm-ai-launcher:hover {
    transform: translateY(-2px);
    background: rgba(23, 23, 23, 0.68);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), 0 16px 34px rgba(18, 18, 18, 0.20);
}

.bm-ai-launcher:focus-visible,
.bm-ai-close:focus-visible,
.bm-ai-send:focus-visible,
.bm-ai-chip:focus-visible,
.bm-ai-product:focus-visible {
    outline: 2px solid rgba(23, 23, 23, 0.28);
    outline-offset: 3px;
}

.bm-ai-launcher .bm-ai-icon {
    width: 28px;
    height: 28px;
}

.bm-ai-launcher-dot {
    position: absolute;
    top: -2px;
    right: -2px;
    width: 12px;
    height: 12px;
    border: 3px solid rgba(255, 255, 255, 0.96);
    border-radius: 999px;
    background: #31a85a;
}

.bm-ai-icon {
    display: inline-grid;
    width: 20px;
    height: 20px;
    place-items: center;
}

.bm-ai-icon svg {
    width: 100%;
    height: 100%;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.bm-ai-icon-support svg {
    fill: currentColor;
    stroke: none;
    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.12));
}

.bm-ai-panel {
    position: absolute;
    right: 0;
    bottom: 66px;
    display: flex;
    width: min(380px, calc(100vw - 24px));
    height: clamp(300px, 68dvh, 600px);
    max-height: calc(100vh - 108px - var(--bm-ai-avoid-bottom));
    max-height: calc(100dvh - 108px - var(--bm-ai-avoid-bottom));
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: 22px;
    background: var(--bm-ai-glass);
    box-shadow: 0 22px 58px rgba(18, 18, 18, 0.16);
    -webkit-backdrop-filter: blur(24px) saturate(145%);
    backdrop-filter: blur(24px) saturate(145%);
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px) scale(0.99);
    transform-origin: bottom right;
    transition: opacity 170ms ease, transform 170ms ease;
}

.bm-ai-root.is-open .bm-ai-panel {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0) scale(1);
}

.bm-ai-root.is-open .bm-ai-launcher {
    transform: scale(0.96);
}

.bm-ai-header {
    display: flex;
    min-height: 68px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 12px 11px 14px;
    border-bottom: 1px solid var(--bm-ai-line);
    background: rgba(255, 255, 255, 0.48);
}

.bm-ai-header-main {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 10px;
}

.bm-ai-avatar {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.36);
    border-radius: 13px;
    background: rgba(23, 23, 23, 0.54);
    color: #fff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 7px 18px rgba(18, 18, 18, 0.10);
    -webkit-backdrop-filter: blur(14px) saturate(145%);
    backdrop-filter: blur(14px) saturate(145%);
}

.bm-ai-avatar .bm-ai-icon {
    width: 21px;
    height: 21px;
}

.bm-ai-header-text {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 3px;
}

.bm-ai-title {
    overflow: hidden;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bm-ai-status {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--bm-ai-muted);
    font-size: 11px;
    line-height: 1.2;
}

.bm-ai-status i {
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: #31a85a;
}

.bm-ai-close {
    display: grid;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    place-items: center;
    border: 1px solid rgba(23, 23, 23, 0.06);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.48);
    color: #575753;
    cursor: pointer;
    transition: background 140ms ease, color 140ms ease;
}

.bm-ai-close:hover {
    background: rgba(255, 255, 255, 0.86);
    color: var(--bm-ai-ink);
}

.bm-ai-body {
    flex: 1 1 auto;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 16px 13px;
    background: rgba(255, 255, 255, 0.14);
    overscroll-behavior: contain;
    scrollbar-width: thin;
}

.bm-ai-intro {
    padding: 3px 2px 9px;
}

.bm-ai-intro-title {
    margin-bottom: 6px;
    font-size: 19px;
    font-weight: 720;
    letter-spacing: -0.025em;
    line-height: 1.18;
}

.bm-ai-intro-copy {
    max-width: 310px;
    color: var(--bm-ai-muted);
    font-size: 13px;
    line-height: 1.5;
}

.bm-ai-quick {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 14px;
}

.bm-ai-chip {
    max-width: 100%;
    padding: 8px 10px;
    overflow: hidden;
    border: 1px solid rgba(23, 23, 23, 0.08);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.55);
    color: #373733;
    font: inherit;
    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    transition: background 140ms ease, transform 140ms ease;
}

.bm-ai-chip:hover {
    background: rgba(255, 255, 255, 0.9);
    transform: translateY(-1px);
}

.bm-ai-message-row {
    display: flex;
    width: 100%;
    flex-direction: column;
    margin-top: 11px;
}

.bm-ai-message-row.is-user {
    align-items: flex-end;
}

.bm-ai-message-row.is-assistant {
    align-items: flex-start;
}

.bm-ai-message {
    max-width: 88%;
    padding: 10px 12px;
    border-radius: 15px;
    font-size: 13px;
    line-height: 1.52;
    white-space: pre-wrap;
    word-break: break-word;
}

.is-user > .bm-ai-message {
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-bottom-right-radius: 5px;
    background: rgba(23, 23, 23, 0.86);
    color: #fff;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

.is-assistant > .bm-ai-message {
    border: 1px solid rgba(23, 23, 23, 0.07);
    border-bottom-left-radius: 5px;
    background: rgba(255, 255, 255, 0.62);
    color: #30302d;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

.bm-ai-typing {
    display: flex;
    width: 56px;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 12px;
}

.bm-ai-typing span {
    width: 5px;
    height: 5px;
    border-radius: 999px;
    background: #858580;
    animation: bmAiTyping 1s infinite ease-in-out;
}

.bm-ai-typing span:nth-child(2) { animation-delay: 0.12s; }
.bm-ai-typing span:nth-child(3) { animation-delay: 0.24s; }

@keyframes bmAiTyping {
    0%, 60%, 100% { opacity: 0.35; transform: translateY(0); }
    30% { opacity: 1; transform: translateY(-3px); }
}

.bm-ai-products {
    display: grid;
    width: min(100%, 318px);
    gap: 7px;
    margin-top: 8px;
}

.bm-ai-product {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 9px;
    padding: 7px;
    border: 1px solid rgba(23, 23, 23, 0.07);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.66);
    color: inherit;
    text-decoration: none;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    transition: background 140ms ease, transform 140ms ease, box-shadow 140ms ease;
}

.bm-ai-product:hover {
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 7px 18px rgba(23, 23, 23, 0.07);
    transform: translateY(-1px);
}

.bm-ai-product-photo {
    display: grid;
    width: 56px;
    height: 56px;
    flex: 0 0 56px;
    place-items: center;
    overflow: hidden;
    border-radius: 10px;
    background: rgba(234, 233, 230, 0.65);
}

.bm-ai-product-photo > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.bm-ai-product-no-photo {
    font-size: 25px;
    opacity: 0.55;
}

.bm-ai-product-meta {
    display: flex;
    min-width: 0;
    flex: 1;
    flex-direction: column;
    gap: 2px;
}

.bm-ai-product-brand {
    overflow: hidden;
    color: #888781;
    font-size: 9.5px;
    font-weight: 650;
    letter-spacing: .04em;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.bm-ai-product-name {
    overflow: hidden;
    color: var(--bm-ai-ink);
    font-size: 12px;
    font-weight: 680;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bm-ai-product-price {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px;
    margin-top: 2px;
    font-size: 10px;
}

.bm-ai-product-price b {
    color: #c62828;
    font-size: 11px;
    font-weight: 720;
}

.bm-ai-product-price s {
    color: #999791;
}

.bm-ai-product-price-unavailable {
    color: #777670;
    font-size: 10px;
}

.bm-ai-product-action {
    align-self: flex-start;
    margin-top: 4px;
    color: #292929;
    font-size: 10.5px;
    font-weight: 750;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.bm-ai-footer {
    flex: 0 0 auto;
    padding: 10px 11px 9px;
    border-top: 1px solid var(--bm-ai-line);
    background: rgba(255, 255, 255, 0.5);
}

.bm-ai-composer {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    padding: 5px 5px 5px 11px;
    border: 1px solid rgba(23, 23, 23, 0.1);
    border-radius: 15px;
    background: rgba(255, 255, 255, 0.68);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    transition: background 140ms ease, box-shadow 140ms ease;
}

.bm-ai-composer:focus-within {
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 0 0 3px rgba(23, 23, 23, 0.055);
}

.bm-ai-input {
    width: 100%;
    min-height: 33px;
    max-height: 96px;
    resize: none;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--bm-ai-ink);
    font: inherit;
    font-size: 13px;
    line-height: 1.45;
    padding: 7px 0 5px;
}

.bm-ai-input::placeholder {
    color: #aaa8a1;
}

.bm-ai-send {
    display: grid;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 11px;
    background: rgba(23, 23, 23, 0.86);
    color: #fff;
    cursor: pointer;
    transition: opacity 140ms ease, transform 140ms ease, background 140ms ease;
}

.bm-ai-send:hover {
    background: rgba(23, 23, 23, 0.96);
    transform: translateY(-1px);
}

.bm-ai-send:disabled,
.bm-ai-input:disabled {
    cursor: wait;
    opacity: .55;
}

.bm-ai-send .bm-ai-icon {
    width: 17px;
    height: 17px;
}

.bm-ai-privacy {
    margin-top: 6px;
    color: #96958f;
    font-size: 9.5px;
    line-height: 1.35;
    text-align: center;
}

@supports not ((-webkit-backdrop-filter: blur(2px)) or (backdrop-filter: blur(2px))) {
    .bm-ai-panel { background: rgba(255, 255, 255, 0.97); }
    .bm-ai-header,
    .bm-ai-footer { background: #fff; }
    .bm-ai-launcher,
    .bm-ai-avatar,
    .bm-ai-send { background: #171717; }
}

@media (max-width: 640px) {
    .bm-ai-root {
        right: 12px;
        bottom: calc(13px + env(safe-area-inset-bottom, 0px) + var(--bm-ai-avoid-bottom));
    }

    .bm-ai-launcher {
        width: 52px;
        height: 52px;
        border-radius: 17px;
    }

    .bm-ai-panel {
        right: 0;
        bottom: 64px;
        width: calc(100vw - 24px);
        height: clamp(280px, 66dvh, 580px);
        max-height: calc(100vh - 96px - var(--bm-ai-avoid-bottom));
        max-height: calc(100dvh - 96px - var(--bm-ai-avoid-bottom));
        border-radius: 20px;
    }

    .bm-ai-body {
        padding: 15px 11px;
    }

    .bm-ai-message {
        max-width: 91%;
    }
}

@media (max-height: 650px) {
    .bm-ai-panel {
        height: auto;
        max-height: calc(100vh - 96px - var(--bm-ai-avoid-bottom));
        max-height: calc(100dvh - 96px - var(--bm-ai-avoid-bottom));
    }
}

@media (prefers-reduced-motion: reduce) {
    .bm-ai-root,
    .bm-ai-panel,
    .bm-ai-launcher,
    .bm-ai-product,
    .bm-ai-chip,
    .bm-ai-send,
    .bm-ai-typing span {
        animation: none !important;
        transition: none !important;
    }
}

/* BE MODE AI v2.6 - STICKY BAR ONLY
   Mobile: use the original bottom-right AI position. The JS variable below only
   increases when a WIDE bottom sticky/fixed shopping bar is actually visible.
   Scroll-to-top, WhatsApp and other small floating buttons are never moved. */
@media (min-width: 768px) {
    .bm-ai-root {
        right: 24px !important;
        bottom: 24px !important;
    }
}

/* BM_AI_V28_SCROLL_TOP_FOLLOWS_AI
   MOBILE ONLY. AI v2.7 is LOCKED and unchanged.
   Scroll-to-top sits 8px above the AI launcher and uses the exact same
   sticky-bar offset. When sticky bar appears both rise together; when it
   disappears both return to the original bottom-right stack. */
@media (max-width: 640px) {
    html .bm-scroll-top {
        right: 18px !important;
        bottom: calc(73px + env(safe-area-inset-bottom, 0px) + var(--bm-ai-arrow-follow-offset, 0px)) !important;
        transition: opacity .2s ease, transform .2s ease, background-color .2s ease, bottom 220ms ease, right 220ms ease !important;
    }
}

@media (min-width: 641px) and (max-width: 767px) {
    html .bm-scroll-top {
        right: 23px !important;
        bottom: calc(78px + env(safe-area-inset-bottom, 0px) + var(--bm-ai-arrow-follow-offset, 0px)) !important;
        transition: opacity .2s ease, transform .2s ease, background-color .2s ease, bottom 220ms ease, right 220ms ease !important;
    }
}

/* MAIRA V12 - WhatsApp handoff only when AI requests human support. */
.bm-ai-message-row.is-assistant > .bm-ai-handoff-wa {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    align-self: flex-start;
    max-width: 100%;
    min-height: 40px;
    margin-top: 7px;
    padding: 9px 13px;
    border: 1px solid rgba(23, 23, 23, 0.12);
    border-radius: 11px;
    background: #303030;
    color: #fff;
    text-decoration: none;
    font-family: inherit;
    font-size: 12px;
    font-weight: 650;
    line-height: 1.4;
    letter-spacing: 0;
    -webkit-tap-highlight-color: transparent;
    transition: background-color 140ms ease;
}
.bm-ai-message-row.is-assistant > .bm-ai-handoff-wa:hover {
    background: #171717;
    color: #fff;
}
.bm-ai-message-row.is-assistant > .bm-ai-handoff-wa:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 3px;
}
.bm-ai-handoff-wa-arrow {
    font-size: 15px;
    line-height: 1;
    font-weight: 400;
}

/* MAIRA V13: direct store CTA (no second widget or global styling). */
.bm-ai-message-row.is-assistant > .bm-ai-store-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
    max-width: 100%;
    min-height: 40px;
    margin-top: 7px;
    padding: 9px 14px;
    border-radius: 11px;
    border: 1px solid rgba(23, 23, 23, .12);
    background: #303030;
    color: #fff;
    text-decoration: none;
    font-family: inherit;
    font-size: 12px;
    font-weight: 650;
    line-height: 1.4;
    transition: background-color 140ms ease;
}
.bm-ai-message-row.is-assistant > .bm-ai-store-link:hover {
    background: #171717;
    color: #fff;
}
.bm-ai-message-row.is-assistant > .bm-ai-store-link:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 3px;
}

/* BM_MAIRA_LOCATION_V2R1: two direct actions in the existing message bubble. */
.bm-ai-root .bm-ai-location-message { width: min(100%, 320px); max-width: 100%; }
.bm-ai-root .bm-ai-location-title { font-weight: 650; letter-spacing: -.01em; }
.bm-ai-root .bm-ai-location-address { margin-top: 5px; color: #666660; font-size: 12px; line-height: 1.48; overflow-wrap: anywhere; }
.bm-ai-root .bm-ai-location-actions { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 7px; margin-top: 11px; }
.bm-ai-root .bm-ai-location-action { display:flex; align-items:center; justify-content:center; min-width:0; min-height:40px; padding:8px 5px; border:1px solid rgba(23,23,23,.19); border-radius:9px; background:rgba(255,255,255,.72); color:#262624; font-family:inherit; font-size:12px; font-weight:600; line-height:1.2; text-align:center; text-decoration:none; white-space:nowrap; }
.bm-ai-root .bm-ai-location-action.is-primary { background:#282826; border-color:#282826; color:white; }
.bm-ai-root .bm-ai-location-action:hover { background:#f3f3f2; }
.bm-ai-root .bm-ai-location-action.is-primary:hover { background:#171716; }
.bm-ai-root .bm-ai-location-action:focus-visible { outline:2px solid #484848; outline-offset:2px; }
@media(max-width:340px) { .bm-ai-root .bm-ai-location-actions { grid-template-columns:1fr; } }
/* BM_MAIRA_LOCATION_V2R1 END */

/* BM_MAIRA_WELCOME_V3 — modern, clean, one native panel. */
.bm-ai-root .bm-ai-launcher {
    width: 58px;
    height: 58px;
    padding: 2px;
    overflow: visible;
    border: 3px solid #fff;
    border-radius: 50%;
    background: #f7f3f1;
    box-shadow: 0 8px 22px rgba(0,0,0,.15);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
.bm-ai-root .bm-ai-launcher:hover { background: #f7f3f1; }
.bm-ai-root .bm-ai-launcher .bm-ai-portrait { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block; }
.bm-ai-root .bm-ai-launcher-dot { top: -3px; right: -3px; width: 13px; height: 13px; }
.bm-ai-root .bm-ai-avatar {
    width: 45px; height: 45px; flex-basis: 45px;
    overflow: hidden; border: 2px solid white; border-radius: 50%;
    background: #f7f3f1; box-shadow: 0 2px 10px rgba(0,0,0,.07);
    backdrop-filter: none; -webkit-backdrop-filter: none;
}
.bm-ai-root .bm-ai-avatar .bm-ai-portrait { width: 100%; height: 100%; display:block; object-fit: cover; border-radius: 50%; }
.bm-ai-root .bm-ai-panel {
    bottom: 68px;
    width: min(430px, calc(100vw - 24px));
    height: min(76dvh, 660px);
    max-height: calc(100dvh - 100px - var(--bm-ai-avoid-bottom));
    border: 1px solid #e9e9e8;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 18px 54px rgba(0,0,0,.14);
    backdrop-filter: none; -webkit-backdrop-filter: none;
}
.bm-ai-root .bm-ai-header { background:#fff; padding: 13px 15px; }
.bm-ai-root .bm-ai-body { background: #fff; padding: 16px 14px; }
.bm-ai-root .bm-ai-footer { background: #fff; }
.bm-ai-root .bm-ai-verified-link { color:#252525; text-decoration:underline; text-underline-offset:2px; overflow-wrap:anywhere; }
.bm-ai-root .bm-ai-verified-link:focus-visible { outline: 2px solid #555; outline-offset: 2px; }
.bm-ai-root .bm-ai-privacy { font-size: 10px; }
.bm-ai-root .bm-ai-welcome-v3 { padding: 0; }
.bm-ai-root .bm-ai-welcome-hero { display:flex; align-items:center; justify-content:space-between; min-width:0; gap:4px; padding:16px 1px 10px; }
.bm-ai-root .bm-ai-welcome-words { min-width:0; flex:1; padding:1px 0 0 2px; }
.bm-ai-root .bm-ai-welcome-title { margin:0; color:#1b1b1b; font-size:clamp(20px, 5.5vw, 25px); font-weight:730; line-height:1.14; letter-spacing:-.04em; }
.bm-ai-root .bm-ai-welcome-headline { display:block; margin:3px 0 8px; font-size:clamp(18px, 4.8vw, 23px); line-height:1.18; font-weight:720; letter-spacing:-.035em; }
.bm-ai-root .bm-ai-welcome-copy { margin:0; max-width:245px; color:#666; font-size:12px; line-height:1.48; }
.bm-ai-root .bm-ai-welcome-portrait { width: min(33%, 136px); max-width:136px; height:auto; flex:0 0 min(33%, 136px); aspect-ratio:1; border-radius:50%; object-fit:cover; background:#faf5f3; }
.bm-ai-root .bm-ai-welcome-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:14px; }
.bm-ai-root .bm-ai-welcome-action { display:flex; align-items:center; gap:8px; width:100%; min-width:0; min-height:62px; padding:8px 10px; border:1px solid #e9e9e8; border-radius:12px; background:#fff; color:#252525; text-align:left; font-family:inherit; cursor:pointer; transition:background .15s ease,border-color .15s ease; }
.bm-ai-root .bm-ai-welcome-action:hover { background:#fafaf9; border-color:#c9c9c6; }
.bm-ai-root .bm-ai-welcome-action:focus-visible { outline: 2px solid #555; outline-offset:2px; }
.bm-ai-root .bm-ai-welcome-choice-icon { display:grid; width:26px; height:26px; flex:0 0 26px; place-items:center; border-radius:50%; background:#f5f3f1; color:#242424; }
.bm-ai-root .bm-ai-welcome-choice-icon svg { display:block; width:16px; height:16px; }
.bm-ai-root .bm-ai-welcome-choice-copy { min-width:0; display:flex; flex:1; flex-direction:column; gap:2px; }
.bm-ai-root .bm-ai-welcome-choice-copy strong { color:#252525; font-size:11px; font-weight:690; line-height:1.26; overflow-wrap:break-word; }
.bm-ai-root .bm-ai-welcome-choice-copy small { color:#6e6e6e; font-size:10px; font-weight:400; line-height:1.27; }
.bm-ai-root .bm-ai-welcome-choice-arrow { flex:0 0 auto; color:#777; font-size:19px; line-height:1; }
.bm-ai-root .bm-ai-cs-direct { display:flex; margin-top:10px; padding:10px 12px; font-size:12px; }
.bm-ai-root .bm-ai-message { font-size:13px; }
@media (max-width: 640px) {
    .bm-ai-root .bm-ai-panel { right:0; bottom:68px; width:calc(100vw - 24px); height: min(77dvh, 640px); max-height:calc(100dvh - 100px - var(--bm-ai-avoid-bottom)); }
    .bm-ai-root .bm-ai-welcome-hero { padding-top:13px; }
}
@media (min-width: 351px) and (max-width: 640px) and (min-height: 760px) {
    .bm-ai-root .bm-ai-welcome-hero { padding-top:18px; padding-bottom:12px; }
    .bm-ai-root .bm-ai-welcome-actions { margin-top:16px; }
    .bm-ai-root .bm-ai-welcome-action { min-height:66px; }
    .bm-ai-root .bm-ai-welcome-choice-copy strong { font-size:12px; }
    .bm-ai-root .bm-ai-welcome-copy { font-size:12.5px; }
}
@media (max-width: 350px) {
    .bm-ai-root .bm-ai-welcome-hero { display:block; padding-top:10px; padding-bottom:4px; }
    .bm-ai-root .bm-ai-welcome-portrait { display:none; }
    .bm-ai-root .bm-ai-welcome-title { font-size:22px; white-space:nowrap; }
    .bm-ai-root .bm-ai-welcome-headline { font-size:20px; white-space:nowrap; }
    .bm-ai-root .bm-ai-welcome-copy { max-width:none; font-size:11.5px; line-height:1.35; }
    .bm-ai-root .bm-ai-welcome-actions { margin-top:11px; gap:7px; }
    .bm-ai-root .bm-ai-welcome-choice-icon { width:24px; height:24px; flex-basis:24px; }
    .bm-ai-root .bm-ai-welcome-choice-arrow { display:none; }
    .bm-ai-root .bm-ai-welcome-action { min-height:56px; padding:7px 8px; gap:6px; }
}
@media (max-height: 550px) {
    .bm-ai-root .bm-ai-panel { height:auto; max-height: calc(100dvh - 100px - var(--bm-ai-avoid-bottom)); }
    .bm-ai-root .bm-ai-welcome-portrait { width:82px; flex-basis:82px; }
}
@media (prefers-reduced-motion: reduce) {
    .bm-ai-root .bm-ai-welcome-action { transition:none; }
}
/* BM_MAIRA_WELCOME_V3 END */

/* Tombol mulai chat baru: aksi jelas, ringkas, serasi tema krem. */
.bm-ai-reset {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    margin: 2px auto 0;
    padding: 0 14px;
    border: 1px solid rgba(23, 23, 23, 0.10);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.6);
    color: #575753;
    font: inherit;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background 140ms ease, color 140ms ease;
}
.bm-ai-reset:hover { background: rgba(255, 255, 255, 0.95); color: var(--bm-ai-ink); }
.bm-ai-reset:focus-visible { outline: 3px solid #8c929b; outline-offset: 2px; }
.bm-ai-root .bm-ai-reset[hidden] { display: none; }
.bm-ai-root.is-busy .bm-ai-reset { opacity: 0.55; cursor: default; }