﻿


/*#region GERAL*/

html {
    font-size: 14px;
    position: relative;
    min-height: 100%;
}

header {
    height: 50px;
}

body {
    margin: 0px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif, sans-serif;
    /* font-family: 'Roboto', sans-serif;*/
    background-color: rgb(245,245,245);
    overflow-x: hidden;
    height: 100%;
}

h2 {
    color: rgb(128,0,0);
    font-weight: bold;
    font-size: 18px;
    margin: 0px;
    padding: 10px 0px 0px 0px;
}

h3 {
    color: rgb(47,79,79);
    font-weight: bold;
    font-size: 12px;
    border-bottom: 2px solid rgb(180,180,180);
    margin: 0px;
    padding: 0px;
}

h6 {
    font-weight: bold;
    font-size: 12px;
    margin: 0px;
    padding: 0px;
}

p {
    font-weight: normal;
    font-size: 12px;
    margin: 0px;
    padding: 0px;
}

a {
    text-decoration: none;
}

select, input {
    box-sizing: border-box;
}

    select, input[type=radio] {
        cursor: pointer;
    }

.botao_tab {
    background-color: rgb(222,226,231);
    color: black;
    padding: 0;
    outline: none;
    text-align: center;
    cursor: pointer;
    transition: 0.3s;
    width: 100%;
    height: 40px;
    margin: 0;
    border-width: 0;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

    .botao_tab:hover {
        background-color: rgb(164, 188, 213)
    }

    .botao_tab.ativo {
        background-color: rgb(82,134,186);
        color: white;
    }

    .botao_tab.erro {
        background-color: red;
        color: white;
    }

button {
    cursor: pointer;
}

    button.ok {
        border: 1.5px solid rgb(47,186,25);
        border-radius: 4px;
        background-color: rgb(47,186,25);
        color: white;
    }

        button.ok:hover {
            border-color: rgb(185, 238, 178);
            background-color: rgb(185, 238, 178);
        }

    button.nok {
        border: 1.5px solid rgb(47,186,25);
        border-radius: 4px;
        background-color: white;
        color: rgb(47,186,25);
    }

        button.nok:hover {
            border-color: rgb(185, 238, 178);
            background-color: rgb(185, 238, 178);
            color: white;
        }

.item-formulario {
    display: grid;
    grid-template-columns: 40% 60%;
}

    .item-formulario.oculto {
        display: none;
    }

    .item-formulario > label {
        background-color: rgb(61, 92, 135);
        color: white;
        height: 24px;
        line-height: 24px;
        padding-left: 3px;
        text-transform: uppercase;
        font-size: 11px;
    }

        .item-formulario > label span {
            color: red;
            font-size: 16px;
            padding-left: 3px
        }

    .item-formulario img {
        float: right;
        padding: 6px 4px 4px 4px;
    }

    .item-formulario.ref > label {
        height: 64px;
    }

    .item-formulario.ref img {
        padding: 4px 4px 4px 4px;
    }

    .item-formulario > div {
        width: 100%;
        position: relative;
        height: 33px;
    }

        .item-formulario > div input {
            width: 100%;
            height: 24px;
        }

        .item-formulario > div select {
            width: 100%;
            height: 24px;
        }

        .item-formulario > div textarea {
            width: 100%;
            height: 64px;
        }

    .item-formulario .periodo {
        display: grid;
        grid-template-columns: 1fr 0.3fr 1fr 0.3fr 1fr 0.1fr;
    }

        .item-formulario .periodo > label {
            margin-top: auto;
            margin-bottom: auto;
            margin-left: 2px;
        }

    .item-formulario .cd p {
        position: absolute;
        display: block;
        visibility: hidden;
        color: red;
        font-size: 11px;
    }

    .item-formulario > div > section {
        position: absolute;
        width: 99.9%;
        min-height: 50px;
        background-color: rgb(237, 226, 202);
        display: none;
        z-index: 100;
        border: 1px solid black;
    }

/*INPUTS*/
div.rad {
    display: inline-flex;
    align-items: center;
}

    div.rad label {
        margin-left: 5px;
    }

div.chb {
    display: inline-flex;
    align-items: center;
}

    div.chb input {
        width: auto;
    }

    div.chb label {
        margin-left: 5px;
    }

/*BOTÃO GRANDE*/

.botao-grande {
    width: 200px;
    box-shadow: rgba(0,0,0,0.24) 0px 3px 8px;
    cursor: pointer;
    background-color: white;
    height: 240px;
}

    .botao-grande:hover {
        background-color: rgb(242, 237, 217);
    }

    .botao-grande > div {
        padding: 20px;
        text-align: center;
        height: 160px;
    }

    .botao-grande .logo {
        border-radius: 50%;
        background-color: rgb(82, 134, 186);
        width: 50px;
        height: 50px;
        text-align: center;
        margin: auto;
    }

        .botao-grande .logo img {
            width: 36px;
            height: 36px;
            margin-top: 7px;
        }

    .botao-grande h6 {
        padding: 15px 0px 15px 0px;
        font-size: 14px;
    }

    .botao-grande button {
        background-color: rgb(82, 134, 186);
        color: white;
        border: none;
        width: 100%;
        height: 40px;
        cursor: pointer;
    }

.linha-container {
    display: inline-flex;
}

/*#endregion*/


/*#region MODAL-AÇÃO*/

#id_modal-acao {
    z-index: 1000;
    padding-top: 300px;
}

    #id_modal-acao.modal.acao > div {
        width: 450px;
        height: auto;
        margin: auto;
        background-color: white;
        border-radius: 4px;
    }

    #id_modal-acao.modal.acao .barra {
        height: 10px;
        background-color: rgb(255, 202, 10);
        border-top-left-radius: 4px;
        border-top-right-radius: 4px;
    }

#id_modal-alerta .corpo {
    height: 150px;
}

#id_modal-analise-decretos .corpo {
    height: 150px;
}

#id_modal-acao .titulo {
    font-size: 22px;
    margin: 10px;
}

#id_modal-acao p {
    font-size: 16px;
    margin: 10px;
}


#id_modal-acao .botoes {
    border-top: 1px solid rgb(220, 220, 220);
    width: 100%;
    height: 50px;
    justify-content: right;
    display: flex;
}

    #id_modal-acao .botoes button {
        height: 30px;
        margin-top: 10px;
        margin-right: 5px;
    }


/*#endregion*/

/*#region ERRO*/
#id_msg-erro {
    display: grid;
    grid-template-columns: 1fr 10fr;
    align-items: center;
    width: 450px; /* Adjust the width as needed */
    height: auto; /* Adjust the height as needed */
    margin: 0 auto; /* Center the container horizontally */
    margin-top: 200px; /* Adjust the top margin as needed */
    border-radius: 10px; /* Rounded corners */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); /* Shadow effect */
    background-color: #ffffff; /* Background color */
    padding: 20px 30px 20px 30px; /* Add some padding inside the container */
    font-family: "Segoe UI";
}

    #id_msg-erro > div {
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 10px;
    }

    #id_msg-erro label {
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 20px;
        font-weight: bold;
        margin-bottom: 10px;
    }

    #id_msg-erro p {
        text-align: center;
        font-size: 14px;
    }

/*#endregion*/

/*#region TABELAS*/
.table_container {
    height: 100%;
    overflow-y: auto;
}

table {
    border-collapse: collapse;
    width: 100%;
    padding: 0px;
    margin: 0px;
    text-align: left;
}

thead {
    position: sticky;
    top: 0;
    background-color: rgb(61, 92, 135);
    color: white;
}

th {
    font-weight: normal;
    cursor: default;
}

.tabela_dados td {
}

    .tabela_dados td.lista-icones {
        display: inline-flex;
    }

    .tabela_dados td.bandeira img {
        display: block;
    }

    .tabela_dados td.lista-icones img {
        display: block;
        height: 16px;
        margin-top: 5px;
        margin-left: 5px;
    }

    .tabela_dados td.erro img {
        display: block;
    }

    .tabela_dados td.erro img {
        display: block;
    }

.tabela_dados tbody tr:hover {
    background-color: rgb(242, 237, 217);
}

.tabela_dados tbody tr.erro {
    background-color: rgb(248, 224, 232);
}

    .tabela_dados tbody tr.erro:hover {
        background-color: rgb(255, 174, 201);
    }

.tabela_dados tr {
    height: 30px;
    border-bottom: 1px solid #ddd;
    cursor: pointer;
}

.tabela_dados td.acoes {
    display: inline-flex;
}

    .tabela_dados td.acoes img {
        display: none;
        padding: 5px 3px 3px 3px;
    }

.edicao .tabela_dados tr:hover img {
    display: block;
}

th .sort-arrow.down {
    display: block;
    height: 0;
    width: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid white;
    top: 45px;
    left: 350px;
    margin-top: 8px;
    margin-left: 3px;
}

th .sort-arrow.up {
    display: block;
    height: 0;
    width: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 4px solid white;
    top: 41px;
    left: 350px;
    margin-top: 8px;
    margin-left: 3px;
}


/*#endregion */

/*#region MENU SUPERIOR*/
#id_menu-superior {
    background-color: rgb(29,72,96);
    height: 50px;
    position: fixed;
    width: 100%;
    z-index: 5;
    display: flex;
    justify-content: space-between;
}

    #id_menu-superior > div {
        display: flex;
    }

        #id_menu-superior > div.esq > img {
            margin: 5px
        }

        #id_menu-superior > div.dir > img {
            margin: 5px;
            padding-right: 30px;
            cursor: pointer;
        }

        #id_menu-superior > div > a {
            float: left;
            padding: 14px;
            color: #f2f2f2;
            font-size: 17px;
            text-align: center;
        }

    #id_menu-superior > a:hover {
        background-color: #ddd;
        color: black;
    }

    #id_menu-superior > div > form {
        display: inline;
    }

    #id_menu-superior .comp_pesquisa input[type=text] {
        font-size: 17px;
        border-radius: 5px;
        border: none;
        margin: 10px;
    }

    #id_menu-superior #id_resultados_pesquisa {
        background-color: white;
        width: 300px;
        height: auto;
        border: 1px solid #ccc;
        position: relative;
        top: -7px;
        left: 7px;
        display: none;
    }

        #id_menu-superior #id_resultados_pesquisa > a {
            padding: 4px;
            cursor: pointer;
        }

            #id_menu-superior #id_resultados_pesquisa > a:hover {
                background-color: #f5f5f5;
            }

        #id_menu-superior #id_resultados_pesquisa > p {
            padding-left: 10px;
            margin: 0px;
        }

        #id_menu-superior #id_resultados_pesquisa.resultado.foco, #id_menu-superior #id_resultados_pesquisa.resultado.hover {
            display: flex;
            flex-direction: column;
        }

    #id_menu-superior .comp_login {
        height: 100%;
        width: auto;
        min-width: 205px;
        float: right;
        margin-right: 10px;
        display: grid;
        align-items: center;
        grid-template-columns: auto auto auto;
        grid-template-rows: 50px auto;
    }

        #id_menu-superior .comp_login > img {
            border-radius: 50%;
        }

        #id_menu-superior .comp_login .textos p {
            margin: 0px 8px 0px 8px;
        }

    #id_menu-superior #id_login_nome {
        color: white;
        font-size: 14px;
    }

    #id_menu-superior #id_login_grupo, #id_menu-superior #id_login_cliente {
        color: white;
        font-size: 10px;
    }

    #id_menu-superior .comp_login .dropdown-arrow {
        height: 0;
        width: 0;
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
        border-top: 4px solid white;
        top: 45px;
        left: 350px;
    }

    #id_menu-superior .comp_login .dropdown-content {
        display: none;
        position: relative;
        background-color: rgb(249,249,249);
        top: 0;
        left: 0px;
        width: 100%;
        z-index: 1;
        border: 1px solid rgb(228,228,228);
        grid-column: 1 / span 3;
    }

        #id_menu-superior .comp_login .dropdown-content:hover {
            background-color: rgb(235,235,235);
        }

        #id_menu-superior .comp_login .dropdown-content a {
            display: flex;
            flex-direction: row;
            align-items: center;
            padding: 0px 0px 0px 10px;
            height: 30px;
            margin: 0px;
            width: 95%;
        }

        #id_menu-superior .comp_login .dropdown-content p {
            color: black;
            padding: 0 0 0 10px;
            font-size: 14px;
        }

    #id_menu-superior .comp_login:hover .dropdown-content {
        display: block;
    }

    #id_menu-superior .comp_login:hover .dropdown-arrow {
        height: 0;
        width: 0;
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
        border-bottom: 4px solid white;
        border-top: 0px;
        top: 41px;
        left: 350px;
    }

