.searchbox {
    position: relative;
    display: flex;
    align-items: center;
    margin-bottom: 0;

    & > .textbox {
        & input {
            width: 100%;
            padding-left: 2rem;
        }
    }

    & .svg-mag-glass {
        pointer-events: none;

        position: absolute;
        bottom: 6px;
        left: 0.5rem;

        width: 1.5rem;
        height: 1.5rem;

        transition: var(--transition-easeinout-fast);

        .searchbox:has(input:hover) > & {
            bottom: 7px;
            color: var(--clr-input-border-hover);
        }

        .searchbox:has(input:focus) > & {
            bottom: 5px;
            color: var(--clr-input-border-focused);
        }

        .searchbox:has(input:disabled) > & {
            bottom: 6px;
            color: var(--clr-input-bg-disabled);
        }
    }
}
