/*
|--------------------------------------------------------------------------
| Dosya Adı           : ai-assistant-v8-77.css
| Oluşturulma Tarihi  : 25.07.2026
| Değişiklik Tarihi   : 25.07.2026
| Yaratan             : Özgür Elibol
| Dokümanın Amacı     : Sol alt Creative AI mesaj kutusu tasarımı.
|--------------------------------------------------------------------------
*/

.caa-ai-launcher-v877 {
    position: fixed;
    z-index: 99000;
    left: 20px;
    bottom: 20px;
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: 58px;
    padding: 8px 15px 8px 8px;
    color: #fff;
    background: #121827;
    border: 0;
    border-radius: 18px;
    box-shadow: 0 16px 45px rgba(15, 23, 42, .28);
    cursor: pointer;
}

.caa-ai-launcher-icon-v877,
.caa-ai-avatar-v877 {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 42px;
    height: 42px;
    color: #fff;
    background: #ed1c3b;
    border-radius: 13px;
    font-size: 14px;
    font-weight: 900;
}

.caa-ai-launcher-v877 > span:last-child {
    display: grid;
    gap: 2px;
    text-align: left;
}

.caa-ai-launcher-v877 strong {
    font-size: 14px;
}

.caa-ai-launcher-v877 small {
    color: rgba(255, 255, 255, .72);
    font-size: 11px;
}

.caa-ai-panel-v877 {
    position: fixed;
    z-index: 99001;
    left: 20px;
    bottom: 20px;
    display: grid;
    grid-template-rows: auto minmax(170px, 1fr) auto auto auto;
    width: min(390px, calc(100vw - 32px));
    height: min(610px, calc(100vh - 40px));
    overflow: hidden;
    color: #172033;
    background: #fff;
    border: 1px solid #dfe5ee;
    border-radius: 22px;
    box-shadow: 0 28px 85px rgba(10, 15, 28, .3);
}

.caa-ai-panel-v877[hidden] {
    display: none !important;
}

.caa-ai-panel-v877 > header {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 15px;
    color: #fff;
    background: #121827;
}

.caa-ai-panel-v877 > header > div {
    display: grid;
    gap: 3px;
    flex: 1;
}

.caa-ai-panel-v877 > header small {
    display: flex;
    align-items: center;
    gap: 6px;
    color: rgba(255, 255, 255, .74);
}

.caa-ai-panel-v877 > header small i {
    width: 8px;
    height: 8px;
    background: #32d583;
    border-radius: 50%;
}

.caa-ai-panel-v877 > header button {
    width: 38px;
    height: 38px;
    color: #fff;
    background: rgba(255, 255, 255, .1);
    border: 0;
    border-radius: 50%;
    font-size: 24px;
    cursor: pointer;
}

.caa-ai-messages-v877 {
    display: flex;
    flex-direction: column;
    gap: 10px;
    overflow-y: auto;
    padding: 16px;
    background: #f6f8fc;
}

.caa-ai-messages-v877 article {
    max-width: 84%;
    padding: 11px 13px;
    border-radius: 15px;
    font-size: 14px;
    line-height: 1.48;
    overflow-wrap: anywhere;
}

.caa-ai-messages-v877 article.is-assistant {
    align-self: flex-start;
    background: #fff;
    border: 1px solid #dfe5ee;
    border-bottom-left-radius: 4px;
}

.caa-ai-messages-v877 article.is-visitor {
    align-self: flex-end;
    color: #fff;
    background: #121827;
    border-bottom-right-radius: 4px;
}

.caa-ai-messages-v877 article.is-loading {
    color: #667085;
    font-style: italic;
}

.caa-ai-messages-v877 a {
    display: inline-flex;
    margin-top: 9px;
    padding: 8px 11px;
    color: #fff;
    background: #ed1c3b;
    border-radius: 9px;
    text-decoration: none;
    font-weight: 800;
}

