/*
Theme Name: Web Khoi Nghiep
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap');

body {
  font-family: "Montserrat", sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: inherit;
}

input.search-field {
  box-shadow: none;
  border: 1px solid #c51230;
}

.box-text .product-title {
  font-size: 17px;
  font-weight: bold;
  color: black;
}

.title-header {
  color: black;
  font-weight: bold;
}

.span-hotline {
  color: red;
  font-weight: bold;
  font-size: 15px;
}

ul.top-bar-nav .header-cart-title {
  font-family: SFUFuturaRegular;
  color: black;
}

ul.top-bar-nav i {
  color: black;
}

.title-page {
  font-family: SFUFuturaBook;
  text-align: center;
  text-transform: uppercase;
  font-size: 30px;
}

.container-width,
.full-width .ubermenu-nav,
.container,
.row {
  max-width: 1480px;
}

.row.row-small {
  max-width: 1450px;
}

.row.row-large {
  max-width: 1480px;
}

b,
strong {
  font-weight: bold !important;
}

#mega_main_menu.mega_main_sidebar_menu>.menu_holder>.menu_inner>ul>li>.item_link>i:before {
  color: gray !important
}

#mega_main_menu {
  z-index: 29 !important
}

.flex-right ul li a {
  text-transform: initial !important;
  font-size: 16px;
}

#mega_main_menu br {
  display: none !important
}

/*Màu sắc button*/
.social-button,
.social-icons .button.icon:not(.is-outline),
.social-icons .button.icon:hover {
  background-color: currentColor !important;
  border-color: currentColor !important;
}

.button.facebook,
.button.facebook:not(.is-outline),
.button.facebook:hover {
  color: #fff;
  background-color: #446084;
  border-color: #446084;
}

.button.twitter,
.button.twitter:not(.is-outline),
.button.twitter:hover {
  color: white !important;
  background: #2478ba !important;
  border-color: #2478ba;
}

.button.email,
.button.email:not(.is-outline),
.button.email:hover {
  color: #fff;
  background-color: black !important;
  border-color: black !important;
}

.button.pinterest,
.button.pinterest:not(.is-outline),
.button.pinterest:hover {
  color: #fff !important;
  background-color: #cb2320 !important;
  border-color: #cb2320 !important;
}

.button.google-plus,
.button.google-plus:not(.is-outline),
.button.google-plus:hover {
  color: #fff !important;
  background-color: #dd4e31 !important;
  border-color: #dd4e31 !important;
}

.button.linkedin,
.button.linkedin:not(.is-outline),
.button.linkedin:hover {
  color: #fff !important;
  background-color: #0072b7 !important;
  border-color: #0072b7 !important;
}

.single-date {
  border-bottom: 1px dashed #ededed;
}

h1.entry-title {
  font-size: 24px !important;
}

/*Kết thúc màu sắc*/



footer.entry-meta {

  border-top: none !important;
  border-bottom: 1px dashed #ececec !important;

}


.duong-line {
  background: rgba(0, 0, 0, 0) url(images/line.png) repeat scroll 0 0;
  height: 12px;
  margin-top: 5px;
  overflow: hidden;
}

.related-post h7 {
  font-weight: bold;
  font-size: 18px;
  float: left;
  margin: -8px 20px 0 0;
}

.product-title {
  min-height: 40px;
}

.title-danh-muc {
  background: #c51230;
  padding: 7px;
  color: white;
  font-weight: bold;
}

.title-danh-muc p {
  margin-bottom: 0px;
}

.section-slide .large-9 {
  padding-left: 0px;
}

.lien-he-price {
  color: #e74c3c;
  font-weight: bold;
}

/*css mega main menu*/

#mega_main_menu.direction-vertical>.menu_holder>.menu_inner>ul>li>.item_link:before,
#mega_main_menu.direction-vertical>.menu_holder>.menu_inner>ul>li.nav_search_box:before {
  background-image: none !important
}

/*end css mega main menu*/


.section-text .icon-box {
  border: 1px solid #cdcdcd;
  padding: 5px;
}


