/* โปรเปิดร้าน — หน้า /promo · ป้ายราคาตามคิวในหน้าเปิดร้าน · แบนเนอร์หน้าแรก · ม็อกอัพ design/mock-promo
   ใช้ตัวแปรสีคนดู --v* (ฟ้า/ชมพู) · class ขึ้นต้น promo- ทั้งหมด */
.promo-hero{border-radius:24px;padding:22px 18px;color:#fff;background:var(--vbtn);position:relative;overflow:hidden;box-shadow:var(--vpsh);margin-top:4px}
.promo-hero .promo-sp{position:absolute;color:#fff;opacity:.8;line-height:1}
.promo-tag{display:inline-block;background:#ffe27a;color:#7a4a10;font-family:Mitr,Prompt,sans-serif;font-size:12px;padding:3px 10px;border-radius:999px}
.promo-hero h1{font-family:Mitr,Prompt,sans-serif;font-size:27px;line-height:1.2;margin:10px 0 0;color:#fff}
.promo-hero h1 b{color:#ffe27a;font-weight:inherit}
.promo-hero p{font-size:13px;opacity:.95;margin:6px 0 0;color:#fff}
.promo-off{background:var(--vtint);color:var(--vtx);border:1px dashed var(--vbd);border-radius:16px;padding:10px 12px;font-size:13px;margin-top:12px}

.promo-box{background:#fff;border-radius:20px;padding:14px;margin-top:12px;box-shadow:var(--vsh)}
.promo-slt{display:flex;justify-content:space-between;font-family:Mitr,Prompt,sans-serif;font-size:14px;color:var(--vink)}
.promo-slt b{color:#e0473a;font-weight:inherit}
.promo-dots{display:grid;grid-template-columns:repeat(10,1fr);gap:4px;margin-top:10px}
.promo-dots i{aspect-ratio:1;border-radius:7px;background:var(--vtint2);display:grid;place-items:center;font-style:normal;font-size:9px;color:var(--vtx3);font-family:Mitr,Prompt,sans-serif}
.promo-dots i.promo-full{background:var(--vbtn);color:#fff}
.promo-dots i.promo-me{outline:2.5px solid #ffb800;outline-offset:1px;background:#fff6d8;color:#8a6a10}
.promo-dots i.promo-nx{background:#fff6d8;color:#8a6a10}
.promo-sub{font-size:11.5px;color:var(--vtx2);margin-top:8px}

.promo-ladder{background:#fff;border-radius:20px;padding:6px 14px;margin-top:12px;box-shadow:var(--vsh)}
.promo-step{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--vline)}
.promo-step:last-child{border:0}
.promo-step.promo-now{background:var(--vtint);margin:0 -14px;padding:12px 14px;border-radius:14px}
.promo-step.promo-past{opacity:.55}
.promo-n{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;font-family:Mitr,Prompt,sans-serif;font-size:12px;text-align:center;line-height:1.1;flex:none}
.promo-n1{background:#e6f9ee;color:#1f8a4c}.promo-n2{background:#fff6d8;color:#8a6a10}.promo-n3{background:#eef1f6;color:#5a6a80}
.promo-d{flex:1;min-width:0}.promo-d b{font-family:Mitr,Prompt,sans-serif;font-size:14px;display:block;color:var(--vink);font-weight:600}
.promo-d span{font-size:11.5px;color:var(--vtx2)}
.promo-pr{font-family:Mitr,Prompt,sans-serif;font-size:18px;color:var(--vink)}
.promo-free{color:#1f8a4c}

.promo-go{display:block;text-align:center;padding:14px;border-radius:16px;font-family:Mitr,Prompt,sans-serif;font-size:16px;margin-top:14px;background:var(--vbtn);color:#fff!important;box-shadow:var(--vpsh);text-decoration:none}
.promo-small{text-align:center;font-size:11.5px;color:var(--vtx2);margin-top:8px}
.promo-faq{background:#fff;border-radius:20px;padding:12px 14px;margin-top:12px;font-size:12.5px;color:var(--vtx);line-height:1.6;box-shadow:var(--vsh)}
.promo-faq h2{font-family:Mitr,Prompt,sans-serif;font-size:13px;color:var(--vink);margin:0}
.promo-faq p{margin:0 0 8px}.promo-faq p:last-child{margin:0}

/* ป้ายราคาตามคิว (หน้าเปิดร้าน) */
.promo-badge{display:flex;align-items:center;gap:10px;border-radius:16px;padding:12px;margin:2px 0 10px}
.promo-badge .promo-e{font-size:26px;line-height:1}
.promo-badge b{font-family:Mitr,Prompt,sans-serif;font-size:15px;display:block;font-weight:600}
.promo-badge span{font-size:12px}
.promo-bf{background:#e6f9ee;color:#1f6a3c}.promo-b9{background:#fff6d8;color:#7a5a10}.promo-b59{background:#eef1f6;color:#3a4a60}
.promo-paynote{text-align:center;font-size:11.5px;color:var(--vtx2);margin-top:8px}

/* แบนเนอร์เล็กหน้าแรก */
.promo-bar{display:flex;align-items:center;gap:10px;margin:12px auto 0;max-width:560px;padding:10px 14px;border-radius:16px;background:var(--vbtn);color:#fff!important;text-decoration:none;box-shadow:var(--vpsh);font-size:13px;text-align:left}
.promo-bar .promo-e{font-size:20px}
.promo-bar b{font-family:Mitr,Prompt,sans-serif;font-weight:600;display:block;font-size:14px}
.promo-bar .promo-ar{margin-left:auto;font-size:18px;opacity:.9}
.promo-bar em{font-style:normal;background:#ffe27a;color:#7a4a10;border-radius:999px;padding:1px 8px;font-size:11.5px;white-space:nowrap}

/* แอดมิน: ตั้งค่าโปร */
.promo-adm{display:grid;grid-template-columns:1fr 1fr;gap:8px 10px}
.promo-adm label{font-size:12.5px;color:var(--vtx)}
.promo-adm .in{margin-top:4px}
.promo-kpi{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 10px}
.promo-kpi span{background:var(--vtint);color:var(--vtx);border-radius:999px;padding:3px 10px;font-size:12px}