#id_caixa_pesquisa {
    width: 300px;
}

    #id_caixa_pesquisa:focus {
        width: 500px;
        animation-name: campo-pesquisa;
        animation-duration: 0.5s;
        animation-timing-function: ease;
    }

#id_menu-superior .ajuda {
    position: relative;
    width: 50px;
    vertical-align: middle;
    display: grid;
    grid-template-rows: 50px 200px;
    cursor: pointer;
}

    #id_menu-superior .ajuda:hover {
        height: 250px;
    }

    #id_menu-superior .ajuda img {
        margin: auto;
    }

#id_painel_ajuda {
    background-color: white;
    position: absolute;
    top: 52px;
    left: -60px;
    width: 280px;
    padding: 10px;
    flex-direction: column;
    gap: 20px;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    border-radius: 5px;
    display: none;
}

#id_menu-superior .ajuda:hover #id_painel_ajuda {
    display: flex;
}

#id_painel_ajuda > p {
    font-size: 16px;
    font-weight: bold;
    cursor: default;
}

#id_painel_ajuda img {
    width: 24px;
}

#id_painel_ajuda div {
    display: grid;
    grid-template-columns: 60px auto;
    align-items: center;
}

#id_painel_ajuda a {
    color: inherit;
    text-decoration: none;
    padding: 5px;
    cursor: pointer;
}

    #id_painel_ajuda a:hover {
        background-color: rgb(242, 237, 217);
    }

#id_painel_ajuda div p {
    font-size: 14px;
    text-decoration: none;
}

@keyframes campo-pesquisa {
    from {
        width: 300px;
    }

    to {
        width: 500px;
    }
}
/*#endregion*/

/*#region DETALHES - CABEÇALHO*/

#id_cabecalho {
    position: fixed;
    top: 50px;
    width: 100%;
    z-index: 3;
}

    #id_cabecalho .principal {
        position: absolute;
        background-color: rgb(61,92,135);
        width: 365px;
        height: 200px;
        border-bottom-right-radius: 20px;
        color: white;
        border-left: none;
        z-index: 3;
    }

        #id_cabecalho .principal .logo_preso img {
            background-color: white;
            border-radius: 55%;
            border: 1px solid black;
            margin: 15px 0px 0px 15px;
        }

        #id_cabecalho .principal .flex {
            display: inline-flex;
            align-items: center;
            left: 0px;
            position: absolute;
            left: 10px;
        }

            #id_cabecalho .principal .flex.pec {
                top: 90px;
            }

            #id_cabecalho .principal .flex.registro {
                top: 110px;
            }

            #id_cabecalho .principal .flex.idade {
                top: 130px;
            }

            #id_cabecalho .principal .flex > div {
                margin: 2px;
            }

            #id_cabecalho .principal .flex .titulo_item {
                font-weight: bold;
            }

        #id_cabecalho .principal .icones {
            position: absolute;
            top: 160px;
            width: 100%;
            display: grid;
            grid-template-columns: 1fr 1fr;
        }

            #id_cabecalho .principal .icones .preso {
                padding-left: 10px;
            }

                #id_cabecalho .principal .icones .preso img {
                    float: left;
                    padding: 5px;
                }

            #id_cabecalho .principal .icones .cadastro img {
                float: right;
                padding: 5px;
            }


#id_cabecalho_nome {
    position: absolute;
    font-size: 20px;
    top: 0px;
    left: 100px;
    display: flex;
    align-items: center;
    height: 85px;
    padding: 5px;
}

#id_cabecalho section.dados {
    position: absolute;
    background-color: rgb(112,146,190);
    display: inline-flex;
    top: 0px;
    left: 350px;
    height: 150px;
    border-bottom-right-radius: 10px;
    padding-left: 15px;
    z-index: 2;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

    #id_cabecalho section.dados.mostrar-modo {
        animation-name: anim_cabecalho_dados_ocultar;
        animation-duration: 0.5s;
        animation-timing-function: ease;
        animation-fill-mode: forwards;
        animation-direction: normal;
    }

    #id_cabecalho section.dados.ocultar-modo {
        animation-name: anim_cabecalho_dados_mostrar;
        animation-duration: 0.5s;
        animation-delay: 0.2s;
        animation-timing-function: ease;
        animation-fill-mode: forwards;
        animation-direction: normal;
    }

    #id_cabecalho section.dados section.info {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: 1fr 1fr 1fr 1fr;
        grid-gap: 8px;
        padding: 10px 10px 10px 10px;
    }

        #id_cabecalho section.dados section.info > div {
            background-color: white;
            box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
            width: 160px;
            display: grid;
            grid-template-columns: 1fr 4fr;
            text-align: center;
            border-radius: 3px;
        }

        #id_cabecalho section.dados section.info .icone {
            background-color: rgb(61,92,135);
            border-top-left-radius: 3px;
            border-bottom-left-radius: 3px;
            width: 30px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        #id_cabecalho section.dados section.info .item {
            background-color: white;
            padding-top: 4px;
            font-weight: bold;
            border-radius: 3px;
        }

    #id_cabecalho section.dados section.lupas {
        display: grid;
        grid-template-columns: auto auto;
        padding: 10px 10px 10px 0px;
        font-size: 12px;
    }

        #id_cabecalho section.dados section.lupas .icone {
            background-color: rgb(61,92,135);
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
            border-top-left-radius: 3px;
            border-bottom-left-radius: 3px;
        }

            #id_cabecalho section.dados section.lupas .icone img {
                height: 16px;
                padding: 0px 5px 0px 5px;
            }

        #id_cabecalho section.dados section.lupas .dados {
            background-color: white;
            display: grid;
            grid-template-columns: 100px 170px;
            box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
            border-top-right-radius: 3px;
            border-bottom-right-radius: 3px;
            padding-left: 6px;
        }

    #id_cabecalho section.dados section.datas {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        grid-template-rows: 1fr 1fr;
        grid-gap: 10px;
        padding: 10px 10px 10px 0px;
        width: 660px;
    }

        #id_cabecalho section.dados section.datas > div {
            background-color: white;
            position: relative;
            box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
            border-radius: 3px;
        }

        #id_cabecalho section.dados section.datas .quadro .logo {
            position: absolute;
            width: 40px;
            height: 40px;
            top: -8px;
            left: 10px;
            background-color: rgb(233,66,61);
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
        }

            #id_cabecalho section.dados section.datas .quadro .logo img {
                border: 1px solid rgb(220,220,220);
                padding: 4px;
                height: 24px;
            }

            #id_cabecalho section.dados section.datas .quadro .logo.vencido {
                background-color: rgb(34,177,76);
            }

        #id_cabecalho section.dados section.datas .quadro .titulo {
            color: rgb(180,180,180);
            text-transform: uppercase;
            font-size: 9px;
            font-weight: bold;
            width: auto;
            height: 20px;
            margin-left: 60px;
            text-align: center;
            padding-top: 8px;
            padding-right: 3px;
        }

        #id_cabecalho section.dados section.datas .quadro .texto-data {
            color: black;
            font-size: 16px;
            font-weight: bold;
            text-align: center;
            margin-top: 8px;
        }

        #id_cabecalho section.dados section.datas .linha {
            grid-column: span 4;
            position: relative;
        }

            #id_cabecalho section.dados section.datas .linha .base {
                width: 70%;
                margin-left: 20px;
                margin-top: 25px;
            }

            #id_cabecalho section.dados section.datas .linha .barra {
                position: relative;
                height: 8px;
                border-radius: 3px;
            }

            #id_cabecalho section.dados section.datas .linha .cumprido {
                width: 0px;
                background-color: green;
                z-index: 2;
                transition: width 0.5s ease;
            }

            #id_cabecalho section.dados section.datas .linha .saldo {
                width: 100%;
                background-color: rgb(255, 221, 221);
                z-index: 1;
                margin-top: -8px;
            }

#id_linha_valor {
    color: white;
    transition: color 2s ease;
    font-weight: bold;
    margin-left: -15px;
}

#id_linha_valor_alt {
    color: white;
    transition: color 2s ease;
    font-weight: bold;
    margin-left: 185px;
    margin-top: -14px;
    display: none;
}

#id_linha_pc {
    position: absolute;
    font-size: 11px;
    left: 500px;
    top: 15px;
    font-weight: bold;
    color: green;
}

#id_linha_ps {
    position: absolute;
    font-size: 11px;
    left: 500px;
    top: 40px;
    font-weight: bold;
    color: red;
}

#id_cabecalho section.dados section.botoes {
    display: grid;
    grid-template-rows: 1fr 1fr;
}

    #id_cabecalho section.dados section.botoes button {
        border: none;
        border-left: 1px solid lightgrey;
        background-color: rgb(107, 140, 182);
        color: white;
    }

        #id_cabecalho section.dados section.botoes button:hover {
            background-color: rgb(132, 164, 198);
        }

    #id_cabecalho section.dados section.botoes div {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    #id_cabecalho section.dados section.botoes img {
        padding-bottom: 8px;
    }

    #id_cabecalho section.dados section.botoes button.editar {
        border-bottom: 1px solid lightgrey;
    }

    #id_cabecalho section.dados section.botoes button.arquivar {
        border-bottom-right-radius: 10px;
    }

#id_cabecalho section.modo {
    position: absolute;
    background-color: white;
    display: none;
    top: 0px;
    height: 150px;
    border-bottom-right-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    z-index: 1;
}

#id_cabecalho section.salvar.mostrar-modo {
    display: block;
    animation-name: anim_cabecalho_modo_salvar_mostrar;
    animation-duration: 0.2s;
    animation-delay: 0.5s;
    animation-timing-function: ease;
    animation-fill-mode: forwards;
}

#id_cabecalho section.arquivar.mostrar-modo {
    display: block;
    animation-name: anim_cabecalho_modo_arquivar_mostrar;
    animation-duration: 0.2s;
    animation-delay: 0.5s;
    animation-timing-function: ease;
    animation-fill-mode: forwards;
}