/*css cho tung theme - ban desktop*/
h1.entry-title {
  font-size: 22px !important
}

.hotline-single p {
  font-weight: bold;
  color: black;


}

.hotline-single p a {
  border-radius: 17px;
  color: white;
  font-weight: bold;
  padding: 10px;
  background: #e67e22
}

.hotline-single {
  border: #dadada solid 1px;
  padding: 15px;
  text-align: center;
  background: #f3f3f3;
}

.section-tin-tuc .from_the_blog_excerpt {
  min-height: 69px;
}

.header-block-block-1 .col {
  padding-bottom: 0px !important;
}

/*het phan css*/

.nrpsctm-block h3 {
  font-size: 15px !important;
}

.add_to_cart_button {
  background: #c51230 !important;
  color: #fff !important;
}

.section-dia-chi a.button {
  background: #c51230;
  color: white;
}

.box-category .box-text .box-text-inner {
  padding: 0px 10px;
}

@media only screen and (max-width: 48em) {
  /*************** ADD MOBILE ONLY CSS HERE  ***************/


}

ul.nav-dropdown.nav-dropdown-default {
  width: 350px;
}

.product-small .box-image img {
  height: 250px;
  object-fit: contain;
  background: #fff;
}

.ddg-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 40px auto;
  width: 50%;
}

.ddg-divider::before,
.ddg-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: #203a63;
  /* màu line */
}

.ddg-divider img {
  margin: 0 16px;
  max-height: 30px;
  background: #fff;
  padding: 0 8px;
}

