body {
  padding-top: 40px; /* ปรับตามความสูงจริงของ navbar */
  font-family: 'Noto Sans Thai', sans-serif;
    }

a:link {
	text-decoration: none;
}
a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: none;
}
a:active {
	text-decoration: none;
}

.bg-gradient-primary {
  background: linear-gradient(90deg, #2196f3, #21cbf3);
}
.bg-gradient-success {
  background: linear-gradient(90deg, #4caf50, #81c784);
}
.bg-gradient-warning {
  background: linear-gradient(90deg, #ff9800, #ffc107);
}
.bg-gradient-danger {
  background: linear-gradient(90deg, #f44336, #e57373);
}
/* ไล่สีน้ำเงินเข้ม */
.bg-gradient-blue {
  background: linear-gradient(130deg, #0d47a1, #0b3c91, #08306b, #061f4a);
}

/* ไล่สีชมพู + ส้ม */
.bg-gradient-orange {
  background: linear-gradient(130deg, #f48fb1, #f06292, #ec407a, #d81b60, #ff9800, #ff7043);
}

/* ไล่สีชมพู */
.bg-gradient-pink {
  background: linear-gradient(130deg, #f48fb1, #f06292, #ec407a, #d81b60);
}

/* Navbar เงาเข้ม */
.navbar {
  min-height: 80px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.6); /* เพิ่มความเบลอและความเข้ม */
}

.navbar-brand {
  font-size: 1.25rem;
}
.card-header {
  padding: 0.75rem;       /* เพิ่มความสูง */
  font-size: 1.25rem;    /* ขยายขนาดตัวอักษร */
}
.animate-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.animate-card:hover {
  transform: translateY(-8px) scale(1.02); /* ยกขึ้น + ขยายเล็กน้อย */
  box-shadow: 0 8px 25px rgba(0,0,0,0.4);  /* เงาเข้มขึ้น */
}
ul {
  margin-left: 1rem;
  line-height: 1.8;
}

.fa-ul {
  margin-left: 2rem;
}

/* Gradient น้ำเงินเข้ม → เทา */
.bg-gradient-bluegray {
  background: linear-gradient(180deg, #183B59);
}

/* Footer */
.footer {
  font-size: 0.9rem;
}
.footer a {
  transition: color 0.3s ease;
}
.footer a:hover {
  color: #90caf9; /* ฟ้าอ่อนเวลา hover */
}
.table th, .table td {
  vertical-align: middle;
}
.card {
  border-radius: 10px;
}

.card h5 {
  border-bottom: 2px solid #eee;
  padding-bottom: 0.5rem;
}

.animate-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.animate-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 6px 20px rgba(0,0,0,0.3);
}
.modal-header {
  border-bottom: none;
}
.modal-footer {
  border-top: none;
}