/* [PHOTO-STRIP] ช่องรูป 1..N (หน้าสินค้าปกติ + แถวไส้ในหน้า SET) + ตัวแสดงชุดรูปในตะกร้า/หน้าออเดอร์
   โทนสีเดียวกับปุ่ม/ป้ายไซส์ของธีม (#f8d7e0 / #333) */
.bow-ps{ margin: 4px 0 10px 0; }
.bow-ps-head{ display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; margin-bottom:8px; }
.bow-ps-title{ font-weight:bold; }
.bow-ps-counter{ display:inline-block; padding:2px 12px; border-radius:14px; font-size:14px; background:#fdeef3; color:#c2185b; border:1px solid #f3c9d8; white-space:nowrap; }
.bow-ps-counter.bow-ps-counter-done{ background:#e6f4ea; color:#1e7e34; border-color:#bfe3c8; }
/* ช่องรูปกว้างสุด 96px แต่หดได้ถึง 84px (flex-basis 84 + grow) เพื่อให้ N ช่องอยู่บรรทัดเดียวกันเมื่อกล่องแคบ — แถวไส้ SET กว้าง ~509px: 5×96+40=520 ล้น → เดิมช่องที่ 5 ตกบรรทัด (user ขอ 30/10/2026); แคบกว่า N×84+ช่องว่าง ค่อยตกบรรทัด
   max-width ของ .bow-ps-slots ใส่ inline จาก JS = N×96+(N−1)×10 กันช่องโตเกิน 96 ตอนกล่องกว้าง (ไม่ใช้ grid auto-fit เพราะนับจำนวน track ด้วยค่า max → ไม่หด) */
.bow-ps-slots{ display:flex; flex-wrap:wrap; gap:10px; }
.bow-ps-slot{ flex:1 1 84px; max-width:96px; min-width:0; display:flex; flex-direction:column; align-items:center; }
.bow-ps-thumb{ position:relative; width:100%; border:2px dashed #ccc; border-radius:10px; background:#fafafa; overflow:hidden; display:flex; align-items:center; justify-content:center; cursor:pointer; -webkit-tap-highlight-color:transparent; }
/* ช่องรูปกดได้เหมือนปุ่ม: hover/focus โทนชมพูของธีม */
.bow-ps-thumb:hover{ border-color:#e8a4ba; background:#fff5f8; }
.bow-ps-thumb:hover .bow-ps-plus{ color:#c2185b; }
.bow-ps-thumb:focus{ outline:none; box-shadow:0 0 0 2px rgba(233,30,99,.25); }
.bow-ps-thumb.bow-ps-filled:hover{ border-color:#e8a4ba; filter:brightness(0.97); }
.bow-ps-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.bow-ps-thumb .bow-ps-plus{ font-size:28px; color:#bbb; line-height:1; }
.bow-ps-thumb .bow-ps-check{ display:none; position:absolute; top:4px; right:4px; width:22px; height:22px; border-radius:50%; background:#2e9e4f; color:#fff; font-size:13px; line-height:22px; text-align:center; }
.bow-ps-thumb.bow-ps-filled{ border:2px solid #e5e5e5; background:#fff; }
.bow-ps-thumb.bow-ps-filled .bow-ps-plus{ display:none; }
.bow-ps-thumb.bow-ps-filled .bow-ps-check{ display:block; }
.bow-ps-name{ font-size:14px; color:#555; margin:6px 0 4px 0; }
.bow-ps-btn{ -webkit-appearance:none; appearance:none; display:inline-block; padding:4px 12px; min-height:0; width:auto; border-radius:16px; border:1px solid #f3c9d8; background:#f8d7e0; color:#333; font-family:inherit; font-size:14px; font-weight:normal; line-height:1.4; box-shadow:none; cursor:pointer; white-space:nowrap; }
.bow-ps-btn.bow-ps-btn-change{ background:#f1f1f1; border-color:#e2e2e2; color:#444; }
.bow-ps-btn:hover{ filter:brightness(0.97); }
.bow-ps-btn:focus{ outline:none; box-shadow:0 0 0 2px rgba(233,30,99,.25); }
.bow-ps-hint{ font-size:14px; color:#777; margin:8px 0 0 0; line-height:1.5; }
.bow-ps-qty-hint{ font-size:14px; color:#777; margin:4px 0 0 0; }
/* ชุดรูปในตะกร้า/checkout/thankyou (inline style หลักอยู่ใน bow_render_item_photos_html เพื่ออีเมล — ไฟล์นี้แค่เสริม) */
.bow-ps-view-label{ font-size:inherit; }
@media (max-width: 480px){
	.bow-ps-slots{ gap:8px; }
	.bow-ps-slot{ flex-basis:76px; max-width:80px; } /* 375px: 4 ช่อง/แถว ~80px ทั้งสองแถวเท่ากัน */
}
