/* ============ A/M PERFUME IDENTITY (Phase 1) ============
   Ivory #F7F3F7 · Lavender #C9B6D9 · Muted plum #8E719F
   Deep plum #34263A · Champagne gold #B99A6B · Soft gold #D6BE91
   Cairo → Arabic UI · Playfair Display → luxury headings */
:root{
  --ivory:#F7F3F7;
  --lavender:#C9B6D9;
  --lav-soft:#EFE7F5;
  --lav-line:#E3D6EC;
  --plum-muted:#8E719F;
  --plum-deep:#34263A;
  --plum-ink:#3A2B42;
  --plum-body:#4A354F;
  --muted:#6E5578;
  --gold:#B99A6B;
  --gold-soft:#D6BE91;
  --gold-ink:#7A5F3A;
  --card:#FFFFFF;
  --danger:#9B2C2C;
  --danger-bg:#FBE9E9;
}

*{
   margin:0;
    padding:0;
    box-sizing:border-box;
   }



 body::before{
   content:""; 
   position:fixed; 
   width:100%; 
   height:100%; 
   top:0;
    left:0;
    background-image: linear-gradient(rgba(142,113,159,0.07) 1px, transparent 1px), linear-gradient(90deg, rgba(142,113,159,0.07) 1px, transparent 1px); 
    background-size:40px 40px; 
    z-index:-1;
   } 

