Árvore de páginas

Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.
HTML


<style>
#title-text {
    display: none !important;
  }
  .compositiondani-banner {
    width: 100%; /* Garante que o banner ocupe toda a largura */
    min-height: 220px; /* Altura mínima para manter aspecto visual */
    border-radius: 5px;
    overflow: hidden;
    position: relative; /* Posição relativa para que o conteúdo absoluto se posicione corretamente */
    margin-bottom: 5px; /* Ajuste conforme necessário */
}

.compositiondani-banner-image {
    background-image: url("https://totvscrm.com/wp-content/uploads/2024/04/capa-com-fundo-e-sem-icone-TDN-AZUL2.png");
    background-size: cover;
    background-position: center; /* Centraliza a imagem de fundo */
    min-height: 100%; /* Garante que a altura do background cubra a área */
    width: 100%;
    position: absolute; /* Posicionamento absoluto para cobrir toda a área do banner */
}

  .compositiondani-banner-overlay {
    min-height: inherit;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    pointer-events: none;
  }

  .compositiondani-banner-logo-container {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 50%;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, -50%);
  }

  .compositiondani-banner-logo {
    width: 350px;
    height: 180px;
    background-image: url("https://totvscrm.com/wp-content/uploads/2023/09/logo-com-descricao-totvsgc.png");
    background-size: contain;
    background-repeat: no-repeat;
  }

  .compositiondani-banner-content {
    position: absolute;
    padding: 30px;
    max-width: 60%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
    color: white;
    text-align: center;
  }

  .compositiondani-banner-title {
    margin-bottom: 10px !important;
    padding: 10px !important;
    background: rgba(0, 0, 0, 0.5) !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    font-size: 12px !important;
    line-height: 1.3 !important;
    max-height: 133px !important;
    font-family: "Roboto", sans-serif !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    color: #ffffff !important;
    position: relative !important;
    margin-top: 130px !important;
    border-radius: 10px !important;
  }
</style>


<style>


*, ::after, ::before {
  box-sizing: inherit;
}

textarea {
  margin: 0;
  overflow: auto;
  vertical-align: top;
}

.container {
  display: flex;
  justify-content: space-between;
}

.container .articles {
  flex: 1;
  padding: 20px;
}

.container .faq-container {
  flex: 1;
  padding: 20px;
}

.inherited-styles-for-exported-element {
  box-sizing: border-box;
  color: #494440;
  font-family:  Lato, sans-serif;
  font-size6pxsize: 16px;
  font-weight: 400;
  line-height: 26px;
}



ul {
  padding-left: 0;
}

ol, ul {
  color: #5d5d5e;
}

a {
  background-color: initial;
  background-position: 0 0;
  color: #1264a3;
  text-decoration: none;
}

h1, h5 {
  color: #1d1c1d;
}

h1, h2, h3, h5 {
  font-family: lato, sans-serif;
}

p {
  font-size: 16px;
  line-height: 26px;
}



b, strong {
  font-weight: 700;
}

h1 {
  margin-left: 0;
  margin-right: 0;
}

button, input, textarea {
  font-family: inherit;
  font-feature-settings: inherit;
  font-kerning: inherit;
  font-optical-sizing: inherit;
  font-size6px;
  font-stretch: inherit;
  font-style: inherit;
  font-variant: inherit;
  font-variant-position: inherit;
  font-variation-settings: inherit;
  font-weight: inherit;
}

input {
  color: inherit;
  line-height: normal;
  margin: 0;
}

button {
  appearance: none;
  background-color: initial;
  background-position: 0 0;
  border-radius: 4px;
  line-height: inherit;
  overflow: visible;
  text-align: center;
  text-decoration: none;
  text-transform: none;
}

.breadcrumbs {
  display: inline-block;
  list-style: none;
  margin: 0 1px 0 0;
  padding: 0;
}

:focus {
  outline: 2px dotted #611f69;
  outline-offset: 5px;
}

.ts_icon {
  text-indent: 0;
}

.article_page {
  padding-bottom: 50px;
  position: relative;
}

.article-vote {
  border-bottom: 1px solid #ddd;
  border-top: 1px solid #ddd;
  padding: 35px 0 45px;
}


.section-list {
  margin: 0;
  min-width: 217px;
}

.section_list_container {
    position: relative; /* Isso garante que o z-index possa ser aplicado corretamente */
    z-index: 1; /* Menor z-index para que fique abaixo do banner */
    margin-top: 250px; /* Ajuste conforme necessário para empurrar a seção para baixo do banner */
}



