:root {
  --cs-ink: #1a1a1a;
  --cs-muted: #6b6b6b;
  --cs-line: #e4e4e4;
  --cs-thumb: #ededed;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html {
  background: #fff;
  min-height: 100%;
  scrollbar-width: none;
}
html::-webkit-scrollbar { display: none; }

body {
  font-family: -apple-system, "SF Pro Text", "SF Pro Display", BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  letter-spacing: -0.24px;
  background: #fff;
  color: var(--cs-ink);
  -webkit-font-smoothing: antialiased;
  display: flex;
  justify-content: center;
  overflow-x: hidden;
  width: 100%;
}

.cs-phone {
  background: #fff;
  isolation: isolate;
  max-width: 430px;
  position: relative;
  width: 100%;
  z-index: 1;
}

.cs-screen { padding: 16px 18px 20px; }

.cs-screen__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
}
.cs-screen__title { font-size: 22px; font-weight: 800; letter-spacing: -0.02em; }

.cs-icon-btn {
  border: none;
  background: none;
  color: var(--cs-ink);
  cursor: pointer;
  padding: 4px;
  display: flex;
  appearance: none;
  -webkit-appearance: none;
  outline: none;
  -webkit-tap-highlight-color: transparent;
}

.cs-chat-card {
  background: #111;
  border-radius: 16px;
  padding: 18px;
  margin-bottom: 26px;
}
.cs-chat-card__title { font-size: 15px; font-weight: 700; color: #fff; margin-bottom: 4px; }
.cs-chat-card__sub { font-size: 13px; font-weight: 400; color: #c9c9ce; margin-bottom: 16px; }
.cs-chat-card__button {
  border: none;
  background: #fff;
  color: #111;
  border-radius: 999px;
  height: 40px;
  padding: 0 18px;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: -0.24px;
  font-family: inherit;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  outline: none;
  -webkit-tap-highlight-color: transparent;
}

.cs-section-label { font-size: 13px; font-weight: 400; color: var(--cs-muted); margin-bottom: 13px; }

.cs-faq-list { display: flex; flex-direction: column; margin-bottom: 26px; }
.cs-faq-item { border-bottom: 1px solid var(--cs-line); }
.cs-faq-item:last-child { border-bottom: none; }
.cs-faq-item summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 0;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.35;
  color: var(--cs-ink);
  -webkit-tap-highlight-color: transparent;
}
.cs-faq-item summary::-webkit-details-marker { display: none; }
.cs-faq-item summary .cs-faq-icon {
  flex-shrink: 0;
  font-size: 18px;
  font-weight: 400;
  color: var(--cs-muted);
  transition: transform 0.2s ease;
}
.cs-faq-item[open] summary .cs-faq-icon { transform: rotate(45deg); }
.cs-faq-item__answer {
  font-size: 13px;
  font-weight: 400;
  line-height: 1.55;
  color: var(--cs-muted);
  padding: 0 0 16px;
}


.cs-contact { margin-bottom: 4px; }
.cs-contact__label { font-size: 13px; font-weight: 400; color: var(--cs-muted); margin-bottom: 13px; }
.cs-contact__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 0;
  border-bottom: 1px solid var(--cs-line);
  text-decoration: none;
  color: var(--cs-ink);
  font-size: 14px;
  font-weight: 500;
  -webkit-tap-highlight-color: transparent;
}
.cs-contact__row:last-child { border-bottom: none; }
.cs-contact__value { color: var(--cs-muted); font-size: 13px; font-weight: 400; }

