/* mobile.css — Tâche 4.112 : l'application sur téléphone et petite tablette.
   Corrige ce qu'un audit sur écran de 360 et 390 px a montré : listes et champs qui font zoomer l'écran sur iPhone, menus qui dépassent
   de l'écran, boutons trop petits pour le doigt, barre du haut trop haute en saisie plein écran.
   RÈGLE DE COULEURS : orange, bleu et jaune sont réservés aux usines (D85, S92, S89) : on n'emploie ici que du vert / neutre. */
@media (max-width:900px){
  /* 16 px minimum dans les champs : en dessous, l'iPhone zoome tout seul sur la page au toucher */
  select,textarea,
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]){font-size:16px !important;}
  /* aucun champ ne dépasse de sa carte */
  .main select,.main input:not([type="checkbox"]):not([type="radio"]),.main textarea{max-width:100%;min-width:0;box-sizing:border-box;}
  .an-toolbar select,.an-toolbar input:not([type="checkbox"]):not([type="radio"]){max-width:100%;min-width:0;}
  /* doigts : cibles d'au moins 44 px */
  .main button:not(.sort-btn):not(.modebar-btn),.main .btn,.main .query-btn,.pw-eye{min-height:44px;}
  .main summary{padding-top:12px;padding-bottom:12px;}
  /* barre de tri de l'historique : l'étiquette et la liste passent à la ligne au lieu de déborder */
  .lot-sortbar label{display:flex;flex-wrap:wrap;align-items:center;gap:6px;max-width:100%;}
  .lot-sortbar select{flex:1 1 150px;width:auto;min-width:0;max-width:100%;}
  .combo-btn{min-width:44px;min-height:40px;}
  #btnAddHerbe{min-width:44px;}
  a.dg-lot-link{display:inline-block;padding:10px 6px;margin:-4px 0;line-height:1.2;}
  /* menu « Colonnes » des tableaux : s'ouvre en bas de l'écran, à la largeur du téléphone, au lieu de sortir à droite */
  details.rl-cols[open] > div{position:fixed !important;left:10px !important;right:10px !important;top:auto !important;bottom:10px;width:auto !important;
    max-width:none !important;max-height:60vh;overflow-y:auto;z-index:1400;box-shadow:0 10px 40px rgba(15,61,36,.38);}
  details.rl-cols[open] > div label{white-space:normal !important;padding:9px 4px !important;font-size:15px !important;}
}
@media (max-width:640px){
  /* saisie plein écran : la barre de boutons défile avec la page (3 lignes collées en haut mangeaient 20 % de l'écran) */
  body.saisie-plein #saisieBarre{position:static;}
  /* tableaux à faire défiler : ombre sur le bord pour montrer qu'il y a une suite, et défilement fluide au doigt */
  .table-wrap,.tw-fs,.rl-fs{-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;}
  /* les cartes, graphiques et blocs ne dépassent jamais de l'écran */
  .card,.main > section{max-width:100%;}
  img,canvas,svg{max-width:100%;}
}
@media (max-width:900px){.pw-eye{height:40px !important;}}
.swipe-hint{display:none;}
@media (max-width:640px){
  .swipe-hint{display:block;margin:6px 0 4px;padding:6px 10px;border-radius:10px;background:#e6f4ea;color:#14532d;font-size:13px;font-weight:700;text-align:center;}
}

/* 4.113 — Analyse avancée (Pandas) sur téléphone : le contenu pleine largeur était rangé comme une « carte de tableau » (décalé à droite, marges doubles,
   tableaux internes éclatés en cartes). On remet un bloc normal pleine largeur, et les tableaux internes défilent sur le côté. */
@media (max-width:900px){
  table.stack-table > tbody > tr.pandas-row{display:block;background:transparent;border:0;box-shadow:none;margin:0;padding:0;}
  table.stack-table > tbody > tr > td.pandas-cell{display:block;width:100%;padding:0;border:0;text-align:start;word-break:normal;}
  table.stack-table > tbody > tr > td.pandas-cell::before{display:none;}
  td.pandas-cell img{max-width:100%;height:auto;}
  td.pandas-cell > div,td.pandas-cell > section{max-width:100%;box-sizing:border-box;}
  td.pandas-cell table{display:block;max-width:100%;min-width:0 !important;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  td.pandas-cell table th,td.pandas-cell table td{white-space:nowrap;}
  td.pandas-cell .kpi{min-width:0 !important;flex:1 1 130px;}
}
@media (max-width:900px){
  /* tablette : le tableau qui contient le rapport Pandas n'impose plus sa largeur minimale (il faisait défiler tout le rapport de côté) */
  .table-wrap table:has(> tbody > tr.pandas-row){min-width:0 !important;width:100%;display:block;}
  .table-wrap table:has(> tbody > tr.pandas-row) > tbody{display:block;width:100%;}
}