
/* CP-PDP-STORE-2026-START */

/* =========================================================
   COSMETIC POINT — PRODUCT PAGE
   Solid colours / compact ecommerce layout
   ========================================================= */

.cp-pdp-v3{
    --cp-primary:#68137f;
    --cp-primary-dark:#4e0d62;

    --cp-text:#18131b;
    --cp-muted:#746c78;

    --cp-border:#e7e2e9;
    --cp-border-dark:#d8d1dc;

    --cp-soft:#faf9fb;
    --cp-green:#138a4d;
    --cp-green-bg:#eef9f2;

    background:#fff !important;
    color:var(--cp-text) !important;
}

.cp-pdp-v3 *,
.cp-pdp-v3 *::before,
.cp-pdp-v3 *::after{
    background-image:none !important;
}


/* =========================================================
   PAGE
   ========================================================= */

.cp-pdp-container{
    width:min(1240px, calc(100% - 40px)) !important;
    max-width:1240px !important;

    margin:0 auto !important;

    padding:16px 0 34px !important;
}


/* =========================================================
   BREADCRUMB
   ========================================================= */

.cp-pdp-breadcrumb{
    margin:0 0 14px !important;
    padding:0 !important;

    display:flex !important;
    align-items:center !important;
    flex-wrap:wrap !important;

    gap:6px !important;

    background:#fff !important;

    font-size:11px !important;
    line-height:1.4 !important;
}

.cp-pdp-breadcrumb a{
    color:var(--cp-primary) !important;
    font-weight:700 !important;
    text-decoration:none !important;
}

.cp-pdp-breadcrumb span{
    color:#817986 !important;
}


/* =========================================================
   MAIN PRODUCT
   TWO COLUMNS ONLY
   ========================================================= */

.cp-pdp-top{
    display:grid !important;

    grid-template-columns:
        minmax(0, 1.02fr)
        minmax(0, .98fr) !important;

    gap:30px !important;

    align-items:start !important;

    margin:0 !important;
    padding:0 !important;

    background:#fff !important;
}


/* =========================================================
   GALLERY
   ========================================================= */

.cp-pdp-gallery{
    display:grid !important;

    grid-template-columns:
        64px
        minmax(0,1fr) !important;

    gap:12px !important;

    min-width:0 !important;

    margin:0 !important;
    padding:0 !important;

    background:#fff !important;
}

.cp-pdp-gallery:not(:has(.cp-pdp-thumbs)){
    grid-template-columns:1fr !important;
}


/* THUMBNAILS */

.cp-pdp-thumbs{
    width:64px !important;

    display:flex !important;
    flex-direction:column !important;

    gap:8px !important;

    margin:0 !important;
    padding:0 !important;

    max-height:420px !important;

    overflow-y:auto !important;
    overflow-x:hidden !important;

    scrollbar-width:none !important;
}

.cp-pdp-thumbs::-webkit-scrollbar{
    display:none !important;
}

.cp-pdp-thumbs button{
    width:64px !important;
    height:64px !important;

    flex:0 0 64px !important;

    padding:5px !important;

    background:#fff !important;

    border:1px solid var(--cp-border) !important;
    border-radius:7px !important;

    box-shadow:none !important;
}

.cp-pdp-thumbs button.is-active{
    border:2px solid var(--cp-primary) !important;
}

.cp-pdp-thumbs img{
    width:100% !important;
    height:100% !important;

    display:block !important;

    object-fit:contain !important;
}


/* MAIN IMAGE */

.cp-pdp-main-image{
    position:relative !important;

    height:430px !important;
    min-height:430px !important;
    max-height:430px !important;

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

    padding:20px !important;

    background:#fff !important;

    border:1px solid var(--cp-border) !important;
    border-radius:9px !important;

    box-shadow:none !important;

    overflow:hidden !important;
}

.cp-pdp-main-image img{
    display:block !important;

    width:auto !important;
    height:auto !important;

    max-width:88% !important;
    max-height:390px !important;

    margin:auto !important;

    object-fit:contain !important;
}


/* DISCOUNT */

.cp-pdp-discount{
    position:absolute !important;

    top:12px !important;
    left:12px !important;

    padding:5px 8px !important;

    background:var(--cp-primary) !important;
    color:#fff !important;

    border-radius:5px !important;

    font-size:11px !important;
    line-height:1 !important;

    font-weight:800 !important;

    box-shadow:none !important;
}


/* =========================================================
   SUMMARY
   ========================================================= */

