/* body {
      font-family: Calibri, sans-serif;
      background-color: #f5f5f5;
      margin: 20px;
    } */
    table {
      border-collapse: collapse;
      margin: auto;
      background-color: white;
    }
    td {
      width: 32px;
      height: 24px;
      border: 1px solid black;
      text-align: center;
      vertical-align: middle;
      font-size: 9pt;
      cursor: pointer;
    }

@media (max-width: 1280px) {
  #monTableau td {
    width: 24px;
    height: 18px;
    font-size: 11pt;
  }
}

    @media (max-width: 1024px) {
  #monTableau td {
    width: 24px;
    height: 18px;
    font-size: 10pt;
  }
 

 
}
@media (max-width: 640px) {
  #monTableau td {
    width: 18px;
    height: 14px;
    font-size: 7pt;
    padding: 0; /* enlever marge */
  }
}
    td.sary {
    width: 32px;
    height: 24px;
    border-bottom: none;
    border-right: none;
    border-left: 1px solid black;
    border-top: none;
    text-align: center;
    vertical-align: middle;
    font-size: 11pt;
    cursor: pointer;
    }
    td.sary1 {
    width: 32px;
    height: 24px;
    border-bottom: none;
    border-right: none;
    border-left: 1px solid black;
    border-top: 1px solid black;
    text-align: center;
    vertical-align: middle;
    font-size: 11pt;
    cursor: pointer;
    }
    td.sary2 {
    width: 32px;
    height: 24px;
    border-bottom: 1px solid black;
    border-right: none;
    border-left: 1px solid black;
    border-top: none;
    text-align: center;
    vertical-align: middle;
    font-size: 11pt;
    cursor: pointer;
    }
    td.sary3 {
    width: 32px;
    height: 24px;
    border-bottom: none;
    border-right: none;
    border-left: none;
    border-top: 1px solid black;
    text-align: center;
    vertical-align: middle;
    font-size: 11pt;
    cursor: pointer;
    }
    td.sary4 {
    width: 32px;
    height: 24px;
    border-bottom: 1px solid black;
    border-right: none;
    border-left: none;
    border-top: none;
    text-align: center;
    vertical-align: middle;
    font-size: 11pt;
    cursor: pointer;
    }
    td.sary5 {
    width: 32px;
    height: 24px;
    border-bottom: 1px solid black;
    border-right: 1px solid black;
    border-left: none;
    border-top: none;
    text-align: center;
    vertical-align: middle;
    font-size: 11pt;
    cursor: pointer;
    }
    td.sary6 {
    width: 32px;
    height: 24px;
    border-bottom: none;
    border-right: 1px solid black;
    border-left: none;
    border-top: 1px solid black;
    text-align: center;
    vertical-align: middle;
    font-size: 11pt;
    cursor: pointer;
    }
    td.sary7 {
    width: 32px;
    height: 24px;
    border-bottom: none;
    border-right: 1px solid black;
    border-left: none;
    border-top: none;
    text-align: center;
    vertical-align: middle;
    font-size: 11pt;
    cursor: pointer;
    }
    td.sary8 {
    width: 32px;
    height: 24px;
    border-bottom: none;
    border-right: 1px solid black;
    border-left: 1px solid black;
    border-top: 1px solid black;
    text-align: center;
    vertical-align: middle;
    font-size: 11pt;
    cursor: pointer;
    }
    td.sary9 {
    width: 32px;
    height: 24px;
    border-bottom: 1px solid black;
    border-right: 1px solid black;
    border-left: 1px solid black;
    border-top: none;
    text-align: center;
    vertical-align: middle;
    font-size: 11pt;
    cursor: pointer;
    }
    td.sary10 {
    width: 32px;
    height: 24px;
    border-bottom: none;
    border-right: 1px solid black;
    border-left: 1px solid black;
    border-top: none;
    text-align: center;
    vertical-align: middle;
    font-size: 11pt;
    cursor: pointer;
    }
    td.sary11 {
    width: 32px;
    height: 24px;
    border-bottom: 1px solid black;
    border-right: none;
    border-left: 1px solid black;
    border-top: 1px solid black;
    text-align: center;
    vertical-align: middle;
    font-size: 11pt;
    cursor: pointer;
    }
    td.sary12 {
    width: 32px;
    height: 24px;
    border-bottom: 1px solid black;
    border-right: 1px solid black;
    border-left: none;
    border-top: 1px solid black;
    text-align: center;
    vertical-align: middle;
    font-size: 11pt;
    cursor: pointer;
    }
    .no-border {      /* Enlève toutes les bordures */
    border-bottom: none !important; /* Enlève seulement en bas si tu veux */
    text-align: center;             /* Pour centrer le texte si nécessaire */
    }
    .vertical-text {
    writing-mode: vertical-rl;  /* Texte vertical de haut en bas */

    text-align: center;
    color: white;
    vertical-align: middle;
    }
    .horizontal-text {
    text-align: center;
    color: white;
    }
    .scroll-mt-20 {
      scroll-margin-top: 5rem; /* Ajustez selon votre header */
    }
    .red {
      border: none;
    }
    .black {
      background-color: black;
    }
    .gold {
      background-color: #C0C0C0;
    }
    .yelow {
      background-color: #FFD700;
    }
     /* Case réservée rouge */
    .reserved-stand {
        background-color: #ef4444 !important; /* Rouge plein */
        color: white; /* Texte en blanc pour être lisible */
        font-weight: bold;
    }