/* Styles de base pour rendre le tableau lisible - lacarte.css */
table {
  background-color: transparent;
  width: 100%; /* OK */
  min-width: 600px; 
  max-width: 1200px; 
  table-layout: fixed; /* fixed = Définition stricte des colonnes */
  /*border-collapse: collapse;*/
  font-family: sans-serif;
}
/* Style des bordures et des cellules */
th, td {
  border: 1px dotted #FF0000;
  padding: 5px;
  text-align: left;
  font-size: 16px; 
  color: #ffffff; /* blanc */
  overflow: hidden;      /* Empêche le texte long de casser la structure */
  text-overflow: ellipsis; /* Ajoute "..." si le texte est trop long (optionnel) */
  white-space: nowrap;   /* Force le texte à rester sur une ligne (optionnel) */}
/* Couleur de fond pour les titres de colonnes */
th {
  background-color: #f4f4f4;
  font-weight: bold;
  color: #FF0000;
}
.align-droite {
  text-align: right;
}
.fond-rouge {
  background-color: red;
}
.fond-orange {
  background-color: orange;
}
.fond-vert {
  background-color: green;
}

/* ==========================================================================
   CSS RESPONSIVE POUR TABLETTES ET SMARTPHONES - cf. load-menu.css 
   ========================================================================== */
/* Détecte un écran mobile tenu verticalement (Portrait) */
@media screen and (max-width: 768px) and (orientation: portrait) {
  body {
    /* 1. Aligne le point de pivot en haut à gauche */
    transform-origin: top left;
    
    /* 2. Tourne de 90° et décale de la hauteur pour recentrer */
    transform: rotate(90deg) translateY(-100vh);
    
    /* 3. Inverse la largeur et la hauteur de l'affichage */
    width: 100vh;
    height: 100vw;
    
    /* 4. Sécurise le positionnement et les débordements */
    position: absolute;
    top: 0;
    left: 0;
    overflow-x: hidden;
    margin: 0;
    /* 5. CORRECTION DU FOND : Inverse les dimensions du background-size */
    /* On force l'image de fond à faire la hauteur du viewport en largeur, et inversement */
/*    background-size: 100vh 100vw; 
    background-position: center; */
  }
}