/* Andudo Top Bar — front-end */

body.atb-active {
	--atb-height: 48px;
	--atb-admin-offset: 0px;
}
body.atb-active.admin-bar {
	--atb-admin-offset: 32px;
}
@media screen and (max-width: 782px) {
	body.atb-active.admin-bar {
		--atb-admin-offset: 46px;
	}
}
/* WP admin bar ไม่ติดจอที่ ≤600px */
@media screen and (max-width: 600px) {
	body.atb-active.admin-bar {
		--atb-admin-offset: 0px;
	}
}

/* ส่งความสูงแถบให้ธีม caards: header / offcanvas / search ของธีมจะเลื่อนลงมาอยู่ใต้แถบ */
html body.atb-active {
	--cs-wpadminbar-height: calc(var(--atb-admin-offset) + var(--atb-height));
}
@media screen and (max-width: 782px) {
	html body.atb-active.cs-navbar-sticky-enabled.admin-bar .cs-header,
	html body.atb-active.cs-navbar-sticky-enabled.admin-bar .cs-header-stretch-copy {
		top: calc(var(--atb-admin-offset) + var(--atb-height));
	}
	html body.atb-active.cs-navbar-smart-enabled.admin-bar .cs-header.cs-scroll-sticky,
	html body.atb-active.cs-navbar-smart-enabled.admin-bar .cs-header-stretch-copy.cs-scroll-sticky {
		top: calc(var(--atb-admin-offset) + var(--atb-height) - var(--cs-header-initial-height) - 10px);
	}
	html body.atb-active.cs-navbar-smart-enabled.admin-bar .cs-header.cs-scroll-sticky.cs-header-smart-visible,
	html body.atb-active.cs-navbar-smart-enabled.admin-bar .cs-header-stretch-copy.cs-scroll-sticky.cs-header-smart-visible {
		top: calc(var(--atb-admin-offset) + var(--atb-height));
	}
}

/* แถบ */
.atb-bar {
	position: -webkit-sticky;
	position: sticky;
	top: var(--atb-admin-offset);
	z-index: 9990;
	width: 100%;
	height: var(--atb-height);
	background: #fff;
	border-bottom: 1px solid #e3e3e3;
	box-sizing: border-box;
	font-family: inherit;
}
.atb-bar *,
.atb-bar *::before,
.atb-bar *::after {
	box-sizing: border-box;
}
.atb-bar .atb-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	height: 100%;
	padding: 0 20px;
}

/* โลโก้ */
.atb-bar .atb-brand {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
	color: #202124;
	text-decoration: none;
	line-height: 1;
}
.atb-bar .atb-brand:hover,
.atb-bar .atb-brand:focus {
	color: #202124;
	text-decoration: none;
}
.atb-bar .atb-logo {
	display: block;
	height: var(--atb-logo-height, 28px);
	width: auto;
	max-width: 200px;
	object-fit: contain;
	margin: 0;
	border: 0;
	box-shadow: none;
}
.atb-bar .atb-brand-text {
	font-size: 20px;
	font-weight: 600;
	letter-spacing: -0.01em;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* ปุ่มขวา */
.atb-bar .atb-action {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	height: 36px;
	padding: 0 12px;
	margin-right: -12px;
	border-radius: 18px;
	color: #202124;
	font-size: var(--atb-action-size, 15px);
	font-weight: 500;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color .15s ease;
}
.atb-bar .atb-action:hover,
.atb-bar .atb-action:focus {
	color: #202124;
	text-decoration: none;
	background: rgba(60, 64, 67, .08);
}
.atb-bar .atb-brand:focus-visible,
.atb-bar .atb-action:focus-visible {
	outline: 2px solid #1a73e8;
	outline-offset: 2px;
}

@media screen and (max-width: 600px) {
	body.atb-active {
		--atb-height: 46px;
	}
	.atb-bar .atb-inner {
		padding: 0 14px;
	}
	.atb-bar .atb-brand-text {
		font-size: 18px;
	}
	.atb-bar .atb-action {
		font-size: calc(var(--atb-action-size, 15px) - 1px);
	}
}

/* ---------------------------------------------------------------------------
 * หน้าต่างของ plugin อื่น: Top Bar อยู่บนสุดเสมอ หน้าต่างเริ่มใต้แถบ
 * ------------------------------------------------------------------------- */

/* andudo-page-to-product: หน้าต่างสั่งซื้อ (.andudo-modal เดิม top:0; bottom:0)
   !important เพราะ adjustModalTop() ของ plugin นั้นใส่ inline style top:0px ตอนกดปุ่ม
   (มันหา #andudo-top-bar ซึ่งไม่มี) — bottom ที่ JS ตั้งให้ bottom nav ยังทำงานตามเดิม */
body.atb-active .andudo-modal {
	top: calc(var(--atb-admin-offset) + var(--atb-height)) !important;
}
/* ตอนหน้าต่างเปิด plugin นั้นล็อก html, body ด้วย overflow:hidden → sticky ใช้ไม่ได้
   แถบเลยหลุดขึ้นไปถ้าเลื่อนหน้าลงมาก่อน → เปลี่ยนเป็น fixed ชั่วคราว
   และเว้น padding-top แทนที่แถบ กันหน้าเว็บด้านหลังกระตุก */
html.andudo-modal-open body.atb-active {
	padding-top: var(--atb-height);
}
html.andudo-modal-open body.atb-active .atb-bar {
	position: fixed;
	top: var(--atb-admin-offset);
	left: 0;
	right: 0;
}

/* andudo-chat: ซ่อน WP admin bar ตอนเปิดแชต → แถบชิดขอบบน */
body.atb-active.admin-bar.andudo-chat-modal-open {
	--atb-admin-offset: 0px;
}

/* andudo-chat: หน้าต่างแชต (.andudo-chat-modal) */
@media screen and (min-width: 769px) {
	/* เดิม top:20px; height:80% */
	body.atb-active .andudo-chat-modal {
		top: calc(var(--atb-admin-offset) + var(--atb-height) + 20px);
		max-height: calc(100vh - var(--atb-admin-offset) - var(--atb-height) - 40px);
	}
}
/* 481–768px: แชตอยู่กลางจอ (top:50% + translate) อยู่ใต้แถบแล้ว ไม่ต้องปรับ */
@media screen and (max-width: 480px) {
	/* เดิม top:0; height:93% */
	body.atb-active .andudo-chat-modal {
		top: calc(var(--atb-admin-offset) + var(--atb-height));
		height: calc(93% - var(--atb-admin-offset) - var(--atb-height));
	}
}

@media print {
	.atb-bar {
		display: none !important;
	}
}