:root {
    /*=============================*/
    /*=====----- GENERAL -----=====*/
    /*=============================*/

    --sw-key-color: var(--text-dark); /* site's most prominent color */
    --sw-key-color-hover: var(--text-dark);

    --sw-selected-color: var(--sw-key-color); /* used for tabs and checkboxes, like in LEO index */

    --sw-alert-color: var(--orange); /* used primarily for badges, as in LEO index tripbuilder 💗 icon and the facility search compare toggle badge */

    --sw-focus-color: var(--sw-key-color); /* used for focus outlines */
    --sw-light-focus-color: var(--orange-light); /* used for focus outlines against dark backgrounds */

    /*=============================*/
    /*=====----- BUTTONS -----=====*/
    /*=============================*/
    
    /*----- primary button -----*/

    --sw-button-primary-bg: var(--orange);
    --sw-button-primary-color: var(--white);

    --sw-button-primary-bg-hover: var(--orange-light);
    --sw-button-primary-color-hover: var(--white);

    /*----- secondary button -----*/

    --sw-button-secondary-bg: var(--orange);
    --sw-button-secondary-color: var(--white);
    
    --sw-button-secondary-bg-hover: var(--orange-light);
    --sw-button-secondary-color-hover: var(--white);

    /*----- border button -----*/

    --sw-button-border-bg: var(--white);
    --sw-button-border-color: var(--sw-key-color);

    --sw-button-border-bg-hover: var(--white);
    --sw-button-border-color-hover: var(--sw-key-color);

    /*===========================*/
    /*=====----- LINKS -----=====*/
    /*===========================*/

    --sw-link-color: var(--sw-key-color);

    --sw-link-hover-color: var(--sw-key-color-hover);

    /*===========================*/
    /*=====----- ICONS -----=====*/
    /*===========================*/

    --sw-icon-color: var(--sw-key-color);
    --sw-light-icon-color: var(--white);
    --sw-icon-bg: var(--sw-key-color); /* used for social media icon backgrounds where applicable */

    /*===============================*/
    /*=====----- MINI DATE -----=====*/
    /*===============================*/

    --sw-mini-date-bg: var(--white);
    --sw-mini-date-color: var(--sw-key-color);

    /*================================*/
    /*=====----- CONTAINERS -----=====*/
    /*================================*/

    --sw-container-bg: var(--white);
    --sw-container-border-color: var(--primary-color-300);
}