/* ============================================================
   TeeSuay.com — Modern UI layer v1  (2026-10-12)
   ชั้นตกแต่งให้ทันสมัย โดยไม่แตะโครงสร้าง/ฟังก์ชันเดิม
   ============================================================ */

/* 1) Typography — ฟอนต์ไทยสะอาด อ่านง่าย (แทน Times New Roman เดิม) */
body, td, th, div, p, span, a, li, label, input, select, textarea, button,
h1, h2, h3, h4, h5, h6 {
  font-family: "Sarabun", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Roboto, Arial, sans-serif !important;
}
body { line-height: 1.55; -webkit-font-smoothing: antialiased; }
#font-main { font-size: 12.5px; }

/* ลิงก์: hover สีส้มทันสมัยขึ้น + transition */
a { transition: color .15s ease, background-color .15s ease; }
a:hover { color: #ff7a1a !important; }

/* 2) เมนูด้านบน: hover เป็นแคปซูลมน */
#stylefour ul li a { border-radius: 8px 8px 0 0; transition: background-color .15s ease; }

/* 3) กล่อง/การ์ด: ขอบมนสม่ำเสมอ + เงาซอฟต์ */
#box-featured-project, #box-news, #box-news-last, #box-update, #box-area,
#box-main, #box-exclusive, #inbox-member, #inbox-advertise, #inbox-project,
#box-project, #box-post-detail, #box-guru, #box-agency {
  border-radius: 10px !important;
  box-shadow: 0 2px 10px rgba(13, 38, 76, .06);
}

/* 4) ปุ่ม/ฟอร์ม: ขอบมน + โฟกัสชัดเจน */
input[type="text"], input[type="password"], input[type="email"], select, textarea {
  border-radius: 6px !important;
  border: 1px solid #cbd5e1 !important;
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, select:focus, textarea:focus {
  border-color: #017eba !important;
  box-shadow: 0 0 0 3px rgba(1, 126, 186, .15);
}
input[type="submit"], input[type="button"], button {
  border-radius: 8px;
  cursor: pointer;
}

/* 5) ฟุตเตอร์: โทนสะอาด อ่านสบาย */
#footer-top { font-size: 12.5px; }
#footer-main { line-height: 1.7; }

/* 6) ตารางข้อมูล/รายการ: เส้นคั่นบางเบา */
table td { border-color: #eef2f7; }

/* ===== v2 (2026-10-12) ===== */
/* พื้นหลังรอบนอก: ลดความจัดของสีฟ้า ให้ดูสะอาดทันสมัย */
body { background-color: #e9eff4 !important; }

/* กล่องค้นหา: แบนเนอร์เรียบหรู ขอบมน เงาซอฟต์ (แทนภาพ gradient เก่า) */
#box-search {
  background-image: none !important;
  background: linear-gradient(180deg, #9ccb3b 0%, #82af2b 100%) !important;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(31, 41, 55, .12);
  height: auto !important;
  padding-bottom: 14px;
}

/* การ์ดโครงการ/ข่าว: hover ยกขึ้นเบา ๆ */
#box-featured-project, #box-news, #box-news-last, #box-update {
  transition: box-shadow .18s ease, transform .18s ease;
}
#box-featured-project:hover, #box-news:hover {
  box-shadow: 0 8px 22px rgba(13, 38, 76, .14);
  transform: translateY(-2px);
}

/* กล่องล็อกอิน: ขอบล่างมนขึ้น */
#box-login { border-bottom-left-radius: 12px; border-bottom-right-radius: 12px; }

/* ===== v3 (2026-10-12) ===== */
/* คืนหัวข้อกล่องค้นหา (เดิมเป็นภาพในพื้นหลัง) ด้วยตัวอักษรโมเดิร์น */
#box-search::before {
  content: "ค้นหาอสังหาริมทรัพย์";
  display: block;
  text-align: center;
  color: #ffffff;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: .3px;
  padding: 13px 10px 4px 10px;
  text-shadow: 0 1px 2px rgba(0,0,0,.12);
}
/* ย่อช่องว่างเดิมที่เคย reserved ให้ภาพหัวเรื่อง */
#box-search td[height="70"] { display: none !important; }

/* ปุ่มค้นหา: เพิ่มความมน/เงานุ่ม */
#box-search input[type="submit"], #box-search input[type="image"] {
  border-radius: 8px;
  box-shadow: 0 3px 8px rgba(0,0,0,.15);
}