#id_cabecalho section.arquivar.ocultar-modo {
    display: block;
    animation-name: anim_cabecalho_modo_arquivar_ocultar;
    animation-duration: 0.2s;
    animation-timing-function: ease;
    animation-fill-mode: forwards;
}

#id_cabecalho section.modo > div {
    display: flex;
    flex-direction: column;
}

#id_cabecalho section.modo .titulo {
    background-color: rgb(112, 146, 190);
    height: 20px;
    width: 100%;
    color: rgb(241, 243, 245);
    text-align: center;
    font-size: 11px;
    padding-top: 1px;
}

#id_cabecalho section.modo button {
    height: 40px;
    width: 150px;
    padding: 8px;
    margin-left: 25px;
}

#id_cabecalho section.modo .salvar {
    margin-top: 15px;
}

#id_cabecalho section.modo .cancelar {
    margin-top: 15px;
}

#id_cabecalho section.modo .texto {
    position: absolute;
    top: 28px;
    left: 200px;
    width: 250px;
    height: auto;
    text-align: justify;
    padding-top: 5px;
}

#id_cabecalho section.modo button {
    height: 40px;
    width: 150px;
    padding: 8px;
    margin-left: 25px;
}

#id_cabecalho section.salvar {
    display: none;
    width: 200px;
    left: 0px;
}

#id_cabecalho section.arquivar {
    display: none;
    width: 500px;
    left: -200px;
}



@keyframes anim_cabecalho_dados_ocultar {
    from {
        left: 350px;
    }

    to {
        left: -1000px;
    }
}

@keyframes anim_cabecalho_dados_mostrar {
    from {
        left: -1000px;
    }

    to {
        left: 350px;
    }
}

@keyframes anim_cabecalho_modo_salvar_mostrar {
    from {
        left: 0px;
    }

    to {
        left: 365px;
    }
}

@keyframes anim_cabecalho_modo_arquivar_mostrar {
    from {
        left: -200px;
    }

    to {
        left: 365px;
    }
}

@keyframes anim_cabecalho_modo_arquivar_ocultar {
    from {
        left: 365px;
    }

    to {
        left: -200px;
    }
}


@media (max-width: 1600px) {
    #id_cabecalho section.dados section.botoes {
        position: absolute;
        top: 151px;
        left: 12px;
        display: inline-flex;
    }

        #id_cabecalho section.dados section.botoes div {
            display: flex;
            flex-direction: row;
            padding: 4px;
            width: 100px;
        }

        #id_cabecalho section.dados section.botoes button.editar {
            border-bottom: none;
        }

        #id_cabecalho section.dados section.botoes img {
            padding-bottom: 0px;
            height: 20px;
        }

        #id_cabecalho section.dados section.botoes p {
            padding-left: 5px;
        }
}

@media (max-width: 1520px) {
    #id_cabecalho section.dados section.datas {
        width: 550px;
    }

        #id_cabecalho section.dados section.datas .quadro .logo {
            width: 36px;
            height: 36px;
            top: -8px;
            left: 6px;
        }

            #id_cabecalho section.dados section.datas .quadro .logo img {
                height: 20px;
            }

        #id_cabecalho section.dados section.datas .quadro .titulo {
            font-size: 8px;
            margin-left: 45px;
            padding-top: 5px;
        }

        #id_cabecalho section.dados section.datas .quadro .texto-data {
            margin-top: 12px;
        }

    #id_linha_pc, #id_linha_ps {
        font-size: 10px;
        left: 410px;
    }
}

@media (max-width: 1420px) {
    #id_cabecalho section.dados section.datas {
        width: 430px;
    }

        #id_cabecalho section.dados section.datas .quadro .logo {
            width: 24px;
            height: 24px;
            top: -8px;
            left: 3px;
        }

            #id_cabecalho section.dados section.datas .quadro .logo img {
                height: 12px;
            }

        #id_cabecalho section.dados section.datas .quadro .titulo {
            font-size: 8px;
            margin-left: 30px;
            padding-top: 5px;
        }

        #id_cabecalho section.dados section.datas .quadro .texto-data {
            margin-top: 12px;
        }

    #id_linha_pc, #id_linha_ps {
        font-size: 10px;
        left: 330px;
    }

    #id_linha_pc {
        top: 0px;
    }

    #id_linha_ps {
        top: 30px;
    }
}

@media (max-width: 1300px) {
    #id_cabecalho section.dados section.datas {
        width: 250px;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr 1fr;
    }

        #id_cabecalho section.dados section.datas .quadro .titulo {
            padding-top: 1px;
        }

        #id_cabecalho section.dados section.datas .quadro .texto-data {
            margin-top: 0px;
            font-size: 16px;
        }

        #id_cabecalho section.dados section.datas .linha {
            grid-column: span 2;
            height: 20px;
        }

            #id_cabecalho section.dados section.datas .linha .base {
                margin-top: 6px;
            }

    #id_linha_pc, #id_linha_ps {
        display: none;
    }

    #id_linha_valor {
        display: none;
    }

    #id_linha_valor_alt {
        display: block;
    }
}


/*#endregion*/

/*#region DETALHES - MENU LATERAL*/
#id_menu-lateral {
    margin: 0px;
    padding: 210px 0px 0px 0px;
    width: 200px;
    background-color: rgb(45,50,62);
    position: fixed;
    top: 50px;
    height: 100%;
    overflow: auto;
    /*    transition: 1s;*/
    z-index: 1;
}

    #id_menu-lateral button {
        display: inline-flex;
        background-color: inherit;
        color: white;
        padding: 22px 16px;
        width: 100%;
        border: none;
        outline: none;
        cursor: pointer;
        transition: 0.3s;
        text-align: left;
        white-space: nowrap;
        visibility: visible;
    }

    #id_menu-lateral img {
        margin-right: 15px;
    }

    #id_menu-lateral p {
        font-size: 14px;
        padding-top: 1px;
    }

    #id_menu-lateral button:hover {
        background-color: rgb(64,64,64);
    }

    #id_menu-lateral button.ativo {
        background-color: rgb(82,134,186);
        color: white;
    }

    #id_menu-lateral button.oculto {
        visibility: hidden;
    }
/*#endregion*/

/*#region DETALHES - SEÇÕES PRESO*/
#id_conteudo-preso {
    position: absolute;
    top: 250px;
    left: 200px;
    right: 0;
    bottom: 0;
    z-index: -1;
    overflow: hidden;
}

    #id_conteudo-preso .secao {
        display: none;
    }

        #id_conteudo-preso .secao.ativo {
            display: block;
        }

    #id_conteudo-preso .secao_container {
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        display: grid;
        grid-template-rows: 100%;
        overflow-y: auto;
    }

    #id_conteudo-preso .quadro {
        padding: 20px;
        display: grid;
        grid-template-rows: 40px auto;
        overflow: hidden;
    }

        #id_conteudo-preso .quadro > .titulo {
            background-color: rgb(82, 134, 186);
            color: white;
            font-weight: normal;
            line-height: 40px;
            border-top-left-radius: 5px;
            border-top-right-radius: 5px;
            text-align: center;
        }

        #id_conteudo-preso .quadro > .tab3 {
            display: grid;
            grid-template-columns: 1fr 1fr 1fr;
            grid-column-gap: 5px;
        }

        #id_conteudo-preso .quadro > .tab9 {
            display: grid;
            grid-template-columns: repeat(8, 1fr);
            grid-column-gap: 5px;
        }

        #id_conteudo-preso .quadro > .conteudo {
            min-height: 100px;
            box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
            padding: 15px;
            background-color: white;
            overflow-y: auto;
        }

    #id_conteudo-preso .subsecao {
        display: none;
        /*        height: 100%;*/
    }

        #id_conteudo-preso .subsecao.ativo {
            display: block;
        }
/*#endregion*/

/*#region DETALHES - SEÇÃO RESUMO*/
#id_secao-resumo .secao_container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 1px;
}

#id_secao-resumo .quadro .observacao {
    display: inline-flex;
    align-items: center;
}

    #id_secao-resumo .quadro .observacao p {
        padding-left: 10px;
        font-size: 14px;
    }

#id_secao-resumo .quadro.lt .conteudo {
    padding: 15px 50px 15px 50px;
}

#id_secao-resumo .lousa {
    position: relative;
    height: 235px;
    padding-left: 0px;
}

    #id_secao-resumo .lousa .linha {
        position: relative;
        top: 105px;
        height: 5px;
        display: inline-flex;
        background-color: darkgray;
    }

    #id_secao-resumo .lousa .segmento-linha.int {
        background-color: red;
    }

    #id_secao-resumo .lousa .segmento-linha.cmp {
        background-color: blue;
    }

    #id_secao-resumo .lousa .mc {
        border-left: 1px solid black;
        padding-left: 2px;
        width: auto;
    }

    #id_secao-resumo .lousa .tp {
        position: absolute;
        bottom: 120px;
    }

    #id_secao-resumo .lousa .bx {
        position: absolute;
        top: 120px;
    }

        #id_secao-resumo .lousa .bx div {
            position: absolute;
            bottom: 0px;
        }

    #id_secao-resumo .lousa .m1 {
        height: 100px;
    }

    #id_secao-resumo .lousa .m2 {
        height: 70px;
    }

    #id_secao-resumo .lousa .m3 {
        height: 40px;
        margin-left: -1px;
    }

    #id_secao-resumo .lousa .mc.rv .tx {
        right: 5px;
    }

#id_secao-resumo .mc .tx p {
    font-weight: bold;
}

#id_secao-resumo .mc.at .tx p {
    color: maroon;
}

/*#endregion*/

/*#region DETALHES - SEÇÃO DADOS*/

#id_secao-dados .conteudo .subsecao.tabela {
    /*  height: 90%;*/
}

#id_secao-dados .botao_tab {
    position: relative;
    display: flex;
}

    #id_secao-dados .botao_tab > div {
        margin: auto;
    }


#id_secao-dados .conteudo .subsecao button {
    display: none;
    background-color: rgb(11,108,205);
    color: white;
    width: 200px;
    height: 30px;
    margin: 10px 20px 0px 10px;
    outline: none;
    text-align: center;
    cursor: pointer;
    line-height: 0;
    border-radius: 3px;
    border: none;
    font-size: 13px;
    position: relative;
}

#id_secao-dados .conteudo .subsecao .botao-adicionar-linha:hover {
    background-color: rgb(92,157,222);
}

#id_secao-dados .conteudo .subsecao .botao-adicionar-linha img {
    position: absolute;
    top: 8px;
    left: 10px;
}

#id_secao-dados .conteudo .subsecao .botao-adicionar-linha p {
    position: absolute;
    top: 16px;
    left: 35px;
}

#id_secao-dados.edicao .conteudo .subsecao button {
    display: block;
}


#id_secao-dados .conteudo .campos .cd.erro p {
    visibility: visible;
}

#id_secao-dados .conteudo .campos .cd.erro input {
    background-color: rgb(255, 182, 193);
    border: 1px solid red;
}

#id_secao-dados .conteudo .campos .cd.erro select {
    background-color: rgb(255, 182, 193);
    border: 1px solid red;
}
/*
    #id_secao-dados .conteudo > div > button {
        position: relative;
    }

        #id_secao-dados .conteudo > div > button.erro {
            background-color: rgb(255,174,201);
        }

            #id_secao-dados .conteudo > div > button.erro.active {
                background-color: red;
            }

        #id_secao-dados .conteudo > div > button > div {
            padding-top: 2px;
        }



    #id_secao-dados .conteudo .quadros {
        grid-column: 1 / span 8;
        display: flex;
        flex-direction: column;
    }

        #id_secao-dados .conteudo .quadros > div {
            background-color: white;
            padding: 25px;
            box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
        }*/




