/* =========================================================
   BOOSTPME — COOKIE CONSENT
   Keltoum conversation
========================================================= */

.boost-cookie-consent {
    position: fixed;

    z-index: 999999;

    right: 24px;
    bottom: 24px;

    width: min(
        420px,
        calc(100vw - 32px)
    );

    opacity: 0;

    visibility: hidden;

    transform:
        translateY(25px)
        scale(.97);

    transition:
        opacity .35s ease,
        transform .35s ease,
        visibility .35s ease;

    pointer-events: none;
}


.boost-cookie-consent.is-visible {
    opacity: 1;

    visibility: visible;

    transform: none;

    pointer-events: auto;
}


/* =========================================================
   CARD
========================================================= */

.boost-cookie-card {
    overflow: hidden;

    border:
        1px solid
        rgba(30, 30, 40, .08);

    border-radius: 24px;

    background:
        rgba(255, 255, 255, .94);

    box-shadow:
        0 30px 90px
        rgba(25, 20, 45, .18);

    backdrop-filter:
        blur(22px);
}


/* =========================================================
   HEADER
========================================================= */

.boost-cookie-head {
    min-height: 70px;

    display: flex;

    align-items: center;
    justify-content: space-between;

    padding:
        0
        20px;

    border-bottom:
        1px solid
        rgba(30, 30, 40, .06);
}


.boost-cookie-agent {
    display: flex;

    align-items: center;

    gap: 10px;
}


.boost-cookie-agent img {
    width: 39px;
    height: 39px;

    border-radius: 50%;

    object-fit: cover;

    box-shadow:
        0 8px 20px
        rgba(50, 35, 100, .12);
}


.boost-cookie-agent > div {
    display: flex;

    flex-direction: column;

    gap: 2px;
}


.boost-cookie-agent strong {
    color: #28272f;

    font-size: 11px;
}


.boost-cookie-agent span {
    color: #9997a2;

    font-size: 7px;
}


.boost-cookie-close {
    width: 31px;
    height: 31px;

    display: flex;

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

    border: 0;

    border-radius: 50%;

    background: #f2f1f5;

    color: #777580;

    cursor: pointer;

    font-size: 17px;

    line-height: 1;
}


/* =========================================================
   BODY
========================================================= */

.boost-cookie-body {
    padding: 19px;
}


/* =========================================================
   MESSAGE
========================================================= */

.boost-cookie-message {
    position: relative;

    padding:
        15px
        16px;

    border:
        1px solid
        rgba(110, 85, 190, .07);

    border-radius:
        6px
        17px
        17px
        17px;

    background:
        linear-gradient(
            145deg,
            #f2effa,
            #ffffff
        );

    box-shadow:
        0 10px 30px
        rgba(40, 25, 80, .05);
}


.boost-cookie-message > span {
    display: block;

    margin-bottom: 6px;

    color: #8461cc;

    font-size: 7px;

    font-weight: 800;

    letter-spacing: .8px;
}


.boost-cookie-message p {
    min-height: 72px;

    margin: 0;

    color: #302c34;

    font-size: 10px;

    line-height: 1.65;
}


/* =========================================================
   STATUS
========================================================= */

.boost-cookie-mini-status {
    display: flex;

    align-items: center;

    gap: 7px;

    margin:
        12px
        3px
        16px;

    color: #8a8790;

    font-size: 7px;
}


.boost-cookie-mini-status i {
    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: #72b94b;

    box-shadow:
        0 0 9px
        rgba(114, 185, 75, .4);
}


/* =========================================================
   ACTIONS
========================================================= */

.boost-cookie-actions {
    display: grid;

    grid-template-columns:
        1fr
        1fr;

    gap: 8px;
}


.boost-cookie-actions button,
.boost-cookie-save {
    min-height: 43px;

    border: 0;

    border-radius: 11px;

    cursor: pointer;

    font-size: 8px;

    font-weight: 800;

    transition:
        transform .2s ease,
        box-shadow .2s ease;
}


.boost-cookie-actions button:hover,
.boost-cookie-save:hover {
    transform:
        translateY(-1px);
}


.boost-cookie-accept {
    background:
        linear-gradient(
            90deg,
            #657cff,
            #9561ff
        );

    color: #fff;

    box-shadow:
        0 10px 25px
        rgba(110, 90, 230, .16);
}


.boost-cookie-reject {
    border:
        1px solid
        #e1e0e6 !important;

    background: #f8f8fa;

    color: #494750;
}


.boost-cookie-customize {
    grid-column:
        1 / -1;

    background: transparent;

    color: #7560bd;
}


/* =========================================================
   SETTINGS
========================================================= */

.boost-cookie-settings {
    display: grid;

    gap: 8px;
}


.boost-cookie-setting {
    min-height: 62px;

    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 14px;

    padding:
        12px
        13px;

    border:
        1px solid
        #e7e6ea;

    border-radius: 12px;

    background: #fafafd;
}


.boost-cookie-setting > div {
    display: flex;

    flex-direction: column;

    gap: 3px;
}


.boost-cookie-setting strong {
    color: #36343c;

    font-size: 9px;
}


.boost-cookie-setting small {
    color: #8d8a94;

    font-size: 7px;

    line-height: 1.5;
}


.boost-cookie-setting > span {
    color: #6e9d58;

    font-size: 7px;

    font-weight: 800;

    white-space: nowrap;
}


.boost-cookie-setting input {
    width: 17px;
    height: 17px;

    accent-color: #8462d6;
}


.boost-cookie-save {
    margin-top: 4px;

    background: #18191f;

    color: #fff;
}


/* =========================================================
   LINKS
========================================================= */

.boost-cookie-links {
    margin-top: 13px;

    text-align: center;
}


.boost-cookie-links a {
    color: #817e88;

    font-size: 7px;

    text-decoration: underline;

    text-underline-offset: 3px;
}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:600px) {

    .boost-cookie-consent {
        right: 16px;
        bottom: 16px;

        width:
            calc(100vw - 32px);
    }


    .boost-cookie-card {
        border-radius: 20px;
    }


    .boost-cookie-body {
        padding: 16px;
    }


    .boost-cookie-message p {
        min-height: 90px;
    }


    .boost-cookie-actions {
        grid-template-columns: 1fr;
    }


    .boost-cookie-customize {
        grid-column: auto;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media(
    prefers-reduced-motion: reduce
) {

    .boost-cookie-consent,
    .boost-cookie-actions button {
        transition: none;
    }

}