body{
  font-family: 'Cairo', sans-serif;
  color:var(--plum-body);
  background: linear-gradient(180deg, #F7F3F7 0%, #F4EDF6 45%, #EFE2F1 100%);
  min-height:100vh;
}

:focus-visible{
  outline:3px solid var(--gold-soft);
  outline-offset:2px;
}

@media (prefers-reduced-motion:reduce){
  .whatsapp{
    animation:none;
  }
}

h1, h2, h3{
  font-family: 'Playfair Display', serif;
}

.section-subtitle{
  text-align:center;
  color:var(--muted);
  font-size:14px;
  margin-bottom:30px;
  letter-spacing:0.5px;
}

/* smooth scroll */
html{
  scroll-behavior: smooth;
  scroll-padding-top: 100px; 
}

  /*  NAVBAR  */
  .navbar{
  display:flex;
  justify-content:space-between;
  align-items:center; 
  flex-direction:row-reverse;
  padding:10px 30px;
  position:fixed;
  width:100%;
 top:0;
 z-index:1000;
  background:rgba(247,243,247,0.92);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--lav-line);
  box-shadow:0 4px 20px rgba(52,38,58,0.08);
  }
  .logo img{ 
    width:55px;
    border-radius: 20%;
  } 
  .menu{
    font-size:24px;
    color:var(--plum-deep);
    cursor:pointer;
    background:none;
    border:none;
    padding:8px;
    min-width:44px;
    min-height:44px;
    } 
     /* links mobile */ 
    .nav-links{
     list-style:none;
     position:absolute;
    top:60px; right:0; 
    width:100%; 
    background:#FFFFFF;
    border-bottom:1px solid var(--lav-line);
    box-shadow:0 12px 30px rgba(52,38,58,0.10);
    display:none; 
    flex-direction:column;
    text-align:center;
     padding:20px 0; 
     } 
    .nav-links li{ 
     margin:10px 0; 
    } 
    .nav-links a{ 
    color:var(--plum-deep);
    text-decoration:none;
    font-size:16px;
     position:relative; 
     } 
    /* underline */
    .nav-links a::after{
   content:"";
    position:absolute; 
    width:0; 
    height:2px;
    background:#B99A6B;
     bottom:-5px; 
     right:0;
     transition:0.3s;
    } 
    .nav-links a:hover::after
   {
    width:100%;
    left:0; 
   } 
  .nav-links.active
  { 
    display:flex;
   }
    .logo{ 
  display:flex; 
  align-items:center; 
  gap:40px;
  flex-direction: row-reverse;
  border-radius: 50%;
   }
   
 .logo img{ 
   width:55px;
 } 
        
  .facebook-icon{
   background:#1877f2;
    color:#fff;
   width:32px;
   height:32px;
   display:flex; 
    align-items:center;
    justify-content:center;
   border-radius:50%; 
   text-decoration:none;
   transition:0.3s; } 
  .facebook-icon:hover{ 
   transform:scale(1.1);
   box-shadow:0 5px 15px rgba(24,119,242,0.4); 
  } 
 .order-btn{
    background:var(--plum-deep);
     color:var(--ivory); 
     padding:6px 14px; 
    border-radius:20px;
      text-decoration:none;
    transition:0.3s;
     display:inline-block; 
     width:auto;
    max-width:max-content; 
    white-space:nowrap; 
     } 
   .order-btn:hover{
    transform:translateY(-2px);
     box-shadow:0 5px 15px rgba(185,154,107,0.4); 
     } 

     /*  HERO  */ 
    .hero{
   padding:100px 20px 60px;
    text-align:center; 
   background: linear-gradient(180deg, #F9F5FA 0%, #F1E6F4 60%, #EADCF0 100%); } 
.hero-container{ 
  max-width:400px; 
  margin:auto;
}

/* صورة */
.hero-img{ 
  width:100%; 
  max-width:600px; 
  margin:auto; 
}

.hero-img img{ 
  width:100%; 
  height:auto; 
  border-radius:20px; 
  box-shadow:0 20px 40px rgba(0,0,0,0.6); 
} 


.hero-text h3{ 
  color:var(--plum-muted); 
  margin:15px 0 5px; 
} 

.hero-text h1{ 
  font-size:28px; 
  color:var(--plum-deep);
}

.hero-text p{ 
  color:var(--plum-muted); 
  margin:15px 0 20px; 
}

/* buttons */ 
.hero-buttons{
  display:flex; 
  flex-direction:column; 
  gap:10px; 
} 

.btn{
  padding:12px;
  border-radius:10px;
  text-decoration:none; 
  font-weight:bold; 
  display:flex; 
  align-items:center;
  justify-content:center;
  gap:8px;
  transition:0.3s;
}

.primary{
  background:var(--plum-deep);
  color:var(--ivory); 
} 

.secondary{
  border:1px solid var(--gold);
  color:var(--plum-deep);
  background:rgba(255,255,255,0.6);
}

/* animations */
.primary:hover{
  transform:translateY(-3px) scale(1.05);
  box-shadow:0 10px 25px rgba(52,38,58,0.25);
} 

.secondary:hover{
  background:var(--plum-deep);
  color:var(--ivory); 
  border-color:var(--plum-deep);
  transform:translateY(-3px);
} 

.btn i{ 
  transition:0.3s; 
} 

.primary:hover i{ 
  transform:translateY(-3px);
} 

.secondary:hover i{ 
  transform:translateX(-5px); 
} 

/* WhatsApp */ 
.whatsapp{
  position:fixed;
  bottom:20px;
  left:20px; 
  width:56px;
  height:56px;
  aspect-ratio:1 / 1;
  padding:0;
  min-width:0;
  background:#25D366;
  color:#fff;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:26px;
  line-height:1;
  text-decoration:none;
  z-index:999; 
  animation:pulse 2s infinite; 
}

.whatsapp i{
  line-height:1;
}

@keyframes pulse{ 
  0%{ transform:scale(1); } 
  50%{ transform:scale(1.1); } 
  100%{ transform:scale(1); } 
}

/*  TABLET */
@media (min-width:768px){ 
  .hero-container{ 
    max-width:800px; 
  } 
  .hero-img{ 
    max-width:800px; 
  } 
   
} 

/*  DESKTOP */
@media (min-width:1024px){ 
  .navbar{ 
    display:grid; 
    grid-template-columns:1fr auto 1fr; 
    align-items:center; 
    
  } 

  .logo{ 
    justify-self:end; 
  } 

  .nav-links{ 
    display:flex; 
    justify-content:center; 
    position:static; 
    flex-direction:row; 
    gap:30px; 
    background:none; 
  
  } 

  .menu{ 
    display:none; 
  } 

  .hero-container{ 
    max-width:100%; 
    padding:30px 40px; 
  } 

  .hero-img{ 
    max-width:1200px; 
    margin:auto; 
  } 

  .hero-img img{ 
    height:600px; 
    object-fit:cover; 
  } 

  .hero-text{ 
    max-width:600px; 
    margin:auto; 
  } 

  .hero-text h1{ 
    font-size:42px; 
  } 

  .hero-buttons{ 
    flex-direction:row; 
    justify-content:center; 
  } 
} 

/*  LARGE */
@media (min-width:1400px){ 
  .hero-img{ 
    max-width:1300px; 
  } 

  .hero-img img{ 
    height:650px; 
  } 
} 

.products{ 
  padding:60px 20px; 
} 

.section-title{ 
  text-align:center; 
  font-size:30px; 
  margin-bottom:30px; 
} 

.section-title::after{ 
  content:""; 
  width:60px; 
  height:3px; 
  background:#B99A6B; 
  display:block; 
  margin:10px auto; 
} 

/*  SWIPER */
.swiper{ 
  width:100%; 
  padding:20px 10px 60px; 
  overflow:hidden; 
} 

.swiper-slide{ 
  display:flex; 
  justify-content:center; 
}


/*  ARROWS  */
.swiper-button-next, 
.swiper-button-prev{ 
  color:#000 !important; 
  background:#fff; 
  width:40px; 
  height:40px; 
  border-radius:50%; 
  box-shadow:0 5px 15px rgba(0,0,0,0.4); 
} 

.swiper-button-next::after, 
.swiper-button-prev::after{ 
  font-size:16px; 
  font-weight:bold; 
} 

.swiper-button-next:hover, 
.swiper-button-prev:hover{ 
  background:#B99A6B; 
} 

/*  PAGINATION  */
.swiper-pagination{ 
  position:absolute; 
  bottom:5px !important; 
  width:100%; 
} 

.swiper-pagination-bullet{ 
  background:#aaa; 
  opacity:1; 
} 

.swiper-pagination-bullet-active{ 
  background:#B99A6B; 
} 

/*  SLIDER CARD  */
.slider-card{
  position:relative;
  width:100%;
  max-width:260px;
  border-radius:20px;
  overflow:hidden;
  background:var(--card);
  border:1px solid var(--lav-line);
  box-shadow:0 10px 30px rgba(52,38,58,0.10);
}

/* الصورة */
.slider-card img{
  width:100%;
  height:340px;
  object-fit:cover;
  display:block;
}
.order-now{
  text-decoration:none !important;
  border:none;
  outline:none;
}
/* BADGES FIXED  */

.price-badge{
  position:absolute;
  top:10px;
  right:10px;
  z-index:10;
  background:#B99A6B;
  color:#000;
  padding:5px 9px;
  border-radius:6px;
  font-size:13px;
  font-weight:bold;
  cursor: pointer;
  transition: all .3s;
}

.price-badge:hover{
  background: #000;
  color: #fff;
}

.discount{
  position:absolute;
  top:10px;
  left:10px;
  z-index:10;
  background:var(--lav-soft);
  color:var(--plum-deep);
  border:1px solid var(--lav-line);
  padding:5px 9px;
  border-radius:6px;
  font-size:12px;
  font-weight:bold;
  transition: all .3s;
  cursor: pointer;
}

.discount:hover{
  background: #B99A6B;
  color: #000;
}


/*  OVERLAY  */

.slider-card .card-content{
  position:absolute;
  bottom:0;
  width:100%;
  padding:14px 12px;
  text-align:center;

  background:linear-gradient(
    to top,
    rgba(52,38,58,0.92),
    rgba(52,38,58,0.45),
    transparent
  );

  display:flex;
  flex-direction:column;
  gap:6px;

  z-index:5;
}

/*  TITLE  */
.slider-card .card-content h3{
  font-size:16px;
  margin-top:18px;  
  margin-bottom:6px;

  color:var(--ivory);

  text-shadow:0 2px 8px rgba(52,38,58,0.6);

  font-weight:600;
  letter-spacing:0.5px;
}

/*  BUTTON */

.slider-card .order-now{
  display:block;
  width:90%;
  margin:auto;
  background:var(--plum-deep);
  color:var(--ivory);
  padding:8px;
  border-radius:8px;
  font-size:12px;
  transition: all .3s;
}
.slider-card .order-now:hover{
  background:var(--gold);
  color:var(--plum-deep);
}

/*  RESPONSIVE */


@media (max-width:767px){

  .slider-card{
    max-width:90%;
  }

  .slider-card img{
    height:280px;
  }

}


@media (min-width:768px){

  .slider-card{
    max-width:240px;
  }

  .slider-card img{
    height:300px;
  }

}

@media (min-width:1024px){

  .slider-card{
    max-width:260px;
  }

  .slider-card img{
    height:340px;
  }

}

/*  RESPONSIVE */


@media (max-width:767px){ 
  .product-card{ 
    max-width:90%; 
  } 

  .product-card img{ 
    height:280px; 
  } 
} 


@media (min-width:768px){ 
  .product-card{ 
    max-width:240px; 
  } 

  .product-card img{ 
    height:300px; 
  } 
} 

@media (min-width:1024px){ 
  .product-card{ 
    max-width:260px; 
  } 

  .product-card img{ 
    height:340px; 
  } 

  .nav-links{ 
    display:flex; 
    position:static; 
    flex-direction:row; 
    gap:30px; 
    background:none; 
  } 

  .menu{ 
    display:none; 
  } 

  .order-btn{ 
    display:block; 
  } 
} 

/*  FILTER SECTION */
.filter-section{ 
  padding:2rem 20px; 
  background:transparent; 
  text-align:center; 
} 

.filter-section h2{ 
  font-family:'Playfair Display', serif; 
  font-size:30px; 
  color:var(--plum-deep); 
  margin-bottom:30px; 
} 

/*  BUTTONS  */
.filter-buttons{ 
  display:flex; 
  justify-content:center; 
  gap:10px; 
  flex-wrap:wrap; 
  margin-bottom:40px; 
} 

.filter-buttons button{ 
  padding:10px 20px; 
  border:1px solid var(--lav-line); 
  background:var(--card); 
  color:var(--plum-deep); 
  border-radius:25px; 
  cursor:pointer; 
  transition:0.3s; 
  font-size:14px; 
} 

.filter-buttons button:hover, 
.filter-buttons .active{ 
  background:var(--plum-deep); 
  border-color:var(--plum-deep);
  color:var(--ivory); 
} 

/*  GRID  */
.products-container{ 
  display:grid; 
  gap:15px; 
  max-width:1200px; 
  margin:auto; 
  padding:20px 5rem; 
} 


@media (max-width:767px){ 
  .products-container{ 
    grid-template-columns:1fr; 
  } 
} 


@media (min-width:768px){ 
  .products-container{ 
    grid-template-columns:repeat(2,1fr); 
  } 
} 


@media (min-width:1024px){ 
  .products-container{ 
    grid-template-columns:repeat(4,1fr); 
  } 
} 


@media (min-width:1400px){ 
  .products-container{ 
    grid-template-columns:repeat(4,1fr); 
    margin: auto;
  } 
}

/*  CARD */
.card{ 
  background:var(--card); 
  border:1px solid var(--lav-line);
  border-radius:18px; 
  overflow:hidden; 
  box-shadow:0 8px 24px rgba(52,38,58,0.08); 
  transition:0.3s; 
  max-width:230px; 
  width:100%; 
  margin:auto; 
  position:relative; 
} 

.card:hover{ 
  transform:translateY(-6px); 
} 

/* DELETE BUTTON */
.remove-item{
  position:absolute;
  top:-8px;
  left:4px; 
  width:20px;
  height:20px;
  border-radius:50%;
  border:none;
  background:#fff;
  color:red;
  font-size:18px;
  font-weight:bold;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 2px 8px rgba(0,0,0,0.15);
  transition:0.2s;
  z-index:10;
}

.remove-item:hover{
  transform:scale(1.1);
  background:#ffe5e5;
}

/*  IMAGE*/
.card-img{ 
  height:140px; 
  background:#fff; 
  display:flex; 
  align-items:center; 
  justify-content:center; 
} 

.card-img img{ 
  max-width:100%; 
  max-height:80%; 
  object-fit:contain; 
  transition:0.3s; 
} 

.card:hover img{ 
  transform:scale(1.05); 
} 

/* INFO  */
.card-info{ 
  padding:12px; 
  text-align:center; 
} 

.card-info h3{ 
  color:var(--plum-deep); 
  font-size:15px; 
  margin-bottom:5px; 
} 

.price{ 
  color:#B99A6B; 
  font-weight:bold; 
  font-size:14px; 
} 

.size{ 
  color:#777; 
  font-size:12px; 
  margin-bottom:8px; 
} 

/*  QUANTITY */
.quantity{ 
  display:flex; 
  justify-content:center; 
  align-items:center; 
  gap:8px; 
  margin:8px 8px; 
} 

.quantity button{ 
  width:32px; 
  height:32px; 
  border:none; 
  background:var(--plum-muted); 
  color:#fff; 
  border-radius:8px; 
  cursor:pointer; 
  font-size:16px;
  line-height:1;
} 

.quantity span{ 
  font-size:13px; 
  color:var(--plum-deep); 
  font-weight:bold;
  min-width:20px;
  text-align:center;
} 

/*  BUTTON */
.order-btn2{ 
  display:block; 
  background:var(--plum-deep); 
  color:var(--ivory); 
  padding:7px; 
  border-radius:8px; 
  text-decoration:none; 
  width:100%; 
  transition:0.3s; 
} 

.order-btn2:hover{ 
  background:var(--gold); 
  color:var(--plum-deep);
}

/* ORDER  */
.order-section{ 
  padding:60px 15px; 
  text-align:center; 
} 

.section-title{
  font-size:28px;
}

.section-subtitle{ 
  color:#aaa; 
  margin-bottom:25px; 
  font-size:14px;
} 

.order-box{ 
  width:100%;
  max-width:700px; 
  margin:auto; 
  padding:20px; 
  border-radius:20px; 
  background:var(--card); 
  border:1px solid var(--lav-line); 
  box-shadow:0 12px 40px rgba(52,38,58,0.10); 
} 

.order-box form{ 
  display:flex; 
  flex-direction:column; 
  gap:12px; 
  text-align:right; 
} 

.order-box label{ 
  font-size:13px; 
  color:var(--plum-deep); 
  font-weight:600;
} 

.order-box input{ 
  width:100%;
  padding:12px; 
  border-radius:10px; 
  border:1px solid var(--lav-line); 
  background:#FBF9FC; 
  color:var(--plum-ink);
  font-size:16px; 
  font-family:'Cairo',sans-serif;
  outline:none; 
}

.order-box input:focus{
  border-color:var(--plum-muted);
  box-shadow:0 0 0 3px rgba(142,113,159,0.15);
} 

/*  CART  */
#selectedProductBox{ 
  text-align:right; 
  margin-bottom:10px; 
} 

#cartItems{
  display:flex;
  gap:10px;
  overflow-x:auto;
  padding-bottom:10px;
  scroll-behavior:smooth;
}

