.form-container {
  max-width: 95%;
  margin: 5px;
  background: #f0f8ff;
  padding: 5px;
  border-radius: 12px;
  font-family: 'Kalpurush', sans-serif;
  font-size: 20px;
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
.form-container h1 {
  text-align: center;
  color: #0d47a1;
  font-size: 20px;
  margin-bottom: 5px;
}
.subject-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin: 10px 0;
}
.subject-row label {
  font-weight: normal;
  white-space: nowrap;
}
.form-container input[type="password"] {
  width: 100%;
  padding: 12px;
  font-size: 20px;
  margin-top: 10px;
  border-radius: 6px;
  border: 1px solid #ccc;
}
.form-container button {
  margin-top: 20px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  padding: 10px 20px;
  background-color: #26a69a;
  color: white;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  font-size: 20px;
}
table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 15px;
  font-size: 20px;
}
table th, table td {
  border: 1px solid #ccc;
  padding: 8px;
  text-align: center;
}
.row-color-1 { background-color: #f9fbe7; }
.row-color-2 { background-color: #e3f2fd; }
.row-color-3 { background-color: #fce4ec; }
input[type="number"] {
  width: 70px;
  font-size: 20px;
  padding: 4px;
}
#toast {
  visibility: hidden;
  min-width: 250px;
  background-color: #333;
  color: #fff;
  text-align: center;
  border-radius: 8px;
  padding: 14px;
  position: fixed;
  z-index: 10000; /* আগে 1 ছিল */
  left: 50%;
  bottom: 30px;
  transform: translateX(-50%);
  font-size: 16px;
  pointer-events: none; /* টোস্টে ক্লিক ধরা পড়বে না */
}
#toast.show {
  visibility: visible;
  /* চাইলে এখানে ডিফল্ট অ্যানিমেশন রাখতে পারো, কিন্তু
     আমরা JS থেকে animation সেট করছি, তাই এটা না দিলেও হবে */
  /* animation: fadein 0.5s, fadeout 0.5s 3s; */
}

@keyframes fadein { from {bottom: 0; opacity: 0;} to {bottom: 30px; opacity: 1;} }
@keyframes fadeout { from {bottom: 30px; opacity: 1;} to {bottom: 0; opacity: 0;} }