.ts_icon_happy_smile::before {
  content: "";
}

.ts_icon_check_circle_o_large::before {
  content: "";
}

.ts_icon_warning::before {
  content: "";
}

a:focus {
  outline: thin dotted;
}

.article_page .article_body a[href], a:hover {
  text-decoration: underline;
}

.breadcrumbs li {
  color: #7d7d7d;
  display: inline-block;
  font-size: 16px;
  line-height: 20px;
}



a:active, a:hover {
  outline: 0;
}

input[type=radio] {
  box-sizing: border-box;
  padding: 0;
}

.ts_icon::after, .ts_icon::before {
  display: inline-block;
  font-family: "Slack v2";
  font-size: 20px;
  font-weight: 400;
}

.section-list li {
  font-size6px;
  line-height: 26px;
  list-style: none;
}



.breadcrumbs li::before {
  color: #cacaca;
  content: ">";
  padding: 0 4px;
}

.section-list li a {
  border: 1px solid transparent;
  border-radius: 4px;
  color: #1d1c1d;
  display: block;
  font-size: 16px;
  line-height: 18px;
  margin-bottom: 4px;
  padding: 5px 10px 6px;
  text-decoration: none;
}

.article_page .article_container {
  display: block;
  flex-wrap: wrap;
  font-size6px;
  line-height: 26px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 10px;
  padding-right: 10px;
}

.article_page .article_breadcrumbs_container {
  display: block;
  flex-wrap: wrap;
  margin-left: auto;
  margin-right: auto;
  max-width: 960px;
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 30px;
  visibility: hidden;
}

.article_page .article_title {
  flex-basis: 100%;
  font-size: 32px;
  font-weight: 700;
  line-height: 36px;
  margin-bottom: 30px;
  margin-top: 30px;
  padding-left: 10px;
  padding-right: 10px;
}

.article_page .article_breadcrumb_title {
  color: #868686;
  display: none;
  font-size: 15px;
}

.article_page .article_body {
  padding-bottom: 50px;
  padding-left: 10px;
  padding-right: 10px;
  width: 100%;
}

.article_page .article_footer {
  flex-basis: 100%;
  padding-left: 10px;
  padding-right: 10px;
}

.article-vote .article-vote-question {
  display: block;
  font-weight: 700;
  margin-bottom: 25px;
  opacity: 0;
  text-align: center;
}

.article-vote .article-vote-controls {
  justify-content: center;
  text-align: center;
}

.article-vote .article-feedback-form {
  display: none;
  text-align: right;
}

.article-vote .vote-err {
  font-size: 13.3333px;
  margin-bottom: 0;
}

.article-vote .feedback-thanks, .article-vote .vote-err, .article-vote .vote-thanks {
  display: none;
  text-align: center;
}

.article-vote .article-send-feedback, .article-vote .article-vote-down, .article-vote .article-vote-up {
  background-clip: padding-box;
  border-radius: 6px;
  border-style: solid;
  border-width: 2px;
  cursor: pointer;
  height: 44px;
  text-decoration: none;
}

.article-vote .article-vote-down, .article-vote .article-vote-up {
  border-color: #007a5a;
  color: #007a5a;
  margin: 0 10px;
  min-width: 125px;
}

.article-vote .article-button-text {
  display: block;
  height: 100%;
  padding: 7px 16px;
  text-align: center;
  width: 100%;
}

.article-vote .article-send-feedback {
  border-color: #868686;
  color: #868686;
  display: inline-block;
  margin: 20px 0 0 10px;
  min-width: 180px;
  padding: 0 12px;
}

.article-vote .get-support {
  text-align: left;
}

.article-vote .article-feedback-drive {
  padding-bottom: 20px;
  text-align: left;
}


  .article-vote .article-vote-down,   .article-vote .article-vote-up {
    width: 42%;
  }



.nav_scroll.stick {
  flex: 0 0 auto;
  max-height: 75vh;
  position: fixed;
}



.article_body section, .article_page #cat_list, .section-list .close {
  display: none;
}

.option:focus {
  outline: thin dotted #611f69;
}

.article_page .article_breadcrumb_title::before {
  color: #ddd;
  content: ">";
  padding: 0 3px;
}

.article_page .article_body p {
  margin-bottom: 12px;
  margin-top: 0;
}

.article_page .article_body ul {
  color: inherit;
  padding-left: 30px;
}

.article_page .article_body li {
  line-height: 24px;
  margin-bottom: 10px;
}

