.sidebar{width: 260px;transition: transform 0.3s ease;}.auto-mobile-btn,.auto-mobile-dropdown{display: none;}@media (max-width: 768px){body{background-color: #0b0b0c;padding-top: env(safe-area-inset-top);padding-left: env(safe-area-inset-left);padding-right: env(safe-area-inset-right);padding-bottom: env(safe-area-inset-bottom);}.sidebar{position: fixed;top: 60px;left: 0;transform: translateX(-110%);width: 248px;height: calc(100vh - 60px);min-height: 0;border-radius: 0 18px 18px 0;z-index: 302;box-shadow: 18px 0 46px rgba(0,0,0,0.38);transition: transform 0.3s ease;overflow-y: auto;-webkit-overflow-scrolling: touch;}.sidebar.show{transform: translateX(0);}.sidebar-sub{display: none;}.sidebar-head{min-height: 46px;padding: 7px 8px;}.sidebar-head-icon{width: 30px;height: 30px;flex-basis: 30px;}.sidebar-title{font-size: 13px;}.container{height: 100dvh;overflow-y: auto;}#content{height: calc(100vh - 60px - env(safe-area-inset-top));overflow-y: auto;-webkit-overflow-scrolling: touch;padding: 0;}body .dashboard-main{padding: 64px 12px 28px;}body .dashboard-main .top{flex-direction: column;align-items: stretch;gap: 12px;margin-bottom: 18px;}body .dashboard-main .top-right{flex-wrap: wrap;gap: 8px;}body .dashboard-main .top-right .period{flex: 1 1 120px;min-width: 0;}body .dashboard-main .top-right .user{flex: 1 1 100%;order: 3;padding-left: 0;min-width: 0;}body .dashboard-main .dashboard-identity h1{font-size: 24px;}#content-area{margin-left: 0;border-radius: 0;}.container{padding: 0;margin: 0;}.grid-container{padding: 15px 0 0 0;}.sidebar-mobile-toggle{position: fixed;top: 10px;left: 12px;width: 40px;height: 40px;display: flex;align-items: center;justify-content: center;z-index: 304;border: 1px solid rgba(255,255,255,0.08);border-radius: 12px;color: #d9e9fc;font-size: 15px;cursor: pointer;background: rgba(18,22,30,0.92);box-shadow: 0 8px 24px rgba(0,0,0,0.24);backdrop-filter: blur(12px);}#content-header{position: sticky;top: 0;z-index: 303;background: var(--bg-1);padding: 10px 12px 10px 64px;min-height: 60px;gap: 10px;}#content-header.has-auto-mobile-actions{padding-right: 70px;}#content-header.has-auto-mobile-actions > .header-actions{display: none;}.auto-mobile-btn{display: flex;}.auto-mobile-dropdown:not(.hide){display: flex;max-height: calc(100vh - 90px);overflow-y: auto;}#content-header .header-left,#content-header .page-heading{min-width: 0;flex: 1 1 auto;}#content-header .header-left .title,#content-header .page-heading .title{font-size: 16px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}#content-header .header-left .sub{font-size: 11px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}#content-header .page-heading-text{padding-left: 0;border-left: 0;}#content-header .page-heading-icon{display: none;}.product-info{display: flex;justify-content: space-between;text-align: left;}.modal{position: fixed;top: 0;left: 0;width: 100vw;height: 100vh;display: none;align-items: flex-start;justify-content: center;z-index: 302;background: rgba(0,0,0,0.6);}.modal .modal-content{width: 100%;max-width: 600px;min-height: 100vh;height: auto;border-radius: 0;margin: 0;background: var(--bg-1);display: flex;flex-direction: column;overflow-y: auto;padding-bottom: env(safe-area-inset-bottom);border: 1px solid #333;box-shadow: 0 12px 28px rgba(0,0,0,0.45);}#modalProduk,#modalCustomer{z-index: 305;}#modalKategori{z-index: 306;}.form-header{display: flex;align-items: center;justify-content: space-between;padding: 10px;z-index: 2;position: sticky;top: 0;box-shadow: 0 4px 8px rgba(0,0,0,0.4);background: #222;border-bottom: 1px solid #333;}.form-header .btn{padding: 16px 12px;border-radius: 6px;font-size: 16px;}.tab-content-wrapper{flex: 1;overflow-y: auto;padding: 10px 15px;background: #1f1f1f;}.modal-body{background: #1f1f1f;}*{-webkit-tap-highlight-color: transparent;outline: none !important;}button,input,textarea{outline: none !important;box-shadow: none !important;}button:active{transform: scale(0.97);opacity: 0.8;}.mobile-action-btn{position: fixed;top: 10px;right: 15px;z-index: 300;background: rgba(0,0,0,0.5);color: #fff;border-radius: 8px;width: 50px;height: 50px;font-size: 22px;display: flex;justify-content: center;align-items: center;}.mobile-action-dropdown{position: fixed;top: 70px;right: 10px;background: black;border-radius: 12px;padding: 8px 0;display: flex;flex-direction: column;gap: 5px;box-shadow: 0 4px 15px gray;z-index: 2000;}.mobile-action-dropdown.hide{display: none;}.dropdown-item{background: transparent;border: none;color: #fff;text-align: left;padding: 10px 20px;font-size: 18px;cursor: pointer;transition: all 0.2s ease;width: 200px;height: 50px;}.dropdown-item:hover{background: rgba(255,255,255,0.1);color: #5aa7ff;}.content-filter{z-index: 301;width: 100%;max-height: none;flex-direction: column;padding: 10px;}.filter-group{width: 100%;flex-direction: row;justify-content: space-between;}.filter-group select,.filter-group button{flex: 1;}.content-filter.show{position: fixed;top: 60px;left: 0;right: 0;width: 100%;background-color: #1a1a1a;padding: 15px;max-height: calc(100vh - 60px);overflow-y: auto;box-shadow: 0 2px 10px rgba(0,0,0,0.5);}.content-filter .filter-group{display: flex;flex-direction: column;gap: 10px;}.content-filter label,.content-filter select,.content-filter button{width: 100%;}.content-filter button#applyFilter{width: 100%;padding: 12px 0;font-size: 16px;border-radius: 8px;margin-top: 10px;}#modalProduk .form-footer{display: none;}#modalCustomer .form-footer{display: none;}}@media (max-width:768px){.sidebar-mobile-toggle,.mobile-action-btn{top:10px;width:42px;height:42px;border-radius:14px;font-size:16px;color:#e6f0ff;background:linear-gradient(145deg,rgba(40,48,64,.92),rgba(16,20,28,.92));border:1px solid rgba(255,255,255,.1);box-shadow:0 6px 18px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(14px);transition:transform .15s ease,border-color .2s ease,color .2s ease;}.sidebar-mobile-toggle{left:12px}.mobile-action-btn{right:12px}.sidebar-mobile-toggle:active,.mobile-action-btn:active{transform:scale(.93);border-color:rgba(90,167,255,.5);color:#8fc2ff}#content-header.has-auto-mobile-actions{padding-right:66px}#content-header{padding-left:64px;min-height:62px}.mobile-action-dropdown{top:62px;right:12px;min-width:210px;padding:6px;gap:2px;border-radius:16px;background:rgba(16,20,28,.96);border:1px solid rgba(255,255,255,.08);box-shadow:0 16px 40px rgba(0,0,0,.55);backdrop-filter:blur(16px);}.mobile-action-dropdown .dropdown-item{width:100%;height:auto;min-height:44px;display:flex;align-items:center;gap:12px;padding:10px 14px;font-size:14px;border-radius:10px;}.mobile-action-dropdown .dropdown-item i,.mobile-action-dropdown .dropdown-item svg{width:18px;text-align:center;opacity:.85}.mobile-action-dropdown .dropdown-item:active{background:rgba(90,167,255,.16)}#content-area > :not(#content-header):not(.modal):first-of-type{margin-top:0}#content-area .table-container,#content-area .grid,#content-area .grid-container{padding-left:12px;padding-right:12px;box-sizing:border-box}#content-area .grid-container{padding-top:14px}}@media (max-width:768px){.list-mode .product-card{height:auto;min-height:85px;padding:12px;gap:10px}.list-mode .product-info{min-width:0;gap:2px}.list-mode .product-info h3{line-height:1.3;overflow-wrap:anywhere}.list-mode .product-info .rating-stars{margin-top:2px;line-height:1}.theme-light .sidebar-mobile-toggle,.theme-light .mobile-action-btn{color:#334155;background:linear-gradient(145deg,#ffffff,#eef2f7) !important;border:1px solid rgba(15,23,42,.1);box-shadow:0 6px 16px rgba(15,23,42,.12),inset 0 1px 0 #fff;}.theme-pink .sidebar-mobile-toggle,.theme-pink .mobile-action-btn{color:#b83280;background:linear-gradient(145deg,#fff,#ffe3f0) !important;border:1px solid rgba(236,96,159,.28);box-shadow:0 6px 16px rgba(236,96,159,.22),inset 0 1px 0 #fff;}.theme-pink .sidebar-mobile-toggle:active,.theme-pink .mobile-action-btn:active{color:#9d174d;border-color:rgba(236,96,159,.6)}.theme-light .mobile-action-dropdown{background:rgba(255,255,255,.97);border-color:rgba(15,23,42,.08);box-shadow:0 16px 36px rgba(15,23,42,.2)}.theme-light .mobile-action-dropdown .dropdown-item{color:#1e293b}.theme-pink .mobile-action-dropdown{background:rgba(255,248,252,.98);border-color:rgba(236,96,159,.22);box-shadow:0 16px 36px rgba(236,96,159,.28)}.theme-pink .mobile-action-dropdown .dropdown-item{color:#6b2150}.theme-pink .mobile-action-dropdown .dropdown-item:active,.theme-pink .mobile-action-dropdown .dropdown-item:hover{background:rgba(236,96,159,.14);color:#be185d}}@media (max-width:768px){#btnLokasiClassic{display:none !important}}