/*
Theme Name: Landio Lite
Description: ธีมน้ำหนักเบา ไม่พึ่ง UiCore Framework หรือ Elementor รองรับ WooCommerce 10.x, WordPress 6.9 และ PHP 7.4 รองรับภาษาไทย
Author: Custom
Version: 1.1.2
Requires at least: 6.3
Tested up to: 6.9.1
Requires PHP: 7.4
WC requires at least: 8.0
WC tested up to: 10.5
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: landio-lite
*/

/* ==========================================================================
   1. Design tokens — เปลี่ยนสีทั้งธีมได้ที่นี่
   ========================================================================== */
:root {
	--ll-primary: #1d4ed8;        /* ปุ่มหลัก/ลิงก์ (contrast กับขาว 6.7:1) */
	--ll-primary-dark: #1e3a8a;
	--ll-primary-soft: #eff4ff;
	--ll-accent: #e11d48;         /* ป้ายลดราคา */
	--ll-success: #15803d;
	--ll-text: #111827;
	--ll-muted: #4b5563;          /* contrast กับขาว 7.5:1 */
	--ll-bg: #ffffff;
	--ll-alt: #f5f7fb;
	--ll-border: #d9dfea;
	--ll-radius: 10px;
	--ll-radius-sm: 8px;
	--ll-shadow: 0 1px 2px rgba(16, 24, 40, .06), 0 4px 14px rgba(16, 24, 40, .06);
	--ll-shadow-hover: 0 4px 8px rgba(16, 24, 40, .08), 0 14px 30px rgba(16, 24, 40, .12);
	--ll-container: 1200px;
	--ll-control-h: 48px;         /* ความสูงมาตรฐานของปุ่ม/ช่องกรอก (ปลอดภัยต่อการแตะบนมือถือ) */
	--ll-font: "Sarabun", "Noto Sans Thai", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* ==========================================================================
   2. Base
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
	margin: 0;
	font-family: var(--ll-font);
	font-size: 17px;
	line-height: 1.75;
	color: var(--ll-text);
	background: var(--ll-bg);
	overflow-wrap: break-word;
	-webkit-font-smoothing: antialiased;
}
img, video, iframe, svg { max-width: 100%; height: auto; }
a { color: var(--ll-primary); text-decoration: none; }
a:hover, a:focus { color: var(--ll-primary-dark); text-decoration: underline; }
:focus-visible { outline: 3px solid #93b4ff; outline-offset: 2px; }
h1, h2, h3, h4, h5, h6 { line-height: 1.35; margin: 1.5em 0 .6em; font-weight: 700; color: var(--ll-text); }
h1 { font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.2rem); }
h2 { font-size: clamp(1.3rem, 1.1rem + .9vw, 1.7rem); }
h3 { font-size: 1.25rem; }
p { margin: 0 0 1.2em; }
hr { border: 0; border-top: 1px solid var(--ll-border); margin: 2em 0; }
table { border-collapse: collapse; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }

.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; width: 1px; word-wrap: normal;
}
.screen-reader-text:focus {
	background: #fff; clip: auto; clip-path: none; color: #000; display: block; height: auto;
	left: 6px; top: 6px; padding: 12px 20px; width: auto; z-index: 100000;
}

.ll-container { width: 100%; max-width: var(--ll-container); margin: 0 auto; padding: 0 20px; }
@media (max-width: 600px) { .ll-container { padding: 0 16px; } body { font-size: 16.5px; } }

/* ==========================================================================
   3. Header & navigation
   ========================================================================== */
.site-header { background: rgba(255, 255, 255, .97); border-bottom: 1px solid var(--ll-border); position: sticky; top: 0; z-index: 50; }
.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-header { top: 46px; } }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 72px; }
.site-branding a { color: var(--ll-text); font-size: 1.35rem; font-weight: 800; text-decoration: none; letter-spacing: -.01em; }
.site-branding .custom-logo { max-height: 48px; width: auto; display: block; }

.main-navigation { margin-left: auto; }
.main-navigation ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 4px; align-items: center; }
.main-navigation li { position: relative; }
.main-navigation a { display: block; padding: 10px 14px; color: var(--ll-text); font-weight: 600; border-radius: var(--ll-radius-sm); text-decoration: none; }
.main-navigation a:hover, .main-navigation .current-menu-item > a, .main-navigation .current_page_item > a { background: var(--ll-primary-soft); color: var(--ll-primary); }
.main-navigation ul ul {
	display: none; position: absolute; left: 0; top: 100%; min-width: 230px; background: #fff;
	border: 1px solid var(--ll-border); border-radius: var(--ll-radius); box-shadow: var(--ll-shadow-hover); padding: 6px; flex-direction: column; align-items: stretch;
}
.main-navigation li:hover > ul, .main-navigation li:focus-within > ul { display: flex; }

