/* ============================================
   Fix My Space — Shopping Cart Styles
   Matches site palette: #1C1C1C (ink), #C9A84C (gold),
   #2D4A3E (green), #FAF8F4 / #F5F2ED (cream), #7A7165 (muted)
   Fonts: 'Cormorant Garamond' (headings), 'Outfit' (body)
   ============================================ */

#fmsCart, #fmsCart * { box-sizing: border-box; }

/* ---------- Add to Cart button inside product price rows ---------- */
.sp-row{ gap:8px; flex-wrap:nowrap; }
.sp-info{ display:flex; justify-content:space-between; align-items:center; flex:1; min-width:0; gap:6px; }

.fms-add-to-cart{
  flex-shrink:0;
  background:#1C1C1C;
  color:#fff;
  border:none;
  border-radius:4px;
  padding:6px 10px;
  font-family:'Outfit',sans-serif;
  font-size:.68rem;
  font-weight:600;
  letter-spacing:.02em;
  cursor:pointer;
  transition:background .2s, transform .15s;
  white-space:nowrap;
}
.fms-add-to-cart:hover{ background:#C9A84C; color:#1C1C1C; }
.fms-add-to-cart:active{ transform:scale(.95); }
.fms-add-to-cart.fms-added{ background:#2D4A3E; color:#fff; }

/* ---------- Floating cart launcher button ---------- */
#fmsCartLauncher{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:9998;
  width:58px;
  height:58px;
  border-radius:50%;
  background:#1C1C1C;
  color:#fff;
  border:2px solid #C9A84C;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.5rem;
  cursor:pointer;
  box-shadow:0 6px 20px rgba(0,0,0,.25);
  transition:transform .2s, background .2s;
}
#fmsCartLauncher:hover{ background:#2D4A3E; transform:translateY(-2px); }
#fmsCartLauncher .fms-badge{
  position:absolute;
  top:-6px;
  right:-6px;
  background:#C9A84C;
  color:#1C1C1C;
  font-family:'Outfit',sans-serif;
  font-size:.7rem;
  font-weight:700;
  min-width:22px;
  height:22px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 4px;
  border:2px solid #FAF8F4;
}
#fmsCartLauncher .fms-badge.fms-hide{ display:none; }
#fmsCartLauncher.fms-bump{ animation:fmsBump .35s ease; }
@keyframes fmsBump{ 0%{transform:scale(1)} 40%{transform:scale(1.18)} 100%{transform:scale(1)} }

/* ---------- Overlay ---------- */
#fmsOverlay{
  position:fixed; inset:0;
  background:rgba(28,28,28,.55);
  z-index:9997;
  opacity:0;
  pointer-events:none;
  transition:opacity .3s;
}
#fmsOverlay.fms-open{ opacity:1; pointer-events:auto; }

/* ---------- Drawer ---------- */
#fmsDrawer{
  position:fixed;
  top:0; right:0;
  width:min(420px, 100vw);
  height:100%;
  background:#FAF8F4;
  z-index:9999;
  transform:translateX(100%);
  transition:transform .35s cubic-bezier(.4,0,.2,1);
  display:flex;
  flex-direction:column;
  box-shadow:-8px 0 30px rgba(0,0,0,.2);
  font-family:'Outfit',sans-serif;
  color:#1C1C1C;
}
#fmsDrawer.fms-open{ transform:translateX(0); }

