@font-face{font-family:Sarabun;font-style:normal;font-weight:300;font-display:swap;src:url(../media/58fcc4ad15255874-s.p.023jaxb4i0-q4.woff2)format("woff2");unicode-range:U+2D7,U+303,U+331,U+E01-E5B,U+200C-200D,U+25CC}@font-face{font-family:Sarabun;font-style:normal;font-weight:300;font-display:swap;src:url(../media/0752d9e9446886e3-s.37gff19qu_kpu.woff2)format("woff2");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Sarabun;font-style:normal;font-weight:300;font-display:swap;src:url(../media/477b48776687fc32-s.3frzesdy96z2h.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Sarabun;font-style:normal;font-weight:300;font-display:swap;src:url(../media/e12efafcac952e69-s.p.3gt1gw19188hm.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Sarabun;font-style:normal;font-weight:400;font-display:swap;src:url(../media/e9ed0bc71a38d6c1-s.p.2m2jj329378-j.woff2)format("woff2");unicode-range:U+2D7,U+303,U+331,U+E01-E5B,U+200C-200D,U+25CC}@font-face{font-family:Sarabun;font-style:normal;font-weight:400;font-display:swap;src:url(../media/7062a58b1da0e8a4-s.1hwnmpdlfbr5r.woff2)format("woff2");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Sarabun;font-style:normal;font-weight:400;font-display:swap;src:url(../media/3d0c37763e1ee3aa-s.436q8r5--eamd.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Sarabun;font-style:normal;font-weight:400;font-display:swap;src:url(../media/a19976a16d351e92-s.p.41_1bbhnqcn3l.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Sarabun;font-style:normal;font-weight:500;font-display:swap;src:url(../media/3836391c10060ce4-s.p.2ub5ob4yff_mt.woff2)format("woff2");unicode-range:U+2D7,U+303,U+331,U+E01-E5B,U+200C-200D,U+25CC}@font-face{font-family:Sarabun;font-style:normal;font-weight:500;font-display:swap;src:url(../media/f35096588af3ac65-s.1mcy67zyrjken.woff2)format("woff2");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Sarabun;font-style:normal;font-weight:500;font-display:swap;src:url(../media/4ef4c2244410ddd5-s.1q60sed-n-nyg.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Sarabun;font-style:normal;font-weight:500;font-display:swap;src:url(../media/6281857f0573b169-s.p.2ggoighzpvw-e.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Sarabun;font-style:normal;font-weight:600;font-display:swap;src:url(../media/a0529e96a7862c0d-s.p.3w1e23hf7mhof.woff2)format("woff2");unicode-range:U+2D7,U+303,U+331,U+E01-E5B,U+200C-200D,U+25CC}@font-face{font-family:Sarabun;font-style:normal;font-weight:600;font-display:swap;src:url(../media/e1a185165aeb6b39-s.3_tzb9xzdxfhl.woff2)format("woff2");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Sarabun;font-style:normal;font-weight:600;font-display:swap;src:url(../media/aa5e8dae0d902b15-s.3sa03-u70a6zc.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Sarabun;font-style:normal;font-weight:600;font-display:swap;src:url(../media/22d7e241aeb09639-s.p.33ndw2snxq3le.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Sarabun;font-style:normal;font-weight:700;font-display:swap;src:url(../media/0bbfe7d70ca362ab-s.p.18qb6f14hcpif.woff2)format("woff2");unicode-range:U+2D7,U+303,U+331,U+E01-E5B,U+200C-200D,U+25CC}@font-face{font-family:Sarabun;font-style:normal;font-weight:700;font-display:swap;src:url(../media/c9e7701bc8b3db09-s.2ckknpajidhx6.woff2)format("woff2");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Sarabun;font-style:normal;font-weight:700;font-display:swap;src:url(../media/fe9c9076d1cdc5cf-s.1kljupmg-52kq.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Sarabun;font-style:normal;font-weight:700;font-display:swap;src:url(../media/bcc136e7df79ae49-s.p.3vvwmya0_3z_s.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Sarabun;font-style:normal;font-weight:800;font-display:swap;src:url(../media/aa35d34c0e23a34f-s.p.3248z3z34egsx.woff2)format("woff2");unicode-range:U+2D7,U+303,U+331,U+E01-E5B,U+200C-200D,U+25CC}@font-face{font-family:Sarabun;font-style:normal;font-weight:800;font-display:swap;src:url(../media/567f0a86a5eea43d-s.2qzkopjco0xi8.woff2)format("woff2");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Sarabun;font-style:normal;font-weight:800;font-display:swap;src:url(../media/bf5b4abd129b50f3-s.29zbwz06iahby.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Sarabun;font-style:normal;font-weight:800;font-display:swap;src:url(../media/befcc618a6d7d45d-s.p.213nava8pi66q.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Sarabun Fallback;src:local(Arial);ascent-override:109.45%;descent-override:23.78%;line-gap-override:0.0%;size-adjust:97.58%}.sarabun_a0bf322f-module__npjhAG__className{font-family:Sarabun,Sarabun Fallback;font-style:normal}.sarabun_a0bf322f-module__npjhAG__variable{--font-sarabun:"Sarabun", "Sarabun Fallback"}
:root{--primary-900:#0f1724;--primary-800:#1a2332;--primary-700:#1e3a5f;--primary-600:#2563eb;--primary-500:#3b82f6;--primary-400:#60a5fa;--primary-300:#93c5fd;--primary-200:#bfdbfe;--primary-100:#dbeafe;--primary-50:#eff6ff;--gold-500:#c4a35a;--gold-400:#d4b76a;--gold-300:#e4cb8a;--success-600:#16a34a;--success-500:#22c55e;--success-100:#dcfce7;--success-50:#f0fdf4;--warning-600:#d97706;--warning-500:#f59e0b;--warning-100:#fef3c7;--warning-50:#fffbeb;--danger-600:#dc2626;--danger-500:#ef4444;--danger-100:#fee2e2;--danger-50:#fef2f2;--info-600:#0891b2;--info-500:#06b6d4;--info-100:#cffafe;--info-50:#ecfeff;--gray-900:#111827;--gray-800:#1f2937;--gray-700:#374151;--gray-600:#4b5563;--gray-500:#6b7280;--gray-400:#9ca3af;--gray-300:#d1d5db;--gray-200:#e5e7eb;--gray-100:#f3f4f6;--gray-50:#f9fafb;--bg-main:#f0f2f5;--bg-card:#fff;--bg-sidebar:linear-gradient(180deg, #0f1724 0%, #1a2332 50%, #1e3a5f 100%);--text-primary:#1f2937;--text-secondary:#6b7280;--text-muted:#9ca3af;--text-white:#fff;--text-link:#2563eb;--shadow-sm:0 1px 2px #0000000d;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;--shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--shadow-xl:0 20px 25px -5px #0000001a, 0 8px 10px -6px #0000001a;--radius-sm:6px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-full:9999px;--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-normal:.25s cubic-bezier(.4, 0, .2, 1);--transition-slow:.35s cubic-bezier(.4, 0, .2, 1);--sidebar-width:260px;--sidebar-collapsed-width:70px;--header-height:64px;--font-family:"Sarabun", sans-serif}*{box-sizing:border-box;margin:0;padding:0}html{height:100%;font-size:16px}html,body{max-width:100vw;overflow-x:hidden}body{min-height:100%;color:var(--text-primary);background:var(--bg-main);font-family:var(--font-family);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;flex-direction:column;line-height:1.6;display:flex}a{color:inherit;text-decoration:none}.app-layout{min-height:100vh;display:flex}.main-content{margin-left:var(--sidebar-width);min-height:100vh;transition:margin-left var(--transition-normal);flex-direction:column;flex:1;display:flex}.page-content{margin-top:var(--header-height);flex:1;padding:24px 32px}.sidebar{width:var(--sidebar-width);background:var(--bg-sidebar);height:100vh;color:var(--text-white);z-index:100;transition:width var(--transition-normal);flex-direction:column;display:flex;position:fixed;top:0;left:0;overflow:hidden auto}.sidebar-logo{border-bottom:1px solid #ffffff1a;align-items:center;gap:12px;min-height:80px;padding:20px 24px;display:flex}.sidebar-logo-icon{width:48px;height:48px;color:var(--primary-900);background:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:20px;font-weight:700;display:flex;overflow:hidden;box-shadow:0 2px 8px #0000004d}.sidebar-logo-text h2{letter-spacing:.3px;font-size:15px;font-weight:700;line-height:1.3}.sidebar-logo-text p{color:#ffffff80;font-size:11px;font-weight:400}.sidebar-nav{flex-direction:column;flex:1;gap:4px;padding:16px 12px;display:flex}.sidebar-nav-item{border-radius:var(--radius-md);color:#ffffffb3;cursor:pointer;transition:all var(--transition-fast);text-align:left;background:0 0;border:none;align-items:center;gap:12px;width:100%;padding:12px 16px;font-size:14px;font-weight:500;text-decoration:none;display:flex}.sidebar-nav-item:hover{color:var(--text-white);background:#ffffff1a}.sidebar-nav-item.active{background:linear-gradient(135deg, var(--primary-600), var(--primary-500));color:var(--text-white);box-shadow:0 4px 12px #2563eb66}.sidebar-nav-item svg,.sidebar-nav-item .nav-icon{flex-shrink:0;width:20px;height:20px}.sidebar-divider{background:#ffffff1a;height:1px;margin:8px 4px}.sidebar-footer{border-top:1px solid #ffffff1a;padding:12px}.header{top:0;left:var(--sidebar-width);height:var(--header-height);background:var(--bg-card);border-bottom:1px solid var(--gray-200);z-index:50;box-shadow:var(--shadow-sm);transition:left var(--transition-normal);justify-content:space-between;align-items:center;padding:0 32px;display:flex;position:fixed;right:0}.header-title{color:var(--text-primary);font-size:18px;font-weight:600}.header-right{align-items:center;gap:16px;display:flex}.header-search{align-items:center;display:flex;position:relative}.header-search input{border:1px solid var(--gray-300);border-radius:var(--radius-full);width:280px;font-size:14px;font-family:var(--font-family);transition:all var(--transition-fast);background:var(--gray-50);outline:none;padding:8px 16px 8px 40px}.header-search input:focus{border-color:var(--primary-500);background:var(--bg-card);box-shadow:0 0 0 3px #3b82f626}.header-search svg{color:var(--gray-400);width:16px;height:16px;position:absolute;left:14px}.header-icon-btn{border-radius:var(--radius-full);cursor:pointer;width:40px;height:40px;color:var(--gray-600);transition:all var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;display:flex;position:relative}.header-icon-btn:hover{background:var(--gray-100);color:var(--text-primary)}.header-icon-btn .badge{background:var(--danger-500);border-radius:var(--radius-full);border:2px solid var(--bg-card);width:8px;height:8px;position:absolute;top:6px;right:6px}.header-avatar{border-radius:var(--radius-full);background:linear-gradient(135deg, var(--primary-600), var(--primary-400));width:36px;height:36px;color:var(--text-white);cursor:pointer;justify-content:center;align-items:center;font-size:13px;font-weight:600;display:flex}.page-header{margin-bottom:24px}.page-header h1{color:var(--text-primary);margin-bottom:4px;font-size:26px;font-weight:700}.page-header p{color:var(--text-secondary);font-size:14px}.page-header-row{justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;margin-bottom:24px;display:grid}.stats-card{background:var(--bg-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--gray-100);transition:all var(--transition-fast);align-items:center;gap:16px;padding:20px 24px;display:flex}.stats-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.stats-card-icon{border-radius:var(--radius-lg);flex-shrink:0;justify-content:center;align-items:center;width:52px;height:52px;display:flex}.stats-card-icon.blue{background:var(--primary-100);color:var(--primary-600)}.stats-card-icon.green{background:var(--success-100);color:var(--success-600)}.stats-card-icon.red{background:var(--danger-100);color:var(--danger-600)}.stats-card-icon.orange{background:var(--warning-100);color:var(--warning-600)}.stats-card-icon.cyan{background:var(--info-100);color:var(--info-600)}.stats-card-icon.purple{color:#7c3aed;background:#f3e8ff}.stats-card-info h3{color:var(--text-primary);font-size:28px;font-weight:700;line-height:1.2}.stats-card-info p{color:var(--text-secondary);font-size:13px;font-weight:500}.card{background:var(--bg-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--gray-100);overflow:hidden}.card-header{border-bottom:1px solid var(--gray-100);justify-content:space-between;align-items:center;padding:20px 24px;display:flex}.card-header h2{color:var(--text-primary);font-size:17px;font-weight:600}.card-body{padding:24px}.table-toolbar{border-bottom:1px solid var(--gray-100);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;padding:16px 24px;display:flex}.table-search{align-items:center;display:flex;position:relative}.table-search input{border:1px solid var(--gray-300);border-radius:var(--radius-md);width:300px;font-size:14px;font-family:var(--font-family);transition:all var(--transition-fast);outline:none;padding:10px 16px 10px 40px}.table-search input:focus{border-color:var(--primary-500);box-shadow:0 0 0 3px #3b82f626}.table-search svg{color:var(--gray-400);width:18px;height:18px;position:absolute;left:12px}.table-actions{align-items:center;gap:8px;display:flex}.table-container{overflow-x:auto}table{border-collapse:collapse;width:100%}table thead{background:var(--gray-50)}table thead th{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;text-align:left;white-space:nowrap;border-bottom:1px solid var(--gray-200);padding:12px 24px;font-size:12px;font-weight:600}table tbody tr{border-bottom:1px solid var(--gray-100);transition:background var(--transition-fast)}table tbody tr:hover{background:var(--primary-50)}table tbody tr:last-child{border-bottom:none}table tbody td{color:var(--text-primary);vertical-align:middle;padding:14px 24px;font-size:14px}.table-footer{border-top:1px solid var(--gray-100);color:var(--text-secondary);justify-content:space-between;align-items:center;padding:16px 24px;font-size:13px;display:flex}.table-user-cell{align-items:center;gap:12px;display:flex}.table-user-avatar{border-radius:var(--radius-full);background:linear-gradient(135deg, var(--primary-100), var(--primary-200));width:40px;height:40px;color:var(--primary-700);flex-shrink:0;justify-content:center;align-items:center;font-size:13px;font-weight:600;display:flex}.table-user-name{color:var(--text-primary);font-size:14px;font-weight:600}.table-user-email{color:var(--text-secondary);font-size:12px}.badge{border-radius:var(--radius-full);white-space:nowrap;align-items:center;gap:4px;padding:4px 12px;font-size:12px;font-weight:600;display:inline-flex}.badge-admin{color:#fff;background:linear-gradient(135deg,#1e40af,#3b82f6)}.badge-approver{color:#fff;background:linear-gradient(135deg,#b45309,#f59e0b)}.badge-staff{color:#fff;background:linear-gradient(135deg,#0f766e,#14b8a6)}.badge-active{background:var(--success-100);color:var(--success-600)}.badge-active:before{content:"";border-radius:var(--radius-full);background:var(--success-500);width:6px;height:6px}.badge-inactive{background:var(--danger-100);color:var(--danger-600)}.badge-inactive:before{content:"";border-radius:var(--radius-full);background:var(--danger-500);width:6px;height:6px}.badge-pending{background:var(--warning-100);color:var(--warning-600)}.badge-success{background:var(--success-100);color:var(--success-600)}.badge-danger{background:var(--danger-100);color:var(--danger-600)}.badge-info{background:var(--info-100);color:var(--info-600)}.badge-warning{background:var(--warning-100);color:var(--warning-600)}.btn{border-radius:var(--radius-md);font-size:14px;font-weight:600;font-family:var(--font-family);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;border:1px solid #0000;align-items:center;gap:8px;padding:10px 20px;display:inline-flex}.btn:active{transform:scale(.97)}.btn-primary{background:linear-gradient(135deg, var(--primary-600), var(--primary-500));color:var(--text-white);box-shadow:0 2px 8px #2563eb4d}.btn-primary:hover{background:linear-gradient(135deg, var(--primary-700), var(--primary-600));box-shadow:0 4px 12px #2563eb66}.btn-success{background:linear-gradient(135deg, var(--success-600), var(--success-500));color:var(--text-white);box-shadow:0 2px 8px #16a34a4d}.btn-success:hover{box-shadow:0 4px 12px #16a34a66}.btn-danger{background:linear-gradient(135deg, var(--danger-600), var(--danger-500));color:var(--text-white);box-shadow:0 2px 8px #dc26264d}.btn-danger:hover{box-shadow:0 4px 12px #dc262666}.btn-outline{border:1px solid var(--gray-300);color:var(--text-primary);background:0 0}.btn-outline:hover{border-color:var(--primary-500);color:var(--primary-600);background:var(--primary-50)}.btn-ghost{color:var(--text-secondary);background:0 0;border:none;padding:8px}.btn-ghost:hover{background:var(--gray-100);color:var(--text-primary)}.btn-sm{padding:6px 12px;font-size:13px}.btn-icon{justify-content:center;align-items:center;width:36px;height:36px;padding:8px;display:flex}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:200;background:#00000080;justify-content:center;align-items:center;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.modal{background:var(--bg-card);border-radius:var(--radius-xl);width:100%;max-width:520px;max-height:90vh;box-shadow:var(--shadow-xl);animation:.3s slideUp;overflow-y:auto}.modal-header{border-bottom:1px solid var(--gray-200);justify-content:space-between;align-items:center;padding:20px 24px;display:flex}.modal-header h2{color:var(--text-primary);font-size:18px;font-weight:700}.modal-close{border-radius:var(--radius-full);cursor:pointer;width:32px;height:32px;color:var(--gray-500);transition:all var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;display:flex}.modal-close:hover{background:var(--gray-100);color:var(--text-primary)}.modal-body{padding:24px}.modal-footer{border-top:1px solid var(--gray-200);justify-content:flex-end;align-items:center;gap:12px;padding:16px 24px;display:flex}.form-group{margin-bottom:20px}.form-group label{color:var(--text-primary);margin-bottom:6px;font-size:14px;font-weight:600;display:block}.form-group label .required{color:var(--danger-500);margin-left:2px}.form-control{border:1px solid var(--gray-300);border-radius:var(--radius-md);width:100%;font-size:14px;font-family:var(--font-family);color:var(--text-primary);transition:all var(--transition-fast);background:var(--bg-card);outline:none;padding:10px 14px}.form-control:focus{border-color:var(--primary-500);box-shadow:0 0 0 3px #3b82f626}.form-control::placeholder{color:var(--gray-400)}select.form-control{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='%236b7280'%3E%3Cpath fill-rule='evenodd' d='M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z' clip-rule='evenodd'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;padding-right:40px}textarea.form-control{resize:vertical;min-height:80px}.form-radio-group{flex-direction:column;gap:10px;display:flex}.form-radio{border:2px solid var(--gray-200);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);align-items:flex-start;gap:10px;padding:12px 16px;display:flex}.form-radio:hover{border-color:var(--primary-300);background:var(--primary-50)}.form-radio.selected{border-color:var(--primary-500);background:var(--primary-50)}.form-radio input[type=radio]{width:18px;height:18px;accent-color:var(--primary-600);margin-top:3px}.form-radio-info h4{color:var(--text-primary);font-size:14px;font-weight:600}.form-radio-info p{color:var(--text-secondary);margin-top:2px;font-size:12px}.form-switch{justify-content:space-between;align-items:center;padding:12px 0;display:flex}.form-switch-label{color:var(--text-primary);font-size:14px}.form-switch-label p{color:var(--text-secondary);margin-top:2px;font-size:12px}.switch{background:var(--gray-300);border-radius:var(--radius-full);cursor:pointer;width:48px;height:26px;transition:all var(--transition-fast);border:none;flex-shrink:0;position:relative}.switch.active{background:var(--primary-600)}.switch:after{content:"";border-radius:var(--radius-full);width:20px;height:20px;transition:transform var(--transition-fast);box-shadow:var(--shadow-sm);background:#fff;position:absolute;top:3px;left:3px}.switch.active:after{transform:translate(22px)}.pagination{align-items:center;gap:4px;display:flex}.pagination-btn{border:1px solid var(--gray-300);border-radius:var(--radius-md);background:var(--bg-card);width:36px;height:36px;color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast);font-size:14px;font-weight:500;font-family:var(--font-family);justify-content:center;align-items:center;display:flex}.pagination-btn:hover{border-color:var(--primary-500);color:var(--primary-600);background:var(--primary-50)}.pagination-btn.active{background:var(--primary-600);color:#fff;border-color:var(--primary-600)}.pagination-btn:disabled{opacity:.5;cursor:not-allowed}.filter-btn{border:1px solid var(--gray-300);border-radius:var(--radius-md);background:var(--bg-card);color:var(--text-secondary);cursor:pointer;font-size:14px;font-weight:500;font-family:var(--font-family);transition:all var(--transition-fast);align-items:center;gap:6px;padding:10px 16px;display:inline-flex}.filter-btn:hover{border-color:var(--primary-500);color:var(--primary-600)}.dashboard-grid{grid-template-columns:repeat(2,1fr);gap:20px;margin-top:24px;display:grid}.chart-placeholder{flex-direction:column;gap:12px;height:320px;padding-right:8px;display:flex;overflow-y:auto}.chart-bar-container{align-items:center;gap:12px;display:flex}.chart-bar-label{width:50px;color:var(--text-secondary);text-align:right;flex-shrink:0;font-size:12px}.chart-bar-track{background:var(--gray-100);border-radius:var(--radius-sm);flex:1;height:28px;position:relative;overflow:hidden}.chart-bar-fill{border-radius:var(--radius-sm);color:#fff;align-items:center;height:100%;padding:0 8px;font-size:11px;font-weight:600;transition:width .8s;display:flex}.chart-bar-value{color:var(--text-secondary);text-align:right;flex-shrink:0;width:60px;font-size:12px}.pie-chart-container{align-items:center;gap:24px;height:320px;padding:12px;display:flex;overflow-y:auto}.pie-chart{border-radius:var(--radius-full);flex-shrink:0;width:160px;height:160px;position:relative}.pie-legend{flex-direction:column;flex:1;gap:10px;display:flex}.pie-legend-item{align-items:center;gap:8px;font-size:13px;display:flex}.pie-legend-color{border-radius:3px;flex-shrink:0;width:12px;height:12px}.pie-legend-text{color:var(--text-primary);flex:1}.pie-legend-value{color:var(--text-primary);font-weight:600}.activity-list{flex-direction:column;display:flex}.activity-item{border-bottom:1px solid var(--gray-100);transition:background var(--transition-fast);gap:16px;padding:16px 24px;display:flex}.activity-item:hover{background:var(--gray-50)}.activity-item:last-child{border-bottom:none}.activity-icon{border-radius:var(--radius-full);flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;font-size:16px;display:flex}.activity-icon.create{background:var(--success-100);color:var(--success-600)}.activity-icon.edit{background:var(--primary-100);color:var(--primary-600)}.activity-icon.delete{background:var(--danger-100);color:var(--danger-600)}.activity-icon.login{background:var(--info-100);color:var(--info-600)}.activity-icon.approve{background:var(--warning-100);color:var(--warning-600)}.activity-icon.withdraw{color:#7c3aed;background:#f3e8ff}.activity-info{flex:1}.activity-info h4{color:var(--text-primary);margin-bottom:2px;font-size:14px;font-weight:600}.activity-info p{color:var(--text-secondary);font-size:13px}.activity-meta{text-align:right;flex-shrink:0}.activity-meta .time{color:var(--text-muted);font-size:12px}.activity-meta .module{color:var(--text-secondary);background:var(--gray-100);border-radius:var(--radius-full);margin-top:4px;padding:2px 8px;font-size:11px;display:inline-block}.category-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;display:grid}.category-card{background:var(--bg-card);border:1px solid var(--gray-200);border-radius:var(--radius-lg);transition:all var(--transition-fast);cursor:default;gap:16px;padding:20px;display:flex}.category-card:hover{box-shadow:var(--shadow-md);border-color:var(--primary-300);transform:translateY(-2px)}.category-icon{border-radius:var(--radius-lg);background:var(--primary-50);flex-shrink:0;justify-content:center;align-items:center;width:52px;height:52px;font-size:24px;display:flex}.category-info{flex:1;min-width:0}.category-info h3{color:var(--text-primary);margin-bottom:4px;font-size:16px;font-weight:600}.category-info p{color:var(--text-secondary);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:8px;font-size:12px;display:-webkit-box;overflow:hidden}.category-meta{justify-content:space-between;align-items:center;display:flex}.category-count{color:var(--primary-600);font-size:13px;font-weight:600}.category-actions{gap:4px;display:flex}.report-summary-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:24px;display:grid}.report-card{background:var(--bg-card);border-radius:var(--radius-lg);text-align:center;border:1px solid var(--gray-100);box-shadow:var(--shadow-sm);padding:20px}.report-card h4{color:var(--text-secondary);margin-bottom:8px;font-size:13px}.report-card .value{color:var(--text-primary);font-size:28px;font-weight:700}.report-card .unit{color:var(--text-secondary);margin-left:4px;font-size:12px}.report-card .trend{justify-content:center;align-items:center;gap:4px;margin-top:4px;font-size:12px;display:flex}.report-card .trend.up{color:var(--success-600)}.report-card .trend.down{color:var(--danger-600)}.empty-state{text-align:center;flex-direction:column;justify-content:center;align-items:center;padding:60px 24px;display:flex}.empty-state-icon{opacity:.5;margin-bottom:16px;font-size:48px}.empty-state h3{color:var(--text-primary);margin-bottom:8px;font-size:18px;font-weight:600}.empty-state p{color:var(--text-secondary);font-size:14px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.animate-fade-in{animation:.3s fadeIn}.animate-slide-up{animation:.3s slideUp}.confirm-dialog{text-align:center;padding:12px 0}.confirm-dialog-icon{border-radius:var(--radius-full);background:var(--danger-100);width:64px;height:64px;color:var(--danger-600);justify-content:center;align-items:center;margin:0 auto 16px;font-size:28px;display:flex}.confirm-dialog h3{color:var(--text-primary);margin-bottom:8px;font-size:18px;font-weight:600}.confirm-dialog p{color:var(--text-secondary);font-size:14px}.stock-in-stock{color:var(--success-600)}.stock-low{color:var(--warning-600)}.stock-out{color:var(--danger-600)}@media (max-width:1024px){.dashboard-grid{grid-template-columns:1fr}.stats-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.sidebar{transform:translate(-100%)}.main-content{margin-left:0}.header{left:0}.page-content{padding:16px}.stats-grid{grid-template-columns:1fr}.table-toolbar{flex-direction:column;align-items:stretch}.table-search input{width:100%}.page-header-row{flex-direction:column}}.sidebar-footer .sidebar-nav-item{color:#ffffff80;padding:10px 16px;font-size:13px}.sidebar-footer .sidebar-nav-item:hover{color:#fffc}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--gray-400)}.toast{border-radius:var(--radius-md);box-shadow:var(--shadow-lg);z-index:300;align-items:center;gap:10px;padding:14px 20px;font-size:14px;font-weight:500;animation:.3s slideUp;display:flex;position:fixed;bottom:24px;right:24px}.toast-success{background:var(--success-600);color:#fff}.toast-error{background:var(--danger-600);color:#fff}.toast-info{background:var(--primary-600);color:#fff}@media print{.sidebar,.header,.no-print,button,.toast{display:none!important}@page{size:landscape;margin:1cm}*{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}.app-layout{background-color:#fff!important;margin:0!important;padding:0!important;display:block!important}.main-content{background-color:#fff!important;width:100%!important;min-height:auto!important;margin:0!important;padding:0!important}.page-content{background-color:#fff!important;margin:0!important;padding:0!important}body,html,.app-layout,.main-content,.card,.table-container,.report-card{box-shadow:none!important;color:#000!important;background:0 0!important}.card{border:none!important;padding:0!important}.print-header{display:block!important}body{font-size:12pt;font-family:Sarabun,sans-serif!important}h1,h2,h3,h4,h5,h6{page-break-after:avoid;color:#000!important}table{border-collapse:collapse!important;border:1px solid #000!important;width:100%!important}th,td{color:#000!important;border:1px solid #000!important;padding:6px 8px!important;font-size:11pt!important}th{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;background-color:#f3f4f6!important;font-weight:700!important}tr{page-break-inside:avoid!important}.badge{border:1px solid #000;color:#000!important;background:0 0!important;padding:2px 6px!important}.badge:before{display:none!important}.report-summary-grid{page-break-inside:avoid!important;flex-wrap:wrap!important;gap:16px!important;margin-bottom:24px!important;display:flex!important}.report-card{border:1px solid #000!important;border-radius:0!important;flex:calc(25% - 16px)!important;padding:12px!important}.dashboard-grid{page-break-before:always!important}.chart-placeholder,.pie-chart-container{height:auto!important;max-height:none!important;overflow:visible!important}}