.elementor-812 .elementor-element.elementor-element-49332c7{--display:flex;--position:absolute;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;bottom:0px;}body:not(.rtl) .elementor-812 .elementor-element.elementor-element-49332c7{right:0px;}body.rtl .elementor-812 .elementor-element.elementor-element-49332c7{left:0px;}.elementor-812 .elementor-element.elementor-element-fbdef5e{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-812 .elementor-element.elementor-element-c16d15b{--display:flex;}@media(max-width:767px){.elementor-812 .elementor-element.elementor-element-49332c7{--min-height:100vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--margin-top:0vw;--margin-bottom:0vw;--margin-left:0vw;--margin-right:0vw;--padding-top:0vw;--padding-bottom:0vw;--padding-left:0vw;--padding-right:0vw;bottom:110px;}body:not(.rtl) .elementor-812 .elementor-element.elementor-element-49332c7{right:10px;}body.rtl .elementor-812 .elementor-element.elementor-element-49332c7{left:10px;}.elementor-812 .elementor-element.elementor-element-c16d15b{--min-height:100vh;}}/* Start custom CSS for container, class: .elementor-element-49332c7 */<style>
@media (max-width: 767px){
  .tiktok-live{
    width: 100%;
    max-width: 480px;
    margin: 0 auto;
    height: 92vh;          /* TikTok */
    background: #000;
    overflow: hidden;
  }

  .tiktok-live .wpstream_live_wrapper,
  .tiktok-live .wpstream_live_player,
  .tiktok-live .wpstream-player,
  .tiktok-live #wpstream_live_player{
    width: 100% !important;
    height: 100% !important;
  }

  .tiktok-live iframe,
  .tiktok-live video{
    width: 100% !important;
    height: 100% !important;
    display:block !important;
    border:0 !important;
  }

  .tiktok-live video{ object-fit: cover !important; }
}
</style>/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-f6c57fa */body, html {
  overflow-x: hidden !important;
}

/* Corrigir scroll Mobile */
@media (max-width: 786px){
  body, html { overflow-x: hidden !important; }
}

/* remover pontos */
ul { list-style: none; }

/* Botões Minha Conta */
.woocommerce-account .woocommerce-MyAccount-navigation li a{
  display:block;
  padding:10px 15px;
  border-radius:5px;
  text-align:center;
  color:#fff;
  background-color:#171717;
  text-decoration:none;
  transition:0.2s;
  margin-bottom:10px;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { background-color:#C9A24D; }
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover { background-color:#C9A24D; }

.woocommerce-order { padding: 50px; }

body {
  background:#000 !important;
  margin:0;
}

/* =========================================================
   TIKTOK STYLE (ESQUERDA) + AVATAR ESQUERDA + ONLINE NO TOPO
   ========================================================= */

/* ---- CONTAINER PRINCIPAL: canto esquerdo embaixo ---- */
.tlc-chat-container{
  position: fixed !important;
  left: 15px !important;
  right: auto !important;
  bottom: 80px !important;
  top: auto !important;

  width: 70% !important;
  max-width: 520px !important;
  height: 48vh !important;
  max-height: 420px !important;

  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-end !important;

  z-index: 999999 !important;
  background:none !important;
  border:none !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;

  /* permite clicar no input e no chat */
  pointer-events: none;
}

.tlc-chat-input-container,
.tlc-chat-messages{
  pointer-events: all;
}

/* ---- REMOVER "Chat ao Vivo" e qualquer coisa do header ---- */
.tlc-chat-header{
  display: none !important;
}

/* ---- CONTADOR (ONLINE) NO TOPO DA TELA (fixo) ---- */
.tlc-online-count{
  position: fixed !important;
  top: calc(15px + env(safe-area-inset-top)) !important;
  left: 15px !important;
  right: auto !important;
  bottom: auto !important;

  z-index: 10000000 !important;

  background: rgba(0,0,0,0.65) !important;
  padding: 6px 14px !important;
  border-radius: 999px !important;

  font-size: 12px !important;
  font-weight: 800 !important;
  color: #fff !important;

  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  border: 1px solid rgba(255,255,255,0.15) !important;

  pointer-events: none !important;
}

/* bolinha verde do online */
.tlc-online-indicator{
  width:7px !important;
  height:7px !important;
  background:#00ff88 !important;
  border-radius:50% !important;
  display:inline-block !important;
  margin-right: 6px !important;
  animation: tlcPulse 2s ease-in-out infinite;
}
@keyframes tlcPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.6; }
}

/* ---- ÁREA DE MENSAGENS: fade no topo (TikTok vibe) ---- */
.tlc-chat-messages{
  flex:1;
  overflow-y:auto;
  overflow-x:hidden;

  padding: 0 15px 10px 15px !important;
  background: transparent !important;

  display:flex;
  flex-direction:column;
  justify-content:flex-end;

  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,0.45) 20%, black 40%);
  mask-image: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,0.45) 20%, black 40%);

  scrollbar-width:none;
  -ms-overflow-style:none;
}
.tlc-chat-messages::-webkit-scrollbar{ display:none; }

/* ---- MENSAGEM: alinhada ESQUERDA ---- */
.tlc-message{
  display:flex !important;
  flex-direction: row !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;

  width: 75% !important;
  margin-left: 0 !important;
  margin-right: auto !important;
  margin-bottom: 10px !important;

  animation: tlcSlideLeft 0.25s ease-out;
}
@keyframes tlcSlideLeft{
  from{ opacity:0; transform: translateX(-18px); }
  to{ opacity:1; transform: translateX(0); }
}

