/* Liv Asistan (chatbot). rem ölçeği sitenin geneliyle aynı: masaüstünde 1rem = 1/1440, mobilde 1/360 ekran genişliği. */
.liv-chatbot {
  --lcb-primary: #057DAB;
  --lcb-primary-dark: #04668c;
  --lcb-accent: #f37b54;
  --lcb-bg: #f4f8fb;
  --lcb-border: #dde6ee;
  --lcb-text: #1f2a37;
  --lcb-muted: #6b7785;
  --lcb-error-bg: #fdf0ec;
  --lcb-error-text: #b2462a;
  font-family: inherit;
  color: var(--lcb-text);
}

.liv-chatbot [hidden] {
  display: none !important;
}

.liv-chatbot button {
  font-family: inherit;
}

/* ---------- Yüzen buton ---------- */
.liv-chatbot-fab {
  position: fixed;
  right: 20rem;
  bottom: 50rem;
  width: 64rem;
  height: 64rem;
  border: 0;
  border-radius: 50%;
  background: var(--lcb-primary);
  color: #fff;
  box-shadow: 0 6rem 18rem rgba(5, 125, 171, .35);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10000000;
  transition: background-color .2s ease, transform .2s ease;
}

.liv-chatbot--stacked .liv-chatbot-fab {
  bottom: 132rem;
}

.liv-chatbot-fab:hover {
  background: var(--lcb-primary-dark);
  transform: scale(1.05);
}



.liv-chatbot-fab svg {
  width: 34rem;
  height: 34rem;
}

.liv-chatbot.is-open .liv-chatbot-fab {
  display: none;
}

/* ---------- Giriş modalı ---------- */
.liv-chatbot-modal {
  position: fixed;
  inset: 0;
  z-index: 10000010;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  padding: 16rem;
  bottom: 100rem;
}

.liv-chatbot-modal-overlay {
  position: absolute;
  inset: 0;
 /* background: rgba(15, 30, 45, .45);*/
}

.liv-chatbot-modal-box {
  position: relative;
  width: 420rem;
  max-width: 100%;
  background: #fff;
  border-radius: 16rem;
  padding: 32rem 28rem 28rem;
  text-align: center;
  box-shadow: 0 12rem 40rem rgba(0, 0, 0, .2);
}

.liv-chatbot-modal-close {
  position: absolute;
  top: 10rem;
  right: 12rem;
  width: 32rem;
  height: 32rem;
  border: 0;
  background: transparent;
  color: var(--lcb-muted);
  font-size: 18rem;
  cursor: pointer;
}

[dir="rtl"] .liv-chatbot-modal-close {
  right: auto;
  left: 12rem;
}