/* Update product 12092025 — cột đồng chiều cao, nội dung ô căn đều */
.row .col.product-small .col-inner {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.row .product-small .box {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  text-align: left;
  min-height: 0;
}

.row .product-small .box .box-text.box-text-products {
  width: 100%;
  align-self: stretch;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  max-height: none !important;
  overflow: visible;
}

/* Hàng sản phẩm: các cột cùng chiều cao */
.products.row {
  align-items: stretch;
}

/* Masonry / packery: không ép chiều cao cột */
.row-masonry .col.product-small .col-inner,
.has-packery .col.product-small .col-inner {
  height: auto;
}

.row-masonry .product-small .box-text-products,
.has-packery .product-small .box-text-products {
  min-height: 0;
}

.product-small .box-text-products {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  flex-grow: 1;
  margin-top: 10px;
  align-items: stretch;
  text-align: left;
  flex: 1 1 auto;
  min-height: 11.5rem;
}

/* Khối tiêu đề + dòng phụ cố định tối thiểu — giảm chênh lệch khi có/không giá */
.product-small .title-wrapper {
  flex: 0 0 auto;
  min-height: 3.25rem;
}

.product-small .box-excerpt {
  flex: 0 0 auto;
}

.product-small .product-title {
  font-size: 15px;
  font-weight: 600;
  margin: 8px 0;
  line-height: 1.3;
  color: #222;
  text-align: center;
}

/* Chỉ lưới sản phẩm — tránh trùng class .price-wrapper với trang chi tiết */
.product-small .price-wrapper {
  flex: 0 0 auto;
  width: 100%;
  text-align: center;
  min-height: 2.25rem;
  margin-top: auto;
  padding-top: 8px;
}

.product-small .price-wrapper .price {
  font-size: 1.35rem;
  line-height: 1.5;
  font-weight: 700;
  color: #c51230;
  margin: 0.25rem 0 0.35rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: baseline;
  gap: 0.35rem 0.5rem;
  text-align: center;
}

.product-small .price-wrapper .woocommerce-Price-amount,
.product-small .price-wrapper bdi {
  color: #c51230;
  font-size: inherit;
  line-height: inherit;
}

.product-small .price-wrapper del,
.product-small .price-wrapper del .woocommerce-Price-amount,
.product-small .price-wrapper del bdi {
  color: #888 !important;
  font-weight: 500;
}

.product-small .price-wrapper ins,
.product-small .price-wrapper ins .woocommerce-Price-amount,
.product-small .price-wrapper ins bdi {
  color: #c51230 !important;
}

/* Trang chi tiết: giá to, đỏ, căn trái cùng hàng với tiêu đề / mô tả */
.single-product div.product .summary .price-wrapper,
.single-product div.product .product-info .price-wrapper {
  margin-top: 0;
  width: 100%;
  text-align: left;
  min-height: 2.25rem;
}

.single-product div.product .summary .price-wrapper .price,
.single-product div.product .summary .product-page-price,
.single-product div.product .product-info .price-wrapper .price,
.single-product div.product .product-info .product-page-price {
  font-size: 1.35rem !important;
  line-height: 1.5;
  font-weight: 700;
  color: #c51230 !important;
  margin: 0.25rem 0 0.35rem;
  display: flex !important;
  flex-wrap: wrap;
  justify-content: flex-start !important;
  align-items: baseline;
  gap: 0.35rem 0.5rem;
  text-align: left !important;
}

.single-product div.product .summary .price-wrapper .woocommerce-Price-amount,
.single-product div.product .summary .price-wrapper bdi,
.single-product div.product .product-info .price-wrapper .woocommerce-Price-amount,
.single-product div.product .product-info .price-wrapper bdi {
  color: #c51230;
  font-size: inherit;
  line-height: inherit;
}

.single-product div.product .summary .price-wrapper del,
.single-product div.product .summary .price-wrapper del .woocommerce-Price-amount,
.single-product div.product .summary .price-wrapper del bdi,
.single-product div.product .product-info .price-wrapper del,
.single-product div.product .product-info .price-wrapper del .woocommerce-Price-amount,
.single-product div.product .product-info .price-wrapper del bdi {
  color: #888 !important;
  font-weight: 500;
}

.single-product div.product .summary .price-wrapper ins,
.single-product div.product .summary .price-wrapper ins .woocommerce-Price-amount,
.single-product div.product .summary .price-wrapper ins bdi,
.single-product div.product .product-info .price-wrapper ins,
.single-product div.product .product-info .price-wrapper ins .woocommerce-Price-amount,
.single-product div.product .product-info .price-wrapper ins bdi {
  color: #c51230 !important;
}

/* Đặt hàng + Xem thêm: cùng kích thước, cùng màu (ưu tiên cao hơn .add_to_cart_button toàn site) */
.product-small .button,
.product-small .add_to_cart_button,
.product-small .view-product,
.product-small .ddg-loop-order-wrap .button,
.product-small .ddg-loop-order-wrap .add_to_cart_button {
  box-sizing: border-box;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 100%;
  min-height: 2.85rem;
  padding: 0.65em 1rem !important;
  text-align: center;
  background-color: #002855 !important;
  color: #fff !important;
  border-color: #002855 !important;
  border-width: 1px;
  border-style: solid;
  font-weight: 600;
  font-size: 14px !important;
  line-height: 1.25;
  border-radius: 30px;
  transition: background 0.2s ease, border-color 0.2s ease;
  margin: 0;
  text-transform: none;
}

.product-small .ddg-loop-order-wrap {
  width: 100%;
  margin-top: 10px;
  padding-top: 10px;
  flex: 0 0 auto;
}

.product-small .ddg-contact-btn {
  background-color: #c51230 !important;
  border-color: #c51230 !important;
}

.product-small .ddg-contact-btn:hover {
  background-color: #a50f27 !important;
  border-color: #a50f27 !important;
}

.product-small .ddg-loop-order-wrap .add-to-cart-button {
  width: 100%;
  display: flex;
}

.product-small .ddg-loop-order-wrap .add-to-cart-button>.button,
.product-small .ddg-loop-order-wrap .add-to-cart-button>.add_to_cart_button {
  flex: 1 1 auto;
  min-height: 2.85rem;
}

.product-small .button:hover,
.product-small .add_to_cart_button:hover,
.product-small .view-product:hover,
.product-small .ddg-loop-order-wrap .button:hover,
.product-small .ddg-loop-order-wrap .add_to_cart_button:hover {
  background-color: #004080 !important;
  border-color: #004080 !important;
  color: #fff !important;
}

.product-small .badge-container {
  top: 0;
  right: 10px;
  left: auto;
  margin: 0;
}

.product-small .badge .badge-inner.on-sale {
  background: #002855;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  padding: 6px 10px;
  border-radius: 4px;
}

.product-small .col-inner {
  border: 1px solid #e5e5e5;
  border-radius: 6px;
  background: #fff;
  overflow: hidden;
  transition: box-shadow 0.3s ease;
  margin-bottom: 20px;
}

.product-small .col-inner:hover {
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
}

.product-small .box-image {
  width: 100%;
  flex-shrink: 0;
}

/* Giỏ hàng: căn số tiền cột Giá / Tạm tính đồng bộ với lưới sản phẩm */
.woocommerce-cart .shop_table.cart td.product-price,
.woocommerce-cart .shop_table.cart td.product-subtotal,
.woocommerce-cart .shop_table.cart th.product-price,
.woocommerce-cart .shop_table.cart th.product-subtotal {
  text-align: right;
}

.woocommerce-cart .shop_table.cart td.product-price .amount,
.woocommerce-cart .shop_table.cart td.product-subtotal .amount {
  display: inline-block;
  text-align: right;
}

/* ===== Custom Styles ===== */

.product-footer {
  color: black;
}

#wpfomo {
  top: -100px !important;
  bottom: unset !important;
}

