/* Chat styles - matching old Chat.aspx design */

/* Restore FontAwesome inside chat (JLViews * overrides font-family to Arial) */
.discussion-message .fa,
.discussion-list .fa,
#newMessageButton .fa,
#chatPanelContainer .fa {
    font-family: 'FontAwesome' !important;
}

.discussion-list {
    background: #d9d9d9;
    overflow-y: auto;
    padding: 10px;
}

.discussion-message {
    background: #fff;
    border-top: 2px solid #91949b;
    padding: 8px 10px;
}

/* Message bubbles */
.message-chat {
    margin-bottom: 2px;
    overflow: auto;
}

.message-chat .message-chat-text {
    border-radius: 10px;
    padding: 10px;
    display: inline-block;
    max-width: 75%;
    word-wrap: break-word;
    font-size: 14px;
    overflow-wrap: break-word;
}

.message-chat .message-chat-meta {
    font-size: 11px;
    color: #999;
    margin-top: 2px;
    clear: both;
    word-break: break-all;
    overflow-wrap: break-word;
}

.message-chat .message-chat-meta .fa-check {
    color: #4CAF50;
    margin-left: 4px;
}

/* Right-aligned (self messages) */
.message-chat-right {
    text-align: right;
}

.message-chat-right .message-chat-text,
.message-chat-right .message-chat-text span {
    background: #666e7b;
    color: #fff !important;
    float: right;
    margin-right: 5px;
}

.message-chat-right .message-chat-meta {
    text-align: right;
}

/* Left-aligned (other messages) */
.message-chat-left {
    text-align: left;
}

.message-chat-left .message-chat-text {
    background: #fff;
    color: #666e7b;
    float: left;
    margin-left: 5px;
}

.message-chat-left .message-chat-meta {
    text-align: left;
}

/* Bottom message input bar */
.d-message {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    width: 100%;
}

.d-message .message-block {
    display: flex;
    align-items: center;
    flex: 1;
    padding: 0;
    margin: 0;
}

.d-message .message-block i {
    cursor: pointer;
    font-size: 16px;
    color: #666;
    padding: 0 4px;
    flex-shrink: 0;
}

.d-message .message-block i:hover {
    color: #333;
}

.d-message .message-block input[type="text"] {
    flex: 1;
    border: none;
    outline: none;
    /* Default 22px, gönderilen mesaj font'uyla (chatFontSize / _clientChatFontSize
       JS default'larıyla) hizalı. SetFontPlus/SetFontMin inline style ile bunu
       override eder. Mobile portrait CSS bloğu (styleFrame2.css) 16px'e indirir
       (iOS auto-zoom önlemi); o blokta +/- butonları zaten gizli. */
    font-size: 22px;
    padding: 8px 12px;
    background: transparent;
}

.d-message .send-msg {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    cursor: pointer;
    font-size: 22px;
    color: #474F5C;
    list-style: none;
}

.d-message .send-msg:hover {
    color: #10CFBD;
}

.d-message > a {
    text-decoration: none;
    color: inherit;
    display: flex;
    align-items: center;
}

.d-message > a:first-child {
    flex: 1;
    min-width: 0;
}

.d-message > a:last-child {
    flex-shrink: 0;
}

/* Emoji picker inline */
.emoji-picker-inline {
    position: absolute;
    line-height: 40px;
    bottom: 50px;
    border: 1px solid gray;
    background-color: #fff;
    display: none;
    z-index: 100;
    padding: 4px;
}

.emoji-picker-inline span {
    cursor: pointer;
    /* v2.17.27 — 20 → 22; v2.17.28 — 22 → 25; v2.17.32 — 25 → 28 (~%10 ek). */
    font-size: 28px;
    padding: 2px;
}

/* v2.17.27 — 20 → 22; v2.17.28 — emojiToggle 22 → 25;
   v2.17.32 — emojiToggle 25 → 28 (input 22'de kaldi).
   v2.17.33 — Input 22 → 28: emoji secildikten sonra input icindeki sembol
   picker'daki ile ayni boyutta gorulur. Emoji toggle ile parite.
   v2.19.1 — !important KALDIRILDI: AdvisoryScreen.cshtml updateChatFontSize()
   inp.style.fontSize ile input'u mesajlarla birlikte +/- ile scale ediyordu
   ama !important inline style'i eziyordu → input olduğu yerde donuyordu.
   Default 28px korunur (ID selector zaten .d-message .message-block
   input[type=text]'in 22'sini yener); JS inline style artık scale eder. */
#inpMessages {
    font-size: 28px;
}

#emojiToggle {
    font-size: 28px !important;
}

/* Font size classes */
.f20 {
    font-size: 20px;
}