/* Edu Portal Header & Footer — scoped to #masthead, #colophon, .edu-footbar */

/* ================= HEADER ================= */
#masthead{position:sticky;top:0;z-index:999}
.admin-bar #masthead{top:32px}
@media (max-width:782px){.admin-bar #masthead{top:46px}}
@media (max-width:600px){.admin-bar #masthead{top:0}}

#masthead .main-header-bar{
	background-color:#002d1e!important;background-image:linear-gradient(180deg,#003b28 0%,#002d1e 100%)!important;
	border-bottom:1px solid rgba(255,255,255,.08)!important;
	transition:background-color .3s,box-shadow .3s}
html.edu-hdr-scrolled #masthead .main-header-bar{
	background-image:none!important;background-color:rgba(0,40,26,.95)!important;
	-webkit-backdrop-filter:saturate(1.5) blur(14px);backdrop-filter:saturate(1.5) blur(14px);
	box-shadow:0 10px 30px rgba(0,20,12,.28)}
#masthead .main-header-bar::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,rgba(200,210,74,.55),rgba(125,216,201,.55),transparent);opacity:.7;pointer-events:none}
#masthead .main-header-bar{position:relative}

#ast-desktop-header .site-primary-header-wrap{min-height:76px!important;transition:min-height .3s}

/* logo */
#masthead .custom-logo-link{display:inline-flex;align-items:center;border-radius:10px;transition:opacity .2s,transform .2s}
#masthead .custom-logo-link:hover{opacity:.9;transform:translateY(-1px)}
#masthead .custom-logo{height:46px!important;width:auto!important;max-width:none;transition:height .3s}

/* desktop menu: pills */
#ast-hf-menu-1{gap:4px;align-items:center}
#ast-hf-menu-1>li{margin:0}
#ast-hf-menu-1>li>a.menu-link{position:relative;display:inline-flex;align-items:center;min-height:40px;line-height:1.4!important;padding:8px 16px!important;border-radius:999px;font-size:16px!important;font-weight:600!important;letter-spacing:.01em;color:rgba(255,255,255,.86)!important;background:transparent;transition:background-color .2s,color .2s}
#ast-hf-menu-1>li>a.menu-link:hover,#ast-hf-menu-1>li>a.menu-link:focus-visible{background:rgba(255,255,255,.1);color:#fff!important}
#ast-hf-menu-1>li.current-menu-item>a.menu-link,
#ast-hf-menu-1>li.current_page_item>a.menu-link,
#ast-hf-menu-1>li.current-menu-ancestor>a.menu-link{background:rgba(255,255,255,.14);color:#fff!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
#ast-hf-menu-1>li.current-menu-item>a.menu-link::after,
#ast-hf-menu-1>li.current_page_item>a.menu-link::after,
#ast-hf-menu-1>li.current-menu-ancestor>a.menu-link::after{content:"";position:absolute;left:50%;bottom:-7px;width:18px;height:3px;margin-left:-9px;border-radius:3px;background:#c8d24a}

/* social buttons (header) */
#masthead .ast-header-social-wrap .header-social-inner-wrap{display:flex;gap:8px}
#masthead .ast-header-social-wrap .ast-builder-social-element{display:inline-grid!important;place-items:center;width:40px;height:40px;margin:0!important;padding:0!important;border-radius:12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);transition:background-color .2s,border-color .2s,transform .2s}
#masthead .ast-header-social-wrap .ast-builder-social-element svg{width:18px!important;height:18px!important;fill:#fff!important;transition:fill .2s}
#masthead .ast-header-social-wrap .ast-builder-social-element:hover{background:#c8d24a;border-color:#c8d24a;transform:translateY(-2px)}
#masthead .ast-header-social-wrap .ast-builder-social-element:hover svg{fill:#1d2605!important}

/* focus */
#masthead a:focus-visible,#masthead button:focus-visible{outline:3px solid #7dd8c9!important;outline-offset:2px;border-radius:10px}