.header-actions { display: flex; align-items: center; gap: 10px; }
.header-cart, .menu-toggle {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-height: 44px; padding: 0 16px; font: inherit; font-weight: 700; line-height: 1;
	color: var(--ll-text); background: #fff; border: 1px solid var(--ll-border); border-radius: var(--ll-radius-sm);
	text-decoration: none; cursor: pointer;
}
.header-cart:hover, .menu-toggle:hover { background: var(--ll-alt); color: var(--ll-text); text-decoration: none; }
.header-cart .count {
	min-width: 24px; height: 24px; padding: 0 7px; display: inline-flex; align-items: center; justify-content: center;
	background: var(--ll-primary); color: #fff; border-radius: 999px; font-size: .8rem; font-variant-numeric: tabular-nums;
}
.menu-toggle { display: none; }

@media (max-width: 900px) {
	.menu-toggle { display: inline-flex; }
	.main-navigation { display: none; position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-bottom: 1px solid var(--ll-border); padding: 10px 16px 16px; box-shadow: var(--ll-shadow); margin: 0; }
	.main-navigation.is-open { display: block; }
	.main-navigation ul { flex-direction: column; align-items: stretch; }
	.main-navigation a { padding: 14px; }
	.main-navigation ul ul { display: flex; position: static; border: 0; box-shadow: none; padding: 0 0 0 14px; }
	.header-cart span:first-child { display: none; } /* มือถือโชว์เฉพาะตัวเลข */
	.header-cart::before { content: "🛒"; }
}

/* ==========================================================================
   4. Layout, posts, widgets
   ========================================================================== */
.site-content { padding: 36px 0 64px; min-height: 55vh; }
.content-wrap { display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; }
.content-wrap.has-sidebar { grid-template-columns: minmax(0, 1fr) 300px; }
.content-wrap.has-sidebar.sidebar-left { grid-template-columns: 280px minmax(0, 1fr); }
.content-wrap.sidebar-left .widget-area { order: -1; }
@media (max-width: 900px) { .content-wrap.has-sidebar, .content-wrap.has-sidebar.sidebar-left { grid-template-columns: minmax(0, 1fr); gap: 28px; } .content-wrap.sidebar-left .widget-area { order: 2; } }

