/*
 * Điều Hòa Nam Anh - giao diện tùy chỉnh.
 * Được nạp từ child theme TNStack Core; giữ style.css dành cho metadata theme.
 */

:root {
  /* Màu thương hiệu dùng trên toàn site. */
  --main-clr: #1976f7;
  --second-clr: #ff8a00;
  --nam-anh-blue: #0877d1;
  --nam-anh-blue-dark: #005baa;
  --nam-anh-blue-light: #eaf5ff;
  --nam-anh-text: #172b4d;
  --nam-anh-muted: #718096;
  --nam-anh-border: #e7edf5;

  /* Biến riêng cho giao diện trang chi tiết sản phẩm. */
  --na-blue: #0b72e7;
  --na-blue-dark: #0756b8;
  --na-blue-light: #eaf4ff;
  --na-blue-soft: #f4f9ff;
  --na-text: #172033;
  --na-text-light: #64748b;
  --na-border: #e4eaf2;
  --na-red: #e53935;
  --na-white: #fff;
  --na-radius: 18px;
  --na-shadow: 0 10px 35px rgba(20, 65, 110, 0.08);
}

/* =========== HEADER =========== */

#top-bar {
  background-color: rgb(227, 244, 255);
}

#top-bar .flex-left,
#top-bar .flex-right {
  display: none;
}

#top-bar .flex-center {
  width: 100%;
}

#top-bar .header-block-block-1 > .section {
  padding: 5px 10px;
}

#top-bar .icon-box-img img {
  display: block;
  padding: 0;
  margin: 0;
}

.header-vertical-menu__opener {
  border-radius: 6px;
}

.header-vertical-menu__opener .icon-angle-down {
  display: none;
}

.header-search-form-wrapper input[type="search"] {
  height: 38px;
  border-radius: 4px 0 0 4px;
}

.header-search-form-wrapper button[type="submit"] {
  height: 38px;
  border-radius: 0 4px 4px 0;
}

.prd-cate .col-inner {
  background-color: #f1f6fc;
  border-radius: 6px;
}

/* =========== BASE =========== */

.sc-title, .sc-title a, .sc-title i, .sc-title .section-title-main {
	background: linear-gradient(90deg, var(--main-clr) 0%, var(--second-clr) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: #ff9900;
}

.header-wrapper .header-inner {
  justify-content: space-between !important;
}

.header-wrapper .header-inner .header-nav-main {
  justify-content: center;
}

/* =========== CUSTOM ASIDE =========== */
aside {
  border: 2px solid var(--main-clr);
  border-radius: 8px;
}

aside .is-divider {
  display: none;
}

aside .widget-title {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 16px;
  margin-bottom: 10px;
  color: #fff;
  background-color: var(--main-clr);
  border-radius: 4px 4px 0 0;
}

aside .searchform {
  margin: 10px;
}

aside .searchform input {
  border-radius: 4px 0 0 4px;
}

aside .searchform button[type="submit"] {
  background-color: var(--main-clr);
  border-radius: 0 4px 4px 0;
}

aside > ul {
  padding: 0 10px;
}

aside > ul .recent-blog-posts-li .recent-blog-posts {
  align-items: center !important;
}

aside > ul .recent-blog-posts-li a {
  display: -webkit-box;
  overflow: hidden;
  margin-bottom: 0;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

aside > ul .recent-blog-posts-li .post_comments {
  display: none;
}

/* =========== POST DETAIL =========== */
.blog-single .entry-header .entry-divider,
.blog-single .entry-header .badge,
.blog-single .from_the_blog_comments {
  display: none;
}

.blog-single h1,
.blog-single h2,
.blog-single h3,
.blog-single h4,
.blog-single h5,
.blog-single a {
  color: var(--main-clr);
}

.blog-single table {
  border-collapse: collapse;
}

.blog-single table tbody tr td {
  padding: 4px;
}

/* =========== POST ARCHIVE =========== */
.blog-archive .post-item .badge {
  display: none;
}

.blog-archive .post-item {
  padding: 10px;
}

.blog-archive .post-item .col-inner {
  box-shadow: 0 1px 3px -2px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}

.blog-archive .post-item .box-text {
  padding: 10px;
}

.cs-post .is-divider,
.blog-archive .is-divider,
.cs-post .from_the_blog_comments,
.blog-archive .from_the_blog_comments {
  display: none;
}

.cs-post .post-item .col-inner,
.blog-archive .post-item .col-inner {
  overflow: hidden;
  font-size: 110%;
  border-radius: 6px;
}

.cs-post .post-title a,
.blog-archive .post-title a,
.cs-post .from_the_blog_excerpt,
.blog-archive .from_the_blog_excerpt {
  display: -webkit-box;
  overflow: hidden;
  text-align: justify;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
}

.cs-post .post-title a,
.blog-archive .post-title a {
  margin-bottom: 10px;
  -webkit-line-clamp: 1;
}

.cs-post .from_the_blog_excerpt,
.blog-archive .from_the_blog_excerpt {
  -webkit-line-clamp: 2;
}