/* selected product card */
.selected-product{ 
  min-width:170px;  
  display:flex; 
  align-items:center; 
  gap:10px; 
  background:var(--lav-soft); 
  border:1px solid var(--lav-line);
  padding:10px; 
  border-radius:10px; 
  position:relative; 
} 

.selected-product img{ 
  width:45px; 
  height:45px; 
  object-fit:cover; 
  border-radius:8px; 
  border:2px solid var(--gold); 
} 

.selected-product div{ 
  flex:1; 
} 

.selected-product p{ 
  margin:2px 0; 
  font-size:11px; 
  color:var(--plum-deep);
} 

.selected-product input{ 
  width:45px; 
  padding:5px; 
  border-radius:6px; 
  border:none; 
  text-align:center; 
} 

.order-box button{ 
  margin-top:10px; 
  padding:10px; 
  border:none; 
  border-radius:10px; 
  font-weight:bold; 
  background:var(--plum-deep); 
  color:var(--ivory); 
  cursor:pointer; 
  transition:0.3s; 
 
} 

.order-box button:hover{ 
  transform:translateY(-2px); 
  box-shadow:0 10px 20px rgba(52,38,58,0.25); 
} 

.switch-form{ 
  color:var(--plum-muted); 
  cursor:pointer; 
  font-size:13px; 
  text-align:center; 
  font-family:'Cairo',sans-serif;
  width:100%;
}