.liv-chatbot-modal-icon {
  width: 56rem;
  height: 56rem;
 /* margin: 0 auto 12rem;*/
  border-radius: 50%;
  background: var(--lcb-primary);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.liv-chatbot-modal-icon svg {
  width: 30rem;
  height: 30rem;
}

.liv-chatbot-modal-title {
  font-size: 24rem;
  font-weight: 600;
  color: var(--lcb-primary);
  margin-bottom: 8rem;
  text-align:left;
}

.liv-chatbot-modal-box p {
  font-size: 15rem;
  line-height: 1.5;
  margin: 0 0 22rem;
  color: var(--lcb-text);
  text-align: left;
}

.liv-chatbot-modal-actions {
  display: flex;
  gap: 10rem;
  justify-content: center;
  flex-wrap: wrap;
}

.liv-chatbot-btn-primary,
.liv-chatbot-btn-secondary {
  min-width: 140rem;
  padding: 11rem 20rem;
  border-radius: 24rem;
  font-size: 15rem;
  font-weight: 600;
  text-decoration: none;
  border: 1rem solid var(--lcb-primary);
}

.liv-chatbot-btn-primary {
  background: var(--lcb-primary);
  color: #fff;
}

.liv-chatbot-btn-primary:hover {
  background: var(--lcb-primary-dark);
  color: #fff;
}

.liv-chatbot-btn-secondary {
  background: #fff;
  color: var(--lcb-primary) !important;
}

.liv-chatbot-btn-secondary:hover {
  background: var(--lcb-bg);
  color: var(--lcb-primary);
}

/* ---------- Panel ---------- */
.liv-chatbot-panel {
  position: fixed;
  right: 20rem;
  bottom: 60rem;
  width: 400rem;
  height: 620rem;
  max-height: calc(100vh - 160rem);
  background: #fff;
  border-radius: 16rem;
  box-shadow: 0 12rem 40rem rgba(0, 0, 0, .22);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  z-index: 10000010;
}

[dir="rtl"] .liv-chatbot-panel,
[dir="rtl"] .liv-chatbot-fab {
  right: auto;
  left: 20rem;
}

.liv-chatbot-header {
  display: flex;
  align-items: center;
  gap: 8rem;
  padding: 12rem 12rem;
  background: var(--lcb-primary);
  color: #fff;
  flex-shrink: 0;
}

.liv-chatbot-header-btn {
  width: 36rem;
  height: 36rem;
  flex-shrink: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.liv-chatbot-header-btn:hover {
  background: rgba(255, 255, 255, .15);
}

.liv-chatbot-header-btn svg {
  width: 22rem;
  height: 22rem;
}

.liv-chatbot-header-btn .liv-chatbot-icon-back,
.liv-chatbot-header-btn.is-back .liv-chatbot-icon-history {
  display: none;
}

.liv-chatbot-header-btn.is-back .liv-chatbot-icon-back {
  display: block;
}

[dir="rtl"] .liv-chatbot-icon-back {
  transform: scaleX(-1);
}

.liv-chatbot-header-title {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8rem;
  font-size: 16rem;
  font-weight: 600;
}

.liv-chatbot-header-title span:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.liv-chatbot-avatar {
  width: 30rem;
  height: 30rem;
  flex-shrink: 0;
  border-radius: 50%;
  background: #fff;
  color: var(--lcb-primary);
  display: flex;
  align-items: center;
  justify-content: center;
}

.liv-chatbot-avatar svg {
  width: 18rem;
  height: 18rem;
}

.liv-chatbot-view {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--lcb-bg);
}

/* ---------- Mesajlar ---------- */
.liv-chatbot-messages {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 16rem 14rem;
  display: flex;
  flex-direction: column;
  gap: 8rem;
  overscroll-behavior: contain;
}

.liv-chatbot-msg {
  max-width: 85%;
  padding: 10rem 13rem;
  border-radius: 14rem;
  font-size: 14rem;
  line-height: 1.5;
  white-space: pre-line;
  overflow-wrap: anywhere;
}

.liv-chatbot-msg--bot {
  align-self: flex-start;
  background: #fff;
  border: 1rem solid var(--lcb-border);
  border-end-start-radius: 4rem;
}

.liv-chatbot-msg--user {
  align-self: flex-end;
  background: var(--lcb-primary);
  color: #fff;
  border-end-end-radius: 4rem;
}

.liv-chatbot-msg--error {
  align-self: flex-start;
  background: var(--lcb-error-bg);
  color: var(--lcb-error-text);
  border: 1rem solid #f6d3c7;
  border-end-start-radius: 4rem;
}

.liv-chatbot-msg--typing {
  display: inline-flex;
  align-items: center;
  gap: 8rem;
  color: var(--lcb-muted);
}

.liv-chatbot-dots {
  display: inline-flex;
  gap: 3rem;
}

.liv-chatbot-dots i {
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  background: var(--lcb-muted);
  animation: liv-chatbot-dot 1.2s infinite ease-in-out;
}

.liv-chatbot-dots i:nth-child(2) { animation-delay: .15s; }
.liv-chatbot-dots i:nth-child(3) { animation-delay: .3s; }

@keyframes liv-chatbot-dot {
  0%, 80%, 100% { opacity: .3; transform: translateY(0); }
  40% { opacity: 1; transform: translateY(-3rem); }
}

.liv-chatbot-options {
  display: flex;
  flex-wrap: wrap;
  gap: 6rem;
}

.liv-chatbot-option {
  border: 1rem solid var(--lcb-primary);
  background: #fff;
  color: var(--lcb-primary);
  border-radius: 18rem;
  padding: 7rem 13rem;
  font-size: 13rem;
  line-height: 1.3;
  cursor: pointer;
  text-align: start;
}

.liv-chatbot-option:hover:not(:disabled) {
  background: var(--lcb-primary);
  color: #fff;
}

.liv-chatbot-option:disabled {
  opacity: .5;
  cursor: default;
}

/* ---------- Mesaj alanı ---------- */
.liv-chatbot-footer {
  display: flex;
  align-items: flex-end;
  gap: 8rem;
  margin: 0;
  padding: 10rem 12rem;
  border-top: 1rem solid var(--lcb-border);
  background: #fff;
  flex-shrink: 0;
}

.liv-chatbot-footer textarea {
  flex: 1;
  min-width: 0;
  resize: none;
  border: 1rem solid var(--lcb-border);
  border-radius: 20rem;
  padding: 9rem 14rem;
  font-family: inherit;
  font-size: 14rem;
  line-height: 1.4;
  max-height: 120rem;
      min-height: 40rem;
  outline: none;
  background: #fff;
  color: var(--lcb-text);
}

.liv-chatbot-footer textarea:focus {
  border-color: var(--lcb-primary);
}

.liv-chatbot-footer textarea:disabled {
  background: #f1f3f5;
  cursor: not-allowed;
}

.liv-chatbot-footer button {
  flex-shrink: 0;
  border: 0;
  border-radius: 20rem;
  padding: 10rem 18rem;
  background: var(--lcb-accent);
  color: #fff;
  font-size: 14rem;
  font-weight: 600;
  cursor: pointer;
}

.liv-chatbot-footer button:disabled {
  opacity: .5;
  cursor: default;
}

/* ---------- Geçmiş ---------- */
.liv-chatbot-search {
  padding: 12rem;
  background: #fff;
  border-bottom: 1rem solid var(--lcb-border);
  flex-shrink: 0;
}

.liv-chatbot-search input {
  width: 100%;
  border: 1rem solid var(--lcb-border);
  border-radius: 20rem;
  padding: 9rem 14rem;
  font-size: 14rem;
  outline: none;
}

.liv-chatbot-search input:focus {
  border-color: var(--lcb-primary);
}

.liv-chatbot-history-list {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.liv-chatbot-history-items {
  list-style: none;
  margin: 0;
  padding: 0;
}

.liv-chatbot-history-item {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 3rem;
  padding: 12rem 16rem;
  border: 0;
  border-bottom: 1rem solid var(--lcb-border);
  background: #fff;
  text-align: start;
  cursor: pointer;
}

.liv-chatbot-history-item:hover {
  background: var(--lcb-bg);
}

.liv-chatbot-history-title {
  font-size: 14rem;
  color: var(--lcb-text);
}

.liv-chatbot-history-date {
  font-size: 12rem;
  color: var(--lcb-muted);
}

.liv-chatbot-info {
  padding: 24rem 16rem;
  text-align: center;
  font-size: 14rem;
  color: var(--lcb-muted);
}

.liv-chatbot-info--error {
  color: var(--lcb-error-text);
}

/* ---------- Mobil ---------- */
@media (max-width: 768px) {
  .liv-chatbot-fab {
    right: 12rem;
    bottom: 78rem;
    width: 56rem;
    height: 56rem;
  }

  .liv-chatbot--stacked .liv-chatbot-fab {
    bottom: 146rem;
  }

  .liv-chatbot-fab svg {
    width: 30rem;
    height: 30rem;
  }

  [dir="rtl"] .liv-chatbot-fab {
    right: auto;
    left: 12rem;
  }

  .liv-chatbot-panel,
  [dir="rtl"] .liv-chatbot-panel {
    top: 0;
    left: 0;
    right: 0;
    bottom: auto;
    width: 100%;
    height: 100vh;
    height: 100dvh;
    max-height: none;
    border-radius: 0;
    padding-top: 90rem;
  }

  .liv-chatbot-header-title,
  .liv-chatbot-msg,
  .liv-chatbot-history-title,
  .liv-chatbot-info,
  .liv-chatbot-btn-primary,
  .liv-chatbot-btn-secondary,
  .liv-chatbot-modal-box p {
    font-size: 15rem;
  }

  /* iOS'ta odaklanınca sayfanın yakınlaşmaması için en az 16px */
  .liv-chatbot-footer textarea,
  .liv-chatbot-search input {
    font-size: max(16px, 15rem);
  }

  .liv-chatbot-option {
    font-size: 14rem;
  }
}

html.liv-chatbot-lock,
html.liv-chatbot-lock body {
  overflow: hidden;
}