/*
Theme Name: Mồi Câu Child
Theme URI: https://moicau.top
Description: Child theme của Flatsome cho cửa hàng mồi câu moicau.top. Mọi tuỳ biến trình bày đi
             qua đây; không sửa theme Flatsome gốc (docs/flatsome-theme-standards.md §1, skill
             flatsome-woo-core quy tắc bất biến #1). Logic nghiệp vụ → mu-plugin.
Author: moicau.top
Author URI: https://moicau.top
Template: flatsome
Version: 1.3.4
Text Domain: moicau-child
*/

/*
 * CSS override là NGOẠI LỆ — ưu tiên Flatsome Theme Options / Customizer trước
 * (docs/flatsome-theme-standards.md §3). Token màu brand mồi câu đặt qua Customizer,
 * không hard-code ở đây trừ khi Theme Options không có tuỳ chọn tương ứng.
 *
 * Brand palette (LUXURY — set trong Customizer → Style, CSS bổ trợ dưới):
 *   primary  #0f4d3d  (xanh rêu sâu / nước — premium)
 *   gold     #c19a4b  (accent luxury — giá, badge, đường kẻ)
 *   dark     #14231d  (charcoal — hero/footer)
 */

/* ============================================================
   LUXURY STORE POLISH — de-monotonize + nâng cấp cảm giác cao cấp
   (áp cho Flatsome shop/category/product card + header + hero)
   ============================================================ */
:root{
  --mc-gold:#c19a4b; --mc-gold-d:#a67f33;
  --mc-teal:#0f4d3d; --mc-teal-d:#0a3a2d;
  --mc-charcoal:#14231d; --mc-ink:#1f2a26;
  --mc-line:#e7e2d6;
}