.fms-drawer-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:20px 22px;
  background:#1C1C1C;
  color:#fff;
  flex-shrink:0;
}
.fms-drawer-header h2{
  font-family:'Cormorant Garamond',serif;
  font-weight:400;
  font-size:1.5rem;
  margin:0;
  letter-spacing:.02em;
}
.fms-drawer-header h2 em{ font-style:italic; color:#C9A84C; }
.fms-close-btn{
  background:none;
  border:1px solid rgba(255,255,255,.3);
  color:#fff;
  width:32px;
  height:32px;
  border-radius:50%;
  font-size:1.1rem;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:background .2s;
}
.fms-close-btn:hover{ background:rgba(255,255,255,.15); }

.fms-drawer-body{
  flex:1;
  overflow-y:auto;
  padding:18px 22px;
}

.fms-empty{
  text-align:center;
  padding:60px 20px;
  color:#7A7165;
}
.fms-empty-icon{ font-size:2.4rem; margin-bottom:10px; }
.fms-empty p{ font-size:.9rem; line-height:1.7; }

.fms-item{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
  padding:14px 0;
  border-bottom:1px solid #E8E3DA;
}
.fms-item:last-child{ border-bottom:none; }
.fms-item-info{ flex:1; min-width:0; }
.fms-item-name{
  font-weight:600;
  font-size:.85rem;
  color:#1C1C1C;
  margin-bottom:2px;
}
.fms-item-price{
  font-size:.75rem;
  color:#7A7165;
}
.fms-item-controls{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:8px;
}
.fms-qty-btn{
  width:24px; height:24px;
  border-radius:4px;
  border:1px solid #E8E3DA;
  background:#fff;
  color:#1C1C1C;
  font-size:.9rem;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:1;
  transition:background .2s;
}
.fms-qty-btn:hover{ background:#F5F2ED; border-color:#C9A84C; }
.fms-qty-val{
  min-width:26px;
  text-align:center;
  font-size:.82rem;
  font-weight:600;
}
.fms-item-remove{
  background:none;
  border:none;
  color:#B3413E;
  font-size:.7rem;
  cursor:pointer;
  text-decoration:underline;
  padding:0;
  margin-left:6px;
}
.fms-item-line-total{
  font-weight:700;
  font-size:.85rem;
  white-space:nowrap;
  padding-top:2px;
}

.fms-drawer-footer{
  flex-shrink:0;
  border-top:1px solid #E8E3DA;
  background:#fff;
  padding:18px 22px 22px;
}
.fms-subtotal-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:14px;
  font-size:.95rem;
}
.fms-subtotal-row .fms-total-val{
  font-family:'Cormorant Garamond',serif;
  font-size:1.5rem;
  font-weight:600;
  color:#2D4A3E;
}
.fms-note{
  font-size:.68rem;
  color:#7A7165;
  margin-bottom:14px;
  line-height:1.5;
}

.fms-btn{
  width:100%;
  padding:13px 16px;
  border:none;
  border-radius:4px;
  font-family:'Outfit',sans-serif;
  font-size:.82rem;
  font-weight:600;
  letter-spacing:.03em;
  text-transform:uppercase;
  cursor:pointer;
  transition:background .2s;
  margin-bottom:10px;
}
.fms-btn-primary{ background:#C9A84C; color:#1C1C1C; }
.fms-btn-primary:hover{ background:#E2C97E; }
.fms-btn-secondary{ background:#1C1C1C; color:#fff; }
.fms-btn-secondary:hover{ background:#2D4A3E; }
.fms-btn-whatsapp{ background:#25D366; color:#fff; }
.fms-btn-whatsapp:hover{ background:#20bb5a; }
.fms-btn:disabled{ opacity:.6; cursor:not-allowed; }

/* ---------- Checkout form ---------- */
.fms-field{ margin-bottom:14px; }
.fms-field label{
  display:block;
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:#7A7165;
  margin-bottom:6px;
  font-weight:600;
}
.fms-field input,
.fms-field textarea{
  width:100%;
  padding:10px 12px;
  border:1px solid #E8E3DA;
  border-radius:4px;
  font-family:'Outfit',sans-serif;
  font-size:.85rem;
  background:#FAF8F4;
  color:#1C1C1C;
}
.fms-field input:focus,
.fms-field textarea:focus{
  outline:none;
  border-color:#C9A84C;
  background:#fff;
}
.fms-field textarea{ resize:vertical; min-height:60px; }
.fms-back-link{
  display:inline-flex;
  align-items:center;
  gap:5px;
  background:none;
  border:none;
  color:#7A7165;
  font-size:.75rem;
  cursor:pointer;
  margin-bottom:14px;
  padding:0;
}
.fms-back-link:hover{ color:#1C1C1C; }

/* ---------- Payment status ---------- */
.fms-pay-status{
  text-align:center;
  padding:20px 6px 6px;
}
.fms-spinner{
  width:34px; height:34px;
  border:3px solid #E8E3DA;
  border-top-color:#C9A84C;
  border-radius:50%;
  margin:0 auto 14px;
  animation:fmsSpin 1s linear infinite;
}
@keyframes fmsSpin{ to{ transform:rotate(360deg); } }
.fms-pay-status p{ font-size:.82rem; color:#7A7165; line-height:1.7; margin-bottom:16px; }
.fms-pay-status strong{ color:#1C1C1C; }

/* ---------- Toast ---------- */
#fmsToast{
  position:fixed;
  left:50%;
  bottom:90px;
  transform:translate(-50%, 20px);
  background:#1C1C1C;
  color:#fff;
  padding:11px 20px;
  border-radius:100px;
  font-family:'Outfit',sans-serif;
  font-size:.78rem;
  font-weight:500;
  z-index:10000;
  opacity:0;
  pointer-events:none;
  transition:opacity .25s, transform .25s;
  box-shadow:0 6px 20px rgba(0,0,0,.25);
  white-space:nowrap;
}
#fmsToast.fms-show{ opacity:1; transform:translate(-50%, 0); }
#fmsToast strong{ color:#C9A84C; }

@media (max-width:480px){
  #fmsCartLauncher{ right:16px; bottom:16px; width:52px; height:52px; font-size:1.3rem; }
  #fmsDrawer{ width:100vw; }
  #fmsToast{ font-size:.72rem; padding:10px 16px; bottom:80px; max-width:90vw; white-space:normal; text-align:center; }
}