/*
 * REG_ACOMP_DOCUMENTOS_REFINO_V1
 *
 * Layout aprovado para:
 * Acompanhamento de Processo > Documentos
 */


/* ==========================================================
   PAINEL
   ========================================================== */

[data-acomp-panel="docs"].fx-doc-refined {
    padding: 8px 10px 10px !important;
}


/* ==========================================================
   CABEÇALHO DA ÁREA
   ========================================================== */

.fx-doc-refined-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;

    min-height: 52px;

    margin: 0 0 10px;
    padding: 2px 2px 6px;
}


.fx-doc-refined-title {
    display: flex;
    align-items: center;
    gap: 10px;

    min-width: 0;
}


.fx-doc-refined-icon {
    display: grid;
    place-items: center;

    flex: 0 0 36px;

    width: 36px;
    height: 36px;

    border-radius: 9px;

    background: #e8f7f5;
    color: #078d8b;

    font-size: 20px;
    line-height: 1;
}


.fx-doc-refined-title strong {
    color: #133649;

    font-size: 14px;
    font-weight: 700;

    white-space: nowrap;
}


.fx-doc-refined-title [data-doc-count] {
    display: inline-flex;
    align-items: center;

    min-height: 24px;

    padding: 2px 9px;

    border-radius: 12px;

    background: #edf3f6;
    color: #536f7d;

    font-size: 11px;
    font-weight: 500;
}


/* botão aprovado */

.fx-doc-refined-primary {
    flex: 0 0 auto !important;

    width: auto !important;
    min-width: 142px !important;
    min-height: 34px !important;

    margin: 0 !important;
    padding: 0 15px !important;

    border: 0 !important;
    border-radius: 7px !important;

    background:
        linear-gradient(
            180deg,
            #09a5a0,
            #058c89
        ) !important;

    color: #fff !important;

    font-size: 11px !important;
    font-weight: 650 !important;

    box-shadow:
        0 2px 5px rgba(2, 99, 98, .16) !important;
}


/* ==========================================================
   TABELA
   ========================================================== */

.fx-doc-refined .fx-doc-table {
    width: 100% !important;

    table-layout: fixed !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;

    overflow: hidden;

    border: 1px solid #d9e5e9 !important;
    border-radius: 7px !important;

    background: #fff;
}


.fx-doc-refined .fx-doc-table thead th {
    height: 34px !important;

    padding: 7px 10px !important;

    border-bottom: 1px solid #d9e5e9 !important;

    background: #eef4f6 !important;

    color: #21465a !important;

    font-size: 10.5px !important;
    font-weight: 700 !important;

    text-align: left !important;
}


/*
 * Distribuição aprovada:
 *
 * Documento / título = grande
 * Data               = canto direito
 * Arquivo            = canto direito
 */

.fx-doc-refined .fx-doc-table th:nth-child(1),
.fx-doc-refined .fx-doc-table td:nth-child(1) {
    width: 68% !important;
}


.fx-doc-refined .fx-doc-table th:nth-child(2),
.fx-doc-refined .fx-doc-table td:nth-child(2) {
    width: 13% !important;
}


.fx-doc-refined .fx-doc-table th:nth-child(3),
.fx-doc-refined .fx-doc-table td:nth-child(3) {
    width: 19% !important;
}


.fx-doc-refined .fx-doc-table tbody td {
    min-height: 34px !important;

    padding: 8px 10px !important;

    border-bottom: 1px solid #e5edf0 !important;

    color: #173f52;

    font-size: 10.5px !important;

    vertical-align: middle;
}


.fx-doc-refined .fx-doc-table tbody tr:last-child td {
    border-bottom: 0 !important;
}


/* A coluna antiga de ações deixa de existir visualmente */

.fx-doc-refined .fx-doc-table
.fx-doc-hidden-actions {
    display: none !important;
}


/* ==========================================================
   SELEÇÃO DA LINHA
   ========================================================== */

