/* Admin Dashboard Styles */

/* Base admin layout */
.admin-content {
  @apply space-y-6;
}

.admin-header {
  @apply flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4 mb-6;
}

.admin-header-content h1 {
  @apply text-2xl font-bold text-gray-900;
}

.admin-header-content p {
  @apply text-gray-600 mt-1;
}

.admin-header-actions {
  @apply flex space-x-3;
}

.admin-title {
  @apply text-2xl font-bold text-gray-900;
}

.admin-subtitle {
  @apply text-gray-600 mt-1;
}

/* Button styles */
.btn {
  @apply inline-flex items-center px-4 py-2 border text-sm font-medium rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 transition-colors duration-200;
}

.btn-primary {
  @apply border-transparent text-white bg-indigo-600 hover:bg-indigo-700 focus:ring-indigo-500;
}

.btn-secondary {
  @apply border-gray-300 text-gray-700 bg-white hover:bg-gray-50 focus:ring-indigo-500;
}

.btn-success {
  @apply border-transparent text-white bg-green-600 hover:bg-green-700 focus:ring-green-500;
}

.btn-warning {
  @apply border-transparent text-white bg-yellow-600 hover:bg-yellow-700 focus:ring-yellow-500;
}

.btn-danger {
  @apply border-transparent text-white bg-red-600 hover:bg-red-700 focus:ring-red-500;
}

.btn-ghost {
  @apply border-transparent text-gray-600 bg-transparent hover:bg-gray-100 focus:ring-gray-500;
}

.btn-sm {
  @apply px-2 py-1 text-xs;
}

/* Analytics overview */
.analytics-overview {
  @apply mb-8;
}

/* Table container */
.admin-table-container {
  @apply bg-white rounded-lg border border-gray-200 overflow-hidden;
}

/* Admin-specific components following AgentForm design system */
.admin-card {
  @apply bg-white rounded-xl shadow-sm border border-gray-200 hover:shadow-md transition-shadow duration-200;
}

.admin-card-header {
  @apply px-6 py-4 border-b border-gray-200;
}

.admin-card-body {
  @apply px-6 py-4;
}

.admin-card-footer {
  @apply px-6 py-4 border-t border-gray-200 bg-gray-50 rounded-b-xl;
}

/* Admin buttons */
.admin-btn-primary {
  @apply inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md text-white bg-red-600 hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 transition-colors;
}

.admin-btn-secondary {
  @apply inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 transition-colors;
}

.admin-btn-danger {
  @apply inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md text-white bg-red-600 hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 transition-colors;
}

.admin-btn-success {
  @apply inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md text-white bg-green-600 hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 transition-colors;
}

/* Admin tables */
.admin-table {
  @apply min-w-full divide-y divide-gray-200;
}

.admin-table thead {
  @apply bg-gray-50;
}

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

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

.admin-table tbody tr {
  @apply hover:bg-gray-50 transition-colors;
}

/* Admin forms */
.admin-form-group {
  @apply mb-6;
}

.admin-form-label {
  @apply block text-sm font-medium text-gray-700 mb-2;
}

.admin-form-input {
  @apply block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-red-500 focus:border-red-500 sm:text-sm;
}

.admin-form-select {
  @apply block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-red-500 focus:border-red-500 sm:text-sm;
}

.admin-form-textarea {
  @apply block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-red-500 focus:border-red-500 sm:text-sm;
}

.admin-form-error {
  @apply mt-1 text-sm text-red-600;
}

/* Admin metrics cards */
.admin-metric-card {
  @apply bg-white rounded-xl shadow-sm border border-gray-200 p-6;
}

.admin-metric-value {
  @apply text-3xl font-bold text-gray-900;
}

.admin-metric-label {
  @apply text-sm font-medium text-gray-500 mt-1;
}

.admin-metric-change {
  @apply text-sm font-medium mt-2;
}

.admin-metric-change.positive {
  @apply text-green-600;
}

.admin-metric-change.negative {
  @apply text-red-600;
}

.admin-metric-change.neutral {
  @apply text-gray-600;
}

/* Admin status indicators */
.admin-status-dot {
  @apply inline-block w-2 h-2 rounded-full mr-2;
}

.admin-status-dot.active {
  @apply bg-green-400;
}

.admin-status-dot.inactive {
  @apply bg-red-400;
}

.admin-status-dot.pending {
  @apply bg-yellow-400;
}

