.textbox {
    position: relative;
    width: 100%;
}

    .textbox label {
        font-size: var(--font-size-sm);
        font-weight: var(--font-weight-regular);
        color: #555;
        margin-bottom: 0.5rem;
    }

    .textbox input[type="text"],
    .textbox input[type="tel"] {
        width: 100%;
        padding: 9px 20px;
        border-radius: var(--radius-pill);
        border: var(--border);
        font-size: var(--font-size-md);
        background-color: rgba(255,255,255,0.5);
        backdrop-filter: blur(40px);
        display: inline-block;
        transition: var(--default-transition);
    }
        .textbox input[type="text"].active,
        .textbox input[type="tel"].active {
            border-color: var(--color-primary);
            background-color: var(--color-white);
        }

        .textbox input[type="text"]:focus,
        .textbox input[type="tel"]:focus {
            outline: none;
            border-color: var(--color-primary);
            background-color: var(--color-white);
        }


.textbox input[type=number]::-webkit-inner-spin-button,
.textbox input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.textbox input[type=number] {
    -moz-appearance: textfield;
}