/*!* เพิ่ม padding-top ให้กับ body เพื่อหลีกเลี่ยง Header ที่ fixed *!*/
/*body {*/
/*	padding-top: 64px; !* ปรับค่านี้ให้เท่ากับความสูงของ header ของคุณ *!*/
/*	scroll-behavior: smooth; !* เพิ่มเพื่อให้การ scroll smooth *!*/
/*}*/

/*!* Hero Section Height *!*/
/*.hero-full-height {*/
/*	min-height: calc(100vh - 64px); !* 100vh ลบด้วยความสูงของ Header *!*/
/*}*/

/*!* CSS สำหรับ Header เมื่อ "ไม่" เลื่อน (อยู่บนสุด) - สีขาวทึบ *!*/
/*#top-bar {*/
/*	background-color: #ffffff; !* สีขาวทึบ *!*/
/*	transition: all 0.3s ease-in-out; !* Transition all relevant properties *!*/
/*	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); !* เพิ่มเงาเล็กน้อย *!*/
/*	border-bottom: none;*/
/*	padding-top: 1rem; !* Default padding-y for py-4 *!*/
/*	padding-bottom: 1rem; !* Default padding-y for py-4 *!*/
/*}*/

/*!* กำหนดสีข้อความเมนูและโลโก้เป็นสีเข้มตลอดเวลา ไม่ว่าจะเลื่อนหรือไม่ *!*/
/*#top-bar .nav-link-color {*/
/*	color: #333333; !* Dark Gray เสมอ *!*/
/*}*/
/*#top-bar .navbar-brand .nav-link-color {*/
/*	color: #4e4e4f !important; !* Dark Gray เสมอ *!*/
/*}*/
/*#top-bar .mobile-menu-icon {*/
/*	stroke: #333333; !* Dark Gray เสมอ *!*/
/*}*/

/*!* === การแก้ไขสำหรับเส้นใต้ตัวอักษร: ทำให้เหมือนกันทุกเมนูเมื่อ active === *!*/

/*!* กำหนดสไตล์พื้นฐานของเส้นใต้สำหรับลิงก์ใน nav-item (ซ่อนไว้ก่อน) *!*/
/*.nav-item a::after {*/
/*	content: '';*/
/*	display: block;*/
/*	height: 2px;*/
/*	background-color: #F0008F; !* สีชมพู *!*/
/*	margin-top: 2px; !* ระยะห่างจากข้อความ *!*/
/*	width: 0; !* ซ่อนไว้เป็นค่าเริ่มต้น *!*/
/*	transition: width 0.3s ease-in-out; !* เพิ่ม transition สำหรับการขยาย *!*/
/*}*/

/*!* เมื่อลิงก์ใดๆ มีคลาส active-link หรือ nav-item-active ให้แสดงเส้นใต้ *!*/
/*#top-bar .nav-item-home.active-link::after,*/
/*#top-bar .nav-item-jobs.nav-item-active::after,*/
/*#top-bar .nav-item-contact.nav-item-active::after {*/
/*	width: 100%; !* ขยายเส้นใต้ให้เต็มความกว้าง *!*/
/*}*/

/*!* ซ่อนเส้นใต้ของ 'หน้าแรก' เมื่อมีการเลื่อน และเมนูอื่น active แทน *!*/
/*#top-bar.scrolled .nav-item-home.active-link::after {*/
/*	width: 0; !* ซ่อนเส้นใต้ *!*/
/*}*/
/*!* === สิ้นสุดการแก้ไขสำหรับเส้นใต้ตัวอักษร === *!*/


/*!* CSS สำหรับ Header เมื่อ "เลื่อน" ลงมา - สีขาวโปร่งแสง และหดเล็กลง *!*/
/*#top-bar.scrolled {*/
/*	background-color: rgba(255, 255, 255, 0.8); !* สีขาวโปร่งแสง *!*/
/*	box-shadow: 0 2px 8px rgba(0,0,0,0.1); !* เพิ่มเงาให้ชัดขึ้นเมื่อเลื่อน *!*/
/*	backdrop-filter: blur(5px); !* เพิ่ม blur effect *!*/
/*	-webkit-backdrop-filter: blur(5px); !* สำหรับ Safari *!*/
/*	border-bottom: none;*/
/*	padding-top: 0.5rem; !* Reduced padding-y for py-2 *!*/
/*	padding-bottom: 0.5rem; !* Reduced padding-y for py-2 *!*/
/*}*/

/*!* ปรับขนาดโลโก้เมื่อ Header หดเล็กลง *!*/
/*#top-bar .navbar-brand img {*/
/*	transition: height 0.3s ease-in-out;*/
/*	height: 3rem; !* h-12 is 3rem (48px) *!*/
/*}*/

