/* Identidade visual do modulo Plataformas Digitais de Hospedagem. */
body.plataformas-modulo {
    background: #f3fbfd;
    color: #24434d;
}

.plataformas-modulo h1,
.plataformas-modulo h2,
.plataformas-modulo h3,
.plataformas-modulo a {
    color: rgb(0, 135, 176);
}

.plataformas-modulo .page-header {
    border-bottom-color: rgba(0, 155, 202, .35);
}

.plataformas-modulo .panel,
.plataformas-modulo .card {
    border-color: rgba(0, 155, 202, .55);
    box-shadow: 0 3px 12px rgba(0, 155, 202, .12);
}

.plataformas-modulo .panel-heading,
.plataformas-modulo .card-header {
    background: rgb(0, 155, 202);
    border-color: rgb(0, 155, 202);
    color: #fff;
}

.plataformas-modulo .panel-heading strong,
.plataformas-modulo .card-header strong {
    color: #fff;
}

.plataformas-modulo .form-control:focus {
    border-color: rgb(0, 155, 202);
    box-shadow: 0 0 0 2px rgba(0, 155, 202, .17);
}

.plataformas-modulo .btn-primary,
.plataformas-modulo .btn-info,
.plataformas-modulo .btn-success {
    background: rgb(0, 155, 202);
    border-color: rgb(0, 155, 202);
    color: #fff;
}

.plataformas-modulo .btn-primary:hover,
.plataformas-modulo .btn-primary:focus,
.plataformas-modulo .btn-info:hover,
.plataformas-modulo .btn-info:focus,
.plataformas-modulo .btn-success:hover,
.plataformas-modulo .btn-success:focus {
    background: rgb(0, 130, 170);
    border-color: rgb(0, 130, 170);
    color: #fff;
}

.plataformas-modulo .btn-default {
    background: #fff;
    border-color: rgb(0, 155, 202);
    color: rgb(0, 125, 164);
}

.plataformas-modulo .btn-default:hover,
.plataformas-modulo .btn-default:focus {
    background: rgba(0, 155, 202, .1);
    border-color: rgb(0, 135, 176);
    color: rgb(0, 105, 138);
}

.plataformas-modulo .table > thead > tr > th {
    background: rgba(0, 155, 202, .12);
    border-bottom-color: rgb(0, 155, 202);
    color: rgb(0, 105, 138);
}

.plataformas-modulo .table-striped > tbody > tr:nth-of-type(odd) {
    background: rgba(0, 155, 202, .045);
}

.plataformas-modulo .alert-info {
    background: rgba(0, 155, 202, .1);
    border-color: rgba(0, 155, 202, .45);
    color: rgb(0, 105, 138);
}

/* O formulario de autocadastro funciona como um card unico. */
.plataformas-autocadastro > .container {
    background: #fff;
    border: 1px solid rgb(0, 155, 202);
    border-radius: 7px;
    box-shadow: 0 4px 16px rgba(0, 155, 202, .18);
    margin-bottom: 35px;
    margin-top: 35px;
    max-width: 1170px;
    overflow: hidden;
    padding: 0 !important;
}

.plataformas-autocadastro > .container > h2 {
    background: rgb(0, 155, 202);
    color: #fff;
    font-size: 22px;
    margin: 0 0 24px;
    padding: 18px 24px;
}

.plataformas-autocadastro > .container > form,
.plataformas-autocadastro > .container > .alert {
    margin-left: 24px;
    margin-right: 24px;
}

.plataformas-autocadastro > .container > form {
    padding-bottom: 24px;
}

@media (max-width: 767px) {
    .plataformas-autocadastro > .container {
        border-left: 0;
        border-radius: 0;
        border-right: 0;
        margin-top: 15px;
    }
}