/* switch-form is a <button>: undo the .order-box submit-button look */
.order-box button.switch-form{
  background:none;
  color:var(--plum-muted);
  margin-top:0;
  padding:4px;
  border-radius:0;
  font-weight:normal;
  box-shadow:none;
}

.order-box button.switch-form:hover{
  transform:none;
  box-shadow:none;
  text-decoration:underline;
}

.field-error{
  display:none;
  color:var(--danger);
  font-size:12px;
  margin-top:-6px;
}

.field-error.show{
  display:block;
}

.order-box input[aria-invalid="true"]{
  border-color:var(--danger);
  box-shadow:0 0 0 3px rgba(155,44,44,0.12);
}

.order-box button[type="submit"]:disabled{
  opacity:0.6;
  cursor:wait;
  transform:none;
}

.success-message button{
  background:var(--plum-deep);
  color:var(--ivory);
  margin-top:12px;
  width:100%;
} 

.switch-form:hover{ 
  text-decoration:underline; 
}

/*  MOBILE */
@media (max-width:768px){

  .section-title{
    font-size:22px;
  }

  .order-box{
    padding:15px;
  }

  .order-box input{
    font-size:13px;
    padding:10px;
  }

  .selected-product{
    min-width:150px;
    flex-direction:column;
    align-items:flex-start;
  }

  .selected-product img{
    width:40px;
    height:40px;
  }

  .selected-product p{
    font-size:10px;
  }

  .selected-product input{
    width:100%;
  }

}

