/* Componentes próprios da consola da plataforma. Base visual (layout, botões v1, DataTables, sidebar, dashboard) vem de
   main.css, copiado do middleoffice do CRM. Paleta igual à do CRM: #101823 (tinta), #161616 (sidebar, região MENU LATERAL), #e3e6ea (linhas). */

/* region AMBIENTES (DEMO / UAT / PRD sempre distinguíveis por cor + texto) */

.platform_env {
    display: inline-block;
    padding: 1px 7px;
    border-radius: 4px;
    font: 700 11px/1.5 Montserrat, Arial, sans-serif;
    letter-spacing: .5px;
    color: #fff;
    vertical-align: middle;
}

.platform_env_demo { background: #1098ad; }
.platform_env_uat { background: #7048e8; }
.platform_env_prd { background: #c92a2a; }

.platform_env_borda_demo { border-left: 4px solid #1098ad; }
.platform_env_borda_uat { border-left: 4px solid #7048e8; }
.platform_env_borda_prd { border-left: 4px solid #c92a2a; }

/* endregion */


/* region TIPOGRAFIA E BLOCOS */

.platform_h1 {
    font: 600 22px/1.3 Montserrat, Arial, sans-serif;
    color: #101823;
    margin: 0 0 20px;
}

.platform_h1 .badge { font-size: 12px; vertical-align: middle; }

.platform_h2_sub, .platform_h3 {
    font: 600 14px/1.4 Montserrat, Arial, sans-serif;
    color: #101823;
    margin: 20px 0 10px;
}

.platform_legend { font-size: 11px; font-weight: 300; margin: 10px 0 5px; }

.platform_ajuda { font-size: 12px; color: #6b7280; margin: 4px 0 12px; }
.platform_ajuda.ok { color: #2b8a3e; }
.platform_ajuda.erro { color: #c92a2a; }
.platform_ajuda_pagina { max-width: 900px; }

.platform_vazio { color: #6b7280; font-style: italic; padding: 10px 0; }

.platform_url { color: #6b7280; font-size: 13px; word-break: break-all; }

.platform_role { color: #7e848c; }

.platform_titulo { float: left; line-height: 50px; padding-left: 25px; font: 500 14px/20px Montserrat, Arial, sans-serif; color: #343d4a; }

.platform_aviso {
    padding: 12px 15px;
    border-radius: 6px;
    margin: 0 0 20px;
    font-size: 13px;
    border: 1px solid #e3e6ea;
    background: #fff;
}

.platform_aviso.info { background: #e7f5ff; border-color: #a5d8ff; }
.platform_aviso.warning { background: #fff9db; border-color: #ffe066; }
.platform_aviso.danger { background: #fff5f5; border-color: #ffa8a8; color: #862e2e; }

.platform_dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 15px; margin: 0; font-size: 13px; }
.platform_dl dt { font-weight: 500; color: #6b7280; }
.platform_dl dd { margin: 0; color: #101823; word-break: break-word; }

.platform_json { font-family: Menlo, Consolas, monospace; font-size: 11px; color: #6b7280; word-break: break-all; }

.platform_notas { background: #f6fafb; padding: 10px; border-radius: 6px; font-size: 13px; }

.platform_tabela_simples { font-size: 13px; }
.platform_tabela_simples th { font-weight: 500; color: #6b7280; border-top: 0; }

.platform_btn_icon { background: none; border: 0; color: inherit; padding: 4px 6px; cursor: pointer; }
/* Topo: o botão de logout fica na mesma linha do ícone do utilizador (como o <i> do CRM) */
.main_holder .pageTopo .menu .platform_btn_icon { display: block; padding: 0; line-height: 20px; }
.platform_btn_icon:focus-visible, .link:focus-visible, button:focus-visible, a:focus-visible { outline: 2px solid #1d6fd1; outline-offset: 2px; }

a.v1.platform_btn_link, .platform_btn_link {
    display: inline-block;
    background: #101823;
    color: #fff;
    border-radius: 25px;
    text-transform: uppercase;
    font: 500 12px/1 Montserrat, Arial, sans-serif;
    padding: 12px 25px;
    text-decoration: none;
}

a.v1.white.platform_btn_link { background: #fff; color: #101823; border: 1px solid #101823; }

.platform_voltar { display: inline-block; margin-bottom: 10px; font-size: 13px; color: #6b7280; }

.platform_check { display: block; font-size: 13px !important; font-weight: 400 !important; margin: 6px 0; }

/* endregion */


/* region FILTROS */

.platform_filtros { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.platform_filtros .platform_filtro { width: auto; min-width: 180px; height: 38px; }
.platform_filtros .dt_search { flex: 1 1 260px; }

/* endregion */


/* region DASHBOARD */

.platform_dashboard .dashboard_kpi.link { cursor: pointer; }
.platform_dashboard .dashboard_kpi.link:hover { box-shadow: 0 2px 10px rgba(16, 24, 35, .08); }

/* endregion */


/* region INSTÂNCIA */

.platform_instancia_topo {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 15px;
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 20px;
}

.platform_instancia_topo .platform_h1 { margin-bottom: 5px; }
.platform_instancia_acoes { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start; }

.platform_passos { list-style: none; padding: 0; margin: 0 0 15px; }
.platform_passos li { padding: 6px 0; font-size: 13px; display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.platform_passos li small { color: #6b7280; flex-basis: 100%; padding-left: 24px; }
.platform_passo_done i { color: #2b8a3e; }
.platform_passo_failed i { color: #c92a2a; }
.platform_passo_running i { color: #1d6fd1; animation: platform_girar 1.2s linear infinite; display: inline-block; }
.platform_passo_pending { color: #9ca3a9; }

@keyframes platform_girar { to { transform: rotate(360deg); } }

@media (prefers-reduced-motion: reduce) {
    .platform_passo_running i { animation: none; }
}

.platform_refresh { font-size: 11px; color: #9ca3a9; }

/* endregion */


/* region ASSISTENTE */

.platform_wizard { max-width: 900px; }

.platform_wizard_passos { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; padding: 0; margin: 0 0 25px; counter-reset: passo; }
.platform_wizard_passos li {
    counter-increment: passo;
    font-size: 12px;
    padding: 6px 12px;
    border-radius: 20px;
    background: #eef1f4;
    color: #6b7280;
}
.platform_wizard_passos li::before { content: counter(passo) ". "; }
.platform_wizard_passos li.ativo { background: #101823; color: #fff; }
.platform_wizard_passos li.feito { background: #d3f9d8; color: #2b8a3e; }

.platform_wizard_passo { background: #fff; padding: 25px; border-radius: 8px; }
.platform_wizard_passo h2 { font: 600 16px/1.4 Montserrat, Arial, sans-serif; margin: 0 0 15px; }
.platform_wizard_passo label { font-size: 12px; margin-top: 10px; }

.platform_wizard_botoes { display: flex; justify-content: flex-end; gap: 10px; margin-top: 20px; }

.platform_ambientes { border: 0; padding: 0; margin: 15px 0 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.platform_ambientes legend { font-size: 12px; margin-bottom: 8px; }

.platform_ambiente_opcao {
    display: flex;
    flex-direction: column;
    gap: 4px;
    border: 1px solid #e3e6ea;
    border-radius: 8px;
    padding: 12px 12px 12px 36px;
    position: relative;
    cursor: pointer;
    margin: 0 !important;
}

.platform_ambiente_opcao input { position: absolute; left: 12px; top: 15px; }
.platform_ambiente_opcao small { color: #6b7280; }
.platform_ambiente_opcao .platform_ambiente_bloqueio { color: #c92a2a; }
.platform_ambiente_opcao:has(input:checked) { box-shadow: 0 0 0 2px #101823; }
.platform_ambiente_opcao.indisponivel, .platform_modulo.indisponivel { opacity: .55; cursor: not-allowed; }

.platform_slug { display: flex; align-items: stretch; }
.platform_slug input { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.platform_slug_dominio { background: #eef1f4; border: 1px solid #ced4da; border-left: 0; padding: 6px 12px; border-radius: 0 4px 4px 0; font-size: 14px; color: #6b7280; white-space: nowrap; }

.platform_modulo {
    display: flex !important;
    gap: 10px;
    align-items: flex-start;
    border: 1px solid #e3e6ea;
    border-radius: 6px;
    padding: 10px 12px;
    margin: 0 0 8px !important;
    font-size: 13px !important;
    font-weight: 400 !important;
}

.platform_modulo input { margin-top: 3px; }
.platform_modulo small { color: #6b7280; }

.platform_versoes { padding-left: 18px; font-size: 12px; }

/* endregion */


/* region SUBMENU (base em main.css, igual ao CRM; aqui só o acesso por teclado no desktop) */

@media (min-width: 992px) {
    .main_holder .sidemenu .holder_menu .menu li.has_submenu:focus-within .submenu,
    .main_holder .sidemenu .holder_menu .menu li.has_submenu.open .submenu { display: block; }
}

.main_holder .sidemenu .holder_menu .menu li.has_submenu { cursor: pointer; }

/* endregion */


/* region SIDEBAR (painéis só de leitura: mesma área com scroll que o form de main.css) */

.holder_side_singleRegisto .holder_detalhes .platform_scroll {
    position: relative;
    overflow: hidden;
    height: calc(100vh - 220px);
    padding: 0 30px 100px 0;
    margin-top: 25px;
}

@media (max-width: 991px) {
    .holder_side_singleRegisto .holder_detalhes .platform_scroll { height: calc(100dvh - 220px); }
}

/* endregion */


/* region FINANCEIRO */


.fin_valor { white-space: nowrap; font-variant-numeric: tabular-nums; }
.fin_num { text-align: right; }
.fin_bom { color: #2b8a3e; }
.fin_mau, .fin_mau .fin_valor { color: #c92a2a; }

.fin_tabela_holder { overflow-x: auto; }
.fin_tabela { margin-bottom: 0; }
.fin_tabela th.fin_grupo { text-align: center; border-bottom: 1px solid #e3e6ea; }
.fin_tabela tbody th { font-weight: 500; white-space: nowrap; }
.fin_tabela tbody th .badge { font-size: 10px; margin-left: 4px; }
.fin_tabela tfoot th, .fin_tabela tfoot td { border-top: 2px solid #101823; }
.fin_tabela tr.fin_fechado td { color: #6b7280; }
.fin_tabela tr.fin_atual { background: #f6fafb; }
.fin_tabela tr.fin_selecionado { box-shadow: inset 3px 0 0 #101823; }

.fin_mes_titulo .platform_btn_icon { font-size: 14px; }
.fin_resumo_mes { margin-bottom: 10px; }

.fin_tipo_marca { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; vertical-align: middle; }
.fin_tipo_entrada { background: #2b8a3e; }
.fin_tipo_saida { background: #c92a2a; }

.fin_barra_overview { justify-content: flex-end; margin-bottom: 20px; }
.datatable_fin_overview thead th { background-image: none !important; cursor: default; }
.fin_mes_link { background: none; border: 0; padding: 0; font: inherit; color: inherit; font-weight: 500; cursor: pointer; text-align: left; }
.fin_mes_link:hover { text-decoration: underline; }
.datatable_fin_overview tbody tr { cursor: pointer; }
table.dataTable.datatable_fin_overview tfoot th { border-top: 2px solid #101823; font-weight: 600; padding: 12px 5px 8px; }
.datatable_fin_overview tfoot th:not(:first-child) { text-align: right; }

.fin_barra_forecast { justify-content: flex-end; margin-bottom: 20px; }
.fin_filtros_ativos { margin-right: auto; font: 500 13px/1.4 Montserrat, Arial, sans-serif; color: #343d4a; }



.fin_linha { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
.fin_campos_livres[hidden] { display: none !important; }
.fin_check_inline { display: inline-block; margin-right: 16px; }

/* endregion */


/* region LOGIN */

.platform_login_titulo { font: 600 18px/1.4 Montserrat, Arial, sans-serif; margin-bottom: 20px; }

/* endregion */


/* region MENU LATERAL (preto, como o logotipo e o login; o resto da sidebar vem de main.css) */

.main_holder .sidemenu { background: #161616; }

.main_holder .sidemenu .holder_menu .menu li:hover,
.main_holder .sidemenu .holder_menu .menu li.active { background: #000; }

.main_holder .sidemenu .holder_menu .menu li .submenu { background: rgba(22, 22, 22, .95); }

/* endregion */


/* region RESPONSIVO */

@media (max-width: 991px) {
    .platform_titulo { display: none; }
    .platform_dl { grid-template-columns: 1fr; }
    .platform_dl dt { margin-top: 6px; }
    .platform_filtros .platform_filtro { flex: 1 1 160px; }
    .platform_wizard_passo { padding: 15px; }
    .platform_financeiro .dashboard_col8, .platform_financeiro .dashboard_col4 { grid-column: span 12; }
    .fin_linha { grid-template-columns: 1fr; }
}

/* endregion */
