/* Compléments du thème pour les pages de l'application (app.php charge app.css de la maquette, puis ce fichier).
   Tout ce qui n'est pas dans la maquette : calendrier des salles, menu téléphone, écrans branchés. */
/* Espace membre > Réserver une salle : calendrier réel (inc/salles.php, branchements.js) */
.sl-nav { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 14px; }
.sl-nav input[type=date] { font: 500 15px 'Inter', sans-serif; padding: 9px 12px; border: 1px solid #e4ded7; border-radius: 10px; background: #fff; color: #260101; }
.sl-nav .btn { padding: 9px 14px; }
.mx-plan td.passe { background: #f3f0ec; cursor: default; }
.mx-plan td small { display: block; font: 600 11px 'Inter', sans-serif; color: #fff; padding: 2px 5px; line-height: 1.1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 90px; }
.mx-plan td.occ small { color: #260101; }
.sl-choix { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; margin-top: 16px; padding: 14px 16px; border-radius: 12px; background: #f2eee9; font: 500 15px 'Inter', sans-serif; color: #260101; }
.sl-choix select { font: 600 15px 'Inter', sans-serif; padding: 6px 10px; border: 1px solid #e4ded7; border-radius: 8px; background: #fff; }
.sl-choix > span { color: #666; }
.sl-boutons { margin-left: auto; display: flex; gap: 8px; }
.sl-info { margin: 14px 0 0; padding: 12px 16px; border-radius: 10px; background: #e6f8f2; color: #1e5f61; font: 500 14.5px 'Inter', sans-serif; }
.sl-info.erreur { background: #fbe9e4; color: #a8431d; }
.mx-plan table.h24 { min-width: 1480px; }
.mx-plan table.h24 th { font-size: 11px; padding: 4px 0; }

/* Téléphone : le menu complet derrière un bouton « Menu » (la maquette ne montrait que la barre du bas) — 1er oct. 2026 */
.menu-mobile { display: none; }
@media (max-width: 640px) {
	.top { gap: 14px 18px; }
	.menu-mobile { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; padding: 10px 16px; border: 1.5px solid #260101; border-radius: 999px; background: #fff; color: #260101; font: 600 15px 'Inter', sans-serif; cursor: pointer; }
	.menu-mobile i { font-style: normal; font-size: 18px; line-height: 1; }
	.top nav { order: 10; width: 100%; margin: 0; gap: 0; flex-wrap: wrap; }
	.top.menu-ouvert nav { flex-direction: column; align-items: stretch; gap: 0; border-top: 1px solid #e4ded7; padding-top: 10px; }
	.top.menu-ouvert nav a:not(.btn) { display: flex !important; flex-direction: row; align-items: baseline; gap: 8px; padding: 12px 4px; border-bottom: 1px solid #efeae4; font-size: 17px; }
	.top.menu-ouvert nav a.avec-sur small { font-size: 10px; }
	.top.menu-ouvert nav a.btn { margin-top: 12px; }
	.top nav a.btn { flex: 1 1 auto; justify-content: center; }
}
