:root {
  --modal-bg-color: #ffffff;
  --modal-text-color: #212529;
  --modal-border-color: rgba(0, 0, 0, 0.175);
  --modal-header-footer-bg: #f8f9fa;
  --modal-button-bg: #6c757d;
  --modal-button-border-color: #6c757d;
  --modal-button-hover-bg: #5c636a;
  --modal-button-hover-border-color: #565e64;
  --modal-button-text-color: #ffffff;
  --modal-close-filter: none;
  --modal-backdrop-bg: rgba(0, 0, 0, 0.5);
}

body.dark-mode {
  --modal-bg-color: var(--theme-secondary, #2c2c2c);
  --modal-text-color: var(--theme-text, #f8f9fa);
  --modal-border-color: var(--theme-border, #444444);
  --modal-header-footer-bg: var(--theme-primary, #232323);
  --modal-button-bg: var(--theme-border, #444444);
  --modal-button-border-color: var(--theme-border, #444444);
  --modal-button-hover-bg: #555555;
  --modal-button-hover-border-color: #555555;
  --modal-button-text-color: var(--theme-text, #f8f9fa);
  --modal-close-filter: invert(1) brightness(1.2);
  --modal-backdrop-bg: rgba(0, 0, 0, 0.8);
}

#genericModal .modal-content,
.modal-content.dark-mode {
  background-color: var(--modal-bg-color);
  color: var(--modal-text-color);
  border: 1px solid var(--modal-border-color);
}

#genericModal .modal-header,
.modal-content.dark-mode .modal-header {
  background-color: var(--modal-header-footer-bg);
  color: var(--modal-text-color);
  border-bottom: 1px solid var(--modal-border-color);
}

#genericModal .modal-header .modal-title,
.modal-content.dark-mode .modal-header .modal-title {
  color: var(--modal-text-color);
}

#genericModal .modal-body,
.modal-content.dark-mode .modal-body {
  background-color: var(--modal-bg-color);
  color: var(--modal-text-color);
}

#genericModal .modal-footer,
.modal-content.dark-mode .modal-footer {
  background-color: var(--modal-header-footer-bg);
  border-top: 1px solid var(--modal-border-color);
}

#genericModal .btn-secondary,
.modal-content.dark-mode .btn-secondary {
  background-color: var(--modal-button-bg);
  border-color: var(--modal-button-border-color);
  color: var(--modal-button-text-color);
}

#genericModal .btn-secondary:hover,
.modal-content.dark-mode .btn-secondary:hover {
  background-color: var(--modal-button-hover-bg);
  border-color: var(--modal-button-hover-border-color);
}

#genericModal .btn-close,
.modal-content.dark-mode .btn-close {
  filter: var(--modal-close-filter);
}

body.dark-mode .modal-backdrop.show {
  background-color: var(--modal-backdrop-bg);
}

.modal-backdrop.show {
  background-color: var(--modal-backdrop-bg);
}

.pdf-preview-frame {
  height: 75vh;
  min-height: 400px;
  border: none;
}