/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

.footer-background {
    background-color: #f5f4f2;
}
.btn-primary {
    background-color: var(--color-orange);
    color: var(--color-white);
    border-radius: 10px;
}

.form-control {
        width: 100%;
        padding: calc(var(--spacing)*3)calc(var(--spacing)*4);
        border-radius: var(--radius-md);
        background-color: var(--color-neutral-100);
        color: var(--color-emphasized);
        font-weight: var(--font-weight-medium);
        box-shadow: 0 0 0 2px var(--color-neutral-300)inset;
        border: 1px solid #0000;
        display: block
}

.form-control::placeholder {
    color: var(--color-muted)
}

.form-control:focus {
    box-shadow: 0 0 0 2px var(--color-primary)inset;
    background-color: var(--color-white);
}