/*
Theme Name: Saipun Lite
Theme URI: https://example.com/saipun-lite
Author: You
Author URI: https://example.com
Description: Bootstrap 5 + Google Font Prompt. Brand bar สีน้ำเงินเข้ม + เมนูทอง (มีเมนูย่อย), ส่วนต่าง ๆ เป็น section, sticky mobile footer.
Version: 1.0.2
License: GNU GPL v2+
Text Domain: saipun
*/

/* =========================
   Global / Variables
========================= */
:root{
  --saipun-primary:#0ea5e9;
  --saipun-dark:#0a0f2a;     /* น้ำเงินเข้ม (Brand bar) */
  --saipun-gold:#e1c26a;     /* ทอง (เมนู) */
  --saipun-ink:#0f172a;      /* ตัวหนังสือหลัก */
}
html{ 
  scroll-behavior:smooth; 
  color-scheme: light;
}
body{
  font-family: "Prompt", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  color: var(--saipun-ink);
  background: #0e1a2b0d;
}

/* Utilities */
.text-white-75{ color:rgba(255,255,255,.75)!important; }
.hover-white:hover{ color:#fff!important; }
.badge-soft{
  background: rgba(14,165,233,.12);
  color:#0ea5e9;
  font-weight:700;
  border-radius:999px;
  padding:.25rem .6rem;
  font-size:.75rem;
}
.card.shadow-soft{ border:0; border-radius:14px; box-shadow:0 10px 24px rgba(0,0,0,.08); }
.ratio-21x9{ --bs-aspect-ratio:42.857142857%; }

/* =========================
   Header
========================= */
/* Brand bar (แถบบนสุด) */
.brandbar{
  background: var(--saipun-dark);
}
.brandbar .brand-logo img.custom-logo{ max-height:52px; height:auto; display:block; }

/* เมนูทองชั้นล่าง */
.navbar-saipun.menubar{
  background: var(--saipun-gold);
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.navbar-saipun .nav-link{
  color:#111;
  font-weight:600;
  padding:.85rem 1.5rem;
}
.navbar-saipun .nav-link:hover,
.navbar-saipun .nav-link:focus,
.navbar-saipun .nav-link.active{
  color:#000;
  text-decoration:none;
}

/* Dropdown (เมนูย่อย) */
.navbar-saipun .dropdown-menu{
  border-radius:.6rem;
  border:1px solid rgba(0,0,0,.08);
  background:#fff;
  margin-top:.25rem;
}
.navbar-saipun .dropdown-item{
  color:#111;
  font-weight:500;
  padding:.5rem .9rem;
}
.navbar-saipun .dropdown-item:hover{ background:#f6f6f6; }

.dropdown-toggle::after{
display: none;
}
/* ซ่อน brand ภายใน menubar บนเดสก์ท็อป (มีโลโก้แถบบนอยู่แล้ว) */
@media (min-width:992px){
  .navbar-saipun .navbar-brand{ display:none; }
}

/* ปุ่ม toggler ให้เห็นชัดบนพื้นทอง */
.navbar-saipun .navbar-toggler{ color:#111; border-color:rgba(0,0,0,.2); }
.navbar-saipun .navbar-toggler .navbar-toggler-icon{ filter: invert(1) grayscale(1); }

/* จำกัดความกว้าง container ให้พอดีภาพตัวอย่าง */
header .container{ max-width:1320px; }

/* =========================
   Hero
========================= */
/* ===== Hero: ข้อความบน + รูปภาพล่าง (figure) ===== */
.hero-fig{
  background:#0b1220;          /* น้ำเงินเข้ม */
  color:#e5e7eb;
  padding: 32px 0 48px;
}

.hero-fig .hero-intro{
  max-width: 980px;
}

.hero-fig .hero-title{
  color: var(--saipun-primary, #0ea5e9);  /* ฟ้า/เขียวตามธีม */
  font-weight: 600;
  font-size: 28px;
  letter-spacing: .02em;
  margin: 0 0 10px;
}

.hero-fig .hero-lead{
  margin: 0 0 8px;
  font-weight: 600;
  color: #9bd7ff;              /* ข้อความบรรทัดรองสว่างขึ้น */
}

.hero-fig .hero-desc{
  margin: 0 auto 18px;
  color:#cbd5e1;               /* ย่อหน้าหลักโทนอ่อน */
  line-height: 1.75;
}

/* รูปด้านล่าง */
.hero-figure{
  margin: 8px auto 0;
  max-width: 1040px;
  background:#fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 16px 40px rgba(0,0,0,.25);
}
.hero-figure img{
  display:block;
  width:100%;
  height:auto;
}
.hero-figure .hero-cap{
  font-size: 12px;
  color:#64748b;
  padding: 6px 10px;
  background:#fff;
}

/* จอเล็กปรับระยะ */
@media (max-width: 575.98px){
  .hero-fig{ padding: 24px 0 36px; }
  .hero-fig .hero-desc{ line-height: 1.65; }
}


/* =========================
   Sections
========================= */
.section{ padding:56px 0; }
.section-head{ margin-bottom:18px; }
.section-title{ font-weight:600; letter-spacing:.02em; color:#0b1220; }

.section-dark{ background:#0b1220; color:#e5e7eb; }
.section-dark .section-title{ color:#e5e7eb; }

.section-muted{ background:#0f172a; color:#e5e7eb; }

/* =========================
   Footer (Desktop)
========================= */
.site-footer{
  background:#0b1220;
  color:#cbd5e1;
  padding:24px 0;
}
.site-footer a{ color:#fff; text-decoration:none; }
.site-footer a:hover{ text-decoration:underline; }

/* =========================
   Sticky Mobile Bottom Bar
========================= */
.mobile-nav{ display:none; }

@media (max-width:767px){
  /* ซ่อน footer เดิมบนมือถือ เพื่อไม่ซ้อนกับแถบล่าง */
 /* .site-footer{ display:none; } */

  .mobile-nav{
    position:fixed; left:0; right:0; bottom:0;
    display:flex; justify-content:space-around; align-items:flex-end;
    padding:8px 10px calc(8px + env(safe-area-inset-bottom));
    background:#ffffff; border-top:1px solid #e5e7eb;
    z-index:9999;
    font-size:12px; line-height:1.1;
  }
  .mobile-nav a{
    text-decoration:none; color:#0f172a; text-align:center;
    display:flex; flex-direction:column; align-items:center; gap:4px;
    min-width:56px;
  }
  .mobile-nav .mnav-home{
    transform:translateY(-18px);
    display:flex; flex-direction:column; align-items:center; gap:4px;
  }
  .mobile-nav .mnav-home .mnav-home-btn{
    width:64px; height:64px; border-radius:50%;
    background:#0b1220; color:#fff;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 6px 16px rgba(0,0,0,.2);
  }

  /* กันคอนเทนต์ถูกบังด้วยแถบล่าง */
  body{ padding-bottom: calc(88px + env(safe-area-inset-bottom)); }
}

/* รองรับ admin bar บนมือถือ */
@media (max-width:782px){
  body.admin-bar .mobile-nav{ bottom:0; }
}

/* =========================
   Scroll Up Button
========================= */
.scrollup{
  position: fixed; right: 16px; bottom: 24px;
  width: 44px; height: 44px; border: 0; border-radius: 999px;
  background:#6b7280; color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 16px rgba(0,0,0,.2);
  cursor:pointer; z-index:10000;
  opacity:0; visibility:hidden; transform:translateY(8px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s;
}
.scrollup.is-visible{ opacity:1; visibility:visible; transform:translateY(0); }
.scrollup:focus-visible{ outline:2px solid var(--saipun-primary); outline-offset:2px; }

/* =========================
   Blog / Archive basics
========================= */
.post-card .meta{ color:#6b7280; font-size:.9rem; }
.post-card .thumb{ border-radius:12px; overflow:hidden; }

/* =========================
   Search page
========================= */
.search-result mark{
  background: rgba(14,165,233,.18);
  color:#075985;
  padding:.05rem .25rem;
  border-radius:.2rem;
}
.line-clamp-3{
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}


/* ===== Registration Steps (panel เหมือนภาพ) ===== */
.section-steps{ padding: 44px 0;
  background: #030620;
}
.section-steps .steps-panel{  
  padding:28px 20px 36px;
  color:#e5f2ff;
}
.steps-title{
  color:#1fd3ff;                       /* หัวข้อสีฟ้าสว่าง */
  font-weight:600;
  letter-spacing:.02em;
}
.steps-sub{ color:#c7d7e9; font-size:.95rem; }

/* รูป + คำบรรยาย */
.step-item{}
.step-img{
  display:block; margin:0 auto;
  max-width: 220px; width:auto; height:auto;
  border-radius:10px;
  box-shadow: 0 10px 26px rgba(0,0,0,.35);
}
.step-caption{
  font-weight:600; letter-spacing:.01em;
  color:#f4c84a;
}
.step-num{
  color:#f4c84a;                       /* เลขขั้นตอนสีทอง */
  margin-right:.25rem;
}
.step-desc{
  color:#f4c84a; font-weight:600;
}
.step-desc-accent{ color:#ffd84d; }    /* บรรทัดเน้น (เหลือง) */

/* ระยะบนมือถือ */
@media (max-width: 575.98px){
  .section-steps .steps-panel{ padding:22px 14px 28px; }
  .step-img{ max-width: 180px; }
}


/* ===== How-to (ฝาก/ถอน) ===== */
.section-howto{
  background:#0a1c33;            /* น้ำเงินเข้มแบบภาพ */
  color:#e6f1ff;
  padding:44px 0;
}
.section-howto .howto-title{
  color:#19c2f0;                  /* ฟ้าสว่าง */
  font-weight:400; letter-spacing:.02em;
  margin-bottom:18px;
}
.howto-row{ margin-top:22px; margin-bottom:26px; }

.howto-subtitle{
  color:#1fd3ff;
  font-weight:400;
  margin:0 0 10px;
}

.howto-text p{
  color:#cfe3ff;
  line-height:1.9;
  margin-bottom:10px;
}

.howto-banner{
  display:block;
  width:auto; 
  height:auto;
  margin:0 auto;
  border-radius:12px;
  box-shadow:0 14px 30px rgba(0,0,0,.35);
}

@media (min-width: 576px){
  .howto-banner{
  	max-width:520px; 
  }
}

/* มือถือ: ขยายระยะให้อ่านง่าย */
@media (max-width: 575.98px){
  .section-howto{ padding:36px 0; }
  /*.howto-banner{ max-width: 360px; }*/
  .howto-subtitle{ text-align:center; }
}


/* ===== Rich content blocks (ข้อดีสมาชิก / เล่นได้เงินจริง) ===== */
.section-rich{
  background:#0a1c33;            /* น้ำเงินเข้ม */
  color:#e6f1ff;
  padding:48px 0;
}
.section-rich .rich-block + .rich-block{ margin-top:52px; }

.rich-title{
  text-align:center;
  color:#1fd3ff;                 /* ฟ้าสว่าง */
  font-weight:600;
  letter-spacing:.02em;
  margin:0 0 12px;
}
.rich-title::after{
  content:""; display:block; width:42px; height:3px;
  background:#1fd3ff; border-radius:2px; margin:.45rem auto 0;
}

.rich-text{
  max-width:900px; margin:0 auto;
  color:#cfe3ff; line-height:1.9;
  text-align:center;
}
.rich-text p{ margin-bottom:10px; }

.rich-figure{
  margin:18px auto 12px; text-align:center;
}
.rich-figure img{
  display:block; margin:0 auto;
  width:auto; 
  height:auto;
  border-radius:12px;
  box-shadow:0 14px 30px rgba(0,0,0,.35);
}
.rich-figure figcaption{
  font-size:12px; color:#a9c6ff; margin-top:6px;
}
@media (min-width:576px){
  .rich-figure img{
    max-width:620px; 
  }
}
/* มือถือ */
@media (max-width:575.98px){
  .section-rich{ padding:36px 0; }
  /*.rich-figure img{ max-width:420px; }*/
}


/* ===== CTA: ทดลองเล่นฟรีทุกค่าย ===== */
.section-cta-try{ padding:28px 0; }

.cta-panel{
  position:relative;
  border:2px solid #19c2f0;       /* กรอบฟ้า */
  border-radius:12px;
  overflow:hidden;
  background:#0a1c33;             /* สีสำรองเผื่อไม่มีภาพ */
}
.cta-panel::before{
  content:"";
  position:absolute; inset:0;
  background-image: var(--cta-bg);
  background-size:cover; background-position:center;
  filter: brightness(.55) saturate(1.1);  /* ทำภาพมืดลง */
}
.cta-panel::after{
  content:"";
  position:absolute; inset:0;
  background: radial-gradient(ellipse at center, rgba(0,0,0,.2), rgba(0,0,0,.6));
}
.cta-panel > .row{ position:relative; z-index:1; padding:24px; }

.cta-hero{
  width:100%; max-width:460px; height:auto; display:block; margin:auto;
  filter: drop-shadow(0 14px 28px rgba(0,0,0,.45));
}

.cta-title{
  color:#7df0ff; font-weight:500; letter-spacing:.02em;
  margin:0 0 8px; line-height:1.25;
}
.cta-title span{ color:#1eead3; }

.cta-text{ color:#cfe3ff; line-height:1.8; }

/* ปุ่ม */
.btn-cta-primary{
  background:#2b8ffd; color:#fff; border:0;
  box-shadow:0 8px 20px rgba(0,0,0,.2);
}
.btn-cta-primary:hover{ background:#1f7be4; color:#fff; }

.btn-cta-success{
  background:#22c55e; color:#fff; border:0;
  box-shadow:0 8px 20px rgba(0,0,0,.2);
}
.btn-cta-success:hover{ background:#1daa4f; color:#fff; }

/* Responsive */
@media (max-width: 991.98px){
  .cta-panel > .row{ padding:18px; }
  .cta-title, .cta-text{ text-align:center; }
  .cta-panel .d-flex{ justify-content:center; }
  .cta-hero{ max-width:420px; }
  .section-cta-try{ padding:20px 0; }
}


/* ===== Reviews (รีวิวเกมสล็อต) ===== */
.section-muted { background:#0f172a; color:#e6f1ff; }

.section-muted .section-head .section-title{
  color:#7df0ff;                 /* หัวข้อฟ้าสว่าง */
  font-weight:600;
  letter-spacing:.02em;
  position:relative;
  padding-bottom:.25rem;
}
.section-muted .section-head .section-title::after{
  content:""; position:absolute; left:0; bottom:0;
  width:44px; height:3px; background:#19c2f0; border-radius:2px;
}

.section-muted .section-head .btn{
  border-color:#7df0ff; color:#7df0ff;
  border-radius:999px; padding:.35rem .8rem; font-weight:700;
}
.section-muted .section-head .btn:hover{
  background:#19c2f0; color:#0b1220; border-color:#19c2f0;
}

/* การ์ดโพสต์ */
.section-muted .card{
  background: linear-gradient(180deg,#0f1b34, #0b1530);
  border:1px solid rgba(255,255,255,.06);
  border-radius:14px;
  overflow:hidden;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.section-muted .card:hover{
  transform: translateY(-3px);
  box-shadow: 0 16px 32px rgba(0,0,0,.4);
  border-color: rgba(25,194,240,.35);
}

/* กล่องรูปด้านบน */
.section-muted .card .ratio{
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(25,194,240,.30), transparent 60%),
    #0a1224;
  border-bottom:1px solid rgba(255,255,255,.06);
}
/* ถ้าใส่ <img> ภายใน .ratio ให้แสดงเต็มสวย */
.section-muted .card .ratio img{
  width:100%; height:100%; object-fit:cover;
  border-top-left-radius:inherit; border-top-right-radius:inherit;
  display:block;
}

/* ชื่อเรื่อง+วันที่ */
.section-muted .card h6{
  line-height:1.35; margin:0 0 .15rem;
}
.section-muted .card h6 a{
  color:#eaf4ff; text-decoration:none;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.section-muted .card h6 a:hover{ color:#7df0ff; }

.section-muted .card small.text-muted{
  color:#9bb1d4 !important;
}

/* ระยะห่างกริด */
.section-muted .row.g-3 > [class*="col-"]{ display:flex; }
.section-muted .row.g-3 > [class*="col-"] .card{ width:100%; }


/* ===== FAQ (Accordion) ===== */
.section-faq{ background:#0a1633; padding:48px 0; color:#e6f1ff; }

/* กล่องด้านในมีกรอบฟ้า – ถ้าไม่ใส่ .faq-panel จะไม่เห็นกรอบนี้ */
.section-faq .faq-panel{
  background:#0b1530;
  border:2px solid #19c2f0;
  border-radius:16px;
  padding:24px;
  box-shadow:0 16px 36px rgba(0,0,0,.28);
}

/* หัวข้อ */
.section-faq .section-title{
  color:#7df0ff;
  font-weight:500;
  letter-spacing:.02em;
  margin:0 0 14px;
}
.section-faq .section-title::after{
  content:""; display:block; width:42px; height:3px;
  background:#19c2f0; border-radius:2px; margin:.45rem 0 0;
}

/* ปิดสไตล์เดิมของ Bootstrap */
.section-faq .accordion-item{ background:transparent; border:0; }
.section-faq .accordion-button{
  background:#000; color:#eaf4ff;
  border-radius:12px; padding:14px 16px;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:none;
}
.section-faq .accordion-button:focus{ box-shadow:none; }

/* ลูกศรขวาสีทอง (collapsed) และหมุนลงเมื่อเปิด */
.section-faq .accordion-button::after{
  flex-shrink:0; width:1rem; height:1rem; margin-left:auto;
  background-size:1rem; background-repeat:no-repeat; background-position:center;
  filter:none;
  /* arrow-right สีทอง (#facc15) */
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23facc15'%3E%3Cpath d='M6 3l5 5-5 5-1.4-1.4L8.2 8 4.6 4.4 6 3z'/%3E%3C/svg%3E");
  transform:rotate(0deg);
}
.section-faq .accordion-button:not(.collapsed)::after{
  transform:rotate(90deg);
}

/* เมื่อเปิด: ให้หัวปุ่มต่อเนื่องกับเนื้อหา */
.section-faq .accordion-button:not(.collapsed){
  background:#000; color:#fff;
  border-bottom-left-radius:0; border-bottom-right-radius:0;
}

/* เนื้อหาในข้อที่เปิด */
.section-faq .accordion-body{
  background:#000; color:#cfe3ff;
  line-height:1.85;
  border:1px solid rgba(255,255,255,.08);
  border-top:0;
  border-bottom-left-radius:12px; border-bottom-right-radius:12px;
  margin-top:-10px;               /* ดึงขึ้นชนหัวปุ่มให้ไร้รอยต่อ */
  padding:14px 16px;
}

/* ช่องว่างระหว่างข้อ */
.section-faq .accordion-item + .accordion-item{ margin-top:10px; }

/* มือถือ */
@media (max-width:575.98px){
  .section-faq{ padding:36px 0; }
  .section-faq .faq-panel{ padding:18px; }
  .section-faq .accordion-button{ padding:12px 14px; }
  .section-faq .accordion-body{ padding:12px 14px; }
}


/* ===== Floating Footer (Desktop/Tablet) ===== */
.floating-footer{
  position: fixed; left: 0; right: 0; bottom: 0;
  background: rgba(11,18,32,.96); /* เข้มโปร่ง */
  color:#e5e7eb;
  border-top: 1px solid #1f2937;
  box-shadow: 0 -10px 24px rgba(0,0,0,.25);
  z-index: 9000;
  padding: 10px 0;
  transform: translateY(0);
  transition: transform .25s ease, opacity .25s ease, visibility .25s;
}
.floating-footer.is-hidden{ transform: translateY(100%); opacity:0; visibility:hidden; }

.floating-footer .ff-text{ font-size:.95rem; }
.floating-footer .ff-close{
  width: 34px; height: 34px;
  background: #111; color:#fff;
  border: 0; border-radius: 999px; line-height: 1;
  opacity:.75; cursor: pointer;
}
.floating-footer .ff-close:hover{ opacity:1; }

/* กันคอนเทนต์ถูกบัง */
body.has-floating-footer{ padding-bottom: 56px; }

/* มือถือใช้ mobile-nav/ mobile-legal แทน */
@media (max-width: 767px){
  .floating-footer{ display:none; }
}

/* รองรับ WP Admin Bar (desktop) */
@media (min-width: 783px){
  body.admin-bar .floating-footer{ bottom:0; }
}




/* โลโก้ + header responsive */
.brandbar{ background:#0a0f2a; }
.brandbar .site-logo{ max-height:48px; height:auto; display:block; margin:0 auto; }
.brand-kicker{ color:rgba(255,255,255,.8); }

/* ปุ่มเบอร์เกอร์วงกลม (มือถือ) */
.mobile-hamburger{
  position:absolute; right:12px; top:50%; transform:translateY(-50%);
  width:42px; height:42px; border:0; border-radius:999px;
  background:#e1c26a; color:#111; box-shadow:0 6px 16px rgba(0,0,0,.25);
  display:flex; align-items:center; justify-content:center; z-index:5;
}
.mobile-hamburger i{ font-size:18px; line-height:1; }

/* Desktop: โลโก้ซ้าย โซเชียลขวา */
@media (min-width: 992px){
  .brandbar .site-logo{ max-height:56px; margin:0; } /* ชิดซ้าย */
  .brand-kicker{ display:none; }
}

/* เมนูทอง: mobile เป็น dropdown, desktop เป็นแถบ */
@media (max-width: 991.98px){
  .navbar-saipun.menubar{ background:transparent; border:0; padding:0; }
  .navbar-saipun .navbar-collapse{
    background:#e1c26a; border-top:1px solid rgba(0,0,0,.08); padding:8px 10px;
  }
  .navbar-saipun .nav-link{ color:#111; padding:.75rem 1rem; font-weight:600; }
  .navbar-saipun .dropdown-menu{ background:#fff; border:1px solid rgba(0,0,0,.1); }
}
@media (min-width: 992px){
  .navbar-saipun.menubar{ background:#e1c26a; border-bottom:1px solid rgba(0,0,0,.08); }
  .navbar-saipun .nav-link{ color:#111; font-weight:600; padding:.85rem 1rem; }
}


/* Search inline (input + square button) */
.search-inline{
  display:flex; align-items:center; gap:10px;
  max-width:420px; width:100%;
}
.search-inline .search-input{
  height:44px; border-radius:10px; padding:.5rem .9rem;
  border:1px solid #d6e3ea; background:#fff;
}
.search-inline .search-input:focus{
  border-color:#22c55e; box-shadow:0 0 0 .15rem rgba(34,197,94,.15);
}

/* ปุ่มค้นหาเป็นกล่องเล็กมุมโค้ง */
.search-inline .search-btn{
  width:44px; height:44px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  border:2px solid #22c55e; background:#fff; color:#22c55e;
  padding:0; line-height:1; cursor:pointer;
  transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.search-inline .search-btn:hover,
.search-inline .search-btn:focus{
  background:#22c55e; color:#fff; border-color:#22c55e;
  outline:none;
}

/* จอเล็กให้เต็มบรรทัด */
@media (max-width:575.98px){
  .search-inline{ max-width:100%; }
}




/* ===== Sidebar (ขวา) ===== */
.sidebar.widget-area {
  padding-left: 1rem;
  /* เว้นจากคอนเทนต์ซ้าย */
}

.sidebar .widget {
  margin-bottom: 1.25rem;
}

/* หัวข้อ widget */
.sidebar .widget-title {
  font-weight: 800;
  font-size: 1.25rem;
  color: var(--lek-primary);
  margin: 0 0 .35rem;
}

/* เส้นบางใต้หัวข้อ (จางๆ แบบในภาพ) */
.sidebar .widget-title+* {
  border-top: 1px solid rgba(0, 0, 0, .08);
  padding-top: .5rem;
}

/* ลิสต์ภายใน */
.sidebar .widget ul {
  margin: 0;
  padding-left: 1.2rem;
  /* ให้มีจุดนำหน้า */
  list-style: disc;
}

.sidebar .widget ul li {
  margin: .35rem 0;
  line-height: 1.45;
}

.sidebar .widget ul li a {
  color: #1d1d1f;
  text-decoration: none;
}

.sidebar .widget ul li a:hover {
  color: var(--lek-primary, #2e6f40);
  text-decoration: underline;
}

/* Search form เหมือนภาพ (ช่องเล็ก + ปุ่มค้นหา) */
.sidebar .widget_search .search-form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .4rem;
}

.sidebar .widget_search .search-field {
  height: 36px;
  padding: .35rem .6rem;
  border: 1px solid #cfcfd4;
  border-radius: 6px;
  font-size: .95rem;
}

.sidebar .widget_search .search-submit {
  height: 36px;
  padding: 0 .75rem;
  border: 1px solid var(--lek-primary, #2e6f40);
  background: var(--white, #fff);
  color: var(--lek-primary, #2e6f40);
  border-radius: 6px;
  font-weight: 700;
  cursor: pointer;
}

.sidebar .widget_search .search-submit:hover {
  background: var(--lek-primary, #2e6f40);
  color: #fff;
}

/* ขนาดตัวอักษรของรายการ/นับจำนวน (…(6)) ให้เล็กลงนิด */
.sidebar .widget ul li,
.sidebar .widget time {
  font-size: .95rem;
}

/* ระยะชิดขอบภาพเด่นด้านซ้าย (ให้ sidebar ไม่ชน) */
@media (max-width: 991.98px) {
  .sidebar.widget-area {
      padding-left: 0;
      margin-top: 1.25rem;
  }
}


/* ===== Sidebar: เรื่องที่คุณอาจสนใจ ===== */
.widget-suggest .widget-title {
  font-weight: 800;
  color: var(--lek-primary);
  margin: 0 0 .4rem;
  position: relative;
  padding-bottom: .35rem;
}

.widget-suggest .widget-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 44px;
  height: 4px;
  background: var(--lek-primary);
  border-radius: 3px;
}

/* การ์ดเด่น */
.sb-feature {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .10);
  margin-bottom: .9rem;
}

.sb-feature-link {
  display: block;
  color: #fff;
  text-decoration: none;
  position: relative;
}

.sb-feature-img {
  width: 100%;
  /*height: 180px;*/
  object-fit: cover;
  display: block;
}

.sb-dim {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, .05) 30%, rgba(0, 0, 0, .70) 100%);
}

.sb-badge {
  position: absolute;
  left: 10px;
  top: 10px;
  font-size: .75rem;
  font-weight: 700;
  padding: .25rem .5rem;
  border-radius: 6px;
  background: rgba(255, 255, 255, .18);
  backdrop-filter: saturate(130%) blur(2px);
}

.sb-feature-title {
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 34px;
  font-weight: 800;
  font-size: 1rem;
  line-height: 1.35;
  margin: 0;
}

.sb-meta {
  position: absolute;
  left: 10px;
  bottom: 10px;
  font-size: .82rem;
  opacity: .95;
  display: flex;
  gap: .4rem;
  align-items: center;
}

.sb-meta .dot {
  opacity: .9;
}

/* รายการย่อย */
.sb-mini-list {
  display: grid;
  gap: 12px;
}

.sb-mini {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 12px;
  align-items: center;
}

.sb-mini-thumb .img {
  /*width: 72px;
  height: 72px;*/
  object-fit: cover;
  display: block;
  border-radius: 10px;
}

.sb-mini-body {
  min-width: 0;
}

.sb-chip {
  display: inline-block;
  font-size: .7rem;
  padding: .15rem .4rem;
  border-radius: 4px;
  background: #f1eef6;
  color: var(--lek-primary);
  font-weight: 700;
  margin-bottom: 4px;
}

.sb-mini-title {
  margin: 0;
  font-size: .95rem;
  font-weight: 800;
  line-height: 1.35;
}

.sb-mini-title a {
  color: #1d1d1f;
  text-decoration: none;
}

.sb-mini-title a:hover {
  color: var(--lek-primary);
  text-decoration: underline;
}

.sb-mini .tiny {
  font-size: .82rem;
  color: #6b7280;
}

/* responsive */
@media (max-width: 991.98px) {
  .sb-feature-img {
      height: 200px;
  }
}