misuzu/assets/less/search/input.less

.search__input {
    background-color: @accent-colour;
    background-color: var(--accent-colour);
    box-shadow: 0 1px 2px #000A;
    text-shadow: 0 1px 4px #000;
    overflow: hidden;
    border: 1px solid transparent;
    border-radius: 5px;
    font-size: 1.5em;

    &__background {
        background-color: @background-colour-translucent-9;
        background-color: var(--background-colour-translucent-9);
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

    &__container {
        display: flex;
        margin: 1px;
    }

    &__text {
        flex: 1 1 auto;
        border: 0;
        background-color: transparent;
        color: #fff;
        padding: 5px 10px;
        font-size: inherit;
    }

    &__button {
        flex: 0 0 auto;
        border: 0;
        color: #fff;
        border-radius: 4px;
        width: 40px;
        height: 40px;
        font-size: inherit;
        cursor: pointer;
        background-color: transparent;
        transition: background-color .2s;

        &:hover,
        &:active,
        &:focus {
            background-color: @accent-colour;
            background-color: var(--accent-colour);
        }
    }
}