.product-badge-green {
    position: absolute;
    top: -10px; /* Move it slightly above the row */
    left: 10px; /* Add some space from the left edge */
    background:  #39b65d;
    color: white;
    font-size: 14px;
    padding: 5px 18px;
    border-radius: 12px;
    font-weight: bold;
    z-index: 10;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}
.product-badge-red {
    position: absolute;
    top: -10px; /* Move it slightly above the row */
    left: 10px; /* Add some space from the left edge */
    background:  #fd0000;
    color: white;
    font-size: 14px;
    padding: 5px 18px;
    border-radius: 12px;
    font-weight: bold;
    z-index: 10;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}
.product-badge-blue {
    position: absolute;
    top: -10px; /* Move it slightly above the row */
    left: 10px; /* Add some space from the left edge */
    background:  #1890ce;
    color: white;
    font-size: 14px;
    padding: 5px 18px;
    border-radius: 12px;
    font-weight: bold;
    z-index: 10;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}
.product-badge-black {
    position: absolute;
    top: -10px; /* Move it slightly above the row */
    left: 10px; /* Add some space from the left edge */
    background:  #000000;
    color: white;
    font-size: 14px;
    padding: 5px 18px;
    border-radius: 12px;
    font-weight: bold;
    z-index: 10;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}
  
  /* Ensure the product row is positioned relative for the badge to work */
  .product-row {
    position: relative;
  }
  .hidden {
    display: none;
}