#ny-chatbot-container button,
#ny-chatbot-container button[type="button"],
#ny-chatbot-container button[type="submit"],
#ny-chatbot-container input[type="button"],
#ny-chatbot-container input[type="submit"],
#ny-chatbot-open-btn,
#ny-chatbot-open-btn[type="button"] {
  border: none;
  border-radius: 0;
  background: 0 0;
  background-image: none;
  padding: 0;
  margin: 0;
  outline: 0;
  box-shadow: none;
  text-decoration: none;
  text-transform: none;
  letter-spacing: normal;
  line-height: normal;
  font-weight: 400;
  font-style: normal;
  font-size: inherit;
  font-family: inherit;
  color: inherit;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  min-width: 0;
  min-height: 0;
  vertical-align: baseline;
  text-shadow: none;
  transition: none;
  box-sizing: border-box;
}
#ny-chatbot-container button:active,
#ny-chatbot-container button:focus,
#ny-chatbot-container button:hover,
#ny-chatbot-container button[type="button"]:active,
#ny-chatbot-container button[type="button"]:focus,
#ny-chatbot-container button[type="button"]:hover,
#ny-chatbot-container button[type="submit"]:active,
#ny-chatbot-container button[type="submit"]:focus,
#ny-chatbot-container button[type="submit"]:hover,
#ny-chatbot-container input[type="button"]:active,
#ny-chatbot-container input[type="button"]:focus,
#ny-chatbot-container input[type="button"]:hover,
#ny-chatbot-container input[type="submit"]:active,
#ny-chatbot-container input[type="submit"]:focus,
#ny-chatbot-container input[type="submit"]:hover,
#ny-chatbot-open-btn:active,
#ny-chatbot-open-btn:focus,
#ny-chatbot-open-btn[type="button"]:active,
#ny-chatbot-open-btn[type="button"]:focus {
  border: none;
  outline: 0;
  background-image: none;
  text-decoration: none;
  box-shadow: none;
}
#ny-chatbot-container input[type="text"],
#ny-chatbot-container textarea {
  border: none;
  border-radius: 0;
  background: 0 0;
  background-image: none;
  padding: 0;
  margin: 0;
  outline: 0;
  box-shadow: none;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  font-size: inherit;
  font-family: inherit;
  color: inherit;
  text-shadow: none;
  box-sizing: border-box;
  min-height: 0;
  max-height: none;
  height: auto;
  width: auto;
}
#ny-chatbot-open-btn {
  position: fixed;
  bottom: var(--ny-btn-bottom-desktop);
  z-index: 100000;
  display: flex;
  align-items: center;
  cursor: pointer;
  border: none;
  box-shadow: 0 6px 32px 0 rgb(0 0 0 / 0.18);
  transition:
    opacity 0.45s ease,
    transform 0.45s ease;
}
#ny-chatbot-open-btn.boxed-style {
  background: var(--ny-primary-color);
  color: var(--ny-secondary-color);
  border-radius: 1.2em;
  padding: 0.9em 1.5em;
  font-size: 0.9em;
  font-weight: 600;
  gap: 0.7em;
  font-family: inherit;
}
#ny-chatbot-open-btn.circle-style {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  justify-content: center;
  overflow: hidden;
  background: #fff0;
  padding: 0;
}
#ny-chatbot-open-btn.ny-delayed {
  opacity: 0;
  transform: translateY(8px) scale(0.98);
  pointer-events: none;
}
#ny-chatbot-open-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 40px 0 rgb(0 0 0 / 0.25);
}
#ny-chatbot-open-btn.boxed-style .ny-button-icon {
  line-height: 1;
  display: inline-block;
}
#ny-chatbot-open-btn.boxed-style .ny-button-icon img {
  width: 30px;
  height: 30px;
  object-fit: contain;
  display: inline-block;
  vertical-align: middle;
}
#ny-chatbot-open-btn.ny-revealing {
  animation: ny-btn-pop 0.44s ease-out;
}
#ny-chatbot-open-btn.ny-pulse-enabled:not(.ny-open-btn-close):not(
    .ny-delayed
  ):not(.ny-revealing) {
  overflow: visible;
  animation: ny-animation-pulse 2s ease-out infinite;
}
#ny-chatbot-open-btn.circle-style.ny-pulse-enabled:not(.ny-open-btn-close):not(
    .ny-delayed
  ):not(.ny-revealing) {
  animation:
    ny-animation-wiggle 2s ease-in-out infinite,
    ny-animation-pulse 2s ease-out infinite;
}
@keyframes ny-animation-wiggle {
  0%,
  100% {
    transform: rotate(0);
  }
  25% {
    transform: rotate(-2deg);
  }
  50% {
    transform: rotate(2deg);
  }
  75% {
    transform: rotate(-1deg);
  }
}
@keyframes ny-animation-pulse {
  0% {
    box-shadow: 0 0 0 0 var(--ny-pulse-color-50, rgba(20, 93, 238, 0.5));
  }
  70% {
    box-shadow: 0 0 0 20px var(--ny-pulse-color-0, rgba(20, 93, 238, 0));
  }
  100% {
    box-shadow: 0 0 0 0 var(--ny-pulse-color-0, rgba(20, 93, 238, 0));
  }
}
#ny-chatbot-open-btn.circle-style img {
  width: 96%;
  height: 96%;
  object-fit: cover;
  border-radius: 50%;
  display: block;
  transition: transform 0.3s ease;
}
#ny-chatbot-open-btn.circle-style svg.ny-bot-avatar {
  border-radius: 50%;
}
#ny-chatbot-open-btn.circle-style svg.ny-bot-avatar .ny-avatar-bg {
  fill: var(--ny-primary-color);
}
#ny-chatbot-open-btn.circle-style svg.ny-bot-avatar .ny-avatar-icon {
  fill: var(--ny-secondary-color);
}
#ny-chatbot-open-btn.circle-style.ny-open-btn-close {
  color: #000;
  background-color: #fff;
  animation: none !important;
}
#ny-chatbot-open-btn.circle-style.ny-open-btn-close .ny-close-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
#ny-chatbot-open-btn.circle-style.ny-open-btn-close .ny-close-icon svg {
  display: block;
  width: 22px;
  height: 22px;
}
#ny-chatbot-open-btn.circle-style.ny-open-btn-close .ny-close-icon svg path {
  stroke-width: 2;
  stroke-linecap: round;
  fill: none;
}
#ny-chatbot-open-btn[data-position="bottom-left"] {
  left: var(--ny-btn-side-desktop);
  right: auto;
}
#ny-chatbot-open-btn[data-position="bottom-right"] {
  right: var(--ny-btn-side-desktop);
  left: auto;
}
#ny-chatbot-container {
  position: fixed;
  bottom: 5.5rem;
  z-index: 100001;
  width: 100%;
  max-width: 410px;
  height: 580px;
  margin: 0;
  background: var(--ny-container-bg);
  border-radius: 1em;
  color: var(--ny-bot-msg-text);
  box-sizing: border-box;
  box-shadow: 0 8px 32px 0 rgb(0 0 0 / 0.35);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  direction: rtl;
}
#ny-chatbot-container[data-position="bottom-right"] {
  right: 2.5rem;
  left: auto;
}
#ny-chatbot-container[data-position="bottom-left"] {
  left: 2.5rem;
  right: auto;
}
#ny-chatbot-container * {
  box-sizing: border-box;
}
#ny-chatbot-header {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5em;
  padding: 1em 1.5em 1em 0.8em;
  background-color: var(--ny-header-bg);
  flex-shrink: 0;
}
#ny-chatbot-header .ny-chatbot-header-contents {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
#ny-chatbot-header h3 {
  margin: 0;
  font-size: var(--ny-header-fs-desktop);
  font-weight: 600;
  color: var(--ny-header-text);
  line-height: 1.2;
}
#ny-chatbot-header .ny-header-avatar {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  object-fit: cover;
  margin-inline-end: 7px;
  flex-shrink: 0;
}
#ny-chatbot-header .ny-online-status {
  margin: 0;
  line-height: 1;
}
#ny-chatbot-header .ny-online-indicator {
  width: 8px;
  height: 8px;
  background: var(--ny-header-status-dot);
  border-radius: 50%;
  display: inline-block;
  animation: ny-pulse 1.6s infinite;
}
#ny-chatbot-header .ny-online-label {
  font-size: 0.78em;
  color: var(--ny-header-status-text);
}
#ny-chatbot-container #ny-chatbot-close-btn,
#ny-chatbot-container #ny-chatbot-reset-btn {
  width: 36px;
  height: 36px;
  padding: 0;
  background: #fff0;
  border: 0;
  border-radius: 50%;
  transition: 0.15s;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
