:root{--navbar-height:65px;--gray-900:#171717;--secondary:#222;--gray-500:#737373;--orange-light:#fff4f0;--primary:#fa8112;--primary-light:#ffae65;--blue-primary:#3b82f6;--blue-light:#eff6ff;--green-primary:#22c55e;--green-light:#dcfce7;--gray-300:#d4d4d4;--gray-400:#a3a3a3;--gray-200:#e5e5e5;--gray-600:#525252;--red-primary:#ef4444}html,body{color:var(--secondary);margin:0;padding:0}html.admin-page,html.admin-page body{height:100%;overflow:hidden}.navbar{z-index:10;height:var(--navbar-height);position:sticky;top:0}.navbar .navbar-container{box-sizing:border-box;background:linear-gradient(90deg,#fa8112,#ffae65);align-items:center;height:100%;padding-left:1rem;padding-right:1rem;display:flex}.navbar .navbar-container .navbar-brand{align-items:center;display:flex}.navbar .navbar-container .navbar-brand .menu-icon svg{width:28px;height:28px}.navbar .navbar-container .navbar-brand .navbar-logo-container{align-items:center;display:flex}.navbar .navbar-container .navbar-brand .navbar-logo-container .navbar-logo{justify-content:center;align-items:center;margin-left:20px;margin-right:10px;display:flex}.navbar .navbar-container .navbar-brand .navbar-logo-container .navbar-logo img{object-fit:contain;width:32px;height:auto}.navbar .navbar-container .navbar-brand .navbar-logo-container .navbar-logo-name{color:#fff;font-size:18px;font-weight:500}.navbar .navbar-container .navbar-notify-profile{margin-left:auto;display:flex}.navbar .navbar-container .navbar-notify-profile .profile-wrapper{margin-left:10px;position:relative}.navbar .navbar-container .navbar-notify-profile .profile-wrapper .icon-profile{cursor:pointer;background:#fff;border-radius:50%;justify-content:center;align-items:center;padding:10px;transition:transform .2s,box-shadow .2s;display:flex}.navbar .navbar-container .navbar-notify-profile .profile-wrapper .icon-profile svg{width:24px;height:24px}.navbar .navbar-container .navbar-notify-profile .profile-wrapper .icon-profile:hover{transform:scale(1.05);box-shadow:0 2px 8px #0003}.navbar .navbar-container .navbar-notify-profile .profile-wrapper .profile-box{-webkit-backdrop-filter:blur(20px);opacity:0;pointer-events:none;z-index:100;background:#ffffffa6;border:1px solid #fff6;border-radius:16px;width:280px;margin-top:1rem;padding:20px;transition:opacity .3s,transform .3s;position:absolute;top:calc(100% + 12px);right:0;transform:translate(20px);box-shadow:0 8px 32px #00000026}.navbar .navbar-container .navbar-notify-profile .profile-wrapper .profile-box.open{opacity:1;pointer-events:auto;transform:translate(0)}.navbar .navbar-container .navbar-notify-profile .profile-wrapper .profile-box .profile-box-user{align-items:center;gap:12px;display:flex}.navbar .navbar-container .navbar-notify-profile .profile-wrapper .profile-box .profile-box-avatar{color:#fff;background:linear-gradient(135deg,#fa8112,#ffae65);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;font-size:1.2rem;font-weight:700;display:flex}.navbar .navbar-container .navbar-notify-profile .profile-wrapper .profile-box .profile-box-info{flex-direction:column;min-width:0;display:flex}.navbar .navbar-container .navbar-notify-profile .profile-wrapper .profile-box .profile-box-name{color:#222;white-space:nowrap;text-overflow:ellipsis;font-size:.95rem;font-weight:600;overflow:hidden}.navbar .navbar-container .navbar-notify-profile .profile-wrapper .profile-box .profile-box-email{color:#666;white-space:nowrap;text-overflow:ellipsis;font-size:.8rem;overflow:hidden}.navbar .navbar-container .navbar-notify-profile .profile-wrapper .profile-box .profile-box-divider{background:#0000001a;height:1px;margin:16px 0}.navbar .navbar-container .navbar-notify-profile .profile-wrapper .profile-box .profile-box-signout{color:#ef4444;cursor:pointer;background:#ef444414;border:none;border-radius:10px;align-items:center;gap:10px;width:100%;padding:10px 12px;font-size:.9rem;font-weight:600;transition:all .2s;display:flex}.navbar .navbar-container .navbar-notify-profile .profile-wrapper .profile-box .profile-box-signout:hover{background:#ef444426;transform:translate(2px)}.navbar .navbar-container .navbar-notify-profile .profile-wrapper .profile-box .profile-box-signout svg{flex-shrink:0;width:18px;height:18px}.icon-box{color:#fff;background:#ffffff40;border-radius:10px;justify-content:center;align-items:center;width:32px;height:32px;padding:5px;display:flex}.header-page{align-items:center;margin-bottom:30px;display:flex}.page-container{padding:30px 40px 100px}.content{height:calc(100vh - var(--navbar-height));display:flex}.content .sidebar{top:var(--navbar-height);z-index:1;background:var(--gray-900);height:calc(100vh - var(--navbar-height));width:250px;position:fixed;left:0}.content .sidebar .header-section{color:var(--gray-300);font-size:16px;font-weight:400}.content .sidebar ul{margin:25px 20px 0;padding:0}.content .sidebar ul a{text-decoration:none}.content .sidebar ul a li{cursor:pointer;border-radius:10px;justify-content:left;align-items:center;gap:10px;height:55px;margin-top:15px;margin-bottom:15px;padding-left:1rem;text-decoration:none;list-style:none;display:flex}.content .sidebar ul a li .side-bar-menu{color:var(--gray-300);font-size:16px;font-weight:500}.content .sidebar ul a li.active{background:var(--primary)}.content .sidebar ul a li.active svg{color:#fff}.content .sidebar ul a li.active .side-bar-menu{color:#fff;font-size:16px;font-weight:500}.content .sidebar ul a li svg{width:32px;height:32px;color:var(--gray-300)}.content .sidebar ul a li a{color:#fff;text-decoration:none}.content .sidebar-overlay{display:none}.content .content-page{width:100%;height:100%;margin-left:250px;padding-bottom:2rem;padding-left:16px;overflow-y:auto}@media (min-width:1199px){.hamburger-menu-icon{display:none}}@media (max-width:1200px){.content .sidebar{z-index:20;transition:transform .3s;transform:translate(-100%)}.content .sidebar.open{transform:translate(0)}.content .sidebar-overlay{top:var(--navbar-height);z-index:19;background:#0006;display:block;position:fixed;bottom:0;left:0;right:0}.content .content-page{margin-left:0}}.capsule-box{background-color:var(--gray-200);cursor:pointer;border:2px solid #0000;border-radius:9999px;align-items:center;gap:8px;padding:8px 16px;font-size:16px;font-weight:500;transition:all .2s;display:flex}.capsule-box .count-menu{background-color:var(--gray-300);border-radius:9999px;padding:2px 8px;font-size:14px;font-weight:500}.capsule-box:hover{background-color:var(--gray-300)}.capsule-box.active{background-color:var(--primary);color:#fff;border-color:var(--primary)}.capsule-box.active .count-menu{color:var(--primary);background-color:#fff}.capsule-box.add-category-box{border:2px dashed var(--gray-400);color:var(--gray-600);background-color:#fff}.capsule-box.add-category-box:hover{border-color:var(--primary);color:var(--primary);background-color:#f0f9ff}
html body{font-family:Kanit,sans-serif}html .page-module___8aEwW__kanit-thin{font-family:Kanit,sans-serif;font-style:normal;font-weight:100}html .page-module___8aEwW__kanit-extralight{font-family:Kanit,sans-serif;font-style:normal;font-weight:200}html .page-module___8aEwW__kanit-light{font-family:Kanit,sans-serif;font-style:normal;font-weight:300}html .page-module___8aEwW__kanit-regular{font-family:Kanit,sans-serif;font-style:normal;font-weight:400}html .page-module___8aEwW__kanit-medium{font-family:Kanit,sans-serif;font-style:normal;font-weight:500}html .page-module___8aEwW__kanit-semibold{font-family:Kanit,sans-serif;font-style:normal;font-weight:600}html .page-module___8aEwW__kanit-bold{font-family:Kanit,sans-serif;font-style:normal;font-weight:700}html .page-module___8aEwW__kanit-extrabold{font-family:Kanit,sans-serif;font-style:normal;font-weight:800}html .page-module___8aEwW__kanit-black{font-family:Kanit,sans-serif;font-style:normal;font-weight:900}html .page-module___8aEwW__kanit-thin-italic{font-family:Kanit,sans-serif;font-style:italic;font-weight:100}html .page-module___8aEwW__kanit-extralight-italic{font-family:Kanit,sans-serif;font-style:italic;font-weight:200}html .page-module___8aEwW__kanit-light-italic{font-family:Kanit,sans-serif;font-style:italic;font-weight:300}html .page-module___8aEwW__kanit-regular-italic{font-family:Kanit,sans-serif;font-style:italic;font-weight:400}html .page-module___8aEwW__kanit-medium-italic{font-family:Kanit,sans-serif;font-style:italic;font-weight:500}html .page-module___8aEwW__kanit-semibold-italic{font-family:Kanit,sans-serif;font-style:italic;font-weight:600}html .page-module___8aEwW__kanit-bold-italic{font-family:Kanit,sans-serif;font-style:italic;font-weight:700}html .page-module___8aEwW__kanit-extrabold-italic{font-family:Kanit,sans-serif;font-style:italic;font-weight:800}html .page-module___8aEwW__kanit-black-italic{font-family:Kanit,sans-serif;font-style:italic;font-weight:900}