.workspace-chat {

    width:
        100%;

    box-sizing:
        border-box;

    margin:
        18px 0 4px;

    overflow:
        hidden;

    border:
        1px solid
        #dbc8ae;

    border-radius:
        20px;

    background:
        linear-gradient(
            145deg,
            #fffdf9,
            #f8eee1
        );

    box-shadow:
        0 12px 34px
        rgba(
            111,
            82,
            47,
            .09
        );

    text-align:
        left;
}


.workspace-chat-head {

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        16px;

    padding:
        17px 19px 15px;

    border-bottom:
        1px solid
        rgba(
            206,
            183,
            151,
            .72
        );

    background:
        rgba(
            255,
            250,
            242,
            .78
        );
}


.workspace-chat-title {

    color:
        #624d38;

    font-size:
        17px;

    font-weight:
        950;

    line-height:
        1.2;
}


.workspace-chat-subtitle {

    margin-top:
        4px;

    color:
        #9a846c;

    font-size:
        11px;

    font-weight:
        700;
}


.workspace-chat-presence {

    flex:
        0 0 auto;

    padding:
        6px 10px;

    border:
        1px solid
        #cfe0d0;

    border-radius:
        999px;

    background:
        #f1f9f1;

    color:
        #658468;

    font-size:
        11px;

    font-weight:
        900;

    white-space:
        nowrap;
}


.workspace-chat-messages {

    height:
        235px;

    overflow-y:
        auto;

    padding:
        12px 18px 14px;

    box-sizing:
        border-box;

    scroll-behavior:
        smooth;
}


.workspace-chat-empty {

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    min-height:
        190px;

    color:
        #a18c76;

    font-size:
        12px;

    text-align:
        center;
}


.workspace-chat-message {

    padding:
        9px 2px 10px;

    border-bottom:
        1px solid
        rgba(
            215,
            195,
            169,
            .46
        );
}


.workspace-chat-message:last-child {

    border-bottom:
        0;
}


.workspace-chat-message-meta {

    display:
        flex;

    align-items:
        center;

    gap:
        8px;

    margin-bottom:
        4px;
}


.workspace-chat-author {

    color:
        #705437;

    font-size:
        12px;

    font-weight:
        950;
}


.workspace-chat-author.role-warehouse {

    color:
        #58768a;
}


.workspace-chat-author.role-procurement {

    color:
        #96703c;
}


.workspace-chat-author.role-admin {

    color:
        #617d65;
}


.workspace-chat-time {

    color:
        #ae9b87;

    font-size:
        10px;

    font-weight:
        700;
}


.workspace-chat-text {

    color:
        #51453a;

    font-size:
        13px;

    line-height:
        1.42;

    white-space:
        pre-wrap;

    overflow-wrap:
        anywhere;
}


.workspace-chat-compose {

    display:
        grid;

    grid-template-columns:
        minmax(
            0,
            1fr
        )
        auto;

    gap:
        10px;

    padding:
        12px 14px 10px;

    border-top:
        1px solid
        rgba(
            206,
            183,
            151,
            .72
        );

    background:
        rgba(
            255,
            250,
            242,
            .76
        );
}


.workspace-chat-input {

    box-sizing:
        border-box;

    width:
        100%;

    min-height:
        42px;

    max-height:
        110px;

    resize:
        none;

    padding:
        11px 13px;

    border:
        1px solid
        #dac6aa;

    border-radius:
        13px;

    outline:
        none;

    background:
        #fff;

    color:
        #514438;

    font:
        inherit;

    font-size:
        13px;

    line-height:
        1.35;
}


.workspace-chat-input:focus {

    border-color:
        #b99a72;

    box-shadow:
        0 0 0 3px
        rgba(
            185,
            154,
            114,
            .13
        );
}


.workspace-chat-input:disabled {

    background:
        #f6f1e9;

    color:
        #aa9c8d;
}


.workspace-chat-send {

    align-self:
        stretch;

    min-width:
        112px;

    padding:
        0 17px;

    border:
        0;

    border-radius:
        13px;

    background:
        linear-gradient(
            145deg,
            #8f6c45,
            #705237
        );

    color:
        #fff;

    font-size:
        12px;

    font-weight:
        950;

    cursor:
        pointer;

    box-shadow:
        0 7px 18px
        rgba(
            101,
            72,
            42,
            .16
        );
}


.workspace-chat-send:hover:not(:disabled) {

    filter:
        brightness(1.06);
}


.workspace-chat-send:disabled {

    opacity:
        .46;

    cursor:
        default;

    box-shadow:
        none;
}


.workspace-chat-status {

    min-height:
        14px;

    padding:
        0 16px 12px;

    color:
        #9a8671;

    font-size:
        10px;

    font-weight:
        700;

    background:
        rgba(
            255,
            250,
            242,
            .76
        );
}


