/* Lapak Buah Umaiza 2.5.0 — Bootstrap production bundle. */

/* Source: public/css/app.css */
:root{--primary:#7cb342;--primary-dark:#3f6f2a;--primary-light:#c5e1a5;--accent:#f9a825;--danger:#e53935;--ink:#263238;--muted:#718078;--bg:#f7f9f4;--card:#fff;--line:#e5ebdf;--shadow:0 10px 28px rgba(48,78,38,.08);--radius:18px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.55 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}img{max-width:100%;display:block}.container{width:min(1180px,calc(100% - 40px));margin-inline:auto}.top-strip{background:var(--primary-dark);color:#eaf6dc;font-size:12px}.top-strip-inner{display:flex;align-items:center;justify-content:space-between;padding:8px 0}.top-links{display:flex;gap:20px}.top-links a:hover{color:#fff}.site-header{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}.header-main{display:flex;align-items:center;gap:26px;padding:18px 0}.brand{display:flex;align-items:center;gap:10px;min-width:205px}.brand-mark{height:42px;width:42px;display:grid;place-items:center;background:#edf7df;border-radius:14px;font-size:24px}.brand strong{display:block;color:var(--primary-dark);letter-spacing:-.3px;font-size:16px}.brand small{display:block;color:var(--muted);font-size:10px;margin-top:-2px}.search-box{flex:1;display:flex;align-items:center;border:1px solid var(--line);border-radius:12px;height:46px;background:#fbfcfa;overflow:hidden}.search-box>span{font-size:26px;color:var(--muted);padding:0 12px;line-height:1}.search-box input{flex:1;border:0;outline:0;background:transparent;min-width:0;color:var(--ink)}.search-box button{height:100%;border:0;background:var(--primary-dark);color:#fff;padding:0 19px;font-weight:700}.header-actions{display:flex;align-items:center;gap:15px}.location-chip{display:flex;gap:7px;color:var(--muted);font-size:12px;line-height:1.25}.location-chip b{color:var(--ink);font-size:12px}.icon-link{font-size:21px;position:relative}.icon-link i{font-size:10px;position:absolute;right:-8px;top:-8px;background:var(--danger);color:#fff;border-radius:10px;padding:1px 5px;font-style:normal}.avatar{height:34px;width:34px;border-radius:50%;display:grid;place-items:center;background:var(--primary-light);color:var(--primary-dark);font-weight:800;font-size:13px;flex:none}.avatar.large{height:58px;width:58px;font-size:22px}.login-link{color:var(--primary-dark);font-weight:700;font-size:13px}.nav-row{display:flex;align-items:center;gap:24px;min-height:45px}.nav-row nav{display:flex;gap:26px;align-items:center;font-size:13px;color:#62716a}.nav-row nav a{padding:10px 0;border-bottom:2px solid transparent}.nav-row nav a:hover,.nav-row nav a.active{color:var(--primary-dark);border-color:var(--primary)}.delivery-note{margin-left:auto;color:var(--muted);font-size:12px}.mobile-menu{display:none;border:0;background:transparent;color:var(--primary-dark)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:10px;padding:11px 18px;font-weight:750;font-size:13px;transition:.2s ease;white-space:nowrap}.btn:hover{transform:translateY(-1px);box-shadow:0 7px 15px rgba(63,111,42,.15)}.btn-primary{background:var(--primary-dark);color:#fff}.btn-secondary{background:var(--primary);color:#193016}.btn-light{background:#fff;color:var(--primary-dark)}.btn-outline{background:#fff;color:var(--primary-dark);border-color:#cadac1}.btn-danger-outline{background:#fff;color:var(--danger);border-color:#f0c4c1}.btn-small{padding:8px 12px;font-size:12px}.btn-block{width:100%}.text-link{color:var(--primary-dark);font-weight:750;font-size:13px}.alert{margin:16px auto 0;border-radius:12px;padding:12px 15px;position:relative;font-size:13px}.alert button{position:absolute;right:10px;top:8px;border:0;background:transparent;font-size:19px;color:inherit}.alert.success{background:#e9f7e2;color:#32672a;border:1px solid #c4e5b4}.alert.error{background:#fff0ee;color:#a52822;border:1px solid #f4c5c0}.alert.warning{background:#fff8df;color:#865d00;border:1px solid #f2dc8c}.alert ul{margin:4px 0 0 18px;padding:0}.hero-wrap{background:linear-gradient(135deg,#f2f8e9,#fafff8);overflow:hidden}.hero-grid{min-height:455px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:50px}.eyebrow{color:var(--primary-dark);font-size:10px;font-weight:850;letter-spacing:1.6px}.eyebrow.light{color:#d6efbc}.hero-copy h1{font-size:58px;line-height:1.03;letter-spacing:-3px;margin:15px 0 18px;color:#284b27}.hero-copy h1 em{font-style:normal;color:var(--primary)}.hero-copy p{color:var(--muted);font-size:17px;max-width:490px;margin:0 0 25px}.hero-actions{display:flex;align-items:center;gap:22px}.hero-trust{display:flex;gap:16px;margin-top:28px;color:#6c7a67;font-size:11px}.hero-art{position:relative;min-height:380px;display:grid;place-items:center}.hero-art img{width:430px;filter:drop-shadow(0 28px 20px rgba(47,92,31,.16));position:relative;z-index:2}.art-blob{position:absolute;width:360px;height:360px;background:#d4eeb2;border-radius:44% 56% 55% 45%;transform:rotate(-17deg)}.floating-card{position:absolute;right:22px;bottom:50px;z-index:3;background:#fff;padding:13px 17px;border-radius:14px;box-shadow:var(--shadow);font-size:12px}.floating-card b{display:block;color:var(--primary-dark)}.floating-card span{color:var(--muted);font-size:11px}.section{padding:58px 0}.section-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:22px}.section-heading h2{font-size:25px;letter-spacing:-1px;margin:5px 0 0}.category-grid{display:grid;grid-template-columns:repeat(10,1fr);gap:10px}.category-pill{background:#fff;border:1px solid var(--line);border-radius:15px;padding:15px 8px;text-align:center;transition:.2s}.category-pill:hover{border-color:var(--primary);transform:translateY(-3px);box-shadow:var(--shadow)}.category-icon{display:block;font-size:29px;margin-bottom:7px}.category-pill strong{display:block;font-size:11px;line-height:1.25}.category-pill small{display:block;color:var(--muted);font-size:9px;margin-top:3px}.flash-section{background:var(--primary-dark);color:#fff}.flash-head{display:flex;align-items:end;gap:28px;margin-bottom:22px}.flash-head h2{margin:5px 0 0;font-size:27px}.flash-head h2 span{color:#c5e1a5}.flash-head .btn{margin-left:auto}.countdown{display:flex;align-items:center;gap:5px;position:relative;padding-bottom:17px}.countdown b{background:#234a24;border-radius:7px;padding:5px 7px;min-width:30px;text-align:center}.countdown i{font-style:normal}.countdown small{position:absolute;bottom:0;left:0;color:#c5e1a5;font-size:9px}.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.product-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;min-width:0;transition:.2s;box-shadow:0 2px 6px rgba(37,67,30,.02)}.product-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.product-image{display:block;height:190px;background:#eff7e5;position:relative;overflow:hidden}.product-image img{height:100%;width:100%;object-fit:cover}.badge{border-radius:6px;padding:3px 7px;font-size:10px;font-weight:800;display:inline-block}.badge.discount{background:#ffe5df;color:#c8372e}.badge.low{background:#fff5d4;color:#8b6103;position:absolute;right:9px;bottom:9px}.product-image .discount{position:absolute;top:10px;left:10px}.product-body{padding:13px}.product-store{color:var(--primary);font-size:10px;font-weight:750;margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.product-body h3{font-size:14px;margin:0 0 5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.product-body h3 a:hover{color:var(--primary-dark)}.rating{font-size:11px;color:#e7a500}.rating span{color:var(--muted)}.price-row{display:flex;align-items:baseline;gap:7px;margin:9px 0 5px}.price-row strong{font-size:17px;color:var(--primary-dark)}.price-row del{font-size:10px;color:#9ba79e}.product-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;margin-bottom:11px}.split-section{display:grid;grid-template-columns:.8fr 1.2fr;gap:50px;align-items:center}.split-copy h2{font-size:39px;line-height:1.08;letter-spacing:-2px;margin:7px 0 15px}.split-copy p{color:var(--muted);max-width:400px;margin-bottom:22px}.store-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.store-card{display:flex;align-items:center;gap:11px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px;transition:.2s}.store-card:hover{border-color:var(--primary);transform:translateY(-2px)}.store-card strong,.store-card span{display:block}.store-card strong{font-size:12px}.store-card span{font-size:10px;color:var(--muted);margin-top:4px}.store-card>b{margin-left:auto;color:var(--primary)}.store-avatar{height:38px;width:38px;border-radius:13px;background:#e6f3d4;color:var(--primary-dark);display:grid;place-items:center;font-weight:850}.store-avatar.small{height:27px;width:27px;border-radius:9px;font-size:11px}.store-avatar.large{height:58px;width:58px;font-size:22px}.soft-bg{background:#eef5e8}.article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.article-card{background:#fff;border-radius:16px;overflow:hidden;border:1px solid var(--line);display:flex;flex-direction:column}.article-card img{width:100%;height:150px;object-fit:cover}.article-card>div{padding:15px}.article-card span{font-size:10px;color:var(--primary);font-weight:800}.article-card h3{font-size:16px;margin:7px 0}.article-card p{font-size:12px;color:var(--muted);margin:0 0 13px}.article-card b{font-size:11px;color:var(--primary-dark)}.footer{background:#234425;color:#dbeacc;padding-top:50px}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.1fr;gap:35px;padding-bottom:45px}.footer-brand strong{color:#d9efc4}.footer-brand small,.footer p,.footer a{color:#a8c198}.footer p{font-size:12px;max-width:260px}.footer h4{margin:0 0 14px;color:#fff;font-size:13px}.footer-grid>div>a:not(.brand){display:block;font-size:12px;margin:9px 0}.socials{display:flex;gap:10px}.socials span{height:26px;width:26px;display:grid;place-items:center;border:1px solid #61795a;border-radius:50%}.wa-link{color:#d4efa8!important;font-weight:800}.footer-bottom{border-top:1px solid rgba(255,255,255,.1);font-size:11px;padding:14px 0}.footer-bottom .container{display:flex;justify-content:space-between}.floating-wa{position:fixed;right:20px;bottom:20px;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#27ae60;color:#fff;font-size:26px;box-shadow:0 8px 20px rgba(0,0,0,.18);z-index:30}.page-head{display:flex;justify-content:space-between;align-items:end;padding:43px 0 28px}.page-head.compact{padding-bottom:24px}.page-head h1{font-size:34px;letter-spacing:-1.5px;margin:5px 0}.page-head p{color:var(--muted);margin:0}.breadcrumb{color:var(--muted);font-size:12px}.breadcrumb a{color:var(--primary-dark);font-weight:700}.page-breadcrumb{padding:22px 0 10px}.shop-layout{display:grid;grid-template-columns:225px 1fr;gap:22px;padding-bottom:60px}.filter-card,.summary-card,.form-card,.dashboard-panel,.checkout-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px}.filter-title{display:flex;justify-content:space-between;margin-bottom:16px}.filter-title a{color:var(--primary);font-size:11px}.filter-card label,.form-card label,.checkout-card label,.installer-section label{display:block;font-size:11px;font-weight:750;color:#53635b;margin:13px 0}.filter-card input,.filter-card select,.form-card input,.form-card select,.form-card textarea,.checkout-card textarea,.checkout-card input,.checkout-card select,.installer-section input,.installer-section select{display:block;width:100%;margin-top:6px;border:1px solid #dbe5d5;border-radius:9px;padding:10px 11px;background:#fbfdf9;color:var(--ink);outline:none}.filter-card input:focus,.form-card input:focus,.form-card select:focus,.form-card textarea:focus,.checkout-card input:focus,.checkout-card textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px #e8f5dc}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}.check{display:flex!important;align-items:center;gap:7px;font-weight:500!important}.check input{width:auto!important;margin:0!important}.shop-results{min-width:0}.results-toolbar{display:flex;justify-content:space-between;align-items:center;background:#fff;border:1px solid var(--line);border-radius:12px;padding:11px 13px;margin-bottom:15px;color:var(--muted);font-size:12px}.results-toolbar b{color:var(--ink)}.results-toolbar select{border:0;background:transparent;color:var(--ink);outline:0}.pagination-wrap{margin-top:20px}.pagination{display:flex;gap:5px;list-style:none;padding:0}.pagination li a,.pagination li span{display:grid;place-items:center;height:32px;min-width:32px;padding:0 8px;border:1px solid var(--line);border-radius:8px;font-size:12px}.pagination li.active span{background:var(--primary-dark);color:#fff;border-color:var(--primary-dark)}.empty-state{text-align:center;background:#fff;border:1px dashed #cbdcc3;border-radius:20px;padding:60px 20px;color:var(--muted)}.empty-state span{font-size:45px;display:block}.empty-state h2,.empty-state h1{color:var(--ink);margin:10px 0 4px}.empty-state p{margin:0 0 18px}.empty-state.full{min-height:55vh;display:grid;place-items:center;align-content:center;border:0;background:transparent}.product-detail{display:grid;grid-template-columns:1fr 1fr;gap:45px;padding:25px 0 45px}.main-photo{height:470px;border-radius:24px;background:#eaf5df;overflow:hidden}.main-photo img{height:100%;width:100%;object-fit:cover}.thumbs{display:flex;gap:8px;margin-top:12px}.thumbs button{width:65px;height:58px;padding:0;border:2px solid transparent;border-radius:9px;overflow:hidden;background:#edf7e4}.thumbs button.active{border-color:var(--primary)}.thumbs img{width:100%;height:100%;object-fit:cover}.product-info h1{font-size:35px;line-height:1.15;letter-spacing:-1.5px;margin:10px 0}.verified{color:var(--primary);font-size:10px;font-weight:800}.detail-rating{display:flex;gap:11px;align-items:center;color:var(--muted);font-size:12px}.detail-rating span:first-child{color:#d99600}.detail-price{font-weight:850;font-size:30px;color:var(--primary-dark);margin:22px 0}.detail-price del{font-size:13px;color:#9aa59d;font-weight:500;margin-left:8px}.detail-price .badge{vertical-align:middle;margin-left:8px}.info-box{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--line);padding:16px 0;margin:19px 0}.info-box>div{display:flex;gap:8px;padding-right:7px}.info-box>div+div{border-left:1px solid var(--line);padding-left:12px}.info-box span{font-size:19px}.info-box p{margin:0}.info-box b,.info-box small{display:block;font-size:10px}.info-box small{color:var(--muted);margin-top:2px}.variant-label{font-size:12px;font-weight:800;color:var(--ink)}.variants{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 16px}.variants button{border:1px solid #d2dfcb;background:#fff;border-radius:9px;padding:7px 10px;font-size:11px}.variants button.active{border-color:var(--primary);background:#f1f9e9}.variants small{display:block;color:var(--primary-dark);font-weight:700}.buy-form{display:flex;gap:9px;align-items:center}.quantity{display:flex;border:1px solid #dbe5d5;border-radius:9px;overflow:hidden;width:max-content}.quantity button{border:0;background:#f5f9f2;color:var(--primary-dark);width:30px}.quantity input{border:0;width:43px;text-align:center;outline:0;padding:7px 0}.detail-actions{display:flex;gap:17px;margin-top:18px;color:var(--muted);font-size:11px}.detail-actions button{border:0;background:none;color:inherit;padding:0}.detail-actions button:hover,.detail-actions a:hover{color:var(--primary-dark)}.detail-tabs{border-top:1px solid var(--line);padding-top:28px}.tab-nav{display:flex;gap:27px;border-bottom:1px solid var(--line)}.tab-nav button{border:0;border-bottom:2px solid transparent;background:none;padding:10px 0;color:var(--muted);font-weight:750;font-size:13px}.tab-nav button.active{color:var(--primary-dark);border-color:var(--primary)}.tab-panel{display:none;padding:25px 0;color:var(--muted);font-size:13px}.tab-panel.active{display:block}.tab-panel h2{color:var(--ink);font-size:19px}.spec-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:20px}.spec-grid div{background:#f3f8ee;border-radius:10px;padding:12px}.spec-grid span,.spec-grid b{display:block;font-size:11px}.spec-grid span{color:var(--muted)}.spec-grid b{margin-top:4px;color:var(--ink)}.review{display:flex;gap:10px;border-bottom:1px solid var(--line);padding:13px 0}.review small{color:var(--primary)}.review p{margin:6px 0}.article-detail,.simple-page{padding:35px 0 80px;max-width:850px}.article-detail h1,.simple-page h1{font-size:43px;line-height:1.1;letter-spacing:-2px;margin:15px 0 8px}.article-meta{color:var(--muted);font-size:12px;margin-bottom:24px}.article-cover{width:100%;max-height:420px;object-fit:cover;border-radius:22px;margin-bottom:26px}.article-content{font-size:16px;line-height:1.85;color:#4f5f57}.article-content h2{color:var(--ink)}.auth-page{min-height:calc(100vh - 170px);display:grid;place-items:center;padding:45px 20px}.auth-card{width:min(450px,100%);background:#fff;border:1px solid var(--line);border-radius:22px;padding:30px;box-shadow:var(--shadow)}.auth-card.wide{width:min(600px,100%)}.auth-brand,.installer-head{display:flex;align-items:center;gap:10px;margin-bottom:25px}.auth-brand b,.installer-head b{display:block;color:var(--primary-dark);font-size:15px}.auth-brand small,.installer-head small{display:block;color:var(--muted);font-size:11px}.auth-card h1{font-size:25px;letter-spacing:-1px;margin:0 0 5px}.auth-card>p{color:var(--muted);font-size:13px;margin:0 0 22px}.auth-card label{display:block;color:#53635b;font-size:11px;font-weight:750;margin:14px 0}.auth-card input,.auth-card select{display:block;width:100%;margin-top:6px;border:1px solid #dbe5d5;border-radius:9px;padding:11px;background:#fbfdf9}.password-input{display:flex;border:1px solid #dbe5d5;border-radius:9px;margin-top:6px}.password-input input{border:0;margin:0}.password-input button{border:0;background:transparent;color:var(--primary);font-size:11px;padding-right:10px}.form-row{display:flex;justify-content:space-between;align-items:center;font-size:11px}.form-row a,.auth-foot a{color:var(--primary-dark);font-weight:750}.auth-divider{border-top:1px solid var(--line);text-align:center;margin:25px 0 17px}.auth-divider span{background:#fff;position:relative;top:-11px;padding:0 10px;color:var(--muted);font-size:11px}.auth-foot{text-align:center!important;margin:0!important}.demo-note{background:#f5faef;border:1px solid #deedd2;border-radius:10px;padding:10px 12px;margin-top:18px;font-size:10px;color:var(--muted)}.demo-note b,.demo-note span{display:block}.demo-note b{color:var(--primary-dark);margin-bottom:4px}.cart-layout,.checkout-layout{display:grid;grid-template-columns:1fr 340px;gap:22px;padding-bottom:65px}.cart-store{background:#fff;border:1px solid var(--line);border-radius:16px;margin-bottom:14px;overflow:hidden}.cart-store-head{display:flex;align-items:center;gap:9px;padding:13px 15px;border-bottom:1px solid var(--line);font-size:12px}.cart-line{display:grid;grid-template-columns:62px 1fr auto auto auto;align-items:center;gap:13px;padding:15px;border-bottom:1px solid #eef2eb}.cart-line:last-child{border-bottom:0}.cart-line>img{width:62px;height:62px;border-radius:10px;object-fit:cover}.cart-line-main b,.cart-line-main small,.cart-line-main strong{display:block}.cart-line-main b{font-size:13px}.cart-line-main small{font-size:10px;color:var(--muted);margin:3px 0}.cart-line-main strong{color:var(--primary-dark);font-size:13px}.line-total{font-size:13px;color:var(--ink);min-width:90px;text-align:right}.remove{border:0;background:none;color:#b3beb4;font-size:20px}.summary-card{height:max-content}.summary-card h2{font-size:17px;margin:0 0 18px}.summary-row,.summary-total{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:11px 0;font-size:12px}.summary-row span:first-child{color:var(--muted)}.summary-row.muted{color:#a1ada4;font-size:11px}.summary-total{font-size:14px;margin-top:17px}.summary-total strong{font-size:21px;color:var(--primary-dark)}.summary-total small{display:block;color:var(--muted);font-size:10px;font-weight:500}.summary-card hr{border:0;border-top:1px solid var(--line);margin:16px 0}.secure-note{text-align:center;color:var(--muted);font-size:10px;margin-top:14px}.sticky{position:sticky;top:135px}.stepper{display:flex;align-items:center;gap:9px;color:#a5b0a8;font-size:11px}.stepper .active{color:var(--primary-dark);font-weight:800}.stepper .done{color:var(--primary)}.checkout-card{margin-bottom:15px}.card-heading{display:flex;justify-content:space-between;gap:15px;align-items:start;margin-bottom:15px}.card-heading>div{display:flex;gap:11px}.card-heading h2{font-size:16px;margin:0}.card-heading p{font-size:11px;color:var(--muted);margin:2px 0}.card-heading>a{font-size:11px;color:var(--primary-dark);font-weight:750}.number{height:25px;width:25px;border-radius:50%;display:grid;place-items:center;background:#e5f2d7;color:var(--primary-dark);font-weight:850;font-size:12px;flex:none}.address-option,.payment-options label,.shipping-options label{display:flex!important;align-items:start;gap:10px;border:1px solid var(--line);border-radius:10px;padding:12px!important;margin:8px 0!important;cursor:pointer}.address-option:has(input:checked),.payment-options label:has(input:checked),.shipping-options label:has(input:checked){border-color:var(--primary);background:#f4faee}.address-option>input,.payment-options input,.shipping-options input{width:auto!important;margin:3px 0!important}.address-option span,.payment-options span,.shipping-options span{flex:1}.address-option b,.address-option small,.payment-options b,.payment-options small,.shipping-options b,.shipping-options small{display:block}.address-option b,.payment-options b,.shipping-options b{font-size:12px}.address-option small,.payment-options small,.shipping-options small{color:var(--muted);font-size:10px;margin-top:3px}.address-option em{font-size:10px;color:var(--primary);font-style:normal}.shipping-options,.payment-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}.voucher-input{display:flex;gap:8px;margin-top:13px}.voucher-input input{margin:0!important}.mini-line{display:flex;justify-content:space-between;gap:10px;font-size:11px;margin:10px 0}.mini-line span{color:var(--muted)}.account-layout{display:grid;grid-template-columns:215px 1fr;gap:25px;padding-bottom:70px}.account-nav{background:#fff;border:1px solid var(--line);border-radius:16px;height:max-content;overflow:hidden}.account-user{text-align:center;padding:22px 10px;border-bottom:1px solid var(--line)}.account-user .avatar,.account-user .store-avatar{margin:0 auto 9px}.account-user b,.account-user small{display:block}.account-user b{font-size:13px}.account-user small{font-size:10px;color:var(--muted);margin-top:2px}.account-nav>a,.account-nav form button{display:block;width:100%;text-align:left;border:0;background:#fff;padding:12px 15px;color:#62716a;font-size:12px}.account-nav>a.active,.account-nav>a:hover,.account-nav form button:hover{color:var(--primary-dark);background:#f3f9ed;font-weight:750}.account-nav form{border-top:1px solid var(--line)}.account-content{min-width:0}.tabs-simple{display:flex;gap:22px;border-bottom:1px solid var(--line);margin-bottom:15px}.tabs-simple a{padding:10px 0;font-size:12px;color:var(--muted);border-bottom:2px solid transparent}.tabs-simple a.active{color:var(--primary-dark);border-color:var(--primary);font-weight:800}.order-card{display:block;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:11px}.order-card:hover{border-color:var(--primary)}.order-card-head{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;margin-bottom:13px}.status{display:inline-block;border-radius:6px;padding:4px 7px;font-size:9px;font-weight:800;background:#eef2ee;color:#6b7770}.status.large{font-size:11px;padding:7px 10px}.status.success,.status.completed,.status.paid,.status.active{background:#e8f6de;color:#2d7028}.status.warning,.status.awaiting_payment,.status.payment_review,.status.pending{background:#fff4d7;color:#946a00}.status.in_transit,.status.driver_assigned,.status.preparing,.status.processing,.status.accepted{background:#e5f1ff;color:#32679b}.status.cancelled,.status.problem,.status.rejected{background:#ffe8e5;color:#b4302a}.status.muted,.status.offline{background:#f0f2f0;color:#7b857e}.order-card-body{display:flex;align-items:center;gap:14px}.order-products{display:flex;align-items:center}.order-products img,.order-products span{width:45px;height:45px;object-fit:cover;border-radius:8px;border:2px solid #fff;background:#edf7e4;margin-right:-6px}.order-products span{display:grid;place-items:center;color:var(--primary-dark);font-size:11px}.order-card-body>div:nth-child(2){flex:1}.order-card-body b,.order-card-body small{display:block}.order-card-body b{font-size:12px}.order-card-body small{font-size:10px;color:var(--muted);margin-top:3px}.order-card-body>strong{font-size:12px}.arrow{color:var(--primary);font-size:20px}.order-detail-layout{display:grid;grid-template-columns:1fr 320px;gap:22px;padding-bottom:70px}.order-detail-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:20px}.order-detail-head h1{font-size:28px;margin:5px 0}.tracking-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px;margin-bottom:15px}.tracking-line{display:flex;justify-content:space-between;position:relative;z-index:1}.tracking-line:before{content:"";position:absolute;left:7px;right:7px;top:13px;height:2px;background:#dfe9d9;z-index:-1}.tracking-line span{width:27px;height:27px;border:2px solid #dfe9d9;background:#fff;color:#95a39a;border-radius:50%;display:grid;place-items:center;font-size:10px;font-weight:800}.tracking-line span.done{background:var(--primary);border-color:var(--primary);color:#fff}.tracking-labels{display:flex;justify-content:space-between;color:var(--muted);font-size:9px;margin-top:8px}.driver-card{display:flex;align-items:center;gap:11px;background:#f0f8e9;border:1px solid #d5e9c5;border-radius:14px;padding:13px;margin-bottom:15px}.driver-card>div:nth-child(2){flex:1}.driver-card span,.driver-card b,.driver-card small{display:block}.driver-card span{font-size:10px;color:var(--muted)}.driver-card b{font-size:13px}.driver-card small{font-size:10px;color:var(--muted)}.order-box{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;margin-bottom:15px}.box-title{display:flex;justify-content:space-between;align-items:center}.box-title h2{font-size:16px;margin:0}.box-title span{font-size:11px;color:var(--muted)}.order-store-name{background:#f3f8ee;border-radius:8px;padding:9px;margin:15px 0 5px;font-size:11px;font-weight:800;color:var(--primary-dark)}.detail-line{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid #f0f3ee}.detail-line:last-child{border:0}.detail-line img{width:50px;height:50px;object-fit:cover;border-radius:8px}.detail-line>div{flex:1}.detail-line b,.detail-line small{display:block}.detail-line b{font-size:12px}.detail-line small{font-size:10px;color:var(--muted);margin-top:3px}.detail-line>strong{font-size:12px}.history-line{display:flex;gap:12px;padding:10px 0}.history-dot{height:10px;width:10px;background:var(--primary);border-radius:50%;margin-top:5px;box-shadow:0 0 0 4px #e7f4dc}.history-line b,.history-line small{display:block}.history-line b{font-size:12px}.history-line small{font-size:10px;color:var(--muted);margin-top:3px}.payment-label{font-size:11px;color:var(--muted)}.address-card p{font-size:11px;color:var(--muted)}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding-bottom:24px}.stat-card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:18px}.stat-card span,.stat-card small{display:block;color:var(--muted);font-size:11px}.stat-card strong{display:block;color:var(--primary-dark);font-size:26px;margin:5px 0}.mini-order{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;margin:8px 0}.mini-order b{font-size:12px}.mini-order small{color:var(--muted);font-size:10px;flex:1}.mini-order>span:last-child{color:var(--primary);font-size:18px}.top-space{margin-top:35px}.notification-line{display:flex;gap:10px;padding:12px 0;border-bottom:1px solid var(--line)}.notification-line>span{color:var(--primary)}.notification-line div{flex:1}.notification-line b{font-size:12px}.notification-line p{font-size:11px;color:var(--muted);margin:2px 0}.notification-line small{color:var(--muted);font-size:10px}.two-panel{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding-bottom:70px}.form-card h2{font-size:17px;margin:0 0 15px}.form-card h3{font-size:13px}.saved-address{background:#f5f9f2;border-radius:10px;padding:10px;margin:8px 0;font-size:11px}.saved-address p{color:var(--muted);margin:4px 0}.saved-address span{background:#e1f1d5;color:var(--primary-dark);font-size:9px;padding:2px 5px;border-radius:4px}.empty-inline{background:#f8fbf6;border-radius:10px;padding:14px;font-size:12px;color:var(--muted)}.empty-inline a{color:var(--primary-dark);font-weight:800}.admin-shell{display:flex;min-height:calc(100vh - 150px);background:#f3f7f0}.admin-sidebar{width:240px;background:#fff;border-right:1px solid var(--line);padding:21px 14px;display:flex;flex-direction:column}.admin-brand{display:flex;gap:9px;align-items:center;padding:0 8px 22px}.admin-brand .brand-mark{height:35px;width:35px;font-size:19px;border-radius:10px}.admin-brand b,.admin-brand small{display:block}.admin-brand b{color:var(--primary-dark);font-size:12px}.admin-brand small{color:var(--muted);font-size:9px}.admin-sidebar nav{display:flex;flex-direction:column;gap:2px}.nav-label{font-size:9px;letter-spacing:1px;color:#a0aba3;font-weight:800;margin:16px 10px 5px}.admin-sidebar nav a{padding:10px;border-radius:8px;font-size:12px;color:#647169}.admin-sidebar nav a:hover,.admin-sidebar nav a.active{background:#edf7e5;color:var(--primary-dark);font-weight:800}.admin-sidebar nav a i{float:right;border-radius:10px;background:#ffe6e0;color:var(--danger);font-style:normal;font-size:9px;padding:2px 5px}.admin-side-bottom{margin-top:auto;border-top:1px solid var(--line);padding-top:15px}.admin-side-bottom a,.admin-side-bottom button{display:block;width:100%;border:0;background:transparent;text-align:left;padding:9px 10px;color:var(--muted);font-size:11px}.admin-main{flex:1;min-width:0}.admin-topbar{display:flex;justify-content:space-between;align-items:center;background:#fff;border-bottom:1px solid var(--line);padding:18px 30px}.admin-topbar h1{font-size:22px;margin:3px 0 0;letter-spacing:-.5px}.admin-top-actions{display:flex;align-items:center;gap:10px}.notification-bell{color:var(--primary);font-size:17px}.admin-name{font-size:11px;font-weight:800}.admin-name small{display:block;color:var(--muted);font-weight:500;font-size:9px}.admin-content{padding:27px 30px;max-width:1300px}.admin-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:18px}.admin-stat{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;position:relative}.admin-stat.primary{background:var(--primary-dark);color:#fff;border-color:var(--primary-dark)}.admin-stat span,.admin-stat small{display:block;color:var(--muted);font-size:10px}.admin-stat.primary span,.admin-stat.primary small{color:#cde6b8}.admin-stat strong{display:block;font-size:22px;margin:7px 0}.admin-stat b{position:absolute;right:16px;top:16px;color:var(--primary);font-size:21px}.admin-stat.primary b{color:#cfedae}.admin-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:17px;margin-bottom:17px}.admin-grid.two{grid-template-columns:1fr 1fr}.dashboard-panel{padding:18px;margin-bottom:17px}.panel-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:14px}.panel-heading h2{font-size:16px;margin:4px 0 0}.panel-heading>a{color:var(--primary-dark);font-size:11px;font-weight:750}.bar-chart{height:220px;display:flex;align-items:end;justify-content:space-around;gap:18px;padding:15px 12px 0;border-bottom:1px solid var(--line)}.bar-col{height:100%;flex:1;display:flex;flex-direction:column;justify-content:end;align-items:center;gap:8px}.bar{width:75%;min-height:6px;background:linear-gradient(#95cd64,var(--primary-dark));border-radius:7px 7px 0 0}.bar-col small{font-size:10px;color:var(--muted)}.ops-list>a{display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid #eef2eb}.ops-list>a:last-child{border:0}.ops-icon{height:34px;width:34px;border-radius:10px;display:grid;place-items:center}.ops-icon.yellow{background:#fff3d5}.ops-icon.blue{background:#e4f0ff}.ops-icon.green{background:#e4f4d7}.ops-icon.purple{background:#efe8ff}.ops-list div{flex:1}.ops-list b,.ops-list small{display:block}.ops-list b{font-size:16px}.ops-list small{color:var(--muted);font-size:10px}.ops-list i{color:var(--primary);font-style:normal}.content-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px}.content-toolbar p{color:var(--muted);font-size:12px;margin:0}.filter-toolbar{margin-bottom:14px}.filter-toolbar form{display:flex;gap:8px}.filter-toolbar input,.filter-toolbar select,.table-wrap select{border:1px solid var(--line);border-radius:8px;background:#fff;padding:9px 10px;font-size:11px;color:var(--ink)}.filter-toolbar input{min-width:240px}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;font-size:11px;min-width:720px}th{text-align:left;color:#93a098;font-size:9px;letter-spacing:.7px;text-transform:uppercase;padding:11px 10px;border-bottom:1px solid var(--line)}td{padding:12px 10px;border-bottom:1px solid #eef2eb;vertical-align:middle}td small,td del{display:block;color:var(--muted);font-size:9px;margin-top:2px}.table-product{display:flex;align-items:center;gap:9px}.table-product img{width:34px;height:34px;object-fit:cover;border-radius:8px}.table-product .avatar{height:32px;width:32px}.table-link{color:var(--primary-dark)}.action-link{border:0;background:transparent;color:var(--primary-dark);font-weight:750;font-size:11px;padding:0;margin-right:8px}.action-link.danger{color:var(--danger)}.inline{display:inline}.pagination-wrap nav{margin-top:15px}.back-link{font-size:12px;color:var(--primary-dark);font-weight:750;margin-bottom:18px}.admin-form{}.form-layout{display:grid;grid-template-columns:1.15fr 1fr .75fr;gap:16px}.form-layout .form-card{height:max-content}.form-help{color:var(--muted);font-size:10px}.image-preview{background:#edf7e4;border-radius:12px;overflow:hidden}.image-preview img{width:100%;height:150px;object-fit:cover}.color-row{display:flex;gap:10px}.color-row label{flex:1}.color-row input{height:40px;padding:3px}.settings-chip{background:#e8f6df;color:var(--primary-dark);border-radius:8px;padding:8px 10px;font-size:10px;font-weight:750}.quote-result{display:flex;justify-content:space-between;align-items:center;background:#eaf7df;border:1px solid #cce6b9;border-radius:15px;padding:17px 20px;margin-bottom:17px}.quote-result h2{font-size:26px;color:var(--primary-dark);margin:3px 0}.quote-result p{color:var(--muted);font-size:11px;margin:0}.quote-breakdown{display:flex;gap:15px}.quote-breakdown span{font-size:10px;color:var(--muted)}.quote-breakdown b{display:block;color:var(--ink);margin-top:3px}.admin-order-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px}.admin-order-head h2{margin:6px 0 8px}.order-actions form{display:flex;gap:8px}.order-actions select{border:1px solid var(--line);border-radius:8px;background:#fff;padding:10px;font-size:11px}.admin-order-grid{display:grid;grid-template-columns:1fr 300px;gap:17px}.admin-order-grid .dashboard-panel{margin-bottom:17px}.driver-job{display:grid;grid-template-columns:40px 1fr auto auto;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--line)}.driver-job:last-child{border:0}.job-icon{height:34px;width:34px;border-radius:10px;background:#e6f4d9;display:grid;place-items:center}.driver-job b,.driver-job small{display:block}.driver-job b{font-size:12px}.driver-job small{font-size:10px;color:var(--muted);margin-top:3px}.job-actions form{display:flex;gap:5px}.job-actions select{border:1px solid var(--line);border-radius:7px;padding:7px;font-size:10px}.online-toggle{border:1px solid #d5e8c5;background:#f0f8e9;color:var(--primary-dark);border-radius:20px;padding:10px 16px;font-size:12px;font-weight:800}.online-toggle.on{background:var(--primary-dark);color:#fff}.installer-body{background:linear-gradient(135deg,#eef7e2,#fbfdf9);min-height:100vh;padding:35px 15px}.installer{width:min(800px,100%);margin:auto;background:#fff;border:1px solid var(--line);border-radius:24px;padding:30px;box-shadow:var(--shadow)}.installer-head{padding-bottom:20px;border-bottom:1px solid var(--line)}.installer-head .brand-mark{height:38px;width:38px}.installer-intro h1{font-size:32px;letter-spacing:-1.5px;margin:8px 0}.installer-intro p{color:var(--muted);max-width:600px}.requirements{display:flex;flex-wrap:wrap;gap:7px;margin:20px 0}.requirements h3{width:100%;font-size:13px}.requirement{font-size:10px;padding:5px 8px;border-radius:6px}.requirement.ok{background:#e8f5df;color:#32702a}.requirement.fail{background:#ffe7e4;color:#b32e27}.installer-section{border-top:1px solid var(--line);padding-top:17px;margin-top:20px}.installer-section h2{font-size:16px}.installer-foot{text-align:center;color:var(--muted);font-size:10px;margin:20px 0 0}
@media(max-width:1050px){.category-grid{grid-template-columns:repeat(5,1fr)}.header-main{gap:14px}.location-chip{display:none}.form-layout{grid-template-columns:1fr 1fr}.form-layout .form-card:last-child{grid-column:1/-1}.admin-stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.container{width:min(100% - 28px,600px)}.top-links,.delivery-note{display:none}.top-strip-inner{justify-content:center}.header-main{flex-wrap:wrap;padding:11px 0;gap:10px}.brand{min-width:0;flex:1}.brand strong{font-size:13px}.brand-mark{height:36px;width:36px;font-size:20px}.search-box{order:3;flex-basis:100%;height:42px}.header-actions{gap:9px}.login-link{display:none}.nav-row{min-height:42px}.mobile-menu{display:block}.nav-row nav{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;padding:12px 16px;border-bottom:1px solid var(--line);box-shadow:var(--shadow);flex-direction:column;align-items:stretch;gap:0}.nav-row nav.open{display:flex}.nav-row nav a{padding:10px}.hero-grid{grid-template-columns:1fr;gap:0;min-height:0;padding:50px 0 35px}.hero-copy h1{font-size:45px}.hero-art{min-height:265px}.hero-art img{width:300px}.art-blob{width:260px;height:260px}.floating-card{right:3px;bottom:20px}.section{padding:38px 0}.section-heading h2{font-size:21px}.category-grid{grid-template-columns:repeat(5,1fr);gap:7px}.category-pill{padding:10px 3px}.category-icon{font-size:23px}.category-pill strong{font-size:9px}.category-pill small{display:none}.product-grid{grid-template-columns:repeat(2,1fr);gap:10px}.product-image{height:150px}.product-body{padding:10px}.product-body h3{font-size:12px}.price-row strong{font-size:14px}.product-meta{font-size:8px}.split-section,.article-grid,.two-panel{grid-template-columns:1fr;gap:18px}.split-copy h2{font-size:32px}.store-grid{gap:8px}.store-card{padding:10px}.store-card strong{font-size:10px}.store-card span{font-size:8px}.footer-grid{grid-template-columns:1fr 1fr;gap:20px}.footer-grid>div:first-child{grid-column:1/-1}.footer-bottom .container{flex-direction:column;gap:4px}.page-head{padding:30px 0 20px;align-items:start;flex-direction:column;gap:10px}.page-head h1{font-size:28px}.shop-layout,.cart-layout,.checkout-layout,.order-detail-layout{grid-template-columns:1fr}.filter-card{order:1}.shop-results{order:0}.filter-card form{display:grid;grid-template-columns:1fr 1fr;gap:0 10px}.filter-card form>label:first-child,.filter-card form>.btn{grid-column:1/-1}.filter-card .two-col{grid-column:1/-1}.results-toolbar{margin-top:0}.filter-card{padding:14px}.sticky{position:static}.product-detail{grid-template-columns:1fr;gap:20px;padding-top:10px}.main-photo{height:330px}.product-info h1{font-size:28px}.detail-price{font-size:25px}.info-box{gap:4px}.info-box>div+div{padding-left:7px}.info-box b{font-size:9px}.info-box small{font-size:8px}.buy-form{flex-wrap:wrap}.buy-form .btn{flex:1}.detail-actions{justify-content:space-between}.spec-grid{grid-template-columns:1fr 1fr}.article-detail h1,.simple-page h1{font-size:31px}.auth-card{padding:22px}.shipping-options,.payment-options{grid-template-columns:1fr}.cart-line{grid-template-columns:50px 1fr auto}.cart-line>img{width:50px;height:50px}.cart-line .quantity{grid-column:2}.line-total{grid-column:3;grid-row:2}.cart-line>form:last-child{grid-column:3;grid-row:1}.stepper{font-size:9px}.account-layout{grid-template-columns:1fr}.account-nav{display:flex;overflow:auto}.account-user{display:none}.account-nav>a,.account-nav form button{white-space:nowrap;padding:11px;font-size:10px}.account-nav form{border:0}.order-card-body>strong{display:none}.order-detail-head{align-items:start;flex-direction:column;gap:9px}.admin-sidebar{display:none;position:fixed;inset:0 auto 0 0;width:250px;z-index:40;box-shadow:var(--shadow)}.admin-sidebar.open{display:flex}.admin-topbar{padding:15px}.admin-topbar .mobile-menu{display:block;margin-right:12px}.admin-topbar>div:first-of-type{flex:1}.admin-name{display:none}.admin-content{padding:18px 14px}.admin-grid,.admin-grid.two,.admin-order-grid{grid-template-columns:1fr}.admin-stats{gap:8px}.admin-stat{padding:12px}.admin-stat strong{font-size:18px}.filter-toolbar form{flex-wrap:wrap}.filter-toolbar input{min-width:0;flex:1}.form-layout{grid-template-columns:1fr}.form-layout .form-card:last-child{grid-column:auto}.quote-result{display:block}.quote-breakdown{flex-wrap:wrap;margin-top:12px}.admin-order-head{display:block}.order-actions form{margin-top:15px}.driver-job{grid-template-columns:35px 1fr auto}.job-actions{grid-column:2/-1}.installer{padding:20px}.installer-intro h1{font-size:27px}}

/* Source: public/css/extra.css */
.promo-slider{margin-top:22px;position:relative}.promo-slide{display:none;min-height:150px;background:#dceec7;border-radius:19px;overflow:hidden;position:relative}.promo-slide.active{display:block}.promo-slide picture{display:block}.promo-slide img{height:150px;width:100%;object-fit:cover;opacity:.52}.promo-slide>div{position:absolute;inset:0;padding:28px 34px;background:linear-gradient(90deg,rgba(238,250,225,.98) 0%,rgba(238,250,225,.7) 45%,rgba(238,250,225,0) 80%)}.promo-slide h2{font-size:27px;letter-spacing:-1px;margin:7px 0;color:var(--primary-dark)}.promo-slide b{color:var(--primary-dark);font-size:12px}.slider-dots{display:flex;gap:5px;position:absolute;right:24px;bottom:17px}.slider-dots button{height:7px;width:7px;border:0;border-radius:8px;background:#b8cf9d;padding:0}.slider-dots button.active{width:20px;background:var(--primary-dark)}
.brand-logo{width:42px;height:42px;object-fit:contain;flex:0 0 auto}.admin-brand .brand-logo{width:40px;height:40px}.branding-preview{min-height:120px}.branding-preview span{font-size:50px}.branding-preview img{max-height:110px;object-fit:contain}.media-setting-row{align-items:start}.mini-media-preview{display:block;width:52px;height:52px;object-fit:contain;border:1px solid #dfe8da;border-radius:10px;margin:0 0 10px}.mini-media-preview.wide{width:120px;height:63px;object-fit:cover}
.gallery-admin-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:12px 0 18px}.gallery-admin-item{margin:0!important}.gallery-admin-item img{display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;border:1px solid #dfe8da}.gallery-admin-item span{display:flex;align-items:center;gap:5px;font-size:11px;margin-top:5px}.gallery-admin-item input{width:auto!important;margin:0!important}
.compact-media{display:flex!important;align-items:center;gap:8px}.compact-media>img{width:36px;height:36px;object-fit:cover;border-radius:8px;border:1px solid #dfe8da}.inline-actions{display:flex;align-items:center;gap:8px}.inline-actions form{margin:0}
.payment-account-list{display:grid;gap:8px;margin:10px 0 14px}.payment-account{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid #e2eadc;border-radius:10px}.payment-account img{width:34px;height:34px;object-fit:contain}.payment-account div{display:grid}.payment-account small,.payment-account span{font-size:11px;color:#637078}.payment-account b{font-size:14px}
.detail-actions form{display:inline;margin:0}.detail-actions form button{font:inherit}.qris-admin-preview{display:block;width:180px;max-width:100%;aspect-ratio:1;object-fit:contain;border:1px solid #dfe8da;border-radius:12px;margin:0 0 14px}.qris-payment{display:grid;justify-items:center;gap:6px;padding:12px;margin:10px 0;border:1px solid #e2eadc;border-radius:12px;text-align:center}.qris-payment img{width:220px;max-width:100%;aspect-ratio:1;object-fit:contain}.qris-payment small{color:#637078}.store-profile-photo{width:72px;height:72px;object-fit:cover;border-radius:50%;border:2px solid #dfe8da;margin-bottom:8px}.restore-form input{width:118px!important;padding:6px 8px!important;margin:0 4px!important;font-size:11px}
@media(max-width:760px){.promo-slide>div{padding:25px 18px}.promo-slide h2{font-size:21px}.promo-slide img{height:140px}.gallery-admin-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.category-icon img{width:42px;height:42px;margin:0 auto;object-fit:cover;border-radius:12px}.store-avatar{overflow:hidden}.store-avatar img{width:100%;height:100%;object-fit:cover}
.otp-card{max-width:480px}.otp-input{text-align:center;font-size:28px!important;letter-spacing:9px;font-weight:800;color:var(--primary-dark)}.otp-resend{text-align:center;margin-top:14px}.otp-resend button{border:0;background:transparent;color:var(--primary-dark);font-size:12px;font-weight:750}.otp-help{margin:-4px 0 12px}.email-settings-card,.email-events-card{grid-column:span 1}.save-settings-card{background:#f3f8ee}.email-admin-tools{margin-top:18px}.test-email-form{display:flex;align-items:end;gap:10px}.test-email-form label{flex:1;font-size:11px;font-weight:750;color:#53635b}.test-email-form input{display:block;width:100%;margin-top:6px;border:1px solid #dbe5d5;border-radius:9px;padding:10px 11px}.email-log-list>div{display:grid;grid-template-columns:auto 1fr;gap:2px 9px;padding:9px 0;border-bottom:1px solid var(--line)}.email-log-list>div:last-child{border:0}.email-log-list .status{grid-row:span 2}.email-log-list b{font-size:11px}.email-log-list small{font-size:9px;color:var(--muted)}

/* Role-safe application shells and fixed mobile navigation. */
.header-menu-toggle,.sidebar-close{border:0;background:#edf7df;color:var(--primary-dark);width:40px;height:40px;border-radius:12px;font-size:20px;display:grid;place-items:center;flex:none}.sidebar-close{display:none;margin-left:auto;background:#f2f5ef}.nav-overlay{position:fixed;inset:0;background:rgba(22,36,25,.48);z-index:89;opacity:0;visibility:hidden;transition:.2s}.nav-overlay.open{opacity:1;visibility:visible}.nav-drawer{position:fixed;inset:0 0 0 auto;width:min(360px,88vw);z-index:90;background:#fff;box-shadow:-18px 0 45px rgba(21,37,24,.17);padding:20px;transform:translateX(105%);transition:transform .24s ease;display:flex;flex-direction:column}.nav-drawer.open{transform:translateX(0)}.drawer-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:16px;border-bottom:1px solid var(--line)}.drawer-head b{font-size:18px;color:var(--primary-dark)}.drawer-head button{border:0;background:#f2f5ef;width:36px;height:36px;border-radius:10px;font-size:24px;color:var(--ink)}.drawer-user{display:flex;align-items:center;gap:11px;background:#f3f8ee;border-radius:14px;padding:13px;margin:16px 0}.drawer-user b,.drawer-user small{display:block}.drawer-user b{font-size:13px}.drawer-user small{color:var(--muted);font-size:10px}.nav-drawer nav{display:flex;flex-direction:column;gap:3px}.nav-drawer nav a{padding:12px;border-radius:10px;font-size:13px;color:#56645d}.nav-drawer nav a:hover{background:#edf7e5;color:var(--primary-dark)}.drawer-logout{margin-top:auto;border-top:1px solid var(--line);padding-top:12px}.drawer-logout button{width:100%;border:0;background:#fff3f1;color:var(--danger);border-radius:10px;text-align:left;padding:12px}.nav-is-open{overflow:hidden}.app-bottom-nav{display:none}.role-header{position:sticky;top:0;z-index:30;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 4px 18px rgba(45,71,38,.04)}.role-header-inner{display:flex;align-items:center;gap:25px;min-height:78px}.role-search{flex:1;height:42px;display:flex;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fafcf8}.role-search input{border:0;background:transparent;outline:0;padding:0 14px;min-width:0;flex:1}.role-search button{border:0;background:var(--primary-dark);color:#fff;width:46px}.role-header-actions{display:flex;align-items:center;gap:12px}.marketplace-link{font-size:12px;font-weight:750;color:var(--primary-dark)}.role-footer{background:#fff;border-top:1px solid var(--line);margin-top:55px;padding:22px 0}.role-footer>.container{display:flex;align-items:center;gap:28px}.role-footer b,.role-footer small{display:block}.role-footer small,.role-footer span{font-size:10px;color:var(--muted)}.role-footer div>div:nth-child(2){display:flex;gap:18px;margin-left:auto}.role-footer a{font-size:11px;color:var(--primary-dark)}.partner-header{border-top:4px solid var(--accent)}.partner-footer{border-top:3px solid var(--accent)}.admin-shell{min-height:100vh}.admin-sidebar{height:100vh;position:sticky;top:0;overflow:auto;flex:none}.admin-main{display:flex;min-height:100vh;flex-direction:column}.admin-topbar{position:sticky;top:0;z-index:30}.admin-page-content{flex:1}.admin-footer{display:flex;justify-content:space-between;gap:15px;padding:16px 30px;background:#fff;border-top:1px solid var(--line);font-size:10px;color:var(--muted)}.admin-footer a{color:var(--primary-dark);font-weight:750}.admin-menu-toggle{display:none}.admin-brand>div{min-width:0}.sidebar-close{font-size:21px}
@media(max-width:760px){
  .has-app-nav{padding-bottom:calc(67px + env(safe-area-inset-bottom))}.app-bottom-nav{position:fixed;display:flex;align-items:stretch;justify-content:space-around;left:0;right:0;bottom:0;height:calc(64px + env(safe-area-inset-bottom));padding:5px 5px env(safe-area-inset-bottom);background:#fff;border-top:1px solid #dfe8da;box-shadow:0 -8px 24px rgba(31,54,35,.10);z-index:80}.app-bottom-nav a,.app-bottom-nav button{position:relative;flex:1;min-width:0;border:0;background:transparent;color:#7b8780;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:3px}.app-bottom-nav span{font-size:20px;line-height:1.1}.app-bottom-nav small{font-size:9px;white-space:nowrap}.app-bottom-nav a.active,.app-bottom-nav button.active{color:var(--primary-dark);font-weight:800}.app-bottom-nav i{position:absolute;top:2px;left:54%;background:var(--danger);color:#fff;border-radius:10px;font-size:8px;font-style:normal;padding:1px 5px}.admin-bottom-nav{background:#263a2a;border-color:#334d38}.admin-bottom-nav a,.admin-bottom-nav button{color:#bbcabd}.admin-bottom-nav a.active{color:#d4efa8}.partner-bottom-nav{border-top:3px solid var(--accent)}
  .top-strip{display:none}.app-site-header{top:0}.app-site-header .header-main{flex-wrap:nowrap}.app-site-header .search-box{position:absolute;top:100%;left:14px;right:14px;margin-top:8px;display:none}.app-site-header .location-chip,.app-site-header .login-link,.app-site-header .header-actions>.btn{display:none}.app-site-header .brand span:last-child small{display:none}.app-site-header .nav-row{display:none}.app-site-header{margin-bottom:0}.header-menu-toggle{display:grid}.storefront-layout main{min-height:55vh}.storefront-footer{display:none}.floating-wa{bottom:82px}
  .role-header-inner{min-height:64px;gap:10px}.role-header .brand{flex:1}.role-header .brand small{display:none}.role-header .brand-logo{width:36px;height:36px}.role-search{display:none}.marketplace-link{display:none}.role-footer{display:none}
  .admin-sidebar{display:flex;transform:translateX(-105%);transition:transform .23s ease;width:min(280px,88vw);z-index:90}.admin-sidebar.open{transform:translateX(0)}.admin-overlay{z-index:89}.admin-menu-toggle,.sidebar-close{display:grid}.admin-topbar{padding:12px 14px}.admin-topbar h1{font-size:18px}.admin-top-actions .avatar{display:none}.admin-footer{padding:13px 14px}.admin-shell{min-height:calc(100vh - 67px)}.admin-main{min-height:calc(100vh - 67px)}
}

/* Source: public/css/ui-pro.css */
/*
 * Lapak Buah Umaiza — Professional UI layer
 * Bootstrap 5.3 foundation with role-safe marketplace shells.
 */
:root {
    --ui-primary: var(--primary, #5f9f32);
    --ui-primary-dark: var(--primary-dark, #285c36);
    --ui-accent: var(--accent, #ffb020);
    --ui-danger: var(--danger, #dc3545);
    --ui-bg: var(--bg, #f5f7f6);
    --ui-ink: var(--ink, #17231c);
    --ui-muted: #66766e;
    --ui-line: #e2e9e5;
    --ui-surface: #fff;
    --ui-soft: #f2f7f3;
    --ui-radius-sm: 10px;
    --ui-radius: 16px;
    --ui-radius-lg: 24px;
    --ui-shadow-sm: 0 4px 14px rgba(20, 47, 31, .06);
    --ui-shadow: 0 14px 38px rgba(20, 47, 31, .09);
    --ui-shadow-lg: 0 24px 60px rgba(20, 47, 31, .14);
    --bs-primary: var(--ui-primary-dark);
    --bs-primary-rgb: 40, 92, 54;
    --bs-body-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --bs-body-color: var(--ui-ink);
    --bs-body-bg: var(--ui-bg);
    --bs-border-color: var(--ui-line);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    min-width: 320px;
    margin: 0;
    background: var(--ui-bg);
    color: var(--ui-ink);
    font-family: var(--bs-body-font-family);
    font-size: 14px;
    line-height: 1.55;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}
body.nav-is-open { overflow: auto; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--ui-primary-dark); }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
img { max-width: 100%; }
.container { width: 100%; max-width: 1240px; padding-right: 24px; padding-left: 24px; margin-right: auto; margin-left: auto; }
.ui-icon { display: inline-block; flex: 0 0 auto; vertical-align: -0.18em; }
.eyebrow { color: var(--ui-primary-dark); font-size: 11px; font-weight: 800; letter-spacing: .12em; line-height: 1.2; text-transform: uppercase; }
.eyebrow.light { color: rgba(255,255,255,.82); }
:focus-visible { outline: 3px solid color-mix(in srgb, var(--ui-primary) 35%, transparent); outline-offset: 2px; }

/* Bootstrap-aligned controls */
.btn {
    min-height: 42px;
    border-radius: 11px;
    padding: 9px 17px;
    font-size: 13px;
    font-weight: 750;
    letter-spacing: 0;
    box-shadow: none;
    transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
}
.btn:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(30, 73, 43, .12); }
.btn:active { transform: translateY(0); }
.btn-primary { border-color: var(--ui-primary-dark); background: var(--ui-primary-dark); color: #fff; }
.btn-primary:hover, .btn-primary:focus { border-color: #1d492a; background: #1d492a; color: #fff; }
.btn-secondary { border-color: color-mix(in srgb, var(--ui-primary) 85%, #000); background: var(--ui-primary); color: #102515; }
.btn-light { border-color: #fff; background: #fff; color: var(--ui-primary-dark); }
.btn-outline { border: 1px solid #cdd9d1; background: #fff; color: var(--ui-primary-dark); }
.btn-outline:hover { border-color: var(--ui-primary-dark); background: var(--ui-soft); color: var(--ui-primary-dark); }
.btn-danger-outline { border: 1px solid #efc5c9; background: #fff; color: var(--ui-danger); }
.btn-small { min-height: 36px; padding: 7px 13px; font-size: 12px; }
.btn-block { width: 100%; }
input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]), select, textarea {
    min-height: 44px;
    border: 1px solid #d8e1dc;
    border-radius: 11px;
    background: #fff;
    color: var(--ui-ink);
    transition: border-color .16s ease, box-shadow .16s ease;
}
input:focus, select:focus, textarea:focus { border-color: var(--ui-primary); outline: 0; box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-primary) 16%, transparent); }
label { color: #36473d; font-weight: 650; }
.form-help { color: var(--ui-muted); font-size: 11px; font-weight: 450; }
.check { display: flex; align-items: center; gap: 8px; }
.check input { width: 17px; height: 17px; accent-color: var(--ui-primary-dark); }
.alert {
    min-height: 48px;
    margin: 16px auto 0;
    border: 1px solid transparent;
    border-radius: 13px;
    padding: 13px 44px 13px 16px;
    box-shadow: var(--ui-shadow-sm);
    font-size: 13px;
}
.alert.success { border-color: #b9ddc4; background: #eaf7ee; color: #1d6535; }
.alert.warning { border-color: #eed69d; background: #fff8e3; color: #795600; }
.alert.error { border-color: #efc3c6; background: #fff0f1; color: #9c2630; }
.alert button { top: 8px; right: 9px; width: 30px; height: 30px; border-radius: 8px; }
.status {
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    border-radius: 999px;
    padding: 4px 9px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .01em;
    white-space: nowrap;
}
.status.success, .status.completed, .status.delivered, .status.paid, .status.verified { background: #e7f6eb; color: #24713d; }
.status.warning, .status.awaiting_payment, .status.payment_review, .status.pending, .status.offered { background: #fff4d8; color: #876000; }
.status.processing, .status.accepted, .status.to_store, .status.at_store, .status.picked_up, .status.in_transit, .status.arrived { background: #e7f1ff; color: #2663a5; }
.status.problem, .status.cancelled, .status.rejected, .status.failed { background: #ffebed; color: #aa3340; }

/* Brand and shared top navigation */
.brand { display: inline-flex; min-width: 0; align-items: center; gap: 11px; }
.brand-logo { width: 43px; height: 43px; border-radius: 12px; object-fit: contain; }
.brand-mark {
    display: grid;
    width: 43px;
    height: 43px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 13px;
    background: linear-gradient(145deg, var(--ui-primary), var(--ui-primary-dark));
    box-shadow: 0 7px 18px color-mix(in srgb, var(--ui-primary-dark) 25%, transparent);
    color: #fff;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: -.04em;
}
.brand strong { display: block; overflow: hidden; color: var(--ui-primary-dark); font-size: 15px; font-weight: 850; letter-spacing: -.02em; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.brand small { display: block; margin-top: 1px; color: var(--ui-muted); font-size: 10px; line-height: 1.35; }
.top-strip { border: 0; background: #173d27; color: #eaf5ed; }
.top-strip-inner { min-height: 34px; padding-top: 0; padding-bottom: 0; font-size: 11px; }
.top-promise { display: inline-flex; align-items: center; gap: 7px; }
.top-links { gap: 23px; }
.top-links a { color: #dcebe0; }
.top-links a:hover { color: #fff; }
.site-header { position: sticky; z-index: 1020; top: 0; border-bottom: 1px solid var(--ui-line); background: rgba(255,255,255,.96); box-shadow: 0 4px 18px rgba(22, 54, 34, .05); backdrop-filter: blur(12px); }
.header-main { min-height: 74px; gap: 22px; padding-top: 11px; padding-bottom: 11px; }
.header-main > .brand { width: 228px; flex: 0 0 auto; }
.search-box {
    height: 45px;
    border: 1px solid #cfdad3;
    border-radius: 12px;
    background: #f8faf9;
    box-shadow: inset 0 1px 2px rgba(17, 50, 29, .02);
}
.search-box > .ui-icon { margin-left: 14px; color: #78877f; }
.search-box input:not([type]) { min-height: 0; height: 100%; border: 0; border-radius: 0; padding: 0 12px; background: transparent; box-shadow: none; }
.search-box button { min-width: 74px; border: 0; background: var(--ui-primary-dark); font-size: 12px; font-weight: 800; }
.search-box:focus-within { border-color: var(--ui-primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-primary) 13%, transparent); }
.header-actions { gap: 11px; }
.location-chip { align-items: center; gap: 9px; padding: 5px 7px; border-radius: 10px; color: var(--ui-muted); }
.location-chip:hover { background: var(--ui-soft); }
.location-chip > span { display: grid; font-size: 9px; line-height: 1.25; }
.location-chip small { overflow: hidden; max-width: 105px; color: var(--ui-ink); font-size: 11px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.header-icon-button { display: grid; width: 42px; height: 42px; place-items: center; border: 1px solid var(--ui-line); border-radius: 12px; background: #fff; color: #3d5145; }
.header-icon-button:hover { border-color: #bfd1c5; background: var(--ui-soft); color: var(--ui-primary-dark); }
.icon-link { font-size: inherit; }
.icon-link i { top: -5px; right: -5px; display: grid; min-width: 18px; height: 18px; place-items: center; border: 2px solid #fff; border-radius: 999px; padding: 0 4px; background: var(--ui-danger); color: #fff; font-size: 9px; line-height: 1; }
.avatar { width: 38px; height: 38px; background: #dceecd; color: var(--ui-primary-dark); font-size: 13px; }
.avatar-link { border: 2px solid #fff; box-shadow: 0 0 0 1px #d1ded5; }
.login-link { padding: 9px 4px; font-size: 12px; }
.header-menu-toggle, .sidebar-close, .drawer-close {
    display: grid;
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid var(--ui-line);
    border-radius: 12px;
    background: #fff;
    color: var(--ui-primary-dark);
}
.header-menu-toggle:hover, .drawer-close:hover { border-color: #bed2c4; background: var(--ui-soft); }
.nav-row { min-height: 43px; gap: 22px; border-top: 1px solid #f0f3f1; }
.nav-row nav { gap: 30px; }
.nav-row nav a { position: relative; border: 0; padding: 12px 0; color: #58685f; font-size: 12px; font-weight: 650; }
.nav-row nav a::after { position: absolute; right: 0; bottom: 0; left: 0; height: 2px; border-radius: 2px; background: var(--ui-primary); content: ''; opacity: 0; transform: scaleX(.25); transition: .18s ease; }
.nav-row nav a:hover, .nav-row nav a.active { border: 0; color: var(--ui-primary-dark); }
.nav-row nav a:hover::after, .nav-row nav a.active::after { opacity: 1; transform: scaleX(1); }
.delivery-note { display: inline-flex; align-items: center; gap: 7px; color: #607269; font-size: 11px; }
.mobile-search-row { display: none; }

/* Bootstrap off-canvas navigation */
.offcanvas-backdrop.show { opacity: .42; }
.nav-drawer.offcanvas { width: min(390px, 92vw); border-left: 0; padding: 0; background: #fff; box-shadow: -22px 0 55px rgba(15, 41, 24, .18); }
.nav-drawer .drawer-head { min-height: 88px; border-bottom: 1px solid var(--ui-line); padding: 19px 22px; }
.drawer-head h2 { margin: 3px 0 0; color: var(--ui-ink); font-size: 21px; font-weight: 800; letter-spacing: -.025em; }
.drawer-body { display: flex; flex-direction: column; padding: 18px 20px 20px; }
.drawer-user { gap: 12px; margin: 0 0 18px; border: 1px solid #dfe8e2; border-radius: 14px; padding: 13px; background: #f5f9f6; }
.drawer-user b { color: var(--ui-ink); font-size: 13px; }
.drawer-user small { margin-top: 2px; color: var(--ui-muted); font-size: 10px; }
.nav-drawer nav { gap: 3px; }
.nav-drawer nav a { display: flex; min-height: 46px; align-items: center; gap: 12px; border-radius: 11px; padding: 10px 12px; color: #4d5e54; font-size: 13px; font-weight: 650; }
.nav-drawer nav a:hover, .nav-drawer nav a.active { background: #eaf5ec; color: var(--ui-primary-dark); }
.nav-drawer nav a .ui-icon { width: 19px; height: 19px; }
.drawer-logout { margin-top: auto; border-top: 1px solid var(--ui-line); padding-top: 14px; }
.drawer-logout button { display: flex; width: 100%; min-height: 44px; align-items: center; gap: 12px; border: 0; border-radius: 11px; padding: 10px 12px; background: #fff0f1; color: #a92f39; font-weight: 700; }

/* Storefront footer and application navigation */
.footer { margin-top: 76px; border: 0; background: #123321; color: #d8e8dc; }
.footer-grid { grid-template-columns: 1.55fr .75fr .85fr 1fr; gap: 54px; padding-top: 56px; padding-bottom: 46px; }
.footer .brand { margin-bottom: 17px; }
.footer .brand strong { color: #fff; }
.footer .brand small { color: #a9c0af; }
.footer .brand-mark { background: linear-gradient(145deg, #8bc653, #5a9635); }
.footer h4 { margin: 5px 0 18px; color: #fff; font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.footer p { color: #b2c7b8; font-size: 12px; line-height: 1.7; }
.footer a { display: flex; width: max-content; align-items: center; gap: 6px; margin: 0 0 11px; color: #c9d9cd; font-size: 12px; }
.footer a:hover { color: #fff; }
.footer-about > p { max-width: 360px; margin: 0; }
.footer-trust { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.footer-trust span { display: inline-flex; align-items: center; gap: 6px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; padding: 6px 9px; color: #cce0d1; font-size: 10px; }
.footer-contact { display: flex; align-items: center; gap: 8px; margin-bottom: 10px !important; }
.footer .wa-link { margin-top: 15px; color: #9fd36d; font-weight: 750; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.1); background: rgba(0,0,0,.08); }
.footer-bottom .container { min-height: 55px; padding-top: 0; padding-bottom: 0; color: #9eb3a3; font-size: 10px; }
.app-bottom-nav { display: none; }
.floating-wa { right: 24px; bottom: 24px; display: grid; width: 52px; height: 52px; place-items: center; border: 4px solid #fff; border-radius: 50%; background: #25d366; box-shadow: 0 12px 28px rgba(10, 89, 44, .28); color: #fff; }
.floating-wa:hover { color: #fff; transform: translateY(-2px); }

/* Storefront content */
main { min-height: 45vh; }
.promo-slider { margin-top: 24px; }
.promo-slide { min-height: 190px; border: 1px solid #d9e8d7; border-radius: 22px; box-shadow: var(--ui-shadow-sm); }
.promo-slide img { height: 190px; }
.promo-slide > div { padding: 39px 46px; background: linear-gradient(90deg, rgba(239,249,235,.98) 0%, rgba(239,249,235,.77) 52%, rgba(239,249,235,.05) 88%); }
.promo-slide h2 { max-width: 620px; margin: 8px 0 9px; font-size: 31px; font-weight: 850; letter-spacing: -.04em; }
.promo-slide b { display: inline-flex; align-items: center; font-size: 12px; }
.slider-dots { right: 28px; bottom: 22px; gap: 7px; }
.slider-dots button { width: 8px; height: 8px; border-radius: 99px; background: rgba(35, 77, 44, .28); }
.slider-dots button.active { width: 26px; background: var(--ui-primary-dark); }
.hero-wrap { overflow: hidden; border-bottom: 1px solid #dfe9df; background: radial-gradient(circle at 78% 45%, rgba(168,212,115,.24), transparent 34%), linear-gradient(135deg, #f8fbf5 0%, #eef6e9 100%); }
.hero-grid { min-height: 530px; padding-top: 64px; padding-bottom: 62px; }
.hero-copy { position: relative; z-index: 2; }
.hero-copy h1 { max-width: 610px; margin: 13px 0 20px; color: #152d1c; font-size: clamp(48px, 5.1vw, 72px); font-weight: 850; letter-spacing: -.065em; line-height: .98; }
.hero-copy h1 em { color: var(--ui-primary); font-family: inherit; font-weight: 850; }
.hero-copy > p { max-width: 570px; color: #5b6d61; font-size: 16px; line-height: 1.75; }
.hero-actions { margin-top: 28px; gap: 20px; }
.hero-actions .btn { min-height: 48px; padding: 12px 21px; }
.hero-trust { margin-top: 30px; gap: 19px; }
.hero-trust span { color: #506159; font-size: 11px; font-weight: 700; }
.hero-art { min-height: 410px; }
.hero-art img { width: min(460px, 92%); filter: drop-shadow(0 28px 28px rgba(44, 80, 31, .17)); }
.art-blob { width: 390px; height: 390px; background: linear-gradient(145deg, #dfefce, #bcd990); }
.floating-card { right: 12px; bottom: 42px; border: 1px solid rgba(255,255,255,.8); border-radius: 16px; padding: 14px 18px; box-shadow: var(--ui-shadow); backdrop-filter: blur(12px); }
.floating-card b { font-size: 12px; }
.floating-card span { color: var(--ui-muted); font-size: 10px; }
.section { padding-top: 68px; padding-bottom: 68px; }
.section-heading { margin-bottom: 25px; }
.section-heading h2 { margin: 5px 0 0; color: #1b2d22; font-size: 29px; font-weight: 820; letter-spacing: -.035em; }
.text-link { display: inline-flex; align-items: center; color: var(--ui-primary-dark); font-size: 12px; font-weight: 750; }
.category-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 13px; }
.category-pill { min-width: 0; border: 1px solid var(--ui-line); border-radius: 17px; padding: 19px 10px 16px; background: #fff; box-shadow: 0 3px 10px rgba(24, 54, 34, .035); transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.category-pill:hover { border-color: #c3d8c7; box-shadow: var(--ui-shadow); transform: translateY(-3px); }
.category-icon { width: 58px; height: 58px; margin: 0 auto 11px; border-radius: 16px; background: #eff7e9; font-size: 30px; }
.category-icon img { width: 100%; height: 100%; border-radius: 16px; object-fit: cover; }
.category-fallback { display: grid; width: 100%; height: 100%; place-items: center; color: var(--ui-primary-dark); font-size: 21px; font-weight: 900; }
.category-pill strong { overflow: hidden; color: #293b30; font-size: 12px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.category-pill small { margin-top: 3px; color: var(--ui-muted); font-size: 9px; }
.product-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.product-card { overflow: hidden; min-width: 0; border: 1px solid var(--ui-line); border-radius: 17px; background: #fff; box-shadow: 0 3px 12px rgba(26, 56, 36, .04); transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.product-card:hover { border-color: #c4d6ca; box-shadow: var(--ui-shadow); transform: translateY(-4px); }
.product-image { height: 224px; background: #f1f5f1; }
.product-image img { transition: transform .35s ease; }
.product-card:hover .product-image img { transform: scale(1.035); }
.product-image .badge { top: 12px; left: 12px; border-radius: 7px; padding: 6px 8px; font-size: 9px; font-weight: 850; }
.product-image .badge.low { right: 12px; left: auto; }
.product-body { padding: 15px; }
.product-store { display: flex; overflow: hidden; align-items: center; gap: 4px; margin-bottom: 4px; color: #75837b; font-size: 9px; font-weight: 700; letter-spacing: .03em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.product-body h3 { min-height: 40px; margin: 0 0 6px; font-size: 13px; font-weight: 730; line-height: 1.5; }
.product-body h3 a:hover { color: var(--ui-primary-dark); }
.rating { display: flex; align-items: center; gap: 4px; color: #e99a0a; font-size: 10px; }
.rating span { color: #8a958e; }
.price-row { min-height: 44px; margin-top: 8px; }
.price-row strong { color: #1f6a35; font-size: 17px; font-weight: 850; letter-spacing: -.025em; }
.price-row del { color: #9ba59f; font-size: 9px; }
.product-meta { margin: 7px 0 13px; color: #77847d; font-size: 9px; }
.product-card .btn { min-height: 38px; border-radius: 10px; }
.flash-section { background: linear-gradient(125deg, #204b2d 0%, #326d3b 58%, #204b2d 100%); }
.flash-head { align-items: center; margin-bottom: 28px; }
.flash-head h2 { color: #fff; font-size: 30px; }
.countdown b { min-width: 39px; height: 38px; border: 1px solid rgba(255,255,255,.18); border-radius: 9px; background: rgba(255,255,255,.13); font-size: 15px; }
.countdown small { color: rgba(255,255,255,.7); }
.split-section { gap: 24px; }
.split-copy { border-radius: 22px; padding: 52px; background: linear-gradient(145deg, #f0f7e9, #e3f0d7); }
.split-copy h2 { margin: 9px 0 15px; font-size: 43px; font-weight: 830; letter-spacing: -.05em; }
.split-copy p { color: #5b6c61; font-size: 13px; line-height: 1.75; }
.store-grid { gap: 12px; }
.store-card { border: 1px solid var(--ui-line); border-radius: 15px; padding: 15px; background: #fff; box-shadow: var(--ui-shadow-sm); }
.store-card:hover { border-color: #c4d7c6; box-shadow: var(--ui-shadow); transform: translateX(3px); }
.store-avatar { width: 45px; height: 45px; border: 1px solid #dce7de; background: #edf5e9; }
.store-card strong { font-size: 12px; }
.store-card span { font-size: 9px; }
.soft-bg { border-top: 1px solid #e5ebe5; border-bottom: 1px solid #e5ebe5; background: #f0f5f1; }
.article-grid { gap: 19px; }
.article-card { overflow: hidden; border: 1px solid var(--ui-line); border-radius: 17px; background: #fff; box-shadow: var(--ui-shadow-sm); }
.article-card img { height: 185px; }
.article-card > div { padding: 19px; }
.article-card h3 { min-height: 44px; font-size: 15px; font-weight: 780; }
.article-card b { display: inline-flex; align-items: center; gap: 5px; }

/* General content, catalog, cart and authentication */
.page-head { padding-top: 48px; padding-bottom: 26px; }
.page-head.compact { padding-top: 42px; padding-bottom: 22px; }
.page-head h1 { margin: 7px 0 5px; color: #182c20; font-size: 34px; font-weight: 830; letter-spacing: -.045em; }
.page-head p { margin: 0; color: var(--ui-muted); font-size: 13px; }
.breadcrumb, .page-breadcrumb { color: var(--ui-muted); font-size: 10px; }
.filter-card, .summary-card, .checkout-card, .order-card, .account-nav, .account-content, .dashboard-panel, .form-card, .box {
    border: 1px solid var(--ui-line);
    border-radius: var(--ui-radius);
    background: #fff;
    box-shadow: var(--ui-shadow-sm);
}
.shop-layout { grid-template-columns: 245px minmax(0, 1fr); gap: 24px; padding-bottom: 42px; }
.filter-card { top: 130px; padding: 18px; }
.filter-title { margin-bottom: 14px; border-bottom: 1px solid var(--ui-line); padding-bottom: 12px; }
.filter-title strong { font-size: 14px; }
.filter-title a { font-size: 10px; }
.filter-card label { margin-bottom: 12px; font-size: 10px; }
.filter-card input, .filter-card select { margin-top: 6px; }
.results-toolbar { min-height: 47px; margin-bottom: 16px; border: 1px solid var(--ui-line); border-radius: 13px; padding: 8px 11px 8px 15px; background: #fff; box-shadow: var(--ui-shadow-sm); color: var(--ui-muted); font-size: 11px; }
.results-toolbar select { min-height: 34px; border-radius: 9px; padding: 5px 30px 5px 10px; font-size: 10px; }
.empty-state { border: 1px dashed #cdd9d1; border-radius: 17px; padding: 44px 22px; background: #fff; }
.empty-state > span { display: grid; width: 62px; height: 62px; margin: 0 auto 13px; place-items: center; border-radius: 18px; background: var(--ui-soft); font-size: 28px; }
.empty-state h2 { font-size: 18px; }
.pagination-wrap { margin-top: 22px; }
.pagination-wrap nav { display: flex; justify-content: center; }
.pagination { gap: 4px; }
.page-link { border-radius: 9px !important; color: var(--ui-primary-dark); }
.active > .page-link, .page-link.active { border-color: var(--ui-primary-dark); background: var(--ui-primary-dark); }
.cart-layout, .checkout-layout, .order-detail-layout { gap: 22px; }
.cart-store, .checkout-card, .summary-card { overflow: hidden; }
.cart-store-head { border-bottom: 1px solid var(--ui-line); padding: 15px 18px; background: #f7faf8; }
.cart-line { padding: 17px 18px; }
.summary-card { top: 130px; padding: 20px; }
.summary-card h2 { font-size: 17px; font-weight: 800; }
.secure-note { border-radius: 10px; padding: 10px; background: var(--ui-soft); color: var(--ui-muted); font-size: 9px; }
.secure-note, .payment-options b, .detail-actions a, .detail-actions button, .order-store-name { display: flex; align-items: center; gap: 6px; }
.auth-page { min-height: 670px; padding: 58px 20px; background: radial-gradient(circle at 20% 20%, rgba(145, 193, 92, .16), transparent 34%), linear-gradient(145deg, #f4f8f2, #fafcfb); }
.auth-card { width: min(460px, 100%); border: 1px solid #dce6df; border-radius: 22px; padding: 34px; box-shadow: var(--ui-shadow-lg); }
.auth-brand { margin-bottom: 25px; }
.auth-brand .brand-mark { width: 46px; height: 46px; }
.auth-card h1 { margin: 0 0 7px; font-size: 27px; font-weight: 830; letter-spacing: -.04em; }
.auth-card > p { color: var(--ui-muted); }
.auth-card form { margin-top: 22px; }
.auth-card form > label { margin-bottom: 15px; font-size: 11px; }
.password-input { border: 1px solid #d8e1dc; border-radius: 11px; background: #fff; }
.password-input:focus-within { border-color: var(--ui-primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-primary) 15%, transparent); }
.password-input input { border: 0 !important; box-shadow: none !important; }
.password-input button { color: var(--ui-primary-dark); font-size: 10px; font-weight: 750; }
.auth-divider { color: #8d9992; }

/* Shared customer and partner shells */
.role-header { z-index: 1020; top: 0; border: 0; border-bottom: 1px solid var(--ui-line); background: rgba(255,255,255,.97); box-shadow: 0 5px 18px rgba(25, 55, 35, .05); backdrop-filter: blur(12px); }
.role-header-inner { min-height: 75px; gap: 23px; }
.role-header .brand { min-width: 220px; }
.role-search { max-width: 610px; height: 44px; margin: 0 auto; border: 1px solid #d4ded7; border-radius: 12px; background: #f8faf9; }
.role-search > .ui-icon { margin-left: 14px; color: #728078; }
.role-search input:not([type]) { min-height: 0; border: 0; background: transparent; box-shadow: none; }
.role-search button { display: grid; width: 47px; place-items: center; background: var(--ui-primary-dark); }
.role-header-actions { gap: 10px; }
.marketplace-link { border-radius: 9px; padding: 8px 11px; background: var(--ui-soft); font-size: 11px; }
.partner-header { border-top: 0; box-shadow: inset 0 3px 0 var(--ui-accent), 0 5px 18px rgba(25, 55, 35, .05); }
.partner-context { display: flex; align-items: center; gap: 9px; margin-right: auto; border-left: 1px solid var(--ui-line); padding-left: 20px; }
.partner-context-icon { display: grid; width: 37px; height: 37px; place-items: center; border-radius: 10px; background: #fff3d6; color: #8b6200; }
.partner-context span:last-child { display: grid; }
.partner-context small { color: var(--ui-muted); font-size: 9px; }
.partner-context b { font-size: 11px; }
.role-footer { margin-top: 68px; border-top: 1px solid var(--ui-line); padding: 25px 0; background: #fff; }
.role-footer > .container { gap: 26px; }
.role-footer b { font-size: 12px; }
.role-footer small, .role-footer span { font-size: 9px; }
.role-footer div > div:nth-child(2) { gap: 22px; }
.partner-footer { border-top: 3px solid var(--ui-accent); }
.stat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.stat-card { position: relative; overflow: hidden; min-height: 132px; border: 1px solid var(--ui-line); border-radius: 16px; padding: 21px; background: #fff; box-shadow: var(--ui-shadow-sm); }
.stat-card::after { position: absolute; top: -28px; right: -28px; width: 84px; height: 84px; border-radius: 50%; background: color-mix(in srgb, var(--ui-primary) 8%, transparent); content: ''; }
.stat-card > span { color: var(--ui-muted); font-size: 10px; font-weight: 700; letter-spacing: .035em; text-transform: uppercase; }
.stat-card strong { margin: 8px 0 4px; color: #20352a; font-size: 26px; font-weight: 850; letter-spacing: -.035em; }
.stat-card small { color: var(--ui-muted); font-size: 9px; }
.stat-card-icon { position: absolute; top: 17px; right: 17px; display: grid; width: 38px; height: 38px; place-items: center; border-radius: 11px; background: #edf6e9; color: var(--ui-primary-dark) !important; }
.dashboard-titlebar { align-items: flex-end; }
.account-layout { grid-template-columns: 240px minmax(0, 1fr); gap: 18px; margin-top: 20px; }
.account-nav { overflow: hidden; padding: 10px; }
.account-user { margin: -10px -10px 9px; border-bottom: 1px solid var(--ui-line); padding: 22px 14px; background: #f5f9f6; }
.account-user b { margin-top: 8px; font-size: 12px; }
.account-user small { margin-top: 2px; font-size: 9px; }
.account-nav > a, .account-nav form button { min-height: 43px; border-radius: 10px; padding: 10px 12px; color: #596a60; font-size: 11px; font-weight: 650; }
.account-nav > a:hover, .account-nav > a.active { background: #eaf5ec; color: var(--ui-primary-dark); }
.account-content { padding: 21px; }
.section-heading h2, .panel-heading h2 { font-weight: 800; }
.mini-order { grid-template-columns: auto minmax(120px, 1fr) minmax(180px, auto) 24px; min-height: 62px; border-bottom: 1px solid #edf1ee; padding: 10px 5px; }
.notification-line { grid-template-columns: 34px minmax(0, 1fr) auto; gap: 11px; padding: 14px 4px; border-bottom: 1px solid #edf1ee; }
.notification-line > span { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 10px; background: #eaf5ec; color: var(--ui-primary-dark); }
.dashboard-panel { margin-bottom: 18px; padding: 20px; }
.panel-heading { margin-bottom: 15px; }
.panel-heading h2 { margin: 4px 0 0; font-size: 18px; letter-spacing: -.025em; }
.driver-job { grid-template-columns: 46px minmax(180px, 1fr) auto auto; gap: 13px; min-height: 75px; padding: 13px 3px; }
.job-icon { width: 42px; height: 42px; border-radius: 12px; background: #e9f5e5; color: var(--ui-primary-dark); }
.driver-job b { font-size: 12px; }
.driver-job small { max-width: 520px; font-size: 9px; }
.online-toggle { display: inline-flex; min-height: 40px; align-items: center; border-radius: 999px; padding: 8px 15px; }
.online-dot { width: 8px; height: 8px; margin-right: 7px; border-radius: 50%; background: #9eaaa3; box-shadow: 0 0 0 4px rgba(133,147,139,.12); }
.online-toggle.on .online-dot { background: #8de387; box-shadow: 0 0 0 4px rgba(141,227,135,.15); }
.partner-jobs-panel { margin-top: 20px; }
.panel-badge { border-radius: 999px; padding: 6px 10px; background: var(--ui-soft); color: var(--ui-muted); font-size: 9px; font-weight: 750; }

/* Admin shell: distinct, desktop-first, no fixed footer */
.admin-layout { background: #f2f5f3; }
.admin-shell { display: flex; min-height: 100vh; background: #f2f5f3; }
.admin-sidebar {
    position: sticky;
    z-index: 1030;
    top: 0;
    display: flex;
    width: 278px;
    height: 100vh;
    flex: 0 0 278px;
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: auto;
    border: 0;
    background: linear-gradient(180deg, #13291d 0%, #0e2117 100%);
    color: #c6d6cb;
    box-shadow: 9px 0 28px rgba(14, 40, 23, .09);
}
.admin-brand { min-height: 78px; gap: 11px; border-bottom: 1px solid rgba(255,255,255,.08); padding: 15px 18px; }
.admin-brand .brand-mark { width: 41px; height: 41px; border-radius: 12px; box-shadow: none; }
.admin-brand .brand-logo { width: 41px; height: 41px; border-radius: 11px; background: #fff; }
.admin-brand b { overflow: hidden; color: #fff; font-size: 13px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.admin-brand small { color: #91aa99; font-size: 9px; }
.admin-brand .sidebar-close { margin-left: auto; border-color: rgba(255,255,255,.12); background: rgba(255,255,255,.07); color: #fff; }
.admin-profile { display: flex; align-items: center; gap: 10px; margin: 15px 14px 4px; border: 1px solid rgba(255,255,255,.08); border-radius: 13px; padding: 11px; background: rgba(255,255,255,.045); }
.admin-profile .avatar { width: 34px; height: 34px; background: #bcd99e; }
.admin-profile > div { display: grid; min-width: 0; flex: 1; }
.admin-profile b { overflow: hidden; color: #f4f8f5; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.admin-profile small { color: #8fa797; font-size: 8px; text-transform: capitalize; }
.profile-status { width: 7px; height: 7px; border-radius: 50%; background: #68c06c; box-shadow: 0 0 0 3px rgba(104,192,108,.13); }
.admin-navigation { display: flex; flex-direction: column; gap: 2px; padding: 6px 13px 20px; }
.admin-navigation .nav-label { margin: 19px 10px 6px; color: #6f8978; font-size: 8px; font-weight: 850; letter-spacing: .15em; }
.admin-navigation a { display: flex; min-height: 42px; align-items: center; gap: 11px; border-radius: 10px; padding: 9px 11px; color: #adbeB2; font-size: 11px; font-weight: 630; }
.admin-navigation a:hover { background: rgba(255,255,255,.07); color: #fff; }
.admin-navigation a.active { background: linear-gradient(90deg, rgba(130,190,79,.25), rgba(130,190,79,.1)); box-shadow: inset 3px 0 0 #91c75a; color: #fff; }
.admin-navigation a .ui-icon { width: 18px; height: 18px; color: #8eaa96; }
.admin-navigation a.active .ui-icon { color: #a9d574; }
.admin-navigation a span { min-width: 0; flex: 1; }
.admin-navigation a i { min-width: 21px; border-radius: 999px; padding: 3px 6px; background: #e9a73c; color: #1c2b21; font-size: 8px; font-style: normal; font-weight: 850; text-align: center; }
.admin-side-bottom { margin-top: auto; border-top: 1px solid rgba(255,255,255,.08); padding: 12px 13px 15px; }
.admin-side-bottom a, .admin-side-bottom button { display: flex; width: 100%; min-height: 40px; align-items: center; gap: 10px; border: 0; border-radius: 10px; padding: 9px 11px; background: transparent; color: #a9bbae; font-size: 10px; font-weight: 650; text-align: left; }
.admin-side-bottom a:hover { background: rgba(255,255,255,.06); color: #fff; }
.admin-side-bottom button:hover { background: rgba(206,70,70,.14); color: #ffb9bd; }
.admin-main { display: flex; min-width: 0; min-height: 100vh; flex: 1; flex-direction: column; }
.admin-topbar { position: sticky; z-index: 1010; top: 0; display: flex; min-height: 82px; align-items: center; gap: 14px; border-bottom: 1px solid var(--ui-line); padding: 12px 28px; background: rgba(255,255,255,.94); box-shadow: 0 5px 17px rgba(29, 54, 38, .035); backdrop-filter: blur(12px); }
.admin-heading-wrap { min-width: 0; }
.admin-topbar h1 { margin: 4px 0 0; color: #1b2d22; font-size: 22px; font-weight: 820; letter-spacing: -.035em; }
.admin-topbar .eyebrow { color: #77867d; font-size: 8px; letter-spacing: .08em; }
.admin-top-actions { gap: 13px; margin-left: auto; }
.admin-top-icon { display: grid; width: 40px; height: 40px; place-items: center; border: 1px solid var(--ui-line); border-radius: 11px; background: #fff; color: #5b6c61; }
.admin-user-summary { display: flex; align-items: center; gap: 9px; border-left: 1px solid var(--ui-line); padding-left: 13px; }
.admin-name { display: grid; font-size: 10px; font-weight: 750; }
.admin-name small { margin-top: 1px; color: var(--ui-muted); font-size: 8px; font-weight: 500; }
.admin-page-content { min-height: 0; flex: 1; }
.admin-content { width: 100%; max-width: 1500px; margin: 0 auto; padding: 26px 28px 42px; }
.dashboard-welcome { display: flex; min-height: 106px; align-items: center; justify-content: space-between; gap: 22px; margin-bottom: 18px; border: 1px solid #d8e4da; border-radius: 17px; padding: 20px 23px; background: linear-gradient(120deg, #fff 0%, #f2f8ef 100%); box-shadow: var(--ui-shadow-sm); }
.dashboard-welcome h2 { margin: 5px 0 3px; color: #1c3023; font-size: 21px; font-weight: 820; letter-spacing: -.035em; }
.dashboard-welcome p { margin: 0; color: var(--ui-muted); font-size: 10px; }
.admin-footer { position: static !important; display: flex; min-height: 57px; align-items: center; justify-content: space-between; gap: 15px; margin-top: auto; border-top: 1px solid var(--ui-line); padding: 15px 28px; background: #fff; color: var(--ui-muted); font-size: 9px; }
.admin-footer a { display: inline-flex; align-items: center; gap: 6px; color: var(--ui-primary-dark); font-weight: 750; }
.admin-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; margin-bottom: 18px; }
.admin-stat { position: relative; overflow: hidden; min-height: 135px; border: 1px solid var(--ui-line); border-radius: 16px; padding: 19px; background: #fff; box-shadow: var(--ui-shadow-sm); }
.admin-stat.primary { border-color: #285c36; background: linear-gradient(145deg, #285c36, #347545); color: #fff; }
.admin-stat > span { color: var(--ui-muted); font-size: 9px; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; }
.admin-stat.primary > span, .admin-stat.primary small { color: rgba(255,255,255,.72); }
.admin-stat strong { margin: 8px 0 4px; color: #1b3023; font-size: clamp(20px, 2vw, 27px); font-weight: 850; letter-spacing: -.04em; }
.admin-stat.primary strong { color: #fff; }
.admin-stat small { color: var(--ui-muted); font-size: 9px; }
.admin-stat > b, .admin-stat-icon { position: absolute; top: 18px; right: 17px; display: grid; width: 38px; height: 38px; place-items: center; border-radius: 11px; background: #eef5ef; color: var(--ui-primary-dark); font-size: 18px; font-weight: 500; }
.admin-stat.primary > b, .admin-stat.primary .admin-stat-icon { background: rgba(255,255,255,.13); color: #fff; }
.admin-grid { gap: 18px; }
.dashboard-panel { border-color: var(--ui-line); border-radius: 16px; padding: 20px; box-shadow: var(--ui-shadow-sm); }
.dashboard-panel .panel-heading { min-height: 42px; }
.dashboard-panel .panel-heading a { display: inline-flex; align-items: center; gap: 5px; color: var(--ui-primary-dark); font-size: 10px; font-weight: 750; }
.bar-chart { height: 210px; gap: 12px; border-bottom: 1px solid var(--ui-line); padding: 22px 8px 0; background-image: linear-gradient(to bottom, transparent 24%, #eef2ef 25%, transparent 26%, transparent 49%, #eef2ef 50%, transparent 51%, transparent 74%, #eef2ef 75%, transparent 76%); }
.bar { width: min(30px, 62%); border-radius: 7px 7px 2px 2px; background: linear-gradient(180deg, var(--ui-primary), var(--ui-primary-dark)); }
.ops-list a { min-height: 59px; gap: 11px; border-radius: 11px; padding: 9px; }
.ops-list a:hover { background: #f5f8f6; }
.ops-icon { width: 39px; height: 39px; border-radius: 11px; }
.ops-list b { font-size: 14px; }
.ops-list small { font-size: 9px; }
.content-toolbar { min-height: 43px; margin-bottom: 16px; }
.content-toolbar p { font-size: 11px; }
.filter-toolbar { margin-bottom: 15px; border: 1px solid var(--ui-line); border-radius: 13px; padding: 11px; background: #fff; box-shadow: var(--ui-shadow-sm); }
.filter-toolbar form { gap: 9px; }
.filter-toolbar input, .filter-toolbar select, .table-wrap select { min-height: 38px; border-color: #d9e2dc; border-radius: 9px; padding: 7px 10px; font-size: 10px; }
.table-wrap { border-radius: 12px; }
table { min-width: 760px; border-collapse: separate; border-spacing: 0; font-size: 11px; }
th { border-bottom: 1px solid #dfe6e2; padding: 11px 12px; background: #f7f9f8; color: #738179; font-size: 8px; font-weight: 850; letter-spacing: .09em; }
td { border-bottom: 1px solid #edf1ee; padding: 13px 12px; }
tbody tr { transition: background .14s ease; }
tbody tr:hover { background: #f8faf9; }
td small, td del { font-size: 8px; }
.table-product img { width: 39px; height: 39px; border-radius: 10px; }
.action-link { display: inline-flex; align-items: center; gap: 4px; font-size: 10px; }
.form-card { padding: 20px; }
.form-card h2 { font-size: 17px; }
.form-card form > label, .admin-form label { margin-bottom: 13px; font-size: 10px; }
.form-layout { gap: 18px; }
.image-preview { border: 1px solid #dfe7e1; background: #f3f7f4; }
.image-preview img { height: 180px; }
.branding-preview .brand-mark { width: 72px; height: 72px; margin: 8px auto; border-radius: 18px; font-size: 18px; }
.settings-chip { display: inline-flex; align-items: center; border: 1px solid #cfe3d2; border-radius: 999px; padding: 7px 10px; background: #eaf6ed; font-size: 9px; }
.quote-result { border: 1px solid #c8dfc9; border-radius: 16px; background: linear-gradient(135deg, #edf7e9, #f7fbf5); box-shadow: var(--ui-shadow-sm); }
.admin-order-grid { gap: 18px; }

/* Installer stays self-contained and works before database installation. */
.installer-body { min-height: 100vh; padding: 42px 16px; background: radial-gradient(circle at 15% 15%, rgba(136,192,82,.2), transparent 30%), linear-gradient(145deg, #eef6ec, #fafcfb); }
.installer { width: min(850px, 100%); border: 1px solid #dce6df; border-radius: 24px; padding: 32px; box-shadow: var(--ui-shadow-lg); }
.installer-head { display: flex; align-items: center; gap: 12px; padding-bottom: 21px; }
.installer-head b, .installer-head small { display: block; }
.installer-head b { font-size: 14px; }
.installer-head small { color: var(--ui-muted); font-size: 9px; }
.installer-intro h1 { margin: 9px 0; font-size: 34px; font-weight: 840; letter-spacing: -.05em; }
.requirements { border: 1px solid var(--ui-line); border-radius: 15px; padding: 17px; background: #f8faf9; }
.requirement { border-radius: 999px; padding: 6px 9px; font-weight: 750; }
.installer-section { margin-top: 24px; padding-top: 22px; }
.installer-section h2 { margin-bottom: 15px; font-size: 17px; font-weight: 800; }

@media (max-width: 1199.98px) {
    .container { max-width: 1080px; }
    .header-main > .brand { width: 205px; }
    .location-chip { display: none; }
    .category-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .product-grid { gap: 14px; }
    .product-image { height: 205px; }
    .footer-grid { gap: 34px; }
    .admin-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 991.98px) {
    .container { max-width: 960px; }
    .header-main > .brand { width: auto; }
    .brand small { display: none; }
    .market-search { max-width: none; }
    .nav-row nav { gap: 19px; }
    .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .footer-grid { grid-template-columns: 1.3fr repeat(3, 1fr); gap: 25px; }
    .account-layout { grid-template-columns: 215px minmax(0, 1fr); }
    .admin-sidebar.offcanvas-lg {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        display: flex;
        width: min(290px, 88vw);
        height: 100vh;
        visibility: hidden;
        transform: translateX(-100%);
        transition: transform .25s ease, visibility .25s ease;
    }
    .admin-sidebar.offcanvas-lg.show, .admin-sidebar.offcanvas-lg.showing { visibility: visible; transform: none !important; }
    .admin-sidebar.offcanvas-lg.hiding { visibility: visible; }
    .admin-topbar { padding-right: 20px; padding-left: 20px; }
    .admin-menu-toggle { display: grid !important; }
    .admin-content { padding-right: 20px; padding-left: 20px; }
    .form-layout { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (min-width: 992px) {
    .admin-sidebar.offcanvas-lg { visibility: visible !important; transform: none !important; }
}

@media (max-width: 767.98px) {
    .container { width: 100%; max-width: 100%; padding-right: 15px; padding-left: 15px; }
    body.has-app-nav { padding-bottom: calc(69px + env(safe-area-inset-bottom)); }
    .top-strip { display: none; }
    .site-header { position: sticky; top: 0; }
    .header-main { min-height: 62px; flex-wrap: nowrap; gap: 9px; padding-top: 9px; padding-bottom: 8px; }
    .brand { flex: 1; }
    .brand-logo, .brand-mark { width: 37px; height: 37px; border-radius: 11px; }
    .brand strong { max-width: 150px; font-size: 12px; }
    .market-search { display: none; }
    .mobile-search-row { display: block; padding-bottom: 10px; }
    .mobile-search-row .search-box { position: static; inset: auto; display: flex; height: 40px; margin: 0; }
    .mobile-search-row .search-box button { min-width: 58px; }
    .header-actions { margin-left: auto; }
    .header-actions .login-link, .header-actions > .btn, .header-actions > .avatar-link { display: none; }
    .header-icon-button { width: 39px; height: 39px; }
    .header-menu-toggle { display: grid; width: 39px; height: 39px; }
    .nav-row { display: none; }
    .promo-slider { margin-top: 14px; }
    .promo-slide { min-height: 145px; border-radius: 16px; }
    .promo-slide img { height: 145px; }
    .promo-slide > div { padding: 25px 20px; }
    .promo-slide h2 { max-width: 78%; font-size: 21px; }
    .slider-dots { right: 17px; bottom: 14px; }
    .hero-grid { grid-template-columns: 1fr; min-height: auto; padding-top: 48px; padding-bottom: 35px; }
    .hero-copy h1 { font-size: 45px; }
    .hero-copy > p { font-size: 14px; }
    .hero-art { min-height: 285px; }
    .hero-art img { width: 310px; }
    .art-blob { width: 270px; height: 270px; }
    .floating-card { right: 0; bottom: 24px; }
    .hero-trust { gap: 10px 15px; flex-wrap: wrap; }
    .section { padding-top: 42px; padding-bottom: 42px; }
    .section-heading { margin-bottom: 18px; }
    .section-heading h2 { font-size: 22px; }
    .category-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
    .category-pill { border-radius: 13px; padding: 11px 4px 9px; }
    .category-icon { width: 43px; height: 43px; border-radius: 12px; font-size: 23px; }
    .category-icon img { border-radius: 12px; }
    .category-fallback { font-size: 17px; }
    .category-pill strong { font-size: 9px; }
    .category-pill small { display: none; }
    .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .product-card { border-radius: 13px; }
    .product-image { height: clamp(150px, 44vw, 205px); }
    .product-body { padding: 11px; }
    .product-body h3 { min-height: 37px; font-size: 11px; }
    .price-row { min-height: 40px; }
    .price-row strong { font-size: 14px; }
    .product-meta { font-size: 8px; }
    .product-card .btn { min-height: 36px; padding-right: 8px; padding-left: 8px; font-size: 10px; }
    .flash-head { align-items: flex-start; flex-wrap: wrap; gap: 13px; }
    .flash-head .btn { display: none; }
    .flash-head h2 { font-size: 24px; }
    .split-section { grid-template-columns: 1fr; }
    .split-copy { border-radius: 17px; padding: 30px 25px; }
    .split-copy h2 { font-size: 34px; }
    .article-grid { grid-template-columns: 1fr; }
    .article-card { display: grid; grid-template-columns: 115px minmax(0,1fr); }
    .article-card img { width: 100%; height: 100%; min-height: 145px; }
    .article-card > div { padding: 14px; }
    .article-card p { display: none; }
    .footer { display: none; }
    .floating-wa { right: 17px; bottom: calc(84px + env(safe-area-inset-bottom)); width: 48px; height: 48px; }
    .app-bottom-nav {
        position: fixed;
        z-index: 1040;
        right: 0;
        bottom: 0;
        left: 0;
        display: flex;
        height: calc(66px + env(safe-area-inset-bottom));
        align-items: stretch;
        justify-content: space-around;
        border-top: 1px solid #dbe4de;
        padding: 5px 4px env(safe-area-inset-bottom);
        background: rgba(255,255,255,.98);
        box-shadow: 0 -9px 25px rgba(23, 51, 31, .1);
        backdrop-filter: blur(14px);
    }
    .app-bottom-nav a, .app-bottom-nav button { position: relative; display: flex; min-width: 0; flex: 1; flex-direction: column; align-items: center; justify-content: center; gap: 3px; border: 0; padding: 2px; background: transparent; color: #7a8980; }
    .app-bottom-nav .ui-icon { width: 21px; height: 21px; }
    .app-bottom-nav small { font-size: 8px; font-weight: 650; line-height: 1; white-space: nowrap; }
    .app-bottom-nav a.active, .app-bottom-nav button.active { color: var(--ui-primary-dark); }
    .app-bottom-nav a.active::before { position: absolute; top: -5px; width: 28px; height: 3px; border-radius: 0 0 4px 4px; background: var(--ui-primary); content: ''; }
    .app-bottom-nav i { top: 1px; left: calc(50% + 7px); display: grid; min-width: 17px; height: 17px; place-items: center; border: 2px solid #fff; border-radius: 999px; padding: 0 3px; font-size: 7px; }
    .partner-bottom-nav { border-top: 2px solid var(--ui-accent); }
    .page-head, .page-head.compact { align-items: flex-start; padding-top: 29px; padding-bottom: 18px; }
    .page-head h1 { font-size: 27px; }
    .shop-layout, .cart-layout, .checkout-layout, .order-detail-layout { grid-template-columns: 1fr; }
    .filter-card { position: static; order: 1; }
    .shop-results { order: 0; }
    .filter-card form { display: grid; grid-template-columns: 1fr 1fr; gap: 0 9px; }
    .filter-card form > label:first-child, .filter-card form > .btn { grid-column: 1 / -1; }
    .auth-page { min-height: 590px; padding: 30px 14px; }
    .auth-card { border-radius: 18px; padding: 24px 20px; }
    .auth-card h1 { font-size: 24px; }
    .role-header-inner { min-height: 63px; gap: 9px; }
    .role-header .brand { min-width: 0; flex: 1; }
    .role-header .brand strong { max-width: 155px; }
    .role-search, .marketplace-link, .partner-context { display: none; }
    .role-footer { display: none; }
    .stat-grid { grid-template-columns: 1fr; gap: 10px; }
    .stat-card { min-height: 105px; padding: 16px; }
    .stat-card strong { margin: 4px 0 1px; font-size: 23px; }
    .dashboard-titlebar { align-items: flex-start; }
    .account-layout { grid-template-columns: 1fr; }
    .account-nav { display: flex; overflow-x: auto; border-radius: 13px; padding: 7px; }
    .account-user { display: none; }
    .account-nav > a, .account-nav form button { min-height: 37px; flex: 0 0 auto; padding: 8px 10px; white-space: nowrap; }
    .account-content { padding: 16px; }
    .mini-order { grid-template-columns: auto minmax(100px,1fr) 20px; }
    .mini-order small { grid-column: 2; }
    .notification-line { grid-template-columns: 30px minmax(0,1fr); }
    .notification-line > small { grid-column: 2; }
    .driver-job { grid-template-columns: 40px minmax(0,1fr) auto; }
    .job-actions { grid-column: 2 / -1; }
    .admin-topbar { min-height: 69px; padding: 10px 14px; }
    .admin-topbar h1 { font-size: 18px; }
    .admin-top-actions .admin-top-icon, .admin-name { display: none; }
    .admin-user-summary { border: 0; padding-left: 0; }
    .admin-content { padding: 18px 14px 30px; }
    .dashboard-welcome { align-items: flex-start; padding: 17px; }
    .dashboard-welcome .btn { display: none; }
    .admin-stats { grid-template-columns: 1fr 1fr; gap: 9px; }
    .admin-stat { min-height: 119px; padding: 14px; }
    .admin-stat strong { font-size: 18px; }
    .admin-stat > b, .admin-stat-icon { top: 13px; right: 12px; width: 32px; height: 32px; }
    .admin-grid, .admin-grid.two, .admin-order-grid { grid-template-columns: 1fr; }
    .dashboard-panel { padding: 15px; }
    .filter-toolbar form { flex-wrap: wrap; }
    .filter-toolbar input { min-width: 0; flex: 1; }
    .form-layout { grid-template-columns: 1fr; }
    .form-layout .form-card:last-child { grid-column: auto; }
    .admin-footer { padding: 13px 14px; }
    .admin-footer span { max-width: 70%; }
    .installer-body { padding: 18px 10px; }
    .installer { border-radius: 18px; padding: 21px 17px; }
    .installer-intro h1 { font-size: 27px; }
}

@media (max-width: 419.98px) {
    .brand strong { max-width: 125px; }
    .header-actions { gap: 6px; }
    .header-icon-button, .header-menu-toggle { width: 37px; height: 37px; }
    .category-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .hero-copy h1 { font-size: 39px; }
    .product-image { height: 145px; }
    .product-body { padding: 9px; }
    .product-meta span:first-child { display: none; }
    .admin-stats { grid-template-columns: 1fr; }
    .admin-stat { min-height: 105px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* Source: resources/css/navigation-fixes-v24.css */
/*
 * Lapak Buah Umaiza 2.4.0
 * Compatibility and navigation reliability layer.
 * The visual design remains unchanged; these rules only normalize local SVG
 * icons and keep Bootstrap offcanvas controls above their backdrop.
 */

.lbu-icon {
    display: inline-block;
    flex: 0 0 auto;
    overflow: visible;
    vertical-align: -0.18em;
    pointer-events: none;
}

.lbu-icon use {
    pointer-events: none;
}

/*
 * Legacy responsive rules used z-index: 90 for the drawers, while Bootstrap
 * renders its backdrop at z-index: 1040. The visible backdrop consequently
 * sat on top of the menu and intercepted every click. Keep both public/user
 * drawers and the responsive admin sidebar above the Bootstrap backdrop.
 */
.offcanvas-backdrop {
    z-index: 1050 !important;
}

.nav-drawer.offcanvas,
.admin-sidebar.offcanvas-lg {
    z-index: 1055 !important;
    pointer-events: auto;
}

.nav-drawer.offcanvas.show,
.nav-drawer.offcanvas.showing,
.admin-sidebar.offcanvas-lg.show,
.admin-sidebar.offcanvas-lg.showing {
    visibility: visible !important;
    pointer-events: auto !important;
}

.nav-drawer .offcanvas-header,
.nav-drawer .offcanvas-body,
.nav-drawer nav,
.admin-sidebar .admin-navigation,
.admin-sidebar .admin-side-bottom {
    position: relative;
    z-index: 1;
    pointer-events: auto;
}

.nav-drawer a,
.nav-drawer button,
.admin-navigation a,
.admin-side-bottom a,
.admin-side-bottom button,
.account-nav a,
.account-nav button,
.app-bottom-nav a,
.app-bottom-nav button {
    pointer-events: auto;
    touch-action: manipulation;
}

/* Prevent decorative elements and badges from becoming the click target. */
.admin-navigation a > *,
.nav-drawer nav a > *,
.app-bottom-nav a > *,
.app-bottom-nav button > * {
    pointer-events: none;
}

@media (min-width: 992px) {
    .admin-sidebar.offcanvas-lg {
        visibility: visible !important;
        transform: none !important;
    }
}

@media (max-width: 991.98px) {
    .admin-sidebar.offcanvas-lg:not(.show):not(.showing) {
        visibility: hidden;
        pointer-events: none;
    }
}

/* Source: resources/css/ui-enhancements-v25.css */
/*
 * Lapak Buah Umaiza 2.5.0
 * Category illustration, admin navigation, and dashboard module refinements.
 */

.category-icon {
    overflow: hidden;
    box-shadow: inset 0 0 0 1px rgba(48, 94, 53, .06);
}

.category-icon img {
    width: 100%;
    height: 100%;
    margin: 0;
    border-radius: inherit;
}

.category-icon img.is-illustration {
    object-fit: contain;
}

.category-icon img.is-custom {
    object-fit: cover;
}

.admin-anchor {
    scroll-margin-top: 104px;
}

.admin-navigation a.nav-subitem {
    min-height: 35px;
    margin-left: 11px;
    padding-top: 7px;
    padding-bottom: 7px;
    padding-left: 15px;
    color: #91a498;
    font-size: 9.5px;
}

.admin-navigation a.nav-subitem::before {
    width: 4px;
    height: 4px;
    margin-right: -4px;
    border-radius: 50%;
    background: #668273;
    content: "";
}

.admin-navigation a.nav-subitem .ui-icon {
    width: 15px;
    height: 15px;
}

.admin-navigation a.nav-subitem.active::before,
.admin-navigation a.nav-subitem:hover::before {
    background: #a9d574;
}

.admin-module-panel {
    margin-bottom: 18px;
}

.admin-module-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
    gap: 10px;
}

.admin-module-grid > a {
    display: grid;
    min-height: 105px;
    align-content: start;
    border: 1px solid #e1e9e3;
    border-radius: 13px;
    padding: 13px;
    background: linear-gradient(145deg, #fff, #f8faf8);
    transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.admin-module-grid > a:hover {
    border-color: #bed4c1;
    box-shadow: 0 8px 22px rgba(29, 64, 39, .08);
    transform: translateY(-2px);
}

.admin-module-grid > a > span {
    display: grid;
    width: 36px;
    height: 36px;
    margin-bottom: 10px;
    place-items: center;
    border-radius: 10px;
    background: #eaf4e8;
    color: var(--ui-primary-dark);
}

.admin-module-grid b {
    color: #273b2e;
    font-size: 10px;
}

.admin-module-grid small {
    margin-top: 3px;
    color: var(--ui-muted);
    font-size: 8px;
}

.category-admin-list {
    display: grid;
    gap: 8px;
    margin-top: 17px;
}

.category-admin-item {
    overflow: hidden;
    border: 1px solid #e1e8e2;
    border-radius: 12px;
    background: #fbfcfb;
}

.category-admin-summary {
    display: flex;
    min-height: 57px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 11px;
}

.category-admin-summary .compact-media {
    min-width: 0;
}

.category-admin-summary .compact-media > img {
    width: 40px;
    height: 40px;
    flex: 0 0 auto;
    border: 0;
    background: #eef6e9;
}

.category-admin-summary .compact-media > img.is-illustration {
    object-fit: contain;
}

.category-admin-summary .compact-media > img.is-custom {
    object-fit: cover;
}

.category-admin-summary .compact-media > span {
    display: grid;
    min-width: 0;
}

.category-admin-summary .compact-media b {
    overflow: hidden;
    color: #2b3d31;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.category-admin-summary .compact-media small {
    color: var(--ui-muted);
    font-size: 8px;
}

.category-edit {
    border-top: 1px solid #e4ebe5;
    padding: 0 12px 13px;
    background: #fff;
}

.category-edit form {
    padding-top: 4px;
}

.finance-highlight > strong {
    display: block;
    margin: 2px 0 7px;
    color: var(--ui-primary-dark);
    font-size: 24px;
    font-weight: 850;
    letter-spacing: -.035em;
}

.finance-highlight > p {
    margin: 0;
    color: var(--ui-muted);
    font-size: 10px;
    line-height: 1.65;
}

@media (max-width: 575.98px) {
    .admin-module-grid {
        grid-template-columns: 1fr 1fr;
    }

    .admin-module-grid > a {
        min-height: 96px;
        padding: 11px;
    }

    .category-admin-summary {
        align-items: flex-start;
    }

    .category-admin-summary .inline-actions {
        align-items: flex-end;
        flex-direction: column;
        gap: 4px;
    }
}