.input-text,
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="tel"],
input[type="url"],
textarea {
    width: 100%;
    padding: 0.75rem;
    border: 0.0625rem solid var(--color-gray-300);
    border-radius: 0.25rem;
    font-size: 1rem;
    font-family: inherit;
    color: var(--color-text-primary);
    background-color: var(--color-background);
    transition: border-color 0.3s;
}

.input-text:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
textarea:focus {
    outline: none;
    border-color: var(--color-primary);
}

.input-select,
select {
    width: 100%;
    padding: 0.75rem;
    border: 0.0625rem solid var(--color-gray-300);
    border-radius: 0.25rem;
    font-size: 1rem;
    font-family: inherit;
    color: var(--color-text-primary);
    background-color: var(--color-background);
    transition: border-color 0.3s;
    cursor: pointer;
}

.input-select:focus,
select:focus {
    outline: none;
    border-color: var(--color-primary);
}

.input-radio,
input[type="radio"] {
    width: 1.125rem;
    height: 1.125rem;
    cursor: pointer;
    accent-color: var(--color-primary);
}

.input-checkbox,
input[type="checkbox"] {
    width: 1.125rem;
    height: 1.125rem;
    cursor: pointer;
    accent-color: var(--color-primary);
}