/* ---- AVATAR: ESQUERDA (igual TikTok) ---- */
.tlc-message-avatar{
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;

  object-fit: cover !important;
  flex-shrink: 0 !important;

  order: 0 !important;
  margin-right: 8px !important;
  margin-left: 0 !important;

  border: 2px solid rgba(255,255,255,0.85) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.45) !important;
}

/* conteúdo do texto do lado direito do avatar */
.tlc-message-content{
  flex:1;
  order: 1 !important;
  text-align:left !important;
  min-width:0;
}

.tlc-message-header{
  display:flex;
  align-items:center;
  justify-content:flex-start !important;
  gap: 6px !important;
  margin-bottom: 2px !important;
}

/* nome */
.tlc-message-username{
  font-weight:800 !important;
  font-size: 13px !important;
  color:#00f5ff !important;
  text-shadow:
    0 0 12px rgba(0,245,255,0.75),
    0 2px 5px rgba(0,0,0,0.95) !important;
}

/* hora */
.tlc-message-time{
  font-size:10px !important;
  color: rgba(255,255,255,0.7) !important;
  text-shadow: 0 1px 3px rgba(0,0,0,0.9) !important;
}

/* texto (sem caixa, flutuando) */
.tlc-message-text{
  background:none !important;
  border:none !important;
  padding:0 !important;
  border-radius:0 !important;

  color:#fff !important;
  font-size: 14px !important;
  font-weight: 500 !important;

  text-align:left !important;
  line-height: 1.45 !important;

  text-shadow:
    0 2px 5px rgba(0,0,0,0.95),
    0 0 22px rgba(0,0,0,0.65),
    -1px -1px 0 rgba(0,0,0,0.45),
     1px -1px 0 rgba(0,0,0,0.45),
    -1px  1px 0 rgba(0,0,0,0.45),
     1px  1px 0 rgba(0,0,0,0.45) !important;
}

/* opcional: destaque quando for sua mensagem */
.tlc-message.tlc-message-own .tlc-message-username{
  color: #ffea00 !important;
  text-shadow:
    0 0 12px rgba(255,234,0,0.85),
    0 2px 5px rgba(0,0,0,0.95) !important;
}

/* ---- INPUT ---- */
.tlc-chat-input-container{
  padding: 10px 15px 12px 15px !important;
  background: rgba(0,0,0,0.55) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;

  border-top: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 18px 18px 14px 14px !important;
}

.tlc-chat-input{
  border-radius: 22px !important;
  background: rgba(255,255,255,0.10) !important;
  border: 1.5px solid rgba(255,255,255,0.20) !important;
  color: #fff !important;
}

.tlc-chat-input:focus{
  border-color: rgba(0,245,255,0.60) !important;
  box-shadow: 0 0 16px rgba(0,245,255,0.25) !important;
}

/* ---- MOBILE ---- */
@media (max-width: 768px){
  .tlc-chat-container{
    width: 88% !important;
    max-width: none !important;
    left: 10px !important;
    right: auto !important;
    bottom: 65px !important;
    height: 45vh !important;
  }
  .tlc-message{ width: 88% !important; }

  .tlc-online-count{
    left: 10px !important;
    top: calc(10px + env(safe-area-inset-top)) !important;
  }
}
/* ===== CORRIGIR LIVE APARECENDO SÓ EM UMA FAIXA (MOBILE) ===== */
html, body{
  height: 100% !important;
}

/* o wrapper da sua página de live */
.live-wrap{
  min-height: 100vh !important;
}

/* força o player/vídeo a ocupar a tela */
.live-wrap iframe,
.live-wrap video,
.live-wrap .wpstream-player,
.live-wrap .wpstream_player,
.live-wrap .wpstream-embed,
.live-wrap .wpstream_video,
.live-wrap .wpstream-video{
  width: 100% !important;
  height: 100vh !important;
  max-height: none !important;
  display: block !important;
}

/* se for tag <video>, garante que "preencha" sem deformar */
.live-wrap video{
  object-fit: cover !important; /* ou contain se preferir não cortar */
}
/* =====================================================
   AJUSTE FINAL: CONSEGUIR SUBIR E VER MENSAGENS ANTIGAS
   (cole no FINAL do seu CSS)
   ===================================================== */

/* 1) tira o "flex + justify-content:flex-end" que trava a rolagem */
.tlc-chat-messages{
  display: block !important;          /* em vez de flex */
  justify-content: unset !important;  /* remove cola no fundo */
  overflow-y: auto !important;
  overflow-x: hidden !important;

  /* se o fade estiver atrapalhando o toque/scroll, desativa */
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

/* 2) (opcional) se o container tiver algum bloqueio de toque */
.tlc-chat-container{ pointer-events: none !important; }
.tlc-chat-messages,
.tlc-chat-input-container{ pointer-events: auto !important; }
.tlc-chat-image{
  max-width: 180px;
  max-height: 250px;
  border-radius: 12px;
  margin-top: 5px;
  display: block;
  box-shadow: 0 4px 12px rgba(0,0,0,0.5);
}/* End custom CSS */
/* Start custom CSS */[wpstream_player id="681"]

[tiktok_live_chat room="live-123" height="600px" position="right"]
body.elementor-page-812 {
  height: 100vh !important;
  padding: 0 !important;
}

body.elementor-page-812 iframe,
body.elementor-page-812 video,
body.elementor-page-812 .wpstream_player {
  height: 100vh !important;
  width: 100% !important;
  object-fit: cover !important;
}/* End custom CSS */