/** Shopify CDN: Minification failed

Line 38:41 Unexpected "@app"

**/


/* ==========================================================================
   EXISTING FUNCTIONAL STYLES - KEEP AS IS
   ========================================================================== */

/* Product Options */
.m-product-option--node{width:100%!important;}
.prod__option--button .m-product-option--node input:checked+label {
background-color: transparent;
border-color: #000000;
color: #000000;
}

/* Discount Tag */
.prod__tag-discounted {
background-color: #FF5349;
color: #fff;
height: 22px;
font-size: 16px!important;
}

/* Trust Badge */
.m-product-trust-badge {
  padding: 0px;
  background-color: #fff;
}

.main-product__block.main-product__block-trust_badge {
margin-top: 0px;
}

.main-product__block.main-product__block-@app {
  margin-top: 20px;
}

/* Quantity Upsell */
.f-quantity-upsell {
    padding-top: 5px;
    padding-bottom: 5px;
}

.f-quantity-upsell__product {
  padding-top: 0px;
  padding-bottom: 0px;
}

/* Cart Styling */
@media(max-width:767px){
  .sf-cart__table-price{
    flex-direction: row !important;
    display: flex!important;
    align-items: center!important;
}
 .sf-cart__quantity{
   margin-top: 0px !important;
   margin-left:20px!important;
 } 
}
/* ==========================================================================
   SPACING OPTIMIZATION ONLY - NO COMPONENT-SPECIFIC STYLES
   ========================================================================== */

/* 🔥 REPLACE: Old spacing rules with optimized ones */
.main-product__block {
  margin-bottom: 0.75rem !important; /* Optimized from various values */
}

.main-product__block + .main-product__block {
  margin-top: -0.25rem !important; /* Pull blocks closer */
}

/* Updated specific block spacing */
.main-product__block.main-product__block-variant_picker {
  margin-top: 0.5rem !important; /* Reduced from 15px */
  margin-bottom: 0.5rem !important;
}

.main-product__block.main-product__block-buy_buttons {
  margin-top: 4px !important; /* Reduced from 10px */
}

.m-product-form--wrapper {
  margin-top: 0.5rem !important; /* Reduced from 15px */
}

.main-product__block.main-product__block-shipping { 
  margin-top: 0.5rem !important; /* Reduced from 10px */
}

.main-product__block.main-product__block-custom_liquid {
  margin-top: 1rem !important; /* Reduced from 20px */
}

.main-product__block.main-product__block-custom_text {
  margin-top: 0.75rem !important; /* Reduced from 20px */
}

/* Mobile spacing optimization */
@media (max-width: 768px) {
  .main-product__block {
    margin-bottom: 0.5rem !important;
  }
  
  .main-product__block.main-product__block-variant_picker {
    margin-top: 0.25rem !important;
    margin-bottom: 0.25rem !important;
  }
  
  .m-product-form--wrapper {
    margin-top: 0.25rem !important;
  }
}

/* Fine-tuning elements */
.m-product-title {
  margin-bottom: 0.25rem !important;
}

.m-product-meta {
  margin: 0.25rem 0 !important;
}

.m-product-option--label {
  margin-bottom: 0.2rem !important;
}
/* ==========================================================================
   CUSTOM - Quantity Offers Block (v3.4 - User-defined UI)
   ========================================================================== */

/* --- LOGIC: Hide the original quantity selector when the offers grid is enabled --- */
.main-product__block-quantity_offer ~ .main-product__block-buy_buttons .product-form__input--quantity {
  display: none;
}

