/*
 * Modal "Visualizar checklist" (func_visualiza_questionario).
 * O #modal1 é compartilhado com outras telas: tudo aqui depende da classe dxt-vq-modal, que a função
 * liga ao abrir e o próprio modal retira ao fechar, ou dos blocos .dxt-vq-* montados por ela.
 */
.dxt-vq-modal {
    --dxt-ink: #233044;
    --dxt-muted: #6b778c;
    --dxt-line: #e4e9f0;
    --dxt-accent: #2a6fd1;
    --dxt-accent-soft: #eaf1fb;
}

/* ---------------------------------------------------------------- estrutura do modal */
.dxt-vq-modal .modal-dialog {
    max-width: 1000px;
}

.dxt-vq-modal .modal-content {
    border: 0;
    border-radius: 12px;
    overflow: hidden;
}

.dxt-vq-modal .modal-header {
    align-items: flex-start;
    padding: 18px 22px;
    border-bottom: 1px solid var(--dxt-line);
    background: #fff;
}

.dxt-vq-modal .modal-title {
    margin: 0;
    font-size: inherit;
    line-height: 1.3;
}

.dxt-vq-modal .modal-body {
    padding: 18px 22px;
    background: #f7f9fb;
}

.dxt-vq-modal .modal-footer {
    padding: 12px 22px;
    border-top: 1px solid var(--dxt-line);
    background: #fff;
}

.dxt-vq-modal #btn_fecha_modal1 {
    padding: 8px 18px;
    border: 1px solid #9fc0ea;
    border-radius: 6px;
    background: #fff;
    color: var(--dxt-accent);
    font-weight: 600;
}

.dxt-vq-modal #btn_fecha_modal1:hover {
    background: var(--dxt-accent-soft);
}

/* ---------------------------------------------------------------- cabeçalho */
.dxt-vq-cab {
    display: flex;
    align-items: center;
    gap: 14px;
}

.dxt-vq-cab-icone {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    border-radius: 10px;
    background: #2a6fd1;
    color: #fff;
    font-size: 21px;
}

.dxt-vq-cab-titulo {
    color: #233044;
    font-size: 20px;
    font-weight: 700;
}

.dxt-vq-cab-sub {
    margin-top: 2px;
    color: #6b778c;
    font-size: 13.5px;
    font-weight: 400;
}

.dxt-vq-cab-depto {
    margin-left: 8px;
    padding-left: 9px;
    border-left: 1px solid #d6dee8;
    white-space: nowrap;
}

.dxt-vq-cab-depto .fa {
    margin-right: 3px;
    color: #2a6fd1;
}

.dxt-vq-cab-nota {
    margin-top: 2px;
    color: #6b778c;
    font-size: 12px;
    font-weight: 400;
}

/* ---------------------------------------------------------------- faixa de informações */
.dxt-vq {
    color: #233044;
}

.dxt-vq-info {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px 18px;
    margin-bottom: 14px;
    padding: 14px 16px;
    border: 1px solid #e4e9f0;
    border-radius: 8px;
    background: #fff;
}

.dxt-vq-info-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-width: 0;
}

.dxt-vq-info-item > .fa {
    margin-top: 3px;
    color: #2a6fd1;
    font-size: 18px;
}

.dxt-vq-info-item span {
    display: block;
    color: #6b778c;
    font-size: 11.5px;
}

.dxt-vq-info-item b {
    display: block;
    color: #233044;
    font-size: 13.5px;
    font-weight: 600;
    overflow-wrap: anywhere;
}

/* ---------------------------------------------------------------- resumo (atalhos + pontuação) */
.dxt-vq-resumo {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 14px;
    padding: 6px;
    border: 1px solid #e4e9f0;
    border-radius: 8px;
    background: #fff;
}

.dxt-vq-atalho {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border-radius: 6px;
    color: #2a6fd1;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none !important;
}

.dxt-vq-atalho:hover {
    background: #eaf1fb;
    color: #2a6fd1;
}

/* Forma de cálculo da pontuação (só o texto; o valor fica no cartão "Pontuação Geral") */
.dxt-vq-resumo-pontos {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
    padding: 8px 14px;
    border-radius: 8px;
    background: #eaf1fb;
    color: #4a5561;
    font-size: 13px;
    cursor: help;
    outline: none;
}

.dxt-vq-resumo-pontos:focus-visible {
    box-shadow: 0 0 0 2px #a9c7ef;
}

.dxt-vq-resumo-pontos .fa {
    color: #2a6fd1;
}

.dxt-vq-resumo-pontos b {
    color: #4a5561;
    font-weight: 400;
}

/* Explicação do cálculo: balão escondido, aparece no hover ou ao clicar (classe .aberto) */
.dxt-vq-resumo-pontos-expl {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 20;
    display: none;
    width: 320px;
    max-width: calc(100vw - 48px);
    padding: 10px 12px;
    border: 1px solid #d6e4f5;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 6px 18px rgba(35, 48, 68, .14);
    color: #3a4252;
    font-size: 12.5px;
    line-height: 1.45;
    cursor: default;
}

.dxt-vq-resumo-pontos:hover .dxt-vq-resumo-pontos-expl,
.dxt-vq-resumo-pontos.aberto .dxt-vq-resumo-pontos-expl {
    display: block;
}

/* ---------------------------------------------------------------- setores */
.dxt-vq-setor {
    margin-bottom: 14px;
    border: 1px solid #e4e9f0;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(35, 48, 68, .04);
    scroll-margin-top: 10px;
}

.dxt-vq-setor-cab {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border-bottom: 1px solid #d6e4f5;
    border-radius: 8px 8px 0 0;
    background: #e8f1fb;
    color: #233044;
    font-size: 14px;
    font-weight: 700;
}

.dxt-vq-setor-cab > .fa {
    color: #2a6fd1;
}

.dxt-vq-setor-qtd {
    margin-left: auto;
    color: #6b778c;
    font-size: 12px;
    font-weight: 600;
}

.dxt-vq-setor-rodape {
    padding: 10px 16px;
    border-top: 1px solid #e4e9f0;
    border-radius: 0 0 8px 8px;
    background: #fafbfd;
    font-size: 13px;
}

/* Cartão discreto da pontuação do setor (versão menor do "Pontuação Geral") */
.dxt-vq-setor-pnt {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 6px 14px 6px 8px;
    border: 1px solid #d6e4f5;
    border-radius: 8px;
    background: #f2f7fd;
}

.dxt-vq-setor-pnt-icone {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    border-radius: 6px;
    background: #e0ecfa;
    color: #2a6fd1;
    font-size: 14px;
}

.dxt-vq-setor-pnt-rotulo {
    display: block;
    color: #6b778c;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.2;
}

.dxt-vq-setor-pnt-valor {
    color: #233044;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

/* Reincidência: resposta inconforme agora e também em checklists anteriores (mesmo formulário e loja) */
.dxt-vq-reincidente {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 6px;
    padding: 3px 10px;
    border-radius: 999px;
    background: #fde8e8;
    color: #9b1c1c;
    font-size: 12px;
    font-weight: 700;
}
/* ---------------------------------------------------------------- perguntas */
.dxt-vq-pergunta {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 14px 16px;
    border-top: 1px solid #edf0f4;
}

.dxt-vq-pergunta:first-child {
    border-top: 0;
}

.dxt-vq-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #2a6fd1;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
}

.dxt-vq-conteudo {
    flex: 1;
    min-width: 0;
}

.dxt-vq-titulo {
    color: #233044;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
}

/* Resposta em destaque (verde), à direita da pergunta; sem resposta fica cinza */
.dxt-vq-lado-resposta {
    display: flex;
    justify-content: flex-end;
    flex: 0 1 auto;
    max-width: 45%;
}

.dxt-vq-resposta {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 8px;
    background: #e3f6e8;
    color: #1e7b3a;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.dxt-vq-resposta br:last-child {
    display: none;
}

.dxt-vq-resposta.dxt-vq-sem-resposta {
    background: #eef1f5;
    color: #6b778c;
}

/* Resposta inconforme (peso negativo na configuração do formulário) */
.dxt-vq-resposta.dxt-vq-inconforme {
    background: #fde8e8;
    color: #c62828;
}

/* Resposta "Não aplicável": cinza */
.dxt-vq-resposta.dxt-vq-nao-aplicavel {
    background: #eef1f5;
    color: #4a5561;
}

.dxt-vq-resposta.dxt-vq-nao-aplicavel div {
    color: #6b778c !important;
    font-size: 11.5px;
    font-weight: 600;
}

.dxt-vq-resposta.dxt-vq-opcoes.dxt-vq-inconforme {
    padding: 6px 10px;
    border-left: 3px solid #e5484d;
    border-radius: 4px;
    background: #fdf1f1;
}

/* Múltipla escolha: mantém a lista de opções marcadas/desmarcadas */
.dxt-vq-resposta.dxt-vq-opcoes {
    display: block;
    padding: 0;
    background: none;
    color: #233044;
    font-weight: 400;
}

.dxt-vq-obs {
    margin-top: 8px;
    padding: 6px 10px;
    border-left: 3px solid #c9d9ee;
    border-radius: 4px;
    background: #f7f9fb;
    font-size: 13px;
}

.dxt-vq-anexos-rot {
    margin-top: 10px;
    color: #6b778c;
    font-size: 12.5px;
}

.dxt-vq-anexos {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 6px;
}

.dxt-vq-thumb img {
    display: block;
    width: 76px;
    height: 76px;
    border: 1px solid #dde3ea;
    border-radius: 6px;
    object-fit: cover;
    cursor: pointer;
    transition: border-color .15s, box-shadow .15s;
}

.dxt-vq-thumb img:hover {
    border-color: #2a6fd1;
    box-shadow: 0 0 0 2px rgba(42, 111, 209, .15);
}

.dxt-vq-arquivo {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    width: 76px;
    height: 76px;
    border: 1px solid #dde3ea;
    border-radius: 6px;
    background: #f4f8fd;
    color: #2a6fd1 !important;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none !important;
}

.dxt-vq-arquivo .fa {
    font-size: 20px;
}

.dxt-vq-arquivo:hover {
    border-color: #2a6fd1;
    background: #eaf1fb;
}

/* Pontuação da pergunta: linha discreta logo abaixo do texto da pergunta */
.dxt-vq-pontos {
    margin-top: 4px;
    color: #6b778c;
    font-size: 12.5px;
}

