/* GxPSign Custom Styles */

/* Custom TailwindCSS configuration */
@tailwind base;
@tailwind components;
@tailwind utilities;

/* Custom components */
@layer components {
    .btn-primary {
        @apply bg-blue-600 text-white px-4 py-2 rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-colors;
    }
    
    .btn-secondary {
        @apply bg-gray-200 text-gray-900 px-4 py-2 rounded-md hover:bg-gray-300 focus:outline-none focus:ring-2 focus:ring-gray-500 focus:ring-offset-2 transition-colors;
    }
    
    .btn-danger {
        @apply bg-red-600 text-white px-4 py-2 rounded-md hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-offset-2 transition-colors;
    }
    
    .form-input {
        @apply block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-blue-500 focus:border-blue-500;
    }
    
    .form-label {
        @apply block text-sm font-medium text-gray-700 mb-1;
    }
    
    .form-error {
        @apply text-red-600 text-sm mt-1;
    }
    
    .card {
        @apply bg-white rounded-lg shadow p-6;
    }
    
    .status-badge {
        @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium;
    }
    
    .status-draft {
        @apply bg-gray-100 text-gray-800;
    }
    
    .status-pending {
        @apply bg-yellow-100 text-yellow-800;
    }
    
    .status-completed {
        @apply bg-green-100 text-green-800;
    }
    
    .status-cancelled {
        @apply bg-red-100 text-red-800;
    }
}

/* Signature pad styles */
.signature-pad {
    border: 2px dashed #d1d5db;
    border-radius: 0.5rem;
    background-color: #f9fafb;
    cursor: crosshair;
}

.signature-pad.active {
    border-color: #3b82f6;
    background-color: #eff6ff;
}

/* PDF viewer styles */
.pdf-viewer {
    width: 100%;
    height: 600px;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
}

/* Loading spinner */
.spinner {
    @apply animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600;
}

/* Responsive table */
.table-responsive {
    @apply overflow-x-auto;
}

.table-responsive table {
    @apply min-w-full divide-y divide-gray-200;
}

.table-responsive th {
    @apply px-6 py-3 bg-gray-50 text-left text-xs font-medium text-gray-500 uppercase tracking-wider;
}

.table-responsive td {
    @apply px-6 py-4 whitespace-nowrap text-sm text-gray-900;
}

/* GxP compliance indicator */
.gxp-compliant {
    @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800;
}

/* Audit trail styles */
.audit-log {
    @apply border-l-4 border-blue-200 pl-4 py-2;
}

.audit-log.timestamp {
    @apply text-xs text-gray-500;
}

.audit-log.action {
    @apply font-medium text-gray-900;
}

.audit-log.details {
    @apply text-sm text-gray-600;
}

/* Mobile responsive adjustments */
@media (max-width: 640px) {
    .mobile-hidden {
        @apply hidden;
    }
    
    .mobile-full {
        @apply w-full;
    }
}

/* Print styles */
@media print {
    .no-print {
        display: none !important;
    }
    
    .print-break {
        page-break-after: always;
    }
}