/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* Admin UI Styles - Korean UX Patterns */

/* Admin Navigation */
.admin-nav-tab {
  @apply border-transparent py-4 px-1 text-sm font-medium text-gray-500 hover:text-gray-700 hover:border-gray-300 border-b-2 transition-colors duration-200 flex items-center;
}

.admin-nav-tab.active {
  @apply border-orange-500 text-orange-500;
}

.admin-nav-link {
  @apply text-sm font-medium transition-colors duration-200 flex items-center;
}

/* Admin Buttons */
.btn {
  @apply inline-flex items-center justify-center px-4 py-2 border border-transparent text-sm font-medium rounded-lg focus:outline-none focus:ring-2 focus:ring-offset-2 transition-all duration-200;
}

.btn-primary {
  @apply bg-orange-500 text-white hover:bg-orange-600 focus:ring-orange-500 shadow-sm;
}

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

.btn-white {
  @apply bg-white text-orange-500 border-white hover:bg-gray-50;
}

.btn-white-outline {
  @apply border-white text-white hover:bg-white hover:text-orange-500;
}

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

.admin-btn-view {
  @apply bg-blue-100 text-blue-600 hover:bg-blue-200;
}

.admin-btn-edit {
  @apply bg-green-100 text-green-600 hover:bg-green-200;
}

.admin-btn-delete {
  @apply bg-red-100 text-red-600 hover:bg-red-200;
}

/* Admin Form Elements */
.admin-label {
  @apply block text-sm font-semibold text-gray-700 mb-2;
}

.admin-label.required::after {
  content: " *";
  @apply text-red-500;
}

.admin-input {
  @apply block w-full px-4 py-3 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-orange-500 transition-colors duration-200;
}

.admin-textarea {
  @apply block w-full px-4 py-3 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-orange-500 resize-y transition-colors duration-200;
}

.admin-select {
  @apply block w-full px-4 py-3 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-orange-500 transition-colors duration-200;
}

.admin-search-input {
  @apply flex-1 px-4 py-2 border border-gray-300 rounded-l-lg focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-orange-500;
}

.admin-search-btn {
  @apply px-4 py-2 bg-orange-500 text-white border border-orange-500 rounded-r-lg hover:bg-orange-600 focus:outline-none focus:ring-2 focus:ring-orange-500;
}

/* Admin Checkbox */
.admin-checkbox-label {
  @apply flex items-center text-sm text-gray-700 cursor-pointer;
}

.admin-checkbox {
  @apply sr-only;
}

.admin-checkbox + .checkmark {
  @apply w-5 h-5 border-2 border-gray-300 rounded mr-3 flex items-center justify-center;
}

.admin-checkbox:checked + .checkmark {
  @apply bg-orange-500 border-orange-500;
}

.admin-checkbox:checked + .checkmark::after {
  content: "✓";
  @apply text-white text-xs font-bold;
}

/* Admin Table */
.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;
}

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

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

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

.status-draft {
  @apply bg-yellow-100 text-yellow-800;
}

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

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

.status-closed {
  @apply bg-red-100 text-red-800;
}

.status-scheduled {
  @apply bg-blue-100 text-blue-800;
}

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

.type-important {
  @apply bg-red-100 text-red-800;
}

.type-general {
  @apply bg-blue-100 text-blue-800;
}

.type-featured {
  @apply bg-purple-100 text-purple-800;
}

.type-press_release {
  @apply bg-green-100 text-green-800;
}

.type-industry {
  @apply bg-yellow-100 text-yellow-800;
}

/* Admin Error Messages */
.admin-error {
  @apply text-sm text-red-600 mt-2 font-medium;
}

.admin-help {
  @apply text-sm text-gray-500 mt-2 leading-relaxed;
}

/* Korean Typography */
.admin-table th,
.admin-label,
.btn {
  font-family: 'Noto Sans KR', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
}

/* Admin Form Layout Improvements */
.admin-form-section {
  @apply bg-white rounded-xl p-8 shadow-sm border border-gray-200;
}

.admin-form-row {
  @apply grid grid-cols-1 md:grid-cols-2 gap-6;
}

.admin-form-field {
  @apply space-y-2;
}

.admin-checkbox-group {
  @apply flex items-center space-x-3 p-4 bg-gray-50 rounded-lg;
}

.admin-form-actions {
  @apply bg-white rounded-xl p-8 shadow-sm border border-gray-200;
}