.admin-status-dot.expired {
  @apply bg-gray-400;
}

/* Admin search and filters */
.admin-search-container {
  @apply flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4 mb-6;
}

.admin-search-input {
  @apply block w-full sm:w-64 px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-red-500 focus:border-red-500 sm:text-sm;
}

.admin-filter-select {
  @apply block w-full sm:w-auto px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-red-500 focus:border-red-500 sm:text-sm;
}

/* Admin pagination */
.admin-pagination {
  @apply flex items-center justify-between border-t border-gray-200 bg-white px-4 py-3 sm:px-6;
}

.admin-pagination-info {
  @apply text-sm text-gray-700;
}

.admin-pagination-nav {
  @apply flex items-center space-x-2;
}

.admin-pagination-btn {
  @apply relative inline-flex items-center px-3 py-2 text-sm font-medium text-gray-500 bg-white border border-gray-300 rounded-md hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 transition-colors;
}

.admin-pagination-btn.active {
  @apply bg-red-50 border-red-500 text-red-600;
}

.admin-pagination-btn:disabled {
  @apply opacity-50 cursor-not-allowed;
}

/* Admin loading states */
.admin-loading {
  @apply flex items-center justify-center py-12;
}

.admin-loading-spinner {
  @apply animate-spin rounded-full h-8 w-8 border-b-2 border-red-600;
}

/* Admin empty states */
.admin-empty-state {
  @apply text-center py-12;
}

.admin-empty-state-icon {
  @apply mx-auto h-12 w-12 text-gray-400;
}

.admin-empty-state-title {
  @apply mt-4 text-lg font-medium text-gray-900;
}

.admin-empty-state-description {
  @apply mt-2 text-sm text-gray-500;
}

/* Admin modals */
.admin-modal-overlay {
  @apply fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity z-50;
}

.admin-modal-container {
  @apply fixed inset-0 z-50 overflow-y-auto;
}

.admin-modal-content {
  @apply flex min-h-full items-end justify-center p-4 text-center sm:items-center sm:p-0;
}

.admin-modal-panel {
  @apply relative transform overflow-hidden rounded-lg bg-white text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-lg;
}

.admin-modal-header {
  @apply bg-white px-4 pb-4 pt-5 sm:p-6 sm:pb-4;
}

.admin-modal-body {
  @apply bg-white px-4 pb-4 pt-5 sm:p-6;
}

.admin-modal-footer {
  @apply bg-gray-50 px-4 py-3 sm:flex sm:flex-row-reverse sm:px-6;
}

/* Responsive utilities for admin */
@media (max-width: 640px) {
  .admin-card {
    @apply rounded-lg;
  }
  
  .admin-table {
    @apply text-xs;
  }
  
  .admin-table th,
  .admin-table td {
    @apply px-3 py-2;
  }
}
/*
 Discount Code Specific Styles */
.code-highlight {
  @apply font-mono text-lg font-semibold text-indigo-600 bg-indigo-50 px-2 py-1 rounded;
}

.code-info {
  @apply flex flex-col space-y-1;
}

.code-name {
  @apply font-mono font-semibold text-gray-900;
}

.code-status {
  @apply flex space-x-2;
}

.discount-percentage {
  @apply font-semibold text-green-600;
}

.usage-info {
  @apply flex flex-col space-y-1;
}

.usage-count {
  @apply text-sm font-medium text-gray-900;
}

.usage-bar {
  @apply w-full bg-gray-200 rounded-full h-2;
}

.usage-progress {
  @apply bg-blue-600 h-2 rounded-full transition-all duration-300;
}

.usage-progress-container {
  @apply mt-4;
}

.usage-progress-bar {
  @apply w-full bg-gray-200 rounded-full h-3;
}

.usage-progress-fill {
  @apply bg-gradient-to-r from-blue-500 to-indigo-600 h-3 rounded-full transition-all duration-500;
}

.usage-progress-text {
  @apply text-sm text-gray-600 mt-2 text-center;
}

.status-indicator {
  @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium;
}

.status-indicator.active {
  @apply bg-green-100 text-green-800;
}

.status-indicator.inactive {
  @apply bg-gray-100 text-gray-800;
}

.badge {
  @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium;
}

.badge-warning {
  @apply bg-yellow-100 text-yellow-800;
}

.badge-danger {
  @apply bg-red-100 text-red-800;
}

.badge-secondary {
  @apply bg-gray-100 text-gray-800;
}

