/* Footer — responsive & cross-browser (โหลดไฟล์นี้หลัง style.css และไฟล์ breakpoint ทั้งหมด) */
#idFooter, #idFooter-bottom {
	--ft-main: #5e64a8;
	--ft-main-light: #8187c9;
	--ft-main-dark: #3d4178;
	--ft-rgb: 94, 100, 168;
	--ft-accent: #feb713;
	--ft-ink: #1f2133;
	--ft-muted: #6b6e80;
}
#idFooter .ico, #idFooter-bottom .ico { display: inline-block; flex-shrink: 0; width: 1em; height: 1em; fill: currentColor; vertical-align: -.125em; }
/* Quick actions */
#idFooter { position: relative; z-index: 1; padding: clamp(1rem, 1vw, 2.5rem) 0; background: linear-gradient(180deg, #fff, #f5f6fb); box-shadow: none; border-top: 1px solid rgba(var(--ft-rgb), .08); }
#idFooter .ft-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(.75rem, 1.6vw, 1.5rem); }
#idFooter .ft-action {
	display: flex;
	align-items: center;
	gap: 1rem;
	min-width: 0;
	padding: clamp(.9rem, 1.4vw, 1.25rem) clamp(1rem, 1.6vw, 1.5rem);
	border: 1px solid rgba(var(--ft-rgb), .12);
	border-radius: 16px;
	color: var(--ft-ink);
	background: #fff;
	box-shadow: 0 10px 24px -18px rgba(var(--ft-rgb), .6);
	transition: transform .25s, box-shadow .25s, border-color .25s;
}
#idFooter .ft-action:hover, #idFooter .ft-action:focus-visible { color: var(--ft-ink); border-color: rgba(var(--ft-rgb), .35); transform: translateY(-3px); box-shadow: 0 18px 32px -16px rgba(var(--ft-rgb), .55); }
#idFooter .ft-action:focus-visible { outline: 3px solid rgba(var(--ft-rgb), .3); outline-offset: 2px; }
#idFooter .ft-action-ic { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: clamp(44px, 4vw, 54px); height: clamp(44px, 4vw, 54px); border-radius: 14px; font-size: clamp(1.1rem, 1.6vw, 1.4rem); color: #fff; background: linear-gradient(135deg, var(--ft-main-light), var(--ft-main-dark)); box-shadow: 0 8px 18px -8px rgba(var(--ft-rgb), .8); }
#idFooter .ft-action-text { display: flex; flex-direction: column; flex: 1 1 auto; min-width: 0; }
#idFooter .ft-action-text strong { font-size: clamp(1rem, .85rem + .35vw, 1.15rem); font-weight: 600; line-height: 1.25; color: var(--ft-main); }
#idFooter .ft-action-text small { margin-top: .15rem; font-size: .85rem; line-height: 1.35; color: var(--ft-muted); }
#idFooter .ft-action-go { font-size: .95rem; color: rgba(var(--ft-rgb), .45); transition: transform .25s, color .25s; }
#idFooter .ft-action:hover .ft-action-go { color: var(--ft-accent); transform: translateX(4px); }
/* Footer bottom */
#idFooter-bottom { color: #fff; background: radial-gradient(circle at 15% 0%, var(--ft-main-light) 0%, var(--ft-main) 40%, var(--ft-main-dark) 100%); }
#idFooter-bottom .ft-main { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); align-items: center; gap: 2rem; padding: clamp(1rem, 1.4vw, 2.75rem) 0; }
#idFooter-bottom .ft-brand { display: flex; align-items: center; gap: clamp(1rem, 2vw, 1.5rem); min-width: 0; }
#idFooter-bottom .ft-logo { flex-shrink: 0; width: clamp(84px, 9vw, 130px); height: auto; padding: .5rem; border-radius: 16px; background: rgba(255,255,255,.12); }
#idFooter-bottom .ft-brand-text { min-width: 0; }
#idFooter-bottom .ft-name { font-size: clamp(1.15rem, .9rem + .8vw, 1.5rem); font-weight: 600; line-height: 1.25; }
#idFooter-bottom .ft-org { margin-top: .25rem; font-size: clamp(.88rem, .8rem + .2vw, 1rem); opacity: .85; }
#idFooter-bottom .ft-mail { display: inline-flex; align-items: center; gap: .5rem; margin-top: .5rem; font-size: .9rem; color: #fff; word-break: break-all; opacity: .9; }
#idFooter-bottom .ft-mail:hover { color: var(--ft-accent); opacity: 1; }
#idFooter-bottom .ft-social { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .9rem; }
#idFooter-bottom .ft-social a { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; font-size: 1rem; color: #fff; background: rgba(255,255,255,.14); transition: background .2s, color .2s, transform .2s; }
#idFooter-bottom .ft-social a:hover, #idFooter-bottom .ft-social a:focus-visible { color: var(--ft-main-dark); background: #fff; transform: translateY(-2px); }
#idFooter-bottom .ft-side { display: flex; flex-direction: column; align-items: flex-end; gap: 1rem; min-width: 0; }
#idFooter-bottom .ft-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .25rem .5rem; }
#idFooter-bottom .ft-links a { display: inline-flex; align-items: center; gap: .45rem; padding: .35rem .8rem; border-radius: 999px; font-size: .9rem; white-space: nowrap; color: #fff; background: rgba(255,255,255,.08); transition: background .2s, color .2s; }
#idFooter-bottom .ft-links a:hover, #idFooter-bottom .ft-links a:focus-visible { color: var(--ft-main-dark); background: #fff; }
#idFooter-bottom .ft-links .ico { font-size: .95em; color: var(--ft-accent); transition: color .2s; }
#idFooter-bottom .ft-links a:hover .ico, #idFooter-bottom .ft-links a:focus-visible .ico { color: var(--ft-main); }
#idFooter-bottom .ft-admin { display: inline-flex; align-items: center; gap: .45rem; padding: .4rem .9rem; border: 1px solid rgba(255,255,255,.4); border-radius: 999px; font-size: .8rem; white-space: nowrap; color: #fff; transition: background .2s, color .2s, border-color .2s; }
#idFooter-bottom .ft-admin:hover, #idFooter-bottom .ft-admin:focus-visible { color: var(--ft-main-dark); background: var(--ft-accent); border-color: var(--ft-accent); }
#idFooter-bottom .ft-copy { padding: .85rem 0; font-size: .82rem; line-height: 1.5; text-align: center; color: rgba(255,255,255,.75); background: rgba(0,0,0,.22); }
/* Tablet */
@media (max-width: 991.98px) {
	#idFooter .ft-action { flex-direction: column; text-align: center; gap: .6rem; }
	#idFooter .ft-action-go { display: none; }
	#idFooter-bottom .ft-main { grid-template-columns: 1fr; gap: 1.5rem; }
	#idFooter-bottom .ft-side { align-items: flex-start; }
	#idFooter-bottom .ft-links { justify-content: flex-start; }
}
/* Mobile */
@media (max-width: 575.98px) {
	#idFooter .ft-actions { grid-template-columns: 1fr; gap: .6rem; }
	#idFooter .ft-action { flex-direction: row; text-align: left; gap: .9rem; }
	#idFooter .ft-action-go { display: inline-block; }
	#idFooter-bottom .ft-brand { flex-direction: column; align-items: center; text-align: center; }
	#idFooter-bottom .ft-social, #idFooter-bottom .ft-links { justify-content: center; }
	#idFooter-bottom .ft-side { align-items: center; }
}
@media (prefers-reduced-motion: reduce) {
	#idFooter *, #idFooter-bottom * { transition: none !important; }
}

