/* =========================================================
   CARIPULSE COOKIE CONSENT
========================================================= */

.cookie-consent,
.cookie-preferences{
    font-family:'Poppins',sans-serif;
}


/* =========================================================
   COOKIE BANNER
========================================================= */

.cookie-consent{
    position:fixed;

    left:0;
    right:0;
    bottom:0;

    z-index:9998;

    width:100%;

    padding:22px 0;

    background:#ffffff;

    border-top:1px solid #e7ebf2;
}

.cookie-consent[hidden]{
    display:none !important;
}

.cookie-consent-inner{
    width:90%;
    max-width:1400px;

    margin:0 auto;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:45px;
}


/* =========================================================
   BANNER CONTENT
========================================================= */

.cookie-consent-copy{
    flex:1;
    min-width:0;
}

.cookie-consent-brand{
    display:flex;
    align-items:center;

    gap:10px;

    margin-bottom:9px;

    color:#FF0F7B;

    font-size:11px;
    line-height:1.3;
    font-weight:700;

    letter-spacing:1.6px;
}

.cookie-consent-icon{
    width:28px;
    height:28px;

    display:flex;
    align-items:center;
    justify-content:center;

    flex-shrink:0;

    border-radius:50%;

    background:linear-gradient(
        135deg,
        #FF2F75,
        #FF9D1C
    );

    color:#ffffff;

    font-size:12px;
}

.cookie-consent-copy h2{
    margin:0 0 8px;

    color:#081221;

    font-size:24px;
    line-height:1.2;
    font-weight:800;
}

.cookie-consent-copy h2 span{
    background:linear-gradient(
        90deg,
        #FF2F75,
        #FF9D1C
    );

    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;

    background-clip:text;
    color:transparent;
}

.cookie-consent-copy p{
    max-width:760px;

    margin:0 0 8px;

    color:#687280;

    font-size:13px;
    line-height:1.65;
}

.cookie-policy-link{
    display:inline-flex;
    align-items:center;

    gap:7px;

    color:#FF0F7B;

    font-size:12px;
    font-weight:700;

    text-decoration:none;
}

.cookie-policy-link i{
    font-size:10px;

    transition:transform .25s ease;
}

.cookie-policy-link:hover i{
    transform:translateX(4px);
}


/* =========================================================
   BANNER ACTIONS
========================================================= */

.cookie-consent-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;

    flex-wrap:wrap;

    gap:12px;

    flex-shrink:0;
}


/* =========================================================
   COOKIE BUTTONS
========================================================= */

.cookie-btn{
    min-height:46px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:12px 20px;

    border-radius:30px;

    font-family:'Poppins',sans-serif;

    font-size:12px;
    line-height:1.2;
    font-weight:700;

    cursor:pointer;

    transition:
        transform .25s ease,
        background .25s ease,
        border-color .25s ease,
        color .25s ease;
}

.cookie-btn:hover{
    transform:translateY(-2px);
}

.cookie-btn-primary{
    border:1px solid transparent;

    background:linear-gradient(
        90deg,
        #FF2F75,
        #FF9D1C
    );

    color:#ffffff;
}

.cookie-btn-secondary{
    border:1px solid #dce2eb;

    background:#ffffff;

    color:#081221;
}

.cookie-btn-secondary:hover{
    border-color:#081221;
}


/* =========================================================
   COOKIE PREFERENCES OVERLAY
========================================================= */

.cookie-preferences{
    position:fixed;

    inset:0;

    z-index:9999;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:30px;

    background:rgba(8,18,33,.62);

    opacity:0;
    visibility:hidden;

    pointer-events:none;

    transition:
        opacity .25s ease,
        visibility .25s ease;
}

.cookie-preferences.is-open{
    opacity:1;
    visibility:visible;

    pointer-events:auto;
}


/* =========================================================
   PREFERENCES PANEL
========================================================= */