/* SMALL MOBILE */
@media (max-width:480px){

  .order-section{
    padding:40px 10px;
  }

  .section-title{
    font-size:20px;
  }

  .section-subtitle{
    font-size:13px;
  }

}
input[type="number"] { 
  appearance: auto; 
  -webkit-appearance: auto; 
  -moz-appearance: auto; 
} 

input[type="number"]::-webkit-inner-spin-button, 
input[type="number"]::-webkit-outer-spin-button { 
  opacity: 1; 
  display: block; 
} 

/*  FILTER QUANTITY = */
.filter-quantity{ 
  display:flex; 
  justify-content:center; 
  align-items:center; 
  gap:8px; 
  margin:8px 0; 
} 

.filter-quantity button{ 
  width:24px; 
  height:24px; 
  border:none; 
  background:#B99A6B; 
  color:#000; 
  border-radius:5px; 
  cursor:pointer; 
} 

.filter-quantity span{ 
  font-size:13px; 
  color:#000; 
}
.filter-section .card{ 
  background:#fff; 
  border-radius:18px; 
  overflow:hidden; 
  box-shadow:0 8px 20px rgba(0,0,0,0.08); 
  transition:0.3s; 
  max-width:240px; 

  width:100%; 
  margin:auto; 
  margin:auto; 
} 


