/* === System Rezerwacji – frontend (nowoczesny, jasny) === */
:root {
  --sr-accent: #ccaa66;
  --sr-ink: #0a0e1a;
  --sr-muted: #6b7280;
  --sr-brd: rgba(10, 14, 26, 0.12);
  --sr-brd-2: rgba(10, 14, 26, 0.18);
  --sr-bg: #ffffff;
  --sr-soft: #f6f7fb;
  --sr-focus: rgba(204, 170, 102, 0.28);
  --sr-radius: 16px;
  --sr-radius-sm: 12px;
  --sr-free: #e6e9f0;
  --sr-reserved: #e2574c;
}

.sr-app { font-size:17px; color:var(--sr-ink); }
.sr-app * { box-sizing: border-box; }

.sr-app .sr-card{
  border:1px solid var(--sr-brd);
  border-radius:var(--sr-radius);
  background:var(--sr-bg);
  box-shadow:0 16px 40px rgba(10,20,40,.08);
}
.sr-app .sr-card .sr-body{ padding:34px 32px; }

/* Mini podsumowanie */
.sr-app .sr-mini{
  border:1.5px solid var(--sr-brd);
  border-radius:var(--sr-radius);
  background:linear-gradient(180deg,#fff 0%, #fbfaf7 100%);
  padding:14px 16px;
  margin-bottom:18px;
}
.sr-app .sr-mini-title{ font-weight:700; margin-bottom:10px; letter-spacing:.2px; }
.sr-app .sr-mini-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(120px,1fr));
  gap:10px 12px;
}
@media (max-width:980px){ .sr-app .sr-mini-grid{ grid-template-columns:repeat(2,minmax(140px,1fr)); } }
@media (max-width:520px){ .sr-app .sr-mini-grid{ grid-template-columns:1fr; } }
.sr-app .sr-mini-item{
  display:flex; align-items:center; gap:8px;
  padding:10px 12px;
  border:1px solid rgba(10,14,26,.1);
  border-radius:12px;
  background:#fff;
}
.sr-app .sr-mini-k{ color:var(--sr-muted); font-weight:600; }
.sr-app .sr-mini-v{ font-weight:700; color:var(--sr-ink); }

/* Chipy komunikatów */
.sr-app .sr-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 35px;
  background:var(--sr-reserved);
  color:var(--sr-bg);
  border:1px solid var(--sr-brd);
  border-radius:999px;
  font-size:14px;
  margin:25px auto;
}
.sr-app .sr-chip-blocked{
  border-color:#f2a3a0;
  background:#ffecec;
  color:#8a1c14;
}

.sr-app #sr-slot-msg{ display:flex; align-items:center; justify-content:center; }

/* Kafelki wyboru (role/godziny/sale) */
.sr-app .sr-selectable{
  background:#fff;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border:1.5px solid var(--sr-accent);
  color:var(--sr-ink);
  min-height:54px;
  padding:12px 16px;
  border-radius:var(--sr-radius-sm);
  transition:border-color .18s, box-shadow .18s, background .18s, color .18s, transform .12s;
  font-weight:500;
  user-select:none;
}
.sr-app .sr-selectable:hover{
  border-color:var(--sr-brd-2);
  transform: translateY(-1px);
}
.sr-app .sr-selectable:focus,
.sr-app .sr-selectable:focus-visible{
  outline:none;
  box-shadow:0 0 0 3px var(--sr-focus);
}
.sr-app .sr-selectable:active{ background: var(--sr-focus); }

/* Ukrycie inputów radio/checkbox, ale pozostawienie ich aktywnych dla <label for="..."> */
.sr-app .sr-check,
.sr-app input.sr-check{
  position:absolute;
  opacity:0;
  width:1px;
  height:1px;
  margin:0;
  padding:0;
  pointer-events:none;
}