.cookie-preferences-panel{
    width:100%;
    max-width:680px;
    max-height:calc(100vh - 60px);

    overflow-y:auto;
    overscroll-behavior:contain;

    padding:34px;

    border-radius:26px;

    background:#ffffff;

    transform:translateY(18px) scale(.985);

    transition:transform .3s cubic-bezier(.22,1,.36,1);
}

.cookie-preferences.is-open .cookie-preferences-panel{
    transform:translateY(0) scale(1);
}


/* =========================================================
   PREFERENCES HEADER
========================================================= */

.cookie-preferences-header{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;

    gap:25px;

    margin-bottom:18px;
}

.cookie-preferences-eyebrow{
    display:block;

    margin-bottom:8px;

    color:#FF0F7B;

    font-size:11px;
    font-weight:700;

    letter-spacing:1.6px;
}

.cookie-preferences-header h2{
    margin:0;

    color:#081221;

    font-size:32px;
    line-height:1.2;
    font-weight:800;
}

.cookie-preferences-header h2 span{
    background:linear-gradient(
        90deg,
        #FF2F75,
        #FF9D1C
    );

    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;

    background-clip:text;
    color:transparent;
}

.cookie-preferences-close{
    width:42px;
    height:42px;

    display:flex;
    align-items:center;
    justify-content:center;

    flex-shrink:0;

    padding:0;

    border:1px solid #e1e6ed;
    border-radius:50%;

    background:#ffffff;

    color:#081221;

    font-size:17px;

    cursor:pointer;

    transition:
        border-color .25s ease,
        color .25s ease,
        transform .25s ease;
}

.cookie-preferences-close:hover{
    border-color:#FF0F7B;

    color:#FF0F7B;

    transform:rotate(5deg);
}


/* =========================================================
   INTRODUCTION
========================================================= */

.cookie-preferences-intro{
    margin-bottom:24px;
}

.cookie-preferences-intro p{
    margin:0;

    color:#687280;

    font-size:14px;
    line-height:1.7;
}


/* =========================================================
   COOKIE CATEGORIES
========================================================= */

.cookie-category{
    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:24px;

    padding:20px 0;

    border-top:1px solid #e7ebf2;
}

.cookie-category-copy{
    flex:1;
    min-width:0;
}

.cookie-category-heading{
    display:flex;
    align-items:center;

    flex-wrap:wrap;

    gap:10px;

    margin-bottom:6px;
}

.cookie-category h3{
    margin:0;

    color:#081221;

    font-size:17px;
    line-height:1.3;
    font-weight:700;
}

.cookie-category p{
    max-width:520px;

    margin:0;

    color:#687280;

    font-size:13px;
    line-height:1.65;
}

.cookie-required{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:5px 9px;

    border-radius:20px;

    background:#eef7f4;

    color:#17845c;

    font-size:10px;
    line-height:1;
    font-weight:700;

    letter-spacing:.3px;
}


/* =========================================================
   COOKIE SWITCH
========================================================= */

.cookie-switch{
    position:relative;

    width:50px;
    height:28px;

    display:block;

    flex:0 0 50px;

    cursor:pointer;
}

.cookie-switch input{
    position:absolute;

    width:1px;
    height:1px;

    opacity:0;
}

.cookie-switch-slider{
    position:absolute;

    inset:0;

    border-radius:30px;

    background:#d9dee7;

    transition:background .25s ease;
}

.cookie-switch-slider::before{
    content:"";

    position:absolute;

    width:20px;
    height:20px;

    left:4px;
    top:4px;

    border-radius:50%;

    background:#ffffff;

    transition:transform .25s ease;
}

.cookie-switch input:checked + .cookie-switch-slider{
    background:linear-gradient(
        90deg,
        #FF2F75,
        #FF9D1C
    );
}

.cookie-switch input:checked + .cookie-switch-slider::before{
    transform:translateX(22px);
}

.cookie-switch input:focus-visible + .cookie-switch-slider{
    outline:3px solid rgba(255,15,123,.20);
    outline-offset:3px;
}