.fx-doc-refined .fx-doc-table tbody tr[data-doc-selectable] {
    cursor: pointer;
}


.fx-doc-refined .fx-doc-table tbody tr[data-doc-selectable]:hover td {
    background: #f4fbfb !important;
}


.fx-doc-refined .fx-doc-table tbody tr.is-selected td {
    background: #eaf8f7 !important;

    box-shadow:
        inset 0 1px 0 rgba(5, 150, 146, .08),
        inset 0 -1px 0 rgba(5, 150, 146, .08);
}


.fx-doc-refined .fx-doc-table tbody tr.is-selected td:first-child {
    box-shadow:
        inset 3px 0 0 #079895 !important;
}


/* ==========================================================
   ESTADO VAZIO
   ========================================================== */

.fx-doc-empty {
    height: 175px !important;

    padding: 26px !important;

    text-align: center !important;

    background: #fff !important;
}


.fx-doc-empty-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: 5px;

    height: 100%;
}


.fx-doc-empty-icon {
    display: grid;
    place-items: center;

    width: 44px;
    height: 44px;

    margin-bottom: 3px;

    border-radius: 50%;

    background: #f0f5f7;

    color: #6d8795;

    font-size: 23px;
}


.fx-doc-empty strong {
    color: #31586d;

    font-size: 11.5px;
    font-weight: 650;
}


.fx-doc-empty small {
    color: #718b98;

    font-size: 10px;
}


/* ==========================================================
   AVISO INFERIOR
   O texto “Você pode anexar...” NÃO aparece.
   ========================================================== */

.fx-doc-refined .fx-doc-bottom-notice {
    display: none !important;
}


/* ==========================================================
   MODAL DE ARQUIVAMENTO
   O formulário ORIGINAL é preservado e apenas reposicionado.
   ========================================================== */

.fx-doc-modalback {
    position: fixed;

    inset: 0;

    z-index: 12100;

    display: grid;
    place-items: center;

    padding: 24px;

    background: rgba(19, 44, 57, .48);

    backdrop-filter: blur(1px);
}


.fx-doc-modalback[hidden] {
    display: none !important;
}


.fx-doc-modal {
    position: relative;

    width: min(620px, calc(100vw - 48px));

    max-height: calc(100vh - 60px);

    overflow: auto;

    padding: 18px 20px 14px !important;

    border: 1px solid #d8e4e8 !important;
    border-radius: 10px !important;

    background: #fff !important;

    box-shadow:
        0 22px 60px rgba(9, 35, 48, .28) !important;
}


.fx-doc-modal-titlebar {
    display: flex;
    align-items: center;

    gap: 10px;

    margin-bottom: 14px;
}


.fx-doc-modal-titlebar .fx-doc-refined-icon {
    width: 34px;
    height: 34px;

    flex-basis: 34px;
}


.fx-doc-modal-titlebar strong {
    color: #15394c;

    font-size: 15px;
    font-weight: 700;
}


.fx-doc-modal-close {
    display: grid;
    place-items: center;

    width: 30px;
    height: 30px;

    margin-left: auto;

    padding: 0;

    border: 0;
    border-radius: 6px;

    background: transparent;
    color: #365767;

    font-size: 24px;
    line-height: 1;
}


.fx-doc-modal-close:hover {
    background: #eef6f6;
}


/* campos mais compactos */

.fx-doc-modal input,
.fx-doc-modal select,
.fx-doc-modal textarea {
    min-height: 34px !important;

    border-radius: 6px !important;
}


/* área de arquivo existente */

.fx-doc-modal [class*="drop"],
.fx-doc-modal [data-doc-drop],
.fx-doc-modal [data-drop-zone] {
    min-height: 100px !important;

    border: 1px dashed #8eced0 !important;
    border-radius: 7px !important;

    background: #f4fbfb !important;
}


/* não criar rolagem desnecessária no painel */

.fx-doc-refined .fx-reg-acomp-tablewrap {
    margin-top: 0 !important;
}