/* ธีมกลางของเว็บกลุ่มนิเทศ สพป.เพชรบูรณ์ เขต 1 (2569)
   โทนเขียวพาสเทล ฟอนต์ Prompt (หัวข้อ) + Sarabun (เนื้อหา) ให้ทุกหน้าเป็นสไตล์เดียวกับหน้าแรก
   ไฟล์นี้ลิงก์ไว้ท้าย <head> ของทุกหน้า จึงทับค่าสีเดิมของแต่ละหน้า */
:root {
  --brand: #2e9c74;
  --brand-dark: #1f6f53;
  --mint: #e3f5ec;
  --mint-2: #c9ecdb;
  --theme-bg: #f4fbf7;
  --theme-ink: #1d3a31;
  --theme-muted: #5d776d;
  --theme-line: #dcefe5;
  --theme-shadow: 0 2px 4px rgba(29,58,49,.04), 0 12px 30px rgba(29,58,49,.07);

  /* ตัวแปรสีเดิมของแต่ละหน้า */
  --primary: var(--brand);
  --primary-dark: var(--brand-dark);
  --primary-color: var(--brand);
  --brand-color: var(--brand);

  /* Bootstrap 5 */
  --bs-primary: #2e9c74;
  --bs-primary-rgb: 46, 156, 116;
  --bs-success: #2e9c74;
  --bs-success-rgb: 46, 156, 116;
  --bs-link-color: #1f6f53;
  --bs-link-color-rgb: 31, 111, 83;
  --bs-link-hover-color: #2e9c74;
  --bs-body-font-family: "Sarabun", system-ui, sans-serif;
  --bs-body-color: #1d3a31;
  --bs-border-color: #dcefe5;
  --bs-primary-bg-subtle: #e3f5ec;
  --bs-primary-text-emphasis: #1f6f53;
}

body {
  font-family: "Sarabun", system-ui, sans-serif !important;
  color: var(--theme-ink);
  background: var(--theme-bg) !important;
}
h1, h2, h3, h4, h5, h6, .btn, .nav-link, .navbar-brand, .modal-title, th, .nav-pills, .badge, legend {
  font-family: "Prompt", "Sarabun", sans-serif !important;
}

/* ---------- แถบเมนูบน ---------- */
.navbar, .navbar-pro, .top-bar, .top-nav, header.topbar {
  background: rgba(244, 251, 247, .92) !important;
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--theme-line) !important;
  box-shadow: none !important;
}
.navbar .nav-link, .navbar-pro .nav-link { color: var(--theme-ink) !important; border-radius: 999px; padding: 8px 14px !important; }
.navbar .nav-link:hover { background: #fff; }
.navbar .nav-link.active, .navbar-pro .nav-link.active, .nav-link-custom.active {
  background: var(--brand) !important; color: #fff !important;
}
.navbar-brand h5, .navbar-brand .text-primary { color: var(--brand-dark) !important; }

/* ---------- ปุ่ม ---------- */
.btn { border-radius: 12px; }
.btn-primary, .btn-success {
  background: var(--brand) !important; border-color: var(--brand) !important; color: #fff !important;
}
.btn-primary:hover, .btn-success:hover, .btn-primary:focus { background: var(--brand-dark) !important; border-color: var(--brand-dark) !important; }
.btn-outline-primary, .btn-outline-success { color: var(--brand-dark) !important; border-color: var(--brand) !important; }
.btn-outline-primary:hover, .btn-outline-success:hover { background: var(--brand) !important; color: #fff !important; }
.btn-light { background: #fff; border-color: var(--theme-line); }

/* ---------- สี ---------- */
.text-primary, .text-success { color: var(--brand-dark) !important; }
.bg-primary, .bg-success, .badge.bg-primary, .badge.bg-success { background-color: var(--brand) !important; }
.bg-light { background-color: var(--mint) !important; }
.border-primary { border-color: var(--brand) !important; }
a { color: var(--brand-dark); }
.nav-pills .nav-link.active, .nav-pills .show > .nav-link { background: var(--brand) !important; color: #fff !important; }
.nav-pills .nav-link { color: var(--theme-muted); }
.page-item.active .page-link { background: var(--brand); border-color: var(--brand); }
.page-link { color: var(--brand-dark); }
.form-check-input:checked { background-color: var(--brand); border-color: var(--brand); }
.progress-bar { background-color: var(--brand); }

/* ---------- การ์ดและกล่อง ---------- */
.card, .main-card, .section-card, .content-card, .stat-card, .news-card, .doc-card, .person-card, .event-card, .box, .panel {
  border-radius: 20px !important;
  border-color: var(--theme-line) !important;
  box-shadow: var(--theme-shadow);
}
.card-header, .card-header-custom { background: #fff !important; border-bottom-color: var(--theme-line) !important; }
.modal-content { border-radius: 20px; border: 0; }

/* ---------- ฟอร์ม ---------- */
.form-control, .form-select { border-radius: 12px; border-color: #cfe5da; }
.form-control:focus, .form-select:focus { border-color: var(--brand); box-shadow: 0 0 0 .2rem rgba(46,156,116,.18); }

/* ---------- ตาราง ---------- */
.table thead th, .table-light th, thead.bg-light th { background: var(--mint) !important; color: var(--brand-dark); border-bottom-color: var(--theme-line); }

/* ---------- ส่วนท้าย ---------- */
footer, .site-footer { background: #1f4a3c !important; color: #cfe8dc !important; }
footer a, footer .footer-link { color: #fff !important; }
footer .footer-title, footer h5 { color: #fff !important; }
.copyright-bar { background: #183b30 !important; border-top: 1px solid rgba(255,255,255,.08); }