/* ================= MOBILE HEADER ================= */
#ast-mobile-header .ast-primary-header-bar .ast-builder-grid-row{min-height:64px}
#ast-mobile-header .ast-primary-header-bar{min-height:64px!important}
#ast-mobile-header .site-branding{padding-top:10px!important;padding-bottom:10px!important}
#ast-mobile-header .custom-logo{height:40px!important}
#ast-mobile-header .menu-toggle{display:inline-grid!important;place-items:center;width:44px;height:44px;padding:0!important;border-radius:12px!important;background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.18)!important;transition:background-color .2s}
#ast-mobile-header .menu-toggle:hover,#ast-mobile-header .menu-toggle.toggled{background:rgba(255,255,255,.16)!important}
#ast-mobile-header .menu-toggle svg{fill:#fff!important;width:20px;height:20px}
#ast-mobile-header .ast-mobile-header-content{background:#00281a!important;border-top:1px solid rgba(255,255,255,.08);padding:10px 14px 18px;box-shadow:0 20px 40px rgba(0,0,0,.3)}
#ast-mobile-header .ast-mobile-header-content .main-header-bar-navigation,
#ast-mobile-header .ast-mobile-header-content .main-navigation{background:transparent!important}
#ast-hf-mobile-menu{display:flex!important;flex-direction:column;gap:4px;background:transparent!important;border:0!important}
#ast-hf-mobile-menu>li{border:0!important;margin:0}
#ast-hf-mobile-menu>li>a.menu-link{display:flex!important;align-items:center;justify-content:space-between;min-height:52px;padding:0 16px!important;border:0!important;border-radius:14px;background:transparent!important;color:#fff!important;font-size:17px!important;font-weight:600!important;line-height:1.4!important;transition:background-color .2s}
#ast-hf-mobile-menu>li>a.menu-link::after{content:"";flex:none;width:8px;height:8px;border-right:2px solid rgba(255,255,255,.45);border-top:2px solid rgba(255,255,255,.45);transform:rotate(45deg)}
#ast-hf-mobile-menu>li>a.menu-link:hover{background:rgba(255,255,255,.08)!important}
#ast-hf-mobile-menu>li.current-menu-item>a.menu-link,
#ast-hf-mobile-menu>li.current_page_item>a.menu-link{background:rgba(255,255,255,.12)!important;box-shadow:inset 3px 0 0 #c8d24a}

/* ================= FOOTER ================= */
#colophon{position:relative;overflow:hidden;background:#00271a}
#colophon::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.06;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cpath d='M60 10c18 20 18 50 0 70-18-20-18-50 0-70zM60 80v30' fill='none' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E");background-size:120px}
#colophon::after{content:"";position:absolute;width:320px;height:320px;right:-110px;top:-120px;border-radius:0 100% 0 100%;background:linear-gradient(135deg,rgba(125,216,201,.2),rgba(125,216,201,0));transform:rotate(12deg);pointer-events:none}
#colophon .site-primary-footer-wrap{position:relative;z-index:1;background:radial-gradient(900px 320px at 85% 0%,rgba(2,147,138,.32),transparent 60%),linear-gradient(180deg,#003d2a 0%,#002a1c 100%)!important;padding:52px 0 36px!important;border:0!important}
#colophon .site-primary-footer-inner-wrap{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:28px 40px;max-width:1200px;margin:0 auto;padding:0 20px}
#colophon .site-primary-footer-inner-wrap>.site-footer-section{margin:0!important;padding:0!important;justify-content:flex-start!important;min-width:0}
#colophon .site-primary-footer-inner-wrap>.site-footer-section:not(:has(*)){display:none!important}

/* brand logo tile */
#colophon .site-footer-section-1 .wp-block-image{display:inline-block;margin:0;padding:16px 18px;border-radius:24px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);box-shadow:0 10px 30px rgba(0,0,0,.2)}
#colophon .site-footer-section-1 img{display:block;width:84px!important;height:auto!important;max-height:120px;object-fit:contain;padding:0;border:0;border-radius:0;background:none;box-shadow:none}

/* address */
#colophon .site-footer-section-4 .ast-footer-copyright{position:relative;text-align:left!important;color:rgba(255,255,255,.84)!important}
#colophon .site-footer-section-4 .ast-footer-copyright:not(.ast-builder-layout-element)::before{content:"ติดต่อเรา";display:inline-block;margin-bottom:8px;font-size:13px;font-weight:700;letter-spacing:.08em;color:#c8d24a}
#colophon .site-footer-section-4 .ast-footer-copyright p{margin:0;font-size:15px!important;line-height:1.75!important}
#colophon .site-footer-section-4 .ast-footer-copyright em{font-style:normal}
#colophon .site-footer-section-4 .ast-footer-copyright span{font-size:inherit!important;color:inherit!important}
#colophon .site-footer-section-4 .ast-footer-copyright strong{display:block;font-size:20px;font-weight:700;color:#fff!important;margin-bottom:4px}

