@charset "UTF-8";/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-red-600:oklch(57.7% .245 27.325);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-600:oklch(44.6% .03 256.802);--color-white:#fff;--spacing:.25rem;--container-4xl:56rem;--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-base:1rem;--text-base--line-height: 1.5 ;--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75/1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2/1.5);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5/2.25);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-extrabold:800;--leading-relaxed:1.625;--radius-lg:.5rem;--radius-xl:.75rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::file-selector-button{-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.fixed{position:fixed}.relative{position:relative}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.mx-auto{margin-inline:auto}.mt-3{margin-top:calc(var(--spacing)*3)}.mt-8{margin-top:calc(var(--spacing)*8)}.mt-auto{margin-top:auto}.mb-1{margin-bottom:calc(var(--spacing)*1)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.mb-3{margin-bottom:calc(var(--spacing)*3)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.mb-6{margin-bottom:calc(var(--spacing)*6)}.mb-8{margin-bottom:calc(var(--spacing)*8)}.mb-10{margin-bottom:calc(var(--spacing)*10)}.ml-6{margin-left:calc(var(--spacing)*6)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-block{display:inline-block}.h-48{height:calc(var(--spacing)*48)}.w-full{width:100%}.max-w-4xl{max-width:var(--container-4xl)}.flex-1{flex:1}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.resize{resize:both}.list-disc{list-style-type:disc}.list-none{list-style-type:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-2{gap:calc(var(--spacing)*2)}.gap-6{gap:calc(var(--spacing)*6)}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*2)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-y-reverse)))}.overflow-hidden{overflow:hidden}.rounded{border-radius:.25rem}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-\[var\(--abu-abu-gelap\)\]{border-color:var(--abu-abu-gelap)}.bg-\[var\(--hitam\)\]{background-color:var(--hitam)}.bg-gray-200{background-color:var(--color-gray-200)}.bg-white{background-color:var(--color-white)}.object-cover{object-fit:cover}.p-4{padding:calc(var(--spacing)*4)}.p-5{padding:calc(var(--spacing)*5)}.p-6{padding:calc(var(--spacing)*6)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-6{padding-inline:calc(var(--spacing)*6)}.py-1{padding-block:calc(var(--spacing)*1)}.py-6{padding-block:calc(var(--spacing)*6)}.py-10{padding-block:calc(var(--spacing)*10)}.pt-5{padding-top:calc(var(--spacing)*5)}.text-center{text-align:center}.text-left{text-align:left}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-extrabold{--tw-font-weight:var(--font-weight-extrabold);font-weight:var(--font-weight-extrabold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.text-\[var\(--abu-abu-gelap\)\]{color:var(--abu-abu-gelap)}.text-\[var\(--hitam\)\]{color:var(--hitam)}.text-\[var\(--merah\)\]{color:var(--merah)}.text-gray-600{color:var(--color-gray-600)}.text-red-600{color:var(--color-red-600)}.text-white{color:var(--color-white)}.italic{font-style:italic}.underline{text-decoration-line:underline}.shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}@media (hover:hover){.hover\:scale-\[1\.02\]:hover{scale:1.02}.hover\:bg-gray-300:hover{background-color:var(--color-gray-300)}.hover\:pl-2:hover{padding-left:calc(var(--spacing)*2)}.hover\:text-\[var\(--merah\)\]:hover{color:var(--merah)}.hover\:underline:hover{text-decoration-line:underline}}@media (min-width:40rem){.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:48rem){.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (prefers-color-scheme:dark){.dark\:border-\[var\(--abu\)\]{border-color:var(--abu)}.dark\:bg-\[var\(--abu\)\]{background-color:var(--abu)}.dark\:bg-\[var\(--abu2\)\]{background-color:var(--abu2)}.dark\:text-\[var\(--abu2\)\]{color:var(--abu2)}.dark\:text-\[var\(--hitam\)\]{color:var(--hitam)}.dark\:text-\[var\(--merah\)\]{color:var(--merah)}}}*{box-sizing:border-box;scrollbar-width:none}::-webkit-scrollbar{display:none}:root{--putih:#fff;--abu-abu:#f5f5f5;--abu-abu-gelap:#d1d5db;--hitam:#232323;--merah:#f7374f;--merah-gelap:#88304e;--oren:#bb3e00;--hijau:#52b86a;--hijau-gelap:#006400;--abu:#f8f9fa;--abu2:#f6f7fb;--bubble-user:var(--merah);--bubble-bot:var(--putih);--bubble-user-text:var(--putih);--bubble-bot-text:var(--hitam);--header-bg:var(--putih);--header-text:var(--merah);--input-bg:#f5f7fa}body.dark-mode,html[data-theme=dark]{--merah:#fc5c77;--hitam:#f1f1f1;--putih:#18171d;--abu:#23222b;--abu2:#292836;--bubble-user:var(--merah);--bubble-bot:#272634;--bubble-user-text:#fff;--bubble-bot-text:#f1f1f1;--header-bg:#23222b;--header-text:#fc5c77;--input-bg:#1a1a25}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@media (max-width: 767px){.container{width:90%}}nav{position:sticky;top:0;width:100%;z-index:80;padding-block:1rem;transition:background-color .3s ease,box-shadow .3s ease;background-color:#fff;box-shadow:0 2px 10px #0000000a}nav.top{background-color:#000;color:#fff}nav.scrolled{background-color:#fff;color:var(--hitam);box-shadow:0 2px 10px #0000001a}nav .logo-web{cursor:pointer;width:100px;height:300px}nav ul{display:flex;flex-direction:row;gap:1.5rem;align-items:center}nav ul li{position:relative;font-size:1.1rem}nav ul a,nav ul span,nav ul button{color:inherit;font-weight:500;text-decoration:none;background:none;border:none;cursor:pointer;transition:color .3s;display:flex;align-items:center;gap:.3rem}nav ul a:hover,nav ul span:hover,nav ul button:hover{color:var(--merah)}nav ul a.active,nav ul span.active,nav ul button.active{color:var(--merah);font-weight:600}nav ul .btn-auth{color:var(--merah)}nav ul .username{color:var(--merah);cursor:pointer;position:relative}nav ul .dropdown-menu{display:none;position:absolute;top:110%;left:0;background-color:#f8f9fa;z-index:91;min-width:120px;border-radius:5px;box-shadow:0 4px 12px #00000014;overflow:hidden;transition:.3s}nav ul .dropdown-menu button{background:none;border:none;padding:10px;width:100%;text-align:left;cursor:pointer;font-size:14px;transition:background-color .3s ease}nav ul .dropdown-menu button:hover{background-color:#f1f1f1}nav ul .dropdown-menu.open{display:block}nav .language-dropdown{padding:5px 10px;font-size:14px;border:1px solid #ccc;border-radius:5px;cursor:pointer;background-color:#f5f5f5;color:#333}@media (max-width: 767px){nav{display:none}}.nav-bottom-mobile{position:sticky;left:0;right:0;bottom:0;z-index:100;background:var(--hitam);border-top:1px solid #e4e4e4;display:flex;justify-content:space-around;align-items:center;padding:1rem;box-shadow:0 -2px 10px #00000012;width:100%;height:fit-content}.nav-bottom-mobile a{flex:1;display:flex;flex-direction:column;align-items:center;color:#888;font-size:12px;text-decoration:none;position:relative;padding:4px 0;transition:color .2s}.nav-bottom-mobile a.active{color:var(--merah, #f7374f)}.nav-bottom-mobile a .badge{position:absolute;top:2px;right:18px;background:var(--merah, #f7374f);color:#fff;border-radius:50%;width:16px;height:16px;font-size:10px;display:flex;align-items:center;justify-content:center}@media (min-width: 768px){.nav-bottom-mobile{display:none!important}}@media (max-width: 767px){.main-content{padding-bottom:56px}.footer-desktop{display:none}}footer{width:100%;background-color:var(--hitam);color:#fff;padding:1rem;font-size:.9rem;text-align:center}footer a{text-decoration:none;color:#fff;opacity:.8;transition:color .3s ease}footer a:hover{color:var(--merah)}footer .footer-container{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:1rem;padding-left:2rem;padding-right:2rem}footer .footer-top,footer .footer-bottom{display:flex;flex-direction:column;align-items:center;gap:2px}footer .footer-links,footer .footer-legal{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}footer .footer-partners{text-align:center;display:flex;flex-direction:column;align-items:center}footer .footer-partners h4{margin-bottom:.5rem;font-weight:600;font-size:12px}footer .footer-partners .partner-logos{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}footer .footer-partners .partner-logos img{max-height:40px;object-fit:contain;opacity:.8;opacity:1}footer .footer-socials{display:flex;gap:1rem;justify-content:center}footer .footer-socials svg{font-size:1.2rem}footer .footer-separator{opacity:.3;width:100%;border:none;height:1px;background-color:#fff}footer .footer-copy{margin-top:1rem;font-size:.8rem;opacity:.5}@media (min-width: 768px){footer .footer-container{padding-left:0;padding-right:0}footer .footer-top,footer .footer-bottom{flex-direction:row;justify-content:space-between;align-items:center;text-align:left;gap:4px}footer .footer-partners{text-align:left;align-items:flex-start}footer .footer-partners h4{font-size:12px}footer .footer-partners .partner-logos img{filter:grayscale(1);transition:filter .4s}footer .footer-partners .partner-logos img:hover{filter:grayscale(0)}}@media (min-width: 360px){footer .footer-top,footer .footer-bottom{flex-direction:row;justify-content:space-between;align-items:center;text-align:left;gap:4px}footer .footer-partners{text-align:left;align-items:flex-start}}.hidden-scrollbar::-webkit-scrollbar{display:none}.btn.kotak{border:1px solid var(--hitam)}.btn.buy{color:var(--hitam);border:1px solid var(--hitam);border-radius:4px}.btn.buy:hover{background-color:var(--hitam);color:var(--putih)}.btn.cart{color:var(--hitam);border:1px solid var(--hitam);border-radius:4px}.btn.cart:hover{background-color:var(--hitam);color:var(--putih)}.btn.polos{color:var(--putih)}.btn.polos:hover{color:var(--merah)}.btn.merah{background:var(--putih);border:1px solid var(--abu-abu-gelap);border-radius:10px;padding:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--hitam);transition:all .2s ease;box-shadow:0 4px 8px #00000012}.btn.merah span{margin-left:.6rem;font-size:.9rem;font-weight:500}.btn.merah svg{width:20px;height:20px;transition:color .2s,transform .2s}.btn.merah svg.wishlisted{color:var(--merah);transform:scale(1.1)}.btn.merah:hover:not(:disabled){border-color:var(--merah);color:var(--merah);box-shadow:0 6px 12px #0000001a}.btn.merah:hover:not(:disabled) svg:not(.wishlisted){color:var(--merah)}.btn.merah:disabled{opacity:.6;cursor:not-allowed}.btn.home{color:var(--putih);background-color:var(--merah);border-radius:4px;border:1px solid var(--merah);padding:10px 20px;font-size:16px;width:60%;transition:background-color .3s,color .3s}.btn.home:hover{background-color:var(--putih);color:var(--merah);border:1px solid var(--merah)}.btn.home:disabled{background-color:var(--abu-abu-gelap);color:var(--putih);cursor:not-allowed}.btn.home:active{background-color:var(--merah);color:var(--putih);transform:scale(.98)}.btn.home:focus{outline:none;box-shadow:0 0 0 2px #f003}.search{display:flex;transition:.3s}.search input{display:block;width:0px;overflow:hidden;transition:.3s}.search.show{gap:.5rem;transition:.3s}.search.show input{width:100px;padding-inline:1.5em;transition:.3s}.signup-container{display:flex;align-items:center;justify-content:center;padding:2rem 1rem;background-color:#f8f9fa;height:calc(100svh - 240px);min-height:600px}.form-box{background-color:#fff;padding:2rem;max-width:400px;width:100%;border-radius:12px;box-shadow:0 4px 20px #00000014;text-align:center}.title{font-size:1.5rem;font-weight:700;margin-bottom:1.5rem}.form{display:flex;flex-direction:column;gap:1rem}.form input{padding:.75rem 1rem;border:1px solid #ccc;border-radius:8px;font-size:1rem;transition:border-color .3s}.form input:focus{border-color:var(--merah);outline:none}.form button{background-color:var(--merah);color:#fff;padding:.75rem;border:none;border-radius:8px;font-weight:700;font-size:1rem;cursor:pointer;transition:background-color .3s}.form button:hover{background-color:#d9534f}.error-msg{color:red;margin-top:1rem;font-size:.9rem}.input-password{position:relative}.input-password input{width:100%;padding-right:2.5rem}.input-password .toggle-password{position:absolute;right:.75rem;top:50%;transform:translateY(-50%);cursor:pointer;color:#888;font-size:1.1rem}.notif{position:fixed;top:20px;left:50%;transform:translate(-50%);z-index:100;display:flex;justify-content:center;pointer-events:none;transition:opacity .4s ease,transform .4s ease}.notif div{background-color:#23222b;color:var(--putih);border:1px solid var(--putih);padding:1em 2em;border-radius:5px;opacity:0;transform:translateY(-100px);transition:opacity .4s ease,transform .4s ease}.notif.show div{opacity:1;transform:translateY(20px)}.notfound-container{display:flex;justify-content:center;align-items:center;height:100svh;background-color:#f5f5f5;animation:fadeIn 1s ease-in-out}.notfound-content{text-align:center;padding:2rem;border-radius:8px;background:linear-gradient(145deg,#f0f0f0,#d8d8d8);box-shadow:4px 4px 10px #0000001a,-4px -4px 10px #fff3;animation:slideUp .7s ease-out forwards}.notfound-title{font-size:6rem;color:var(--merah);font-weight:700;margin:0;opacity:0;animation:fadeInTitle 1s .5s forwards}.notfound-message{font-size:1.5rem;color:#555;margin-top:1rem;opacity:0;animation:fadeInMessage 1s 1.5s forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(50px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes fadeInTitle{0%{opacity:0}to{opacity:1}}@keyframes fadeInMessage{0%{opacity:0}to{opacity:1}}.container-product{display:flex;flex-direction:column;padding:2rem}.container-product>img{width:100%;max-height:600px;height:fit-content;border-radius:8px;box-shadow:0 2px 4px #0000001a;transition:.3s}.container-product>img :hover{box-shadow:0 4px 8px #0003;transition:.3s}.container-product .product-info{display:flex;flex-direction:column;gap:1rem}.container-product .product-info>h3{font-size:1.5rem;font-family:Gill Sans,Gill Sans MT,Calibri,Trebuchet MS,sans-serif;opacity:.8}.container-product .product-info .product{display:flex}.container-product .product-info .product .product-actions{display:flex;height:fit-content;gap:1rem}.checkout-page{max-width:800px;margin:2rem auto;padding:2rem;background-color:#fff;border-radius:10px;box-shadow:0 4px 10px #0000000d;font-family:Segoe UI,sans-serif}.checkout-page h1{text-align:center;margin-bottom:2rem;font-size:2rem;color:var(--hitam)}.checkout-page .form-section{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem}.checkout-page .form-section input,.checkout-page .form-section textarea,.checkout-page .form-section select{padding:.75rem 1rem;border:1px solid #ccc;border-radius:8px;font-size:1rem;background-color:#fff;transition:border-color .3s ease}.checkout-page .form-section input:focus,.checkout-page .form-section textarea:focus,.checkout-page .form-section select:focus{border-color:var(--merah);outline:none}.checkout-page .form-section textarea{min-height:100px;resize:vertical}.checkout-page .form-section select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,<svg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'><polyline points='20,50 70,100 120,50' fill='none' stroke='%23999' stroke-width='10'/></svg>");background-repeat:no-repeat;background-position:right 1rem center;background-size:1rem}.checkout-page .summary-section{margin-bottom:2rem}.checkout-page .summary-section h3{font-size:1.2rem;font-weight:700;margin-bottom:.75rem}.checkout-page .summary-section ul{list-style:none;padding:0;margin:0}.checkout-page .summary-section ul li{padding:.5rem 0;border-bottom:1px solid #eee;font-size:1rem;display:flex;justify-content:space-between}.checkout-page .summary-section p{font-size:1.1rem;font-weight:600;text-align:right;margin-top:1rem}.checkout-page button{width:100%;padding:.75rem;font-size:1.1rem;background-color:var(--merah);color:#fff;border:none;border-radius:8px;font-weight:700;cursor:pointer;transition:background-color .3s ease}.checkout-page button:hover{background-color:var(--merah)}.checkout-page button:disabled{background-color:#ccc;cursor:not-allowed}@media (max-width: 768px){.checkout-page{padding:1.5rem}.checkout-page .form-section,.checkout-page .summary-section{font-size:.95rem}.checkout-page button{font-size:1rem}}@media (max-width: 480px){.checkout-page{padding:1rem}.summary-section ul li{flex-direction:column;align-items:flex-start}.summary-section p{text-align:left}}.notif{position:fixed;top:20px;left:50%;transform:translate(-50%);z-index:999;pointer-events:none}.notif div{background-color:var(--hijau);color:#fff;padding:.75rem 1.5rem;border-radius:6px;box-shadow:0 4px 10px #0000001a;font-size:1rem;opacity:0;transform:translateY(-20px);transition:all .4s ease}.notif.show div{opacity:1;transform:translateY(0)}.loading-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#ffffffb3;z-index:998;display:flex;align-items:center;justify-content:center}.loading-overlay .spinner{border:4px solid #f3f3f3;border-top:4px solid var(--merah);border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.profile-container{max-width:380px;margin:40px auto;background:#fff;border-radius:22px;box-shadow:0 2px 12px #eaeaea;padding:32px 20px 18px;position:relative}.profile-header{display:flex;flex-direction:column;align-items:center;margin-bottom:26px}.profile-avatar{width:88px;height:88px;border-radius:50%;object-fit:cover;border:3px solid #fff;box-shadow:0 2px 8px #e0e0e0;margin-bottom:12px}.profile-user h3{margin:0;font-size:22px;font-weight:700}.profile-user .username{color:#b0b0b0;font-size:14px}.edit-btn{margin-top:10px;background:#fa5858;color:#fff;border:none;padding:8px 18px;border-radius:18px;font-weight:700;cursor:pointer;transition:background .2s}.edit-btn:hover{background:#e84040}.profile-menu{list-style:none;padding:0;margin:24px 0 18px;border-top:1px solid #eee;border-bottom:1px solid #eee}.profile-menu li{display:flex;align-items:center;padding:14px 0;font-size:16px;border-bottom:1px solid #f8f8f8}.profile-menu li .icon{font-size:18px;margin-right:14px}.logout-btn{width:100%;background:none;border:1px solid #fa5858;color:#fa5858;padding:10px 0;border-radius:18px;font-weight:700;cursor:pointer;margin-top:16px;transition:background .2s,color .2s}.logout-btn:hover{background:#fa5858;color:#fff}.page-container{max-width:400px;margin:40px auto;border-radius:22px;padding:32px 20px 18px;position:relative;transition:all .2s}@media (min-width: 768px){.page-container{max-width:100%;padding:56px 48px 32px;border-radius:32px;font-size:1.14rem}}@media (max-width: 500px){.page-container{max-width:98vw;padding:16px 4vw 12px;border-radius:14px;font-size:.98rem}}.topbar{display:flex;align-items:center;justify-content:center;position:sticky;top:0;background:#fff;border-radius:0 0 18px 18px;box-shadow:0 2px 10px #f0f0f0;padding:18px 0 12px;margin-bottom:18px;z-index:9;min-height:52px}.topbar-back{position:absolute;left:18px;top:50%;transform:translateY(-50%);background:none;border:none;font-size:1.35rem;color:#0c1631;cursor:pointer;padding:0;display:flex;align-items:center}.topbar-title{font-weight:700;font-size:1.18rem;color:#23283a;letter-spacing:.03em}@media (min-width: 768px){.topbar{display:none}}.category-section{margin:32px 0 36px;color:var(--hitam)}.category-section .category-header{color:var(--hitam);font-size:1rem;font-weight:700;margin-bottom:12px;letter-spacing:1px;text-transform:uppercase;padding-left:6px}.category-section .category-carousel{display:flex;align-items:center;position:relative}.category-section .carousel-arrow{background:#24242475;border:none;color:var(--putih);font-size:2rem;width:48px;height:90px;border-radius:10px;cursor:pointer;z-index:2;transition:background .2s;display:flex;align-items:center;justify-content:center}.category-section .carousel-arrow:hover{background:var(--merah)}.category-section .carousel-arrow:disabled{opacity:.4;cursor:not-allowed}.category-section .carousel-arrow.left{margin-right:10px}.category-section .carousel-arrow.right{margin-left:10px}@media (max-width: 600px){.category-section .carousel-arrow{width:34px;height:60px;font-size:1.5rem}}.category-section .category-list{display:flex;flex-wrap:nowrap;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;padding:16px 0;width:100%}.category-section .category-list::-webkit-scrollbar{display:none}.category-section .category-card{min-width:220px;max-width:240px;height:180px;background:var(--abu2);border-radius:18px;box-shadow:0 2px 10px #0004;position:relative;overflow:hidden;cursor:pointer;scroll-snap-align:center;display:flex;flex-direction:column;justify-content:flex-end;transition:transform .15s}.category-section .category-card:hover{transform:translateY(-3px) scale(1.03)}.category-section .category-card img{position:absolute;width:100%;height:100%;object-fit:cover;z-index:1}.category-section .category-card .category-gradient{position:absolute;z-index:2;left:0;right:0;bottom:0;top:0;background:linear-gradient(to top,#f7374f61 65%,#f7374f1f);pointer-events:none}.category-section .category-card .category-label{position:absolute;left:0;right:0;bottom:24px;z-index:3;display:flex;justify-content:center}.category-section .category-card .category-label .category-label-inner{background:var(--putih);color:var(--merah);padding:8px 24px;border-radius:7px;font-weight:700;font-size:1.09rem;text-transform:uppercase;box-shadow:0 2px 14px #2223;letter-spacing:1px;display:inline-block}.category-section .carousel-dots{margin-top:14px;display:flex;justify-content:center;gap:8px}.category-section .carousel-dots .dot{width:16px;height:7px;border-radius:6px;background:var(--abu-abu-gelap);transition:background .18s}.category-section .carousel-dots .dot.active{background:var(--merah)}.container-negara{width:100%;height:70svh;max-height:520px;min-height:220px;position:relative;display:flex;align-items:stretch;justify-content:center;overflow:hidden;background:#212533}@media (max-width: 700px){.container-negara{height:37vh;max-height:220px;min-height:120px}}.container-negara .content{width:100%;height:100%;position:absolute;z-index:5;background:linear-gradient(to bottom,rgba(35,36,53,.6) 80%,#191b2e 99%,transparent 100%)}.container-negara .content .anak-content{width:100%;height:100%;position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:10}.container-negara .content .anak-content .isi{position:relative;z-index:12;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;margin-bottom:46px}.container-negara .content .anak-content .isi .anak-isi{width:100%;position:relative}.container-negara .content .anak-content .isi .anak-isi .item{position:absolute;width:100%;left:0;top:0;opacity:0;scale:1;transition:.85s cubic-bezier(.53,.2,.4,1.08);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;pointer-events:none}.container-negara .content .anak-content .isi .anak-isi .item.active{opacity:1;scale:1.1;pointer-events:auto}.container-negara .content .anak-content .isi .anak-isi .item p{color:#fff;font-weight:700;font-size:1.1rem;margin-bottom:.5em;letter-spacing:.03em;text-shadow:0 2px 10px rgba(0,0,0,.8)}.container-negara .content .anak-content .isi .anak-isi .item h1{color:#fff;font-size:clamp(2rem,6vw,3.4rem);font-weight:900;line-height:1.07;letter-spacing:.01em;margin-bottom:.2em;text-shadow:0 2px 16px rgba(0,0,0,.7333333333),0 1px 0 rgba(17,136,17,.8666666667)}.container-negara .content .anak-content .slider{width:100%;z-index:15;position:absolute;bottom:0;left:0;display:flex;align-items:flex-end;justify-content:center;pointer-events:none}.container-negara .content .anak-content .slider .flex{pointer-events:auto;gap:18px}.container-negara .content .anak-content .slider span{cursor:pointer;display:block;height:8px;width:30px;border-radius:10px;background-color:#ffffff30;transition:.35s cubic-bezier(.53,.2,.4,1.08);margin-bottom:23px;box-shadow:0 1px 8px #0004}.container-negara .content .anak-content .slider span:hover{background-color:#fff}.container-negara .content .anak-content .slider span.active{background-color:#fff;width:90px;box-shadow:0 2px 14px #0006}.container-negara .gambar{width:100%;height:100%;overflow:hidden;position:absolute;left:0;top:0;z-index:2}.container-negara .gambar img,.container-negara .gambar video,.container-negara .gambar iframe{position:absolute;z-index:3;top:0;left:0;width:100%;height:100%;object-fit:cover;opacity:0;scale:1;transition:1.2s cubic-bezier(.53,.2,.4,1.08);border:none;background:#161728}.container-negara .gambar img.active,.container-negara .gambar video.active,.container-negara .gambar iframe.active{scale:1.09;opacity:1;transition:1.2s cubic-bezier(.53,.2,.4,1.08);z-index:4}.verify-container{display:flex;align-items:center;justify-content:center;background-color:#0006;position:fixed;top:0;left:0;width:100%;height:100%;padding:2rem 1rem;z-index:1000}.verify-container .close-btn{position:absolute;top:1.25rem;right:1.25rem;background:none;border:none;cursor:pointer;color:var(--hitam);transition:color .2s}.verify-container .close-btn:hover{color:var(--merah)}.verify-container .form-box{background-color:#fff;padding:2rem;max-width:420px;width:100%;border-radius:12px;box-shadow:0 4px 20px #00000014;text-align:center;position:relative;z-index:1001}.verify-container .form-box .title{font-size:1.5rem;font-weight:700;margin-bottom:1rem;color:var(--hitam)}.verify-container .form-box .email-row{display:flex;justify-content:center;align-items:center;gap:8px;flex-wrap:wrap;text-align:center;margin-bottom:1rem}.verify-container .form-box .email-row span{font-size:.95rem;color:#555}.verify-container .form-box .email-row .edit-email-btn{background:none;border:none;cursor:pointer;color:var(--merah);transition:color .2s;font-size:1.2rem;display:flex;align-items:center;padding:4px}.verify-container .form-box .email-row .edit-email-btn:hover{color:var(--merah)}.verify-container .form-box .edit-email-container{display:flex;justify-content:center;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:1rem}.verify-container .form-box .edit-email-container input[type=email]{width:calc(100% - 90px);max-width:250px;padding:8px;border:1px solid #ccc;border-radius:6px;font-size:1rem;transition:border-color .3s}.verify-container .form-box .edit-email-container input[type=email]:focus{border-color:var(--merah);outline:none}.verify-container .form-box .edit-email-container button{padding:8px 12px;background-color:var(--merah);color:#fff;border:none;border-radius:6px;font-size:1rem;cursor:pointer;transition:background-color .3s}.verify-container .form-box .edit-email-container button:hover{background-color:#d9534f}.verify-container .form-box .edit-email-container .error-msg{flex-basis:100%;margin-top:4px;color:red;font-size:.85rem;text-align:center}.verify-container .form-box .otp-inputs{display:flex;justify-content:space-between;gap:.5rem;margin-bottom:1rem}.verify-container .form-box .otp-inputs .otp-input{width:3rem;height:3rem;text-align:center;font-size:1.25rem;border:1px solid #ccc;border-radius:8px;outline:none;transition:border-color .2s,box-shadow .2s;background-color:#fafafa}.verify-container .form-box .otp-inputs .otp-input:focus{border-color:var(--merah);box-shadow:0 0 0 2px #f7374f33}.verify-container .form-box .error-msg{color:red;margin-top:.5rem;font-size:.9rem;min-height:1.2rem}.verify-container .form-box .resend-text{margin-top:1.25rem;font-size:.9rem;color:#555}.verify-container .form-box .resend-text.disabled span{opacity:.7}.verify-container .form-box .resend-text.enabled .resend-btn{background:none;border:none;color:var(--merah);font-weight:700;cursor:pointer;transition:color .2s}.verify-container .form-box .resend-text.enabled .resend-btn:hover{color:var(--merah)}.page-container{padding:0 1rem;max-width:1200px;margin:0 auto}.about-layout{display:flex;flex-direction:column;align-items:center;gap:2rem;margin:4rem auto}@media (min-width: 768px){.about-layout{flex-direction:row;align-items:center;justify-content:space-between}}.about-layout .about-text{flex:1;max-width:600px}.about-layout .about-text h1{font-size:2rem;font-weight:700;color:var(--merah);margin-bottom:1rem}.about-layout .about-text p{font-size:1.1rem;color:var(--hitam);line-height:1.6}.about-layout .about-image{flex:1;max-width:400px}.about-layout .about-image img{width:100%;height:auto;object-fit:contain;border-radius:8px;transition:transform .3s ease}.about-layout .about-image img:hover{transform:scale(1.03)}.client-reviews{margin:4rem 0;text-align:center;padding:0 1rem}.client-reviews h2{color:var(--hitam);font-size:1.5rem;margin-bottom:2rem}.client-reviews .review-swiper{max-width:700px;margin:0 auto}.client-reviews .review-swiper .swiper-pagination-bullet{background-color:var(--abu);opacity:.6}.client-reviews .review-swiper .swiper-pagination-bullet-active{background-color:var(--merah);opacity:1}.client-reviews .review-card{background:var(--putih);padding:2rem;border-radius:12px;box-shadow:0 2px 10px #0000000d}.client-reviews .review-card p{font-style:italic;color:var(--hitam);margin-bottom:1.2rem}.client-reviews .review-card .review-author{display:flex;align-items:center;gap:1rem;justify-content:center}.client-reviews .review-card .review-author img{width:50px;height:50px;border-radius:50%;object-fit:cover}.client-reviews .review-card .review-author div{text-align:left}.client-reviews .review-card .review-author div strong{font-size:1rem;color:var(--merah)}.client-reviews .review-card .review-author div span{font-size:.85rem;color:#666}.about-stats{margin:4rem 0;text-align:center}.about-stats .stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:2rem;max-width:800px;margin:0 auto}.about-stats .stats-grid .stat-box{background:var(--putih);padding:1.5rem;border-radius:12px;box-shadow:0 2px 8px #0000000f}.about-stats .stats-grid .stat-box h3{font-size:2rem;color:var(--merah);font-weight:700;margin-bottom:.5rem}.about-stats .stats-grid .stat-box h3 .counter{transition:all .2s ease;display:inline-block}.about-stats .stats-grid .stat-box p{font-size:1rem;color:var(--hitam)}.about-faq{margin:4rem 0;text-align:center;padding:0 1rem}.about-faq h2{color:var(--hitam);font-size:1.4rem;margin-bottom:2rem;font-weight:700}.about-faq .faq-list{max-width:700px;margin:0 auto;text-align:left}.about-faq .faq-list .faq-item{background:var(--putih);border-radius:10px;margin-bottom:1rem;padding:1rem 1.2rem;box-shadow:0 1px 6px #0000000f;cursor:pointer}.about-faq .faq-list .faq-item h4{margin:0;font-size:1rem;color:var(--hitam)}.about-faq .faq-list .faq-item p{font-size:.95rem;color:#666;margin-top:.5rem}.about-faq .faq-list .faq-item.open{background:var(--abu);border-left:3px solid var(--merah)}.social-proof{background:var(--abu2);padding:.75rem 1rem;font-size:.95rem;color:var(--hitam);font-weight:500;text-align:center}.social-proof marquee{white-space:nowrap}.newsletter{margin:4rem auto;max-width:600px;text-align:center;padding:0 1rem}.newsletter h2{font-size:1.4rem;color:var(--hitam);margin-bottom:1.2rem;font-weight:700}.newsletter form{background:var(--putih);padding:1.5rem;border-radius:12px;box-shadow:0 2px 12px #0000000a;display:flex;flex-direction:column;align-items:center;gap:1rem}@media (min-width: 640px){.newsletter form{flex-direction:row;justify-content:center}}.newsletter form input[type=email]{padding:.75rem 1rem;border-radius:8px;border:1px solid #ccc;width:100%;max-width:300px;font-size:1rem}.newsletter form button{background-color:var(--merah);color:#fff;font-weight:700;border:none;padding:.75rem 1.5rem;border-radius:8px;cursor:pointer;transition:background-color .3s ease}.newsletter form button:hover{background-color:#d8334a}.team-grid-full{margin:5rem 0;text-align:center;padding:0 1rem}.team-grid-full h2{font-size:1.6rem;font-weight:700;color:var(--hitam);margin-bottom:2rem}.team-grid-full .grid{display:flex;flex-wrap:wrap;justify-content:center;gap:2rem}.team-grid-full .grid .team-member{background:var(--putih);padding:2rem 1.5rem;border-radius:16px;box-shadow:0 4px 12px #0000000f;max-width:240px;text-align:center;transition:transform .3s ease;display:flex;flex-direction:column;justify-content:center;align-items:center}.team-grid-full .grid .team-member:hover{transform:translateY(-5px)}.team-grid-full .grid .team-member img{width:90px;height:90px;border-radius:50%;object-fit:cover;margin-bottom:1rem}.team-grid-full .grid .team-member h4{font-size:1.05rem;font-weight:700;color:var(--merah);margin-bottom:.2rem}.team-grid-full .grid .team-member .role{font-size:.9rem;color:#777;margin-bottom:.8rem}.team-grid-full .grid .team-member p{font-size:.95rem;color:var(--hitam);line-height:1.4}.about-timeline{margin:5rem auto;max-width:800px;text-align:center;padding:0 1rem}.about-timeline h2{font-size:1.4rem;color:var(--hitam);margin-bottom:2rem;font-weight:700}.about-timeline .timeline{position:relative;margin-left:1rem;padding-left:1.5rem;border-left:3px solid var(--merah);display:flex;flex-direction:column;gap:2rem}.about-timeline .timeline .timeline-item{position:relative}.about-timeline .timeline .timeline-item .dot{position:absolute;left:-13px;top:.3rem;width:12px;height:12px;border-radius:50%;background:var(--merah);border:2px solid white;box-shadow:0 0 0 2px var(--merah)}.about-timeline .timeline .timeline-item .content h4{margin:0;color:var(--merah);font-weight:700}.about-timeline .timeline .timeline-item .content p{margin:.3rem 0 0;color:var(--hitam);font-size:.95rem}.about-cta{margin:5rem 0 3rem;text-align:center;padding:0 1rem}.about-cta h2{font-size:1.6rem;font-weight:700;color:var(--merah);margin-bottom:1rem}.about-cta p{font-size:1rem;color:var(--hitam);margin-bottom:1.5rem}.about-cta .btn{display:inline-block;padding:.75rem 1.5rem;background-color:var(--merah);color:#fff;border-radius:8px;font-weight:700;text-decoration:none;font-size:1rem;transition:background-color .3s ease}.about-cta .btn:hover{background-color:#d8334a}@media (max-width: 480px){.timeline .content{padding-left:.5rem}.newsletter input{width:100%!important}}.nav{--dropdown-bg: white;--dropdown-hover: #f3f3f3;position:sticky;top:0;width:100%;z-index:100;padding:1rem;transition:background-color .3s ease,box-shadow .3s ease}.nav.top{background-color:#000;color:#fff;--dropdown-bg: #1f1f1f;--dropdown-hover: #2a2a2a}.nav.scrolled{background-color:#fff;color:#111;--dropdown-bg: white;--dropdown-hover: #f3f3f3;box-shadow:0 2px 10px #00000014}.nav .navbar-container{display:flex;justify-content:space-between;align-items:center;max-width:1280px;margin:0 auto;padding-inline:1rem}.nav .logo-web{width:100px;height:auto;cursor:pointer}.nav .logo-web img{width:100%;height:auto;object-fit:contain;display:block}.nav .menu-toggle{background:none;border:none;display:none;cursor:pointer;color:inherit}.nav .menu-right{display:flex;gap:1.5rem;align-items:center;list-style:none}.nav .menu-right li{position:relative;font-size:1rem}.nav .menu-right li a,.nav .menu-right li button{background:none;border:none;color:inherit;cursor:pointer;display:flex;align-items:center;gap:.4rem;font-weight:500}.nav .menu-right li a:hover,.nav .menu-right li button:hover{color:var(--merah)}.nav .menu-right li a.active,.nav .menu-right li button.active{color:var(--merah);font-weight:600}.nav .menu-right li .badge{position:absolute;top:-5px;right:-10px;background:#f7374f;color:#fff;font-size:10px;padding:2px 6px;border-radius:999px}.nav .menu-right .profile-button{display:flex;align-items:center;gap:.4rem;font-weight:600}.nav .menu-right .dropdown-menu{position:absolute;top:120%;left:0;background-color:var(--dropdown-bg);border:1px solid #ddd;border-radius:6px;box-shadow:0 2px 10px #0000000f;display:flex;flex-direction:column;min-width:150px;z-index:999}.nav .menu-right .dropdown-menu a,.nav .menu-right .dropdown-menu button{padding:10px 14px;text-align:left;width:100%;background-color:transparent;color:inherit}.nav .menu-right .dropdown-menu a:hover,.nav .menu-right .dropdown-menu button:hover{background-color:var(--dropdown-hover)}.nav .menu-right .dropdown-menu button{color:#e53935}.nav .language-dropdown{padding:4px 8px;font-size:14px;border:1px solid #ccc;border-radius:6px;background-color:#fff;color:#333}@media (max-width: 768px){.nav .menu-toggle{display:block}.nav .menu-right{flex-direction:column;position:absolute;top:100%;right:0;background-color:#fff;width:200px;padding:1rem;display:none}.nav .menu-right.open{display:flex}.nav .menu-right li{width:100%}.nav .menu-right li a,.nav .menu-right li button{width:100%;justify-content:flex-start}}.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin-bottom:50px}.product-card{background:#e9e9e9;border-radius:20px;box-shadow:0 3px 18px #f5f5f7;padding:0;display:flex;overflow:hidden;flex-direction:column;align-items:stretch;position:relative;transition:box-shadow .16s,transform .12s}.product-card:hover{box-shadow:0 8px 36px #f7374f10;transform:translateY(-2px) scale(1.03)}.product-card:hover .product-actions{opacity:1;pointer-events:all}.product-img-wrap{position:relative;width:100%;height:200px}@media (max-width: 484px){.product-img-wrap{width:100%;height:auto;aspect-ratio:1/1}}.product-img-wrap img{position:absolute;width:100%;height:100%;object-fit:cover;background:#fff;display:block}.product-img-wrap .product-actions{position:absolute;top:9px;right:10px;display:flex;flex-direction:column;gap:9px;opacity:.96;z-index:3}.product-img-wrap .product-actions button{background:#fff;border:none;width:36px;height:36px;border-radius:50%;margin-bottom:2px;box-shadow:0 2px 7px #bbb6b67d;display:flex;align-items:center;justify-content:center;font-size:1.19rem;color:#222;transition:background .13s,color .13s;cursor:pointer}.product-img-wrap .product-actions button:hover{background:#f8e4e9;color:#f7374f}.product-info{text-align:left;padding:1em 1.6em}.product-category{font-size:.97rem;color:#5c5c5c;margin-bottom:2px;font-weight:500}.product-title{font-size:1rem;font-weight:600;margin-bottom:5px;color:#191919;letter-spacing:.04em;text-transform:capitalize}.product-price{font-size:.9rem;color:#d32f2f;font-weight:700;margin-top:1px}@media (max-width: 1276px){.product-grid{grid-template-columns:repeat(3,1fr);gap:14px}}@media (max-width: 766px){.product-grid{grid-template-columns:repeat(2,1fr);gap:14px}}.notif-product{position:fixed;top:70px;left:50%;transform:translate(-50%);background:#222;color:#fff;border-radius:11px;padding:11px 26px;font-size:1.05rem;z-index:1000;opacity:.97;animation:notif-in .2s}@keyframes notif-in{0%{opacity:0;transform:translate(-50%) translateY(14px)}to{opacity:.97;transform:translate(-50%) translateY(0)}}.category-header{color:var(--hitam);font-size:1rem;font-weight:700;margin-bottom:12px;letter-spacing:1px;text-transform:uppercase;padding-left:6px}.product-page{background:var(--abu)}.product-page .bapak-product{min-height:215px;position:relative}.product-page .bapak-product .bg-benner-product img{width:100%;height:230px;object-fit:cover;filter:brightness(.53)}.product-page .bapak-product .banner-overlay-card{position:absolute;top:0;left:0;width:100%;height:230px;display:flex;align-items:center;justify-content:center;z-index:3}.product-page .bapak-product .banner-overlay-card .banner-content{background:#ffffff2b;box-shadow:0 3px 22px #0002;border-radius:24px;padding:28px 20px 20px;-webkit-backdrop-filter:blur(5.5px);backdrop-filter:blur(5.5px);text-align:center;min-width:88vw;max-width:450px;margin:0 auto}@media (max-width: 540px){.product-page .bapak-product .banner-overlay-card .banner-content{padding:18px 10px 12px;min-width:97vw}}.product-page .bapak-product .banner-overlay-card .banner-content h1{color:var(--merah);font-size:2.1rem;font-weight:800;letter-spacing:1px}.product-page .bapak-product .banner-overlay-card .banner-content h1 .emoji{font-size:1.45em;vertical-align:middle;margin-right:7px}.product-page .bapak-product .banner-overlay-card .banner-content .subtitle{color:var(--hitam);font-size:1.08rem;font-weight:400;margin-bottom:18px;opacity:.85;letter-spacing:.1px}.product-page .bapak-product .banner-overlay-card .banner-content .search-container{display:flex;align-items:center;gap:0;border-radius:16px;background:#ffffffbf;padding:3px 8px;box-shadow:0 1px 8px #f7374f10}.product-page .bapak-product .banner-overlay-card .banner-content .search-container input{border:none;outline:none;padding:9px 12px 9px 8px;border-radius:13px;width:100%;font-size:1.05rem;background:transparent;color:var(--hitam)}.product-page .bapak-product .banner-overlay-card .banner-content .search-container .search-icon{color:var(--merah);margin-right:6px}.product-page .product-filter-bar{width:100%;display:flex;justify-content:center;margin-bottom:14px;z-index:7}.product-page .product-filter-bar .filter-card{background:var(--putih);box-shadow:0 3px 18px #0001,0 1.5px 8px #f7374f09;border-radius:18px;display:flex;align-items:center;gap:13px;min-width:260px;padding:11px 28px 11px 22px;position:relative}@media (max-width: 540px){.product-page .product-filter-bar .filter-card{border-radius:12px;gap:7px;padding:9px 7px}}.product-page .product-filter-bar .filter-card .filter-title{color:var(--merah);font-weight:700;font-size:1rem;display:flex;align-items:center}.product-page .product-filter-bar .filter-card select{border:1.5px solid var(--abu-abu-gelap);border-radius:7px;padding:5px 13px;font-size:1rem;color:var(--hitam);background:var(--abu2);margin:0 4px 0 8px;transition:border .17s}.product-page .product-filter-bar .filter-card select:focus{border-color:var(--merah);outline:none}.product-page .product-filter-bar .filter-card .btn-reset-filter{background:var(--abu2);color:var(--merah);border:1.2px solid var(--merah);border-radius:8px;font-size:.99rem;padding:5px 13px;font-weight:500;cursor:pointer;transition:background .15s,color .13s;margin-left:3px}.product-page .product-filter-bar .filter-card .btn-reset-filter:hover{background:var(--merah);color:#fff}.product-page .product-filter-bar .filter-card .chip.selected-cat{background:var(--merah);color:#fff;border-radius:10px;padding:6px 14px 6px 12px;display:flex;align-items:center;font-weight:500;font-size:.97rem;margin-left:9px}.product-page .product-filter-bar .filter-card .chip.selected-cat button{border:none;background:none;color:#fff;font-size:1.11em;margin-left:8px;cursor:pointer;font-weight:700}.product-page .product-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px;padding:14px 3px 34px;background:transparent}@media (min-width: 650px){.product-page .product-grid{grid-template-columns:repeat(3,1fr);gap:22px}}@media (min-width: 900px){.product-page .product-grid{grid-template-columns:repeat(4,1fr);gap:28px}}.product-page .product-grid .product-item{background:var(--putih);border-radius:15px;box-shadow:0 4px 24px #f7374f08,0 2px 10px #0001;position:relative;display:flex;flex-direction:column;align-items:stretch;min-height:205px;padding:13px 7px 17px;transition:box-shadow .15s,transform .13s;cursor:pointer}.product-page .product-grid .product-item:hover{box-shadow:0 8px 32px var(--merah-gelap),0 4px 16px #00000014;transform:translateY(-3px) scale(1.018)}.product-page .product-grid .product-item .product-image-container{width:100%;display:flex;align-items:center;justify-content:center;margin-bottom:11px}.product-page .product-grid .product-item .product-image{width:92%;aspect-ratio:1.13/1;object-fit:contain;border-radius:10px;background:var(--abu2);box-shadow:0 2.5px 11px #f7374f13;transition:box-shadow .12s}.product-page .product-grid .product-item .product-info{display:flex;flex-direction:column;align-items:flex-start;gap:6px}.product-page .product-grid .product-item .product-info h3{font-size:1.04rem;font-weight:700;color:var(--hitam);margin-bottom:2px;letter-spacing:.03em;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.product-page .product-grid .product-item .product-info .price{color:var(--merah);font-size:1.12rem;font-weight:700;margin-bottom:5px}.product-page .product-grid .product-item .product-info .add-to-cart{margin-top:6px;background:var(--merah);color:#fff;border:none;border-radius:7px;font-size:1.23rem;font-weight:700;width:100%;padding:10px 0 7px;box-shadow:0 2px 10px #f7374f12;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .14s}.product-page .product-grid .product-item .product-info .add-to-cart svg{font-size:1.28em;margin-bottom:-1px}.product-page .product-grid .product-item .product-info .add-to-cart:hover{background:var(--merah-gelap)}.product-page .product-grid .loading,.product-page .product-grid .no-products{display:flex;flex-direction:column;align-items:center;color:var(--merah);font-weight:600;margin-top:22px;opacity:.8}@media (max-width: 540px){.product-page .product-grid{gap:9px}.product-page .product-grid .product-item{min-height:145px;padding:7px 3px 8px}.product-page .product-grid .product-image{border-radius:8px}.product-page .product-grid .product-info h3{font-size:.94rem}.product-page .product-grid .product-info .price{font-size:.97rem}.product-page .product-grid .add-to-cart{padding:8px 0}.product-page .product-filter-bar .filter-card{border-radius:12px;gap:7px;padding:9px 7px}}@keyframes slide-up{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}.product-detail-page{display:flex;flex-direction:column;min-height:100vh;background-color:var(--abu2, #f6f7fb);font-family:Inter,sans-serif;color:var(--hitam, #232323)}.product-detail-header{display:flex;justify-content:space-between;align-items:center;padding:.8rem 1rem;background-color:var(--putih, #ffffff);position:sticky;top:0;z-index:200;box-shadow:0 1px 2px #0000000d}.product-detail-header .header-action-button{background:none;border:none;padding:0;cursor:pointer;font-family:inherit;color:inherit;padding:.6rem;border-radius:50%;transition:background .2s ease}.product-detail-header .header-action-button svg{width:20px;height:20px}.product-detail-header .header-action-button:hover{background-color:#f0f0f0}.product-detail-header .header-action-button.wishlist-button-header svg{width:22px;height:22px}.product-detail-header .header-action-button.wishlist-button-header svg.wishlisted{color:var(--merah, #f7374f)}.product-detail-header .header-title{font-size:1.05rem;font-weight:600;flex-grow:1;text-align:center;margin:0 .5rem}.product-detail-main-content{flex-grow:1;padding-bottom:7rem}.product-gallery-column{background:var(--putih, #ffffff)}.product-gallery-column .product-image-container{padding:1rem}.product-gallery-column .product-image-container .product-image-main{width:100%;max-height:60vh;object-fit:cover;border-radius:16px}.product-info-column{background:var(--putih, #ffffff);padding:1.5rem;margin-top:-2rem;border-top-left-radius:24px;border-top-right-radius:24px;position:relative;box-shadow:0 -6px 16px #0000000f}.product-info-column .product-info-header{margin-bottom:.75rem}.product-info-column .product-info-header .product-name{font-size:1.85rem;font-weight:700}.product-info-column .product-info-header .product-category-tag{background-color:#eef1f5;color:#5f6c7b;padding:.3rem .8rem;font-size:.7rem;font-weight:500;border-radius:1rem;text-transform:uppercase}.product-info-column .product-price{font-size:1.1rem;font-weight:700;margin-bottom:.5rem}.product-info-column .product-stock-info{font-size:.9rem;font-weight:500;margin-bottom:1.5rem;color:var(--hitam, #232323)}.product-info-column .product-description-container{margin-bottom:2rem}.product-info-column .product-description-container .description-title{font-weight:600;margin-bottom:.5rem;border-bottom:1px solid var(--abu-abu, #e9ecef);padding-bottom:.5rem}.product-info-column .product-description-container .product-description{color:#5f6c7b;line-height:1.75;white-space:pre-wrap}.product-actions-container{display:none}.floating-action-mobile{position:fixed;bottom:80px;left:0;right:0;width:100vw;background-color:#fff;padding:12px 16px;display:flex;gap:10px;z-index:200;box-shadow:0 -2px 10px #00000014}.floating-btn{flex:1;font-size:14px;padding:10px;border:none;border-radius:6px;font-weight:600}.floating-btn.cart{background-color:#e0e0e0;color:#333}.floating-btn.checkout{background-color:var(--merah, #f7374f);color:#fff}.product-detail-loading,.product-detail-error,.product-detail-not-found{display:flex;justify-content:center;align-items:center;min-height:50vh;text-align:center;padding:2rem}.product-detail-loading p,.product-detail-error p,.product-detail-not-found p{font-size:1rem;color:#5f6c7b}.product-detail-error p{color:var(--merah, #f7374f);font-weight:600}@media (min-width: 1024px){.product-detail-header{display:none}.product-detail-main-content{display:grid;grid-template-columns:1fr 1fr;gap:3rem;padding:3rem;max-width:1320px;margin:0 auto}.product-gallery-column{position:sticky;top:6rem}.product-gallery-column .product-image-container{padding:0}.product-gallery-column .product-image-container .product-image-main{border-radius:20px;background:var(--putih, #ffffff);box-shadow:0 12px 30px #0000001f;aspect-ratio:4/3}.product-info-column{margin-top:0;border-radius:0;box-shadow:none;padding:.5rem;background:transparent;display:flex;flex-direction:column}.product-info-column .product-description-container{margin-bottom:2rem}.product-actions-container{display:block;margin-top:auto}.product-actions-container .product-actions-desktop{display:flex;align-items:center;gap:1rem;padding-top:1.5rem}.product-actions-container .product-actions-desktop .add-to-cart-button.main-action-button{flex-grow:1;padding:1rem 2rem;font-size:1rem;background-color:var(--hitam);color:#fff;border-radius:10px}.product-actions-container .product-actions-desktop .add-to-cart-button.main-action-button:hover{background-color:#333}.floating-action-mobile{display:none}}.cart-container{display:flex;flex-direction:column;gap:2rem;padding:2rem;max-width:1200px;margin:auto}.cart-list{display:flex;flex-direction:column;gap:1.5rem}.cart-item{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;background-color:var(--putih);padding:1rem;border-radius:10px;box-shadow:0 4px 12px #0000000d;gap:1rem;transition:box-shadow .3s ease}.cart-item:hover{box-shadow:0 6px 16px #0000001a}.cart-item img{width:80px;height:80px;object-fit:cover;border-radius:8px}.cart-item .item-info{flex:1;display:flex;flex-direction:column;gap:.3rem;min-width:150px}.cart-item .item-info h3{margin:0;font-size:1.1rem;color:var(--hitam);font-weight:600}.cart-item .item-info p{margin:0;font-size:.95rem;color:#555}.cart-item .quantity-control{display:flex;align-items:center;gap:.5rem}.cart-item .quantity-control button{background-color:var(--abu-abu-gelap);color:var(--hitam);border:none;padding:.4rem .8rem;border-radius:6px;font-size:1rem;font-weight:700;cursor:pointer;transition:background-color .3s ease}.cart-item .quantity-control button:hover{background-color:var(--oren);color:var(--putih)}.cart-item .quantity-control span{min-width:28px;text-align:center;font-weight:700;font-size:1rem}.cart-item .delete-btn{background-color:transparent;border:1px solid var(--merah);color:var(--merah);padding:.4rem .8rem;border-radius:6px;cursor:pointer;font-weight:700;transition:.3s ease}.cart-item .delete-btn:hover{background-color:var(--merah);color:var(--putih)}.cart-summary{background-color:var(--putih);border-radius:10px;padding:1.5rem;box-shadow:0 2px 12px #00000014;display:flex;flex-direction:column;align-items:flex-end;gap:1rem;max-width:350px;margin-left:auto}.cart-summary .total-price{font-size:1.2rem;font-weight:700;color:var(--hitam)}.cart-summary .checkout-btn{background-color:var(--hitam);color:var(--putih);padding:.75rem 2rem;font-size:1rem;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:background-color .3s ease}.cart-summary .checkout-btn:hover{background-color:var(--merah)}@media (max-width: 992px){.cart-item{flex-direction:column;align-items:flex-start}.cart-item img{width:70px;height:70px}.cart-item .item-info h3{font-size:1rem}.cart-item .quantity-control button,.cart-item .delete-btn{font-size:.9rem}.cart-summary{width:100%;margin-left:0;align-items:center;text-align:center}}@media (max-width: 576px){.cart-container{padding:1rem}.cart-item{display:grid;grid-template-columns:60px 1fr auto;grid-template-rows:auto auto;grid-gap:.5rem;align-items:center;padding:.8rem}.cart-item img{grid-row:span 2;width:60px;height:60px;object-fit:cover;border-radius:6px}.cart-item .item-info{grid-column:2/3;gap:.2rem}.cart-item .item-info h3{font-size:.95rem;margin-bottom:0}.cart-item .item-info p{font-size:.8rem;color:#666}.cart-item .quantity-control{grid-column:2/3;display:flex;align-items:center;gap:.3rem}.cart-item .quantity-control button{padding:.2rem .5rem;font-size:.8rem}.cart-item .quantity-control span{font-size:.9rem}.cart-item .delete-btn{grid-column:3/4;grid-row:span 2;font-size:.75rem;padding:.4rem .6rem}.cart-summary{width:100%;padding:1rem;margin-left:0;align-items:center;text-align:center}.cart-summary .total-price{font-size:1.1rem;margin-bottom:.5rem}.cart-summary .checkout-btn{width:100%;padding:.75rem;font-size:1rem;border-radius:8px}}.payment-methods{margin-top:1.5rem}.payment-methods label{font-weight:600;display:block;margin-bottom:.5rem;font-size:1rem;color:#333}.bank-category-label{margin-top:2rem;font-weight:600;font-size:1rem;border-top:1px solid #eee;padding-top:1rem;color:#444}.bank-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:1rem;margin-top:1rem}.bank-grid-item{padding:.5rem;background-color:#f9f9f9;border:2px solid transparent;border-radius:10px;cursor:pointer;transition:all .2s ease-in-out;display:flex;justify-content:center;align-items:center;height:60px;box-shadow:0 1px 2px #0000000d}.bank-grid-item img{max-height:36px;max-width:100%;object-fit:contain}.bank-grid-item.selected{border-color:var(--merah, #e63946);background-color:#fff;box-shadow:0 0 0 2px #e6394633}@media (max-width: 480px){.bank-grid-item{height:48px}.bank-grid{grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:.75rem}.bank-grid-item img{max-height:30px}}.checkout-page .form-section{display:flex;flex-direction:column;gap:1.5rem;margin-bottom:2rem}.checkout-page .form-section input,.checkout-page .form-section textarea{width:100%;padding:1rem;border:2px solid #e0e0e0;border-radius:10px;background-color:#fafafa;font-size:1rem;transition:border-color .3s ease,background-color .3s ease;box-shadow:inset 0 1px 2px #00000008}.checkout-page .form-section input:focus,.checkout-page .form-section textarea:focus{outline:none;border-color:var(--merah, #e63946);background-color:#fff}.checkout-page .form-section input::placeholder,.checkout-page .form-section textarea::placeholder{color:#999;font-style:italic}.checkout-page .form-section textarea{min-height:120px;resize:vertical}.checkout-page .form-section label{font-weight:600;margin-bottom:.25rem;color:#333}.phone-input{display:flex;align-items:center;border:2px solid #e0e0e0;border-radius:10px;overflow:hidden;background:#fafafa;box-shadow:inset 0 1px 2px #00000008}.phone-input .country-code{background:#f0f0f0;padding:1rem;font-size:1rem;color:#444;border-right:1px solid #ddd;display:flex;align-items:center}.phone-input input[type=tel]{border:none;padding:1rem;flex:1;outline:none;font-size:1rem;background:transparent}.payment-info-page{max-width:960px;margin:40px auto;padding:24px;background-color:#f9fafb;border-radius:16px;box-shadow:0 6px 20px #0000000d;font-family:Segoe UI,sans-serif}.payment-info-page .payment-header{text-align:center;margin-bottom:24px}.payment-info-page .payment-header h1{font-size:2.2rem;font-weight:700;color:#1f2937}.payment-info-page .payment-header .order-id{font-size:1rem;color:#6b7280;margin-top:6px}.payment-info-page .payment-status{background-color:#fff;padding:16px 20px;border-left:5px solid #60a5fa;border-radius:10px;margin-bottom:24px;font-size:1.05rem}.payment-info-page .payment-status p{display:flex;align-items:center;gap:10px}.payment-info-page .payment-status p .icon-pending{color:#f59e0b;animation:rotate 1s linear infinite}.payment-info-page .payment-status p .icon-success{color:#10b981;animation:pulse 1.5s ease-in-out infinite}.payment-info-page .payment-status p .icon-failed{color:#ef4444}.payment-info-page .payment-summary{background:#fff;padding:20px;border-radius:12px;margin-bottom:24px}.payment-info-page .payment-summary h2{font-size:1.3rem;font-weight:600;margin-bottom:12px;color:#1f2937}.payment-info-page .payment-summary .item-list{display:flex;flex-direction:column;gap:16px}.payment-info-page .payment-summary .item-list .item{display:flex;gap:1rem;background-color:#f3f4f6;border-radius:10px;padding:12px}.payment-info-page .payment-summary .item-list .item img{width:64px;height:64px;object-fit:cover;border-radius:8px}.payment-info-page .payment-summary .item-list .item .info{display:flex;flex-direction:column}.payment-info-page .payment-summary .item-list .item .info h4{font-size:1rem;font-weight:600;margin-bottom:4px;color:#111827}.payment-info-page .payment-summary .item-list .item .info p{margin:0;font-size:.95rem;color:#4b5563}.payment-info-page .payment-instructions{background-color:#fff;padding:20px;border-radius:12px;margin-bottom:24px}.payment-info-page .payment-instructions h2{font-size:1.2rem;font-weight:600;color:#111827;margin-bottom:10px}.payment-info-page .payment-instructions p{font-size:.95rem;margin:6px 0;color:#374151}.payment-info-page .payment-instructions .payment-method-box{margin-top:16px;padding:16px;background:#f9fafb;border-radius:10px;border-left:4px solid #3b82f6}.payment-info-page .payment-instructions .payment-method-box h3{display:flex;align-items:center;gap:8px;font-size:1.05rem;font-weight:600;color:#1e3a8a;margin-bottom:8px}.payment-info-page .payment-instructions .payment-method-box p{margin:4px 0;font-size:.95rem;color:#374151}.payment-info-page .payment-instructions .payment-method-box img{max-width:200px;margin-top:12px;border-radius:8px;border:1px solid #e5e7eb}.payment-info-page .payment-instructions .payment-method-box .copy-button{margin-top:12px;background:#3b82f6;color:#fff;border:none;padding:10px 14px;font-size:.95rem;font-weight:600;border-radius:8px;cursor:pointer;display:flex;align-items:center;gap:8px;transition:background-color .2s ease}.payment-info-page .payment-instructions .payment-method-box .copy-button:hover{background-color:#2563eb}.payment-info-page .status-message{padding:16px;border-radius:10px;font-weight:600;font-size:1.1rem;display:flex;align-items:center;justify-content:center;gap:12px;margin-top:20px}.payment-info-page .status-message.success{background-color:#ecfdf5;color:#047857}.payment-info-page .status-message.failed{background-color:#fef2f2;color:#b91c1c}.payment-info-page .status-message .icon-success,.payment-info-page .status-message .icon-failed{font-size:1.5rem}.payment-info-page .text-center{text-align:center;margin-top:24px;font-size:.95rem;color:#6b7280}.payment-info-page .loading-spinner{text-align:center;font-size:2rem;color:#3b82f6;margin-top:80px}.payment-info-page .loading-spinner .spin-icon{animation:rotate 1s linear infinite}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.08)}to{transform:scale(1)}}@media (max-width: 768px){.payment-info-page{padding:20px}.payment-info-page h1{font-size:1.75rem}.payment-info-page .item img{width:56px;height:56px}.payment-info-page .copy-button{width:100%;justify-content:center}}@media (max-width: 480px){.payment-info-page{padding:16px}.payment-info-page h1{font-size:1.5rem}.payment-info-page .info h4{font-size:.95rem}.payment-info-page .status-message{font-size:1rem}}.history-page{max-width:960px;margin:2rem auto;padding:2rem;font-family:Segoe UI,sans-serif}.history-page h1{text-align:center;font-size:2rem;margin-bottom:2rem;color:var(--hitam)}.history-page .loading,.history-page .error,.history-page .empty{text-align:center;font-size:1.1rem;margin-top:2rem;color:#555}.history-page .order-list{display:flex;flex-direction:column;gap:2rem}.history-page .order-card{background:#fff;padding:1.5rem;border-radius:10px;box-shadow:0 4px 12px #0000000d}.history-page .order-card .order-header{display:flex;justify-content:space-between;font-weight:600;margin-bottom:1rem}.history-page .order-card .order-header .status{text-transform:capitalize;padding:.2rem .6rem;border-radius:5px;font-size:.85rem}.history-page .order-card .order-header .status.pending{background-color:#fff3cd;color:#856404}.history-page .order-card .order-header .status.success{background-color:#d4edda;color:#155724}.history-page .order-card .order-header .status.failed{background-color:#f8d7da;color:#721c24}.history-page .order-card .order-items{display:flex;flex-direction:column;gap:1rem}.history-page .order-card .order-items .order-item{display:flex;gap:1rem;align-items:center;padding:.75rem;background-color:#f9f9f9;border-radius:8px}.history-page .order-card .order-items .order-item img{width:70px;height:70px;object-fit:cover;border-radius:6px}.history-page .order-card .order-items .order-item .details{flex:1}.history-page .order-card .order-items .order-item .details p{margin:.2rem 0;font-size:.95rem;color:#333}.history-page .order-card .order-items .order-item .details p.name{font-weight:700;font-size:1rem}.history-page .order-card .order-total{text-align:right;margin-top:1rem;font-weight:600;font-size:1.1rem;color:var(--merah)}@media (max-width: 768px){.history-page,.history-page .order-card{padding:1rem}.history-page .order-item{flex-direction:column;align-items:flex-start}.history-page .order-total{text-align:left}}.thankyou-wrapper{display:flex;justify-content:center;align-items:center;min-height:100vh;background:linear-gradient(135deg,#101820,#1e1e2e);padding:2rem}.thankyou-wrapper .thankyou-container{background:#fff;border-radius:1.5rem;padding:2.5rem 2rem;max-width:500px;width:100%;text-align:center;box-shadow:0 0 30px #00000026;animation:fadeIn .6s ease-out}.thankyou-wrapper .thankyou-container .thankyou-icon{font-size:3.5rem;margin-bottom:1.2rem}.thankyou-wrapper .thankyou-container h1{color:#1f4e79;font-size:1.9rem;margin-bottom:.8rem}.thankyou-wrapper .thankyou-container .thankyou-text{color:#444;font-size:1rem;line-height:1.6;margin-bottom:2rem}.thankyou-wrapper .thankyou-container .thankyou-loading{font-size:.95rem;color:#666;margin-bottom:2rem}.thankyou-wrapper .thankyou-container .thankyou-meta{background:#f8f9fa;padding:1rem 1.25rem;border-radius:.75rem;margin-bottom:2rem;font-size:.95rem;text-align:left}.thankyou-wrapper .thankyou-container .thankyou-meta ul{margin-top:.5rem;padding-left:1.25rem}.thankyou-wrapper .thankyou-container .thankyou-meta ul li{list-style:disc;margin-bottom:.4rem;color:#444}.thankyou-wrapper .thankyou-container .thankyou-meta code{background:#eef1f4;padding:.25rem .5rem;border-radius:.4rem;font-family:monospace;font-size:.9rem;color:#333}.thankyou-wrapper .thankyou-container .thankyou-meta p{margin:.4rem 0}.thankyou-wrapper .thankyou-container .thankyou-actions{display:flex;flex-direction:column;gap:1rem}.thankyou-wrapper .thankyou-container .thankyou-actions .btn-home,.thankyou-wrapper .thankyou-container .thankyou-actions .btn-orders{display:block;padding:.75rem 1.5rem;border-radius:.6rem;text-decoration:none;font-weight:700;transition:all .2s ease}.thankyou-wrapper .thankyou-container .thankyou-actions .btn-home{background-color:#38b000;color:#fff}.thankyou-wrapper .thankyou-container .thankyou-actions .btn-home:hover{background-color:#2d8e00}.thankyou-wrapper .thankyou-container .thankyou-actions .btn-orders{background-color:#06c;color:#fff}.thankyou-wrapper .thankyou-container .thankyou-actions .btn-orders:hover{background-color:#004a99}@keyframes fadeIn{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}@media (max-width: 480px){.thankyou-container{padding:2rem 1.2rem}.thankyou-container h1{font-size:1.5rem}.thankyou-container .thankyou-text{font-size:.95rem}.thankyou-container .thankyou-icon{font-size:3rem}}@media (max-width: 768px){.thankyou-wrapper{padding:1rem}.thankyou-wrapper .thankyou-container{max-width:90%;padding:2rem}}.admin-product-list{padding:2rem;max-width:1200px;margin:1.5rem auto;background-color:var(--putih);border-radius:8px;box-shadow:0 4px 12px #00000014;color:var(--hitam)}.admin-product-list__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1px solid var(--abu-abu-gelap)}.admin-product-list__header h1{margin:0;color:var(--hitam);font-size:1.8rem}.admin-product-list__add-button{padding:.5rem 1rem;border:none;border-radius:.25rem;cursor:pointer;font-weight:600;transition:background-color .2s ease,transform .1s ease;background-color:var(--merah);color:var(--putih);padding:1rem 1.5rem;font-size:1rem}.admin-product-list__add-button:hover{filter:brightness(1.1);transform:translateY(-1px)}.admin-product-list__add-button:active{transform:translateY(0)}.admin-product-list__add-button:disabled{opacity:.6;cursor:not-allowed;filter:none;transform:none}.admin-product-list__filters{display:flex;gap:1rem;margin-bottom:1.5rem}.admin-product-list__filters input[type=text],.admin-product-list__filters select{flex:1;width:100%;padding:.625rem 1rem;border:1px solid var(--abu-abu-gelap);border-radius:.375rem;font-size:.95rem;color:var(--hitam);background-color:var(--input-bg);transition:border-color .2s ease,box-shadow .2s ease;line-height:1.5}.admin-product-list__filters input[type=text]:focus,.admin-product-list__filters select:focus{border-color:var(--merah);outline:none;box-shadow:0 0 0 .2rem rgba(var(--merah),.25)}.admin-product-list__loading,.admin-product-list__no-products{text-align:center;padding:2rem;color:var(--hitam);font-style:italic}.admin-product-list__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem;margin-bottom:1.5rem}.admin-product-list .admin-product-card{border:1px solid var(--abu-abu-gelap);border-radius:8px;overflow:hidden;box-shadow:0 4px 12px #00000014;display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease;background-color:var(--putih)}.admin-product-list .admin-product-card:hover{transform:translateY(-3px);box-shadow:0 6px 15px #0000001f}.admin-product-list .admin-product-card__image{width:100%;height:200px;object-fit:cover;border-bottom:1px solid var(--abu-abu-gelap)}.admin-product-list .admin-product-card__details{padding:1rem;flex-grow:1}.admin-product-list .admin-product-card__name{font-size:1.25rem;color:var(--merah);margin-top:0;margin-bottom:.5rem}.admin-product-list .admin-product-card__category,.admin-product-list .admin-product-card__price{font-size:.9rem;color:var(--hitam);margin-bottom:.5rem}.admin-product-list .admin-product-card__price{font-weight:600;color:var(--hitam)}.admin-product-list .admin-product-card__actions{display:flex;justify-content:space-around;padding:1rem;border-top:1px solid var(--abu-abu-gelap);background-color:var(--abu)}.admin-product-list .admin-product-card__button{flex:1;margin:.5rem;padding:.5rem 1rem;border:none;border-radius:.25rem;cursor:pointer;font-weight:600;transition:background-color .2s ease,transform .1s ease;background-color:var(--abu);color:var(--hitam)}.admin-product-list .admin-product-card__button:hover{filter:brightness(1.1);transform:translateY(-1px)}.admin-product-list .admin-product-card__button:active{transform:translateY(0)}.admin-product-list .admin-product-card__button:disabled{opacity:.6;cursor:not-allowed;filter:none;transform:none}.admin-product-list .admin-product-card__button--edit,.admin-product-list .admin-product-card__button--delete{background-color:var(--merah)}.admin-product-list__pagination{display:flex;justify-content:center;gap:.5rem;margin-top:1.5rem}.admin-product-list__pagination-button{padding:.5rem 1rem;border:none;border-radius:.25rem;cursor:pointer;font-weight:600;transition:background-color .2s ease,transform .1s ease;background-color:var(--abu);color:var(--hitam);min-width:40px;padding:.5rem;font-size:.9rem}.admin-product-list__pagination-button:hover{filter:brightness(1.1);transform:translateY(-1px)}.admin-product-list__pagination-button:active{transform:translateY(0)}.admin-product-list__pagination-button:disabled{opacity:.6;cursor:not-allowed;filter:none;transform:none}.admin-product-list__pagination-button--active{background-color:var(--merah);color:var(--putih);pointer-events:none}--- .add-product-container{padding:2rem;max-width:900px;margin:1.5rem auto;background-color:var(--putih);border-radius:8px;box-shadow:0 4px 12px #00000014;color:var(--hitam)}--- .add-product-container h1{text-align:center;margin-bottom:3rem;color:var(--merah);font-size:2.2rem;font-weight:700}--- .add-product-container .error-display{text-align:center;padding:1rem;color:var(--merah);background-color:rgba(var(--merah),.1);border:1px solid var(--merah);border-radius:4px;margin-bottom:1.5rem}--- .add-product-container .add-product-form{display:flex;flex-direction:column;gap:1.5rem}--- .add-product-container .add-product-form .form-grid{display:grid;gap:1.5rem;grid-template-columns:1fr}@media (min-width: 768px){--- .add-product-container .add-product-form .form-grid{grid-template-columns:repeat(2,1fr);grid-template-areas:"name price" "stock image" "shopee status" "category ." "description description"}}--- .add-product-container .add-product-form .form-group{display:flex;flex-direction:column;gap:.5rem}--- .add-product-container .add-product-form .form-group label{font-weight:600;color:var(--hitam);font-size:1rem;margin-bottom:.25rem}--- .add-product-container .add-product-form .form-group .required-star{color:var(--merah);margin-left:.25rem}--- .add-product-container .add-product-form .form-group input[type=text],--- .add-product-container .add-product-form .form-group input[type=number],--- .add-product-container .add-product-form .form-group select{width:100%;padding:.625rem 1rem;border:1px solid var(--abu-abu-gelap);border-radius:.375rem;font-size:.95rem;color:var(--hitam);background-color:var(--input-bg);transition:border-color .2s ease,box-shadow .2s ease;line-height:1.5}--- .add-product-container .add-product-form .form-group input[type=text]:focus,--- .add-product-container .add-product-form .form-group input[type=number]:focus,--- .add-product-container .add-product-form .form-group select:focus{border-color:var(--merah);outline:none;box-shadow:0 0 0 .2rem rgba(var(--merah),.25)}--- .add-product-container .add-product-form .form-group textarea{width:100%;padding:.625rem 1rem;border:1px solid var(--abu-abu-gelap);border-radius:.375rem;font-size:.95rem;color:var(--hitam);background-color:var(--input-bg);transition:border-color .2s ease,box-shadow .2s ease;line-height:1.5;min-height:120px;resize:vertical}--- .add-product-container .add-product-form .form-group textarea:focus{border-color:var(--merah);outline:none;box-shadow:0 0 0 .2rem rgba(var(--merah),.25)}@media (min-width: 768px){--- .add-product-container .add-product-form .form-group--name{grid-area:name}}@media (min-width: 768px){--- .add-product-container .add-product-form .form-group--price{grid-area:price}}@media (min-width: 768px){--- .add-product-container .add-product-form .form-group--stock{grid-area:stock}}@media (min-width: 768px){--- .add-product-container .add-product-form .form-group--image{grid-area:image}}@media (min-width: 768px){--- .add-product-container .add-product-form .form-group--shopee{grid-area:shopee}}@media (min-width: 768px){--- .add-product-container .add-product-form .form-group--status{grid-area:status}}@media (min-width: 768px){--- .add-product-container .add-product-form .form-group--category{grid-area:category}}@media (min-width: 768px){--- .add-product-container .add-product-form .form-group--description{grid-area:description}}--- .add-product-container .add-product-form .form-group input[type=file]{width:100%;padding:.625rem 1rem;border:1px solid var(--abu-abu-gelap);border-radius:.375rem;font-size:.95rem;color:var(--hitam);background-color:var(--input-bg);transition:border-color .2s ease,box-shadow .2s ease;line-height:1.5;cursor:pointer;padding:.5rem}--- .add-product-container .add-product-form .form-group input[type=file]:focus{border-color:var(--merah);outline:none;box-shadow:0 0 0 .2rem rgba(var(--merah),.25)}--- .add-product-container .add-product-form .form-group input[type=file]:hover{border-color:var(--merah)}--- .add-product-container .add-product-form .form-group .image-preview{margin-top:1rem;text-align:center;background-color:var(--abu);padding:1rem;border-radius:4px}--- .add-product-container .add-product-form .form-group .image-preview .product-image-preview{max-width:250px;height:auto;border-radius:4px;border:1px solid var(--abu-abu-gelap);box-shadow:0 2px 8px #0000001a}--- .add-product-container .add-product-form .message{text-align:center;padding:1rem;border-radius:4px;font-weight:500;margin-top:1rem}--- .add-product-container .add-product-form .message--error{color:var(--merah);background-color:rgba(var(--merah),.1);border:1px solid var(--merah)}--- .add-product-container .add-product-form .message--success{color:var(--hijau);background-color:rgba(var(--hijau),.1);border:1px solid var(--hijau)}--- .add-product-container .add-product-form button[type=submit]{padding:.5rem 1rem;border:none;border-radius:.25rem;cursor:pointer;font-weight:600;transition:background-color .2s ease,transform .1s ease;background-color:var(--merah);color:var(--putih);padding:1rem 1.5rem;font-size:1.1rem;width:100%;max-width:300px;margin:2rem auto 1rem}--- .add-product-container .add-product-form button[type=submit]:hover{filter:brightness(1.1);transform:translateY(-1px)}--- .add-product-container .add-product-form button[type=submit]:active{transform:translateY(0)}--- .add-product-container .add-product-form button[type=submit]:disabled{opacity:.6;cursor:not-allowed;filter:none;transform:none}.admin-category-container{max-width:820px;margin:34px auto;background:var(--putih);border-radius:14px;box-shadow:0 4px 18px #23222b11;padding:30px 28px 34px}.admin-category-container .header-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.admin-category-container .header-bar h1{font-size:2rem;font-weight:700;color:var(--merah);letter-spacing:1px}.admin-category-container .header-bar .btn-primary{background:var(--merah);color:#fff;border:none;border-radius:7px;padding:8px 22px;font-size:1rem;font-weight:600;cursor:pointer;transition:background .18s}.admin-category-container .header-bar .btn-primary:hover{background:#d02a3c}.admin-category-container .category-table-wrap{overflow-x:auto}.admin-category-container .category-table{width:100%;border-collapse:collapse;margin-bottom:8px}.admin-category-container .category-table th,.admin-category-container .category-table td{padding:11px 8px;text-align:center}.admin-category-container .category-table th{background:var(--abu2);font-weight:700}.admin-category-container .category-table tr:nth-child(2n) td{background:var(--abu)}.admin-category-container .category-table tr{transition:background .13s}.admin-category-container .category-table .img-thumb{width:66px;height:38px;object-fit:cover;border-radius:6px;border:1px solid var(--abu-abu-gelap);background:#eee}.admin-category-container .category-table .btn-action{padding:6px 14px;border-radius:6px;font-weight:600;border:none;cursor:pointer;margin:0 3px}.admin-category-container .category-table .btn-action.edit{background:var(--oren);color:#fff}.admin-category-container .category-table .btn-action.delete{background:var(--merah);color:#fff}.admin-category-container .category-table .btn-action:hover{opacity:.87}.category-modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1401;background:#2828282e;display:flex;align-items:center;justify-content:center}.category-modal{background:var(--putih);padding:36px 36px 28px;border-radius:13px;min-width:340px;box-shadow:0 8px 32px #23222b29;position:relative;z-index:1410}.category-modal h2{font-size:1.32rem;color:var(--merah);margin-bottom:18px;text-align:center}.category-modal form{display:flex;flex-direction:column;gap:13px}.category-modal form label{display:flex;flex-direction:column;text-align:left;font-weight:600;color:#23222b;font-size:.97rem;margin-bottom:2px}.category-modal form label input{margin-top:5px;padding:9px 12px;border-radius:7px;border:1px solid #ddd;font-size:1rem;background:#f9f9fc;transition:border .17s}.category-modal form label input:focus{border:1.3px solid var(--merah);outline:none;background:#fff}.category-modal form .form-buttons{display:flex;gap:11px;justify-content:flex-end;margin-top:8px}.category-modal form .form-buttons .btn-primary{background:var(--hijau);color:#fff;border:none;border-radius:7px;padding:8px 20px;font-size:1rem;font-weight:600;cursor:pointer}.category-modal form .form-buttons .btn-primary:hover{background:#319956}.category-modal form .form-buttons .btn-cancel{background:#eee;color:#444;border:none;border-radius:7px;padding:8px 15px;font-size:1rem;cursor:pointer}.category-modal form .form-buttons .btn-cancel:hover{background:#e6e6e6}.drag-drop-upload{border:2px dashed var(--abu-abu-gelap, #d9d9d9);border-radius:9px;min-height:80px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;padding:14px;background:#fafcff;transition:border-color .18s;margin-top:6px;margin-bottom:8px}.drag-drop-upload:hover{border-color:var(--merah, #f7374f);background:#f7f8fc}.drag-drop-upload .drag-drop-placeholder{display:flex;flex-direction:column;align-items:center;color:#888;font-size:.97rem}.drag-drop-upload .img-preview{margin-bottom:6px;max-width:120px;max-height:90px;border-radius:8px}@media (max-width: 600px){.admin-category-container{padding:10px 2px}.admin-category-container .header-bar h1{font-size:1.12rem}.admin-category-container .category-modal{padding:17px 7px 12px}.admin-category-container .category-table th,.admin-category-container .category-table td{padding:7px 3px}}:root{--hitam: #000000;--merah: #f7374f;--putih: #ffffff;--abu-abu: #f5f5f5;--abu-abu-gelap: #d9d9d9}body{font-family:Arial,sans-serif;margin:0;padding:0;box-sizing:border-box;background-color:var(--abu-abu)}*{box-sizing:border-box}.admin-container{display:flex;height:100svh;width:100%}.sidebar{width:200px;height:100%;background-color:var(--hitam);padding:20px;transition:.3s;color:var(--putih);display:flex;flex-direction:column;gap:2rem;overflow-x:hidden}.sidebar.closed{width:0px;transition:.3s;padding-inline:0}.sidebar .logo{font-size:1.8rem;font-weight:700;text-align:center}.sidebar ul{list-style-type:none;padding:0}.sidebar li{margin-bottom:20px}.sidebar li a{text-decoration:none;font-size:1.1rem;font-weight:600;transition:color .3s;text-wrap:nowrap}.sidebar li a:hover{color:var(--merah)}.sidebar .logout-btn{margin-top:auto;padding:10px;background-color:var(--merah);color:var(--putih);text-align:center;border-radius:5px;cursor:pointer;font-weight:700;transition:background-color .3s ease}.admin-navbar{background-color:var(--hitam);color:var(--putih);padding:15px 30px;display:flex;justify-content:space-between;align-items:center;transition:padding-left .3s ease-in-out}.admin-navbar .logo{font-size:1.6rem;font-weight:700}.admin-navbar .logout-btn{color:var(--putih);text-decoration:none;font-weight:700;cursor:pointer}.admin-navbar .logout-btn:hover{color:var(--merah)}.admin-content{flex:1;transition:.3s}.btn-auth{color:var(--putih);cursor:pointer;transition:.3s}.btn-auth:hover{color:var(--merah)}.btn{display:flex;text-decoration:none;justify-content:center;align-items:center;background-color:transparent;padding:10px 20px;font-size:16px;cursor:pointer;transition:all .3s ease;letter-spacing:.3em}.btn.kotak{border:1px solid var(--putih)}.btn.kotak:hover{border:1px solid var(--merah);color:var(--merah);background-color:var(--putih)}.product-list{padding:20px;background-color:#f8f9fa;display:flex;flex-direction:column;align-items:center;min-height:calc(100svh - 225px);margin:0 auto}.product-list .top-actions{display:flex;justify-content:space-between;width:100%;align-items:center;margin-bottom:20px}.product-list .top-actions h1{font-size:2rem;color:var(--hitam)}.product-list .top-actions .add-product-btn{padding:10px 20px;background-color:var(--merah);color:#fff;border:none;border-radius:5px;font-size:1rem;cursor:pointer;transition:background-color .3s ease}.product-list .top-actions .add-product-btn:hover{background-color:var(--merah)}.product-list .search-bar{width:100%;padding:10px;margin-bottom:20px;border:1px solid #ddd;border-radius:5px;font-size:1rem;outline:none}.product-list .search-bar:focus{border-color:var(--merah)}.product-list .category-filter{margin-bottom:20px;border:1px solid #ddd;border-radius:5px;font-size:1rem;outline:none;padding:10px;width:100%;max-width:100px}.product-list .products{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px;width:100%;padding:10px;box-sizing:border-box}.product-list .products .product-item{background-color:#fff;border-radius:8px;box-shadow:0 2px 10px #0000001a;padding:15px;text-align:center}.product-list .products .product-item .product-image{width:100%;height:200px;object-fit:cover;border-radius:5px}.product-list .products .product-item h3{font-size:1.2rem;color:var(--hitam);margin-top:10px}.product-list .products .product-item .price{font-size:1rem;color:var(--merah);margin-top:5px}.product-list .products .product-item .product-actions{margin-top:15px}.product-list .products .product-item .product-actions .edit-button,.product-list .products .product-item .product-actions .delete-button{padding:8px 15px;font-size:1rem;cursor:pointer;border-radius:5px;border:none;margin-right:10px;transition:background-color .3s ease}.product-list .products .product-item .product-actions .edit-button:hover,.product-list .products .product-item .product-actions .delete-button:hover{background-color:#f1f1f1}.product-list .products .product-item .product-actions .edit-button{background-color:var(--merah);color:#fff}.product-list .products .product-item .product-actions .delete-button{background-color:#ff5c5c;color:#fff}.product-list .pagination{display:flex;justify-content:center;gap:10px;margin-top:20px}.product-list .pagination .page-button{padding:10px 15px;background-color:transparent;border:1px solid var(--hitam);border-radius:5px;cursor:pointer;font-size:1rem;color:var(--hitam);transition:background-color .3s ease}.product-list .pagination .page-button:hover,.product-list .pagination .page-button.active{background-color:var(--merah);color:#fff}.add-product-container{max-width:800px;margin:0 auto;padding:2rem;background-color:#f8f9fa;border-radius:8px;box-shadow:0 4px 20px #0000001a}.add-product-container h1{font-size:1.5rem;font-weight:700;margin-bottom:1rem;text-align:center}.add-product-container .add-product-form{display:flex;flex-direction:column;gap:1rem}.add-product-container .add-product-form .form-group{display:flex;flex-direction:column;gap:.5rem}.add-product-container .add-product-form .form-group label{font-weight:700}.add-product-container .add-product-form .form-group input,.add-product-container .add-product-form .form-group select,.add-product-container .add-product-form .form-group textarea{padding:.75rem;font-size:1rem;border:1px solid #ccc;border-radius:5px;outline:none;transition:border .3s}.add-product-container .add-product-form .form-group input:focus,.add-product-container .add-product-form .form-group select:focus,.add-product-container .add-product-form .form-group textarea:focus{border-color:var(--merah)}.add-product-container .add-product-form .form-group textarea{resize:vertical;min-height:100px}.add-product-container .add-product-form .message{color:red;font-size:.9rem;margin-top:1rem;text-align:center}.add-product-container .add-product-form button{padding:1rem;background-color:var(--merah);color:#fff;border:none;border-radius:5px;font-size:1rem;cursor:pointer;transition:background-color .3s}.add-product-container .add-product-form button:hover{background-color:#d9534f}.add-product-container .add-product-form button:disabled{background-color:#ccc;cursor:not-allowed}:root{--primary: #f7374f;--primary-dark: #88304e;--accent: #bb3e00;--success: #52b86a;--bg-light: #f8f9fa;--bg-dark: #23222b;--text-dark: #232323;--text-light: #fff;--border: #e6e6e6;--table-header: #f6f7fb;--modal-bg: #fff;--modal-bg-dark: #23222b}body.dark-mode,html[data-theme=dark]{--modal-bg: var(--bg-dark);--text-dark: var(--text-light);--border: #34344a;--table-header: #292836}.benner-admin{max-width:900px;margin:40px auto;padding:32px 12px;background:#fff;border-radius:22px;box-shadow:0 4px 32px #e9e9e9}.benner-admin .header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.benner-admin .header h2{font-size:2.3rem;color:#f7374f;font-weight:800;letter-spacing:-1px}.benner-admin .header .add-btn{background:#f7374f;color:#fff;font-weight:600;padding:13px 30px;border-radius:13px;font-size:1.07rem;border:none;cursor:pointer;box-shadow:0 1px 8px #fc5c7740;transition:background .2s}.benner-admin .header .add-btn:hover{background:#bb3e00}.benner-admin .table-wrap{overflow-x:auto;border-radius:14px;background:#fafcff;box-shadow:0 2px 14px #f7f7f7;margin-bottom:32px;padding:14px 0}.benner-admin .table-wrap table{width:100%;border-collapse:collapse}.benner-admin .table-wrap table th,.benner-admin .table-wrap table td{padding:12px 17px}.benner-admin .table-wrap table th{background:#f6f7fb;color:#f7374f;font-size:1.05rem;font-weight:700;border-bottom:2px solid rgba(247,55,79,.0705882353);text-align:left;letter-spacing:.03em}.benner-admin .table-wrap table td{border-bottom:1px solid #ececec;vertical-align:middle;font-size:1rem;color:#272727;background:#fff}.benner-admin .table-wrap table tr:last-child td{border-bottom:none}.benner-admin .table-wrap table img{border-radius:7px;width:90px;height:54px;object-fit:cover;border:1.5px solid #f6f7fb;background:#f6f7fb}.benner-admin .table-wrap .aksi-btns{display:flex;gap:10px;justify-content:center}.benner-admin .table-wrap .aksi-btns .edit-btn,.benner-admin .table-wrap .aksi-btns .del-btn{padding:7px 19px;border:none;border-radius:9px;color:#fff;font-weight:600;font-size:1rem;cursor:pointer;box-shadow:0 1px 5px #f7bcbc11;transition:background .14s}.benner-admin .table-wrap .aksi-btns .edit-btn{background:#bb3e00}.benner-admin .table-wrap .aksi-btns .edit-btn:hover,.benner-admin .table-wrap .aksi-btns .del-btn{background:#f7374f}.benner-admin .table-wrap .aksi-btns .del-btn:hover{background:#bb3e00}.benner-admin .table-wrap .active-label{color:#52b86a;font-weight:700;font-size:1.07em}.benner-admin .benner-modal__backdrop{position:fixed;z-index:200;top:0;right:0;bottom:0;left:0;background:#1919215e;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(2.5px);backdrop-filter:blur(2.5px);animation:fadein-bg .18s}@keyframes fadein-bg{0%{opacity:0}to{opacity:1}}.benner-admin .benner-modal{background:var(--modal-bg);color:var(--text-dark);min-width:350px;max-width:430px;border-radius:18px;box-shadow:0 4px 28px #0f0f1220;padding:28px 26px 24px;position:relative;animation:modal-zoom .24s cubic-bezier(.68,-.55,.27,1.55)}@keyframes modal-zoom{0%{opacity:0;transform:translateY(60px) scale(.97)}to{opacity:1;transform:none}}.benner-admin .benner-modal h3{font-size:1.1rem;font-weight:700;color:var(--primary);margin-bottom:18px}.benner-admin .benner-modal .close-btn{position:absolute;top:8px;right:17px;font-size:2rem;color:var(--primary);background:none;border:none;cursor:pointer;font-weight:800;line-height:1;opacity:.87}.benner-admin .benner-modal .close-btn:hover{color:var(--primary-dark)}.benner-admin .benner-modal .form-row{margin-bottom:15px}.benner-admin .benner-modal .form-row label{display:block;font-weight:500;margin-bottom:7px}.benner-admin .benner-modal .form-row input,.benner-admin .benner-modal .form-row select{border:1.5px solid var(--border);padding:9px 14px;font-size:1rem;border-radius:7px;background:var(--table-header);color:var(--text-dark);outline:none;width:100%;margin-bottom:0}.benner-admin .benner-modal .form-row input:focus,.benner-admin .benner-modal .form-row select:focus{border-color:var(--primary)}.benner-admin .benner-modal .form-row input[type=file]{padding:3px 0}.benner-admin .benner-modal .form-row input[type=checkbox]{width:18px;height:18px;accent-color:var(--primary)}.benner-admin .benner-modal .form-row .preview-label{color:var(--accent);font-size:.93em;margin-bottom:2px;font-weight:600}.benner-admin .benner-modal .form-row .preview{margin:8px 0 4px;border-radius:7px;background:#f7f7fa;min-height:38px;display:flex;align-items:center;justify-content:center}.benner-admin .benner-modal .form-row .preview img,.benner-admin .benner-modal .form-row .preview video,.benner-admin .benner-modal .form-row .preview iframe{border-radius:6px;max-height:148px;width:100%;object-fit:contain}.benner-admin .benner-modal .modal-btn-row{display:flex;justify-content:flex-end;gap:12px;margin-top:20px}.benner-admin .benner-modal .modal-btn-row button{padding:9px 26px;font-weight:600;font-size:1rem;border:none;border-radius:8px;cursor:pointer;transition:background .14s}.benner-admin .benner-modal .modal-btn-row .batal-btn{background:#ededed;color:#262727}.benner-admin .benner-modal .modal-btn-row .batal-btn:hover{background:#dadada}.benner-admin .benner-modal .modal-btn-row .submit-btn{background:var(--primary);color:#fff}.benner-admin .benner-modal .modal-btn-row .submit-btn:hover{background:var(--primary-dark)}@media (max-width: 540px){.benner-admin{padding:11px 2vw}.benner-admin .header h2{font-size:24px}.benner-admin .add-btn{padding:9px 14px;font-size:.98rem}.benner-admin .benner-modal{min-width:92vw;max-width:98vw;padding:12px 4vw 14px}.benner-admin table th,.benner-admin table td{padding:7px 3px!important;font-size:.97rem!important}.benner-admin .aksi-btns button{padding:6px 10px;font-size:.95rem}.benner-admin .preview{min-height:80px}}