/* Tennis Reservation - Custom Styles */

/* Flash messages */
.flash {
  padding: 0.75rem 1rem;
  margin-bottom: 1rem;
  border-radius: 4px;
  font-size: 0.9rem;
}

.flash.error {
  background-color: rgba(220, 38, 38, 0.15);
  color: #fca5a5;
  border: 1px solid rgba(220, 38, 38, 0.3);
}

.flash.success {
  background-color: rgba(34, 197, 94, 0.15);
  color: #86efac;
  border: 1px solid rgba(34, 197, 94, 0.3);
}

.flash.warning {
  background-color: rgba(234, 179, 8, 0.15);
  color: #fde68a;
  border: 1px solid rgba(234, 179, 8, 0.3);
}

/* Login page centering */
.login-card {
  max-width: 400px;
  margin: 2rem auto;
}

/* Dashboard section spacing */
#token-section,
#results-section {
  margin-bottom: 1.5rem;
}

/* Day section cards */
.day-section {
  margin-bottom: 1rem;
}
.day-section header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.day-section header small {
  color: var(--pico-muted-color, #999);
}

/* Compact table buttons */
table button {
  font-size: 0.85rem;
}

/* Sortable preference list */
.sortable { list-style: none; padding: 0; }
.sortable li {
  cursor: grab;
  padding: 0.5rem 0.75rem;
  margin-bottom: 0.5rem;
  background: var(--pico-card-background-color, #1a1a2e);
  border: 1px solid var(--pico-muted-border-color, #333);
  border-radius: 6px;
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.sortable li:active { cursor: grabbing; }
.sortable-ghost { opacity: 0.4; background: var(--pico-primary-focus, #1a3a2a); }
.priority-badge {
  display: inline-block;
  width: 24px; height: 24px;
  border-radius: 50%;
  background: var(--pico-primary-color, #4ade80);
  color: #000;
  text-align: center;
  line-height: 24px;
  font-weight: 700;
  font-size: 0.8rem;
  flex-shrink: 0;
}
.pref-detail { flex: 1; }

/* Token expiry countdown */
.token-expiry { font-weight: bold; font-size: 1.1rem; padding: 2px 8px; border-radius: 4px; }
.token-expiry.green { color: #4ade80; }
.token-expiry.yellow { color: #facc15; }
.token-expiry.red { color: #f87171; font-weight: bold; }
.token-expiry.expired { color: #666; text-decoration: line-through; }

/* Result cards */
.result-card { padding: 0.75rem 1rem; margin-bottom: 0.75rem; border-left: 4px solid; border-radius: 4px; }
.result-card.success { border-color: #4ade80; background: rgba(34, 197, 94, 0.1); }
.result-card.failure { border-color: #f87171; background: rgba(239, 68, 68, 0.1); }
.result-card h4 { margin-bottom: 0.25rem; }

/* History table status colors */
.status-success { color: #4ade80; font-weight: 600; }
.status-failure { color: #f87171; font-weight: 600; }

/* Muted text */
.text-muted { color: var(--pico-muted-color, #999); }