/*!
 * Health-Prep v2 Custom Styles
 * HIPAA-compliant healthcare preparation system
 * Bootstrap 5 Dark Theme with Medical UI Components
 */

/* ===== ROOT VARIABLES ===== */
:root {
  /* Healthcare Color Palette */
  --hp-primary: #0d6efd;
  --hp-secondary: #6c757d;
  --hp-success: #198754;
  --hp-danger: #dc3545;
  --hp-warning: #ffc107;
  --hp-info: #0dcaf0;
  --hp-light: #f8f9fa;
  --hp-dark: #212529;
  
  /* Medical Status Colors */
  --hp-complete: #20c997;
  --hp-due-soon: #fd7e14;
  --hp-due: #e74c3c;
  --hp-overdue: #ad2121;
  
  /* Confidence Colors for OCR */
  --hp-confidence-high: #28a745;
  --hp-confidence-medium: #ffc107;
  --hp-confidence-low: #dc3545;
  
  /* Dark Theme Medical Colors */
  --hp-bg-primary: #1a1d23;
  --hp-bg-secondary: #2c3e50;
  --hp-bg-card: #34495e;
  --hp-text-primary: #ecf0f1;
  --hp-text-secondary: #bdc3c7;
  --hp-text-muted: #95a5a6;
  
  /* Borders and Shadows */
  --hp-border-color: #454d55;
  --hp-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.3);
  --hp-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.4);
  --hp-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.5);
  
  /* Medical Typography */
  --hp-font-family-medical: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  --hp-font-size-medical: 0.9rem;
  --hp-line-height-medical: 1.5;
}

/* ===== GLOBAL OVERRIDES ===== */
body {
  background-color: var(--hp-bg-primary);
  color: var(--hp-text-primary);
  font-family: var(--hp-font-family-medical);
  line-height: var(--hp-line-height-medical);
}

.container, .container-fluid {
  max-width: 1400px;
}

/* ===== NAVIGATION ===== */
.navbar {
  background-color: var(--hp-bg-secondary) !important;
  border-bottom: 2px solid var(--hp-primary);
  box-shadow: var(--hp-shadow);
}

.navbar-brand {
  font-weight: 600;
  color: var(--hp-text-primary) !important;
}

.navbar-nav .nav-link {
  color: var(--hp-text-secondary) !important;
  font-weight: 500;
  transition: color 0.3s ease;
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active {
  color: var(--hp-primary) !important;
}

/* Universal Navigation Controls */
.universal-nav-controls {
  display: flex;
  gap: 0.5rem;
  margin-right: 1rem;
}

.universal-nav-controls .btn {
  padding: 0.375rem 0.75rem;
  border-radius: 0.375rem;
}

/* ===== CARDS & CONTAINERS ===== */
.card {
  background-color: var(--hp-bg-card);
  border: 1px solid var(--hp-border-color);
  box-shadow: var(--hp-shadow-sm);
  border-radius: 0.5rem;
}

.card-header {
  background-color: var(--hp-bg-secondary);
  border-bottom: 1px solid var(--hp-border-color);
  font-weight: 600;
  color: var(--hp-text-primary);
}

.card-body {
  color: var(--hp-text-primary);
}

/* Medical Data Cards */
.medical-card {
  border-left: 4px solid var(--hp-primary);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.medical-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--hp-shadow);
}

.medical-card-labs {
  border-left-color: var(--hp-info);
}

.medical-card-imaging {
  border-left-color: var(--hp-warning);
}

.medical-card-consults {
  border-left-color: var(--hp-success);
}

.medical-card-hospital {
  border-left-color: var(--hp-danger);
}

/* ===== SCREENING STATUS BADGES ===== */
.screening-status-complete {
  background-color: var(--hp-complete) !important;
  color: white;
  border: none;
}

.screening-status-due-soon {
  background-color: var(--hp-due-soon) !important;
  color: white;
  border: none;
}

.screening-status-due {
  background-color: var(--hp-due) !important;
  color: white;
  border: none;
}

.screening-status-overdue {
  background-color: var(--hp-overdue) !important;
  color: white;
  border: none;
}

/* ===== CONFIDENCE INDICATORS ===== */
.confidence-high {
  color: var(--hp-confidence-high) !important;
  background-color: rgba(40, 167, 69, 0.1) !important;
  border: 1px solid var(--hp-confidence-high) !important;
}

.confidence-medium {
  color: var(--hp-confidence-medium) !important;
  background-color: rgba(255, 193, 7, 0.1) !important;
  border: 1px solid var(--hp-confidence-medium) !important;
}

.confidence-low {
  color: var(--hp-confidence-low) !important;
  background-color: rgba(220, 53, 69, 0.1) !important;
  border: 1px solid var(--hp-confidence-low) !important;
}