/* --- UI: Exactly as provided by the user --- */
.quantity-offers__headline {
  font-size: 1rem; font-weight: 500; margin-bottom: 12px; text-align: left;
}
.quantity-offers__grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 1rem;
}
.quantity-offers__card-wrapper {
  position: relative;
}
.quantity-offers__radio-input {
  position: absolute; opacity: 0; width: 0; height: 0;
}
.quantity-offers__card {
  display: flex; align-items: center; gap: 10px; padding: 14px;
  border: 1px solid #e5e7eb; border-radius: 8px; cursor: pointer;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  overflow: hidden; height: 100%;
}
.quantity-offers__radio-visual {
  width: 18px; height: 18px; border: 2px solid #d1d5db; border-radius: 50%;
  flex-shrink: 0; position: relative; transition: border-color 0.2s ease;
}
.quantity-offers__radio-visual::after {
  content: ''; position: absolute; top: 50%; left: 50%;
  width: 8px; height: 8px; background-color: #2F4F4F; border-radius: 50%;
  transform: translate(-50%, -50%) scale(0); transition: transform 0.2s ease;
}
.quantity-offers__radio-input:checked + .quantity-offers__card {
  border-color: #2F4F4F; box-shadow: 0 0 0 1px #2F4F4F;
}
.quantity-offers__radio-input:checked + .quantity-offers__card .quantity-offers__radio-visual {
  border-color: #2F4F4F;
}
.quantity-offers__radio-input:checked + .quantity-offers__card .quantity-offers__radio-visual::after {
  transform: translate(-50%, -50%) scale(1);
}
.quantity-offers__details { display: flex; flex-direction: column; }
.quantity-offers__title { font-size: 0.95rem; font-weight: 400; color: #111827; line-height: 1.1; }
.quantity-offers__pricing { font-size: 0.85rem; color: #4b5563; line-height: 1.4; }
.quantity-offers__price { color: #047857; font-weight: 400; }
.quantity-offers__compare-price { margin-left: 6px; color: #9ca3af; }

/* ==========================================================================
   QUANTITY OFFERS BADGE STYLING (WORKING VERSION)
   ========================================================================== */

.quantity-offers__badge {
  position: absolute;
  top: -5px;
  right: -5px;
  color: #ffffff;
  font-size: 0.57rem;
  font-weight: 500;
  padding: 3px 8px;
  border-radius: 0 0 6px 6px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  
  /* Default: Red */
  background-color: #DA3F3F;
}

/* 🔥 WORKING: Use correct data attribute */
.quantity-offers__badge[data-badge-text="best-deal"] {
  background-color: #DA3F3F !important; /* Red */
  color: #ffffff !important;
}

.quantity-offers__badge[data-badge-text="most-picked"] {
  background-color: #facc15 !important; /* Yellow */
  color: #422006 !important;
}

.quantity-offers__badge[data-badge-text="free-shipping"] {
  background-color: #16a34a !important; /* Green */
  color: #ffffff !important;
}
/* ==========================================================================
   UNLOCK GIFTS - NO SCROLLBAR + FIXED BADGE POSITION
   ========================================================================== */

.unlock-gifts {
  margin: 0.5rem 0;
  padding: 0.5rem;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: linear-gradient(135deg, #fefefe 0%, #f8fafc 100%);
}

/* 🔥 FIX: Reduced Header Spacing */
.unlock-gifts__header {
  text-align: center;
  margin-bottom: 0.5rem; /* Reduced from 1.5rem */
}

.unlock-gifts__headline {
  font-size: 1rem;
  font-weight: 500;
  color: #1f2937;
  margin: 0;
}

/* 🔥 FIX: No Scrollbar - Flex Grid for 2-4 Items */
.unlock-gifts__grid {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  gap: 0.5rem; /* Smaller gap to fit more */
  padding: 0.5rem 0; /* Reduced padding */
}

/* 🔥 FIX: Responsive Item Sizing - No Fixed Width */
.unlock-gifts__item {
  flex: 1;
  max-width: 140px; /* Max width for desktop */
  min-width: 80px;  /* Min width for mobile */
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}

/* 🔥 FIX: Badge Outside Frame - No Clipping */
.unlock-gifts__badge {
  position: absolute;
  top: -8px;
  left: 50%;
  transform: translateX(-50%);
  background: #DA3F3F;
  color: white;
  font-size: 0.5rem;
  font-weight: 450;
  padding: 3px 6px;
  border-radius: 12px;
  white-space: nowrap;
  z-index: 10;
}

/* Gift Frame - Clean Container with Overflow Hidden */
.unlock-gifts__frame {
  position: relative;
  width: 100%;
  aspect-ratio: 1;
  max-width: 120px;
  border: 1px dashed #d1d5db;
  border-radius: 8px;
  background: #ffffff;
  overflow: hidden; /* Keep for image, badge now outside */
  transition: all 0.3s ease;
}

/* Image in Frame */
.unlock-gifts__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.unlock-gifts__image--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f3f4f6;
  font-size: 1rem;
  color: #9ca3af;
}

/* Lock Overlay */
.unlock-gifts__lock-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(2px);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}

.unlock-gifts__lock-icon {
  font-size: 1.5rem;
  opacity: 0.7;
}

/* Title Below Frame */
.unlock-gifts__title-container {
  margin-top: 0.25rem; /* Reduced from 0.75rem */
  width: 100%;
}

.unlock-gifts__title {
  font-size: 0.6rem;
  color: #1f2937;
  text-align: center;
  line-height: 1.1;
  transition: all 0.3s ease;
}

/* Title Bold State When Unlocked */
.unlock-gifts__title--unlocked {
  font-weight: 500;
  color: #1f2937;
}

/* ==========================================================================
   STATES - Fixed Transform Issues
   ========================================================================== */

/* Unlocked State */
.unlock-gifts__item[data-gift-state="unlocked"] .unlock-gifts__frame {
  border-color: #d1d5db !important;
  border-style: solid !important;
  background: #f0fdf4 !important;
  transform: translateY(-2px);
}

.unlock-gifts__item[data-gift-state="unlocked"] .unlock-gifts__lock-overlay {
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Locked State */
.unlock-gifts__item[data-gift-state="locked"] .unlock-gifts__lock-overlay {
  opacity: 1 !important;
}

/* ==========================================================================
   RESPONSIVE - 2 to 4 Items Perfect Fit
   ========================================================================== */

/* Mobile: 2-4 items fit perfectly */
@media (max-width: 480px) {
  .unlock-gifts__grid {
    gap: 0.25rem;
  }
  
  .unlock-gifts__item {
    min-width: 70px;
    max-width: 85px;
  }
  
  .unlock-gifts__frame {
    max-width: 80px;
  }
  
  .unlock-gifts__title {
    font-size: 0.7rem;
  }
  
  .unlock-gifts__badge {
    font-size: 0.55rem;
    padding: 2px 4px;
  }
}

/* Tablet: 2-4 items with more space */
@media (min-width: 481px) and (max-width: 768px) {
  .unlock-gifts__grid {
    gap: 0.75rem;
  }
  
  .unlock-gifts__item {
    max-width: 110px;
  }
  
  .unlock-gifts__frame {
    max-width: 100px;
  }
}

/* Desktop: 2-4 items with generous spacing */
@media (min-width: 769px) {
  .unlock-gifts__grid {
    gap: 1rem;
  }
  
  .unlock-gifts__item {
    max-width: 140px;
  }
  
  .unlock-gifts__frame {
    max-width: 120px;
  }
  
  .unlock-gifts__title {
    font-size: 0.8rem;
  }
  
  .unlock-gifts__badge {
    font-size: 0.7rem;
  }
}
.template-cart .breadcrumb,
.template-cart [data-breadcrumbs] { display:none !important; }
/* Cart page: hide breadcrumb */
.m-page-title .m-breadcrumb, .m-breadcrumb, .breadcrumb { display:none !important; }
/* Variant info compact */
#MinimogCart .m-cart-item__option,
#MinimogCart .m-cart-item__selling-plan { font-size: 14px; color:#6b7280; line-height:1.3; }

/* 1) Remove button as icon (no underline) */
.m-cart-item__remove-btn {
  appearance: none; background: transparent; border: 0; padding: 6px; line-height: 1; cursor: pointer;
  color: var(--color-subtext, #6b7280);
}
.m-cart-item__remove-btn:hover { color: var(--color-text, #111827); }

/* 2) Variant one-line: 12px, weight 400 */
.m-cart-item__variant-one-line {
  font-size: 14px; font-weight: 400; color: var(--color-subtext, #6b7280); margin: 0;
}

/* 3) Discount chip: 14px, weight 400, green */
.m-chip--discount {
  font-size: 14px; font-weight: 400; color: #047857; background: #ffffff; /* 10% */
  padding: 2px 2px; border-radius: 6px; line-height: 1.2;
}
.m-chip--discount .m-chip__icon{
  width:14px; height:14px; flex:0 0 14px; 
  display:inline-block; vertical-align:middle;
  stroke-width:1.25; /* nét mảnh hơn */
}
.m-cart-drawer-item .m-chip__icon { font-size:0 !important; }

/* 4) Quantity compact + price column */
.m-quantity--sm .m-quantity__button { width: 28px; height: 28px; }
.m-quantity--sm .m-quantity__input { width: 40px; height: 28px; font-size: 14px; }
.m-price-col { text-align: right; min-width: 96px; }
.m-price-col__final { font-size: 16px; font-weight: 500; color: #000000;}
.m-price-col__compare { font-size: 14px; color: var(--color-subtext, #6b7280); }

/* 5) You save styling (footer of cart drawer) */
.m-cart-drawer__summary .m-cart__savings span,
.m-cart-drawer__summary .m-cart__savings [data-cart-savings]{
  color:#047857 !important;
  font-weight:500; /* mảnh vừa đủ */
}
/* 76) Cart Drawer full-screen trên mobile */
@media (max-width: 767.98px){
  /* Đổi 100vw thành 100% để tránh lỗi tính toán chiều rộng khi có thanh cuộn */
  .m-cart-drawer{ width: 100% !important; max-width: 100% !important; }
  .m-cart-drawer__inner{ width: 100% !important; max-width: 100% !important; height: 100svh; border-radius: 0 !important; }
  
  .m-cart-drawer__body{ 
    flex: 1 1 auto; 
    min-height: 0; 
    overflow-y: auto; /* Đảm bảo vẫn cuộn được */
    overflow-x: hidden;
    
    /* Code ẩn thanh cuộn (nhưng vẫn vuốt được) để mất vệt trắng xấu xí */
    scrollbar-width: none; /* Cho Firefox */
    -ms-overflow-style: none; /* Cho IE/Edge cũ */
  }
  
  /* Code ẩn thanh cuộn cho Chrome/Safari/Webkit (phổ biến trên Mobile) */
  .m-cart-drawer__body::-webkit-scrollbar {
    width: 0px;
    background: transparent;
    display: none;
  }

  .m-cart-drawer__footer{ border-top: 1px solid rgba(0,0,0,.06); }
}
/* ===== Enlarge CTAs on Mobile (Minimog 5.7) ===== */
@media (max-width: 767px){
  :root{
    --cta-h: 66px;
    --cta-fs: 24px;
    --cta-py: 16px;
    --cta-radius: 6px;
    --cta-gap: 10px;
  }

  /* 1) PDP Add To Cart (non-sticky) */
  form[action*="/cart/add"] button[name="add"],
  .product-form [name="add"]{
    min-height: var(--cta-h) !important;
    padding-block: var(--cta-py) !important;
    font-size: var(--cta-fs) !important;
    border-radius: var(--cta-radius) !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center; justify-content: center;
    gap: var(--cta-gap); white-space: nowrap;
  }

  /* 2) Sticky Add To Cart */
  .m-sticky-addtocart .m-add-to-cart{
    min-height: var(--cta-h) !important;
    padding-block: var(--cta-py) !important;
    font-size: var(--cta-fs) !important;
    border-radius: var(--cta-radius) !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center; justify-content: center;
    gap: var(--cta-gap); white-space: nowrap;
  }

  /* 3) Cart Drawer size on mobile */
  .m-cart-drawer .m-drawer__footer .m-button.m-button--primary[name="checkout"],
  .m-cart-drawer .m-drawer__footer .btn--secure{
    min-height: var(--cta-h) !important;
    padding-block: var(--cta-py) !important;
    border-radius: var(--cta-radius) !important;
    font-size: var(--cta-fs) !important;
    line-height: 1 !important;
  }
} /* <-- đóng @media ở đây */

/* ==== Cart Drawer — icon & text cùng một hàng (ALL viewports) ==== */
.m-cart-drawer .btn--secure{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:12px;
  flex-wrap:nowrap !important;
  white-space:nowrap !important;
  line-height:1 !important;
  padding: 20px !important;
}
.m-cart-drawer .btn--secure > *{
  flex:0 0 auto !important;
  width:auto !important;   /* chặn span {width:100%} của Minimog */
}
.m-cart-drawer .btn--secure .btn__text{ display:inline !important; line-height:1 !important; }
.m-cart-drawer .btn--secure .icon-lock{
  display:inline-block !important;
  width:1.1em; height:1.1em;       /* auto theo font (desktop & mobile) */
  transform:translateY(0.5px);
  pointer-events:none;
}

/* Wallet buttons: giữ mặc định để không phá layout */
  .cart-drawer .shopify-payment-button__button{
    min-height: 48px;
  }

/* Cart Drawer — nén khoảng trống trong footer/totals */
.m-cart-drawer #MinimogCartDrawerFooter{ padding-top: 0px !important; }

/* giảm đệm của wrapper trong footer */
.m-cart-drawer .m-cart-drawer__footer--wrapper{ padding-top: 2px !important; margin-top: 0px !important; }

/* “You save” & “Subtotal” sát nhau, gọn mắt */
.m-cart-drawer .m-cart__summary {margin: 0px 0 12px !important; }
.m-cart-drawer .m-cart__savings{ margin: 0px 0 2px !important; }
.m-cart-drawer .m-cart__subtotal{ margin: 2px 0 6px !important; }
.m-cart-drawer .m-cart__savings{ font-size: 15px !important; }

.m-cart__savings-note {
  display: block;
  font-size: 12px;
  line-height: 1.35;
  color: #4B5563; /* xám đậm dễ đọc */
  margin-bottom: 4px;
  padding-left: 0; /* đảm bảo không bị đẩy */
  text-align: left; /* ✅ canh trái theo label */
  font-style: italic;
}
.m-cart-drawer__header {padding: 8px 16px 8px 16px;}
.m-cart-drawer .m-cart__subtotal {font-size: 18px !important; font-weight: 600 !important;}
.m-cart-drawer .m-cart__subtotal--price {font-size: 18px !important; font-weight: 600;}

/* ==============================================
   MASTER CSS V2: FIX CART DRAWER (FINAL & CLEAN)
   ============================================== */

/* 1. CẤU TRÚC: Căn ảnh lên trên cùng để bằng với Title */
.m-cart-item--drawer__wrapper {
  align-items: flex-start !important; 
}

/* 2. ẢNH SẢN PHẨM: 70px, Vuông vắn, Cách chữ 16px */
.m-cart-drawer-item__image, .m-cart-item__image {
  width: 70px !important;       /* Kích thước 70px như bạn muốn */
  flex: 0 0 70px !important;    /* Cố định không cho co giãn */
  margin-right: 16px !important; /* Khoảng trắng tiêu chuẩn */
}

/* Ép ảnh luôn vuông, không bao giờ bị dẹt */
.m-cart-drawer-item__image img, 
.m-cart-drawer-item__image responsive-image,
.m-cart-item__image img {
  aspect-ratio: 1 / 1 !important; 
  object-fit: cover !important;   
  height: auto !important;
  width: 100% !important;
}

/* 3. TIÊU ĐỀ: Fix lỗi mất chữ & Font size */
.custom-cart-title, .m-cart-item__name a {
  display: block;
  white-space: nowrap;      
  overflow: hidden;         
  text-overflow: ellipsis;  
  font-weight: 600 !important;
  color: #111827;           
  line-height: 1.3;         
  margin-bottom: 4px !important;
  
  /* Tăng max-width lên để không bị lỗi mất chữ khi slide */
  max-width: 220px;         
  font-size: 16px !important; /* Mobile */
}

@media (min-width: 768px) {
  .custom-cart-title, .m-cart-item__name a {
    font-size: 17px !important; /* Desktop */
    max-width: 250px;       
  }
}

/* 4. MÀU CHỮ & GIÁ (Đã fix lỗi tràn khung) */

/* Tên biến thể (Màu/Size) */
.m-cart-item__variant-one-line {
  font-size: 14px !important;
  color: #374151 !important;    
  font-weight: 500 !important;
  margin-bottom: 8px !important; 
  margin-top: 0 !important;
}

/* Khung chứa giá (FIX LỖI TRƯỢT) */
.m-price-col {
  text-align: right;
  flex-shrink: 0 !important;    /* Khóa cứng, không cho bị đẩy */
  margin-left: auto !important; /* Luôn dính sát lề phải */
  max-width: 120px;             /* Giới hạn chiều rộng an toàn */
}

/* Giá bán chính */
.m-price-col__final {
  font-size: 16px !important;
  font-weight: 500 !important;
  color: #000000 !important;    
  display: block;               /* Xuống dòng riêng */
  line-height: 1;
}

/* Giá gốc gạch ngang */
.m-price-col__compare {
  font-size: 14px !important;
  color: #6b7280 !important;    
  text-decoration: line-through;
  display: block;               /* Xuống dòng nằm dưới giá bán */
  margin-left: 0 !important;    /* Reset lề trái */
  margin-top: 4px;              
}

/* Nút số lượng gọn gàng */
.m-quantity--sm {
  border: 1px solid #d1d5db;
  border-radius: 4px;
  height: 32px !important;
}