.products-container .card-info{
  transform: translateY(-12px);
}


.products-container .quantity{
  margin-top: 0;
}


.products-container .order-btn2{
  margin-top: 8px;
}
.success-message {
  display: none;
  background: #d4edda;
  color: #155724;
  padding: 12px;
  margin-top: 15px;
  border-radius: 6px;
  text-align: center;
  font-size: 14px;
}

@keyframes fadeIn{
  from{opacity:0; transform:translateY(10px);}
  to{opacity:1; transform:translateY(0);}
}

/* FOOTER */

.site-footer{
  background:var(--plum-deep);
  color:var(--ivory);
  margin-top:60px;
  padding:70px 0 25px;
  font-family:'Cairo', sans-serif;
  border-top:2px solid var(--gold);
  text-align: center;
}

/* container */
.footer-container{
  max-width:1100px;
  margin:0 auto;   
  padding:0 20px;  
  
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap:50px;
}

/* box */
.footer-box{
  display:flex;
  flex-direction:column;
  gap:12px;
}

/* logo */
.footer-logo img{
  width:120px;
  height:auto;
  border-radius:25%;
}

/* text */
.footer-box p{
  color:var(--lavender);
  line-height:1.8;
  font-size:14px;
  margin:0;
}

/* titles */
.footer-box h3{
  color:#B99A6B;
  font-size:17px;
  margin-bottom:10px;
}

/* links */
.footer-box ul{
  list-style:none;
  padding:0;
  margin:0;
  
}

.footer-box ul li{
  margin-bottom:10px;
}

.footer-box a{
  color:var(--lavender);
  text-decoration:none;
  transition:0.3s;
}

.footer-box a:hover{
  color:#fff;
  padding-right:6px;
}

.social{
  display:flex;
  justify-content:center;
  gap:12px;
  margin-top:10px;
  
}

.social a{
  width:45px;
  height:45px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(201,182,217,0.35);
  color:#fff;
  font-size:18px;
  transition:0.3s;
}

