/*
Theme Name: Huong Sen
Theme URI: https://nhahangchayhuongsen.com/
Author: Migrated from OpenCart "tlptech" theme
Author URI: https://nhahangchayhuongsen.com/
Description: Giao diện WordPress cho Nhà Hàng Chay Hương Sen (Ẩm Thực Chay Hương Sen). Chuyển thể trung thực từ theme OpenCart 2.3.0.2 "tlptech". Hỗ trợ WooCommerce để hiển thị món ăn như sản phẩm với giá VND. Màu nâu trầm #a65f25, tiêu đề Playfair Display, nội dung Open Sans.
Version: 1.0.0
Requires at least: 5.5
Tested up to: 6.6
Requires PHP: 7.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: huongsen
Tags: restaurant, woocommerce, custom-menu, custom-logo, featured-images, translation-ready, right-sidebar
*/

/* ============================================================
   Huong Sen — WordPress bridging styles.
   The heavy visual design lives in assets/css/main-style.css
   (copied verbatim from the original OpenCart tlptech theme).
   This file only:
     1. declares the averta webfonts (otf copied from tlptech)
     2. maps WordPress / WooCommerce markup onto the tlptech look
   Brand tokens:  primary #a65f25 · gold #ffc003 · price #AF0202
   ============================================================ */

/* ---- Averta web fonts (otf copied from tlptech/fonts/averta) ---- */
@font-face {
  font-family: "avertaBold";
  src: url("assets/fonts/averta/AvertaDemoPE-ExtraBold.otf") format("opentype");
  font-weight: bold;
  font-display: swap;
}
@font-face {
  font-family: "averta";
  src: url("assets/fonts/averta/AvertaDemoPECuttedDemo-Regular.otf") format("opentype");
  font-weight: normal;
  font-display: swap;
}

/* ---- Generic WordPress helpers ---- */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
}
.skip-link {
  position: absolute;
  left: -9999px;
  z-index: 100000;
  background: #a65f25;
  color: #fff;
  padding: 10px 16px;
}
.skip-link:focus { left: 10px; top: 10px; }