#wpfomo.is-visible {
  top: 75px !important;
  bottom: unset !important;
}

.price-wrapper .price a {
  background-color: #0055b1;
  color: white;
  padding: 10px;
  box-shadow: 5px 5px 1px #b5b5b56b;
}

.price-wrapper .price {
  font-size: 1em;
}

.product-short-description table tr,
.product-short-description table td {
  border: 1px solid lightgray;
  padding: 5px;
}

.product-main img {
  border-radius: 10px;
}

.transparent .header-main {
  height: 100px !important;
}

.transparent #logo img {
  max-height: 100% !important;
}

span.amount {
  font-size: 15px;
  font-weight: bold;
}

.is-sticky100 {
  position: sticky;
  top: 100px;
}

table td {
  border: 1px solid #ddd;
  padding: 8px;
}

table tr:nth-child(even) {
  background-color: #f2f2f2;
}

table tr:hover {
  background-color: #ddd;
}

td:first-child {
  padding-left: .5em;
}

@media (max-width: 768px) {
  .hidden-mobile {
    display: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* Mobile: không ép đồng chiều cao card để tránh ô bị dài khi scroll/lazyload */
  .row .col.product-small .col-inner,
  .row .product-small .box,
  .row .product-small .box .box-text.box-text-products,
  .product-small .box-text-products,
  .product-small .title-wrapper,
  .product-small .price-wrapper {
    height: auto !important;
    min-height: 0 !important;
  }

  .product-small .ddg-loop-order-wrap {
    margin-top: 8px;
    padding-top: 8px;
  }

  /* Mobile: giữ ảnh hiển thị đầy đủ, không cắt */
  .product-small .box-image {
    overflow: visible;
  }

  .product-small .box-image img {
    width: 100% !important;
    height: auto !important;
    max-height: 250px !important;
    object-fit: contain !important;
    display: block;
  }
}

.entry-content {
  padding-top: 0;
}

html.pum-open.pum-open-overlay.pum-open-scrollable body> :not([aria-modal=true]) {
  padding-right: 0;
}

/* ===== Design tokens ===== */
:root {
  --ddg-primary: #203A63;
  --ddg-secondary: #2E5C8A;
  --ddg-accent: #C5A46D;
  --ddg-text: #273043;
  --ddg-bg: #F6F8FB;
  --ddg-line: #E6ECF2;
}

/* Body & heading font — Montserrat / inherit (khai báo ở đầu file, lặp lại để giữ specificity) */
body {
  font-family: "Montserrat", sans-serif;
  font-size: 16px;
  line-height: 1.7;
  color: var(--ddg-text);
  -webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: inherit;
  color: var(--ddg-primary);
  line-height: 1.3;
  margin: 0 0 .6em;
}

h1 {
  font-weight: 800;
  font-size: clamp(28px, 3vw, 40px);
}

h2 {
  font-weight: 700;
  font-size: clamp(22px, 2.4vw, 30px);
}

h3 {
  font-weight: 700;
  font-size: clamp(18px, 1.8vw, 24px);
}

h4 {
  font-weight: 600;
  font-size: 18px;
}

h5 {
  font-weight: 600;
  font-size: 16px;
}

h6 {
  font-weight: 600;
  font-size: 14px;
  color: #7B8794;
}

p {
  margin: 0 0 1.2em;
}

a {
  color: var(--ddg-secondary);
  text-decoration: none;
  transition: color .2s ease;
}

a:hover {
  color: var(--ddg-accent);
  text-decoration: underline;
}

blockquote {
  font-size: 18px;
  color: var(--ddg-primary);
  border-left: 4px solid var(--ddg-accent);
  background: var(--ddg-bg);
  margin: 1.5em 0;
  padding: .8em 1em;
}

/* ===== Flatsome header nav ===== */
#wide-nav .nav>li>a.nav-top-link {
  font-family: inherit;
  font-weight: 500;
  color: white;
  padding: 10px 14px;
  display: block;
  transition: color .2s ease, background .2s ease;
}

