/* Increase specificity to override global styles */
html:root {
	/*COLORS DECLARATION:*/
    --primary-color: #0A2240;
    --secondary-color: var(--foam-green);
    --primary-color-rgb: 10, 34, 64;
    --primary-color-70: rgba(var(--primary-color-rgb), 0.7);
    --main-color: var(--black);
    --burger-background: #0A2240;

    /*COMPONENTS:*/
    --submenu-item-background: #B8D8EB;
    --button-background: var(--primary-color);
    --Footer-background: var(--black);
    --hero-search-button-background: var(--primary-color);
    --hero-search-button-color: var(--white);
    --hero-background-color: var(--primary-color);
    --content-component-subheader-color: var(--black);
    --content-component-header-color: var(--primary-color);
    --action-callout-background-color: rgba(184, 216, 235, 0.8); /*#B8D8EB 80%*/
    --content-block-subheader-color: var(--secondary-color);
    --content-block-header-color: var(--primary-color);
    --brand-card-background-color: rgba(10, 34, 64, 0.5); /*#0A2240 50%*/
    --text-card-background-color: #F0EFEF;
    --text-card-item-hover-background-color: #B8D8EB;
    --search-result-card-label-background-color: var(--black);
    --unit-detail-tabs-description-background-color: var(--gray);
    --tooltip-content-background-color: var(--white);
    --banner-header-color: var(--white);
    --banner-background-color: var(--primary-color);
    --form-input-border: var(--primary-color);
    --unitcard-virtual-tour-label-color: var(--secondary-color);
    --hero-bottom-line-background: #B8D8EB;
    --action-callout-title-color: var(--primary-color);
    --header-background-color: rgba(var(--primary-color-rgb), 0.9);
    --image-video-carousel-overlay-color: var(--primary-color);
    --search-filter-panel-unit-count-color: var(--primary-color);
    --unit-overlay-floorplan-background-color: var(--white);

    /*osano*/
    --osano-cm-toggle: var(--submenu-item-background);
    --osano-cm-toggle-checked: var(--button-background);

    /*Static Cards Component*/
    --static-card-header-color: var(--foam-green);
    --static-card-body-color: var(--white);
    --static-card-background-color: var(--primary-color);

    /*Tabs Component*/
    --tabs-component-background-color: var(--primary-color);
    --tabs-component-icon-color: var(--primary-color);
    --tabs-component-icon-background-color: var(--white);
    --tabs-component-active-icon-color: var(--primary-color);
    --tabs-component-active-icon-background-color: var(--secondary-color);
    --tabs-component-header-main-color: var(--secondary-color, var(--white));
    --tabs-component-header-secondary-color: var(--white);
    --tabs-component-text-color: var(--white);

    /*Table Component*/
    --table-component-background-color: var(--primary-color);
    --table-component-icon-color: var(--primary-color);
    --table-component-icon-background-color: var(--secondary-color, var(--white));
    --table-component-header-color: var(--secondary-color, var(--white));
    --table-component-text-color: var(--white);

    /*Cards Component*/
    --cards-component-header-color: var(--primary-color);
    --cards-component-text-color: var(--black);
    --cards-component-card-border-color: var(--secondary-color);
    --cards-component-default-background-color: var(--gray);

    --footer-logo-height: 3rem;
    --footer-about-margin-bottom: 2rem;
    --header-logo-height: 3rem;
    --mobile-menu-header-logo-height: 3rem;
    --title-header-font-size: 7rem;
    --header-submenu-font-size: 1.5rem;
    --burger-background: var(--primary-color);
    --burger-main-items-font-size: 20px;
    --burger-main-items-letter-spacing: 2px;
    --burger-additional-items-font-size: 18px;
    --burger-additional-items-letter-spacing: 2px;
    --burger-book-a-tour-font-size : 12px;

    /*FONTS DECLARATION:*/
    --primary-font-family: var(--font-family-figtree);
    --secondary-font-family: var(--font-family-europa);
    
    /*Components fonts*/
    --header-links-font: var(--primary-font-family);
    --header-submenu-font: var(--primary-font-family);
    --mobile-menu-font: var(--primary-font-family);
    --mobile-menu-submenu-font: var(--primary-font-family);
    --button-font: var(--secondary-font-family);
    --hero-subtitle-font: var(--secondary-font-family);
    --hero-title-font: var(--primary-font-family);
    --content-component-header-font: var(--secondary-font-family);
    --content-component-subheader-font: var(--secondary-font-family);
    --content-component-description-font: var(--primary-font-family);
    --content-block-component-subheader-font: var(--secondary-font-family);
    --content-block-component-header-font: var(--primary-font-family);
    --content-block-component-description-font: var(--primary-font-family);
    --footer-address-font: var(--primary-font-family);
    --footer-links-font: var(--primary-font-family);
    --footer-copyright-font: var(--primary-font-family);
    --minimized-hero-component-overlay-title: var(--primary-font-family);
    --unit-card-details-font: var(--primary-font-family);
    --title-font-header: var(--secondary-font-family);
    --title-font-sub-header: var(--secondary-font-family);
    --text-card-subheader-font: var(--secondary-font-family);
    --text-card-header-font: var(--primary-font-family);
    --compare-bar-actions-font: var(--primary-font-family);
    --compare-label-font: var(--secondary-font-family);
    --banner-header-font: var(--primary-font-family);
    --interactive-map-tabs-font: var(--primary-font-family);
    --static-card-header-font: var(--secondary-font-family);
    --tabs-component-header-font: var(--secondary-font-family);
    --tabs-component-body-font: var(--primary-font-family);
    --table-component-header-font: var(--secondary-font-family);
    --table-component-body-font: var(--primary-font-family);
    --cards-component-header-font: var(--secondary-font-family);
    --cards-component-body-font: var(--primary-font-family);
    --hero-bedroom-filter-font: var(--secondary-font-family);

    --header-menu-font-size: var(--font-size-15);
}