/* =========================================================
   SERVICE ICON FINAL LOCK
   JS boleh mengubah text COD/JUAL, tapi text tidak akan tampil.
   ========================================================= */

.service-strip .service-item .service-icon {
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;

  display: grid !important;
  place-items: center !important;

  overflow: hidden !important;
}

/* ==========================
   COD = COURIER / DELIVERY
   ========================== */

.service-strip .service-item:nth-child(1) .service-icon::before {
  content: "" !important;

  display: block !important;
  width: 24px !important;
  height: 24px !important;

  background: #ffffff !important;

  -webkit-mask-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5h11v10H3V5zm11 3h3l4 4v3h-7V8zM6 19a2 2 0 1 0 0-4 2 2 0 0 0 0 4zm11 0a2 2 0 1 0 0-4 2 2 0 0 0 0 4z'/%3E%3C/svg%3E") !important;

  mask-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5h11v10H3V5zm11 3h3l4 4v3h-7V8zM6 19a2 2 0 1 0 0-4 2 2 0 0 0 0 4zm11 0a2 2 0 1 0 0-4 2 2 0 0 0 0 4z'/%3E%3C/svg%3E") !important;

  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;

  -webkit-mask-position: center !important;
  mask-position: center !important;

  -webkit-mask-size: contain !important;
  mask-size: contain !important;
}


/* ==========================
   JUAL = PRICE TAG
   ========================== */

.service-strip .service-item:nth-child(2) .service-icon::before {
  content: "" !important;

  display: block !important;
  width: 23px !important;
  height: 23px !important;

  background: #ffffff !important;

  -webkit-mask-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21 12.6 11.4 22.2 2 12.8V3h9.8L21 12.2a.6.6 0 0 1 0 .4zM6.5 6a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3z'/%3E%3C/svg%3E") !important;

  mask-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21 12.6 11.4 22.2 2 12.8V3h9.8L21 12.2a.6.6 0 0 1 0 .4zM6.5 6a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3z'/%3E%3C/svg%3E") !important;

  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;

  -webkit-mask-position: center !important;
  mask-position: center !important;

  -webkit-mask-size: contain !important;
  mask-size: contain !important;
}