.sr-app input[type='radio'].sr-check:checked + .sr-selectable,
.sr-app input[type='checkbox'].sr-check:checked + .sr-selectable{
  background:linear-gradient(180deg,#fff 0%, #f8f5ee 100%);
  border-color:var(--sr-accent);
  color:#684b1c;
  box-shadow:0 0 0 3px var(--sr-focus);
}

/* Przyciski */
.sr-app .sr-primary{
  border:none;
  font-weight:700;
  background:linear-gradient(135deg,var(--sr-accent), #b99652);
  color:#fff;
  min-height:54px;
  padding:14px 22px;
  border-radius:14px;
}
.sr-app .sr-primary:hover{ filter:brightness(.95); color:#fff; }
.sr-app .sr-primary:disabled{ opacity:.55; cursor:not-allowed; filter:none; }
.sr-app .sr-ghost{
  border:1.5px solid var(--sr-brd);
  background:#fff;
  color:var(--sr-ink);
  min-height:54px;
  padding:14px 22px;
  border-radius:14px;
}
.sr-app .sr-ghost:hover{ border-color:var(--sr-brd-2); }

/* Pola formularza */
.sr-app .sr-field{ position:relative; }
.sr-app .sr-field .form-control{
  min-height:56px;
  padding:24px 16px 14px;
  border-radius:var(--sr-radius-sm);
  border:1.5px solid var(--sr-brd);
  background:#fff;
  font-size:16px;
}
.sr-app .sr-field .form-control:focus{
  border-color:var(--sr-accent);
  box-shadow:0 0 0 3px var(--sr-focus);
  outline:none;
}
.sr-app .sr-field .form-control::placeholder{ color:var(--sr-muted); transition:color .18s; }
.sr-app .sr-field .form-control:focus::placeholder,
.sr-app .sr-field .form-control:not(:placeholder-shown)::placeholder{ color:transparent; }
.sr-app .sr-field > label{
  position:absolute;
  left:12px;
  top:50%;
  transform:translateY(-50%);
  font-size:15px;
  color:var(--sr-muted);
  background:#fff;
  padding:0 6px;
  pointer-events:none;
  opacity:0;
  transition:top .18s, transform .18s, font-size .18s, color .18s, opacity .18s;
}
.sr-app .sr-field .form-control:focus ~ label,
.sr-app .sr-field .form-control:not(:placeholder-shown) ~ label,
.sr-app .sr-field .form-control.is-filled ~ label{
  top:-8px;
  transform:none;
  font-size:12px;
  color:var(--sr-accent);
  opacity:1;
}

/* Kalendarz mount – zostawiamy twardo, bo motywy lubią to psuć */
.sr-app #sr-date-mount{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

/* Legendy */
.sr-app .sr-legend .badge{
  border-radius:999px;
  padding:6px 10px;
  font-size:13px;
  margin:25px 0;
}
.sr-app .sr-badge-free{ background:var(--sr-free); color:#111; border:1px solid rgba(0,0,0,.08); }
.sr-app .sr-badge-sel{ background:var(--sr-accent); color:#111; }
.sr-app .sr-badge-res{ background:var(--sr-reserved); color:#fff; }

/* Siatka sali */
.sr-app #sr-seat-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(40px,1fr));
  gap:10px;
}
.sr-app .sr-seat{
  width:100%;
  min-height:44px;
  border:1px solid var(--sr-brd);
  border-radius:12px;
  background:var(--sr-free);
  color:#333;
  font-weight:600;
  font-size:14px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.sr-app .sr-seat.is-reserved{ background:var(--sr-reserved); color:#fff; }
.sr-app .sr-seat.is-selected{ background:var(--sr-accent); color:#111; box-shadow:0 0 0 3px var(--sr-focus); }

.sr-app #sr-seat-grid .sr-slot-locked{
  width:100%;
  min-height:120px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border:1px dashed rgba(0,0,0,.15);
  border-radius:12px;
  background:#fffdfa;
  color:#7a4b00;
  gap:6px;
}
.sr-app #sr-seat-grid .sr-lock-icon{ font-size:22px; line-height:1; }

/* Lista wybranych miejsc (kino) */
.sr-app .sr-seat-pills{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
}
.sr-app .sr-seat-pill{
  min-width:40px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 10px;
  border:1px solid var(--sr-brd);
  border-radius:999px;
  background:var(--sr-free);
  font-weight:700;
  color:#111;
}
.sr-app .sr-seat-pill.is-selected{
  background:var(--sr-accent);
  border-color:var(--sr-accent);
  box-shadow:0 0 0 3px var(--sr-focus);
}

/* Muted */
.sr-app .sr-muted{ color:var(--sr-muted); }
.sr-app .sr-hint{ margin-top:10px; color:var(--sr-muted); font-size:13px; }

/* HARD OVERRIDES dla Bootstrap/motywów (minimalnie) */
.sr-app.container.my-4 .sr-selectable{
  gap:10px !important;
  border:1.5px solid var(--sr-accent) !important;
  border-radius:var(--sr-radius-sm) !important;
}