.notification {
  position: fixed;
  bottom: 60px;
  left: -445px; /* Bắt đầu bên ngoài màn hình */
  background-color: #fff;
  color: #000;
  padding: 10px;
  border-radius: 5px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
  display: flex;
  align-items: center;
  z-index: 9999;
  transition: left 0.5s ease-in-out; /* Hiệu ứng chuyển động từ trái qua */
}

.notification.show {
  left: 20px; /* Vị trí hiển thị */
}

.product-image {
  width: 100px;
  height: auto;
  object-fit: cover;
  border-radius: 5px;
  margin-right: 10px;
}

.notification-content {
  flex-grow: 1;
}

.product-name, .product-price {
  width: 250px;
  font-size: 16px;
  margin: 0;
  word-break: break-word; /* Đảm bảo chữ không vượt quá giới hạn */
}

.product-price {
  font-size: 14px;
  color: red;
  margin: 0;
}

.close-btn {
  background: none;
  border: none;
  font-size: 20px;
  color: #000;
  cursor: pointer;
  margin-left: 10px;
}


/* support */
.arcu-widget .messangers-block {
    background-color: #FFFFFF
}

.arcu-widget .messangers-block:before {
    border-top-color: #FFFFFF
}

.messangers-block .messanger p, .messangers-block .messanger .arcu-item-label {
    color: #000000
}

.messangers-block .messanger:hover p, .messangers-block .messanger:hover .arcu-item-label {
    color: #000000
}

.messangers-block .messanger:hover {
    background-color: #FFFFFF
}

.arcu-widget .messanger p .arcu-item-subtitle, .arcu-widget .messanger .arcu-item-label .arcu-item-subtitle {
    color: #0055C7
}

.arcu-widget .messanger:hover p .arcu-item-subtitle, .arcu-widget .messanger:hover .arcu-item-label .arcu-item-subtitle {
    color: #0055C7
}

#arcu-message-callback-phone-submit {
    font-weight: normal
}

.grecaptcha-badge {
    display: none
}

.arcu-widget.left.arcu-message {
  left: unset !important;
    right: 20px !important;
}

.arcu-widget .arcu-message-button .static div svg, .arcu-widget .arcu-message-button .static div i, .arcu-widget .arcu-message-button .static div img {
    width: 24px;
    height: 24px
}

.arcu-widget .arcu-message-button .static div img {
    border-radius: 50%;
    display: block
}

.arcu-widget.left.arcu-message {
    bottom: 20px
}

.arcu-widget .messangers-block, .arcu-widget .arcu-prompt, .arcu-widget .callback-countdown-block {
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.2)
}

.arcu-widget .arcu-message-button .pulsation {
    -webkit-animation-duration: 2s;
    animation-duration: 2s
}

#ar-zalo-chat-widget {
    display: none
}

#ar-zalo-chat-widget.active {
    display: block
}

.arcu-widget .messangers-block, .arcu-widget .arcu-popup {
    width: 300px
}

.messangers-block .messanger p, .messangers-block .messanger .arcu-item-label {
}

.arcu-widget.no-bg .messanger .arcu-item-label {
    background: #FFFFFF
}

.arcu-widget.no-bg .messanger:hover .arcu-item-label {
    background: #FFFFFF
}

.arcu-widget.no-bg .messanger .arcu-item-label:before, .arcu-widget.no-bg .messanger:hover .arcu-item-label:before {
    border-left-color: #FFFFFF
}

.arcu-widget.left.no-bg .messanger:hover .arcu-item-label:before {
    border-right-color: #FFFFFF;
    border-left-color: transparent
}

.arcu-widget.no-bg .messanger:hover .arcu-item-label {
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.2)
}

.arcu-widget .arcu-forms-container {
    width: auto
}

.arcu-widget .arcu-forms-container #arcu-form-callback {
    width: 300px
}

.arcu-widget .arcu-forms-container #arcu-form-email {
    width: 300px
}

@media(max-width: 428px) {
    .arcu-widget.left.arcu-message.opened, .arcu-widget.left.arcu-message.open, .arcu-widget.left.arcu-message.popup-opened {
        left:0;
        right: 0;
        bottom: 0
    }
}
.arcu-widget .arcu-forms-container, .arcu-widget .messangers-block, .arcu-widget .arcu-prompt, .arcu-widget .arcu-popup {
    right: 0 !important;
    left: unset !important;
}