/* Base Form Styles */
.rezervacija-forma {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  max-width: 500px;
  margin: 2rem auto;
  padding: 1.5rem;
  background: #f9f9f9;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.rezervacija-forma label {
  display: flex;
  flex-direction: column;
  font-weight: 600;
  color: #333;
  font-size: 1rem;
}

.rezervacija-forma input,
.rezervacija-forma select {
  padding: 0.6rem 0.8rem;
  font-size: 1rem;
  border-radius: 8px;
  border: 1.5px solid #bbb;
  margin-top: 0.35rem;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.rezervacija-forma input:focus,
.rezervacija-forma select:focus {
  outline: none;
  border-color: #007cba;
  box-shadow: 0 0 5px rgba(0,124,186,0.5);
}

.rezervacija-forma button {
  padding: 0.75rem 1.5rem;
  font-size: 1.1rem;
  border-radius: 8px;
  border: none;
  background-color: #911005;
  color: #fff;
  cursor: pointer;
  font-weight: 600;
  transition: background-color 0.25s ease, transform 0.15s ease;
  align-self: flex-start;
}

.rezervacija-forma button:hover,
.rezervacija-forma button:focus {
  background-color: #560591;
  transform: scale(1.05);
  outline: none;
}

/* Messages */
#rdb-form-message {
  font-weight: 600;
  font-size: 1rem;
  margin-top: 0.75rem;
}

.rezervacija-success {
  padding: 1rem 1.2rem;
  background-color: #e6f4ea;
  color: #237a4b;
  border: 1.5px solid #9fd6a7;
  border-radius: 10px;
  margin-bottom: 1.5rem;
  font-weight: 600;
  animation: fadeInSuccess 0.4s ease-in-out;
  box-shadow: 0 2px 6px rgba(35,122,75,0.25);
}

.rezervacija-error {
  padding: 1rem 1.2rem;
  background-color: #fbe9e9;
  color: #a94442;
  border: 1.5px solid #e09a9a;
  border-radius: 10px;
  margin-bottom: 1.5rem;
  font-weight: 600;
  box-shadow: 0 2px 6px rgba(169,68,66,0.25);
}

.rdb-error-border {
  border-color: #d9534f !important;
  box-shadow: 0 0 6px rgba(217, 83, 79, 0.6);
}

@keyframes fadeInSuccess {
  from {
    opacity: 0;
    transform: scale(0.95);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* Calendar Style */
.flatpickr-calendar {
  background-color: #fff;
  color: #333;
  border-radius: 10px;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  box-shadow: 0 5px 15px rgba(0,0,0,0.15);
  border: none;
}

.flatpickr-day {
  border-radius: 50%;
  transition: all 0.2s ease;
}

.flatpickr-day:hover {
  background-color: #e6e6e6 !important;
  color: #333 !important;
}

.flatpickr-day.today {
  border-color: #911005 !important;
  color: #911005;
  font-weight: bold;
}

.flatpickr-day.today:hover {
  background-color: #911005 !important;
  color: white !important;
}

.flatpickr-day.disabled {
  background-color: #ffeeee !important;
  color: #d9534f !important;
  border-color: #f5c6cb !important;
  text-decoration: line-through;
  cursor: not-allowed;
}

.flatpickr-day.disabled:hover {
  background-color: #f8d7da !important;
}

.flatpickr-day.selected {
  background-color: #911005 !important;
  border-color: #911005 !important;
  color: white !important;
}

.flatpickr-month {
  background-color: #911005;
  color: white;
  padding: 10px 0;
  border-radius: 10px 10px 0 0;
}

.flatpickr-current-month {
  font-size: 1.1rem;
  font-weight: 600;
}

.flatpickr-prev-month:hover svg,
.flatpickr-next-month:hover svg {
  fill: white !important;
}

.flatpickr-weekday {
  color: #911005;
  font-weight: 600;
}

.flatpickr-time input {
  font-weight: 600;
}

@media (max-width: 500px) {
  .flatpickr-calendar {
    width: 300px !important;
  }
  .flatpickr-days {
    width: 100% !important;
  }
  .dayContainer {
    min-width: 100% !important;
    width: 100% !important;
  }
}