/* social (footer) */
#colophon .site-footer-section-5{flex-direction:column;align-items:flex-start!important}
#colophon .site-footer-section-5::before{content:"ติดตามเรา";display:block;margin-bottom:10px;font-size:13px;font-weight:700;letter-spacing:.08em;color:#c8d24a}
#colophon .ast-footer-social-wrap .footer-social-inner-wrap{display:flex;flex-wrap:wrap;gap:10px}
#colophon .ast-footer-social-wrap .ast-builder-social-element{display:inline-grid!important;place-items:center;width:48px;height:48px;margin:0!important;padding:0!important;border-radius:16px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);transition:background-color .2s,border-color .2s,transform .2s}
#colophon .ast-footer-social-wrap .ast-builder-social-element svg{width:20px!important;height:20px!important;fill:#fff!important;transition:fill .2s}
#colophon .ast-footer-social-wrap .ast-builder-social-element:hover{background:#c8d24a;border-color:#c8d24a;transform:translateY(-3px)}
#colophon .ast-footer-social-wrap .ast-builder-social-element:hover svg{fill:#1d2605!important}
#colophon a:focus-visible{outline:3px solid #7dd8c9;outline-offset:2px;border-radius:12px}

/* bottom bar */
#colophon .edu-footbar{position:relative;z-index:1;background:#001e14;border-top:1px solid rgba(255,255,255,.08)}
#colophon .edu-footbar__in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px;max-width:1200px;margin:0 auto;padding:16px 20px}
#colophon .edu-footbar__menu{display:flex;flex-wrap:wrap;gap:4px;margin:0;padding:0;list-style:none}
#colophon .edu-footbar__menu li{margin:0}
#colophon .edu-footbar__menu a{display:inline-flex;align-items:center;min-height:40px;padding:0 12px;border-radius:999px;font-size:14px;font-weight:600;color:rgba(255,255,255,.78);text-decoration:none;transition:background-color .2s,color .2s}
#colophon .edu-footbar__menu a:hover{background:rgba(255,255,255,.08);color:#fff}
#colophon .edu-footbar__menu .current-menu-item>a{color:#c8d24a}
#colophon .edu-footbar__copy{margin:0;font-size:13px;color:rgba(255,255,255,.6)}

/* scroll-to-top button */
#ast-scroll-top{width:46px!important;height:46px!important;border-radius:14px!important;background:#003d2a!important;border:1px solid rgba(255,255,255,.18)!important;box-shadow:0 10px 24px rgba(0,20,12,.3);transition:transform .2s,background-color .2s}
#ast-scroll-top:hover{background:#01736c!important;transform:translateY(-3px)}


#colophon .site-footer-section-4 .ast-footer-copyright p{text-align:inherit!important}
#colophon .site-footer-section-4 .ast-footer-copyright strong{display:inline-block;margin-bottom:0}
@media (max-width:921px){#colophon .edu-footbar__in{padding-bottom:76px}}
/* ================= RESPONSIVE ================= */
@media (max-width:921px){
	#colophon .site-primary-footer-wrap{padding:40px 0 28px!important}
	#colophon .site-primary-footer-inner-wrap{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;gap:26px}
	#colophon .site-primary-footer-inner-wrap>.site-footer-section{justify-content:center!important;align-items:center!important}
	#colophon .site-footer-section-4 .ast-footer-copyright{text-align:center!important}
	#colophon .site-footer-section-5{align-items:center!important}
	#colophon .ast-footer-social-wrap .footer-social-inner-wrap{justify-content:center}
	#colophon .edu-footbar__in{flex-direction:column;justify-content:center;text-align:center;padding:16px 16px 20px}
	#colophon .edu-footbar__menu{justify-content:center}
}
@media (prefers-reduced-motion:reduce){
	#masthead *,#colophon *,#masthead .main-header-bar,#ast-scroll-top{transition:none!important}
}