🚀 Korea Tourism Agency - Complete implementation

✨ Features:
- Modern tourism website with responsive design
- AdminJS admin panel with image editor integration
- PostgreSQL database with comprehensive schema
- Docker containerization
- Image upload and gallery management

🛠 Tech Stack:
- Backend: Node.js + Express.js
- Database: PostgreSQL 13+
- Frontend: HTML/CSS/JS with responsive design
- Admin: AdminJS with custom components
- Deployment: Docker + Docker Compose
- Image Processing: Sharp with optimization

📱 Admin Features:
- Routes/Tours management (city, mountain, fishing)
- Guides profiles with specializations
- Articles and blog system
- Image editor with upload/gallery/URL options
- User management and authentication
- Responsive admin interface

🎨 Design:
- Korean tourism focused branding
- Mobile-first responsive design
- Custom CSS with modern aesthetics
- Image optimization and gallery
- SEO-friendly structure

🔒 Security:
- Helmet.js security headers
- bcrypt password hashing
- Input validation and sanitization
- CORS protection
- Environment variables

public/css/admin-custom.css

@@ -32,6 +32,35 @@
   margin: 0.125rem;
 }
 
+/* Image Editor Button Styles */
+.image-editor-btn {
+  background: #007bff !important;
+  color: white !important;
+  border: none !important;
+  border-radius: 4px !important;
+  padding: 6px 12px !important;
+  font-size: 13px !important;
+  cursor: pointer !important;
+  white-space: nowrap !important;
+  transition: background 0.2s ease !important;
+}
+
+.image-editor-btn:hover {
+  background: #0056b3 !important;
+  color: white !important;
+}
+
+/* Image Preview Styles */
+.image-preview {
+  max-width: 180px !important;
+  max-height: 120px !important;
+  object-fit: cover !important;
+  border: 1px solid #ddd !important;
+  border-radius: 4px !important;
+  margin-top: 8px !important;
+  margin-bottom: 8px !important;
+}
+
 /* Cards Enhancement */
 .card {
   box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
@@ -215,4 +244,61 @@
   0% { transform: scale(1); }
   50% { transform: scale(1.05); }
   100% { transform: scale(1); }
+}
+
+/* Стили для редактора изображений в AdminJS */
+.image-editor-btn {
+  transition: all 0.2s ease;
+  font-size: 13px !important;
+  padding: 6px 12px !important;
+}
+
+.image-editor-btn:hover {
+  background: #0056b3 !important;
+  transform: translateY(-1px);
+  box-shadow: 0 2px 4px rgba(0,0,0,0.2);
+}
+
+/* Стили для превью изображений */
+.image-preview {
+  border: 2px solid #e9ecef !important;
+  transition: border-color 0.2s ease;
+  margin-top: 8px !important;
+}
+
+.image-preview:hover {
+  border-color: #007bff;
+}
+
+/* Улучшенные стили для полей изображений */
+input[name*="image_url"]:focus, 
+input[name*="photo"]:focus, 
+input[name*="avatar"]:focus {
+  border-left: 3px solid #007bff;
+  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
+}
+
+/* Анимация для успешного выбора изображения */
+@keyframes imageSelected {
+  0% { transform: scale(1); }
+  50% { transform: scale(1.05); }
+  100% { transform: scale(1); }
+}
+
+.image-selected {
+  animation: imageSelected 0.3s ease;
+}
+
+/* Responsive стили для редактора */
+@media (max-width: 768px) {
+  .image-editor-btn {
+    margin-left: 0 !important;
+    margin-top: 10px !important;
+    display: block !important;
+    width: 100% !important;
+  }
+  
+  .image-preview {
+    max-width: 100% !important;
+  }
 }