* { box-sizing: border-box; }
body { font-family: system-ui, sans-serif; margin: 0; padding: 0; background: #f5f5f5; }
.site-header { background: #333; color: #fff; padding: 0.75rem 1.5rem; display: flex; gap: 1.5rem; flex-wrap: wrap; }
.site-header a { color: #fff; text-decoration: none; }
.site-header a:hover { text-decoration: underline; }
.page-main { max-width: 720px; margin: 0 auto; padding: 1.5rem; }
.movie-card { background: #fff; padding: 0; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); overflow: hidden; }
.movie-poster { width: 100%; line-height: 0; }
.movie-poster img { width: 100%; height: auto; display: block; }
.movie-poster picture source { display: block; }
.movie-content { padding: 1.5rem; }
.movie-card h1 { margin: 0 0 0.5rem; font-size: 1.75rem; }
.movie-tagline { color: #c00; font-weight: 600; margin: 0 0 1rem; font-size: 1.1rem; }
.movie-desc { color: #333; line-height: 1.6; font-size: 1rem; margin-bottom: 1.5rem; }
.movie-desc p { margin: 0 0 1rem; }
.movie-desc p:last-child { margin-bottom: 0; }
.btn { display: inline-block; padding: 0.5rem 1rem; border-radius: 6px; text-decoration: none; border: none; cursor: pointer; font-size: 1rem; }
.btn-primary { background: #0066cc; color: #fff; }
.btn-primary:hover:not(:disabled) { background: #0052a3; }
.btn-secondary { background: #666; color: #fff; margin-left: 0.5rem; }
.btn:disabled { opacity: 0.6; cursor: not-allowed; }
.error { color: #c00; margin: 0.5rem 0; }
.admin-hint { font-size: 0.9rem; color: #666; margin-bottom: 1rem; }
.admin-hint code { background: #eee; padding: 0.1em 0.4em; border-radius: 4px; }
.hall-hint { font-size: 0.9rem; color: #666; margin: 0 0 1rem; }

.hall-container { background: #fff; padding: 1.5rem; border-radius: 8px; margin: 1rem 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.screen { background: #1a5fb4; color: #fff; text-align: center; padding: 0.75rem; font-weight: bold; letter-spacing: 0.1em; margin-bottom: 1rem; border-radius: 4px; min-width: 600px; }
.hall-layout { display: flex; gap: 1rem; min-width: 0; }
.entrance { background: #f5cd0a; color: #000; writing-mode: vertical-rl; text-orientation: mixed; padding: 0.5rem; font-weight: bold; align-self: center; border-radius: 4px; flex-shrink: 0; }
.seats-grid { flex: 1; min-width: 600px; }
.row { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.5rem; flex-wrap: nowrap; }
.row-label { font-size: 0.85rem; color: #666; min-width: 3.5rem; flex-shrink: 0; }
.row-seats { display: flex; gap: 2px; flex-wrap: nowrap; align-items: center; flex-shrink: 0; }
.seat { width: 32px; height: 32px; border: 1px solid #ccc; border-radius: 4px; cursor: pointer; font-size: 0.7rem; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 0; background: #e8e8e8; flex-shrink: 0; }
.seat.free:hover { background: #d0d0d0; }
.seat.selected { background: #c00; color: #fff; border-color: #a00; }
.seat.taken { background: #999; color: #666; cursor: not-allowed; }

/* Диваны: пары рядом, раздельно между парами */
.sofa-row { display: flex; gap: 8px; flex-wrap: nowrap; }
.sofa-pair { display: flex; gap: 1px; border: 1px solid #bbb; border-radius: 6px; overflow: hidden; background: #ddd; }
.sofa-pair .sofa-seat { width: 36px; height: 36px; border: none; border-radius: 0; }
.sofa-pair .sofa-seat:first-child { border-right: 1px solid #bbb; }
.sofa-pair .sofa-seat.free { background: #e8e8e8; }
.sofa-pair .sofa-seat.free:hover { background: #d0d0d0; }
.sofa-pair .sofa-seat.selected { background: #c00; color: #fff; }
.sofa-pair .sofa-seat.taken { background: #999; color: #666; }

.selection-summary { background: #fff; padding: 1rem; border-radius: 8px; margin-top: 1rem; }
.selection-summary form { margin-top: 0.5rem; }
.selected-seats-list { font-size: 0.9rem; color: #444; margin: 0.5rem 0 0; min-height: 1.4em; }

.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.orders-table { width: 100%; border-collapse: collapse; background: #fff; border-radius: 8px; min-width: 280px; }
.orders-table th, .orders-table td { padding: 0.75rem; text-align: left; border-bottom: 1px solid #eee; }
.orders-table th { background: #f5f5f5; }
.total-revenue { font-size: 1.25rem; margin-bottom: 1rem; }

/* Мобильная адаптация */
@media (max-width: 768px) {
  .page-main { padding: 0.75rem; max-width: 100%; }
  .movie-content { padding: 1rem; }
  .movie-card h1 { font-size: 1.5rem; }
  .movie-desc { font-size: 0.95rem; }
  .hall-container { padding: 1rem; }
  .hall-layout { flex-direction: column; }
  .entrance { writing-mode: horizontal; padding: 0.25rem 0.5rem; margin-bottom: 0.5rem; }
  .row-label { min-width: 3rem; font-size: 0.8rem; }
  .selection-summary p { font-size: 0.95rem; }
  .btn { padding: 0.6rem 1rem; width: 100%; max-width: 280px; }
  .site-header { padding: 0.5rem 1rem; }
}
