/*
 * -*- coding: utf-8 -*-
 * Copyright (c) 2026 Ivan LUCAS.
 * Previthys, application de gestion du DUERP (Document Unique d’Évaluation des Risques Professionnels).
 * Distribué sous licence GNU GPL.
 */

body { background: #f4f6f9; }
/* Bootstrap 5 colore les cellules d'un tableau avec --bs-table-bg : on redéfinit cette variable pour les niveaux de risque */
.niveau-faible { --bs-table-bg: #28a745; --bs-table-color: #fff; background-color: #28a745; color: #fff; font-weight: 600; }
.niveau-moyen { --bs-table-bg: #d39e00; --bs-table-color: #fff; background-color: #d39e00; color: #fff; font-weight: 600; }
.niveau-critique { --bs-table-bg: #dc3545; --bs-table-color: #fff; background-color: #dc3545; color: #fff; font-weight: 600; }
table.matrice td { border: 2px solid #fff; }
table.dataTable thead th { text-align: center; }
table.dataTable th[data-name="id"] { width: 25px; }
table.dataTable th[data-name="actions"] { width: 200px; }
table.dataTable td { vertical-align: middle; }
.dt-buttons-haut { margin-top: 10px; }
.dataTables_filter input { width: 150px !important; margin-right: 10px; }
.dataTables_info { color: #999; font-size: 12px; margin-left: 10px; }
@media print {
  body { background: #fff; }
  .navbar, .d-print-none, .btn { display: none !important; }
  .niveau-faible, .niveau-moyen, .niveau-critique, .badge { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
/* Sur petit écran, seul le tableau défile horizontalement (pas toute la page) */
.dataTables_wrapper .row > .col-sm-12 { overflow-x: auto; }
.dataTables_wrapper .pagination { flex-wrap: wrap; }

/* Document unique : mêmes largeurs de colonnes sur toutes les unités, pour un alignement visuel d'un tableau à l'autre. */
table.table-document { table-layout: fixed; width: 100%; }
table.table-document th, table.table-document td { overflow-wrap: break-word; }
table.table-document th:nth-child(1), table.table-document td:nth-child(1) { width: 31%; }
table.table-document th:nth-child(2), table.table-document td:nth-child(2) { width: 12%; }
table.table-document th:nth-child(3), table.table-document td:nth-child(3) { width: 8%; }
table.table-document th:nth-child(4), table.table-document td:nth-child(4) { width: 49%; }
/* Écran (prévisualisation) : colonne de cotation plus étroite, la page étant plus large qu'une feuille A4 */
@media screen {
  table.table-document th:nth-child(3), table.table-document td:nth-child(3) { width: 6rem; font-size: .9rem; }   /* juste « 10 × 10 × 10 » */
  table.table-document th:nth-child(4), table.table-document td:nth-child(4) { width: auto; }
}
/* Nom de l'unité de travail : bandeau foncé pleine largeur, collé au tableau, avec de l'espace au-dessus pour bien
   séparer les unités. À l'impression, le fond est forcé (sinon texte blanc sur blanc) et le bandeau ne reste jamais
   seul en bas de page. */
.document-unique .titre-unite { margin: 3rem 0 0; padding: .45rem .75rem; background: #212529; color: #fff; font-size: 1.15rem;
  font-weight: 600; -webkit-print-color-adjust: exact; print-color-adjust: exact; break-after: avoid; page-break-after: avoid; }
.document-unique .titre-unite .effectif-unite { font-size: .8em; font-weight: 400; color: #ced4da; }
.document-unique .description-unite { margin: .5rem 0; break-after: avoid; page-break-after: avoid; }
/* Colonne « Actions de prévention » : une action par ligne, précédée de son macaron de statut */
.action-document + .action-document { margin-top: .3rem; padding-top: .3rem; border-top: 1px dashed var(--bs-border-color); }

/* Vignette des pièces jointes de type image, dans le formulaire de modification d'un risque. */
.piece-jointe-vignette { width: 56px; height: 56px; object-fit: cover; border-radius: 4px; border: 1px solid var(--bs-border-color); cursor: zoom-in; }
#pj-apercu .modal-body img { max-height: 75vh; }

/* Photos jointes à un risque, affichées et imprimées dans le document unique, à une taille raisonnable. */
.photo-risque-impression { width: 140px; height: 105px; object-fit: cover; border-radius: 4px; border: 1px solid var(--bs-border-color); }

/* Liste des risques : actions de prévention associées, une par ligne. */
.liste-actions li { font-size: .875rem; white-space: normal; }
.liste-actions li + li { margin-top: 2px; }

/* Portée des actions de prévention : générale (toute la structure) ou commune à plusieurs unités. */
.portee-generale { background: #e7f1ff; color: #0a58ca; border: 1px solid #b6d4fe; }
.portee-commune { background: #f3e8ff; color: #6f42c1; border: 1px solid #d9c2fb; }
.encart-commune { border-left: 4px solid #6f42c1; background: #faf7ff; }
/* Choix des risques d'une action : cases à cocher regroupées par unité */
.liste-risques { max-height: 360px; overflow: auto; border: 1px solid var(--bs-border-color); border-radius: .375rem; background: #fff; }
.liste-risques .unite { background: #f8f9fa; font-weight: 600; padding: .35rem .75rem; border-top: 1px solid var(--bs-border-color); position: sticky; top: 0; z-index: 1; }
.liste-risques .groupe:first-child .unite { border-top: 0; }
.liste-risques label { display: flex; gap: .5rem; align-items: center; padding: .2rem .75rem .2rem 1.75rem; margin: 0; cursor: pointer; }
.liste-risques label:hover { background: #f8f9fa; }
details.unites-action summary { display: inline; cursor: pointer; font-size: .875rem; color: var(--bs-link-color); }
.categorie-action { background: #f1f3f5; color: #495057; border: 1px solid #ced4da; font-weight: 500; }

/* Tableau de bord : matrice gravité × fréquence, barres de statut, mini-indicateurs */
table.matrice-risques th { font-size: .8rem; vertical-align: middle; padding: .3rem; }
table.matrice-risques td.case { text-align: center; vertical-align: middle; height: 52px; width: 22%; border: 2px solid #fff; padding: .2rem; }
table.matrice-risques td.case a { color: inherit; text-decoration: none; font-size: 1.05rem; font-weight: 700; display: block; }
table.matrice-risques td.vide { background: #f1f3f5; }
.pastille { display: inline-block; min-width: 22px; padding: 0 4px; margin: 0 1px; border-radius: 3px; color: #fff; font-size: .7rem; font-weight: 700; text-align: center; }
.pastille-critique { background: #dc3545; } .pastille-moyen { background: #d39e00; } .pastille-faible { background: #28a745; }
td.case .pastille { border: 1px solid rgba(255,255,255,.7); }
.pile-statuts { display: flex; height: 20px; border-radius: 4px; overflow: hidden; background: #e9ecef; font-size: .72rem; color: #fff; font-weight: 600; }
.pile-statuts > div { display: flex; align-items: center; justify-content: center; white-space: nowrap; }
.kpi-mini { border: 1px solid var(--bs-border-color); border-radius: .5rem; padding: .6rem .8rem; }
a.kpi-mini:hover { background: #f8f9fa; }
.kpi-mini .valeur { font-size: 1.5rem; font-weight: 700; line-height: 1; }
.compte-a-rebours { font-size: 2rem; font-weight: 700; line-height: 1; text-align: center; min-width: 60px; }
.compte-a-rebours small { font-size: .7rem; font-weight: 400; }

/* Document unique : page de garde et introduction */
.page-garde { text-align: center; padding: 3rem 1rem 4rem; margin-bottom: 2rem; border: 1px solid var(--bs-border-color); border-radius: .5rem; background: #fff; }
.page-garde .logo-garde { max-height: 110px; max-width: 280px; margin-bottom: 2rem; }
.page-garde .surtitre { text-transform: uppercase; letter-spacing: .12em; color: #6c757d; margin-bottom: .5rem; }
.page-garde h1 { font-size: 2rem; font-weight: 600; margin-bottom: 1.5rem; }
.page-garde .organisation { font-size: 1.5rem; font-weight: 500; margin-bottom: 2rem; }
.page-garde .edition { color: #495057; margin-bottom: 0; }
.introduction-document { background: #fff; border: 1px solid var(--bs-border-color); border-radius: .5rem; padding: 1.25rem 1.5rem; margin-bottom: 2rem; }
.introduction-texte ul { margin-bottom: .75rem; }
.baremes th { background: #f8f9fa; }
.liste-unites { columns: 2; }
.logo-introduction { max-height: 80px; max-width: 240px; }
@media print {
  .saut-page { break-before: page; }
  .page-garde { border: 0; padding-top: 30vh; min-height: 90vh; }
  .introduction-document { border: 0; padding: 0; }
  .liste-unites a { color: inherit; text-decoration: none; }
}

/* Impression du document unique : taille de base réduite (12 px au lieu de 16). Les titres, tableaux et marges de
   Bootstrap étant exprimés en rem, tout le document diminue en proportion. Les autres pages ne sont pas concernées. */
@media print {
  html:has(.document-unique) { font-size: 12px; }
  .document-unique .table > :not(caption) > * > * { padding: .2rem .3rem; }
  .document-unique .photo-risque-impression { width: 90px; height: 70px; }
}

/* Aide contextuelle : bouton « ? » à côté du titre des pages, qui ouvre la rubrique d'aide correspondante. */
.lien-aide { display: inline-flex; align-items: center; justify-content: center; width: 1.4rem; height: 1.4rem; margin-left: .25rem;
  border: 1px solid var(--bs-border-color); border-radius: 50%; font-size: .8rem; font-weight: 600; line-height: 1;
  color: var(--bs-secondary-color); text-decoration: none; vertical-align: middle; background: var(--bs-body-bg); }
.lien-aide:hover, .lien-aide:focus { color: #fff; background: var(--bs-primary); border-color: var(--bs-primary); }

/* Page « Aide » : sommaire fixe à gauche, contenu à droite. */
.sommaire-aide { position: sticky; top: 1rem; max-height: calc(100vh - 2rem); overflow-y: auto; padding: 1rem;
  background: var(--bs-body-bg); border: 1px solid var(--bs-border-color); border-radius: .5rem; font-size: .9rem; margin-bottom: 1rem; }
.sommaire-aide .titre-partie { margin: .75rem 0 .25rem; font-size: .75rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--bs-secondary-color); }
.sommaire-aide .titre-partie:first-child { margin-top: 0; }
.sommaire-aide ol { margin-bottom: 0; }
.sommaire-aide a { display: block; padding: .15rem .5rem; border-radius: .25rem; color: var(--bs-body-color); text-decoration: none; }
.sommaire-aide a:hover { background: var(--bs-tertiary-bg); color: var(--bs-primary); }
.contenu-aide { max-width: 60rem; background: var(--bs-body-bg); border: 1px solid var(--bs-border-color); border-radius: .5rem; padding: 1.25rem 1.75rem; }
.contenu-aide section { scroll-margin-top: 1rem; }
.contenu-aide section:target > h3 { color: var(--bs-primary); }
.contenu-aide .partie-aide { margin: 2.5rem 0 0; padding: .45rem .75rem; background: #212529; color: #fff; font-size: 1.15rem; font-weight: 600; }
.contenu-aide h3 { margin-top: 2rem; padding-bottom: .25rem; border-bottom: 1px solid var(--bs-border-color); font-size: 1.15rem; }
.contenu-aide h4 { margin-top: 1.25rem; font-size: 1rem; font-weight: 600; }
.contenu-aide .chemin { display: inline-block; padding: .1rem .5rem; border-radius: .25rem; background: var(--bs-tertiary-bg); font-size: .85rem; color: var(--bs-secondary-color); }
.contenu-aide .bloc-code { padding: .75rem 1rem; border-radius: .25rem; background: var(--bs-tertiary-bg); font-size: .85rem; }
.contenu-aide dl.row dt { font-weight: 600; }
@media print {
  .aide > .col-lg-9 { width: 100%; }
  .contenu-aide { max-width: none; border: 0; padding: 0; }
  .contenu-aide .partie-aide { -webkit-print-color-adjust: exact; print-color-adjust: exact; break-after: avoid; }
  .contenu-aide h3, .contenu-aide h4 { break-after: avoid; }
  .contenu-aide table { break-inside: avoid; }
}