@media (hover: hover) and (pointer: fine) {
  html,
  body { background: #000; }

  body,
  .cs-phone { min-height: 100dvh; }
}


.cs-chat-screen {
  position: fixed;
  inset: 0;
  z-index: 500;
  display: flex;
  flex-direction: column;
  height: 100dvh;
  max-width: 430px;
  margin: 0 auto;
  background: #fff;
  padding: 0;
  /* the panel is a fixed frame: header and composer stay put, only the
     message list inside it scrolls */
  overflow: hidden;
  overscroll-behavior: none;
  touch-action: none;
}
.cs-chat-messages {
  touch-action: pan-y;
}
.cs-chat-screen[hidden] { display: none; }
.cs-chat-screen {
  /* soft neutral grey behind the pattern, so the room is not plain white */
  background-color: #f2f3f5;
  background-image: url("../../img/room-pattern.svg");
  background-repeat: repeat;
  background-size: 160px 160px;
}

.cs-loading-screen {
  background: #fff;
  inset: 0;
  margin: 0 auto;
  max-width: 430px;
  position: fixed;
  z-index: 900;
}
.cs-loading-screen[hidden] { display: none; }
html[data-cs-guest-entry="true"] .cs-loading-screen {
  display: none;
}

.cs-guest-intake {
  align-items: stretch;
  scrollbar-width: none;
  background: #fff;
  display: flex;
  flex-direction: column;
  inset: 0;
  justify-content: flex-start;
  margin: 0 auto;
  max-width: 430px;
  overflow-y: auto;
  padding: 24px 0 0;
  position: fixed;
  z-index: 700;
}
.cs-guest-intake::-webkit-scrollbar { display: none; }
.cs-guest-intake[hidden] { display: none; }
.cs-guest-intake__form {
  padding: 0 18px 32px;
}
/* blok Latest Products + footer mengisi lebar penuh panel */
.cs-guest-intake > [data-luxora-sections] {
  width: 100%;
}
.cs-guest-intake__close {
  align-items: center;
  height: 32px;
  justify-content: center;
  padding: 0;
  position: absolute;
  right: 18px;
  top: 16px;
  width: 32px;
}
.cs-guest-intake__form {
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  max-width: 430px;
  width: 100%;
}
.cs-guest-intake__error,
.cs-guest-intake__submit {
  margin-top: 17px;
}
.cs-guest-intake__form h1 {
  color: var(--cs-ink);
  font-size: 27px;
  letter-spacing: -0.025em;
  line-height: 1.15;
  margin-bottom: 8px;
}
.cs-guest-intake__desc {
  color: var(--cs-muted);
  font-size: 14px;
  line-height: 1.5;
  margin-bottom: 28px;
}
.cs-guest-intake__field {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.cs-guest-intake__form label {
  color: #303036;
  cursor: default;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.35;
  pointer-events: none;
  -webkit-tap-highlight-color: transparent;
  -webkit-user-select: none;
  user-select: none;
}
.cs-guest-intake__form input {
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: 0;
  border-bottom: 1px solid #d9dce1;
  border-radius: 0;
  caret-color: #111114;
  color: #111114;
  cursor: text;
  display: block;
  font-family: inherit;
  font-size: 14px;
  font-weight: 400;
  height: 46px;
  letter-spacing: 0;
  line-height: normal;
  min-height: 46px;
  outline: none;
  padding: 10px 0;
  width: 100%;
  -webkit-tap-highlight-color: transparent;
  transition: border-color 0.15s ease;
}
.cs-guest-intake__form input:focus,
.cs-guest-intake__field:focus-within input {
  border-bottom-color: #303034;
}
.cs-guest-intake__form input::placeholder {
  color: #8a919b;
  opacity: 1;
}
@media (hover: none) and (pointer: coarse) {
  .cs-guest-intake__form input {
    font-size: 16px;
  }
}
.cs-guest-intake__error {
  color: #dc2626;
  font-size: 12px;
  letter-spacing: 0;
  line-height: 1.45;
  margin: 4px 0 -3px;
  min-height: 18px;
}
.cs-guest-intake__submit {
  appearance: none;
  background: #111114;
  border: 0;
  border-radius: 999px;
  color: #fff;
  cursor: pointer;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  height: 46px;
  letter-spacing: 0;
  line-height: 1;
  transition: background-color 0.15s ease;
}
.cs-guest-intake__submit:hover {
  background: #000;
}
.cs-guest-intake__submit:disabled {
  cursor: wait;
  opacity: 0.55;
}
@media (max-width: 440px) {
  .cs-guest-intake {
    padding-top: 22px;
  }
}
/* samakan dengan halaman login/register di perangkat sentuh */
@media (hover: none) and (pointer: coarse) {
  html.cs-intake-open,
  html.cs-intake-open body {
    height: auto;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: auto;
    touch-action: auto;
  }
  html.cs-intake-open body {
    display: block;
    overscroll-behavior-y: auto;
  }
  html.cs-intake-open,
  html.cs-intake-open body,
  html.cs-intake-open .cs-phone,
  html.cs-intake-open .cs-guest-intake {
    min-height: 0;
  }
  html.cs-intake-open .cs-guest-intake {
    position: relative;
    inset: auto;
    height: auto;
    margin: 0 auto;
    overflow: visible;
  }
}
@media (max-height: 650px) {
  .cs-guest-intake {
    padding-top: 16px;
  }
}

.cs-chat-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 6px 58px 6px 18px;
  flex-shrink: 0;
  position: relative;
  /* solid white, so the wallpaper only shows behind the bubbles */
  background: #fff;
  z-index: 1;
}
.cs-chat-head > .cs-icon-btn {
  align-items: center;
  height: 32px;
  justify-content: center;
  padding: 0;
  position: absolute;
  right: 18px;
  /* centred on the header whatever its height, rather than a fixed offset */
  top: 50%;
  transform: translateY(-50%);
  width: 32px;
}
.cs-chat-head__info { min-width: 0; }
.cs-chat-head__identity {
  align-items: center;
  display: flex;
  gap: 10px;
  min-width: 0;
}
/* The letter behind the image is what shows if the avatar file is missing. */
.cs-chat-head__avatar {
  align-items: center;
  background: var(--cs-thumb);
  border-radius: 50%;
  color: var(--cs-muted);
  display: flex;
  flex-shrink: 0;
  font-size: 15px;
  font-weight: 600;
  height: 40px;
  justify-content: center;
  letter-spacing: 0.04em;
  overflow: hidden;
  position: relative;
  width: 40px;
}
.cs-chat-head__avatar img {
  height: 100%;
  left: 0;
  object-fit: cover;
  position: absolute;
  top: 0;
  width: 100%;
}
.cs-chat-head__info { min-width: 0; }
.cs-chat-head__name { font-size: 18px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.25; color: var(--cs-ink); }
.cs-chat-head__sub { font-size: 12px; font-weight: 400; line-height: 1.3; color: var(--cs-muted); }

.cs-chat-messages {
  flex: 1;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: transparent;
  /* hidden like every other scroller in the app */
  scrollbar-width: none;
}
.cs-chat-messages::-webkit-scrollbar { display: none; }

body.cs-modal-open {
  position: fixed;
  overflow: hidden;
  width: 100%;
}

.cs-msg {
  /* the message list is a flex column: without this, a long conversation
     squeezes the bubbles and clips tall images */
  flex-shrink: 0;
  max-width: 76%;
  padding: 7px 11px 6px;
  border-radius: 18px;
  font-size: 14.5px;
  font-weight: 400;
  line-height: 1.35;
  position: relative;
  width: fit-content;
  word-break: break-word;
  overflow-wrap: anywhere;
  /* keep the line breaks the sender typed */
  white-space: pre-wrap;
}
.cs-msg-agent {
  align-self: flex-start;
  background: #fff;
  color: var(--cs-ink);
  border-bottom-left-radius: 18px;
}
.cs-msg-user {
  align-self: flex-end;
  background: #111;
  color: #fff;
  border-bottom-right-radius: 18px;
}
/* ekor hanya pada pesan terakhir dari tiap kelompok */
.cs-msg-agent:not(:has(+ .cs-msg-agent)) {
  border-bottom-left-radius: 5px;
}
.cs-msg-user:not(:has(+ .cs-msg-user)) {
  border-bottom-right-radius: 5px;
}
/* rapatkan pesan berurutan dari pengirim yang sama */
.cs-msg-agent + .cs-msg-agent,
.cs-msg-user + .cs-msg-user {
  margin-top: -6px;
}
/* iOS may ignore .click() on a display:none file input, so hide it this way */
.cs-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.cs-msg-skeleton {
  border-radius: 18px;
  background: #e9e9ec;
  animation: cs-msg-pulse 1.2s ease-in-out infinite;
  /* the text is there so the browser measures the real size; it just must not
     be readable */
  color: transparent;
  user-select: none;
}

/* size comes from the stored aspect ratio, set inline when it is built */
.cs-msg-skeleton--image {
  max-width: 100%;
}
.cs-msg-skeleton.cs-msg-user {
  background: #dcdcdf;
}
@keyframes cs-msg-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.45; }
}