.article_page .article_body h2 {
  border-bottom: 1px solid #ddd;
  color: #1d1c1d;
  display: block;
  font-size: 22px;
  font-weight: 700;
  line-height: 27px;
  margin-bottom: 20px;
  padding-bottom: 10px;
}

.article_page .article_body h3 {
  color: #1d1c1d;
  display: block;
  font-size: 20px;
  font-weight: 700;
  line-height: 25px;
  margin-bottom: 20px;
  margin-top: 20px;
}

.article_page .article_body section {
  margin-top: -1px;
  padding: 30px;
}

.article-vote .article-vote-question::before {
  background-clip: padding-box;
  border-radius: 50%;
  content: "";
  display: inline-block;
  font-family: "Slack v2";
  font-size: 20px;
  font-weight: 400;
  height: 25px;
  margin-bottom: 1px;
  margin-right: 2px;
  vertical-align: bottom;
  width: 25px;
}

.article-vote .article-vote-controls a {
  display: inline-block;
}

.article-vote .article-feedback-form textarea {
  background-clip: padding-box;
  border: 1px solid #ddd;
  border-radius: 6px;
  color: inherit;
  line-height: 24px;
  padding: 10px;
  transition: all 160ms;
  width: 100%;
}

.article-vote .vote-err i {
  font-size: 20px;
  vertical-align: middle;
}

.article-vote .feedback-thanks p, .article-vote .vote-thanks p {
  margin-bottom: 25px;
  margin-top: 3px;
}

.article-vote .feedback-thanks i, .article-vote .vote-thanks i {
  vertical-align: middle;
}

.article-vote .article-feedback-drive label {
  cursor: pointer;
  display: flex;
}

.article-vote .article-feedback-drive input {
  margin-right: 10px;
  margin-top: 7px;
}

.breadcrumbs li:first-child::before {
  content: none;
  padding: 0;
}

.section-list li a.active, .section-list li a:hover {
  background-color: #ebf6fd;
  border: 1px solid #dcf0fb;
}

.section-list li a.active {
  background-color: #0897E9;
  border-color: transparent;
  color: #fff;
  font-weight: 700;
  line-height: 22px;
  padding: 3px 10px 4px;
  text-shadow: rgba(0, 0, 0, .1) 0 1px 0;
}

.article_page.has_sidenav .article_container {
  max-width: 960px;
  width: 100%;
}

.article_page .article_body .side_by_side {
  overflow: hidden;
  text-align: center;
}

.article_page .article_body .bug, .article_page .article_body .note, .article_page .article_body .tip {
  background-clip: padding-box;
  border-radius: 6px;
  border-style: solid;
  border-width: 1px;
  display: block;
  line-height: 1.5rem;
  margin-bottom: 18px;
  margin-top: 18px;
  padding: 12px 18px 12px 65px;
  position: relative;
  word-break: break-word;
}

.article_page .article_body .note {
  background-color: #f8f8f8;
  border-color: #363636;
}

.article_page .article_body .tip {
  background-color: #e8f5fa;
  border-color: #1d9bd1;
}

.article_page .article_body .bug {
  background-color: #fcf4da;
  border-color: #f2c744;
}

.article_page .article_body .tabs {
  margin-bottom6px;
}

.article_page .article_body .option {
  border: 1px solid transparent;
  color: #616061;
  cursor: pointer;
  display: inline-block;
  margin: 0;
  padding-bottom: 4px;
  padding-top: 5px;
}



.article-vote .article-vote-down:hover, .article-vote .article-vote-up:hover {
  background-color: #148567;
  border-color: #148567;
  color: #fff;
}

.article-vote .article-send-feedback:hover {
  background-color: #fff;
  border: 2px solid #868686;
  color: #868686;
}


.article_page .article_body .side_by_side>div {
  float: left;
  text-align: left;
  width: 49%;
}

.article_page .article_body .bug strong, .article_page .article_body .note strong, .article_page .article_body .tip strong {
  font-weight: 900;
}

.article_page .article_body .bug::before, .article_page .article_body .note::before, .article_page .article_body .tip::before {
  content: "";
  font-family: 'FontAwesome';
   font-size: 28px;
  font-weight: 300;
  height: 100%;
  left: 20px;
  position: absolute;
  vertical-align: middle;
}

.article_page .article_body .bug::before {
  top: 24%;
}

.article_page .article_body .note::before {
  font-family: 'FontAwesome'; /* Assegura que a fonte correta está sendo usada */
  color: #363636;
  content: "\f303"; /* Código Unicode para o ícone 'magic wand' da FontAwesome */
  font-size: 20px; /* Ou qualquer tamanho que você deseje */
}

