/**
 * app/frontend_template/static/css/style.css
 * CSS tùy biến giao diện Frontend toàn hệ thống.
 * Lập trình viên có thể viết thêm các style mở rộng tại đây.
 */

@import "card.css";

:root {
  --transition-speed: 0.25s;
}

/* Hiệu ứng hover cho card sản phẩm & bài viết */
.hover-card-rise {
  transition: transform var(--transition-speed) ease, box-shadow var(--transition-speed) ease;
}

.hover-card-rise:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px -10px rgba(0, 0, 0, 0.15);
}

/* Hỗ trợ hiển thị text clamp */
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Custom scrollbar thanh lịch */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: #f1f5f9;
}
::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 9999px;
}
::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}