@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap";:root{--font-sans:"Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--bg-deep:#080710;--bg-card:#160116dc;--bg-card-hover:#ffffff17;--border-glass:#ffffff1a;--border-glass-hover:#fff3;--primary:#8a2be2;--primary-rgb:138, 43, 226;--primary-glow:rgba(var(--primary-rgb), .4);--primary-glow-strong:rgba(var(--primary-rgb), .6);--primary-radial:rgba(var(--primary-rgb), .15);--secondary:#00f2fe;--secondary-rgb:0, 242, 254;--secondary-glow:rgba(var(--secondary-rgb), .4);--secondary-glow-strong:rgba(var(--secondary-rgb), .4);--secondary-radial:rgba(var(--secondary-rgb), .12);--text-primary:#fff;--text-muted:#9ca3af;--text-link:#38bdf8;--shopee-color:#ee4d2d;--shopee-rgb:238, 77, 45;--shopee-text:#ff6849;--shopee-glow:rgba(var(--shopee-rgb), .3);--shopee-glow-strong:rgba(var(--shopee-rgb), .5);--shopee-bg:rgba(var(--shopee-rgb), .15);--shopee-border:rgba(var(--shopee-rgb), .3);--tiktok-color:#00f2fe;--tiktok-rgb:0, 242, 254;--tiktok-glow:rgba(var(--tiktok-rgb), .3);--tiktok-glow-strong:rgba(var(--tiktok-rgb), .15);--tiktok-bg:rgba(var(--tiktok-rgb), .1);--tiktok-border:rgba(var(--tiktok-rgb), .3);--lazada-color:#ff5400;--transition-smooth:all .3s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--bg-deep);color:var(--text-primary);background-image:radial-gradient(circle at 10% 20%, var(--primary-radial) 0%, transparent 40%), radial-gradient(circle at 90% 80%, var(--secondary-radial) 0%, transparent 40%);background-attachment:fixed;min-height:100vh;line-height:1.5;overflow-x:hidden}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-deep)}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#fff3}.glass{background:var(--bg-card);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-glass);border-radius:16px}.glass-interactive{background:var(--bg-card);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-glass);transition:var(--transition-smooth);border-radius:16px}.glass-interactive:hover{background:var(--bg-card-hover);border-color:var(--border-glass-hover);transform:translateY(-4px);box-shadow:0 12px 30px #0000004d}h1,h2,h3,h4,h5,h6{letter-spacing:-.02em;font-weight:700}.gradient-text{background:linear-gradient(135deg, var(--secondary) 0%, var(--primary) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.container{max-width:1200px;margin:0 auto;padding:0 1.5rem}button,.btn{font-family:var(--font-sans);cursor:pointer;transition:var(--transition-smooth);border:none;outline:none;font-weight:600}.btn-primary{background:linear-gradient(135deg, var(--primary) 0%, #6a0dad 100%);color:#fff;box-shadow:0 4px 15px var(--primary-glow)}.btn-primary:hover{box-shadow:0 6px 20px var(--primary-glow-strong);transform:translateY(-2px)}.btn-secondary{color:#fff;border:1px solid var(--border-glass);background:#ffffff1a}.btn-secondary:hover{border-color:var(--border-glass-hover);background:#fff3}.btn-shopee{background:var(--shopee-color);color:#fff;box-shadow:0 4px 12px var(--shopee-glow)}.btn-shopee:hover{background:var(--shopee-color-hover);box-shadow:0 6px 18px var(--shopee-glow-strong);transform:translateY(-2px)}.btn-tiktok{color:#fff;border:1px solid var(--tiktok-color);box-shadow:0 4px 12px var(--tiktok-glow-strong);background:#010101}.btn-tiktok:hover{box-shadow:0 6px 18px var(--tiktok-glow);background:#111;transform:translateY(-2px)}input,select,textarea{font-family:var(--font-sans);border:1px solid var(--border-glass);color:#fff;transition:var(--transition-smooth);background:#0000004d;border-radius:8px;outline:none;padding:.75rem 1rem}input:focus,select:focus,textarea:focus{border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-glow)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:.4s forwards fadeIn}.badge-shopee{background:var(--shopee-bg);color:var(--shopee-text);border:1px solid var(--shopee-border);border-radius:4px;align-items:center;gap:.25rem;padding:.25rem .5rem;font-size:.75rem;font-weight:600;display:inline-flex}.badge-tiktok{background:var(--tiktok-bg);color:var(--tiktok-color);border:1px solid var(--tiktok-border);border-radius:4px;align-items:center;gap:.25rem;padding:.25rem .5rem;font-size:.75rem;font-weight:600;display:inline-flex}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.flex-grow{flex-grow:1}.grid{display:grid}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;display:grid}@media (width<=900px){.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=580px){.product-grid{grid-template-columns:repeat(1,minmax(0,1fr))}}@media (width>=640px){.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width>=1024px){.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:col-span-1{grid-column:span 1/span 1}.lg\:col-span-2{grid-column:span 2/span 2}}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.w-full{width:100%}.h-full{height:100%}.aspect-video{aspect-ratio:16/9}.aspect-square{aspect-ratio:1}.max-w-md{max-width:28rem}.max-w-lg{max-width:32rem}.max-w-2xl{max-width:42rem}.max-w-\[200px\]{max-width:200px}.max-w-\[250px\]{max-width:250px}.p-2{padding:.5rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-8{padding-top:2rem;padding-bottom:2rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.pl-9{padding-left:2.25rem}.pl-10{padding-left:2.5rem}.pr-4{padding-right:1rem}.pr-1{padding-right:.25rem}.pt-3{padding-top:.75rem}.pt-4{padding-top:1rem}.pb-4{padding-bottom:1rem}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mb-12{margin-bottom:3rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mt-12{margin-top:3rem}.mt-auto{margin-top:auto}.border{border:1px solid var(--border-glass)}.border-b{border-bottom:1px solid var(--border-glass)}.border-t{border-top:1px solid var(--border-glass)}.border-white\/5{border-color:#ffffff0d}.border-white\/10{border-color:#ffffff1a}.border-white\/20{border-color:#fff3}.border-sky-900\/40{border-color:#0ea5e933}.focus\:border-sky-500:focus{border-color:#0ea5e9}.divide-y>*+*{border-top:1px solid #ffffff1a}.rounded{border-radius:.25rem}.rounded-md{border-radius:.375rem}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-full{border-radius:9999px}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.text-xs{font-size:.75rem}.text-sm{font-size:.875rem}.text-base{font-size:1rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.text-3xl{font-size:1.875rem}.text-4xl{font-size:2.25rem}.text-5xl{font-size:3rem}.font-normal{font-weight:400}.font-semibold{font-weight:600}.font-bold{font-weight:700}.font-extrabold{font-weight:800}.uppercase{text-transform:uppercase}.tracking-tight{letter-spacing:-.025em}.tracking-wider{letter-spacing:.05em}.tracking-widest{letter-spacing:.1em}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.inset-0{inset:0}.top-0{top:0}.top-3{top:.75rem}.top-4{top:1rem}.left-3{left:.75rem}.left-4{left:1rem}.right-3{right:.75rem}.right-4{right:1rem}.bottom-3{bottom:.75rem}.z-10{z-index:10}.z-20{z-index:20}.z-40{z-index:40}.z-50{z-index:50}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.max-h-\[160px\]{max-height:160px}.h-\[450px\]{height:450px}.h-\[500px\]{height:500px}.bg-black\/80{background-color:#000c}.bg-black\/60{background-color:#0009}.bg-black\/40{background-color:#0006}.bg-black\/30{background-color:#0000004d}.bg-white\/5{background-color:#ffffff0d}.bg-white\/10{background-color:#ffffff1a}.bg-zinc-950\/80{background-color:#080710cc}.bg-zinc-900\/50{background-color:#18181b80}.bg-zinc-950{background-color:#080710}.bg-zinc-900{background-color:#18181b}.bg-sky-950\/40{background-color:#082f4966}.bg-emerald-950\/40{background-color:#064e3b66}.bg-rose-950\/40{background-color:#88133766}.bg-red\/80{background-color:#f50505cc}.bg-transparent{background-color:#0000}.bg-shopee-color{background-color:var(--shopee-color)}.bg-tiktok-color{background-color:var(--tiktok-color)}.bg-lazada-color{background-color:var(--lazada-color)}.text-white{color:#fff}.text-zinc-300{color:#d4d4d8}.text-zinc-400{color:#a1a1aa}.text-zinc-500{color:#71717a}.text-sky-300{color:#7dd3fc}.text-sky-400{color:var(--text-link)}.text-cyan-300{color:#67e8f9}.text-amber-400{color:#fbbf24}.text-emerald-300{color:#6ee7b7}.text-rose-300{color:#fca5a5}.text-rose-400{color:#f87171}.text-\[\#ff6849\]{color:#ff6849}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.line-clamp-2{-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.object-cover{object-fit:cover}.object-contain{object-fit:contain}.scrollbar-none::-webkit-scrollbar{display:none}.scrollbar-none{-ms-overflow-style:none;scrollbar-width:none}.shrink-0{flex-shrink:0}.leading-none{line-height:1}.leading-snug{line-height:1.375}.leading-relaxed{line-height:1.625}.text-decoration-none{text-decoration:none}.resize-none{resize:none}.animate-spin{animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.image-container{width:100%;position:relative;overflow:hidden}.image-overlay{-webkit-backdrop-filter:blur(4px);opacity:0;transition:var(--transition-smooth);z-index:5;background:#080710a6;flex-direction:column;justify-content:center;align-items:center;gap:.5rem;display:flex;position:absolute;inset:0}.image-container:hover .image-overlay{opacity:1}.image-overlay span{color:#fff;letter-spacing:.05em;text-transform:uppercase;transition:var(--transition-smooth);font-size:.75rem;font-weight:600;transform:translateY(10px)}.image-container:hover .image-overlay span{transform:translateY(0)}.image-overlay svg{transition:var(--transition-smooth);transform:scale(.8)}.image-container:hover .image-overlay svg{transform:scale(1)}.admin-image-container{border-radius:8px;width:100%;position:relative;overflow:hidden}.admin-image-overlay{-webkit-backdrop-filter:blur(4px);opacity:0;transition:var(--transition-smooth);z-index:10;background:#080710bf;justify-content:center;align-items:center;gap:.75rem;display:flex;position:absolute;inset:0}@media (hover:hover){.admin-image-container:hover .admin-image-overlay{opacity:1}}.admin-btn-action{text-transform:uppercase;border-radius:6px;align-items:center;gap:.25rem;padding:.5rem .75rem;font-size:.7rem;font-weight:700;display:flex;box-shadow:0 4px 10px #0000004d}.admin-btn-edit{background:linear-gradient(135deg, var(--secondary) 0%, #0284c7 100%);color:#080710!important}.admin-btn-edit:hover{transform:translateY(-1px);box-shadow:0 6px 15px #00f2fe66}.admin-btn-delete{background:linear-gradient(135deg,#f43f5e 0%,#e11d48 100%);color:#fff!important}.admin-btn-delete:hover{transform:translateY(-1px);box-shadow:0 6px 15px #f43f5e66}.admin-theme{--primary:#10b981;--primary-glow:#10b98166;--secondary:#14b8a6;--secondary-glow:#14b8a666;background-attachment:fixed;transition:all .5s cubic-bezier(.4,0,.2,1);background-color:#060d0a!important;background-image:radial-gradient(circle at 10% 20%,#10b98126 0%,#0000 40%),radial-gradient(circle at 90% 80%,#14b8a61f 0%,#0000 40%)!important}.admin-theme .btn-primary{background:linear-gradient(135deg, var(--primary) 0%, #047857 100%)!important;box-shadow:0 4px 15px var(--primary-glow)!important}.admin-theme .btn-primary:hover{box-shadow:0 6px 20px #10b98199!important}.admin-theme input:focus,.admin-theme select:focus,.admin-theme textarea:focus{border-color:var(--primary)!important;box-shadow:0 0 0 2px var(--primary-glow)!important}.admin-theme .glass{border-color:#10b98126!important}.admin-theme .admin-btn-edit{color:#060d0a!important;background:linear-gradient(135deg,#34d399 0%,#059669 100%)!important}.admin-theme .admin-btn-edit:hover{box-shadow:0 6px 15px #34d39966!important}.admin-container{width:100%;max-width:100%;margin-left:auto;margin-right:auto;padding-left:2rem;padding-right:2rem}.admin-product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;display:grid}@media (width<=1024px){.admin-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=640px){.admin-container{padding-left:1rem;padding-right:1rem}.admin-product-grid{grid-template-columns:1fr}}.modal-overlay{z-index:9999;-webkit-backdrop-filter:blur(12px);background-color:#080710d9;justify-content:center;align-items:flex-start;padding:2rem 1rem;display:flex;position:fixed;inset:0;overflow-y:auto}.modal-card{width:100%;max-width:32rem;margin:auto;position:relative}.modal-card input,.modal-card select,.modal-card textarea{width:100%!important}.animate-modal-fade{animation:.15s ease-out forwards modalFadeIn}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}.admin-card-reorder{cursor:grab;-webkit-user-select:none;user-select:none}.admin-card-reorder:active{cursor:grabbing}.admin-card-reorder.dragging{opacity:.3;transform:scale(.96);border:2px dashed #10b981!important;box-shadow:0 0 15px #10b9814d!important}.storefront-modal-container{flex-direction:column;width:90vw;max-width:960px;max-height:90vh;display:flex}.storefront-modal-content{flex-direction:column;height:100%;display:flex}@media (width>=768px){.storefront-modal-content{flex-direction:row;height:70vh;max-height:580px}.storefront-modal-content .image-wrapper{width:55%;height:100%}.storefront-modal-content .info-wrapper{width:45%;height:100%;overflow:hidden}}@media (width<=767px){.storefront-modal-container{max-height:85vh;overflow-y:auto}.storefront-modal-content .image-wrapper{width:100%;height:250px}.storefront-modal-content .info-wrapper{width:100%;height:auto}}.image-url-preview-container{align-items:flex-end;gap:1rem;width:100%;display:flex}.image-url-input-wrapper{flex:1}.image-preview-wrapper{flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;display:flex}.image-preview-box{background-color:#080710;border:1px solid #ffffff1a;border-radius:6px;justify-content:center;align-items:center;width:100px;height:100px;display:flex;overflow:hidden;box-shadow:0 4px 6px #0003}.image-preview-box img{object-fit:contain;width:100%;max-width:100%;height:100%;max-height:100%;display:block}.image-preview-box-empty{color:#71717a;text-align:center;background-color:#0006;border:1px dashed #ffffff26;border-radius:6px;justify-content:center;align-items:center;width:100px;height:100px;padding:2px;font-size:11px;display:flex}.admin-delete-confirm-overlay{-webkit-backdrop-filter:blur(6px);z-index:20;background:#0c0608eb;border:1.5px solid #f43f5e59;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;padding:.5rem;display:flex;position:absolute;inset:0}.btn-confirm-delete,.btn-cancel-delete{font-family:var(--font-sans);cursor:pointer;transition:var(--transition-smooth);border:none;outline:none;justify-content:center;align-items:center;font-weight:700;color:#fff!important;height:30px!important;padding-top:0!important;padding-bottom:0!important;display:inline-flex!important}.btn-confirm-delete{background-color:#ef4444!important}.btn-confirm-delete:hover{transform:translateY(-1px);box-shadow:0 4px 12px #ef444466;background-color:#dc2626!important}.btn-cancel-delete{background-color:#4b5563!important}.btn-cancel-delete:hover{transform:translateY(-1px);box-shadow:0 4px 12px #4b55634d;background-color:#374151!important}.category-item{transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s,background-color .25s,border-color .25s,opacity .25s}.animate-category-drop{animation:.4s cubic-bezier(.25,1.35,.5,1) forwards categoryDropSettle}@keyframes categoryDropSettle{0%{background-color:#104e3b66;border-color:#10b981;transform:scale(1.04)translateY(-2px);box-shadow:0 12px 24px -4px #10b98173}to{box-shadow:none;background-color:#0006;border-color:#ffffff0d;transform:scale(1)translateY(0)}}.btn-confirm-delete-cat,.btn-cancel-delete-cat{cursor:pointer;border:none;border-radius:4px;outline:none;justify-content:center;align-items:center;padding:0 8px;font-size:9px;font-weight:700;transition:all .2s;display:inline-flex;color:#fff!important;height:24px!important}.btn-confirm-delete-cat{background-color:#ef4444!important}.btn-confirm-delete-cat:hover{transform:translateY(-.5px);box-shadow:0 2px 6px #ef444466;background-color:#dc2626!important}.btn-cancel-delete-cat{background-color:#4b5563!important}.btn-cancel-delete-cat:hover{transform:translateY(-.5px);box-shadow:0 2px 6px #4b55634d;background-color:#374151!important}.loader-container{flex-direction:column;justify-content:center;align-items:center;width:100%;min-height:300px;padding:5rem 0;display:flex}.spinner-outer{width:50px;height:50px;margin-bottom:1.25rem;position:relative}.spinner-ring{border:4px solid #ffffff0d;border-radius:50%;position:absolute;inset:0}.spinner-glow{border:4px solid #0000;border-top-color:var(--secondary);border-right-color:var(--primary);border-radius:50%;animation:1s linear infinite spin;position:absolute;inset:0}.spinner-inner{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background-color:#080710e6;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;inset:6px;box-shadow:inset 0 0 10px #00f2fe1a}.spinner-inner svg{color:var(--secondary);animation:2s ease-in-out infinite pulse}.loader-text{color:var(--text-muted);letter-spacing:.05em;font-size:.75rem;font-weight:600;animation:1.5s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:.6;transform:scale(.98)}50%{opacity:1;transform:scale(1.02)}}.showcase-title{color:var(--text-primary);margin-top:1rem;margin-bottom:.75rem;font-size:1.45rem;font-weight:800;line-height:1.25}@media (width>=768px){.showcase-title{font-size:3rem}}
