/*   Prefix --cookie-   */

body {
     /* --where-property-when */

    --cookie-popup-box-shadow-color: rgba(0, 0, 0, 0.5);
    --cookie-head-text-color: #011638;
}

.cookie-popup-wrapper {
    position: fixed;
    bottom: 32px;
    left: 4px;
    right: 4px;

    display: flex;
    justify-content: center;
    align-items: center;

    z-index: 12;

    font-family: Commissioner;
}

.cookie-popup-container {
    display: flex;
    flex-direction: column;
    gap: 8px;

    height: fit-content;
    max-width: 900px; 

    padding: 16px;
    border-radius: 3px;
    border: solid 1px var(--cookie-popup-border);
    background-color: #fff;
    box-shadow: 0 0 16px -4px var(--cookie-popup-box-shadow-color);
}

.cookie-popup-head-block {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--cookie-head-text-color);
}

.cookie-popup-text-block {
    line-height: 1.4;
}

.cookie-popup-link,
.cookie-popup-link:hover,
.cookie-popup-link:focus
{
    color: var(--base-link-color) !important;
}

.cookie-popup-link:hover,
.cookie-popup-link:focus {
    text-decoration: underline;
}

.cookie-popup-buttons-block {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding-top: 8px;
}

.cookie-popup-submit-button,
.cookie-popup-deny-button {
    font-size: 16px;
    padding: 12px 20px;
    border-radius: 3px;
    border: solid 1px var(--base-button-background);
}

.cookie-popup-submit-button {
    background-color: var(--base-button-background);
    color: var(--base-button-color);
}

.cookie-popup-submit-button:hover,
.cookie-popup-submit-button:focus {
    border: solid 1px var(--base-button-background-hover);
    background-color: var(--base-button-background-hover);
    color: var(--base-button-color-hover);
}

.cookie-popup-deny-button {
    background-color: transparent;
    color: var(--base-button-background);
}

.cookie-popup-deny-button:hover,
.cookie-popup-deny-button:focus {
    border: solid 1px var(--base-button-background-hover);
    background-color: var(--base-button-background-hover);
    color: var(--base-button-color-hover);
}