.font-color-primary {
  color: var(--primary-color);
}

.nav-link {
  color: var(--primary-color); /* เปลี่ยนสีฟอนต์ของแท็บ */
}

.font-color-gray {
  color: #777777;
}

.font-color-gray-v2 {
  color: #cbcbcb;
}

.font-color-red {
  color: #ff0000;
}

.font-color-red-v2 {
  color: #ff0000;
}

.font-color-green {
  color: #7dc590;
}

.border-secondary {
  border-color: #e7eaee !important;
}

.custom-disabled {
  background-color: white !important;
  color: black !important;
  /* Adjust text color if necessary */
  opacity: 1 !important;
  /* Override the default opacity */
  cursor: not-allowed;
  /* Indicate that the input is disabled */
}

.bar-top {
  display: flex;
  align-items: center;
  /* Frame 13 */
  height: 30px;
  left: 0px;
  top: 78px;

  background: linear-gradient(180deg, #fbcfc2 0%, #fe6c5f 100%);
}

.btn-gradient-pink {
  /* background: linear-gradient(180deg, #fbcfc2 0%, #fe6c5f 50%); */
  background-color: var(--primary-color);
}

.topic-1 {
  /* ตะกร้าของขวัญ */

  position: absolute;
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;

  color: #ffffff;
}

.btn-primary-color {
  border: 1px solid var(--primary-color);
  background-color: var(--primary-color);
  color: #ffffff;
}

.text-ellipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.product-name {
  /* ขนมแมวเลีย 5 ซอง */

  font-family: "Noto Sans Thai";
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #000000;
  display: block;
}

.ellipse {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  width: 100%;
}

.block_primary {
  background-color: var(--primary-color);
}

.block_gray_hr {
  border-top: rgb(221, 217, 217) solid;
}

.block_image {
  /* border: 2px solid #e7eaee; */
  /* border-radius: 15px; */
  /* padding-top: 15px;
  padding-bottom: 15px;
  padding-left: 5px;
  padding-right: 5px; */
  text-align: center;
}

.col-0-5 {
  flex: 0 0 4.166667%;
  max-width: 4.166667%;
}

.col-3-5 {
  flex: 0 0 29.166667%;
  max-width: 29.166667%;
}

.col-8-5 {
  flex: 0 0 70.833333%;
  max-width: 70.833333%;
}

.col-9-5 {
  flex: 0 0 79.166667%;
  max-width: 79.166667%;
}

.form-check-input:checked {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
}

.form-check-input:disabled {
  background-color: var(--primary-color) !important;
  color: black !important;
  /* Adjust text color if necessary */
  opacity: 1 !important;
  /* Override the default opacity */
  cursor: not-allowed;
  /* Indicate that the input is disabled */
}

.block_summary_score {
  border-top: 2px solid #e7eaee;
  border-bottom: 2px solid #e7eaee;
  height: 60px;
}

.text_custom_btn {
  /* ยืนยัน และ ชำระเงิน */
  font-size: 16px;
}

.block_point {
  border: 2px solid var(--primary-color); /* กำหนดสีเทาให้กับขอบ */
  border-radius: 30px; /* ทำให้มุมมน */
  width: 100%;
}

.btn-primary {
  background-color: var(--primary-color); /* สีพื้นหลังใหม่ */
  border-color: var(--primary-color); /* สีขอบใหม่ */
}

.btn-primary:hover {
  background-color: var(--primary-color); /* สีพื้นหลังใหม่ */
  border-color: var(--primary-color); /* สีขอบใหม่ */
  opacity: 0.7 !important;
}

.text-discount {
  color: #e7eaee;
}

.image_icon {
  height: 20px;
  width: 20px;
}

.image_gift {
  border: 2px solid #e7eaee;
  border-radius: 15px;
  width: 70px;
  height: 70px;
  object-fit: cover;
}

.image_product {
  border-radius: 15px;
  width: 70px;
  height: 70px;
  object-fit: cover;
}

.point-star {
  /* point */

  box-sizing: border-box;

  /* Auto layout */
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 2px;
  height: 20px;

  background: #ffffff;
  border: 1px solid #f58e85;
  color: #f58e85;
  box-shadow: 0px 1px 2px rgba(245, 142, 133, 0.22);
  border-radius: 20px;
}

.font-star {
  font-size: 14px;
}