/* =========================================================
   PREFERENCES FOOTER
========================================================= */

.cookie-preferences-footer{
    display:flex;
    align-items:center;
    justify-content:flex-end;

    flex-wrap:wrap;

    gap:12px;

    padding-top:24px;

    border-top:1px solid #e7ebf2;
}


/* =========================================================
   TABLET
========================================================= */

@media(max-width:1100px){

    .cookie-consent{
        padding:20px 0;
    }

    .cookie-consent-inner{
        align-items:flex-start;

        gap:28px;
    }

    .cookie-consent-copy p{
        max-width:650px;
    }

    .cookie-consent-actions{
        max-width:360px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:768px){

    .cookie-consent{
        padding:20px 0;
    }

    .cookie-consent-inner{
        width:90%;

        flex-direction:column;
        align-items:stretch;

        gap:20px;
    }

    .cookie-consent-copy h2{
        font-size:22px;
    }

    .cookie-consent-copy p{
        max-width:none;

        font-size:13px;
    }

    .cookie-consent-actions{
        width:100%;
        max-width:none;

        display:grid;

        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap:10px;
    }

    .cookie-consent-actions
    .cookie-btn-primary{
        grid-column:1 / -1;
    }

    .cookie-btn{
        width:100%;
    }

    .cookie-preferences{
        align-items:flex-end;

        padding:18px;
    }

    .cookie-preferences-panel{
        max-width:600px;
        max-height:calc(100vh - 36px);

        padding:28px 24px;

        border-radius:24px;
    }

    .cookie-preferences-header h2{
        font-size:28px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media(max-width:520px){

    .cookie-consent{
        padding:18px 0;
    }

    .cookie-consent-inner{
        width:92%;

        gap:18px;
    }

    .cookie-consent-brand{
        margin-bottom:8px;

        font-size:10px;
    }

    .cookie-consent-copy h2{
        font-size:21px;
    }

    .cookie-consent-copy p{
        font-size:12px;
        line-height:1.6;
    }

    .cookie-consent-actions{
        grid-template-columns:1fr;
    }

    .cookie-consent-actions
    .cookie-btn-primary{
        grid-column:auto;
    }

    .cookie-btn{
        min-height:44px;

        padding:11px 16px;

        font-size:11px;
    }

    .cookie-preferences{
        padding:10px;
    }

    .cookie-preferences-panel{
        max-height:calc(100vh - 20px);

        padding:25px 20px;

        border-radius:20px;
    }

    .cookie-preferences-header{
        gap:18px;
    }

    .cookie-preferences-header h2{
        font-size:25px;
    }

    .cookie-preferences-close{
        width:38px;
        height:38px;

        font-size:15px;
    }

    .cookie-category{
        gap:18px;

        padding:18px 0;
    }

    .cookie-category h3{
        font-size:16px;
    }

    .cookie-category p{
        font-size:12px;
        line-height:1.6;
    }

    .cookie-preferences-footer{
        flex-direction:column;

        align-items:stretch;
    }

}


/* =========================================================
   VERY SMALL MOBILE
========================================================= */

@media(max-width:380px){

    .cookie-consent-inner{
        width:94%;
    }

    .cookie-consent-copy h2{
        font-size:20px;
    }

    .cookie-preferences-panel{
        padding:22px 18px;
    }

    .cookie-preferences-header h2{
        font-size:23px;
    }

    .cookie-category{
        gap:14px;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media(prefers-reduced-motion:reduce){

    .cookie-btn,
    .cookie-policy-link i,
    .cookie-preferences,
    .cookie-preferences-panel,
    .cookie-preferences-close,
    .cookie-switch-slider,
    .cookie-switch-slider::before{
        transition:none;
    }

}


/* =========================================================
   CARIPULSE COOKIE CONSENT
   FINAL RESPONSIVE LAYOUT OVERRIDES
========================================================= */


/* =========================================================
   DESKTOP BANNER
========================================================= */

.cookie-consent{
    padding:18px 0;
}

.cookie-consent-inner{
    width:90%;
    max-width:1400px;

    display:grid;
    grid-template-columns:minmax(0,1fr) auto;

    align-items:center;

    gap:40px;
}

.cookie-consent-copy h2{
    margin:0 0 6px;

    font-size:23px;
}

.cookie-consent-copy p{
    max-width:780px;

    margin:0 0 6px;

    font-size:12px;
    line-height:1.55;
}

.cookie-policy-link{
    font-size:11px;
}

.cookie-consent-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;

    flex-wrap:nowrap;

    gap:10px;
}

.cookie-consent-actions .cookie-btn{
    width:auto;

    min-height:44px;

    padding:11px 20px;

    white-space:nowrap;
}


/* =========================================================
   PREFERENCES OVERLAY
========================================================= */

.cookie-preferences{
    align-items:center;

    padding:
        max(24px, env(safe-area-inset-top))
        24px
        max(24px, env(safe-area-inset-bottom));

    overflow-y:auto;
}


/* =========================================================
   PREFERENCES PANEL
========================================================= */

.cookie-preferences-panel{
    width:min(680px, 100%);

    max-height:calc(100dvh - 48px);

    margin:auto;

    padding:30px 34px;

    overflow-y:auto;

    overscroll-behavior:contain;

    scrollbar-width:thin;

    border-radius:24px;
}


/* =========================================================
   PREFERENCES HEADER
========================================================= */

.cookie-preferences-header{
    position:relative;

    margin-bottom:14px;

    padding-right:50px;
}

.cookie-preferences-eyebrow{
    margin-bottom:6px;

    font-size:10px;
}

.cookie-preferences-header h2{
    font-size:29px;
}

.cookie-preferences-close{
    position:absolute;

    top:0;
    right:0;
}


/* =========================================================
   PREFERENCES INTRO
========================================================= */

.cookie-preferences-intro{
    margin-bottom:18px;
}

.cookie-preferences-intro p{
    font-size:13px;
    line-height:1.6;
}


/* =========================================================
   PREFERENCE CATEGORIES
========================================================= */

.cookie-category{
    gap:22px;

    padding:16px 0;
}

.cookie-category h3{
    font-size:16px;
}

.cookie-category p{
    font-size:12px;
    line-height:1.55;
}


/* =========================================================
   PREFERENCES ACTIONS
========================================================= */

.cookie-preferences-footer{
    position:sticky;

    bottom:-30px;

    z-index:2;

    margin:
        4px -34px
        -30px;

    padding:
        18px 34px
        30px;

    background:#ffffff;

    border-top:1px solid #e7ebf2;
}

.cookie-preferences-footer .cookie-btn{
    min-height:44px;
}


/* =========================================================
   LAPTOP / SMALL DESKTOP
========================================================= */

@media(max-width:1200px){

    .cookie-consent-inner{
        gap:28px;
    }

    .cookie-consent-copy p{
        max-width:650px;
    }

    .cookie-consent-actions{
        display:grid;

        grid-template-columns:
            repeat(2,max-content);
    }

    .cookie-consent-actions .cookie-btn-primary{
        grid-column:1 / -1;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media(max-width:900px){

    .cookie-consent{
        padding:18px 0;
    }

    .cookie-consent-inner{
        width:90%;

        display:flex;
        flex-direction:column;
        align-items:stretch;

        gap:16px;
    }

    .cookie-consent-copy h2{
        font-size:22px;
    }

    .cookie-consent-copy p{
        max-width:none;
    }

    .cookie-consent-actions{
        width:100%;

        display:grid;

        grid-template-columns:
            repeat(3,minmax(0,1fr));

        gap:10px;
    }

    .cookie-consent-actions .cookie-btn,
    .cookie-consent-actions .cookie-btn-primary{
        width:100%;

        grid-column:auto;
    }


    /* Preferences */

    .cookie-preferences{
        padding:20px;
    }

    .cookie-preferences-panel{
        width:min(650px,100%);

        max-height:calc(100dvh - 40px);

        padding:28px;
    }

    .cookie-preferences-footer{
        bottom:-28px;

        margin:
            4px -28px
            -28px;

        padding:
            18px 28px
            28px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:600px){

    .cookie-consent{
        padding:
            16px 0
            max(16px, env(safe-area-inset-bottom));
    }

    .cookie-consent-inner{
        width:92%;

        gap:15px;
    }

    .cookie-consent-copy h2{
        margin-bottom:7px;

        font-size:21px;
    }

    .cookie-consent-copy p{
        margin-bottom:7px;

        font-size:12px;
        line-height:1.55;
    }

    .cookie-policy-link{
        font-size:11px;
    }

    .cookie-consent-actions{
        grid-template-columns:1fr;

        gap:8px;
    }

    .cookie-consent-actions .cookie-btn{
        min-height:43px;

        padding:10px 14px;
    }


    /* Preferences */

    .cookie-preferences{
        align-items:flex-end;

        padding:
            10px
            10px
            max(10px, env(safe-area-inset-bottom));
    }

    .cookie-preferences-panel{
        width:100%;

        max-height:calc(
            100dvh -
            20px -
            env(safe-area-inset-bottom)
        );

        margin:auto 0 0;

        padding:22px 18px;

        border-radius:20px;
    }

    .cookie-preferences-header{
        margin-bottom:12px;

        padding-right:45px;
    }

    .cookie-preferences-eyebrow{
        font-size:9px;
    }

    .cookie-preferences-header h2{
        font-size:24px;
    }

    .cookie-preferences-close{
        width:38px;
        height:38px;

        font-size:15px;
    }

    .cookie-preferences-intro{
        margin-bottom:14px;
    }

    .cookie-preferences-intro p{
        font-size:12px;
        line-height:1.55;
    }

    .cookie-category{
        gap:16px;

        padding:14px 0;
    }

    .cookie-category h3{
        font-size:15px;
    }

    .cookie-category p{
        font-size:11px;
        line-height:1.5;
    }

    .cookie-required{
        padding:4px 7px;

        font-size:9px;
    }

    .cookie-switch{
        width:46px;
        height:26px;

        flex-basis:46px;
    }

    .cookie-switch-slider::before{
        width:18px;
        height:18px;
    }

    .cookie-switch input:checked +
    .cookie-switch-slider::before{
        transform:translateX(20px);
    }

    .cookie-preferences-footer{
        bottom:-22px;

        margin:
            2px -18px
            -22px;

        padding:
            14px 18px
            calc(
                22px +
                env(safe-area-inset-bottom)
            );

        display:grid;

        grid-template-columns:1fr;

        gap:8px;
    }

    .cookie-preferences-footer .cookie-btn{
        width:100%;

        min-height:42px;
    }

}


/* =========================================================
   VERY SMALL MOBILE
========================================================= */

@media(max-width:380px){

    .cookie-consent-inner{
        width:94%;
    }

    .cookie-consent-copy h2{
        font-size:20px;
    }

    .cookie-preferences{
        padding:6px;
    }

    .cookie-preferences-panel{
        max-height:calc(
            100dvh -
            12px -
            env(safe-area-inset-bottom)
        );

        padding:20px 16px;

        border-radius:18px;
    }

    .cookie-preferences-header h2{
        font-size:22px;
    }

    .cookie-category{
        gap:12px;

        padding:12px 0;
    }

    .cookie-preferences-footer{
        bottom:-20px;

        margin:
            2px -16px
            -20px;

        padding:
            12px 16px
            calc(
                20px +
                env(safe-area-inset-bottom)
            );
    }

}


/* =========================================================
   COOKIE CONSENT GLOBAL STACKING LAYER
========================================================= */

.cookie-consent{
    z-index:2147483646 !important;
}

.cookie-preferences{
    z-index:2147483647 !important;
}


