@font-face { font-family: 'JS Chawlewhieng'; src: url('fonts/JSChawlewhieng.woff2') format('woff2'), url('fonts/JSChawlewhieng.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; }

/* WP Shrine — table styles (2569) */
.shrine-table-wrap { width:100%; }
.shrine-table { width:100%; border-collapse:collapse; }
.shrine-table thead tr th { padding:20px 10px; font-size:110%; text-align:center; color:#fff; vertical-align:bottom; }
.shrine-table thead tr th:before { margin:0 auto 14px; content:''; display:block; width:60px; height:60px; background-size:60px; background-position:center center; background-repeat:no-repeat; border-radius:100%; border:1px solid #F6CE25; }
.shrine-table thead tr th:nth-child(1),
.shrine-table thead tr th:nth-child(2),
.shrine-table thead tr th:nth-child(4),
.shrine-table thead tr th:nth-child(6) { background-color:#4F1D13; }
.shrine-table thead tr th:nth-child(3),
.shrine-table thead tr th:nth-child(5) { background-color:#805F27; }
.shrine-table thead tr th:nth-child(1):before { display:none; }
.shrine-table thead tr th:nth-child(2):before { background-image:url('icons/icon-1.png'); }
.shrine-table thead tr th:nth-child(3):before { background-image:url('icons/icon-2.png'); }
.shrine-table thead tr th:nth-child(4):before { background-image:url('icons/icon-3.png'); }
.shrine-table thead tr th:nth-child(5):before { background-image:url('icons/icon-4.png'); }
/* คอลัมน์ที่ 6 แห่รอบหมู่บ้าน — ใช้ไอคอนเดียวกับพิธีอิ้วเก้ง (icon-4) */
.shrine-table thead tr th:nth-child(6):before { background-image:url('icons/icon-4.png'); }
.shrine-table tbody tr td { padding:10px 20px; color:#805F27; background-color:#E9EAEB; border-right:1px solid #4F1D13; vertical-align:middle; }
.shrine-table tbody tr:nth-child(even) td { background-color:#D6CFC3; }
.shrine-table tbody tr td:nth-child(1) { text-align:center; color:#222; background-color:#B09976; }
.shrine-table tbody tr:nth-child(even) td:nth-child(1) { background-color:#A99169; }
.shrine-table tbody tr td small { display:block; font-size:80%; opacity:.8; }

/* Mobile: แปลงแต่ละแถวเป็นการ์ด — TOR 5.1 ข้อ 7 */
@media screen and (max-width: 767px) {
  .shrine-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
  .shrine-table, .shrine-table tbody, .shrine-table tr, .shrine-table td { display:block; width:100%; }
  .shrine-table tbody tr { margin-bottom:16px; border:2px solid #4F1D13; border-radius:6px; overflow:hidden; }
  .shrine-table tbody tr td { border-right:none; border-bottom:1px solid rgba(79,29,19,.15); padding:10px 14px; display:flex; justify-content:space-between; gap:12px; text-align:right; }
  .shrine-table tbody tr td:last-child { border-bottom:none; }
  .shrine-table tbody tr td:before { content:attr(data-label); font-weight:700; color:#4F1D13; text-align:left; flex:0 0 45%; }
  .shrine-table tbody tr td:nth-child(1) { display:none; }
  .shrine-table tbody tr td:nth-child(2) { background-color:#4F1D13; }
  .shrine-table tbody tr td:nth-child(2):before { color:#F6CE25; }
  .shrine-table tbody tr td:nth-child(2) a { color:#F6CE25; font-weight:700; }
}
