/* MoeinGift AI assistant: readable typography and safe rich-message links. */
.mg-ai-panel {
    width: min(430px, calc(100vw - 28px));
    height: min(690px, calc(100vh - 115px));
}

.mg-ai-head {
    min-height: 78px;
    gap: 11px;
}

.mg-ai-avatar {
    width: 48px;
    height: 48px;
    font-size: 14px;
}

.mg-ai-avatar span { font-size: 7px; }
.mg-ai-head strong { font-size: 14px; }
.mg-ai-head small { font-size: 10px; }
.mg-ai-head > button { width: 36px; height: 36px; }

.mg-ai-notice {
    padding: 8px 13px;
    color: #72520b;
    font-size: 10.5px;
}

.mg-ai-messages { padding: 16px 14px; }
.mg-ai-welcome { padding: 22px 18px; }
.mg-ai-welcome > span { width: 50px; height: 50px; font-size: 21px; }
.mg-ai-welcome strong { font-size: 15px; }
.mg-ai-welcome p { font-size: 12px; }

.mg-ai-message {
    max-width: 91%;
    margin-bottom: 14px;
}

.mg-ai-bubble {
    padding: 12px 14px;
    border-radius: 16px;
    font-size: 13px;
    line-height: 2.05;
}

.mg-ai-message.assistant .mg-ai-bubble p { margin: 0 0 10px; }
.mg-ai-message.assistant .mg-ai-bubble p:last-child { margin-bottom: 0; }
.mg-ai-message.assistant .mg-ai-bubble ul {
    margin: 8px 0 12px;
    padding: 0 19px 0 0;
}
.mg-ai-message.assistant .mg-ai-bubble li {
    margin: 5px 0;
    padding-right: 3px;
}
.mg-ai-message.assistant .mg-ai-bubble strong {
    color: #102f57;
    font-weight: 900;
}

.mg-ai-link,
.mg-ai-ticket {
    color: #075fc5;
    text-decoration: underline;
    text-decoration-thickness: 1.5px;
    text-underline-offset: 3px;
    font-weight: 850;
    cursor: pointer;
}

.mg-ai-link:hover,
.mg-ai-link:focus,
.mg-ai-ticket:hover,
.mg-ai-ticket:focus { color: #003f91; }

.mg-ai-time {
    margin-top: 4px;
    color: #768da8;
    font-size: 9px;
}

.mg-ai-suggestions { gap: 7px; padding: 8px 12px; }
.mg-ai-suggestions button { padding: 8px 11px; font-size: 10.5px; }
.mg-ai-actions { gap: 8px; padding-top: 8px; }
.mg-ai-actions button { font-size: 10.5px; }

.mg-ai-form {
    margin: 8px 12px 6px;
    padding: 8px 9px;
}

.mg-ai-form textarea {
    max-height: 100px;
    padding: 6px;
    color: #173759;
    font-size: 13px;
}

.mg-ai-form textarea::placeholder { color: #8498af; }
.mg-ai-form button {
    flex-basis: 40px;
    width: 40px;
    height: 40px;
    font-size: 16px;
}

.mg-ai-foot {
    padding-bottom: 9px;
    color: #7c8da2;
    font-size: 9.5px;
}

.mg-ai-error { font-size: 11.5px; }

@media (max-width: 600px) {
    .mg-ai-head { min-height: 74px; }
    .mg-ai-bubble { font-size: 14px; line-height: 2; }
    .mg-ai-form textarea { font-size: 14px; }
    .mg-ai-notice { font-size: 11px; }
    .mg-ai-actions button { font-size: 11px; }
    .mg-ai-foot { font-size: 10px; }
}