/* Ask DotLeads copilot panel (PRD module 14).
   The slide-over shell, bubbles, chips and composer all come from the shared .dl-ask-*
   block in dotleads.css. This file only adds what the copilot needs on top of it, with
   the dl-cp- prefix so nothing here can collide with the design system. */

/* ---------- panel chrome ---------- */

/* The shared block styles the assistant bubble under .zeo; the copilot uses .bot. */
.dl-ask-msg.bot .dl-ask-bubble { border-bottom-left-radius: 5px; }

/* .dl-ask-fab sets display, which would otherwise beat the browser's [hidden] rule
   when copilot.js hides the button on a page with no signed-in session. */
.dl-ask-fab[hidden] { display: none; }

/* Suggested chips sit directly above the composer, so they get their own hairline. */
.dl-cp-suggest {
    border-top: 1px solid var(--hairline);
    padding-top: 12px;
    margin-top: 2px;
    max-height: 132px;
    overflow-y: auto;
}

.dl-cp-suggest .dl-ask-chip[disabled] {
    opacity: .45;
    cursor: not-allowed;
}

.dl-cp-suggest .dl-ask-chip[disabled]:hover {
    border-color: var(--hairline-strong);
    color: var(--text-soft);
    transform: none;
}

.dl-cp-hint {
    width: 100%;
    margin: 0 0 2px;
    font-size: .74rem;
    color: var(--text-faint);
}

/* ---------- conversation ---------- */

.dl-cp-intro {
    text-align: center;
    padding: 26px 12px;
    color: var(--text-muted);
}

.dl-cp-intro i {
    display: block;
    font-size: 2rem;
    color: var(--emerald);
    margin-bottom: 10px;
}

.dl-cp-intro .head {
    font-family: var(--nav-font);
    font-weight: 600;
    color: var(--text-strong);
    font-size: .98rem;
    margin-bottom: 4px;
}

.dl-cp-intro p {
    font-size: .84rem;
    margin: 0;
}

/* Answers arrive as plain text with dash bullets, so newlines carry the layout. */
.dl-cp-answer {
    white-space: pre-wrap;
    word-break: break-word;
}

.dl-cp-turn {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
    max-width: 80%;
}

.dl-cp-turn .dl-ask-bubble { max-width: 100%; }

.dl-cp-tools {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-left: 4px;
}

.dl-cp-copy {
    border: 0;
    background: none;
    padding: 0;
    font: inherit;
    font-size: .74rem;
    color: var(--text-faint);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: color .15s ease;
}

.dl-cp-copy:hover { color: var(--emerald); }

.dl-cp-source {
    font-size: .72rem;
    color: var(--text-faint);
}

.dl-cp-error .dl-ask-bubble {
    border-color: rgba(239, 68, 68, .45);
    color: var(--status-bad-text);
}

/* ---------- composer ---------- */

.dl-cp-sending {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, .45);
    border-top-color: #fff;
    border-radius: 50%;
    animation: dl-spin .8s linear infinite;
}

.dl-cp-tip {
    padding: 0 16px 12px;
    margin: 0;
    font-size: .72rem;
    color: var(--text-faint);
}

@media (prefers-reduced-motion: reduce) {
    .dl-cp-sending { animation-duration: 2.4s; }
}