.article_page .article_body .tip::before {
  font-family: 'FontAwesome'; /* Assegura que a fonte correta está sendo usada */
  content: "\e2ca"; /* Código Unicode para o ícone 'magic wand' da FontAwesome */
  color: #1d9bd1;
  font-size: 20px; /* Ou qualquer tamanho que você deseje */
}

.article_page .article_body .bug::before {
  font-family: 'FontAwesome'; /* Assegura que a fonte correta está sendo usada */
  color: #f2c744;
  content: "\f06a"; /* Código Unicode para o ícone 'magic wand' da FontAwesome */
  font-size: 20px; /* Ou qualquer tamanho que você deseje */
}

.article-vote .article-feedback-form textarea:focus {
  border: 1px solid #1d9bd1;
  outline: 0;
}

.article-vote .feedback-thanks p:nth-child(2), .article-vote .vote-thanks p:nth-child(2) {
  margin-bottom: 8px;
}

.article-vote .article-vote-down:hover::after, .article-vote .article-vote-up:hover::after {
  padding: 9px 0;
}

.article-vote .article-send-feedback:hover::after {
  padding: 7px 0;
}



.article_page .article_container .article_body ul li {
  font-size6px;
}

.article_page .article_body section ul:first-child {
  margin-top: 0;
}

.article_page .article_body section p:last-child, .article_page .article_body section ul li:last-child, .article_page .article_body section ul:last-child {
  margin-bottom: 0;
}

.article_body section.active {
  display: block;
}

.article_page.has_sidenav .article_container .content_col {
  display: table-cell;
}

.article_page.has_sidenav .article_container .category_list {
  display: table-cell;
  padding-left: 48px;
  padding-right: 10px;
  padding-top: 30px;
  vertical-align: top;
  width: 320px;
}

.article_page .article_body .option.large_tab {
  padding-left: 16px;
  padding-right: 16px;
}

.article_page .article_body .option.active {
  border: 1px solid;
  border-color: #ddd #ddd #fff;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  color: #1264a3;
}



  .article_page.has_sidenav .article_container .category_list {
    left: 0;
    padding: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 3;
  }

  .article_page.has_sidenav .article_container .article_breadcrumbs {
    display: none;
  }


.article_page .article_breadcrumbs_container .breadcrumbs li:nth-child(3) {
  display: inline-block;
}

.article_page .article_body .side_by_side>div:first-child {
  margin-right: 2%;
}

.article_page .article_body .side_by_side>div:last-child {
  float: right;
}

.article_page .article_body .tip.singleline::before {
  top: 11px;
}

.article_page .article_body .note.singleline::before {
  top: 12px;
}

.article_page .article_body .tabs.enclosed section {
  border: 1px solid #ddd;
  border-radius: 6px;
}



.article_page.has_sidenav .article_container .category_list .section_list_container {
  box-shadow: rgba(0, 0, 0, .1) 0 1px 20px;
  border: 1px solid #0897E9;
  margin-bottom: 20px;
  padding: 16px 13px 13px;
}

.article_page .article_body .option:not(.active):hover {
  color: #616061;
}

.article_page.has_sidenav .article_container .category_list .section_list_container h5 {
  font-size: 16px;
  margin: 0;
  padding: 0;
}

.article_page .article_body .tabs.enclosed section.first_content {
  border-top-left-radius: 0;
}

.article_page.has_sidenav .article_container .category_list .section_list_container .section-list {
  border-top: 1px solid #ebeaeb;
  padding-top: 8px;
}



  .article_page #nav_list {
    display: none;
  }

.article-vote .article-feedback-form #char_num {
  color: #868686;
  float: left;
  font-size: 16px;
}

* {
  backface-visibility: visible !important;
}



.article_page .article_body p:first-child {
  margin-top: 0 !important;
}


html {
  font-size6px;
  /* This is IMPORTANT since some copied values use "REM" units */
}

.tip i.fa {
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 28px;  /* Ajuste o tamanho conforme necessário */
}
.meu-conteudo-personalizado {

    min-height: 100vh;          /* Garante que o div ocupe pelo menos a altura total da tela */
    width: 100%;                /* Garante que o div ocupe toda a largura */
}

 /* TITULO */



.inherited-styles-for-exported-element {
  font-family: Lato, sans-serif;
  letter-spacing: 0;
  tab-size: 3;
}

body ::-webkit-scrollbar {
  height: 10px;
  width: 10px;
}