#ny-chatbot-container #ny-chatbot-reset-btn {
  margin-inline-start: auto;
}
#ny-chatbot-container #ny-chatbot-close-btn {
  margin-inline-start: auto;
}
#ny-chatbot-container #ny-chatbot-reset-btn ~ #ny-chatbot-close-btn {
  margin-inline-start: -10px;
}
#ny-chatbot-container #ny-chatbot-reset-btn:hover,
#ny-chatbot-container #ny-chatbot-close-btn:hover {
  background: rgba(255, 255, 255, 0.15);
}

#ny-chatbot-container #ny-chatbot-close-btn svg,
#ny-chatbot-container #ny-chatbot-reset-btn svg {
  color: var(--ny-header-text);
  width: 17px;
  height: 17px;
  transition: transform 0.5s ease;
}
#ny-chat-messages {
  flex: 1;
  overflow-y: auto;
  padding: 1.5em 1.5em 0.5em 1.5em;
  width: 100%;
  scroll-behavior: smooth;
  scrollbar-width: thin;
  scrollbar-color: var(--ny-scrollbar-thumb) var(--ny-scrollbar-track);
}
#ny-chat-messages::-webkit-scrollbar {
  width: 8px;
}
#ny-chat-messages::-webkit-scrollbar-track {
  background: var(--ny-scrollbar-track);
  border-radius: 4px;
}
#ny-chat-messages::-webkit-scrollbar-thumb {
  background: var(--ny-scrollbar-thumb);
  border-radius: 4px;
  border: 1px solid var(--ny-scrollbar-thumb-border);
}
#ny-chat-messages::-webkit-scrollbar-thumb:hover {
  background: var(--ny-scrollbar-thumb-hover);
}
.ny-user-message {
  text-align: right;
  background: var(--ny-user-msg-bg);
  color: var(--ny-user-msg-text);
  margin: 0.5em 0 0.5em auto;
  padding: 0.9em 1em;
  border-radius: 0.8em 0.8em 0 0.8em;
  max-width: 100%;
  direction: rtl;
  font-size: var(--ny-user-msg-fs-desktop);
  line-height: 1.4;
  word-break: break-word;
  width: fit-content;
}
.ny-bot-message {
  text-align: right;
  background: var(--ny-bot-msg-bg);
  color: var(--ny-bot-msg-text);
  margin: 0.5em 0;
  padding: 0.9em 1em;
  border-radius: 0.8em 0.8em 0.8em 0;
  max-width: 100%;
  direction: rtl;
  font-size: var(--ny-bot-msg-fs-desktop);
  line-height: 1.4;
  word-break: break-word;
  overflow-x: auto;
}
.ny-bot-message .ny-message-content,
.ny-user-message .ny-message-content {
  line-height: 1.9;
}
.ny-bot-message .ny-message-content *,
.ny-user-message .ny-message-content * {
  margin: 0;
}
.ny-bot-message .thumb-img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 6px 0;
}
.ny-message-time {
  font-size: 0.7em;
  opacity: 0.6;
  margin-top: 4px;
  color: inherit;
}
.ny-date-separator {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 12px 0 8px;
  direction: rtl;
}
.ny-date-separator span {
  background: var(--ny-bot-msg-bg);
  color: var(--ny-bot-msg-text);
  font-size: 0.72em;
  padding: 3px 14px;
  border-radius: 12px;
  opacity: 0.75;
  white-space: nowrap;
  letter-spacing: 0.3px;
}
.ny-user-message .ny-message-time {
  text-align: right;
  direction: rtl;
}
#ny-chat-form {
  display: flex;
  flex-direction: row;
  gap: 0.3em;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
  direction: rtl;
  padding: 0.8em 1.2em;
  border-top: 1px solid rgb(255 255 255 / 0.1);
  margin: 0;
  flex-shrink: 0;
}
#ny-chatbot-container #ny-chat-input {
  flex: 1;
  background: var(--ny-input-bg);
  color: var(--ny-input-text);
  border: 1.5px solid
    color-mix(in srgb, var(--ny-accent-color) 30%, transparent);
  border-radius: 1.2em;
  padding: 0.65em 1.1em;
  direction: rtl;
  display: block;
  min-height: 42px;
  max-height: 84px;
  min-width: 0;
  font-size: var(--ny-input-fs-desktop);
  line-height: 1.5;
  box-shadow: 0 2px 7px 0 rgb(0 0 0 / 0.1);
  margin: 0 3px;
  outline: 0;
  font-family: inherit;
  box-sizing: border-box;
  resize: none;
  overflow-x: hidden;
  overflow-y: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