.page-header { margin-bottom: 28px; }
.page-title, .entry-title { margin-top: 0; }
.entry-title a { color: var(--ll-text); text-decoration: none; }
.entry-title a:hover { color: var(--ll-primary); }
.entry-meta { color: var(--ll-muted); font-size: .9rem; margin-bottom: 16px; }
.post-thumbnail img { border-radius: var(--ll-radius); display: block; width: 100%; }
/* เพจ / ตะกร้า / ชำระเงิน / บัญชี: เต็มความกว้างของคอนเทนเนอร์ */
.entry-content { max-width: none; }
/* บทความบล็อกที่ไม่มี sidebar: จำกัดบรรทัดให้อ่านง่าย และจัดกึ่งกลาง */
.single-post:not(.has-sidebar) .site-main > article { max-width: 78ch; margin-left: auto; margin-right: auto; }
.entry-content img { border-radius: var(--ll-radius-sm); }
.entry-content table { width: 100%; margin-bottom: 1.5em; }
.entry-content th, .entry-content td { padding: 10px 14px; border: 1px solid var(--ll-border); text-align: left; }
.entry-content th { background: var(--ll-alt); }
.alignleft { float: left; margin: 0 1.5em 1em 0; }
.alignright { float: right; margin: 0 0 1em 1.5em; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.wp-caption-text, figcaption { font-size: .85rem; color: var(--ll-muted); text-align: center; }
blockquote { margin: 1.5em 0; padding: 4px 0 4px 20px; border-left: 4px solid var(--ll-primary); color: var(--ll-muted); }

.posts-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 290px), 1fr)); gap: 28px; }
.post-card { border: 1px solid var(--ll-border); border-radius: var(--ll-radius); overflow: hidden; background: #fff; box-shadow: var(--ll-shadow); transition: box-shadow .2s, transform .2s; }
.post-card:hover { box-shadow: var(--ll-shadow-hover); transform: translateY(-2px); }
.post-card .post-thumbnail img { border-radius: 0; aspect-ratio: 3 / 2; object-fit: cover; }
.post-card .card-body { padding: 20px; }
.post-card .entry-title { font-size: 1.15rem; margin: 0 0 8px; }

.ui-pagination, .navigation.pagination, .woocommerce-pagination { margin: 40px 0 0; }
.ui-pagination ul, .woocommerce-pagination ul.page-numbers { list-style: none; padding: 0; margin: 0; display: flex; gap: 6px; flex-wrap: wrap; justify-content: center; border: 0; }
.woocommerce-pagination ul.page-numbers li { border: 0; float: none; }
.page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 14px; border: 1px solid var(--ll-border); border-radius: var(--ll-radius-sm); color: var(--ll-text); text-decoration: none; background: #fff; }
.page-numbers.current, a.page-numbers:hover, .woocommerce nav.woocommerce-pagination ul li span.current, .woocommerce nav.woocommerce-pagination ul li a:hover { background: var(--ll-primary); border-color: var(--ll-primary); color: #fff; }

.widget-area .widget { margin-bottom: 28px; padding: 20px; background: var(--ll-alt); border-radius: var(--ll-radius); }
.widget-title { font-size: 1.05rem; margin: 0 0 12px; padding-bottom: 10px; border-bottom: 2px solid var(--ll-border); }
.widget-area ul { list-style: none; padding: 0; margin: 0; }
.widget-area li { padding: 8px 0; border-bottom: 1px solid var(--ll-border); }
.widget-area li:last-child { border-bottom: 0; }

.comments-area { margin-top: 50px; }
.comment-list { list-style: none; padding: 0; }
.comment-list .children { list-style: none; padding-left: 24px; }
.comment-body { padding: 16px 0; border-bottom: 1px solid var(--ll-border); }

.error-404 { text-align: center; padding: 60px 0; }
.error-404 .big { font-size: 6rem; font-weight: 800; color: var(--ll-primary); line-height: 1; }
.error-404 .search-form { max-width: 460px; margin: 20px auto 0; }

/* ==========================================================================
   5. Forms & buttons — ขนาดเดียวกันทั้งเว็บ (สูง 48px, มุมโค้งเท่ากัน)
   ========================================================================== */
input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"],
input[type="number"], input[type="tel"], input[type="date"], textarea, select {
	width: 100%; max-width: 100%; min-height: var(--ll-control-h); padding: 10px 14px;
	font: inherit; font-size: 1rem; /* 16px+ ป้องกัน iOS ซูมเอง */ color: var(--ll-text);
	border: 1px solid var(--ll-border); border-radius: var(--ll-radius-sm); background: #fff;
}
textarea { min-height: 130px; }
input:focus, textarea:focus, select:focus { outline: 3px solid #bcd0ff; outline-offset: 0; border-color: var(--ll-primary); }
label { font-weight: 600; }

.search-form { display: flex; gap: 8px; }
.search-form label { flex: 1; }

button, input[type="submit"], input[type="button"], .button, .wp-block-button__link,
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt,
.woocommerce a.added_to_cart {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-height: var(--ll-control-h); padding: 0 26px; margin: 0;
	font: inherit; font-size: 1rem; font-weight: 700; line-height: 1.2; text-align: center; text-decoration: none;
	color: #fff; background: var(--ll-primary); border: 1px solid var(--ll-primary); border-radius: var(--ll-radius-sm);
	cursor: pointer; transition: background .15s, box-shadow .15s;
}
button:hover, input[type="submit"]:hover, .button:hover, .wp-block-button__link:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
.woocommerce #respond input#submit:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover,
.woocommerce a.added_to_cart:hover {
	background: var(--ll-primary-dark); border-color: var(--ll-primary-dark); color: #fff; text-decoration: none; box-shadow: 0 4px 12px rgba(29, 78, 216, .25);
}
.woocommerce a.button.disabled, .woocommerce button.button:disabled, .woocommerce button.button.disabled { opacity: .55; cursor: not-allowed; }
/* ปุ่มรอง (เช่น อัปเดตตะกร้า, ใช้คูปอง) */
.woocommerce button[name="update_cart"], .woocommerce button[name="apply_coupon"], .woocommerce .button.wc-backward {
	background: #fff; color: var(--ll-primary); border-color: var(--ll-primary);
}
.woocommerce button[name="update_cart"]:hover, .woocommerce button[name="apply_coupon"]:hover, .woocommerce .button.wc-backward:hover {
	background: var(--ll-primary-soft); color: var(--ll-primary-dark); box-shadow: none;
}
.woocommerce button[name="update_cart"]:disabled { opacity: .5; }

/* ==========================================================================
   6. ช่องจำนวนสินค้า (+/-) — รองรับ 1,000+ ไม่ล้น ไม่ถูกตัด
   ========================================================================== */
.woocommerce .quantity, .quantity {
	display: inline-flex; align-items: stretch; vertical-align: middle; flex: 0 0 auto;
	height: var(--ll-control-h); background: #fff; border: 1px solid var(--ll-border); border-radius: var(--ll-radius-sm); overflow: hidden;
}
.woocommerce .quantity.hidden, .quantity.hidden { display: none; }
.woocommerce .quantity .qty, .quantity .qty {
	width: 5.2em; min-width: 4.6em; max-width: none; height: 100%; min-height: 0; margin: 0; padding: 0 4px;
	font: inherit; font-size: 1rem; font-weight: 700; font-variant-numeric: tabular-nums; text-align: center;
	border: 0; border-radius: 0; background: transparent; box-shadow: none;
	-moz-appearance: textfield; appearance: textfield;
}
.quantity .qty::-webkit-outer-spin-button, .quantity .qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.quantity .qty:focus { outline: 0; background: var(--ll-primary-soft); }
.quantity .ll-qty-btn {
	flex: 0 0 42px; width: 42px; min-height: 0; padding: 0; border: 0; border-radius: 0;
	font-size: 1.25rem; font-weight: 700; line-height: 1; color: var(--ll-text); background: var(--ll-alt); box-shadow: none;
}
.quantity .ll-qty-btn:hover { background: var(--ll-primary-soft); color: var(--ll-primary); box-shadow: none; border: 0; }
.quantity .ll-qty-btn:active { background: #dbe6ff; }
.quantity .ll-qty-minus { border-right: 1px solid var(--ll-border); }
.quantity .ll-qty-plus { border-left: 1px solid var(--ll-border); }

/* Cart / Checkout แบบ Blocks (WooCommerce 10 ใช้เป็นค่าเริ่มต้น) */
.wc-block-components-quantity-selector { min-width: 9.5rem; height: 44px; border-radius: var(--ll-radius-sm); }
.wc-block-components-quantity-selector input.wc-block-components-quantity-selector__input { min-width: 3.8em; font-size: 1rem; font-weight: 700; font-variant-numeric: tabular-nums; padding: 0 2px; }
.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button { min-width: 2.6em; }
.wc-block-components-button:not(.is-link) { min-height: var(--ll-control-h); border-radius: var(--ll-radius-sm); font-weight: 700; }
.wc-block-components-product-name { font-weight: 700; }

/* ==========================================================================
   7. WooCommerce — กริดสินค้า
   ========================================================================== */
.woocommerce-breadcrumb { color: var(--ll-muted); font-size: .9rem; margin: 0 0 20px; }
.woocommerce-breadcrumb a { color: var(--ll-muted); }
.woocommerce-products-header { margin-bottom: 20px; }
.woocommerce-products-header__title { margin-top: 0; }
.woocommerce-result-count, .woocommerce-ordering { margin: 0 0 24px; font-size: .95rem; color: var(--ll-muted); }
.woocommerce-ordering select { width: auto; min-width: 200px; }

/* กริดสินค้า: ใช้ flex + ตัวแปร --cols เพื่อให้แถวที่ไม่เต็มจัดกึ่งกลาง (ไม่ชิดซ้ายเหลือช่องว่าง)
   และบังคับความกว้างการ์ดทับกฎ % ของ WooCommerce (เช่น columns-3 = 30.75%, มือถือ = 48%) */
.woocommerce ul.products, .woocommerce-page ul.products {
	--cols: 4; --gap: 24px;
	display: flex; flex-wrap: wrap; justify-content: center; gap: var(--gap);
	margin: 0 0 30px; padding: 0; list-style: none; clear: both;
}
.woocommerce ul.products.columns-1 { --cols: 1; }
.woocommerce ul.products.columns-2 { --cols: 2; }
.woocommerce ul.products.columns-3 { --cols: 3; }
.woocommerce ul.products.columns-5 { --cols: 5; }
.woocommerce ul.products.columns-6 { --cols: 6; }
.woocommerce ul.products::before, .woocommerce ul.products::after { display: none; content: none; }
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product,
.woocommerce ul.products[class*="columns-"] li.product, .woocommerce-page ul.products[class*="columns-"] li.product,
.woocommerce[class*="columns-"] ul.products li.product, .woocommerce-page[class*="columns-"] ul.products li.product {
	position: relative; float: none !important; clear: none !important; margin: 0 !important;
	flex: 0 0 calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols) - .5px);
	width: calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols) - .5px) !important; max-width: 100%; min-width: 0; padding: 0 0 18px;
	display: flex; flex-direction: column; text-align: left;
	background: #fff; border: 1px solid var(--ll-border); border-radius: var(--ll-radius); overflow: hidden;
	box-shadow: var(--ll-shadow); transition: box-shadow .2s, transform .2s;
}
.woocommerce ul.products li.product:hover { box-shadow: var(--ll-shadow-hover); transform: translateY(-2px); }
.woocommerce ul.products li.product a { text-decoration: none; }
.woocommerce ul.products li.product a img { width: 100%; margin: 0 0 14px; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 0; box-shadow: none; }
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	padding: 0 16px; margin: 0 0 6px; font-size: 1rem; line-height: 1.45; font-weight: 700; color: var(--ll-text);
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.9em;
}
.woocommerce ul.products li.product .star-rating { margin: 0 16px 6px; }
.woocommerce ul.products li.product .price { display: block; padding: 0 16px; margin: 0 0 14px; font-size: 1.1rem; font-weight: 800; color: var(--ll-primary-dark); }
.woocommerce ul.products li.product .price del { color: var(--ll-muted); font-weight: 400; font-size: .9rem; opacity: 1; }
.woocommerce ul.products li.product .price ins { text-decoration: none; background: transparent; }
.woocommerce ul.products li.product .button, .woocommerce ul.products li.product .added_to_cart {
	margin: auto 16px 0; width: calc(100% - 32px); min-height: 44px; padding: 0 12px;
}
.woocommerce ul.products li.product .added_to_cart { margin-top: 8px; }
.woocommerce span.onsale {
	position: absolute; top: 12px; left: 12px; right: auto; margin: 0; z-index: 2;
	min-width: 0; min-height: 0; padding: 6px 12px; border-radius: 999px; line-height: 1.2; font-size: .85rem; font-weight: 700;
	background: var(--ll-accent); color: #fff;
}

