/* =====================================================================
   AjBeer Academic — รูปแบบเอกสารบทความ (A4) ตาม Template บทความวิจัย
   ใช้ร่วมกัน: หน้า Preview ของผู้เขียน / หน้าพิจารณาของผู้ดูแล-ผู้ทรงคุณวุฒิ / หน้าบทความที่เผยแพร่ / การพิมพ์
   ค่าระยะขอบและขนาดตัวอักษรกำหนดเป็นตัวแปรด้านล่าง ปรับให้ตรงไฟล์ Template ได้ที่เดียว
   ===================================================================== */


/* ฟอนต์บังคับ: TH Sarabun PSK — ใช้ฟอนต์ที่ติดตั้งในเครื่องผู้ใช้ถ้ามี ไม่เช่นนั้นใช้ไฟล์ที่รวมไว้ในระบบ
   (TH Sarabun New ของ SIPA เป็นรุ่นปรับปรุงของ TH Sarabun PSK รูปแบบและขนาดตัวอักษรเท่ากัน จึงจัดหน้าได้ผลเดียวกัน) */
@font-face { font-family: "THSarabunPSK"; src: local("TH SarabunPSK"), local("TH Sarabun PSK"), local("THSarabunPSK"), url("../fonts/thsarabunnew-webfont.woff") format("woff"); font-weight: normal; font-style: normal; font-display: block; }
@font-face { font-family: "THSarabunPSK"; src: local("TH SarabunPSK Bold"), local("TH Sarabun PSK Bold"), local("THSarabunPSK-Bold"), url("../fonts/thsarabunnew_bold-webfont.woff") format("woff"); font-weight: bold; font-style: normal; font-display: block; }
@font-face { font-family: "THSarabunPSK"; src: local("TH SarabunPSK Italic"), local("TH Sarabun PSK Italic"), local("THSarabunPSK-Italic"), url("../fonts/thsarabunnew_italic-webfont.woff") format("woff"); font-weight: normal; font-style: italic; font-display: block; }
@font-face { font-family: "THSarabunPSK"; src: local("TH SarabunPSK Bold Italic"), local("TH Sarabun PSK Bold Italic"), local("THSarabunPSK-BoldItalic"), url("../fonts/thsarabunnew_bolditalic-webfont.woff") format("woff"); font-weight: bold; font-style: italic; font-display: block; }

:root {
    --doc-page-w: 210mm;
    --doc-page-h: 297mm;
    --doc-margin-top: 25.4mm;
    --doc-margin-bottom: 25.4mm;
    --doc-margin-left: 25.4mm;
    --doc-margin-right: 25.4mm;
    --doc-header-h: 9mm;     /* พื้นที่หัวกระดาษภายในระยะขอบบน */
    --doc-font: "THSarabunPSK", "TH SarabunPSK", "TH Sarabun PSK", sans-serif;
    --doc-size: 12pt;          /* ตัวหนังสือทั้งหมด 12pt (ยกเว้นชื่อเรื่อง) */
    --doc-size-small: 12pt;    /* ข้อความประกอบ: หน่วยงาน ตาราง ที่มา หัว/ท้ายกระดาษ */
    --doc-size-heading: 12pt;  /* หัวข้อ */
    --doc-size-title: 18pt;    /* ชื่อเรื่องไทย/อังกฤษ 18pt ตัวหนา */
    --doc-line: 1.25;
    --doc-indent: 1.27cm;
    /* เบราว์เซอร์ยังไม่รองรับการกระจายตัวอักษรแบบไทย (Thai Distributed) เหมือน Word
       การจัดชิดขอบจะทำให้ช่องว่างระหว่างคำกว้างผิดปกติ จึงจัดชิดซ้ายสำหรับภาษาไทย และชิดขอบสำหรับภาษาอังกฤษ */
    --doc-align-th: left;
    --doc-align-en: justify;
}