body ::-webkit-scrollbar-thumb {
  background-color: #a9a9a9;
}

body ::-webkit-scrollbar-thumb, body ::-webkit-scrollbar-thumb:hover {
  border-radius: 5px;
  transition: background-color .3s;
  transition-behavior: normal;
}

:focus {
  outline: 2px solid #4c9aff;
  outline-offset: 1px;
}

.display-h2 {
  font-size: 22px;
}


.display-h2 {
  line-height: 1.3;
}

p:first-child {
  margin-top: 0;
}

body ::-webkit-scrollbar-thumb:hover {
  background-color: gray;
}

html:not(.aui-no-focusvisible) :focus-visible {
  box-shadow: 0 0 0 2px #4c9aff;
  outline: 0;
}

.font-weight-bold strong, strong {
  font-weight: bolder;
}

html:not(.aui-no-focusvisible) :focus:not(:focus-visible) {
  outline: unset unset unset;
  outline-offset: unset;
}

.mb-4 {
  margin-bottom: 1.5rem !important;
}

.font-weight-bold {
  font-weight: 700 !important;
}

.text-dark {
  color: #363636 !important;
}

.text-blue {
  color: #0897e9 !important;
}

.text-center {
  text-align: center !important;
}

.text-uppercase {
  text-transform: uppercase !important;
}

  /* TITULO */
  /* LIST BALL BLUE */


strong {
  font-weight: 700;
}

:focus {
  outline: 2px dotted #611f69;
  outline-offset: 5px;
}

.ts_icon, li kbd {
  text-indent: 0;
}



.ts_icon_buildings::before {
  content: "";
}

.ts_icon::after, .ts_icon::before {
  display: inline-block;
  font-family: "Slack v2";
  font-size: 20px;
  font-weight: 400;
}

.ts_icon.middle {
  vertical-align: middle;
}

ol {
  color: inherit;
  padding-left: 30px;
}

li {
  line-height: 24px;
  margin-bottom: 10px;
}

+img, .boxed, kbd {
  border: 1px solid #ddd;
}

kbd {
  background-color: #fff;
  border: 1px solid #a3a2a2;
  border-radius: .3em;
  cursor: default;
  display: inline-block;
  font-family: Monaco, Menlo, Consolas, "Courier New", monospace !important;
  font-size: 13.6px;
  font-weight: 400;
  line-height: .6rem;
  margin: 2px;
  min-width: 1em;
  padding: .5em .6em .4em;
  text-align: center;
  text-decoration: none;
  user-select: none;
}



.img-responsiva {
  max-width: 100%; /* A imagem nunca será maior que o contêiner */
  height: auto; /* A altura se ajusta automaticamente para manter a proporção */
  border-radius: 6px; /* Adiciona bordas arredondadas (opcional) */
  box-shadow: rgba(0, 0, 0, 0.1) 0 1px 5px; /* Sombra leve para destacar a imagem (opcional) */
}



ol:not(.takeaway) {
  counter-reset: list 0;
  list-style: none;
  padding-left: 0;
}

ol li {
  font-size6px;
}

ol:not(.takeaway) li {
  counter-increment: list 1;
  margin-left: 40px;
  text-indent: -40px;
}

ol:not(.takeaway) li::before {
  background-clip: padding-box;
  background-color: #0897E9;
  border-radius: 13px;
  color: #fff;
  content: counter(list);
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  height: 24px;
  line-height: 24px;
  margin-right: 15px;
  padding-left: 0;
  text-indent: 8px;
  vertical-align: top;
  width: 24px;
}

.boxed>ol:first-child {
  margin-top: 0;
}

.boxed ol:last-child li:last-child {
  margin-bottom: 0;
}

ol:not(.takeaway) li:nth-child(n+10):nth-child(-n+99)::before {
  text-indent: 5px;
}

   /* LIST BALL BLUE */ 
   /* FAQ*/ 
   @import url("https://fonts.googleapis.com/css2?family=Muli&display=swap");

* {
  box-sizing: border-box;
}

body {
  font-family: "Muli", sans-serif;
  background-color: #f0f0f0;
}

h1 {
  margin: 50px 0 30px;
  text-align: center;
}

.faq-container {
  max-width: 600px;
  margin: 0 auto;
}

.faq {
  background-color: transparent;
  border: 1px solid #9fa4a8;
  border-radius: 10px;
  margin: 20px 0;
  padding: 30px;
  position: relative;
  overflow: hidden;
  transition: 0.3 ease;
}

.faq.active {
  background-color: #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1), 0 3px 6px rgba(0, 0, 0, 0.1);
}