/*#top-bar.scrolled .navbar-brand img {*/
/*	height: 2.5rem; !* Slightly smaller, e.g., h-10 (40px) *!*/
/*}*/


/*!* ==== สไตล์เพิ่มเติมสำหรับแถบประกาศรับสมัครงานและตาราง ==== *!*/
/*.job-section-tabs {*/
/*	display: flex;*/
/*	gap: 1rem; !* Space between tabs *!*/
/*	margin-bottom: 2rem;*/
/*	overflow-x: auto; !* Allow scrolling on small screens *!*/
/*}*/

/*.job-tab-item {*/
/*	flex-shrink: 0; !* Prevent tabs from shrinking *!*/
/*	padding: 0.75rem 1.5rem;*/
/*	border-radius: 0.5rem; !* Rounded corners *!*/
/*	font-weight: 600;*/
/*	display: flex;*/
/*	align-items: center;*/
/*	gap: 0.5rem;*/
/*	cursor: pointer;*/
/*	transition: background-color 0.3s ease, color 0.3s ease;*/
/*	white-space: nowrap; !* Prevent text wrapping *!*/
/*}*/

/*.job-tab-item.active-tab {*/
/*	background-color: #F0008F; !* Primary color (Hot Pink) *!*/
/*	color: white;*/
/*}*/

/*.job-tab-item:not(.active-tab) {*/
/*	background-color: #f3f4f6; !* Light gray background *!*/
/*	color: #4b5563; !* Darker text *!*/
/*}*/

/*.job-tab-item:not(.active-tab):hover {*/
/*	background-color: #e5e7eb; !* Slightly darker gray on hover *!*/
/*}*/

/*!* Table Specific Styles *!*/
/*.job-table {*/
/*	width: 100%;*/
/*	border-collapse: collapse; !* Ensure borders collapse *!*/
/*	background-color: white;*/
/*	border-radius: 0.75rem; !* Rounded corners for the table *!*/
/*	overflow: hidden; !* Hide overflowing content for rounded corners *!*/
/*	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); !* Subtle shadow *!*/
/*}*/

/*.job-table thead th {*/
/*	background-color: #f9fafb; !* Light header background *!*/
/*	color: #374151; !* Dark text for headers *!*/
/*	padding: 1rem 1.5rem;*/
/*	text-align: left; !* ตั้งเป็น left เพื่อให้เป็นค่าเริ่มต้น *!*/
/*	font-weight: 600;*/
/*	border-bottom: 1px solid #e5e7eb; !* Light border below header *!*/
/*	font-size: 0.875rem; !* text-sm *!*/
/*	text-transform: uppercase;*/
/*	letter-spacing: 0.05em;*/
/*}*/

/*.job-table tbody td {*/
/*	padding: 1rem 1.5rem;*/
/*	border-bottom: 1px solid #e5e7eb; !* Light border between rows *!*/
/*	vertical-align: top; !* Align content to the top *!*/
/*	font-size: 0.95rem; !* Slightly smaller text for data *!*/
/*	color: #4b5563;*/
/*	text-align: left; !* ตั้งเป็น left เพื่อให้เป็นค่าเริ่มต้น *!*/
/*}*/

/*.job-table tbody tr:last-child td {*/
/*	border-bottom: none; !* No border for the last row *!*/
/*}*/

/*.job-table tbody tr:hover {*/
/*	background-color: #fbfdff; !* Light hover effect for rows *!*/
/*}*/

/*!* Column width adjustments for responsiveness *!*/
/*.job-table .job-id {*/
/*	min-width: 60px; !* ลด min-width เพื่อให้ยืดหยุ่นมากขึ้น *!*/
/*	text-align: center;*/
/*}*/
/*.job-table .job-position-col {*/
/*	min-width: 220px; !* ลด min-width เพื่อให้ยืดหยุ่นมากขึ้น *!*/
/*}*/
/*.job-table .job-unit-col {*/
/*	min-width: 150px; !* ลด min-width เพื่อให้ยืดหยุ่นมากขึ้น *!*/
/*}*/
/*.job-table .job-announced-date-col {*/
/*	min-width: 100px; !* ลด min-width เพื่อให้ยืดหยุ่นมากขึ้น *!*/
/*	white-space: nowrap;*/
/*}*/
/*.job-table .job-icon {*/
/*	min-width: 50px; !* รักษาความกว้างขั้นต่ำ *!*/
/*	text-align: center;*/
/*}*/
/*.job-table .job-action-col {*/
/*	min-width: 90px; !* ลด min-width เพื่อให้ยืดหยุ่นมากขึ้น *!*/
/*	text-align: center;*/
/*}*/