@media (max-width: 1024px) {
	.woocommerce ul.products, .woocommerce ul.products[class*="columns-"] { --cols: 3; }
}
@media (max-width: 768px) {
	.woocommerce ul.products, .woocommerce ul.products[class*="columns-"] { --cols: 2; --gap: 14px; }
	.woocommerce ul.products li.product .woocommerce-loop-product__title { padding: 0 12px; font-size: .95rem; }
	.woocommerce ul.products li.product .price { padding: 0 12px; font-size: 1rem; }
	.woocommerce ul.products li.product .button, .woocommerce ul.products li.product .added_to_cart { margin: auto 12px 0; width: calc(100% - 24px); }
	.woocommerce-result-count, .woocommerce-ordering { float: none; width: 100%; }
	.woocommerce-ordering select { width: 100%; }
}

/* ==========================================================================
   8. WooCommerce — หน้าสินค้าเดี่ยว
   ========================================================================== */
.single-product div.product { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px 44px; position: relative; }
@media (min-width: 769px) { .single-product div.product { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.single-product div.product > * { min-width: 0; }
.single-product div.product div.images, .single-product div.product div.summary { float: none; width: 100%; margin: 0; }
.single-product div.product .woocommerce-tabs, .single-product div.product .related, .single-product div.product .upsells { grid-column: 1 / -1; width: 100%; }
.single-product div.product div.images img { border-radius: var(--ll-radius); }
.single-product div.product .product_title { margin: 0 0 10px; }
.single-product div.product p.price, .single-product div.product span.price { display: block; margin: 0 0 18px; font-size: 1.6rem; font-weight: 800; color: var(--ll-primary-dark); }
.single-product div.product p.price del { color: var(--ll-muted); font-weight: 400; font-size: 1.1rem; }
.single-product div.product p.price ins { text-decoration: none; }
.woocommerce-product-details__short-description { color: var(--ll-muted); margin-bottom: 20px; }
.single-product .woocommerce-product-gallery__trigger { top: 14px; right: 14px; }
.single-product .flex-control-thumbs { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin: 12px 0 0; padding: 0; list-style: none; }
.single-product .flex-control-thumbs li { width: auto; float: none; }
.single-product .flex-control-thumbs img { border-radius: var(--ll-radius-sm); border: 2px solid transparent; opacity: .7; }
.single-product .flex-control-thumbs img.flex-active, .single-product .flex-control-thumbs img:hover { border-color: var(--ll-primary); opacity: 1; }

/* ช่องจำนวน + ปุ่มหยิบใส่ตะกร้า อยู่บรรทัดเดียวกัน สูงเท่ากัน */
.single-product form.cart:not(.variations_form), .single-product .woocommerce-variation-add-to-cart { display: flex; flex-wrap: wrap; align-items: stretch; gap: 12px; margin: 0 0 24px; }
.single-product form.cart .single_add_to_cart_button { flex: 1 1 200px; min-width: 180px; margin: 0; }
.single-product form.cart .quantity { margin: 0; }
.single-product table.variations { width: 100%; margin-bottom: 14px; border: 0; }
.single-product table.variations th, .single-product table.variations td { display: block; padding: 0 0 6px; border: 0; text-align: left; background: transparent; }
.single-product table.variations select { width: 100%; }
.single-product .reset_variations { display: inline-block; margin-top: 6px; font-size: .9rem; }
.single-product .product_meta { padding-top: 16px; border-top: 1px solid var(--ll-border); color: var(--ll-muted); font-size: .92rem; }
.single-product .product_meta > span { display: block; margin-bottom: 4px; }

.woocommerce-tabs ul.tabs { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 -1px; padding: 0; list-style: none; border-bottom: 1px solid var(--ll-border); overflow: visible; }
.woocommerce-tabs ul.tabs::before, .woocommerce-tabs ul.tabs::after { display: none; }
.woocommerce-tabs ul.tabs li { margin: 0; padding: 0; border: 1px solid var(--ll-border); border-bottom: 0; border-radius: var(--ll-radius-sm) var(--ll-radius-sm) 0 0; background: var(--ll-alt); }
.woocommerce-tabs ul.tabs li::before, .woocommerce-tabs ul.tabs li::after { display: none; }
.woocommerce-tabs ul.tabs li a { display: block; padding: 12px 20px; font-weight: 700; color: var(--ll-muted); text-decoration: none; }
.woocommerce-tabs ul.tabs li.active { background: #fff; position: relative; }
.woocommerce-tabs ul.tabs li.active a { color: var(--ll-primary); }
.woocommerce-tabs .panel { margin: 0; padding: 24px 0 0; }
.related.products > h2, .upsells.products > h2 { margin-top: 10px; }

/* ทับกฎเฉพาะเจาะจงสูงของ WooCommerce (ตัวเติม clearfix ::before/::after กลายเป็นช่องว่างใน flex, แท็บสีเดิมของ Woo) */
.woocommerce div.product form.cart::before, .woocommerce div.product form.cart::after,
.woocommerce div.product .woocommerce-variation-add-to-cart::before, .woocommerce div.product .woocommerce-variation-add-to-cart::after { display: none; content: none; }
.woocommerce div.product form.cart div.quantity { float: none; margin: 0; }
.woocommerce div.product form.cart .button { float: none; margin: 0; }
.woocommerce div.product .woocommerce-tabs ul.tabs { padding: 0; margin: 0 0 -1px; }
.woocommerce div.product .woocommerce-tabs ul.tabs::before { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li { margin: 0; background: var(--ll-alt); border: 1px solid var(--ll-border); border-bottom: 0; border-radius: var(--ll-radius-sm) var(--ll-radius-sm) 0 0; }
.woocommerce div.product .woocommerce-tabs ul.tabs li::before, .woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active { background: #fff; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { padding: 12px 20px; color: var(--ll-muted); font-weight: 700; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--ll-primary); }

/* ==========================================================================
   9. WooCommerce — ตาราง ตะกร้า ชำระเงิน บัญชี
   ========================================================================== */
.woocommerce table.shop_table, .woocommerce table.shop_attributes, .woocommerce-page table.shop_table {
	width: 100%; border: 1px solid var(--ll-border); border-radius: var(--ll-radius); border-collapse: separate; border-spacing: 0; overflow: hidden; margin: 0 0 24px; background: #fff;
}
.woocommerce table.shop_table th, .woocommerce table.shop_table td, .woocommerce table.shop_attributes th, .woocommerce table.shop_attributes td {
	padding: 14px 16px; text-align: left; vertical-align: middle; border: 0; border-top: 1px solid var(--ll-border); line-height: 1.5; background: transparent;
}
.woocommerce table.shop_table thead th { background: var(--ll-alt); border-top: 0; font-size: .92rem; font-weight: 700; color: var(--ll-text); white-space: nowrap; }
.woocommerce table.shop_table tbody tr:nth-child(even) td { background: #fbfcfe; }
.woocommerce table.shop_table tfoot th { background: var(--ll-alt); }
.woocommerce table.shop_table tfoot tr:last-child th, .woocommerce table.shop_table tfoot tr:last-child td { font-weight: 800; font-size: 1.1rem; color: var(--ll-primary-dark); }
.woocommerce table.shop_attributes th { width: 30%; background: var(--ll-alt); font-weight: 700; }
.woocommerce table.shop_attributes td p { margin: 0; }

/* ตะกร้า (shortcode) */
.woocommerce-cart-form table.cart td.product-thumbnail { width: 96px; }
.woocommerce-cart-form table.cart img { width: 76px; height: 76px; object-fit: cover; border-radius: var(--ll-radius-sm); display: block; }
.woocommerce-cart-form table.cart td.product-name a { font-weight: 700; color: var(--ll-text); }
.woocommerce-cart-form table.cart td.product-quantity { min-width: 170px; }
.woocommerce-cart-form table.cart td.product-price, .woocommerce-cart-form table.cart td.product-subtotal { white-space: nowrap; font-variant-numeric: tabular-nums; }
.woocommerce-cart-form table.cart td.product-remove { width: 48px; text-align: center; padding-left: 8px; padding-right: 8px; }
.woocommerce a.remove { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; font-size: 1.3rem; line-height: 1; color: var(--ll-accent) !important; background: #fff1f3; border-radius: 50%; }
.woocommerce a.remove:hover { background: var(--ll-accent); color: #fff !important; }
.woocommerce-cart-form table.cart td.actions { padding: 16px; background: var(--ll-alt); }
.woocommerce-cart-form table.cart td.actions::after { content: ""; display: block; clear: both; }
.woocommerce-cart-form table.cart td.actions .coupon { float: left; display: flex; gap: 10px; flex-wrap: wrap; }
.woocommerce-cart-form table.cart td.actions .coupon .input-text { width: 200px; margin: 0; }
.woocommerce-cart-form table.cart td.actions > .button { float: right; }
.cart-collaterals { display: block; }
.woocommerce .cart-collaterals .cart_totals, .woocommerce-page .cart-collaterals .cart_totals { float: none; width: 100%; max-width: 480px; margin-left: auto; }
.cart_totals h2 { font-size: 1.3rem; margin-top: 0; }
.wc-proceed-to-checkout .checkout-button { display: flex; width: 100%; font-size: 1.05rem; min-height: 54px; }

/* ชำระเงิน */
.woocommerce form .form-row { margin: 0 0 16px; padding: 0; }
.woocommerce form .form-row label { display: block; margin-bottom: 6px; line-height: 1.4; }
.woocommerce form .form-row .required { color: var(--ll-accent); }
.woocommerce form .form-row-first, .woocommerce form .form-row-last { width: calc(50% - 8px); }
.woocommerce form .form-row-first { float: left; }
.woocommerce form .form-row-last { float: right; }
.woocommerce form .form-row-wide { clear: both; }
.woocommerce-checkout h3 { margin-top: 0; font-size: 1.3rem; }
.woocommerce-checkout #order_review { padding: 20px; border: 2px solid var(--ll-primary-soft); border-radius: var(--ll-radius); background: #fff; }
.woocommerce-checkout #payment { background: var(--ll-alt); border-radius: var(--ll-radius); }
.woocommerce-checkout #payment ul.payment_methods { padding: 16px; border-bottom: 1px solid var(--ll-border); }
.woocommerce-checkout #payment div.payment_box { background: #fff; border-radius: var(--ll-radius-sm); }
.woocommerce-checkout #payment div.payment_box::before { display: none; }
.woocommerce-checkout #payment div.form-row { padding: 16px; }
.woocommerce-checkout #place_order { width: 100%; min-height: 54px; font-size: 1.05rem; float: none; }
@media (min-width: 901px) {
	.woocommerce-checkout form.checkout { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 0 36px; align-items: start; }
	.woocommerce-checkout form.checkout #customer_details { grid-column: 1; grid-row: 1 / span 3; float: none; width: 100%; }
	.woocommerce-checkout form.checkout #customer_details .col-1, .woocommerce-checkout form.checkout #customer_details .col-2 { float: none; width: 100%; }
	.woocommerce-checkout form.checkout #order_review_heading { grid-column: 2; grid-row: 1; margin: 0 0 12px; }
	.woocommerce-checkout form.checkout #order_review { grid-column: 2; grid-row: 2; }
}

/* บัญชีผู้ใช้ */
.woocommerce-account .woocommerce { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; }
@media (min-width: 901px) { .woocommerce-account.logged-in .woocommerce { grid-template-columns: 240px minmax(0, 1fr); } }
.woocommerce-MyAccount-navigation, .woocommerce-account .woocommerce-MyAccount-content { float: none; width: 100%; }
.woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 8px; background: var(--ll-alt); border-radius: var(--ll-radius); }
.woocommerce-MyAccount-navigation a { display: block; padding: 12px 14px; font-weight: 600; color: var(--ll-text); border-radius: var(--ll-radius-sm); text-decoration: none; }
.woocommerce-MyAccount-navigation .is-active a, .woocommerce-MyAccount-navigation a:hover { background: var(--ll-primary); color: #fff; }

/* ข้อความแจ้งเตือน */
.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-notice {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px;
	margin: 0 0 24px; padding: 14px 18px 14px 20px; border: 1px solid var(--ll-border); border-left-width: 4px; border-radius: var(--ll-radius-sm); background: var(--ll-alt); color: var(--ll-text);
}
.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before { display: none; }
.woocommerce-message { border-left-color: var(--ll-success); background: #f0fdf4; }
.woocommerce-info { border-left-color: var(--ll-primary); background: var(--ll-primary-soft); }
.woocommerce-error { border-left-color: var(--ll-accent); background: #fff1f3; list-style: none; }
.woocommerce-message .button, .woocommerce-info .button { order: 2; }

/* มือถือ: ตะกร้าแบบการ์ด (Woo เปลี่ยนแถวเป็นบล็อกเองที่ <=768px) */
@media (max-width: 768px) {
	.woocommerce table.shop_table_responsive tr, .woocommerce-page table.shop_table_responsive tr { display: block; padding: 8px 0; }
	.woocommerce table.shop_table_responsive tr td, .woocommerce-page table.shop_table_responsive tr td { display: flex; align-items: center; justify-content: space-between; gap: 12px; text-align: right !important; border-top: 1px solid var(--ll-border); }
	.woocommerce table.shop_table_responsive tr td::before { content: attr(data-title) ": "; float: none; font-weight: 700; color: var(--ll-muted); text-align: left; }
	.woocommerce table.shop_table_responsive tr td.product-remove::before, .woocommerce table.shop_table_responsive tr td.product-thumbnail::before, .woocommerce table.shop_table_responsive tr td.actions::before { display: none; }
	.woocommerce table.shop_table_responsive tr td.product-thumbnail { justify-content: center; width: auto; }
	.woocommerce table.shop_table_responsive tr td.product-remove { justify-content: flex-end; }
	.woocommerce-cart-form table.cart td.product-quantity { min-width: 0; }
	.woocommerce-cart-form table.cart td.actions { display: block; text-align: left !important; }
	.woocommerce-cart-form table.cart td.actions .coupon { float: none; width: 100%; margin-bottom: 12px; }
	.woocommerce-cart-form table.cart td.actions .coupon .input-text { flex: 1 1 140px; width: auto; }
	.woocommerce-cart-form table.cart td.actions .coupon .button, .woocommerce-cart-form table.cart td.actions > .button { width: 100%; float: none; }
	.woocommerce .cart-collaterals .cart_totals { max-width: none; }
	.woocommerce form .form-row-first, .woocommerce form .form-row-last { width: 100%; float: none; }
	.woocommerce-tabs ul.tabs { flex-direction: column; border: 0; gap: 4px; }
	.woocommerce-tabs ul.tabs li { border: 1px solid var(--ll-border); border-radius: var(--ll-radius-sm); }
	.single-product form.cart .single_add_to_cart_button { flex-basis: 100%; }
	.woocommerce table.shop_attributes th { width: 38%; }
}

/* ==========================================================================
   10. Footer
   ========================================================================== */
.site-footer { background: #0f172a; color: #cbd5e1; padding: 52px 0 24px; }
.site-footer a { color: #fff; }
.footer-widgets { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 30px; margin-bottom: 30px; }
.site-footer .widget-area .widget, .footer-widgets .widget { background: transparent; padding: 0; margin: 0; }
.site-footer .widget-title { color: #fff; border-color: #334155; }
.site-footer .widget-area li { border-color: #334155; }
.site-info { border-top: 1px solid #334155; padding-top: 20px; font-size: .9rem; text-align: center; }