/* Floating assistant chat panel.
 * Honours light/dark themes via Bootstrap CSS variables and is RTL-safe
 * by using inset-* logical properties.
 */
#chronos-agent-fab {
    position: fixed;
    inset-block-end: 1.25rem;
    inset-inline-end: 1.25rem;
    width: 3.25rem;
    height: 3.25rem;
    z-index: 1100;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    pointer-events: auto;
}

.chronos-agent-panel {
    position: fixed;
    inset-block-end: 5rem;
    inset-inline-end: 1.25rem;
    width: min(380px, calc(100vw - 2.5rem));
    height: min(600px, calc(100vh - 7rem));
    z-index: 1100;
    pointer-events: auto;
    display: flex;
    flex-direction: column;
    background: var(--bs-body-bg, #fff);
    color: var(--bs-body-color, #212529);
    border: 1px solid var(--bs-border-color, rgba(0,0,0,.15));
    border-radius: .75rem;
    box-shadow: 0 1rem 3rem rgba(0,0,0,.2);
    overflow: hidden;
}
.chronos-agent-panel[hidden] { display: none; }

/* Expanded mode — a larger working area for complex sessions. Toggled from
 * the header button; preference persisted in localStorage. */
.chronos-agent-panel--expanded {
    width: min(720px, calc(100vw - 2.5rem));
    height: min(85vh, calc(100vh - 7rem));
}

.chronos-agent-panel__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .75rem 1rem;
    border-bottom: 1px solid var(--bs-border-color, rgba(0,0,0,.1));
    background: var(--bs-tertiary-bg, #f8f9fa);
}
.chronos-agent-panel__title { font-weight: 600; margin-inline-end: auto; }
.chronos-agent-panel__header-actions {
    display: flex;
    align-items: center;
    gap: .25rem;
}

.chronos-agent-panel__messages {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: .75rem 1rem;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    font-size: .9rem;
    line-height: 1.4;
}

.chronos-agent-msg {
    max-width: 85%;
    padding: .5rem .75rem;
    border-radius: .75rem;
    word-wrap: break-word;
}
.chronos-agent-msg--user {
    align-self: flex-end;
    background: var(--bs-primary, #0d6efd);
    color: #fff;
}
.chronos-agent-msg--assistant {
    align-self: flex-start;
    background: var(--bs-tertiary-bg, #f1f3f5);
}
.chronos-agent-msg--tool {
    align-self: flex-start;
    background: transparent;
    color: var(--bs-secondary-color, #6c757d);
    font-size: .8rem;
    font-style: italic;
}
.chronos-agent-msg--error {
    align-self: stretch;
    background: var(--bs-danger-bg-subtle, #f8d7da);
    color: var(--bs-danger-text-emphasis, #842029);
}

.chronos-agent-proposal {
    align-self: stretch;
    border: 1px solid var(--bs-border-color, rgba(0,0,0,.15));
    border-radius: .5rem;
    background: var(--bs-body-bg, #fff);
    padding: .75rem;
}
.chronos-agent-proposal__summary { font-weight: 600; margin-bottom: .5rem; }
.chronos-agent-proposal__fields { font-size: .8rem; color: var(--bs-secondary-color, #6c757d); margin-bottom: .5rem; }
.chronos-agent-proposal__fields dl { display: grid; grid-template-columns: max-content 1fr; gap: .15rem .5rem; margin: 0; }
.chronos-agent-proposal__fields dt { font-weight: 500; }
.chronos-agent-proposal__fields dd { margin: 0; word-break: break-word; }
.chronos-agent-proposal__actions { display: flex; gap: .5rem; justify-content: flex-end; }

/* Gap-fill form card (request_person_input). */
.chronos-agent-form__row { display: flex; flex-direction: column; gap: .15rem; margin-bottom: .5rem; }
.chronos-agent-form__label { font-size: .8rem; font-weight: 500; color: var(--bs-secondary-color, #6c757d); }
.chronos-agent-form__error {
    font-size: .8rem;
    color: var(--bs-danger-text-emphasis, #842029);
    background: var(--bs-danger-bg-subtle, #f8d7da);
    border-radius: .375rem;
    padding: .35rem .5rem;
    margin-bottom: .5rem;
}

.chronos-agent-panel__form {
    display: flex;
    gap: .5rem;
    padding: .5rem .75rem;
    border-top: 1px solid var(--bs-border-color, rgba(0,0,0,.1));
    background: var(--bs-tertiary-bg, #f8f9fa);
}
.chronos-agent-panel__form textarea {
    flex: 1;
    resize: none;
}
.chronos-agent-panel__form button {
    align-self: flex-end;
}
/* The + attach button sits to the leading edge of the input, matched in
 * height to the send button. */
#chronos-agent-attach {
    flex: 0 0 auto;
}

/* User bubble variant for an uploaded file — a paperclip + filename chip. */
.chronos-agent-attachment {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    font-size: .85rem;
    opacity: .95;
}
.chronos-agent-attachment i { font-size: .8rem; }

[dir="rtl"] .chronos-agent-msg--user { align-self: flex-start; }
[dir="rtl"] .chronos-agent-msg--assistant { align-self: flex-end; }
