/*
Theme Name: PAONGOEN
Theme URI: https://www.paongoen.co.th/
Description: บริษัท เป๋าเงิน จำกัด — GeneratePress child theme. ページの中身は design-canvas/wp/build_theme.py がキャンバスから作ります。
Author: PAONGOEN
Template: generatepress
Version: 1.0.0
Requires PHP: 7.4
Text Domain: paongoen
*/

/* ---- 土台（GeneratePress の CSS は読み込まない。functions.php 参照） ---- */
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: #FFFFFF; }
img { max-width: 100%; }
/* 上に固定されるヘッダーの下に、ページ内リンクの見出しが隠れないようにする */
[id] { scroll-margin-top: 100px; }
button, input, select, textarea { font: inherit; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
.skip-link:focus { position: fixed; top: 8px; left: 8px; z-index: 1000; width: auto; height: auto; clip: auto; padding: 10px 16px; background: #FFFFFF; color: #9E0F17; }

/* ---- サイト全体の文字と色（キャンバスの一番外側の指定） ---- */
.pg-root { font-family: 'Sarabun', 'Noto Sans Thai', system-ui, sans-serif; color: #1F1A17; background: #FFFFFF; line-height: 1.6; font-size: 17px }

/* ---- キャンバス共通の指定 ---- */
body{margin:0}
a{color:#9E0F17}a:hover{color:#6E0A10}
.pg-mbar{display:none}
@media (max-width: 760px){
  .pg-mbar{display:grid}
  .pg-float{display:none !important}
  .pg-nav{display:none !important}
  .pg-strip-right{display:none !important}
  .pg-bottom-pad{padding-bottom:84px}
}
details.pg-faq summary{list-style:none;cursor:pointer}
details.pg-faq summary::-webkit-details-marker{display:none}
details.pg-faq[open] .pg-plus{transform:rotate(45deg)}

/* ---- マウスを乗せたときの色（キャンバスの色は style 属性なので、属性セレクタ＋!important で上書き） ---- */
.pg-root a, .pg-root button { transition: filter .15s ease, background-color .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
/* 色の付いたボタン（LINE・Messenger・赤・黄）：少し濃くする */
.pg-root a[style*="background: #"]:not([style*="background: #FFFFFF"]):hover,
.pg-root a[style*="background: #"]:not([style*="background: #FFFFFF"]):focus-visible,
.pg-root button[style*="background: #"]:not([style*="background: #FFFFFF"]):hover,
.pg-root button[style*="background: #"]:not([style*="background: #FFFFFF"]):focus-visible,
.pg-btn:hover, .pg-btn:focus-visible { filter: brightness(.88); }
/* 白地・枠線のボタン：うすい赤を敷く */
.pg-root a[style*="solid #9E0F17"]:hover,
.pg-root a[style*="solid #9E0F17"]:focus-visible,
.pg-root a[style*="background: #FFFFFF; color: #9E0F17"]:hover,
.pg-root a[style*="background: #FFFFFF; color: #9E0F17"]:focus-visible,
.pg-root button[style*="background: #FFFFFF"]:hover { background-color: #F8E4E5 !important; }
/* カード（記事・商品）：枠を赤にして少し浮かせる */
.pg-root a[style*="solid #EADFD2"]:hover,
.pg-root a[style*="solid #EADFD2"]:focus-visible,
.pg-card:hover, .pg-card:focus-visible { border-color: #9E0F17 !important; box-shadow: 0 8px 22px rgba(31, 26, 23, .12); transform: translateY(-2px); }
/* 文字だけのリンク */
.pg-root a[style*="color: #9E0F17"]:not([style*="solid"]):not([style*="background"]):hover { color: #6E0A10 !important; text-decoration: underline !important; text-underline-offset: 3px; }
.pg-root a[style*="color: #1F1A17; padding"]:hover { color: #9E0F17 !important; }
.pg-root a[style*="color: #CFC5B8"]:hover { color: #FFFFFF !important; text-decoration: underline !important; text-underline-offset: 3px; }
.pg-root a[style*="color: #5C524B"]:hover,
.pg-root a[style*="color: #067A3A"]:hover,
.pg-root a:not([style*="color"]):not([style*="background"]):not([style*="border"]):hover,
.pg-article-body a:hover { text-decoration: underline !important; text-underline-offset: 3px; }
.pg-pager a.page-numbers:hover { border-color: #9E0F17; color: #9E0F17; }

/* ---- 記事の本文（投稿の本文。新しく書く記事もこの見た目になる） ---- */
.pg-article-body { display: flex; flex-direction: column; gap: 32px; }
.pg-article-body > p,
.pg-article-body > ul,
.pg-article-body > ol { margin: 0; color: #3A332E; line-height: 1.9; }
.pg-article-body > h2 { margin: 8px 0 0; font-family: 'Prompt', sans-serif; font-weight: 700; font-size: 28px; line-height: 1.35; color: #1F1A17; }
.pg-article-body > h3 { margin: 0; font-family: 'Prompt', sans-serif; font-weight: 700; font-size: 21px; line-height: 1.4; color: #1F1A17; }
.pg-article-body > ul,
.pg-article-body > ol { padding-left: 1.4em; }
.pg-article-body img { height: auto; border-radius: 14px; }
.pg-article-body > table { width: 100%; border-collapse: collapse; }
.pg-article-body > table th,
.pg-article-body > table td { padding: 10px 12px; border-bottom: 1px solid #EADFD2; text-align: left; }
.pg-article-body > blockquote { margin: 0; padding: 18px 22px; background: #FBF5EC; border-left: 4px solid #9E0F17; border-radius: 0 12px 12px 0; }

/* ---- 記事一覧・404・そのほかの固定ページ ---- */
.pg-wrap { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.pg-narrow { max-width: 820px; margin: 0 auto; padding: 28px 24px 72px; }
.pg-h1 { margin: 0 0 24px; font-family: 'Prompt', sans-serif; font-weight: 700; font-size: 40px; line-height: 1.3; color: #1F1A17; }
.pg-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); gap: 24px; padding: 8px 0 72px; }
.pg-card { display: flex; flex-direction: column; background: #FFFFFF; border: 1px solid #EADFD2; border-radius: 18px; overflow: hidden; color: #1F1A17; text-decoration: none; }
.pg-card img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.pg-card-body { display: flex; flex-direction: column; gap: 8px; padding: 18px 20px 22px; }
.pg-card-title { font-family: 'Prompt', sans-serif; font-weight: 700; font-size: 20px; line-height: 1.45; }
.pg-card-text { color: #5C524B; font-size: 15px; line-height: 1.7; }
.pg-card-date { color: #9E0F17; font-size: 13px; font-weight: 600; }
.pg-pager { display: flex; gap: 10px; justify-content: center; padding-bottom: 72px; }
.pg-pager .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 12px; border: 1px solid #EADFD2; border-radius: 10px; color: #1F1A17; text-decoration: none; }
.pg-pager .current { background: #9E0F17; border-color: #9E0F17; color: #FFFFFF; }
.pg-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 8px 24px; border-radius: 12px; background: #9E0F17; color: #FFFFFF; text-decoration: none; font-family: 'Prompt', sans-serif; font-weight: 600; }
