
/* =====================================================
   Shireen M Property
   v1.1.1-r3.2
   Back-to-top + subtle cookie consent
===================================================== */


/* -----------------------------------------------------
   BACK TO TOP
----------------------------------------------------- */

#sm-back-to-top {
    position: fixed;

    left: 20px;
    bottom: 20px;

    z-index: 1350;

    width: 42px;
    height: 42px;

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

    padding: 0;

    border:
        1px solid
        rgba(183,119,121,.32);

    border-radius: 50%;

    background:
        rgba(247,243,238,.93);

    color:
        #965f62;

    box-shadow:
        0 9px 28px
        rgba(37,33,31,.11);

    backdrop-filter:
        blur(12px);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        18px;

    cursor: pointer;

    opacity: 0;
    visibility: hidden;

    transform:
        translateY(8px);

    transition:
        opacity .22s ease,
        visibility .22s ease,
        transform .22s ease,
        background .2s ease,
        color .2s ease;
}


#sm-back-to-top.sm-visible {
    opacity: .86;
    visibility: visible;

    transform: none;
}


#sm-back-to-top:hover {
    opacity: 1;

    background:
        #b77779;

    color:
        #fff;
}


#sm-back-to-top svg {
    width: 17px;
    height: 17px;
}


/* -----------------------------------------------------
   COOKIE SETTINGS BUTTON
----------------------------------------------------- */

#sm-cookie-settings {
    position: fixed;

    left: 70px;
    bottom: 23px;

    z-index: 1340;

    min-height: 35px;

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

    padding:
        0 12px;

    border:
        1px solid
        rgba(37,33,31,.10);

    border-radius:
        30px;

    background:
        rgba(247,243,238,.90);

    color:
        rgba(37,33,31,.67);

    box-shadow:
        0 7px 24px
        rgba(37,33,31,.07);

    backdrop-filter:
        blur(12px);

    font-size:
        9px;

    font-weight:
        700;

    letter-spacing:
        .06em;

    text-transform:
        uppercase;

    cursor: pointer;

    transition:
        color .2s ease,
        background .2s ease;
}


#sm-cookie-settings:hover {
    background:
        #fff;

    color:
        #965f62;
}


/* -----------------------------------------------------
   COOKIE NOTICE
----------------------------------------------------- */

#sm-cookie-consent {
    position: fixed;

    z-index: 2500;

    left: 50%;
    bottom: 20px;

    width:
        min(
            calc(100% - 32px),
            610px
        );

    transform:
        translateX(-50%);

    padding:
        18px 20px;

    border:
        1px solid
        rgba(200,169,107,.24);

    border-radius:
        4px;

    background:
        rgba(31,27,25,.965);

    color:
        rgba(255,255,255,.76);

    box-shadow:
        0 16px 48px
        rgba(0,0,0,.22);

    backdrop-filter:
        blur(16px);
}


#sm-cookie-consent[hidden],
#sm-cookie-settings[hidden],
#sm-cookie-policy[hidden] {
    display:
        none !important;
}


.sm-cookie-layout {
    display:
        grid;

    grid-template-columns:
        1fr auto;

    gap:
        18px;

    align-items:
        center;
}


.sm-cookie-copy strong {
    display:
        block;

    margin-bottom:
        5px;

    color:
        #fff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        16px;

    font-weight:
        400;
}


.sm-cookie-copy p {
    margin:
        0;

    color:
        rgba(255,255,255,.58);

    font-size:
        11px;

    line-height:
        1.6;
}


.sm-cookie-copy button {
    margin:
        7px 0 0;

    padding:
        0;

    border:
        0;

    background:
        transparent;

    color:
        #d8b483;

    font-size:
        10px;

    cursor:
        pointer;

    text-decoration:
        underline;

    text-underline-offset:
        3px;
}


.sm-cookie-actions {
    display:
        flex;

    gap:
        7px;
}


.sm-cookie-choice {
    min-width:
        59px;

    height:
        35px;

    padding:
        0 13px;

    border-radius:
        3px;

    font-size:
        11px;

    font-weight:
        800;

    cursor:
        pointer;
}