#id_subsecao-basicos > .campos {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 20px;
    grid-row-gap: 15px;
}

    #id_subsecao-basicos > .campos .item-formulario {
        grid-template-columns: 150px auto;
    }

#id_subsecao-basicos .sp2 {
    grid-column: span 2;
}
/*


#id_secao-dados_subsecao-basicos label {
    width: 150px;
    background-color: rgb(61,92,135);
    color: white;
    padding: 3px;
    text-transform: uppercase;
    font-size: 12px;
}

#id_secao-dados_subsecao-basicos .c1 input {
    width: 600px;
    height: 22px;
    position: relative;
    left: -1px;
}

#id_secao-dados_subsecao-basicos .c2 input, #id_secao-dados_subsecao-basicos .c2 select {
    width: 200px;
    height: 22px;
    position: relative;
    left: -1px;
}
*/


#id_secao-dados .icone-erro {
    position: relative;
}

    #id_secao-dados .icone-erro > img {
        visibility: hidden;
    }

    #id_secao-dados .icone-erro.erro > img {
        visibility: visible;
    }

    #id_secao-dados .icone-erro .erro_pop-up {
        position: absolute;
        z-index: 1;
        visibility: hidden;
        width: 200px;
        background-color: darkred;
        color: white;
        left: -35px;
        top: -25px;
        border-radius: 3px;
        padding: 3px 6px 3px 6px;
    }

        #id_secao-dados .icone-erro .erro_pop-up::after {
            content: " ";
            position: absolute;
            top: 100%;
            left: 50%;
            margin-left: -5px;
            border-width: 5px;
            border-style: solid;
            border-color: darkred transparent transparent transparent;
        }


    #id_secao-dados .icone-erro.erro:hover .erro_pop-up {
        visibility: visible;
    }



/*Aba regimes e condenações*/
.mensagem_erro {
    display: none;
    color: red;
}

    .mensagem_erro.erro {
        display: block;
        /*        position: absolute;
        top: 120px;
        left: 50px*/
    }

/*Aba multa*/
#id_secao-dados_subsecao-multas > div {
    display: inline-flex;
}

#id_secao-dados_subsecao-multas .botao-exclusivo-multa {
    background-color: rgb(155,5,5);
}

    #id_secao-dados_subsecao-multas .botao-exclusivo-multa img {
        background-color: white;
        border-radius: 50%;
    }

    #id_secao-dados_subsecao-multas .botao-exclusivo-multa.inativo img {
        background-color: darkgrey;
        border-radius: 50%;
    }

/*#endregion*/

/*#region DETALHES - SEÇÃO CÁLCULOS*/


#id_secao-calculos .subsecao .colunas {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 40px;
}

#id_secao-calculos .subsecao .titulo_grupo {
    background-color: rgb(61, 92, 135);
    color: white;
    padding-left: 3px;
}

#id_secao-calculos .subsecao .requisito-objetivo > div:nth-child(2) {
    padding-left: 30px;
}

#id_secao-calculos .subsecao .requisito-subjetivo > div:nth-child(2) {
    padding-left: 30px;
    padding-top: 10px;
}

#id_secao-calculos .subsecao .requisito-objetivo section {
    padding-top: 10px;
}

    #id_secao-calculos .subsecao .requisito-objetivo section.lista > div {
        margin-left: -10px;
        display: grid;
        grid-template-columns: 10px 180px 260px auto;
    }

#id_secao-calculos .subsecao p.resultado {
    border-top: 1px solid rgb(180,180,180);
    margin-top: 2px;
    width: 90%;
}

/*#endregion*/

/*#region DETALHES - SEÇÃO RELATÓRIO*/

#id_secao-relatorios .conteudo {
    display: inline-flex;
    padding: 50px;
    width: 80%;
}

#id_secao-relatorios .botao-grande {
    margin-right: 50px;
}
/*#endregion*/

/*#region PESQUISA*/
#id_tela_pesquisa {
    position: absolute;
    top: 50px;
    bottom: 0;
    left: 0;
    right: 0;
    display: grid;
    grid-template-columns: 240px auto;
    overflow: hidden;
}

    #id_tela_pesquisa .filtro {
        width: 200px;
        min-width: 200px;
        background-color: white;
        box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
        margin: 10px;
        padding: 10px;
        overflow-y: auto;
    }

        #id_tela_pesquisa .filtro > h5 {
            margin: 5px 0px 15px 0px;
            font-size: 16px;
            color: rgb(59,59,59);
        }

        #id_tela_pesquisa .filtro > .acoes {
            display: flex;
            flex-direction: row;
            margin-bottom: 10px;
        }

            #id_tela_pesquisa .filtro > .acoes > p {
                margin-bottom: 5px;
                text-decoration: underline;
                font-size: 14px;
                color: rgb(90,90,90);
                cursor: pointer;
            }

            #id_tela_pesquisa .filtro > .acoes > button {
                border: 1.5px solid rgb(47,186,25);
                border-radius: 4px;
                background-color: rgb(47,186,25);
                color: white;
                margin-left: 10px
            }

                #id_tela_pesquisa .filtro > .acoes > button:hover {
                    border-color: rgb(185, 238, 178);
                    background-color: rgb(185, 238, 178);
                }

        #id_tela_pesquisa .filtro div.gf {
            display: flex;
            flex-direction: column;
            margin-bottom: 10px;
            padding: 5px 5px 5px 5px;
            border: 1px solid lightgrey;
            border-radius: 5px;
            box-shadow: rgba(0, 0, 0, 0.24) 0px 1px 3px;
        }

            #id_tela_pesquisa .filtro div.gf.filtrado {
                background-color: lightyellow;
            }

            #id_tela_pesquisa .filtro div.gf > * {
                margin-bottom: 5px;
            }

            #id_tela_pesquisa .filtro div.gf > input[type=date] {
                width: 120px;
            }

            #id_tela_pesquisa .filtro div.gf.sd > div {
                display: flex;
                flex-direction: row;
            }

            #id_tela_pesquisa .filtro div.gf.sd div > p {
                width: 100px;
                padding: 2px;
            }

        #id_tela_pesquisa .filtro .gf .alerta {
            color: maroon;
        }

        #id_tela_pesquisa .filtro div.erro {
            border: 1px solid red;
        }

    #id_tela_pesquisa .resultados {
        display: grid;
        grid-template-rows: 100px auto;
        overflow: hidden;
    }

    #id_tela_pesquisa .quadro {
        background-color: white;
        box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
        margin: 10px;
        overflow-y: auto;
    }

        #id_tela_pesquisa .quadro p {
            margin: 10px;
            font-size: 16px;
        }

@media (max-height:880px) {

    #id_tela_pesquisa .filtro > .acoes {
        margin-bottom: 5px;
    }

    #id_tela_pesquisa .filtro > h5 {
        margin: 3px 0px 5px 0px;
        font-size: 14px;
    }

    #id_tela_pesquisa .filtro div.gf {
        margin-bottom: 5px;
        padding: 5px 5px 5px 5px;
    }

        #id_tela_pesquisa .filtro div.gf > * {
            margin-bottom: 1px;
        }

    #id_tela_pesquisa h6 {
        font-size: 10px;
    }
}

/*#endregion*/

/*#region VIDEOS*/
#id_videos {
    padding: 0 50px 50px 50px;
}

    #id_videos > h4 {
        font-size: 24px;
        margin: 20px 0px;
    }

    #id_videos > p {
        font-size: 22px;
        color: rgb(59,59,59);
    }

    #id_videos section h5 {
        font-size: 20px;
        margin-bottom: 5px;
        border-bottom: 2px solid black;
        text-transform: uppercase;
    }

    #id_videos .container {
        display: flex;
        flex-wrap: wrap;
        gap: 50px;
    }

    #id_videos .card {
        border-radius: 10px;
        cursor: pointer;
        width: 250px;
        background-color: white;
    }

        #id_videos .card:hover {
            background-color: rgb(242, 237, 217);
        }

        #id_videos .card img {
            border-radius: 10px 10px 10px 10px;
            width: 100%;
        }

        #id_videos .card > div {
            padding: 10px;
            display: none;
        }

        #id_videos .card h6 {
            font-size: 18px;
            color: rgb(59,59,59);
            text-transform: uppercase;
            margin-bottom: 10px;
            text-align: center;
        }

        #id_videos .card p {
            font-size: 16px;
            color: rgb(90,90,90);
        }

#id_player {
    justify-content: center;
    flex-wrap: wrap;
    align-content: center;
    display: none;
    display: flex;
    position: fixed;
    z-index: 100;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0,0,0,0.9);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

    #id_player.show {
        /*display: flex;*/
        opacity: 1;
        visibility: visible;
    }

    #id_player > div {
        position: relative;
        width: auto;
        height: auto;
    }

    #id_player video {
        height: 400px;
    }

    #id_player .close-btn {
        position: absolute;
        top: 18px;
        right: 5px;
        background: rgba(0,0,0,0.6);
        color: white;
        border: none;
        border-radius: 50%;
        width: 30px;
        height: 30px;
        font-size: 18px;
        cursor: pointer;
        line-height: 30px;
        text-align: center;
        display: none;
        z-index: 150;
    }

    #id_player > div:hover .close-btn {
        display: block;
    }
/*#endregion*/

/*#region LUPAS*/
.lupa {
    position: absolute;
    background-color: rgb(251, 250, 242);
    border: 1px solid black;
    left: 12px;
    width: 950px;
    height: auto;
    font-size: 12px;
    padding: 20px;
    padding-top: 5px;
    z-index: 1000;
    border-radius: 5px;
}

    .lupa p.formula {
        font-style: italic;
    }

.lupa-cabecalho > section, .lupa-calculos > section {
    padding-left: 15px;
    padding-top: 5px;
}

    .lupa-cabecalho > section > div.ex {
        text-decoration: line-through;
    }

    .lupa-cabecalho > section.lista_condenacoes > div {
        display: grid;
        grid-template-columns: 20% 15% 18% 11% 12% 12% 13%;
    }

    .lupa-cabecalho > section.lista_abatimentos > div {
        display: grid;
        grid-template-columns: 20% 20% 20% auto;
    }

    .lupa-cabecalho > section.lista_interrupcoes > div {
        display: grid;
        grid-template-columns: 20% 20% 20% 20% auto;
    }

    .lupa-cabecalho > section.lista_remicoes > div {
        display: grid;
        grid-template-columns: 20% 20% 20% 20% auto;
    }

    .lupa-cabecalho > section.pena-imposta {
        display: grid;
        grid-template-columns: 1% 17% auto;
        grid-row-gap: 2px;
    }

    .lupa-cabecalho > section.pena-cumprida {
        display: grid;
        grid-template-columns: 1% 17% auto;
        grid-row-gap: 2px;
    }

    .lupa-cabecalho > section.saldo {
        display: grid;
        grid-template-columns: 1% 17% auto;
        grid-row-gap: 2px;
    }

    .lupa-cabecalho > section.resultado {
        padding-left: 15px;
        padding-top: 30px;
        display: grid;
    }

        .lupa-cabecalho > section.resultado > div {
            display: inline-flex;
        }

            .lupa-cabecalho > section.resultado > div > h6 {
                margin-right: 5px;
            }

    .lupa-cabecalho > section > div.resultado {
        font-size: 12px;
        border-top: solid rgb(180,180,180) 1px;
    }