.dxt-vq-pontos b {
    color: #233044;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

/* ---------------------------------------------------------------- assinaturas */
.dxt-vq-assinaturas {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    padding: 14px;
}

.dxt-vq-assinatura {
    padding: 10px 12px;
    border: 1px solid #dde3ea;
    border-radius: 8px;
    background: #fff;
}

.dxt-vq-assinatura-num {
    margin-bottom: 6px;
    color: #6b778c;
    font-size: 12px;
    font-weight: 600;
}

.dxt-vq-assinatura-img {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 96px;
    border: 1px solid #e4e9f0;
    border-radius: 6px;
}

.dxt-vq-assinatura-img img {
    max-width: 100%;
    max-height: 86px;
}

.dxt-vq-assinatura-nome {
    margin-top: 6px;
    color: #233044;
    font-size: 13px;
    font-weight: 600;
    text-align: center;
}

/* ---------------------------------------------------------------- pontuação geral */
.dxt-vq-geral {
    display: inline-flex;
    align-items: center;
    min-width: 220px;
    gap: 14px;
    padding: 12px 16px;
    border: 1px solid #f3c9c7;
    border-radius: 8px;
    background: #fdecec;
}

.dxt-vq-geral-icone {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    border-radius: 8px;
    background: #f8d4d4;
    color: #c62828;
    font-size: 19px;
}

.dxt-vq-geral-rotulo {
    display: block;
    color: #3a4252;
    font-size: 12px;
    font-weight: 600;
}

.dxt-vq-geral-valor {
    color: #1a1a1a;
    font-size: 24px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

/* ---------------------------------------------------------------- setores em accordion (modal de visualização) */
.dxt-vq-setor-acc > .dxt-vq-setor-cab {
    cursor: pointer;
    user-select: none;
}

.dxt-vq-setor-acc > .dxt-vq-setor-cab:hover {
    background: #dde9f8;
}

.dxt-vq-setor-acc > .dxt-vq-setor-cab:focus-visible {
    outline: 2px solid #2a6fd1;
    outline-offset: -2px;
}

.dxt-vq-setor-seta {
    color: #6b778c;
    font-size: 11px;
    transition: transform .15s ease;
}

.dxt-vq-setor-acc.dxt-vq-fechado > .dxt-vq-setor-cab {
    border-bottom: 0;
    border-radius: 8px;
}

.dxt-vq-setor-acc.dxt-vq-fechado > .dxt-vq-setor-cab .dxt-vq-setor-seta {
    transform: rotate(-90deg);
}

.dxt-vq-setor-acc.dxt-vq-fechado > .dxt-vq-setor-corpo,
.dxt-vq-setor-acc.dxt-vq-fechado > .dxt-vq-setor-rodape {
    display: none;
}

/* Recolher/expandir todos: dois botões só de ícone, juntos e discretos (legenda no title) */
.dxt-vq-acc-grupo {
    display: inline-flex;
    align-items: center;
    margin-left: 4px;
    overflow: hidden;
    border: 1px solid #e4e9f0;
    border-radius: 6px;
}

.dxt-vq-acc-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 28px;
    color: #8a94a6;
    font-size: 15px;
    text-decoration: none !important;
}

.dxt-vq-acc-btn + .dxt-vq-acc-btn {
    border-left: 1px solid #e4e9f0;
}

.dxt-vq-acc-btn:hover,
.dxt-vq-acc-btn:focus-visible {
    background: #eaf1fb;
    color: #2a6fd1;
}

/* Pontuação da pergunta no percentual de desempenho: obtido / máximo */
.dxt-vq-pontos-max {
    color: #8a94a6;
}

.dxt-vq-pontos-na {
    color: #8a94a6;
    font-style: italic;
}

/* ---------------------------------------------------------------- resumo dos setores (percentual de desempenho, tipo D) */
.dxt-vq-rd {
    overflow: hidden;
}

.dxt-vq-rd .dxt-vq-setor-qtd {
    cursor: help;
}

.dxt-vq-rd-tabela {
    width: 100%;
    margin: 0;
    border-collapse: collapse;
    color: #233044;
    font-size: 13.5px;
    font-variant-numeric: tabular-nums;
}

.dxt-vq-rd-tabela th {
    padding: 9px 16px;
    border-bottom: 1px solid #e4e9f0;
    background: #f7f9fb;
    color: #6b778c;
    font-size: 12px;
    font-weight: 700;
    text-align: left;
    white-space: nowrap;
}

.dxt-vq-rd-tabela td {
    padding: 9px 16px;
    border-bottom: 1px solid #eef1f5;
    vertical-align: middle;
}

.dxt-vq-rd-tabela tbody tr:last-child td {
    border-bottom: 0;
}

.dxt-vq-rd-tabela .dxt-vq-rd-n {
    width: 110px;
    text-align: right;
    white-space: nowrap;
}

.dxt-vq-rd-tabela .dxt-vq-rd-pct {
    width: 230px;
    white-space: nowrap;
}

.dxt-vq-rd-pct b {
    display: inline-block;
    min-width: 72px;
    font-weight: 600;
    text-align: right;
}

.dxt-vq-rd-barra {
    display: inline-block;
    width: 120px;
    height: 6px;
    margin-right: 10px;
    overflow: hidden;
    border-radius: 3px;
    background: #e4e9f0;
    vertical-align: middle;
}

.dxt-vq-rd-barra i {
    display: block;
    height: 100%;
    border-radius: 3px;
    background: #2a6fd1;
}

.dxt-vq-rd-barra-vazia {
    background: repeating-linear-gradient(45deg, #eef1f5, #eef1f5 3px, #e4e9f0 3px, #e4e9f0 6px);
}

.dxt-vq-rd-tabela .dxt-vq-rd-sem td {
    color: #8a94a6;
}

.dxt-vq-rd-tabela .dxt-vq-rd-sem-txt {
    font-style: italic;
    text-align: right;
}

.dxt-vq-rd-tabela tfoot td {
    border-top: 2px solid #d6e4f5;
    border-bottom: 0;
    background: #e8f1fb;
    font-weight: 700;
}

.dxt-vq-rd-tabela tfoot .dxt-vq-rd-pct b {
    font-weight: 700;
}

@media (max-width: 576px) {
    .dxt-vq-rd-tabela th,
    .dxt-vq-rd-tabela td {
        padding: 8px 10px;
    }

    .dxt-vq-rd-tabela .dxt-vq-rd-n {
        width: auto;
    }

    .dxt-vq-rd-barra {
        display: none;
    }

    .dxt-vq-rd-tabela .dxt-vq-rd-pct {
        width: auto;
    }
}

/* ---------------------------------------------------------------- selo de status (mesmo das listas) */
.dxt-vq .dxt-pd-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px;
    border-radius: 8px;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.2;
}

.dxt-vq .dxt-pd-badge .fa {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    margin: 0 !important;
    border-radius: 50%;
    color: #fff;
    font-size: 9px;
}

.dxt-vq .dxt-pd-badge-ok { background: #e3f6e8; color: #1e7b3a; }
.dxt-vq .dxt-pd-badge-ok .fa { background: #2fb344; }
.dxt-vq .dxt-pd-badge-info { background: #e3eefc; color: #1f5fbf; }
.dxt-vq .dxt-pd-badge-info .fa { background: #2f80ed; padding-left: 1px; }
.dxt-vq .dxt-pd-badge-pendente { background: #fff3d6; color: #8a5a00; }
.dxt-vq .dxt-pd-badge-pendente .fa { background: none; color: #f5a623; font-size: 13px; }
.dxt-vq .dxt-pd-badge-pendente .fa::before { content: "\f071"; }
.dxt-vq .dxt-pd-badge-erro { background: #fde8e8; color: #c62828; }
.dxt-vq .dxt-pd-badge-erro .fa { background: #e5484d; }
.dxt-vq .dxt-pd-badge-alerta,
.dxt-vq .dxt-pd-badge-neutro { background: #eceff3; color: #4a5561; }
.dxt-vq .dxt-pd-badge-alerta .fa,
.dxt-vq .dxt-pd-badge-neutro .fa { background: #5f6b78; }
.dxt-vq .dxt-pd-badge-alerta .fa::before { content: "\f00d"; }

/* ---------------------------------------------------------------- telas estreitas */
@media (max-width: 767.98px) {
    .dxt-vq-modal .modal-body {
        padding: 12px;
    }

    .dxt-vq-pergunta {
        flex-wrap: wrap;
    }

    .dxt-vq-lado-resposta {
        justify-content: flex-start;
        max-width: none;
        width: 100%;
        margin-left: 44px;
    }

    .dxt-vq-resumo-pontos {
        margin-left: 0;
    }

    .dxt-vq-resumo-pontos-expl {
        right: auto;
        left: 0;
    }

    .dxt-vq-assinaturas {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* ==========================================================================================
 * Preenchimento do checklist (func_preenche_questionario / func_preenche_continua_questionario, #modal1
 * e página do totem). Usa os blocos do modal de visualização (dxt-vq-*) e mantém a estrutura de tabela/linhas,
 * cujos ids as validações usam; aqui só o visual próprio do preenchimento (dxt-pq-*).
 * ========================================================================================== */
.dxt-pq-topo {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-bottom: 14px;
    padding: 12px 16px;
    border: 1px solid #e4e9f0;
    border-radius: 8px;
    background: #fff;
}

.dxt-pq-topo label {
    margin: 0;
    color: #6b778c;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .3px;
}

.dxt-pq-topo label .fa {
    margin-right: 4px;
    color: #2a6fd1;
}

.dxt-pq-topo select.form-control {
    flex: 0 1 320px;
    height: 38px;
    border-color: #ccd6e2;
    border-radius: 6px;
    font-weight: 600;
}

.dxt-pq-topo select.form-control:disabled {
    background: #f2f5f9;
    color: #233044;
    opacity: 1;
}

.dxt-pq-topo-dica {
    margin-left: auto;
    color: #6b778c;
    font-size: 12.5px;
}

.dxt-pq-topo-dica .fa {
    color: #2a6fd1;
}

/* Primeiro passo (só a escolha da loja): destaque maior */
.dxt-pq-topo-inicio {
    padding: 22px 20px;
}

.dxt-pq-topo-inicio select.form-control {
    flex-basis: 380px;
}

/* Loader ao escolher a loja (enquanto as perguntas carregam) */
.dxt-pq-loader {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 28px 22px;
    border: 1px dashed #bcd0e8;
    border-radius: 8px;
    background: #fff;
    color: #233044;
}

.dxt-pq-loader > .fa {
    flex: 0 0 auto;
    color: #2a6fd1;
    font-size: 30px;
}

.dxt-pq-loader strong {
    display: block;
    font-size: 15px;
}

.dxt-pq-loader span {
    display: block;
    margin-top: 2px;
    color: #6b778c;
    font-size: 12.5px;
}

.dxt-pq-obrig {
    margin-left: 4px;
    color: #c62828;
    font-weight: 700;
}

/* Perguntas: mesma linha do modal de visualização (número, texto, resposta à direita, ações) */
.dxt-pq table.dxt-pq-tabela {
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.dxt-pq table.dxt-pq-tabela > tbody > tr > td {
    padding: 12px 16px;
    border: 0;
    border-top: 1px solid #edf0f4;
    background: transparent;
    vertical-align: middle;
}

.dxt-pq table.dxt-pq-tabela > tbody > tr:first-child > td {
    border-top: 0;
}

/* A galeria pertence à pergunta de cima: sem divisória entre as duas */
.dxt-pq table.dxt-pq-tabela > tbody > tr.dxt-pq-galeria-linha > td {
    padding-top: 0;
    border-top: 0;
}

.dxt-pq .dxt-pq-col-pergunta {
    width: 50%;
}

.dxt-pq-pergunta {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.dxt-pq-pergunta .dxt-vq-num {
    flex-basis: 28px;
    width: 28px;
    height: 28px;
    font-size: 12.5px;
}

.dxt-pq-ref {
    margin-top: 3px;
    color: #6b778c;
    font-size: 12px;
}

.dxt-pq-obs {
    font-size: 12.5px;
}

/* Campos de resposta */
.dxt-pq .dxt-pq-col-resposta .form-control {
    min-height: 38px;
    border-color: #ccd6e2;
    border-radius: 6px;
    font-size: 13.5px;
}

.dxt-pq .dxt-pq-col-resposta .form-control:focus {
    border-color: #2a6fd1;
    box-shadow: 0 0 0 3px rgba(42, 111, 209, .15);
}

.dxt-pq .dxt-pq-col-resposta .form-control.is-invalid {
    border-color: #c62828;
}

.dxt-pq .dxt-emoji-btn {
    border-radius: 8px !important;
}

.dxt-pq .custom-control-label {
    font-size: 13.5px;
}

/* Ações da pergunta: informações, observação, anexos e alerta de observação obrigatória */
.dxt-pq .dxt-pq-col-acoes {
    width: 1%;
    white-space: nowrap;
}

.dxt-pq-acoes {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
}

.dxt-pq-acao {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 1px solid #c9d9ee;
    border-radius: 7px;
    background: #fff;
    color: #2a6fd1;
    font-size: 15px;
}

.dxt-pq-acao:hover,
.dxt-pq-acao:focus {
    background: #eaf1fb;
    color: #2a6fd1;
}

.dxt-pq-acao-info {
    border-color: #b7e2c3;
    background: #e7f5ec;
    color: #1d6b34;
}

.dxt-pq-acao-info:hover,
.dxt-pq-acao-info:focus {
    background: #d4f1dc;
    color: #1d6b34;
}

/* Pergunta com anexos: ponto verde no botão de anexar */
.dxt-pq-acao-com-anexo::after {
    content: '';
    position: absolute;
    top: -3px;
    right: -3px;
    width: 10px;
    height: 10px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: #2e9e4f;
}

.dxt-pq-alerta-obs .fa {
    color: #dc3545;
    font-size: 18px;
}

/* Pendência apontada ao finalizar (dxt-obg-highlight, aplicada pelo servidor na linha) */
.dxt-pq tr.dxt-obg-highlight > td {
    background: #fde8e8;
}

.dxt-pq tr.dxt-obg-highlight > td:first-child {
    box-shadow: inset 4px 0 0 #dc3545;
}

/* Anexos da pergunta */
.dxt-pq-galeria {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-left: 40px;
}

.dxt-pq-galeria-rot {
    color: #6b778c;
    font-size: 12px;
    font-weight: 600;
}

.dxt-pq-thumb img {
    width: 56px;
    height: 56px;
}

.dxt-pq-arquivo {
    position: relative;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border: 1px solid #dde3ea;
    border-radius: 6px;
    background: #f4f8fd;
    font-size: 10.5px;
    font-weight: 700;
}

.dxt-pq-arquivo > a:first-child {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    color: #2a6fd1;
    text-decoration: none;
}

.dxt-pq-arquivo > a:first-child .fa {
    font-size: 17px;
}

.dxt-pq-arquivo-remover {
    position: absolute;
    top: -7px;
    right: -7px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .25);
    color: #dc3545 !important;
    font-size: 10px;
    line-height: 20px;
    text-align: center;
}

/* Assinaturas */
.dxt-pq-assinaturas-corpo {
    padding: 14px;
}

.dxt-pq-assinaturas-corpo .signature-card {
    border-color: #dde3ea !important;
    border-radius: 8px !important;
    background: #fff;
}

.dxt-pq-assinatura-nome {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
    color: #233044;
    font-size: 13.5px;
    font-weight: 700;
    text-align: left;
}

/* Situação da assinatura (salva / pendente) */
.dxt-pq-ass-selo {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 600;
    white-space: nowrap;
}

.dxt-pq-ass-selo-ok {
    background: #e7f5ec;
    color: #1d6b34;
}

.dxt-pq-ass-selo-pendente {
    background: #fdf3e4;
    color: #9a5a00;
}

/* Assinatura já salva */
.dxt-pq-ass-imagem {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 200px;
    padding: 8px;
    border: 1px solid #e4e9f0;
    border-radius: 8px;
    background: #fafbfd;
}

.dxt-pq-ass-imagem img {
    max-width: 100%;
    max-height: 200px;
}

/* Barra de ações abaixo da assinatura: dica à esquerda, botões à direita */
.dxt-pq-ass-acoes {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.dxt-pq-ass-dica {
    margin-right: auto;
    color: #6b778c;
    font-size: 12.5px;
}

.dxt-pq-ass-dica .fa {
    margin-right: 4px;
    color: #2a6fd1;
}

.dxt-pq-ass-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 36px;
    padding: 0 16px;
    border-radius: 7px;
    font-size: 13px;
    font-weight: 600;
}

.dxt-pq-ass-btn-limpar {
    border: 1px solid #ccd6e2;
    background: #fff;
    color: #4a5561;
}

.dxt-pq-ass-btn-limpar:hover {
    background: #f2f5f9;
    color: #233044;
}

.dxt-pq-ass-btn-salvar {
    border: 0;
    background: #2a6fd1;
    color: #fff;
}

.dxt-pq-ass-btn-salvar:hover {
    background: #2160bb;
    color: #fff;
}

.dxt-pq-ass-btn-excluir {
    border: 1px solid #f1c4c4;
    background: #fff;
    color: #c62828;
}

.dxt-pq-ass-btn-excluir:hover {
    background: #fdf1f1;
    color: #c62828;
}

@media (max-width: 575.98px) {
    .dxt-pq-ass-dica {
        flex: 1 1 100%;
    }

    .dxt-pq-ass-btn {
        flex: 1 1 0;
        justify-content: center;
    }
}

.dxt-pq-assinatura-nome .fa {
    margin-right: 4px;
    color: #2a6fd1;
}

.dxt-pq-assinaturas-corpo canvas.signature-pad {
    border: 1px dashed #bcd0e8 !important;
    border-radius: 8px;
}

/* Rodapé fixo: pontuação geral + Finalizar */
.dxt-pq-rodape {
    position: sticky;
    bottom: 0;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 14px;
    padding: 12px 16px;
    border: 1px solid #e4e9f0;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 -4px 12px rgba(35, 48, 68, .06);
}

.dxt-pq-geral {
    min-width: 0;
    margin-right: auto;
    padding: 8px 14px;
}

.dxt-pq-geral .dxt-vq-geral-icone {
    flex-basis: 36px;
    width: 36px;
    height: 36px;
    font-size: 16px;
}

.dxt-pq-geral .dxt-vq-geral-valor {
    font-size: 20px;
}

/* Pontuação recalculada após uma resposta: pisca de leve */
@keyframes dxtPqPntAtualizado {
    0% { box-shadow: 0 0 0 0 rgba(42, 111, 209, .45); }
    100% { box-shadow: 0 0 0 10px rgba(42, 111, 209, 0); }
}

.dxt-pq-pnt-atualizado {
    animation: dxtPqPntAtualizado .9s ease-out;
}

.dxt-pq-btn-finalizar {
    padding: 10px 24px;
    border: 0;
    border-radius: 7px;
    background: #1e8e3e;
    color: #fff;
    font-size: 14.5px;
    font-weight: 700;
}

.dxt-pq-btn-finalizar:hover,
.dxt-pq-btn-finalizar:focus {
    background: #187634;
    color: #fff;
}

.dxt-pq-btn-finalizar .fa {
    margin-right: 6px;
}

@media (max-width: 767.98px) {
    .dxt-pq-topo-dica {
        margin-left: 0;
    }

    .dxt-pq table.dxt-pq-tabela > tbody > tr > td {
        display: block;
        width: 100% !important;
        padding: 6px 12px;
        border-top: 0;
    }

    .dxt-pq table.dxt-pq-tabela > tbody > tr.dxt-pq-linha > td:first-child {
        padding-top: 12px;
        border-top: 1px solid #edf0f4;
    }

    .dxt-pq .dxt-pq-col-resposta {
        padding-left: 52px !important;
    }

    .dxt-pq-galeria {
        margin-left: 40px;
    }

    .dxt-pq-btn-finalizar {
        flex: 1 1 100%;
    }
}

/* ==========================================================================================
 * Modal "Informações sobre a pergunta" (preenche_modal_info, #modal_info, no sistema e no totem).
 * Cabeçalho do dxt-vq-modal; o conteúdo é o HTML cadastrado no editor (summernote).
 * ========================================================================================== */
.dxt-mi-modal .modal-dialog {
    max-width: min(640px, 95vw);
}

/* O #modal_info tem bg-primary/text-white no cabeçalho: aqui ele fica branco como os demais */
.dxt-mi-modal .modal-header.bg-primary {
    background: #fff !important;
    color: #233044 !important;
}

.dxt-mi-modal .modal-header .close {
    color: #6b778c;
    opacity: 1;
    text-shadow: none;
}

.dxt-mi-modal .modal-title {
    flex: 1;
    min-width: 0;
    margin: 0;
    font-size: inherit;
}

.dxt-mi-modal #btn_fecha_modal_info {
    padding: 8px 18px;
    border: 1px solid #9fc0ea;
    border-radius: 6px;
    background: #fff;
    color: #2a6fd1;
    font-weight: 600;
}

.dxt-mi-modal #btn_fecha_modal_info:hover {
    background: #eaf1fb;
}

.dxt-mi-origem {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 10px;
    padding: 3px 10px;
    border-radius: 999px;
    background: #eaf1fb;
    color: #1f5fae;
    font-size: 12px;
    font-weight: 600;
}

/* Conteúdo do editor: texto legível e imagens dentro do cartão */
.dxt-mi-conteudo {
    padding: 14px 16px;
    border: 1px solid #e4e9f0;
    border-left: 4px solid #2a6fd1;
    border-radius: 8px;
    background: #fff;
    color: #233044;
    font-size: 14px;
    line-height: 1.55;
    overflow-wrap: anywhere;
}

.dxt-mi-conteudo p:last-child {
    margin-bottom: 0;
}

.dxt-mi-conteudo img {
    max-width: 100% !important;
    height: auto !important;
    border-radius: 6px;
}

.dxt-mi-conteudo table {
    max-width: 100%;
}

/* ==========================================================================================
 * Modal "Observação da pergunta" (preenche_modal_obs, #modal2, no sistema e no totem).
 * Cabeçalho do dxt-vq-modal; o rodapé padrão some (o #btn_fecha_modal2 continua no DOM: func_salva_obs o aciona).
 * ========================================================================================== */
.dxt-ob-modal .modal-dialog {
    max-width: min(680px, 95vw);
}

.dxt-ob-modal .modal-footer {
    display: none;
}

.dxt-ob-modal .modal-title {
    flex: 1;
    min-width: 0;
    margin: 0;
    font-size: inherit;
}

.dxt-ob-rotulo {
    display: block;
    margin-bottom: 6px;
    color: #3a4252;
    font-size: 12.5px;
    font-weight: 600;
}

.dxt-ob textarea.form-control {
    min-height: 140px;
    padding: 10px 12px;
    border-color: #ccd6e2;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.5;
    resize: vertical;
}

.dxt-ob textarea.form-control:focus {
    border-color: #2a6fd1;
    box-shadow: 0 0 0 3px rgba(42, 111, 209, .15);
}

.dxt-ob-rodape-campo {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 6px;
    color: #6b778c;
    font-size: 12px;
}

.dxt-ob-rodape-campo .fa {
    color: #2a6fd1;
}

#dxt_ob_contador {
    white-space: nowrap;
}

.dxt-ob-acoes {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin: 18px -22px -18px;
    padding: 12px 22px;
    border-top: 1px solid #e4e9f0;
    background: #fff;
}

/* ==========================================================================================
 * Modal "Perguntas do formulário" (func_config_formulario / func_adiciona_pergunta_form, #modal1-b).
 * Tabela no padrão dxt-tp-* (barra de status, cabeçalho azul); hierarquia das condicionais mantida.
 * ========================================================================================== */
.dxt-pf-modal .modal-dialog {
    max-width: min(1500px, 96vw);
}

.dxt-pf-modal .modal-title {
    flex: 1;
    min-width: 0;
}

#modal1-b.dxt-pf-modal #btn_fecha_modal1-b {
    padding: 8px 18px;
    border: 1px solid #9fc0ea;
    border-radius: 6px;
    background: #fff;
    color: #2a6fd1;
    font-weight: 600;
}

#modal1-b.dxt-pf-modal #btn_fecha_modal1-b:hover {
    background: #eaf1fb;
}

/* Legenda discreta das cores */
.dxt-pf-legenda {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
    margin-left: 10px;
    padding-left: 14px;
    border-left: 1px solid #e4e9f0;
    color: #6b778c;
    font-size: 12px;
}

.dxt-pf-legenda span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: default;
}

.dxt-pf-legenda b {
    color: #233044;
}

.dxt-pf-legenda .fa {
    color: #2a6fd1;
}

.dxt-pf-legenda-cor {
    display: inline-block;
    width: 4px;
    height: 14px;
    border-radius: 3px;
}

.dxt-pf-legenda-alerta { background: #f5a623; }
.dxt-pf-legenda-inativa { background: #d6263b; }

/* Um cartão por setor, na ordem do preenchimento */
.dxt-pf-setor {
    overflow: visible;
}

.dxt-pf-setor .dxt-vq-setor-cab {
    flex-wrap: wrap;
}

.dxt-pf-setor-ordem {
    padding: 1px 9px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid #c9d9ee;
    color: #1b5da4;
    font-size: 11.5px;
    font-weight: 600;
}

.dxt-pf-setor-ordem-sem {
    border-color: #dde3ea;
    color: #6b778c;
    font-weight: 400;
}

/* Accordion do setor: o cabeçalho abre/fecha a lista de perguntas */
.dxt-pf-setor-cab {
    cursor: pointer;
    user-select: none;
    outline: none;
}

.dxt-pf-setor-cab:hover {
    background: #dceaf9;
}

.dxt-pf-setor-cab:focus-visible {
    box-shadow: inset 0 0 0 2px #a9c7ef;
}

.dxt-pf-setor-seta {
    color: #2a6fd1;
    font-size: 11px;
    transition: transform .2s;
}

.dxt-pf-setor.dxt-pf-recolhido:not(.dxt-pf-forcado) .dxt-pf-setor-seta {
    transform: rotate(-90deg);
}

/* Recolhido: só o cabeçalho (cantos arredondados embaixo também) */
.dxt-pf-setor.dxt-pf-recolhido:not(.dxt-pf-forcado) .dxt-pf-scroll {
    display: none;
}

.dxt-pf-setor.dxt-pf-recolhido:not(.dxt-pf-forcado) .dxt-pf-setor-cab {
    border-bottom: 0;
    border-radius: 8px;
}

.dxt-pf-recolher {
    display: flex;
    gap: 6px;
}

/* Arrastar e soltar: alças, dica, status e marcadores de posição */
.dxt-pf-alca {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 22px;
    width: 22px;
    height: 26px;
    border-radius: 5px;
    color: #9aa5b5;
    cursor: grab;
}

.dxt-pf-alca:hover {
    background: #eaf1fb;
    color: #2a6fd1;
}

.dxt-pf-alca:active {
    cursor: grabbing;
}

/* Durante a pesquisa o arrastar fica desligado */
.dxt-pf-buscando .dxt-pf-alca {
    opacity: .3;
    cursor: not-allowed;
    pointer-events: none;
}

.dxt-pf-dica-arrastar {
    color: #6b778c;
    font-size: 12px;
    cursor: help;
}

.dxt-pf-dica-arrastar .fa {
    color: #2a6fd1;
}

.dxt-pf-status {
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
}

.dxt-pf-status-salvando { background: #eaf1fb; color: #1f5fae; }
.dxt-pf-status-ok { background: #e7f5ec; color: #1d6b34; }
.dxt-pf-status-erro { background: #fdf1f1; color: #c62828; }

.dxt-pf-placeholder-setor {
    margin-bottom: 14px;
    border: 2px dashed #9fc0ea;
    border-radius: 8px;
    background: #f4f8fd;
    visibility: visible !important;
}

.dxt-pf-placeholder-linha td {
    border: 2px dashed #9fc0ea !important;
    background: #f4f8fd !important;
}

/* Setor/linha sendo arrastado(a) */
.dxt-pf-setor.ui-sortable-helper {
    box-shadow: 0 10px 28px rgba(35, 48, 68, .22);
}

tr.ui-sortable-helper {
    display: table;
    background: #fff;
    box-shadow: 0 8px 22px rgba(35, 48, 68, .2);
}

/* Dentro do cartão a tabela não tem borda própria */
.dxt-pf-scroll {
    border-radius: 0 0 8px 8px;
}

.dxt-pf-tabela thead.dxt-thead th {
    padding: 8px 12px !important;
    border-right: 0 !important;
    border-bottom: 1px solid #e4e9f0 !important;
    background: #f7f9fb !important;
    color: #4a5561 !important;
    font-size: 12px;
}

.dxt-pf-tabela tbody tr:last-child td {
    border-bottom: 0;
}

/* Número da pergunta (o mesmo do preenchimento) */
.dxt-pf-pergunta {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.dxt-pf-pergunta > div {
    flex: 1;
    min-width: 0;
    padding-top: 3px;
}

.dxt-pf-num {
    flex-basis: 26px;
    width: 26px;
    height: 26px;
    font-size: 12px;
}

.dxt-pf-num-inativa {
    background: #c9ced6;
}

/* Pergunta: hierarquia (mãe em negrito com seta do accordion, filha recuada com "Condicional") */
.dxt-pf-tabela .dxt-pf-col-pergunta {
    min-width: 280px;
    font-size: 13.5px;
}

.dxt-pf-tabela .dxt-pf-pai:hover {
    color: #1b5da4;
}

.dxt-pf-tabela .dxt-accordion-icon {
    color: #2a6fd1;
    font-size: 11px;
}

.dxt-pf-seta {
    margin-right: 4px;
    color: #8a94a6;
    font-weight: 700;
}

.dxt-pf-condicional {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-right: 8px;
    padding: 1px 8px;
    border: 1px solid #ddd0f2;
    border-radius: 999px;
    background: #f3eefc;
    color: #6a3fb5;
    font-size: 11px;
    font-weight: 600;
}

/* Pergunta-filha: fundo cinza claro (vermelho/laranja das outras regras têm prioridade) */
table.dxt-tp-tabela tbody tr.dxt-pf-filha:not(.dxt-tp-inativa):not(.dxt-fm-alerta) td {
    background: #f8f9fb;
}

.dxt-pf-tipo {
    display: inline-block;
    padding: 2px 9px;
    border-radius: 5px;
    background: #f0f2f5;
    color: #4a5561;
    font-size: 11.5px;
    font-weight: 600;
    white-space: nowrap;
}

.dxt-pf-chk {
    width: 17px;
    height: 17px;
    cursor: pointer;
}

/* Selects da linha */
.dxt-pf-tabela .dxt-pf-sel {
    min-width: 130px;
    height: 34px;
    border-color: #ccd6e2;
    border-radius: 6px;
    font-size: 13px;
}

.dxt-pf-tabela .dxt-pf-sel-ordem {
    min-width: 76px;
}

.dxt-pf-tabela .dxt-pf-sel:focus {
    border-color: #2a6fd1;
    box-shadow: 0 0 0 3px rgba(42, 111, 209, .15);
}

.dxt-pf-tabela .dxt-pf-sel:disabled {
    background: #f2f5f9;
    color: #6b778c;
}

/* Ações: mesmos botões coloridos em tamanho padronizado */
table.dxt-tp-tabela .dxt-pf-col-acoes {
    width: 1%;
    text-align: center;
    white-space: nowrap;
}

.dxt-pf-acoes {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.dxt-pf-acoes > .btn,
.dxt-pf-acoes > .dropdown > .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border-radius: 7px;
}

/* Adicionar pergunta (área acima da tabela) */
.dxt-pf-add {
    margin-bottom: 14px;
    padding: 14px 16px;
    border: 1px solid #c9d9ee;
    border-left: 4px solid #1e8e3e;
    border-radius: 8px;
    background: #fff;
}

.dxt-pf-add-cab {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
}

.dxt-pf-add-cab b {
    display: block;
    color: #233044;
    font-size: 14px;
}

.dxt-pf-add-cab small {
    display: block;
    color: #6b778c;
    font-size: 12px;
}

.dxt-pf-add-campos {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(0, 1.4fr) auto;
    gap: 12px;
    align-items: end;
}

.dxt-pf-add label {
    display: block;
    margin-bottom: 4px;
    color: #3a4252;
    font-size: 12.5px;
    font-weight: 600;
}

.dxt-pf-add .form-control {
    border-color: #ccd6e2;
    border-radius: 6px;
}

/* Só o campo obrigatório fica vermelho; os válidos não ficam verdes */
.dxt-pf-add.was-validated .form-control:valid {
    padding-right: .75rem;
    border-color: #ccd6e2;
    background-image: none;
}

.dxt-pf-add-acoes {
    display: flex;
    gap: 8px;
}

/* "Campo obrigatório" fica logo abaixo do select sem ocupar altura (senão desalinha a linha dos campos) */
.dxt-pf-add-setor {
    position: relative;
}

.dxt-pf-add-setor .invalid-feedback {
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 2px;
    font-size: 11px;
    white-space: nowrap;
}

/* Espaço para o aviso abaixo dos campos */
.dxt-pf-add-campos {
    padding-bottom: 12px;
}

/* Mesma altura para o select com busca (Pergunta) e o select comum (Setor) */
.dxt-pf-add .form-control,
.dxt-pf-add .bootstrap-select > .dropdown-toggle {
    height: 38px !important;
}

.dxt-pf-add-acoes .invalid-feedback {
    display: none;
}

@media (max-width: 991.98px) {
    .dxt-pf-add-campos {
        grid-template-columns: minmax(0, 1fr);
    }

    .dxt-pf-legenda {
        margin-left: 0;
        padding-left: 0;
        border-left: 0;
    }
}

/* ==========================================================================================
 * Modal "Importar formulário por planilha" (#modalImport, index.php; envio para fn_importar_formulario_ckl.php).
 * ========================================================================================== */
.dxt-im-modal .modal-dialog {
    max-width: min(940px, 95vw);
}

.dxt-im-modal .modal-content {
    border: 0;
    border-radius: 12px;
    overflow: hidden;
}

.dxt-im-modal .modal-header {
    align-items: flex-start;
    padding: 18px 22px;
    border-bottom: 1px solid #e4e9f0;
    background: #fff;
}

.dxt-im-modal .modal-title {
    flex: 1;
    min-width: 0;
}

.dxt-im-cab-icone {
    background: #1d6f42;
}

.dxt-im-modal .modal-body {
    padding: 18px 22px;
    background: #f7f9fb;
    color: #233044;
}

/* Passos */
.dxt-im-passos {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 0 0 14px;
    padding: 0;
    list-style: none;
}

.dxt-im-passos li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid #e4e9f0;
    border-radius: 8px;
    background: #fff;
}

.dxt-im-passos li > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #2a6fd1;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
}

.dxt-im-passos b {
    display: block;
    font-size: 13px;
}

.dxt-im-passos small {
    display: block;
    color: #6b778c;
    font-size: 11.5px;
    line-height: 1.35;
}

/* Área de upload (clique ou arraste) */
.dxt-im-drop {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    margin: 0 0 14px;
    padding: 24px 16px;
    border: 2px dashed #bcd0e8;
    border-radius: 10px;
    background: #fff;
    text-align: center;
    cursor: pointer;
    transition: background .2s, border-color .2s;
}

.dxt-im-drop input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.dxt-im-drop:hover,
.dxt-im-drop.dxt-im-drop-ativo {
    border-color: #2a6fd1;
    background: #f4f8fd;
}

.dxt-im-drop-icone {
    color: #2a6fd1;
    font-size: 36px;
    line-height: 1;
}

.dxt-im-drop-texto {
    color: #1f6fd1;
    font-size: 15px;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.dxt-im-drop-dica {
    color: #6b778c;
    font-size: 12.5px;
}

/* Arquivo escolhido */
.dxt-im-drop.dxt-im-drop-ok {
    border-style: solid;
    border-color: #9fd3b0;
    background: #f3faf5;
}

.dxt-im-drop.dxt-im-drop-ok .dxt-im-drop-icone,
.dxt-im-drop.dxt-im-drop-ok .dxt-im-drop-texto {
    color: #1d6f42;
}

.dxt-im-drop.dxt-im-drop-ok .dxt-im-drop-icone .fa::before {
    content: "\f1c3"; /* fa-file-excel-o */
}

/* Resultado da importação */
.dxt-im-resultado:empty {
    display: none;
}

.dxt-im-resultado {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid transparent;
    border-radius: 8px;
    font-size: 13.5px;
    word-break: break-word;
}

.dxt-im-resultado > .fa {
    margin-top: 2px;
    font-size: 18px;
}

.dxt-im-resultado > div {
    flex: 1;
    min-width: 0;
}

.dxt-im-resultado-ok { border-color: #b7e2c3; background: #e7f5ec; color: #1d6b34; }
.dxt-im-resultado-erro { border-color: #f1c4c4; background: #fdf1f1; color: #9b1c1c; }
.dxt-im-resultado-info { border-color: #c9d9ee; background: #eaf1fb; color: #1f5fae; }

.dxt-im-detalhes {
    margin-top: 8px;
    font-size: 12.5px;
    opacity: .9;
}

.dxt-im-dup-tit {
    margin: 10px 0 4px;
    font-weight: 700;
}

.dxt-im-dup {
    width: auto;
    margin: 0;
    background: #fff;
    color: #233044;
    font-size: 12.5px;
}

/* Colunas da planilha (recolhível) */
.dxt-im-layout {
    margin-bottom: 14px;
    border: 1px solid #e4e9f0;
    border-radius: 8px;
    background: #fff;
}

.dxt-im-layout > summary {
    padding: 10px 14px;
    color: #233044;
    font-size: 13.5px;
    font-weight: 700;
    cursor: pointer;
}

.dxt-im-layout > summary .fa {
    margin-right: 4px;
    color: #2a6fd1;
}

.dxt-im-layout > summary small {
    margin-left: 6px;
    color: #6b778c;
    font-weight: 400;
}

.dxt-im-grupos {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding: 0 14px 14px;
}

.dxt-im-grupo {
    padding: 10px 12px;
    border: 1px solid #edf0f4;
    border-radius: 8px;
    background: #fafbfd;
}

.dxt-im-grupo-tit {
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 700;
}

.dxt-im-grupo-tit .fa {
    margin-right: 4px;
    color: #2a6fd1;
}

.dxt-im-grupo-tit small {
    color: #6b778c;
    font-weight: 400;
}

.dxt-im-grupo dl {
    margin: 0;
    font-size: 12px;
}

.dxt-im-grupo dt {
    margin-top: 6px;
    color: #c7254e;
    font-family: SFMono-Regular, Consolas, monospace;
    font-size: 11.5px;
    font-weight: 600;
}

.dxt-im-grupo dd {
    margin: 0;
    color: #4a5561;
}

.dxt-im-opcional {
    margin-left: 4px;
    padding: 0 6px;
    border-radius: 999px;
    background: #eef1f5;
    color: #6b778c;
    font-size: 10.5px;
}

/* Exemplo */
.dxt-im-exemplo-tit {
    margin-bottom: 6px;
    color: #233044;
    font-size: 13px;
    font-weight: 700;
}

.dxt-im-exemplo-tit .fa {
    margin-right: 4px;
    color: #2a6fd1;
}

.dxt-im-exemplo {
    background: #fff;
}

.dxt-im-exemplo table {
    font-size: 12px;
    white-space: nowrap;
}

.dxt-im-exemplo thead.dxt-thead th {
    padding: 8px 10px !important;
    font-size: 11.5px;
    white-space: nowrap;
}

.dxt-im-exemplo td {
    padding: 6px 10px;
    border-top: 1px solid #edf0f4;
}

/* Rodapé: modelo à esquerda, Cancelar / Importar à direita */
.dxt-im-rodape {
    justify-content: space-between;
    padding: 12px 22px;
    border-top: 1px solid #e4e9f0;
    background: #fff;
}

.dxt-im-rodape .dxt-tp-btn-ferramenta {
    display: inline-flex;
    align-items: center;
}

.dxt-im-rodape-acoes {
    display: flex;
    gap: 10px;
}

@media (max-width: 767.98px) {
    .dxt-im-passos,
    .dxt-im-grupos {
        grid-template-columns: minmax(0, 1fr);
    }

    .dxt-im-rodape {
        flex-direction: column-reverse;
        align-items: stretch;
        gap: 10px;
    }

    .dxt-im-rodape-acoes .btn {
        flex: 1;
    }
}

/* ==========================================================================================
 * Modal "Resumo do Checklist" (func_carrega_informacoes_ckl, #modal_info1).
 * O #modal_info1 é compartilhado: a função liga a classe dxt-rs-modal ao abrir e o modal a retira ao fechar.
 * ========================================================================================== */
.dxt-rs-modal .modal-dialog {
    max-width: 1080px;
}

.dxt-rs-modal .modal-content {
    border: 0;
    border-radius: 12px;
    overflow: hidden;
}

.dxt-rs-modal .modal-body {
    padding: 0;
    background: #f7f9fb;
}

.dxt-rs-modal .modal-footer {
    justify-content: space-between;
    padding: 12px 22px;
    border-top: 1px solid #e4e9f0;
    background: #fff;
}

.dxt-rs-modal #btn_fecha_modal_info1 {
    padding: 8px 18px;
    border: 0;
    border-radius: 6px;
    background: #2a6fd1;
    color: #fff;
    font-weight: 600;
}

.dxt-rs-modal #btn_fecha_modal_info1:hover {
    background: #2160bb;
}

.dxt-rs-btn-completo {
    padding: 8px 16px;
    border: 1px solid #9fc0ea;
    border-radius: 6px;
    background: #fff;
    color: #233044;
    font-weight: 600;
}

.dxt-rs-btn-completo .fa {
    margin-right: 6px;
    color: #2a6fd1;
}

.dxt-rs-btn-completo:hover {
    background: #eaf1fb;
}

.dxt-rs {
    color: #233044;
    font-size: 14px;
}

/* ---------------------------------------------------------------- cabeçalho */
.dxt-rs-cab {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px 22px;
    border-bottom: 1px solid #e4e9f0;
    background: #fff;
}

.dxt-rs-cab-icone {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    border-radius: 10px;
    background: #2a6fd1;
    color: #fff;
    font-size: 21px;
}

.dxt-rs-cab-titulo {
    font-size: 20px;
    font-weight: 700;
}

.dxt-rs-cab-sub {
    color: #6b778c;
    font-size: 13.5px;
}

.dxt-rs-fechar {
    margin-left: auto;
    align-self: flex-start;
    font-size: 26px;
}

/* ---------------------------------------------------------------- faixa de informações */
.dxt-rs-info {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1.25fr 1fr 1fr;
    margin: 12px 22px 10px;
    border: 1px solid #d6e4f5;
    border-radius: 10px;
    background: #f2f7fd;
}

.dxt-rs-info-item {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    min-width: 0;
    padding: 7px 14px;
    border-left: 1px solid #d6e4f5;
}

.dxt-rs-info-item:first-child {
    border-left: 0;
}

.dxt-rs-info-item > .fa {
    margin-top: 2px;
    color: #2a6fd1;
    font-size: 16px;
}

.dxt-rs-info-item span {
    display: block;
    color: #6b778c;
    font-size: 11px;
    line-height: 1.3;
}

.dxt-rs-info-item b {
    font-size: 13.5px;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

/* Complemento (nome da loja) na mesma linha do valor */
.dxt-rs-info-item small {
    margin-left: 5px;
    color: #6b778c;
    font-size: 11.5px;
}

.dxt-rs-info-status > .fa {
    color: #23a05a;
}

.dxt-rs-status {
    display: inline-block;
    padding: 1px 8px;
    border-radius: 6px;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
}

.dxt-rs-status-ok {
    border: 1px solid #b7e2c3;
    background: #e3f6e8;
    color: #1e7b3a;
}

.dxt-rs-status-outro {
    border: 1px solid #f3d9a6;
    background: #fff4e0;
    color: #9a5b00;
}

/* ---------------------------------------------------------------- cartões */
.dxt-rs-card {
    margin-bottom: 12px;
    padding: 12px 16px;
    border: 1px solid #e4e9f0;
    border-radius: 10px;
    background: #fff;
}

.dxt-rs-card-tit {
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 700;
}

.dxt-rs-card-tit > .fa {
    margin-right: 6px;
    color: #2a6fd1;
}

.dxt-rs-card-meta {
    float: right;
    color: #6b778c;
    font-size: 12px;
    font-weight: 600;
}

.dxt-rs-ajuda {
    margin-left: 4px;
    color: #2a6fd1;
    cursor: help;
}

.dxt-rs-vazio {
    padding: 10px 12px;
    border-radius: 6px;
    background: #f7f9fb;
    color: #6b778c;
}

/* ---------------------------------------------------------------- placar */
.dxt-rs-placar {
    display: grid;
    grid-template-columns: 250px minmax(0, 1fr);
    gap: 14px;
    margin: 0 22px;
}

.dxt-rs-placar.dxt-rs-sem-pontuacao {
    grid-template-columns: minmax(0, 1fr);
}

.dxt-rs-placar .dxt-rs-card {
    margin-bottom: 12px;
}

/* Pontuação: cartão branco com faixa lateral na cor do status em relação à meta */
.dxt-rs-geral {
    border-left-width: 5px;
}

.dxt-rs-geral-ok {
    border-left-color: #23a05a;
}

.dxt-rs-geral-nok {
    border-left-color: #c62828;
}

.dxt-rs-geral-neutro {
    border-left-color: #2a6fd1;
}

.dxt-rs-geral-val {
    font-size: 34px;
    font-weight: 800;
    line-height: 1.05;
}

.dxt-rs-geral-val small {
    color: #8a94a6;
    font-size: 16px;
    font-weight: 400;
}

.dxt-rs-barra {
    position: relative;
    height: 8px;
    margin-top: 10px;
    border-radius: 5px;
    background: #e4e9f0;
}

.dxt-rs-barra > span {
    display: block;
    height: 100%;
    border-radius: 5px;
    background: #2a6fd1;
}

.dxt-rs-barra-ok > span {
    background: #23a05a;
}

.dxt-rs-barra-nok > span {
    background: #c62828;
}

.dxt-rs-barra-meta {
    position: absolute;
    top: -4px;
    width: 3px;
    height: 16px;
    margin-left: -1px;
    border-radius: 2px;
    background: #233044;
}

.dxt-rs-meta {
    margin-top: 7px;
    font-size: 12.5px;
    font-weight: 700;
}

.dxt-rs-meta-ok {
    color: #1e7b3a;
}

.dxt-rs-meta-nok {
    color: #b42020;
}

/* Resumo de respostas */
.dxt-rs-tiles {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
}

/* Bloco baixo: ícone e número na mesma linha; rótulo e percentual embaixo */
.dxt-rs-tile {
    display: grid;
    grid-template-columns: auto auto;
    grid-template-areas:
        "ico num"
        "rot rot"
        "pct pct"
        "rei rei";
    justify-content: center;
    align-items: center;
    column-gap: 7px;
    padding: 8px 4px 7px;
    border: 1px solid transparent;
    border-radius: 8px;
    text-align: center;
}

.dxt-rs-tile > .fa {
    grid-area: ico;
    font-size: 20px;
}

.dxt-rs-tile b {
    grid-area: num;
    font-size: 20px;
    line-height: 1.1;
}

.dxt-rs-tile span {
    grid-area: rot;
    margin-top: 2px;
    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.2;
}

.dxt-rs-tile small {
    grid-area: pct;
    color: #4a5561;
    font-size: 11px;
}

.dxt-rs-tile .dxt-rs-rein {
    grid-area: rei;
    justify-self: center;
    white-space: normal;
}

.dxt-rs-tile-ok {
    border-color: #c7ead2;
    background: #eef9f1;
}

.dxt-rs-tile-ok > .fa,
.dxt-rs-tile-ok span {
    color: #1e7b3a;
}

.dxt-rs-tile-nok {
    border-color: #f5cccc;
    background: #fdf1f1;
}

.dxt-rs-tile-nok > .fa,
.dxt-rs-tile-nok span {
    color: #c62828;
}

/* "Não aplicável": cinza, a mesma cor do Template 3 (não conta como conforme nem como inconforme) */
.dxt-rs-tile-na {
    border-color: #dde2e9;
    background: #f3f5f8;
}

.dxt-rs-tile-na > .fa,
.dxt-rs-tile-na span {
    color: #5f6b7d;
}

.dxt-rs-tile-sem {
    border-color: #f6e0b0;
    background: #fff8e8;
}

.dxt-rs-tile-sem > .fa,
.dxt-rs-tile-sem span {
    color: #b7791f;
}

.dxt-rs-tile-obs {
    border-color: #cfe0f6;
    background: #eef4fc;
}

.dxt-rs-tile-obs > .fa,
.dxt-rs-tile-obs span {
    color: #2a6fd1;
}

.dxt-rs-tile-foto {
    border-color: #e4e9f0;
    background: #f5f7fa;
}

.dxt-rs-tile-foto > .fa,
.dxt-rs-tile-foto span {
    color: #4a5561;
}

.dxt-rs-rein {
    margin-top: 3px;
    padding: 1px 7px;
    border-radius: 999px;
    background: #fde8e8;
    color: #9b1c1c;
    font-size: 11px;
    font-style: normal;
    font-weight: 700;
    white-space: nowrap;
}

/* Totais */
/* Totais lado a lado */
.dxt-rs-totais {
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 10px 12px;
    text-align: center;
}

.dxt-rs-totais > div {
    flex: 1;
}

.dxt-rs-totais > div + div {
    border-left: 1px solid #e4e9f0;
}

.dxt-rs-totais span {
    display: block;
    color: #4a5561;
    font-size: 12px;
    font-weight: 600;
}

.dxt-rs-totais b {
    display: block;
    font-size: 26px;
    line-height: 1.15;
}

/* ---------------------------------------------------------------- setor + lateral */
.dxt-rs-grade {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 14px;
    margin: 0 22px 8px;
}

.dxt-rs-tabela-wrap {
    overflow-x: auto;
}

.dxt-rs-tabela {
    width: 100%;
    border-collapse: collapse;
    font-size: 13.5px;
}

.dxt-rs-tabela th {
    padding: 7px 6px;
    background: #f2f5f9;
    color: #4a5561;
    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.2;
    vertical-align: middle;
}

.dxt-rs-tabela td {
    padding: 7px 6px;
    border-bottom: 1px solid #edf0f5;
}

.dxt-rs-tabela .dxt-rs-n {
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.dxt-rs-setor {
    font-weight: 600;
}

.dxt-rs-n-ok {
    color: #1e7b3a;
    font-weight: 700;
}

.dxt-rs-n-nok {
    color: #c62828;
    font-weight: 700;
}

.dxt-rs-n-na {
    color: #5f6b7d;
    font-weight: 700;
}

.dxt-rs-n-sem {
    color: #b7791f;
    font-weight: 700;
}

.dxt-rs-n-obs {
    color: #2a6fd1;
    font-weight: 700;
}

.dxt-rs-n-foto {
    color: #4a5561;
    font-weight: 700;
}

.dxt-rs-n-zero {
    color: #a3acba;
}

.dxt-rs-pnt {
    font-weight: 700;
}

.dxt-rs-total td {
    border-bottom: 0;
    background: #eaf1fb;
    font-weight: 700;
}

.dxt-rs-obs {
    margin: 0;
    padding: 0;
    list-style: none;
}

.dxt-rs-obs li {
    margin-bottom: 8px;
    padding: 9px 12px;
    border-left: 3px solid #c9d6e8;
    border-radius: 4px;
    background: #f7f9fb;
}

.dxt-rs-obs li span {
    display: block;
    margin-bottom: 2px;
    color: #6b778c;
    font-size: 12px;
}

.dxt-rs-mais {
    color: #6b778c;
    font-size: 12.5px;
    font-style: italic;
}

.dxt-rs-tempo {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 12px;
}

.dxt-rs-tempo span,
.dxt-rs-duracao span {
    display: block;
    color: #6b778c;
    font-size: 12px;
}

.dxt-rs-tempo b {
    font-size: 14px;
}

.dxt-rs-duracao {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-radius: 8px;
    background: #eaf1fb;
}

.dxt-rs-duracao > .fa {
    color: #2a6fd1;
    font-size: 22px;
}

.dxt-rs-duracao b {
    font-size: 19px;
}

.dxt-rs-timeline {
    position: relative;
    margin: 0;
    padding: 0 0 0 22px;
    list-style: none;
}

.dxt-rs-timeline::before {
    content: "";
    position: absolute;
    top: 6px;
    bottom: 6px;
    left: 6px;
    width: 2px;
    background: #d6e4f5;
}

.dxt-rs-timeline li {
    position: relative;
    padding-bottom: 12px;
}

.dxt-rs-timeline li:last-child {
    padding-bottom: 0;
}

.dxt-rs-timeline li::before {
    content: "";
    position: absolute;
    top: 4px;
    left: -21px;
    width: 12px;
    height: 12px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: #2a6fd1;
}

.dxt-rs-timeline b {
    display: block;
    font-size: 13.5px;
    font-weight: 600;
}

.dxt-rs-timeline span {
    color: #6b778c;
    font-size: 12px;
}

/* ---------------------------------------------------------------- telas menores */
@media (max-width: 767.98px) {
    .dxt-rs-info {
        grid-template-columns: repeat(2, 1fr);
    }

    .dxt-rs-info-item {
        border-left: 0;
        border-top: 1px solid #d6e4f5;
    }

    .dxt-rs-info-item:first-child {
        grid-column: 1 / -1;
        border-top: 0;
    }

    .dxt-rs-placar,
    .dxt-rs-placar.dxt-rs-sem-pontuacao,
    .dxt-rs-grade {
        grid-template-columns: 1fr;
    }

    .dxt-rs-totais {
        flex-direction: row;
        justify-content: space-around;
    }

    .dxt-rs-totais > div + div {
        border-top: 0;
    }
}

@media (max-width: 575.98px) {
    .dxt-rs-info,
    .dxt-rs-placar,
    .dxt-rs-grade {
        margin-left: 12px;
        margin-right: 12px;
    }

    .dxt-rs-tiles {
        grid-template-columns: repeat(3, 1fr);
    }

    .dxt-rs-modal .modal-footer {
        flex-direction: column-reverse;
        gap: 8px;
    }
}

/* ==========================================================================================
 * Modal "Alterar responsável" (func_carrega_altera_usuario_responsavel, #modal1).
 * Usa o cabeçalho do dxt-vq-modal; dxt-ar-modal estreita o modal e esconde o rodapé padrão
 * (as ações ficam no corpo). As duas classes saem quando o modal fecha.
 * ========================================================================================== */
.dxt-ar-modal .modal-dialog {
    max-width: 600px;
}

.dxt-ar-modal .modal-body {
    padding: 20px 22px;
}

.dxt-ar-modal .modal-footer {
    display: none;
}

.dxt-ar {
    color: #233044;
}

/* Troca: responsável atual -> novo responsável */
.dxt-ar-troca {
    display: flex;
    align-items: center;
    gap: 12px;
}

.dxt-ar-pessoa {
    display: flex;
    flex: 1 1 0;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 12px 14px;
    border: 1px solid #e4e9f0;
    border-radius: 10px;
    background: #fff;
}

.dxt-ar-pessoa span:not(.dxt-ar-avatar) {
    display: block;
    color: #6b778c;
    font-size: 11.5px;
}

.dxt-ar-pessoa b {
    display: block;
    font-size: 14.5px;
    overflow-wrap: anywhere;
}

.dxt-ar-pessoa b em {
    color: #6b778c;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
}

.dxt-ar-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #eef1f5;
    color: #4a5561;
    font-size: 13px;
    font-weight: 700;
}

.dxt-ar-pessoa-novo {
    border-color: #9fc0ea;
    background: #f2f7fd;
}

.dxt-ar-pessoa-novo .dxt-ar-avatar {
    background: #2a6fd1;
    color: #fff;
}

.dxt-ar-seta {
    flex: 0 0 auto;
    color: #2a6fd1;
    font-size: 22px;
}

/* Aviso dos planos de ação */
.dxt-ar-aviso {
    display: flex;
    gap: 10px;
    margin-top: 14px;
    padding: 10px 14px;
    border-radius: 8px;
    background: #eaf1fb;
    color: #3a4252;
    font-size: 13px;
    line-height: 1.45;
}

.dxt-ar-aviso > .fa {
    margin-top: 2px;
    color: #2a6fd1;
    font-size: 16px;
}

/* Já é o responsável */
.dxt-ar-estado {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border: 1px solid #c7ead2;
    border-radius: 10px;
    background: #eef9f1;
}

.dxt-ar-estado-icone {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #23a05a;
    color: #fff;
    font-size: 17px;
}

.dxt-ar-estado b {
    display: block;
    color: #1e7b3a;
}

.dxt-ar-estado span:not(.dxt-ar-estado-icone) {
    color: #4a5561;
    font-size: 13px;
}

/* Ações */
.dxt-ar-acoes {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 18px;
}

.dxt-ar-btn-primario,
.dxt-ar-btn-secundario {
    padding: 8px 18px;
    border-radius: 6px;
    font-weight: 600;
}

.dxt-ar-btn-primario {
    border: 0;
    background: #2a6fd1;
    color: #fff;
}

.dxt-ar-btn-primario:hover {
    background: #2160bb;
    color: #fff;
}

.dxt-ar-btn-primario .fa {
    margin-right: 6px;
}

.dxt-ar-btn-secundario {
    border: 1px solid #c9d6e8;
    background: #fff;
    color: #233044;
}

.dxt-ar-btn-secundario:hover {
    background: #f2f5f9;
}

@media (max-width: 575.98px) {
    .dxt-ar-troca {
        flex-direction: column;
        align-items: stretch;
    }

    .dxt-ar-seta {
        align-self: center;
        transform: rotate(90deg);
    }

    .dxt-ar-acoes {
        flex-direction: column-reverse;
    }
}

/* ==========================================================================================
 * Modal "Editar formulário" (func_edita_formulario, #modal1).
 * Usa o cabeçalho do dxt-vq-modal; dxt-ef-modal ajusta largura/rodapé. As classes saem quando o modal fecha.
 * ========================================================================================== */
.dxt-ef-modal .modal-dialog {
    max-width: 1100px;
}

.dxt-ef-modal .modal-body {
    padding: 16px 20px 0;
}

.dxt-ef-modal .modal-footer {
    display: none;
}

.dxt-ef {
    color: #233044;
}

/* Seções */
.dxt-ef-secao {
    margin-bottom: 14px;
    padding: 14px 16px 16px;
    border: 1px solid #d3deec;
    border-radius: 10px;
    background: #fff;
}

/* Cabeçalho da seção: faixa clara igual ao "Parâmetros de Busca" das abas (.dxt-filtro-cab)
   + borda de destaque no azul Dext (#1b5da4) à esquerda */
.dxt-ef-secao-cab {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: -14px -16px 14px;
    padding: 9px 16px 9px 13px;
    border-bottom: 1px solid #d6e4f5;
    border-left: 4px solid #1b5da4;
    border-radius: 9px 9px 0 0;
    background: #e8f1fb;
}

.dxt-ef-secao-icone {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    border: 1px solid #c9d9ee;
    border-radius: 7px;
    background: #fff;
    color: #1b5da4;
    font-size: 15px;
}

.dxt-ef-icone-ok {
    border-color: #b7e2c3;
    color: #1e7b3a;
}

.dxt-ef-secao-cab h3 {
    margin: 0;
    color: #1b2f4d;
    font-size: 15px;
    font-weight: 700;
}

.dxt-ef-secao-cab p {
    margin: 0;
    color: #4a5b73;
    font-size: 12px;
}
/* Grade de campos: 4 colunas, campos largos ocupam 2 */
.dxt-ef-grade {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px 16px;
}

.dxt-ef-grade-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dxt-ef-externo {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed #d6e4f5;
}

.dxt-ef-campo {
    min-width: 0;
}

.dxt-ef-col-2 {
    grid-column: span 2;
}

.dxt-ef-campo label {
    display: block;
    margin-bottom: 4px;
    color: #3a4252;
    font-size: 12.5px;
    font-weight: 600;
}

.dxt-ef-campo .form-control {
    height: 36px;
    border-color: #ccd6e2;
    border-radius: 6px;
    font-size: 13.5px;
}

.dxt-ef-campo textarea.form-control {
    height: auto;
}

.dxt-ef-campo .form-control:focus {
    border-color: #2a6fd1;
    box-shadow: 0 0 0 3px rgba(42, 111, 209, .15);
}

/* O formulário é was-validated: só o campo obrigatório mostra a validação; os demais não ficam verdes */
.dxt-ef .was-validated .form-control:valid,
.dxt-ef .was-validated select.form-control:valid {
    padding-right: .75rem;
    border-color: #ccd6e2;
    background-image: none;
}

.dxt-ef .was-validated #txt_desc_formulario:invalid {
    border-color: #c62828;
}

/* Campos controlados pelo tipo de formulário (readonly) */
.dxt-ef-campo .form-control[readonly] {
    background-color: #f2f5f9;
    color: #6b778c;
}

.dxt-ef-ajuda {
    display: block;
    margin-top: 4px;
    color: #8a94a6;
    font-size: 11.5px;
    line-height: 1.35;
}

.dxt-ef-campo .bootstrap-select {
    width: 100% !important;
}

/* Listas duplas (grupos, lojas, e-mails) */
.dxt-ef-lista + .dxt-ef-lista {
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid #edf0f5;
}

.dxt-ef-lista-tit {
    margin-bottom: 8px;
    font-size: 13.5px;
    font-weight: 700;
}

.dxt-ef-lista-tit .fa {
    margin-right: 5px;
    color: #2a6fd1;
}

.dxt-ef-lista-tit small {
    margin-left: 6px;
    color: #6b778c;
    font-weight: 400;
}

.dxt-ef-check {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
    color: #3a4252;
    font-size: 13px;
    cursor: pointer;
}

.dxt-ef-lista-corpo {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 52px minmax(0, 1fr);
    gap: 10px;
    align-items: stretch;
}

.dxt-ef-lista-rot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 4px;
    color: #4a5561;
    font-size: 12px;
    font-weight: 600;
}

.dxt-ef-lista-rot-sel {
    color: #1e5fbd;
}

.dxt-ef-qtd {
    padding: 0 7px;
    border-radius: 999px;
    background: #eef1f5;
    color: #4a5561;
    font-size: 11px;
}

.dxt-ef-lista-rot-sel .dxt-ef-qtd {
    background: #eaf1fb;
    color: #1e5fbd;
}

.dxt-ef-filtro {
    margin-bottom: 6px;
    border-color: #ccd6e2;
    border-radius: 6px;
}

.dxt-ef-lista-col form {
    margin: 0;
}

.dxt-ef-lista-col select[multiple] {
    height: 190px;
    padding: 4px;
    border-color: #ccd6e2;
    border-radius: 6px;
    font-size: 13px;
}

.dxt-ef-lista-col select[multiple] option {
    padding: 4px 6px;
    border-radius: 4px;
}

.dxt-ef-lista-botoes {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
}

.dxt-ef-btn-mover {
    width: 100%;
    padding: 7px 0;
    border: 1px solid #9fc0ea;
    border-radius: 6px;
    background: #fff;
    color: #2a6fd1;
}

.dxt-ef-btn-mover:hover {
    background: #eaf1fb;
}

.dxt-ef-btn-remover {
    border-color: #f1c4c4;
    color: #c62828;
}

.dxt-ef-btn-remover:hover {
    background: #fdf1f1;
}

/* Cadastro: seção que só fica disponível depois de criar o formulário */
.dxt-ef-aviso-bloqueio {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 14px;
    border: 1px dashed #c9d6e8;
    border-radius: 8px;
    background: #f7f9fc;
    color: #4a5561;
    font-size: 13px;
    line-height: 1.45;
}

.dxt-ef-aviso-bloqueio > .fa {
    margin-top: 2px;
    color: #8a94a6;
    font-size: 17px;
}

.dxt-ef-aviso-bloqueio b {
    color: #233044;
}

/* Rodapé fixo com o Salvar */
.dxt-ef-rodape {
    position: sticky;
    bottom: 0;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 -20px;
    padding: 12px 20px;
    border-top: 1px solid #e4e9f0;
    background: #fff;
    box-shadow: 0 -4px 12px rgba(35, 48, 68, .06);
}

.dxt-ef-rodape > span {
    color: #6b778c;
    font-size: 12.5px;
}

.dxt-ef-rodape > span .fa {
    color: #2a6fd1;
}

.dxt-ef-btn-salvar {
    padding: 9px 22px;
    border: 0;
    border-radius: 6px;
    background: #2a6fd1;
    color: #fff;
    font-weight: 600;
}

.dxt-ef-btn-salvar:hover {
    background: #2160bb;
    color: #fff;
}

.dxt-ef-btn-salvar .fa {
    margin-right: 6px;
}

@media (max-width: 991.98px) {
    .dxt-ef-grade {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .dxt-ef-grade,
    .dxt-ef-grade-2 {
        grid-template-columns: minmax(0, 1fr);
    }

    .dxt-ef-col-2 {
        grid-column: auto;
    }

    .dxt-ef-lista-corpo {
        grid-template-columns: minmax(0, 1fr);
    }

    .dxt-ef-lista-botoes {
        flex-direction: row;
    }

    .dxt-ef-rodape {
        flex-direction: column;
        align-items: stretch;
    }
}

/* ==========================================================================================
 * Modal "Edição de pergunta" (func_edita_pergunta, #modal1).
 * Reaproveita o cabeçalho do dxt-vq-modal e as seções/campos/rodapé do dxt-ef; aqui só o que é próprio da tela.
 * ========================================================================================== */
.dxt-ep-modal .modal-dialog {
    max-width: min(1280px, 95vw);
}

/* Ocupa todas as colunas da grade */
.dxt-ep-col-total {
    grid-column: 1 / -1;
}

.dxt-ep-modal .dxt-vq-cab-titulo .dxt-pd-badge {
    margin-left: 8px;
    font-size: 11.5px;
    vertical-align: 3px;
}

.dxt-ep-obrig {
    color: #c62828;
}

.dxt-ep-ajuda-ico {
    margin-left: 4px;
    color: #8a94a6;
    font-size: 14px;
    cursor: help;
}

.dxt-ep-ajuda-ico:hover {
    color: #2a6fd1;
}

.dxt-ep .was-validated #txt_pergunta:invalid {
    border-color: #c62828;
}

.dxt-ep-contador {
    display: block;
    margin-top: 4px;
    color: #8a94a6;
    font-size: 11.5px;
    text-align: right;
}

.dxt-ef-campo .form-control:disabled {
    background-color: #f2f5f9;
    color: #6b778c;
    cursor: not-allowed;
}

.dxt-ep-grade-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px 18px;
}

/* Quadro informativo (tipo da pergunta) e quadro de dicas */
.dxt-ep-info,
.dxt-ep-dicas {
    border-radius: 8px;
    background: #eef4fc;
    color: #4a5b73;
    font-size: 12.5px;
    line-height: 1.45;
}

.dxt-ep-info {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 14px;
}

.dxt-ep-info strong {
    display: block;
    color: #1b5da4;
    font-size: 13.5px;
}

.dxt-ep-info-icone {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 26px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #2a6fd1;
    color: #fff;
    font-size: 13px;
}

/* Informações adicionais: editor + dicas ao lado */
.dxt-ep-info-grade {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 16px;
    align-items: start;
}

.dxt-ep-dicas {
    margin-top: 22px;
    padding: 14px 16px;
}

.dxt-ep-dicas-tit {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
    color: #1b5da4;
    font-size: 13.5px;
    font-weight: 700;
}

.dxt-ep-dicas-tit .dxt-ep-info-icone {
    border-radius: 6px;
}

.dxt-ep-dicas ul {
    margin: 0;
    padding-left: 18px;
}

.dxt-ep-dicas li + li {
    margin-top: 4px;
}

.dxt-ep .note-editor.note-frame {
    margin: 0;
    border-color: #ccd6e2;
    border-radius: 6px;
    background: #fff;
}

.dxt-ep .note-toolbar {
    border-bottom: 1px solid #e4e9f0;
    border-radius: 6px 6px 0 0;
    background: #f7f9fb;
}

/* Rodapé: Cancelar à esquerda, Salvar (verde) à direita */
.dxt-ep-btn-cancelar {
    padding: 9px 22px;
    border: 1px solid #ccd6e2;
    border-radius: 6px;
    background: #fff;
    color: #233044;
    font-weight: 600;
}

.dxt-ep-btn-cancelar:hover {
    background: #f2f5f9;
}

.dxt-ep-btn-salvar {
    padding: 9px 22px;
    border: 0;
    border-radius: 6px;
    background: #1e8e3e;
    color: #fff;
    font-weight: 600;
}

.dxt-ep-btn-salvar:hover {
    background: #187634;
    color: #fff;
}

.dxt-ep-btn-salvar .fa {
    margin-right: 6px;
}

@media (max-width: 991.98px) {
    .dxt-ep-grade-3 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dxt-ep-info-grade {
        grid-template-columns: minmax(0, 1fr);
    }

    .dxt-ep-dicas {
        margin-top: 0;
    }
}

@media (max-width: 575.98px) {
    .dxt-ep-grade-3 {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* ==========================================================================================
 * Barra de status das linhas (padrão das tabelas: Perguntas, Estatísticas, Painel de acompanhamento).
 * Uso: classe dxt-linha-status no <tr> e a cor em --dxt-st-cor (definida pela classe de status da linha).
 * A barra é desenhada na primeira célula, arredondada e afastada da borda.
 * ========================================================================================== */
tr.dxt-linha-status > td:first-child {
    position: relative;
    padding-left: 20px !important;
}

tr.dxt-linha-status > td:first-child::before {
    content: '';
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 8px;
    width: 4px;
    border-radius: 3px;
    background: var(--dxt-st-cor, transparent);
}

/* Cabeçalho padrão das tabelas (thead.dxt-thead): azul sólido, sem degradê, texto sem caixa alta */
thead.dxt-thead th {
    padding: 11px 12px !important;
    border: 0 !important;
    border-right: 1px solid rgba(255, 255, 255, .14) !important;
    background: #1b5da4 !important;
    color: #fff !important;
    font-size: 12.5px;
    font-weight: 700;
    text-align: left;
    text-transform: none;
    vertical-align: middle;
}

table.dxt-tp-tabela thead.dxt-thead th {
    white-space: nowrap;
}

thead.dxt-thead th:last-child {
    border-right: 0 !important;
}

thead.dxt-thead th.sorting:before,
thead.dxt-thead th.sorting:after,
thead.dxt-thead th.sorting_asc:before,
thead.dxt-thead th.sorting_asc:after,
thead.dxt-thead th.sorting_desc:before,
thead.dxt-thead th.sorting_desc:after {
    color: #fff;
}

/* Estatísticas e Painel de acompanhamento (func_php_classe_linha_status): mesmas cores dos cards */
tr.dxt-st-I { --dxt-st-cor: #2f80ed; }
tr.dxt-st-P { --dxt-st-cor: #f5a623; }
tr.dxt-st-F { --dxt-st-cor: #2e9e4f; }
tr.dxt-st-N,
tr.dxt-st-C { --dxt-st-cor: #6c7682; }
tr.dxt-st-problema { --dxt-st-cor: #d93a3a; }

/* ==========================================================================================
 * Aba Perguntas: tabela (func_carrega_perguntas, #table_pergunta).
 * Barra superior (total, busca, Colunas, Exportar), cabeçalho azul, pílulas de configuração e rodapé da paginação.
 * ========================================================================================== */
.dxt-tp-barra-topo {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin: 4px 0 12px;
}

.dxt-tp-total-icone {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    border: 1px solid #c9d9ee;
    border-radius: 7px;
    background: #fff;
    color: #2a6fd1;
    font-size: 16px;
}

.dxt-tp-total {
    color: #233044;
    font-size: 13.5px;
    font-weight: 600;
}

.dxt-tp-ferramentas {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
}

.dxt-tp-busca {
    position: relative;
    width: 290px;
}

.dxt-tp-busca .fa {
    position: absolute;
    top: 50%;
    left: 11px;
    transform: translateY(-50%);
    color: #8a94a6;
}

.dxt-tp-busca .form-control {
    height: 36px;
    padding-left: 32px;
    border-color: #ccd6e2;
    border-radius: 6px;
    font-size: 13px;
}

.dxt-tp-busca .form-control:focus {
    border-color: #2a6fd1;
    box-shadow: 0 0 0 3px rgba(42, 111, 209, .15);
}

.dxt-tp-btn-ferramenta {
    height: 36px;
    padding: 0 14px;
    border: 1px solid #9fc0ea;
    border-radius: 6px;
    background: #fff;
    color: #1b5da4;
    font-size: 13px;
    font-weight: 600;
}

.dxt-tp-btn-ferramenta:hover,
.dxt-tp-btn-ferramenta:focus {
    background: #eaf1fb;
    color: #1b5da4;
}

.dxt-tp-btn-ferramenta .fa {
    margin-right: 5px;
}

/* Exportar: verde do Excel */
.dxt-tp-btn-excel {
    border-color: #9fd3b0;
    color: #1d6f42;
}

.dxt-tp-btn-excel .fa {
    font-size: 15px;
}

.dxt-tp-btn-excel:hover,
.dxt-tp-btn-excel:focus {
    border-color: #1d6f42;
    background: #e8f5ed;
    color: #1d6f42;
}

/* Menu da confirmação de exclusão */
.dxt-tp-menu {
    min-width: 210px;
    padding: 6px 0;
    border: 1px solid #dde3ea;
    border-radius: 8px;
    box-shadow: 0 8px 22px rgba(35, 48, 68, .14);
    font-size: 13px;
}

.dxt-tp-menu .dropdown-item {
    padding: 7px 14px;
    color: #233044;
}

.dxt-tp-menu .dropdown-item .fa {
    width: 16px;
    margin-right: 6px;
    color: #6b778c;
}

.dxt-tp-menu .dropdown-item:active {
    background: #eaf1fb;
}

/* Tabela */
.dxt-tp-scroll {
    border: 1px solid #dde3ea;
    border-radius: 8px;
}

.dxt-tp-scroll.dxt-tp-menu-aberto {
    overflow: visible;
}

table.dxt-tp-tabela {
    width: 100% !important;
    margin: 0 !important;
    border-collapse: collapse !important;
    color: #233044;
    font-size: 13px;
}

table.dxt-tp-tabela tbody td {
    padding: 9px 12px;
    border: 0;
    border-right: 1px solid #edf0f5;
    border-bottom: 1px solid #e4e9f0;
    background: #fff;
    vertical-align: middle;
}

table.dxt-tp-tabela tbody td:last-child {
    border-right: 0;
}

table.dxt-tp-tabela tbody tr:hover td {
    background: #f7faff;
}

/* Pergunta inativa: linha inteira em vermelho suave */
table.dxt-tp-tabela tbody tr.dxt-tp-inativa td {
    border-bottom-color: #f6d9dd;
    background: #fdf3f4;
}

table.dxt-tp-tabela tbody tr.dxt-tp-inativa:hover td {
    background: #fbe9eb;
}

/* # com a barra de status à esquerda (padrão .dxt-linha-status): verde ativa / vermelha inativa */
table.dxt-tp-tabela .dxt-tp-col-cod {
    width: 60px;
    text-align: center;
    font-weight: 600;
}

tr.dxt-tp-ativa { --dxt-st-cor: #2e9e4f; }
tr.dxt-tp-inativa { --dxt-st-cor: #d6263b; }

.dxt-tp-pergunta {
    min-width: 220px;
    font-size: 13.5px;
    font-weight: 500;
}

.dxt-tp-forms {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 4px;
    padding: 1px 8px;
    border-radius: 999px;
    background: #e6f0fb;
    color: #1f5fae;
    font-size: 11.5px;
    cursor: pointer;
}

.dxt-tp-forms:hover {
    background: #d6e6f8;
}

.dxt-tp-tipo {
    white-space: nowrap;
}

.dxt-tp-sub,
.dxt-tp-data small {
    display: block;
    color: #6b778c;
    font-size: 11.5px;
}

.dxt-tp-data {
    white-space: nowrap;
}

/* Status e configurações em pílulas */
table.dxt-tp-tabela .dxt-tp-col-status {
    width: 80px;
    text-align: center;
}

table.dxt-tp-tabela .dxt-tp-col-config {
    min-width: 290px;
}

.dxt-tp-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.dxt-tp-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    border-radius: 5px;
    font-size: 11.5px;
    white-space: nowrap;
    cursor: default;
}

.dxt-tp-pill-sim {
    background: #e7f5ec;
    color: #1d6b34;
}

.dxt-tp-pill-sim .fa {
    color: #2e9e4f;
}

.dxt-tp-pill-nao {
    background: #f0f2f5;
    color: #4a5561;
}

.dxt-tp-pill-nao .fa {
    color: #d6263b;
}

.dxt-tp-pill-inativa {
    background: #fdecee;
    color: #c21f33;
}

/* Aba Formulários (func_carrega_formularios, #table_formularios) */
.dxt-fm-tabela .dxt-tp-pergunta {
    min-width: 240px;
}

.dxt-fm-externo {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 4px;
    padding: 1px 8px;
    border-radius: 999px;
    background: #e6f0fb;
    color: #1f5fae;
    font-size: 11.5px;
}

.dxt-fm-vazio {
    color: #b3bccb;
}

/* Tipo do formulário em badge */
.dxt-fm-tipo {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    border: 1px solid transparent;
    border-radius: 5px;
    font-size: 11.5px;
    font-weight: 600;
    white-space: nowrap;
}

.dxt-fm-tipo-checklist {
    border-color: #c9d9ee;
    background: #eaf1fb;
    color: #1b5da4;
}

.dxt-fm-tipo-auditoria {
    border-color: #ddd0f2;
    background: #f3eefc;
    color: #6a3fb5;
}

.dxt-fm-tipo-na {
    border-color: #dde3ea;
    background: #f0f2f5;
    color: #6b778c;
    font-weight: 400;
}

/* Legenda das cores das linhas (barra superior): cada item é uma miniatura da linha (fundo suave +
   barrinha à esquerda), com a contagem; clicar filtra a tabela e clicar de novo limpa */
.dxt-fm-legenda {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-left: 10px;
    padding-left: 14px;
    border-left: 1px solid #e4e9f0;
}

.dxt-fm-chip {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 32px;
    padding: 0 10px 0 18px;
    border: 1px solid transparent;
    border-radius: 6px;
    color: #233044;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    transition: box-shadow .15s, border-color .15s;
}

.dxt-fm-chip::before {
    content: '';
    position: absolute;
    top: 7px;
    bottom: 7px;
    left: 7px;
    width: 4px;
    border-radius: 3px;
}

.dxt-fm-chip:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(42, 111, 209, .18);
}

.dxt-fm-chip-qtd {
    min-width: 22px;
    padding: 3px 7px;
    border-radius: 999px;
    background: #fff;
    font-size: 11.5px;
    text-align: center;
}

.dxt-fm-chip-alerta { border-color: #f6e0bd; background: #fdf3e4; }
.dxt-fm-chip-alerta::before { background: #f5a623; }
.dxt-fm-chip-alerta .dxt-fm-chip-qtd { color: #9a5a00; }
.dxt-fm-chip-alerta:hover { background: #fbe9cc; }

.dxt-fm-chip-inativo { border-color: #f6d9dd; background: #fdf3f4; }
.dxt-fm-chip-inativo::before { background: #d6263b; }
.dxt-fm-chip-inativo .dxt-fm-chip-qtd { color: #c21f33; }
.dxt-fm-chip-inativo:hover { background: #fbe9eb; }

/* Filtro ligado: borda na cor do status */
.dxt-fm-chip-alerta.dxt-fm-chip-ativo { border-color: #f5a623; box-shadow: 0 0 0 1px #f5a623; }
.dxt-fm-chip-inativo.dxt-fm-chip-ativo { border-color: #d6263b; box-shadow: 0 0 0 1px #d6263b; }

/* Filtro de Status sem INATIVO: avisa que os inativos estão ocultos e oferece exibi-los */
.dxt-fm-chip-oculto {
    border-style: dashed;
    border-color: #e9b3ba;
    background: #fff;
    color: #6b778c;
    font-weight: 400;
}

.dxt-fm-chip-oculto::before {
    opacity: .45;
}

.dxt-fm-chip-oculto .fa {
    color: #b3bccb;
}

.dxt-fm-chip-acao {
    color: #c21f33;
    font-weight: 600;
    text-decoration: underline;
}

.dxt-fm-chip-oculto:hover {
    background: #fdf3f4;
}

/* Nenhum formulário nessa situação: só informa (0) */
.dxt-fm-chip:disabled {
    opacity: .55;
    cursor: default;
}

@media (max-width: 767.98px) {
    .dxt-fm-legenda {
        margin-left: 0;
        padding-left: 0;
        border-left: 0;
    }
}

.dxt-fm-grupos {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    min-width: 200px;
    max-width: 320px;
}

.dxt-fm-grupo {
    padding: 2px 8px;
    border: 1px solid #c9d9ee;
    border-radius: 5px;
    background: #eef4fc;
    color: #1f5fae;
    font-size: 11.5px;
    font-weight: 600;
    white-space: nowrap;
}

.dxt-fm-sem-grupo {
    border-color: #dde3ea;
    background: #f0f2f5;
    color: #6b778c;
    font-weight: 400;
}

/* Ações: botões em linhas de 4 (montadas pelo script dxtAjustaAcoesFormularios) */
table.dxt-tp-tabela .dxt-fm-col-acoes {
    width: 160px;
    text-align: center;
}

.dxt-acoes-formulario {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
    white-space: nowrap;
}

.dxt-acoes-formulario .dxt-acoes-linha {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 5px;
}

.dxt-acoes-formulario .dxt-acao-item {
    display: inline-flex;
    align-items: center;
}

.dxt-acoes-formulario .dxt-acao-item > .btn,
.dxt-acoes-formulario .dxt-acao-item > .dropdown > .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border-radius: 7px;
}

/* Formulário ativo com perguntas sem respostas associadas (triângulo piscando): barra e linha em laranja.
   Inativo não recebe esta classe: o vermelho (dxt-tp-inativa) tem prioridade. */
tr.dxt-linha-status.dxt-fm-alerta {
    --dxt-st-cor: #f5a623;
}

table.dxt-tp-tabela tbody tr.dxt-fm-alerta td {
    border-bottom-color: #f6e0bd;
    background: #fdf3e4;
}

table.dxt-tp-tabela tbody tr.dxt-fm-alerta:hover td {
    background: #fbe9cc;
}

/* Aba Checklists (func_carrega_questionarios, #table_questionarios): sem DataTable, com accordion por formulário */
.dxt-qs-resumo {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: 6px;
    padding: 4px 10px;
    border-radius: 6px;
    background: #eaf1fb;
    color: #1b5da4;
    font-size: 12.5px;
    font-weight: 600;
}

table.dxt-tp-tabela .dxt-qs-col-acoes {
    width: 1%;
    text-align: center;
    white-space: nowrap;
}

.dxt-qs-tabela .dxt-acoes-questionario .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 32px;
    min-width: 32px;
    padding: 0 9px;
    border-radius: 7px;
}

/* Botão do accordion: quantidade em andamento + seta que gira quando aberto */
.dxt-qs-btn-pendentes {
    border: 1px solid #c9d9ee;
    background: #eaf1fb;
    color: #1b5da4;
    font-weight: 600;
}

.dxt-qs-btn-pendentes:hover,
.dxt-qs-btn-pendentes:not(.collapsed) {
    border-color: #1b5da4;
    background: #1b5da4;
    color: #fff;
}

.dxt-qs-qtd {
    font-size: 12.5px;
}

.dxt-qs-seta {
    font-size: 10px;
    transition: transform .2s;
}

.dxt-qs-btn-pendentes:not(.collapsed) .dxt-qs-seta {
    transform: rotate(180deg);
}

/* Linha de detalhe (accordion): sem espaço quando fechada; conteúdo recuado em fundo claro quando aberta */
table.dxt-tp-tabela > tbody > tr.dxt-questionario-detail-row > td.hiddenRow,
table.dxt-tp-tabela > tbody > tr.dxt-questionario-detail-row:hover > td.hiddenRow {
    padding: 0;
    border-bottom: 0;
    background: #f7f9fb;
}

.dxt-qs-detalhe {
    margin: 0 12px 0 36px;
    padding: 12px 0 14px;
}

.dxt-qs-detalhe-tit {
    margin-bottom: 8px;
    color: #233044;
    font-size: 13px;
    font-weight: 700;
}

.dxt-qs-detalhe-tit .fa {
    margin-right: 5px;
    color: #2a6fd1;
}

.dxt-qs-detalhe-tit small {
    margin-left: 6px;
    color: #6b778c;
    font-weight: 400;
}

.dxt-qs-aviso-inativo {
    color: #c21f33;
    font-weight: 600;
}

.dxt-qs-detalhe-vazio {
    color: #6b778c;
    font-size: 12.5px;
}

/* Tabela interna: cabeçalho claro para não competir com o da tabela principal */
table.dxt-qs-sub {
    border: 1px solid #dde3ea;
    border-radius: 8px;
    border-collapse: separate !important;
    border-spacing: 0;
    overflow: hidden;
    background: #fff;
}

table.dxt-qs-sub thead.dxt-thead th {
    padding: 8px 12px !important;
    border-right: 0 !important;
    border-bottom: 1px solid #dde3ea !important;
    background: #eef4fc !important;
    color: #233044 !important;
    font-size: 12px;
}

table.dxt-qs-sub tbody tr:last-child td {
    border-bottom: 0;
}

table.dxt-tp-tabela .dxt-qs-col-continuar {
    width: 1%;
    text-align: center;
    white-space: nowrap;
}

.dxt-qs-loja {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
}

.dxt-qs-loja .fa {
    color: #8a94a6;
}

.dxt-qs-st {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    border-radius: 5px;
    font-size: 11.5px;
    font-weight: 600;
    white-space: nowrap;
}

.dxt-qs-st-iniciado {
    background: #eaf1fb;
    color: #1f5fae;
}

.dxt-qs-st-pendente {
    background: #fdf3e4;
    color: #9a5a00;
}

.dxt-qs-btn-continuar {
    padding: 5px 12px;
    border-radius: 7px;
    font-size: 12.5px;
    font-weight: 600;
}

/* Aba Plano de Ação: tabelas Resolver e Reavaliar (func_php_linha_plano_acao) */
.dxt-pa-tabela .dxt-pa-checklist {
    min-width: 150px;
    font-weight: 600;
}

.dxt-pa-pergunta,
.dxt-pa-resposta {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    min-width: 220px;
}

.dxt-pa-resposta {
    align-items: center;
    margin-top: 5px;
}

/* Rótulos P / R em quadradinho */
.dxt-pa-rot {
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    border-radius: 4px;
    background: #eef1f5;
    color: #6b778c;
    font-size: 10.5px;
    font-weight: 700;
    line-height: 18px;
    text-align: center;
}

.dxt-pa-resposta .dxt-pd-resposta {
    font-size: 11.5px;
}

.dxt-pa-obs {
    max-width: 240px;
    color: #4a5561;
    font-size: 12.5px;
}

/* Prazo: barra fina + texto; crítico (<= 10%) em vermelho; expirado só com o aviso */
table.dxt-tp-tabela .dxt-pa-col-prazo {
    min-width: 140px;
}

.dxt-pa-prazo span {
    display: block;
    margin-top: 4px;
    color: #6b778c;
    font-size: 11.5px;
}

.dxt-pa-prazo-trilho {
    height: 6px;
    border-radius: 3px;
    background: #e9edf1;
    overflow: hidden;
}

.dxt-pa-prazo-barra {
    height: 100%;
    border-radius: 3px;
}

.dxt-pa-prazo-ok .dxt-pa-prazo-barra { background: #2e9e4f; }
.dxt-pa-prazo-critico .dxt-pa-prazo-barra { background: #d6263b; }
.dxt-pa-prazo-critico span { color: #c21f33; font-weight: 600; }

.dxt-pa-prazo-expirado {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    border-radius: 5px;
    background: #fdecee;
    color: #c21f33;
    font-size: 11.5px;
    font-weight: 600;
    white-space: nowrap;
}

.dxt-pa-pessoa {
    display: inline-flex;
    align-items: flex-start;
    gap: 6px;
    font-size: 12.5px;
}

.dxt-pa-pessoa .fa {
    margin-top: 2px;
    color: #8a94a6;
}

/* Responsável (grupos) em badges: coluna mais estreita que a de "Grupos de acesso" */
.dxt-fm-grupos.dxt-pa-grupos {
    min-width: 140px;
    max-width: 240px;
}

/* Ações: mesmos botões coloridos, em tamanho padronizado */
table.dxt-tp-tabela .dxt-pa-col-acoes {
    width: 1%;
    text-align: center;
    white-space: nowrap;
}

.dxt-pa-acoes {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.dxt-pa-acoes > .btn,
.dxt-pa-acoes > .dropdown > .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border-radius: 7px;
}

/* Aba Respostas: legenda (emoji/imagem) em tamanho contido */
.dxt-tr-legenda {
    color: #4a5561;
    font-size: 12.5px;
}

.dxt-tr-legenda img {
    max-width: 32px !important;
    max-height: 32px !important;
    width: auto !important;
    height: auto !important;
}

/* Informações (HTML do editor): altura limitada e imagens reduzidas */
.dxt-tp-info {
    min-width: 200px;
    max-width: 340px;
    max-height: 92px;
    overflow: hidden;
    color: #4a5561;
    font-size: 12.5px;
    line-height: 1.4;
}

.dxt-tp-info p {
    margin: 0;
}

.dxt-tp-info img {
    max-width: 170px !important;
    max-height: 70px !important;
    width: auto !important;
    height: auto !important;
    border-radius: 4px;
}

/* Ações */
table.dxt-tp-tabela .dxt-tp-col-acoes {
    width: 96px;
    text-align: center;
}

.dxt-tp-acoes {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.dxt-tp-btn-editar,
.dxt-tp-btn-excluir {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border-radius: 7px;
}

.dxt-tp-btn-editar {
    border: 0;
    background: #f6c343;
    color: #233044;
}

.dxt-tp-btn-editar:hover {
    background: #eab532;
}

.dxt-tp-btn-excluir {
    border: 1px solid #f1c4c4;
    background: #fff;
    color: #c62828;
}

.dxt-tp-btn-excluir:hover {
    background: #fdf1f1;
    color: #c62828;
}

.dxt-tp-btn-excluir:disabled {
    border-color: #e4e9f0;
    background: #f2f5f9;
    color: #b3bccb;
    opacity: 1;
}

/* Confirmação da exclusão (Sim/Não) */
.dxt-tp-confirma {
    min-width: 0;
    padding: 10px 14px;
    text-align: center;
}

.dxt-tp-confirma-texto {
    margin-bottom: 8px;
    color: #233044;
    font-weight: 600;
    white-space: nowrap;
}

.dxt-tp-confirma-botoes {
    display: flex;
    justify-content: center;
    gap: 6px;
}

@media (max-width: 767.98px) {
    .dxt-tp-ferramentas {
        width: 100%;
        margin-left: 0;
    }

    .dxt-tp-busca {
        flex: 1;
        width: auto;
    }
}

/* ==========================================================================================
 * Modais "Cadastro de resposta" e "Edição de resposta" (func_php_form_resposta, #modal1).
 * Reaproveita o padrão da edição de pergunta (dxt-ef-*, dxt-ep-*); aqui só a largura e a prévia do emoji.
 * ========================================================================================== */
.dxt-er-modal .modal-dialog {
    max-width: min(860px, 95vw);
}

.dxt-er-modal .dxt-vq-cab-titulo .dxt-pd-badge {
    margin-left: 8px;
    font-size: 11.5px;
    vertical-align: 3px;
}

.dxt-er-previa {
    align-items: center;
}

/* Botão de exemplo igual ao do preenchimento no modo Emoji */
.dxt-er-previa-botao {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 48px;
    height: 48px;
    padding: 0 8px;
    border: 1px solid #ccd6e2;
    border-radius: 8px;
    background: #fff;
    color: #233044;
    font-size: 26px;
    line-height: 1;
}

/* Sem legenda: o botão mostra o texto da resposta */
.dxt-er-previa-botao.dxt-er-previa-texto {
    max-width: 220px;
    overflow: hidden;
    font-size: 13px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ==========================================================================================
 * Modal "QR Code do formulário" (func_qrcode_formulario, #modal_info1).
 * O #modal_info1 não tem cabeçalho: o dxt-vq-cab e o rodapé são desenhados no corpo (dxt-qr-*).
 * ========================================================================================== */
.dxt-qr-modal .modal-dialog {
    max-width: min(760px, 95vw);
}

.dxt-qr-modal .modal-content {
    border: 0;
    border-radius: 12px;
    overflow: hidden;
}

.dxt-qr-modal .modal-body {
    padding: 0;
}

.dxt-qr-modal .modal-footer {
    display: none;
}

.dxt-qr {
    color: #233044;
}

.dxt-qr-cab {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 18px 22px;
    border-bottom: 1px solid #e4e9f0;
    background: #fff;
}

.dxt-qr-cab .dxt-vq-cab-sub {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.dxt-qr-corpo {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 22px;
    align-items: start;
    padding: 20px 22px;
    background: #f7f9fb;
}

.dxt-qr-imagem {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 14px;
    border: 1px solid #dde3ea;
    border-radius: 12px;
    background: #fff;
    text-align: center;
}

.dxt-qr-imagem img {
    display: block;
    width: 100%;
    max-width: 250px;
    height: auto;
}

.dxt-qr-imagem small {
    color: #6b778c;
    font-size: 12px;
}

.dxt-qr-info {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.dxt-qr-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.dxt-qr-rotulo {
    margin: 0;
    color: #6b778c;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .3px;
}

.dxt-qr-valor {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
}

.dxt-qr-sub {
    display: block;
    margin-top: 4px;
    color: #6b778c;
    font-size: 12px;
}

.dxt-qr-validade {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 12.5px;
    font-weight: 600;
}

.dxt-qr-validade-livre {
    background: #e7f5ec;
    color: #1d6b34;
}

.dxt-qr-validade-prazo {
    background: #fdf3e4;
    color: #9a5a00;
}

/* Link + botão Copiar no mesmo campo */
.dxt-qr-link {
    display: flex;
}

.dxt-qr-link .form-control {
    height: 38px;
    border-color: #ccd6e2;
    border-right: 0;
    border-radius: 6px 0 0 6px;
    background: #fff;
    color: #4a5561;
    font-size: 12.5px;
}

.dxt-qr-btn-copiar {
    flex: 0 0 auto;
    height: 38px;
    padding: 0 14px;
    border: 1px solid #2a6fd1;
    border-radius: 0 6px 6px 0;
    background: #2a6fd1;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
}

.dxt-qr-btn-copiar:hover {
    background: #2160bb;
    color: #fff;
}

/* Rodapé: Fechar à esquerda, Imprimir e Compartilhar à direita */
.dxt-qr-rodape {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 14px 22px;
    border-top: 1px solid #e4e9f0;
    background: #fff;
}

.dxt-qr-rodape-acoes {
    display: flex;
    gap: 8px;
}

.dxt-qr-btn-sec,
.dxt-qr-btn-principal {
    padding: 9px 18px;
    border-radius: 6px;
    font-weight: 600;
}

.dxt-qr-btn-sec {
    border: 1px solid #ccd6e2;
    background: #fff;
    color: #233044;
}

.dxt-qr-btn-sec:hover {
    background: #f2f5f9;
}

.dxt-qr-btn-principal {
    border: 0;
    background: #1e8e3e;
    color: #fff;
}

.dxt-qr-btn-principal:hover {
    background: #187634;
    color: #fff;
}

.dxt-qr-rodape .fa {
    margin-right: 5px;
}

@media (max-width: 640px) {
    .dxt-qr-corpo {
        grid-template-columns: minmax(0, 1fr);
    }

    .dxt-qr-rodape {
        flex-direction: column-reverse;
        align-items: stretch;
    }

    .dxt-qr-rodape-acoes {
        justify-content: stretch;
    }

    .dxt-qr-rodape-acoes .btn {
        flex: 1;
    }
}

/* ==========================================================================================
 * Modal "Formulários que utilizam esta pergunta" (func_exibe_formularios_pergunta, #modal2).
 * Cabeçalho do dxt-vq-modal + barra superior e tabela no padrão da aba Perguntas (dxt-tp-*, dxt-thead).
 * ========================================================================================== */
.dxt-fp-modal .modal-dialog {
    max-width: 880px;
}

/* "Formulários que utilizam esta resposta" (func_exibe_perguntas_resposta): tem a coluna Pergunta a mais */
.dxt-fp-modal.dxt-fp-largo .modal-dialog {
    max-width: min(1040px, 95vw);
}

.dxt-fp-modal .dxt-vq-cab-sub {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.dxt-fp-modal .dxt-tp-scroll {
    background: #fff;
}

.dxt-fp-modal .dataTables_info {
    color: #6b778c;
    font-size: 12.5px;
}

.dxt-fp-sub {
    margin-left: 6px;
    color: #6b778c;
    font-size: 12px;
    font-weight: 400;
}

.dxt-fp-setor {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 2px 9px;
    border-radius: 999px;
    background: #f0f2f5;
    color: #4a5561;
    font-size: 12px;
    white-space: nowrap;
}

.dxt-fp-setor .fa {
    color: #8a94a6;
}

/* Sem formulários */
.dxt-fp-vazio {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 36px 16px;
    border: 1px dashed #c9d6e8;
    border-radius: 10px;
    background: #fff;
    color: #6b778c;
    font-size: 13px;
    text-align: center;
}

.dxt-fp-vazio strong {
    color: #233044;
    font-size: 15px;
}

.dxt-fp-vazio-icone {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    margin-bottom: 8px;
    border-radius: 50%;
    background: #eaf1fb;
    color: #2a6fd1;
    font-size: 20px;
}

/* Botão Fechar no mesmo estilo do #modal1 com dxt-vq-modal */
.dxt-fp-modal #btn_fecha_modal2 {
    padding: 8px 18px;
    border: 1px solid #9fc0ea;
    border-radius: 6px;
    background: #fff;
    color: #2a6fd1;
    font-weight: 600;
}

.dxt-fp-modal #btn_fecha_modal2:hover {
    background: #eaf1fb;
}

/* ==========================================================================================
 * Modal "Replicar formulário" (func_replica_formulario, #modal1). Usa o cabeçalho do dxt-vq-modal
 * e os botões .dxt-ar-btn-*; dxt-rp-modal estreita o modal e esconde o rodapé padrão.
 * ========================================================================================== */
.dxt-rp-modal .modal-dialog {
    max-width: 620px;
}

.dxt-rp-modal .modal-body {
    padding: 18px 22px;
}

.dxt-rp-modal .modal-footer {
    display: none;
}

.dxt-rp {
    color: #233044;
}

.dxt-rp-origem {
    margin-bottom: 14px;
    padding: 10px 14px;
    border-left: 4px solid #1b5da4;
    border-radius: 6px;
    background: #e8f1fb;
}

.dxt-rp-origem span {
    display: block;
    color: #4a5b73;
    font-size: 11.5px;
}

.dxt-rp-origem b {
    font-size: 14px;
    overflow-wrap: anywhere;
}

.dxt-rp-rot {
    display: block;
    margin-bottom: 4px;
    color: #3a4252;
    font-size: 12.5px;
    font-weight: 600;
}

.dxt-rp-nome {
    height: 40px;
    border-color: #ccd6e2;
    border-radius: 6px;
    font-size: 14px;
}

.dxt-rp-nome:focus {
    border-color: #2a6fd1;
    box-shadow: 0 0 0 3px rgba(42, 111, 209, .15);
}

.dxt-rp-tit {
    margin: 16px 0 6px;
    color: #3a4252;
    font-size: 12.5px;
    font-weight: 600;
}

.dxt-rp-lista {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 14px;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid #e4e9f0;
    border-radius: 8px;
    background: #fff;
    list-style: none;
    font-size: 13px;
}

.dxt-rp-lista li {
    display: flex;
    align-items: baseline;
    gap: 6px;
}

.dxt-rp-lista li:last-child {
    grid-column: 1 / -1;
    color: #4a5561;
}

.dxt-rp-lista .fa {
    width: 16px;
    color: #2a6fd1;
    text-align: center;
}

.dxt-rp-aviso {
    display: flex;
    gap: 10px;
    margin-top: 12px;
    padding: 10px 14px;
    border: 1px solid #f6e0b0;
    border-radius: 8px;
    background: #fff8e8;
    color: #5c4a1a;
    font-size: 12.5px;
    line-height: 1.45;
}

.dxt-rp-aviso > .fa {
    margin-top: 2px;
    color: #b7791f;
    font-size: 15px;
}

.dxt-rp-aviso ul {
    margin: 2px 0 0;
    padding-left: 18px;
}

.dxt-rp-acoes {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 18px;
}

@media (max-width: 575.98px) {
    .dxt-rp-lista {
        grid-template-columns: 1fr;
    }

    .dxt-rp-acoes {
        flex-direction: column-reverse;
    }
}

/* ==========================================================================================
 * Modal "Assinaturas do formulário" (func_form_assinatura, #modal1). Usa o cabeçalho do dxt-vq-modal
 * e os botões .dxt-ar-btn-*; dxt-as-modal estreita o modal (o rodapé padrão "Fechar detalhes" continua).
 * ========================================================================================== */
.dxt-as-modal .modal-dialog {
    max-width: 680px;
}

.dxt-as-modal .modal-body {
    padding: 18px 22px;
}

.dxt-as {
    color: #233044;
}

.dxt-as-cab-lista {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 9px 14px 9px 11px;
    border: 1px solid #d6e4f5;
    border-left: 4px solid #1b5da4;
    border-bottom: 0;
    border-radius: 8px 8px 0 0;
    background: #e8f1fb;
    color: #1b2f4d;
    font-size: 13.5px;
    font-weight: 700;
}

.dxt-as-qtd {
    padding: 0 8px;
    border-radius: 999px;
    background: #fff;
    color: #1b5da4;
    font-size: 12px;
}

.dxt-as-lista {
    margin: 0;
    padding: 0;
    border: 1px solid #e4e9f0;
    border-radius: 0 0 8px 8px;
    background: #fff;
    list-style: none;
}

.dxt-as-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
}

.dxt-as-item + .dxt-as-item {
    border-top: 1px solid #edf0f5;
}

.dxt-as-ordem {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #eaf1fb;
    color: #1b5da4;
    font-size: 13px;
    font-weight: 700;
}

.dxt-as-ordem-vazia {
    background: #f2f5f9;
    color: #a3acba;
}

.dxt-as-info {
    flex: 1 1 auto;
    min-width: 0;
}

.dxt-as-info b {
    display: block;
    font-size: 14px;
    overflow-wrap: anywhere;
}

.dxt-as-info small {
    color: #8a94a6;
    font-size: 12px;
}

.dxt-as-uso {
    color: #1e7b3a;
}

.dxt-as-uso-zero {
    color: #8a94a6;
}

.dxt-as-btn-excluir {
    width: 34px;
    height: 34px;
    padding: 0;
    border: 1px solid #f1c4c4;
    border-radius: 6px;
    background: #fff;
    color: #c62828;
}

.dxt-as-btn-excluir::after {
    display: none;
}

.dxt-as-btn-excluir:hover {
    background: #fdf1f1;
}

.dxt-as-conf {
    width: 290px;
    padding: 12px 14px;
    font-size: 13px;
    white-space: normal;
}

.dxt-as-conf-aviso {
    margin: 8px 0 0;
    padding: 8px 10px;
    border-radius: 6px;
    background: #fff8e8;
    color: #5c4a1a;
    font-size: 12px;
    line-height: 1.4;
}

.dxt-as-conf-aviso .fa {
    color: #b7791f;
}

.dxt-as-conf-acoes {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 10px;
}

.dxt-as-btn-confirma {
    border: 0;
    border-radius: 6px;
    background: #c62828;
    color: #fff;
    font-weight: 600;
}

.dxt-as-btn-confirma:hover {
    background: #a51f1f;
    color: #fff;
}

.dxt-as-vazio {
    padding: 16px 14px;
    color: #6b778c;
    font-size: 13px;
}

.dxt-as-vazio .fa {
    margin-right: 6px;
    color: #8a94a6;
}

/* Adicionar */
.dxt-as-novo {
    margin-top: 14px;
    padding: 12px 14px 14px;
    border: 1px dashed #c9d6e8;
    border-radius: 8px;
    background: #f7f9fc;
}

.dxt-as-novo-tit {
    margin-bottom: 8px;
    font-size: 13.5px;
    font-weight: 700;
}

.dxt-as-novo-tit .fa {
    color: #2a6fd1;
}

.dxt-as-novo-campos {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 90px auto;
    gap: 10px;
    align-items: end;
}

.dxt-as-novo-campos label {
    display: block;
    margin-bottom: 3px;
    color: #3a4252;
    font-size: 12px;
    font-weight: 600;
}

.dxt-as-novo-campos .form-control {
    height: 38px;
    border-color: #ccd6e2;
    border-radius: 6px;
}

.dxt-as-novo-campos .btn {
    height: 38px;
    white-space: nowrap;
}

@media (max-width: 575.98px) {
    .dxt-as-novo-campos {
        grid-template-columns: minmax(0, 1fr) 80px;
    }

    .dxt-as-novo-campos .btn {
        grid-column: 1 / -1;
    }
}

/* ==========================================================================================
 * Modal "Ordem dos setores" (func_config_ordenacao, #modal1). Usa o cabeçalho do dxt-vq-modal;
 * dxt-or-modal estreita o modal (o rodapé padrão "Fechar detalhes" continua).
 * ========================================================================================== */
.dxt-or-modal .modal-dialog {
    max-width: 640px;
}

.dxt-or-modal .modal-body {
    padding: 18px 22px;
}

.dxt-or {
    color: #233044;
}

.dxt-or-cab-lista {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 14px 9px 11px;
    border: 1px solid #d6e4f5;
    border-left: 4px solid #1b5da4;
    border-bottom: 0;
    border-radius: 8px 8px 0 0;
    background: #e8f1fb;
    color: #1b2f4d;
    font-size: 13px;
    font-weight: 600;
}

.dxt-or-cab-lista .fa {
    color: #1b5da4;
}

.dxt-or-status {
    color: #1e7b3a;
    font-size: 12px;
    white-space: nowrap;
}

.dxt-or-lista {
    margin: 0;
    padding: 8px;
    border: 1px solid #e4e9f0;
    border-radius: 0 0 8px 8px;
    background: #f7f9fc;
    list-style: none;
}

.dxt-or-item {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
    padding: 8px 10px;
    border: 1px solid #dfe6ef;
    border-radius: 8px;
    background: #fff;
    cursor: grab;
    transition: box-shadow .15s, border-color .15s, background-color .3s;
}

.dxt-or-item:last-child {
    margin-bottom: 0;
}

.dxt-or-item:hover {
    border-color: #9fc0ea;
    box-shadow: 0 2px 8px rgba(35, 48, 68, .08);
}

.dxt-or-item.ui-sortable-helper {
    cursor: grabbing;
    border-color: #2a6fd1;
    box-shadow: 0 8px 20px rgba(35, 48, 68, .18);
}

.dxt-or-movido {
    background: #eaf1fb;
}

.dxt-or-placeholder {
    margin-bottom: 6px;
    border: 2px dashed #9fc0ea;
    border-radius: 8px;
    background: #eef4fc;
    visibility: visible !important;
}

.dxt-or-alca {
    color: #a3acba;
    font-size: 14px;
}

.dxt-or-pos {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #1b5da4;
    color: #fff;
    font-size: 12.5px;
    font-weight: 700;
}

.dxt-or-info {
    flex: 1 1 auto;
    min-width: 0;
}

.dxt-or-info b {
    display: block;
    font-size: 13.5px;
    overflow-wrap: anywhere;
}

.dxt-or-info small {
    color: #8a94a6;
    font-size: 12px;
}

.dxt-or-botoes {
    display: flex;
    gap: 4px;
}

.dxt-or-btn {
    width: 30px;
    height: 30px;
    padding: 0;
    border: 1px solid #c9d6e8;
    border-radius: 6px;
    background: #fff;
    color: #2a6fd1;
    font-size: 12px;
}

.dxt-or-btn:hover {
    background: #eaf1fb;
}

.dxt-or-item:first-child .dxt-or-btn:first-child,
.dxt-or-item:last-child .dxt-or-btn:last-child {
    opacity: .35;
    pointer-events: none;
}

.dxt-or-aviso,
.dxt-or-vazio {
    margin-top: 10px;
    padding: 9px 12px;
    border-radius: 8px;
    background: #eaf1fb;
    color: #3a4252;
    font-size: 12.5px;
}

.dxt-or-aviso .fa,
.dxt-or-vazio .fa {
    color: #2a6fd1;
}

/* ==========================================================================================
 * Modal "Agendamento do checklist" (func_config_cron_formulario, #modal1). Usa o cabeçalho do
 * dxt-vq-modal e os botões .dxt-ar-btn-*; dxt-ag-modal ajusta largura e esconde o rodapé padrão.
 * As listas originais ficam ocultas (.dxt-ag-oculto) e os botões (.dxt-ag-chip) marcam as opções.
 * ========================================================================================== */
.dxt-ag-modal .modal-dialog {
    max-width: 860px;
}

.dxt-ag-modal .modal-body {
    padding: 16px 20px;
}

.dxt-ag-modal .modal-footer {
    display: none;
}

.dxt-ag {
    color: #233044;
}

.dxt-ag-oculto {
    display: none !important;
}

/* Resumo em português da regra */
.dxt-ag-resumo {
    display: flex;
    gap: 12px;
    margin-bottom: 14px;
    padding: 12px 14px 12px 12px;
    border: 1px solid #d6e4f5;
    border-left: 4px solid #1b5da4;
    border-radius: 8px;
    background: #e8f1fb;
    font-size: 13.5px;
    line-height: 1.45;
}

.dxt-ag-resumo > .fa {
    margin-top: 2px;
    color: #1b5da4;
    font-size: 20px;
}

.dxt-ag-resumo b {
    color: #1b2f4d;
}

.dxt-ag-resumo-off {
    border-color: #e4e9f0;
    border-left-color: #8a94a6;
    background: #f2f5f9;
}

.dxt-ag-resumo-off > .fa {
    color: #8a94a6;
}

.dxt-ag-resumo-aviso {
    margin-top: 6px;
    color: #7a5a12;
    font-size: 12.5px;
}

.dxt-ag-resumo-aviso .fa {
    color: #b7791f;
}

.dxt-ag-proximas {
    margin-top: 6px;
    color: #4a5b73;
    font-size: 12.5px;
}

.dxt-ag-proximas em {
    display: inline-block;
    margin: 2px 4px 0 0;
    padding: 1px 8px;
    border: 1px solid #c9d9ee;
    border-radius: 999px;
    background: #fff;
    color: #1b5da4;
    font-style: normal;
    font-weight: 600;
}

.dxt-ag-proximas-nenhuma {
    color: #b42020;
}

/* Blocos */
.dxt-ag-bloco {
    margin-bottom: 12px;
    padding: 12px 14px;
    border: 1px solid #e4e9f0;
    border-radius: 10px;
    background: #fff;
}

.dxt-ag-bloco-tit {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: 700;
}

.dxt-ag-bloco-tit .fa {
    margin-right: 4px;
    color: #2a6fd1;
}

.dxt-ag-bloco-tit small {
    margin-left: 6px;
    color: #8a94a6;
    font-size: 12px;
    font-weight: 400;
}

.dxt-ag-datas {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 14px;
}

.dxt-ag-datas label,
.dxt-ag-grupo-cab label {
    display: block;
    margin-bottom: 3px;
    color: #3a4252;
    font-size: 12.5px;
    font-weight: 600;
}

.dxt-ag-datas .form-control {
    height: 36px;
    border-color: #ccd6e2;
    border-radius: 6px;
}

.dxt-ag-ajuda {
    grid-column: 1 / -1;
    margin: 0;
    color: #8a94a6;
    font-size: 12px;
}

.dxt-ag-grupo + .dxt-ag-grupo {
    margin-top: 10px;
}

.dxt-ag-grupo-cab {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
}

.dxt-ag-acoes {
    display: flex;
    gap: 10px;
}

.dxt-ag-link {
    padding: 0;
    border: 0;
    background: none;
    color: #2a6fd1;
    font-size: 12px;
    font-weight: 600;
}

.dxt-ag-link:hover {
    text-decoration: underline;
}

/* Botões de seleção */
.dxt-ag-chips {
    display: grid;
    gap: 5px;
}

.dxt-ag-chips-semana {
    grid-template-columns: repeat(7, minmax(0, 1fr));
}

.dxt-ag-chips-dia {
    grid-template-columns: repeat(16, minmax(0, 1fr));
}

.dxt-ag-chips-mes {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.dxt-ag-chips-hora {
    grid-template-columns: repeat(12, minmax(0, 1fr));
}

.dxt-ag-chips-minuto {
    grid-template-columns: repeat(6, minmax(0, 72px));
}

.dxt-ag-chip {
    min-width: 0;
    padding: 6px 2px;
    border: 1px solid #ccd6e2;
    border-radius: 6px;
    background: #fff;
    color: #3a4252;
    font-size: 12.5px;
    line-height: 1.2;
    cursor: pointer;
    transition: background .12s, border-color .12s, color .12s;
}

.dxt-ag-chip:hover {
    border-color: #9fc0ea;
    background: #f2f7fd;
}

.dxt-ag-chip.ativo {
    border-color: #1b5da4;
    background: #1b5da4;
    color: #fff;
    font-weight: 600;
}

.dxt-ag-chip:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(42, 111, 209, .2);
}

.dxt-ag-rodape {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 4px;
}

@media (max-width: 767.98px) {
    .dxt-ag-chips-dia {
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }

    .dxt-ag-chips-hora {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .dxt-ag-chips-mes {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .dxt-ag-chips-semana {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .dxt-ag-datas {
        grid-template-columns: 1fr;
    }
}


/* ==========================================================================
   Associação de respostas à pergunta (dxt-rq) - #modal2 com .dxt-rq-modal
   ========================================================================== */
.dxt-rq-modal .modal-dialog {
    max-width: min(1040px, 95vw);
}

/* Rodapé próprio (Cancelar / Salvar); o #btn_fecha_modal2 continua no DOM */
.dxt-rq-modal .modal-footer {
    display: none;
}

.dxt-rq-modal .dxt-vq-cab-sub {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.dxt-rq {
    color: #233044;
}

.dxt-rq-resumo {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 12px;
}

.dxt-rq-resumo-card {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid #e4e9f0;
    border-radius: 10px;
    background: #fff;
}

.dxt-rq-resumo-ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: #eaf1fb;
    color: #2a6fd1;
    font-size: 15px;
}

.dxt-rq-resumo-val {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.1;
}

.dxt-rq-resumo-rot {
    color: #6b778c;
    font-size: 12px;
}

.dxt-rq-ferramentas {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}

.dxt-rq-ferramentas .dxt-tp-busca {
    flex: 1 1 260px;
    max-width: 360px;
}

.dxt-rq-filtro {
    display: inline-flex;
    padding: 3px;
    border: 1px solid #ccd6e2;
    border-radius: 8px;
    background: #fff;
}

.dxt-rq-filtro-btn {
    padding: 4px 12px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #6b778c;
    font-size: 13px;
}

.dxt-rq-filtro-btn b {
    display: inline-block;
    min-width: 20px;
    margin-left: 4px;
    padding: 0 6px;
    border-radius: 10px;
    background: #e4e9f0;
    color: #233044;
    font-size: 11.5px;
}

.dxt-rq-filtro-btn.ativo {
    background: #2a6fd1;
    color: #fff;
}

.dxt-rq-filtro-btn.ativo b {
    background: rgba(255, 255, 255, .25);
    color: #fff;
}

.dxt-rq-filtro-btn:focus {
    box-shadow: 0 0 0 3px rgba(42, 111, 209, .2);
}

/* Lista com rolagem própria e cabeçalho fixo: usável mesmo com muitas respostas */
.dxt-rq-lista {
    --dxt-rq-colunas: minmax(0, 1fr) 116px 110px 130px;
    position: relative;
    max-height: max(280px, calc(100vh - 400px));
    overflow-y: auto;
    border: 1px solid #e4e9f0;
    border-radius: 10px;
    background: #fff;
}

.dxt-rq-lista.dxt-rq-com-cond {
    --dxt-rq-colunas: minmax(0, 1fr) 116px 110px 130px 120px;
}

.dxt-rq-lista.dxt-rq-com-emoji {
    --dxt-rq-colunas: minmax(0, 1fr) 116px 110px 130px 190px;
}

.dxt-rq-lista.dxt-rq-com-cond.dxt-rq-com-emoji {
    --dxt-rq-colunas: minmax(0, 1fr) 116px 110px 130px 120px 190px;
}

.dxt-rq-cab,
.dxt-rq-item {
    display: grid;
    grid-template-columns: var(--dxt-rq-colunas);
    align-items: center;
    gap: 12px;
    padding: 0 14px;
}

.dxt-rq-cab {
    position: sticky;
    top: 0;
    z-index: 2;
    min-height: 40px;
    background: #2a6fd1;
    color: #fff;
    font-size: 12.5px;
    font-weight: 600;
}

.dxt-rq-cab .fa {
    opacity: .8;
}

.dxt-rq-item {
    position: relative;
    min-height: 48px;
    border-bottom: 1px solid #eef1f5;
    transition: background-color .15s;
}

.dxt-rq-item:hover {
    background: #f7f9fb;
}

/* Barrinha lateral no padrão das tabelas: azul = resposta associada */
.dxt-rq-item::before {
    content: "";
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 4px;
    width: 4px;
    border-radius: 4px;
    background: transparent;
}

.dxt-rq-item.dxt-rq-sel {
    background: #f3f8ff;
}

.dxt-rq-item.dxt-rq-sel::before {
    background: #2a6fd1;
}

.dxt-rq-nome {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 8px 0;
    cursor: pointer;
    font-weight: 400;
}

.dxt-rq-nome input[type="checkbox"] {
    flex: 0 0 auto;
    width: 17px;
    height: 17px;
    margin: 0;
    cursor: pointer;
}

.dxt-rq-nome span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.dxt-rq-item.dxt-rq-sel .dxt-rq-nome span {
    font-weight: 600;
}

.dxt-rq-peso {
    text-align: center;
    border-color: #ccd6e2;
    border-radius: 6px;
}

.dxt-rq-peso:disabled {
    background: #f4f6f9;
}

/* Resposta "Não aplicável": não tem peso, mostra o badge no lugar do campo */
.dxt-rq-badge-na {
    display: block;
    padding: 4px 6px;
    border-radius: 6px;
    background: #eef1f5;
    border: 1px solid #d5dce5;
    color: #5a6b80;
    font-size: 11px;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
}

.dxt-rq-item:not(.dxt-rq-sel) .dxt-rq-badge-na {
    opacity: .6;
}

/* Destaque rápido da linha que mudou de grupo */
.dxt-rq-item.dxt-rq-movida {
    animation: dxtRqMovida 1.2s ease-out;
}

@keyframes dxtRqMovida {
    0%   { background-color: #fff3c4; }
    100% { background-color: transparent; }
}

/* Chave liga/desliga própria (o Bootstrap do sistema não tem .custom-switch) */
.dxt-rq-switch.custom-control {
    display: inline-block;
    min-height: 20px;
    padding-left: 0;
}

.dxt-rq-switch .custom-control-input {
    position: absolute;
    z-index: -1;
    opacity: 0;
}

.dxt-rq-switch .custom-control-label {
    position: relative;
    display: inline-block;
    width: 36px;
    height: 20px;
    margin: 0;
    vertical-align: middle;
    cursor: pointer;
}

.dxt-rq-switch .custom-control-label::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 36px;
    height: 20px;
    border: 1px solid #b6c2d2;
    border-radius: 10px;
    background: #e4e9f0;
    box-shadow: none;
    transition: background-color .15s, border-color .15s;
}

.dxt-rq-switch .custom-control-label::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .25);
    transition: transform .15s;
}

.dxt-rq-switch .custom-control-input:checked ~ .custom-control-label::before {
    border-color: #2a6fd1;
    background: #2a6fd1;
}

.dxt-rq-switch .custom-control-input:checked ~ .custom-control-label::after {
    transform: translateX(16px);
}

.dxt-rq-switch .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0 3px rgba(42, 111, 209, .2);
}

.dxt-rq-switch .custom-control-input:disabled ~ .custom-control-label {
    cursor: not-allowed;
}

/* Chave "Não conforme": vermelha quando ligada */
.dxt-rq-switch-nc .custom-control-input:checked ~ .custom-control-label::before {
    border-color: #d9363e;
    background: #d9363e;
}

.dxt-rq-switch-nc .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0 3px rgba(217, 54, 62, .2);
}

/* Não conforme: o campo do peso (-1, interno) fica escondido e o badge aparece no lugar */
.dxt-rq-badge-nc {
    display: none;
    padding: 4px 6px;
    border-radius: 6px;
    background: #fdecee;
    border: 1px solid #f1b0b4;
    color: #b52a31;
    font-size: 11px;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
    cursor: help;
}

.dxt-rq-nc-ativo .dxt-rq-peso {
    display: none;
}

.dxt-rq-nc-ativo .dxt-rq-badge-nc {
    display: block;
}

/* Resposta não selecionada: controles esmaecidos e bloqueados */
.dxt-rq-item:not(.dxt-rq-sel) .dxt-rq-campo {
    opacity: .45;
}

.dxt-rq-item:not(.dxt-rq-sel) .dxt-epick {
    pointer-events: none;
}

.dxt-rq-cond {
    margin: 0 14px 10px 36px;
    padding: 10px 12px;
    border: 1px dashed #9fc0ea;
    border-radius: 8px;
    background: #f7faff;
}

.dxt-rq-cond-tit {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #2a6fd1;
    font-size: 12.5px;
}

.dxt-rq-cond-tit .classtooltip {
    color: #8a94a6;
    cursor: help;
}

.dxt-rq-cond-ajuda {
    margin: 2px 0 6px;
    color: #6b778c;
    font-size: 11.5px;
}

/* Lista dupla (HTML compartilhado com o construtor): visual só dentro deste modal */
.dxt-rq-cond .dxt-cond-duallist {
    margin-top: 0 !important;
}

.dxt-rq-cond .dxt-cond-duallist > .col-5 {
    position: relative;
}

.dxt-rq-cond .dxt-cond-duallist label {
    margin-bottom: 4px !important;
    color: #4a5b73;
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: .02em;
}

.dxt-rq-cond .dxt-cond-duallist label b {
    font-weight: 600;
}

.dxt-rq-cond .dxt-cond-duallist select {
    height: 150px !important;
    padding: 4px;
    border-color: #ccd6e2;
    border-radius: 8px;
    background: #fff;
    font-size: 12.5px;
}

.dxt-rq-cond .dxt-cond-duallist select:focus {
    border-color: #2a6fd1;
    box-shadow: 0 0 0 3px rgba(42, 111, 209, .15);
}

.dxt-rq-cond .dxt-cond-duallist option {
    padding: 5px 8px;
    border-radius: 5px;
    white-space: normal;
    cursor: pointer;
}

.dxt-rq-cond .dxt-cond-duallist option:checked {
    background: #dceaf9 linear-gradient(#dceaf9, #dceaf9);
    color: #1b5da4;
}

/* Setas neutras em azul (eram verde/vermelho) */
.dxt-rq-cond .dxt-cond-duallist .col-2 .btn {
    width: 34px !important;
    height: 30px;
    padding: 0;
    border: 1px solid #9fc0ea;
    border-radius: 6px;
    background: #fff;
    color: #2a6fd1;
}

.dxt-rq-cond .dxt-cond-duallist .col-2 .btn:hover {
    border-color: #2a6fd1;
    background: #eaf1fb;
}

.dxt-rq-cond .dxt-cond-duallist .col-2 .btn:nth-child(3) {
    margin-top: 8px;
}

.dxt-rq-cond-vazio {
    position: absolute;
    left: 50%;
    top: calc(50% + 10px);
    width: calc(100% - 30px);
    transform: translate(-50%, -50%);
    color: #8a94a6;
    font-size: 12px;
    line-height: 1.4;
    text-align: center;
    pointer-events: none;
}

.dxt-rq-cond-vazio .fa {
    display: block;
    margin-bottom: 4px;
    color: #b6c2d2;
    font-size: 20px;
}

.dxt-rq-oculto {
    display: none !important;
}

.dxt-rq-vazio {
    padding: 24px 14px;
    color: #6b778c;
    text-align: center;
}

.dxt-rq-rodape {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 14px;
}

.dxt-rq-rodape-info {
    color: #6b778c;
    font-size: 12.5px;
}

.dxt-rq-rodape-acoes {
    display: flex;
    gap: 8px;
    margin-left: auto;
}

.dxt-rq-btn-cancelar {
    padding: 8px 18px;
    border: 1px solid #9fc0ea;
    border-radius: 6px;
    background: #fff;
    color: #2a6fd1;
}

.dxt-rq-btn-cancelar:hover {
    background: #eaf1fb;
    color: #2a6fd1;
}

.dxt-rq-btn-salvar {
    padding: 8px 18px;
    border-radius: 6px;
}

/* Tipo INTERVALO */
.dxt-rq-int-tit {
    margin-bottom: 4px;
    font-weight: 600;
}

.dxt-rq-int-ajuda {
    margin-bottom: 12px;
    color: #6b778c;
    font-size: 12.5px;
}

.dxt-rq-int-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 180px));
    gap: 12px;
}

.dxt-rq-int-grid label {
    margin-bottom: 4px;
    font-size: 12.5px;
    font-weight: 600;
}

@media (max-width: 767px) {
    .dxt-rq-resumo {
        grid-template-columns: 1fr;
    }

    .dxt-rq-ferramentas .dxt-tp-busca {
        max-width: none;
    }

    .dxt-rq-lista {
        max-height: none;
    }

    .dxt-rq-cab {
        display: none;
    }

    .dxt-rq-item {
        grid-template-columns: 1fr 1fr;
        padding: 6px 14px 10px;
    }

    .dxt-rq-nome {
        grid-column: 1 / -1;
    }

    .dxt-rq-cond {
        margin-left: 14px;
    }

    .dxt-rq-int-grid {
        grid-template-columns: 1fr;
    }
}


/* ==========================================================================
   Grupos responsáveis da pergunta (dxt-gr) - #modal2 com .dxt-gr-modal
   (func_edita_pergunta_responsavel). Usa dxt-vq-modal + dxt-fp-modal (largura e "Fechar").
   ========================================================================== */
.dxt-gr {
    color: #233044;
}

.dxt-gr-aviso {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 14px;
    padding: 10px 12px;
    border: 1px solid #cfe0f5;
    border-radius: 8px;
    background: #f1f6fd;
    color: #3d5170;
    font-size: 12.5px;
}

.dxt-gr-aviso > .fa {
    margin-top: 2px;
    color: #2a6fd1;
}

.dxt-gr-grade {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 52px minmax(0, 1fr);
    gap: 12px;
    align-items: stretch;
}

.dxt-gr-painel {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px;
    border: 1px solid #e4e9f0;
    border-radius: 10px;
    background: #fff;
}

.dxt-gr-painel-resp {
    border-color: #cfe0f5;
}

.dxt-gr-painel-cab {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
}

.dxt-gr-painel-cab .fa {
    margin-right: 4px;
    color: #2a6fd1;
}

.dxt-gr-qtd {
    min-width: 26px;
    padding: 1px 8px;
    border-radius: 10px;
    background: #e4e9f0;
    color: #233044;
    font-size: 11.5px;
    text-align: center;
}

.dxt-gr-painel-resp .dxt-gr-qtd {
    background: #2a6fd1;
    color: #fff;
}

.dxt-gr-busca {
    width: 100%;
}

.dxt-gr-lista.form-control {
    height: 300px;
    padding: 4px;
    border-color: #ccd6e2;
    border-radius: 8px;
    font-size: 12.5px;
}

.dxt-gr-lista.form-control:focus {
    border-color: #2a6fd1;
    box-shadow: 0 0 0 3px rgba(42, 111, 209, .15);
}

.dxt-gr-lista option {
    padding: 5px 8px;
    border-radius: 5px;
    cursor: pointer;
}

.dxt-gr-lista option:checked {
    background: #dceaf9 linear-gradient(#dceaf9, #dceaf9);
    color: #1b5da4;
}

.dxt-gr-vazio {
    position: absolute;
    left: 50%;
    top: 62%;
    width: calc(100% - 48px);
    transform: translate(-50%, -50%);
    color: #8a94a6;
    font-size: 12px;
    line-height: 1.4;
    text-align: center;
    pointer-events: none;
}

.dxt-gr-vazio .fa {
    display: block;
    margin-bottom: 6px;
    color: #b6c2d2;
    font-size: 22px;
}

.dxt-gr-setas {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.dxt-gr-seta {
    width: 40px;
    height: 36px;
    padding: 0;
    border: 1px solid #9fc0ea;
    border-radius: 8px;
    background: #fff;
    color: #2a6fd1;
}

.dxt-gr-seta:hover:not(:disabled) {
    border-color: #2a6fd1;
    background: #eaf1fb;
    color: #2a6fd1;
}

.dxt-gr-seta:disabled {
    border-color: #e4e9f0;
    color: #b6c2d2;
    cursor: not-allowed;
    opacity: 1;
}

.dxt-gr-dica {
    margin-top: 10px;
    color: #6b778c;
    font-size: 11.5px;
}

@media (max-width: 767px) {
    .dxt-gr-grade {
        grid-template-columns: 1fr;
    }

    .dxt-gr-setas {
        flex-direction: row;
    }

    .dxt-gr-setas .fa-arrow-right {
        transform: rotate(90deg);
    }

    .dxt-gr-setas .fa-arrow-left {
        transform: rotate(90deg);
    }

    .dxt-gr-lista.form-control {
        height: 200px;
    }
}


/* ==========================================================================
   Prazo e informações da pergunta no formulário (dxt-pz) - #modal2 com .dxt-pz-modal
   (func_preenche_prazo_info). Rodapé próprio (Cancelar / Salvar).
   ========================================================================== */
.dxt-pz-modal .modal-dialog {
    max-width: min(760px, 95vw);
}

.dxt-pz-modal .modal-footer {
    display: none;
}

.dxt-pz-modal .dxt-vq-cab-sub {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.dxt-pz {
    color: #233044;
}

.dxt-pz-secao {
    margin-bottom: 12px;
    padding: 14px 16px;
    border: 1px solid #e4e9f0;
    border-radius: 10px;
    background: #fff;
}

.dxt-pz-secao-cab {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 12px;
}

.dxt-pz-secao-cab b {
    display: block;
    font-size: 14px;
}

.dxt-pz-secao-cab small {
    display: block;
    color: #6b778c;
    font-size: 12px;
    line-height: 1.4;
}

.dxt-pz-ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #eaf1fb;
    color: #2a6fd1;
    font-size: 15px;
}

.dxt-pz-prazo {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.dxt-pz-horas {
    width: 180px;
}

.dxt-pz-horas .form-control,
.dxt-pz-info {
    border-color: #ccd6e2;
}

.dxt-pz-horas .form-control:focus,
.dxt-pz-info:focus {
    border-color: #2a6fd1;
    box-shadow: 0 0 0 3px rgba(42, 111, 209, .15);
}

.dxt-pz-horas .input-group-text {
    border-color: #ccd6e2;
    background: #f4f6f9;
    color: #6b778c;
    font-size: 13px;
}

.dxt-pz-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.dxt-pz-chip {
    padding: 4px 10px;
    border: 1px solid #ccd6e2;
    border-radius: 14px;
    background: #fff;
    color: #4a5b73;
    font-size: 12px;
    cursor: pointer;
}

.dxt-pz-chip:hover {
    border-color: #2a6fd1;
    color: #2a6fd1;
}

.dxt-pz-chip.ativo {
    border-color: #2a6fd1;
    background: #2a6fd1;
    color: #fff;
}

.dxt-pz-chip:focus {
    outline: 0;
    box-shadow: 0 0 0 3px rgba(42, 111, 209, .2);
}

.dxt-pz-extenso {
    margin-top: 10px;
    color: #4a5b73;
    font-size: 12.5px;
}

.dxt-pz-extenso .fa {
    margin-right: 4px;
    color: #8a94a6;
}

.dxt-pz-info {
    min-height: 110px;
    border-radius: 8px;
    font-size: 13px;
    resize: vertical;
}

.dxt-pz-rodape {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 4px;
}

@media (max-width: 575px) {
    .dxt-pz-horas {
        width: 100%;
    }
}


/* ==========================================================================
   Perguntas do formulário - melhorias de fluxo (func_config_formulario)
   Seleção para copiar respostas, indicadores da linha, verificação, mover de setor, adicionar no setor
   ========================================================================== */
.dxt-pf-tabela .dxt-pf-col-sel {
    width: 1%;
    white-space: nowrap;
    vertical-align: middle;
}

.dxt-pf-tabela thead .dxt-pf-col-sel {
    padding-left: 20px !important;
}

.dxt-pf-sel-lote,
.dxt-pf-sel-todas {
    width: 16px;
    height: 16px;
    margin: 0;
    vertical-align: middle;
    cursor: pointer;
}

/* Indicadores do que já está configurado na pergunta */
.dxt-pf-inds {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 6px;
}

.dxt-pf-ind {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin: 0;
    padding: 1px 8px;
    border: 1px solid #dde3ea;
    border-radius: 10px;
    background: #fff;
    color: #6b778c;
    font-size: 11px;
    font-weight: 500;
    line-height: 18px;
    white-space: nowrap;
    cursor: pointer;
}

.dxt-pf-ind:focus {
    outline: 0;
    box-shadow: 0 0 0 3px rgba(42, 111, 209, .2);
}

.dxt-pf-ind-ok {
    border-color: #cfe0f5;
    background: #f1f6fd;
    color: #1b5da4;
}

.dxt-pf-ind-ok:hover {
    border-color: #2a6fd1;
}

.dxt-pf-ind-vazio {
    border-style: dashed;
    color: #8a94a6;
}

.dxt-pf-ind-vazio:hover {
    border-color: #2a6fd1;
    color: #2a6fd1;
}

.dxt-pf-ind-alerta {
    border-color: #f5c27a;
    background: #fff4e3;
    color: #b25e00;
}

.dxt-pf-ind-alerta:hover {
    border-color: #f5a623;
}

.dxt-pf-ind-neutro {
    border-color: transparent;
    background: #f2f4f7;
    cursor: default;
}

.dxt-pf-ind-ref {
    font-weight: 500;
}

.dxt-pf-ind-ref input {
    margin: 0;
}

.dxt-pf-alerta-clica {
    cursor: pointer;
}

/* Botão "+ Adicionar" no cabeçalho do setor */
.dxt-pf-btn-add-setor {
    margin-left: 8px;
    padding: 3px 10px;
    border: 1px solid #9fc0ea;
    border-radius: 6px;
    background: #fff;
    color: #2a6fd1;
    font-size: 12px;
    font-weight: 600;
}

.dxt-pf-btn-add-setor:hover {
    border-color: #2a6fd1;
    background: #eaf1fb;
    color: #2a6fd1;
}

/* Pontuação do setor (pontuação agrupada por setor) */
.dxt-pf-pts {
    padding: 1px 8px;
    border-radius: 10px;
    background: #e4e9f0;
    color: #4a5b73;
    font-size: 11.5px;
    font-weight: 600;
}

.dxt-pf-pts-ok {
    background: #e3f6e8;
    color: #1e7b3a;
}

.dxt-pf-pts-erro {
    background: #fde4e6;
    color: #b3261e;
}

/* Selo de perguntas sem respostas no cabeçalho do setor (visível com o setor recolhido) */
.dxt-pf-setor-alerta {
    padding: 1px 8px;
    border-radius: 10px;
    background: #fff1e0;
    color: #c35a00;
    border: 1px solid #fdc68a;
    font-size: 11.5px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}

.dxt-pf-setor-alerta:hover {
    background: #ffe3c2;
}

.dxt-pf-setor-alerta .fa {
    color: #fd7e14;
}

/* Verificação "pronto para uso" */
.dxt-pf-check {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 14px;
    margin: 0 0 14px;
    padding: 10px 14px;
    border: 1px solid #e4e9f0;
    border-radius: 10px;
    background: #fff;
    font-size: 12.5px;
}

.dxt-pf-check-status {
    padding: 3px 10px;
    border-radius: 12px;
    font-weight: 700;
}

.dxt-pf-check-ok {
    background: #e3f6e8;
    color: #1e7b3a;
}

.dxt-pf-check-pend {
    background: #fff4e3;
    color: #b25e00;
}

.dxt-pf-chk-item {
    color: #4a5b73;
}

.dxt-pf-chk-item .fa {
    margin-right: 3px;
}

.dxt-pf-chk-ok .fa {
    color: #2e9e52;
}

.dxt-pf-chk-alerta {
    color: #b25e00;
    font-weight: 600;
}

.dxt-pf-chk-erro {
    color: #b3261e;
    font-weight: 600;
}

.dxt-pf-chk-info .fa {
    color: #8a94a6;
}

/* Barra de seleção (copiar respostas) fixa no rodapé da área rolável */
.dxt-pf-lote {
    position: sticky;
    bottom: 10px;
    z-index: 5;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-top: 12px;
    padding: 10px 14px;
    border: 1px solid #9fc0ea;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 6px 18px rgba(35, 48, 68, .18);
}

.dxt-pf-lote-qtd {
    margin-right: auto;
    color: #1b5da4;
    font-size: 13px;
}

.dxt-pf-lote-qtd .fa {
    color: #2a6fd1;
}

/* Menu "Mover para o setor" */
.dxt-pf-mover {
    width: 280px;
    padding: 12px;
    white-space: normal;
}

.dxt-pf-mover label {
    margin-bottom: 4px;
    font-size: 12.5px;
    font-weight: 600;
}

.dxt-pf-mover small {
    display: block;
    margin: 6px 0 10px;
    color: #6b778c;
    font-size: 11.5px;
    line-height: 1.35;
}

.dxt-pf-add-nova {
    white-space: nowrap;
    font-weight: 600;
}

/* Botão "Copiar de outra pergunta" na associação de respostas */
.dxt-rq-copiar {
    margin-left: auto;
    padding: 6px 12px;
    border: 1px solid #9fc0ea;
    border-radius: 8px;
    background: #fff;
    color: #2a6fd1;
    font-size: 13px;
}

.dxt-rq-copiar:hover {
    background: #eaf1fb;
    color: #2a6fd1;
}

/* ==========================================================================
   Copiar respostas (dxt-lr) - #modal2 com .dxt-lr-modal
   ========================================================================== */
.dxt-lr-previas {
    margin-top: 10px;
}

.dxt-lr-previa-vazia {
    color: #8a94a6;
    font-size: 12px;
}

.dxt-lr-previa {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.dxt-lr-resp {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 4px 3px 10px;
    border: 1px solid #cfe0f5;
    border-radius: 14px;
    background: #f1f6fd;
    color: #233044;
    font-size: 12px;
}

.dxt-lr-resp b {
    padding: 0 7px;
    border-radius: 10px;
    background: #2a6fd1;
    color: #fff;
    font-size: 11px;
}

.dxt-lr-resp b.dxt-lr-sem-peso {
    background: #e4e9f0;
    color: #6b778c;
}

.dxt-lr-resp .fa {
    margin-right: 4px;
    color: #b3261e;
}

.dxt-lr-opcoes {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 18px;
    margin-top: 12px;
    font-size: 12.5px;
}

.dxt-lr-opcoes label {
    margin: 0;
    font-weight: 400;
    cursor: pointer;
}

.dxt-lr-destinos {
    max-height: 300px;
    margin: 0;
    padding: 0 4px 0 0;
    overflow-y: auto;
    list-style: none;
    border: 1px solid #e4e9f0;
    border-radius: 8px;
}

.dxt-lr-busca {
    width: 100%;
    margin-bottom: 8px;
}

.dxt-lr-dest-qtd {
    margin-left: 6px;
    padding: 1px 8px;
    border-radius: 10px;
    background: #2a6fd1;
    color: #fff;
    font-size: 11.5px;
    font-weight: 600;
}

/* Cabeçalho de setor da lista (com "marcar todas do setor") */
.dxt-lr-dest-grupo {
    position: sticky;
    top: 0;
    z-index: 1;
    padding: 6px 10px;
    border-bottom: 1px solid #e4e9f0;
    background: #f1f6fd;
}

.dxt-lr-dest-grupo label {
    margin: 0;
    color: #1b5da4;
    font-size: 11.5px;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
}

.dxt-lr-dest {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 6px 10px 6px 22px;
    border-bottom: 1px solid #eef1f5;
    font-size: 12.5px;
}

.dxt-lr-dest:last-child {
    border-bottom: 0;
}

.dxt-lr-dest input {
    flex: 0 0 auto;
    margin-top: 2px;
    cursor: pointer;
}

.dxt-lr-dest label {
    flex: 1 1 auto;
    margin: 0;
    font-weight: 400;
    cursor: pointer;
}

.dxt-lr-dest-nota {
    flex: 0 0 auto;
    color: #8a94a6;
    font-size: 11px;
    font-style: italic;
}

.dxt-lr-dest-bloq label,
.dxt-lr-dest-bloq input {
    cursor: not-allowed;
}

.dxt-lr-dest-bloq label {
    color: #a0a9b8;
}

.dxt-lr-dest-setor {
    display: inline-block;
    margin-right: 8px;
    padding: 0 7px;
    border-radius: 8px;
    background: #e4e9f0;
    color: #4a5b73;
    font-size: 10.5px;
    font-weight: 600;
}

.dxt-lr-aviso {
    padding: 10px 12px;
    border-radius: 8px;
    font-size: 12.5px;
}

.dxt-lr-aviso-alerta {
    border: 1px solid #f5c27a;
    background: #fff4e3;
    color: #8a4b00;
}

/* ==========================================================================
   Pré-visualização do formulário (dxt-pv) - #modal2 com .dxt-pv-modal
   ========================================================================== */
.dxt-pv-modal .modal-dialog {
    max-width: min(820px, 95vw);
}

.dxt-pv-aviso {
    margin-bottom: 14px;
    padding: 8px 12px;
    border: 1px solid #cfe0f5;
    border-radius: 8px;
    background: #f1f6fd;
    color: #3d5170;
    font-size: 12.5px;
}

.dxt-pv-setor {
    margin-bottom: 14px;
    border: 1px solid #e4e9f0;
    border-radius: 10px;
    background: #fff;
    overflow: hidden;
}

.dxt-pv-setor-nome {
    padding: 10px 14px;
    background: #eaf1fb;
    color: #1b5da4;
    font-size: 13px;
    font-weight: 700;
}

.dxt-pv-pergunta {
    padding: 12px 14px;
    border-top: 1px solid #eef1f5;
}

.dxt-pv-pergunta-cond {
    padding-left: 34px;
    background: #fafbfd;
}

.dxt-pv-titulo {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 8px;
    font-size: 13.5px;
    font-weight: 600;
}

.dxt-pv-obrig {
    color: #d6263b;
}

.dxt-pv-cond {
    margin: -4px 0 8px 36px;
    color: #6f42c1;
    font-size: 11.5px;
}

.dxt-pv-opcoes,
.dxt-pv-pergunta > .form-control,
.dxt-pv-pergunta > .dxt-pv-ref,
.dxt-pv-pergunta > .dxt-pv-falta,
.dxt-pv-check {
    margin-left: 36px;
}

.dxt-pv-opcoes {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.dxt-pv-opcao {
    padding: 5px 14px;
    border: 1px solid #ccd6e2;
    border-radius: 6px;
    background: #fff;
    color: #233044;
    font-size: 12.5px;
}

.dxt-pv-emoji {
    padding: 2px 8px;
    font-size: 22px;
    line-height: 1.2;
}

.dxt-pv-check {
    display: block;
    margin-bottom: 2px;
    font-size: 12.5px;
    font-weight: 400;
}

.dxt-pv-input {
    max-width: 240px;
}

.dxt-pv-pergunta > .form-control {
    width: calc(100% - 36px);
}

.dxt-pv-ref {
    display: block;
    margin-top: 4px;
    color: #6b778c;
}

.dxt-pv-falta {
    color: #b25e00;
    font-size: 12px;
    font-weight: 600;
}