.workspace-chat-status.error {

    color:
        #a85e55;
}


@media (
    max-width: 620px
) {

    .workspace-chat-head {

        align-items:
            flex-start;
    }


    .workspace-chat-subtitle {

        max-width:
            210px;
    }


    .workspace-chat-messages {

        height:
            220px;
    }


    .workspace-chat-compose {

        grid-template-columns:
            minmax(
                0,
                1fr
            );
    }


    .workspace-chat-send {

        min-height:
            40px;
    }

}


/* ============================================================
   GLOBAL WORKSPACE CHAT — R0.5.8
   ============================================================ */

.global-chat-trigger {

    position:
        relative;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        6px;

    min-height:
        34px;

    padding:
        7px 11px;

    border:
        1px solid
        #d9c5aa;

    border-radius:
        999px;

    background:
        #fff8ed;

    color:
        #765b3e;

    font:
        inherit;

    font-size:
        12px;

    font-weight:
        900;

    line-height:
        1;

    cursor:
        pointer;

    white-space:
        nowrap;

    transition:
        transform .15s ease,
        border-color .15s ease,
        background .15s ease,
        box-shadow .15s ease;
}


.global-chat-trigger:hover {

    transform:
        translateY(-1px);

    border-color:
        #c3a37d;

    background:
        #fff3df;

    box-shadow:
        0 6px 18px
        rgba(
            111,
            82,
            47,
            .10
        );
}


.global-chat-trigger-icon {

    font-size:
        14px;
}


.global-chat-unread {

    min-width:
        17px;

    height:
        17px;

    box-sizing:
        border-box;

    padding:
        0 4px;

    border-radius:
        999px;

    background:
        #a74f49;

    color:
        #fff;

    font-size:
        9px;

    font-weight:
        950;

    line-height:
        17px;

    text-align:
        center;
}


.global-chat-unread[hidden] {

    display:
        none;
}


.global-chat-shell {

    position:
        fixed;

    inset:
        0;

    z-index:
        9000;

    pointer-events:
        none;
}


.global-chat-overlay {

    position:
        absolute;

    inset:
        0;

    width:
        100%;

    height:
        100%;

    padding:
        0;

    border:
        0;

    background:
        rgba(
            54,
            42,
            31,
            .22
        );

    opacity:
        0;

    cursor:
        default;

    pointer-events:
        none;

    transition:
        opacity .20s ease;
}


.global-chat-drawer {

    position:
        absolute;

    top:
        0;

    right:
        0;

    bottom:
        0;

    width:
        min(
            430px,
            94vw
        );

    box-sizing:
        border-box;

    background:
        #fffaf3;

    border-left:
        1px solid
        #d9c5aa;

    box-shadow:
        -16px 0 50px
        rgba(
            74,
            55,
            37,
            .18
        );

    transform:
        translateX(
            104%
        );

    transition:
        transform .22s ease;

    pointer-events:
        auto;

    overflow:
        hidden;
}


.global-chat-shell.is-open {

    pointer-events:
        auto;
}


.global-chat-shell.is-open
.global-chat-overlay {

    opacity:
        1;

    pointer-events:
        auto;
}


.global-chat-shell.is-open
.global-chat-drawer {

    transform:
        translateX(
            0
        );
}


.global-chat-close {

    position:
        absolute;

    top:
        13px;

    right:
        13px;

    z-index:
        4;

    width:
        32px;

    height:
        32px;

    padding:
        0;

    border:
        1px solid
        #dac7ae;

    border-radius:
        999px;

    background:
        rgba(
            255,
            253,
            249,
            .94
        );

    color:
        #80684f;

    font-size:
        23px;

    font-weight:
        500;

    line-height:
        27px;

    cursor:
        pointer;
}


.global-chat-close:hover {

    background:
        #fff;

    border-color:
        #bea17f;
}


.global-chat-drawer
.workspace-chat {

    display:
        flex;

    flex-direction:
        column;

    width:
        100%;

    height:
        100%;

    margin:
        0;

    border:
        0;

    border-radius:
        0;

    box-shadow:
        none;
}


.global-chat-drawer
.workspace-chat-head {

    flex:
        0 0 auto;

    padding-right:
        58px;
}


.global-chat-drawer
.workspace-chat-messages {

    flex:
        1 1 auto;

    height:
        auto;

    min-height:
        0;
}


.global-chat-drawer
.workspace-chat-compose {

    flex:
        0 0 auto;
}


.global-chat-drawer
.workspace-chat-status {

    flex:
        0 0 auto;
}


body.global-chat-open {

    overflow:
        hidden;
}


@media (
    max-width: 620px
) {

    .global-chat-trigger {

        padding:
            7px 9px;
    }


    .global-chat-drawer {

        width:
            100%;
    }


    .global-chat-overlay {

        display:
            none;
    }

}