.faq.active::before,
.faq.active::after {
  content: "\f075";
  font-family: "Font Awesome 5 Free";
  color: #c9c9c9;
  font-size: 7rem;
  position: absolute;
  opacity: 0.2;
  top: 20px;
  left: 20px;
  z-index: 0;
}

.faq.active::before {
  color: #0897E9;
  top: -10px;
  left: -30px;
  transform: rotateY(180deg);
}

.faq-title {
  margin: 0 35px 0 0;
  font-family: lato, sans-serif;
font-size: 16px;  
}

.faq-text {
  display: none;
  margin: 30px 0 0;
}

.faq.active .faq-text {
  display: block;
}

.faq-toggle {
  background-color: transparent;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size6px;
  padding: 0;
  position: absolute;
  top: 30px;
  right: 30px;
  height: 30px;
  width: 30px;
}

.faq-toggle:focus {
  outline: 0;
}

.faq-toggle .fa-times {
  display: none;
}

.faq.active .faq-toggle .fa-times {
  color: #fff;
  display: block;
}

.faq.active .faq-toggle .fa-chevron-down {
  display: none;
}

.faq.active .faq-toggle {
  background-color: #9fa4a8;
}

 /* FAQ*/ 

 .faq-container .faq {
  background-color: transparent;
  border: 1px solid #9fa4a8;
  border-radius: 10px;
  margin: 16px 0;
  padding: 30px;
  position: relative;
  overflow: hidden;
  transition: 0.3s ease;
}

.faq-container .faq.active {
  background-color: #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1), 0 3px 6px rgba(0, 0, 0, 0.1);
}

/* Demais estilos isolados aqui */


  /* Responsive adjustments */
  @media (min-width: 576px) {
    .container { max-width: 540px; }
  }

  @media (min-width: 768px) {
    .container { max-width: 720px; }
    .col-md-3, .col-md-9 { flex: 0 0 25%; max-width: 25%; }
    .col-md-9 { flex: 0 0 75%; max-width: 75%; }
    .display-h2 { font-size: 26px; }
  }

  @media (min-width: 992px) {
    .container { max-width: 960px; padding-left: 30px; padding-right: 30px; }
    .d-lg-none { display: none !important; }
  }

  @media (min-width: 1200px) {
    .container { max-width: 1140px; }
  }

  @media (prefers-reduced-motion: reduce) {
    .fade { transition: none 0s; transition-behavior: normal; }
  }

  @media (max-width: 575.98px) {
    .display-4 { font-size: 32px; }
  }

  @media (max-width: 767.98px) {
    .jumbotron-content { text-align: center; }
  }

</style>







<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css">

<header>
  <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400&display=swap" rel="stylesheet"/>
  <div class="compositiondani-banner">
    <div class="compositiondani-banner-image"></div>
    <div class="compositiondani-banner-overlay"></div>
    <div class="compositiondani-banner-logo-container">
      <div class="compositiondani-banner-logo"></div>
    </div>
    <div class="compositiondani-banner-content">

    </div>
  </div>
</header>



<div class="meu-conteudo-personalizado">
<div class="article_page has_sidenav inherited-styles-for-exported-element">
  <div class="article_container">
    <div class="article_spacer"></div>
    <div class="article_breadcrumbs">
