/* สไตล์ส่วนเพิ่ม: เมนูแอดมิน / ลิงก์นโยบายท้ายเว็บ / หน้านโยบาย / หน้าแอดมิน (ภาพแชร์, บันทึกคุกกี้) */

/* ---------- เมนูแอดมินใน navtop ---------- */
#header .header-nav-main nav > ul > li.nav-admin > a {
	color: #CE0001 !important;
	background: #fdecec;
	font-weight: 600;
}

#header .header-nav-main nav > ul > li.nav-admin > a:hover,
#header .header-nav-main nav > ul > li.nav-admin > a.active {
	color: #FFF !important;
	background: linear-gradient(120deg, #CE0001 0%, #8D0104 100%) !important;
}

#header .header-nav-main nav > ul > li.nav-admin .dropdown-menu li a {
	font-size: 15px;
	text-transform: none;
}

#header .header-nav-main nav > ul > li.nav-admin .dropdown-menu li a i {
	width: 22px;
	margin-right: 6px;
	text-align: center;
	color: #CE0001;
}

/* ---------- หน้านโยบาย ---------- */
.policy-section { background: #f5f5f5; }

.policy-page {
	max-width: 940px;
	margin: 0 auto;
	padding: 34px 44px 40px;
	background: #FFF;
	border-radius: 20px;
	box-shadow: 0 10px 34px rgba(0, 0, 0, .06);
}

.policy-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 14px;
}

.policy-tabs a {
	padding: 8px 16px;
	border-radius: 999px;
	background: #f2f2f2;
	color: #444;
	font-size: 15px;
	text-decoration: none !important;
	transition: background .15s ease;
}