#ny-chatbot-container #ny-chat-input::-webkit-scrollbar {
  display: none;
}
#ny-chatbot-container #ny-chat-input:focus {
  border-color: var(--ny-accent-color);
  box-shadow: 0 0 0 2px
    color-mix(in srgb, var(--ny-accent-color) 20%, transparent);
  outline: 0;
}
#ny-chatbot-container #ny-file-btn,
#ny-chatbot-container #ny-voice-btn {
  background: #fff0;
  color: var(--ny-icon-btn-icon);
  border: 1px solid color-mix(in srgb, var(--ny-accent-color) 30%, transparent);
  border-radius: 50%;
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin-left: 5px;
  cursor: pointer;
  transition: 0.15s;
  outline: 0;
}
#ny-chatbot-container #ny-send-btn {
  background: var(--ny-send-btn-bg);
  border-radius: 50%;
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  cursor: pointer;
  box-shadow: 0 2px 7px 0 rgb(0 0 0 / 0.09);
  transition: 0.15s;
}
#ny-chatbot-container #ny-stop-btn {
  background: var(--ny-stop-btn-bg);
  color: var(--ny-stop-btn-icon);
  border: none;
  border-radius: 50%;
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  cursor: pointer;
  box-shadow: 0 2px 7px 0 rgb(0 0 0 / 0.09);
  transition: 0.15s;
}
#ny-chatbot-container #ny-file-btn:hover,
#ny-chatbot-container #ny-voice-btn:hover {
  background: color-mix(in srgb, var(--ny-primary-color) 10%, transparent);
  border-color: var(--ny-primary-color);
  color: var(--ny-primary-color);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgb(0 0 0 / 0.15);
}
#ny-chatbot-container #ny-send-btn:hover {
  background: var(--ny-primary-color);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgb(0 0 0 / 0.15);
}
#ny-chatbot-container button svg {
  display: block;
  width: 18px;
  height: 18px;
  margin: 0 auto;
  pointer-events: none;
}
#ny-chatbot-container #ny-send-btn svg path {
  fill: var(--ny-send-btn-icon);
}
@keyframes ny-pulse {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes ny-btn-pop {
  0% {
    transform: translateY(8px) scale(0.98);
    opacity: 0;
  }
  60% {
    transform: translateY(-2px) scale(1.03);
    opacity: 1;
  }
  100% {
    transform: translateY(0) scale(1);
    opacity: 1;
  }
}
@keyframes ny-typing-bounce {
  0%,
  100%,
  80% {
    transform: scale(0.8);
    opacity: 0.5;
  }
  40% {
    transform: scale(1);
    opacity: 1;
  }
}
.ny-typing-indicator {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0.8em 1em;
  background: rgb(255 255 255 / 0.05);
  border-radius: 0.8em 0.8em 0.8em 0;
  max-width: 200px;
  margin: 0.5em 0;
}
.ny-typing-indicator.ny-typing-text-mode {
  max-width: 100%;
  padding: 0.6em 1em;
}
.ny-typing-text {
  color: var(--ny-bot-msg-text);
  font-size: 0.9em;
  font-style: italic;
  opacity: 0.8;
  animation: ny-typing-pulse 1.5s infinite ease-in-out;
}
@keyframes ny-typing-pulse {
  0%,
  100% {
    opacity: 0.6;
  }
  50% {
    opacity: 1;
  }
}
.ny-typing-avatar {
  width: 22px;
  height: 22px;
  background: var(--ny-primary-color);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  color: var(--ny-secondary-color);
  flex-shrink: 0;
}
.ny-typing-avatar img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
}
.ny-typing-dots {
  display: flex;
  gap: 3px;
}
.ny-typing-dot {
  width: 6px;
  height: 6px;
  background: var(--ny-primary-color);
  border-radius: 50%;
  animation: ny-typing-bounce 1.4s infinite ease-in-out;
}
.ny-typing-dot:first-child {
  animation-delay: -0.32s;
}
.ny-typing-dot:nth-child(2) {
  animation-delay: -0.16s;
}
.ny-typing-dot:nth-child(3) {
  animation-delay: 0s;
}
#ny-chatbot-container #ny-quick-replies {
  flex-shrink: 0;
  backdrop-filter: blur(6px);
  padding: 0.9em 1.5em 0.7em;
  z-index: 2;
  background: var(--ny-quick-replies-bg);
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
  cursor: grab;
}
#ny-chatbot-container #ny-quick-replies::-webkit-scrollbar {
  display: none;
}
#ny-chatbot-container #ny-quick-replies.ny-dragging {
  cursor: grabbing;
}
#ny-chatbot-container .ny-qr-item,
#ny-chatbot-container button.ny-qr-item {
  display: inline-block;
  white-space: nowrap;
  background: var(--ny-quick-item-bg);
  color: var(--ny-quick-item-text);
  border: 1px solid var(--ny-quick-item-border);
  border-radius: 10px;
  padding: 6px 10px;
  margin: 0 6px 6px 0;
  font-size: var(--ny-quick-fs-desktop);
  cursor: pointer;
  transition:
    background 0.15s ease,
    color 0.15s ease,
    border-color 0.15s ease,
    transform 0.15s ease;
  font-family: inherit;
}
#ny-chatbot-container .ny-qr-item:active,
#ny-chatbot-container .ny-qr-item:focus,
#ny-chatbot-container button.ny-qr-item:active,
#ny-chatbot-container button.ny-qr-item:focus {
  border: 1px solid var(--ny-quick-item-border);
  background: var(--ny-quick-item-bg);
  color: var(--ny-quick-item-text);
  outline: 0;
}
#ny-chatbot-container .ny-qr-item:hover,
#ny-chatbot-container button.ny-qr-item:hover {
  background: var(--ny-quick-item-hover-bg);
  color: var(--ny-quick-item-hover-text);
  border: 1px solid var(--ny-quick-item-hover-border);
  transform: translateY(-1px);
}