.cp-pdp-summary{
    display:block !important;

    min-width:0 !important;

    margin:0 !important;
    padding:2px 0 0 !important;

    background:#fff !important;
}


/* BRAND */

.cp-pdp-brand{
    margin:0 0 5px !important;

    color:var(--cp-primary) !important;

    font-size:11px !important;
    line-height:1 !important;

    font-weight:800 !important;

    letter-spacing:.05em !important;
    text-transform:uppercase !important;
}


/* TITLE */

.cp-pdp-summary h1{
    margin:0 0 9px !important;

    color:#18131b !important;

    font-size:29px !important;
    line-height:1.14 !important;

    font-weight:800 !important;
    letter-spacing:-.025em !important;
}


/* SKU / CATEGORY */

.cp-pdp-meta{
    margin:0 0 10px !important;

    display:flex !important;
    align-items:center !important;
    flex-wrap:wrap !important;

    gap:5px 14px !important;

    color:#716a75 !important;

    font-size:11px !important;
    line-height:1.4 !important;
}


/* STOCK */

.cp-pdp-stock{
    display:inline-flex !important;

    width:auto !important;

    margin:0 0 11px !important;

    padding:5px 8px !important;

    background:var(--cp-green-bg) !important;
    color:var(--cp-green) !important;

    border:0 !important;
    border-radius:5px !important;

    font-size:11px !important;
    line-height:1 !important;

    font-weight:800 !important;

    box-shadow:none !important;
}


/* PRICE */

.cp-pdp-price{
    display:flex !important;
    align-items:baseline !important;

    gap:10px !important;

    margin:0 0 7px !important;
}

.cp-pdp-price strong{
    color:var(--cp-primary) !important;

    font-size:36px !important;
    line-height:1 !important;

    font-weight:800 !important;
    letter-spacing:-.035em !important;
}

.cp-pdp-price del{
    color:#a09aa3 !important;

    font-size:16px !important;
    font-weight:600 !important;
}


/* SHORT DESCRIPTION */

.cp-pdp-short{
    margin:0 !important;

    padding:2px 0 13px !important;

    color:#69616d !important;

    font-size:12px !important;
    line-height:1.5 !important;

    border:0 !important;
    border-bottom:1px solid var(--cp-border) !important;

    border-radius:0 !important;

    background:#fff !important;

    box-shadow:none !important;
}


/* =========================================================
   VARIANTS
   ========================================================= */

.cp-pdp-variants{
    margin:13px 0 0 !important;
    padding:0 !important;

    border:0 !important;
    border-radius:0 !important;

    background:#fff !important;

    box-shadow:none !important;
}


/* Remove unnecessary header clutter */

.cp-pdp-variant-title{
    margin:0 0 11px !important;

    display:block !important;
}

.cp-pdp-variant-title span{
    color:#1d1820 !important;

    font-size:13px !important;
    font-weight:800 !important;
}


/* Hide "6 variants" */
.cp-pdp-variant-title small{
    display:none !important;
}


/* GROUPS */

.cp-pdp-option-groups{
    display:flex !important;
    flex-direction:column !important;

    gap:12px !important;

    margin:0 !important;
}

.cp-pdp-option-group{
    margin:0 !important;
    padding:0 !important;

    border:0 !important;
    border-radius:0 !important;

    background:#fff !important;

    box-shadow:none !important;
}


/* ATTRIBUTE LABEL */

.cp-pdp-option-head{
    display:block !important;

    margin:0 0 6px !important;

    color:#332c36 !important;

    font-size:11px !important;
    line-height:1.2 !important;

    font-weight:800 !important;
}


/*
 * Hide duplicate selected text on far right:
 * "100ml", "Single", etc.
 */
.cp-pdp-option-head strong{
    display:none !important;
}


/* OPTIONS */

.cp-pdp-option-values{
    display:flex !important;
    align-items:center !important;
    flex-wrap:wrap !important;

    gap:7px !important;
}

.cp-pdp-option-choice{
    margin:0 !important;
}

.cp-pdp-option-choice span,
.cp-pdp-variant-choice span,
.cp-pdp-value-choice span{
    min-width:0 !important;
    min-height:36px !important;

    padding:7px 12px !important;

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

    background:#fff !important;
    color:#37303a !important;

    border:1px solid var(--cp-border-dark) !important;
    border-radius:6px !important;

    font-size:11px !important;
    line-height:1 !important;

    font-weight:700 !important;

    box-shadow:none !important;
}

