/**
 * Ask OTT — chat styles (page + widget).
 * @copyright (c) 2026 Off The Traxx
 * @license GPL v2 or later
 */

.askott {
    max-width: 760px;
    margin: 0 auto;
}

.askott__head { margin-bottom: 1rem; }
.askott__title { margin: 0 0 .25rem; }
.askott__intro { margin: 0; opacity: .8; }

.askott__log {
    display: flex;
    flex-direction: column;
    gap: .6rem;
    min-height: 8rem;
    max-height: 60vh;
    overflow-y: auto;
    padding: 1rem;
    border: 1px solid rgba(127, 127, 127, .25);
    border-radius: .75rem;
    background: rgba(127, 127, 127, .05);
}

.askott__msg { display: flex; flex-direction: column; max-width: 88%; }
.askott__msg--user { align-self: flex-end; align-items: flex-end; }
.askott__msg--bot { align-self: flex-start; align-items: flex-start; }

.askott__bubble {
    padding: .6rem .85rem;
    border-radius: 1rem;
    line-height: 1.45;
    word-wrap: break-word;
    overflow-wrap: anywhere;
}
.askott__msg--user .askott__bubble {
    background: #6d28d9;
    color: #fff;
    border-bottom-right-radius: .25rem;
}
.askott__msg--bot .askott__bubble {
    background: #fff;
    color: #1f2937;
    border: 1px solid rgba(127, 127, 127, .25);
    border-bottom-left-radius: .25rem;
}

.askott__msg--thinking .askott__bubble {
    opacity: .65;
    font-style: italic;
}

.askott__sources {
    margin-top: .35rem;
    font-size: .8rem;
    display: flex;
    flex-wrap: wrap;
    gap: .35rem .6rem;
    align-items: baseline;
}
.askott__sources-label { opacity: .7; }
.askott__source { text-decoration: underline; }

.askott__form {
    display: flex;
    gap: .5rem;
    margin-top: .75rem;
    align-items: flex-end;
}
.askott__input {
    flex: 1 1 auto;
    resize: none;
    overflow-y: auto;
    box-sizing: border-box;
    min-height: 4.25rem; /* show the full (2-line) placeholder by default */
    max-height: 160px;
    padding: .6rem .75rem;
    border: 1px solid rgba(127, 127, 127, .4);
    border-radius: .6rem;
    font: inherit;
    line-height: 1.4;
}
.askott__send { white-space: nowrap; }

.askott__notice {
    margin-top: .6rem;
    font-size: .78rem;
    opacity: .65;
}

.askott__disabled {
    margin-top: .6rem;
    padding: .6rem .85rem;
    border-radius: .5rem;
    background: rgba(234, 179, 8, .15);
    border: 1px solid rgba(234, 179, 8, .4);
}

.askott__sr-only {
    position: absolute;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media (prefers-color-scheme: dark) {
    .askott__msg--bot .askott__bubble {
        background: #1f2430;
        color: #e5e7eb;
        border-color: rgba(255, 255, 255, .12);
    }
}