/* --- Giá: gold, đậm, nổi bật --- */
.woocommerce-Price-amount, .price .amount, .price ins .amount{
  color:var(--mc-gold-d)!important; font-weight:700;
}
.price{ font-size:1.05em; }
.price del .amount{ color:#b9b3a6!important; font-weight:400; }

/* --- Product card: viền tinh, nền trắng, hover nâng + đổ bóng --- */
.product-small.box, .products .box{
  background:#fff; border:1px solid var(--mc-line); border-radius:10px;
  overflow:hidden; transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.product-small.box:hover, .products .box:hover{
  transform:translateY(-6px);
  box-shadow:0 14px 34px -14px rgba(15,77,61,.35);
  border-color:var(--mc-gold);
}
.product-small .box-image{ padding:14px 14px 0; }
.product-small .box-text{ padding:14px 16px 18px; }

/* --- Nhãn danh mục trên card: gold, chữ hoa nhỏ, giãn --- */
.box-text .category, .product-cat .category{
  color:var(--mc-gold-d)!important; text-transform:uppercase;
  letter-spacing:.12em; font-size:.68em; font-weight:600;
}
/* --- Tên sản phẩm: thanh lịch --- */
.product-title, .box-text .name a, p.name.product-title a{
  color:var(--mc-ink)!important; font-weight:600; letter-spacing:.01em;
}
.product-title:hover, .box-text .name a:hover{ color:var(--mc-teal)!important; }

/* --- Nút Add to cart / button: teal → gold hover --- */
.button.primary, .button.add_to_cart_button, .single_add_to_cart_button, button.single_add_to_cart_button{
  background:var(--mc-teal)!important; border-color:var(--mc-teal)!important;
  color:#fff!important; border-radius:6px; letter-spacing:.03em; font-weight:600;
  transition:background .2s ease, transform .15s ease;
}
.button.primary:hover, .button.add_to_cart_button:hover, .single_add_to_cart_button:hover{
  background:var(--mc-gold-d)!important; border-color:var(--mc-gold-d)!important; transform:translateY(-2px);
}

/* --- Tiêu đề trang shop/category: kẻ gold dưới --- */
.shop-page-title, .page-title-inner .entry-title, .category-page-row .page-title,
.woocommerce-products-header__title{
  font-weight:700; letter-spacing:.01em;
}
.category-page-row .page-title:after, .woocommerce-products-header:after{
  content:""; display:block; width:56px; height:3px; background:var(--mc-gold);
  margin:14px 0 4px; border-radius:2px;
}

/* --- Menu chính: chữ hoa nhẹ, hover gold --- */
.header-nav .nav > li > a{ letter-spacing:.03em; font-weight:600; }
.header-nav .nav > li > a:hover{ color:var(--mc-gold-d)!important; }

/* --- Hero + section rhythm --- */
.mc-hero{ background:linear-gradient(120deg,#0c352a 0%,#14231d 60%,#0a2b22 100%); }
.mc-hero .ux-text, .mc-hero h1, .mc-hero h2{ color:#fff; }
.mc-gold-text{ color:var(--mc-gold)!important; }
.mc-band{ background:#faf8f2; }

/* --- Featured/hero product viền gold nhẹ --- */
.mc-lux .product-small.box{ border-color:var(--mc-gold); }

/* --- Category showcase tiles (ux_product_categories): bo góc + hover --- */
.ux-box.ux-text-badge, .product-category .box-image{ border-radius:10px; }
.product-category .box:hover .box-image{ box-shadow:0 10px 26px -12px rgba(193,154,75,.5); }

/* --- Footer badges + trust row spacing --- */
.mc-trust .icon-box{ padding:10px 0; }
.mc-trust .icon-box-img .icon{ color:var(--mc-teal); }

/* --- Placeholder branded (att set qua woocommerce_placeholder_image_id) hiện full --- */
.product-small .woocommerce-placeholder, .products .woocommerce-placeholder{ border-radius:6px; }

/* ============================================================
   LUXURY TYPOGRAPHY — Cormorant Garamond (display serif) +
   Be Vietnam Pro (body, chuẩn tiếng Việt). Font enqueue ở inc/setup.php.
   ============================================================ */
body, p, .box-text, input, select, textarea, .nav > li > a, button, .button{
  font-family:'Be Vietnam Pro', -apple-system, 'Segoe UI', sans-serif !important;
}
/* icon fonts giữ nguyên (không ăn theo body override) */
i[class*="icon-"], .fl-icons, [class^="icon-"]{ font-family:'fl-icons' !important; }
h1,h2,h3,.section-title span, .banner h1, .banner h2, .shop-page-title,
.product-title.product_title, .page-title-inner .entry-title{
  font-family:'Cormorant Garamond', Georgia, serif !important;
  font-weight:600; letter-spacing:.015em;
}
.section-title span{ font-size:1.5em; text-transform:none; }
.section-title-center b{ background:var(--mc-gold); opacity:.55; height:2px; }
/* product card giữ sans cho tên (dễ đọc ở size nhỏ) */
.product-small .name a{ font-family:'Be Vietnam Pro', sans-serif; }
/* PDP: tên sản phẩm serif lớn, giá gold nổi */
.product-title.product_title{ font-size:2em; line-height:1.15; }
.product-info .price .amount{ font-size:1.35em; }

/* --- Top bar luxury: charcoal + chữ sáng --- */
#top-bar, .header-top{ background:var(--mc-charcoal) !important; }
#top-bar .html, #top-bar span, .header-top *{ color:#e8e4d8 !important; font-size:.78em; }
#top-bar strong{ color:var(--mc-gold) !important; }

/* --- Footer luxury: nền charcoal, chữ sáng, kẻ gold --- */
.footer-widgets.footer{ background:var(--mc-charcoal) !important; border-top:3px solid var(--mc-gold); padding:34px 0 22px; }
.footer-widgets, .footer-widgets p, .footer-widgets a, .footer-widgets li{ color:#cfcabb !important; }
.footer-widgets a:hover{ color:var(--mc-gold) !important; }
.absolute-footer, html{ background:#0e1a15 !important; }
.absolute-footer{ color:#8f9a92; padding:12px 0; font-size:.8em; letter-spacing:.06em; }

/* --- Header: cao thoáng + search pill --- */
.header-main{ height:86px; }
.header-main .flex-row{ align-items:center; }
.searchform .search-field{ border-radius:24px; border-color:var(--mc-line); }
.searchform .submit-button{ border-radius:0 24px 24px 0; background:var(--mc-teal); }
.cart-icon strong{ border-color:var(--mc-teal); color:var(--mc-teal); }
.cart-icon strong:after{ border-color:var(--mc-teal); }

/* --- Section spacing rhythm (thoáng = sang) --- */
.section{ scroll-margin-top:90px; }
main .section + .section{ border-top:0; }

/* ============ PDP LUXURY ============ */
.product-gallery{ border:1px solid var(--mc-line); border-radius:12px; padding:10px; background:#fff; }
.breadcrumbs, .woocommerce-breadcrumb{ font-size:.78em; letter-spacing:.08em; text-transform:uppercase; color:#9a948a; }
.breadcrumbs a:hover{ color:var(--mc-gold-d); }
.product_meta{ border-top:1px solid var(--mc-line); padding-top:14px; font-size:.85em; color:#8d887d; }
.product_meta a{ color:var(--mc-gold-d); }
.mc-pdp-trust{ margin:16px 0 4px; padding:12px 14px; background:#faf8f2; border:1px solid var(--mc-line); border-radius:8px; display:flex; flex-direction:column; gap:6px; font-size:.86em; color:var(--mc-ink); }
.mc-pdp-trust span:before{ content:""; }
.woocommerce-tabs .nav-tabs > li.active > a{ border-bottom:2px solid var(--mc-gold) !important; color:var(--mc-teal) !important; }
.related.products > h3, .related.products .section-title span{ font-family:'Cormorant Garamond', serif !important; }
.quantity .qty{ border-radius:6px; }

/* ============ CATEGORY LUXURY ============ */
.shop-page-title.category-page-title{ background:var(--mc-charcoal); }
.shop-page-title.category-page-title .page-title-inner{ min-height:120px; }
.shop-page-title.category-page-title .entry-title, .shop-page-title.category-page-title .is-large{ color:#fff !important; }
.woocommerce-result-count{ color:#9a948a; font-size:.85em; }
.shop-container .term-description{ max-width:760px; color:#6f6a60; font-size:.92em; line-height:1.7; margin-bottom:10px; }

/* ============ CART / CHECKOUT LUXURY ============ */
.cart-container .cart-wrapper h3, .checkout-page-title{ font-family:'Cormorant Garamond', serif !important; }
.shop_table{ border:1px solid var(--mc-line); border-radius:10px; overflow:hidden; }
.shop_table th{ background:#faf8f2; letter-spacing:.06em; font-size:.8em; text-transform:uppercase; }
.checkout-button, .button.checkout{ background:var(--mc-gold-d) !important; border-color:var(--mc-gold-d) !important; }
.checkout-button:hover{ background:var(--mc-teal) !important; }
#order_review{ border:1px solid var(--mc-line); border-radius:10px; padding:18px; background:#faf8f2; }
form.checkout label{ font-size:.85em; letter-spacing:.03em; }

/* ============ MOBILE POLISH ============ */
@media (max-width: 549px){
  .header-main{ height:64px; }
  img.header_logo.header-logo{ height:42px !important; }
  #top-bar .html{ font-size:.7em; }
  .product-small .box-text{ padding:10px 10px 14px; }
  .mc-pdp-trust{ font-size:.8em; }
}

/* --- LOGO HEADER: ép thay bằng logo moicau (URL uploads né cache) + đúng tỉ lệ, hết méo 200x90 --- */
img.header_logo.header-logo,
img.header-logo-dark,
.header-logo a img,
a.header-logo-link img{
  content:url("/wp-content/uploads/2026/07/moicau-logo-light.png") !important;
  width:auto !important;
  height:56px !important;
  max-width:230px !important;
  object-fit:contain;
}
.header-main .header-logo{ display:flex; align-items:center; }

/* ============================================================
   MENU DESKTOP FIT — gọn vừa container 1080px + luxury
   (rút nhãn top-level 6 mục + siết nav; search Field→Icon tuỳ chọn ở Header Builder)
   ============================================================ */
/* Nav top-level: giữ tracking sang, không xuống dòng */
.header-nav .nav{ flex-wrap:nowrap; }
.header-nav-main .header-nav{ flex-wrap:nowrap; }
.header-nav .nav > li > a{
  font-size:13px;
  letter-spacing:.04em;
  font-weight:600;
  padding-left:14px;
  padding-right:14px;
  white-space:nowrap;
}
.header-nav .nav > li:first-child > a{ padding-left:6px; }

/* Search kiểu Icon (nếu đổi Type=Icon/Dropdown ở Header Builder) — skin luxury */
.header .icon-search,
.header a.is-search,
.header .header-search-dropdown > a,
.header .search-dropdown-toggle{ color:var(--mc-charcoal); font-size:18px; transition:color .15s ease; }
.header .icon-search:hover,
.header a.is-search:hover,
.header .header-search-dropdown > a:hover{ color:var(--mc-gold-d); }
.header-search-form .searchform .search-field,
.nav-dropdown.search-dropdown .search-field,
.top-search-wrapper .search-field{ border-radius:24px; border:1px solid var(--mc-gold); }

/* Nhịp thở logo ↔ nav ↔ cart */
.header-main .header-logo{ margin-right:16px; }
.cart-icon{ margin-left:6px; }

/* Dropdown luxury — zero-cost, chỉ hiện khi sau này thêm sub-menu */
.header-nav .nav-dropdown{
  background:var(--mc-charcoal); border:1px solid var(--mc-gold);
  border-radius:4px; padding:14px 18px;
  box-shadow:0 12px 32px rgba(0,0,0,.35); min-width:220px;
}
.header-nav .nav-dropdown a{
  color:#f5f1e8; font-size:13px; letter-spacing:.02em; padding:7px 4px;
  display:block; border-bottom:none;
  transition:color .15s ease, padding-left .15s ease;
}
.header-nav .nav-dropdown a:hover{ color:var(--mc-gold); padding-left:8px; }

/* Biên an toàn khung hẹp 1024–1150px */
@media (min-width:1024px) and (max-width:1150px){
  .header-nav .nav > li > a{ padding-left:10px; padding-right:10px; font-size:12.5px; }
}

/* ============ SEARCH ICON → DROPDOWN (premium, không cần JS Magnific) ============ */
/* Icon search ở header: rõ, hover gold */
.header .icon-search{ font-size:19px; }
.header a.is-search .icon-search, .header .header-search a .icon-search{ color:var(--mc-charcoal); }
.header a.is-search:hover .icon-search{ color:var(--mc-gold-d); }
/* Dropdown search: nền TRẮNG sạch (đè charcoal của nav-submenu), viền gold, bo mềm */
li.header-search-dropdown .nav-dropdown{
  background:#fff !important; border:1px solid var(--mc-gold) !important;
  border-radius:8px; padding:14px !important; min-width:320px;
  box-shadow:0 16px 40px -14px rgba(20,35,29,.45);
}
li.header-search-dropdown .nav-dropdown:before,
li.header-search-dropdown .nav-dropdown:after{ border-bottom-color:var(--mc-gold); }
/* Ô search trong dropdown: pill, viền cream, chữ tối rõ */
li.header-search-dropdown .nav-dropdown .search-field{
  border:1px solid var(--mc-line) !important; border-radius:24px !important;
  background:#fff !important; color:var(--mc-ink) !important; height:44px;
}
li.header-search-dropdown .nav-dropdown .search-field::placeholder{ color:#9a948a; }
li.header-search-dropdown .nav-dropdown .ux-search-submit,
li.header-search-dropdown .nav-dropdown .submit-button{
  background:var(--mc-teal) !important; border-color:var(--mc-teal) !important; border-radius:0 24px 24px 0;
}