/* GPAT Attendance — utility CSS
   สร้างจากคลาสที่ระบบใช้จริงเท่านั้น (317 ตัว) แทนการโหลด Tailwind CDN
   ซึ่งเป็นสคริปต์ ~400KB ที่คอยสแกน DOM ใหม่ตลอดเวลาและทำให้หน้าหน่วง */@keyframes gpat-spin{to{transform:rotate(360deg)}}@keyframes gpat-pulse{0%,100%{opacity:1}50%{opacity:.5}}.gpat.gpat *,.gpat.gpat *::before,.gpat.gpat *::after{box-sizing:border-box}
.gpat.gpat :where(td,th){border:0!important;background:none;font-weight:inherit}.gpat{color:#111827!important;line-height:1.5!important}
/* ฟอนต์: ค่าเริ่มต้นคือฟอนต์ที่เลือกในหน้าตั้งค่า ถ้าเลือก "ใช้ฟอนต์ของธีม" จะสืบทอดจากเว็บ
   ต้องระบุถึงระดับ element ด้วย เพราะธีมหลายตัวตั้ง font-family ให้ h1/p/td โดยตรง */
.gpat.gpat,.gpat.gpat :where(h1,h2,h3,h4,h5,p,div,span,a,li,label,td,th,button,input,select,textarea){font-family:var(--gpat-font,inherit)!important}.gpat.gpat :where(button){font-family:inherit!important;font-size:inherit!important;cursor:pointer;border:0!important;background:none!important;color:inherit!important;text-transform:none!important;letter-spacing:normal!important;box-shadow:none!important}.gpat.gpat :where(input,select,textarea){font-family:inherit!important;font-size:inherit!important;color:inherit!important;box-shadow:none!important}.gpat.gpat :where(table){border-collapse:collapse!important;width:auto;border:0!important}.gpat.gpat :where(h1,h2,h3,h4,p,ul){margin:0!important}.gpat.gpat :where(ul){padding:0!important;list-style:none!important}.gpat.gpat .divide-y > * + *{border-top:1px solid #e5e7eb}.gpat.gpat .bg-black.bg-opacity-50{background-color:rgba(0,0,0,.5)!important}.gpat.gpat .list-disc{list-style:disc!important}.gpat.gpat .list-inside{list-style-position:inside!important}.gpat.gpat .animate-pulse{animation:gpat-pulse 2s cubic-bezier(.4,0,.6,1) infinite}.gpat.gpat .animate-spin{animation:gpat-spin 1s linear infinite}.gpat.gpat .bg-amber-50{background-color:#fffbeb!important}.gpat.gpat .bg-black{background-color:#000!important}.gpat.gpat .bg-blue-100{background-color:#dbeafe!important}.gpat.gpat .bg-blue-300{background-color:#93c5fd!important}.gpat.gpat .bg-blue-500{background-color:#3b82f6!important}.gpat.gpat .bg-blue-50{background-color:#eff6ff!important}.gpat.gpat .bg-blue-600{background-color:#2563eb!important}.gpat.gpat .bg-gray-100{background-color:#f3f4f6!important}.gpat.gpat .bg-gray-300{background-color:#d1d5db!important}.gpat.gpat .bg-gray-400{background-color:#9ca3af!important}.gpat.gpat .bg-gray-500{background-color:#6b7280!important}.gpat.gpat .bg-gray-50{background-color:#f9fafb!important}.gpat.gpat .bg-gray-600{background-color:#4b5563!important}.gpat.gpat .bg-green-100{background-color:#dcfce7!important}.gpat.gpat .bg-green-300{background-color:#86efac!important}.gpat.gpat .bg-green-500{background-color:#22c55e!important}.gpat.gpat .bg-green-600{background-color:#16a34a!important}.gpat.gpat .bg-green-700{background-color:#15803d!important}.gpat.gpat .bg-orange-100{background-color:#ffedd5!important}.gpat.gpat .bg-orange-500{background-color:#f97316!important}.gpat.gpat .bg-orange-600{background-color:#ea580c!important}.gpat.gpat .bg-purple-100{background-color:#f3e8ff!important}.gpat.gpat .bg-purple-500{background-color:#a855f7!important}.gpat.gpat .bg-purple-600{background-color:#9333ea!important}.gpat.gpat .bg-purple-700{background-color:#7e22ce!important}.gpat.gpat .bg-red-100{background-color:#fee2e2!important}.gpat.gpat .bg-red-300{background-color:#fca5a5!important}.gpat.gpat .bg-red-500{background-color:#ef4444!important}.gpat.gpat .bg-red-50{background-color:#fef2f2!important}.gpat.gpat .bg-red-600{background-color:#dc2626!important}.gpat.gpat .bg-red-700{background-color:#b91c1c!important}.gpat.gpat .bg-white{background-color:#fff!important}.gpat.gpat .bg-yellow-100{background-color:#fef9c3!important}.gpat.gpat .bg-yellow-500{background-color:#eab308!important}.gpat.gpat .bg-yellow-600{background-color:#ca8a04!important}.gpat.gpat .block{display:block}.gpat.gpat .border-2{border-width:2px!important;border-style:solid!important}.gpat.gpat .border-amber-200{border-color:#fde68a!important}.gpat.gpat .border-blue-100{border-color:#dbeafe!important}.gpat.gpat .border-blue-200{border-color:#bfdbfe!important}.gpat.gpat .border-blue-300{border-color:#93c5fd!important}.gpat.gpat .border-b{border-bottom-width:1px!important;border-bottom-style:solid!important;border-bottom-color:#e5e7eb!important}.gpat.gpat .border-gray-200{border-color:#e5e7eb!important}.gpat.gpat .border-gray-300{border-color:#d1d5db!important}.gpat.gpat .border-green-500{border-color:#22c55e!important}.gpat.gpat .border-l-4{border-left-width:4px!important;border-left-style:solid!important}.gpat.gpat .border-red-200{border-color:#fecaca!important}.gpat.gpat .border-red-300{border-color:#fca5a5!important}.gpat.gpat .border-t{border-top-width:1px!important;border-top-style:solid!important;border-top-color:#e5e7eb!important}.gpat.gpat .border{border-width:1px!important;border-style:solid!important;border-color:#e5e7eb!important}.gpat.gpat .bottom-4{bottom:1rem}.gpat.gpat .cursor-pointer{cursor:pointer}.gpat.gpat .fixed{position:fixed}.gpat.gpat .flex-1{flex:1 1 0%}.gpat.gpat .flex-col{flex-direction:column}.gpat.gpat .flex-shrink-0{flex-shrink:0}.gpat.gpat .flex-wrap{flex-wrap:wrap}.gpat.gpat .flex{display:flex}.gpat.gpat .font-bold{font-weight:700!important}.gpat.gpat .font-medium{font-weight:500!important}.gpat.gpat .font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace!important}.gpat.gpat .font-semibold{font-weight:600!important}.gpat.gpat .gap-1{gap:0.25rem}.gpat.gpat .gap-2{gap:0.5rem}.gpat.gpat .gap-3{gap:0.75rem}.gpat.gpat .gap-4{gap:1rem}.gpat.gpat .gap-6{gap:1.5rem}.gpat.gpat .gap-8{gap:2rem}.gpat.gpat .grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.gpat.gpat .grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.gpat.gpat .grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.gpat.gpat .grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.gpat.gpat .grid{display:grid}.gpat.gpat .h-10{height:2.5rem}.gpat.gpat .h-16{height:4rem}.gpat.gpat .h-2{height:0.5rem}.gpat.gpat .h-3{height:0.75rem}.gpat.gpat .h-48{height:12rem}.gpat.gpat .h-4{height:1rem}.gpat.gpat .h-5{height:1.25rem}.gpat.gpat .h-8{height:2rem}.gpat.gpat .h-full{height:100%}.gpat.gpat .hidden{display:none}.gpat.gpat .hover\:bg-blue-100:hover{background-color:#dbeafe!important}.gpat.gpat .hover\:bg-blue-50:hover{background-color:#eff6ff!important}.gpat.gpat .hover\:bg-blue-700:hover{background-color:#1d4ed8!important}.gpat.gpat .hover\:bg-gray-50:hover{background-color:#f9fafb!important}.gpat.gpat .hover\:bg-green-700:hover{background-color:#15803d!important}.gpat.gpat .hover\:bg-green-800:hover{background-color:#166534!important}.gpat.gpat .hover\:bg-purple-700:hover{background-color:#7e22ce!important}.gpat.gpat .hover\:bg-purple-800:hover{background-color:#6b21a8!important}.gpat.gpat .hover\:bg-red-700:hover{background-color:#b91c1c!important}.gpat.gpat .hover\:bg-red-800:hover{background-color:#991b1b!important}.gpat.gpat .hover\:shadow-md:hover{box-shadow:0 4px 6px -1px rgba(0,0,0,.1)!important}.gpat.gpat .hover\:text-blue-700:hover{color:#1d4ed8!important}.gpat.gpat .hover\:text-gray-700:hover{color:#374151!important}.gpat.gpat .hover\:text-red-600:hover{color:#dc2626!important}.gpat.gpat .hover\:text-red-700:hover{color:#b91c1c!important}.gpat.gpat .inline-block{display:inline-block}.gpat.gpat .inline-flex{display:inline-flex}.gpat.gpat .inset-0{top:0;right:0;bottom:0;left:0}.gpat.gpat .items-center{align-items:center}.gpat.gpat .items-end{align-items:flex-end}.gpat.gpat .items-start{align-items:flex-start}.gpat.gpat .justify-between{justify-content:space-between}.gpat.gpat .justify-center{justify-content:center}.gpat.gpat .justify-end{justify-content:flex-end}.gpat.gpat .leading-relaxed{line-height:1.625!important}.gpat.gpat .left-0{left:0}.gpat.gpat .left-4{left:1rem}.gpat.gpat .max-h-80{max-height:20rem}.gpat.gpat .max-h-96{max-height:24rem}.gpat.gpat .max-h-\[90vh\]{max-height:90vh}.gpat.gpat .max-w-7xl{max-width:80rem}.gpat.gpat .max-w-md{max-width:28rem}.gpat.gpat .max-w-sm{max-width:24rem}.gpat.gpat .mb-1{margin-bottom:0.25rem}.gpat.gpat .mb-2{margin-bottom:0.5rem}.gpat.gpat .mb-3{margin-bottom:0.75rem}.gpat.gpat .mb-4{margin-bottom:1rem}.gpat.gpat .mb-5{margin-bottom:1.25rem}.gpat.gpat .mb-6{margin-bottom:1.5rem}.gpat.gpat .min-h-full{min-height:100%}.gpat.gpat .min-h-screen{min-height:100vh}.gpat.gpat .min-w-64{min-width:16rem}.gpat.gpat .min-w-\[120px\]{min-width:120px}.gpat.gpat .min-w-\[80px\]{min-width:80px}.gpat.gpat .ml-2{margin-left:0.5rem}.gpat.gpat .ml-3{margin-left:0.75rem}.gpat.gpat .mr-1{margin-right:0.25rem}.gpat.gpat .mr-2{margin-right:0.5rem}.gpat.gpat .mr-3{margin-right:0.75rem}.gpat.gpat .mt-0\.5{margin-top:0.125rem}.gpat.gpat .mt-1{margin-top:0.25rem}.gpat.gpat .mt-2{margin-top:0.5rem}.gpat.gpat .mt-3{margin-top:0.75rem}.gpat.gpat .mt-4{margin-top:1rem}.gpat.gpat .mt-5{margin-top:1.25rem}.gpat.gpat .mt-8{margin-top:2rem}.gpat.gpat .mt-auto{margin-top:auto}.gpat.gpat .mx-2{margin-left:0.5rem;margin-right:0.5rem}.gpat.gpat .mx-auto{margin-left:auto;margin-right:auto}.gpat.gpat .opacity-25{opacity:.25}.gpat.gpat .opacity-75{opacity:.75}.gpat.gpat .overflow-auto{overflow:auto}.gpat.gpat .overflow-hidden{overflow:hidden}.gpat.gpat .overflow-x-auto{overflow-x:auto}.gpat.gpat .overflow-y-auto{overflow-y:auto}.gpat.gpat .p-2{padding:0.5rem!important}.gpat.gpat .p-4{padding:1rem!important}.gpat.gpat .p-6{padding:1.5rem!important}.gpat.gpat .p-8{padding:2rem!important}.gpat.gpat .pb-4{padding-bottom:1rem!important}.gpat.gpat .pr-1{padding-right:0.25rem!important}.gpat.gpat .pt-4{padding-top:1rem!important}.gpat.gpat .pt-5{padding-top:1.25rem!important}.gpat.gpat .pt-6{padding-top:1.5rem!important}.gpat.gpat .px-2{padding-left:0.5rem!important;padding-right:0.5rem!important}.gpat.gpat .px-3{padding-left:0.75rem!important;padding-right:0.75rem!important}.gpat.gpat .px-4{padding-left:1rem!important;padding-right:1rem!important}.gpat.gpat .px-5{padding-left:1.25rem!important;padding-right:1.25rem!important}.gpat.gpat .px-6{padding-left:1.5rem!important;padding-right:1.5rem!important}.gpat.gpat .py-10{padding-top:2.5rem!important;padding-bottom:2.5rem!important}.gpat.gpat .py-1{padding-top:0.25rem!important;padding-bottom:0.25rem!important}.gpat.gpat .py-2{padding-top:0.5rem!important;padding-bottom:0.5rem!important}.gpat.gpat .py-3{padding-top:0.75rem!important;padding-bottom:0.75rem!important}.gpat.gpat .py-4{padding-top:1rem!important;padding-bottom:1rem!important}.gpat.gpat .py-6{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.gpat.gpat .py-8{padding-top:2rem!important;padding-bottom:2rem!important}.gpat.gpat .right-4{right:1rem}.gpat.gpat .rounded-2xl{border-radius:1rem!important}.gpat.gpat .rounded-full{border-radius:9999px!important}.gpat.gpat .rounded-lg{border-radius:.5rem!important}.gpat.gpat .rounded-xl{border-radius:.75rem!important}.gpat.gpat .rounded{border-radius:.25rem!important}.gpat.gpat .shadow-lg{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1)!important}.gpat.gpat .shadow-sm{box-shadow:0 1px 2px 0 rgba(0,0,0,.05)!important}.gpat.gpat .shadow-xl{box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1)!important}.gpat.gpat .space-x-1 > * + *{margin-left:0.25rem}.gpat.gpat .space-x-2 > * + *{margin-left:0.5rem}.gpat.gpat .space-x-3 > * + *{margin-left:0.75rem}.gpat.gpat .space-x-4 > * + *{margin-left:1rem}.gpat.gpat .space-y-0\.5 > * + *{margin-top:0.125rem}.gpat.gpat .space-y-1 > * + *{margin-top:0.25rem}.gpat.gpat .space-y-2 > * + *{margin-top:0.5rem}.gpat.gpat .space-y-3 > * + *{margin-top:0.75rem}.gpat.gpat .space-y-4 > * + *{margin-top:1rem}.gpat.gpat .sticky{position:sticky}.gpat.gpat .text-2xl{font-size:1.5rem!important;line-height:2rem!important}.gpat.gpat .text-amber-900{color:#78350f!important}.gpat.gpat .text-base{font-size:1rem!important;line-height:1.5rem!important}.gpat.gpat .text-blue-100{color:#dbeafe!important}.gpat.gpat .text-blue-300{color:#93c5fd!important}.gpat.gpat .text-blue-500{color:#3b82f6!important}.gpat.gpat .text-blue-600{color:#2563eb!important}.gpat.gpat .text-blue-700{color:#1d4ed8!important}.gpat.gpat .text-blue-800{color:#1e40af!important}.gpat.gpat .text-blue-900{color:#1e3a8a!important}.gpat.gpat .text-center{text-align:center!important}.gpat.gpat .text-gray-100{color:#f3f4f6!important}.gpat.gpat .text-gray-300{color:#d1d5db!important}.gpat.gpat .text-gray-400{color:#9ca3af!important}.gpat.gpat .text-gray-500{color:#6b7280!important}.gpat.gpat .text-gray-600{color:#4b5563!important}.gpat.gpat .text-gray-700{color:#374151!important}.gpat.gpat .text-gray-800{color:#1f2937!important}.gpat.gpat .text-gray-900{color:#111827!important}.gpat.gpat .text-green-100{color:#dcfce7!important}.gpat.gpat .text-green-300{color:#86efac!important}.gpat.gpat .text-green-500{color:#22c55e!important}.gpat.gpat .text-green-600{color:#16a34a!important}.gpat.gpat .text-green-700{color:#15803d!important}.gpat.gpat .text-left{text-align:left!important}.gpat.gpat .text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.gpat.gpat .text-orange-100{color:#ffedd5!important}.gpat.gpat .text-orange-500{color:#f97316!important}.gpat.gpat .text-orange-600{color:#ea580c!important}.gpat.gpat .text-purple-100{color:#f3e8ff!important}.gpat.gpat .text-purple-500{color:#a855f7!important}.gpat.gpat .text-purple-600{color:#9333ea!important}.gpat.gpat .text-red-100{color:#fee2e2!important}.gpat.gpat .text-red-300{color:#fca5a5!important}.gpat.gpat .text-red-500{color:#ef4444!important}.gpat.gpat .text-red-600{color:#dc2626!important}.gpat.gpat .text-red-700{color:#b91c1c!important}.gpat.gpat .text-sm{font-size:.875rem!important;line-height:1.25rem!important}.gpat.gpat .text-white{color:#fff!important}.gpat.gpat .text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.gpat.gpat .text-xs{font-size:.75rem!important;line-height:1rem!important}.gpat.gpat .text-yellow-100{color:#fef9c3!important}.gpat.gpat .text-yellow-500{color:#eab308!important}.gpat.gpat .text-yellow-600{color:#ca8a04!important}.gpat.gpat .top-0{top:0}.gpat.gpat .top-4{top:1rem}.gpat.gpat .top-6{top:1.5rem}.gpat.gpat .tracking-wider{letter-spacing:.05em!important}.gpat.gpat .transition-colors{transition:background-color .15s,color .15s,border-color .15s}.gpat.gpat .transition-shadow{transition:box-shadow .2s}.gpat.gpat .truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gpat.gpat .underline{text-decoration:underline!important}.gpat.gpat .uppercase{text-transform:uppercase!important}.gpat.gpat .w-10{width:2.5rem}.gpat.gpat .w-16{width:4rem}.gpat.gpat .w-24{width:6rem}.gpat.gpat .w-2{width:0.5rem}.gpat.gpat .w-3{width:0.75rem}.gpat.gpat .w-48{width:12rem}.gpat.gpat .w-4{width:1rem}.gpat.gpat .w-5{width:1.25rem}.gpat.gpat .w-60{width:15rem}.gpat.gpat .w-8{width:2rem}.gpat.gpat .w-full{width:100%}.gpat.gpat .whitespace-nowrap{white-space:nowrap}.gpat.gpat .z-40{z-index:40}.gpat.gpat .z-50{z-index:50}@media(min-width:1024px){.gpat.gpat .lg\:col-span-1{grid-column:span 1/span 1}.gpat.gpat .lg\:col-span-2{grid-column:span 2/span 2}.gpat.gpat .lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.gpat.gpat .lg\:px-8{padding-left:2rem!important;padding-right:2rem!important}}@media(min-width:640px){.gpat.gpat .sm\:px-6{padding-left:1.5rem!important;padding-right:1.5rem!important}}@media(min-width:768px){.gpat.gpat .md\:col-span-2{grid-column:span 2/span 2}.gpat.gpat .md\:flex-row{flex-direction:row}.gpat.gpat .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.gpat.gpat .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.gpat.gpat .md\:grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.gpat.gpat .md\:mb-0{margin-bottom:0}}

.gpat.gpat .bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--gpat-g1,#f1f5f9),var(--gpat-g2,#dbeafe))!important}.gpat.gpat .from-slate-100{--gpat-g1:#f1f5f9}.gpat.gpat .to-blue-100{--gpat-g2:#dbeafe}.gpat.gpat .bg-green-400{background-color:#4ade80!important}.gpat.gpat .border-collapse{border-collapse:collapse!important}.gpat.gpat .border-dashed{border-style:dashed!important}.gpat.gpat .divide-gray-200 > * + *{border-top-color:#e5e7eb!important}.gpat.gpat .gap-y-2{row-gap:0.5rem}.gpat.gpat .focus\:outline-none:focus{outline:none}.gpat.gpat .focus\:ring-2:focus{box-shadow:0 0 0 2px var(--gpat-ring,#93c5fd)!important}.gpat.gpat .focus\:ring-blue-500:focus{--gpat-ring:#3b82f6}.gpat.gpat .disabled\:opacity-50:disabled{opacity:.5}
/* ---- สไตล์เฉพาะของระบบ (ยกมาจากเวอร์ชัน Apps Script) ---- */.gpat.gpat .status-present{ background-color:#dcfce7 !important; color:#166534 !important; border-color:#22c55e !important; border-width:2px; }.gpat.gpat .status-absent{ background-color:#fef2f2 !important; color:#991b1b !important; border-color:#ef4444 !important; border-width:2px; }.gpat.gpat .status-sick{ background-color:#fefce8 !important; color:#a16207 !important; border-color:#eab308 !important; border-width:2px; }.gpat.gpat .status-business{ background-color:#fff7ed !important; color:#c2410c !important; border-color:#f97316 !important; border-width:2px; }.gpat.gpat .status-activity{ background-color:#faf5ff !important; color:#6b21a8 !important; border-color:#a855f7 !important; border-width:2px; }.gpat.gpat .status-pending{ background-color:#f9fafb !important; color:#374151 !important; border-color:#9ca3af !important; border-width:2px; }.gpat.gpat .status-changed{ animation: statusChange .6s ease-in-out; }@keyframes statusChange{ 0%{transform:scale(1)} 50%{transform:scale(1.05)} 100%{transform:scale(1)} }.gpat.gpat .status-select{ border-radius:8px; padding:6px 10px; font-weight:500; font-size:14px; transition:all .2s ease-in-out; min-width:120px; }.gpat.gpat .status-select:focus{ outline:none; }.gpat.gpat .new-checkin-highlight{ background-color:#dcfce7 !important; border-left:4px solid #22c55e !important; transition:all .5s ease-in-out; }.gpat.gpat .tab-button{ transition:all .2s ease; position:relative; }.gpat.gpat .tab-button.active{ border-bottom:3px solid #2563eb; color:#2563eb; font-weight:600; }.gpat.gpat .tab-content{ display:none; opacity:0; transition:opacity .15s ease-in-out; }.gpat.gpat .tab-content.active{ display:block; opacity:1; }

    /* เมนูย่อยในแท็บสรุปผล */.gpat.gpat .sub-tab{ color:#6b7280; border-bottom:3px solid transparent; margin-bottom:-1px; transition:all .15s ease; }.gpat.gpat .sub-tab:hover{ color:#374151; }.gpat.gpat .sub-tab.active{ color:#2563eb; border-bottom-color:#2563eb; font-weight:600; }

    /* ใบรายงานรายบุคคล / แบบฟอร์ม มส. */.gpat.gpat .student-report,.gpat.gpat .ms-page{ box-shadow:0 4px 16px rgba(0,0,0,.08); }@media print{
      body * { visibility:hidden; }
      #reportPreview, #reportPreview *, #msPreview, #msPreview * { visibility:visible; }
      #reportPreview, #msPreview { position:absolute; left:0; top:0; }
      .student-report, .ms-page { box-shadow:none; border:none; margin:0; page-break-after:always; }
    }.gpat.gpat .attendance-day{ width:24px; height:24px; border-radius:4px; display:flex; align-items:center; justify-content:center; font-size:10px; font-weight:500; margin:0 auto; }

    /* ตารางการเข้าเรียน — คลาสสั้นเพื่อลดขนาด HTML (v3.4) */.gpat.gpat td.ac{ padding:5px 6px; text-align:center; cursor:pointer; }.gpat.gpat td.ac:hover .ad{ outline:2px solid #2563eb; outline-offset:1px; }.gpat.gpat .ad{ display:inline-flex; width:24px; height:24px; border-radius:4px; align-items:center;
          justify-content:center; font-size:11px; font-weight:600; font-style:normal; }.gpat.gpat .dp{ background:#22c55e; color:#fff }.gpat.gpat .da{ background:#ef4444; color:#fff }.gpat.gpat .ds{ background:#eab308; color:#fff }.gpat.gpat .db{ background:#f97316; color:#fff }.gpat.gpat .dk{ background:#a855f7; color:#fff }.gpat.gpat .dn{ background:#e5e7eb; color:#6b7280 }.gpat.gpat .day-present{ background-color:#22c55e; color:#fff; }.gpat.gpat .day-absent{ background-color:#ef4444; color:#fff; }.gpat.gpat .day-sick{ background-color:#eab308; color:#fff; }.gpat.gpat .day-business{ background-color:#f97316; color:#fff; }.gpat.gpat .day-activity{ background-color:#a855f7; color:#fff; }.gpat.gpat .day-no-class{ background-color:#e5e7eb; color:#6b7280; }

/* ---- ดันหน้าครูออกจากคอลัมน์แคบของธีม ----
   ธีม WordPress ส่วนใหญ่บีบเนื้อหาให้อยู่ราว 700-800px แต่หน้าครูมีตารางหลายคอลัมน์
   จึงต้องกางเต็มจอ เว้นขอบไว้ข้างละ 1% กันแถบเลื่อนแนวนอนที่เกิดจากความกว้างของสกรอลล์บาร์
   (เนื้อหาด้านในยังจำกัดที่ 1280px อยู่แล้ว จอกว้างมากก็ไม่กางจนอ่านยาก) */
.gpat.gpat-teacher-app{width:auto !important;max-width:none !important;margin-left:calc(50% - 49vw) !important;margin-right:calc(50% - 49vw) !important}
/* กันธีมตั้งความกว้างทับตัวห่อชั้นใน */
.gpat.gpat-teacher-app > *{max-width:none}

/* ============================================================
   ชุดสีและรูปแบบให้กลมกลืนกับเว็บโรงเรียน
   ค่าเริ่มต้นดึงจากสีจริงของ themosthub.com
   ผู้ดูแลเปลี่ยนได้ที่ GPAT เช็คชื่อ > ตั้งค่า (ฉีดทับเป็น inline style)
   ============================================================ */
.gpat.gpat-teacher-app{
  --gpat-primary:#003876;      /* กรมท่า — แถบบนของเว็บ */
  --gpat-primary-dark:#002a5c;
  --gpat-primary-soft:#e9f0f8;
  --gpat-primary-line:#c3d6ec;
  --gpat-accent:#801a1a;       /* แดงเลือดหมู — แถบฮีโร่ */
  --gpat-accent-dark:#5f1313;
  --gpat-sky:#1baae8;          /* ฟ้าสด — ส่วน Service */
  --gpat-sky-dark:#1590c7;
  --gpat-page:#f4f7fb;
}
.gpat.gpat-teacher-app{background:var(--gpat-page)!important;padding-bottom:8px}

/* ปุ่มและตัวอักษรหลัก */
.gpat.gpat .bg-blue-600,.gpat.gpat .bg-blue-500{background-color:var(--gpat-primary)!important}
.gpat.gpat .hover\:bg-blue-700:hover{background-color:var(--gpat-primary-dark)!important}
.gpat.gpat .text-blue-600,.gpat.gpat .text-blue-700,
.gpat.gpat .text-blue-800,.gpat.gpat .text-blue-900{color:var(--gpat-primary)!important}
.gpat.gpat .hover\:text-blue-700:hover{color:var(--gpat-primary-dark)!important}
.gpat.gpat .bg-blue-50,.gpat.gpat .bg-blue-100{background-color:var(--gpat-primary-soft)!important}
.gpat.gpat .hover\:bg-blue-50:hover,.gpat.gpat .hover\:bg-blue-100:hover{background-color:var(--gpat-primary-soft)!important}
.gpat.gpat .border-blue-100,.gpat.gpat .border-blue-200,
.gpat.gpat .border-blue-300{border-color:var(--gpat-primary-line)!important}
.gpat.gpat .focus\:ring-blue-500:focus{--gpat-ring:var(--gpat-primary)}

/* ปุ่ม PDF ใช้สีแดงเลือดหมูของเว็บ */
.gpat.gpat .bg-red-600{background-color:var(--gpat-accent)!important}
.gpat.gpat .hover\:bg-red-700:hover{background-color:var(--gpat-accent-dark)!important}

/* แถบหัวแอป — กรมท่าเหมือนแถบบนของเว็บ */
.gpat.gpat.gpat-teacher-app header.bg-white{background:var(--gpat-primary)!important;
  border-bottom-color:transparent!important;box-shadow:0 2px 10px rgba(0,0,0,.14)!important}
.gpat.gpat.gpat-teacher-app header h1{color:#fff!important}
.gpat.gpat.gpat-teacher-app header #currentTime{color:#c5d9f0!important}
.gpat.gpat.gpat-teacher-app header #logoutBtn{color:#c5d9f0!important}
.gpat.gpat.gpat-teacher-app header #logoutBtn:hover{color:#fff!important}
.gpat.gpat.gpat-teacher-app header .border-t{border-top-color:rgba(255,255,255,.2)!important}
.gpat.gpat.gpat-teacher-app header .tab-button{color:#c5d9f0!important}
.gpat.gpat.gpat-teacher-app header .tab-button:hover{color:#fff!important}
.gpat.gpat.gpat-teacher-app header .tab-button.active{color:#fff!important;border-bottom-color:#fff!important}
.gpat.gpat.gpat-teacher-app header #addClassBtn{background:var(--gpat-sky)!important;color:#fff!important}
.gpat.gpat.gpat-teacher-app header #addClassBtn:hover{background:var(--gpat-sky-dark)!important}

/* การ์ดมนขึ้นและเงานุ่มขึ้นให้เข้ากับเว็บ */
.gpat.gpat .rounded-lg{border-radius:.7rem!important}
.gpat.gpat .rounded-xl{border-radius:.9rem!important}
.gpat.gpat .shadow-sm{box-shadow:0 1px 3px rgba(16,35,60,.07),0 1px 2px rgba(16,35,60,.04)!important}

/* แท็บย่อยในหน้าสรุปผล */
.gpat.gpat .sub-tab.active{color:var(--gpat-primary)!important;border-bottom-color:var(--gpat-primary)!important}
.gpat.gpat .tab-button.active{border-bottom-color:var(--gpat-primary)}

/* ช่องในตารางปฏิทิน — ให้เห็นชัดว่าคลิกเปลี่ยนสถานะได้ */
.gpat.gpat td.ac:hover{background:var(--gpat-primary-soft)!important}
.gpat.gpat td.ac:hover .ad{outline:2px solid var(--gpat-primary);outline-offset:1px}

/* ---- แถบเมนูนำทางของเว็บ เหนือหน้าครู ---- */
.gpat.gpat-teacher-app .gpat-sitenav{background:#fff;border-bottom:1px solid #e3e9f2;
  box-shadow:0 1px 3px rgba(16,35,60,.06)}
.gpat.gpat-teacher-app .gpat-sitenav-in{max-width:80rem;margin:0 auto;padding:0 1rem;
  display:flex;align-items:center;gap:.5rem;overflow-x:auto;-webkit-overflow-scrolling:touch}
.gpat.gpat-teacher-app .gpat-sitenav-in::-webkit-scrollbar{height:0}
.gpat.gpat-teacher-app .gpat-sitenav-home{flex-shrink:0;font-weight:700;color:var(--gpat-primary)!important;
  text-decoration:none!important;padding:.85rem .6rem;white-space:nowrap;font-size:.95rem}
.gpat.gpat-teacher-app .gpat-nav-list{display:flex;align-items:center;gap:.1rem;
  margin:0!important;padding:0!important;list-style:none!important}
.gpat.gpat-teacher-app .gpat-nav-list li{margin:0;padding:0;list-style:none}
.gpat.gpat-teacher-app .gpat-nav-list li a{display:block;white-space:nowrap;
  padding:.85rem .85rem;font-size:.9rem;color:#334155!important;text-decoration:none!important;
  border-bottom:3px solid transparent}
.gpat.gpat-teacher-app .gpat-nav-list li a:hover{color:var(--gpat-primary)!important;
  background:var(--gpat-primary-soft);border-bottom-color:var(--gpat-primary)}
.gpat.gpat-teacher-app .gpat-nav-list li.current-menu-item > a{color:var(--gpat-primary)!important;
  border-bottom-color:var(--gpat-primary);font-weight:600}
@media(max-width:640px){
  .gpat.gpat-teacher-app .gpat-sitenav-home{font-size:.85rem;padding:.7rem .4rem}
  .gpat.gpat-teacher-app .gpat-nav-list li a{padding:.7rem .6rem;font-size:.85rem}
}