.cp-pdp-option-choice input:checked + span,
.cp-pdp-variant-choice input:checked + span,
.cp-pdp-value-choice input:checked + span{
    padding:6px 11px !important;

    background:#fff !important;
    color:var(--cp-primary) !important;

    border:2px solid var(--cp-primary) !important;

    box-shadow:none !important;
}


/* =========================================================
   PURCHASE — SAME COLUMN, COMPACT
   ========================================================= */

.cp-pdp-buy{
    position:static !important;

    width:100% !important;

    margin:14px 0 0 !important;
    padding:0 !important;
}

.cp-pdp-buy-box{
    width:100% !important;

    margin:0 !important;
    padding:13px 0 0 !important;

    background:#fff !important;

    border:0 !important;
    border-top:1px solid var(--cp-border) !important;

    border-radius:0 !important;

    box-shadow:none !important;
}


/* QUANTITY LINE */

.cp-pdp-buy-row{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;

    gap:14px !important;

    margin:0 0 11px !important;
}

.cp-pdp-buy-label{
    min-width:55px !important;

    color:#332c36 !important;

    font-size:11px !important;
    font-weight:800 !important;
}


/* QUANTITY */

.cp-pdp-qty{
    width:108px !important;
    height:36px !important;

    display:grid !important;

    grid-template-columns:
        34px
        40px
        34px !important;

    border:1px solid var(--cp-border-dark) !important;
    border-radius:6px !important;

    overflow:hidden !important;

    background:#fff !important;

    box-shadow:none !important;
}

.cp-pdp-qty button{
    width:34px !important;
    height:34px !important;

    padding:0 !important;

    background:#fff !important;
    color:var(--cp-primary) !important;

    border:0 !important;

    font-size:16px !important;
    line-height:34px !important;

    font-weight:800 !important;
}

.cp-pdp-qty input{
    width:40px !important;
    height:34px !important;

    padding:0 !important;

    background:#fff !important;
    color:#18131b !important;

    border:0 !important;
    border-left:1px solid #eee9ef !important;
    border-right:1px solid #eee9ef !important;

    text-align:center !important;

    font-size:12px !important;
    font-weight:800 !important;

    outline:0 !important;
}


/* =========================================================
   BUTTONS
   ========================================================= */

.cp-pdp-actions{
    display:grid !important;

    grid-template-columns:
        minmax(0,1.15fr)
        minmax(0,.85fr) !important;

    gap:8px !important;

    margin:0 !important;
}

.cp-pdp-btn{
    min-height:42px !important;

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

    gap:7px !important;

    padding:9px 12px !important;

    border-radius:6px !important;

    font-size:12px !important;
    line-height:1 !important;

    font-weight:800 !important;

    text-decoration:none !important;

    box-shadow:none !important;
}


/* ADD TO CART */

.cp-pdp-btn--cart{
    order:1 !important;

    background:var(--cp-primary) !important;
    color:#fff !important;

    border:1px solid var(--cp-primary) !important;
}

.cp-pdp-btn--cart::after{
    content:"Add to Cart";
}

.cp-pdp-btn--cart:hover{
    background:var(--cp-primary-dark) !important;
}


/* BUY NOW */

.cp-pdp-btn--order{
    order:2 !important;

    background:#fff !important;
    color:var(--cp-primary) !important;

    border:1px solid var(--cp-primary) !important;
}


/* WHATSAPP */

.cp-pdp-btn--whatsapp{
    order:3 !important;

    grid-column:1 / -1 !important;

    background:#fff !important;
    color:#128d4c !important;

    border:1px solid #21a45c !important;
}


/* =========================================================
   TRUST
   ONE CLEAN LINE, NOT 3 BIG CARDS
   ========================================================= */

.cp-pdp-trust{
    margin:11px 0 0 !important;
    padding:11px 0 0 !important;

    display:grid !important;

    grid-template-columns:
        repeat(3,minmax(0,1fr)) !important;

    gap:0 !important;

    border:0 !important;
    border-top:1px solid var(--cp-border) !important;

    background:#fff !important;

    border-radius:0 !important;

    box-shadow:none !important;
}

.cp-pdp-trust span{
    position:relative !important;

    padding:0 8px !important;

    color:#716a75 !important;

    text-align:center !important;

    font-size:9px !important;
    line-height:1.35 !important;

    font-weight:700 !important;
}

.cp-pdp-trust span + span{
    border-left:1px solid var(--cp-border) !important;
}

.cp-pdp-trust span::before{
    content:"✓";

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

    width:14px !important;
    height:14px !important;

    margin:0 4px 0 0 !important;

    border-radius:50% !important;

    background:#f4edf7 !important;
    color:var(--cp-primary) !important;

    font-size:8px !important;

    font-weight:900 !important;
}


