/* ==========================================================================
   迷你购物车侧栏 全局基础样式（适用于所有屏幕尺寸）
   ========================================================================== */


/*C1迷你购物车标题*/
.is-divider {
  background-color: rgba(0, 0, 0, 0.1);
  display: block;
  height: 1px;
  margin: 0.5em 0;
  width: 100%;
  max-width:300px;
}

/*C1只调整迷你购物车标题靠左 */
.off-canvas-cart .cart-popup-title.text-center {
  text-align: left !important;
}








/* C2禁用侧栏购物车中的产品图片和名称链接 */
.off-canvas-cart .woocommerce-mini-cart-item a:not(.remove) {
    pointer-events: none;
    cursor: default;
}

/*C2修改添加购物车 超长产品名称长度*/

.widget_shopping_cart ul.product_list_widget li {
    padding-right: 30px; /* 调整右侧间距 */
}

.widget_shopping_cart ul.product_list_widget li a {
    display: inline-block;
    max-width: 150px; /* 调整产品名称的最大宽度 */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}



/* C2只针对迷你购物车里的产品名称链接设置字体大小 */
.widget_shopping_cart 
  .product_list_widget 
  .mini_cart_item 
  > a:not(.remove) {
  font-size: 14px !important;
  
}







/* C3仅针对侧栏迷你购物车中的商品价格黑色文字大小 */
.off-canvas-cart 
  .widget_shopping_cart 
  .product_list_widget 
  .mini_cart_item 
  .woocommerce-Price-amount.amount {
  color: #333 ;
  font-size: 13px ;
}

/*C3关闭购物车产品背后价钱虚色*/

    .cart-popup-inner .widget_shopping_cart_content .price-wrapper {
        opacity: 1 !important;
    }







/*C4移除迷你购物车删除按钮的圆形边框 */

.widget_shopping_cart .remove_from_cart_button,
.widget_shopping_cart a.remove {
  border: none !important;
}
/* C4隐藏原有文字 “×” */
.widget_shopping_cart .remove_from_cart_button {
  color: transparent !important;
  font-size: 0 !important;
  position: relative;
}

/* C4添加垃圾桶 SVG 作为背景 */
.widget_shopping_cart .remove_from_cart_button::before {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  background-image: url("https://myfood365.co.kr/wp-content/uploads/2025/07/trash-2-svgrepo-com.svg");
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}


/* C4垃圾桶 颜色变淡 */
/* 如果你还使用了伪元素 SVG 图标，再额外设置伪元素的透明度 */
.off-canvas-cart 
  .remove_from_cart_button::before {
  opacity: 0.5;    /* 数值 0~1，越小图标越淡 */
 
}





/* C5.迷你购物车 免邮提示设置 整段文字设为纯黑 */
.off-canvas-cart .ux-free-shipping__notice.ux-free-shipping__notice--threshold {
  color: #000000;  /* 纯黑 */
}

/* C5.迷你购物车 免邮提示设置 仅将价格数字部分设为红色 */
.off-canvas-cart .ux-free-shipping__notice--threshold 
  .woocommerce-Price-amount.amount {
  color: #DD183B;  /* 红色，你也可以替换成其他十六进制或变量 */
}

/* C5. 迷你购物车 免邮提示设置 保证货币符号也同价格数字一样是红色 */
.off-canvas-cart .ux-free-shipping__notice--threshold 
  .woocommerce-Price-amount.amount 
  .woocommerce-Price-currencySymbol {
  color: inherit;  /* 继承上面的红色 */
}

/* C5.迷你购物车侧栏——在小屏下按百分比统一缩放文字 */

  .off-canvas-cart {
    font-size: 90%;
  }








/* C6只针对侧栏迷你购物车的“小计：”标签生效 */
.off-canvas-cart 
  .woocommerce-mini-cart__total.total 
  strong {
  color: #555555 !important; /* 纯黑 */
}

/* C6如果还想把“小计”后面的价格设为红色，可以加上： */
.off-canvas-cart 
  .woocommerce-mini-cart__total.total 
  .woocommerce-Price-amount.amount {
  color: #333 ; /* 黑色 */
  font-size: 16px;
}








/* C7迷你购物车侧栏背景设为纯白 */
.off-canvas-cart .cart-popup-inner--sticky {
  background-color: #ffffff;
}
 



/* C8 迷你购物车内部内容—分别设置 上 右 下 左 内边距 */
.off-canvas-cart .cart-popup-inner.inner-padding {
  padding: 10px 20px 20px 20px;
  
}




/* C9迷你购物车结账按钮底部间距 */
.off-canvas-cart .ux-mini-cart-footer {
    padding: 10px 30px 7px !important;
}




/* C9查看购物车按钮：灰底深灰字 */
.widget_shopping_cart .woocommerce-mini-cart__buttons .button.wc-forward:not(.checkout) {
   background-color: #FFFFFF;
	border: 1px solid #ddd;       /* 默认边框 */
    color: #525252;
	font-size: 14px;              /* 新增：字体大小 */
} 


/* C9结账按钮：红底白字 */
.widget_shopping_cart .woocommerce-mini-cart__buttons .button.checkout.wc-forward {
  background-color: #DD183B;
    color: #fff;
	font-size: 14px;              /* 新增：字体大小 */
}








 
/* ==========================================================================
   XS：手机竖屏 Portrait（< 576px）
   ========================================================================== */
@media (max-width: 575.98px) {
  /* 手机竖屏专属样式 */
 
 
 
 
}
 
/* ==========================================================================
   SM：手机横屏 & 小平板（576px ~ 767.98px）
   ========================================================================== */
@media (min-width: 576px) and (max-width: 767.98px) {
  /* 手机横屏、小尺寸平板样式 */
 
 
 
 
}
 
/* ==========================================================================
   MD：平板 Tablet（768px ~ 991.98px）
   ========================================================================== */
@media (min-width: 768px) and (max-width: 991.98px) {
  /* 中等平板设备样式 */
 
 
 
 
}
 
/* ==========================================================================
   LG：小型桌面（992px ~ 1199.98px）
   ========================================================================== */
@media (min-width: 992px) and (max-width: 1199.98px) {
  /* 小桌面，小型笔电 */
 
 
 
 
}
 
/* ==========================================================================
   XL：标准桌面（≥ 1200px）
   ========================================================================== */
@media (min-width: 1200px) {
  /* 桌面端布局样式 */
 
 
 
 
}