/*! LMS app.min.css - merged from per-page files. Scope page overrides via body[data-page="..."]. */
body{font-family:'Prompt',sans-serif;background-color:#f8fafc}
html{scroll-behavior:smooth}
@keyframes gradientBG{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
@keyframes fadeIn{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
@keyframes pulse-ring{0%{transform:scale(.8);box-shadow:0 0 0 0 rgba(239,68,68,.7)}70%{transform:scale(1);box-shadow:0 0 0 10px rgba(239,68,68,0)}100%{transform:scale(.8);box-shadow:0 0 0 0 rgba(239,68,68,0)}}
@keyframes bar1{0%,100%{height:4px}50%{height:18px}}
@keyframes bar2{0%,100%{height:12px}50%{height:6px}}
.hero-bg{background:linear-gradient(-45deg,#0f172a,#1e3a8a,#0f172a,#172554);background-size:400% 400%;animation:gradientBG 15s ease infinite}
.custom-scroll::-webkit-scrollbar{width:6px;height:6px}
.custom-scroll::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:10px}
.custom-scroll::-webkit-scrollbar-thumb:hover{background:#94a3b8}
.hide-scrollbar::-webkit-scrollbar{display:none}
.hide-scroll::-webkit-scrollbar{display:none}
.hide-scroll{-ms-overflow-style:none;scrollbar-width:none}
.sort-btn{background:#fff;color:#475569;border-color:#e2e8f0}
.swal2-popup{font-family:'Prompt',sans-serif!important;border-radius:24px!important}
input[type="radio"]:checked + div{transform:scale(1.1);transition:transform .2s}
.mic-active{animation:pulse-ring 2s infinite}
.pb-safe{padding-bottom:max(12px,env(safe-area-inset-bottom))}

/* page: index (bg handled by Tailwind .bg-slate-950 on body) */
body[data-page="index"]{overflow-x:hidden}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
body[data-page="index"] .animate-shimmer{animation:shimmer 4s linear infinite}
body[data-page="index"] .tilt-card{transform-style:preserve-3d;transition:transform .15s ease-out;will-change:transform}
body[data-page="index"] .tilt-card img{transform:translateZ(20px)}
body[data-page="index"] .glass{background:rgba(255,255,255,.03);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.08);box-shadow:0 4px 30px rgba(0,0,0,.1)}

/* page: login (bg handled by .hero-bg class on body) */
body[data-page="login"] .glass{background:rgba(15,23,42,.6);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.1);box-shadow:0 25px 50px -12px rgba(0,0,0,.5)}

/* page: assembly (bg handled by .hero-bg class on body) */
body[data-page="assembly"]{overflow-x:hidden}
body[data-page="assembly"] .glass{background:rgba(15,23,42,.6);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.08);box-shadow:0 4px 30px rgba(0,0,0,.1)}
body[data-page="assembly"] #chat-box::-webkit-scrollbar{width:6px}
body[data-page="assembly"] #chat-box::-webkit-scrollbar-thumb{background:rgba(255,255,255,.2);border-radius:10px}
body[data-page="assembly"] #calendar-container{background-color:#fff!important;border-radius:1.5rem}
body[data-page="assembly"] .fc-theme-standard td,body[data-page="assembly"] .fc-theme-standard th{border-color:#e2e8f0!important}
body[data-page="assembly"] .fc .fc-toolbar-title{color:#3c4043!important;font-weight:500!important;font-size:1.5rem!important}
body[data-page="assembly"] .fc-col-header-cell-cushion{color:#70757a!important;font-weight:500!important;font-size:.85rem!important;text-decoration:none!important;padding:12px 0;text-transform:uppercase}
body[data-page="assembly"] .fc-daygrid-day-number{color:#3c4043!important;font-weight:500!important;padding:8px!important;text-decoration:none!important;font-size:.85rem!important}
body[data-page="assembly"] .fc-daygrid-day-number:hover{background-color:#f1f3f4!important;border-radius:50%;width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;margin:4px}
body[data-page="assembly"] .fc-day-today .fc-daygrid-day-number{background-color:#1a73e8!important;color:#fff!important;border-radius:50%;width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;margin:4px}
body[data-page="assembly"] .fc-day-today{background-color:transparent!important}
body[data-page="assembly"] .fc .fc-button-primary{background-color:#fff!important;color:#3c4043!important;border:1px solid #dadce0!important;font-weight:500!important;border-radius:6px!important;text-transform:capitalize;padding:.4em 1em!important;box-shadow:none!important;transition:background .2s}
body[data-page="assembly"] .fc .fc-button-primary:hover{background-color:#f1f3f4!important}
body[data-page="assembly"] .fc .fc-button-primary:disabled{opacity:.5;cursor:not-allowed}
body[data-page="assembly"] .fc .fc-button-active{background-color:#e8f0fe!important;color:#1a73e8!important;border-color:#1a73e8!important}
body[data-page="assembly"] .fc-event{border:none!important;font-family:'Prompt',sans-serif!important;font-size:.8rem!important;font-weight:400!important;cursor:pointer}
body[data-page="assembly"] .fc-daygrid-dot-event{background-color:transparent!important;color:#3c4043!important;padding:2px 4px!important}
body[data-page="assembly"] .fc-daygrid-dot-event:hover{background-color:#f1f3f4!important;border-radius:4px}
body[data-page="assembly"] .fc-daygrid-event-dot{border-width:4px!important;margin-right:6px!important}
body[data-page="assembly"] .fc-event-time{font-weight:500!important;margin-right:4px!important;color:inherit!important}
body[data-page="assembly"] .fc-daygrid-block-event{color:#fff!important;padding:3px 6px!important;border-radius:4px!important;font-weight:500!important}
body[data-page="assembly"] .fc-daygrid-block-event:hover{filter:brightness(.9)}
body[data-page="assembly"] .fc-event-past{opacity:.45!important;filter:grayscale(20%)!important}
@media (max-width:768px){
body[data-page="assembly"] .fc .fc-toolbar{flex-wrap:wrap!important;gap:6px!important;padding:8px 4px!important}
body[data-page="assembly"] .fc .fc-toolbar-title{font-size:1rem!important}
body[data-page="assembly"] .fc .fc-toolbar-chunk{display:flex;align-items:center;gap:4px}
body[data-page="assembly"] .fc .fc-button-primary{padding:.3em .6em!important;font-size:.75rem!important}
body[data-page="assembly"] .fc-col-header-cell-cushion{font-size:.7rem!important;padding:6px 0!important}
body[data-page="assembly"] .fc-daygrid-day{min-height:52px!important}
body[data-page="assembly"] .fc-daygrid-day-frame{min-height:52px!important;padding:2px!important}
body[data-page="assembly"] .fc-daygrid-day-number{font-size:.72rem!important;padding:4px!important;width:24px;height:24px}
body[data-page="assembly"] .fc-daygrid-day-number:hover{width:24px!important;height:24px!important}
body[data-page="assembly"] .fc-day-today .fc-daygrid-day-number{width:24px!important;height:24px!important;font-size:.72rem!important}
body[data-page="assembly"] .fc-event{font-size:.65rem!important}
body[data-page="assembly"] .fc-daygrid-block-event{padding:1px 4px!important}
body[data-page="assembly"] .fc-daygrid-dot-event{padding:1px 2px!important}
body[data-page="assembly"] .fc-daygrid-event-dot{border-width:3px!important;margin-right:3px!important}
body[data-page="assembly"] .fc-event-time{display:none!important}
body[data-page="assembly"] .fc-daygrid-more-link{font-size:.65rem!important}
}

/* page: course_gradebook */
body[data-page="course_gradebook"] .custom-scroll::-webkit-scrollbar{width:8px;height:8px}
body[data-page="course_gradebook"] .custom-scroll::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:10px}
body[data-page="course_gradebook"] .sticky-col{position:sticky;left:0;background-color:#fff;z-index:10;border-right:2px solid #e2e8f0}
body[data-page="course_gradebook"] .sticky-col-header{position:sticky;left:0;background-color:#f8fafc;z-index:20;border-right:2px solid #e2e8f0}

/* page: course_hub */
body[data-page="course_hub"]{background-color:#f1f5f9}
body[data-page="course_hub"] .active-tab{color:#2563eb;border-bottom:4px solid #2563eb;background-color:rgba(37,99,235,.08)}
body[data-page="course_hub"] .course-banner{background:linear-gradient(135deg,#1e3a8a 0%,#3b82f6 100%)}
/* Quiz start confirmation modal — บนมือถือกว้าง 70vw */
@media (max-width:767px){
body[data-page="course_hub"] #quiz-start-modal > div{width:70vw!important;max-width:70vw!important;padding:1.25rem!important}
body[data-page="course_hub"] #quiz-start-modal h2{font-size:1.1rem!important}
body[data-page="course_hub"] #quiz-start-modal p,body[data-page="course_hub"] #quiz-start-modal li{font-size:.75rem!important}
body[data-page="course_hub"] #quiz-start-modal .w-24{width:4rem!important;height:4rem!important;font-size:1.75rem!important}
}

/* page: create_quiz */
body[data-page="create_quiz"] #import-modal{display:none;backdrop-filter:blur(5px)}

/* page: grade_quiz */
body[data-page="grade_quiz"]{background-color:#f1f5f9}

/* page: grade_task */
body[data-page="grade_task"] .filter-card.active{transform:translateY(-4px);box-shadow:0 10px 15px -3px rgba(0,0,0,.1)}
body[data-page="grade_task"] .filter-card.active::after{content:'';position:absolute;bottom:-2px;left:10%;right:10%;height:4px;border-radius:4px}
body[data-page="grade_task"] .active-all::after{background-color:#64748b}
body[data-page="grade_task"] .active-submitted::after{background-color:#3b82f6}
body[data-page="grade_task"] .active-missing::after{background-color:#f43f5e}
body[data-page="grade_task"] .active-revision::after{background-color:#f59e0b}
body[data-page="grade_task"] .active-resubmitted::after{background-color:#f97316}
body[data-page="grade_task"] .active-graded::after{background-color:#10b981}
@media (max-width:1023px) and (orientation:landscape){
body[data-page="grade_task"] #sg-split-container{flex-direction:row!important}
body[data-page="grade_task"] #sg-left-pane{height:100%!important;width:60%!important;flex:none!important;border-bottom:0!important;border-right:1px solid #1e293b}
body[data-page="grade_task"] #sg-right-pane{height:100%!important;width:40%!important}
body[data-page="grade_task"] #sg-header-toggle-btn{display:none!important}
body[data-page="grade_task"] #sg-inline-toggle-btn{display:none!important}
}

/* page: item_analysis */
body[data-page="item_analysis"]{font-family:'Sarabun',sans-serif;background-color:#f1f5f9}
body[data-page="item_analysis"] .distractor-bar{height:8px;border-radius:4px}
@media print{
body[data-page="item_analysis"]{background-color:#fff}
body[data-page="item_analysis"] .no-print{display:none!important}
body[data-page="item_analysis"] .print-break{page-break-inside:avoid}
body[data-page="item_analysis"] .container{max-width:100%!important;padding:0!important;box-shadow:none!important;border:none!important}
}

/* page: quiz_scores */
body[data-page="quiz_scores"]{background-color:#f1f5f9}

/* page: student_dashboard (utility classes left global to preserve original specificity vs Tailwind CDN) */
body[data-page="student_dashboard"]{background-color:#f1f5f9}
.bg-pattern{background-image:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")}
.course-card{background:linear-gradient(135deg,#1e3a8a 0%,#3b82f6 100%)}
.animate-pulse-slow{animation:pulse 3s cubic-bezier(.4,0,.6,1) infinite}
body[data-page="student_dashboard"] .sort-btn:hover{border-color:#34d399;color:#059669}
body[data-page="student_dashboard"] .sort-btn.active-sort{background:#059669;color:#fff;border-color:#059669}

/* page: submit_task */
body[data-page="submit_task"] .custom-scroll::-webkit-scrollbar{width:6px}
body[data-page="submit_task"] .custom-scroll::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:10px}

/* page: take_quiz */
body[data-page="take_quiz"]{background-color:#f1f5f9}
body[data-page="take_quiz"] .q-radio:checked + label{background-color:#e0e7ff;border-color:#6366f1;font-weight:700}
body[data-page="take_quiz"] .q-radio:checked + label .q-circle{background-color:#6366f1;color:#fff;border-color:#6366f1}
body[data-page="take_quiz"] .sticky-nav{position:sticky;top:0;z-index:50}
/* Fullscreen entry popup — บนมือถือกว้าง 70vw แทน w-full ที่กินเกือบเต็มจอ */
@media (max-width:767px){
body[data-page="take_quiz"] #fullscreen-overlay > div{width:70vw!important;max-width:70vw!important;padding:1.5rem!important}
body[data-page="take_quiz"] #fullscreen-overlay h2{font-size:1.05rem!important}
body[data-page="take_quiz"] #fullscreen-overlay p{font-size:.8rem!important}
}
/* take_quiz: ปิด pull-to-refresh + pinch-zoom + เลื่อน overscroll */
body[data-page="take_quiz"]{overscroll-behavior:contain;touch-action:pan-y;-ms-touch-action:pan-y}
/* iOS auto-zoom กัน: input/textarea ต้อง font-size >= 16px */
body[data-page="take_quiz"] input[type="text"],
body[data-page="take_quiz"] input[type="number"],
body[data-page="take_quiz"] textarea{font-size:16px!important}
/* mobile: Prompt 900 หนาเกินไป + ปรับ overlay/modal ให้พอดี */
@media (max-width:767px){
body[data-page="take_quiz"]{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body[data-page="take_quiz"] .font-black{font-weight:700!important}
body[data-page="take_quiz"] .font-bold{font-weight:600!important}
body[data-page="take_quiz"] h1,body[data-page="take_quiz"] h2,body[data-page="take_quiz"] h3{font-weight:600;letter-spacing:.01em}
body[data-page="take_quiz"] .text-3xl,body[data-page="take_quiz"] .text-4xl{font-weight:700}
/* anti-cheat overlay บนมือถือ — ลดขนาดให้พอดี */
body[data-page="take_quiz"] #anti-cheat-overlay h2{font-size:1.5rem!important;line-height:1.3}
body[data-page="take_quiz"] #anti-cheat-overlay > p,body[data-page="take_quiz"] #anti-cheat-overlay #overlay-reason{font-size:.9rem!important}
body[data-page="take_quiz"] #anti-cheat-overlay i.text-7xl{font-size:3rem!important;margin-bottom:1rem!important}
body[data-page="take_quiz"] #anti-cheat-overlay #resume-quiz-btn{font-size:.95rem!important;padding:.85rem 1.5rem!important}
body[data-page="take_quiz"] #anti-cheat-overlay .text-lg{font-size:1rem!important}
/* disqualify modal บนมือถือ */
body[data-page="take_quiz"] #disqualify-modal > div{width:78vw!important;padding:1.5rem 1.25rem!important}
body[data-page="take_quiz"] #disqualify-modal h2{font-size:1.15rem!important}
body[data-page="take_quiz"] #back-confirm-modal > div{padding:1.5rem 1.25rem!important}
}

/* page: teacher_dashboard */
body[data-page="teacher_dashboard"] .sort-btn:hover{border-color:#818cf8;color:#4f46e5}
body[data-page="teacher_dashboard"] .sort-btn.active-sort{background:#4f46e5;color:#fff;border-color:#4f46e5}

/* ============================================================
   MVC เฟส 1 (28 ก.ค. 69) — คลาสที่มาแทน inline style ในหน้าแรก
   ต้องนิยามที่นี่เพราะ tailwind purge ไม่เห็นคลาสที่สร้างจาก PHP
   ============================================================ */
body[data-page="index"] .dot-grid,body[data-page="public"] .dot-grid{background-image:radial-gradient(circle,#fff 1px,transparent 1px);background-size:24px 24px}
body[data-page="index"] .spin-slow,body[data-page="public"] .spin-slow{animation-duration:20s}
body[data-page="index"] .shimmer-bg,body[data-page="public"] .shimmer-bg{background-size:200% auto}
body[data-page="public"] .glass{background:rgba(255,255,255,.03);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.08);box-shadow:0 4px 30px rgba(0,0,0,.1)}
body[data-page="public"] .animate-shimmer{animation:shimmer 4s linear infinite}
body[data-page="public"] .tilt-card{transform-style:preserve-3d;transition:transform .15s ease-out;will-change:transform}

.admin-hero{background-image:linear-gradient(to right,#1e293b,#581c87)}