/* ======= SADOC layout base ======= */ /* 1) Define uma variável única para a altura do header (Bootstrap navbar). */ :root { --sadoc-header-h: 56px; /* se ainda fica espaço a mais/menos, ajusta aqui (ex.: 60px ou 64px) */ } /* 2) Compensa o header .fixed-top para o conteúdo não ficar por baixo. */ html, body { height: 100%; margin: 0; } body { padding-top: var(--sadoc-header-h); /* empurra conteúdo exatamente a altura do header */ background: #f8f9fa; scrollbar-gutter: stable; /* evita salto quando aparece a scrollbar */ } /* 3) Garante que o header tem MESMO a altura definida e está centrado verticalmente. */ header.navbar.fixed-top { height: var(--sadoc-header-h); display: flex; align-items: center; /* alinha o texto no centro da barra */ box-shadow: 0 .125rem .25rem rgba(0,0,0,.15); /* sombra discreta */ } /* 4) Sidebar ocupa a área útil por baixo do header e tem scroll interno. */ .sidebar { min-height: calc(100vh - var(--sadoc-header-h)); overflow: hidden; } .sidebar-sticky { position: sticky; top: 0; /* já descontámos o header no padding do body */ height: calc(100vh - var(--sadoc-header-h)); overflow-y: auto; padding-bottom: 1rem; } /* Menu lateral sem “dança”: usa sombra interna em vez de border-left */ .sidebar .nav-link { display: block; /* garante bloco completo */ padding: 0.65rem 1rem; color: #333; /* removemos qualquer border-left para não alterar largura */ border-left: 0; box-shadow: inset 3px 0 0 0 transparent; /* placeholder para o estado normal */ } .sidebar .nav-link:hover { background: #f7f7f9; } .sidebar .nav-link.active { background: #eef4ff; /* destaque visual sem alterar o layout (não mexe na largura) */ box-shadow: inset 3px 0 0 0 #0d6efd; font-weight: 600; } /* opcional: remove outlines azuis que às vezes parecem “saltos” visuais ao clicar */ .sidebar .nav-link:focus { outline: none; box-shadow: inset 3px 0 0 0 #0d6efd, 0 0 0 0 rgba(13,110,253,0); /* mantém o marcador ativo */ } /* 6) Evita faixa branca por “margin collapse” no topo do conteúdo. */ main > *:first-child { margin-top: 0 !important; } main { min-height: calc(100vh - var(--sadoc-header-h)); } /* 7) Cartões de estatísticas (dashboard). */ .stat-card .stat-label { font-size: .9rem; color: #6c757d; } .stat-card .stat-value { font-size: 2rem; font-weight: 700; margin-top: .25rem; } /* 8) Mobile: sidebar sem sticky quando colapsada. */ @media (max-width: 767.98px) { .sidebar { min-height: auto; } .sidebar-sticky { position: static; height: auto; overflow: visible; } } /* === Evitar “dança” ao mudar de página (largura muda com scroll bar) === */ /* 1) Reservar sempre espaço para a scroll bar vertical (Chrome/Edge/Safari novos) */ @supports (scrollbar-gutter: stable) { html { scrollbar-gutter: stable both-edges; } } /* 2) Fallback universal: força presença da scroll bar (mesmo sem conteúdo) */ html { overflow-y: scroll; } /* 3) Extra segurança: garante que o conteúdo tem sempre pelo menos 100vh de altura */ main class="col-md-9 ms-sm-auto col-lg-10 px-md-4 pt-0 pb-4" /* Zera qualquer acolchoamento no topo da sidebar e do conteúdo */ .sidebar { padding-top: 0 !important; } .sidebar-sticky { padding-top: 0 !important; } main { padding-top: 0 !important; } /* === Estado sem autenticação (login) ===================================== */ /* Quando o utilizador não está autenticado, o tem class="no-auth". - Escondemos o menu lateral (por redundância, caso o HTML não o tenha removido) - Fazemos o conteúdo ocupar a largura total. */ .no-auth .sadoc-sidebar { display: none !important; /* garante que o menu não ocupa espaço */ } .no-auth .sadoc-main { /* Se usas grid/colunas, isto ajuda o conteúdo a expandir a 100% */ width: 100%; max-width: 100%; } /* Linhas clicáveis na lista de relatórios */ .table tr.clickable-row { cursor: pointer; } .table tr.clickable-row:hover { background-color: rgba(0,0,0,.03); } .table tr.clickable-row:focus { outline: 2px solid var(--bs-primary); outline-offset: -2px; } /* ----------------------------------------------------------- Lista de relatórios: visual dos APAGADOS (admin-only) - Texto cinzento suave - Rasurado (strike-through) - Mantém badges legíveis (sem rasura) e ligeiramente esbatidos ----------------------------------------------------------- */ .table tr.is-deleted td { color: var(--bs-secondary-color, #6c757d); text-decoration: line-through; } .table tr.is-deleted:hover { background-color: rgba(0, 0, 0, .02); } /* Não rasurar badges e ícones da célula */ .table tr.is-deleted .badge, .table tr.is-deleted .bi { text-decoration: none; opacity: .7; } /* (Opcional) Tornar o cursor um pouco mais neutro nos apagados, mas manter clicável */ .table tr.is-deleted { cursor: pointer; } /* ----------------------------------------------------------- Lista > coluna "Folha Suporte" — dot minimal (clean) - .fd-dot: base do ponto - .fd-ok: existe Folha Suporte (azul) - .fd-missing: não existe (vermelho) ----------------------------------------------------------- */ .fd-dot{ display:inline-block; width:.66rem; /* ~10–11px */ height:.66rem; border-radius:50%; vertical-align:middle; background: var(--bs-secondary); /* fallback */ box-shadow: inset 0 0 0 2px rgba(0,0,0,.06); /* aro subtil */ transform: translateY(-1px); /* alinha óptico com texto */ } .fd-ok{ background: var(--bs-primary); /* azul Bootstrap */ } .fd-missing{ background: var(--bs-danger); /* vermelho Bootstrap */ } /* Em linhas apagadas (rasuradas), manter dot legível e um pouco esbatido */ .table tr.is-deleted .fd-dot{ opacity:.7; } /* (Opcional) efeito hover muito discreto para linhas normais */ .table tr.clickable-row:hover .fd-dot{ box-shadow: inset 0 0 0 2px rgba(0,0,0,.08); } /* ------------------------------------------------------------------ Folha Suporte (VIEW): molduras + tamanho fixo e imagem contida ------------------------------------------------------------------ */ /* Caixa onde a imagem vive — altura fixa para não “esticar” com imagens altas */ .detail-imgbox { height: 240px; /* ← ajusta aqui se quiseres maior/menor */ padding: 8px; /* respiro dentro da moldura */ border-radius: 8px; /* cantos suaves no ecrã */ background: #fff; overflow: hidden; /* garante que nada sai da caixa */ display: block; } /* Bordas mais grossas: verde (Verdadeiro) e vermelho (Falsificação) */ .detail-true .detail-imgbox { border: 3px solid #198754; } /* Bootstrap green */ .detail-false .detail-imgbox { border: 3px solid #dc3545; } /* Bootstrap red */ /* A imagem ocupa a caixa sem distorcer, sempre visível por completo */ .detail-imgbox img { width: 100%; height: 100%; display: block; /* remove gap de inline images */ object-fit: contain; /* contém a imagem dentro da caixa */ object-position: center; /* centra a imagem na caixa */ } /* ------------------------------------------------------------ Perícia (VIEW) – FACE: retrato (portrait), tamanho um pouco maior ------------------------------------------------------------ */ @media screen { .pericia-face-imgbox { /* Mantém-se centrado dentro da coluna */ margin: 0 auto; /* Tamanho controlado: cresce até 240px de largura ou 75% da coluna, mas nunca menos que 200px. A altura é calculada pela proporção. */ width: clamp(200px, 75%, 240px); /* Retrato (altura > largura): 3:4 = portrait */ aspect-ratio: 3 / 4; height: auto; /* derivada da aspect-ratio */ /* Moldura interna e cantos */ padding: 8px; border-radius: 8px; background: #fff; /* Centrar a imagem e impedir “fugas” */ display: flex; align-items: center; justify-content: center; overflow: hidden; } .pericia-face-imgbox img { /* Preenche a caixa, sem distorcer, sempre visível por completo */ width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; object-position: center; display: block; } } /* Realce visual para grupo OK/NOT OK quando inválido */ .btn-check.is-invalid + .btn { border-color: #dc3545 !important; /* vermelho Bootstrap */ box-shadow: 0 0 0 .2rem rgba(220,53,69,.25); /* halo suave vermelho */ } /* Realce discreto para campos de filtro de texto */ .form-label { font-weight: 600; }