:root{
    --font-padrao: "Poppins", sans-serif;

    /* ENTRE LINHAS */
    --h1-line: 1.15;
    --h3-line: 1.25;
    --h5-line: 1.55;
    --h7-line: 1.70;

    /* ESPAÇAMENTO */
    --h1-spacing: 1.60px;
    --h3-spacing: 1.20px;
    --h5-spacing: 0.80px;
    --h7-spacing: 0.40px;

    /* MARGEM */
    --h1-margin: 0px;
    --h3-margin: 0px;
    --h5-margin: 0px;
    --h7-margin: 0px;

    /* PESO */
    --h1-weight: 600;
    --h3-weight: 500;
    --h5-weight: 300;
    --h7-weight: 300;
    --negrito: 600;

    /* TAMANHO */
    --h1-size: 64px;
    --h3-size: 42px;
    --h5-size: 24px;
    --h7-size: 16px;
}

/* ================= BASE ================= */
body,
body.tema-branco,
button,
input,
select,
textarea{
    font-family: var(--font-padrao);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

body{ color: var(--corbranca); }
body.tema-branco{ color: var(--corpreta); }

/* ================= ALINHAMENTO ================= */

/* CENTER */
#tbl td,
#tbl th,
#tbl th input,
#tbl th select,
.btn-voltar,
.titulo-icone,
.campo-forma,
.resultado-forma,
.botao-forma,
.menu-forma-btn,
.card-forma-titulo,
.btn,
.btn-all,
.btn-cancel,
.btn-conc,
.btn-confirm,
.btn-email-usuario,
.btn-link,
.btn-homologacao,
.btn-link-small,
.btn-login,
.btn-pend,
.btn2,
.center,
.chip,
.closex,
.err-login,
.field input[type="date"],
.field input[type="time"],
.flash,
.footer-login,
.h1-center,
.h1-center-preto,
.h3-center,
.h3-center-preto,
.h5-center,
.h5-center-preto,
.h7-center,
.h7-center-preto,
.ico,
.input-email-cadastro,
.logoff-modal,
.logoff-modal-h5,
.page-title,
.pot .btn,
.select,
.status-btn,
.subtitle,
.title-login h1,
.title-login small,
.toc a,
.msg-email-feedback,
tbody td.t-center,
thead th.t-center{
    text-align: center;
}

/* CENTER ESPECIAL */
#tbl th input,
#tbl th select,
.center,
.select{
    text-align-last: center;
    -moz-text-align-last: center;
}


/* LEFT */
.subtitulo,
.input-medida-forma,
.callout,
.col-texto,
.date-label,
.h1-left,
.h1-left-preto,
.h3-left,
.h3-left-preto,
.h5-left,
.h5-left-preto,
.h7-left,
.h7-left-preto,
.k,
.meta,
.meta-row,
.name,
.sec,
.section h2,
.section li,
.section p,
.section ul,
.section-title,
.status-label,
.t-left,
.v,
textarea,
thead th,
[data-benchmark="true"] .card p{
    text-align: left;
}

/* RIGHT */
.col-imagem,
.h1-right,
.h1-right-preto,
.h3-right,
.h3-right-preto,
.h5-right,
.h5-right-preto,
.h7-right,
.h7-right-preto,
.t-right{
    text-align: right;
}

/* JUSTIFICADO */
.h1-justify,
.h1-justify-preto,
.h3-justify,
.h3-justify-preto,
.h5-justify,
.h5-justify-preto,
.h7-justify,
.h7-justify-preto{
    text-align: justify;
}

/* ================= COMPORTAMENTO ================= */
.btn-clear,
.dropdown-menu a,
.kpi,
.nowrap,
tbody td,
thead th{
    white-space: nowrap;
}

.btn-link,
.btn-homologacao,
.btn-link-small,
.kpi-carteira-item,
.page-title,
.v{
    white-space: normal;
}

.menu-forma-btn,
.badge span,
.callout,
.col h5,
.col-preto h5,
.coltexto,
.coltexto-preto,
[data-benchmark="true"] .card,
[data-benchmark="true"] .card p,
.row,
.row-preto,
.section li,
.section p,
.section ul,
.site-footer,
.site-footer-preto,
.kpi-carteira-item,
.v{
    overflow-wrap: break-word;
    word-break:break-word;
}

/* ================= CORES ================= */

/* BRANCO */
.breadcrumb a:hover,
.breadcrumb .sep:hover,
.nome-principal,
.toolbar button,
.btn-voltar,
.btn-voltar,
.titulo-icone,
.subtitulo,
.resultado-forma,
.botao-forma,
.campo-forma,
.card-forma-titulo,
.menu-forma-btn,
.badge,
.badge span,
.btn,
.btn a,
.btn2 a,
.btn-all,
.btn-cancel,
.btn-clear,
.btn-conc,
.btn-confirm,
.btn-email-usuario,
.btn-ghost,
.btn-link,
.btn-homologacao,
.btn-link-small,
.btn-login,
.btn-pend,
.btn-primary,
.btn2,
.card-texto,
.chip,
.closex,
.code,
.coltexto,
.dropdown-menu a,
.flash,
.flash.err,
.flash.ok,
.footer-login,
.h1-center,
.h1-justify,
.h1-left,
.h1-right,
.h3-center,
.h3-justify,
.h3-left,
.h3-right,
.h5-center,
.h5-justify,
.h5-left,
.h5-right,
.h7-center,
.h7-justify,
.h7-left,
.h7-right,
.info .v a,
.info .v a:active,
.info .v a:visited,
.kpi,
.kpi-carteira-item,
.logoff-modal,
.logoff-modal-h5,
.page-title,
.pot a,
.pot .btn,
.row,
.row a,
.sec,
.section h2,
.section li,
.section p,
.section ul,
.section-title,
.site-footer,
.status-btn,
.status-btn a,
.status-label,
.subtitle,
.title,
.title-login h1,
.title-login small,
.toc a,
.topbar,
.v,
code,
tbody td .badge,
[data-benchmark="true"] .card,
[data-benchmark="true"] .card p,
[data-benchmark="true"] .sec,
[data-benchmark="true"] .title{
    color: var(--corbranca);
}

/* CINZA CLARO */
.nome-principal:hover,
.resumo,
.nome-secundario,
.breadcrumb span.sep,
.breadcrumb a,
.breadcrumb .sep,
.k,
.label-login,
.meta-row{
    color: var(--footer);
}

/* CINZA ESCURO */
.badge-pasta,
.badge-pdf,
.badge-doc,
.badge-xls,
.badge-ppt,
.badge-zip,
.badge-img,
.badge-arq,
.breadcrumb-preto a,
.breadcrumb-preto .sep,
.info .v a:hover,
.select,
.btn-acao,
.toolbar input,
.toolbar select,
.field input::placeholder,
.field textarea::placeholder{
    color: var(--card);
}

/* PRETO */
.breadcrumb-preto a:hover,
.breadcrumb-preto .sep:hover,
.h1-justify-preto,
.h3-justify-preto,
.h5-justify-preto,
.h7-justify-preto,
.h1-center-preto,
.h3-center-preto,
.h5-center-preto,
.h7-center-preto,
.h1-left-preto,
.h3-left-preto,
.h5-left-preto,
.h7-left-preto,
.h1-right-preto,
.h3-right-preto,
.h5-right-preto,
.h7-right-preto,
.input-medida-forma,
.msg-email-feedback,
.breadcrumb-preto [aria-current="page"],
.breadcrumb-preto a:hover,
.field input[type="date"],
.field input[type="time"],
.search,
table,
table.listing,
tbody td,
textarea,
thead th,
tbody td.t-center,
thead th.t-center{
    color: var(--corpreta);
}

/* OUTRAS */
.err-login{
    color: var(--corvermelha);
}

.name{
    color: var(--corvermelhamedio);
}

a.link{
    color: var(--azullink);
}

textarea::placeholder{
    color: var(--exemploform, var(--card));
}


/* ================= DECORAÇÃO / LINKS ===================*/
.toolbar button,
.btn-voltar,
.btn,
.btn-all,
.btn-conc,
.btn-link,
.btn-homologacao,
.btn-link-small,
.btn-pend,
.btn2,
.dropdown-menu a,
.pot .btn,
.row a,
.status-btn,
.toc a{
    text-decoration: none;
}

a.link,
.info .v a,
.info .v a:active,
.info .v a:visited,
thead th:hover,
thead th:hover .th-link{
    text-decoration: underline;
}

/* ================= ELEMENTOS ESPECIAIS ================= */
code,
kbd{
    padding: 2px 6px;
    border-radius: 6px;
    background: var(--header);
    font-family: var(--font-padrao);
}

kbd{
    border: 1px solid rgba(255,255,255,.2);
    box-shadow: var(--sombra_ppp);
}

.ico{
    display: inline-flex;
}

.page-title{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

/* ================= ESCALA TIPOGRÁFICA ================= */

/* H1 */
h1,
.h1,
.h1-center,
.h1-center-preto,
.h1-justify,
.h1-justify-preto,
.h1-left,
.h1-left-preto,
.h1-right,
.h1-right-preto,
.page-title,
.title-login h1{
    margin: var(--h1-margin);
    font-size: var(--h1-size);
    font-weight: var(--h1-weight);
    letter-spacing: var(--h1-spacing);
    line-height: var(--h1-line);
}

/* H3 */
[data-benchmark="true"] .title,
.section h2,
h3,
.titulo-icone,
.h3,
.h3-center,
.h3-center-preto,
.h3-justify,
.h3-justify-preto,
.h3-left,
.h3-left-preto,
.h3-right,
.h3-right-preto{
    margin: var(--h3-margin);
    font-size: var(--h3-size);
    font-weight: var(--h3-weight);
    letter-spacing: var(--h3-spacing);
    line-height: var(--h3-line);
}

/* H5 */
.btn-primary,
.btn-ghost,
.btn-voltar,
.resultado-forma,
.botao-forma,
.card-forma-titulo,
.menu-forma-btn,
.btn-email-usuario,
.btn-cancel,
.btn-confirm,
.btn-link,
.btn-homologacao,
.btn-link-small,
.btn-login,
.closex,
.col h5,
.col-preto h5,
.coltexto,
.coltexto-preto,
[data-benchmark="true"] .card,
[data-benchmark="true"] .card p,
[data-benchmark="true"] .sec,
.dropdown-menu a,
.kpi-carteira-item,
.logoff-modal,
.logoff-modal-h5,
.name,
.row,
.row-preto,
.subtitle,
.toc a,
.section li,
.section p,
.section ul,
.callout,
a.link,
code,
h5,
kbd,
.h5,
.h5-center,
.h5-center-preto,
.h5-justify,
.h5-justify-preto,
.h5-left,
.h5-left-preto,
.h5-right,
.h5-right-preto{
    margin: var(--h5-margin);
    font-size: var(--h5-size);
    font-weight: var(--h5-weight);
    letter-spacing: var(--h5-spacing);
    line-height: var(--h5-line);
}

/* H7 */
.subtitulo,
.input-medida-forma,
.campo-forma,
.badge,
.breadcrumb,
.breadcrumb-preto,
.btn,
.btn-all,
.btn-clear,
.btn-conc,
.btn-pend,
.btn2,
.chip,
.date-label,
.err-login,
.field span,
.field input,
.field input[type="date"],
.field input[type="time"],
.field textarea,
.flash,
.footer-login,
.form-actions,
.flt,
.h7,
.h7-center,
.h7-center-preto,
.h7-justify,
.h7-justify-preto,
.h7-left,
.h7-left-preto,
.h7-right,
.h7-right-preto,
.input-email-cadastro,
.input-login,
.k,
.kpi,
.meta,
.meta-row,
.pot .btn,
.search,
.sec,
.section-title,
.site-footer,
.site-footer-preto,
.status-btn,
.status-label,
tbody td,
textarea,
thead th,
tbody td.t-center,
thead th.t-center,
.title-login small,
.v{
    margin: var(--h7-margin);
    font-size: var(--h7-size);
    font-weight: var(--h7-weight);
    letter-spacing: var(--h7-spacing);
    line-height: var(--h7-line);
}

/* NEGRITO */
b,
.badge-pasta,
.badge-pdf,
.badge-doc,
.badge-xls,
.badge-ppt,
.badge-zip,
.badge-img,
.badge-arq,
.toolbar button,
.btn-voltar,
.resultado-forma,
.botao-forma,
.menu-forma-btn,
.card-forma-titulo,
.badge,
.breadcrumb [aria-current="page"],
.breadcrumb-preto [aria-current="page"],
.btn,
.btn-primary,
.btn-ghost,
.btn-all,
.btn-clear,
.btn-conc,
.btn-ghost,
.btn-login,
.btn-pend,
.btn-primary,
.btn2,
.chip,
.closex,
.kpi,
.pot .btn,
.status-btn,
.subtitle,
.toc a,
[data-benchmark="true"] .sec,
#tbl th,
strong,
thead th.t-center{
    font-weight: var(--negrito);
}

/* MAIÚSCULAS */
.badge-pasta,
.badge-pdf,
.badge-doc,
.badge-xls,
.badge-ppt,
.badge-zip,
.badge-img,
.badge-arq,
.card-forma-titulo,
.menu-forma-btn,
.breadcrumb,
.breadcrumb-preto,
.btn,
.btn-all,
.btn-conc,
.btn-link,
.btn-homologacao,
.btn-link-small,
.btn-pend,
.btn2,
.chip,
.col h5,
.col-preto h5,
[data-benchmark="true"] .sec,
[data-benchmark="true"] .title,
.pot .btn,
.status-btn,
thead th,
.toc a{
    text-transform: uppercase;
}

/* ================= OPACIDADE / RENDER ================= */
.subtitulo,
.badge span,
.breadcrumb,
.breadcrumb-preto,
.btn,
.btn-all,
.btn-cancel,
.btn-conc,
.btn-confirm,
.btn-email-usuario,
.btn-link,
.btn-homologacao,
.btn-link-small,
.btn-login,
.btn-pend,
.btn2,
.callout,
.chip,
.closex,
.col h5,
.col-preto h5,
.coltexto,
.coltexto-preto,
.date-label,
.dropdown-menu a,
.err-login,
.field input,
.field input[type="date"],
.field input[type="time"],
.field span,
.field textarea,
.flash,
.footer-login,
.form-actions,
.h1,
.h1-center,
.h1-center-preto,
.h1-justify,
.h1-justify-preto,
.h1-left,
.h1-left-preto,
.h1-right,
.h1-right-preto,
.h3,
.h3-center,
.h3-center-preto,
.h3-justify,
.h3-justify-preto,
.h3-left,
.h3-left-preto,
.h3-right,
.h3-right-preto,
.h5,
.h5-center,
.h5-center-preto,
.h5-justify,
.h5-justify-preto,
.h5-left,
.h5-left-preto,
.h5-right,
.h5-right-preto,
.h7,
.h7-center,
.h7-center-preto,
.h7-justify,
.h7-justify-preto,
.h7-left,
.h7-left-preto,
.h7-right,
.h7-right-preto,
.ico,
.info .v a,
.info .v a:active,
.info .v a:hover,
.info .v a:visited,
.input-email-cadastro,
.input-login,
.k,
.kpi-carteira-item,
.logoff-modal,
.logoff-modal-h5,
.meta,
.meta-row,
.name,
.page-title,
.pot .btn,
.row,
.row-preto,
.search,
.sec,
.section h2,
.section li,
.section p,
.section ul,
.section-title,
.site-footer,
.site-footer-preto,
.status-btn,
.status-label,
.subtitle,
tbody td,
textarea,
thead th,
.title,
.title-login small,
.topbar,
.v,
[data-benchmark="true"] .card,
[data-benchmark="true"] .card p,
[data-benchmark="true"] .sec,
[data-benchmark="true"] .title,
a.link,
code,
h1,
h3,
h5,
kbd{
    opacity: var(--opacidade);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

/* ================= RESPONSIVO ================= */
@media (max-width:2560px){
    :root{
        --h1-line: 1.15;
        --h1-size: 38px;
        --h1-spacing: 1.40px;
        --h3-line: 1.25;
        --h3-size: 28px;
        --h3-spacing: 1.00px;
        --h5-line: 1.55;
        --h5-size: 20px;
        --h5-spacing: 0.70px;
        --h7-line: 1.70;
        --h7-size: 16px;
        --h7-spacing: 0.35px;
    }
}

@media (max-width:1920px){
    :root{
        --h1-line: 1.10;
        --h1-size: 36px;
        --h1-spacing: 1.20px;
        --h3-line: 1.20;
        --h3-size: 26px;
        --h3-spacing: 0.90px;
        --h5-line: 1.50;
        --h5-size: 18px;
        --h5-spacing: 0.60px;
        --h7-line: 1.60;
        --h7-size: 14px;
        --h7-spacing: 0.30px;
    }
}

@media (max-width:1366px){
    :root{
        --h1-line: 1.08;
        --h1-size: 30px;
        --h1-spacing: 1.10px;
        --h3-line: 1.18;
        --h3-size: 22px;
        --h3-spacing: 0.80px;
        --h5-line: 1.48;
        --h5-size: 16px;
        --h5-spacing: 0.50px;
        --h7-line: 1.55;
        --h7-size: 12px;
        --h7-spacing: 0.25px;
    }
}

@media (max-width:1200px){
    :root{
        --h1-line: 1.06;
        --h1-size: 26px;
        --h1-spacing: 1.00px;
        --h3-line: 1.15;
        --h3-size: 20px;
        --h3-spacing: 0.70px;
        --h5-line: 1.45;
        --h5-size: 15px;
        --h5-spacing: 0.45px;
        --h7-line: 1.50;
        --h7-size: 11px;
        --h7-spacing: 0.22px;
    }
}

@media (max-width:1024px){
    :root{
        --h1-line: 1.05;
        --h1-size: 24px;
        --h1-spacing: 0.90px;
        --h3-line: 1.12;
        --h3-size: 18px;
        --h3-spacing: 0.60px;
        --h5-line: 1.42;
        --h5-size: 14px;
        --h5-spacing: 0.40px;
        --h7-line: 1.45;
        --h7-size: 11px;
        --h7-spacing: 0.20px;
    }
}

@media (max-width:768px){
    :root{
        --h1-line: 1.00;
        --h1-size: 22px;
        --h1-spacing: 0.80px;
        --h3-line: 1.10;
        --h3-size: 17px;
        --h3-spacing: 0.50px;
        --h5-line: 1.40;
        --h5-size: 13px;
        --h5-spacing: 0.20px;
        --h7-line: 1.30;
        --h7-size: 10px;
        --h7-spacing: 0.10px;
    }
}

@media (max-width:480px){
    :root{
        --h1-line: 1.00;
        --h1-size: 20px;
        --h1-spacing: 0.70px;
        --h3-line: 1.08;
        --h3-size: 16px;
        --h3-spacing: 0.45px;
        --h5-line: 1.35;
        --h5-size: 13px;
        --h5-spacing: 0.15px;
        --h7-line: 1.25;
        --h7-size: 10px;
        --h7-spacing: 0.08px;
    }
}