#idFooter-bottom .ft-brand { display: flex; align-items: center; gap: clamp(1rem, 2vw, 1.5rem); min-width: 0; }
#idFooter-bottom .ft-logo { flex-shrink: 0; width: clamp(84px, 9vw, 130px); height: auto; padding: .5rem; border-radius: 16px; background: rgba(255,255,255,.12); }
#idFooter-bottom .ft-brand-text { min-width: 0; }
#idFooter-bottom .ft-name { font-size: clamp(1.15rem, .9rem + .8vw, 1.5rem); font-weight: 600; line-height: 1.25; }
#idFooter-bottom .ft-org { margin-top: .25rem; font-size: clamp(.88rem, .8rem + .2vw, 1rem); opacity: .85; }
#idFooter-bottom .ft-mail { display: inline-flex; align-items: center; gap: .5rem; margin-top: .5rem; font-size: .9rem; color: #fff; word-break: break-all; opacity: .9; }
#idFooter-bottom .ft-mail:hover { color: var(--ft-accent); opacity: 1; }
#idFooter-bottom .ft-social { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .9rem; }
#idFooter-bottom .ft-social a { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; font-size: 1rem; color: #fff; background: rgba(255,255,255,.14); transition: background .2s, color .2s, transform .2s; }
#idFooter-bottom .ft-social a:hover, #idFooter-bottom .ft-social a:focus-visible { color: var(--ft-main-dark); background: #fff; transform: translateY(-2px); }
#idFooter-bottom .ft-side { display: flex; flex-direction: column; align-items: flex-end; gap: 1rem; min-width: 0; }
#idFooter-bottom .ft-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .25rem .5rem; }
#idFooter-bottom .ft-links a { padding: .35rem .75rem; border-radius: 999px; font-size: .9rem; white-space: nowrap; color: #fff; background: rgba(255,255,255,.08); transition: background .2s, color .2s; }
#idFooter-bottom .ft-links a:hover, #idFooter-bottom .ft-links a:focus-visible { color: var(--ft-main-dark); background: #fff; }
#idFooter-bottom .ft-admin { display: inline-flex; align-items: center; gap: .45rem; padding: .4rem .9rem; border: 1px solid rgba(255,255,255,.4); border-radius: 999px; font-size: .8rem; white-space: nowrap; color: #fff; transition: background .2s, color .2s, border-color .2s; }
#idFooter-bottom .ft-admin:hover, #idFooter-bottom .ft-admin:focus-visible { color: var(--ft-main-dark); background: var(--ft-accent); border-color: var(--ft-accent); }
#idFooter-bottom .ft-copy { padding: .85rem 0; font-size: .82rem; line-height: 1.5; text-align: center; color: rgba(255,255,255,.75); background: rgba(0,0,0,.22); }
/* Tablet */
@media (max-width: 991.98px) {
	#idFooter .ft-action { flex-direction: column; text-align: center; gap: .6rem; }
	#idFooter .ft-action-go { display: none; }
	#idFooter-bottom .ft-main { grid-template-columns: 1fr; gap: 1.5rem; }
	#idFooter-bottom .ft-side { align-items: flex-start; }
	#idFooter-bottom .ft-links { justify-content: flex-start; }
}
/* Mobile */
@media (max-width: 575.98px) {
	#idFooter .ft-actions { grid-template-columns: 1fr; gap: .6rem; }
	#idFooter .ft-action { flex-direction: row; text-align: left; gap: .9rem; }
	#idFooter .ft-action-go { display: inline-block; }
	#idFooter-bottom .ft-brand { flex-direction: column; align-items: center; text-align: center; }
	#idFooter-bottom .ft-social, #idFooter-bottom .ft-links { justify-content: center; }
	#idFooter-bottom .ft-side { align-items: center; }
}
@media (prefers-reduced-motion: reduce) {
	#idFooter *, #idFooter-bottom * { transition: none !important; }
}