:root {
    /***
     ** GLOBAL COMPONENTS
     ** These colors are used across the entire application.
     *
     * Vars name: --color-<section>-<element>-<attribute>-<state>
     * Example: --color-navbar-link-text-active
    */

    /* Navigation bar */
    --color-navbar-style-background: #ADB6A8;
    --color-navbar-style-background-scrolled: #ADB6A8c2;
    --color-navbar-style-border-bottom: transparent;
    --color-navbar-style-border-bottom-pixels: 0px;

    --color-navbar-link-text: #ffffff80;
    --color-navbar-link-text-hover: #00A6AAc0;
    --color-navbar-link-text-active: #B5ABA1c0;

    /* Search Box */
    --color-searchbox-tabs-inactivetab: #ADB6A8;
    --color-searchbox-tabs-inactivetab-hover: #e3f2ff;
    --color-searchbox-tabs-text-inactivetab: #B5ABA1;
    --color-searchbox-tabs-text: #00A6AA;

    --color-searchbox-mainbox-background: #ffffff;
    --color-searchbox-mainbox-activetab: #FFFFFF;
    --color-searchbox-mainbox-border: #80715D;

    --color-searchbox-button-background: #003B75;
    --color-searchbox-button-background-hover:#A1B0D1;
    --color-searchbox-button-text: #ffffff;
    --color-searchbox-button-text-hover: #ffffff;
    --color-searchbox-button-border: #80715D;
    --color-searchbox-button-border-hover: #80715D;

    /* Badges */
    --color-primary-badge-background: #9C6FAE;
    --color-primary-badge-background-hover: #6D2463;
    --color-primary-badge-text: #CCBEB8;
    --color-primary-badge-text-hover: #CCBEB8;

    --color-secondary-badge-background: #CDCE00;
    --color-secondary-badge-background-hover: #595403;
    --color-secondary-badge-text: #C6BD80;
    --color-secondary-badge-text-hover: #C6BD80;

    --color-tertiary-badge-background: #F18F00;
    --color-tertiary-badge-background-hover: #804900;
    --color-tertiary-badge-text: #F4CC8C;
    --color-tertiary-badge-text-hover: #F4CC8C;

    /* Links */
    --color-footer-link-text: #FFFFFF;
    --color-footer-link-text-hover: #B5ABA1;

    --color-metadata-link-text: #003B75;
    --color-metadata-link-text-hover: #5284C4;

    --color-facets-link-text: #003B75;
    --color-facets-link-text-hover: #5284C4;

    /* Types of Views (icons) */
    --color-view-background-active: #003B75;
    --color-view-background-hover: #5284C480;
    --color-view-icontext-active: #FFFFFF;
    --color-view-icontext-inactive: #6c757d;
    --color-view-border: #80715D;

    /* Pagination */
    --color-pagination-background-active: #003B75;
    --color-pagination-background-hover: #5284C4;
    --color-pagination-text-active: #ffffff;
    --color-pagination-text-hover: #ffffff;
    --color-pagination-border: #80715D;
    --color-pagination-border-hover: #80715D;

    /* Footer */
    --color-footer-background: #ADB6A8;
    --color-footer-text: #ffffff;

    /* Layout -> Homepage */
    --color-homepage-welcome-text: #ffffff;
    --color-homepage-featured-objects-section-background: #ffffff;
    --color-homepage-card-background: #ffffff;
    --color-homepage-card-background-hover: #ffffff;
    --color-homepage-card-title: #000000;
    --color-homepage-card-metadata: #000000;
    --color-homepage-card-link: #003B75;
    --color-homepage-card-border: #80715D;

    /* Layout -> Results List */
    --color-results-list-title: #000000;
    --color-results-list-title-hover: #000000;
    --color-results-list-metadata: #000000;

    --color-fulltextdropdown-background: #73797C;
    --color-fulltextdropdown-background-hover: #A1B0D1;
    --color-fulltextdropdown-text: #003B75;
    --color-fulltextdropdown-text-hover: #003B75;

    /* Layout -> Details (/view) */
    --color-details-title: #000000;
    --color-details-description: #000000;
    --color-details-subtitle: #212529;
    --color-details-text: #212529;
}
