/* Booking status/history page styles */
:root {
  --peminjaman-gold: #ffc400;
  --peminjaman-gold-dark: #ffb000;
  --peminjaman-navy: #162033;
}

.gambar.awal {
  min-height: 40vh;
  display: grid;
  align-items: end;
  background:
    linear-gradient(rgba(54, 54, 54, 0.54), rgba(98, 98, 98, 0.54)),
    url("../../img/patri_yp2.webp") center/cover no-repeat;
  color: #ffffff;
  filter: drop-shadow(0 22px 44px rgba(0, 29, 74, 0.14));
}

.gambar.awal .hero-header {
  min-height: 30vh;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  padding: 80px 7%;
  text-align: left;
}

.gambar.awal .hero-header h1 {
  font-size: clamp(2rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #fff;
  margin-bottom: 15px;
  padding-bottom: 15px;
  border-bottom: 3px solid #ffc400;
}

.gambar.awal .hero-header p {
  font-size: 1.1rem;
  color: rgba(255, 255, 255, 0.9);
  margin: 0;
  max-width: 600px;
  line-height: 1.6;
}

.booking-history-card {
  transition: all 0.3s ease;
  border: none;
  border-radius: 14px;
  overflow: hidden;
}

.booking-history-card:hover {
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.booking-details p {
  font-size: 14px;
  color: #495057;
}

.booking-details i {
  color: #6c757d;
  width: 20px;
}

.booking-id,
.booking-date {
  line-height: 1.4;
}

@media (max-width: 576px) {
  .booking-history-card .card-body {
    padding: 1rem;
  }
}