.confidence-legend {
  font-size: 0.85em;
  margin-bottom: 10px;
  padding: 0.5rem;
  background-color: var(--hp-bg-secondary);
  border-radius: 0.375rem;
}

.confidence-legend .badge {
  margin-right: 8px;
  padding: 0.375rem 0.75rem;
}

/* Document Links with Confidence Colors */
.document-link {
  text-decoration: none;
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
  display: inline-block;
  margin: 0.125rem;
  transition: all 0.2s ease;
}

.document-link:hover {
  opacity: 0.8;
  transform: scale(1.02);
}

/* ===== TABLES ===== */
.table {
  color: var(--hp-text-primary);
  background-color: transparent;
}

.table th {
  background-color: var(--hp-bg-secondary);
  border-color: var(--hp-border-color);
  color: var(--hp-text-primary);
  font-weight: 600;
  font-size: var(--hp-font-size-medical);
}

.table td {
  border-color: var(--hp-border-color);
  vertical-align: middle;
}

.table-hover tbody tr:hover {
  background-color: rgba(13, 110, 253, 0.1);
  color: var(--hp-text-primary);
}

/* Screening Table Specific */
.screening-table {
  margin-bottom: 0;
}

.screening-table .patient-name {
  font-weight: 600;
  color: var(--hp-primary);
}

.screening-table .screening-name {
  font-weight: 500;
}

.screening-table .last-completed {
  font-family: 'Courier New', monospace;
  font-size: 0.9em;
}

/* ===== FORMS ===== */
.form-control,
.form-select {
  background-color: var(--hp-bg-card);
  border: 1px solid var(--hp-border-color);
  color: var(--hp-text-primary);
}

.form-control:focus,
.form-select:focus {
  background-color: var(--hp-bg-card);
  border-color: var(--hp-primary);
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
  color: var(--hp-text-primary);
}

.form-label {
  color: var(--hp-text-primary);
  font-weight: 500;
}

.form-text {
  color: var(--hp-text-muted);
}

/* Medical Form Sections */
.form-section {
  background-color: var(--hp-bg-card);
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin-bottom: 1.5rem;
  border: 1px solid var(--hp-border-color);
}

.form-section-title {
  color: var(--hp-primary);
  font-weight: 600;
  margin-bottom: 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid var(--hp-primary);
}

/* ===== BUTTONS ===== */
.btn-primary {
  background-color: var(--hp-primary);
  border-color: var(--hp-primary);
}

.btn-primary:hover {
  background-color: #0b5ed7;
  border-color: #0a58ca;
}

.btn-medical {
  background-color: var(--hp-primary);
  border-color: var(--hp-primary);
  color: white;
  font-weight: 500;
  padding: 0.5rem 1rem;
  border-radius: 0.375rem;
  transition: all 0.2s ease;
}

.btn-medical:hover {
  background-color: #0b5ed7;
  border-color: #0a58ca;
  color: white;
  transform: translateY(-1px);
  box-shadow: var(--hp-shadow-sm);
}

.btn-medical:focus {
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.5);
}

/* Action Button Groups */
.btn-group-medical {
  gap: 0.5rem;
}

.btn-group-medical .btn {
  border-radius: 0.375rem !important;
}

/* ===== ALERTS ===== */
.alert {
  border-radius: 0.5rem;
  border-width: 1px;
  border-style: solid;
}

.alert-info {
  background-color: rgba(13, 202, 240, 0.1);
  border-color: var(--hp-info);
  color: var(--hp-info);
}

.alert-success {
  background-color: rgba(25, 135, 84, 0.1);
  border-color: var(--hp-success);
  color: var(--hp-success);
}

.alert-warning {
  background-color: rgba(255, 193, 7, 0.1);
  border-color: var(--hp-warning);
  color: var(--hp-warning);
}

.alert-danger {
  background-color: rgba(220, 53, 69, 0.1);
  border-color: var(--hp-danger);
  color: var(--hp-danger);
}

/* Medical Alerts */
.alert-medical {
  border-left: 4px solid var(--hp-primary);
  background-color: rgba(13, 110, 253, 0.1);
  color: var(--hp-text-primary);
}

/* ===== MODALS ===== */
.modal-content {
  background-color: var(--hp-bg-card);
  border: 1px solid var(--hp-border-color);
  color: var(--hp-text-primary);
}

.modal-header {
  background-color: var(--hp-bg-secondary);
  border-bottom: 1px solid var(--hp-border-color);
}

.modal-title {
  color: var(--hp-text-primary);
  font-weight: 600;
}

.modal-footer {
  border-top: 1px solid var(--hp-border-color);
}

.btn-close {
  filter: invert(1) grayscale(100%) brightness(200%);
}

/* ===== TABS ===== */
.nav-tabs {
  border-bottom: 2px solid var(--hp-border-color);
}