.ny-bot-message .ny-message-content a.ny-link-btn:not(.product-content-row),
.ny-live-bubble a.ny-link-btn:not(.product-content-row) {
  display: inline-block;
  padding: 6px 10px;
  background: var(--ny-primary-color);
  color: var(--ny-secondary-color);
  border-radius: 8px;
  text-decoration: none;
  font-weight: 600;
  box-shadow: 0 2px 6px rgb(0 0 0 / 0.2);
  transition:
    transform 0.15s ease,
    opacity 0.15s ease;
}
.ny-bot-message
  .ny-message-content
  a.ny-link-btn:not(.product-content-row):hover,
.ny-live-bubble a.ny-link-btn:not(.product-content-row):hover {
  opacity: 0.9;
  transform: translateY(-1px);
}
.ny-message-content .ny-md-heading {
  margin: 0.5em 0 0.3em;
  font-weight: 700;
  line-height: 1.3;
}
.ny-message-content h2.ny-md-heading {
  display: inline;
  font-size: 1.2em;
}
.ny-message-content .ny-md-list {
  margin: 0.5em 0;
  padding-right: 1.2em;
  list-style-type: disc;
}
.ny-message-content .ny-md-list-item {
  margin: 0.2em 0;
  line-height: 1.5;
}
.ny-qr-item a.ny-qr-link {
  color: inherit;
  text-decoration: underline;
}
.ny-qr-item a.ny-qr-link:hover {
  text-decoration: none;
}
@media (max-width: 600px) {
  #ny-chatbot-container {
    right: 0 !important;
    left: 0;
    bottom: 0;
    top: 0;
    max-width: 100vw;
    margin: 0;
    border-radius: 0;
    height: auto;
  }
  #ny-chat-messages {
    flex: 1;
    max-height: none;
    min-height: 0;
    overflow-y: auto;
  }
  #ny-quick-replies {
    flex-shrink: 0;
    max-height: 150px;
    overflow-y: auto;
    position: relative;
    bottom: auto;
    padding: 0.8em 1.5em;
  }
  #ny-chat-form {
    flex-shrink: 0;
    padding-bottom: calc(0.8em + env(safe-area-inset-bottom));
  }
  #ny-chatbot-open-btn {
    bottom: var(--ny-btn-bottom-mobile);
  }
  #ny-chatbot-open-btn[data-position="bottom-left"] {
    left: var(--ny-btn-side-mobile);
  }
  #ny-chatbot-open-btn[data-position="bottom-right"] {
    right: var(--ny-btn-side-mobile);
  }
  #ny-chatbot-open-btn.circle-style {
    width: 56px;
    height: 56px;
  }
  #ny-chatbot-container #ny-file-btn,
  #ny-chatbot-container #ny-send-btn,
  #ny-chatbot-container #ny-voice-btn {
    width: 38px;
    height: 38px;
  }
  #ny-chatbot-container #ny-file-btn svg,
  #ny-chatbot-container #ny-send-btn svg,
  #ny-chatbot-container #ny-voice-btn svg {
    width: 18px;
    height: 18px;
  }
  #ny-chatbot-container .ny-message-time {
    font-size: 0.65em;
    margin-top: 3px;
  }
  #ny-chatbot-header h3 {
    font-size: var(--ny-header-fs-mobile);
  }
  #ny-chatbot-header .ny-online-label {
    font-size: 0.67em;
  }
  #ny-chatbot-container .ny-user-message {
    font-size: var(--ny-user-msg-fs-mobile);
  }
  #ny-chatbot-container .ny-bot-message {
    font-size: var(--ny-bot-msg-fs-mobile);
  }
  #ny-chatbot-container #ny-chat-input {
    font-size: var(--ny-input-fs-mobile);
  }
  #ny-chatbot-container .ny-qr-item {
    font-size: var(--ny-quick-fs-mobile);
  }
  #ny-chatbot-container .ny-tooltip-content {
    font-size: var(--ny-welcome-fs-mobile);
  }
}
.ny-bot-message .ny-message-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 9px;
}
#ny-chatbot-container .ny-chat-error {
  padding: 1.5em 1.6em;
  font-size: 0.8em;
  line-height: 1.5em;
  text-align: center;
}
#ny-chatbot-container .ny-chat-error p {
  margin: 0;
}
#ny-chatbot-container .ny-similar-questions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0;
  direction: rtl;
}
#ny-chatbot-container .ny-similar-questions .ny-similar-question-item {
  all: unset;
  display: inline-block;
  padding: 7px 13px;
  background: var(--ny-bot-msg-bg);
  border-radius: 8px;
  cursor: pointer;
  transition: opacity 0.2s ease;
  font-size: 0.84em;
  line-height: 1.5;
  color: var(--ny-bot-msg-text);
  direction: rtl;
  text-align: right;
  font-family: inherit;
  box-sizing: border-box;
  opacity: 0.85;
}
#ny-chatbot-container .ny-similar-questions .ny-similar-question-item:hover {
  opacity: 1;
}
@media (max-width: 600px) {
  #ny-chatbot-container .ny-similar-questions {
    gap: 6px;
  }
  #ny-chatbot-container .ny-similar-questions .ny-similar-question-item {
    font-size: 0.85em;
    padding: 8px 12px;
  }
}


