/* ============================================================
 * dark.css — โหมดมืด ระบบ ปพ.5 ออนไลน์ (SchoolLite)
 *   เปิดใช้เมื่อ <html class="pp5-dark"> · แถบบน/แถบข้าง เป็นสีเข้มอยู่แล้ว
 *   ไฟล์นี้พลิก "พื้นที่เนื้อหา" (การ์ด/ตาราง/ช่องกรอก) สีขาว → เข้ม
 *   ใช้ attribute-selector จับ inline style ที่กระจายอยู่ทั่วระบบ (ทับด้วย !important)
 * ============================================================ */

/* ---- พื้นหลัง/ตัวอักษรหลัก ---- */
html.pp5-dark, html.pp5-dark body { background:#0f172a !important; color:#e2e8f0 !important; }
html.pp5-dark #contentArea { background:#0f172a !important; }
html.pp5-dark .main-content-area { background:#1e293b !important; border-color:#334155 !important; box-shadow:none !important; }
html.pp5-dark #mainContainer, html.pp5-dark #mainWrapper { background:transparent !important; }

/* ---- โครงสร้างหลัก ---- */
html.pp5-dark .card,
html.pp5-dark .modal-box,
html.pp5-dark .pp5-card,
html.pp5-dark .panel,
html.pp5-dark .pp5-home-card { background:#1e293b !important; border-color:#334155 !important; color:#e2e8f0 !important; }

html.pp5-dark table,
html.pp5-dark .paper-table { background:#1e293b !important; color:#e2e8f0 !important; }
html.pp5-dark .paper-table th,
html.pp5-dark th { background:#243244 !important; color:#e2e8f0 !important; border-color:#334155 !important; }
html.pp5-dark .paper-table td,
html.pp5-dark td { border-color:#334155 !important; }
html.pp5-dark tbody tr:hover td { background:#263448 !important; }

/* ---- ช่องกรอก ---- */
html.pp5-dark input,
html.pp5-dark select,
html.pp5-dark textarea { background:#0f172a !important; color:#e2e8f0 !important; border-color:#3b4b61 !important; }
html.pp5-dark input::placeholder,
html.pp5-dark textarea::placeholder { color:#64748b !important; }
html.pp5-dark input[readonly],
html.pp5-dark input:disabled { background:#1a2435 !important; color:#94a3b8 !important; }
html.pp5-dark hr { border-color:#334155 !important; }

/* ---- พื้นหลัง inline สีขาว → การ์ดเข้ม ---- */
html.pp5-dark [style*="background:#fff"],
html.pp5-dark [style*="background: #fff"],
html.pp5-dark [style*="background:white"],
html.pp5-dark [style*="background: white"],
html.pp5-dark [style*="background-color:#fff"],
html.pp5-dark [style*="background-color: #fff"] { background-color:#1e293b !important; }

/* ---- เทาอ่อน → พื้นรองเข้ม ---- */
html.pp5-dark [style*="background:#f8fafc"],
html.pp5-dark [style*="background:#f1f5f9"],
html.pp5-dark [style*="background:#f0f4f8"],
html.pp5-dark [style*="background:#f6f7f9"],
html.pp5-dark [style*="background:#eef2f7"],
html.pp5-dark [style*="background:#f4f4f5"],
html.pp5-dark [style*="background:#fafafa"],
html.pp5-dark [style*="background:#f9fafb"],
html.pp5-dark [style*="background:#f3f4f6"],
html.pp5-dark [style*="background: #f8fafc"] { background-color:#243244 !important; }

/* ---- ฟ้าอ่อน (ไฮไลต์หัวตาราง/ข้อมูล) → ฟ้าเข้ม ---- */
html.pp5-dark [style*="background:#f0f9ff"],
html.pp5-dark [style*="background:#f0f6fc"],
html.pp5-dark [style*="background:#eff6ff"],
html.pp5-dark [style*="background:#eef5fa"],
html.pp5-dark [style*="background:#e0f2fe"],
html.pp5-dark [style*="background:#dbeafe"],
html.pp5-dark [style*="background:#eef2ff"] { background-color:#1e2d48 !important; }

/* ---- เหลือง/ส้มอ่อน (แถบเตือน/กรอกด่วน) → น้ำตาลเข้ม ---- */
html.pp5-dark [style*="background:#fefce8"],
html.pp5-dark [style*="background:#fef9c3"],
html.pp5-dark [style*="background:#fff7ed"],
html.pp5-dark [style*="background:#fff9"],
html.pp5-dark [style*="background:#fde68a"],
html.pp5-dark [style*="background:#fef3c7"] { background-color:#3a3320 !important; }

/* ---- เขียวอ่อน → เขียวเข้ม ---- */
html.pp5-dark [style*="background:#f0fdf4"],
html.pp5-dark [style*="background:#dcfce7"],
html.pp5-dark [style*="background:#ecfdf5"] { background-color:#14301f !important; }

/* ---- แดง/ชมพูอ่อน → แดงเข้ม ---- */
html.pp5-dark [style*="background:#fef2f2"],
html.pp5-dark [style*="background:#fee2e2"],
html.pp5-dark [style*="background:#fff1f2"],
html.pp5-dark [style*="background:#fcf0f0"],
html.pp5-dark [style*="background:#fff5f5"] { background-color:#3a1d1d !important; }

/* ---- ตัวอักษรสีเข้ม → สว่าง ---- */
html.pp5-dark [style*="color:#1e293b"],
html.pp5-dark [style*="color:#0f172a"],
html.pp5-dark [style*="color:#334155"],
html.pp5-dark [style*="color:#111"],
html.pp5-dark [style*="color:#000"],
html.pp5-dark [style*="color: #000"],
html.pp5-dark [style*="color:#333"],
html.pp5-dark [style*="color:#1f2937"],
html.pp5-dark [style*="color:#475569"],
html.pp5-dark [style*="color:#374151"],
html.pp5-dark [style*="color:#64748b"] { color:#cbd5e1 !important; }

/* ---- น้ำเงินเข้มแบรนด์ (หัวข้อ) → ฟ้าสว่างให้อ่านง่ายบนพื้นเข้ม ---- */
html.pp5-dark [style*="color:#0c447c"],
html.pp5-dark [style*="color:#1d4ed8"],
html.pp5-dark [style*="color:#1e40af"],
html.pp5-dark [style*="color:#1e6fbf"] { color:#8ab8ff !important; }

/* ---- เส้นขอบอ่อน → เข้ม ---- */
html.pp5-dark [style*="solid #e2e8f0"],
html.pp5-dark [style*="solid #e5e7eb"],
html.pp5-dark [style*="solid #eee"],
html.pp5-dark [style*="solid #cbd5e1"],
html.pp5-dark [style*="solid #f1f5f9"],
html.pp5-dark [style*="solid #d0e3f0"],
html.pp5-dark [style*="solid #e4e4e7"],
html.pp5-dark [style*="solid #ececec"] { border-color:#334155 !important; }

/* ---- หัวข้อหน้า (ขีดส้มใต้หัวข้อ) คงสีส้มไว้ — ตัวอักษรหัวข้อให้สว่าง ---- */
html.pp5-dark h1, html.pp5-dark h2, html.pp5-dark h3, html.pp5-dark h4 { color:#f1f5f9 !important; }

/* ---- ปุ่มหลัก/สีแบรนด์ (น้ำเงิน/เขียว/ส้ม/แดง) คงไว้ — ไม่พลิกพื้นหลังปุ่มที่เป็นสีเต็ม ---- */
html.pp5-dark .btn-primary,
html.pp5-dark [style*="background:#0c447c"],
html.pp5-dark [style*="background:#16a34a"],
html.pp5-dark [style*="background:#22c55e"],
html.pp5-dark [style*="background:#15803d"],
html.pp5-dark [style*="background:#dc2626"],
html.pp5-dark [style*="background:#b91c1c"],
html.pp5-dark [style*="background:#f59e0b"],
html.pp5-dark [style*="background:#f6821f"],
html.pp5-dark [style*="background:#d97706"],
html.pp5-dark [style*="background:#7c3aed"],
html.pp5-dark [style*="background:#0ea5e9"] { color:#fff !important; }

/* ---- Dropdown/เมนูลอย (พื้นขาว) ---- */
html.pp5-dark #manageMenu,
html.pp5-dark #roleDropdown { background:#1e293b !important; border-color:#334155 !important; }
html.pp5-dark #manageMenu button { background:#1e293b !important; color:#e2e8f0 !important; }

/* ---- ปุ่มสลับโหมดมืด ---- */
#pp5DarkToggle { display:flex; align-items:center; justify-content:center; width:32px; height:30px; background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.25); border-radius:6px; color:#fff; cursor:pointer; }
#pp5DarkToggle:hover { background:rgba(255,255,255,0.18); }
#pp5DarkToggle .ico-moon { display:inline-flex; }
#pp5DarkToggle .ico-sun { display:none; }
html.pp5-dark #pp5DarkToggle .ico-sun { display:inline-flex; }
html.pp5-dark #pp5DarkToggle .ico-moon { display:none; }

/* ---- โมดูลฝัง (iframe): ปฏิทินวิชาการ — คลาสเฉพาะที่ไม่ได้ใช้ inline ---- */
html.pp5-dark .month { background:#1e293b !important; border-color:#334155 !important; }
html.pp5-dark table.cal th { background:#243244 !important; color:#cbd5e1 !important; }
html.pp5-dark table.cal td { border-color:#263448 !important; }
html.pp5-dark table.cal td.empty { background:#17202f !important; }
html.pp5-dark table.cal td.wknd { background:#2a1f22 !important; }
html.pp5-dark table.cal td .dnum { color:#cbd5e1 !important; }
html.pp5-dark .term-card,
html.pp5-dark .sched-wrap { background:#1e293b !important; border-color:#334155 !important; }
html.pp5-dark .chip { background:#243244 !important; color:#cbd5e1 !important; }
html.pp5-dark .cal-head { background:#1e293b !important; }
html.pp5-dark .cal-toolbar { background:#17202f !important; border-color:#334155 !important; }
html.pp5-dark table.sched td { border-color:#334155 !important; }
html.pp5-dark table.sched tbody tr:hover { background:#263448 !important; }

/* ---- scrollbar เข้ม ---- */
html.pp5-dark ::-webkit-scrollbar { width:10px; height:10px; }
html.pp5-dark ::-webkit-scrollbar-thumb { background:#334155; border-radius:6px; }
html.pp5-dark ::-webkit-scrollbar-track { background:#0f172a; }