
.mr-snek-coupons{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 10px;
}

.mr-snek-coupon-banner-wrapper{
    display: flex;
    flex-direction: column;
    padding: 20px!important;
    border-radius: 5px;
    max-width: 230px;
}

.coupon-title-wrapper{
    display: flex;
    flex-direction: row;
    gap: 8px;
}


.coupon-title-wrapper .coupon-title{
    font-size: 20px;
    font-family: var(--e-global-typography-primary-font-family);
    font-weight: 600;
    text-transform: uppercase;
}

.coupon-title-wrapper .coupon-description{
    font-size: 20px;
    font-family: var(--e-global-typography-primary-font-family);
    font-weight: 400;
    text-transform: capitalize;
}

  
/* .mr-snek-coupon-banner-wrapper:hover {
    transform: scale(1.01);
} */

.copy-badge {
    display: none;
    position: absolute;
    top: 10px;
    right: 14px;
    background: #fff;
    color: #333;
    font-size: 12px;
    padding: 0.2em 0.6em;
    border-radius: 4px;
    box-shadow: 0 0 3px rgba(0,0,0,0.15);
    pointer-events: none;
    font-family: var(--e-global-typography-primary-font-family);
    font-weight: bold;
}

.mr-snek-coupon-banner-wrapper:hover .copy-badge {
display: inline-block;
}

.mr-snek-coupon-banner-wrapper {
    position: relative;
    color: #fff;
    border-radius: 8px;
    margin-bottom: 1.5em;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    cursor: pointer;
  
    /* Apply mask that preserves full rect and cuts circles */
    -webkit-mask-image: 
      radial-gradient(circle 8px at left center, transparent 8px, black 9px),
      radial-gradient(circle 8px at right center, transparent 8px, black 9px),
      linear-gradient(black, black); /* Full base mask */
    -webkit-mask-composite: destination-out, destination-out, source-over;
  
    mask-image: 
      radial-gradient(circle 8px at left center, transparent 8px, black 9px),
      radial-gradient(circle 8px at right center, transparent 8px, black 9px),
      linear-gradient(black, black);
    mask-composite: exclude, exclude, add;
  }
  
  .coupon-valid-till{
    font-size: 12px;
    margin-top: 20px;
    font-weight: 600;
    font-family: var(--e-global-typography-primary-font-family);

  }
  