body {
    overflow: hidden;
    position: fixed;
    width: 100%;
}
#sidebar {
  width: 420px;
  background-color: #f8f9fa;
  border-right: 1px solid #ddd;
  height: 100%;
  z-index:10;
  /*box-shadow: -12px 0px 20px 0px; */
}
.accordion .accordion-collapse {
    transition: none !important;
}
.container-fluid.d-flex {
  height: 100vh;
}
.py-b {
    padding-top: 0.25rem;
    padding-bottom: 0px;
}
.navbar {
    z-index:5;
  --bs-navbar-toggler-padding-y: .15rem;
  --bs-navbar-toggler-padding-x: .35rem;
  --bs-navbar-toggler-font-size: .9rem;   /* taille de l’icône (background) */
  --bs-navbar-toggler-border-radius: .25rem;
  --bs-navbar-padding-y: .25rem;          /* réduit aussi la hauteur de la navbar */
}
.navbar .navbar-toggler-icon { background-size: 1rem 1rem; }
.navbar .nav-link {
  font-size: 0.85rem;   /* un peu plus petit */
}
#navig .navbar-toggler {
  margin-right: .5rem;  /* espace avec le bord droit */
}
.sidebar-content {
  position:relative;
}
.no-scroll {
    overflow: hidden !important;
}
.btn-outline-secondary:hover,
.btn-outline-secondary:focus {
  color: #fff !important;            /* texte blanc */
  background-color: #6c757d !important; /* gris Bootstrap standard */
  border-color: #6c757d !important;  /* bordure assortie */
}
.bphy-layout {
  /*flex-grow: 1;*/
  height: calc(100vh - 74px);
}
main {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}
#main-content {
  background-color: #ffffff;
  margin-top:74px;
}
.slidebar-content {
    height: calc(100vh - 74px);
}
@media (max-width: 768px) {
    #sidebar {
        width: 420px;
    }
    #main-content {
        /*display: none;*/
    }
}

.btn-white-lightgray {
  /* Base Bootstrap btn */
  @extend .btn;

  /* Fond blanc et bordure gris clair */
  background-color: var(--bs-white);
  border: 1px solid var(--bs-gray-200);
  color: var(--bs-dark);
}

/* État hover / focus */
.btn-white-lightgray:hover,
.btn-white-lightgray:focus {
  background-color: var(--bs-gray-100);
  border-color: var(--bs-gray-300);
  color: var(--bs-dark);
  text-decoration: none;
}

/* État actif */
.btn-white-lightgray:active {
  background-color: var(--bs-gray-200);
  border-color: var(--bs-gray-400);
  color: var(--bs-dark);
}

/* État désactivé */
.btn-white-lightgray:disabled,
.btn-white-lightgray.disabled {
  background-color: var(--bs-white);      /* même fond blanc */
  border-color: var(--bs-gray-200);       /* même bordure gris clair */
  color: var(--bs-gray-400);              /* texte/gris plus atténué */
  opacity: 1;                              /* on gère l’opacité manuellement */
  box-shadow: none;                       /* on retire toute ombre ou focus */
  pointer-events: none;                   /* plus de clics possibles */
}

.bphy-view {
    position: relative;
    padding:15px;
}

.bphy-bottom-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #fff;
    border-top: 1px solid #ddd;
    padding: 10px;
    width: 100%;
    z-index: 1050;
}

.bphy-bottom-bar .left-side,
.bphy-bottom-bar .right-side {
    display: flex;
    align-items: center;
    gap: 10px;
}

.app-margintop-70 {
    z-index:10;
    margin-top:20px;
    padding: 0px 15px 100px 15px;
}
.app-margintop-100 {
    z-index:10;
    margin-top:0px;
    padding: 0px;
    height: calc(100vh - 89px);
}
#bphy-compare {
    cursor:pointer;
}
.bphy-btn-noborder {
    border: none !important;
    background-color:transparent;
}
.bphy-indication {
    cursor:pointer;
}
.bphy-aux-tddata {
    word-break: break-word;
    background-color:#f3f7ff !important;
}
.bphy-aux-th {
    background-color:#e8f0ff !important;
}
.bphy-charge-th {
    background-color:#fffee8 !important;
}
.bphy-charge-data {
    word-break: break-word;
    background-color: #fffff4 !important;
}
.table-auto-container{
    margin-top:-27px;
    background-color:#fff;
}
.table-auto-width {
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
    margin-left:-27px;
}
/* Bordures normales */
.table-auto-width th,
.table-auto-width td {
    border-bottom: 1px solid #eee;
    border-right: 1px solid #eee;
    padding: 8px;
    background: white;
    word-break: break-word;
    overflow-wrap: break-word;
    white-space: normal;
}

