/* CinéTarif — style minimal du POC, mobile d'abord */
* { box-sizing: border-box; }
body {
  font-family: system-ui, sans-serif;
  margin: 0;
  background: #f6f4ef;
  color: #222;
}
main { max-width: 640px; margin: 0 auto; padding: 1rem; }
h1 { margin: 0.5rem 0; }
.accroche { color: #555; margin-top: 0; }
a { color: #135; }

form { display: flex; flex-direction: column; gap: 0.4rem; margin-top: 1rem; }
label { font-weight: 600; margin-top: 0.6rem; }
select, input[type="text"] {
  padding: 0.6rem; font-size: 1rem; border: 1px solid #bbb; border-radius: 8px; background: white;
}
.ligne { display: flex; gap: 0.5rem; }
.ligne select { flex: 1; }
button {
  padding: 0.6rem 1rem; font-size: 1rem; border: 1px solid #bbb;
  border-radius: 8px; background: white; cursor: pointer;
}
button.principal {
  margin-top: 1rem; background: #1a3a5c; color: white; border: none; padding: 0.9rem;
}
button.secondaire {
  align-self: flex-start; padding: 0.4rem 0.8rem; font-size: 0.9rem; background: #eef;
}
input[type="number"] { padding: 0.6rem; font-size: 1rem; border: 1px solid #bbb; border-radius: 8px; width: 4.5rem; }
.personne { display: flex; align-items: center; gap: 0.4rem; margin-bottom: 0.4rem; }
.personne .ans { color: #555; }
.personne select { flex: 1; }
.personne .retirer { border: none; background: none; color: #a33; font-size: 1.1rem; cursor: pointer; padding: 0 0.4rem; }
.case { font-weight: normal; margin-top: 0.6rem; }
.discret { color: #777; font-size: 0.85rem; margin: 0.2rem 0; }

.salle {
  background: white; border-radius: 12px; padding: 0.8rem 1rem; margin: 0.8rem 0;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}
.entete { display: flex; align-items: baseline; gap: 0.5rem; flex-wrap: wrap; }
.rang { color: #999; }
.nom { font-weight: 600; flex: 1; }
.prix strong { font-size: 1.2rem; }
.badge {
  font-size: 0.75rem; padding: 0.15rem 0.5rem; border-radius: 999px; white-space: nowrap;
}
.badge.officiel { background: #e2f2e4; color: #1d6b2a; }
.badge.contribue { background: #e2ecf8; color: #1d4e89; }
.badge.estime { background: #fdf3d7; color: #8a6d1a; }
.badge.inconnu { background: #eee; color: #666; }

.seances { list-style: none; padding: 0; margin: 0.4rem 0; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.seances li {
  border: 1px solid #ddd; border-radius: 8px; padding: 0.3rem 0.6rem;
  display: flex; gap: 0.4rem; align-items: baseline; background: #fafafa;
}
.heure { font-weight: 600; }
.pied { margin-top: 1.5rem; }

.pied-page { margin-top: 2rem; text-align: center; }
.chouchou { font-size: 0.85rem; color: #777; }
.chouchou a { color: #b8860b; text-decoration: none; font-weight: 600; }
.chouchou a:hover { text-decoration: underline; }