<br>
<br>
    </div>
    <div class="content_col">
      <div>
        <br>  <br>
        <p class="display-h2 font-weight-bold text-uppercase text-center text-dark mb-4 inherited-styles-for-exported-element">
          <span class="font-weight-bold">Como Importar Metas para o Analytics Studio</span>
        </p>
        <div class="article_body">
          <p>Este guia tem como objetivo fornecer instruções detalhadas sobre como utilizar o novo importador de metas do TOTVS CRM, que permite a importação das suas metas para acompanhamento através do Analytics Studio. Siga os passos a seguir para começar a importar e monitorar suas metas.</p>
          
          <a class="zd_anchor" id="13242" name="importadados" prettyslug="importador-metas"></a>
          <h2 id="h_01HBVSNSWJRRTTX7D5QT21QDFF" class="anchor">Acesso ao Importador de Metas</h2>
          <ol>
          </li>
          <li>Acesse o link: <a target="_new" href="https://goals-setup.totvscrm.app">https://goals-setup.totvscrm.app</a></li>
          <li>Insira a chave de acesso fornecida no campo designado </li>
          <li> Clique em <kbd>Continuar</kbd> </li>
            <br><img src="https://totvscrm.com/wp-content/uploads/2024/04/MOCKUP-TDN-RELEASE-CSV.png" alt="Descrição da Imagem" class="img-responsiva">
        </ol>
        <p class="bug"><strong>Importante:</strong> A chave de acesso será fornecida para o usuário chave durante a implantação do CRM. Caso tenha perdido ou esquecido sua chave, por favor, <a href="https://totvscst.zendesk.com/hc/pt-br/#home">entre em contato com o suporte técnico</a> para solicitar assistência.</p>
        <br>

        <!-- Conteudo 2 -->

            <a class="zd_anchor" id="13243" name="importametas" prettyslug="importar-metas"></a>
          <h2 id="h_01HBVSNSWJ4G2BX1X9GYZS7S99" class="anchor">Importando Metas</h2>
          <ol>
            <li>Para garantir a correta formatação dos dados, inicie o processo baixando nosso <kbd>modelo de arquivo</kbd> </li> 
          </li>
            <li>Após o download, preencha o arquivo com as metas dos profissionais conforme necessário</li>
            <li><strong>Faça o Upload do Arquivo Preenchido:</strong></li></ol>
            <ul>
              <li>Arraste e solte o arquivo na área indicada para fazer o upload</li>
              <li>Se preferir, clique na área para abrir o explorador de arquivos e selecione o arquivo manualmente</li>
            </ul>
           
            <div class="note singleline">
              <strong>Recomendações:</strong>
              <ul>
                <li><strong>Excel (xls, xlsx):</strong> Utilize apenas colunas como separadores</li>
                <li><strong>CSV:</strong> Utilize vírgula, ponto e vírgula ou aspas como separadores e codifique em UTF-8</li>
                <li><strong>Células Mescladas:</strong> Não são suportadas</li>
                <li><strong>Caracteres por Campo:</strong> Máximo de 250 caracteres</li>
                <li><strong>Limite de Linhas:</strong> Até 9.999 linhas por arquivo</li>
                <li><strong>Formatação das Células:</strong> Mantenha a mesma formatação das células do modelo fornecido</li>
              </ul>
          </div>
          <br><img src="https://totvscrm.com/wp-content/uploads/2024/04/MOCKUP-TDN-RELEASE-CSV1.png" alt="Descrição da Imagem" class="img-responsiva">
          <br>
          
  <!-- Conteudo 3 -->
  <br> 
          <a class="zd_anchor" id="13244" name="selecaocabecalho" prettyslug="selecao-arquivo"></a>
          <h2 id="h_01HBVSNSWJTN11APH3TQHH5KCT" class="anchor">Seleção do Cabeçalho</h2>
          <p>Após carregar seu arquivo, você precisará indicar qual linha contém os títulos das informações, como "Email", Meta_Data_Inicio etc.</p>
          <ol>
            <li>Selecione a linha do cabeçalho</li>
            <li>Clique em <kbd>Próximo</kbd>  para continuar</li>
          </ol>
          <br>  
          <a class="zd_anchor" id="13244" name="mapeamentocolunas" prettyslug="mapeamento-colunas"></a>
          <h2 id="h_01HBVSNSWJPXEV1894PCSMQXYD" class="anchor">Mapeamento das Colunas</h2>

          <ol>
            <li>Após selecionar o cabeçalho, outra tela será exibida para mapear as colunas do arquivo</li>
            <li>Verifique se todos os campos estão vinculados às suas respectivas colunas</li>
            <li>Se estiver utilizando a planilha modelo, o mapeamento será feito automaticamente</li>
            <li>Caso contrário, você precisará mapear manualmente as colunas</li>
            <li>Após o mapeamento, clique em <kbd>Próximo</kbd> </li>
          </ol>
          <br><img src="https://totvscrm.com/wp-content/uploads/2024/04/MOCKUP-TDN-RELEASE-CSV2.png" alt="Descrição da Imagem" class="img-responsiva">
          <br>
          <br> 
            <!-- Conteudo 4 -->
          <a class="zd_anchor" id="13245" name="conferenciaeprocessamento" prettyslug="conferencia-e-processamento"></a>
          <h2 id="h_01HBVSNSWJV11H2D2QFW5DMW0B" class="anchor">Conferência e Processamento</h2>
          <p>Antes de prosseguir:</p>
          <ul>
            <li><strong>Verifique os dados:</strong> Confirme se todas as informações estão corretas e se a quantidade de linhas é a esperada.</li>
            <li><strong>Faça ajustes se necessário:</strong> Você tem a liberdade de adicionar ou remover linhas para melhor adequação.</li>
          </ul>
          <p>Quando tudo estiver pronto:</p>
          <ul>
            <li><strong>Prossiga:</strong> Clique em <kbd>Enviar</kbd>  para começar a processar os dados.</li>
            <li><strong>Espere um pouco:</strong> O processamento pode demorar alguns minutos, dependendo da quantidade de dados.</li>
          </ul>


          <a class="zd_anchor" id="13246" name="faq" prettyslug="faq-importacao"></a>
          <h2 id="h_01HBVSNSWK6MGFS52B8ZZ3V5HP" class="anchor">Resultado da Importação</h2>
          <p>Após o processamento, você receberá uma notificação sobre o resultado:</p>

          <ul>
            <li><strong>Mensagem de Sucesso:</strong> Se os dados forem importados corretamente, aparecerá a mensagem "Arquivo importado com sucesso</li>
            <li><strong>Mensagem de Erro:</strong> Se houver um problema na importação, a mensagem "A importação falhou" será exibida</li>
          </ul>


          <p class="bug"><strong>Observação:</strong> O processamento dos dados para o Analytics pode levar alguns minutos. A duração depende do volume de dados sendo importados.</p>