.sm-cookie-yes {
    border:
        1px solid
        #b77779;

    background:
        #b77779;

    color:
        #fff;
}


.sm-cookie-yes:hover {
    background:
        #965f62;

    border-color:
        #965f62;
}


.sm-cookie-no {
    border:
        1px solid
        rgba(255,255,255,.22);

    background:
        transparent;

    color:
        rgba(255,255,255,.78);
}


.sm-cookie-no:hover {
    border-color:
        rgba(255,255,255,.44);

    color:
        #fff;
}


/* -----------------------------------------------------
   COOKIE POLICY PANEL
----------------------------------------------------- */

#sm-cookie-policy {
    position: fixed;

    z-index: 2600;

    inset: 0;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    padding:
        20px;

    background:
        rgba(20,17,15,.58);

    backdrop-filter:
        blur(5px);
}


.sm-cookie-policy-card {
    position:
        relative;

    width:
        min(
            100%,
            560px
        );

    max-height:
        min(
            720px,
            calc(100vh - 40px)
        );

    overflow-y:
        auto;

    padding:
        34px;

    border:
        1px solid
        rgba(200,169,107,.22);

    border-radius:
        4px;

    background:
        #f7f3ee;

    color:
        #25211f;

    box-shadow:
        0 24px 70px
        rgba(0,0,0,.24);
}


.sm-cookie-policy-card
.sm-cookie-policy-eyebrow {
    color:
        #965f62;

    font-size:
        9px;

    font-weight:
        800;

    letter-spacing:
        .18em;

    text-transform:
        uppercase;
}


.sm-cookie-policy-card h2 {
    margin:
        10px 0
        18px;

    color:
        #25211f;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        31px;

    font-weight:
        400;
}


.sm-cookie-policy-card h3 {
    margin:
        22px 0
        6px;

    font-size:
        13px;
}


.sm-cookie-policy-card p {
    margin:
        0;

    color:
        #6f6661;

    font-size:
        12px;

    line-height:
        1.75;
}


.sm-cookie-policy-close {
    position:
        absolute;

    top:
        15px;
    right:
        15px;

    width:
        34px;
    height:
        34px;

    border:
        0;

    border-radius:
        50%;

    background:
        rgba(37,33,31,.06);

    color:
        #25211f;

    font-size:
        20px;

    cursor:
        pointer;
}


.sm-cookie-policy-footer {
    margin-top:
        27px;

    padding-top:
        18px;

    border-top:
        1px solid
        rgba(37,33,31,.10);
}


.sm-cookie-policy-footer button {
    min-height:
        40px;

    padding:
        0 17px;

    border:
        0;

    border-radius:
        3px;

    background:
        #25211f;

    color:
        #fff;

    font-size:
        11px;

    font-weight:
        800;

    cursor:
        pointer;
}


/* Hide controls while consent prompt is open */

body.sm-cookie-open
#sm-back-to-top,

body.sm-cookie-open
#sm-cookie-settings {
    opacity:
        0 !important;

    pointer-events:
        none !important;
}


/* -----------------------------------------------------
   MOBILE
----------------------------------------------------- */

@media (max-width: 650px) {

    #sm-back-to-top {
        left:
            14px;

        bottom:
            14px;

        width:
            40px;

        height:
            40px;
    }


    #sm-cookie-settings {
        left:
            62px;

        bottom:
            17px;

        min-height:
            33px;

        padding:
            0 10px;
    }


    #sm-cookie-consent {
        bottom:
            13px;

        width:
            calc(100% - 26px);

        padding:
            16px;
    }


    .sm-cookie-layout {
        grid-template-columns:
            1fr;

        gap:
            13px;
    }


    .sm-cookie-actions {
        justify-content:
            flex-end;
    }


    .sm-cookie-choice {
        min-width:
            67px;
    }


    .sm-cookie-policy-card {
        padding:
            30px
            23px
            25px;
    }
}


/* -----------------------------------------------------
   REDUCED MOTION
----------------------------------------------------- */

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

    #sm-back-to-top {
        transition:
            none;
    }
}

