
@layer juumi-worker {
  :root {
    color-scheme: light;
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: medium;
    --font-family: "Roboto Condensed", Arial, sans-serif;
    --font-family-base: "Roboto Condensed", Arial, sans-serif;
    --font-family-body: "Roboto Condensed", Arial, sans-serif;
    --font-family-primary: "Roboto Condensed", Arial, sans-serif;
    --font-body-family: "Roboto Condensed", Arial, sans-serif;
    --font-base-family: "Roboto Condensed", Arial, sans-serif;
    --font-sans: "Roboto Condensed", Arial, sans-serif;
    --font-serif: "Roboto Condensed", Arial, sans-serif;
    --font-primary: "Roboto Condensed", Arial, sans-serif;
    --font-secondary: "Roboto Condensed", Arial, sans-serif;
    --font-text: "Roboto Condensed", Arial, sans-serif;
    --font-bold-family-primary: "Roboto Condensed", Arial, sans-serif;
    --global-font-family: "Roboto Condensed", Arial, sans-serif;
    --bs-font-sans-serif: "Roboto Condensed", Arial, sans-serif;
  }

  html,
  body {
    scroll-behavior: smooth;
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: medium;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
  }

  body,
  button,
  input,
  textarea,
  select {
    font-family: "Roboto Condensed", Arial, sans-serif !important;
  }

  :where(
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    a,
    span,
    div,
    li,
    td,
    th,
    label,
    small,
    strong,
    em,
    b,
    i,
    blockquote,
    figcaption,
    caption,
    summary,
    dt,
    dd,
    article,
    section,
    nav,
    main,
    header,
    footer,
    aside,
    button,
    input,
    textarea,
    select
  ):not(svg):not(path):not(circle):not(rect):not(line):not(polyline):not(polygon):not([class*="icon"]):not([class*="fa"]):not([class*="material-icons"]):not([class*="material-symbols"]):not([class*="glyph"]):not([data-icon]) {
    font-family: "Roboto Condensed", Arial, sans-serif !important;
  }

  /*
   * Add selectors here when a storefront block needs to be hidden.
   * Example:
   * .legacy-banner,
   * [data-section-id="old-promo"] {
   *   display: none !important;
   * }
   */
  .wed2c-link {
    display: none !important;
  }



  /* Remove padding and margin between header and banner */
  .web-head {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }
  .web-banner {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  .juumi-copyright-h1 {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    font: inherit !important;
    line-height: inherit !important;
    letter-spacing: 0 !important;
    font-weight: 700 !important;
  }

  .juumi-seo-h1 {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }

  .icontongyong3,
  .iconxiezi,
  .iconzhubaoshoushi,
  .iconxianglian,
  .iconmuyingyongpin,
  .iconnvxing,
  .iconkuzi,
  .icongerenhuli,
  .iconxiaodianqi {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    color: transparent !important;
    border-radius: 50% !important;
    transition: transform 0.8s ease !important;
  }

  .icontongyong3 {
    background-image: url("https://cdn0.juumi.shop/media/bag124f-wom-bag.png") !important;
  }

  .iconxiezi {
    background-image: url("https://cdn0.juumi.shop/media/foot1244ds-nb.png") !important;
  }

  .iconzhubaoshoushi {
    background-image: url("https://cdn0.juumi.shop/media/jel-12Gbht-wa.png") !important;
  }

  .iconxianglian {
    background-image: url("https://cdn0.juumi.shop/media/sleepkghjk-sl.png") !important;
  }

  .iconmuyingyongpin {
    background-image: url("https://cdn0.juumi.shop/media/kid121s1ds-bu.png") !important;
  }

  .iconnvxing {
    background-image: url("https://cdn0.juumi.shop/media/12f5454f-women-212.jpg") !important;
  }

  .iconkuzi {
    background-image: url("https://cdn0.juumi.shop/media/man-hgt55oip2-bnbman.png") !important;
  }

  .icongerenhuli {
    background-image: url("https://cdn0.juumi.shop/media/ed4b743e3bfa9ba64b8ecaeda08de5d5.jpg") !important;
  }

  .iconxiaodianqi {
    background-image: url("https://cdn0.juumi.shop/media/121df-f22czx-566d-home124.png") !important;
  }

  .list-content-item:hover :is(
    .icontongyong3,
    .iconxiezi,
    .iconzhubaoshoushi,
    .iconxianglian,
    .iconmuyingyongpin,
    .iconnvxing,
    .iconkuzi,
    .icongerenhuli,
    .iconxiaodianqi
  ) {
    transform: scale(1.02) !important;
  }

  .icontongyong3::before,
  .iconxiezi::before,
  .iconzhubaoshoushi::before,
  .iconxianglian::before,
  .iconmuyingyongpin::before,
  .iconnvxing::before,
  .iconkuzi::before,
  .icongerenhuli::before,
  .iconxiaodianqi::before {
    content: '' !important;
    display: none !important;
  }

  .link-content-first {
    padding-right: 0.1rem !important;
    padding-left: 0.1rem !important;
  }

  .by-send-box .by-order-btns .by-order-btn.pc-btn,
  .by-send-box .by-send-content .am-list-item,
  .by-bind-account-mask .by-bind-account .by-bind-account-content .by-bind-account-form .by-bind-account-input,
  .by-bind-account-mask .by-bind-account .by-bind-account-content .by-bind-account-btn.pc-btn {
    border-radius: 12px !important;
  }

  /* --- BANNER ALIGNMENT --- */
  .web-banner .image-content-title {
    display: flex !important;
    align-items: flex-end !important; /* Vertically align to bottom */
    justify-content: flex-end !important; /* Horizontally align to right */
    width: 100% !important;
    height: 100% !important;
  }
  
  .web-banner .image-content-title-inner {
    text-align: right !important;
    align-items: flex-end !important;
    margin-right: 8% !important; /* Push it slightly from the right edge */
    margin-bottom: 8% !important; /* Push it slightly from the bottom edge */
    margin-left: 0 !important;
    max-width: 600px !important; /* Prevent text from stretching too far */
    transform: none !important;
    left: auto !important;
    right: 0 !important;
    top: auto !important;
    position: relative !important;
  }

  /* --- BANNER TITLE STYLING --- */
  .web-banner .title-text {
    font-size: clamp(32px, 5vw, 56px) !important; /* Responsive size */
    font-weight: 800 !important;
    line-height: 1.2 !important;
    margin-bottom: 24px !important;
    color: #ffffff !important;
    text-shadow: 0 4px 12px rgba(0, 0, 0, 0.4) !important;
    letter-spacing: -0.5px !important;
    text-transform: capitalize !important;
  }

  /* --- BANNER BUTTON STYLING (Modern & Clean) --- */
  .web-banner .title-btn {
    background-color: #ffffff !important;
    color: #000000 !important;
    padding: 14px 32px !important;
    border-radius: 30px !important; /* Pill shape */
    border: none !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15) !important;
    height: auto !important;
    min-height: 48px !important;
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
    transition: background-color 0.2s ease, transform 0.2s ease !important;
  }
  
  .web-banner .title-btn:hover {
    background-color: #000000 !important;
    color: #ffffff !important;
    transform: translateY(-2px) !important; /* Subtle lift, no crazy animations */
  }

  /* --- REMOVE ANNOYING SLIDING ANIMATION & DUPLICATE TEXT --- */
  /* Hide any duplicate text element that comes after the first one */
  .web-banner .title-btn .title-btn-text ~ .title-btn-text {
    display: none !important;
  }
  
  /* Reset the transform on the first text to stop it from sliding up */
  .web-banner .title-btn .title-btn-text {
    transform: none !important;
    position: relative !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px !important;
    color: inherit !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  
  /* Reset button inner content positioning */
  .web-banner .title-btn:hover .title-btn-text {
    transform: none !important; /* Ensure it stays put on hover */
  }

  /* Style the button arrow icon (Hidden as requested) */
  .web-banner .go-more-span {
    display: none !important;
  }
  .web-banner .go-more-icon {
    display: none !important;
  }

  /* --- MOBILE BANNER ALIGNMENT --- */
  .mobile-banner .image-content-title {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
  }

  .mobile-banner .image-content-title-inner {
    text-align: center !important;
    align-items: center !important;
    display: flex !important;
    flex-direction: column !important;
    margin: 0 auto !important;
    max-width: 85% !important;
    transform: none !important;
    position: relative !important;
  }

  /* --- MOBILE BANNER TITLE STYLING --- */
  .mobile-banner .title-text {
    font-size: clamp(20px, 5vw, 32px) !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    margin-bottom: 12px !important;
    color: #ffffff !important;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important;
    letter-spacing: -0.3px !important;
    text-transform: capitalize !important;
  }

  /* --- MOBILE BANNER BUTTON STYLING --- */
  .mobile-banner .title-btn {
    background-color: #ffffff !important;
    color: #000000 !important;
    padding: 10px 24px !important;
    border-radius: 30px !important;
    border: none !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15) !important;
    height: auto !important;
    min-height: 40px !important;
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
    transition: background-color 0.2s ease !important;
  }

  /* --- MOBILE: REMOVE SLIDING ANIMATION & DUPLICATE TEXT --- */
  .mobile-banner .title-btn .title-btn-text ~ .title-btn-text {
    display: none !important;
  }

  .mobile-banner .title-btn .title-btn-text {
    transform: none !important;
    position: relative !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px !important;
    color: inherit !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* --- MOBILE: HIDE ARROW ICON --- */
  .mobile-banner .go-more-span {
    display: none !important;
  }
  .mobile-banner .go-more-icon {
    display: none !important;
  }

  /* --- PRODUCT CARD QUICK ADD BUTTON (Floating SVG Bottom Right) --- */
  /* Hide the text */
  .web-goods-card .add-text {
    display: none !important;
  }
  
  /* Style the button as a floating circular action button in bottom right */
  .web-goods-card .add-cart-btn {
    position: absolute !important;
    bottom: 12px !important;
    right: 12px !important;
    top: auto !important;
    left: auto !important;
    width: 44px !important;
    height: 44px !important;
    background-color: #000000 !important; /* Solid black background */
    border: 2px solid #000000 !important; /* Black border */
    border-radius: 50% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25) !important; 
    padding: 0 !important;
    margin: 0 !important;
    
    /* Animation: Pop up effect from bottom (5px only) */
    opacity: 0 !important;
    transform: translateY(5px) scale(0.95) !important;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
    z-index: 10 !important;
  }
  
  /* Show button when hovering the product card */
  .web-goods-card:hover .add-cart-btn {
    opacity: 1 !important;
    transform: translateY(0) scale(1) !important;
  }
  
  /* Hover effect on the button itself */
  .web-goods-card .add-cart-btn:hover {
    background-color: #222222 !important; /* Slightly lighter black on hover */
    border-color: #222222 !important;
    transform: translateY(-2px) scale(1.05) !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.35) !important;
  }

  /* Use the new SVG provided by the user and make it fill the button */
  .web-goods-card .add-icon {
    font-size: 0 !important; /* Hide original font character */
    width: 100% !important; /* Fill the button entirely */
    height: 100% !important; 
    display: inline-block !important;
    /* Adjust viewBox to 1 1 22 22 to make the circle almost touch the edges while keeping the background */
    background-image: url("data:image/svg+xml,%3Csvg viewBox='1 1 22 22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='10' stroke='%23ffffff' stroke-width='1.2'%3E%3C/circle%3E%3Cpath d='M15 12L12 12M12 12L9 12M12 12L12 9M12 12L12 15' stroke='%23ffffff' stroke-width='1.2' stroke-linecap='round'%3E%3C/path%3E%3C/svg%3E") !important;
    background-size: contain !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
  }
  
  .web-goods-card .add-icon::before {
    content: '' !important;
    display: none !important;
  }
  /* --- PRODUCT CARD PRICE STYLING (Digital/Numeric Look) --- */
  .web-goods-card .goods-detail-active-amount,
  .web-goods-card .goods-detail-active-amount span,
  .web-goods-card .goods-detail-active-amount * {
    font-family: 'Rajdhani', monospace, sans-serif !important;
    font-size: 18px !important; /* Reduced from 24px */
    font-weight: 800 !important;
    color: #000000 !important;
    letter-spacing: 0.5px !important;
  }
  
  .web-goods-card .goods-detail-active-amount {
    display: inline-block !important;
    margin-top: 4px !important;
  }

  /* --- ICON REPLACEMENT (SVG Method for Reliability) --- */
  .iconsousuo::before,
  .icona-bianzu9::before,
  .iconfenlei::before,
  .icongerenzhongxin::before,
  .icongouwudai::before,
  .iconyuyan::before,
  .iconguanbi::before,
  .iconjiantou-youshang::before,
  .icondingdan::before,
  .iconyouhuiquan::before,
  .icondizhi::before,
  .icontuichu::before,
  .iconlishi::before,
  .iconliulanlishi::before,
  .iconzuji::before,
  .iconkefu::before,
  .iconxiaoxi::before,
  .iconyonghu::before,
  .iconjiantou-zuo::before,
  .iconshanchu::before,
  .iconcaidan::before {
    content: '' !important;
    display: inline-block !important;
    width: 20px !important;
    height: 20px !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
  }


  /* Search Icon */
  .iconsousuo::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E") !important;
  }

  /* Money Hand Icon */
  .icona-bianzu9::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='18' height='12' rx='2'%3E%3C/rect%3E%3Ccircle cx='12' cy='12' r='3'%3E%3C/circle%3E%3Cpath d='M6 9h0M18 9h0M6 15h0M18 15h0'%3E%3C/path%3E%3C/svg%3E") !important;
  }

  /* Category Icon */
  .iconfenlei::before {
    background-image: url("data:image/svg+xml,%3Csvg width='256px' height='256px' viewBox='0 0 24.00 24.00' fill='none' xmlns='http://www.w3.org/2000/svg' stroke='%23000000'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round' stroke='%23000000' stroke-width='0.48'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Cpath d='M4 6H20M4 12H20M4 18H20' stroke='%23000000' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E%3C/g%3E%3C/svg%3E") !important;
  }

  /* User Center Icon */
  .icongerenzhongxin::before {
    background-image: url("data:image/svg+xml,%3Csvg width='256px' height='256px' viewBox='0 0 64 64' xmlns='http://www.w3.org/2000/svg' stroke-width='4.4799999999999995' stroke='%23000000' fill='none'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Ccircle cx='32' cy='18.14' r='11.14'%3E%3C/circle%3E%3Cpath d='M54.55,56.85A22.55,22.55,0,0,0,32,34.3h0A22.55,22.55,0,0,0,9.45,56.85Z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E") !important;
  }

  /* Shopping Bag Icon */
  .icongouwudai::before {
    background-image: url("data:image/svg+xml,%3Csvg width='256px' height='256px' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round' stroke='%23000000' stroke-width='1.92'%3E%3Cpath d='M3.79424 14.9709C4.33141 17.6567 4.59999 18.9996 5.48746 19.8646C5.65149 20.0244 5.82894 20.1699 6.01786 20.2994C7.04004 21 8.40956 21 11.1486 21H12.8515C15.5906 21 16.9601 21 17.9823 20.2994C18.1712 20.1699 18.3486 20.0244 18.5127 19.8646C19.4001 18.9996 19.6687 17.6567 20.2059 14.9709C20.9771 11.1149 21.3627 9.18686 20.475 7.82067C20.3143 7.5733 20.1267 7.34447 19.9157 7.13836C18.7501 6 16.7839 6 12.8515 6H11.1486C7.21622 6 5.25004 6 4.08447 7.13836C3.87342 7.34447 3.68582 7.5733 3.5251 7.82067C2.63744 9.18686 3.02304 11.1149 3.79424 14.9709Z' stroke='%23000000' stroke-width='1.92'%3E%3C/path%3E%3Ccircle opacity='0.5' cx='15' cy='10' r='1' fill='%23000000'%3E%3C/circle%3E%3Ccircle opacity='0.5' cx='9' cy='10' r='1' fill='%23000000'%3E%3C/circle%3E%3Cpath opacity='0.5' d='M9 6V5C9 3.34315 10.3431 2 12 2C13.6569 2 15 3.34315 15 5V6' stroke='%23000000' stroke-width='1.92' stroke-linecap='round'%3E%3C/path%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Cpath d='M3.79424 14.9709C4.33141 17.6567 4.59999 18.9996 5.48746 19.8646C5.65149 20.0244 5.82894 20.1699 6.01786 20.2994C7.04004 21 8.40956 21 11.1486 21H12.8515C15.5906 21 16.9601 21 17.9823 20.2994C18.1712 20.1699 18.3486 20.0244 18.5127 19.8646C19.4001 18.9996 19.6687 17.6567 20.2059 14.9709C20.9771 11.1149 21.3627 9.18686 20.475 7.82067C20.3143 7.5733 20.1267 7.34447 19.9157 7.13836C18.7501 6 16.7839 6 12.8515 6H11.1486C7.21622 6 5.25004 6 4.08447 7.13836C3.87342 7.34447 3.68582 7.5733 3.5251 7.82067C2.63744 9.18686 3.02304 11.1149 3.79424 14.9709Z' stroke='%23000000' stroke-width='1.92'%3E%3C/path%3E%3Ccircle opacity='0.5' cx='15' cy='10' r='1' fill='%23000000'%3E%3C/circle%3E%3Ccircle opacity='0.5' cx='9' cy='10' r='1' fill='%23000000'%3E%3C/circle%3E%3Cpath opacity='0.5' d='M9 6V5C9 3.34315 10.3431 2 12 2C13.6569 2 15 3.34315 15 5V6' stroke='%23000000' stroke-width='1.92' stroke-linecap='round'%3E%3C/path%3E%3C/g%3E%3C/svg%3E") !important;
  }

  /* Language Icon */
  .iconyuyan::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000000' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm6.9 9h-3.1a15.4 15.4 0 0 0-1.2-5A8.05 8.05 0 0 1 18.9 11zM12 4.1c.8 1.1 1.5 3.2 1.8 6.9h-3.6c.3-3.7 1-5.8 1.8-6.9zM4.3 13h3.9c.1 1.7.4 3.2.8 4.5A8.02 8.02 0 0 1 4.3 13zm3.9-2H4.3A8.02 8.02 0 0 1 9 6.5 16.7 16.7 0 0 0 8.2 11zm3.8 8.9c-.8-1.1-1.5-3.2-1.8-6.9h3.6c-.3 3.7-1 5.8-1.8 6.9zm3-2.4c.4-1.3.7-2.8.8-4.5h3.9a8.02 8.02 0 0 1-4.7 4.5z'%3E%3C/path%3E%3Cpath fill='%23ffffff' d='M15.9 14.8h2.9v1.1h-1v3.3h-1v-3.3h-.9v-1.1zM18.4 19.2l1.6-4.4h1.1l1.6 4.4h-1.1l-.3-.8h-1.6l-.3.8h-1zm1.6-1.8h1l-.5-1.5-.5 1.5z'%3E%3C/path%3E%3C/svg%3E") !important;
  }

  /* Close Icon */
  .iconguanbi::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E") !important;
  }

  /* Delete Icon */
  .iconshanchu::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 6 5 6 21 6'%3E%3C/polyline%3E%3Cpath d='M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6'%3E%3C/path%3E%3Cpath d='M10 11v6'%3E%3C/path%3E%3Cpath d='M14 11v6'%3E%3C/path%3E%3Cpath d='M9 6V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2'%3E%3C/path%3E%3C/svg%3E") !important;
  }

  /* Arrow Right Icon */
  .iconjiantou-youshang::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='7' y1='17' x2='17' y2='7'%3E%3C/line%3E%3Cpolyline points='9 7 17 7 17 15'%3E%3C/polyline%3E%3C/svg%3E") !important;
  }

  /* Orders Icon */
  .icondingdan::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 3h10a2 2 0 0 1 2 2v16l-3-2-2 2-2-2-2 2-2-2-3 2V5a2 2 0 0 1 2-2z'%3E%3C/path%3E%3Cpath d='M9 8h6'%3E%3C/path%3E%3Cpath d='M9 12h6'%3E%3C/path%3E%3Cpath d='M9 16h4'%3E%3C/path%3E%3C/svg%3E") !important;
  }

  /* Coupons Icon */
  .iconyouhuiquan::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 5h14a2 2 0 0 1 2 2v3a2 2 0 0 0 0 4v3a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-3a2 2 0 0 0 0-4V7a2 2 0 0 1 2-2z'%3E%3C/path%3E%3Cpath d='M9 9h.01'%3E%3C/path%3E%3Cpath d='M15 15h.01'%3E%3C/path%3E%3Cpath d='M16 8l-8 8'%3E%3C/path%3E%3C/svg%3E") !important;
  }

  /* Address Icon */
  .icondizhi::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'%3E%3C/path%3E%3Ccircle cx='12' cy='10' r='3'%3E%3C/circle%3E%3C/svg%3E") !important;
  }

  /* Logout Icon */
  .icontuichu::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'%3E%3C/path%3E%3Cpolyline points='16 17 21 12 16 7'%3E%3C/polyline%3E%3Cline x1='21' y1='12' x2='9' y2='12'%3E%3C/line%3E%3C/svg%3E") !important;
  }

  /* User Profile Icon */
  .iconyonghu::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'%3E%3C/path%3E%3Ccircle cx='12' cy='7' r='4'%3E%3C/circle%3E%3C/svg%3E") !important;
  }

  /* Arrow Left Icon */
  .iconjiantou-zuo::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='19' y1='12' x2='5' y2='12'%3E%3C/line%3E%3Cpolyline points='12 19 5 12 12 5'%3E%3C/polyline%3E%3C/svg%3E") !important;
  }

  /* Hamburger Menu Icon */
  .iconcaidan::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='3' y1='12' x2='21' y2='12'%3E%3C/line%3E%3Cline x1='3' y1='6' x2='21' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='18' x2='21' y2='18'%3E%3C/line%3E%3C/svg%3E") !important;
  }


  /* History Icon */
  .iconlishi::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 3-6.7'%3E%3C/path%3E%3Cpath d='M3 3v6h6'%3E%3C/path%3E%3Cpath d='M12 7v5l4 2'%3E%3C/path%3E%3C/svg%3E") !important;
  }

  /* Browsing History Icon */
  .iconliulanlishi::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'%3E%3C/circle%3E%3Cpath d='M12 7v5l3 2'%3E%3C/path%3E%3C/svg%3E") !important;
  }

  /* Browsing Footprint Icon */
  .iconzuji::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 20c1.7-2.2 1.4-4.2-.8-5.7-1.9-1.3-2.5-3.7-1.4-5.8C8.9 6.3 11.1 5 13.5 5c2.1 0 3.5 1.1 4.1 2.7'%3E%3C/path%3E%3Cpath d='M14 21c.8-1.7 1.1-3.2.7-4.4-.4-1.4-1.5-2.4-3.1-3.2'%3E%3C/path%3E%3Ccircle cx='14' cy='3' r='1'%3E%3C/circle%3E%3Ccircle cx='18' cy='5' r='1'%3E%3C/circle%3E%3Ccircle cx='20' cy='9' r='1'%3E%3C/circle%3E%3C/svg%3E") !important;
  }

  /* Customer Service Icon */
  .iconkefu::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 13v-1a8 8 0 0 1 16 0v1'%3E%3C/path%3E%3Cpath d='M4 13a2 2 0 0 1 2-2h1v6H6a2 2 0 0 1-2-2v-2z'%3E%3C/path%3E%3Cpath d='M20 13a2 2 0 0 0-2-2h-1v6h1a2 2 0 0 0 2-2v-2z'%3E%3C/path%3E%3Cpath d='M18 17c0 2-2 3-5 3h-1'%3E%3C/path%3E%3C/svg%3E") !important;
  }







  /* --- PRODUCT DETAILS BUY NOW BUTTON (Distinctive Purple) --- */
  .order-btn-box-trend .payment,
  .goods-detail-buy-now,
  .goods-detail-buy,
  .buy-now-btn,
  .buy-now {
    background-color: #8b5cf6 !important;
    background-image: none !important;
    border: none !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 4px rgba(139, 92, 246, 0.2) !important;
    transition: background-color 0.2s ease, box-shadow 0.2s ease !important;
    letter-spacing: 0.5px !important;
  }
  
  .order-btn-box-trend .payment:hover,
  .goods-detail-buy-now:hover,
  .goods-detail-buy:hover,
  .buy-now-btn:hover,
  .buy-now:hover {
    background-color: #7c3aed !important;
    background-image: none !important;
    transform: none !important;
    box-shadow: 0 4px 8px rgba(124, 58, 237, 0.3) !important;
  }
  
  /* Ensure inner text is white */
  .order-btn-box-trend .payment span,
  .order-btn-box-trend .payment *,
  .goods-detail-buy-now span,
  .goods-detail-buy span,
  .buy-now-btn span,
  .buy-now span {
    color: #ffffff !important;
  }

  /* --- PRODUCT DESCRIPTION COLLAPSE (Desktop only) --- */
  @media (min-width: 768px) {
    .commodity-desc-trend .content {
      max-height: 800px !important;
      overflow: hidden !important;
      position: relative !important;
      transition: max-height 0.5s ease !important;
      font-size: 16px !important;
      line-height: 1.8 !important;
      letter-spacing: 0.2px !important;
    }

    .commodity-desc-trend .content.juumi-expanded {
      max-height: none !important;
    }

    .commodity-desc-trend .content:not(.juumi-expanded)::after {
      content: '' !important;
      display: block !important;
      position: absolute !important;
      bottom: 0 !important;
      left: 0 !important;
      right: 0 !important;
      height: 120px !important;
      background: linear-gradient(transparent, #ffffff) !important;
      pointer-events: none !important;
    }

    .juumi-expand-btn {
      display: block !important;
      width: 100% !important;
      padding: 14px !important;
      margin-top: 8px !important;
      background: #f5f5f5 !important;
      border: 1px solid #e0e0e0 !important;
      border-radius: 8px !important;
      cursor: pointer !important;
      font-size: 14px !important;
      font-weight: 600 !important;
      color: #333 !important;
      letter-spacing: 0.3px !important;
      transition: background 0.2s ease !important;
    }

    .juumi-expand-btn:hover {
      background: #ebebeb !important;
    }
  }