.caa-ai-quick-v877 {
    display: flex;
    gap: 7px;
    overflow-x: auto;
    padding: 10px 12px;
    background: #fff;
    border-top: 1px solid #e7ebf2;
}

.caa-ai-quick-v877 button {
    flex: 0 0 auto;
    padding: 8px 10px;
    color: #344054;
    background: #f6f8fc;
    border: 1px solid #dfe5ee;
    border-radius: 999px;
    font-size: 12px;
    cursor: pointer;
}

.caa-ai-form-v877 {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    padding: 11px;
    background: #fff;
    border-top: 1px solid #e7ebf2;
}

.caa-ai-form-v877 textarea {
    min-height: 46px;
    max-height: 105px;
    resize: none;
    padding: 11px 12px;
    color: #172033;
    background: #f6f8fc;
    border: 1px solid #dfe5ee;
    border-radius: 12px;
    font: inherit;
}

.caa-ai-form-v877 button {
    width: 46px;
    height: 46px;
    align-self: end;
    color: #fff;
    background: #ed1c3b;
    border: 0;
    border-radius: 12px;
    font-size: 20px;
    cursor: pointer;
}

.caa-ai-panel-v877 > footer {
    padding: 8px 12px;
    color: #667085;
    background: #fff;
    border-top: 1px solid #eef1f5;
    text-align: center;
    font-size: 10px;
}

.caa-ai-panel-v877 > footer a {
    color: #ed1c3b;
}

@media (max-width: 600px) {
    .caa-ai-launcher-v877 {
        left: 12px;
        bottom: 12px;
    }

    .caa-ai-panel-v877 {
        inset: auto 0 0 0;
        width: 100%;
        height: min(76vh, 650px);
        border-radius: 22px 22px 0 0;
    }
}


/* v8.77.2 - Yönetilebilir sağ/sol konum */
.caa-ai-launcher-v877.is-right-v877,
.caa-ai-panel-v877.is-right-v877 {
    right: 20px;
    left: auto;
}

.caa-ai-launcher-v877.is-left-v877,
.caa-ai-panel-v877.is-left-v877 {
    right: auto;
    left: 20px;
}

@media (max-width: 600px) {
    .caa-ai-launcher-v877.is-right-v877 {
        right: 12px;
        left: auto;
    }

    .caa-ai-launcher-v877.is-left-v877 {
        right: auto;
        left: 12px;
    }

    .caa-ai-panel-v877.is-right-v877,
    .caa-ai-panel-v877.is-left-v877 {
        inset: auto 0 0 0;
    }
}


/* v8.77.3 - Yumuşak açılış ve kapanış animasyonu */
.caa-ai-launcher-v877 {
    opacity: 1;
    transform: translateY(0) scale(1);
    transition:
        opacity .38s ease,
        transform .38s cubic-bezier(.22, .8, .32, 1);
}

.caa-ai-launcher-v877.is-hiding-v8773 {
    opacity: 0;
    pointer-events: none;
    transform: translateY(12px) scale(.96);
}

.caa-ai-panel-v877 {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(28px) scale(.96);
    transform-origin: bottom center;
    transition:
        opacity .48s ease,
        transform .56s cubic-bezier(.22, .8, .32, 1),
        visibility 0s linear .56s;
}

.caa-ai-panel-v877.is-opening-v8773,
.caa-ai-panel-v877.is-open-v8773 {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0) scale(1);
    transition:
        opacity .48s ease,
        transform .56s cubic-bezier(.22, .8, .32, 1),
        visibility 0s linear 0s;
}

.caa-ai-panel-v877.is-closing-v8773 {
    opacity: 0;
    visibility: visible;
    pointer-events: none;
    transform: translateY(24px) scale(.97);
}

@media (prefers-reduced-motion: reduce) {
    .caa-ai-launcher-v877,
    .caa-ai-panel-v877 {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }
}