@charset "UTF-8";
/* =============================================================
   layout/shop.css — หน้าร้าน Red Bee (pages/shop_list.php · shop_product.php)
   ยกจาก tulamtharn เฉพาะบล็อกที่หน้าร้านข้อ 5.10.1 ใช้: .lt-shop-grid .lt-shop-card .lt-shop-gallery .lt-shop-buy (+ป้าย หัวรายการ)
   ส่วนตะกร้า/คำสั่งซื้อกลับมาเมื่อเปิด ORDERS [P2]
   โหลดเฉพาะหน้าร้านผ่าน layout_start(['styles' => ['layout/shop.css']])
   กติกาเดียวกับ app-theme.css: mobile-first · สีจากตัวแปร --lt-* ล้วน · ทุกอย่างที่กดได้สูง ≥ 44px
   ============================================================= */

/* ── หัวหน้ารายการ ─────────────────────────────────────── */

.lt-shop-head { gap: 8px; }
.lt-shop-head .lt-page__lead { margin-bottom: 4px; }
.lt-shop-head .lt-shop-contact { align-self: flex-start; }

.lt-shop-contact svg { flex: none; }

/* แถวปุ่มท้ายหน้า: ติดต่อร้าน · กลับ */
.lt-shop-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 24px 0 0;
}

/* ── ป้าย ──────────────────────────────────────────────── */

.lt-shop-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
}
.lt-shop-badges:empty { display: none; }

.lt-shop-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 2px 10px;
  border: 1px solid var(--lt-border-strong);
  border-radius: 999px;
  background: var(--lt-surface);
  color: var(--lt-ink);
  font-size: .875rem;   /* 14px อย่างน้อย — ป้ายสัตว์มีชีวิตและเหลือน้อยคือข้อมูลที่ต้องอ่านทัน (รีวิวหน้าจอ 14 ก.ย. 2569) */
  font-weight: 500;     /* แนว A: ป้ายน้ำหนัก 500 เท่า .lt-pill ของฐาน — จุดสีกับขอบบอกสถานะอยู่แล้ว */
  line-height: 1.6;
  white-space: nowrap;
}
.lt-shop-badge::before {
  content: "";
  flex: none;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--lt-shop-badge-color, var(--lt-border-strong));
}
/* .lt-shop-badge--live เลิกใช้ (แผนขัดเงา 2.5): "พร้อมส่ง" เป็น .lt-shop-card__state/.lt-shop-state จุดเขียว + คำ — ป้ายทับรูปเหลือเฉพาะ ใกล้หมด/หมด/จองแล้ว */
.lt-shop-badge--low  { --lt-shop-badge-color: var(--lt-warn);   border-color: var(--lt-warn); }
.lt-shop-badge--out  { --lt-shop-badge-color: var(--lt-danger); border-color: var(--lt-danger); }

.lt-shop-count {
  display: inline-block;
  min-width: 1.6em;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--lt-surface-2);
  color: var(--lt-muted);
  font-size: .8125rem;
  font-weight: 600;
  line-height: 1.6;
  text-align: center;
}

/* ── กริดสินค้า /shop ───────────────────────────────────── */

/* สองคอลัมน์ตั้งแต่จอ 360px — การ์ดแคบแต่รูปจัตุรัสยังเห็นปลาชัด ชื่อตัดสองบรรทัด */
.lt-shop-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.lt-shop-grid__item { margin: 0; }
.lt-shop-grid__item .lt-card { margin-top: 0; }

.lt-shop-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 0;
  overflow: hidden;
  color: var(--lt-ink);
  text-decoration: none;
  /* ยกตัว เงา ขอบตอนชี้มาจาก a.lt-card ของฐาน (ส่วน 2) — ที่นี่แค่ให้เวลาเดียวกับฐานเผื่อใช้กับแท็กอื่น */
  transition: transform var(--lt-dur) var(--lt-ease), border-color var(--lt-dur) var(--lt-ease), box-shadow var(--lt-dur) var(--lt-ease);
}
.lt-shop-card:hover { color: var(--lt-ink); border-color: var(--lt-border-strong); }
.lt-shop-card:focus-visible { outline: none; box-shadow: var(--lt-ring); }
/* สินค้าหมดยังกดดูได้ แต่รูปจางลงให้เห็นทันทีว่าซื้อไม่ได้ (ป้าย "สินค้าหมด" บอกเป็นคำด้วย) */
.lt-shop-card.is-out .lt-shop-card__img { opacity: .55; filter: grayscale(.6); }
/* รูปขยายนิดเดียวในกรอบตอนชี้ด้วยเมาส์ (กรอบ overflow: hidden ตัดขอบไว้) — จอสัมผัสไม่มี hover แท้ รูปจะค้างขยาย
   ลดการเคลื่อนไหว: ไม่ขยายเลย (ฐานตัดแค่เวลาทรานซิชัน ขนาดที่ขยายยังค้างอยู่ จึงต้องปิดที่นี่) */
@media (hover: hover) and (pointer: fine) {
  .lt-shop-card:hover .lt-shop-card__img { transform: scale(1.03); }
}
@media (prefers-reduced-motion: reduce) {
  .lt-shop-card:hover .lt-shop-card__img { transform: none; }
}

.lt-shop-card__media {
  position: relative;
  display: block;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: var(--lt-surface-2);
}
.lt-shop-card__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--lt-dur) var(--lt-ease), opacity var(--lt-dur) var(--lt-ease);
}
.lt-shop-card__noimg {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: var(--lt-primary);
  opacity: .8;
}
/* ป้ายบนรูป: พื้นการ์ดทึบ + เงาบาง แยกจากรูปถ่ายทุกโทน (ไม่ใช้กระจกฝ้าตามกติกาของเจ้าของ) */
.lt-shop-card__media .lt-shop-badge {
  position: absolute;
  top: 8px;
  left: 8px;
  max-width: calc(100% - 16px);
  overflow: hidden;
  text-overflow: ellipsis;
  box-shadow: var(--lt-shadow-sm);
}

