%entry {
    background-color: bg-color(1);
    background-clip: padding-box;
    border: 1px solid $border-color;
    border-radius: rem(3px);
    box-shadow: inset-shadow("");
    color: #{'@fg_color'};

    &:disabled {
        background: $insensitive-base-color;
        box-shadow: inset-shadow("disabled");
        color: $insensitive-fg-color;
    }

    &.flat {
        background: transparent;
        border-color: transparent;
        border-radius: 0;
        box-shadow: none;

        &:focus {
            border-bottom-color: #{'@accent_color'};
        }
    }

    &:focus {
        @if $color-scheme == "light" {
            border-color: #{'@accent_color'};
        }
        box-shadow:
            0 0 0 rem(2px) #{'alpha(@accent_color, 0.3)'},
            inset-shadow();
    }
}

entry {
    @extend %entry;
    // Prevent size change when setting primary or secondary icons
    min-height: 16px;
    // Off-by-one to account for padding-box clip
    padding: rem(4px);

    image {
        color: #{'@placeholder_text_color'};
        transition: all duration("in-place") $easing;
    }

    image.left {
        margin-right: rem(6px);
    }

    image.right {
        margin-left: rem(6px);
    }

    // We only want the action side icon to react on hover
    &:dir(ltr) image.right:hover,
    &:dir(rtl) image.left:hover {
        color: $fg-color;
    }

    // Fixes an issue in Epiphany
    headerbar & {
        margin: 1px;
    }
}