/* Caixa de mensagens do declarante. */
.mensagens-layout {
    background: #fff;
    border: 1px solid rgba(0, 155, 202, .45);
    border-radius: 6px;
    box-shadow: 0 3px 12px rgba(0, 100, 135, .12);
    display: table;
    min-height: 470px;
    overflow: hidden;
    table-layout: fixed;
    width: 100%;
}
.mensagens-periodos, .mensagens-lista, .mensagem-conteudo { display: table-cell; vertical-align: top; }
.mensagens-periodos { background: #f3fbfd; border-right: 1px solid #b9dfE9; width: 20%; }
.mensagens-lista { border-right: 1px solid #b9dfe9; width: 30%; }
.mensagem-conteudo { padding: 24px; width: 50%; }
.mensagens-titulo { background: rgb(0, 155, 202); color: #fff; font-weight: bold; padding: 13px 15px; }
.mensagens-periodos .list-group { margin: 0; }
.mensagens-periodos .list-group-item { background: transparent; border: 0; border-bottom: 1px solid #d8edf3; border-radius: 0; color: #286778; }
.mensagens-periodos .list-group-item.active { background: #d8f2f8; color: #006983; font-weight: bold; }
.mensagens-periodos .list-group-item small { display: block; margin-top: 3px; }
.mensagem-resumo { border-bottom: 1px solid #d8edf3; color: #3f5960; display: block; padding: 14px; text-decoration: none !important; }
.mensagem-resumo:hover, .mensagem-resumo.selecionada { background: #eaf8fc; color: #006983; }
.mensagem-resumo.nao-lida { border-left: 4px solid rgb(0, 155, 202); font-weight: bold; }
.mensagem-resumo strong, .mensagem-resumo span, .mensagem-resumo small { display: block; }
.mensagem-resumo span { color: #668087; font-size: 12px; margin: 4px 0; }
.mensagem-resumo small { font-weight: normal; line-height: 1.4; }
.mensagem-cabecalho { border-bottom: 1px solid #d8edf3; margin-bottom: 22px; padding-bottom: 12px; }
.mensagem-cabecalho h3 { color: #006983; margin-top: 0; }
.mensagem-corpo { line-height: 1.65; white-space: pre-wrap; }
.mensagem-placeholder { color: #86a5ad; padding-top: 110px; text-align: center; }
.mensagem-placeholder .glyphicon { font-size: 48px; margin-bottom: 15px; }
.mensagens-vazia { padding: 20px; }
@media (max-width: 767px) {
    .mensagens-layout, .mensagens-periodos, .mensagens-lista, .mensagem-conteudo { display: block; width: 100%; }
    .mensagens-periodos, .mensagens-lista { border-bottom: 1px solid #b9dfe9; border-right: 0; }
    .mensagem-conteudo { min-height: 260px; }
}
/* Caixa de comunicacoes com sidebar unica. */
.comunicacoes-topo { margin-bottom: 18px; }
.comunicacoes-topo h2 { color: #006983; margin-top: 0; }
.comunicacoes-topo .btn { margin-top: 8px; }
.caixa-comunicacoes {
    background: #fff;
    border: 1px solid #a9dbe8;
    border-radius: 7px;
    box-shadow: 0 4px 16px rgba(0, 100, 135, .14);
    display: flex;
    min-height: 560px;
    overflow: hidden;
}
.comunicacoes-sidebar {
    background: #f7fcfd;
    border-right: 1px solid #b9dfe9;
    flex: 0 0 34%;
    max-width: 390px;
}
.sidebar-cabecalho {
    background: rgb(0, 155, 202);
    color: #fff;
    font-size: 16px;
    padding: 15px 17px;
}
.sidebar-cabecalho .badge { background: #fff; color: #007e9f; float: right; }
.sidebar-filtro { background: #e5f6fa; border-bottom: 1px solid #b9dfe9; padding: 13px 15px; }
.sidebar-filtro label { color: #006983; font-size: 12px; text-transform: uppercase; }
.sidebar-mensagens { max-height: 620px; overflow-y: auto; }
.sidebar-mensagem {
    border-bottom: 1px solid #d8edf3;
    color: #45646c;
    display: block;
    padding: 14px 16px;
    position: relative;
    text-decoration: none !important;
}
.sidebar-mensagem:hover, .sidebar-mensagem.selecionada { background: #def3f8; color: #005f78; }
.sidebar-mensagem.selecionada { box-shadow: inset 4px 0 0 rgb(0, 155, 202); }
.sidebar-mensagem.nao-lida:after {
    background: rgb(0, 155, 202);
    border-radius: 50%;
    content: '';
    height: 9px;
    position: absolute;
    right: 14px;
    top: 17px;
    width: 9px;
}
.sidebar-mensagem-titulo { color: #007e9f; display: block; font-size: 15px; font-weight: bold; padding-right: 15px; }
.sidebar-mensagem strong { display: block; margin: 5px 0; }
.sidebar-mensagem-data, .sidebar-mensagem small { color: #71888e; display: block; font-size: 12px; }
.comunicacao-detalhes { flex: 1; min-width: 0; padding: 28px 32px; }
.comunicacao-titulo { border-bottom: 1px solid #d8edf3; margin-bottom: 20px; padding-bottom: 14px; }
.comunicacao-titulo h2 { color: #006983; font-size: 25px; margin: 8px 0 4px; }
.comunicacao-titulo p { color: #536d74; font-size: 16px; margin: 0; }
.declaracao-resumo {
    background: #f0fafc;
    border-left: 4px solid rgb(0, 155, 202);
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 22px;
    padding: 8px 12px;
}
.declaracao-resumo > div { box-sizing: border-box; padding: 9px 12px; width: 50%; }
.declaracao-resumo span { color: #648087; display: block; font-size: 11px; text-transform: uppercase; }
.declaracao-resumo strong { color: #284f59; display: block; margin-top: 3px; overflow-wrap: break-word; }
.comunicacao-meta { border-bottom: 1px solid #e1edf0; margin-bottom: 20px; padding-bottom: 12px; }
.comunicacao-meta strong, .comunicacao-meta span { display: block; }
.comunicacao-meta span { color: #71888e; font-size: 12px; margin-top: 3px; }
@media (max-width: 767px) {
    .comunicacoes-topo .pull-left, .comunicacoes-topo .pull-right { float: none !important; }
    .caixa-comunicacoes { display: block; }
    .comunicacoes-sidebar { border-bottom: 1px solid #b9dfe9; border-right: 0; max-width: none; width: 100%; }
    .sidebar-mensagens { max-height: 330px; }
    .comunicacao-detalhes { padding: 22px 18px; }
    .declaracao-resumo > div { width: 100%; }
}
.declaracao-acoes { margin: -8px 0 24px; }

/* Layout final: dois cards independentes, 1/3 e 2/3. */
.caixa-comunicacoes {
    align-items: stretch;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    display: flex;
    min-height: 590px;
    overflow: visible;
    width: 100%;
}
.comunicacoes-sidebar {
    background: #fff;
    border: 1px solid #a9dbe8;
    border-radius: 7px;
    box-shadow: 0 4px 15px rgba(0, 100, 135, .14);
    flex: 0 0 32%;
    max-width: none;
    overflow: hidden;
    width: 32%;
}
.comunicacao-detalhes {
    background: #fff;
    border: 1px solid #a9dbe8;
    border-radius: 7px;
    box-shadow: 0 4px 15px rgba(0, 100, 135, .14);
    box-sizing: border-box;
    flex: 0 0 66%;
    margin-left: 2%;
    min-height: 590px;
    overflow: hidden;
    padding: 28px 32px;
    width: 66%;
}
.sidebar-cabecalho { border-radius: 6px 6px 0 0; }
.sidebar-mensagens { background: #fff; max-height: 500px; overflow-y: auto; }
.sidebar-mensagem { min-height: 88px; padding: 13px 15px; }
.sidebar-mensagem-linha {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding-right: 12px;
    width: 100%;
}
.sidebar-mensagem-linha .sidebar-mensagem-titulo {
    flex: 1;
    overflow: hidden;
    padding-right: 8px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.sidebar-mensagem-linha .sidebar-mensagem-data {
    flex: 0 0 auto;
    font-size: 11px;
    margin: 0;
    white-space: nowrap;
}
.sidebar-mensagem > strong {
    display: block;
    font-size: 13px;
    font-weight: 600;
    margin: 6px 0 4px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.sidebar-mensagem > small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
@media (max-width: 767px) {
    .caixa-comunicacoes { display: block; }
    .comunicacoes-sidebar, .comunicacao-detalhes {
        display: block;
        flex: none;
        margin-left: 0;
        max-width: none;
        width: 100%;
    }
    .comunicacao-detalhes { margin-top: 18px; min-height: 350px; }
}
/* Cards da gestao municipal. */
.plataformas-gestao .gestao-card {
    border: 1px solid #a9dbe8;
    border-radius: 7px;
    box-shadow: 0 4px 15px rgba(0, 100, 135, .12);
    margin-bottom: 24px;
    overflow: hidden;
}
.plataformas-gestao .gestao-card > .panel-heading {
    background: rgb(0, 155, 202);
    border-bottom: 0;
    color: #fff;
    font-size: 16px;
    padding: 13px 16px;
}
.plataformas-gestao .gestao-card > .panel-heading .badge {
    background: #fff;
    color: #007e9f;
}
.plataformas-gestao .gestao-filtro-acoes { padding-top: 25px; }
.plataformas-gestao .gestao-tabela { margin-bottom: 0; }
.plataformas-gestao .gestao-tabela > thead > tr > th { padding: 13px 12px; vertical-align: middle; }
.plataformas-gestao .gestao-tabela > tbody > tr > td { padding: 12px; vertical-align: middle; }
.plataformas-gestao .gestao-sem-registros { color: #69848b; padding: 35px !important; }
@media (max-width: 991px) {
    .plataformas-gestao .gestao-filtro-acoes { padding-top: 0; }
}
/* Historico de comunicacoes no detalhe municipal. */
.detalhe-comunicacoes {
    border: 1px solid #a9dbe8;
    border-radius: 7px;
    box-shadow: 0 4px 15px rgba(0, 100, 135, .11);
    overflow: hidden;
}
.detalhe-comunicacoes > .panel-heading {
    background: rgb(0, 155, 202);
    border-bottom: 0;
    color: #fff;
    padding: 13px 16px;
}
.detalhe-comunicacoes > .panel-heading .badge { background: #fff; color: #007e9f; }
.comunicacao-historico-item {
    border: 1px solid #d1e8ee;
    border-left: 4px solid rgb(0, 155, 202);
    border-radius: 5px;
    margin-bottom: 14px;
    padding: 14px 16px;
}
.comunicacao-historico-item:last-child { margin-bottom: 0; }
.comunicacao-historico-topo { border-bottom: 1px solid #e1eef1; color: #006983; margin-bottom: 9px; padding-bottom: 8px; }
.comunicacao-historico-topo .pull-right { color: #71888e; font-size: 12px; font-weight: normal; }
.comunicacao-historico-mensagem { line-height: 1.55; white-space: pre-wrap; }
.comunicacao-historico-status { margin: 13px 0 0; }
/* Paginacao das listagens. */
.plataformas-paginacao { border-top: 1px solid #e1eef1; margin-top: 0; padding: 12px 8px 4px; }
.plataformas-paginacao .pagination { margin: 0; }
.plataformas-paginacao .pagination > li > a,
.plataformas-paginacao .pagination > li > span { color: #007e9f; padding: 6px 10px; }
.plataformas-paginacao .pagination > .active > span { background: rgb(0, 155, 202); border-color: rgb(0, 155, 202); color: #fff; }
.comunicacoes-sidebar .plataformas-paginacao .pagination > li > a,
.comunicacoes-sidebar .plataformas-paginacao .pagination > li > span { font-size: 12px; padding: 5px 8px; }