/* colors */
.social a.fb{ color:#1877f2; }
.social a.wa{ color:#25d366; }

/* hover */
.social a:hover{
  transform:translateY(-3px);
  background:rgba(255,255,255,0.16);
}

/* bottom */
.footer-bottom{
  text-align:center;
  margin-top:45px;
  padding-top:18px;
  border-top:1px solid rgba(201,182,217,0.3);
  font-size:13px;
  color:var(--lavender);
}


@media (max-width:768px){

  .order-btn{
    padding:4px 10px;
    font-size:12px;
    border-radius:14px;
  }

}

/*reviews*/


.testimonials{
  padding:80px 20px;
  text-align:center;
 
}


.testimonials-container{
  display:grid;
  gap:20px;
  max-width:1200px;
  margin:auto;

    
}


@media (min-width:768px){
  .testimonials-container{
    grid-template-columns:repeat(2,1fr);
  }
}

@media (min-width:1024px){
  .testimonials-container{
    grid-template-columns:repeat(3,1fr);
  }
}


.testimonial-card{
  background:var(--card);
  border:1px solid var(--lav-line);
  border-radius:20px;
  padding:20px;
  text-align:right;
  transition:0.3s;
  box-shadow:0 6px 20px rgba(52,38,58,0.06);
}

/* hover */
.testimonial-card:hover{
  transform:translateY(-8px);
  box-shadow:0 10px 30px rgba(142,113,159,0.18);
}


.stars{
  color:#D6BE91;
  margin-bottom:10px;
  letter-spacing:2px;
}


.review{
  color:var(--plum-ink);
  font-size:14px;
  line-height:1.8;
  margin-bottom:15px;
}


.user{
  display:flex;
  align-items:center;
  gap:10px;
}


.avatar{
  width:40px;
  height:40px;
  border-radius:50%;
  background:linear-gradient(135deg,#B99A6B,#D6BE91);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#000;
  font-weight:bold;
}

.user h4{
  font-size:14px;
  margin:0;
  color:var(--plum-deep);
}


.user span{
  font-size:12px;
  color:var(--plum-muted);
}

/* ============ CART SYSTEM (Phase 1) ============ */
body.cart-locked{
  overflow:hidden;
}

.nav-left{
  display:flex;
  align-items:center;
  gap:10px;
}

.cart-btn{
  display:flex;
  align-items:center;
  gap:8px;
  background:var(--card);
  color:var(--plum-deep);
  border:1px solid var(--lav-line);
  border-radius:25px;
  padding:7px 14px;
  font-family:'Cairo',sans-serif;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  transition:0.3s;
  box-shadow:0 2px 10px rgba(52,38,58,0.06);
}

.cart-btn:hover{
  border-color:var(--gold);
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(52,38,58,0.12);
}

.cart-btn i{
  color:var(--gold);
  font-size:16px;
}

.cart-count{
  min-width:24px;
  height:24px;
  padding:0 6px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  background:var(--lav-soft);
  color:var(--plum-muted);
  font-size:13px;
  font-weight:bold;
  transition:0.3s;
}

.cart-count.has-items{
  background:var(--plum-deep);
  color:var(--ivory);
}

.cart-overlay{
  position:fixed;
  inset:0;
  background:rgba(52,38,58,0.45);
  opacity:0;
  visibility:hidden;
  transition:0.3s;
  z-index:2000;
}

.cart-overlay.show{
  opacity:1;
  visibility:visible;
}

.cart-drawer{
  position:fixed;
  top:0;
  left:0;
  height:100dvh;
  width:min(420px, 92vw);
  background:var(--ivory);
  z-index:2001;
  display:flex;
  flex-direction:column;
  transform:translateX(-105%);
  transition:transform 0.35s ease;
  box-shadow:10px 0 40px rgba(52,38,58,0.18);
  border-right:1px solid var(--lav-line);
}

.cart-drawer.open{
  transform:translateX(0);
}

.cart-drawer-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 18px;
  border-bottom:1px solid var(--lav-line);
  background:var(--card);
}

.cart-drawer-header h3{
  font-size:18px;
  color:var(--plum-deep);
  margin:0;
  display:flex;
  align-items:center;
  gap:8px;
}

.cart-drawer-header h3 i{
  color:var(--gold);
}

.cart-close{
  width:34px;
  height:34px;
  border-radius:50%;
  border:1px solid var(--lav-line);
  background:var(--lav-soft);
  color:var(--plum-deep);
  font-size:20px;
  line-height:1;
  cursor:pointer;
  transition:0.3s;
}

.cart-close:hover{
  background:var(--plum-deep);
  color:var(--ivory);
}

.cart-drawer-body{
  flex:1;
  overflow-y:auto;
  padding:14px;
}

.cart-empty{
  text-align:center;
  padding:50px 20px;
  color:var(--plum-muted);
}

.cart-empty i{
  font-size:44px;
  color:var(--lavender);
  margin-bottom:12px;
}

.cart-empty p{
  font-size:18px;
  font-weight:bold;
  color:var(--plum-deep);
  margin-bottom:6px;
}

.cart-empty span{
  font-size:13px;
  display:block;
  margin-bottom:18px;
}

.cart-empty button,
.empty-warning button{
  background:var(--plum-deep);
  color:var(--ivory);
  border:none;
  border-radius:10px;
  padding:10px 22px;
  font-family:'Cairo',sans-serif;
  font-size:14px;
  font-weight:bold;
  cursor:pointer;
  transition:0.3s;
}

.cart-empty button:hover,
.empty-warning button:hover{
  background:var(--gold);
  color:var(--plum-deep);
}

.drawer-item{
  display:flex;
  gap:12px;
  background:var(--card);
  border:1px solid var(--lav-line);
  border-radius:14px;
  padding:12px;
  margin-bottom:10px;
  box-shadow:0 4px 14px rgba(52,38,58,0.05);
}

.drawer-item img{
  width:64px;
  height:64px;
  object-fit:cover;
  border-radius:10px;
  border:2px solid var(--lav-line);
  flex-shrink:0;
}

.drawer-info{
  flex:1;
  min-width:0;
}

.drawer-info h4{
  font-size:14px;
  color:var(--plum-deep);
  margin:0 0 2px;
  font-family:'Cairo',sans-serif;
}

.drawer-price{
  font-size:12px;
  color:var(--muted);
}

.drawer-qty{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:8px;
}

.drawer-qty button{
  width:40px;
  height:40px;
  border:none;
  border-radius:10px;
  background:var(--plum-muted);
  color:#fff;
  font-size:18px;
  font-weight:bold;
  cursor:pointer;
  transition:0.2s;
  line-height:1;
}

.drawer-qty button:hover{
  background:var(--plum-deep);
}

.drawer-qty span{
  font-size:14px;
  font-weight:bold;
  color:var(--plum-deep);
  min-width:22px;
  text-align:center;
}

.drawer-side{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  justify-content:space-between;
  gap:8px;
}

.drawer-side strong{
  font-size:13px;
  color:var(--plum-deep);
  white-space:nowrap;
}

.drawer-side button{
  background:none;
  border:none;
  color:#b05656;
  font-family:'Cairo',sans-serif;
  font-size:12px;
  cursor:pointer;
  padding:4px 2px;
}

.drawer-side button:hover{
  text-decoration:underline;
}

.cart-drawer-footer{
  border-top:1px solid var(--lav-line);
  background:var(--card);
  padding:14px 18px 18px;
}

.drawer-summary{
  margin-bottom:12px;
}

.checkout-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:14px;
  color:var(--plum-muted);
  padding:4px 0;
}

.checkout-row strong{
  color:var(--plum-deep);
}

.checkout-row.grand{
  font-size:16px;
  border-top:1px dashed var(--lav-line);
  margin-top:6px;
  padding-top:10px;
}

.checkout-row.grand strong{
  color:var(--plum-deep);
  font-size:18px;
}

.drawer-checkout{
  width:100%;
  padding:13px;
  border:none;
  border-radius:12px;
  background:var(--plum-deep);
  color:var(--ivory);
  font-family:'Cairo',sans-serif;
  font-size:15px;
  font-weight:bold;
  cursor:pointer;
  transition:0.3s;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}

.drawer-checkout:hover{
  background:var(--gold);
  color:var(--plum-deep);
  transform:translateY(-2px);
  box-shadow:0 8px 20px rgba(185,154,107,0.35);
}

.drawer-actions{
  display:flex;
  gap:10px;
  margin-top:10px;
}

.drawer-actions button{
  flex:1;
  padding:10px;
  border-radius:10px;
  font-family:'Cairo',sans-serif;
  font-size:13px;
  cursor:pointer;
  transition:0.3s;
}

#continueBtn{
  border:1px solid var(--lav-line);
  background:var(--ivory);
  color:var(--plum-deep);
  font-weight:600;
}