/*!* Button in table *!*/
/*.job-table .btn-apply {*/
/*	background-color: #F0008F; !* Primary pink *!*/
/*	color: white;*/
/*	padding: 0.5rem 1rem;*/
/*	border-radius: 0.375rem; !* md rounded *!*/
/*	font-weight: 600;*/
/*	transition: background-color 0.2s ease;*/
/*}*/
/*.job-table .btn-apply:hover {*/
/*	background-color: #d10077; !* Darker pink on hover *!*/
/*}*/
/*!* Ensure links in table don't get default underline unless intended *!*/
/*.job-table a {*/
/*	text-decoration: none;*/
/*}*/
/*.job-table a:hover {*/
/*	text-decoration: underline; !* Add underline only on hover if desired *!*/
/*}*/

/*!* Adjust specific column width for better display on larger screens *!*/
/*@media (min-width: 1024px) { !* lg screens *!*/
/*	.job-table thead th:nth-child(2) { !* รายละเอียดตำแหน่งงาน *!*/
/*		width: 35%;*/
/*	}*/
/*	.job-table thead th:nth-child(3) { !* หน่วยงาน *!*/
/*		width: 25%;*/
/*	}*/
/*	.job-table thead th:nth-child(4) { !* ประกาศเมื่อ *!*/
/*		width: 15%;*/
/*	}*/
/*}*/

/*!* Hero Section Background Image Styling *!*/
/*.hero-background-image {*/
/*	background-image: url('../images/icons/hiring.png'); !* รูปภาพพื้นหลังที่ถูกแก้ไข *!*/
/*	background-size: cover; !* ครอบคลุมพื้นที่ *!*/
/*	background-position: center bottom; !* จัดให้อยู่ตรงกลางแนวนอนและชิดด้านล่าง *!*/
/*	background-repeat: no-repeat; !* ไม่ทำซ้ำ *!*/
/*	background-attachment: fixed; !* ทำให้รูปภาพค้างอยู่กับที่ *!*/
/*	!* เพิ่ม filter เพื่อเบลอและทำให้สีเข้มขึ้น *!*/
/*	filter: brightness(60%) blur(3px); !* ปรับ brightness เพื่อให้เข้มขึ้น และ blur เพื่อเบลอ *!*/
/*}*/

/*!* ปรับ Hero Section ให้ไม่มีสีพื้นหลังซ้อนทับภาพ *!*/
/*#hero-section {*/
/*	background-color: transparent; !* ทำให้พื้นหลังของส่วน Hero Section โปร่งใส *!*/
/*	overflow: hidden; !* ซ่อนส่วนเกินของรูปภาพ *!*/
/*}*/

/*!* New styles for the language toggle button - always visible and floating *!*/
/*.language-toggle-button {*/
/*	position: fixed;*/
/*	bottom: 1.5rem; !* 24px from bottom *!*/
/*	right: 1.5rem; !* 24px from right *!*/
/*	background-color: #F0008F; !* Primary pink *!*/
/*	color: white;*/
/*	padding: 0; !* Remove padding as image will fill *!*/
/*	border-radius: 9999px; !* rounded-full *!*/
/*	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);*/
/*	display: flex;*/
/*	align-items: center;*/
/*	justify-content: center; !* Center the image *!*/
/*	cursor: pointer;*/
/*	transition: background-color 0.3s ease, transform 0.3s ease;*/
/*	z-index: 1000; !* Ensure it's above other content *!*/
/*	text-decoration: none; !* Remove underline for anchor tag *!*/
/*	width: 3rem; !* Fixed width for a round button *!*/
/*	height: 3rem; !* Fixed height for a round button *!*/
/*	overflow: hidden; !* Ensure image adheres to round shape *!*/
/*}*/

/*.language-toggle-button img {*/
/*	width: 100%; !* Make image fill the button width *!*/
/*	height: 100%; !* Make image fill the button height *!*/
/*	object-fit: cover; !* Cover the area, cropping if necessary *!*/
/*	border-radius: 9999px; !* Ensure image itself is circular *!*/
/*}*/


/*.language-toggle-button:hover {*/
/*	background-color: #d10077; !* Darker pink on hover *!*/
/*	transform: translateY(-2px); !* Slight lift effect *!*/
/*}*/

/*!* Adjust navbar brand text size for mobile *!*/
/*#top-bar .navbar-brand .nav-link-color {*/
/*	font-size: 1.125rem; !* text-lg *!*/
/*}*/
/*@media (min-width: 768px) { !* md screens and up *!*/
/*	#top-bar .navbar-brand .nav-link-color {*/
/*		font-size: 1.25rem; !* text-xl *!*/
/*	}*/
/*}*/