@component: Twilio-ChannelInput;

.@{themeName} {

    .@{component} {
        background: @input-field-background;
    }

    .@{component}-TextArea {
        background: @input-field-background;
        color: @input-field-color;
    }

    .@{component}-UpperLine {
        background-color: @input-separator-line-background-color;
    }

    .@{component}-SendButton {
        background-color: @send-button-background-color;
        svg {
            fill: @send-button-color;
        }
    }

    .@{component}-ButtonOverlay {
        background-color: @send-button-overlay-color;
    }

    .@{component}-TextArea {
        &::-webkit-input-placeholder {
            color: @input-placeholder-color;
        }
        &:-moz-placeholder {
            color: @input-placeholder-color;
        }
        &::-moz-placeholder {
            color: @input-placeholder-color;
        }
        &:-ms-input-placeholder {
            color: @input-placeholder-color;
        }
    }
}