/* Correction Interface Styles */

/* AG Grid Cell Validation Classes */
.ag-cell-valid {
  background-color: #dcfce7 !important; /* green-100 */
  color: #15803d !important; /* green-700 */
  border: 1px solid #bbf7d0 !important; /* green-200 */
}

.ag-cell-error-warning {
  background-color: #fed7aa !important; /* orange-200 */
  color: #9a3412 !important; /* orange-800 */
  border: 1px solid #fb923c !important; /* orange-400 */
  font-weight: 500 !important;
}

.ag-cell-error-critical {
  background-color: #fee2e2 !important; /* red-100 */
  color: #991b1b !important; /* red-800 */
  border: 1px solid #f87171 !important; /* red-400 */
  font-weight: 600 !important;
}

.ag-cell-saving {
  background-color: #dbeafe !important; /* blue-100 */
  color: #1e40af !important; /* blue-800 */
  border: 1px solid #60a5fa !important; /* blue-400 */
  position: relative;
}

.ag-cell-readonly {
  background-color: #f8f9fa !important; /* gray-50 */
  color: #6c757d !important; /* gray-500 */
  cursor: not-allowed !important;
  border: 1px solid #e9ecef !important; /* gray-200 */
}

.ag-cell-readonly:hover {
  background-color: #e9ecef !important; /* gray-200 */
}

/* Disable text selection cursor for read-only cells */
.ag-cell-readonly .ag-cell-value {
  user-select: none;
  pointer-events: none;
}

/* Loading spinner for saving cells */
.ag-cell-saving::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 4px;
  transform: translateY(-50%);
  width: 12px;
  height: 12px;
  border: 2px solid #60a5fa;
  border-top: 2px solid transparent;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% { transform: translateY(-50%) rotate(0deg); }
  100% { transform: translateY(-50%) rotate(360deg); }
}

/* AG Grid theme customizations */
.ag-theme-alpine {
  --ag-font-size: 14px;
  --ag-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --ag-header-height: 40px;
  --ag-row-height: 35px;
  --ag-border-color: #e5e7eb;
  --ag-header-background-color: #f9fafb;
  --ag-odd-row-background-color: #ffffff;
  --ag-even-row-background-color: #f9fafb;
}

/* Style for read-only grid container */
.ag-theme-alpine.readonly-mode {
  opacity: 0.9;
}

.ag-theme-alpine.readonly-mode .ag-header {
  background-color: #f8f9fa;
}

.ag-theme-alpine.readonly-mode .ag-header-cell {
  color: #6c757d;
}

/* Custom header styling */
.ag-theme-alpine .ag-header-cell {
  font-weight: 600;
  color: #374151;
  border-right: 1px solid #e5e7eb;
}

/* Row hover effects */
.ag-theme-alpine .ag-row:hover {
  background-color: #f3f4f6 !important;
}

/* Selected row styling */
.ag-theme-alpine .ag-row-selected {
  background-color: #eff6ff !important;
  border: 1px solid #3b82f6 !important;
}

/* Cell focus styling */
.ag-theme-alpine .ag-cell-focus {
  border: 2px solid #3b82f6 !important;
  outline: none !important;
}

/* Editable cell styling */
.ag-theme-alpine .ag-cell-inline-editing {
  background-color: #ffffff !important;
  border: 2px solid #3b82f6 !important;
  box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.1);
}

/* Error notification styling */
.correction-error-notification {
  position: fixed;
  top: 1rem;
  right: 1rem;
  background-color: #ef4444;
  color: white;
  padding: 0.75rem 1rem;
  border-radius: 0.375rem;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  z-index: 50;
  max-width: 400px;
  font-size: 0.875rem;
  line-height: 1.25rem;
}

/* Success notification styling */
.correction-success-notification {
  position: fixed;
  top: 1rem;
  right: 1rem;
  background-color: #10b981;
  color: white;
  padding: 0.75rem 1rem;
  border-radius: 0.375rem;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  z-index: 50;
  max-width: 400px;
  font-size: 0.875rem;
  line-height: 1.25rem;
}

/* Loading overlay for the entire grid */
.correction-grid-loading {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.8);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
}

.correction-grid-loading .spinner {
  width: 2rem;
  height: 2rem;
  border: 3px solid #e5e7eb;
  border-top: 3px solid #3b82f6;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .ag-theme-alpine {
    --ag-font-size: 12px;
    --ag-header-height: 35px;
    --ag-row-height: 30px;
  }
  
  .ag-theme-alpine .ag-header-cell {
    padding: 0 4px;
  }
  
  .ag-theme-alpine .ag-cell {
    padding: 0 4px;
  }
}

/* Toolbar styling */
.correction-toolbar {
  background-color: #f9fafb;
  border-bottom: 1px solid #e5e7eb;
  padding: 0.75rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
}

.correction-toolbar .status-indicators {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-size: 0.875rem;
}

.correction-toolbar .status-indicator {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.correction-toolbar .status-dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
}

.correction-toolbar .status-dot.valid {
  background-color: #10b981;
}

.correction-toolbar .status-dot.error {
  background-color: #ef4444;
}

.correction-toolbar .status-dot.total {
  background-color: #3b82f6;
}

.correction-toolbar .toolbar-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

/* Status bar styling */
.correction-status-bar {
  background-color: #f3f4f6;
  border-top: 1px solid #e5e7eb;
  padding: 0.75rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.875rem;
  color: #6b7280;
}

.correction-status-bar .status-left,
.correction-status-bar .status-right {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.correction-status-bar .status-separator {
  width: 0.25rem;
  height: 0.25rem;
  background-color: #9ca3af;
  border-radius: 50%;
}

/* Extraction selector styling */
.extraction-selector {
  position: relative;
}

.extraction-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background-color: white;
  border: 1px solid #e5e7eb;
  border-radius: 0.375rem;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  z-index: 20;
  max-height: 300px;
  overflow-y: auto;
}

.extraction-option {
  padding: 0.75rem;
  border-bottom: 1px solid #f3f4f6;
  cursor: pointer;
  transition: background-color 0.15s ease-in-out;
}

.extraction-option:hover {
  background-color: #f9fafb;
}

.extraction-option.active {
  background-color: #eff6ff;
  border-left: 3px solid #3b82f6;
}

.extraction-option:last-child {
  border-bottom: none;
}

/* Utility classes for the correction interface */
.h-screen-75 {
  height: 75vh;
}

.correction-container {
  height: calc(100vh - 200px);
  min-height: 500px;
}

/* Print styles */
@media print {
  .correction-toolbar,
  .correction-status-bar {
    display: none;
  }
  
  .ag-theme-alpine {
    --ag-font-size: 10px;
    --ag-row-height: 25px;
  }
}