.lt-shop-card__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 12px 14px 16px;
}
/* ชื่อสินค้าน้ำหนัก 500 ให้ราคาตัวมีหัวเป็นจุดเด่นของการ์ด */
.lt-shop-card__title {
  display: -webkit-box;
  overflow: hidden;
  font-size: .9375rem;
  font-weight: 500;
  line-height: 1.5;
  overflow-wrap: anywhere;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
/* ราคาในร้าน = ตัวเลข --lt-font-num + tabular-nums (กติกาส่วน 4 ของ app-theme.css · 1.2 — เดิมชี้ --lt-font-display ซึ่งค่าเท่ากัน) */
.lt-shop-card__price {
  font-family: var(--lt-font-num);
  font-variant-numeric: tabular-nums;
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: .01em;
  font-variant-numeric: tabular-nums;
}

/* ── หน้าสินค้า /shop/{id} ───────────────────────────────── */

.lt-shop-product {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.lt-shop-product__info {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
}
.lt-shop-product__info > .lt-note { margin: 0; }
.lt-shop-product__head {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
/* ลิงก์หมวดเหนือชื่อสินค้าเป็นชิปสูง 44px (เดิมข้อความเล็ก 22×17px กดยาก · ตรวจทานหน้าจอรอบสุดท้าย) */
.lt-shop-product__cat { margin: 0; }
.lt-shop-product__cat .lt-chip { font-size: .875rem; }
.lt-shop-product__title { margin: 0; }

.lt-shop-price {
  margin: 0;
  font-family: var(--lt-font-num);   /* ราคาในร้าน = ตัวเลข tabular (1.2) */
  font-size: 1.75rem;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: .01em;
  font-variant-numeric: tabular-nums;
}

/* รูปสินค้า: เลื่อนแนวนอนด้วยนิ้ว (scroll-snap) ไม่มีสคริปต์ · รูปถัดไปโผล่ขอบให้รู้ว่ามีอีก
   ขอบซ้ายขวาชนขอบจอบนมือถือ (ยกเลิก padding ของ .lt-wrap ด้วย margin ติดลบ)
   แผนขัดเงา 2.2: รูปจัตุรัส 1:1 ทุกจอ (เดิม 4:3 ใต้ 560px) — ช่องรูป .lt-img-slot ใช้ --lt-img-ratio: 1 (ข้อ 1.15) พื้น surface-2 ระหว่างรอรูป
   · จุดบอกตำแหน่ง .lt-shop-gallery__dots ใต้แถบ · แตะรูปเปิดไลต์บ็อกซ์ร่วม cc_lightbox() (ไม่มี JS = ลิงก์ไฟล์เต็มตามเดิม) */
.lt-shop-gallery {
  --lt-img-ratio: 1;
  display: flex;
  gap: 8px;
  margin: 0 -16px;
  padding: 0 16px;
  overflow-x: auto;
  list-style: none;
  scroll-snap-type: x mandatory;
  scroll-padding: 0 16px;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
}
.lt-shop-gallery__item {
  flex: 0 0 88%;
  margin: 0;
  scroll-snap-align: start;
}
.lt-shop-gallery__item:only-child { flex-basis: 100%; }
.lt-shop-gallery__img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  border-radius: var(--lt-radius);
  background: var(--lt-surface-2);
  object-fit: cover;
}
.lt-shop-gallery--empty {
  align-items: center;
  justify-content: center;
  aspect-ratio: 16 / 10;
  margin: 0;
  border: 1px dashed var(--lt-border-strong);
  border-radius: var(--lt-radius);
  background: var(--lt-surface-2);
  color: var(--lt-primary);
}
.lt-shop-gallery__hint { margin: 6px 0 0; }

/* กล่องปุ่มสั่งซื้อ — ต่อจากราคาทันที (คำเตือนปลามีชีวิตอยู่ใต้กล่อง) รูป 4:3 บนมือถือ ปุ่มจึงอยู่ในจอแรกของ 375×812 */
.lt-shop-buy {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0;
}
.lt-shop-buy__form { display: flex; flex-direction: column; gap: 12px; }
.lt-shop-buy__form .lt-field { margin: 0; }
.lt-shop-buy__note { margin: 0; line-height: 1.7; }
.lt-shop-buy__pay { margin: 0; }

/* ── จอกว้าง ────────────────────────────────────────────── */

@media (min-width: 560px) {
  .lt-shop-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
  .lt-shop-gallery { margin: 0; padding: 0; }
  .lt-shop-gallery__item { flex-basis: 70%; }
}

@media (min-width: 900px) {
  .lt-shop-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
  .lt-shop-gallery { flex-wrap: wrap; overflow-x: visible; scroll-snap-type: none; }
  .lt-shop-gallery__item { flex: 0 0 calc(50% - 4px); }
  .lt-shop-gallery__item:first-child { flex-basis: 100%; }
  .lt-shop-gallery__hint,
  .lt-shop-gallery__dots { display: none; }   /* จอกว้างรูปเรียงเป็นกริด ไม่ต้องปัด */
  .lt-shop-product {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    align-items: start;
    gap: 28px;
  }
  .lt-shop-product__media { position: sticky; top: calc(var(--lt-topbar-h) + 16px); }
}

/* =============================================================
   Red Bee เพิ่ม (16 ต.ค. 2569) — หน้าร้าน 5.10.1 และหน้าเจ้าของร้าน /app/products /app/inquiries /app/sales
   ใช้ตัวแปร --lt-* ของ app-theme.css ล้วน · ไม่ทับชิ้นส่วนกลางแบบทั้งเว็บ
   ============================================================= */

/* ── หัวรายการ: รอบส่ง · ปุ่มติดต่อ ── */
.lt-shop-ship { margin: 0; font-size: .9375rem; }
.lt-shop-contacts { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
.lt-shop-contacts--block { display: flex; flex-direction: column; gap: 10px; }
.lt-shop-contacts--block > * + * { margin-top: 0; }
.lt-shop-filters { display: flex; flex-direction: column; gap: 4px; }
.lt-shop-filters .lt-chips { margin-bottom: 8px; }

/* ── การ์ด: บรรทัดเสริมใต้ราคา ── */
.lt-shop-card__unit { display: block; font-family: var(--lt-font-body); font-size: .8125rem; font-weight: 500; }
.lt-shop-card__line {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: .875rem;
  line-height: 1.5;
}
.lt-shop-card__line svg { flex: none; color: var(--lt-primary); }
.lt-shop-card__meta { font-size: .8125rem; line-height: 1.5; }
.lt-shop-card__body .lt-pill { font-size: .8125rem; }

/* ── หน้าสินค้า ── */
.lt-shop-owner { margin: 0 0 12px; }
.lt-shop-gallery__caption { margin: 4px 0 0; }
.lt-shop-gallery__item > a { display: block; border-radius: var(--lt-radius); }
.lt-shop-gallery__item > a:focus-visible { outline: none; box-shadow: var(--lt-ring); }

/* ตารางหน่วยขาย: ชื่อหน่วย — ราคา · เหลือ · ของแถม (หนึ่งแถวต่อหน่วยขาย) */
.lt-shop-units { margin: 0; padding: 0; list-style: none; }
.lt-shop-units__row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 2px 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--lt-border);
}
.lt-shop-units__row:first-child { padding-top: 0; }
.lt-shop-units__row:last-child { padding-bottom: 0; border-bottom: 0; }
.lt-shop-units__label { flex: 1 1 auto; min-width: 0; font-weight: 600; }
.lt-shop-units__price {
  font-family: var(--lt-font-num);   /* ตัวเลขราคา (1.2) */
  font-size: 1.25rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.lt-shop-units__meta { flex: 1 0 100%; color: var(--lt-muted); font-size: .875rem; }
.lt-shop-units__meta svg { vertical-align: -2px; color: var(--lt-primary); }
.lt-shop-units__row.is-out .lt-shop-units__price,
.lt-shop-units__row.is-out .lt-shop-units__label { color: var(--lt-muted); }

/* กล่องพับ: สอบถาม/จอง · ข้อความโพสต์ · รายละเอียดเพิ่มของฟอร์มขาย — หัวกล่องสูง ≥ 44px */
.lt-shop-inquiry,
.lt-shop-post,
.lt-salemore { margin: 0; }
.lt-shop-inquiry__toggle {
  display: flex;
  align-items: center;
  min-height: 44px;
  font-weight: 600;
  cursor: pointer;
  list-style: none;
}
.lt-shop-inquiry__toggle::-webkit-details-marker { display: none; }
.lt-shop-inquiry__toggle::after {
  content: "";
  width: 7px;
  height: 7px;
  margin-inline-start: auto;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
  transition: transform var(--lt-dur) var(--lt-ease);
}
details[open] > .lt-shop-inquiry__toggle { margin-bottom: 12px; }
details[open] > .lt-shop-inquiry__toggle::after { transform: translateY(2px) rotate(-135deg); }
.lt-salemore + .lt-salemore { margin-top: 12px; }
.lt-salemore .lt-field:last-child { margin-bottom: 0; }

/* ช่องดักบอต — มองไม่เห็นและไม่รับโฟกัส แต่ยังอยู่ในฟอร์ม */
.lt-shop-hp {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

/* 16px — ต่ำกว่านี้ iOS ซูมทั้งหน้าตอนแตะกล่อง (แม้เป็นกล่องคัดลอก readonly) · เดิม 15px (ตรวจมือถือ/ไอแพด 21 ต.ค. 2569) */
.lt-shop-post__text {
  width: 100%;
  min-height: 14rem;
  font-size: 1rem;
  line-height: 1.6;
  white-space: pre-wrap;
}


/* ── /app/products (แผนขัดเงา 4.14): การ์ดสินค้าแถวเดียว .lt-rows__item — รูปปก 56px | ชื่อ · ชิปสถานะ + ราคาต่อหน่วย · โคโลนี/คงเหลือ | ⋯
   ทั้งการ์ดแตะเปิดหน้าแก้ (ลิงก์ชื่อคลุมแถว) · ⋯ ป้ายสอบถามใหม่ และฟอร์มเสนอปิดประกาศยกขึ้นเหนือลิงก์คลุม · ไม่มีการเสนอ = การ์ด ≤ 96px ที่ 390 */
.lt-prodrows { margin-top: 4px; }
.lt-prodrow { align-items: flex-start; padding: 10px 12px; }
.lt-prodrow__thumb {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  overflow: hidden;
  border-radius: var(--lt-radius-sm);
  background: var(--lt-surface-2);
  color: var(--lt-primary);
}
.lt-prodrow__thumb img { width: 100%; height: 100%; object-fit: cover; }
.lt-prodrow__body { flex: 1 1 auto; min-width: 0; gap: 2px; }
.lt-prodrow__title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lt-prodrow__line { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: .875rem; line-height: 1.6; }
.lt-prodrow__line > .lt-pill { flex: none; }
.lt-prodrow__prices { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-variant-numeric: tabular-nums; }
/* บรรทัดโคโลนี/เกรด: ข้อความตัดท้าย (…) แต่ป้าย "สอบถามใหม่ n" (flex: none) เห็นเสมอ — ที่ 390 เดิมป้ายหลุดขอบการ์ดในบรรทัด nowrap ที่ถูกตัด */
.lt-prodrow__meta { display: flex; align-items: center; gap: 6px; min-width: 0; }
.lt-prodrow__bits { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lt-prodrow__ask,
.lt-prodrow__suggest,
.lt-prodrow__side { position: relative; z-index: 1; }
.lt-prodrow__ask { flex: none; white-space: nowrap; }
.lt-prodrow__side:focus-within { z-index: 3; }   /* แผง ⋯ ที่กางอยู่ลอยเหนือการ์ดถัดไป */
/* รอบปิดขั้น 4: กางอยู่ก็ยกด้วย ไม่พึ่งโฟกัส (.is-menu-open จากสคริปต์กลาง + :has() เป็นกฎแยก) */
.lt-prodrow__side.is-menu-open { z-index: 3; }
.lt-prodrow__side:has(details.lt-menu[open]) { z-index: 3; }
.lt-prodrow__suggest { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 6px 0 0; padding: 6px 8px; border-inline-start: 3px solid var(--lt-warn); border-radius: var(--lt-radius-sm); background: var(--lt-surface-2); font-size: .875rem; }
.lt-prodrow__suggest-text { flex: 1 1 12rem; min-width: 0; }
.lt-prodrow__delete { color: var(--lt-danger); }

/* ── ฟอร์มสินค้า: เลือกโคโลนี · แถวหน่วยขาย · รูป ── */
.lt-pickcolony { margin: 0; padding: 0; list-style: none; }
.lt-pickcolony__item { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; color: var(--lt-ink); text-decoration: none; }
.lt-pickcolony__line { flex: 1 0 100%; font-size: .875rem; }

.lt-unitrow { padding: 14px; box-shadow: none; }
.lt-unitrow + .lt-unitrow { margin-top: 12px; }
.lt-unitrow--blank { border-style: dashed; background: var(--lt-surface-2); }
.lt-unitrow__title { margin: 0 0 8px; font-weight: 600; }
.lt-unitrow__more { margin: 0 0 8px; }
.lt-unitrow__more > summary { display: flex; align-items: center; min-height: 44px; color: var(--lt-primary); cursor: pointer; }
.lt-unitrow .lt-field { margin-bottom: 10px; }
.lt-unitrow .lt-row .lt-field { margin-bottom: 0; }

.lt-copyphotos { margin: 0; padding: 0; list-style: none; }
.lt-copyphotos .lt-check { align-items: flex-start; }

.lt-photomgr { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.lt-photomgr__item { display: flex; flex-direction: column; gap: 10px; padding: 12px; }
.lt-photomgr__head { display: flex; align-items: center; gap: 12px; }
.lt-photomgr__head img { display: block; width: 96px; height: 72px; object-fit: cover; border-radius: var(--lt-radius-sm); }
.lt-photomgr__meta { display: flex; flex: 1 1 auto; flex-wrap: wrap; gap: 6px; min-width: 0; }
.lt-photomgr__order { display: flex; gap: 6px; }
.lt-photomgr__order form,
.lt-photomgr__item .lt-row form { margin: 0; }
.lt-photomgr__caption { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 6px 8px; margin: 0; }
.lt-photomgr__caption .lt-label { flex: 1 0 100%; margin: 0; }
.lt-photomgr__caption .lt-input { flex: 1 1 12rem; min-width: 0; }

/* ── /app/inquiries ── */
.lt-askrow { display: flex; flex-direction: column; gap: 8px; }
.lt-askrow--late { border-color: var(--lt-warn); }
/* 4.14 ยังไม่ตอบ = แถบซ้าย 4px สีข้อมูล + ชื่อหนา · ตอบแล้ว/ปิดแล้ว = ข้อความจาง (ปุ่มยังสีเดิม) */
.lt-askrow--new { border-inline-start: 4px solid var(--lt-info); }
.lt-askrow--new.lt-askrow--late { border-inline-start-color: var(--lt-warn); }
.lt-askrow--new .lt-askrow__name { font-weight: 700; }
.lt-askrow--done .lt-askrow__name,
.lt-askrow--done .lt-dl { color: var(--lt-muted); }
.lt-askrow--done .lt-askrow__name { font-weight: 500; }
.lt-askrow__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; }
.lt-askrow__name { margin: 0; font-size: 1.0625rem; font-weight: 600; overflow-wrap: anywhere; }
.lt-askrow .lt-help { margin: 0; }
.lt-askrow__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; }
.lt-askrow__reserve { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }

/* ── /app/sales ── รอบปิดขั้น 4: รายการเป็น .lt-rows ของฐาน (ul.lt-salerows) — ยอด .lt-rows__amount .lt-money 1.125rem/700 ตัวใหญ่สุดของแถว
   (ชื่อแถว 1rem/600) · บรรทัดจำนวนเป็นตัวเลข tabular · ⋮ เฉพาะการขายที่ยกเลิกได้ ใต้ยอด */
.lt-salerows { margin: 0; }
.lt-salerows__item { align-items: flex-start; }
.lt-salerows__item .lt-rows__side { align-self: stretch; justify-content: space-between; }
.lt-salerows__qty { color: var(--lt-ink); font-variant-numeric: tabular-nums; }
.lt-salecount { margin: -6px 0 12px; color: var(--lt-ink); font-weight: 600; }

@media (min-width: 768px) {
  .lt-shop-units__meta { flex: 0 1 auto; }
  .lt-photomgr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* คำอธิบายเกรด/ลายในหน้าคู่มือ (guide_grades) — หัวข้อเป็นป้ายตัวหนา คำอธิบายเว้นระยะอ่านง่าย */
.lt-shop-dl dt {
  margin-top: 14px;
  color: var(--lt-primary);
  font-weight: 700;
}
.lt-shop-dl dt:first-child { margin-top: 0; }
.lt-shop-dl dd { margin: 4px 0 0; line-height: 1.7; }
/* มือถือและจอสัมผัส: ลิงก์ท้ายค่า ("อ่านนโยบาย" ในล็อต · "› ดูกุ้ง…" ในคู่มือเกรด) เป็นปุ่มยืนเดี่ยว ไม่ใช่ลิงก์กลางประโยค
   สูงเต็ม --lt-tap แบบ .lt-carequick__more a — เดิม 27px (ตรวจมือถือ/ไอแพด 21 ต.ค. 2569) */
@media (max-width: 767.98px), (pointer: coarse) {
  .lt-shop-dl dd a { display: inline-flex; align-items: center; min-height: var(--lt-tap); }
}

/* ป้าย "จากฟาร์มพันธมิตร {ชื่อ}" บนการ์ดและหน้าสินค้า (SPEC 5.13.10 ข้อ 1) — มีเฉพาะเมื่อร้านตั้งชื่อที่แสดง · ตัวอักษรเล็กสีรอง ไม่แย่งราคา */
.lt-shop-partner {
  margin: 0;
  color: var(--lt-muted);
  font-size: .8125rem;
  font-weight: 600;
  line-height: 1.4;
}

/* ══ สั่งซื้อในเว็บ ขั้น 2 — หน้าของลูกค้า (docs/PLAN-orders.md ข้อ 5 · layout/shop_ui.php) ═══════════════
   ยกจาก tulamtharn.com/layout/shop.css เฉพาะส่วนคำสั่งซื้อ · สีจากตัวแปร --lt-* เท่านั้น (กฎ 19) ทั้งกลางวันและกลางคืน
   หน้า: /shop/{id}/order (.lt-shop-checkout) · /o/{token} (.lt-shop-link) · /app/orders (.lt-shop-orders) · /app/orders/{id} (.lt-shop-order) */

/* ปุ่มบนหน้าสินค้า: ปุ่มหลักใต้รายการหน่วยขาย + ลิงก์ต่อหน่วยขาย */
.lt-shop-buy__order { margin-top: 4px; }
.lt-shop-units__order {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-inline-start: auto;
  font-weight: 600;
}

/* ── หน้าสั่งซื้อ /shop/{id}/order ── */
.lt-shop-item { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.lt-shop-item__main { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-width: 0; }
.lt-shop-item__title { margin: 0; font-weight: 600; line-height: 1.5; overflow-wrap: anywhere; }
.lt-shop-item__title a { color: var(--lt-ink); }

.lt-shop-checkout { display: flex; flex-direction: column; }
.lt-shop-checkout > .lt-field { margin-bottom: 20px; }
/* ช่องสั้นคู่กัน (ชื่อ + เบอร์ · จังหวัด + รหัสไปรษณีย์ · ฟอร์มสอบถาม) — มือถือเรียงลง · จอ ≥ 600px เคียงกัน
   เดิม iPad แนวตั้งทุกช่องยืดเต็มแถว 686–719px ฟอร์มยาวและช่องเบอร์/รหัส 5 หลักกว้างเกินเหตุ (ตรวจมือถือ/ไอแพด 21 ต.ค. 2569) */
.lt-shop-pair { display: grid; grid-template-columns: minmax(0, 1fr); column-gap: 16px; align-items: start; }
.lt-fieldset > .lt-shop-pair:last-child > .lt-field:last-child { margin-bottom: 0; }
@media (min-width: 600px) {
  .lt-shop-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lt-fieldset > .lt-shop-pair:last-child > .lt-field { margin-bottom: 0; }
}
/* หน้าสินค้าแบ่งรูป/ข้อมูลสองคอลัมน์ตั้งแต่ 900px — คอลัมน์ข้อมูลเหลือ ~400px ช่องคู่จะเหลือช่องละ ~195px จึงเรียงลงจนจอกว้างพอ */
@media (min-width: 900px) and (max-width: 1199.98px) {
  .lt-shop-product .lt-shop-pair { grid-template-columns: minmax(0, 1fr); }
}
.lt-shop-checkout__pickup { margin: 0 0 12px; }
.lt-shop-method small { font-variant-numeric: tabular-nums; }
/* เลือกนัดรับแล้วซ่อนช่องที่อยู่ (เซิร์ฟเวอร์ไม่อ่านค่าของนัดรับ) · เบราว์เซอร์ที่ไม่รู้จัก :has() เห็นช่องที่อยู่ตลอด สั่งได้เหมือนกัน */
.lt-shop-checkout:has(input[data-pickup]:checked) .lt-shop-address { display: none; }

.lt-shop-variant { display: flex; flex-direction: column; gap: 6px; }
.lt-shop-variant__qty { padding-inline-start: 34px; }
.lt-shop-variant__qty .lt-field { margin: 0; }
.lt-shop-variant__qty[hidden] { display: none; }
.lt-shop-direct { margin: 0 0 20px; }
.lt-shop-direct .lt-check { margin-top: 6px; }

.lt-shop-ack {
  margin: 0 0 20px;
  padding: 4px 12px;
  border: 1px solid var(--lt-warn);
  border-radius: var(--lt-radius-sm);
  background: var(--lt-surface);
  background: color-mix(in srgb, var(--lt-warn) 7%, var(--lt-surface));
}
.lt-shop-ack .lt-check { line-height: 1.6; }
.lt-shop-ack .lt-error { margin: 0 0 8px; }

.lt-shop-summary { display: flex; flex-direction: column; gap: 8px; }
.lt-shop-summary > p { margin: 0; }
.lt-shop-summary__total { font-size: 1.25rem; font-weight: 700; line-height: 1.4; font-variant-numeric: tabular-nums; }
.lt-shop-summary .lt-btn { margin-top: 6px; }

/* ── ลิงก์ลัด /o/{token} ── */
.lt-shop-link { display: flex; flex-direction: column; gap: 12px; max-width: 520px; margin: 0 auto; }
.lt-shop-link > p,
.lt-shop-link > form,
.lt-shop-link > h1,
.lt-shop-link > h2 { margin: 0; }
.lt-shop-link__code { font-size: 1.125rem; font-weight: 700; letter-spacing: .02em; }
.lt-shop-copyrow__value.lt-shop-link__url { font-size: .9375rem; font-weight: 600; }   /* ลิงก์ยาว 90 ตัว — เล็กกว่าเลขพร้อมเพย์ */

/* ── ประวัติ /app/orders ── */
.lt-shop-orders { display: grid; gap: 10px; margin: 16px 0 0; padding: 0; list-style: none; }
.lt-shop-orders > .lt-card + .lt-card { margin-top: 0; }
.lt-shop-orderrow { display: flex; flex-direction: column; gap: 10px; margin: 0; }
.lt-shop-orderrow__link { display: flex; flex-direction: column; gap: 4px; color: var(--lt-ink); text-decoration: none; }
.lt-shop-orderrow__link:hover { color: var(--lt-ink); }
.lt-shop-orderrow__link:focus-visible { outline: none; box-shadow: var(--lt-ring); border-radius: 8px; }
.lt-shop-orderrow__top { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.lt-shop-orderrow__code { font-weight: 700; letter-spacing: .02em; font-variant-numeric: tabular-nums; }
.lt-shop-orderrow__title { line-height: 1.6; overflow-wrap: anywhere; }
.lt-shop-orderrow__meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; color: var(--lt-muted); font-size: .875rem; }
.lt-shop-orderrow__amount { color: var(--lt-ink); font-size: 1.0625rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.lt-shop-orderrow__pay { align-self: flex-start; }

/* ป้ายสถานะคำสั่งซื้อและสลิป: จุดสีบนป้าย lt-pill (ตัวอักษร ink) · ป้ายของคำสั่งซื้อ 14px
   ลำดับสี (แผนขัดเงา 1.1 · P2): รอชำระ เหลือง → รอตรวจ ฟ้าข้อมูล → ชำระแล้ว เขียว → ส่งแล้ว ม่วง + ไอคอนกล่อง → ปิดแล้ว เขียวใบไม้ + ✓
   ส่งแล้วใช้ --lt-task-bacteria (ม่วง) ไม่ใช่แดงแบรนด์ (ดูเหมือนผิดพลาด) และไม่ใช่ฟ้าอีกเฉด (ชนกับ "รอตรวจ")
   ปิดแล้ว/ได้รับแล้ว ใช้ --lt-task-fertilizer (เขียวใบไม้ · ตรวจรับ 1.1: ห้าชิปต้องมี --lt-pill-color ต่างกัน) + ไอคอน ✓ — ไม่ซ้ำเขียว --lt-ok ของ "ชำระแล้ว" */
.lt-shop-status--awaiting_payment { --lt-pill-color: var(--lt-warn);          border-color: var(--lt-warn); }
.lt-shop-status--verifying        { --lt-pill-color: var(--lt-info);          border-color: var(--lt-info); }
.lt-shop-status--paid             { --lt-pill-color: var(--lt-ok);            border-color: var(--lt-ok); }
.lt-shop-status--shipped          { --lt-pill-color: var(--lt-task-bacteria); border-color: var(--lt-task-bacteria); }
.lt-shop-status--completed        { --lt-pill-color: var(--lt-task-fertilizer); border-color: var(--lt-task-fertilizer); }
.lt-shop-status--shipped .lt-shop-status__icon,
.lt-shop-status--completed .lt-shop-status__icon { flex: none; color: var(--lt-pill-color); }   /* กล่องพัสดุ 14px คู่คำว่า "ส่งแล้ว" · ✓ 14px คู่คำว่า "ปิดแล้ว/ได้รับแล้ว" */
.lt-shop-status--cancelled        { --lt-pill-color: var(--lt-border-strong); border-color: var(--lt-border-strong); }
.lt-shop-status--expired          { --lt-pill-color: var(--lt-border-strong); border-color: var(--lt-border-strong); }
.lt-shop-refund { border-color: var(--lt-danger); }
.lt-shop-status,
.lt-shop-slips__pill,
.lt-shop-refund { font-size: .875rem; }

/* ── หน้าคำสั่งซื้อ /app/orders/{id} ── */
.lt-shop-order { display: flex; flex-direction: column; gap: 20px; }
.lt-shop-order > .lt-note { margin: 0; }
.lt-shop-order__head { margin-bottom: 0; }
.lt-shop-order__back { margin: 0 0 4px; font-size: .9375rem; }
.lt-shop-order__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; font-size: .9375rem; }
.lt-shop-bells { margin: 0; }

.lt-shop-statusbox { display: flex; flex-direction: column; gap: 12px; }
.lt-shop-next { margin: 0; }
.lt-shop-next__reject { font-weight: 600; }

.lt-shop-current,
.lt-shop-shipped { display: flex; flex-direction: column; gap: 10px; }
.lt-shop-current > p,
.lt-shop-shipped > p,
.lt-shop-shipped > form { margin: 0; }
.lt-shop-current__text { font-weight: 600; line-height: 1.7; }
.lt-shop-current__link { align-self: flex-start; }
.lt-shop-current__img {
  display: block;
  width: 160px;
  height: auto;
  max-height: 240px;
  border: 1px solid var(--lt-border);
  border-radius: var(--lt-radius-sm);
  object-fit: contain;
  background: var(--lt-surface-2);
}
.lt-shop-inline { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }

/* กล่องชำระเงิน: ยอด → เวลา → คำเตือนชื่อบัญชี → QR → เลขพร้อมเพย์และชื่อบัญชี */
.lt-shop-pay { display: flex; flex-direction: column; gap: 14px; border-color: var(--lt-primary); border-width: 2px; }
.lt-shop-pay > p { margin: 0; }
.lt-shop-amount { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 4px 12px; }
.lt-shop-amount__label { flex: 1 0 100%; margin: 0; color: var(--lt-muted); font-size: .9375rem; }
.lt-shop-amount__baht { white-space: nowrap; }
.lt-shop-amount__value {
  margin: 0;
  font-family: var(--lt-font-num);
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -.01em;
  font-variant-numeric: tabular-nums;
}
/* เศษสตางค์ที่ใช้จับคู่ยอด — ขีดเส้นใต้หนาและพื้นอ่อน ไม่ใช่สีตัวอักษรอย่างเดียว · inline-block สูงเท่าบรรทัดของตัวเอง */
.lt-shop-amount__satang {
  display: inline-block;
  line-height: 1.15;
  padding: 0 4px;
  border-bottom: 4px solid var(--lt-warn);
  border-radius: 4px;
  background: var(--lt-surface-2);
  background: color-mix(in srgb, var(--lt-warn) 18%, var(--lt-surface));
  color: var(--lt-ink);
}
.lt-shop-amount .lt-shop-copy { margin-bottom: 6px; }
.lt-shop-deadline { font-weight: 600; line-height: 1.6; }
.lt-shop-deadline__left { color: var(--lt-muted); font-weight: 500; white-space: nowrap; }

/* QR: รูป PNG มีขอบขาว (quiet zone) ในตัวแล้ว กรอบนี้กันขอบการ์ดชนรูป · พื้นของกรอบเป็นสีการ์ด (กฎ 19) */
.lt-shop-qr { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.lt-shop-qr__img {
  display: block;
  width: 100%;
  max-width: 280px;
  height: auto;
  padding: 6px;
  border: 1px solid var(--lt-border-strong);
  border-radius: var(--lt-radius-sm);
  background: var(--lt-surface);
  image-rendering: pixelated;
}
.lt-shop-qr__img--svg svg { display: block; width: 100%; height: auto; }
.lt-shop-qr__save { align-self: center; }
.lt-shop-qr__howto { align-self: stretch; }
.lt-shop-qr__howto-title { margin: 0 0 4px; font-weight: 600; }
.lt-shop-qr__howto .lt-list { margin: 0 0 6px; line-height: 1.7; }
.lt-shop-qr__desk { display: none; margin: 0; font-weight: 700; text-align: center; }
.lt-shop-qr__deskcheck { display: none; margin: 0; font-weight: 600; text-align: center; }

.lt-shop-payee { display: flex; flex-direction: column; gap: 8px; margin: 0; }
.lt-shop-copyrow { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 10px; margin: 0; }
.lt-shop-copyrow__label { flex: 1 0 100%; margin: 0; color: var(--lt-muted); font-size: .875rem; font-weight: 500; }
.lt-shop-copyrow__value {
  margin: 0;
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.5;
  overflow-wrap: anywhere;
  font-variant-numeric: tabular-nums;
  user-select: all;          /* คัดลอกไม่ได้ (เบราว์เซอร์ในแอป LINE) กดครั้งเดียวเลือกทั้งเลข */
  -webkit-user-select: all;
}
.lt-shop-copyrow__action { margin: 0; }
.lt-shop-payee__warn { font-weight: 600; }
.lt-shop-payee__warn > p { display: block; }
.lt-shop-exact { line-height: 1.7; }
.lt-shop-copy { flex: none; }
.lt-shop-digits { white-space: nowrap; }
.lt-shop-digits > span + span { margin-inline-start: .3em; }

.lt-shop-slipform { display: flex; flex-direction: column; gap: 4px; }
.lt-shop-slipform > .lt-section__title { margin-bottom: 8px; }
.lt-shop-slipform .lt-btn { margin-top: 8px; }
.lt-shop-slipform__file { width: 100%; }

.lt-shop-block { margin: 0; }
.lt-shop-slips { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.lt-shop-slips__item { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; min-height: 44px; margin: 0; padding: 6px 0; line-height: 1.6; }
.lt-shop-slips__item + .lt-shop-slips__item { border-top: 1px solid var(--lt-border); }
.lt-shop-slips__pill { flex: none; }
.lt-shop-slips__when { color: var(--lt-muted); font-size: .875rem; }
.lt-shop-slips__note { flex: 1 0 100%; font-size: .9375rem; }
.lt-shop-slips__view { display: inline-flex; align-items: center; min-height: 44px; margin-inline-start: auto; }
.lt-shop-slips__pill--pending   { --lt-pill-color: var(--lt-info);          border-color: var(--lt-info); }   /* รอตรวจ = ฟ้าข้อมูล (1.1) */
.lt-shop-slips__pill--accepted  { --lt-pill-color: var(--lt-ok);            border-color: var(--lt-ok); }
.lt-shop-slips__pill--rejected  { --lt-pill-color: var(--lt-danger);        border-color: var(--lt-danger); }
.lt-shop-slips__pill--withdrawn { --lt-pill-color: var(--lt-border-strong); border-color: var(--lt-border-strong); }

/* เส้นเวลา: จุดบนเส้นแนวตั้ง · เสร็จ = จุดทึบ · ตอนนี้ = วงหนา + ป้าย "ตอนนี้" · หยุด = ขอบแดง · ยังไม่ถึง = วงกลวง (รูปทรงบอกด้วย ไม่ใช่สีอย่างเดียว) */
.lt-shop-steps { margin: 0; padding: 0; list-style: none; }
.lt-shop-steps__item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 40px;
  margin: 0;
  padding-inline-start: 34px;
  color: var(--lt-muted);
}
.lt-shop-steps__item::before { content: ""; position: absolute; top: 0; bottom: 0; left: 11px; width: 2px; background: var(--lt-border); }
.lt-shop-steps__item:first-child::before { top: 50%; }
.lt-shop-steps__item:last-child::before { bottom: 50%; }
.lt-shop-steps__item:only-child::before { display: none; }
.lt-shop-steps__dot {
  position: absolute;
  top: 50%;
  left: 4px;
  width: 16px;
  height: 16px;
  margin-top: -8px;
  border: 2px solid var(--lt-input-border);
  border-radius: 50%;
  background: var(--lt-surface);
}
.lt-shop-steps__label { line-height: 1.5; }
.lt-shop-steps__item.is-done { color: var(--lt-ink); }
.lt-shop-steps__item.is-done::before { background: var(--lt-ok); }   /* ทำแล้ว = เขียวปกติ (แผนขัดเงา 2.4 · P2 แดง = ปุ่มหลักเท่านั้น) — ชุดเดียวกับแถบ 5 จุด */
.lt-shop-steps__item.is-done .lt-shop-steps__dot { border-color: var(--lt-ok); background: var(--lt-ok); box-shadow: inset 0 0 0 3px var(--lt-surface); }
.lt-shop-steps__item.is-current { color: var(--lt-ink); font-weight: 700; }
.lt-shop-steps__item.is-current .lt-shop-steps__dot { width: 20px; height: 20px; left: 2px; margin-top: -10px; border-width: 5px; border-color: var(--lt-info); }   /* ขั้นตอนนี้ = ฟ้าข้อมูล (1.1) */
.lt-shop-steps__item.is-stopped { color: var(--lt-ink); font-weight: 600; }
.lt-shop-steps__item.is-stopped .lt-shop-steps__dot { border-color: var(--lt-danger); background: var(--lt-surface-2); }
.lt-shop-steps__now { padding: 0 8px; border: 1px solid var(--lt-info); border-radius: 999px; font-size: .875rem; font-weight: 600; line-height: 1.6; }

.lt-shop-lines { padding: 12px 14px; }
.lt-shop-lines__items,
.lt-shop-lines__sums { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.lt-shop-lines__sums { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--lt-border); }
.lt-shop-lines__row { display: flex; justify-content: space-between; gap: 12px; margin: 0; padding: 3px 0; line-height: 1.6; }
.lt-shop-lines__row > * { margin: 0; }
.lt-shop-lines__row > :first-child { min-width: 0; overflow-wrap: anywhere; }
.lt-shop-lines__title { display: block; font-weight: 600; }
.lt-shop-lines__sub { display: block; color: var(--lt-muted); font-size: .9375rem; }
.lt-shop-lines__money { flex: none; font-variant-numeric: tabular-nums; }
.lt-shop-lines__row--total { font-size: 1.0625rem; font-weight: 700; }

.lt-shop-shipto { margin-top: 12px; }
.lt-shop-shipto__line { display: block; }

.lt-shop-cancel { margin: 0; }
.lt-shop-cancel > summary { list-style: none; }
.lt-shop-cancel > summary::-webkit-details-marker { display: none; }
.lt-shop-cancel__toggle { width: 100%; }
.lt-shop-cancel__body { display: flex; flex-direction: column; gap: 10px; margin-top: 10px; border-color: var(--lt-danger); }
.lt-shop-cancel__body > p,
.lt-shop-cancel__body > form { margin: 0; }

/* ข้อความในคำสั่งซื้อ: ของร้านชิดซ้ายขอบซ้ายสีฟ้า · ของเราชิดขวาพื้นอ่อน (ตำแหน่งกับขอบบอกด้วย ไม่ใช่สีอย่างเดียว) */
.lt-shop-msgs { margin: 0; }
.lt-shop-msgs__list { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.lt-shop-msg {
  max-width: 88%;
  margin: 0;
  padding: 8px 12px;
  border: 1px solid var(--lt-border);
  border-radius: var(--lt-radius);
  background: var(--lt-surface);
  box-shadow: var(--lt-shadow-sm);
}
.lt-shop-msg--shop { align-self: flex-start; border-inline-start: 3px solid var(--lt-info); }   /* ข้อความจากร้าน = ฟ้าข้อมูล (1.1) */
.lt-shop-msg--mine { align-self: flex-end; background: var(--lt-primary-soft); }
.lt-shop-msg__head { display: flex; flex-wrap: wrap; gap: 2px 8px; margin: 0 0 2px; font-size: .8125rem; }
.lt-shop-msg__who { font-weight: 700; }
.lt-shop-msg__when { color: var(--lt-muted); }
.lt-shop-msg__body { margin: 0; }
.lt-shop-msgform { display: flex; flex-direction: column; align-items: flex-start; }
.lt-shop-msgform .lt-field { align-self: stretch; margin-bottom: 8px; }

@media (min-width: 560px) {
  .lt-shop-cancel__toggle { width: auto; }
}
/* จอคอมพิวเตอร์ใช้เมาส์: "สแกนด้วยมือถือ" เหนือ QR · ขั้นตอนบันทึกรูปของมือถือเครื่องนี้ซ่อน เหลือบรรทัดตรวจชื่อและยอดใต้ QR */
@media (min-width: 768px) and (pointer: fine) {
  .lt-shop-qr__desk { display: block; }
  .lt-shop-qr__other { display: none; }
  .lt-shop-qr__howto { display: none; }
  .lt-shop-qr__deskcheck { display: block; }
}
@media (min-width: 900px) {
  .lt-shop-checkout,
  .lt-shop-item { max-width: 640px; }
}
/* พิมพ์รายการสั่งซื้อ (ไม่ใช่ใบกำกับภาษี) · แถบลอย "ราคา + ปุ่มหลัก" (แผนขัดเงา 2.1) ไม่ขึ้นบนกระดาษ */
@media print {
  .lt-shop-pay,
  .lt-shop-slipform,
  .lt-shop-cancel,
  .lt-shop-msgform,
  .lt-shop-actions,
  .lt-shop-current form,
  .lt-shop-shipped form,
  .lt-shop-copy,
  .lt-shop-bar { display: none !important; }
  /* กว้างเท่ากระดาษเดิม: ก่อน 2.4 หน้านี้อยู่ใน .lt-wrap ปกติ (กว้างสุด 720px กลางหน้า) — 2.4 ใช้ 'wide' เพื่อสองคอลัมน์บนจอ กระดาษแนวนอนจึงกว้างขึ้น */
  .lt-shop-order { max-width: 720px; margin-inline: auto; }
  /* แผนขัดเงา 2.4 + รอบปิดขั้นที่ 2: กระดาษเหมือนก่อนขั้น 2 (กติกาส่วน 3 · เทียบกับหน้าเดิมด้วย print emulation) — เรียงเนื้อหาเดิม
     (สถานะ → เคลม → สลิป → ขั้นตอน → รายการ → ข้อความ) · ชิ้นใหม่ที่เป็นเครื่องมือบนจอไม่ลงกระดาษ (หัวฉลอง · แถบ 5 จุด · ปุ่มแชร์ · ปุ่มติดตามพัสดุ) */
  .lt-shop-done,
  .lt-shop-steps--bar,
  .lt-shop-share,
  .lt-shop-next__track .lt-btn { display: none !important; }
  /* สองคอลัมน์ไม่ลงกระดาษ: คอลัมน์เดียว ระยะ 20 ทุกชิ้นแบบเดิม (กระดาษแนวนอนที่กว้าง ≥ 900 ก็คอลัมน์เดียว — ตัวเลือกมีชื่อแท็ก/สองคลาส
     ชนะกฎ grid ของจอกว้างที่ประกาศทีหลัง) · โซนแรกของคอลัมน์ขวาที่ต่อจากโซน .lt-section ของคอลัมน์ซ้ายได้ระยะ .lt-section + .lt-section เดิม
     (เดิมเป็นพี่น้องกัน · คลาส --aftersec จาก app_order.php) */
  article.lt-shop-order { display: flex; flex-direction: column; align-items: stretch; gap: 20px; }
  .lt-shop-order > .lt-shop-order__main,
  .lt-shop-order > .lt-shop-order__side { display: flex; flex-direction: column; gap: 20px; }
  .lt-shop-order__side--aftersec > .lt-section:first-child { margin-top: 28px; }
  /* การ์ดพับที่เดิมเป็นโซนธรรมดา (.lt-shop-printfold · ขั้นตอน รายการ การจัดส่ง ข้อความ เครื่องอื่น): ไม่มีกรอบ ไม่มีหัวการ์ด ไม่มีระยะใน
     หัวข้อเดิมขึ้นแทน (.lt-shop-printonly) · เนื้อในเรียงด้วย gap 12 ของ .lt-section เดิม · ฟอร์มแจ้งกุ้งตายยังเป็นการ์ด (เดิมเป็นการ์ด) แต่ไม่มีหัวการ์ดพับ */
  .lt-shop-printonly { display: block !important; }
  h2.lt-shop-printonly { display: flex !important; }
  .lt-shop-printfold.lt-fold.lt-card { margin: 0; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
  .lt-shop-printfold > summary,
  .lt-shop-doafold > summary { display: none !important; }
  .lt-shop-printfold > .lt-fold__body { display: flex; flex-direction: column; gap: 12px; padding: 0; }
  .lt-shop-printfold > .lt-fold__body > p:last-child { margin-bottom: 1rem; }   /* <p> ท้ายโซนเดิมมีระยะล่างของ reboot (การ์ดพับล้างเป็นศูนย์) */
  .lt-shop-doafold > .lt-fold__body { padding-top: 0; }
  .lt-shop-shipfold > .lt-fold__body > .lt-shop-shipto { margin-top: 12px; }   /* ระยะเดิมใต้การ์ดรายการ (กฎกลาง .lt-fold__body > .lt-dl:first-child ล้างเป็นศูนย์) */
  .lt-shop-lines .lt-money { font-weight: inherit; letter-spacing: inherit; }   /* ยอดในรายการเดิมเป็นตัวปกติ (ตัวหนาเฉพาะแถวยอดรวม) */
}

/* ══ สั่งซื้อในเว็บ ขั้น 3 — หลังบ้านของร้าน (docs/PLAN-orders.md ข้อ 6 · pages/admin_orders.php admin_order.php admin_order_label.php) ══
   สีผ่านตัวแปรส่วน 0 ล้วน (กฎ 19) ยกเว้นบล็อกพิมพ์ของใบปะหน้า: กระดาษต้องเป็นดำบนขาวแม้หน้าจอเป็นโหมดมืด · มือถือก่อน ไม่มีความกว้างตายตัว */
.lt-shop-orderchips { margin: 0 0 12px; }
/* 4.9 ชิปสถานะของ /admin/orders เลื่อนข้างแถวเดียวเฉพาะจอ < 600 (.lt-chips--scroll ของ 1.9) — กว้างกว่านั้นหักบรรทัดตามเดิม */
@media (min-width: 600px) {
  .lt-shop-orderchips.lt-chips--scroll { flex-wrap: wrap; overflow: visible; padding-bottom: 0; -webkit-mask-image: none; mask-image: none; }
  .lt-shop-orderchips.lt-chips--scroll > .lt-chip:last-child { margin-inline-end: 0; }
}
/* 4.9 แถวคำสั่งซื้อของ /admin/orders (.lt-rows__item ของ 1.13 · ทั้งแถวเป็นลิงก์): รหัส + ชิปสถานะ | ยอด .lt-money ใหญ่สุดของแถว
   ป้ายพิเศษเป็นชิปเล็กไม่ใช่ปุ่ม (ไม่ต้องสูง 44px — แตะแถวเปิดคำสั่งซื้อ) · ระดับจาก data-level (crit สนิม · warn เหลือง · ว่าง = ข้อมูลเฉย ๆ) */
.lt-adminorders__item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "top side" "item side" "who who";
  align-items: start;
  gap: 2px 12px;
  padding: 9px 12px;   /* รอบปิดขั้น 4: แถวที่บรรทัดผู้รับหักพร้อมชิป "ส่งพรุ่งนี้" เคยสูง 121px (เป้า ≤ 120) */
}
.lt-adminorders__top { grid-area: top; }
.lt-adminorders__side { grid-area: side; display: flex; flex-direction: column; align-items: flex-end; gap: 0; }
.lt-adminorders__item-line { grid-area: item; min-width: 0; color: var(--lt-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lt-adminorders__who { grid-area: who; min-width: 0; }
.lt-adminorders__who > .lt-chip { margin: 0 0 0 6px; vertical-align: middle; }
.lt-adminorders .lt-shop-status { padding: 1px 8px 1px 7px; }
.lt-adminorders__top { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.lt-adminorders__code { font-weight: 700; letter-spacing: .02em; font-variant-numeric: tabular-nums; }
.lt-adminorders__who > .lt-chip { min-height: 22px; padding: 0 8px; gap: 5px; font-size: .8125rem; line-height: 1.6; }
.lt-adminorders__who > .lt-chip[data-level="warn"]::before,
.lt-adminorders__who > .lt-chip[data-level="crit"]::before { width: 7px; height: 7px; }
.lt-adminorders__when { color: var(--lt-muted); font-size: .75rem; line-height: 1.5; text-align: end; white-space: nowrap; font-variant-numeric: tabular-nums; }
.lt-chip--consign { border-color: var(--lt-task-mineral); }
.lt-shop-tag { font-size: .875rem; }
.lt-shop-ordergrid { align-items: start; }
.lt-shop-ordergrid > .lt-card + .lt-card { margin-top: 0; }
/* iPad แนวตั้ง (768–1023px) มีเมนูข้าง 232px — สองการ์ดเคียงกันเหลือใบละ ~254px ป้ายในรายการค่าหักสามบรรทัด รูปสลิปเล็ก
   จึงเรียงการ์ดลงคอลัมน์เดียวจนถึง 1024px (ตรวจมือถือ/ไอแพด 21 ต.ค. 2569 · /admin/orders/{id}) */
@media (min-width: 768px) and (max-width: 1023.98px) {
  .lt-shell--app .lt-shop-ordergrid { grid-template-columns: minmax(0, 1fr); }
}
.lt-shop-ordercol { min-width: 0; }
.lt-shop-ordercol > .lt-card,
.lt-shop-ordercol > details { margin: 0; }
.lt-shop-slipimg {
  display: block;
  max-width: 100%;
  height: auto;
  max-height: 70vh;
  border: 1px solid var(--lt-border);
  border-radius: var(--lt-radius, 12px);
}
.lt-shop-rejectbox { margin-top: 20px; padding-top: 14px; border-top: 1px solid var(--lt-border); }
/* 4.9 "สลิปไม่ถูกต้อง?" เป็นข้อความพับใต้ปุ่มยืนยัน (ไม่ใช่ปุ่มที่สอง) */
details.lt-shop-rejectbox { margin-top: 14px; padding-top: 6px; }
details.lt-shop-rejectbox > summary { list-style: none; cursor: pointer; }
details.lt-shop-rejectbox > summary::-webkit-details-marker { display: none; }
details.lt-shop-rejectbox[open] > summary { margin-bottom: 6px; }

/* ── 4.9 หน้าคำสั่งซื้อหลังบ้าน /admin/orders/{id}: "สิ่งที่ต้องทำตอนนี้" ก่อน (แผนขัดเงา 4.9 · 25 ต.ค. 2569) ──
   .lt-order-now = การ์ดงานตามสถานะ (ตรวจสลิป · ส่ง/รับเอง · เคลมรอตัดสิน · คืนเงิน) — ขีดซ้ายสีข้อมูล/ตอนนี้ (--lt-info · P2) + ป้ายเล็ก "สิ่งที่ต้องทำตอนนี้"
   ยอดที่ต้องตรงกับเงินเข้าอยู่เหนือรูปสลิป · รูปสลิปเตี้ยลงในการ์ดนี้ (แตะเปิดเต็มในแท็บใหม่ตามเดิม) ให้ปุ่มยืนยันอยู่ในจอแรกของมือถือ
   ยอด/ผู้ซื้อ/รายการ/ข้อความ/ขั้นตอน/สลิป เป็นการ์ดพับ .lt-fold (1.20) · คอลัมน์เว้นระยะด้วย gap */
.lt-shop-ordercol { display: flex; flex-direction: column; gap: 14px; }
.lt-shop-ordercol > * + * { margin-top: 0; }
.lt-order-pills { gap: 6px; }
.lt-order-now { border-inline-start: 3px solid var(--lt-info); }
.lt-order-now__eyebrow { margin: 0 0 2px; color: var(--lt-info); font-size: .8125rem; font-weight: 700; line-height: 1.5; }
.lt-order-now > .lt-card__title { margin-top: 0; }
.lt-order-now__amount { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; margin: 0 0 10px; }
.lt-order-now__amount-label { color: var(--lt-muted); font-size: .9375rem; }
.lt-order-now__amount .lt-money { font-size: 1.5rem; font-weight: 700; color: var(--lt-ink); }
/* ยอด + รูปสลิปย่อคู่กัน: รูปกว้าง 104px (แตะเปิดเต็ม) ข้อเท็จจริงทางขวา · จอ ≥ 1024 (สองคอลัมน์) รูปใหญ่ขึ้น */
.lt-order-now__slipbox { display: flex; align-items: flex-start; gap: 12px; margin: 0 0 12px; }
.lt-order-now__thumb { flex: none; display: block; width: 104px; }
.lt-order-now__thumb .lt-shop-slipimg { width: 100%; max-height: 180px; object-fit: cover; object-position: top; }
.lt-order-now__thumb:focus-visible { outline: none; box-shadow: var(--lt-ring); border-radius: var(--lt-radius, 12px); }
.lt-order-now__facts { flex: 1 1 auto; min-width: 0; }
.lt-order-now__facts > .lt-order-now__amount { margin-bottom: 6px; }
.lt-order-now__meta { margin: 0; line-height: 1.6; overflow-wrap: anywhere; }
@media (min-width: 1024px) {
  .lt-order-now__thumb { width: 168px; }
  .lt-order-now__thumb .lt-shop-slipimg { max-height: 300px; }
}
.lt-order-fold > .lt-fold__body > .lt-shop-amount__value:first-child { margin-top: 0; }
.lt-order-fold .lt-shop-msgs__list { margin-top: 0; }
.lt-shop-noslipform { margin-top: 14px; }
.lt-shop-copytext {
  margin: 0 0 10px;
  padding: 10px 12px;
  border: 1px solid var(--lt-border);
  border-radius: 10px;
  background: var(--lt-surface-2);
  color: var(--lt-ink);
  font-size: .9375rem;
  line-height: 1.7;
  overflow-wrap: anywhere;
}

/* ใบปะหน้า /admin/orders/{id}/label — ตัวโตอ่านจากระยะแขน · บรรทัดกุ้งมีชีวิตอยู่บนสุด */
.lt-shop-label-actions { margin-bottom: 14px; }
.lt-shop-label {
  max-width: 150mm;
  margin: 0 auto;
  padding: 8mm;
  border: 2px solid var(--lt-ink);
  border-radius: 4mm;
  background: var(--lt-surface);
  color: var(--lt-ink);
}
.lt-shop-label__row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4mm; }
.lt-shop-label__row > p { margin: 0; }
.lt-shop-label__live { margin: 0 0 5mm; padding: 3mm; border: 3px solid var(--lt-ink); font-size: 1.4rem; font-weight: 700; line-height: 1.4; text-align: center; }
.lt-shop-label__code { font-size: 1.3rem; font-weight: 700; letter-spacing: .08em; font-variant-numeric: tabular-nums; }
.lt-shop-label__name { margin: 2mm 0; font-size: 1.6rem; font-weight: 700; overflow-wrap: anywhere; }
.lt-shop-label__to { margin: 0 0 3mm; font-size: 1.3rem; line-height: 1.5; white-space: pre-line; overflow-wrap: anywhere; }
.lt-shop-label__date { margin: 0 0 2mm; font-size: 1.1rem; font-weight: 700; }
.lt-shop-label__small { margin: 0 0 1mm; font-size: .95rem; }
.lt-shop-label__rule { margin: 4mm 0; border: 0; border-top: 1px dashed var(--lt-border-strong); }
/* ใบปะหน้าของคำสั่งซื้อตัวอย่าง (โหมดข้อมูลตัวอย่าง · ตรวจรอบ 3) — แถบ "ตัวอย่าง ห้ามใช้ส่งของจริง" พิมพ์ติดไปด้วย ผู้ส่งเป็นร้านสมมติ */
.lt-shop-label__sample { margin: 0 0 4mm; padding: 2mm 3mm; border: 2px dashed var(--lt-ink); font-size: 1.15rem; font-weight: 700; letter-spacing: .04em; text-align: center; }
@media print {
  .lt-shop-label { max-width: none; border-width: 1.5px; border-color: #000; background: #fff; color: #000; }
  .lt-shop-label__live { border-color: #000; }
  .lt-shop-label__sample { border-color: #000; }
  .lt-shop-label__rule { border-top-color: #000; }
}

/* ── เคลมกุ้งตาย · บัญชีของฉัน · โซน 9 ของ /app (สั่งซื้อในเว็บ ขั้น 4 · docs/PLAN-orders.md ข้อ 5 ข้อ 9 · 6 ข้อ 6) ──
   หน้า: /app/orders/{id}#doa (.lt-shop-doa) · /admin/orders/{id}#order-doa (.lt-shop-doa .lt-shop-doaform) · /app/orders#account (.lt-shop-account)
   · /app#lt-orders (.lt-shop-pack) · สีจาก var(--lt-*) เท่านั้น (กฎ 19) */
.lt-shop-doa { display: flex; flex-direction: column; gap: 10px; }
.lt-shop-doa > p,
.lt-shop-doa > h2,
.lt-shop-doa > form,
.lt-shop-doa > details { margin: 0; }
.lt-shop-doa__state { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.lt-shop-doa__files { margin: 0; }
.lt-shop-doa__files .lt-shop-slipimg,
.lt-shop-doa__video { display: block; width: 100%; max-width: 360px; margin-top: 6px; }
.lt-shop-doa__video { max-height: 60vh; border: 1px solid var(--lt-border); border-radius: 10px; background: var(--lt-surface-2); }
.lt-shop-doa__terms > summary { cursor: pointer; color: var(--lt-primary); }
.lt-shop-doa__terms > p { margin: 8px 0 0; }
.lt-shop-doaform { display: flex; flex-direction: column; gap: 10px; margin-top: 4px; padding-top: 12px; border-top: 1px solid var(--lt-border); }
.lt-shop-doaform > .lt-fieldset { margin: 0; }
.lt-shop-replacement { margin: 10px 0 0; }
.lt-shop-account { display: flex; flex-direction: column; gap: 10px; margin-top: 24px; padding-top: 14px; border-top: 1px solid var(--lt-border); }
.lt-shop-account > p,
.lt-shop-account > h2,
.lt-shop-account > form { margin: 0; }
.lt-shop-pack { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.lt-shop-pack > .lt-help { margin: -4px 0 0 30px; }
.lt-shop-pack > .lt-check.lt-small { margin-left: 30px; }
.lt-shop-pack > button { align-self: flex-start; }

/* ══ ขัดเงาขั้นที่ 2 — หน้าร้าน ร้านค้า ลูกค้า (docs/PLAN-polish.md ข้อ 5 · 2.1 2.2 2.3 · 24 ต.ค. 2569) ═══════════════
   สีจากตัวแปร --lt-* ล้วน (กติกาข้อ 3 · กฎ 19) ทั้งกลางวันและกลางคืน · ตัวเลข/เงิน .lt-money (--lt-font-num + tabular-nums)
   การเคลื่อนไหวผ่าน --lt-dur/--lt-ease เท่านั้น (บล็อก prefers-reduced-motion ของ app-theme.css ตั้งเป็นศูนย์) · ไม่พึ่งคลาสหรือ JS ของ Bootstrap */

/* ── 2.1 แถบลอย "ราคา + ปุ่มหลัก" (shop_ui_sticky_bar) — หน้าสินค้า · หน้าสั่งซื้อ · หน้ารอชำระ ──
   sticky ที่ขอบล่างของจอ (เต็มความกว้าง ชนขอบจอด้วย margin ติดลบเท่า padding ของ .lt-main) · พื้นใต้แถบเผื่อขอบล่างของ iPhone ด้วย padding
   หมายเหตุ: bottom เป็น 0 ไม่ใช่ var(--lt-safe-b) ตามร่างในแผน — แถบนี้ชนขอบจอ (ไม่ใช่การ์ดลอยแบบ .lt-formbar) ถ้ายกขึ้นเท่าขอบ iPhone
   แล้วยังเติม padding อีกเท่ากัน เนื้อหาจะโผล่ใต้แถบ 34px บน iPhone ที่มีขีดล่าง · .is-hidden (สคริปต์กลาง IntersectionObserver) เลื่อนลงพ้นจอ
   แล้วซ่อนจากการแตะ/คีย์บอร์ด (visibility หลังจบทรานซิชัน) · ≥ 900px ไม่มีแถบ (ปุ่มจริงอยู่ในคอลัมน์ที่เห็น) · พิมพ์ซ่อน (บล็อก print ข้างบน) */
.lt-shop-bar {
  position: sticky;
  bottom: 0;
  z-index: 6;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 56px;
  margin: 16px -16px 0;
  padding: 8px 16px calc(8px + var(--lt-safe-b));
  border-top: 1px solid var(--lt-border);
  background: var(--lt-surface);
  box-shadow: var(--lt-shadow-bar);
  transition: transform var(--lt-dur) var(--lt-ease), visibility 0s linear 0s;
}
.lt-shop-bar.is-hidden {
  visibility: hidden;
  transform: translateY(120%);
  transition: transform var(--lt-dur) var(--lt-ease), visibility 0s linear var(--lt-dur);
}
.lt-shop-bar__text {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-width: 0;
  margin: 0;
  line-height: 1.4;
}
.lt-shop-bar__label { overflow: hidden; color: var(--lt-muted); font-size: .8125rem; text-overflow: ellipsis; white-space: nowrap; }
.lt-shop-bar__money { font-size: 1.125rem; white-space: nowrap; }
.lt-shop-bar__money small { color: var(--lt-muted); font-family: var(--lt-font-body); font-size: .8125rem; font-weight: 500; letter-spacing: 0; }
.lt-shop-bar .lt-btn { flex: none; min-width: 140px; }
.lt-shop-bar__go { white-space: nowrap; }   /* ปุ่มหลักของแถบ ("สั่งซื้อ" · "ยืนยันสั่งซื้อ" · "ส่งสลิป") ไม่หักสองบรรทัด — ข้อความราคาซ้ายตัดท้ายแทน */
/* ปุ่มรอง "คัดลอกยอด" ของหน้ารอชำระ: กว้างตามคำ ปุ่มหลัก "ส่งสลิป" ยังได้ที่ ≥ 140px */
.lt-shop-bar .lt-shop-copy { min-width: 0; padding-inline: 12px; }
@media (max-width: 379.98px) {
  .lt-shop-bar { gap: 8px; }
  .lt-shop-bar .lt-btn { min-width: 112px; }
}
@media (min-width: 768px) {
  .lt-shop-bar { margin-inline: -24px; padding-inline: 24px; }   /* .lt-main ≥ 768 มีระยะข้าง 24px */
}
@media (min-width: 900px) {
  .lt-shop-bar { display: none; }
}

/* ── 2.2 แกลเลอรี: จุดบอกตำแหน่ง · ช่องรูป 1:1 ──
   จุด 8px ใต้แถบ · ใบที่เห็นอยู่ = primary (สคริปต์ของหน้าตั้ง .is-current ด้วย IntersectionObserver ต่อสไลด์ · ไม่มี JS = ใบแรก)
   จุดเป็นของตกแต่ง (aria-hidden) — จำนวนรูปบอกด้วยข้อความ .lt-sr "ปัดดูรูปทั้งหมด n รูป" */
.lt-shop-gallery__item > a.lt-img-slot { overflow: hidden; border-radius: var(--lt-radius); }
.lt-shop-gallery__item > a.lt-img-slot > .lt-shop-gallery__img { border-radius: 0; }
.lt-shop-gallery__dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
}
.lt-shop-gallery__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--lt-border-strong);
  transition: background-color var(--lt-dur) var(--lt-ease), transform var(--lt-dur) var(--lt-ease);
}
.lt-shop-gallery__dot.is-current { background: var(--lt-primary); transform: scale(1.25); }
/* ≥ 900 แกลเลอรีเป็นกริดเห็นทุกรูป ไม่มีอะไรให้ปัด — ซ่อนจุด (รอบปิดขั้นที่ 2: กฎซ่อนในบล็อกจอกว้างข้างบนแพ้ display: flex ของกฎนี้ที่มาทีหลัง
   จุดจึงโผล่ใต้กริดที่ 1280 พร้อมจุดที่สามติด is-current) */
@media (min-width: 900px) {
  .lt-shop-gallery__dots { display: none; }
}
/* จอสัมผัส: จุดบอกตำแหน่งแทนแถบเลื่อนแนวนอนที่เคยโผล่ใต้รูป · เมาส์ยังมีแถบเลื่อนไว้ลาก (ไม่มีนิ้วปัด) */
@media (pointer: coarse) {
  .lt-shop-gallery { scrollbar-width: none; }
  .lt-shop-gallery::-webkit-scrollbar { display: none; }
}

/* ลำดับหัวสงบลง: ชื่อสินค้าเป็นหัวใหญ่ตัวเดียวของหน้า · หัวส่วน (ข้อมูลล็อต รายละเอียด รูปจากตู้จริง ค่าน้ำ) เป็นหัวเล็ก
   · บรรทัด "อัปเดต …" ย้ายไปใต้ข้อมูลล็อต (เดิมแทรกระหว่างป้ายกับราคา) */
.lt-shop-product__updated { margin: 8px 0 0; }

/* ── 2.2 ค่าน้ำสดเป็นการ์ดเล็ก (.lt-shop-water · เฉพาะโคโลนีในตู้รอขายที่มีผลวัดจริง — water_profile ที่พิมพ์เองยังเป็น dl เดิม) ──
   วงกลมไอคอนลอกขนาดจาก .lt-home-bubble ของหน้าแรก (หน้าร้านไม่โหลด home.css) สีจาก --lt-* · ✓ เขียว = อยู่ในช่วงปกติของ care_water_levels()
   ค่าอยู่บรรทัดหนึ่ง หน่วยอีกบรรทัด — การ์ด 4–5 ใบเรียงแถวเดียวได้ตั้งแต่ 360px */
.lt-shop-water { display: flex; flex-direction: column; gap: 10px; margin: 0; }
.lt-shop-water > .lt-section__title,
.lt-shop-water > p { margin: 0; }
.lt-shop-water__list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(62px, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.lt-shop-water__item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  min-width: 0;
  padding: 12px 4px 10px;
  border: 1px solid var(--lt-border);
  border-radius: var(--lt-radius-sm);
  background: var(--lt-surface);
  text-align: center;
}
.lt-shop-bubble {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border: 1.5px solid var(--lt-border-strong);
  border-radius: 50%;
  background: var(--lt-surface-2);
  color: var(--lt-info);
}
.lt-shop-bubble--sm { width: 36px; height: 36px; border-width: 1px; }
.lt-shop-water__label { max-width: 100%; overflow: hidden; color: var(--lt-muted); font-size: .8125rem; font-weight: 600; line-height: 1.5; text-overflow: ellipsis; white-space: nowrap; }
.lt-shop-water__value { font-size: 1.0625rem; line-height: 1.3; white-space: nowrap; }
.lt-shop-water__unit { min-height: 1.2em; color: var(--lt-muted); font-size: .75rem; line-height: 1.6; }
.lt-shop-water__ok { position: absolute; top: 6px; right: 6px; color: var(--lt-ok); line-height: 0; }

/* ── 2.3 หน้าสั่งซื้อ: การ์ด 5 ขั้นมีเลข ──
   ทุก fieldset เป็นการ์ด (.lt-fieldset--card) · legend มีวงกลมเลขจาก counter ของฟอร์ม (1 หน่วยขาย · 2 วิธีส่ง · 3 รอบส่ง · 4 ผู้รับ · 5 ที่อยู่ —
   ร้านพันธมิตรส่งเองไม่มีวิธีส่ง/รอบส่ง เลขจึงต่อกันเองเป็น 1–3) · วงกลม primary-soft/on-soft (11.1:1 · 12.5:1 กลางคืน) */
.lt-shop-checkout { counter-reset: lt-step; }
.lt-fieldset--card {
  padding: 16px;
  border: 1px solid var(--lt-border);
  border-radius: var(--lt-radius);
  background: var(--lt-surface);
  box-shadow: var(--lt-shadow-sm);
}
/* legend อยู่ในการ์ด (หัวการ์ด) ไม่ใช่คร่อมเส้นขอบบนแบบ fieldset ทั่วไป: legend ที่ float ไม่ใช่ "rendered legend" จึงไหลเป็นเนื้อในกรอบ
   (ร่างในแผนเขียน float: none — แบบนั้น legend จะคร่อมเส้นขอบ วงกลมเลขครึ่งหนึ่งหลุดออกนอกการ์ด · ตรวจที่ 390 แล้ว) · ลูกถัดไป clear ให้ไม่ซ้อนข้าง */
.lt-fieldset--card > legend {
  float: left;
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin: 0 0 10px;
  padding: 0;
  font-size: 1.0625rem;
  font-weight: 600;
  line-height: 1.45;
}
.lt-fieldset--card > legend ~ * { clear: left; }   /* ทุกลูก ไม่ใช่แค่ตัวถัดไป — ลูกแรกอาจซ่อนอยู่ (ชิป "ใช้ที่อยู่เดิม") */
.lt-shop-checkout .lt-fieldset--card > legend::before {
  content: counter(lt-step);
  counter-increment: lt-step;
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--lt-primary-soft);
  color: var(--lt-on-soft);
  font-family: var(--lt-font-num);
  font-size: .9375rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

/* ระยะในการ์ดของหน้าสั่งซื้อ: การ์ดห่างกัน 12px · ช่องห่างกัน 12px · กล่องตัวเลือก padding 10px — พื้นที่แตะยังสูง ≥ 44px (.lt-radio) */
.lt-shop-checkout > .lt-fieldset--card,
.lt-shop-checkout > .lt-shop-note,
.lt-shop-checkout > .lt-shop-ack { margin: 0 0 12px; }   /* กล่องติ๊กสัตว์มีชีวิตเว้นเท่าการ์ด (เดิม 20px ของ .lt-field) */
.lt-shop-item { margin-bottom: 12px; }                   /* การ์ดสินค้าบนสุดห่างการ์ดขั้น 1 เท่าการ์ดอื่น */
.lt-fieldset--card .lt-field { margin-bottom: 12px; }
.lt-fieldset--card > .lt-help { margin: 8px 0 0; }   /* ล้าง margin-bottom 1rem ของ <p> จาก reboot — การ์ดไม่มีที่ว่างค้างท้าย */
.lt-fieldset--card > :last-child,
.lt-fieldset--card .lt-field > p:last-child { margin-bottom: 0; }
.lt-shop-checkout .lt-radio--block { padding: 10px 12px; }
/* ชื่อ + เบอร์ของผู้รับเคียงกันตั้งแต่ 360px (ช่องละ ~157px ที่ 390 · เบอร์ 10 หลักพอดี) — เดิมเคียงกันเฉพาะ ≥ 600 */
@media (min-width: 360px) {
  .lt-shop-checkout .lt-fieldset--card > .lt-shop-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 12px; }
}
/* จังหวัด + รหัสไปรษณีย์ แถวเดียวกันทุกจอ (รหัส 5 หลักไม่ต้องกว้าง) — พิมพ์รหัสแล้วสคริปต์เติมจังหวัดข้าง ๆ ให้เห็นทันที */
.lt-shop-checkout .lt-shop-address > .lt-shop-pair { grid-template-columns: minmax(0, 1fr) minmax(7.5rem, 9rem); column-gap: 12px; }
.lt-shop-address > .lt-shop-pair:last-child > .lt-field { margin-bottom: 0; }
/* หมายเหตุพับ (หน้าสั่งซื้อ) · เวลาที่โอนพับ (ฟอร์มสลิป · รอบปิดขั้นที่ 2): หัวการ์ดพับบอกชื่อช่องแล้ว ป้ายของช่องเหลือให้โปรแกรมอ่านจอ (ยังผูก for=id ตามเดิม) */
.lt-shop-note .lt-label,
.lt-shop-declared .lt-label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}
.lt-shop-note .lt-field,
.lt-shop-declared .lt-field { margin-bottom: 0; }
.lt-shop-declared > summary { min-height: 44px; font-size: .9375rem; }
.lt-shop-declared > .lt-fold__body { padding-top: 2px; }

/* การ์ดสินค้าบนสุด: รูปปก 56px + ชื่อ + ราคาหน่วยที่เลือก (สคริปต์สลับข้อความที่เซิร์ฟเวอร์จัดรูปไว้ · data-lt-unit-text) */
.lt-shop-item__img {
  display: block;
  flex: none;
  width: 56px;
  height: 56px;
  border-radius: var(--lt-radius-sm);
  background: var(--lt-surface-2);
  object-fit: cover;
}
.lt-shop-item__img--none { display: flex; align-items: center; justify-content: center; color: var(--lt-primary); }
.lt-shop-item__unit { margin: 0; color: var(--lt-muted); font-size: .9375rem; }

/* กลุ่มที่มีตัวเลือกเดียว (วิธีส่งเดียว · รอบเดียว · หน่วยขายเดียว): วิทยุที่ติ๊กไว้แล้วซ่อนจากตา (ยังอยู่ใน DOM ส่งค่าเดิม · คีย์บอร์ดยังโฟกัสได้)
   การ์ดบรรทัดเดียว — ค่าเป็นบรรทัดข้อความใต้หัวการ์ด ไม่มีกล่อง/ขอบ/พื้น (ไม่ใช่ "ตัวเลือก" ที่ต้องกด · ไม่ต้องสูง 44px)
   ที่ 390 การ์ดละ ~22px เตี้ยลง — /shop/1/order วิธีส่งเดียว + รอบเดียว 2,443 → ≤ 2,400 (ตรวจรับ 2.3) · โฟกัสคีย์บอร์ดยังเห็นวงแหวนรอบบรรทัด */
.lt-shop-choice--single .lt-radio--block {
  position: relative;
  min-height: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  cursor: default;
}
.lt-shop-choice--single .lt-radio--block:has(input:checked) { border-color: transparent; box-shadow: none; }
.lt-shop-choice--single .lt-radio--block:has(input:focus-visible) { box-shadow: var(--lt-ring); }
.lt-shop-choice--single .lt-radio--block input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}
.lt-shop-choice--single .lt-radio--block > span { flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: 0 8px; }
.lt-shop-choice--single .lt-shop-variant__qty { padding-inline-start: 0; }   /* ไม่มีวงกลมให้เยื้องตาม */

/* ชิป "ใช้ที่อยู่เดิม" (localStorage rb_ship_to ผ่าน ltStore) + "ลืมที่อยู่นี้" — ซ่อนจนสคริปต์เจอที่อยู่ที่จำไว้และช่องยังว่าง */
.lt-shop-memory { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin: 0 0 12px; }
.lt-shop-memory[hidden] { display: none; }
.lt-shop-memory .lt-chip { max-width: 100%; }
.lt-shop-memory__label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ติดเพดานคำสั่งซื้อค้างจ่าย: การ์ดรายการที่ค้าง (แถว .lt-rowitem ในการ์ด · ลิงก์ไปคำสั่งซื้อนั้น) + ปุ่มหลักไปหน้าคำสั่งซื้อ — ไม่ใช่ทางตัน */
.lt-shop-stuck { display: flex; flex-direction: column; gap: 10px; }
.lt-shop-stuck > h2,
.lt-shop-stuck > p,
.lt-shop-stuck > ul { margin: 0; }
.lt-shop-stuck .lt-rowitem__side .lt-money { font-size: 1.0625rem; }
.lt-shop-stuck__left { white-space: nowrap; }

/* ── 2.4 หน้าคำสั่งซื้อของลูกค้า /app/orders/{id}: "ตอนนี้ต้องทำอะไร / ของอยู่ไหน" ในจอแรก ── */

/* แถบขั้นตอนแนวนอน 5 จุด (shop_ui_steps_bar) ใต้ชิปสถานะ — ช่องเท่ากันตามจำนวนขั้น (นัดรับ 4 · ยกเลิก = ขั้นที่ทำแล้ว + ขั้นหยุด)
   จุด 20px บนเส้นเชื่อม · ป้ายสั้นใต้จุด · "ตอนนี้" ชิปเล็กใต้ป้าย · ทำแล้ว = ทึบเขียว + ✓ · ตอนนี้ = วงแหวนฟ้าข้อมูล · ยังไม่ถึง = วงกลวง · หยุด = วงสนิม
   เส้นเชื่อม = ::before ของแต่ละช่อง (กลางช่องก่อนหน้า → กลางช่องนี้) มีสีเมื่อช่องนี้ทำแล้วหรือเป็นช่องปัจจุบัน = "สีถึงจุดปัจจุบัน" */
.lt-shop-steps--bar {
  display: grid;
  grid-auto-columns: minmax(0, 1fr);
  grid-auto-flow: column;
  max-width: 560px;   /* จอกว้าง: ห้าจุดไม่ยืดเต็ม 1,100px (ช่องห่างเกินจนอ่านเป็นแถวเดียวไม่ออก) */
  margin: 8px 0 0;
}
.lt-shop-steps.lt-shop-steps--bar .lt-shop-steps__item {
  flex-direction: column;
  justify-content: flex-start;
  gap: 4px;
  min-height: 0;
  padding: 0 2px;
  font-size: .8125rem;
  line-height: 1.5;
  text-align: center;
}
.lt-shop-steps.lt-shop-steps--bar .lt-shop-steps__item::before {
  top: 9px;
  bottom: auto;
  left: -50%;
  right: 50%;
  width: auto;
  height: 2px;
  background: var(--lt-border-strong);
}
.lt-shop-steps.lt-shop-steps--bar .lt-shop-steps__item:first-child::before { display: none; }
.lt-shop-steps.lt-shop-steps--bar .lt-shop-steps__item.is-done::before,
.lt-shop-steps.lt-shop-steps--bar .lt-shop-steps__item.is-current::before { background: var(--lt-ok); }
.lt-shop-steps.lt-shop-steps--bar .lt-shop-steps__dot {
  position: relative;
  z-index: 1;
  top: auto;
  left: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin: 0;
  border-width: 2px;
}
.lt-shop-steps.lt-shop-steps--bar .lt-shop-steps__item.is-done .lt-shop-steps__dot { border-color: var(--lt-ok); background: var(--lt-ok); box-shadow: none; color: var(--lt-surface); }
.lt-shop-steps.lt-shop-steps--bar .lt-shop-steps__item.is-current .lt-shop-steps__dot { left: auto; margin: 0; border-width: 5px; border-color: var(--lt-info); }
.lt-shop-steps.lt-shop-steps--bar .lt-shop-steps__item.is-stopped .lt-shop-steps__dot { border-width: 3px; }
.lt-shop-steps--bar .lt-shop-steps__label { max-width: 100%; overflow-wrap: anywhere; }
/* ชิป "ตอนนี้": ไม้โทของ "นี้" (สระอี + วรรณยุกต์ซ้อน) เคยแตะขอบบนของชิปที่ 12px/1.5 — เผื่อบนล่าง (P6 สระ/วรรณยุกต์ไม่ชนขอบ · รอบปิดขั้นที่ 2) */
.lt-shop-steps--bar .lt-shop-steps__now { padding: 2px 6px 1px; font-size: .75rem; line-height: 1.6; white-space: nowrap; }

/* หัว "สั่งซื้อสำเร็จ" (?new=1 ครั้งเดียว · P5): โลโก้ 48px ป๊อปครั้งเดียว (.lt-anim-pop · ลดการเคลื่อนไหว = โผล่ทันที) + รหัส + ขั้นถัดไปบรรทัดเดียว
   แถบซ้ายเขียว = เรื่องดี (ไม่ใช่แดงของปุ่ม) · เส้นขอบโลโก้ใช้ตัวแปรของเว็บ (home.css ไม่ได้โหลดที่หน้านี้) */
.lt-shop-done {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0;
  border-color: var(--lt-ok);
  border-inline-start: 4px solid var(--lt-ok);
}
.lt-shop-done__mark { display: inline-flex; flex: none; }
.lt-shop-done__logo { display: block; }
.lt-shop-done__logo .lt-home-mark__line { stroke: var(--lt-primary-hover); }
.lt-shop-done__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.lt-shop-done__title { margin: 0; font-size: 1.125rem; font-weight: 700; line-height: 1.45; overflow-wrap: anywhere; }
.lt-shop-done__next { color: var(--lt-ink); font-size: 1rem; line-height: 1.5; }

/* กล่อง "ตอนนี้" ของคำสั่งซื้อที่ส่งแล้ว: เลขพัสดุ + คัดลอก + ติดตามพัสดุ อยู่ในกล่องเดียว · การ์ด "ได้รับกุ้งแล้ว" ต่อท้าย */
.lt-shop-next__track { margin-top: 8px; }
.lt-shop-next__track .lt-btn { flex: none; }
.lt-shop-share svg { flex: none; }

/* สองคอลัมน์ (≥ 900px): ซ้าย ตอนนี้ · เคลม · ชำระ · สลิป — ขวา 360px ขั้นตอนทั้งหมด · รายการ · ที่อยู่ · ยกเลิก · ข้อความ · ส่วนบน/ล่างเต็มแถว
   จอแคบ = คอลัมน์เดียวเรียงซ้ายแล้วขวา (ลำดับ DOM เดียวกับจอกว้าง ไม่มีการย้ายโหนด) */
.lt-shop-order__main,
.lt-shop-order__side { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.lt-shop-order__main > .lt-note,
.lt-shop-order__side > .lt-note { margin: 0; }
.lt-shop-order__side > .lt-fold,
.lt-shop-order__main > .lt-fold { margin: 0; }
@media (min-width: 900px) {
  .lt-shop-order { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 24px; align-items: start; }
  .lt-shop-order > * { grid-column: 1 / -1; }
  .lt-shop-order > .lt-shop-order__main { grid-column: 1; }
  .lt-shop-order > .lt-shop-order__side { grid-column: 2; }
  .lt-shop-order > .lt-shop-actions { margin-top: 4px; }
}

/* วิธีโอน 4 ข้อเป็นการ์ดพับ (เปิดไว้ก่อน · จำการปิดในเครื่อง rb_qr_howto) — เส้นคั่นบนแทนกรอบ (อยู่ในการ์ดชำระเงินอยู่แล้ว) */
.lt-shop-qr__howto { border-top: 1px solid var(--lt-border); }
.lt-shop-qr__howto > summary { min-height: 44px; }
.lt-shop-qr__howto > .lt-fold__body { padding-top: 2px; }

/* "รายการ · ฿980.64": ยอดรวมบนหัวการ์ดพับชิดขวาข้างลูกศร เห็นแม้พับ (ตัวเลขฟอนต์เงิน) · ในการ์ดไม่มีกรอบซ้อน */
.lt-shop-itemsfold > summary::after { margin-inline-start: 0; }
.lt-shop-itemsfold .lt-fold__meta {
  margin-inline-start: auto;
  color: var(--lt-ink);
  font-family: var(--lt-font-num);
  font-size: 1rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  letter-spacing: .01em;
}

/* รอบปิดขั้นที่ 2 — การ์ดพับของหน้าคำสั่งซื้อบนจอ (.lt-shop-printfold = ตอนพิมพ์กลับเป็นโซนเดิม · บล็อก @media print ด้านบน)
   หัวข้อเดิม .lt-shop-printonly ซ่อนบนจอ (หัวการ์ดพับบอกอยู่แล้ว) · .lt-shop-lines ยังเป็น .lt-card เดิม — บนจอในการ์ดพับไม่มีกรอบซ้อน
   ระยะในการ์ดพับเฉพาะบนจอ (@media screen) กระดาษจึงได้ระยะเดิมของโซน */
.lt-shop-printonly { display: none; }
.lt-shop-msgfold > .lt-fold__body { display: flex; flex-direction: column; gap: 12px; }
@media screen {
  .lt-shop-order__side > .lt-section + .lt-section { margin-top: 0; }   /* โซนที่ห่อการ์ดพับ — ระยะมาจาก gap ของคอลัมน์ */
  .lt-shop-itemsfold .lt-shop-lines.lt-card { padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
  .lt-shop-msgfold .lt-shop-msgs__empty { display: none; }   /* ซ้ำกับหัวการ์ดพับ "ยังไม่มีข้อความ" — กระดาษยังพิมพ์บรรทัดนี้ */
}
.lt-shop-slipsfold .lt-fold__meta { font-variant-numeric: tabular-nums; }   /* "ไม่ผ่าน · 24 ต.ค. 2569 19:24" ของสลิปใบล่าสุด */
.lt-shop-shipfold .lt-fold__meta { margin-inline-start: auto; }
.lt-shop-shipfold > summary::after { margin-inline-start: 0; }

/* โอนด้วยเลขพร้อมเพย์ (ทางสำรองของ QR) เป็นการ์ดพับในการ์ดชำระ: เส้นคั่นบนแบบวิธีโอน · เลขพร้อมเพย์บนหัวเห็นแม้พับ (ตัวเลขฟอนต์เงิน) */
.lt-shop-payfold { border-top: 1px solid var(--lt-border); }
.lt-shop-payfold > summary { min-height: 44px; }
.lt-shop-payfold > summary::after { margin-inline-start: 0; }
.lt-shop-payfold .lt-fold__meta {
  margin-inline-start: auto;
  color: var(--lt-ink);
  font-family: var(--lt-font-num);
  font-size: .9375rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.lt-shop-payfold > .lt-fold__body { display: flex; flex-direction: column; gap: 14px; padding-top: 2px; }
.lt-shop-payfold > .lt-fold__body > p { margin: 0; }

/* ฟอร์มแจ้งกุ้งตายในการ์ดพับ (หัวบอกเส้นตาย) — ช่องเรียงลงระยะเดียวกับการ์ดเคลมเดิม */
.lt-shop-doa__form { display: flex; flex-direction: column; gap: 10px; }
.lt-shop-doa__form > p,
.lt-shop-doa__form > .lt-note,
.lt-shop-doa__form > .lt-field { margin: 0; }
@media screen {   /* กระดาษใช้ระยะของโซนเดิม (รอบปิดขั้นที่ 2) */
  .lt-shop-otherdevice .lt-fold__body > * + * { margin-top: 10px; }
  .lt-shop-otherdevice .lt-fold__body > p { margin-bottom: 0; }
}
/* ฟอร์มแนบสลิป: คำใบ้ใต้ช่องบรรทัดเดียว (2.8) ไม่มีระยะ <p> ของ reboot ค้างก่อนข้อความความเป็นส่วนตัว */
.lt-shop-slipform .lt-field { margin-bottom: 8px; }
.lt-shop-slipform .lt-field > .lt-help { margin-bottom: 0; }

/* ── 2.8 รายการคำสั่งซื้อของฉัน /app/orders: แถวมีรูป · ยอดใหญ่สุดของแถว · นับถอยหลังของรายการรอชำระ ──
   ตาราง 3 ช่อง: รูป 56px | ชื่อสินค้า (≤ 2 บรรทัด) — ยอดชิดขวา | รหัส + ชิป · เวลาสั่ง + เวลาที่เหลือ ใต้ชื่อ · ทั้งแถวเป็นลิงก์เดียว (โฟกัสวงแหวนเดิม) */
.lt-shop-orderrow__link {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr) auto;
  grid-template-areas: "img title amount" "img top top" "img meta meta";
  align-items: start;
  gap: 4px 12px;
}
.lt-shop-orderrow__img {
  grid-area: img;
  display: block;
  width: 56px;
  height: 56px;
  border-radius: var(--lt-radius-sm);
  background: var(--lt-surface-2);
  object-fit: cover;
}
.lt-shop-orderrow__img--none { display: flex; align-items: center; justify-content: center; color: var(--lt-primary); }
.lt-shop-orderrow__title {
  grid-area: title;
  display: -webkit-box;
  overflow: hidden;
  font-weight: 600;
  line-height: 1.5;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.lt-shop-orderrow__amount { grid-area: amount; color: var(--lt-ink); font-size: 1.125rem; font-weight: 700; line-height: 1.4; white-space: nowrap; }
.lt-shop-orderrow__top { grid-area: top; }
.lt-shop-orderrow__meta { grid-area: meta; }
.lt-shop-orderrow__left { color: var(--lt-warn); font-weight: 600; white-space: nowrap; }
.lt-shop-orderrow__pay { align-self: stretch; }
@media (min-width: 560px) {
  .lt-shop-orderrow__pay { align-self: flex-end; min-width: 160px; }
}

/* บัญชีของฉัน (ส่งออก · ลบบัญชี) เป็นการ์ดพับท้ายหน้า — เนื้อในเรียงลงระยะเดิม (แทนเส้นคั่นบนของบล็อกเดิม) */
.lt-shop-account.lt-fold { display: block; margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--lt-border); }
.lt-shop-account > .lt-fold__body { display: flex; flex-direction: column; gap: 10px; }
.lt-shop-account > .lt-fold__body > p,
.lt-shop-account > .lt-fold__body > form { margin: 0; }

/* ── 2.5 รายการสินค้า · การ์ดหน้าแรก · กติกาปุ่มติดต่อเดียว · การ์ดลิงก์ ──
   การ์ด (shop_ui_product_card): ป้ายทับรูปเหลือเฉพาะ ใกล้หมด/หมด/จองแล้ว · "พร้อมส่ง" = จุดเขียว + คำ ข้างป้ายเกรด (ไม่ใช่แดง — แดงเป็นของปุ่มหลัก P2)
   แถวป้าย เกรด · F2 (.lt-pill--tag) · พร้อมส่ง → ชื่อ → สายเลือดบรรทัดเดียว → อายุ ≤ 2 บรรทัด → ราคาชิดล่าง (margin-top: auto · ฐานราคาแถวเดียวกันเสมอกัน) */
.lt-shop-card__tags { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; }
.lt-shop-card__tags .lt-pill { font-size: .8125rem; }
.lt-shop-card__state,
.lt-shop-state {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--lt-ink);
  font-size: .8125rem;
  font-weight: 500;
  line-height: 1.6;
  white-space: nowrap;
}
.lt-shop-card__state::before,
.lt-shop-state::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--lt-ok); }
.lt-shop-state { font-size: .875rem; }
.lt-shop-card__bloodline { display: block; max-width: 100%; overflow: hidden; font-size: .8125rem; text-overflow: ellipsis; white-space: nowrap; }
.lt-shop-card__meta { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.lt-shop-card__foot { display: flex; flex-direction: column; align-self: stretch; margin-top: auto; padding-top: 2px; }
.lt-shop-card__foot > .lt-shop-card__unit { line-height: 1.5; }

/* /shop: ชิปชนิดเป็นแถวเลื่อนข้างเหนือพับตัวกรอง · การ์ดลิงก์ "ก่อนซื้อ อ่านตรงนี้" + ปุ่มติดต่อท้ายหน้า (ย้ายจากหัว) */
.lt-shop-varieties { margin: 0 0 10px; }
.lt-shop-more { margin-top: 28px; }
.lt-shop-more > .lt-section__title { margin-bottom: 12px; }
.lt-shop-linkcards { margin-top: 24px; }
.lt-shop-actions:empty { display: none; }   /* ไม่ได้ตั้งลิงก์ LINE/Facebook = ไม่มีปุ่ม ไม่มีที่ว่างค้าง */
/* คงเหลือ: บรรทัด muted ขนาดชุด + กลุ่มที่มา ใต้ "เหลือ 19 คู่ · 7 ชุด" (2.8) */
.lt-shop-dl__sub { display: block; margin-top: 2px; font-size: .875rem; line-height: 1.6; }

/* ── 2.6 คู่มือและเกี่ยวกับ: บันไดเกรด · ขั้นตอนรับกุ้ง · การ์ดสรุปนโยบาย · ข้อมูลที่เราเก็บพับไว้ ── */

/* บันไดเกรด /guide/grades: แถวละเกรด ป้ายเกรด + แถบสัดส่วนแดง–ขาว–แดง (ภาพประกอบ · --ladder-a/--ladder-b จากตารางในหน้า) → คำอธิบาย → ชิปเต็มแถว ≥ 44px
   สีของแถบจากตัวแปรเว็บ: แดง = --lt-primary · ขาวของตัวกุ้ง = --lt-surface กลางวัน / --lt-ink กลางคืน (กุ้งขาวต้องสว่างบนการ์ดกรมท่า) — ตัวแปรเฉพาะที่ ไม่ใช่โทเคนใหม่ */
.lt-grade-ladder {
  display: flex;
  flex-direction: column;
  margin: 0 0 8px;
  padding: 0;
  list-style: none;
  border: 1px solid var(--lt-border);
  border-radius: var(--lt-radius);
  background: var(--lt-surface);
  box-shadow: var(--lt-shadow-sm);
}
.lt-grade-ladder__row { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 12px 14px; }
.lt-grade-ladder__row + .lt-grade-ladder__row { border-top: 1px solid var(--lt-border); }
.lt-grade-ladder__head { display: flex; align-items: center; gap: 12px; }
.lt-grade-ladder__grade { flex: none; justify-content: center; min-width: 5.5em; font-weight: 600; }
.lt-grade-ladder__bar {
  --ladder-white: var(--lt-surface);
  flex: 1 1 auto;
  height: 12px;
  border: 1px solid var(--lt-border-strong);
  border-radius: 999px;
  background: var(--lt-primary);
  background: linear-gradient(90deg, var(--lt-primary) 0 var(--ladder-a, 30%), var(--ladder-white) var(--ladder-a, 30%) var(--ladder-b, 70%), var(--lt-primary) var(--ladder-b, 70%) 100%);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .lt-grade-ladder__bar { --ladder-white: var(--lt-ink); }
}
:root[data-theme="dark"] .lt-grade-ladder__bar { --ladder-white: var(--lt-ink); }
.lt-grade-ladder__text { line-height: 1.7; }
.lt-grade-ladder__link { align-self: stretch; justify-content: center; min-height: var(--lt-tap, 44px); }
.lt-grade-ladder__caption { margin: 0 0 16px; }

/* ขั้นตอนรับกุ้ง /guide/receiving: แถบแนวตั้งของ .lt-shop-steps — วงเลข 1–6 (สีเดียวกับวงเลขขั้นของหน้าสั่งซื้อ) + ไอคอน + หัวสั้น + เนื้อความเต็ม */
.lt-shop-steps.lt-guide-steps .lt-guide-steps__item {
  align-items: flex-start;
  min-height: 0;
  padding: 0 0 18px 46px;
  color: var(--lt-ink);
}
.lt-shop-steps.lt-guide-steps .lt-guide-steps__item::before { top: 34px; bottom: 2px; left: 15px; background: var(--lt-border-strong); }
.lt-shop-steps.lt-guide-steps .lt-guide-steps__item:last-child { padding-bottom: 0; }
.lt-shop-steps.lt-guide-steps .lt-guide-steps__item:last-child::before { display: none; }
.lt-shop-steps.lt-guide-steps .lt-guide-steps__num {
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  margin: 0;
  border: 0;
  background: var(--lt-primary-soft);
  color: var(--lt-on-soft);
  font-family: var(--lt-font-num);
  font-size: .9375rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.lt-guide-steps__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding-top: 4px; }
.lt-guide-steps__title { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; line-height: 1.5; }
.lt-guide-steps__title svg { flex: none; color: var(--lt-primary); }
.lt-guide-steps__text { line-height: 1.7; }

/* /guide/policy: การ์ดสรุปเป็นคู่ชื่อ–ค่า .lt-kv · "ข้อมูลที่เราเก็บจากคุณ" เป็นการ์ดพับ (หัวข้อเป็น h2 ใน summary) */
.lt-guide-summary .lt-kv > dd .lt-list { margin: 0; padding-inline-start: 1.1em; }
.lt-guide-privacy { margin: 28px 0 0; }   /* ระยะเท่า .lt-section + .lt-section (details เป็น flex ของ .lt-section ไม่ได้ — ช่องว่างของเนื้อที่พับค้าง) */
.lt-guide-privacy > summary > .lt-section__title { margin: 0; }
.lt-guide-privacy > .lt-fold__body > p:last-child { margin-bottom: 0; }

/* /o/{token} (แผนขัดเงา 2.7): รหัส + ชิปสถานะบรรทัดเดียว · ชื่อสินค้าใต้รหัส เหนือปุ่ม "เปิดคำสั่งซื้อ" */
.lt-shop-link__code { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.lt-shop-link__item { color: var(--lt-ink); font-weight: 600; line-height: 1.5; overflow-wrap: anywhere; }
/* การ์ดพับของหน้าคำสั่งซื้อ (2.4): ขั้นตอนทั้งหมด · ฟอร์มแจ้งกุ้งตาย — ระยะเนื้อในใต้หัวการ์ด (บนจอเท่านั้น · กระดาษเป็นโซนเดิม รอบปิดขั้นที่ 2) */
@media screen {
  .lt-shop-timeline .lt-shop-steps { margin-top: 4px; }
  .lt-shop-doafold > .lt-fold__body { padding-top: 6px; }
}
/* แถวตัวกรองของ /shop (2.5): ชิปชนิด (เลื่อนข้าง ยืดเต็มที่เหลือ) + ปุ่ม "ตัวกรอง" แถวเดียว · กางพับแล้วพับย้ายลงแถวใหม่เต็มกว้าง แผงตัวกรองไม่ถูกบีบ
   หัว /shop แน่นขึ้น (รอบปิดขั้นที่ 2 · ตรวจรับ 2.5 "การ์ดแรกเริ่ม ≤ 240px" ที่ 390 — เดิม 267 · หลังแก้ ~238): ชื่อ → คำนำ 4px · "รอบส่งถัดไป" ชิดคำนำ (2px)
   บรรทัดเดียว line-height 1.6 · หัวห่างแถวตัวกรอง 12px · แถวตัวกรองห่างการ์ด 10px — พื้นที่แตะของชิป/ปุ่มตัวกรองเท่าเดิม */
.lt-shop-filterbar { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 0 8px; margin: 0 0 10px; }
.lt-shop-filterbar > .lt-shop-varieties { flex: 1 1 0; min-width: 0; margin: 0; }
.lt-shop-filterbar > .lt-filterfold { flex: none; margin: 0; }
.lt-shop-filterbar > .lt-filterfold[open] { flex: 1 0 100%; order: 2; margin-top: 8px; }
.lt-shop-head { gap: 4px; margin-bottom: 12px; }
.lt-shop-head .lt-page__title,
.lt-shop-head .lt-page__lead { margin-bottom: 0; }
.lt-shop-head .lt-shop-ship { margin-top: -2px; line-height: 1.6; }

/* =============================================================
   วิดีโอสินค้า (26 ต.ค. 2569 · docs/PLAN-video.md ข้อ 5.11 · layout/video_ui.php)
   หน้าร้าน: ช่องคลิปจัตุรัสในแกลเลอรีเดิม (--lt-img-ratio: 1) · ป้าย ▶ วิดีโอ 0:24 · ปุ่มขยาย 44×44 · ช่อง YouTube แตะแล้วเล่น · การ์ดลิงก์
   หน้าแก้: ส่วน #videos (ปุ่มกล้อง/อัลบั้มชุดเดียวกับช่องรูป · คิวอัปพร้อม progress · ฟอร์มลิงก์ · การ์ดจัดการ) · /app/products ป้าย ▶ n
   สีจากโทเคนเดิมล้วน (กลางวัน/กลางคืน) · พื้นที่แตะ ≥ 44px · จอ 360–390px ไม่มีเลื่อนแนวนอน
   ============================================================= */

/* ── ช่องคลิปในแกลเลอรี ── */
.lt-shop-video { position: relative; overflow: hidden; border-radius: var(--lt-radius); background: var(--lt-media-bg, #000); }
.lt-shop-video__el { display: block; width: 100%; height: 100%; object-fit: contain; background: var(--lt-media-bg, #000); }
/* ป้าย ▶ วิดีโอ 0:24 มุมซ้ายบน (ปุ่มขยายอยู่ขวาบน) — เดิมซ้ายล่างทับแถบควบคุมของเบราว์เซอร์ (▶ 0:00 / 0:02 + แถบเวลา) ก่อนกดเล่น (ผู้ตรวจ 26 ต.ค. 2569) */
.lt-shop-video__badge {
  position: absolute;
  top: 10px;
  left: 10px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 10px;
  border-radius: 999px;
  background: var(--lt-ink);
  background: color-mix(in srgb, var(--lt-ink) 78%, transparent);
  color: var(--lt-surface);
  font-size: .8125rem;
  font-weight: 600;
  line-height: 1.5;
  pointer-events: none;
}
.lt-shop-video__badge svg { flex: none; }
.lt-shop-video.is-playing .lt-shop-video__badge { display: none; }
.lt-shop-video__expand {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--lt-surface);
  color: var(--lt-ink);
  box-shadow: var(--lt-shadow-sm);
}
.lt-shop-video__expand:focus-visible { outline: none; box-shadow: var(--lt-ring); }
.lt-shop-video__hint {
  position: absolute;
  right: 8px;
  bottom: 52px;
  left: 8px;
  margin: 0;
  padding: 6px 10px;
  border-radius: var(--lt-radius-sm);
  background: var(--lt-surface);
  color: var(--lt-ink);
  line-height: 1.5;
}
.lt-shop-video__hint a { font-weight: 600; }
/* ไม่มีรูปให้เป็นภาพปก — ช่องสีพื้นพร้อมไอคอน ▶ กลางช่อง (ก่อนกดเล่น · ไม่มี ffmpeg จึงไม่มีภาพจากเฟรม) */
.lt-shop-video--tile { background: var(--lt-surface-2); }
.lt-shop-video--tile .lt-shop-video__el { background: transparent; }
.lt-shop-video--tile::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 64px;
  height: 64px;
  margin: -32px 0 0 -32px;
  border-radius: 50%;
  background: var(--lt-primary);
  opacity: .9;
  pointer-events: none;
}
.lt-shop-video--tile::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  margin: -12px 0 0 -7px;
  border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
  border-left: 19px solid var(--lt-on-primary);
  pointer-events: none;
}
.lt-shop-video--tile.is-playing::before,
.lt-shop-video--tile.is-playing::after { display: none; }

/* ── ช่อง YouTube (facade · แตะแล้วจึงสร้าง iframe youtube-nocookie.com) ── */
.lt-shop-yt {
  position: relative;
  overflow: hidden;
  border-radius: var(--lt-radius);
  background-color: var(--lt-ink);
  background-image: linear-gradient(color-mix(in srgb, var(--lt-ink) 55%, transparent), color-mix(in srgb, var(--lt-ink) 55%, transparent)), var(--lt-yt-poster, none);
  background-position: center;
  background-size: cover;
}
.lt-shop-yt--plain { background-color: var(--lt-surface-2); background-image: none; }
.lt-shop-yt__open {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  height: 100%;
  min-height: 44px;
  padding: 12px;
  color: var(--lt-surface);
  font-weight: 700;
  text-align: center;
  text-decoration: none;
}
.lt-shop-yt__open:hover { color: var(--lt-surface); }   /* ตัวอักษรบนพื้นมืดคงสีเดิมตอนชี้ (กฎ a:hover ทั้งเว็บเป็นสีลิงก์) */
.lt-shop-yt--plain .lt-shop-yt__open,
.lt-shop-yt--plain .lt-shop-yt__open:hover { color: var(--lt-ink); }
.lt-shop-yt__open:focus-visible { outline: none; box-shadow: var(--lt-ring); }
.lt-shop-yt__play {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--lt-primary);
  color: var(--lt-on-primary);
  box-shadow: var(--lt-shadow);
}
.lt-shop-yt__frame { display: block; width: 100%; height: 100%; border: 0; background: var(--lt-media-bg, #000); }

/* ── การ์ดลิงก์ TikTok Facebook Instagram (ใต้จุดของแกลเลอรี) ── */
.lt-shop-cliplinks { display: flex; flex-direction: column; gap: 8px; margin: 12px 0 0; padding: 0; list-style: none; }
.lt-shop-cliplink {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 52px;
  padding: 8px 14px;
  border: 1px solid var(--lt-border);
  border-radius: var(--lt-radius);
  background: var(--lt-surface);
  color: var(--lt-ink);
  text-decoration: none;
  transition: background-color var(--lt-dur) var(--lt-ease);
}
.lt-shop-cliplink:hover { background: var(--lt-surface-2); }
.lt-shop-cliplink:focus-visible { outline: none; box-shadow: var(--lt-ring); }
.lt-shop-cliplink__icon { display: inline-flex; flex: none; color: var(--lt-primary); }
.lt-shop-cliplink__text { display: flex; flex: 1 1 auto; flex-direction: column; min-width: 0; }
.lt-shop-cliplink__title { font-weight: 700; line-height: 1.5; }
.lt-shop-cliplink__sub { overflow: hidden; font-size: .8125rem; line-height: 1.5; text-overflow: ellipsis; white-space: nowrap; }
.lt-shop-cliplink__out { display: inline-flex; flex: none; color: var(--lt-muted); }

/* ── ส่วน "วิดีโอ" ของหน้าแก้ประกาศ ── */
.lt-videomgr { display: flex; flex-direction: column; gap: 12px; }
.lt-videomgr__head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.lt-videomgr__head .lt-section__title { margin: 0; }
.lt-videomgr__count { flex: none; }
.lt-videomgr__upload,
.lt-videomgr__linkform { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 14px; }
.lt-videomgr__upload .lt-field,
.lt-videomgr__linkform .lt-field { margin: 0; }
.lt-videomgr__linkform > .lt-btn { align-self: flex-start; }
.lt-videomgr__full { margin: 0; color: var(--lt-warn); font-weight: 600; }
.lt-videomgr__nojs { display: flex; }
.lt-videomgr__upload.is-xhr .lt-videomgr__nojs { display: none; }
.lt-video-pick .lt-photo-pick__btn svg { flex: none; }
.lt-videojump { margin: 4px 0 0; }
.lt-videojump a { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-weight: 600; }
.lt-videomgr__list { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.lt-videomgr__item { display: flex; flex-direction: column; gap: 10px; padding: 12px; transition: box-shadow 1.2s var(--lt-ease); }
.lt-videomgr__item.is-new { box-shadow: 0 0 0 3px var(--lt-ok); transition: none; }
.lt-videomgr__row { display: flex; align-items: flex-start; gap: 12px; min-width: 0; }
.lt-videomgr__media { flex: none; width: 128px; overflow: hidden; border-radius: var(--lt-radius-sm); background: var(--lt-media-bg, #000); }
.lt-videomgr__video { display: block; width: 100%; height: 72px; object-fit: contain; }
.lt-videomgr__icon { margin-top: 2px; }
.lt-videomgr__meta { display: flex; flex: 1 1 auto; flex-direction: column; gap: 2px; min-width: 0; line-height: 1.5; }
.lt-videomgr__url { overflow: hidden; font-size: .8125rem; text-overflow: ellipsis; white-space: nowrap; }
.lt-videomgr__hint { margin: 4px 0 0; color: var(--lt-warn); }
.lt-videomgr__delete { margin: 0; }
.lt-videomgr__item .lt-photomgr__order { flex: none; }

/* คิวอัป: แถวละไฟล์ ชื่อ · ขนาด/ความยาว · แถบ % เต็มกว้าง · สถานะ (เขียว = อัปแล้ว · แดง = ไม่ส่ง/ล้ม) */
.lt-videoup { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.lt-videoup__item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 10px;
  padding: 10px 12px;
  border: 1px solid var(--lt-border);
  border-inline-start: 4px solid var(--lt-border-strong);
  border-radius: var(--lt-radius-sm);
  background: var(--lt-surface-2);
}
.lt-videoup__item.is-ok { border-inline-start-color: var(--lt-ok); }
.lt-videoup__item.is-err { border-inline-start-color: var(--lt-danger); }
.lt-videoup__name { flex: 1 1 10rem; min-width: 0; overflow: hidden; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.lt-videoup__meta { flex: none; font-size: .8125rem; font-variant-numeric: tabular-nums; }
.lt-videoup__bar { flex: 1 0 100%; width: 100%; height: 8px; accent-color: var(--lt-primary); }
.lt-videoup__status { flex: 1 1 auto; min-width: 0; font-size: .875rem; line-height: 1.5; font-variant-numeric: tabular-nums; }
.lt-videoup__item.is-ok .lt-videoup__status { color: var(--lt-ok); font-weight: 600; }
.lt-videoup__item.is-err .lt-videoup__status { color: var(--lt-danger); font-weight: 600; }
.lt-videoup__hint { flex: 1 0 100%; margin: 0; color: var(--lt-warn); }
.lt-videoup__retry { flex: none; }
.lt-videoup__finish { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 0; }
.lt-videoup__unsaved { flex: 1 0 100%; margin: 0; }

/* /app/products: ป้าย ▶ n (นอกข้อความที่ตัดท้าย แบบป้ายสอบถามใหม่) */
.lt-prodrow__videos { display: inline-flex; flex: none; align-items: center; gap: 3px; white-space: nowrap; }
.lt-prodrow__videos svg { flex: none; }

/* ฟอร์มสินค้า: ช่อง "ตัวต่อชุด" (สคริปต์ซ่อนเมื่อหน่วยไม่ใช่ชุด · ไม่มี JS = เห็นเสมอ) */
.lt-unitrow__qty { min-width: 0; }
.lt-unitrow__qty > .lt-field { margin: 0; }

@media (min-width: 560px) {
  .lt-videomgr__media { width: 160px; }
  .lt-videomgr__video { height: 90px; }
}
/* ช่องคลิปในแกลเลอรีกว้างเท่าช่องรูป (กติกา flex เดิมของ .lt-shop-gallery__item · จอกว้างกินครึ่งแถวแบบรูปที่ 2 เป็นต้นไป) */
.lt-shop-gallery__item--video { min-width: 0; }