.cs-msg-notice {
  background: #fdecec;
  color: #b42318;
  font-size: 13px;
}

/* an image message is just the picture: no bubble colour around it, and no
   clipping — the rounded corners live on the image itself, so nothing here can
   cut a tall picture short */
.cs-msg-image {
  padding: 0;
  background: transparent;
  border-radius: 18px;
  height: auto;
  max-height: none;
  align-self: flex-end;
}
.cs-msg-image.cs-msg-agent {
  align-self: flex-start;
}
/* Reserve space while the picture is still downloading, instead of collapsing
   the bubble. A collapsed bubble let a later image that loaded first sit above
   an earlier one that was still coming, which then jumped down. Holding the
   slot keeps every picture in its correct place regardless of load order. */
.cs-msg-image--pending {
  min-height: 190px;
  width: 62%;
  max-width: 260px;
  background: rgba(0, 0, 0, 0.05);
  border-radius: 18px;
}
.cs-msg-image--pending img,
.cs-msg-image--pending .cs-msg-time {
  opacity: 0;
}
/* while the picture is uploading */
.cs-msg-image--sending img {
  opacity: 0.55;
}
.cs-msg-image--failed img {
  opacity: 0.45;
}
.cs-msg-image {
  position: relative;
}
.cs-msg-status {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
}
.cs-msg-status--spinner {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 2.5px solid rgba(255, 255, 255, 0.35);
  border-top-color: #fff;
  animation: cs-spin 0.7s linear infinite;
}
@keyframes cs-spin {
  to { transform: translate(-50%, -50%) rotate(360deg); }
}
.cs-msg-status--retry {
  background: rgba(0, 0, 0, 0.72);
  border-radius: 999px;
  color: #fff;
  cursor: pointer;
  font-size: 12px;
  font-weight: 500;
  padding: 6px 12px;
  white-space: nowrap;
}
.cs-msg-image img {
  display: block;
  /* Proportions are always preserved: width and height both follow the image
     itself, bounded by the bubble width and a ceiling on height so a tall
     screenshot does not take over the whole room. Tap to see it full size. */
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 340px;
  object-fit: contain;
  border-radius: 18px;
  cursor: pointer;
}