<br> <br>


              <!-- inicio de faq -->
    <h2>Perguntas Frequentes</h2>
    <div class="faq-container">
      <div class="faq active">
        <p class="faq-title"> <strong>Como faço para realizar alterações nas metas já importadas?</strong></p>
        <p class="faq-text">Para editar uma meta, você precisará reimportar todas as metas, pois cada importação substitui as metas existentes. Não é possível editar uma única meta após a importação.</p>
        <button class="faq-toggle">
          <i class="fas fa-chevron-down"></i>
          <i class="fas fa-times"></i>
        </button>
      </div>
      <div class="faq">
        <p class="faq-title"> <strong>Quanto tempo leva para que as metas importadas apareçam no Analytics?</strong></p>
        <p class="faq-text">O processo de sincronização das metas importadas com a visualização do Analytics leva em média cerca de 2 horas.</p>
        <button class="faq-toggle">
          <i class="fas fa-chevron-down"></i>
          <i class="fas fa-times"></i>
        </button>
      </div>

      <div class="faq">
        <p class="faq-title"><strong>
          Quais métricas e KPIs estão disponíveis para análise no analytics?</strong>
        </p>
        <p class="faq-text">No Analytics, você terá acesso a metas para análise do desempenho, tais como a quantidade de prospecções, oportunidades, propostas, negócios prováveis, negócios fechados, valor total de vendas e ticket médio.</p>
        <button class="faq-toggle">
          <i class="fas fa-chevron-down"></i>
          <i class="fas fa-times"></i>
        </button>
      </div>

    </div>
 <!-- inicio de faq -->
        </div>
      </div>
    </div>

    </div>
  </div>
</div>
</div>


<script>
  document.addEventListener("DOMContentLoaded", function() {
  const links = document.querySelectorAll('.section-list a');  // Selecione todos os links da seção

  links.forEach(link => {
    link.addEventListener('click', function(e) {
      e.preventDefault();  // Previne o comportamento padrão do link
      document.querySelector('.section-list a.active').classList.remove('active');  // Remove a classe 'active' do link atualmente ativo
      this.classList.add('active');  // Adiciona a classe 'active' ao link clicado

      const sectionId = this.getAttribute('href');  // Obtém o ID da seção alvo
      document.querySelector(sectionId).scrollIntoView({behavior: 'smooth'});  // Navega até a seção
    });
  });
});

</script>

<script>
  document.addEventListener("DOMContentLoaded", function() {
  const tabButtons = document.querySelectorAll('.tabs button.option');

  tabButtons.forEach(button => {
    button.addEventListener('click', function() {
      // Desativa todas as tabs e esconde todo o conteúdo
      tabButtons.forEach(btn => {
        btn.classList.remove('active');
        const section = document.getElementById(btn.getAttribute('aria-controls'));
        if (section) {
          section.style.display = 'none';
        }
      });

      // Ativa a tab clicada e mostra o conteúdo correspondente
      this.classList.add('active');
      const activeSection = document.getElementById(this.getAttribute('aria-controls'));
      if (activeSection) {
        activeSection.style.display = 'block';
      }
    });
  });
});

</script>

  <script>
    const toggles = document.querySelectorAll(".faq-toggle");
    toggles.forEach((toggle) => {
      toggle.addEventListener("click", () => {
        toggle.parentNode.classList.toggle("active");
      });
    });
  </script>