/* =========================================================
   STOP FLOATING CART COVERING PDP
   ========================================================= */

body:has(.cp-pdp-v3) .cpf-cart__fab{
    display:none !important;
}


/* =========================================================
   BELOW-THE-FOLD SPACING
   ========================================================= */

.cp-pdp-details,
.cp-pdp-description,
.cp-pdp-information{
    margin-top:26px !important;
}


/* =========================================================
   RELATED PRODUCT SECTIONS
   Keep cards less crowded
   ========================================================= */

.cp-pdp-v3 .product-grid,
.cp-pdp-v3 .products-grid,
.cp-pdp-v3 .related-products-grid,
.cp-pdp-v3 .cp-product-grid{
    gap:14px !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1050px){

    .cp-pdp-container{
        width:min(100% - 28px, 980px) !important;
    }

    .cp-pdp-top{
        grid-template-columns:
            minmax(360px,.94fr)
            minmax(360px,1.06fr) !important;

        gap:22px !important;
    }

    .cp-pdp-main-image{
        height:400px !important;
        min-height:400px !important;
        max-height:400px !important;
    }

    .cp-pdp-main-image img{
        max-height:360px !important;
    }

    .cp-pdp-summary h1{
        font-size:25px !important;
    }
}


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

@media(max-width:767px){

    .cp-pdp-container{
        width:100% !important;

        padding:
            9px 12px
            26px !important;
    }


    /* Breadcrumb compact */

    .cp-pdp-breadcrumb{
        margin-bottom:9px !important;

        flex-wrap:nowrap !important;

        overflow:hidden !important;

        white-space:nowrap !important;

        font-size:10px !important;
    }


    /* Stacked */

    .cp-pdp-top{
        display:block !important;
    }


    /* Gallery */

    .cp-pdp-gallery{
        display:flex !important;
        flex-direction:column !important;

        gap:8px !important;

        margin-bottom:16px !important;
    }

    .cp-pdp-main-image{
        order:1 !important;

        height:330px !important;
        min-height:330px !important;
        max-height:330px !important;

        padding:15px !important;
    }

    .cp-pdp-main-image img{
        max-width:90% !important;
        max-height:300px !important;
    }


    /* Mobile thumbnails horizontal */

    .cp-pdp-thumbs{
        order:2 !important;

        width:100% !important;
        max-height:none !important;

        flex-direction:row !important;

        gap:7px !important;

        overflow-x:auto !important;
        overflow-y:hidden !important;
    }

    .cp-pdp-thumbs button{
        width:54px !important;
        height:54px !important;

        flex:0 0 54px !important;
    }


    /* Summary */

    .cp-pdp-summary{
        padding:0 !important;
    }

    .cp-pdp-summary h1{
        margin-bottom:8px !important;

        font-size:21px !important;
        line-height:1.18 !important;
    }

    .cp-pdp-price strong{
        font-size:30px !important;
    }

    .cp-pdp-price del{
        font-size:14px !important;
    }


    /* Variants */

    .cp-pdp-variants{
        margin-top:12px !important;
    }

    .cp-pdp-option-groups{
        gap:11px !important;
    }

    .cp-pdp-option-choice span,
    .cp-pdp-variant-choice span,
    .cp-pdp-value-choice span{
        min-height:34px !important;

        padding:6px 10px !important;

        font-size:10px !important;
    }


    /* Purchase */

    .cp-pdp-buy{
        margin-top:13px !important;
    }

    .cp-pdp-buy-box{
        padding-top:12px !important;
    }

    .cp-pdp-actions{
        grid-template-columns:
            1fr
            1fr !important;

        gap:7px !important;
    }

    .cp-pdp-btn{
        min-height:42px !important;

        padding:8px !important;

        font-size:11px !important;
    }

    .cp-pdp-btn--whatsapp{
        grid-column:1 / -1 !important;
    }


    /* Trust */

    .cp-pdp-trust span{
        padding:0 5px !important;

        font-size:8px !important;
    }
}


/* =========================================================
   SMALL PHONE
   ========================================================= */

@media(max-width:390px){

    .cp-pdp-container{
        padding-left:10px !important;
        padding-right:10px !important;
    }

    .cp-pdp-main-image{
        height:300px !important;
        min-height:300px !important;
        max-height:300px !important;
    }

    .cp-pdp-main-image img{
        max-height:270px !important;
    }
}

/* CP-PDP-STORE-2026-END */