#continueBtn:hover{
  border-color:var(--plum-muted);
}

#clearCartBtn{
  border:1px solid #e5c3c3;
  background:#fdf3f3;
  color:#b05656;
}

#clearCartBtn:hover{
  background:#fbe4e4;
}

.cart-toast{
  position:fixed;
  bottom:90px;
  right:50%;
  transform:translateX(50%) translateY(20px);
  background:var(--plum-deep);
  color:var(--ivory);
  padding:12px 24px;
  border-radius:30px;
  font-size:14px;
  z-index:3000;
  opacity:0;
  visibility:hidden;
  transition:0.3s;
  box-shadow:0 10px 30px rgba(52,38,58,0.3);
  white-space:nowrap;
  max-width:92vw;
}

.cart-toast.show{
  opacity:1;
  visibility:visible;
  transform:translateX(50%) translateY(0);
}

.checkout-summary{
  background:var(--lav-soft);
  border:1px solid var(--lav-line);
  border-radius:12px;
  padding:10px 14px;
  margin-top:10px;
}

.empty-warning{
  background:#fdf3f3;
  border:1px solid #e5c3c3;
  color:#8a4b4b;
  border-radius:12px;
  padding:12px;
  margin-top:10px;
  font-size:13px;
  text-align:center;
}

.empty-warning button{
  margin-top:8px;
}

/* Small phones: full-width drawer, compact rows */
@media (max-width:480px){
  .cart-drawer{
    width:94vw;
  }

  .nav-left{
    gap:6px;
  }

  .cart-btn{
    padding:5px 10px;
    font-size:12px;
  }

  .cart-label{
    display:none;
  }

  .drawer-item img{
    width:54px;
    height:54px;
  }
}