/*
 * NGỌC LAN — WooCommerce (chỉ nạp ở cửa hàng, danh mục, sản phẩm, giỏ hàng, thanh toán, tài khoản).
 * Cửa hàng & sản phẩm: CSS của theme (đã gỡ CSS mặc định của WooCommerce). Giỏ hàng/thanh toán: giữ CSS gốc + chỉnh nhẹ.
 */

/* Thanh công cụ cửa hàng */
.nl-shopbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--nl-s-3); margin-bottom: var(--nl-s-6); }
.nl-shopbar .woocommerce-result-count { margin: 0; font-size: var(--nl-fs-sm); color: var(--nl-ink-2); }
.nl-shopbar .woocommerce-ordering { margin: 0; }
.nl-shopbar select { min-height: var(--nl-tap); padding: 0 40px 0 14px; border: var(--nl-border); border-radius: var(--nl-r-pill); background: var(--nl-white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2314213D' stroke-width='1.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center / 16px; appearance: none; -webkit-appearance: none; font-size: var(--nl-fs-sm); }
.nl-phero__chips .nl-chips { margin-top: var(--nl-s-5); }
ul.products { list-style: none; margin: 0; padding: 0; }
.nl-grid--products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 1024px) { .nl-grid--products { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.nl-pcard .button { margin-top: auto; }
.nl-pcard .added_to_cart { display: inline-flex; justify-content: center; min-height: var(--nl-tap); align-items: center; font-size: var(--nl-fs-sm); font-weight: var(--nl-fw-semibold); }
.nl-pcard .button.loading { opacity: 0.6; }
.nl-pcard .button.added::after { content: " ✓"; }
.nl-shopnote { display: grid; gap: var(--nl-s-4); align-items: center; margin: var(--nl-s-12) 0 var(--nl-s-4); padding: var(--nl-s-6); border-radius: var(--nl-r-lg); background: var(--nl-clinical-soft); }
.nl-shopnote p { margin: 0; color: var(--nl-ink-2); }
@media (min-width: 768px) { .nl-shopnote { grid-template-columns: 1fr auto; } }
.nl-disclaimer { display: flex; gap: var(--nl-s-2); align-items: flex-start; }
.nl-disclaimer .nl-ico { width: 16px; height: 16px; flex: none; margin-top: 3px; }

/* Trang sản phẩm */
.nl-shop .nl-crumbs--shop { margin: var(--nl-s-6) 0; }
.nl-shop div.product { display: grid; gap: var(--nl-s-8); padding-bottom: var(--nl-section); }
@media (min-width: 1024px) { .nl-shop div.product { grid-template-columns: 1fr 1fr; gap: var(--nl-s-12); align-items: start; } .nl-shop div.product > .nl-pdetail, .nl-shop div.product > .nl-previews, .nl-shop div.product > .related, .nl-shop div.product > .up-sells { grid-column: 1 / -1; } }
.woocommerce-product-gallery { position: relative; margin: 0; opacity: 1 !important; }
.woocommerce-product-gallery__wrapper { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--nl-s-3); margin: 0; }
.woocommerce-product-gallery__image { border-radius: var(--nl-r-lg); overflow: hidden; background: var(--nl-silk-2); border: var(--nl-border); }
.woocommerce-product-gallery__image:first-child { grid-column: 1 / -1; }
.woocommerce-product-gallery__image img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; }
.woocommerce-product-gallery__trigger { display: none; }
.nl-shop .summary { display: grid; gap: var(--nl-s-4); align-content: start; }
@media (min-width: 1024px) { .nl-shop .summary { position: sticky; top: calc(var(--nl-header-h) + 24px); } }
.nl-shop .product_title { font-size: var(--nl-fs-2xl); font-weight: var(--nl-fw-regular); margin: 0; }
.nl-shop .summary .price { margin: 0; font-family: var(--nl-font-display); font-size: var(--nl-fs-xl); color: var(--nl-navy); }
.nl-shop .summary .price del { color: var(--nl-ink-2); font-size: var(--nl-fs-md); margin-right: var(--nl-s-2); }
.nl-shop .summary .price ins { text-decoration: none; }
.nl-shop .woocommerce-product-rating { display: flex; gap: var(--nl-s-2); align-items: center; font-size: var(--nl-fs-sm); }
.nl-shop .woocommerce-review-link { color: var(--nl-ink-2); }
.nl-shop .woocommerce-product-details__short-description { color: var(--nl-ink-2); }
.nl-shop .woocommerce-product-details__short-description p { margin: 0; }
.nl-pfacts { display: grid; grid-template-columns: repeat(3, auto); justify-content: start; gap: var(--nl-s-6); padding: var(--nl-s-4) 0; border-block: var(--nl-border); }
.nl-pfacts div { display: grid; }
.nl-pfacts dt { font-size: var(--nl-fs-xs); color: var(--nl-ink-2); text-transform: uppercase; letter-spacing: 0.06em; }
.nl-pfacts dd { font-weight: var(--nl-fw-semibold); font-size: var(--nl-fs-sm); }
.nl-shop form.cart { display: flex; flex-wrap: wrap; gap: var(--nl-s-3); margin: 0; }
.nl-shop .quantity { display: inline-flex; }
.nl-shop .quantity .qty { width: 84px; min-height: 52px; padding: 0 var(--nl-s-3); border: 1px solid #CFC9C0; border-radius: var(--nl-r-pill); text-align: center; font-size: var(--nl-fs-md); }
.nl-shop .single_add_to_cart_button, .woocommerce .button, .woocommerce button.button, .woocommerce a.button { display: inline-flex; align-items: center; justify-content: center; gap: var(--nl-s-2); min-height: 52px; padding: 0 var(--nl-s-8); border: 1px solid var(--nl-navy); border-radius: var(--nl-r-pill); background: var(--nl-navy); color: var(--nl-white); font-weight: var(--nl-fw-semibold); font-size: var(--nl-fs-base); text-decoration: none; cursor: pointer; }
.nl-shop .single_add_to_cart_button { flex: 1; }
.nl-shop .single_add_to_cart_button:hover, .woocommerce .button:hover { background: var(--nl-navy-2); color: var(--nl-white); }
.nl-pcard .button { min-height: var(--nl-tap); padding: 0 var(--nl-s-4); font-size: var(--nl-fs-sm); background: transparent; color: var(--nl-navy); }
.nl-pcard .button:hover { background: var(--nl-navy); color: var(--nl-white); }
.nl-ptrust { list-style: none; display: grid; gap: var(--nl-s-2); padding: var(--nl-s-4); border-radius: var(--nl-r-md); background: var(--nl-white); border: var(--nl-border-gold); font-size: var(--nl-fs-sm); }
.nl-ptrust li { display: flex; gap: var(--nl-s-2); align-items: center; }
.nl-ptrust .nl-ico { width: 18px; height: 18px; color: var(--nl-champagne-ink); }
.stock { margin: 0; font-size: var(--nl-fs-sm); color: var(--nl-ok); }
.stock.out-of-stock { color: var(--nl-err); }

.nl-pdetail { display: grid; gap: var(--nl-s-8); padding-top: var(--nl-s-10); border-top: var(--nl-border); }
@media (min-width: 1024px) { .nl-pdetail { grid-template-columns: minmax(0, 1fr) 340px; gap: var(--nl-s-12); } }
.nl-pdetail__main .nl-h2 { margin-top: var(--nl-s-8); }
.nl-pdetail__main .nl-h2:first-child { margin-top: 0; }
.nl-pdetail__side { display: grid; gap: var(--nl-s-5); align-content: start; }
.nl-docnote { padding: var(--nl-s-6); border-radius: var(--nl-r-lg); background: var(--nl-white); border: var(--nl-border-gold); }
.nl-docnote blockquote p { font-family: var(--nl-font-display); font-style: italic; font-size: var(--nl-fs-md); }
.nl-docnote__who { display: flex; gap: var(--nl-s-3); align-items: center; text-decoration: none; color: var(--nl-navy); font-size: var(--nl-fs-xs); }
.nl-docnote__who img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; }
.nl-docnote__who span { display: grid; color: var(--nl-ink-2); }
.nl-docnote__who strong { color: var(--nl-navy); font-size: var(--nl-fs-sm); }
.nl-pwith { padding: var(--nl-s-5); border-radius: var(--nl-r-lg); background: var(--nl-clinical-soft); }
.nl-pwith__title { margin: 0 0 var(--nl-s-2); font-weight: var(--nl-fw-semibold); }
.nl-pwith ul { list-style: none; display: grid; }
.nl-pwith a { display: flex; gap: var(--nl-s-2); align-items: center; min-height: 40px; color: var(--nl-clinical-ink); font-weight: var(--nl-fw-medium); }
.nl-pwith .nl-ico { width: 18px; height: 18px; }

