/* =========================================================
   CHAT WINDOW — LAYOUT + CONTAINER
   ========================================================= */

.chat-window-wrapper .chat-window .chat-layout {
    padding: 0;
}

.chat-window-wrapper .chat-window {
    border: none !important;
    border-radius: 0 !important;
    box-shadow:
        rgba(50, 50, 93, 0.25) 0px 50px 100px -20px,
        rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
}


/* =========================================================
   CHAT WINDOW — HEADER
   ========================================================= */

.chat-layout .chat-header {
    gap: 0 !important;
    background-color: var(--wp--preset--color--carnelian) !important;
}


/* =========================================================
   CHAT WINDOW — MESSAGES
   ========================================================= */

.chat-message + .chat-message {
    margin-top: 0.4em !important;
}


/* =========================================================
   CHAT WINDOW — INPUT BAR + SEND BUTTON
   ========================================================= */

.chat-inputs {
    background-color: #ffffff;
}

.chat-input-send-button:not([disabled]) svg path {
    fill: var(--wp--preset--color--carnelian) !important;
}


/* =========================================================
   CHAT WINDOW — TOGGLE BUTTON (OPEN/CLOSE)
   ========================================================= */

.chat-window-wrapper .chat-window-toggle {
    --chat--toggle--background: var(--wp--preset--color--carnelian);
}

.chat-window-wrapper .chat-window-toggle:hover,
.chat-window-wrapper .chat-window-toggle:focus {
    --chat--toggle--background: var(--wp--preset--color--secondary-red-dark) !important;
}

/* When toggle is NOT hovered and the icon is the "collapse" arrow */
.chat-window-wrapper .chat-window-toggle:not(:hover):has(path[d="M7.41 8.58L12 13.17l4.59-4.59L18 10l-6 6l-6-6z"]) {
    --chat--toggle--background: var(--wp--preset--color--carnelian);
}