.lupa-calculos h3 {
    margin-top: 10px;
}

.lupa-calculos > section.calculos {
    display: grid;
    grid-template-columns: 30% 30% 40%;
    grid-template-rows: 1fr 1fr 1fr;
    grid-row-gap: 10px;
}

    .lupa-calculos > section.calculos span {
        font-size: 10px;
        font-weight: normal;
        font-style: italic;
    }

    .lupa-calculos > section.calculos .span2 {
        grid-column: span 2;
    }

.lupa-calculos > section.lista {
    display: grid;
    grid-template-columns: 20% 15% 18% 11% 12% 12% 13%;
}

/*#endregion*/

/*#region MODAIS*/
.modal {
    display: none;
    position: fixed;
    z-index: 100;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.4);
    font-size: 0.8EM;
}

.modal_caixa {
    background-color: white;
    margin: auto;
    padding: 0px;
    border: 1px solid rgb(4,120,206);
    width: 40%;
}

.modal_linha-titulo {
    background-color: rgb(4,120,206);
    text-align: center;
    height: 40px;
    color: white;
    line-height: 40px;
    font-size: 16px;
    display: grid;
    grid-template-columns: 30px auto 30px;
    text-transform: uppercase;
}

    .modal_linha-titulo .modal_botao-fechar {
        /*float: right;*/
        font-size: 36px;
        line-height: 30px;
    }

        .modal_linha-titulo .modal_botao-fechar:hover, .modal_linha-titulo .modal_botao-fechar:focus {
            color: #000;
            text-decoration: none;
            cursor: pointer;
        }

.modal_conteudo {
    padding: 20px;
    grid-column-gap: 20px;
}

    .modal_conteudo .dados {
        display: grid;
        grid-row-gap: 15px;
    }

    .modal_conteudo .opcoes {
        border-right: 1px solid black;
        display: flex;
        flex-direction: column;
    }

        .modal_conteudo .opcoes > label {
            margin-bottom: 10px;
        }

        .modal_conteudo .opcoes > .rad {
            height: 40px;
        }

/*avaliar se precisa cada um abaixo*/
.modal_caixa .modal_conteudo .cm p {
    position: absolute;
    display: block;
    visibility: hidden;
    font-size: 11px;
}

.modal_caixa .modal_conteudo .cm.erro p {
    color: red;
    visibility: visible;
}

.modal_caixa .modal_conteudo .cm.erro-externo p {
    color: darkolivegreen;
    visibility: visible;
}

.modal_caixa .modal_conteudo .cm.erro input {
    background-color: rgb(255, 182, 193);
    border: 1px solid red;
}

.modal_caixa .modal_conteudo .cm.erro-externo input {
    background-color: rgb(247, 242, 129);
    border: 1px solid rgb(121, 123, 64);
}

.modal_caixa .modal_conteudo .cm.erro select {
    background-color: rgb(255, 182, 193);
    border: 1px solid red;
}

.modal_caixa .modal_botoes {
    display: flex;
    justify-content: flex-end;
    padding: 0px 20px 20px 0px;
}

.modal_botao-confirmar {
    display: none;
    background-color: rgb(34,139,34);
    color: white;
    padding: 0;
    outline: none;
    text-align: center;
    cursor: pointer;
    transition: 0.3s;
    width: 100px;
    height: 30px;
    line-height: 0;
    border-width: 0;
}

    .modal_botao-confirmar:hover {
    }

.edicao .modal_botao-confirmar {
    display: block;
}

.modal_loader {
    display: none; /* Hide modal by default */
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.4); /* Semi-transparent black background */
}

    .modal_loader .caixa_loader {
        margin: 20% auto; /* Adjust the modal position as needed */
        width: 200px;
        background-color: #fff;
        border-radius: 10px; /* Rounded edges */
        padding: 20px;
        text-align: center;
    }

    .modal_loader .loader {
        display: inline-block;
        width: 40px;
        height: 40px;
        border: 4px solid #f3f3f3;
        border-top: 4px solid #3498db;
        border-radius: 50%;
        animation: spin 1s infinite linear;
    }

/*manter*/
.modal input[type=text], input[type=date], select {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif, sans-serif;
}
/*avaliar se precisa cada um acima*/


/*MODAL-CONDENAÇÕES*/
#id_modal-condenacoes .modal_caixa {
    width: 1000px;
}

#id_modal-condenacoes .modal_conteudo {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    grid-template-rows: auto 100px;
}

#id_modal-condenacoes .item-formulario {
    grid-template-columns: 50% 50%;
}

#id_modal-condenacoes .grupo.checkbox .modal_caixa-descricao {
    margin-top: 10px;
    border: 1px solid rgb(0,0,0);
    height: 60px;
}

#id_modal-condenacoes .grupo.caixas {
    display: flex;
    justify-content: space-between;
    padding-top: 10px;
}

    #id_modal-condenacoes .grupo.caixas .caixa_fracao {
        border: solid 1px darkgrey;
        height: 88px;
        width: 140px;
    }


#id_modal-condenacoes .caixa_fracao h5 {
    color: rgb(64,64,64);
    text-align: center;
    font-size: 10px;
    font-weight: bold;
    margin: 0px;
    padding: 0px
}

#id_modal-condenacoes .caixa_fracao p {
    color: rgb(0,0,64);
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    padding-top: 10px 0px 0px 0px;
    margin: 0px;
}

/*MODAL-REGIMES*/
#id_modal-regimes .modal_caixa {
    width: 400px;
}

/*MODAL-DECRETOS*/
#id_modal-decretos .modal_caixa {
    width: 400px;
}

/*MODAL-INTERRUPCOES*/
#id_modal-interrupcoes .modal_caixa {
    width: 500px;
}

#id_modal-interrupcoes .modal_conteudo {
    display: grid;
    grid-template-columns: 120px auto;
}

#id_modal-interrupcoes_item-periodo-esparsa input {
    width: 50px;
}

/*MODAL-REMICOES*/
#id_modal-remicoes .modal_caixa {
    min-width: 600px;
}

#id_modal-remicoes .modal_conteudo {
    display: grid;
    grid-template-columns: 150px auto;
}

#id_modal-remicoes .calendarios .grupo_calendarios--container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-gap: 15px;
}

#id_modal-remicoes .calendarios {
    padding: 20px 0;
}

#id_modal-remicoes_painel-trabalho .periodo .item-formulario:last-child {
    margin-top: 10px;
}

#id_modal-remicoes .calendarios .calendario {
    width: 100%;
}

    #id_modal-remicoes .calendarios .calendario th {
        background-color: rgb(176,196,222);
        text-align: center;
        padding: 0px;
        border: 1px solid rgb(176,196,222);
        font-size: 12px;
        height: 12px;
        width: 12px;
    }

    #id_modal-remicoes .calendarios .calendario td {
        text-align: center;
        padding: 0px;
        border: 1px solid rgb(176,196,222);
        font-size: 10px;
        height: 12px;
        width: 12px;
    }

        #id_modal-remicoes .calendarios .calendario td:hover {
            background-color: #e0e0e0;
            cursor: pointer;
        }

        #id_modal-remicoes .calendarios .calendario td.selecionado {
            background-color: rgb(144,238,144);
        }

        #id_modal-remicoes .calendarios .calendario td.inativo {
            background-color: rgb(128,128,128);
            border: 1px solid rgb(128,128,128);
        }

#id_modal-remicoes .calendarios .mes {
    background-color: rgb(176,196,222);
    color: white;
    font-weight: normal;
    text-align: center;
    border: 0.5px solid lightgray;
}

#id_modal-remicoes .calendarios .horas_estudo {
    width: 100%;
}

#id_modal-remicoes .calendarios .dias_trabalho {
    width: 100%;
}

#id_modal-remicoes .calendarios .modal-remicoes_resumo_calendarios {
    display: none;
    grid-template-columns: repeat(12, 1fr);
    margin: 0 auto 20px auto;
}

#id_modal-remicoes .geral {
    display: grid;
    grid-template-columns: 45% 55%;
}

#id_modal-remicoes .modal-remicoes_botao_calendario {
    border: 1px solid gray;
    text-align: center;
    cursor: default;
}

    #id_modal-remicoes .modal-remicoes_botao_calendario.selecionado {
        border: 1px solid gray;
        background-color: rgb(34, 139, 34);
        color: white;
    }

@media (max-height: 880px) {
    #id_modal-remicoes .calendarios .modal-remicoes_resumo_calendarios {
        display: grid;
    }

    #id_modal-remicoes .calendarios .grupo_calendarios--container.trabalho {
        display: block;
    }

    #id_modal-remicoes .calendarios .calendario--container {
        display: none;
    }

        #id_modal-remicoes .calendarios .calendario--container.selecionado {
            display: block;
        }
}

/*MODAL-FALTAS*/
#id_modal-faltas .modal_caixa {
    width: 400px;
}

/*MODAL-DADOS ADICIONAIS*/
#id_modal-dados-adicionais .modal_caixa {
    width: 700px;
}

#id_modal-dados-adicionais .modal_conteudo {
    display: grid;
    grid-template-columns: 180px auto;
}

/*MODAL-MULTAS*/
#id_modal-multas .modal_caixa {
    width: 800px;
}

#id_modal-multas .modal_conteudo {
    display: grid;
    grid-template-columns: 180px auto;
}

#id_modal-multas .item-formulario {
    grid-template-columns: 68% 32%;
}

#id_modal-multas .grupo > .painel {
    display: none;
    grid-template-columns: 1fr .9fr;
    grid-column-gap: 20px;
}

    #id_modal-multas .grupo > .painel.visivel {
        display: grid;
    }

#id_modal-multas .caixa {
    overflow-x: hidden;
}

#id_modal-multas .caixa_dados {
    display: grid;
    grid-template-columns: auto auto;
    grid-gap: 10px;
    border: 1px solid black;
    align-items: center;
    padding: 10px;
}

#id_modal-multas h6 {
    font-size: 10px;
}

#id_modal-multas .caixa_dados.destaque {
    background-color: rgb(250, 240, 230);
}

#id_modal-multas .caixa_dados p {
    text-align: right;
    color: rgb(0,0,64);
    font-size: 16px;
    font-weight: bold;
}

    #id_modal-multas .caixa_dados p.destaque {
        font-size: 18px;
    }

#id_modal-multas .calculo label {
    background-color: rgb(61, 92, 135);
    color: white;
    height: 24px;
    display: block;
    width: 100%;
    line-height: 24px;
    padding-left: 5px;
}

#id_modal-multas .original {
    margin-bottom: 10px;
}

#id_modal-multas .corrigido {
    margin-bottom: 20px;
}

/*MODAL-ANÁLISE DECRETOS*/
#id_modal-analise-decretos .modal_caixa {
    width: 900px;
}

#id_modal-analise-decretos .modal_conteudo {
    max-height: 700px;
    overflow-y: auto;
    padding-top: 0px;
    cursor: default;
}