body { color: #333; }
.site-main { min-height: 400px; }

/* ---- Page / post content ---- */
.hs-page { padding: 30px 0 50px; }
.hs-page .entry-title,
.hs-post .entry-title {
  font-family: "Playfair Display", serif;
  color: #a65f25;
}
.hs-entry-content { line-height: 1.8; font-size: 16px; }
.hs-entry-content img { height: auto; border-radius: 6px; }
.hs-entry-content h2,
.hs-entry-content h3 { font-family: "Playfair Display", serif; color: #a65f25; }
.hs-entry-content a { color: #a65f25; }
.hs-entry-content blockquote {
  border-left: 4px solid #a65f25;
  background: #f3efeb;
  padding: 12px 18px;
  margin: 18px 0;
}

/* ---- WordPress required alignment / caption classes ---- */
.alignleft { float: left; margin: 0 20px 12px 0; }
.alignright { float: right; margin: 0 0 12px 20px; }
.aligncenter { display: block; margin: 0 auto 12px; }
.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: 13px; color: #696562; text-align: center; }
.sticky, .gallery-caption, .bypostauthor { display: block; }

/* ---- Widgets / sidebar ---- */
.hs-sidebar .widget {
  margin-bottom: 28px;
  background: #fff;
  border: 1px solid #eee;
  padding: 18px;
  border-radius: 6px;
}
.hs-sidebar .widget-title {
  font-family: "Playfair Display", serif;
  color: #a65f25;
  font-size: 20px;
  margin-bottom: 14px;
  padding-bottom: 8px;
  border-bottom: 2px solid #a65f25;
}
.hs-sidebar .widget ul { list-style: none; padding: 0; margin: 0; }
.hs-sidebar .widget ul li {
  padding: 7px 0;
  border-bottom: 1px dashed #e5e5e5;
}
.hs-sidebar .widget ul li a { color: #333; }
.hs-sidebar .widget ul li a:hover { color: #a65f25; }

/* ---- Blog list (archive / index) ---- */
.hs-article-card {
  background: #fff;
  border: 1px solid #eee;
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 30px;
  transition: all .3s ease;
}
.hs-article-card:hover { box-shadow: 0 0 15px rgba(0,0,0,.15); }
.hs-article-card .hs-thumb img { width: 100%; display: block; }
.hs-article-card .hs-card-body { padding: 18px 20px 22px; }
.hs-article-card .hs-card-title {
  font-family: "Playfair Display", serif;
  font-size: 22px;
  margin: 0 0 8px;
}
.hs-article-card .hs-card-title a { color: #a65f25; }
.hs-article-card .hs-meta { color: #696562; font-size: 13px; margin-bottom: 10px; }
.hs-article-card .hs-excerpt { color: #444; }

/* ---- Pagination ---- */
.hs-pagination { margin: 30px 0; text-align: center; }
.hs-pagination .page-numbers {
  display: inline-block;
  padding: 7px 14px;
  margin: 0 3px;
  border: 1px solid #a65f25;
  color: #a65f25;
  border-radius: 4px;
  text-decoration: none;
}
.hs-pagination .page-numbers.current,
.hs-pagination .page-numbers:hover { background: #a65f25; color: #fff; }

/* ---- Comments ---- */
.hs-comments { margin-top: 40px; }
.hs-comments .comment-list { list-style: none; padding: 0; }
.hs-comments .comment-body {
  background: #fafafa;
  border: 1px solid #eee;
  border-radius: 6px;
  padding: 16px;
  margin-bottom: 16px;
}

/* ---- 404 ---- */
.hs-404 { text-align: center; padding: 70px 15px; }
.hs-404 .hs-404-code {
  font-family: "Playfair Display", serif;
  font-size: 120px;
  line-height: 1;
  color: #a65f25;
}

/* ---- Search form ---- */
.hs-searchform { position: relative; display: flex; }
.hs-searchform input[type="search"] {
  flex: 1;
  border: 1px solid #ccc;
  padding: 9px 12px;
  border-radius: 4px 0 0 4px;
}
.hs-searchform button {
  border: 0;
  background: #a65f25;
  color: #fff;
  padding: 0 16px;
  border-radius: 0 4px 4px 0;
  cursor: pointer;
}

/* ============================================================
   WooCommerce → tlptech product look
   ============================================================ */
.woocommerce .hs-breadcrumb-title,
.hs-shop-header {
  background: linear-gradient(rgba(0,0,0,.4), rgba(0,0,0,.4)), #a65f25;
  background-size: cover;
  background-position: center;
  color: #fff;
  padding: 60px 0;
  text-align: center;
}
.hs-shop-header h1 { font-family: "Playfair Display", serif; color: #fff; margin: 0; }

/* Product grid cards — mirror .product-thumb */
.woocommerce ul.products,
.woocommerce-page ul.products {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -10px;
  padding: 0;
  list-style: none;
}
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  width: 25%;
  padding: 0 10px;
  margin: 0 0 24px;
  float: none;
  text-align: center;
}
.woocommerce ul.products li.product .hs-inner,
.woocommerce ul.products li.product {
  position: relative;
}
.woocommerce ul.products li.product a img,
.woocommerce ul.products li.product img {
  margin: 0;
  width: 100%;
  transition: all .4s ease;
}
.woocommerce ul.products li.product .hs-card {
  background: #fff;
  border: 1px solid #eee;
  overflow: hidden;
  transition: all .3s ease;
}
.woocommerce ul.products li.product .hs-card:hover { box-shadow: 0 0 15px rgba(0,0,0,.2); }
.woocommerce ul.products li.product .hs-card:hover img { transform: scale(1.08); }
.woocommerce ul.products li.product .hs-card .hs-img { overflow: hidden; position: relative; }
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2 {
  font-size: 14px;
  line-height: 20px;
  color: #696562;
  text-transform: uppercase;
  font-weight: bold;
  font-family: "avertaBold", "Open Sans", sans-serif;
  padding: 12px 10px 4px;
  min-height: 56px;
}
.woocommerce ul.products li.product .price {
  color: #AF0202;
  display: block;
  font-weight: 700;
  padding: 0 10px 12px;
  text-align: center;
}
.woocommerce ul.products li.product .price del { color: #aaa; font-weight: 400; }
.woocommerce ul.products li.product .price ins { text-decoration: none; }
.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale {
  background: #d31129;
  color: #fff;
  border-radius: 15px;
  min-height: auto;
  min-width: 48px;
  line-height: 26px;
  padding: 0 12px;
  top: 12px;
  right: 12px;
  left: auto;
  position: absolute;
  margin: 0;
  z-index: 5;
}
.woocommerce ul.products li.product .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce #respond input#submit,
.woocommerce .single_add_to_cart_button {
  background: #696562 !important;
  color: #fff !important;
  text-transform: uppercase;
  border-radius: 3px;
  border: 1px solid #696562;
  font-size: 13px;
}
.woocommerce ul.products li.product .button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce .single_add_to_cart_button:hover {
  background: #5c5856 !important;
  border-color: #5c5856;
}
.woocommerce a.button.hs-detail {
  background: transparent !important;
  color: #a65f25 !important;
  border: 1px solid #a65f25;
}
.woocommerce a.button.hs-detail:hover { background: #a65f25 !important; color: #fff !important; }

/* Single product */
.woocommerce div.product .product_title {
  font-family: "Playfair Display", serif;
  color: #a65f25;
}
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: #AF0202;
  font-size: 26px;
  font-weight: 700;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
  border-bottom-color: #fff;
}
.woocommerce .woocommerce-message,
.woocommerce-info { border-top-color: #a65f25; }
.woocommerce .woocommerce-message::before,
.woocommerce-info::before { color: #a65f25; }

/* Responsive product grid */
@media (max-width: 991px) {
  .woocommerce ul.products li.product,
  .woocommerce-page ul.products li.product { width: 50%; }
}
@media (max-width: 575px) {
  .woocommerce ul.products li.product,
  .woocommerce-page ul.products li.product { width: 50%; }
}

/* ============================================================
   Home (front-page) sections built on the tlptech classes
   ============================================================ */
.hs-hero {
  position: relative;
  background-size: cover;
  background-position: center;
  color: #fff;
  text-align: center;
  padding: 120px 15px;
}
.hs-hero:before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(60, 30, 10, .45);
}
.hs-hero .hs-hero-inner { position: relative; z-index: 2; max-width: 820px; margin: 0 auto; }
.hs-hero .hs-hero-sub {
  font-family: "Playfair Display", serif;
  font-size: 22px;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.hs-hero .hs-hero-title {
  font-family: "Playfair Display", serif;
  font-size: 52px;
  margin: 10px 0 20px;
  color: #ffc003;
  text-shadow: 0 2px 6px rgba(0,0,0,.5);
}
.hs-hero .hs-hero-text { font-size: 18px; margin-bottom: 26px; }

.hs-cat-card {
  display: block;
  border-radius: 15px;
  background: #f3efeb;
  box-shadow: 0 0 5px rgba(0,0,0,.3);
  overflow: hidden;
  margin-bottom: 24px;
  text-align: center;
  transition: all .3s ease;
}
.hs-cat-card:hover { transform: translateY(-5px); }
.hs-cat-card img { width: 100%; }
.hs-cat-card .hs-cat-name {
  display: block;
  padding: 14px 8px;
  font-family: "avertaBold", "Open Sans", sans-serif;
  font-weight: bold;
  text-transform: uppercase;
  color: #341412;
}

.hs-gallery-grid img {
  width: 100%;
  border-radius: 8px;
  margin-bottom: 20px;
  object-fit: cover;
  height: 220px;
}

/* Trang danh sách món: khoảng đệm hai bên và ảnh món đồng đều */
.woocommerce .hs-page,
.hs-page.container { padding-left: clamp(16px, 4vw, 64px); padding-right: clamp(16px, 4vw, 64px); }
.product-thumb .image { overflow: hidden; background: #f4efe6; }
.product-thumb .image img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; display: block; }
.product-thumb .caption { padding-top: 12px; }

/* ============================================================
   Home page — fixed aspect ratios that OpenCart produced with its
   server-side cropsize() cache (400x600, 600x450, 900x800, 1700x1000...).
   The original markup/classes are reused; only the crop is emulated.
   ============================================================ */
#link_home_video { line-height: 0; background: #000; }
#link_home_video video { display: block; width: 100%; height: auto; }
.featured-category .category_box .image img { width: 100%; aspect-ratio: 2 / 3; object-fit: cover; }
.home-info .img-show img { width: 100%; aspect-ratio: 9 / 8; object-fit: cover; }
.wt_banner_home .swiper-slide img { width: 100%; aspect-ratio: 17 / 10; object-fit: cover; }
.blog-swip .item-blog .blog-img img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.custommer .custommer-item .image img { aspect-ratio: 1 / 1; object-fit: cover; }

/* Floating Messenger icon: the original used /image/fb.png from the OpenCart image root. */
.float-icon-hotline ul li .fa-messenger {
  background: #168efb url(assets/images/fb.png) center center no-repeat;
}
.footer-logo img { max-width: 100%; height: auto; max-height: 220px; }

/* ===== Responsive: chặn tràn ngang, co ảnh/video, gọn lưới trên tablet và điện thoại ===== */
html, body { max-width: 100%; overflow-x: hidden; }
img, video, iframe, table { max-width: 100%; }
img, video { height: auto; }
iframe { border: 0; }
.container { padding-left: 15px; padding-right: 15px; }
.hs-page, .home-section, #footer { overflow-wrap: anywhere; }
#link_home_video video { width: 100%; display: block; max-height: 78vh; object-fit: cover; }

@media (max-width: 991px) {
  .row.grid5 > .item-grid, .row.grid4 > .item-grid { flex: 0 0 33.3333%; max-width: 33.3333%; }
  .product-thumb .caption h3.name { font-size: 15px; }
  .breadcrumb-header .page-title { font-size: clamp(24px, 6vw, 34px); }
  .bottom-footer, #footer { text-align: center; }
  #footer .col-lg-3, #footer .col-lg-6 { margin-bottom: 18px; }
}
@media (max-width: 767px) {
  .row.grid5 > .item-grid, .row.grid4 > .item-grid { flex: 0 0 50%; max-width: 50%; }
  .product-thumb .caption { padding: 8px 6px 12px; }
  .product-thumb .price { font-size: 15px; }
  .module-title .title, .module-title h2 { font-size: clamp(22px, 6.5vw, 30px); }
  .home-info .row > div, .featured-category .row > div { text-align: center; }
  .form-home .row > div { flex: 0 0 100%; max-width: 100%; }
  .hs-buffet .bf-poster { max-width: 100%; }
  .float-icon-hotline { right: 8px; }
  .float-icon-hotline li i { width: 42px; height: 42px; line-height: 42px; }
}
@media (max-width: 479px) {
  .top-header .list-inline-item .btn { font-size: 12px; padding: 3px 8px; }
  .row.grid5 > .item-grid, .row.grid4 > .item-grid { padding-left: 6px; padding-right: 6px; }
  .hs-page { padding-left: 12px !important; padding-right: 12px !important; }
}

/* Khối Menu Buffet trên trang chủ */
.home-buffet { background: #fbf6ee; padding: clamp(32px, 5vw, 64px) 0; border-top: 1px solid #e9dcc6; border-bottom: 1px solid #e9dcc6; }
.home-buffet-img { max-width: 340px; width: 100%; padding: 8px; background: #fff; border: 1px solid #e9dcc6; box-shadow: 0 16px 36px -18px rgba(137,54,9,.45); }
.home-buffet-eyebrow { letter-spacing: .3em; text-transform: uppercase; font-size: 12px; color: #a65f25; margin: 0 0 8px; }
.home-buffet-title { font-family: 'Playfair Display', serif; color: #893609; font-size: clamp(26px, 4vw, 38px); margin: 0 0 12px; }
.home-buffet p { color: #4a3f33; line-height: 1.7; }