:root {
    --rt-input-radius: var(--rt-ui-radius);
    --rt-input-border: var(--rt-ui-border);
    --rt-input-height: var(--rt-ui-height);
    --rt-input-border-focus: var(--color-gray-400);
    --rt-input-padding: 0 7px;
    --rt-input-file-bg: linear-gradient(to bottom, #f5f5f5, #e8e8e8);
    --rt-input-file-bg-hover: linear-gradient(to bottom, #e8e8e8, #d8d8d8);
}

.input {
    height: var(--rt-input-height);
    border: 1px solid var(--rt-input-border);
    border-radius: var(--rt-input-radius);
    width: 100%;
    padding: var(--rt-input-padding);
    margin: 0;
    box-sizing: border-box;
}

.input:focus {
    border-color: var(--rt-input-border-focus);
    outline: none;
}

input[type="file"] {
    padding: 6px;
    border: 1px solid var(--rt-input-border);
    box-sizing: border-box;
}

input[type="file"]::file-selector-button {
    cursor: pointer;
    text-wrap: nowrap;
    border: 1px solid var(--rt-input-border);
    margin-top: -2px;
    margin-left: -2px;
    border-radius: var(--rt-ui-radius);
    background: var(--rt-input-file-bg);
}

input[type="file"]::file-selector-button:hover {
    background: var(--rt-input-file-bg-hover);
}

.textarea {
    min-height: 3rem;
    max-height: 12rem;
    resize: vertical;
    border: 1px solid var(--rt-input-border);
    border-radius: var(--rt-input-radius);
    box-sizing: border-box;
    padding: 4px 6px;
    width: 100%;
}

.textarea:focus {
    border-color: var(--rt-input-border-focus);
    outline: none;
}