@media (max-height: 750px) {
    #id_modal-analise-decretos.modal {
        padding-top: 50px;
    }

    #id_modal-analise-decretos .modal_conteudo {
        max-height: 600px;
    }
}

#id_modal-analise-decretos section.cabecalho {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 10px;
    margin-bottom: 5px;
    border-top: 20px solid white;
    position: sticky;
    top: 0;
    background-color: white;
    z-index: 10;
}

    #id_modal-analise-decretos section.cabecalho h6 {
        background-color: rgb(61, 92, 135);
        color: white;
        font-weight: normal;
        text-align: center;
        line-height: 30px
    }

    #id_modal-analise-decretos section.cabecalho > div {
        border: 1px solid black;
        height: auto;
    }

    #id_modal-analise-decretos section.cabecalho .situacao > div {
        padding: 5px;
        display: grid;
        grid-template-rows: 1fr 1fr 1fr;
        grid-row-gap: 10px;
    }

        #id_modal-analise-decretos section.cabecalho .situacao > div > div {
        }

    #id_modal-analise-decretos section.cabecalho .situacao .linha-dados {
        visibility: hidden;
        display: grid;
        grid-template-columns: 30% 15% 55%;
    }

        #id_modal-analise-decretos section.cabecalho .situacao .linha-dados.ativo {
            visibility: visible;
        }

        #id_modal-analise-decretos section.cabecalho .situacao .linha-dados label {
            text-align: right;
            font-size: 11px
        }

        #id_modal-analise-decretos section.cabecalho .situacao .linha-dados.head label {
            font-weight: bold;
            font-size: 12px;
        }

        #id_modal-analise-decretos section.cabecalho .situacao .linha-dados p {
            padding-left: 5px;
        }

        #id_modal-analise-decretos section.cabecalho .situacao .linha-dados.head p {
            font-weight: bold;
            font-size: 12px;
        }

        #id_modal-analise-decretos section.cabecalho .situacao .linha-dados .linha {
            margin: auto 0 auto 10px;
        }

        #id_modal-analise-decretos section.cabecalho .situacao .linha-dados.ativo .linha > div {
            height: 5px;
            animation-name: avanco_barras;
            animation-duration: 1s;
        }

        #id_modal-analise-decretos section.cabecalho .situacao .linha-dados:first-child .linha > div {
            background-color: blue;
        }

        #id_modal-analise-decretos section.cabecalho .situacao .linha-dados:nth-child(2) .linha > div {
            background-color: green;
        }

        #id_modal-analise-decretos section.cabecalho .situacao .linha-dados:nth-child(3) .linha > div {
            background-color: red;
        }

    #id_modal-analise-decretos section.cabecalho .resultado_final > p {
        padding: 10px;
    }

#id_modal-analise-decretos .analise {
    margin-bottom: 5px;
    display: none;
}

    #id_modal-analise-decretos .analise.av {
        display: block;
    }

    #id_modal-analise-decretos .analise .barra {
        height: 30px;
        background-color: rgb(204, 229, 255);
        border: 1px solid rgb(60, 118, 61);
        display: grid;
        grid-template-columns: 30px auto 30px;
        animation-name: avanco_barras;
        animation-duration: 0.4s;
    }

        #id_modal-analise-decretos .analise .barra .pointer {
            margin: auto 0px auto 10px;
            font-size: 18px;
            font-weight: bold;
            cursor: pointer;
        }

        #id_modal-analise-decretos .analise .barra .titulo {
            margin: auto 0px auto 0px;
            font-size: 14px;
            font-weight: bold;
            white-space: nowrap;
        }

        #id_modal-analise-decretos .analise .barra img {
            width: 20px;
            margin: auto;
            display: none;
        }

    #id_modal-analise-decretos .analise.conc {
        display: block;
    }

        #id_modal-analise-decretos .analise.conc .barra {
            background-color: rgb(223, 240, 216);
            border: 1px solid rgb(60, 118, 61);
        }

            #id_modal-analise-decretos .analise.conc .barra .pointer {
                color: rgb(60, 118, 61);
            }

            #id_modal-analise-decretos .analise.conc .barra .titulo {
                color: rgb(60, 118, 61);
            }

            #id_modal-analise-decretos .analise.conc .barra img.ok {
                display: block;
            }

    #id_modal-analise-decretos .analise.us {
        display: block;
    }

        #id_modal-analise-decretos .analise.us .barra {
            background-color: rgb(252, 248, 227);
            border: 1px solid rgb(138, 109, 59);
        }

            #id_modal-analise-decretos .analise.us .barra .pointer {
                color: rgb(138, 109, 59);
            }

            #id_modal-analise-decretos .analise.us .barra .titulo {
                color: rgb(138, 109, 59);
            }

            #id_modal-analise-decretos .analise.us .barra img.pi {
                display: block;
            }

    #id_modal-analise-decretos .analise.al {
        display: block;
    }

        #id_modal-analise-decretos .analise.al .barra {
            background-color: rgb(248, 179, 182);
            border: 1px solid rgb(149, 45, 49);
        }

            #id_modal-analise-decretos .analise.al .barra .pointer {
                color: rgb(112, 34, 36);
            }

            #id_modal-analise-decretos .analise.al .barra .titulo {
                color: rgb(112, 34, 36);
            }

            #id_modal-analise-decretos .analise.al .barra img.nok {
                display: block;
            }

        #id_modal-analise-decretos .analise.al.con .barra img.nok {
            display: none;
        }

        #id_modal-analise-decretos .analise.al.con .barra img.con {
            display: block;
        }

    #id_modal-analise-decretos .analise .detalhes {
        background-color: white;
        border: 1px solid green;
        border-top: none;
        height: auto;
        display: none;
        padding: 10px 20px;
    }

    #id_modal-analise-decretos .analise.us .detalhes {
        border: 1px solid rgb(138, 109, 59);
        border-top: none;
    }

    #id_modal-analise-decretos .analise .detalhes .linha_analise {
        display: grid;
        grid-template-columns: 20px auto;
    }

        #id_modal-analise-decretos .analise .detalhes .linha_analise img {
            width: 16px;
        }

    #id_modal-analise-decretos .analise .detalhes .dado.sel {
        display: grid;
        grid-template-columns: 50px 110px;
        align-items: center;
        margin-top: 5px;
    }

    #id_modal-analise-decretos .analise .detalhes .observacao_geral {
        display: grid;
        grid-template-columns: 48px auto;
        grid-column-gap: 15px;
        padding: 10px;
        background-color: rgb(246, 243, 232);
        margin: 15px 0px;
        border-radius: 10px;
        border: 0.1px solid rgb(175, 154, 113);
    }

        #id_modal-analise-decretos .analise .detalhes .observacao_geral > img {
            width: 48px;
            height: 48px;
        }

        #id_modal-analise-decretos .analise .detalhes .observacao_geral > p {
            display: flex;
            align-items: center;
        }

    #id_modal-analise-decretos .analise .confirmacao {
        display: none;
        justify-content: flex-end;
        align-items: center;
    }

    #id_modal-analise-decretos .analise.us .confirmacao {
        display: flex;
    }

#id_modal-analise-decretos .confirmacao p {
    padding-right: 20px;
    color: maroon;
}

#id_modal-analise-decretos .confirmacao .modal_botao-confirmar {
    background-color: rgb(138, 109, 59);
}

    #id_modal-analise-decretos .confirmacao .modal_botao-confirmar:hover {
        background-color: rgb(190,158,105);
    }


#id_modal-analise-decretos .analise.alerta {
    display: block;
}

    #id_modal-analise-decretos .analise.alerta .barra img {
        display: block;
    }

#id_modal-analise-decretos .analise .detalhes .container_condenacoes {
    display: grid;
    grid-template-columns: 0.6fr 1.2fr 1.2fr 1.5fr 1fr 1fr;
    padding: 10px;
    grid-row-gap: 3px;
}

    #id_modal-analise-decretos .analise .detalhes .container_condenacoes .box {
        /*border: 0.5px solid rgb(0,186,0);*/
        border-radius: 3px;
        width: 50px;
        color: white;
        text-align: center;
        position: relative;
        cursor: default;
        height: 15px;
    }

        #id_modal-analise-decretos .analise .detalhes .container_condenacoes .box > div {
            background-color: darkgrey;
            /*  background-color: rgb(255, 193, 7);*/
            height: 13px;
            position: absolute;
            top: 0;
            border-radius: 3px;
            border: 0.1PX solid black;
        }

        #id_modal-analise-decretos .analise .detalhes .container_condenacoes .box.ind {
            background-color: rgb(255, 193, 7);
        }

            #id_modal-analise-decretos .analise .detalhes .container_condenacoes .box.ind > div {
                display: none;
            }

        #id_modal-analise-decretos .analise .detalhes .container_condenacoes .box.nao {
            background-color: rgb(0,186,0);
        }

            #id_modal-analise-decretos .analise .detalhes .container_condenacoes .box.nao > div {
                width: 8px;
                right: 0;
                display: block;
            }

        #id_modal-analise-decretos .analise .detalhes .container_condenacoes .box.sim {
            background-color: red;
        }

            #id_modal-analise-decretos .analise .detalhes .container_condenacoes .box.sim > div {
                width: 10px;
                left: 0;
                display: block;
            }

@keyframes avanco_barras {
    from {
        width: 0%;
    }

    to {
        width: 100%;
    }
}

@keyframes icone_barras {
    from {
        visibility: hidden;
    }

    to {
        visibility: visible;
    }
}

#id_modal-analise-decretos .analise .detalhes .quadro_listagem .linha_analise > .ok {
    background-color: green;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin: auto;
}

#id_modal-analise-decretos .analise .detalhes .quadro_listagem .linha_analise > .nok {
    background-color: rgb(200,0,0);
    width: 6px;
    height: 6px;
    border-radius: 50%;
    margin: auto;
}

#id_modal-analise-decretos .analise .detalhes.indulto > .dados {
    display: grid;
    grid-template-columns: 60px auto;
    margin: 0 10px;
}

#id_modal-analise-decretos .analise .detalhes.indulto .lista_hipoteses > div {
    color: white;
    text-align: center;
    font-size: 14px;
    border-bottom: 1px solid white;
    cursor: default;
    user-select: none;
    display: grid;
    grid-template-columns: 50px 10px;
    align-items: center;
}

    #id_modal-analise-decretos .analise .detalhes.indulto .lista_hipoteses > div.oculto {
        display: none;
    }

#id_modal-analise-decretos .analise .detalhes.indulto .lista_hipoteses div.ativo {
    background-color: white;
    color: black;
}

#id_modal-analise-decretos .analise .detalhes.indulto .lista_hipoteses .btn {
    background-color: rgb(249, 192, 62);
    border-radius: 3px;
    color: black;
    cursor: pointer;
}

    #id_modal-analise-decretos .analise .detalhes.indulto .lista_hipoteses .btn.cdir {
        background-color: rgb(40, 166, 40);
        color: white;
    }

    #id_modal-analise-decretos .analise .detalhes.indulto .lista_hipoteses .btn.sdir {
        background-color: red;
        color: white;
    }

    #id_modal-analise-decretos .analise .detalhes.indulto .lista_hipoteses .btn:hover {
        background-color: rgb(82, 134, 186);
        color: white;
    }

#id_modal-analise-decretos .analise .detalhes.indulto .lista_hipoteses .seta {
    margin-left: 3px;
    width: 0;
    height: 0;
    border-left: 5px solid black;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    display: none;
}