.cs-lightbox {
  position: fixed;
  inset: 0;
  z-index: 1000;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  /* stays centered inside the phone frame when it is narrowed on desktop */
  margin-inline: auto;
}
.cs-lightbox[hidden] { display: none; }
.cs-lightbox { overflow: hidden; touch-action: none; }
.cs-lightbox__img {
  max-width: 92%;
  max-height: 85%;
  border-radius: 8px;
  object-fit: contain;
  touch-action: none;
  will-change: transform;
  transform-origin: center center;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.18);
}
.cs-lightbox__img.cs-lightbox__img--panning { transition: none; }
.cs-lightbox__close {
  position: absolute;
  top: 18px;
  right: 18px;
  border: none;
  background: rgba(0, 0, 0, 0.06);
  color: #111114;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  outline: none;
  -webkit-tap-highlight-color: transparent;
}
.cs-msg-time {
  font-size: 10.5px;
  font-weight: 400;
  float: right;
  margin: 6px 0 -1px 10px;
  line-height: 1;
  white-space: nowrap;
  color: var(--cs-muted);
}
.cs-msg-user .cs-msg-time { color: rgba(255, 255, 255, 0.55); }
/* the timestamp carries its own colour, set further up, so hide it here —
   after those rules — while keeping it in the layout, because it decides where
   the last line wraps */
