/*
Theme Name: Fewer Child
Description: Child theme for Fewer. You can now safely customize it and not risk losing your customizations.
Author: Alexandre REVIRE
Author URI: https://alexandre-revire.fr
Template: fewer
Version: 1.0.1
*/

:root {
    --cma-color-primary: #000;
    --cma-color-secondary: #767676;
    --cma-color-tertiary: #e6e6e6;
    --cma-color-tertiary: #e6e6e6;
    --cma-color-offwhite: #f5f5f5;
    --cma-color-black: #000;
    --input-height: 3.125rem;
    --input-padding: 0.5rem;
    --input-placeholder-color: var(--cma-color-secondary);
    --input-color: var(--cma-color-primary);
    --input-border-color: var(--cma-color-secondary);
    --input-border-color-focus: var(--cma-color-secondary);
    --input-bg-color: var(---cma-color-offwhite);
    --input-border-radius: 0.25rem;
    --textarea-height: 200px;
}

[type="text"],
[type="password"],
[type="date"],
[type="datetime"],
[type="datetime-local"],
[type="month"],
[type="week"],
[type="email"],
[type="number"],
[type="search"],
[type="tel"],
[type="time"],
[type="url"],
[type="color"],
textarea {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    height: var(--input-height);
    padding: var(--input-padding);
    color: var(--input-color);
    border: solid 1px var(--input-border-color);
    border-radius: var(--input-border-radius);
    background-color: var(--input-bg-color);
    box-shadow: none;
    appearance: none;
}

textarea {
    height: auto;
    min-height: var(--textarea-height);
}

[type="submit"] {
    padding: 1rem 2rem;
    cursor: pointer;
    color: var(--cma-color-offwhite);
    border: none;
    border-radius: var(--input-border-radius);
    background-color: var(--cma-color-primary);
    font-size: 1.5rem;
    appearance: none;
}

[type="submit"]:active {
    transform: translateY(2px);
}