/*
 * gw-cookieconsent.css -- companion to gw-cookieconsent-init.js (DGWGEOWORK-9323).
 *
 * The vendored stylesheet targets .cc-btn / .cc-close by class, so it already covers the native
 * <button> elements we swap in. What a <button> does NOT take from the page is the font, and user
 * agents add their own background and appearance on top -- reset those so the banner looks exactly
 * as it did with the old <a> markup. Note that border-radius is deliberately left alone: the
 * classic theme sets it (.cc-theme-classic .cc-btn { border-radius: 5px }) and resetting it here
 * would flatten the buttons.
 */

.cc-window .cc-btn,
.cc-window .cc-close {
    font: inherit;
    font-weight: bold;
    line-height: normal;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.cc-window .cc-close {
    background: transparent;
    border: 0;
    padding: 0;
}

/*
 * Colours
 * -------
 * The library can paint the banner itself from the `palette` option, by injecting a <style> at
 * runtime whose selector is a hash of that object (.cc-color-override-<hash>, specificity 0-2-0).
 * Whatever a customer wrote in their own stylesheet lost against it. So the colours live here
 * instead and `palette` is no longer passed (see gw-cookieconsent-init.js).
 *
 * Every colour reads a custom property whose default sits in the var() fallback, and the property
 * is deliberately NOT declared anywhere. That is the point: a tenant stylesheet only has to
 * declare it -- on :root is fine -- and it wins, whatever the load order. Declaring the defaults
 * on :root here would instead beat the tenant sheet, which is linked BEFORE this file
 * (Views/Layout/_Layout.cshtml:52 vs 61-62).
 *
 * To restyle the banner for one customer, in their own CSS:
 *
 *     :root {
 *         --gw-cookie-banner-bg: #123456;
 *         --gw-cookie-banner-btn-fg: #123456;
 *     }
 *
 * Anyone changing these must re-check contrast: WCAG 1.4.3 (AA) wants 4.5:1 for the message text
 * against the banner, and for the button label against the button. The default #0066cc (the
 * Designers Italia institutional blue) gives 5.57:1 with white -- it replaced #237afc, which gave
 * 3.99:1 and therefore failed.
 */

.cc-window {
    color: var(--gw-cookie-banner-fg, #fff);
    background-color: var(--gw-cookie-banner-bg, #0066cc);
}

/*
 * The library dims the link with opacity .8 (and the close button with .9), and opacity is not a
 * colour: it blends the text into whatever sits behind it, so the rendered contrast has nothing to
 * do with the values above and nobody checking the palette would ever see it. Measured on the
 * default background, white at .8 renders as rgb(204,224,245) -- 4.13:1 against #0066cc, under the
 * 4.5:1 of WCAG 1.4.3 (AA). Full opacity, then; the link stays distinguishable by the underline
 * the library already gives it, so no information rides on colour alone (1.4.1).
 *
 * The library also has `.cc-link:active, .cc-link:visited { color: initial }`, which would paint a
 * followed link black on the banner background (3.77:1). Naming those states here overrides it.
 */
.cc-window .cc-link,
.cc-window .cc-link:active,
.cc-window .cc-link:visited {
    color: var(--gw-cookie-banner-link, var(--gw-cookie-banner-fg, #fff));
    opacity: 1;
}

.cc-window .cc-close {
    opacity: 1;
}

.cc-window .cc-btn {
    color: var(--gw-cookie-banner-btn-fg, var(--gw-cookie-banner-bg, #0066cc));
    background-color: var(--gw-cookie-banner-btn-bg, #fff);
    border-color: var(--gw-cookie-banner-btn-border, transparent);
}

.cc-window .cc-btn:hover,
.cc-window .cc-btn:active {
    background-color: var(--gw-cookie-banner-btn-bg-hover, #e6e6e6);
}

/*
 * The library ships no :focus rule for .cc-btn at all (only .cc-highlight .cc-btn:first-child and
 * .cc-close), which leaves the default browser ring over a saturated blue. WCAG 2.4.7 Focus
 * Visible (AA) wants better, so the ring is spelled out -- and it follows the palette too, since a
 * white ring would vanish on a light custom background. The offset puts it on the banner
 * background rather than on the button face.
 */
.cc-window .cc-btn:focus-visible,
.cc-window .cc-link:focus-visible,
.cc-window .cc-close:focus-visible {
    outline: 3px solid var(--gw-cookie-banner-focus-ring, var(--gw-cookie-banner-fg, #fff));
    outline-offset: 2px;
}

@supports not selector(:focus-visible) {
    .cc-window .cc-btn:focus,
    .cc-window .cc-link:focus,
    .cc-window .cc-close:focus {
        outline: 3px solid var(--gw-cookie-banner-focus-ring, var(--gw-cookie-banner-fg, #fff));
        outline-offset: 2px;
    }
}