/* Đánh giá */
.nl-previews { padding-top: var(--nl-s-10); border-top: var(--nl-border); }
.nl-previews .woocommerce-Reviews-title { font-size: var(--nl-fs-xl); }
.nl-previews .commentlist { list-style: none; display: grid; gap: var(--nl-s-4); margin-bottom: var(--nl-s-8); }
.nl-previews .comment_container { display: flex; gap: var(--nl-s-4); padding: var(--nl-s-5); border: var(--nl-border); border-radius: var(--nl-r-md); background: var(--nl-white); }
.nl-previews .avatar { width: 48px; height: 48px; border-radius: 50%; }
.nl-previews .comment-text { flex: 1; }
.nl-previews .meta { font-size: var(--nl-fs-sm); color: var(--nl-ink-2); margin-bottom: var(--nl-s-2); }
.nl-previews .woocommerce-review__author { color: var(--nl-navy); }
.nl-previews .woocommerce-review__verified { color: var(--nl-ok); font-style: normal; font-size: var(--nl-fs-xs); }
.nl-previews .description p { margin: 0; }
.star-rating { position: relative; display: inline-block; width: 5.4em; height: 1em; overflow: hidden; font-size: 14px; line-height: 1; letter-spacing: 0.1em; }
.star-rating::before { content: "★★★★★"; color: var(--nl-silk); position: absolute; left: 0; top: 0; }
.star-rating span { position: absolute; left: 0; top: 0; overflow: hidden; padding-top: 1.5em; }
.star-rating span::before { content: "★★★★★"; color: var(--nl-champagne-ink); position: absolute; left: 0; top: 0; }
.comment-form { display: grid; gap: var(--nl-s-4); max-width: 640px; }
.comment-form label { display: block; font-weight: var(--nl-fw-semibold); font-size: var(--nl-fs-sm); margin-bottom: 6px; }
.comment-form input[type=text], .comment-form input[type=email], .comment-form textarea, .comment-form select { width: 100%; min-height: 48px; padding: 12px 14px; border: 1px solid #CFC9C0; border-radius: var(--nl-r-md); background: var(--nl-white); }
.comment-form .stars a { display: inline-flex; min-width: 36px; min-height: 36px; align-items: center; justify-content: center; }
.comment-form .form-submit input { min-height: 48px; padding: 0 var(--nl-s-6); border: 0; border-radius: var(--nl-r-pill); background: var(--nl-navy); color: var(--nl-white); font-weight: var(--nl-fw-semibold); cursor: pointer; }
#reply-title { font-family: var(--nl-font-display); font-size: var(--nl-fs-lg); display: block; margin-bottom: var(--nl-s-3); }

.related.products > h2, .up-sells > h2 { font-size: var(--nl-fs-xl); margin-bottom: var(--nl-s-6); }
.related.products ul.products { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--nl-s-4); }
@media (min-width: 1024px) { .related.products ul.products { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--nl-s-6); } }

