:root {
    /**
* Colors
*/

    --hwc-color-primary: #e32d22;
    --hwc-color-primary-dark: #980000;
    --hwc-color-primary-darker: #4a1011;
    --hwc-color-primary-light: #ff8a5f;
    --hwc-color-primary-lighter: #fff5f0;

    /**
* Opaque
*/
    --hwc-color-opaque-primary: rgba(227, 45, 34, 0.85); /* #e32d22 */

    /**
 * Link Colors
 */

    --hwc-color-link: var(--hwc-color-black);
    --hwc-color-link-underline: var(--hwc-color-primary);
    --hwc-color-link-hover: var(--hwc-color-primary);
    --hwc-color-link-underline-hover: var(--hwc-color-primary);

    /**
 * Component colors
 */
    --hwc-color-input-accent: var(--hwc-color-primary-darker);
    --hwc-color-checkbox-accent: var(--hwc-color-primary);

    /**
 * Button Colors
 */
    --hwc-color-button-primary-hover: #d62722;
    --hwc-color-button-primary-light-hover: #ff7d55;

    /**
* Color mappings
*/

    --hwc-color-button-text: var(--hwc-color-white);

    /**
* Font families
*/
    --hwc-h1-large-font-family: var(--hwc-font-primary-bold);
    --hwc-h1-font-family: var(--hwc-font-primary-bold);
    --hwc-h2-font-family: var(--hwc-font-primary-medium);
    --hwc-h3-font-family: var(--hwc-font-primary-medium);
    --hwc-h4-font-family: var(--hwc-font-primary-regular);
    --hwc-h5-font-family: var(--hwc-font-primary-regular);
    --hwc-h6-font-family: var(--hwc-font-primary-regular);
    --hwc-caption-font-family: var(--hwc-font-primary-regular);
    --hwc-technical-font-family: var(--hwc-font-primary-regular);
    --hwc-card-title-font-family: var(--hwc-font-primary-regular);
}