/* Custom Navbar Styling - Match Dashboard Alert Style */
.navbar-custom {
  background-color: #cfe2ff !important; /* Biru muda sesuai alert dashboard */
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  border-bottom: 1px solid #b6d4fe;
}

.navbar-custom .navbar-brand {
  color: #084298 !important; /* Biru gelap sesuai teks Selamat Datang */
  font-weight: 700;
  letter-spacing: 0.5px;
}

/* Badge profil statis warna putih (tanpa efek hover) */
.profile-badge {
  background-color: #ffffff;
}

/* Base style untuk isi Dropdown (Ganti Password & Logout) */
.dropdown-menu .dropdown-item {
  font-weight: 500;
  color: #4a5568;
  transition: all 0.3s ease;
  border-radius: 6px;
  margin: 2px 8px; /* Kasih jarak dari tepi kotak dropdown */
  width: calc(100% - 16px);
}

/* Animasi geser dan warna biru muda (Persis Sidebar) */
.dropdown-menu .dropdown-item:hover {
  background-color: #f0f7ff;
  color: #0d6efd;
  transform: translateX(4px); /* Efek dorong ke kanan */
}

/* Khusus tombol Logout (Efek Merah) */
.dropdown-menu .dropdown-item.text-danger:hover {
  background-color: #fff5f5;
  color: #dc3545 !important;
}

/* Tombol Toggler */
.navbar-custom .navbar-toggler {
  border: none;
  background-color: rgba(13, 110, 253, 0.1);
  transition: all 0.3s ease;
}

.navbar-custom .navbar-toggler:hover {
  background-color: rgba(13, 110, 253, 0.2);
}

/* Icon hamburger warna biru agar senada dengan teks */
.navbar-custom .navbar-toggler-icon {
  filter: invert(36%) sepia(85%) saturate(1828%) hue-rotate(193deg)
    brightness(101%) contrast(106%);
}

/* Offcanvas Sidebar Styling */
.offcanvas-custom .offcanvas-header {
  background-color: #cfe2ff;
  border-bottom: 1px solid #b6d4fe;
}

.offcanvas-custom .offcanvas-title {
  font-weight: 700;
  color: #084298; /* Biru gelap sesuai teks Selamat Datang */
}

/* Sidebar Menu Container - Matikan Scroll Menyamping */
.offcanvas-body {
  overflow-x: hidden !important;
}

/* Menu Items - Perbaikan Kalkulasi Lebar */
.sidebar-menu .list-group-item {
  padding: 12px 20px;
  font-weight: 500;
  color: #4a5568;
  transition: all 0.3s ease;
  border-radius: 8px;
  margin: 4px 12px;
  /* Kunci biar nggak jebol: Lebar 100% dikurang margin kiri-kanan (12px + 12px) */
  width: calc(100% - 24px);
  background-color: transparent;
}

/* Efek Hover - Kurangi jarak dorong biar nggak motong teks */
.sidebar-menu .list-group-item:hover {
  background-color: #f0f7ff;
  color: #0d6efd;
  transform: translateX(
    4px
  ); /* Kurangi dari 8px jadi 4px aja biar aman di mobile */
  box-shadow: -2px 2px 8px rgba(0, 0, 0, 0.05);
}

.sidebar-menu .list-group-item img {
  transition: transform 0.3s ease;
}

.sidebar-menu .list-group-item:hover img {
  transform: scale(1.15);
}

/* Menu Logout */
.sidebar-menu .list-group-item.text-danger:hover {
  background-color: #fff5f5;
  color: #dc3545 !important;
}

/* Custom Tooltip Styling (Tema Putih-Biru) */
.custom-tooltip {
  --bs-tooltip-bg: #ffffff;
  --bs-tooltip-color: #084298;
  --bs-tooltip-opacity: 1;
}

.custom-tooltip .tooltip-inner {
  border: 1px solid #b6d4fe;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  padding: 10px 14px;
  font-size: 0.85rem;
  font-weight: 500;
  text-align: left;
  border-radius: 8px;
}

/* Modifikasi Toggle Switch Bootstrap */
.custom-switch .form-check-input {
  cursor: pointer;
  height: 1.5rem;
  width: 3rem;
}

/* Batasi tinggi dropdown box (sekitar 4-5 baris) agar tidak memanjang */
.select2-container--default .select2-results > .select2-results__options {
  max-height: 150px !important;
  overflow-y: auto !important;
}

/* Samakan style form-select Select2 dengan input Bootstrap bawaan */
.select2-container .select2-selection--single {
  height: 38px !important;
  border: 1px solid #ced4da !important;
  border-radius: 0.375rem !important;
  padding: 4px 12px 4px 4px !important;
  display: flex !important;
  align-items: center !important;
}

/* Rapikan posisi panah dropdown agar presisi di tengah vertikal */
.select2-container--default
  .select2-selection--single
  .select2-selection__arrow {
  height: 36px !important;
  right: 6px !important;
  top: 0 !important;
}

/* Sesuaikan warna teks dan placeholder */
.select2-container--default
  .select2-selection--single
  .select2-selection__rendered {
  color: #212529 !important;
  line-height: normal !important;
  padding-left: 8px !important;
}

/* Paksa warna placeholder Select2 jadi hitam/gelap */
.select2-container--default
  .select2-selection--single
  .select2-selection__placeholder {
  color: #212529 !important;
}

/* Style saat form dropdown di-focus/diklik (Efek border biru sesuai navbar) */
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single {
  border-color: #0d6efd !important; /* Biru hover navbar */
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.15) !important;
  outline: 0 !important;
}

/* Warna hover list dropdown (Samakan dengan warna hover sidebar) */
.select2-container--default
  .select2-results__option--highlighted.select2-results__option--selectable {
  background-color: #f0f7ff !important; /* Warna biru super muda */
  color: #0d6efd !important; /* Teks biru */
}

/* FIX DROPDOWN KEPOTONG DI TABLE RESPONSIVE */
@media (min-width: 768px) {
  .table-responsive {
    overflow: visible !important;
  }
}

/* Warna biru gelap khas tema ASIK */
.bg-biru-gelap {
  background-color: #084298 !important;
  color: #ffffff !important;
}

/* CSS TABS CUSTOM (Biar seragam sama Prodi) */
.custom-tabs {
  border-bottom: 2px solid #dee2e6;
  gap: 5px;
}

.custom-tabs .nav-item {
  margin-bottom: -2px;
}

.custom-tabs .nav-link {
  color: #6c757d !important;
  background-color: transparent !important;
  border: none;
  border-bottom: 3px solid transparent !important;
  border-radius: 8px 8px 0 0 !important;
  padding: 12px 20px;
  transition: all 0.3s ease;
}

.custom-tabs .nav-link:hover {
  color: #084298 !important;
  background-color: #f8f9fa !important;
}

.custom-tabs .nav-link.active {
  color: #0d6efd !important;
  background-color: #f0f7ff !important;
  border-bottom: 3px solid #0d6efd !important;
}