﻿/* ============================================
   /portal/assets/css/portal.cart.css
   ============================================ */ 
/* ============================================
     购物车：极简一笔线条（修复版）
   =========================================== */

.portal-cart { 
  position: relative; 
  display: flex; 
  align-items: center; 
  margin-left: 0; 
}

.portal-cart-link { 
  display:inline-flex; 
  align-items:center; 
  color:var(--portal-text-main); 
  text-decoration:none; 
  padding:6px; 
  border-radius:8px; 
  transition:background .12s ease; 
}

/* ❌ 关闭 hover 背景 */
.portal-cart-link:hover { 
  background: none;
}

/* SVG 基础 */
.portal-cart-icon { 
  width: 36px; 
  height: 28px; 
  display: block; 
  color: var(--portal-text-main); 
  transition: color .12s, transform .12s; 
  transform-origin: center; 
}

/* 线条样式（丝滑） */
.portal-cart-icon .cart-stroke { 
  stroke: currentColor; 
  stroke-width: 2.5; 
  fill: none; 
  stroke-linecap: round; 
  stroke-linejoin: round; 
  vector-effect: non-scaling-stroke; 
}

/* 购物车轮子 */
.portal-cart-icon .wheel {
  fill: currentColor;
  stroke: currentColor;
  stroke-width: 2.5; /* ← 和车身一样粗 */
}

/* 凹槽内购物车数量 */
/* 凹槽内购物车数量（数字样式） */
.portal-cart-icon .cart-count {
  fill: #f08804;    /* ← 想自定义颜色就改这里，例如 fill:#111;不想要颜色，就改成： currentColor; */
  font-size: 20px;      /* ← 控制数字大小，10px 太小了，可以改 12~16px */
  font-weight: 700;     /* 数字粗细（700 = 加粗） */
  pointer-events: none;  /* 禁止鼠标事件（避免挡住点击） */
}

/* ⭐ 图标 + 文字横向排列 */
.portal-cart-link {
  display: flex;
  align-items: center;
  gap: 6px; /* 图标与文字的间距 */
  color: var(--portal-text-main);
}

/* ⭐ “购物车”文字样式 */
.cart-text {
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
}


/* ❌ 关闭 hover 颜色变化与上移 */
.portal-cart-link:hover .portal-cart-icon { 
  color: inherit; 
  transform: none;
}

/* 徽标（在 SVG 内部） */
.portal-cart-icon .cart-badge-bg { 
  fill: #f08804; 
  stroke: rgba(0,0,0,0.06); 
  stroke-width: 0.3; 
  filter: drop-shadow(0 1px 0 rgba(0,0,0,0.06)); 
}

.portal-cart-icon .cart-badge-text { 
  fill: #111; 
  font-size: 8.4px; 
  font-weight: 700; 
  font-family: "Helvetica Neue", Arial, sans-serif; 
}

/* 0 件时灰色样式（可选） */
.portal-cart-icon.zero .cart-badge-bg { 
  fill: rgba(0,0,0,0.06); 
}

.portal-cart-icon.zero .cart-badge-text { 
  fill: rgba(0,0,0,0.6); 
}

/* 响应式 */
@media (max-width: 900px) {
  .portal-cart-icon { width: 30px; height: 24px; }
  .portal-cart-icon .cart-badge-text { font-size: 7px; }
}
