:root {
    --primary-brand-color: #3A5DAE;
    --border-gray: #D4D4D4;
    --button-color: var(--primary-brand-color);
    --button-text-color: #FFF;
    --button-hover-background-color: #28396F;
    --button-outlined-color: #FFF;
    --button-outlined-text-color: var(--primary-brand-color);
    --button-outlined-border-color: var(--primary-brand-color);
    --button-outlined-hover-background-color: #D8DFEF;
    --button-alert-background-color: #CB333A;
    --button-alert-hover-background-color: #7A1113;
    --link-default: var(--primary-brand-color);
    --link-default-hover: #0a58ca; /* default bootstrap color for a:hover */
    --table-header: #F1F1F1;
    --table-column-gradient-light: rgba(212, 212, 212, 0);
    --table-column-gradient-dark: rgba(212, 212, 212, 1);
    --table-row-odd: #F7F7F7;
    --table-row-even: #F1F1F1;
    --table-border-color: #FFF;
    --pagination-link-disabled: #222725;
    --primary-text-color: #222725;
    --notification-bar-background-color: #E6E6E6;
    --drop-down-list-border-color: var(--primary-brand-color);
    --claim-badge-reassessed-color: #D8DFEF80;
    --claim-badge-reassessed-border-color: #3B5DAE;
    --claim-status-step-border-primary: var(--primary-brand-color);
    --claim-status-step-border-secondary: #535151;
    --claim-status-step-passed-background: #A6E191;
    --claim-status-step-pending-primary-background: #EBEFF7;
    --claim-status-step-pending-secondary-background: #FFF;
    --claim-status-step-not-passed-background: #F7F7F7;
    --claim-status-step-text-color-primary: var(--primary-brand-color);
    --claim-status-step-text-color-secondary: #535151;
    --claim-status-connecting-line-color: #a9a8a8;
    --contact-bar-border-color: #899ECE;
    --faq-links-background: #FFFFFF;
    --faq-links-box-shadow-color: #28262629;
    --drop-down-text-color: #000000;
    --nav-menu-active-underline-color: var(--primary-brand-color);
    --brand-logo-height: 34px;
    --brand-logo-height-DT: var(--brand-logo-height);
    --header-phone-text-color: #749E66;
    --header-phone-handset-color: #A6E191;
    --header-background-color: #222725;
    --main-background-image-url: url('../images/header-box-shadow.png');
    --main-background-color: #F7F7F7;
    --footer-top-background: url("../images/Pupkin-ft.svg"), #3A5DAE;
    --footer-bottom-background: #28396F;
    --coverage-pet-dropdown-bg: #D8DFED;
    --alert-picture-max-width: 200px;
    --alert-picture-max-height: 80px;
    /* Figma variables. In case of the same variable name for Mobile and Desktop view it's added "-DT" for Desktop related variable */
    --brand-UI-Charcoal-Tint-80: #D4D4D4;
    --brand-UI-White: #FFF;
    --Min-Width-Elements: 280px;
    --Max-Width-Elements-DT: 424px;
    --Max-Width-Elements: 300px;
    --Padding-Width: 8px;
    --Padding-Width-DT: 24px;
    --Cards-Min-Width: 278px;
    --Cards-Min-Width-DT: 400px;
    --Cards-Max-Width: 500px;
    --Padding-Section-Page-Gap: 32px;
    --Button-Min: 247px;
    --Button-Min-DT: 100px;
    --Button-Max: 400px;
    --Min-Width-Button: 280px;
    --Min-Width-Button-DT: 100px;
    --Max-Width-Button: 290px;
    --Max-Width-Button-DT: 400px;
    --Colors-Member-Background: #D8DFEF;
    --Font-Family-Secondary: Mont, sans-serif;
    --Font-Family-Primary: Mulish, sans-serif;
    --Font-Size-Title-4: 16px;
    --Font-Spacing-Title-4: 21px;
    --Font-Size-Title-4-DT: 18px;
    --Font-Spacing-Title-4-DT: 23px;
    --Padding-Page-Top: 16px;
    --brand-ui-tru-blue-0-true-blue: var(--primary-brand-color);
    --Padding-Section-Gap: 24px;
    --Padding-Section-Gap-DT: 32px;
    --brand-UI-Silver-Shade-20: #B6B6B6;
    --Font-Size-Body: 14px;
    --Font-Spacing-Body: 20px;
    --Font-Size-Body-DT: 16px;
    --Font-Spacing-Body-DT: 22px;
    --Padding-Cookie-Top: 16px;
    --Padding-Cookie-Bottom: 16px;
    --Padding-Cookie-Top-DT: 30px;
    --Padding-Cookie-Bottom-DT: 16px;
    --Font-Size-Caption-2: 10px;
    --Font-Spacing-Caption-2: 14px;
    --Font-Size-Caption-2-DT: 12px;
    --Font-Spacing-Caption-2-DT: 16px;
    --Font-Size-Subtitle-1: 18px;
    --Font-Spacing-Subtitle-1: 24px;
    --Font-Size-Subtitle-1-DT: 24px;
    --Font-Spacing-Subtitle-1-DT: 28px;
    --brand-UI-Silver-Tint-40: #EEE;
    --brand-UI-TruBlue-Tint-60: #B0BEDF;
    --brand-UI-TruBlue-Tint-90: #EBEFF7;
    --brand-brand-catnip-green: #74AA50;
    --brand-UI-Catnip-Green-ALT-Tint-80: #EDF9E9;
    --brand-brand-canary-yellow: #FFC658;
    --brand-ui-canary-yellow-tint-80: #FFF4DE;
    --brand-UI-Catnip-Green-ALT-Tint-90: #F6FCF4;
    --Font-Size-H5-DT: 18px;
    --Font-Spacing-H5-DT: 21px;
    --Font-Size-H3: 24px;
    --Font-Spacing-H3: 26px;
    --Font-Size-H3-DT: 32px;
    --Font-Spacing-H3-DT: 35px;
    --Font-Size-Subtitle-3-DT: 18px;
    --Font-Size-Subtitle-3: 14px;
    --Font-Spacing-Subtitle-3-DT: 24px;
    --Font-Spacing-Subtitle-3: 22px;
    --Font-Size-Subtitle-2: 16px;
    --Font-Size-Subtitle-2-DT: 20px;
    --Font-Spacing-Subtitle-2: 22px;
    --Font-Spacing-Subtitle-2-DT: 24px;
    --Font-Size-Caption-1-DT: 14px;
    --Font-Size-Caption-1: 12px;
    --Font-Spacing-Caption-1-DT: 20px;
    --Font-Spacing-Caption-1: 18px;
    --brand-UI-Purrfect-Purple-ALT-Tint-90: #F7F3FF;
    --brand-ui-canary-yellow-tint-50: #FFE3AC;
    --brand-brand-rover-red: #CB333B;
    --brand-UI-Charcoal-Tint-70: #BFBEBE;
    --brand-UI-TruBlue-Tint-40: #899ECE;
    --brand-UI-Silver-0: #E3E3E3;
    --brand-UI-TruBlue-Shade-50: #1D2F57;
    --brand-UI-Orange-0: #F38730;
    --Min-Width-Form: 100px;
    --brand-UI-Alert-Red-Error-Red: #B00020;
    --Padding-Page-Template-Radius: 16px;
    --brand-UI-Silver-Tint-80: #F9F9F9;
    --Elements-Min-DT: 280px;
    --Elements-Min: 230px;
    --Item-Min-Width-DT: 200px;
    --Item-Min-Width: 100px;
    --Tables-Max-Width-DT: 300px;
    --Tables-Max-Width: 200px;
    --brand-UI-Charcoal-Tint-40: #7E7D7D;
    --Colors-Card-Background: #EBEFF7;
    --brand-UI-Blue---Hero-Tint-80: #D4D7E2;
    --brand-ui-canary-yellow-tint-90: #FFF9EE;
    --Padding-Page-Template-Left-Right: 24px;
    --Padding-Page-Template-Left-Right-DT: 60px;
    --brand-UI-Alert-Red: #AD3B69;
    --brand-UI-Alert-Red-Tint: #FAECEC;
    --brand-UI-Pet-Picture-Border: #B5C3E2;
    --brand-UI-Pet-Picture-Border-inactive: #C2C2C2;
    --brand-UI-Pet-Picture-Border-inactive-with-image: #E4D2D9;
    --brand-progress-bar: #B0BEDF;
    --brand-progress-bar-inactive: #E6E6E6;
    --brand-progress-bar-fill: #2F65B6;
    --brand-progress-bar-fill-inactive: #BBBBBB;
    --Brand-Palette-Blue---Warm-Shade-10: #2A5BA4;
    --brand-coverage-icon-highlight-color: #9CD488;
    --brand-pet-card-view-policy-color: #D8DFEF;
    --brand-badge-ribbon-color: #ad3b69;
    --brand-badge-ribbon-caps-color: #60181d;
    --brand-info-alert-color: #FFE7E8;
    --brand-element-inactive-color: #5B5B5B;
    --separator-color-inactive: #CCCCCC;
    --state-to-state-financial-item-color: #F1F1F1;
    --brand-UI-Blue-Hero-0: #28396F;
    --brand-claim-cell-reassessed: #D8DFEF80;
    --brand-claim-cell-reassessed-status: #D8DFEF;
    --brand-claim-cell-pre-approval-status: #A6E191;
    --brand-transaction-processed: #749E66;
    --brand-transaction-line-payment: #3A5DAE26;
    --brand-transaction-line-refund: #CECECE66;
    --brand-transaction-type-payment-background: #3A5DAEB3;
    --brand-transaction-type-payment-text: #F7F7F7;
    --brand-transaction-type-refund-background: #CECECE;
    --brand-date-range-input-width: 86px;
    --brand-billing-history-filter-width-DT: 212px;
}