.badge-success {
  @apply bg-green-100 text-green-800;
}

/* Admin form styles */
.admin-form-container {
  @apply max-w-4xl mx-auto;
}

.admin-form {
  @apply space-y-8;
}

.form-section {
  @apply bg-white rounded-lg border border-gray-200 p-6;
}

.form-section-title {
  @apply text-lg font-semibold text-gray-900 mb-4;
}

.form-group {
  @apply space-y-2;
}

.form-label {
  @apply block text-sm font-medium text-gray-700;
}

.form-input {
  @apply block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm;
}

.form-input-readonly {
  @apply block w-full px-3 py-2 bg-gray-50 border border-gray-300 rounded-md text-gray-900 font-mono;
}

.form-select {
  @apply block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm;
}

.form-checkbox {
  @apply h-4 w-4 text-indigo-600 focus:ring-indigo-500 border-gray-300 rounded;
}

.checkbox-label {
  @apply ml-2 text-sm text-gray-900;
}

.checkbox-group {
  @apply flex items-center;
}

.form-help {
  @apply text-sm text-gray-500;
}

.input-group {
  @apply flex;
}

.input-group-text {
  @apply inline-flex items-center px-3 py-2 border border-l-0 border-gray-300 bg-gray-50 text-gray-500 text-sm rounded-r-md;
}

.input-group .form-input {
  @apply rounded-r-none border-r-0;
}

.form-actions {
  @apply flex justify-end space-x-3 pt-6 border-t border-gray-200;
}

/* Admin grid and cards */
.admin-grid {
  @apply grid grid-cols-1 lg:grid-cols-2 gap-6 mb-8;
}

.card-title {
  @apply text-lg font-semibold text-gray-900 mb-4;
}

.detail-grid {
  @apply space-y-4;
}

.detail-item {
  @apply flex justify-between items-start;
}

.detail-label {
  @apply text-sm font-medium text-gray-500;
}

.detail-value {
  @apply text-sm text-gray-900 font-medium text-right;
}

.stats-grid {
  @apply grid grid-cols-2 gap-4 mb-4;
}

.stat-item {
  @apply text-center;
}

.stat-value {
  @apply text-2xl font-bold text-gray-900;
}

.stat-label {
  @apply text-sm text-gray-500 mt-1;
}

/* Usage table */
.usage-table-container {
  @apply overflow-x-auto;
}

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

.usage-table thead {
  @apply bg-gray-50;
}

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

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

.user-info {
  @apply flex flex-col;
}

.user-email {
  @apply font-medium text-gray-900;
}

.user-name {
  @apply text-xs text-gray-500;
}

.amount {
  @apply font-medium text-gray-900;
}

.discount-amount {
  @apply font-medium text-red-600;
}

.final-amount {
  @apply font-medium text-green-600;
}

.savings-percentage {
  @apply font-medium text-blue-600;
}

.usage-date {
  @apply text-gray-500;
}

.table-footer {
  @apply mt-4 text-center;
}

/* Action buttons */
.action-buttons {
  @apply flex space-x-2;
}

.btn-sm {
  @apply px-2 py-1 text-xs;
}

/* Filters */
.admin-filters {
  @apply bg-white rounded-lg border border-gray-200 p-4 mb-6;
}

.filter-form {
  @apply flex flex-wrap items-end gap-4;
}

.filter-group {
  @apply flex-1 min-w-0;
}

.filter-actions {
  @apply flex space-x-2;
}

/* Empty state */
.empty-state {
  @apply text-center py-12;
}

.empty-state-icon {
  @apply mx-auto h-12 w-12 text-gray-400 mb-4;
}

.empty-state-title {
  @apply text-lg font-medium text-gray-900 mb-2;
}

.empty-state-description {
  @apply text-gray-500 mb-4;
}

/* Alerts */
.alert {
  @apply rounded-md p-4 mb-4;
}

.alert-danger {
  @apply bg-red-50 border border-red-200 text-red-800;
}

.alert-warning {
  @apply bg-yellow-50 border border-yellow-200 text-yellow-800;
}

.alert-success {
  @apply bg-green-50 border border-green-200 text-green-800;
}

.alert-info {
  @apply bg-blue-50 border border-blue-200 text-blue-800;
}

/* Inactive rows */
tr.inactive {
  @apply opacity-60;
}

tr.inactive td {
  @apply text-gray-500;
}