/* ── Ask Disha — site-wide AI assistant widget ─────────────────────────────
   Separate from the lead-capture widget (chat-widget.css). Both can be open;
   Disha sits above the existing button so nothing overlaps by default. */

.disha-fab {
    position: fixed;
    right: 24px;
    bottom: 92px;
    z-index: 1060;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: linear-gradient(135deg, var(--navy, #0b1f3a), var(--navy2, #17375f));
    box-shadow: 0 10px 26px rgba(7, 27, 58, .32);
    transition: transform .18s ease, box-shadow .18s ease;
}

.disha-fab:hover { transform: translateY(-2px) scale(1.04); box-shadow: 0 14px 32px rgba(7, 27, 58, .4); }
.disha-fab:active { transform: scale(.96); }
.disha-fab svg { width: 26px; height: 26px; }

.disha-fab .disha-fab-dot {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: #3ecf8e;
    border: 2px solid #fff;
}

.disha-panel {
    position: fixed;
    right: 24px;
    bottom: 160px;
    z-index: 1059;
    width: 384px;
    max-width: calc(100vw - 32px);
    height: min(560px, calc(100vh - 200px));
    display: none;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--line, #e6e8ee);
    border-radius: 20px;
    box-shadow: 0 24px 60px rgba(7, 27, 58, .22);
    overflow: hidden;
    font-family: "Inter", system-ui, -apple-system, sans-serif;
}

.disha-panel.is-open { display: flex; animation: dishaUp .22s ease; }

@keyframes dishaUp {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: translateY(0); }
}

.disha-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    color: #fff;
    background: linear-gradient(135deg, var(--navy, #0b1f3a), var(--navy2, #17375f));
}

.disha-head-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--gold, #d99a25), var(--gold2, #f0b445));
    color: #fff;
    flex: 0 0 auto;
}

.disha-head-avatar svg { width: 19px; height: 19px; }

.disha-head-text { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.disha-head-text strong { font-size: 14px; font-weight: 700; }
.disha-head-text small { font-size: 11.5px; opacity: .82; }

.disha-head-close {
    margin-left: auto;
    background: transparent;
    border: none;
    color: #fff;
    opacity: .8;
    cursor: pointer;
    font-size: 20px;
    line-height: 1;
    padding: 4px 6px;
}

.disha-head-close:hover { opacity: 1; }

.disha-body {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
    background: #f7f8fb;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.disha-msg {
    max-width: 88%;
    padding: 10px 13px;
    border-radius: 14px;
    font-size: 13.5px;
    line-height: 1.5;
    word-wrap: break-word;
    overflow-wrap: anywhere;
}

.disha-msg.bot {
    align-self: flex-start;
    background: #fff;
    color: #23293a;
    border: 1px solid var(--line, #e6e8ee);
    border-bottom-left-radius: 4px;
}

.disha-msg.user {
    align-self: flex-end;
    background: var(--navy, #0b1f3a);
    color: #fff;
    border-bottom-right-radius: 4px;
}

.disha-msg.error {
    align-self: flex-start;
    background: #fff6f6;
    color: #8a2b2b;
    border: 1px solid #f4c9c9;
}

.disha-msg p { margin: 0 0 8px; }
.disha-msg p:last-child { margin-bottom: 0; }
.disha-msg ul { margin: 6px 0; padding-left: 18px; }
.disha-msg li { margin: 2px 0; }
.disha-msg a { color: #1d5fb0; text-decoration: underline; }
.disha-msg.bot a { color: #1d5fb0; }
.disha-msg strong { font-weight: 700; }

.disha-typing {
    align-self: flex-start;
    display: inline-flex;
    gap: 4px;
    padding: 12px 14px;
    background: #fff;
    border: 1px solid var(--line, #e6e8ee);
    border-radius: 14px;
    border-bottom-left-radius: 4px;
}

.disha-typing span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #b9c0d0;
    animation: dishaBlink 1.2s infinite ease-in-out;
}

.disha-typing span:nth-child(2) { animation-delay: .16s; }
.disha-typing span:nth-child(3) { animation-delay: .32s; }

@keyframes dishaBlink {
    0%, 80%, 100% { opacity: .25; transform: translateY(0); }
    40% { opacity: 1; transform: translateY(-2px); }
}

.disha-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 0 16px 10px;
    background: #f7f8fb;
}

.disha-chip {
    border: 1px solid #d9dded;
    background: #fff;
    color: #33405c;
    border-radius: 999px;
    padding: 6px 11px;
    font-size: 11.5px;
    cursor: pointer;
    transition: background .15s, border-color .15s;
}

.disha-chip:hover { background: #eef2fb; border-color: #b9c6e4; }

.disha-form {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    padding: 10px 12px;
    border-top: 1px solid var(--line, #e6e8ee);
    background: #fff;
}

.disha-input {
    flex: 1;
    resize: none;
    border: 1px solid #d9dded;
    border-radius: 12px;
    padding: 9px 11px;
    font-size: 13.5px;
    font-family: inherit;
    line-height: 1.35;
    min-height: 40px;
    max-height: 96px;
    outline: none;
    color: #23293a;
    background: #fff;
}

.disha-input:focus { border-color: #9db2dd; box-shadow: 0 0 0 3px rgba(29, 95, 176, .08); }

.disha-send {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: linear-gradient(135deg, var(--gold, #d99a25), var(--gold2, #f0b445));
    flex: 0 0 auto;
}

.disha-send:disabled { opacity: .45; cursor: not-allowed; }
.disha-send svg { width: 17px; height: 17px; }

.disha-foot {
    padding: 6px 12px 8px;
    font-size: 10.5px;
    color: #8b93a7;
    text-align: center;
    background: #fff;
}

.disha-foot a { color: #6d7998; text-decoration: underline; }

@media (max-width: 480px) {
    .disha-panel {
        right: 10px;
        left: 10px;
        width: auto;
        max-width: none;
        bottom: calc(148px + env(safe-area-inset-bottom, 0px));
        height: calc(100vh - 190px);          /* fallback for older mobile browsers */
        height: calc(100dvh - 190px);         /* ignores the collapsing URL bar */
        max-height: 640px;
        border-radius: 18px;
    }
    .disha-fab {
        right: 16px;
        bottom: calc(86px + env(safe-area-inset-bottom, 0px));
    }
    /* 16px stops iOS Safari from zooming into the field on focus. */
    .disha-input { font-size: 16px; min-height: 44px; }
    .disha-msg { font-size: 14px; max-width: 92%; }
    .disha-chip { font-size: 12px; padding: 7px 12px; }
    /* One scrollable strip instead of 4 stacked rows — saves ~120px of height. */
    .disha-chips {
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding: 0 14px 10px;
    }
    .disha-chips::-webkit-scrollbar { display: none; }
    .disha-chip { flex: 0 0 auto; white-space: nowrap; }
    .disha-head { padding: 12px 14px; }
    .disha-body { padding: 14px; }
    .disha-form { padding: 8px 10px calc(8px + env(safe-area-inset-bottom, 0px)); }
    .disha-foot { display: none; }             /* keep vertical space for messages */
}

/* Landscape phones: near-fullscreen panel so it never overflows the top. */
@media (max-height: 520px) {
    .disha-panel {
        top: 8px;
        bottom: 8px;
        right: 8px;
        left: auto;
        width: min(380px, calc(100vw - 16px));
        height: auto;
        max-height: none;
        border-radius: 16px;
    }
    /* The panel covers the FAB area here, so hide the launcher while open. */
    #dishaBtn[aria-expanded="true"] { display: none; }
    .disha-chips { display: none; }
    .disha-head { padding: 8px 12px; }
    .disha-head-avatar { width: 32px; height: 32px; font-size: 14px; }
    .disha-body { padding: 10px 10px 6px; }
    .disha-input { min-height: 36px; padding: 6px 10px; }
    .disha-form { padding: 6px 8px; }
}