@media screen and (max-width: 768px) {
    #no-show-mobile {
        display: none;
    }

    .inbox-window {
        width: 80dvw;
        display: block;
    }

    #inbox-table {
        background-color: white;
        width: 100%;
        height: 90dvh;
        border-radius: 1.5dvw;
        box-shadow: 0 0 0.1dvh grey;
    }

    #inbox-name {
        font-size: medium;
    }

    #inbox-table h2 {
        border-bottom: 1px solid #b2b2b2;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 6dvh;
        width: 100%;
        margin-inline: auto;
        margin-top: 1vh;
        color: #ffffff;
        background-color: rgb(182,157,230);
        border-top-right-radius: 1.5dvw;
        border-top-left-radius: 1.5dvw;
    }

    #inbox-elements-container {
        width: 100%;
        height: 82dvh;
        overflow-x: hidden;
        overflow-y: scroll;
        border-bottom: 1px solid #b2b2b2;
        background-color: white;
    }

    .inbox-element {
        background-color: white;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        border-bottom: 1px solid lightgrey;
        transition: 0.1s;
        height: 6dvh;
    }

    .inbox-message-image {
        width: 4dvh;
        height: 4dvh;
        border-radius: 4dvh;
        margin-left: 3dvw;
    }

    .delete-chat-btn {
        height: 3vh;
        width: 3vh;
        border: none;
        background-color: transparent;
        border-radius: 3vw;
        margin-inline: 1vw;
        cursor: pointer;
        display: block;
        color: grey;
    }

    .plane-icon {
        width: 3dvh;
        margin-right: 3dvw;
    }


    /* chat opened */
    .chat-window-mobile {
        width: 90dvw;
        display: block;
    }

    #chat-container {
        height: fit-content;
        width: 100%;
        border-radius: 1.5dvw;
        box-shadow: 0 0 0.1dvh grey;
    }

    #chat-partner-info {
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        height: fit-content;
        margin-inline: auto;
        background-color: white;
        border-top-right-radius: 1.5dvw;
        border-top-left-radius: 1.5dvw;
        padding-block: 0.5vh;
        border-bottom: 1px solid lightgray;
    }

    #chat-partner-info-image {
        height: 5dvh;
        width: 5dvh;
        border-radius: 5dvh;
        display: inline-block;
        margin-left: 1dvw;
    }

    .chat-partner-profile-image {
        height: 4dvh;
        width: 4dvh;
        border-radius: 5dvh;
    }

    #report-icon {
        height: 2vh;
        width: 2dvh;
        border-radius: 2vh;
        margin-right: 3dvw;
    }

    .chat-room-message-in {
        width: fit-content;
        height: fit-content;
        padding: 0.5vh;
        margin-inline: 0.5vw;
        align-self: flex-start;
        display: flex;
        flex-direction: row;
        max-width: 85%;
    }

    .chat-room-message-in-body {
        background-color: rgb(255, 255, 255);
        margin-left: 2dvw;
        border-radius: 2dvw;
        box-shadow: 0 0.1vh 0.1vh 0.1vh darkgray;
        padding: 2dvw;
        border-bottom-left-radius: 0.1vh;
    }

    #chat-room-messages-container {
        font-size: medium;
    }

    .chat-room-message-out {
        width: fit-content;
        height: fit-content;
        padding: 2dvw;
        margin: 1dvw;
        margin-right: 3dvw;
        border-radius: 2dvw;
        border-bottom-right-radius: 0.1vh;
        align-self: flex-end;
        background-color: rgb(158, 187, 246);
        max-width: 45%;
        box-shadow: 0 0.1vw 0.2vh 0.1vh darkgray;
    }

    .msg-time {
        display: none;
    }

    .chat-room-message-out:hover .msg-time {
        display: block;
    }

    .chat-room-message-in:hover .msg-time {
        display: block;
    }

    #chat-room-message-input {
        max-width: 70%;
        height: 70%;
        border: none;
        padding-inline: 4dvw;
        border-radius: 10dvw;
        font-family: 'Lato', sans-serif;
        background-color: #e8e8e8;
        flex-grow: 1;
        font-size: large;
    }

    #chat-room-message-input:focus {
        outline: none;
    }

    #chat-room-input-form {
        background-color: white;
        width: 100%;
        height: 8vh;
        margin-inline: auto;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        border-bottom-right-radius: 1.5dvw;
        border-bottom-left-radius: 1.5dvw;
        margin-bottom: 10vh;
    }

    #chat-close-btn {
        float: right;
        margin-right: 1dvw;
        font-size: medium;
        display: block;
        padding-inline: 3dvw;
    }

    .user-state-dot {
        display: inline-block;
        width: 0.7dvh;
        height: 0.7dvh;
        border-radius: 1dvw;
    }

    .chatroom-dot {
        margin-left: 3dvw;
    }

    #assistant-mobile {
        display: block;
    }
}