/* ✅ Global Background & Typography */
body {
  background: linear-gradient(135deg, rgba(15,32,39,0.8), rgba(32,58,67,0.8), rgba(44,83,100,0.8)),
              url('background.jpg') no-repeat center center fixed;
  background-size: cover;
  color: white;
  font-family: 'Segoe UI', sans-serif;
}

.navbar,
footer {
  background: #111;
  color: #ccc;
}

/* ✅ Collapse & Produk Visibility */
.collapse { display: none; }
.collapse.show { display: block; }
.produk-item.hidden { display: none; }

/* ✅ Card Component */
.card {
  background-color: #1c1f26;
  color: #fff;
  border: none;
  transition: transform 0.3s ease;
}
.card:hover {
  transform: scale(1.03);
  box-shadow: 0 0 20px #00f2ff;
}
.card img {
  max-height: 150px;
  object-fit: contain;
}

/* ✅ Form Pembayaran Styling */
.form-pembayaran,
#formPembayaran .card {
  background-color: #1c1f26;
  color: white;
  border-radius: 12px;
  box-shadow: 0 0 15px rgba(0, 255, 255, 0.2);
  padding: 20px;
  max-width: 500px;
  margin: 20px auto;
}

/* ✅ Responsif Mobile */
@media (max-width: 600px) {
  .form-pembayaran,
  #formPembayaran .card {
    width: 95%;
    padding: 15px;
  }
  .card img {
    max-height: 100px;
  }
  .card h4 {
    font-size: 1.1rem;
  }
  .card p {
    font-size: 0.9rem;
  }
  .btn {
    font-size: 0.9rem;
  }
}