/* The below code creates a floating label */
label {
    margin-bottom: 15px;
    position: relative;
    border-bottom: 1px solid #ddd;
    display: block;
    overflow: hidden;
}

    /* Trigger label float on focus or when placeholder is not shown */
    label:focus-within > .label-span,
    input:not(:placeholder-shown) + .label-span,
    textarea:not(:placeholder-shown) + .label-span {
        color: var(--theme-color);
        transform: translateY(0px);
    }

/* Input and textarea styling */
input:not(.corvixo-input),
textarea {
    width: 100%;
    padding: 10px 0px;
    margin-top: 20px;
    border: none;
    outline: none;
    resize: none; /* Optional: disables textarea resizing */
}

    /* Hide placeholder text */
    input:not(.corvixo-input)::placeholder,
    textarea::placeholder {
        opacity: 0;
    }

/* Floating label styling */
.label-span {
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(30px);
    font-size: 0.825em;
    transition-duration: 300ms;
}