/*=========================================
    SHOP HERO
=========================================*/

.shop-hero{ padding:2rem 0 3rem; border-bottom:.1rem solid #ececec;}
.shop-hero-content{ max-width:70rem;}

.breadcrumb{ display:flex; align-items:center;  gap:1rem; flex-wrap:wrap;}
.breadcrumb a{ color:#777; transition:.3s;}
.breadcrumb a:hover{ color:var(--secondary-900);}

.breadcrumb span{color:#aaa;}

.shop-hero h1{font-size:clamp(3.6rem,4vw,4rem); margin-bottom:1.6rem;}
.shop-hero p{ max-width:60rem; font-size:1.7rem; color:#666; line-height:1.8;}


/*=========================================
    SHOP TOOLBAR
=========================================*/

.shop-toolbar { padding:2rem 0; border-bottom:.1rem solid #ececec; background:#fff;}
.shop-toolbar-inner{ display:flex; align-items:center; justify-content:space-between; gap:2rem;}
.toolbar-left{ display:flex; align-items:center; gap:2rem;}
.toolbar-left p{ color:#666; font-size:1.5rem;}
.toolbar-left strong{ color:var(--secondary-900);}


/*=========================================
    FILTER BUTTON
=========================================*/

.filter-toggle { display:flex; align-items:center; gap:1rem; height:5rem; padding:0 2rem; border:.1rem solid #e6e6e6; border-radius:5rem; background:#fff; cursor:pointer; transition:.35s;
}

.filter-toggle:hover{background:var(--secondary-900); color:#fff;}
.filter-toggle span{ font-size:2rem;}


/*=========================================
    RIGHT
=========================================*/

.toolbar-right{ display:flex; align-items:center;gap:2rem;}


/*=========================================
    VIEW BUTTONS
=========================================*/

.view-buttons{display:flex; gap:.8rem;}
.view-buttons button{width:5rem; height:5rem; border:.1rem solid #e6e6e6; background:#fff; border-radius:1.4rem; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:.35s;}

.view-buttons button.active,
.view-buttons button:hover{ background:var(--secondary-900); color:#fff; border-color:var(--secondary-900);}


/*=========================================
    SORT
=========================================*/

.sort-box{ display:flex; align-items:center; gap:1rem;}
.sort-box label{ font-size:1.5rem; color:#666; white-space:nowrap;}

.sort-box select{ height:5rem; padding:0 4rem 0 1.8rem; border:.1rem solid #e6e6e6; border-radius:1.4rem; background:#fff; outline:none; cursor:pointer;}


/*=========================================
    RESPONSIVE
=========================================*/

@media(max-width:991px){

.shop-toolbar-inner{
    flex-direction:column;
    align-items:flex-start;
}

.toolbar-right{
    width:100%;
    justify-content:space-between;
}
}

@media(max-width:576px){
.toolbar-left{
    width:100%;
    justify-content:space-between;
}

.toolbar-right{
    flex-wrap:wrap;
}

.sort-box{
    width:100%;
}

.sort-box select{
    flex:1;
}
}
/*=========================================
    SHOP LAYOUT
=========================================*/

.shop-page{
    padding:6rem 0;
}

.shop-layout{
    display:grid;
    grid-template-columns:30rem 1fr;
    gap:3rem;
    align-items:start;
}

/*=========================================
    SIDEBAR
=========================================*/

.shop-sidebar{
    position:sticky;
    top:12rem;
}

/*=========================================
    FILTER BOX
=========================================*/

.filter-box{
    background:#fff;
    border:.1rem solid #ececec;
    border-radius:2rem;
    padding:2.4rem;
    margin-bottom:2rem;
    box-shadow:0 .8rem 2.5rem rgba(0,0,0,.04);
    border-bottom: solid 2px #d2cbc1;
}

.filter-heading{
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.filter-heading h3{
    font-size:2rem;
}

.clear-filter{
    border:none;
    background:none;
    color:var(--secondary-900);
    cursor:pointer;
    font-size:1.4rem;
    font-weight:600;
}

.filter-box h4{
    font-size:1.7rem;
    margin-bottom:1.8rem;
}

/*=========================================
    FILTER LIST
=========================================*/

.filter-list{
    display:flex;
    flex-direction:column;
    gap:1.4rem;
}

.filter-list li { display: flex; justify-content: space-between; gap: 10px;}

.filter-list label{
    display:flex;
    align-items:center;
    cursor:pointer;
    font-size:1.5rem;
    color:#444;
}

.filter-list label input{
    margin-right:1rem;
    accent-color:var(--secondary-900);
}

.filter-list span{
    color:#999;
    font-size:1.3rem;
}

/*=========================================
    RANGE
=========================================*/

.filter-box input[type="range"]{
    width:100%;
    accent-color:var(--secondary-900);
    margin:1rem 0;
}

.price-values{
    display:flex;
    justify-content:space-between;
    font-size:1.4rem;
    color:#666;
}

/*=========================================
    PRODUCTS
=========================================*/

.shop-products{
    min-width:0;
}

.product-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(32rem,1fr));
    gap:2.5rem;
}

/*=========================================
    PAGINATION
=========================================*/

.pagination{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:1rem;
    margin-top:6rem;
}

.pagination a{
    width:4.8rem;
    height:4.8rem;
    display:flex;
    align-items:center;
    justify-content:center;
    border:.1rem solid #e5e5e5;
    border-radius:50%;
    transition:.3s;
    font-size:1.5rem;
}

.pagination a:hover,
.pagination a.active{
    background:var(--secondary-900);
    color:#fff;
    border-color:var(--secondary-900);
}

/*=========================================
    RESPONSIVE
=========================================*/

@media(max-width:991px){

.shop-layout{
    grid-template-columns:1fr;
}

.shop-sidebar{
    display:none;
}

.product-grid{
    grid-template-columns:repeat(auto-fill,minmax(24rem,1fr));
}
}

@media(max-width:576px){

.product-grid{
    grid-template-columns:1fr 1fr;
    gap:1.5rem;
}

.pagination{
    gap:.6rem;
}
.pagination a{
    width:4rem;
    height:4rem;
}
}









/* --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

/* PRODCUT DETAIL */


/*=========================================
    PRODUCT DETAILS
=========================================*/

.product-details{
    padding:4rem 0;
}

.product-details-wrapper{
    display:grid;
    grid-template-columns: 60% 40%;
    gap:3rem;
    align-items:start;
}



.product-details .container { max-width: 1400px;}
/*=========================================
GALLERY
=========================================*/

.gallery-wrapper{ position:relative; display:flex; gap:20px;}
.gallery-main{ width:100%;}
.gallery-cell{ width:100%;}
.gallery-cell img{ width:100%; display:block; object-fit:cover; border-radius:10px;}
.gallery-thumb{ width:90px;}
.thumb{ width:90px; height:120px; margin-bottom:15px; border-radius:12px; overflow:hidden; cursor:pointer; border:2px solid transparent;}
.thumb img{ width:100%; height:100%; object-fit:cover;}
.thumb.is-nav-selected{ border-color:var(--primary);}

/*=========================================
MAIN IMAGE
=========================================*/

.product-gallery { position: relative;}

.gallery-main{ flex:1; position:relative; border-radius:10px; overflow:hidden; background:#fff; border:1px solid var(--border);}
.product-image{ overflow:hidden;}
.product-image img{ width:100%; display:block; aspect-ratio:0.78; object-fit:cover; transition:transform .5s ease;}
.gallery-main:hover .product-image img{ transform:scale(1.08);}

/*=========================================
BADGES
=========================================*/

.image-top-badges {position: absolute; top: 10px; z-index: 2; width: calc(100% - 110px); display: flex; justify-content: space-between; padding: 0 10px; right: 0;}
.offer-badge{  background:var(--primary-400); color:#fff;padding:8px 16px; border-radius:40px; font-size:13px; font-weight:600; }
.best-badge { background:#fff; color:var(--text); padding:8px 16px; border-radius:40px; font-size:13px;box-shadow:0 10px 30px rgba(0,0,0,.08); display: flex; align-items: center; justify-content: center; gap: 6px; }
.best-badge span.material-symbols-outlined { font-size: 16px;}

/*=========================================
ZOOM BUTTON
=========================================*/

.zoom-btn{ width:4rem; height:4rem; border:none; background:#fff; position:absolute; bottom:20px; right:20px; cursor:pointer; display:flex; align-items:center; justify-content:center; box-shadow:0 10px 25px rgba(0,0,0,.08); transition:.35s; z-index:5;}
.zoom-btn:hover{ background:var(--primary-400); color:#fff;}

/*=========================================
FLICKITY NEXT PREV BUTTON
=========================================*/

.flickity-prev-next-button { width:4rem !important;  height:4rem !important; border-radius:50%; background:#fff; box-shadow:0 .8rem 2rem rgba(0,0,0,.12); transition:.3s;    display: flex; align-items: center; justify-content: center;}

.flickity-prev-next-button:hover { background:var(--secondary-900) !important;}

.flickity-prev-next-button .flickity-button-icon{fill: var(--secondary-900); width: 45% !important; position: static !important; transition:.3s;}

.flickity-prev-next-button:hover .flickity-button-icon{ fill:#fff;}


.product-wishlist{
    width:4.8rem;
    height:4.8rem;
    border:none;
    border-radius:50%;
    background:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    box-shadow:0 .8rem 2rem rgba(0,0,0,.08);
    transition:.35s;
}

.product-wishlist:hover{
    background:var(--secondary-900);
    color:#fff;
}

/*=========================================
    IMAGE COUNT
=========================================*/

.gallery-count{
    position:absolute;
    right:2rem;
    bottom:2rem;
    background:rgba(255,255,255,.95);
    backdrop-filter:blur(.8rem);
    padding:1rem 1.8rem;
    border-radius:5rem;
    font-size:1.4rem;
    font-weight:600;
    z-index:10;
}

/*=========================================
    NAVIGATION
=========================================*/

.product-main-slider .swiper-button-next,
.product-main-slider .swiper-button-prev{
    width:4.8rem;
    height:4.8rem;
    background:#fff;
    border-radius:50%;
    color:#222;
    box-shadow:0 .8rem 2rem rgba(0,0,0,.08);
}

.product-main-slider .swiper-button-next::after,
.product-main-slider .swiper-button-prev::after{
   font-size:1.8rem;
}

/*=========================================
    PRODUCT INFO
=========================================*/

.product-info{
    position:sticky;
    top:11rem;
}

.product-brand{
    display:inline-block;
    color:var(--secondary-900);
    text-transform:uppercase;
    letter-spacing:.15rem;
    font-size:1.3rem;
    margin-bottom:1rem;
}

.product-title{
    font-size:clamp(24px,3vw,3rem);
    margin-bottom:10px;
    line-height:1.2;
    font-weight: 400;
}

.product-rating{
    display:flex;
    align-items:center;
    gap:1.5rem;
    margin-bottom:2rem;
}

.stars{
    display:flex;
    color: #d8a84d;
}

.product-price{
    display:flex;
    align-items:center;
    gap:1.5rem;
    margin-bottom:1.5rem;
}

.sale-price{
    font-size:3.2rem;
    font-weight:700;
    color:var(--secondary-900);
}

.regular-price{
    color:#999;
    font-size:2rem;
}

.discount{
    color:#1f8f48;
    font-weight:600;
}


/*=========================================
    FEATURES
=========================================*/

.product-features{
    display:grid;
    gap:1.5rem;
    margin-top:3rem;
}

.feature-item{
    display:flex;
    gap:1.5rem;
    align-items:flex-start;
    padding:1.8rem;
    border:.1rem solid #ececec;
    border-radius:1.6rem;
}

.feature-item span{
    font-size:2.6rem;
    color:var(--secondary-900);
}
.feature-item h5{
    margin-bottom:.4rem;
}
.feature-item p{
    color:#777;
    font-size:1.4rem;
}

/*=========================================
    PURCHASE
=========================================*/

.product-purchase{
    margin-top:3rem;
}

.product-option{
    margin-bottom:3rem;
}

.option-header{
    display:flex;
    justify-content:space-between;
    margin-bottom:1.5rem;
}

.color-list{
    display:flex;
    gap:1.2rem;
}

.color-item {cursor: pointer;}
.color-item input{
    display:none;
}

.color-item img { aspect-ratio: 3/4; max-width: 60px; object-fit: cover; border: solid 2px white;}


.color-item input:checked + img{
    border-color:#111;
}

.quantity-wrapper{
    display:flex;
    align-items:center;
    width:max-content;
    border:.1rem solid #ddd;
    border-radius:5rem;
    overflow:hidden;
    background: #e3dfd8;
}

.quantity-wrapper button{
    width:4rem;
    height:4rem;
    border:none;
    background:#fff;
    cursor:pointer;
}

.quantity-wrapper input{
    width:6rem;
    text-align:center;
    border:none;
    font-size:1.6rem;
    background:transparent;
}

.product-action{
    display:grid;
    gap:1.5rem;
    grid-template-columns: 1fr 1fr;
}

.product-action .btn-fill,
.product-action .btn-outline{
    width:100%;
    justify-content:center;
    height:4.6rem;
    font-size: 15px;
}

.product-action .btn-outline { background: #e3ddd2;}

/*=========================================
    PRODUCT TABS
=========================================*/

.product-tabs{
    padding:3rem 0;
}

.tab-buttons{
    display:flex;
    gap:1rem;
    border-bottom:.1rem solid #c3b8a3;
    margin-bottom:2rem;
}

.tab-btn{
    padding:12px 2rem;
    background:none;
    border:solid 1px #d1c8b7;
    cursor:pointer;
    font-size:1.6rem;
    position:relative;
    border-radius: 5px 5px 0 0;
    border-bottom: none;
    color: #645f55;
}

.tab-btn.active{
    background-color: var(--secondary-900);
    color: white;
    border-color: var(--secondary-900);
}


.tab-btn.active::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-.1rem;
    width:100%;
    height:.2rem;
    background:var(--secondary-900);
}

.tab-panel{
    display:none;
}

.tab-panel.active{
    display:block;
}

.product-specs{
    width:100%;
    border-collapse:collapse;
        background: white;
    border: solid 1px #cccccceb
}

.product-specs th,
.product-specs td{
    padding:13px 1.8rem;
    border-bottom:.1rem solid #ede8e0;
    text-align:left;
}

.product-specs tr:nth-child(odd) { background-color: #f3ede36b;}


.tab-content p { opacity: 0.8; line-height: 24px;}

/*=========================================
    RESPONSIVE
=========================================*/

@media(max-width:991px){

.product-details-wrapper{
    grid-template-columns:1fr;
}

.product-gallery{
    grid-template-columns:1fr;
}

.product-thumb-slider{
    height:auto;
    order:2;
}

.product-info{
    position:static;
}
}

@media(max-width:576px){
.tab-buttons{
    overflow:auto;
}

}

.product-size {}
.product-size select {
    border: solid 1px #ddd;
    padding: 5px;
    border-radius: 5px;
    font-size: 15px;
}


.section-heading{
    display:flex;
    justify-content:space-between;
    align-items:end;
    margin-bottom:3rem;
}

.section-subtitle{
    display:block;
    margin-bottom:.8rem;
    color:var(--secondary-900);
    font-size:1.4rem;
    text-transform:uppercase;
    letter-spacing:.15rem;
}

.section-heading h2{
    font-size:clamp(3rem,3vw,3.4rem);
    font-weight: 500;
}

.related-products-grid,
.recent-products-grid{

    display:grid;

    grid-template-columns: repeat(auto-fill,minmax(295px, 1fr));

    gap:2.5rem;

}

@media(max-width:768px){

.related-products-grid,
.recent-products-grid{

    grid-template-columns:repeat(2,1fr);

    gap:1.5rem;

}

}

















/* REVIEW--------------------------------------------------------------------------------------------------------------------------------- */


/*=========================================
    REVIEW SIDEBAR
=========================================*/

.review-sidebar{
    position:sticky;
    top:12rem;
}

.review-summary-card{
    background:#fff;
    border:.1rem solid #ebe5de;
    border-radius:1.4rem;
    padding:3rem;
    box-shadow:0 1rem 3rem rgba(0,0,0,.04);
}

/*=========================================
    TAG
=========================================*/

.review-tag{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:.8rem 1.8rem;
    border-radius:5rem;
    background: var(--secondary-50);
    color:var(--secondary-900);
    font-size:clamp(1.2rem,1.5vw,1.3rem);
    font-weight:600;
    margin-bottom:2rem;
}



/*=========================================
    OVERALL RATING
=========================================*/

.fill{

    font-variation-settings:
    'FILL' 1,
    'wght' 400,
    'GRAD' 0,
    'opsz' 24;

}

.overall-rating{
    text-align:center;
    margin-bottom:3rem;
}

.overall-rating h2{
    font-size:clamp(5rem,4vw,5rem);
    font-family:var(--secondary-family);
    color:var(--secondary-900);
    line-height:1;
    margin-bottom:1rem;
}

.rating-stars{
    display:flex;
    justify-content:center;
    gap:.3rem;
    margin-bottom:1rem;
}

.rating-stars span{
    font-size:2.2rem;
    color:#d6d6d6;
}

.rating-stars .fill{
    color:#d8a84d;
}

.overall-rating p{
    color:#666;
    font-size:clamp(1.4rem,1.6vw,1.5rem);
}

/*=========================================
    RATING BAR
=========================================*/

.rating-breakdown{
    margin:3rem 0;
}

.rating-row{
    display:grid;
    grid-template-columns:3rem 1fr 4rem;
    align-items:center;
    gap:1.5rem;
    margin-bottom:1.4rem;
}

.rating-row span{
    font-size:1.4rem;
}

.rating-row strong{
    font-size:1.4rem;
    color:#555;
    text-align:right;
}

.progress{
    height:.8rem;
    background:#ece8e2;
    border-radius:5rem;
    overflow:hidden;
}

.progress span{
    display:block;
    height:100%;
    border-radius:5rem;
    background:linear-gradient(90deg, var(--secondary-600),var(--secondary-800));
}

/*=========================================
    WRITE REVIEW BUTTON
=========================================*/

.review-toggle{
    width:100%;
    height:5.4rem;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:1rem;
    border:none;
    border-radius:1.6rem;
    background:linear-gradient(135deg, rgb(0 88 77 / 79%), rgb(214, 160, 70));
    color:#fff;
    cursor:pointer;
    font-size:clamp(1.4rem,1.6vw,1.5rem);
    font-weight:600;
    transition:.35s;
}

.review-toggle:hover{
    transform:translateY(-.2rem);
    box-shadow:0 1rem 2rem rgba(184,132,53,.25);
}

/*=========================================
    REVIEW FORM
=========================================*/

.review-form{
    display:none;
    margin-top:3rem;
    padding-top:3rem;
    border-top:.1rem solid #ece8e2;
}

.review-form.active{
    display:block;
    animation:fadeDown .35s ease;
}

.review-stars{
    display:flex;
    gap:.4rem;
    margin-top:.8rem;
    margin-bottom:2rem;
}

.review-stars span{
    font-size:3rem;
    color:#d8d8d8;
    cursor:pointer;
    transition:.25s;
}

.review-stars span:hover{
    color:#d8a84d;
    transform:scale(1.15);
}

.review-form textarea{
    min-height:14rem;
    resize:vertical;
}

.review-form input[type=file]{
    padding:1.4rem;
}

/*=========================================
    ANIMATION
=========================================*/

@keyframes fadeDown{
    from{
        opacity:0;
        transform:translateY(-1rem);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }
}

/*=========================================
    RESPONSIVE
=========================================*/

@media(max-width:991px){
.review-sidebar{
    position:static;
}

.review-summary-card{
    margin-bottom:3rem;
}
}

@media(max-width:576px){
.review-summary-card{
    padding:2rem;
}

.rating-row{
    grid-template-columns:2.8rem 1fr 3.5rem;
    gap:1rem;
}

.review-toggle{
    height:5rem;
}

.review-stars span{
    font-size:2.6rem;
}
}



/*=========================================
    REVIEW CONTENT
=========================================*/

.review-content{ display:flex; flex-direction:column; gap:2.5rem;}

/*=========================================
    REVIEW HEADER
=========================================*/

.review-header{display:flex; align-items:center; justify-content:space-between; gap:2rem; margin-bottom:1rem;}
.review-count{ display:inline-block; font-size:1.3rem; font-weight:600; color:var(--secondary-900); margin-bottom:.8rem;}
.review-header h2{ font-size:clamp(2.6rem,3vw,3.2rem); color:#222;}


/*=========================================
    REVIEW CARD
=========================================*/

.review-card{background:#fff; border-left:solid 2px var(--secondary-600); padding:3rem; transition:.35s; box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;}
.review-card:hover{ transform:translateY(-.4rem); box-shadow:0 1.5rem 3rem rgba(0,0,0,.08);}

/*=========================================
    TOP
=========================================*/

.review-card-top{ display:flex; justify-content:space-between; align-items:center; gap:2rem; margin-bottom:2rem;}
.review-user{display:flex; align-items:center; gap:1.6rem;}
.review-avatar{ width:5.5rem; height:5.5rem; border-radius:50%; display:flex; align-items:center; justify-content:center; background: var(--secondary-50); color:var(--secondary-900); font-weight:700; font-size:1.7rem;}
.review-user h4{ font-size:1.8rem; margin-bottom:.4rem;}
.review-user span{ color:#888; font-size:1.3rem;}

/*=========================================
    RATING
=========================================*/

.review-rating{display:flex; gap:.3rem;}
.review-rating span{font-size:2rem; color:#d8d8d8;}
.review-rating .fill{ color:#d7a142;}

/*=========================================
    BODY
=========================================*/

.review-card h3{ font-size:2rem; margin-bottom:1.2rem;}
.review-card p{ color:#666; line-height:1.9;}

.review-success { display: flex; gap: 10px; margin-bottom: 2rem; background: #00800014; padding: 10px; line-height: 24px;}
.review-success h4 { color: var(--secondary-600);}
.review-success span.material-symbols-outlined { color: var(--secondary-600);}

/*=========================================
    RESPONSIVE
=========================================*/

@media(max-width:991px){
.review-header{ flex-direction:column; align-items:flex-start;}
}

@media(max-width:767px){
.review-card{ padding:2rem;}

.review-card-top{ flex-direction:column; align-items:flex-start;}

}

.review-wrapper { display: grid; grid-template-columns: 1fr 2fr; gap: 3rem; padding: 3rem 0; margin: 5rem 0; align-items: start;}


/*=========================================
    MINTAS SHARE MENU
=========================================*/

.mintas-share{position:relative; width:4rem; height:4rem; float: right;}

/*=========================================
    TOGGLE
=========================================*/

.share-toggle{position:absolute; inset:0; width:100%; height:100%; border:none; border-radius:50%; cursor:pointer; background:#fff; color:var(--secondary-900); box-shadow:0 .8rem 2rem rgba(0,0,0,.08); transition:.4s; z-index:20;}
.share-toggle:hover{ transform:translateY(-.2rem); box-shadow:0 1.2rem 2.8rem rgba(0,0,0,.12);}
.share-toggle span{ font-size: clamp(16px, 2rem, 2.4rem); transition:.4s;}
/*=========================================
    SHARE ICONS
=========================================*/

.share-item{position:absolute; top:50%; left:50%; width:4.8rem; height:4.8rem; margin-left:-2.4rem; margin-top:-2.4rem; border-radius:50%; display:flex; align-items:center; justify-content:center; background:#fff;color:#333; text-decoration:none; box-shadow:0 .8rem 2rem rgba(0,0,0,.08); opacity:0; pointer-events:none; transform:translate(0,0) scale(.4); transition: transform .45s cubic-bezier(.22,1,.36,1), opacity .3s;
}

.share-item i{ font-size:2rem;}
.share-item span{ font-size:2rem;}

/*=========================================
    ACTIVE
=========================================*/
.mintas-share.active .share-toggle{ background:var(--secondary-900); color:#fff;}
.mintas-share.active .share-toggle span{ transform:rotate(135deg);}

/*=========================================
    WHATSAPP
=========================================*/

.mintas-share.active .share-whatsapp{opacity:1; pointer-events:auto; transform:translate(8rem,0);}

/*=========================================
    FACEBOOK
=========================================*/
.mintas-share.active .share-facebook{ opacity:1; pointer-events:auto; transform:translate(5.5rem,-5.5rem);}

/*=========================================
    INSTAGRAM
=========================================*/

.mintas-share.active .share-instagram{ opacity:1; pointer-events:auto; transform:translate(0,-8rem);}
/*=========================================
    PINTEREST
=========================================*/

.mintas-share.active .share-pinterest{ opacity:1; pointer-events:auto; transform:translate(-5.5rem,-5.5rem);}

/*=========================================
    COPY
=========================================*/
.mintas-share.active .share-copy-link{opacity:1; pointer-events:auto; transform:translate(-8rem,0);}

/*=========================================
    BRAND COLORS
=========================================*/

.share-whatsapp {color:#25D366;}
.share-facebook{ color:#1877F2;}
.share-instagram{ color:#E4405F;}
.share-pinterest{ color:#E60023;}
.share-copy-link{ color:var(--secondary-900);}

/*=========================================
    HOVER
=========================================*/

.share-item:hover{  box-shadow:0 1.2rem 2.8rem rgba(0,0,0,.15);}

/*=========================================
    MOBILE
=========================================*/

@media(max-width:576px){

.mintas-share{ width:5rem; height:5rem;}
.share-item{ width:4.2rem; height:4.2rem; margin-left:-2.1rem; margin-top:-2.1rem;}
}