/* En-tête figée */
.table-auto-width thead th {
    --rot: 0deg;
    position: sticky;
    top: -27px;
    z-index: 2;
    background: #f9f9f9;
}
.table-auto-width thead tr:nth-child(2) th {
    position: sticky;
    top: 8px;
    z-index: 4;
    background: #f9f9f9;
}

/* Colonnes figées */
.table-auto-width .sticky-hcol-0 {
    position: sticky;
    top: -27px;
    left: -25px;
    z-index: 5 !important;
    /*box-shadow: 1px 0 0 #ccc;*/
}

.table-auto-width .sticky-hcol-1 {
    position: sticky;
    top: -27px;
    left: 5px;
    z-index: 5 !important;
    /*box-shadow: 1px 0 0 #ccc;*/
}

.table-auto-width .sticky-hcol-2 {
    position: sticky;
    top: -27px;
    left: 135px;
    z-index: 5 !important;
    /*box-shadow: 1px 0 0 #ccc;*/
}
.table-auto-width tr:hover .sticky-col-0 {
    background-color: #f5f5f5; /* couleur de fond au survol */
}
.table-auto-width tr:hover .sticky-col-1 {
    background-color: #f5f5f5; /* couleur de fond au survol */
}
.table-auto-width tr:hover .sticky-col-2 {
    background-color: #f5f5f5; /* couleur de fond au survol */
}

/* Colonnes figées */
.table-auto-width .sticky-col-0 {
    position: sticky;
    left: -25px;
    z-index: 3;
    box-shadow: 1px 0 0 #ccc;
}
.table-auto-width .sticky-col-1 {
    position: sticky;
    left: 5px;
    z-index: 3;
    box-shadow: 1px 0 0 #ccc;
}
.table-auto-width .sticky-col-2 {
    position: sticky;
    left: 135px;
    z-index: 3;
    box-shadow: 1px 0 0 #ccc;
}

.table-auto-width th.vertical-header {
  --rot: 180deg;
  position:relative;
  writing-mode: vertical-rl; /* Texte vertical de bas en haut */
  transform: rotate(180deg); /* Pour le remettre de haut en bas */
  text-align: start;
  vertical-align: top;
  padding: 8px;
  white-space: nowrap;
  height: 180px; /* Ajuste selon ton besoin */
  overflow: hidden;
  text-overflow: ellipsis;
  z-index:3;
}
.table-auto-width th.vertical-header::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 1px;
  /*width: 100%;*/
  background: #eee;
  z-index: 5;
}
.container-fluid {
    padding-right: 0px;
    padding-left: 0px;
}
.bphy-app-browser-table th {
    font-size:9pt;
    background-color:#eee;
}
.bphy-app-browser-table td {
    font-size:9pt;
}
.bphy-app-browser-label {
    color:#333;
}
.bphy-search-bottom-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    background: white;
    border-top: 1px solid #ddd;
    padding: 10px;
    width: calc(100% - 3px);
}
.bphy-desktop-paging {
    z-index:5;
    position:fixed;
    bottom:17px;
    left:430px;
    background-color:#fff;
    border: solid 1px #eee;
    border-radius: 4px;
    padding:5px;
    width: max-content;
}

/* ==== Chrome, Safari et Edge (WebKit/Blink) ==== */
/* largeur de la barre verticale et hauteur de la barre horizontale */
::-webkit-scrollbar {
  width: 22px;
  height: 22px;
  background: #f1f1f1; /* couleur de fond de la scrollbar */
}

/* piste (track) */
::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 6px;
}

/* pouce (thumb) */
::-webkit-scrollbar-thumb {
  background-color: #888; /* couleur du pouce */
  border-radius: 6px;
  border: 3px solid #f1f1f1; /* marge autour */
}