#wide-nav .nav>li:hover>a.nav-top-link,
#wide-nav .nav>li.current-menu-item>a.nav-top-link {
  color: var(--ddg-accent);
}

#wide-nav .nav>li>ul.sub-menu.nav-dropdown {
  background: #fff;
  border: 1px solid var(--ddg-line);
  border-radius: 10px;
  padding: 6px 0;
  min-width: 200px;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .08);
}

#wide-nav .nav>li>ul.sub-menu.nav-dropdown li>a {
  color: var(--ddg-secondary);
  font-size: 15px;
  font-weight: 500;
  padding: 9px 14px;
  display: block;
  transition: background .2s ease, color .2s ease;
}

#wide-nav .nav>li>ul.sub-menu.nav-dropdown li>a:hover,
#wide-nav .nav>li>ul.sub-menu.nav-dropdown li>a:focus {
  background: var(--ddg-bg);
  color: var(--ddg-primary);
  text-decoration: none;
  outline: 0;
}

#wide-nav .nav a:focus {
  outline: 2px solid rgba(197, 164, 109, .45);
  outline-offset: 2px;
}

@media (max-width: 991px) {
  h1 {
    font-size: 26px;
  }

  h2 {
    font-size: 22px;
  }

  h3 {
    font-size: 18px;
  }
}

/* ===== Search pill ===== */
.header-search-form-wrapper .flex-row {
  position: relative;
}

.header-search-form-wrapper .search-field {
  width: 100%;
  height: 48px;
  border: 1px solid #203a63 !important;
  border-radius: 999px;
  padding: 0 16px 0 44px;
  font-size: 16px;
  color: #22324a;
  box-shadow: 0 0 0 3px rgba(32, 58, 99, .08);
  outline: none;
  background: #fff;
}

.header-search-form-wrapper .search-field::placeholder {
  font-style: italic;
  color: #7c8ea6;
}

.header-search-form-wrapper .search-field:focus {
  box-shadow: 0 0 0 4px rgba(32, 58, 99, .12);
}

.header-search-form-wrapper .flex-row>.flex-col:last-child {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  pointer-events: none;
}

.header-search-form-wrapper .ux-search-submit {
  all: unset;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  color: #203a63;
  cursor: pointer;
  pointer-events: none;
}

.header-search-form-wrapper .ux-search-submit i {
  font-size: 18px;
  line-height: 1;
}

.header-search-form-wrapper .flex-row>.flex-col.flex-grow {
  width: 100%;
}

.ux-search-submit.submit-button {
  background: none !important;
}