/**
 * assets/css/app.css — Основные стили для EHSAN CRM
 */

/* Tailwind базовые стили уже подключены через CDN */
@tailwind base;
@tailwind components;
@tailwind utilities;

/* Кастомные стили */
@layer base {
    body {
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
        -webkit-font-smoothing: antialiased;
    }
    
    input, textarea, select, button {
        outline: none;
    }
}

@layer components {
    /* Карточки */
    .card {
        @apply bg-white rounded-2xl shadow-sm border border-gray-100 overflow-hidden;
    }
    
    .card-header {
        @apply px-5 py-4 border-b border-gray-100 font-bold text-gray-800;
    }
    
    .card-body {
        @apply p-5;
    }
    
    /* Кнопки */
    .btn {
        @apply inline-flex items-center justify-center gap-2 px-5 py-2.5 rounded-xl font-semibold transition;
    }
    
    .btn-primary {
        @apply bg-brand text-white hover:bg-brand/90;
    }
    
    .btn-secondary {
        @apply bg-gray-200 text-gray-700 hover:bg-gray-300;
    }
    
    .btn-danger {
        @apply bg-red-500 text-white hover:bg-red-600;
    }
    
    .btn-outline {
        @apply border border-brand text-brand hover:bg-brand hover:text-white;
    }
    
    /* Формы */
    .form-input {
        @apply w-full px-4 py-2.5 border border-gray-200 rounded-xl focus:border-brand focus:ring-1 focus:ring-brand transition;
    }
    
    .form-label {
        @apply block text-sm font-semibold text-gray-700 mb-1;
    }
    
    .form-error {
        @apply text-red-500 text-xs mt-1;
    }
    
    /* Таблицы */
    .table-container {
        @apply overflow-x-auto;
    }
    
    .table {
        @apply w-full text-sm;
    }
    
    .table th {
        @apply px-4 py-3 text-left text-xs font-semibold text-gray-500 uppercase bg-gray-50;
    }
    
    .table td {
        @apply px-4 py-3 border-t border-gray-100;
    }
    
    /* Прогресс-бар */
    .progress-bar {
        @apply w-full bg-gray-200 rounded-full h-2;
    }
    
    .progress-fill {
        @apply bg-brand rounded-full h-2;
    }
    
    /* Статусы */
    .status-active {
        @apply bg-green-100 text-green-700 px-2 py-0.5 rounded-full text-xs font-medium;
    }
    
    .status-pending {
        @apply bg-yellow-100 text-yellow-700 px-2 py-0.5 rounded-full text-xs font-medium;
    }
    
    .status-blocked {
        @apply bg-red-100 text-red-700 px-2 py-0.5 rounded-full text-xs font-medium;
    }
}

/* Анимации */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

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

/* Safe area для iPhone X и выше */
.safe-bottom {
    padding-bottom: env(safe-area-inset-bottom);
}

/* Адаптивность */
@media (max-width: 640px) {
    .desktop-only {
        display: none;
    }
}

@media (min-width: 641px) {
    .mobile-only {
        display: none;
    }
}