#id_modal-analise-decretos .analise .detalhes.indulto .hipotese.ativo .seta {
    display: block;
}

#id_modal-analise-decretos .analise .detalhes.indulto .resultados {
    padding: 0 10px;
}

    #id_modal-analise-decretos .analise .detalhes.indulto .resultados .analise_hipotese {
        display: none;
    }

        #id_modal-analise-decretos .analise .detalhes.indulto .resultados .analise_hipotese.ativo {
            display: block;
        }

        #id_modal-analise-decretos .analise .detalhes.indulto .resultados .analise_hipotese > div {
            display: grid;
            grid-template-rows: 90px 150px 90px;
        }

        #id_modal-analise-decretos .analise .detalhes.indulto .resultados .analise_hipotese .caixa_rb label {
            cursor: pointer;
        }

    #id_modal-analise-decretos .analise .detalhes.indulto .resultados section.texto_geral {
        overflow-y: auto;
    }

    #id_modal-analise-decretos .analise .detalhes.indulto .resultados section.validacao > div {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-gap: 15px;
        padding-top: 8px;
    }

    #id_modal-analise-decretos .analise .detalhes.indulto .resultados section.validacao .analise_automatica ul {
        margin: 0px;
    }

    #id_modal-analise-decretos .analise .detalhes.indulto .resultados section.validacao .analise_automatica li {
        color: maroon;
    }

        #id_modal-analise-decretos .analise .detalhes.indulto .resultados section.validacao .analise_automatica li.atende {
            color: darkgreen;
        }

    #id_modal-analise-decretos .analise .detalhes.indulto .resultados section.resultado img {
        width: 32px;
        height: 32px;
    }

    #id_modal-analise-decretos .analise .detalhes.indulto .resultados section.resultado p {
        padding-left: 10px;
    }

    #id_modal-analise-decretos .analise .detalhes.indulto .resultados section.resultado div:nth-child(2) {
        display: inline-flex;
        align-items: center;
        padding: 8px 0px 0px 8px;
    }

#id_modal-analise-decretos .analise .detalhes.comutacao h3 {
    margin-bottom: 8px;
}

#id_modal-analise-decretos .analise .detalhes.comutacao .analise-com > div {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 20px;
}

#id_modal-analise-decretos .analise .detalhes.comutacao .periodo {
    display: grid;
    grid-template-columns: 0.7fr 1fr;
    grid-column-gap: 20px;
    width: 400px;
}

    #id_modal-analise-decretos .analise .detalhes.comutacao .periodo > h6 {
        grid-column: span 2;
    }

    #id_modal-analise-decretos .analise .detalhes.comutacao .periodo > .res-conta {
        border-top: 1px solid lightgray;
    }

#id_modal-analise-decretos .analise .pergunta {
    margin-top: 8px;
}

    #id_modal-analise-decretos .analise .pergunta div label {
        cursor: pointer;
    }

    #id_modal-analise-decretos .analise .pergunta p:nth-child(2) {
        font-style: italic;
        color: maroon;
    }

    #id_modal-analise-decretos .analise .pergunta > div {
        margin-left: 10px;
    }

#id_modal-analise-decretos .analise .detalhes.comutacao section.resultado {
    margin-top: 10px;
}

#id_modal-analise-decretos section.conteudo .lancar {
    margin-bottom: 40px
}

    #id_modal-analise-decretos section.conteudo .lancar button {
        display: none;
        align-items: center;
        color: white;
        background-color: darkgreen;
        padding: 3px;
        border: none;
        float: right;
        height: 30px;
        width: 150px;
        margin-top: 10px;
    }

        #id_modal-analise-decretos section.conteudo .lancar button.ativo {
            display: block;
        }

        #id_modal-analise-decretos section.conteudo .lancar button:hover {
            background-color: green;
        }


.modal.acao > div {
    width: 450px;
    height: auto;
    margin: auto;
    background-color: white;
    border-radius: 4px;
}

.modal.acao .barra {
    height: 10px;
    background-color: rgb(255, 202, 10);
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

#id_modal-alerta .corpo {
    height: 150px;
}

#id_modal-analise-decretos .corpo {
    height: 150px;
}

.modal.acao .corpo .titulo {
    font-size: 22px;
    margin: 10px;
}

.modal.acao .corpo .texto {
    font-size: 16px;
    margin: 10px;
}

#id_modal-lancar-decreto .dados {
    display: grid;
    grid-template-columns: 60px 280px;
    grid-gap: 20px;
    padding: 10px 0px 10px 45px;
}

    #id_modal-lancar-decreto .dados textarea {
        background-color: rgb(255, 249, 227);
    }

.modal.acao .botoes {
    border-top: 1px solid rgb(220, 220, 220);
    display: none;
    width: 100%;
    height: 50px;
    justify-content: right;
}

    .modal.acao .botoes.ativo {
        display: flex;
    }

    .modal.acao .botoes button {
        height: 30px;
        margin-top: 10px;
        margin-right: 5px;
    }

/*MODAL NOVO CADASTRO*/
#id_modal-novo-cadastro .modal_caixa {
    width: 500px;
}

#id_modal-novo-cadastro .modal_conteudo {
    display: grid;
    grid-template-columns: 1fr 1fr;
    justify-items: center;
}
/*#endregion*/

/*#region PAGINA DE ERRO */
#id_pagina_erro {
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #ffffff;
    padding: 20px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
    height: 30%;
    width: 25%;
}

    #id_pagina_erro img {
        margin-top: 40px;
        height: 128px;
    }

    #id_pagina_erro p {
        font-size: 18px;
        color: #333;
        margin-bottom: 20px;
    }

    #id_pagina_erro a {
        display: inline-block;
        background-color: #e74c3c;
        color: #fff;
        padding: 10px 20px;
        text-decoration: none;
        border-radius: 5px;
        transition: background-color 0.3s;
    }

        #id_pagina_erro a:hover {
            background-color: #c0392b;
        }



/*#endregion */

/*#region BARRA DE ALERTA */
#id_barra_alerta.alerta {
    padding: 20px 40px;
    min-width: 420px;
    position: absolute;
    right: 0px;
    top: 60px;
    border-radius: 4px;
    z-index: 50000;
}

#id_barra_alerta.sucesso {
    background: rgb(217,236,218);
    border-left: 8px solid rgb(0,154,104);
    color: rgb(0,51,34);
}

#id_barra_alerta.erro {
    background: rgb(248,215,218);
    border-left: 8px solid rgb(124,0,0);
    color: rgb(124,0,0);
}

#id_barra_alerta.oculto {
    display: none;
}

#id_barra_alerta.mostrar {
    animation: show_slide 1s ease forwards;
}

#id_barra_alerta.ocultar {
    animation: hide_slide 0.4s ease forwards;
}

@keyframes show_slide {
    0% {
        transform: translateX(100%);
    }

    40% {
        transform: translateX(-10%);
    }

    95% {
        transform: translateX(0%);
    }

    100% {
        transform: translateX(-10px);
    }
}

@keyframes hide_slide {
    0% {
        transform: translateX(0%);
    }

    100% {
        transform: translateX(100%);
    }
}


/*#endregion */

/*#region DASHBOARD*/
#id_dashboard .dash {
    display: grid;
    grid-template-columns: repeat(15, 1fr);
    grid-template-rows: repeat(15,1fr);
    width: 90%;
    min-width: 800px;
    max-width: 1200px;
    height: 90%;
    grid-gap: 12px;
    padding: 12px;
    min-height: 500px;
}

#id_dashboard .dash_item {
    background-color: white;
    text-align: center;
    margin: 5px;
    border: solid 1px rgb(220,220,220);
    border-radius: 5px;
    display: grid;
    position: relative;
}

#id_dashboard .dash_item.off {
color: rgb(120,120,120);
}

    #id_dashboard .dash_item.listao {
        grid-row-start: 7;
        grid-row-end: 16;
        grid-column-start: 8;
    }

    #id_dashboard .dash_item.informativo > div {
        display: grid;
        grid-template-columns: 20% 80%;
    }

    #id_dashboard .dash_item.informativo .total {
        display: grid;
        grid-template-rows: 20px auto;
    }

#id_dashboard .dash_cadastros {
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgb(0,120,215);
    font-size: 40px;
}

#id_dashboard .dash_item.acao {
    box-shadow: rgba(0,0,0,0.24) 0px 3px 8px;
    overflow: hidden;
}

    #id_dashboard .dash_item.acao > .corpo {
        cursor: pointer;
        background-color: white;
        display: grid;
        grid-template-columns: 120px auto;
    }

    #id_dashboard .dash_item.acao.off > .corpo {
        cursor: default;
        background-color: rgb(213, 213, 213);
    }

        #id_dashboard .dash_item.acao > .corpo:hover {
            background-color: rgb(242, 237, 217);
        }

    #id_dashboard .dash_item.acao.off > .corpo:hover {
        background-color: rgb(213, 213, 213);
    }

#id_dashboard .acao .logo {
    border-radius: 50%;
    background-color: rgb(82, 134, 186);
    width: 50px;
    height: 50px;
    text-align: center;
    margin: auto;
}

#id_dashboard .acao.off .logo {
    background-color: rgb(120, 120, 120);
}

    #id_dashboard .acao .logo img {
        width: 36px;
        height: 36px;
        margin-top: 7px;
    }

#id_dashboard .acao .dados {
    padding-right: 20px;
    text-align: left;
    display: grid;
    grid-template-rows: 1fr 2fr;
}

    #id_dashboard .acao .dados > h6 {
        font-size: 16px;
        display: flex;
        align-items: center;
    }

    #id_dashboard .acao .dados > p {
        font-size: 14px;
    }

#id_dashboard .dash_item.acao .faixa_novo {
    background-color: rgb(192,0,0);
    color: white;
    border: 1px solid red;
    position: absolute;
    transform: rotate(-45deg);
    left: -25px;
    top: 14px;
    text-align: center;
    width: 100px;
    justify-content: center;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); /* Shadow effect */
}

#id_dashboard .dash_item.acao.off .faixa_novo {
    background-color: rgb(120,120,120);
    border: 1px solid darkgray;
    font-size:11px;
}


#id_dashboard .beta {
    position: absolute;
    right: 10px;
    bottom: 3px;
    color: red;
    font-size: 11px;
}



#id_botao_adicionar a {
    display: block;
    width: 100%;
    height: 100%;
}

#id_botao_adicionar img {
    padding-top: 6px;
}

#id_botao_adicionar:hover {
    border: 1px solid rgb(0,120,215);
}

.dash .c2 {
    grid-column-end: span 2;
}

.dash .c4 {
    grid-column-end: span 4;
}

.dash .c6 {
    grid-column-end: span 6;
}

.dash .c7 {
    grid-column-end: span 7;
}

.dash .c8 {
    grid-column-end: span 8;
}

.dash .c9 {
    grid-column-end: span 9;
}

.dash .c10 {
    grid-column-end: span 10;
}

.dash .c11 {
    grid-column-end: span 11;
}

.dash .c12 {
    grid-column-end: span 12;
}

.dash .c13 {
    grid-column-end: span 13;
}

.dash .c14 {
    grid-column-end: span 14;
}

.dash .c15 {
    grid-column-end: span 15;
}

.dash .l1 {
    grid-row-end: span 1;
}