.cs-msg.cs-msg-skeleton .cs-msg-time,
.cs-msg.cs-msg-skeleton .cs-msg-body {
  color: transparent;
}
.cs-msg-image .cs-msg-time {
  position: absolute;
  right: 10px;
  bottom: 10px;
  float: none;
  margin: 0;
  padding: 2px 7px;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.45);
  color: #fff;
}

.cs-typing {
  align-self: flex-start;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 12px 14px;
  border-radius: 16px;
  border-bottom-left-radius: 4px;
  background: var(--cs-thumb);
}
.cs-typing span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #9a9a9a;
  animation: cs-typing-bounce 1s ease-in-out infinite;
}
.cs-typing span:nth-child(2) { animation-delay: 0.15s; }
.cs-typing span:nth-child(3) { animation-delay: 0.3s; }
@keyframes cs-typing-bounce {
  0%, 60%, 100% { transform: translateY(0); opacity: 0.5; }
  30% { transform: translateY(-3px); opacity: 1; }
}

/* Swipe-to-reply */
.cs-msg {
  touch-action: pan-y;
}
.cs-msg--swiping {
  transition: none;
}
.cs-msg--released {
  transition: transform 0.18s ease;
}
.cs-msg__reply-hint {
  position: absolute;
  top: 50%;
  left: -34px;
  width: 24px;
  height: 24px;
  transform: translateY(-50%);
  opacity: 0;
  color: var(--cs-muted);
  pointer-events: none;
}
.cs-msg--swiping .cs-msg__reply-hint {
  opacity: 1;
}

