/*
 * The cookie question (consent.js). A sheet at the bottom of the page: in the
 * way of nothing, refusing as easy as accepting. Its colours are its own (a
 * legal text must stay legible), every pair keeps a contrast of 4.5:1 or more.
 * Selectors are two classes deep so the site's global h2 / p / a rules
 * (style.css) never reach in.
 */
.vl-consent {
    position: fixed;
    left: 50%;
    bottom: 16px;
    transform: translateX(-50%);
    z-index: 9000;
    width: min(760px, calc(100vw - 32px));
    max-height: calc(100vh - 32px);
    overflow-y: auto;
    padding: 18px 20px;
    border-radius: 14px;
    background: #ffffff;
    color: #1d2433;
    border: 1px solid #cfd5e1;
    box-shadow: 0 18px 48px rgba(10, 20, 50, 0.22);
    font-family: Roboto, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.5;
    text-align: left;
}

.vl-consent .vl-consent__title {
    margin: 0 0 6px;
    font-family: inherit;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4;
    text-align: left;
    text-transform: none;
    color: #1d2433;
    outline: none;
}

.vl-consent .vl-consent__body {
    margin: 0;
    font-family: inherit;
    font-size: 14px;
    line-height: 1.5;
    text-align: left;
    color: #3d4759;
}

.vl-consent .vl-consent__policy {
    display: inline-block;
    margin-top: 6px;
    font-family: inherit;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    color: #2a5bd7;
    text-decoration: underline;
}

.vl-consent .vl-consent__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 14px;
}

.vl-consent .vl-consent__button,
.vl-consent .vl-consent__quiet {
    appearance: none;
    min-height: 40px;
    padding: 0 16px;
    border-radius: 10px;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

.vl-consent .vl-consent__button {
    border: 1px solid #2a5bd7;
    background: #2a5bd7;
    color: #ffffff;
}

.vl-consent .vl-consent__button:hover { background: #224fc0; }

.vl-consent .vl-consent__quiet {
    border: 1px solid #cfd5e1;
    background: #ffffff;
    color: #1d2433;
}

.vl-consent .vl-consent__quiet:hover { background: #f1f4fa; }

.vl-consent .vl-consent__button:focus-visible,
.vl-consent .vl-consent__quiet:focus-visible {
    outline: 2px solid #1d2433;
    outline-offset: 2px;
}

.vl-consent .vl-consent__choices {
    margin: 14px 0 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-size: 14px;
    line-height: 1.5;
}

.vl-consent .vl-consent__choice {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    gap: 2px 10px;
    align-items: start;
}

.vl-consent .vl-consent__choice input {
    width: 18px;
    height: 18px;
    margin: 2px 0 0;
    accent-color: #2a5bd7;
}

.vl-consent .vl-consent__name { font-weight: 600; }

.vl-consent .vl-consent__desc {
    grid-column: 2;
    color: #3d4759;
    font-size: 13px;
}

@media (max-width: 560px) {
    /* On a phone it must not take the page: at most two thirds of the height, the rest scrolls. */
    .vl-consent { bottom: 8px; padding: 14px; max-height: 66vh; font-size: 13px; }
    .vl-consent .vl-consent__title { font-size: 15px; }
    .vl-consent .vl-consent__actions { justify-content: stretch; }
    .vl-consent .vl-consent__button,
    .vl-consent .vl-consent__quiet { flex: 1 1 100%; }
}

/* "Ustawienia cookies" in the footer: only where there is a question to go back to. */
.cookie-settings-item { display: none; }
html.vl-hs-on .cookie-settings-item { display: list-item; }
