@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap";:root{--color-primary:#4a7c59;--color-primary-light:#6b9b7a;--color-primary-dark:#365c42;--color-primary-100:#e8f0eb;--color-primary-200:#c5d9cc;--color-secondary:#8b6f47;--color-secondary-light:#a68b63;--color-secondary-dark:#6b5235;--color-accent:#d4a853;--color-accent-light:#e5c77a;--color-accent-dark:#b8923f;--color-white:#fff;--color-cream:#fbf8f3;--color-gray-50:#f9fafb;--color-gray-100:#f3f4f6;--color-gray-200:#e5e7eb;--color-gray-300:#d1d5db;--color-gray-400:#9ca3af;--color-gray-500:#6b7280;--color-gray-600:#4b5563;--color-gray-700:#374151;--color-gray-800:#1f2937;--color-gray-900:#111827;--color-success:#22c55e;--color-success-light:#dcfce7;--color-success-dark:#15803d;--color-warning:#f59e0b;--color-error:#ef4444;--color-info:#3b82f6;--font-primary:"Inter",system-ui,-apple-system,sans-serif;--font-display:"Plus Jakarta Sans","Inter",system-ui,sans-serif;--spacing-xs:.2rem;--spacing-sm:.4rem;--spacing-md:.75rem;--spacing-lg:1.25rem;--spacing-xl:1.75rem;--spacing-2xl:2.5rem;--spacing-3xl:3.5rem;--radius-sm:.4rem;--radius-md:.75rem;--radius-lg:1rem;--radius-xl:1.25rem;--radius-2xl:1.75rem;--radius-full:9999px;--shadow-sm:0 4px 12px rgba(0,0,0,.04);--shadow-md:0 8px 24px rgba(0,0,0,.06);--shadow-lg:0 12px 32px rgba(0,0,0,.08);--shadow-xl:0 20px 48px rgba(0,0,0,.1);--shadow-2xl:0 30px 60px rgba(0,0,0,.12);--shadow-glow:0 0 40px rgba(74,124,89,.15);--transition-fast:.15s ease;--transition-normal:.25s ease;--transition-slow:.35s ease}.animate-spin,.spin,.spinner{animation:spin .8s linear infinite}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{font-size:12.6px;scroll-behavior:smooth}body{background-color:#f8fafc;color:var(--color-gray-800);font-family:var(--font-primary);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{color:var(--color-gray-900);font-family:var(--font-display);font-weight:600;line-height:1.3}h1{font-size:2.5rem}h2{font-size:2rem}h3{font-size:1.5rem}h4{font-size:1.25rem}h5{font-size:1rem}h6{font-size:.875rem}p{margin-bottom:var(--spacing-md)}a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-primary-dark)}button,input,select,textarea{font-family:inherit;font-size:inherit}button{background:none;border:none;cursor:pointer}.container{margin:0 auto;max-width:1280px;padding:0 var(--spacing-lg);width:100%}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-sm{gap:var(--spacing-sm)}.gap-md{gap:var(--spacing-md)}.gap-lg{gap:var(--spacing-lg)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.animate-fadeIn{animation:fadeIn .5s ease forwards}.animate-slideUp{animation:slideUp .5s ease forwards}.animate-slideDown{animation:slideDown .5s ease forwards}.animate-pulse{animation:pulse 2s ease infinite}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.skeleton{animation:shimmer 2s linear infinite;background:#f6f7f8;background:linear-gradient(90deg,#f6f7f8 8%,#edeef1 18%,#f6f7f8 33%);background-size:1000px 100%;border-radius:4px;display:inline-block}.animate-float{animation:float 3s ease-in-out infinite}*{-webkit-tap-highlight-color:transparent}:focus-visible{outline:none}:focus{outline:none}::-moz-selection{background-color:var(--color-primary);color:var(--color-white)}::selection{background-color:var(--color-primary);color:var(--color-white)}::-webkit-scrollbar{display:none}*{-ms-overflow-style:none;scrollbar-width:none}.no-scrollbar::-webkit-scrollbar{display:none}.no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}.page-enter-active,.page-leave-active{transition:all .3s ease}.page-enter-from,.page-leave-to{opacity:0;transform:translateY(10px)}.layout-enter-active,.layout-leave-active{transition:all .3s ease}.layout-enter-from,.layout-leave-to{opacity:0}.shining-effect{overflow:hidden!important;position:relative!important}.shining-effect:after{animation:shine-sweep 3s infinite;background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.3),transparent);content:"";height:100%;left:-100%;pointer-events:none;position:absolute;top:0;transform:skew(-20deg);width:50%;z-index:5}@keyframes shine-sweep{0%{left:-100%}20%{left:200%}to{left:200%}}.page-container{min-height:100%;padding:var(--spacing-md);width:100%}.content-wrapper{margin:0 auto;max-width:1280px;width:100%}.section-container{background:#f8fafc;border:1px solid var(--color-gray-200);border-radius:var(--radius-xl);box-shadow:none;padding:var(--spacing-lg);position:relative;z-index:1}.section-container--elevated{border:1px solid var(--color-gray-200);box-shadow:0 0 0 1px #0000000d}.section-container--glass{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background:#ffffffd9;border:1px solid rgba(0,0,0,.08);box-shadow:none}.form-stack{display:flex;flex-direction:column;gap:var(--spacing-md)}.form-grid{grid-template-columns:repeat(2,1fr)}.form-grid,.form-grid-3{display:grid;gap:var(--spacing-md)}.form-grid-3{grid-template-columns:repeat(3,1fr)}.mt-8{margin-top:8px}.mt-12{margin-top:12px}.mt-16{margin-top:16px}.mt-24{margin-top:24px}.mb-8{margin-bottom:8px}.mb-12{margin-bottom:12px}.mb-16{margin-bottom:16px}.mb-24{margin-bottom:24px}@media(max-width:768px){.mobile-hide{display:none!important}}@media(min-width:769px){.desktop-hide{display:none!important}}@media(max-width:1024px){.content-wrapper{max-width:100%}.form-grid-3{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.page-container{padding:var(--spacing-sm)}.section-container{border-radius:var(--radius-lg);padding:var(--spacing-md)}.form-grid,.form-grid-3{grid-template-columns:1fr}.mobile-hide-tablet{display:none!important}.desktop-hide{display:flex!important}}@media(max-width:480px){.section-container{border-radius:var(--radius-md);padding:var(--spacing-sm)}}.btn-primary-sm{align-items:center;background:var(--color-primary);border:none;border-radius:var(--radius-lg);box-shadow:0 4px 12px #4a7c5926;color:#fff;cursor:pointer;display:inline-flex;font-size:.75rem;font-weight:700;gap:8px;height:38px;justify-content:center;letter-spacing:.05em;min-width:140px;padding:0 16px;text-transform:uppercase;transition:all var(--transition-normal);white-space:nowrap}.btn-primary-sm:hover{background:var(--color-primary-dark);box-shadow:0 6px 16px #4a7c5940;transform:translateY(-2px)}.btn-outline-sm{align-items:center;background:var(--color-white);border:1.5px solid var(--color-gray-200);border-radius:var(--radius-lg);color:var(--color-gray-600);cursor:pointer;display:inline-flex;font-size:.75rem;font-weight:700;gap:8px;height:38px;justify-content:center;letter-spacing:.05em;min-width:140px;padding:0 16px;text-transform:uppercase;transition:all var(--transition-normal);white-space:nowrap}.btn-outline-sm:hover{background:var(--color-primary-100);border-color:var(--color-primary);color:var(--color-primary);transform:translateY(-1px)}.btn-icon-sm{align-items:center;background:var(--color-white);border:1.5px solid var(--color-gray-200);border-radius:var(--radius-lg);color:var(--color-gray-500);cursor:pointer;display:inline-flex;height:38px;justify-content:center;transition:all var(--transition-normal);width:38px}.btn-icon-sm:hover:not(:disabled){background:var(--color-primary-100);border-color:var(--color-primary);color:var(--color-primary);transform:translateY(-1px)}.btn-icon-sm:disabled{cursor:not-allowed;opacity:.5}.limit-pill,.limit-pill-footer{align-items:center;background:#fff;border:1px solid var(--color-gray-200);border-radius:6px;color:var(--color-gray-600);cursor:pointer;display:inline-flex;font-size:.8125rem;font-weight:700;gap:4px;height:32px;padding:0 10px;position:relative;transition:all var(--transition-fast);-webkit-user-select:none;-moz-user-select:none;user-select:none}.limit-pill-footer:hover,.limit-pill:hover{border-color:var(--color-primary);color:var(--color-primary);z-index:9500}.limit-chevron{font-size:.75rem;opacity:.7;transition:transform .2s ease}.limit-chevron.rotate{transform:rotate(180deg)}.limit-dropdown{background:#fff;background:#fff!important;border:1px solid var(--color-gray-200);border:1.5px solid var(--color-primary)!important;border-radius:8px;box-shadow:0 10px 25px #0000001f;box-shadow:0 15px 35px #00000040!important;display:block!important;left:0;min-width:80px;overflow:visible;padding:4px;pointer-events:auto;position:absolute;top:calc(100% + 6px);z-index:999999!important}.limit-dropdown--up{bottom:calc(100% + 6px);box-shadow:0 -10px 25px #0000001f;top:auto}.data-container__footer .limit-dropdown.limit-dropdown--up{left:auto!important;right:0!important}.limit-option{border-radius:6px;color:var(--color-gray-700);cursor:pointer;font-size:.8125rem;font-weight:600;padding:8px 12px;text-align:center;transition:all .15s}.limit-option:hover{background:var(--color-primary-100);color:var(--color-primary)}.limit-option.active{background:var(--color-primary);color:#fff}.table-responsive{flex:1;min-height:0;overflow:auto;width:100%;-webkit-overflow-scrolling:touch}.data-table{border-collapse:collapse;border-spacing:0;margin:0;min-width:100%;width:100%}.data-table thead{position:sticky;top:0;z-index:10}.data-table td,.data-table th{border-bottom:1px solid var(--color-gray-100);color:var(--color-gray-700);font-size:.8125rem;padding:.7rem 12px;vertical-align:middle}.data-table th{background-color:var(--color-gray-100);border-bottom:2px solid var(--color-gray-200);color:var(--color-gray-600);font-size:.7rem;font-weight:700;letter-spacing:.05em;padding:.75rem 12px;text-align:left;text-transform:uppercase;white-space:nowrap}.data-table tbody tr:hover{background:var(--color-gray-50)}.data-table td.text-center,.data-table th.text-center{text-align:center}.data-table td{vertical-align:middle}.empty-row{color:var(--color-gray-400);font-size:.875rem;padding:3rem 1rem!important;text-align:center}.pagination-left{align-items:center;display:flex;gap:var(--spacing-sm)}.pagination-controls{align-items:center;background:#fff;border:1px solid var(--color-gray-200);border-radius:8px;display:flex;gap:4px;padding:4px}.pagination-nav-btn{align-items:center;background:transparent;border:none;border-radius:6px;color:var(--color-gray-500);cursor:pointer;display:flex;height:28px;justify-content:center;transition:all .15s;width:28px}.pagination-nav-btn:hover:not(:disabled){background:var(--color-gray-100);color:var(--color-primary)}.pagination-nav-btn:disabled{cursor:not-allowed;opacity:.3}.pagination-jump{align-items:center;color:var(--color-gray-500);display:flex;font-size:.75rem;font-weight:600;gap:6px;padding:0 8px}.pagination-input{border:1px solid var(--color-gray-200);border-radius:4px;color:var(--color-primary);font-size:.75rem;font-weight:700;height:24px;outline:none;text-align:center;transition:all .15s;width:36px}.pagination-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 2px var(--color-primary-100)}.pagination-info{color:var(--color-gray-400);font-size:.7rem;font-weight:600}.badge{align-items:center;border:1.5px solid transparent;border-radius:var(--radius-full);display:inline-flex;font-size:.725rem;font-weight:800;justify-content:center;letter-spacing:.05em;padding:4px 12px;text-align:center;text-transform:uppercase;transition:all var(--transition-fast);white-space:nowrap}.badge--success{background:#dcfce7;border:1.5px solid #bbf7d0;color:#15803d}.badge--warning{background:#fef3c7;border:1.5px solid #fde68a;color:#b45309}.badge--danger{background:#fee2e2;border:1.5px solid #fecaca;color:#b91c1c}.badge--info{background:#dbeafe;border:1.5px solid #bfdbfe;color:#1d4ed8}.badge--neutral{background:var(--color-gray-100);border:1.5px solid var(--color-gray-200);color:var(--color-gray-600)}.badge--primary,.code-badge{background:var(--color-primary-100);border:1.5px solid var(--color-primary-200);color:var(--color-primary)}.code-badge{border-radius:var(--radius-full);display:inline-flex;font-family:Inter,sans-serif;font-size:.725rem;font-weight:800;letter-spacing:.05em;min-width:90px;padding:4px 14px;text-align:center;text-transform:uppercase;white-space:nowrap}.badge-full-block,.code-badge{align-items:center;justify-content:center}.badge-full-block{border:none!important;border-radius:0!important;display:flex;height:100%;margin:0!important;min-height:48px;width:100%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.spin{animation:spin 1s linear infinite}.fade-scale-enter-active,.fade-scale-leave-active{transition:all .2s ease}.fade-scale-enter-from,.fade-scale-leave-to{opacity:0;transform:translateY(-8px) scale(.95)}.toolbar-row{gap:var(--spacing-md);width:100%}.toolbar-group,.toolbar-row{align-items:center;display:flex}.toolbar-group{gap:8px}@media(max-width:768px){.toolbar-row{align-items:stretch;flex-direction:column;gap:8px}.toolbar-group{display:grid;gap:8px;grid-template-columns:1fr 1fr;width:100%}.toolbar-group:last-child{display:flex;grid-template-columns:none;justify-content:flex-end}.toolbar-group:only-child{grid-template-columns:1fr}.btn-outline-sm,.btn-primary-sm{border-radius:8px;font-size:.7rem;height:32px;justify-content:center;min-width:unset;padding:0 10px;width:100%}.btn-icon-sm{border-radius:6px;flex-shrink:0;height:30px!important;min-width:30px;width:30px!important}.btn-icon-sm :deep(svg),.btn-icon-sm svg{height:16px!important;width:16px!important}.limit-pill,.limit-pill-footer{border-radius:6px;flex-shrink:0;font-size:.75rem;height:28px;min-width:40px;padding:0 6px}.pagination-left{align-items:center;display:flex;flex-direction:row;flex-wrap:nowrap;gap:8px;justify-content:flex-start;width:100%}.pagination-controls{flex:1;justify-content:center}.pagination-info,.pagination-jump span{display:none}}.action-btn{align-items:center;background:transparent;border:1px solid var(--color-gray-200);border-radius:8px;color:var(--color-gray-500);cursor:pointer;display:inline-flex;height:32px;justify-content:center;transition:all var(--transition-fast);width:32px}.action-btn:hover{background:var(--color-primary-50);border-color:var(--color-primary);color:var(--color-primary)}.product-info{display:flex;flex-direction:column;gap:2px}.product-name{color:var(--color-gray-800);font-weight:600}.product-konversi{color:var(--color-gray-400);font-size:.75rem}.meta-cell{font-size:.8125rem}.meta-info{display:flex;flex-direction:column;gap:2px}.meta-by{color:var(--color-gray-700);font-size:.8125rem;font-weight:600}.meta-date{color:var(--color-gray-400);font-size:.75rem}.price-cell .price{color:var(--color-primary);font-size:.9rem;font-weight:700}.status--active{background:#ecfdf5;border-color:#d1fae5;color:#059669}.status--inactive{background:#fef2f2;border-color:#fee2e2;color:#dc2626}