/* site-extra.css — สไตล์ใหม่ของเฟรมเวิร์กนี้เท่านั้น โหลดหลังสุดเสมอ (ดู view_head() ใน app/view/layout.php)
   ไม่แตะ styles-site.css / lib/css/cart.css / lib/css/additional.css ของเว็บเก่าเลย (copy มาแบบไม่แก้ไข) */

/* ผู้ใช้คีย์บอร์ด/สกรีนรีดเดอร์ */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  background: #fff;
  color: #000;
  padding: 8px 12px;
  z-index: 1000;
}
.skip-link:focus {
  left: 8px;
  top: 8px;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

/* ข้อความแจ้งเตือน (flash) */
.flash {
  padding: 10px 16px;
  margin: 10px auto;
  max-width: 900px;
  border-radius: 4px;
  text-align: center;
}
.flash-success { background: #e6ffed; border: 1px solid #34a853; color: #1a5c2e; }
.flash-error   { background: #ffecec; border: 1px solid #e53935; color: #8a1c1c; }
.flash-info    { background: #eef4ff; border: 1px solid #4a7fd6; color: #1c3d8a; }

/* ฟอร์ม */
.form-error { color: #cc0000; font-size: 0.9em; margin: 2px 0; }
.form-btn, button.form-btn {
  background: #cc0000;
  color: #fff;
  border: 0;
  padding: 10px 24px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 1em;
}
.form-btn:hover { background: #a80000; }
.form-row { margin: 12px 0; }
.form-row label { display: block; font-weight: bold; margin-bottom: 4px; }
.form-row input { width: 100%; max-width: 320px; padding: 6px; border: 1px solid #999; }

/* ปุ่มลิงก์เปลือย (ลบ/ลดจำนวน/ล็อกเอาต์) ให้หน้าตาเหมือน <a> เดิม */
.link-remove, .link-plain {
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  color: #06c;
  text-decoration: underline;
  font: inherit;
}
.link-remove img.minus1 { vertical-align: middle; }

/* ตะกร้าว่าง / ปุ่มอัปเดตจำนวน */
.no_item { margin: 30px 0; padding: 10px; text-align: center; }
.decrease { margin-top: 4px; }
.decrease .btn { background: #eee; border: 1px solid #999; border-radius: 3px; cursor: pointer; }
.small_text { font-size: 0.85em; color: #666; }

/* ご利用の履歴 (account/history, cart/history) */
.order-list { display: flex; flex-direction: column; gap: 16px; margin: 16px 0; }
.order-card { border: 1px solid #ddd; border-radius: 6px; padding: 12px 16px; background: #fff; }
.order-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; flex-wrap: wrap; gap: 8px; }
.tbl { width: 100%; border-collapse: collapse; margin: 8px 0; }
.tbl th, .tbl td { border-bottom: 1px solid #eee; padding: 6px 8px; text-align: left; }

/* ご注文方法 (order.php) のステップ */
.howtoorder_step {
  background: #f0ffff;
  padding: 10px;
  border: 1px solid #0ff;
  border-radius: 10px;
  margin-bottom: 8px;
}

/* เมนูมือถือด้านล่าง + side-nav — ย้ายจาก <style> ฝังในตัวของ lib/php/parts/mobile_menu.php เดิมทุกจุด
   ไฟล์นี้ตรวจกับ live จริงแล้วว่าเว็บเก่าไม่ซ่อน #header/#sub/#footer สำหรับมือถือเลย (แสดงหน้าเดิมทั้งหมด
   ย่อส่วนลงมาตาม viewport width=900 — ดู app/view/layout.php) จึงไม่มี @media ซ่อนส่วนเหล่านี้ที่นี่
   PHP (view_mobile_menu ใน layout.php) เป็นคนตัดสินใจว่าจะพิมพ์ markup นี้หรือไม่ด้วย UA sniffing
   เหมือนต้นฉบับ ที่นี่จึงมีแค่สไตล์ของแถบเมนูเอง ไม่มี display:none/media query ครอบ */
.sticky-menu {
  display: flex;
  flex-wrap: nowrap;
  position: fixed;
  z-index: 9999;
  bottom: 0;
  left: 0;
  padding: 0;
  width: 100%;
  height: 6rem;
  background-color: red;
  text-align: center;
  line-height: 6rem;
  font-size: 20px;
  color: #fff;
}
.sticky-menu div { flex: 1; text-align: center; }
.sticky-menu div a img { padding-top: 0.8rem; max-width: 4rem; }
.cart-menu a { position: relative; }
.cart-menu a span {
  position: absolute;
  top: -46px;
  right: 14px;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background-color: red;
  color: #fff;
  font-size: 1.2rem;
  line-height: 2rem;
  text-align: center;
  font-weight: bold;
}

.side-nav {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  background-color: #fff;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
}
.side-nav.open { width: 100%; }
.side-nav .closebtn {
  position: absolute;
  top: 2rem;
  right: 2rem;
  font-size: 36px;
  color: #000;
  text-decoration: none;
}
.side-nav .closebtn:hover { color: red; }

.list-menu {
  font-family: Verdana, "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", sans-serif;
  margin: 30px 10px 10px 10px;
  border: #ccc solid 1px;
  background: #f8f8f8;
}
.list-menu ul { margin: 0; padding: 0; }
.list-menu li { list-style: none; border-top: #ccc solid 1px; }
.list-menu li a {
  color: #333;
  font-size: 1.4rem;
  text-decoration: none;
  display: block;
  padding: 15px 0 15px 20px;
}
.list-menu li h3 { margin: 0; color: #fff; background: #000; padding: 15px 0 15px 20px; font-size: 1.4rem; }

/* 取引ナビ (cart/history.php) — คัดลอกมาจาก <style> ในหน้า cart/history.php ของเว็บเก่า
   (D:\...\kin-niku\mansome\cart\history.php) แบบไม่แก้ไข ไม่มีอยู่ในไฟล์ CSS แยกไฟล์ใดๆ เดิม */
#conversation, #buy_history { height: 400px; width: auto; padding: 0px; overflow: auto; position: relative; }
#conversation div.messsage { margin: 10px 0; padding: 5px; width: 520px; background: #Fee; border: 1px solid #dcc; font-size: smaller; }
#conversation div.messsage p { padding: 0 0 5px 0; margin: 0; white-space: pre-line; }
#conversation div.messsage .date { font-size: 10px; color: #888; text-align: right; }
#conversation div.owner { margin-left: 100px; background: #eee; border: 1px solid #ccc; }
