/*
Theme Name: Notwood
Theme URI: https://notwood.co.th/
Author: ChatGPT (for pun Gasonbua)
Description: Bootstrap theme with Prompt font, transparent/blur navbar, hero zoom, and clean cards. Legacy PHP compatible.
Version: 1.2.0
Requires at least: 5.2
Tested up to: 6.6
Requires PHP: 5.6
License: GPLv2 or later
Text Domain: notwood-legacy
Tags: bootstrap, minimal, custom-logo, custom-menu, featured-images
*/

/* ==========================================================
   VARIABLES & GLOBAL FONT (Google Fonts: Prompt)
   ========================================================== */
:root{
  --nw-bg: #101010;
  --nw-fg: #ffffff;
  --nw-accent: #2d6cdf;
  --nw-text: #222;
  --nw-muted: #6c757d;

  /* ให้ Bootstrap ใช้ Prompt ด้วย */
  --bs-font-sans-serif: 'Prompt', system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans Thai", sans-serif;
}

/* ฟอนต์หลักทั่วเว็บ */
html, body, button, input, select, textarea{
  font-family: var(--bs-font-sans-serif) !important;
  font-weight: 400;
  color: var(--nw-text);
}

/* กันปลั๊กอิน/บล็อกทับฟอนต์ */
.entry-content, .content, .card, .navbar, .nav, .nav-link, .menu-item a,
.btn, .button, .wp-block, .wp-block-paragraph, p, h1, h2, h3, h4, h5, h6{
  font-family: var(--bs-font-sans-serif) !important;
}

/* ==========================================================
   TYPOGRAPHY
   ========================================================== */
h1, h2, h3, h4, h5, h6{
  font-weight: 700;
  line-height: 1.2;
  color: inherit;
}
.display-1, .display-2, .display-3, .display-4, .display-5{
  font-weight: 800;
  letter-spacing: .01em;
}
small, .small, .text-muted{ font-weight: 300; color: var(--nw-muted); }

/* ==========================================================
   NAVBAR (Alssen-like): โปร่งใสบน Hero, เลื่อนแล้วกึ่งทึบ + เบลอ
   ========================================================== */
.nw-nav{
  position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
  padding: .9rem 0;
  background: transparent !important;
  border: 0 !important; box-shadow: none !important;
  transition: background .25s ease, backdrop-filter .25s ease, box-shadow .25s ease;
}

/* เมื่อเลื่อนให้กึ่งทึบ + เบลอ */
.nw-nav.scrolled{
  background: rgba(17,17,17,.48) !important;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  box-shadow: 0 2px 14px rgba(0,0,0,.12);
}

/* เมนูขวาเรียบไม่มีกรอบ/ขีด */
.nw-nav .navbar-nav{ gap: 28px; }
.nw-nav .navbar-nav li{ list-style: none; }
.nw-nav .navbar-nav .nav-link,
.nw-nav .navbar-nav > li > a,
.nw-nav a{
  display: inline-block;
  padding: 0; margin: 0;
  color: rgba(255,255,255,.92) !important;
  font-weight: 600; letter-spacing: .02em;
  background: none !important; border: none !important; box-shadow: none !important;
  text-decoration: none !important; line-height: 1.1; border-radius: 0 !important;
}
.nw-nav .navbar-nav .nav-link:hover{ color: #fff !important; }

/* Active แสดงเส้นบางใต้ข้อความ */
.nw-nav .current-menu-item > a,
.nw-nav .current_page_item > a{
  color: #fff !important; position: relative;
}
.nw-nav .current-menu-item > a::after,
.nw-nav .current_page_item > a::after{
  content: ""; position: absolute; left: 0; right: 0; bottom: -6px; height: 2px;
  background: #fff; opacity: .9;
}

/* Burger menu (มือถือ) */
@media (max-width: 991.98px){
  .nw-nav .navbar-collapse{
    background: rgba(17,17,17,.92);
    border-radius: .6rem;
    padding: .75rem 1rem; margin-top: .5rem;
  }
  .nw-nav .navbar-nav{ gap: 14px; }
  .nw-nav .navbar-nav .nav-link{ color: #fff !important; padding: .25rem 0; }
}

/* กันชนกับ WP Admin bar ตอนล็อกอิน */
.admin-bar .nw-nav{ top: 32px; }
@media (max-width: 782px){ .admin-bar .nw-nav{ top: 46px; } }

/* ป้องกันสไตล์อื่นทับ */
.nw-nav a, .nw-nav a:hover{ text-decoration:none !important; border:0 !important; box-shadow:none !important; }

/* ==========================================================
   BUTTONS
   ========================================================== */
.btn, .button, input[type="submit"], input[type="button"]{
  font-family: var(--bs-font-sans-serif);
  font-weight: 500; letter-spacing: .03em;
  border-radius: .3rem;
  transition: all .2s ease-in-out;
}
.btn-primary{
  background: var(--nw-accent); border-color: var(--nw-accent);
}
.btn:hover, .button:hover{ opacity: .9; }

/* ==========================================================
   HERO (พื้นหลังซูมเบา ๆ)
   ========================================================== */
.nw-hero-zoom{
  position: relative; min-height: 56vh;
  display: flex; align-items: center; overflow: hidden;
}
.nw-hero-zoom .nw-hero-bg{
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  transform: scale(1);
  animation: nwZoom 18s ease-in-out infinite alternate;
  filter: brightness(.65);
}
@keyframes nwZoom{ from{transform:scale(1);} to{transform:scale(1.08);} }
.nw-hero-zoom .nw-overlay{
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.55) 80%);
}
.nw-hero-zoom .nw-hero-content{ position: relative; z-index: 2; color: #fff; }
.nw-hero-zoom h1{ font-weight: 800; letter-spacing: .02em; }
.nw-hero-zoom p.lead{ color: rgba(255,255,255,.85); }

/* Scroll cue */
.nw-scroll-cue{
  position: absolute; left: 50%; bottom: 18px; transform: translateX(-50%);
  width: 28px; height: 44px; border: 2px solid rgba(255,255,255,.8); border-radius: 18px;
}
.nw-scroll-cue:after{
  content:""; position:absolute; left:50%; top:8px; width:4px; height:8px;
  background:#fff; border-radius:2px; transform:translateX(-50%);
  animation:nwDot 1.4s ease-in-out infinite;
}
@keyframes nwDot{ 0%{opacity:1; transform:translate(-50%,0);} 100%{opacity:0; transform:translate(-50%,12px);} }

/* ==========================================================
   CARDS & CONTENT
   ========================================================== */
.card{
  border: none; border-radius: .5rem;
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
  transition: transform .2s ease-in-out, box-shadow .2s ease-in-out;
}
.card:hover{ transform: translateY(-3px); box-shadow: 0 6px 22px rgba(0,0,0,.12); }
.card-body{ color: #333; }

/* ==========================================================
   FOOTER
   ========================================================== */
footer{
  background: #101010; color: #ddd; font-size: .9rem;
}
footer a{ color: #fff; text-decoration: none; }
footer a:hover{ color: var(--nw-accent); text-decoration: underline; }

/* ==========================================================
   RESPONSIVE
   ========================================================== */
@media (max-width: 767.98px){
  .nw-hero-zoom{ min-height: 48vh; }
  .nw-hero-zoom h1{ font-size: 1.75rem; }
  .card{ margin-bottom: 1rem; }
}