:root{color-scheme:light;--safe-top: env(safe-area-inset-top, 0px);--safe-right: env(safe-area-inset-right, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px)}*{-webkit-tap-highlight-color:transparent}html,body,#root{margin:0;min-height:100%}body{overflow-x:hidden;overscroll-behavior-y:contain;background:#f7f6f2}button,input,select,textarea{font:inherit}button{touch-action:manipulation}.app-shell{display:flex;min-height:100vh}.app-sidebar{width:232px;flex-shrink:0}.app-nav{display:block}.app-main{flex:1;display:flex;flex-direction:column;min-width:0}.app-topbar{min-height:60px}.app-topbar-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.dashboard-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px}.dashboard-pies-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:16px}.dashboard-pies-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:16px}.dashboard-quick-actions{display:flex;gap:8px;flex-wrap:wrap}.dashboard-chart-body{display:grid;grid-template-columns:220px 1fr;gap:18px;align-items:center}.donhang-layout{display:grid;grid-template-columns:.82fr 1.18fr;gap:16px}.section-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.section-card-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}.form-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}.modal-shell{width:min(1020px,100%);max-height:calc(100vh - 24px);overflow:auto;-webkit-overflow-scrolling:touch}.modal-shell-sm{width:min(560px,100%);max-height:calc(100vh - 24px);overflow:auto;-webkit-overflow-scrolling:touch}.modal-header,.modal-footer{display:flex;align-items:center;justify-content:space-between;gap:12px}.modal-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap}.login-shell{width:min(360px,calc(100vw - 24px))}.login-page{padding:16px;box-sizing:border-box}.app-nav,.table-scroll,.modal-shell,.modal-shell-sm{scrollbar-width:thin}@media (max-width: 900px){.dashboard-chart-body,.donhang-layout{grid-template-columns:1fr}}@media (max-width: 768px){.app-shell{flex-direction:column}.app-sidebar{width:100%;padding-top:var(--safe-top)}.app-nav{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px;-webkit-overflow-scrolling:touch;position:sticky;top:0;z-index:30;background:#1a1916;border-bottom:1px solid #333}.app-nav>div{white-space:nowrap;margin-bottom:0!important}.app-sidebar-brand,.app-sidebar-user{position:static}.app-topbar{padding:12px 14px!important;align-items:flex-start!important;flex-direction:column}.app-topbar-actions{width:100%;justify-content:flex-start}.dashboard-metrics,.dashboard-pies-3,.dashboard-pies-2{grid-template-columns:1fr}.dashboard-chart-body{grid-template-columns:1fr;justify-items:center}.section-card-head{align-items:flex-start;flex-direction:column}.section-card-right{width:100%;justify-content:flex-start}.form-grid-2,.form-grid-3{grid-template-columns:1fr}.modal-header,.modal-footer{align-items:flex-start;flex-direction:column}.modal-footer .modal-actions{width:100%}.modal-footer .modal-actions>*{flex:1}}@media (max-width: 560px){body{padding-bottom:var(--safe-bottom)}.app-main>div:last-child{padding:12px max(12px,var(--safe-right)) calc(12px + var(--safe-bottom)) max(12px,var(--safe-left))!important}.app-topbar-actions>*{width:100%}.app-topbar{padding-left:max(14px,var(--safe-left))!important;padding-right:max(14px,var(--safe-right))!important}.section-card-right>*{width:100%}.section-card-right input,.section-card-right select,.section-card-right button{width:100%!important;min-width:0!important}.dashboard-chart-body svg{width:min(220px,70vw);height:min(220px,70vw)}.section-card-head{padding:12px 14px!important}.modal-shell,.modal-shell-sm{width:100%;max-height:calc(100vh - 12px - var(--safe-top) - var(--safe-bottom));border-radius:14px}.login-shell{width:100%}.login-shell>div,.login-shell{max-width:100%}}@media (max-width: 430px){button,input,select,textarea{font-size:16px!important}button{min-height:44px}.app-nav{padding-left:max(10px,var(--safe-left));padding-right:max(10px,var(--safe-right));padding-top:8px}.app-nav>div{padding:10px 12px!important;border-radius:10px!important}.app-topbar{gap:10px!important}.app-topbar-actions .badge,.app-topbar-actions>*{width:100%}.dashboard-chart-body{gap:12px}.dashboard-chart-body svg{width:min(210px,64vw);height:min(210px,64vw)}.modal-header,.modal-footer{padding-left:14px!important;padding-right:14px!important}.table-scroll table th,.table-scroll table td{padding-left:10px!important;padding-right:10px!important}.login-page{padding:max(12px,var(--safe-top)) max(12px,var(--safe-right)) calc(12px + var(--safe-bottom)) max(12px,var(--safe-left))}}@media (max-width: 390px){.app-main>div:last-child{padding:10px max(10px,var(--safe-right)) calc(10px + var(--safe-bottom)) max(10px,var(--safe-left))!important}.section-card-head{gap:10px}.dashboard-chart-body svg{width:min(190px,60vw);height:min(190px,60vw)}.modal-shell,.modal-shell-sm{max-height:calc(100vh - 8px - var(--safe-top) - var(--safe-bottom))}}