#ny-chatbot-container .ny-qr-item.ny-qr-disabled,
#ny-chatbot-container .ny-qr-item[disabled],
#ny-chatbot-container button.ny-qr-item.ny-qr-disabled,
#ny-chatbot-container button.ny-qr-item[disabled] {
  opacity: 0.55;
  cursor: not-allowed;
  pointer-events: none;
}

/* --------------------------------------------------------------------------
   iOS: type into a field without the page zooming in
   --------------------------------------------------------------------------
   Mobile Safari zooms the viewport whenever a form control is focused while
   rendering below 16px, and every field the visitor can touch is below it:
   the chat input defaults to 11px and the slider goes down to 10px, while the
   pre-chat and handoff fields sit around 12px.

   The font is therefore 16px on mobile FULL TIME, not only on focus. Doing it
   on :focus alone meant Safari measured 11px at the moment the tap landed —
   which is exactly when it decides whether to zoom — and switching size on
   focus visibly resized the placeholder under the visitor's finger.

   The configured size is honoured where it is actually seen: the placeholder,
   which is what the field shows at rest and what the surrounding design was
   drawn around. Typed text is 16px, which on a phone is a legible size rather
   than a regression.

   What this rule must NOT touch, and does not: width and height. The chat
   input is a flex child (#ny-chat-form is a flex row, the input is flex: 1)
   so the layout owns its width, and resizeChatInput() in frontend.js owns its
   height — it measures scrollHeight on every keystroke and writes the result
   back inline. An earlier attempt set width plus transform: scale() here and
   tore the composer apart, because transform does not affect layout while the
   width override did.

   padding, border-radius and line-height are declared in em or as a
   multiplier, so at 16px they would inflate and change the field's
   proportions. All three are pinned to what they compute to at the CONFIGURED
   size, so the box keeps exactly the geometry it has today. line-height
   matters most of the three: it feeds the scrollHeight measurement above, so
   an unpinned one would change the auto-grow step. */

