/* 霧小蒜の小窩 | https://ciallovo.top */
#cookie-consent {
    position: fixed;
    right: 0;
    bottom: 20px;
    width: 30%;
    max-width: 360px;
    min-width: 200px;
    background: var(--blue_80);
    border: 1px solid var(--blue_20);
    border-right: none;
    border-radius: 8px 0 0 8px;
    z-index: 9999;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    -webkit-animation: cookie-slide-in 0.5s ease forwards;
    animation: cookie-slide-in 0.5s ease forwards;
}

.cookie-consent__content {
    padding: 12px 16px;
}

.cookie-consent__content p {
    font-size: 0.8em;
    line-height: 1.5em;
    color: var(--white_90);
    margin: 0 0 10px 0;
}

.cookie-consent__content a {
    color: var(--brown);
    text-decoration: none;
}

.cookie-consent__content a:hover {
    color: var(--brown_dark);
}

@keyframes cookie-slide-in {
    from {
        opacity: 0;
        transform: translateX(100%);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes cookie-slide-up {
    from {
        opacity: 0;
        transform: translateY(100%);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes cookie-slide-out {
    from {
        opacity: 1;
        transform: translateX(0);
    }
    to {
        opacity: 0;
        transform: translateX(100%);
    }
}

@keyframes cookie-slide-down {
    from {
        opacity: 1;
        transform: translateY(0);
    }
    to {
        opacity: 0;
        transform: translateY(100%);
    }
}

@-webkit-keyframes cookie-slide-in {
    from {
        opacity: 0;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
    }
    to {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@-webkit-keyframes cookie-slide-up {
    from {
        opacity: 0;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
    }
    to {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@-webkit-keyframes cookie-slide-out {
    from {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    to {
        opacity: 0;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
    }
}

@-webkit-keyframes cookie-slide-down {
    from {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    to {
        opacity: 0;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
    }
}

@media (max-width: 768px) {
    #cookie-consent {
        width: auto;
        right: 10px;
        bottom: 10px;
        left: 10px;
        max-width: none;
        min-width: 0;
        border-radius: 8px;
        border-right: 1px solid var(--blue_20);
        -webkit-animation: cookie-slide-up 0.5s ease forwards;
        animation: cookie-slide-up 0.5s ease forwards;
    }
}