/* Logo — bấm về trang chủ */
a.app-brand-home {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  text-decoration: none !important;
  color: inherit;
  border-radius: 10px;
  padding: 0.15rem 0.35rem;
  margin: -0.15rem -0.35rem;
  transition: background 0.15s ease, opacity 0.15s ease;
  cursor: pointer;
}

a.app-brand-home:hover {
  background: var(--blue-light, #e3f2fd);
  opacity: 0.95;
}

a.app-brand-home:focus-visible {
  outline: 2px solid var(--blue-mid, #1976d2);
  outline-offset: 2px;
}

/* Nút điều hướng câu hỏi — Câu trước / Câu sau */
.exam-nav-actions {
  gap: 0.75rem !important;
}

.exam-nav-actions .btn:first-child,
.exam-nav-actions .btn:last-child {
  min-width: 9.5rem;
  padding: 0.72rem 1.35rem !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 8px rgba(21, 101, 192, 0.22);
  transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;
}

.exam-nav-actions .btn:first-child {
  background: linear-gradient(180deg, #ffffff 0%, #e8f1fc 100%) !important;
  border: 2px solid var(--blue-mid, #1976d2) !important;
  color: var(--blue-dark, #0d47a1) !important;
}

.exam-nav-actions .btn:last-child {
  background: linear-gradient(180deg, #1e88e5 0%, #1565c0 100%) !important;
  border: 2px solid #0d47a1 !important;
  color: #fff !important;
}

.exam-nav-actions .btn:first-child:hover:not(:disabled),
.exam-nav-actions .btn:last-child:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(21, 101, 192, 0.32);
}

.exam-nav-actions .btn:last-child:hover:not(:disabled) {
  background: linear-gradient(180deg, #2196f3 0%, #0d47a1 100%) !important;
}

.exam-nav-actions .btn:first-child:disabled,
.exam-nav-actions .btn:last-child:disabled {
  opacity: 0.45;
  box-shadow: none;
  transform: none;
}

@media (max-width: 640px) {
  .exam-nav-actions {
    gap: 0.4rem !important;
  }

  .exam-nav-actions .btn:first-child,
  .exam-nav-actions .btn:last-child {
    flex: 1 1 calc(50% - 0.2rem) !important;
    min-width: 0 !important;
    min-height: 44px !important;
    padding: 0.55rem 0.65rem !important;
    font-size: 0.86rem !important;
    box-shadow: none !important;
  }

  .exam-nav-actions .exam-mark-btn {
    flex: 1 1 100%;
    min-height: 42px !important;
  }
}