/* pouce au survol */
::-webkit-scrollbar-thumb:hover {
  background-color: #555;
}


/* ==== Firefox (Gecko) ==== */
/* Appliquer à tout le document, ou ciblez un sélecteur précis à la place de “*” */
* {
  scrollbar-width: auto;               /* auto | thin | none */
  scrollbar-color: #888 #f1f1f1;       /* thumb-color track-color */
}

#cultures-form { margin-bottom:75px; }
#applicationareas-form { margin-bottom:75px; }
#adventices-form { margin-bottom:75px; }
#bphy-view-options { margin-bottom:75px; }
#bphy-conditions-form { margin-bottom:75px; }

.app-viewer {
    display:none;
    z-index:2000;
    position:fixed;
    background-color: rgba(0,0,0,.50);
    left:0px;
    right:0px;
    top:0px;
    bottom:0px;
}
.app-viewer-toolbar {
    padding:15px;
    background-color:#fff;
    border-bottom: solid 1px #eee;
}
.app-viewer-content {
    width:100%;
    height: calc(100% - 79px);
    background-color:#fff;
}
.bphy-filter-check {
    position:absolute;
    cursor: pointer;
    right:18px;
    top:-2px;
    transform: rotate(180deg);
}
.bphy-filter-check-left {
    position:absolute;
    cursor: pointer;
    right:-6px;
    top:10px;
}
.bphy-filter-header {
    margin-left:-10px;
    margin-top:-10px;
    margin-right:-10px;
    margin-bottom:10px;
    padding:10px;
    border-bottom:solid 1px #ddd;
    background-color: #f7f7f7;
}
.bphy-filter-body {
    margin:-10px;
    overflow-y: auto;
    overflow-x: hidden;
    height:315px;
    padding:10px;
}
.bphy-filter-footer {
    margin-top:5px;
}
.bphy-desktop-iconbar-btn {
    width:63px;
    height:63px;
    text-align:center;
    border:solid 1px #eee;
    padding-top:17px;
    cursor:pointer;
}
#bphy-legende-global {
    display:none;
    position: fixed;
    top: 83px;
    right: 20px;
    left: unset;
    z-index: 200;
    background-color: #fff;
    border: solid 1px #ddd;
    padding: 10px;
    width: 500px;
    box-shadow:0px 0px 11px 0px;
}
#bphy-osav-global {
    display:none;
    position: fixed;
    bottom: 70px;
    right: 20px;
    left: unset;
    z-index: 200;
    background-color: #fff;
    border: solid 1px #ddd;
    padding: 10px;
    width: 500px;
    box-shadow:0px 0px 11px 0px;
}
#sidebar.collapsed {
    width: 0px !important;
    overflow: hidden;
    transition: width 0.3s;
}
#btn-toggle-sidebar.collapsed i {
    transform: rotate(180deg);
}
.bphy-sidebar-icons {
    display:none;
    z-index:500;
    position: absolute;
    left: calc(100% + 0px);
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* ou center selon le rendu souhaité */
    gap: 12px; /* espace entre les boutons */
}
.hidden-important {
    display: none !important;
}
.bphy-layout {
    position: relative;
}
/* Ajustement dynamique */
#sidebar.collapsed + #param-tab {
    left: 0 !important;
}


/* Colonnage figé (sticky) */
#indications-table th.hidden-col, #indications-table td.hidden-col { display:none !important; }
#indications-table th.bphy-sticky-col, #indications-table th.bphy-sticky-group, #indications-table td.bphy-sticky-col {
  position: sticky; background-color: #f5f5f5;
}
#indications-table th.bphy-sticky-group { z-index: 5; }
#indications-table th.bphy-sticky-col   { z-index: 4; }
#indications-table td.bphy-sticky-col   { z-index: 3; }

.bphy-vert-sort-asc { position:absolute; bottom:5px; left:5px; color:#888; }
.bphy-vert-sort-desc { position:absolute; bottom:0px; left:5px; color:#888; }
.bphy-hori-sort-asc { position:absolute; top:5px; right:5px;color:#888; }
.bphy-hori-sort-desc { position:absolute; top:0px; right:5px;color:#888; }