/* ── Padel Booking — Public Styles ── */
:root {
  --pb-primary: #1a6b3a;
  --pb-secondary: #27ae60;
  --pb-accent: #f39c12;
  --pb-danger: #e74c3c;
  --pb-light: #f8fffe;
  --pb-border: #d4e6db;
  --pb-radius: 12px;
  --pb-shadow: 0 4px 20px rgba(0,0,0,.1);
}

.pb-wrap { max-width: 860px; margin: 0 auto; font-family: inherit; }
.pb-step { animation: pbFadeIn .3s ease; }
@keyframes pbFadeIn { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:none} }
.pb-title { color: var(--pb-primary); font-size: 1.6rem; margin-bottom: 20px; }

/* Courts grid */
.pb-courts-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(200px,1fr)); gap: 16px; margin-bottom: 24px; }
.pb-court-card {
  border: 2px solid var(--pb-border); border-radius: var(--pb-radius);
  padding: 20px; text-align: center; cursor: pointer;
  background: #fff; transition: all .25s;
}
.pb-court-card:hover, .pb-court-card.selected {
  border-color: var(--pb-secondary); background: var(--pb-light);
  transform: translateY(-3px); box-shadow: var(--pb-shadow);
}
.pb-court-card.selected { border-color: var(--pb-primary); }
.pb-court-icon { font-size: 2.5rem; margin-bottom: 8px; }
.pb-court-card h3 { margin: 0 0 6px; color: var(--pb-primary); font-size: 1.1rem; }
.pb-court-card p  { font-size: .85rem; color: #666; margin: 0 0 10px; }
.pb-court-price { background: var(--pb-primary); color: #fff; padding: 4px 12px; border-radius: 20px; font-size: .9rem; font-weight: 600; }

/* Date picker */
.pb-date-picker { background: var(--pb-light); border: 1px solid var(--pb-border); border-radius: var(--pb-radius); padding: 20px; }
.pb-date-picker label { display: block; margin-bottom: 8px; font-weight: 600; color: var(--pb-primary); }
.pb-date-picker input[type=date] { padding: 10px 14px; border: 1px solid var(--pb-border); border-radius: 8px; font-size: 1rem; margin-right: 10px; }

/* Buttons */
.pb-btn {
  background: var(--pb-primary); color: #fff; border: none; border-radius: 8px;
  padding: 11px 24px; font-size: 1rem; font-weight: 600; cursor: pointer; transition: background .2s;
}
.pb-btn:hover { background: var(--pb-secondary); }
.pb-btn--success { background: #27ae60; width: 100%; padding: 14px; font-size: 1.1rem; margin-top: 10px; }
.pb-btn--success:hover { background: #219a52; }
.pb-back { background: none; border: 1px solid var(--pb-border); color: #555; border-radius: 8px; padding: 8px 16px; cursor: pointer; margin-bottom: 16px; font-size: .9rem; }
.pb-back:hover { background: var(--pb-border); }

/* Slots */
.pb-slots-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(100px,1fr)); gap: 10px; margin-top: 16px; }
.pb-slot {
  border: 2px solid var(--pb-border); border-radius: 8px; padding: 12px 6px;
  text-align: center; cursor: pointer; font-weight: 600; background: #fff; transition: all .2s;
}
.pb-slot:hover:not(.pb-slot--booked) { border-color: var(--pb-secondary); background: var(--pb-light); }
.pb-slot.selected { border-color: var(--pb-primary); background: var(--pb-primary); color: #fff; }
.pb-slot--booked { background: #f5f5f5; color: #bbb; cursor: not-allowed; text-decoration: line-through; }
.pb-slot-time { font-size: .95rem; }
.pb-slot-end  { font-size: .75rem; opacity: .75; }

/* Summary */
.pb-summary-box { background: var(--pb-light); border-left: 4px solid var(--pb-primary); border-radius: 8px; padding: 14px 18px; margin-bottom: 20px; font-size: .95rem; }

/* Form */
.pb-form-row { margin-bottom: 16px; }
.pb-form-row label { display: block; font-weight: 600; margin-bottom: 6px; color: #333; }
.pb-form-row input, .pb-form-row textarea {
  width: 100%; padding: 10px 14px; border: 1px solid var(--pb-border);
  border-radius: 8px; font-size: 1rem; box-sizing: border-box;
}
.pb-form-row input:focus, .pb-form-row textarea:focus { outline: none; border-color: var(--pb-primary); }

/* Success */
.pb-success { text-align: center; padding: 40px 20px; }
.pb-success-icon { font-size: 4rem; margin-bottom: 16px; }
.pb-success h2 { color: var(--pb-primary); font-size: 1.8rem; }
.pb-success p  { font-size: 1.05rem; color: #555; margin-bottom: 24px; }

/* Misc */
.pb-loading { text-align: center; padding: 30px; color: #666; }
.pb-error   { background: #fdecea; border: 1px solid #f5c6cb; color: #c62828; border-radius: 8px; padding: 12px 16px; margin: 10px 0; }

/* Legend */
.pb-legend { display: flex; gap: 16px; margin-bottom: 12px; font-size: .85rem; flex-wrap: wrap; }
.pb-legend-item { display: flex; align-items: center; gap: 6px; }
.pb-legend-dot { width: 14px; height: 14px; border-radius: 3px; }
.pb-legend-dot--free   { background: #fff; border: 2px solid var(--pb-border); }
.pb-legend-dot--booked { background: #f5f5f5; border: 2px solid #ddd; }
.pb-legend-dot--sel    { background: var(--pb-primary); }
