/* --- File: catalog/view/stylesheet/enterprise-header.css --- */

:root {
    --transition-smooth: all 0.25s ease-in-out;
}

.corporate-topbar { 
    font-size: 0.825rem; 
    letter-spacing: 0.3px;
}

.card-custom { 
    transition: var(--transition-smooth); 
}

.card-custom:hover { 
    transform: translateY(-3px); 
    box-shadow: 0 10px 20px rgba(0,0,0,0.08); 
}

#theme-icon, #layout-icon { 
    transition: transform 0.4s ease; 
}

#btn-theme-toggle:hover #theme-icon,
#btn-layout-toggle:hover #layout-icon {
    transform: scale(1.1);
}

.enterprise-header {
    backdrop-filter: blur(10px);
    background-color: rgba(var(--bs-body-bg-rgb), 0.95) !important;
}

/* Thu gọn ô textbox và nút tìm kiếm cho cân đối, thanh thoát */
.search-container-wrapper input.form-control,
.search-container-wrapper .input-group input,
.search-container-wrapper input[name="search"] {
    height: 38px !important;
    font-size: 0.9rem !important;
    padding-top: 0.375rem !important;
    padding-bottom: 0.375rem !important;
}

.search-container-wrapper .btn,
.search-container-wrapper .input-group button {
    height: 38px !important;
    padding-top: 0.375rem !important;
    padding-bottom: 0.375rem !important;
    font-size: 0.9rem !important;
}

/* --- Stylesheet dùng chung cho Breadcrumb và Layout tập đoàn --- */

/* Ẩn thanh cuộn trên mobile nhưng vẫn cho phép vuốt ngang mượt mà */
.breadcrumb::-webkit-scrollbar {
  display: none;
}
.breadcrumb {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Thay đổi dấu phân cách breadcrumb thành mũi tên mảnh */
.breadcrumb-item + .breadcrumb-item::before {
  content: "»" !important;
  color: #adb5bd;
  font-weight: 600;
  padding: 0 10px;
}

/* Hiệu ứng chuyển màu nhẹ khi hover link */
.transition-hover {
  transition: color 0.2s ease-in-out;
}
.transition-hover:hover {
  color: #0d6efd !important;
}

/* Tinh chỉnh typography cho nội dung bài viết giống trang tin tức lớn */
.article-content img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  margin: 1.5rem 0;
}
/* Tối ưu hiển thị cho nội dung HTML do module xuất ra */
.html-module-wrapper img {
  max-width: 100%;
  height: auto;
  border-radius: 6px;
  margin: 0.5rem 0;
}

.html-module-wrapper table {
  width: 100% !important;
  overflow-x: auto;
  display: block;
}