dialog#cookies__accept { 
    .cookies {
        padding: .5rem 0 0 0;
    }
    .cookies__accept__header {
        text-align: center;
        font-size: 2rem;
        font-weight: 600;
        margin-bottom: .5rem;
        + p {
            font-weight: 300;
            text-align: center;
        }
    }
    margin: auto;
    border-radius: 1rem;
    padding: 1.5rem;
    border: none;
    opacity: 0;
    width: min(calc( 100vw - 30px ), 800px);
    transform: scale(0.8);
    transition:
        opacity 0.1s ease-out,
        transform 0.1s ease-out,
        overlay 0.1s ease-out allow-discrete,
        display 0.1s ease-out allow-discrete;
    &:open {
        opacity: 1;
        transform: scaleY(1);
    }
    .cookies__accept__choice {
        display: flex;
        justify-content: space-evenly;
        flex-direction: column;
        @media (min-width : 768px) {  
            flex-direction: row;
        }
        row-gap: .5rem;
        column-gap: .5rem;
        margin-bottom: 1rem;
        a {
            cursor: pointer;
            border: 1px solid !important;
            padding: .5rem .75rem !important;
            background-color: #676767 !important;
            color: #FFFFFF !important;
            text-decoration: none !important;
            font-weight: 500;
            &:link,
                &:visited {
            }
            &:active,
                &:hover {
                background-color: #353535 !important;
            }
        }
    }
    #cookies__accept__details {
        margin-top: 2rem;
        > a {
            display: block;
            margin-top: 1rem;
            cursor: pointer;
            border: 1px solid !important;
            padding: .5rem !important;
            background-color: #cdcdcd !important;
            color: #000000 !important;
            text-decoration: none !important;
            text-align: center;
            &:link,
                &:visited {
            }
            &:active,
                &:hover {
                background-color: #efefef !important;
            }
        }

    }
    
    .cookies__accept__checkbox {
        display: flex;
        column-gap: .30rem;
        align-items: center;
        margin: 0 0 .5rem 0;
        &:not(:first-child) {
        margin: 1rem 0 .5rem 0;
        }
        > * {
            margin: 0 0 0 0;
        }
        label {
            display: inline-block;
            max-width: 100%;
            font-weight: 700;
            font-size: 1.25rem;
        }
    }
    
    input[type=checkbox] {
        appearance: none;
        width: 1.25rem;
        height: 1.25rem;
        background-color: transparent;
        border-radius: 2px;
        border: 2px solid #000000;
        position: relative;
        &:focus {
            outline: thin dotted;
            outline: 5px auto -webkit-focus-ring-color;
            outline-offset: 3px;
        }
        &:checked::before {
            position: absolute;
            inset: 0;
            content: "";
            background-image: url("data:image/svg+xml,%3Csvg fill='%23000000' width='800px' height='800px' viewBox='-3.5 0 19 19' xmlns='http://www.w3.org/2000/svg' class='cf-icon-svg'%3E%3Cpath d='M4.63 15.638a1.028 1.028 0 0 1-.79-.37L.36 11.09a1.03 1.03 0 1 1 1.58-1.316l2.535 3.043L9.958 3.32a1.029 1.029 0 0 1 1.783 1.03L5.52 15.122a1.03 1.03 0 0 1-.803.511.89.89 0 0 1-.088.004z'/%3E%3C/svg%3E");
            background-size: contain;
        }
    }
} 

@starting-style {
    dialog#cookies__accept:open {
        opacity: 0;
        transform: scale(0);
    }
    dialog#cookies__accept:open::backdrop {
        background-color: rgba(0, 0, 0, 0%);
    }
}

dialog#cookies__accept::backdrop {
    background-color: rgba(0, 0, 0, 50%);
}

dialog#cookies__accept:open::backdrop {
    background-color: rgba(0, 0, 0, 50%);
}