/* The bar above the composer showing what is being replied to */
.cs-reply-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 18px 0;
  background: #fff;
  z-index: 1;
}
.cs-reply-bar[hidden] {
  display: none;
}
.cs-reply-bar__body {
  flex: 1;
  min-width: 0;
  position: relative;
  padding: 2px 0 2px 13px;
}
/* rounded accent bar (a plain border-left cannot take a radius) */
.cs-reply-bar__body::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1px;
  bottom: 1px;
  width: 3px;
  border-radius: 3px;
  background: #111114;
}
.cs-reply-bar__who {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--cs-ink);
}
.cs-reply-bar__text {
  display: block;
  font-size: 12.5px;
  color: var(--cs-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cs-reply-bar__close {
  flex-shrink: 0;
}

/* A quote shown inside a message that is a reply */
.cs-msg__quote {
  display: block;
  position: relative;
  opacity: 0.75;
  padding-left: 11px;
  margin-bottom: 4px;
  font-size: 12.5px;
  line-height: 1.35;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* the accent bar, as its own rounded element so it can have a radius
   (a plain border-left cannot) */
.cs-msg__quote::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1px;
  bottom: 1px;
  width: 3px;
  border-radius: 3px;
  background: currentColor;
}

.cs-chat-composer {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  padding: 10px 18px;
  flex-shrink: 0;
  background: #fff;
  z-index: 1;
  touch-action: none;
}
.cs-chat-composer__input {
  flex: 1;
  border: none;
  /* same tone as the chat background */
  background: #f2f3f5;
  border-radius: 14px;
  padding: 5px 16px;
  font-size: 16px;
  font-family: inherit;
  line-height: 1.35;
  color: var(--cs-ink);
  outline: none;
  resize: none;
  overflow-y: auto;
  max-height: 120px;
  min-height: 32px;
  appearance: none;
  -webkit-appearance: none;
  scrollbar-width: none;
  /* no grey flash when the box is tapped */
  -webkit-tap-highlight-color: transparent;
  /* keep a swipe inside the box: when it holds no text there is nothing to
     scroll, and the gesture would otherwise move the page behind the panel */
  touch-action: pan-y;
  overscroll-behavior: contain;
}
.cs-chat-composer__input:focus,
.cs-chat-composer__input:focus-visible {
  outline: none;
  box-shadow: none;
}
.cs-chat-composer__input::-webkit-scrollbar { display: none; }
.cs-chat-composer__input::placeholder {
  color: #9a9a9a;
  transition: opacity 0.15s ease;
}
/* the hint disappears the moment the box is tapped */
.cs-chat-composer__input:focus::placeholder {
  opacity: 0;
}
.cs-chat-composer__attach {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: none;
  background: transparent;
  color: var(--cs-muted);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  outline: none;
  -webkit-tap-highlight-color: transparent;
}
.cs-chat-composer__attach:hover,
.cs-chat-composer__attach:active { background: var(--cs-thumb); }
.cs-chat-composer__send {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: none;
  background: #111;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  outline: none;
  -webkit-tap-highlight-color: transparent;
}
.cs-chat-composer__send:disabled { opacity: 0.4; cursor: not-allowed; }
/* The buttons look 32px but a finger needs about 44px to hit reliably, so both
   grow an invisible touch area around themselves. */
.cs-chat-composer__send,
.cs-chat-composer__attach {
  position: relative;
}
.cs-chat-composer__send::after,
.cs-chat-composer__attach::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 44px;
  height: 44px;
  transform: translate(-50%, -50%);
}
/* Empty box: the plane sits level. Once there is text it tips into its
   natural SF Symbols angle. */
/* The glyph's centre of mass sits up and to the right of its box, so each
   state is nudged back to look centred inside the circle. */
.cs-chat-composer__send svg {
  transform: translate(-1.74px, 0) rotate(45deg);
  transition: transform 0.22s cubic-bezier(0.32, 0.72, 0, 1);
}
.cs-chat-composer.has-text .cs-chat-composer__send svg {
  transform: translate(-1.35px, 1.39px) rotate(0deg);
}

/* halaman chat: tanpa pembatas abu-abu di atas Latest Products */
[data-luxora-sections] .featured-products-section {
  border-top: 0;
}

/* Footer di bawah tombol "Continue to chat": satu jalan pintas untuk yang
   sudah punya akun, lalu baris legal. Tidak ada ajakan mendaftar — layar ini
   memang untuk tamu, dan chat di sini tidak butuh akun. */
.cs-guest-intake__account {
  color: #6b7280;
  font-size: 13px;
  letter-spacing: 0;
  margin: 18px 0 0;
  text-align: center;
}
.cs-guest-intake__account a {
  color: #111114;
  font-weight: 600;
  text-decoration: none;
  text-underline-offset: 3px;
  -webkit-tap-highlight-color: transparent;
}
.cs-guest-intake__protected {
  color: #9096a0;
  font-size: 11px;
  letter-spacing: 0;
  line-height: 1.5;
  margin: 20px 0 0;
  text-align: center;
}
.cs-guest-intake__protected a {
  color: #6b7280;
  font-weight: 500;
  text-decoration: none;
  text-underline-offset: 3px;
  -webkit-tap-highlight-color: transparent;
}
@media (hover: hover) and (pointer: fine) {
  .cs-guest-intake__account a:hover,
  .cs-guest-intake__protected a:hover {
    color: #111114;
    text-decoration: underline;
  }
}