/* ---------- เนื้อหาเอกสาร (ใช้ทั้งโหมดหน้า A4 และโหมดอ่านต่อเนื่อง) ---------- */
.doc {
    font-family: var(--doc-font);
    font-size: var(--doc-size);
    line-height: var(--doc-line);
    color: #000;
    -webkit-font-smoothing: antialiased;
}
.doc p { margin: 0; text-align: var(--doc-align-th); }
.doc [lang="en"], .doc p[lang="en"] { text-align: var(--doc-align-en); }
.doc p.doc-authors, .doc p.doc-affiliation, .doc h1.doc-title, .doc h2.doc-abstract-heading { text-align: center; }
.doc p.doc-keywords { text-align: left; }
/* บังคับฟอนต์และขนาดเดียวทั้งเอกสาร: ล้างฟอนต์/ขนาดที่อาจติดมาจากการวางข้อความ (เช่นจาก Word) */
.doc *:not(.doc-title):not(sup):not(sub) { font-family: var(--doc-font) !important; }
.doc [style*="font-size"] { font-size: var(--doc-size) !important; }
/* หัวข้อในเอกสารใช้สีดำและฟอนต์เอกสาร (ไม่รับสไตล์หัวข้อของธีมเว็บไซต์) */
.doc h1, .doc h2, .doc h3, .doc h4 { color: #000; font-family: var(--doc-font); line-height: var(--doc-line); letter-spacing: 0; }
.doc .doc-title { font-family: var(--doc-font); font-size: var(--doc-size-title) !important; font-weight: bold; text-align: center; margin: 0 0 2pt; line-height: 1.2; }
.doc .doc-title-en { margin-bottom: 8pt; }
.doc .doc-authors { text-align: center; font-weight: bold; }
.doc .doc-affiliation { text-align: center; font-size: var(--doc-size-small); }
.doc .doc-abstract-heading { font-size: var(--doc-size-heading); font-weight: bold; text-align: center; margin: 12pt 0 4pt; }
.doc .doc-abstract { text-indent: var(--doc-indent); }
.doc .doc-keywords { margin-top: 4pt; text-align: left; }
.doc .doc-section { font-size: var(--doc-size-heading); font-weight: bold; margin: 10pt 0 2pt; }
.doc h3.doc-section { margin-top: 4pt; }
.doc .doc-body p, .doc > p:not([class]) { text-indent: var(--doc-indent); margin-bottom: 0; }
.doc h3:not(.doc-section), .doc h4 { font-size: var(--doc-size-heading); font-weight: bold; margin: 4pt 0 0; }
.doc h4 { font-style: italic; }
.doc ul, .doc ol { margin: 0; padding-left: calc(var(--doc-indent) + 0.6cm); }
.doc li { text-align: var(--doc-align-th); }
.doc li p { text-indent: 0; }
.doc blockquote { margin: 2pt var(--doc-indent); }
.doc a { color: inherit; word-break: break-all; }
.doc sup, .doc sub { line-height: 0; }

.doc figure { margin: 8pt 0; break-inside: avoid; }
.doc .doc-caption { font-size: var(--doc-size); text-align: left; text-indent: 0; }
.doc .doc-table .doc-caption { margin-bottom: 2pt; }
.doc .doc-figure { text-align: center; }
.doc .doc-figure img { max-width: 100%; height: auto; display: block; margin: 0 auto 2pt; }
.doc .doc-figure.align-left img { margin-left: 0; }
.doc .doc-figure.align-right img { margin-right: 0; }
.doc .doc-figure .doc-caption { text-align: center; }
.doc .doc-source { font-size: var(--doc-size-small); text-indent: 0; margin-top: 2pt; text-align: left; }
.doc table { border-collapse: collapse; width: 100%; font-size: var(--doc-size-small); line-height: 1.15; margin: 0 auto; }
.doc .doc-table.align-left table { margin-left: 0; }
.doc .doc-table.align-right table { margin-right: 0; }
.doc th, .doc td { border: 0.75pt solid #000; padding: 1pt 4pt; vertical-align: top; text-align: left; }
.doc th { font-weight: bold; text-align: center; vertical-align: middle; }
.doc td p, .doc th p { text-indent: 0; text-align: inherit; }
.doc .doc-reference { padding-left: var(--doc-indent); text-indent: calc(-1 * var(--doc-indent)); text-align: left; }
.doc .doc-missing { color: #b42318; font-style: italic; text-indent: 0; background: #fff4f2; padding: 0 4pt; }
.doc .doc-pagebreak { height: 0; }

/* ---------- โหมดหน้า A4 (Preview) ---------- */
.doc-pages { display: flex; flex-direction: column; align-items: center; gap: 10mm; padding: 10mm 0 20mm; }
.doc-page {
    position: relative;
    width: var(--doc-page-w);
    height: var(--doc-page-h);
    background: #fff;
    box-shadow: 0 2px 4px rgba(0,0,0,.08), 0 10px 30px -12px rgba(11,26,51,.35);
    padding: var(--doc-margin-top) var(--doc-margin-right) var(--doc-margin-bottom) var(--doc-margin-left);
    box-sizing: border-box;
    overflow: hidden;
}
.doc-page-header {
    position: absolute; left: var(--doc-margin-left); right: var(--doc-margin-right);
    top: calc(var(--doc-margin-top) - var(--doc-header-h)); height: calc(var(--doc-header-h) - 2mm);
    font-family: var(--doc-font); font-size: var(--doc-size-small); color: #555; border-bottom: 0.5pt solid #999;
    display: flex; justify-content: space-between; align-items: flex-end; gap: 8mm; white-space: nowrap; overflow: hidden;
}
.doc-page-header span:last-child { overflow: hidden; text-overflow: ellipsis; }
.doc-page-footer {
    position: absolute; left: 0; right: 0; bottom: calc(var(--doc-margin-bottom) - 14mm);
    text-align: center; font-family: var(--doc-font); font-size: var(--doc-size-small); color: #222;
}
.doc-page-body { height: 100%; overflow: hidden; }
.doc-page.is-over { outline: 3px solid #d92d20; outline-offset: 0; }
.doc-page.is-over::after {
    content: "เกินจำนวนหน้าที่กำหนด"; position: absolute; top: 4mm; right: 4mm;
    background: #d92d20; color: #fff; font: 600 11pt/1.4 "Sarabun", sans-serif; padding: 1mm 3mm; border-radius: 2mm;
}
.doc-source-hidden { position: absolute; left: -10000px; top: 0; width: calc(var(--doc-page-w) - var(--doc-margin-left) - var(--doc-margin-right)); visibility: hidden; }

@media print {
    @page { size: A4; margin: 0; }
    html, body { background: #fff !important; }
    body > *:not(.doc-print-root) { display: none !important; }
    .doc-print-root { display: block !important; }
    .doc-pages { gap: 0; padding: 0; }
    .doc-page { box-shadow: none; break-after: page; page-break-after: always; outline: none !important; }
    .doc-page.is-over::after { display: none; }
    .doc .doc-missing { background: none; }
}
.doc .doc-anonymous { font-style: italic; color: #666; }