@media (max-width: 768px) and (pointer: coarse) {
  #ny-chatbot-container #ny-chat-input {
    /* Below 16px Safari zooms; at or above it, keep what the site chose. */
    font-size: max(16px, var(--ny-input-fs-mobile, 14px));

    /* Geometry pinned to the CONFIGURED size, not the 16px above. */
    padding: calc(var(--ny-input-fs-mobile, 14px) * 0.65)
             calc(var(--ny-input-fs-mobile, 14px) * 1.1);
    border-radius: calc(var(--ny-input-fs-mobile, 14px) * 1.2);
    line-height: calc(var(--ny-input-fs-mobile, 14px) * 1.5);
  }

  /* The prompt keeps the size it was designed at, so nothing about the
     resting field changes. */
  #ny-chatbot-container #ny-chat-input::placeholder {
    font-size: var(--ny-input-fs-mobile, 14px);
  }

  /* The two overlay fields, same reasoning. Their placeholders drive the
     floating-label :placeholder-shown rules in prechat.css / handoff.css, so
     only the size is set here and that selector logic is left alone. */
  #ny-chatbot-container #ny-prechat-overlay input.ny-prechat-input,
  #ny-chatbot-container #ny-handoff-overlay .ny-handoff-input {
    font-size: 16px;
    line-height: 17px;
  }

  #ny-chatbot-container #ny-prechat-overlay input.ny-prechat-input::placeholder,
  #ny-chatbot-container #ny-handoff-overlay .ny-handoff-input::placeholder {
    font-size: 12.5px;
  }
}