
/* Page background color */
@media (min-width: 62rem) {
    [data-document-type]:not([data-document-type="50"]):not([data-document-type="51"]) {
        background-color: var(--root-color-background--grey);
    }

    [data-document-type]:not([data-document-type="50"]):not([data-document-type="51"]):not([data-document-type="56"]):not([data-document-type="64"]):not([data-document-type="66"]):not([data-document-type="1"].layout-1) .main-column {
        background-color: var(--root-color--white);
        margin-top: 3.5rem;
        margin-bottom: 6rem;
        position: relative;
    }

    /* Using a pseudo element here, because adding the outline to .main-column itself will fail in FF */
    [data-document-type]:not([data-document-type="50"]):not([data-document-type="51"]):not([data-document-type="56"]):not([data-document-type="64"]):not([data-document-type="66"]):not([data-document-type="1"].layout-1) .main-column::before {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        outline: 3rem solid var(--root-color--white);
        pointer-events: none;
    }
}

/* Menu colors */
@media (min-width: 62rem) {
    .page-header__menu {
        --color-background: transparent;
    }

    .page-header__menu__text {
        --color-text: var(--root-color--white);
        --color-text__active: var(--root-color--white);
        --color-text__hover: var(--root-color--white);
    }

    .page-header__search__input:focus {
        --color-border: var(--root-color--white);
    }

    .page-header__search__button:hover,
    .page-header__search__button:focus {
        --color-border: var(--root-color--white);
    }
}

/* Readspeaker button */
.readspeaker__button.button.button--small {
    --font-weight: var(--root-font-weight--semi-bold);
}

/* Top tasks */
.top-tasks-tile__description {
    margin-top: 0.5rem;
}

/* Contact button color for opening times in top tasks */
.opening-times .button.button-primary {
    --background-color: var(--root-color--footer);
    --border-top-color: var(--root-color--footer);
    --border-right-color: var(--root-color--footer);
    --border-bottom-color: var(--root-color--footer);
    --border-left-color: var(--root-color--footer);
    --color: var(--root-color--white);
}

.opening-times .button.button-primary:hover,
.opening-times .button.button-primary:focus,
.opening-times .button.button-primary:active {
    --border-top-color: var(--root-color--footer-dark);
    --border-right-color: var(--root-color--footer-dark);
    --border-bottom-color: var(--root-color--footer-dark);
    --border-left-color: var(--root-color--footer-dark);
    --background-color: var(--root-color--footer-dark);
}

/* Facets filter */
@media (min-width: 62rem) {
    .facets-filter .collapsible__button,
    .facets-filter .collapsible__panel {
        --color-background: transparent;
    }
}

/* Footer social icons */
.page-footer__columns .footer__element--icons .footer__link .link:active .icon,
.page-footer__columns .footer__element--icons .footer__link .link:focus .icon,
.page-footer__columns .footer__element--icons .footer__link .link:hover .icon {
    --color-icon: var(--root-color--footer);
}

/* Footer image */
.page-footer {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='564' height='267' xmlns='http://www.w3.org/2000/svg' fill='%23edefed'%3E%3Cpath d='M563.294 0v16.823c-24.787 1.407-47.84 9.469-68.335 23.566l-.923.64c-19.014 13.299-35.229 31.526-47.617 53.014l-.452.789.75.247c39.628 13.114 77.163 32.035 109.735 54.656 2.319 1.61 4.6 3.263 6.843 4.957v21.588a196.904 196.904 0 00-16.426-12.746c-32.007-22.23-69.069-40.765-108.14-53.392l-.518-.167-.098.212a200.565 200.565 0 00-9.568 25.455c-12.177 40.477-11.67 84.089 2.174 122.85.928 2.6 1.913 5.17 2.954 7.711h-18.027c-.253-.685-.503-1.371-.749-2.06-15.078-42.22-15.628-89.503-2.44-133.34l.397-1.304a217.61 217.61 0 018.946-23.994l.17-.38-.847-.232c-42.738-11.682-86.394-15.919-129.382-11.69-52.29 5.142-102.723 22.683-150.083 53.66-43.561 28.493-84.113 68.074-121.084 119.339L0 266.2C81.565 148.506 180.935 87.22 290.096 76.483l1.475-.142c45.72-4.3 92.037.5 137.233 13.25l.733.207.505-.919c14.005-25.345 32.894-46.855 55.396-62.332C508.751 10.512 535.098 1.425 563.294 0z' fill='%23005D9B' fill-rule='nonzero'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 30rem;
    background-position: 100% 100%
}

/* Contact page */
.contact-page__row2,
.contact-page__row3 {
    background-color: var(--root-color--white);
}

.contact-page__row2 {
    margin-top: 3rem;
    padding-top: 1rem;
}

.column > .contact-page__row2:last-child:not(.section--color),
.column > .contact-page__row3:last-child:not(.section--color) {
    margin-bottom: 0;
    padding-bottom: 3rem;
}

/* CE Events table */
.button.table-events__button {
    --background-color: var(--root-color--secondary);
    --border-top-color: var(--root-color--secondary);
    --border-right-color: var(--root-color--secondary);
    --border-bottom-color: var(--root-color--secondary);
    --border-left-color: var(--root-color--secondary);
    --color: var(--root-color-text);
}

.button.table-events__button:hover,
.button.table-events__button:focus,
.button.table-events__button:active {
    --border-top-color: var(--root-color--secondary-dark);
    --border-right-color: var(--root-color--secondary-dark);
    --border-bottom-color: var(--root-color--secondary-dark);
    --border-left-color: var(--root-color--secondary-dark);
    --background-color: var(--root-color--secondary-dark);
}

/* Document type product */
[data-document-type="52"] .main-column > .ce-textpic:first-of-type ul:first-of-type,
[data-document-type="52"] .main-column > .page-title + .ce-textpic ul:first-of-type,
[data-document-type="52"] .main-column > .page-title + .top-links + .ce-textpic ul:first-of-type,
[data-document-type="52"] .main-column > .ce-shortcut:first-of-type + .ce-textpic ul:first-of-type,
[data-document-type="52"] .main-column > .page-title + .ce-shortcut + .ce-textpic ul:first-of-type,
[data-document-type="52"] .main-column > .page-title + .top-links + .ce-shortcut + .ce-textpic ul:first-of-type {
    font-weight: var(--root-font-weight--semi-bold);
}

/* CE Highlight menu */
.highlightmenu .card:not(.card--color) .card__title {
    --color: var(--root-color--primary);
}
