@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Sarabun:wght@300;400;500;600;700&display=swap";:root{--font-display:"Inter", "Sarabun", sans-serif;--font-body:"Sarabun", "Inter", sans-serif;--brand-primary:#a50d2e;--brand-primary-hover:#840b25;--brand-primary-light:#fdecf0;--neutral-dark:#0f172a;--neutral-gray:#475569;--neutral-light:#f8fafc;--neutral-border:#e2e8f0;--success:#10b981;--success-light:#ecfdf5;--warning:#f59e0b;--warning-light:#fffbeb;--danger:#ef4444;--danger-light:#fef2f2;--info:#3b82f6;--info-light:#eff6ff;--sidebar-width:260px;--header-height:70px;--page-bg:#f1f5f9;--card-bg:#fff;--radius-sm:6px;--radius-md:12px;--radius-lg:20px;--shadow-sm:0 1px 3px #0000000d;--shadow-md:0 4px 20px -2px #0f172a14, 0 2px 8px -1px #0f172a0a;--shadow-lg:0 10px 30px -5px #0f172a1f, 0 4px 12px -2px #0f172a0f}*{box-sizing:border-box;margin:0;padding:0;transition:background-color .2s,border-color .2s}body{font-family:var(--font-body);background-color:var(--page-bg);color:var(--neutral-dark);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:15px;line-height:1.6}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);color:var(--neutral-dark);font-weight:600;line-height:1.25}.app-shell{min-height:100vh;display:flex}.sidebar{width:var(--sidebar-width);border-right:1px solid var(--neutral-border);z-index:90;background-color:#fff;flex-direction:column;transition:transform .3s cubic-bezier(.16,1,.3,1);display:flex;position:fixed;top:0;bottom:0;left:0}.sidebar-logo{height:var(--header-height);border-bottom:1px solid var(--neutral-border);align-items:center;padding:0 24px;display:flex}.sidebar-logo img{object-fit:contain;height:40px}.sidebar-menu{flex:1;padding:24px 16px;list-style:none}.sidebar-item{margin-bottom:8px}.sidebar-link{color:var(--neutral-gray);border-radius:var(--radius-md);align-items:center;gap:12px;padding:12px 16px;font-weight:500;text-decoration:none;transition:all .2s;display:flex}.sidebar-link:hover{background-color:var(--neutral-light);color:var(--neutral-dark)}.sidebar-link.active{background-color:var(--brand-primary-light);color:var(--brand-primary);font-weight:600}.sidebar-footer{border-top:1px solid var(--neutral-border);padding:16px}.profile-card{background-color:var(--neutral-light);border-radius:var(--radius-md);align-items:center;gap:12px;margin-bottom:12px;padding:12px;display:flex}.profile-avatar{background-color:var(--brand-primary-light);width:40px;height:40px;color:var(--brand-primary);border-radius:50%;justify-content:center;align-items:center;font-size:16px;font-weight:600;display:flex}.profile-info{flex:1;min-width:0}.profile-name{white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:600;overflow:hidden}.profile-role{color:var(--neutral-gray);text-transform:capitalize;font-size:12px}.btn-logout{border:1px solid var(--neutral-border);width:100%;color:var(--neutral-gray);border-radius:var(--radius-md);cursor:pointer;background-color:#0000;justify-content:center;align-items:center;gap:8px;padding:10px;font-weight:500;transition:all .2s;display:flex}.btn-logout:hover{background-color:var(--neutral-light);color:var(--neutral-dark);border-color:var(--neutral-gray)}.main-wrapper{margin-left:var(--sidebar-width);flex-direction:column;flex:1;min-width:0;transition:margin-left .3s cubic-bezier(.16,1,.3,1);display:flex}.app-header{height:var(--header-height);border-bottom:1px solid var(--neutral-border);z-index:40;background-color:#fff;justify-content:space-between;align-items:center;padding:0 32px;display:flex;position:sticky;top:0}.header-breadcrumbs{color:var(--neutral-gray);align-items:center;gap:8px;font-size:14px;display:flex}.breadcrumb-separator{color:var(--neutral-border)}.header-actions{align-items:center;gap:16px;display:flex}.header-search{position:relative}.header-search input{border:1px solid var(--neutral-border);border-radius:var(--radius-lg);font-family:var(--font-body);background-color:var(--neutral-light);outline:none;width:260px;padding:8px 16px 8px 36px;font-size:14px;transition:all .2s}.header-search input:focus{border-color:var(--brand-primary);background-color:#fff;box-shadow:0 0 0 3px #a50d2e26}.header-search svg{color:var(--neutral-gray);position:absolute;top:50%;left:12px;transform:translateY(-50%)}.btn-icon{border:1px solid var(--neutral-border);width:36px;height:36px;color:var(--neutral-gray);cursor:pointer;background-color:#fff;border-radius:50%;justify-content:center;align-items:center;transition:all .2s;display:flex}.btn-icon:hover{background-color:var(--neutral-light);color:var(--neutral-dark)}.lang-switch{background-color:var(--neutral-light);border:1px solid var(--neutral-border);border-radius:var(--radius-lg);padding:2px;display:flex}.lang-btn{border-radius:var(--radius-lg);cursor:pointer;color:var(--neutral-gray);background-color:#0000;border:none;padding:4px 10px;font-size:12px;font-weight:600}.lang-btn.active{color:var(--brand-primary);box-shadow:var(--shadow-sm);background-color:#fff}.page-container{width:100%;max-width:1400px;margin:0 auto;padding:32px}.page-header{margin-bottom:28px}.page-title{margin-bottom:4px;font-size:28px}.page-subtitle{color:var(--neutral-gray);font-size:15px}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin-bottom:28px;display:grid}.stat-card{border-radius:var(--radius-md);border:1px solid var(--neutral-border);box-shadow:var(--shadow-sm);background-color:#fff;align-items:center;gap:16px;padding:24px;transition:transform .2s,box-shadow .2s;display:flex}.stat-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.stat-icon{border-radius:var(--radius-md);justify-content:center;align-items:center;width:48px;height:48px;display:flex}.stat-icon.success{background-color:var(--success-light);color:var(--success)}.stat-icon.warning{background-color:var(--warning-light);color:var(--warning)}.stat-icon.info{background-color:var(--info-light);color:var(--info)}.stat-icon.danger{background-color:var(--danger-light);color:var(--danger)}.stat-info{flex:1}.stat-label{color:var(--neutral-gray);margin-bottom:4px;font-size:14px}.stat-value{font-size:32px;font-weight:700;line-height:1.1;font-family:var(--font-display)}.stat-subtext{margin-top:4px;font-size:12px;font-weight:500}.card-section{border-radius:var(--radius-md);border:1px solid var(--neutral-border);box-shadow:var(--shadow-sm);background-color:#fff;margin-bottom:24px;padding:28px}.card-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.card-title{font-size:18px}.btn{font-family:var(--font-body);border-radius:var(--radius-md);cursor:pointer;border:none;align-items:center;gap:8px;padding:10px 20px;font-size:14px;font-weight:600;transition:all .2s;display:inline-flex}.btn-primary{background-color:var(--brand-primary);color:#fff}.btn-primary:hover{background-color:var(--brand-primary-hover);box-shadow:0 4px 12px #a50d2e40}.btn-secondary{background-color:var(--neutral-light);border:1px solid var(--neutral-border);color:var(--neutral-dark)}.btn-secondary:hover{background-color:var(--neutral-border)}.btn-success{background-color:var(--success);color:#fff}.btn-success:hover{background-color:#0c8d66}.btn-danger{background-color:var(--danger);color:#fff}.btn-danger:hover{background-color:#bc1010}.badge{border-radius:var(--radius-sm);padding:4px 10px;font-size:12px;font-weight:600;display:inline-flex}.badge-success{background-color:var(--success-light);color:var(--success)}.badge-warning{background-color:var(--warning-light);color:var(--warning)}.badge-danger{background-color:var(--danger-light);color:var(--danger)}.badge-info{background-color:var(--info-light);color:var(--info)}.table-responsive{width:100%;overflow-x:auto}.custom-table{border-collapse:collapse;text-align:left;width:100%}.custom-table th{background-color:var(--neutral-light);border-bottom:1px solid var(--neutral-border);color:var(--neutral-gray);text-transform:uppercase;letter-spacing:.05em;padding:16px;font-size:13px;font-weight:600}.custom-table td{border-bottom:1px solid var(--neutral-border);vertical-align:middle;padding:16px}.custom-table tr:last-child td{border-bottom:none}.custom-table tr:hover td{background-color:var(--neutral-light)}.tabs{border-bottom:1px solid var(--neutral-border);gap:8px;margin-bottom:24px;display:flex}.tab-btn{font-family:var(--font-body);color:var(--neutral-gray);cursor:pointer;background:0 0;border:none;padding:12px 20px;font-size:14px;font-weight:600;position:relative}.tab-btn:hover{color:var(--neutral-dark)}.tab-btn.active{color:var(--brand-primary)}.tab-btn.active:after{content:"";background-color:var(--brand-primary);height:2px;position:absolute;bottom:-1px;left:0;right:0}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;background-color:#0f172a99;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.modal-content{border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);background-color:#fff;width:100%;max-width:640px;animation:.3s cubic-bezier(.16,1,.3,1) modalEnter;position:relative;overflow:hidden}@keyframes modalEnter{0%{opacity:0;transform:scale(.95)translateY(10px)}to{opacity:1;transform:scale(1)translateY(0)}}.modal-header{border-bottom:1px solid var(--neutral-border);justify-content:space-between;align-items:center;padding:24px;display:flex}.modal-title{font-size:20px}.modal-close{cursor:pointer;width:32px;height:32px;color:var(--neutral-gray);background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;display:flex}.modal-close:hover{background-color:var(--neutral-light);color:var(--neutral-dark)}.modal-body{padding:24px}.modal-footer{background-color:var(--neutral-light);border-top:1px solid var(--neutral-border);justify-content:flex-end;gap:12px;padding:24px;display:flex}.form-group{margin-bottom:20px}.form-label{margin-bottom:8px;font-size:14px;font-weight:600;display:block}.form-control{border:1px solid var(--neutral-border);border-radius:var(--radius-md);width:100%;font-family:var(--font-body);outline:none;padding:10px 14px;font-size:14px;transition:all .2s}.form-control:focus{border-color:var(--brand-primary);box-shadow:0 0 0 3px #a50d2e26}.form-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;display:grid}.checkbox-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin-bottom:20px;display:grid}.checkbox-card{border:1px solid var(--neutral-border);border-radius:var(--radius-md);cursor:pointer;align-items:center;gap:12px;padding:12px 16px;transition:all .2s;display:flex}.checkbox-card:hover{background-color:var(--neutral-light)}.checkbox-card.selected{border-color:var(--brand-primary);background-color:var(--brand-primary-light)}@media (width<=1023px){.sidebar{transform:translate(-100%)}.sidebar.open{transform:translate(0)}.main-wrapper{margin-left:0!important}.sidebar-overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:80;background-color:#0f172a66;position:fixed;inset:0}.landing-hero{flex-direction:column!important;padding:40px 24px!important}.landing-hero>div{flex:auto!important;width:100%!important}}@media (width<=767px){.page-container{padding:16px}.page-title{font-size:24px}.app-header{padding:0 16px}.header-search{display:none}.header-brand-text,.landing-nav{display:none!important}.landing-header-actions{gap:12px!important}.header-help-btn,.header-bell-btn{display:none!important}.header-breadcrumbs{font-size:12px}.form-grid{grid-template-columns:1fr}.stats-grid{grid-template-columns:1fr;gap:16px}.page-container>div[style*="display: grid"]{grid-template-columns:1fr!important;gap:16px!important}.tabs{flex-wrap:wrap;gap:4px}.tab-btn{padding:10px 12px;font-size:13px}footer div[style*="display: grid"]{grid-template-columns:1fr!important;gap:30px!important}}.dark{--neutral-dark:#f8fafc;--neutral-gray:#94a3b8;--neutral-light:#0f172a;--neutral-border:#1e293b;--page-bg:#020617;--card-bg:#0b0f19}.dark body{color:var(--neutral-dark);background-color:#020617}.dark h1,.dark h2,.dark h3,.dark h4,.dark h5,.dark h6{color:#fff}.dark .card-section,.dark .stat-card,.dark .sidebar,.dark .app-header{box-shadow:0 4px 20px -2px #0000004d;border-color:var(--neutral-border)!important;background-color:#0b0f19!important}.dark .sidebar-logo,.dark .sidebar-footer,.dark .app-header{border-color:var(--neutral-border)!important}.dark .profile-card{background-color:var(--neutral-light)!important}.dark .btn-secondary{color:#fff!important;background-color:#1e293b!important;border-color:#334155!important}.dark .btn-secondary:hover{background-color:#334155!important}.dark .btn-icon{border-color:var(--neutral-border)!important;color:var(--neutral-gray)!important;background-color:#0b0f19!important}.dark .btn-icon:hover{color:#fff!important;background-color:#1e293b!important}.dark .lang-switch{background-color:var(--neutral-light)!important;border-color:var(--neutral-border)!important}.dark .lang-btn{color:var(--neutral-gray)!important}.dark .lang-btn.active{color:var(--brand-primary)!important;background-color:#1e293b!important}.dark .form-control,.dark .header-search input{background-color:var(--neutral-light)!important;border-color:var(--neutral-border)!important;color:#fff!important}.dark .form-control:focus,.dark .header-search input:focus{border-color:var(--brand-primary)!important}.dark .custom-table th{background-color:var(--neutral-light)!important;border-color:var(--neutral-border)!important;color:var(--neutral-gray)!important}.dark .custom-table td{border-color:var(--neutral-border)!important}.dark .custom-table tr:hover td{background-color:#141b2d!important}.dark .modal-content{border:1px solid var(--neutral-border)!important;background-color:#0b0f19!important}.dark .modal-header{border-color:var(--neutral-border)!important}.dark .modal-footer{background-color:var(--neutral-light)!important;border-color:var(--neutral-border)!important}.dark .modal-close:hover{background-color:var(--neutral-light)!important;color:#fff!important}.dark .checkbox-card{border-color:var(--neutral-border)!important;background-color:#0b0f19!important}.dark .checkbox-card:hover{background-color:var(--neutral-light)!important}.dark .checkbox-card.selected{border-color:var(--brand-primary)!important;color:#fff!important;background-color:#a50d2e26!important}.dark .landing-header{border-color:var(--neutral-border)!important;background-color:#0b0f19!important}.dark .landing-header a{color:var(--neutral-gray)!important}.dark .landing-header a:hover{color:#fff!important}.dark footer{border-color:var(--brand-primary)!important;background-color:#030712!important}.dark section[id=news]{border-color:var(--neutral-border)!important;background-color:#020617!important}.dark .login-left-pane{color:#fff!important;background-color:#0b0f19!important}.dark .login-left-pane label{color:var(--neutral-gray)!important}.dark .login-left-pane input{color:#fff!important;background-color:#0f172a!important;border-color:#1e293b!important}