.header{position:fixed;z-index:1000;width:100%;display:flex;justify-content:space-between;align-items:center;padding:0 16px}.logo-wrapper{display:flex;align-items:center;flex:1;justify-content:center}.logo{width:120px;height:31px;margin:16px 0}.header-right{display:flex;align-items:center;gap:16px}.header-right .anticon{cursor:pointer}.header-notif-icon{font-size:20px;color:#fff;cursor:pointer}.hamburger-icon{display:none;cursor:pointer;padding:8px;border-radius:4px;transition:background .3s ease}.hamburger-icon:hover{background:#ffffff1a}.mobile-menu-drawer .ant-drawer-content-wrapper{animation:slideInFromLeft .3s ease-in-out}.mobile-menu-drawer .ant-drawer-mask{background:#00000080!important}@keyframes slideInFromLeft{0%{transform:translate(-100%)}to{transform:translate(0)}}.mobile-menu{width:100%;background:#001529!important;border:none}.mobile-menu .ant-menu{background:#001529!important}.mobile-menu .ant-menu-item,.mobile-menu .ant-menu-submenu-title{padding:14px 20px!important;font-size:16px!important;color:#fff!important;display:flex!important;align-items:center!important;border-radius:0!important;margin:0!important}.mobile-menu .ant-menu-item:hover,.mobile-menu .ant-menu-submenu-title:hover,.mobile-menu .ant-menu-item-selected{background:#1890ff!important;color:#fff!important}.mobile-menu .ant-menu-submenu .ant-menu-sub{background:#000c17!important}.mobile-menu .ant-menu-submenu .ant-menu-item{padding:12px 20px 12px 48px!important;font-size:14px!important}.mobile-menu .ant-menu-item .anticon,.mobile-menu .ant-menu-submenu-title .anticon{margin-right:10px;font-size:18px}.user-info-section{display:flex;align-items:center;gap:12px;border-left:1px solid rgba(255,255,255,.2);padding-left:16px}.user-details{display:flex;flex-direction:column;align-items:flex-end;margin-right:8px}.user-name{color:#fff;font-weight:500;font-size:14px;line-height:1.2}.user-role{color:#1890ff;font-size:12px;line-height:1.2}.logout-btn-custom{background-color:#1890ff!important;border-color:#1890ff!important;border-radius:20px!important;font-weight:600!important;box-shadow:0 2px 8px #1890ff59!important}@media (max-width: 992px){.hamburger-icon{display:flex!important;align-items:center;justify-content:center;flex:0 0 auto}.logo-wrapper{flex:1;justify-content:center}.header-right{flex:0 0 auto!important;width:auto!important;justify-content:flex-end!important;gap:16px;display:flex;flex-wrap:nowrap;align-items:center}.header-right .anticon,.header-notif-icon{font-size:18px;display:block!important}.header-right .ant-badge{display:inline-block!important}.logo{width:90px;height:23px}.header{padding:0 12px}.user-info-section{display:none!important}}@media (min-width: 993px){.hamburger-icon{display:none!important}.logo-wrapper{flex:1;justify-content:center}}.notif-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;cursor:pointer;transition:background .2s ease,transform .15s ease;position:relative}.notif-btn:hover{background:#ffffff21;transform:translateY(-1px)}.notif-btn:active{background:#ffffff38;transform:translateY(0)}.notification-dropdown .ant-dropdown-menu{max-height:72vh;overflow-y:auto;overflow-x:hidden;min-width:360px;max-width:min(440px,95vw);padding:6px;border-radius:12px!important;box-shadow:0 8px 32px #00000024,0 2px 8px #00000012!important}.notification-dropdown .ant-dropdown-menu-item{padding:3px!important;border-radius:8px!important}.notification-dropdown .ant-dropdown-menu-item:hover,.notification-dropdown .ant-dropdown-menu-item-active{background:transparent!important}.notification-dropdown .ant-dropdown-menu-item-disabled,.notification-dropdown .ant-dropdown-menu-item-disabled:hover{background:transparent!important;cursor:default!important}.notif-dropdown-header{display:flex;align-items:center;gap:8px;padding:8px 10px 10px;font-size:13px;font-weight:600;color:#1890ff;border-bottom:1px solid #f0f0f0;pointer-events:none;-webkit-user-select:none;user-select:none;margin-bottom:2px}.notif-dropdown-count{margin-left:auto;background:#e6f7ff;color:#1890ff;border-radius:10px;padding:0 8px;font-size:11px;font-weight:600;border:1px solid #91d5ff}.notif-empty-state{text-align:center;padding:28px 16px;color:#bfbfbf;pointer-events:none;-webkit-user-select:none;user-select:none}.notif-empty-icon{font-size:32px!important;margin-bottom:10px;opacity:.35;display:block!important}.notification-dropdown .ant-dropdown-menu::-webkit-scrollbar{width:4px}.notification-dropdown .ant-dropdown-menu::-webkit-scrollbar-track{background:transparent}.notification-dropdown .ant-dropdown-menu::-webkit-scrollbar-thumb{background:#d9d9d9;border-radius:2px}.notification-dropdown .ant-dropdown-menu::-webkit-scrollbar-thumb:hover{background:#bfbfbf}@media (max-width: 992px){.notif-btn{width:36px;height:36px;border-radius:8px}.notification-dropdown .ant-dropdown-menu{min-width:min(320px,94vw)!important;max-height:65vh}}.notification-card{position:relative;transition:box-shadow .2s ease,transform .2s ease}.notification-card.unviewed{background-color:#fff}.notification-card.viewed{background-color:#fafafa;opacity:.82}.notification-card:hover{transform:translateY(-1px);box-shadow:0 6px 16px #0000001f!important}.notification-card.unviewed:hover{box-shadow:0 6px 20px #00000024!important}.notification-highlighted{box-shadow:0 0 0 3px #1890ff!important;transform:scale(1.01);transition:all .2s ease}.notification-card .ant-ribbon-urgent{animation:pulse-urgent 2s infinite}@keyframes pulse-urgent{0%,to{opacity:1}50%{opacity:.7}}.notification-card .ant-card-inner .ant-card-body>div:hover{background-color:#f0f5ff;border-radius:4px;transition:background-color .2s ease}.notification-card .ant-btn-primary:hover,.notification-card .ant-btn-default:hover{transform:scale(1.05);transition:transform .2s ease}@media (max-width: 768px){.notification-card{margin-bottom:12px}.notification-card .ant-space-item,.notification-card .ant-btn{width:100%}}.notification-card .ant-avatar{transition:all .3s ease}.notification-card.unviewed .ant-avatar{box-shadow:0 0 0 3px #1890ff33}.notification-card .total-amount-box{animation:fade-in .5s ease}@keyframes fade-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.ant-ribbon-urgent{background:linear-gradient(135deg,#ff4d4f,#cf1322);font-weight:600}.ant-ribbon-high{background:linear-gradient(135deg,#faad14,#d48806);font-weight:600}.ant-ribbon-normal{background:linear-gradient(135deg,#1890ff,#096dd9)}.notification-card *{transition:all .2s ease}:root{--primary-color: #1890ff;--secondary-color: #40c4ff;--header-bg: #000000;--text-color: #262626;--background-color: #ffffff;--card-bg: #ffffff;--shadow: 0 4px 12px rgba(0, 0, 0, .15)}body{margin:0;font-family:Roboto,sans-serif;background-color:#fff;color:#262626;font-weight:400}.ant-card{border-radius:12px;box-shadow:var(--shadow);background:var(--card-bg)}.app-header{background:var(--header-bg)!important;padding:0 16px;height:64px;display:flex;justify-content:space-between;align-items:center;box-shadow:var(--shadow);position:relative;z-index:2000!important}.logo-wrapper{flex:0 0 auto;display:flex;align-items:center}.logo{height:40px;width:auto}.nav-menu{flex:1;background:transparent!important;border-bottom:none!important}.nav-menu .ant-menu-item{color:var(--text-color);font-weight:600}.nav-menu .ant-menu-item:hover,.nav-menu .ant-menu-item-selected{color:var(--secondary-color)!important;background:transparent!important}.header-actions{display:flex;align-items:center;gap:20px}.notification-badge{display:flex;align-items:center;cursor:pointer;transition:transform .3s ease}.notification-badge:hover{transform:scale(1.1)}.notification-badge .ant-badge-count{margin-right:8px;background:#ff4d4f;color:#fff;font-weight:700}.bell-icon{font-size:24px;color:var(--text-color)}.bell-icon.active{animation:bellShake .8s ease infinite}@keyframes bellShake{0%{transform:rotate(0)}10%{transform:rotate(10deg)}20%{transform:rotate(-10deg)}30%{transform:rotate(8deg)}40%{transform:rotate(-8deg)}50%{transform:rotate(5deg)}60%{transform:rotate(-5deg)}70%{transform:rotate(3deg)}80%{transform:rotate(-3deg)}90%{transform:rotate(1deg)}to{transform:rotate(0)}}.logout-button{background:#ff4d4f;border-color:#ff4d4f;color:#fff;font-weight:600;padding:6px 16px;height:36px;border-radius:6px;transition:transform .3s ease}.logout-button:hover{transform:scale(1.05)}.ant-btn{border-radius:6px;font-weight:600;transition:all .3s ease}.ant-btn-primary{background:var(--primary-color);border-color:var(--primary-color)}.ant-btn-primary:hover{background:var(--secondary-color);border-color:var(--secondary-color)}.ant-table-wrapper{overflow-x:auto}.ant-table-container{border:1px solid #e8e8e8;border-radius:8px}.ant-table{border-radius:8px;background:#fff}.ant-table-thead>tr>th{background:var(--primary-color);color:var(--text-color);font-weight:700;text-align:center}.ant-table-tbody>tr>td{color:#333;font-weight:500;text-align:center}.ant-table-tbody>tr:nth-child(odd){background:#fafafa}.ant-table-tbody>tr>td:nth-child(9){justify-content:center;align-items:center}.ant-table-tbody>tr>td.ant-table-cell.textNameLeft{text-align:left}.ant-collapse{border-radius:8px;overflow:hidden;background:#fff}.ant-collapse-header{color:#333!important;font-weight:600}.export-container{display:flex;gap:24px}.user-info-container{background:var(--background-color);padding:20px;border-radius:12px;box-shadow:var(--shadow);margin-bottom:24px;transition:transform .3s ease}.user-info-container:hover{transform:translateY(-5px)}.user-info p{margin:8px 0;font-size:16px}.user-info p span{font-weight:700;color:var(--primary-color)}.desktop-sidebar{display:block}.bottom-nav{position:fixed;bottom:0;width:100%;background:var(--header-bg);padding:10px 0;display:none;justify-content:center;box-shadow:0 -2px 8px #00000026;z-index:1001}.bottom-nav-items{display:flex;justify-content:space-around;align-items:center;width:100%;max-width:600px}.bottom-nav-item{color:#fff;font-size:24px;padding:8px 16px;cursor:pointer;transition:all .3s ease;border-radius:8px}.bottom-nav-item:hover{color:var(--secondary-color);background:#ffffff1a}.login-container{display:flex;justify-content:center;align-items:center;min-height:100vh;width:100vw;background:linear-gradient(135deg,#0d47a1,#40c4ff);margin:0;padding:0}.login-card{transition:transform .3s ease;width:90%;max-width:400px}.login-card:hover{transform:translateY(-5px)}.report-filters{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:16px}.report-summary{margin-bottom:16px}.notification-content{width:400px}.notification-table-wrapper{max-height:200px;overflow-y:auto}.notification-footer{display:flex;align-items:center;justify-content:space-between;margin-top:8px;padding:0 8px}.confirm-button{margin-right:auto}.total-amount{font-weight:700;text-align:right;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (max-width: 992px){.desktop-sidebar{display:none!important}.bottom-nav{display:flex!important}.main-content{margin-left:0!important}}@media (max-width: 768px){.app-header{padding:0 8px}.logo{height:32px}.nav-menu{display:none}.header-actions{gap:12px}.bell-icon{font-size:20px}.logout-button{padding:4px 12px;font-size:14px;height:32px}.export-container{flex-direction:column}.export-section,.pending-section{width:100%}.ant-btn{width:100%;height:40px;font-size:16px;margin-bottom:8px}.ant-table-wrapper{overflow-x:auto}.ant-table{min-width:600px}.report-filters{flex-direction:column}.report-filters .ant-picker,.report-filters .ant-select,.report-filters .ant-btn{width:100%}.ant-picker{width:100%!important}.ant-picker-panel-container{width:100%!important;max-width:300px!important}.ant-picker-date-panel{width:100%!important;min-width:250px!important}.ant-picker-content{width:100%!important}.ant-picker-cell{padding:2px!important}.ant-picker-header{font-size:12px!important}.ant-picker-body{padding:4px!important}.user-info-container{padding:16px}.bottom-nav{padding:8px 0}.bottom-nav-item{font-size:22px;padding:8px 12px}.notification-content{width:300px;max-width:100%}}@media (max-width: 320px){.notification-content{width:280px;max-width:100%}}@media (min-width: 769px){.export-container{flex-direction:row}.export-section,.pending-section{width:50%}.ant-btn{width:auto;height:36px;font-size:14px}.ant-table{min-width:auto}.report-filters{flex-direction:row}.report-filters .ant-picker-range,.report-filters .ant-select{width:200px}}@media (min-width: 993px){.bottom-nav{display:none!important}.desktop-sidebar{display:block!important}.main-content{margin-bottom:0!important}}.sidebar-expanding .ant-menu-submenu-popup{display:none!important}.desktop-sidebar .ant-menu-submenu .ant-menu-sub,.desktop-sidebar .ant-motion-collapse,.desktop-sidebar .ant-motion-collapse-legacy,.desktop-sidebar .ant-motion-collapse-appear,.desktop-sidebar .ant-motion-collapse-enter,.desktop-sidebar .ant-motion-collapse-leave{transition:none!important;animation:none!important}.ant-layout-sider .ant-layout-sider-children div::-webkit-scrollbar{width:4px}.ant-layout-sider .ant-layout-sider-children div::-webkit-scrollbar-track{background:transparent}.ant-layout-sider .ant-layout-sider-children div::-webkit-scrollbar-thumb{background:#fff3;border-radius:2px}.ant-layout-sider .ant-layout-sider-children div::-webkit-scrollbar-thumb:hover{background:#fff6}
