$background: #C2C2C2;
$light: #E0E0E0;
$green: #1fffb4;
$black: #454545;
$ff: BlinkMacSystemFont,-apple-system,"Segoe UI",Rubik,Helvetica, Arial, sans-serif;

@use 'fontRubik' with (
    $wb-font-path: './fonts'
);

@use 'general' with (
    $chat-consistent-border-radius: false,
    $chat-border-radius: 0,
    $chat-composer-border-radius: 15px,

    $chat-btn-list-btn-color: $black,
    $background: $background,
    $msg-in-background: $light,
    $msg-out-background: $background,

    $chat-font-family: $ff,

    $chat-square-btn: true,
    // $chat-btn-background: $green,

    $chat-qr-background: #fff,

    $chat-background: #fff,
    $chat-composer-background: $light,

    $chat-send-btn-color: $background,

    $event-margin: 5px
);

.wb {
    &.standalone {
        -webkit-transition: none;
        -o-transition: none;
        transition: none;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    &.embed {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    }

    &.msg-list {
        position: static;
        z-index: auto;
        background-color: transparent;
    }

    &.wb-open, &.wb-closed, &.wb-hidden {
        height: 100%;
        width: 100%;
        max-width: none;
        position: absolute;
    }

    .wb-composer {
        border-bottom-left-radius: 0;
    }

    &.wb-anim-finished .wb-expand-btn:hover {
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
    }
}