/* Thông báo */
.woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-message, .woocommerce-info, .woocommerce-error { list-style: none; display: flex; flex-wrap: wrap; gap: var(--nl-s-3); align-items: center; justify-content: space-between; margin: 0 0 var(--nl-s-6); padding: var(--nl-s-4) var(--nl-s-5); border-radius: var(--nl-r-md); background: var(--nl-ok-soft); color: var(--nl-ok); border: 0; font-size: var(--nl-fs-sm); }
.woocommerce-info { background: var(--nl-clinical-soft); color: var(--nl-clinical-ink); }
.woocommerce-error { background: var(--nl-err-soft); color: var(--nl-err); }
.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before { display: none; }
.woocommerce-message .button, .woocommerce-info .button { min-height: 40px; padding: 0 var(--nl-s-4); font-size: var(--nl-fs-sm); order: 2; float: none; }

/* Giỏ hàng / thanh toán / tài khoản (CSS gốc của WooCommerce + chỉnh theo nhận diện) */
.nl-wcpage { padding-bottom: var(--nl-section); }
.nl-wcpage table.shop_table { border: var(--nl-border); border-radius: var(--nl-r-lg); background: var(--nl-white); border-collapse: separate; }
.nl-wcpage table.shop_table th { font-size: var(--nl-fs-xs); text-transform: uppercase; letter-spacing: 0.06em; color: var(--nl-ink-2); }
.nl-wcpage .cart_totals h2, .nl-wcpage #order_review_heading, .nl-wcpage .woocommerce-billing-fields h3, .nl-wcpage .woocommerce-additional-fields h3 { font-size: var(--nl-fs-lg); }
.nl-wcpage .input-text, .nl-wcpage select, .nl-wcpage textarea { min-height: 48px; padding: 12px 14px; border: 1px solid #CFC9C0; border-radius: var(--nl-r-md); background: var(--nl-white); width: 100%; }
.nl-wcpage .form-row label { font-weight: var(--nl-fw-semibold); font-size: var(--nl-fs-sm); }
.nl-wcpage #payment { background: var(--nl-silk-2); border-radius: var(--nl-r-lg); }
.nl-wcpage #place_order { width: 100%; min-height: 56px; }
.nl-wcpage .woocommerce-privacy-policy-text { font-size: var(--nl-fs-xs); color: var(--nl-ink-2); }
.nl-wcpage .coupon .input-text { width: auto; }
@media (min-width: 1024px) { .nl-wcpage form.checkout { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 0 var(--nl-s-12); } .nl-wcpage form.checkout #customer_details { grid-row: span 2; } .nl-wcpage #customer_details .col-1, .nl-wcpage #customer_details .col-2 { float: none; width: 100%; } }