.nav-tabs .nav-link {
  color: var(--hp-text-secondary);
  border: none;
  background-color: transparent;
  font-weight: 500;
  padding: 0.75rem 1.25rem;
  border-radius: 0.5rem 0.5rem 0 0;
  margin-bottom: -2px;
}

.nav-tabs .nav-link:hover {
  color: var(--hp-primary);
  background-color: rgba(13, 110, 253, 0.1);
}

.nav-tabs .nav-link.active {
  color: var(--hp-primary);
  background-color: var(--hp-bg-card);
  border-bottom: 2px solid var(--hp-primary);
}

.tab-content {
  background-color: var(--hp-bg-card);
  border-radius: 0 0.5rem 0.5rem 0.5rem;
  padding: 1.5rem;
  border: 1px solid var(--hp-border-color);
  border-top: none;
}

/* ===== PROGRESS BARS ===== */
.progress {
  background-color: var(--hp-bg-secondary);
  border-radius: 0.5rem;
  height: 1rem;
}

.progress-bar {
  background-color: var(--hp-primary);
  border-radius: 0.5rem;
}

/* Medical Progress Indicators */
.compliance-progress {
  height: 0.75rem;
}

.compliance-progress .progress-bar {
  transition: width 0.6s ease;
}

/* ===== STATISTICS CARDS ===== */
.stat-card {
  background: linear-gradient(135deg, var(--hp-bg-card) 0%, var(--hp-bg-secondary) 100%);
  border: 1px solid var(--hp-border-color);
  border-radius: 0.75rem;
  padding: 1.5rem;
  text-align: center;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.stat-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--hp-shadow);
}

.stat-card-value {
  font-size: 2.5rem;
  font-weight: 700;
  color: var(--hp-primary);
  line-height: 1;
  margin-bottom: 0.5rem;
}

.stat-card-label {
  font-size: 0.9rem;
  color: var(--hp-text-secondary);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.stat-card-icon {
  font-size: 2rem;
  color: var(--hp-primary);
  margin-bottom: 1rem;
}

/* ===== UTILITY CLASSES ===== */
.text-medical {
  color: var(--hp-primary) !important;
}

.bg-medical {
  background-color: var(--hp-primary) !important;
}

.border-medical {
  border-color: var(--hp-primary) !important;
}

.text-muted-light {
  color: var(--hp-text-muted) !important;
}

.font-medical {
  font-family: var(--hp-font-family-medical);
  font-size: var(--hp-font-size-medical);
}

.shadow-medical {
  box-shadow: var(--hp-shadow) !important;
}

/* Medical Content Spacing */
.medical-section {
  margin-bottom: 2rem;
}

.medical-subsection {
  margin-bottom: 1.5rem;
}

.medical-item {
  margin-bottom: 1rem;
}

/* ===== RESPONSIVE DESIGN ===== */
@media (max-width: 768px) {
  .container {
    padding-left: 1rem;
    padding-right: 1rem;
  }
  
  .card {
    margin-bottom: 1rem;
  }
  
  .stat-card {
    margin-bottom: 1rem;
  }
  
  .stat-card-value {
    font-size: 2rem;
  }
  
  .table-responsive {
    font-size: 0.875rem;
  }
  
  .btn-group-medical {
    flex-direction: column;
    width: 100%;
  }
  
  .btn-group-medical .btn {
    margin-bottom: 0.5rem;
  }
}

@media (max-width: 576px) {
  .universal-nav-controls {
    margin-right: 0.5rem;
  }
  
  .navbar-nav {
    margin-top: 0.5rem;
  }
  
  .form-section {
    padding: 1rem;
  }
  
  .tab-content {
    padding: 1rem;
  }
}

/* ===== PRINT STYLES ===== */
@media print {
  body {
    background-color: white !important;
    color: black !important;
  }
  
  .card {
    border: 1px solid #dee2e6 !important;
    box-shadow: none !important;
  }
  
  .navbar,
  .btn,
  .modal {
    display: none !important;
  }
  
  .confidence-high,
  .confidence-medium,
  .confidence-low {
    color: black !important;
    background-color: transparent !important;
    border: 1px solid #dee2e6 !important;
  }
}

/* ===== ANIMATIONS ===== */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

.fade-in {
  animation: fadeIn 0.3s ease-out;
}

@keyframes slideIn {
  from { transform: translateX(-100%); }
  to { transform: translateX(0); }
}

.slide-in {
  animation: slideIn 0.3s ease-out;
}

/* ===== ACCESSIBILITY ===== */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Focus indicators for keyboard navigation */
.btn:focus,
.form-control:focus,
.form-select:focus {
  outline: 2px solid var(--hp-primary);
  outline-offset: 2px;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
  :root {
    --hp-bg-primary: #000000;
    --hp-bg-secondary: #1a1a1a;
    --hp-bg-card: #2a2a2a;
    --hp-text-primary: #ffffff;
    --hp-border-color: #666666;
  }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}