/* ============================================================
   V18 HELP LEGACY LAYOUT R5
   Corrige os tutoriais originais da Central de Ajuda.
   ============================================================ */

.v18LegacyTutorialGrid{
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;

  display:grid !important;
  grid-template-columns:
    repeat(2,minmax(0,1fr)) !important;

  gap:16px !important;

  margin:
    20px 0
    26px !important;

  padding:0 !important;

  grid-column:1 / -1 !important;
  align-items:stretch !important;
}

/* ============================================================
   CARDS ANTIGOS
   ============================================================ */

.v18LegacyTutorialGrid >
#conta,

.v18LegacyTutorialGrid >
#compras,

.v18LegacyTutorialGrid >
#materiais,

.v18LegacyTutorialGrid >
#arsenal-help,

.v18LegacyTutorialGrid >
#simulados-help,

.v18LegacyTutorialGrid >
#drive-help,

.v18LegacyTutorialGrid >
#musica-help{

  width:100% !important;
  max-width:none !important;
  min-width:0 !important;

  height:auto !important;
  min-height:0 !important;

  margin:0 !important;

  grid-column:auto !important;

  align-self:stretch !important;

  overflow:visible !important;

  padding:22px !important;

  border-radius:14px !important;

  box-sizing:border-box !important;
}

/* ============================================================
   TEXTO DOS CARDS
   ============================================================ */

.v18LegacyTutorialGrid h1,
.v18LegacyTutorialGrid h2,
.v18LegacyTutorialGrid h3,
.v18LegacyTutorialGrid h4,
.v18LegacyTutorialGrid p,
.v18LegacyTutorialGrid li,
.v18LegacyTutorialGrid span,
.v18LegacyTutorialGrid strong,
.v18LegacyTutorialGrid a{

  max-width:none !important;

  overflow-wrap:normal !important;
  word-break:normal !important;

  white-space:normal !important;
}

.v18LegacyTutorialGrid h2{

  margin-top:7px !important;
  margin-bottom:12px !important;

  font-size:
    clamp(
      17px,
      1.7vw,
      22px
    ) !important;

  line-height:1.18 !important;
}

.v18LegacyTutorialGrid h3{

  line-height:1.25 !important;
}

.v18LegacyTutorialGrid p,
.v18LegacyTutorialGrid li{

  font-size:14px !important;
  line-height:1.62 !important;
}

.v18LegacyTutorialGrid ol,
.v18LegacyTutorialGrid ul{

  padding-left:21px !important;
  margin-bottom:10px !important;
}

.v18LegacyTutorialGrid li + li{

  margin-top:5px !important;
}

/* ============================================================
   LABELS DOS CARDS
   ============================================================ */

.v18LegacyTutorialGrid [class*="tag"],
.v18LegacyTutorialGrid [class*="badge"],
.v18LegacyTutorialGrid [class*="eyebrow"]{

  width:max-content !important;
  max-width:100% !important;

  font-size:10px !important;

  white-space:normal !important;
}

/* ============================================================
   CAIXAS DE AVISO INTERNAS
   ============================================================ */

.v18LegacyTutorialGrid [class*="notice"],
.v18LegacyTutorialGrid [class*="alert"],
.v18LegacyTutorialGrid [class*="info"]{

  width:100% !important;
  max-width:none !important;

  box-sizing:border-box !important;
}

/* ============================================================
   SUPORTE FINAL
   ============================================================ */

#suporte{

  width:100% !important;
  max-width:none !important;
  min-width:0 !important;

  grid-column:1 / -1 !important;

  margin-top:20px !important;
}

/* ============================================================
   BLOCO SOCIAL
   ============================================================ */

.v18HelpSocial{

  width:100% !important;
  max-width:none !important;
  min-width:0 !important;

  grid-column:1 / -1 !important;
}

/* ============================================================
   GARANTIR QUE O PAI NAO COMPRIMA O GRID
   ============================================================ */

.v18LegacyTutorialHost{

  width:100% !important;
  max-width:none !important;
  min-width:0 !important;

  grid-column:1 / -1 !important;
}

/* ============================================================
   TABLET
   ============================================================ */

@media(max-width:900px){

  .v18LegacyTutorialGrid{

    grid-template-columns:1fr !important;

    gap:13px !important;
  }

  .v18LegacyTutorialGrid >
  #conta,

  .v18LegacyTutorialGrid >
  #compras,

  .v18LegacyTutorialGrid >
  #materiais,

  .v18LegacyTutorialGrid >
  #arsenal-help,

  .v18LegacyTutorialGrid >
  #simulados-help,

  .v18LegacyTutorialGrid >
  #drive-help,

  .v18LegacyTutorialGrid >
  #musica-help{

    padding:18px !important;
  }
}

/* ============================================================
   CELULAR
   ============================================================ */

@media(max-width:560px){

  .v18LegacyTutorialGrid{

    width:100% !important;

    margin-top:14px !important;

    gap:11px !important;
  }

  .v18LegacyTutorialGrid >
  #conta,

  .v18LegacyTutorialGrid >
  #compras,

  .v18LegacyTutorialGrid >
  #materiais,

  .v18LegacyTutorialGrid >
  #arsenal-help,

  .v18LegacyTutorialGrid >
  #simulados-help,

  .v18LegacyTutorialGrid >
  #drive-help,

  .v18LegacyTutorialGrid >
  #musica-help{

    width:100% !important;
    padding:16px !important;

    border-radius:12px !important;
  }

  .v18LegacyTutorialGrid p,
  .v18LegacyTutorialGrid li{

    font-size:13px !important;
  }
}