.dash .l2 {
    grid-row-end: span 2;
}

.dash .l3 {
    grid-row: span 3;
}

.dash .l4 {
    grid-row: span 4;
}

.dash .l6 {
    grid-row-end: span 6;
}

.dash .l8 {
    grid-row-end: span 8;
}

.dash .l9 {
    grid-row: span 9;
}

.dash .l10 {
    grid-row: span 10;
}

.dash .l11 {
    grid-row: span 11;
}

.dash .l12 {
    grid-row: span 12;
}


#id_dashboard .dash .listao {
    text-align: left;
    overflow-y: auto;
    grid-template-rows: 50px auto;
}

#id_dashboard .dash .conjunto_graficos {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    height: 100%;
}


#id_dashboard .dash_titulo {
    color: rgb(105,105,105);
    margin: auto;
    margin-bottom: 10px;
}


.dash .loader {
    display: inline-block;
    width: 40px;
    height: 40px;
    border: 4px solid rgb(243,243,243);
    border-top: 4px solid rgb(220, 220, 220);
    border-radius: 50%;
    animation: spin 1s infinite linear;
    margin: auto;
}

#id_dashboard .grupo_grafico_torta {
    display: grid;
    grid-template-rows: 20px auto;
}

    #id_dashboard .grupo_grafico_torta .grafico_torta {
        display: grid;
        grid-template-rows: auto auto;
    }



        #id_dashboard .grupo_grafico_torta .grafico_torta.oculto {
            display: none;
        }

    #id_dashboard .grupo_grafico_torta .grafico {
        display: flex;
        align-items: center;
        justify-content: center;
    }

        #id_dashboard .grupo_grafico_torta .grafico > canvas {
            width: 75px;
            height: 75px;
        }


    #id_dashboard .grupo_grafico_torta .legenda {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    #id_dashboard .grupo_grafico_torta .linha_legenda {
        display: grid;
        grid-template-columns: 20% 38px 70px;
        font-size: 11px;
        margin: 0 auto;
    }

        #id_dashboard .grupo_grafico_torta .linha_legenda .cor {
            margin: 2px;
            /* width:10px*/
        }

        #id_dashboard .grupo_grafico_torta .linha_legenda .perc {
            padding-left: 10%;
            text-align: left;
        }

        #id_dashboard .grupo_grafico_torta .linha_legenda .texto {
            text-align: left;
        }


#id_dashboard .beneficio {
    display: grid;
    grid-template-rows: 20% 80%;
}

#id_dashboard .grafico_beneficio {
    display: none;
    grid-template-columns: repeat(7, 1fr);
    grid-column-gap: 4%;
    padding: 0px 15px 10px 15px;
}

    #id_dashboard .grafico_beneficio.carregado {
        display: grid;
    }

    #id_dashboard .grafico_beneficio > .barra {
        width: 100%;
        height: 100%;
        cursor: pointer;
    }

        #id_dashboard .grafico_beneficio > .barra > div {
            height: 100%;
            display: flex;
            flex-direction: column;
            justify-content: flex-end;
        }

            #id_dashboard .grafico_beneficio > .barra > div > div {
                width: 70%;
                background-color: rgb(65, 140, 240);
                margin: 0 auto 0 auto;
            }

            #id_dashboard .grafico_beneficio > .barra > div:hover div {
                background-color: red;
            }

#id_grafico-genero2 {
    width: 100px;
    height: 100px;
    border: 1px solid black;
}

@media (max-height: 950px) {
    #id_dashboard .grupo_grafico_torta .grafico > canvas {
        width: 68px;
        height: 68px;
    }
}

@media (max-height: 900px) {
    #id_dashboard .grupo_grafico_torta .grafico_torta {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    #id_dashboard .grupo_grafico_torta .grafico {
        justify-content: end;
    }

    #id_dashboard .acao .dados > h6 {
        font-size: 13px;
    }

    #id_dashboard .acao .dados > p {
        font-size: 12px;
    }

    #id_dashboard .dash_item.acao > div {
        grid-template-columns: 80px auto;
    }

    #id_dashboard .dash_item.acao .faixa_novo {
        top: 10px;
        left: -30px;
    }

    #id_dashboard .grupo_grafico_torta .grafico > canvas {
        width: 80px;
        height: 80px;
    }
}

@media (max-height: 850px) {
    #id_dashboard .grupo_grafico_torta .grafico > canvas {
        width: 80px;
        height: 80px;
    }
}

@media (max-height: 800px) {
    #id_dashboard .grupo_grafico_torta .grafico > canvas {
        width: 75px;
        height: 75px;
    }
}

@media (max-height: 750px) {
    #id_dashboard .grupo_grafico_torta .grafico > canvas {
        width: 70px;
        height: 70px;
    }
}

@media (max-height: 700px) {
    #id_dashboard .grupo_grafico_torta .grafico > canvas {
        width: 60px;
        height: 60px;
    }
}

@media (max-height: 650px) {
    #id_dashboard .acao .dados > h6 {
        font-size: 12px;
    }

    #id_dashboard .acao .dados > p {
        font-size: 11px;
    }

    #id_dashboard .dash_item.acao > div {
        grid-template-columns: 60px auto;
    }

    #id_dashboard .dash_item.acao .faixa_novo {
        top: 7px;
        left: -32px;
    }

    #id_dashboard .grupo_grafico_torta .grafico > canvas {
        width: 50px;
        height: 50px;
    }
}




/*#endregion*/

/*#region CAPITULAÇÃO*/
#id_capitulacao {
    width: 100%;
    grid-column: 2;
    grid-row: span 2;
}

    #id_capitulacao > .corpo {
        padding: 20px;
        border: 1px solid darkgrey;
        height: 400px;
    }

    #id_capitulacao .alerta {
        margin-top: 20px;
    }

        #id_capitulacao .alerta label {
            color: darkred;
        }

        #id_capitulacao .alerta img {
            height: 24px;
            margin: auto 10px;
        }


    #id_capitulacao .item-formulario2 {
        display: grid;
        grid-template-columns: 100%;
    }

        #id_capitulacao .item-formulario2 label {
            background-color: rgb(61, 92, 135);
            color: white;
            height: 24px;
            line-height: 24px;
            padding-left: 3px;
            text-transform: uppercase;
            font-size: 11px;
        }

    #id_capitulacao .capitulacao {
        height: 160px;
    }


    #id_capitulacao .filtro {
        position: relative;
        height: 30px;
    }

        #id_capitulacao .filtro.paragrafo {
            height: auto;
        }

        #id_capitulacao .filtro .campo {
            background-color: white;
            width: 250px;
            height: 20px;
            border: 1px solid black;
            cursor: pointer;
            display: inline-flex;
        }

        #id_capitulacao .filtro.definido .campo {
            display: none;
        }

        #id_capitulacao .filtro .campo > div {
            width: 250px;
        }

        #id_capitulacao .filtro.paragrafo .campo {
            width: 200px;
            margin-left: 50px;
        }

        #id_capitulacao .filtro .campo > img {
            position: relative;
        }

        #id_capitulacao .filtro .resultado {
            display: none;
            flex-direction: column;
            gap: 5px;
        }

        #id_capitulacao .filtro.definido .resultado {
            display: flex;
        }

        #id_capitulacao .filtro .resultado > div:first-child {
            display: flex;
            align-items: center;
            gap: 5px;
        }

        #id_capitulacao .filtro.codigo .resultado .texto {
            flex: 1;
        }

    #id_capitulacao .detalhes .acoes {
        display: flex;
        justify-content: space-between;
        margin-bottom: 10px;
    }

        #id_capitulacao .detalhes .acoes label {
            text-decoration: underline;
            color: blue;
            cursor: pointer;
        }

    #id_capitulacao .filtro.paragrafo .resultado {
        margin-left: 30px;
    }

    #id_capitulacao .filtro .resultado img {
        margin-top: 3px;
        height: 16px;
    }

    #id_capitulacao .filtro .resultado > .incisos {
        display: none;
        flex-direction: column;
        margin-left: 20px;
        max-height: 58px;
        overflow-y: auto;
    }

    #id_capitulacao .filtro .incisos > div {
        display: inline-flex;
        gap: 5px;
    }

    #id_capitulacao .opcoes {
        display: none;
        background-color: white;
        position: absolute;
        width: 250px;
        overflow-x: hidden;
        border: 1px solid #ddd;
        z-index: 1;
    }

        #id_capitulacao .opcoes input {
            height: 25px;
            width: 214px;
            margin: 16px 10px 10px 16px;
        }

        #id_capitulacao .opcoes .menu {
            overflow-y: auto;
            max-height: 200px;
            position: relative;
        }

        #id_capitulacao .opcoes p {
            color: black;
            padding: 12px 16px;
            cursor: pointer;
            display: none;
        }

            #id_capitulacao .opcoes p.valido {
                display: block;
            }

                #id_capitulacao .opcoes p.valido.sel {
                    background-color: rgb(164, 188, 213)
                }

        #id_capitulacao .opcoes label.erro {
            cursor: default;
            color: black;
            padding: 12px 16px;
            display: none;
        }

        #id_capitulacao .opcoes label.erro {
            cursor: default;
            color: black;
            padding: 12px 16px;
            display: none;
        }

    #id_capitulacao .sintese {
        height: 25px;
        border: 1px solid rgb(169,169,169);
        border-radius: 3px;
        display: flex;
        align-items: center;
    }

        #id_capitulacao .sintese.erro {
            background-color: rgb(255, 182, 193);
        }

        #id_capitulacao .sintese p {
            margin-left: 10px;
        }

        #id_capitulacao .sintese.erro p {
            display: none;
        }

        #id_capitulacao .sintese label {
            color: maroon;
            display: none;
        }

        #id_capitulacao .sintese.erro label {
            display: block;
        }

    #id_capitulacao .capitulacao.manual > div {
        margin-bottom: 15px;
    }

        #id_capitulacao .capitulacao.manual > div input {
            width: 250px;
        }


    #id_capitulacao .detalhes {
        margin-top: 10px;
        padding: 10px;
    }


    #id_capitulacao .checkbox > div {
        display: grid;
        grid-template-columns: 0.8fr 1fr;
    }


    #id_capitulacao .obs {
        margin-top: 10px;
        height: 70px;
        border: 1px solid rgb(169,169,169);
        border-radius: 3px;
    }

        #id_capitulacao .obs p {
            margin: 10px;
        }
/*#endregion*/

/*#region INDEX*/
.audi th.c, .audi td.c {
    text-align: center;
}

.audi img {
    margin: 0px 3px;
}

.audi td.nd {
    color: lightgrey;
}



/*#endregion*/

/*#region LOADER*/
.loader {
    border: 5px solid #f3f3f3;
    border-radius: 50%;
    border-top: 5px solid rgb(121,121,121);
    width: 20px;
    height: 20px;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/*#endregion*/

/*TELA PRESO*/

.linha-formulario {
    display: grid;
    grid-template-columns: 200px auto;
    grid-row-gap: 100px;
    margin: 10px;
}

    .linha-formulario input, select, textarea {
        width: 100%;
        box-sizing: border-box;
        resize: none;
    }



.link {
    color: blue;
    text-decoration: none;
}

    .link:hover {
        color: red;
    }

.home_conteudo {
    position: fixed;
    top: 50px;
    bottom: 0;
    overflow-y: auto;
    width: 100%;
}