.policy-tabs a:hover { background: #e7e7e7; }

.policy-tabs a.active {
	background: linear-gradient(120deg, #CE0001 0%, #8D0104 100%);
	color: #FFF;
}

.policy-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 20px;
	padding-bottom: 18px;
	margin-bottom: 22px;
	border-bottom: 1px solid #ececec;
	font-size: 14px;
	color: #777;
}

.policy-meta i { color: #CE0001; margin-right: 4px; }

.policy-body {
	color: #2b2b2b;
	font-size: 16px;
}

.policy-body p {
	line-height: 1.85 !important;
	margin-bottom: 12px !important;
	color: #2b2b2b;
}

.policy-body .policy-lead {
	font-size: 17px;
	color: #444;
	margin-bottom: 20px !important;
}

.policy-body h2 {
	position: relative;
	font-size: 21px;
	font-weight: 700;
	line-height: 1.4;
	color: #1f1f1f;
	margin: 34px 0 12px;
	padding-left: 14px;
	scroll-margin-top: 20px;
}

.policy-body h2::before {
	content: "";
	position: absolute;
	left: 0;
	top: 4px;
	bottom: 4px;
	width: 4px;
	border-radius: 4px;
	background: #CE0001;
}

.policy-body h3 {
	font-size: 17px;
	font-weight: 700;
	line-height: 1.5;
	color: #333;
	margin: 20px 0 8px;
}

.policy-body ul,
.policy-body ol {
	padding-left: 22px;
	margin-bottom: 14px;
}

.policy-body li {
	line-height: 1.8;
	margin-bottom: 6px;
}

.policy-body a { color: #CE0001; }

.policy-body code {
	padding: 1px 6px;
	border-radius: 6px;
	background: #f3f3f3;
	color: #b0000a;
	font-size: 14px;
}

.policy-toc {
	padding: 16px 22px;
	margin-bottom: 8px;
	border-radius: 14px;
	background: #fafafa;
	border: 1px solid #eee;
}

.policy-toc-title {
	font-weight: 700;
	margin-bottom: 6px;
}

.policy-toc ol {
	columns: 2;
	column-gap: 28px;
	margin: 0;
}

.policy-toc li { margin-bottom: 2px; }

.policy-table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 14px;
	font-size: 15px;
}

.policy-table th,
.policy-table td {
	padding: 10px 12px;
	border: 1px solid #e6e6e6;
	vertical-align: top;
	line-height: 1.6;
}

.policy-table th {
	background: #f7f7f7;
	font-weight: 700;
	color: #333;
	white-space: nowrap;
}

.policy-tag {
	display: inline-block;
	padding: 2px 10px;
	margin-left: 6px;
	border-radius: 999px;
	background: #f2f2f2;
	color: #666;
	font-size: 12px;
	font-weight: 600;
	vertical-align: middle;
}

.policy-tag-on { background: #e8f7ee; color: #16803c; }

.policy-note {
	font-size: 14px;
	color: #777 !important;
}

.policy-callout {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 22px;
	margin-bottom: 10px;
	border-radius: 16px;
	background: #fff6f6;
	border: 1px solid #f6d4d4;
}

.policy-callout p { margin: 2px 0 0 !important; color: #666; }

.policy-callout .cc-btn { flex: none; }

.policy-contact {
	padding: 18px 22px;
	border-radius: 16px;
	background: #fafafa;
	border: 1px solid #eee;
}

.policy-contact-title {
	font-weight: 700;
	font-size: 17px;
	margin-bottom: 8px;
}

.policy-contact-title i { color: #CE0001; margin-right: 6px; }

.policy-contact ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.policy-contact li {
	display: flex;
	gap: 10px;
	margin-bottom: 4px;
}

.policy-contact li i {
	width: 18px;
	margin-top: 6px;
	text-align: center;
	color: #888;
}

@media (max-width: 767px) {
	.policy-page {
		padding: 22px 18px 26px;
		border-radius: 14px;
	}

	.policy-toc ol { columns: 1; }

	.policy-callout {
		flex-direction: column;
		align-items: stretch;
	}

	.policy-body h2 { font-size: 19px; }
}

/* ---------- แอดมิน: ภาพแชร์ og:image ---------- */
.og-setting {
	padding-bottom: 20px;
	border-bottom: 1px solid #eee;
}

.og-setting-row {
	display: flex;
	gap: 20px;
	align-items: flex-start;
	margin-top: 6px;
}

.og-preview {
	flex: 0 0 300px;
	max-width: 100%;
	aspect-ratio: 1.91 / 1; /* สัดส่วนที่ Facebook ใช้แสดงภาพ */
	overflow: hidden;
	border-radius: 12px;
	background: #f2f2f2;
	border: 1px solid #e3e3e3;
}

.og-preview img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.og-setting-info { flex: 1; min-width: 0; }

@media (max-width: 767px) {
	.og-setting-row { flex-direction: column; }
	.og-preview { flex-basis: auto; width: 100%; }
}

/* ---------- แอดมิน: บันทึกความยินยอมคุกกี้ ---------- */
.pdpa-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
	gap: 14px;
	margin-bottom: 20px;
}

.pdpa-stat {
	display: flex;
	flex-direction: column;
	padding: 16px 18px;
	border-radius: 16px;
	background: #FFF;
	box-shadow: 0 6px 22px rgba(0, 0, 0, .06);
}

.pdpa-stat span { font-size: 14px; color: #777; }
.pdpa-stat strong { font-size: 30px; line-height: 1.3; color: #1f1f1f; }
.pdpa-stat small { font-size: 13px; color: #999; }

.pdpa-card {
	border-radius: 16px;
	background: #FFF;
	box-shadow: 0 6px 22px rgba(0, 0, 0, .06);
	overflow: hidden;
}

.pdpa-card-head {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 8px;
	padding: 14px 18px;
	border-bottom: 1px solid #eee;
}

.pdpa-card-head span { color: #888; font-size: 14px; }

.pdpa-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
}

.pdpa-table th,
.pdpa-table td {
	padding: 10px 14px;
	border-bottom: 1px solid #f0f0f0;
	vertical-align: middle;
}

.pdpa-table th {
	background: #fafafa;
	color: #555;
	font-weight: 600;
	white-space: nowrap;
}

.pdpa-page {
	max-width: 220px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.pdpa-badge {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	white-space: nowrap;
}

.pdpa-badge-on { background: #e8f7ee; color: #16803c; }
.pdpa-badge-off { background: #f1f1f1; color: #666; }
.pdpa-badge-custom { background: #e9f1fd; color: #1d5fbf; }
.pdpa-yes { color: #16a34a; }
.pdpa-no { color: #c4c4c4; }
.pdpa-empty { padding: 30px !important; color: #999; }

.pdpa-footnote {
	margin-top: 16px !important;
	font-size: 14px;
	color: #777 !important;
	line-height: 1.7 !important;
}

/* ---------- แอดมิน: โลโก้เว็บไซต์ ---------- */
.logo-setting-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 16px;
	margin-top: 6px;
}

.logo-setting-item {
	padding: 14px;
	border: 1px solid #e6e6e6;
	border-radius: 12px;
}

/* พื้นตารางหมากรุก ให้เห็นส่วนโปร่งใสของโลโก้ */
.logo-preview {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 96px;
	margin-bottom: 10px;
	border-radius: 10px;
	background-color: #FFF;
	background-image: conic-gradient(#efefef 25%, transparent 0 50%, #efefef 0 75%, transparent 0);
	background-size: 16px 16px;
}

.logo-preview img {
	max-width: 90%;
	max-height: 70px;
	width: auto;
	height: auto;
}
