/*
 * LALUZ UI Patch — MODULE STOCK-STATE (CSS)
 *
 * Nhắc lại: WPCode 23020 in SAU file này, nên mọi rule phải prefix "html body"
 * + !important. Xem ghi chú đầy đủ trong laluz-ui-patch.php.
 *
 * ─────────────────────────────────────────────────────────────────────────────
 * VÌ SAO ĐỔI MÀU NÚT "HẾT HÀNG" TỪ ĐỎ SANG TRUNG TÍNH
 * ─────────────────────────────────────────────────────────────────────────────
 * Rule gốc nằm ở mona-custom.css (styleSheets[25]), không phải WPCode:
 *   .btn-list-variable .btn.btn-out-stock,
 *   .btn-list-simple   .btn.btn-out-stock { background: red; color: #fff; ... }
 * Đo được: background rgb(255, 0, 0) — ĐỎ NGUYÊN, rộng 576px, cao 48px.
 *
 * Đó là vệt màu bão hoà nhất trên toàn bộ PDP, nằm ngay dưới khối giá của một
 * chai 1.750.000₫. Bảng màu thật của site không có đỏ (§2.2: paper / tile / ink
 * / soft / grey / line / brass), và §2.4 đã chốt nút không bo góc, không bóng.
 * Một mảng #FF0000 chiếm nửa cột phải kéo tông cả trang xuống.
 *
 * Trạng thái hết hàng vẫn phải KHÔNG THỂ BỎ SÓT — nên giữ nguyên hình khối:
 * vẫn full-width, vẫn cao 48px, vẫn chữ hoa giãn chữ, chỉ đổi màu sang nền tile
 * + chữ ink + viền hairline. Đọc ra là "nút đã tắt", đúng nghĩa, không phải
 * "cảnh báo nguy hiểm".
 *
 * MUỐN QUAY LẠI MÀU ĐỎ: xoá đúng khối rule đầu tiên bên dưới. Phần JS dựng lại
 * khối cho PDP bị thiếu vẫn chạy độc lập, không phụ thuộc màu.
 * MUỐN TẮT CẢ MODULE:
 *   define( 'LALUZ_UI_PATCH_DISABLE_STOCK_STATE', true );
 */

/* ── 1. Đưa nút "Hết hàng" về hệ màu của site ──────────────────────────────
   Áp cho CẢ khối do theme dựng lẫn khối .lz-oos-block do JS của module dựng,
   nên hai PDP hết hàng bất kỳ luôn nhìn giống hệt nhau. */
html body .prod-dt-left .btn-list .btn.btn-out-stock,
html body .prod-dt-left .btn-list-variable .btn.btn-out-stock,
html body .prod-dt-left .btn-list-simple .btn.btn-out-stock,
html body .lz-oos-block .btn.btn-out-stock {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	min-height: 48px !important;
	padding: 12px 20px !important;

	background: var( --lz-tile, #EAE7DF ) !important;
	color: var( --lz-ink, #141310 ) !important;
	border: 1px solid var( --lz-line, #E3E1D9 ) !important;
	border-radius: 0 !important;
	box-shadow: none !important;

	font-family: var( --lz-sans, 'Be Vietnam Pro', sans-serif ) !important;
	font-size: 11.5px !important;
	font-weight: 500 !important;
	letter-spacing: .2em !important;
	text-transform: uppercase !important;
	cursor: default !important;
}

html body .prod-dt-left .btn.btn-out-stock .txt,
html body .lz-oos-block .btn.btn-out-stock .txt {
	color: inherit !important;
	font: inherit !important;
	letter-spacing: inherit !important;
}

/* ── 2. Khối do module dựng: đặt đúng nhịp dọc của khối mua hàng gốc ────── */
html body .prod-dt-left .lz-oos-block {
	display: block !important;
	width: 100% !important;
	margin: 4px 0 20px !important;
}

html body .prod-dt-left .lz-oos-block .btn-item {
	display: block !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* ── 3. PDP hết hàng: ô chọn dung tích rỗng thì đừng chừa khoảng trống ────
   Neo vào class .lz-oos-noopts do JS gắn, KHÔNG dùng :empty.
   Đo trên live: theme để lại một text node khoảng trắng bên trong
   <div class="box-options" id="monaAttriColor"> </div>
   nên :empty không bao giờ khớp và khối vẫn chiếm 21px chiều cao. */
html body.lz-oos .prod-dt-left .box-options.lz-oos-noopts {
	display: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
}