html,body{touch-action:pan-x pan-y;-webkit-text-size-adjust:100%}
input,textarea,select{font-size:16px!important}
.header-actions{display:flex;align-items:center;gap:8px}
.account-trigger,.header-cart{min-height:48px}
.account-trigger{border:1px solid var(--line);border-radius:999px;padding:9px 13px;background:#fff;color:var(--dark);display:flex;align-items:center;gap:7px;font-weight:900}
.account-trigger svg,.header-cart svg,.bag svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.account-trigger.logged-in{background:#edf4ef;border-color:#d6e4db}
.header-cart{gap:7px}.header-cart>svg{width:20px}
.bag svg{width:25px;height:25px}
.steps i svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.steps .done i{position:relative}.steps .done i svg{opacity:0}
.steps .done i:after{content:"✓";position:absolute;font-size:19px}

.auth-modal{z-index:180}
.auth-panel{position:relative;width:min(470px,100%);background:var(--paper);border-radius:28px;padding:34px;box-shadow:0 35px 90px #071c1452}
.auth-close{position:absolute;inset-inline-start:18px;top:18px;width:40px;height:40px;border:0;border-radius:50%;background:#eef1ec;color:var(--ink);font-size:25px;display:grid;place-items:center}
.auth-panel.no-close .auth-close{display:none}
.auth-brand{text-align:center}.auth-brand img{width:78px;height:78px;object-fit:contain}.auth-brand h2{font-size:25px;margin:13px 0 7px}.auth-brand p{margin:0 0 24px;color:var(--muted);font-size:12px;line-height:1.9}
.auth-form{display:grid;gap:12px}.auth-form label{display:grid;gap:8px;font-size:12px;font-weight:900}
.auth-form input{width:100%;min-height:56px;border:1px solid #dce2dd;border-radius:16px;padding:13px 15px;background:#fff;outline:none}
.auth-form input:focus{border-color:var(--green);box-shadow:0 0 0 4px #2d6a4f17}
.phone-field{direction:ltr;text-align:center;font-size:22px!important;letter-spacing:.12em;font-weight:800}
.otp-field{direction:ltr;text-align:center;font-size:30px!important;letter-spacing:.65em;font-weight:900;padding-inline-start:1.05em!important}
.auth-message{min-height:22px;margin:0;text-align:center;color:#b12b25;font-size:11px;line-height:1.8}.auth-message.success{color:var(--green)}
.resend-row{text-align:center;color:var(--muted);font-size:11px}.resend-link{border:0;background:transparent;color:var(--green);font-weight:900;text-decoration:underline;text-underline-offset:4px}.resend-link:disabled{color:#919b95;text-decoration:none;cursor:not-allowed}
.auth-loader{display:inline-block;width:18px;height:18px;border:2px solid #ffffff66;border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite;vertical-align:middle}

.drawer-layer{position:fixed;inset:0;z-index:170;display:flex;justify-content:flex-start}
.drawer-backdrop{position:absolute;inset:0;border:0;background:#0d21198f;backdrop-filter:blur(6px)}
.account-drawer{position:relative;width:min(430px,92vw);height:100%;background:var(--paper);box-shadow:-18px 0 65px #071c1447;overflow-y:auto;overflow-x:hidden;animation:drawerIn .25s ease both}
[dir=ltr] .account-drawer{box-shadow:18px 0 65px #071c1447}
@keyframes drawerIn{from{transform:translateX(35px);opacity:.4}to{transform:translateX(0);opacity:1}}
.account-drawer>header{position:sticky;top:0;z-index:3;display:flex;align-items:center;gap:10px;padding:15px 18px;background:#fffefbe8;border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}
.account-drawer>header button,.drawer-page-back{border:0;background:#eef1ec;width:42px;height:42px;border-radius:50%;font-size:23px}
.account-drawer>header img{width:38px;height:38px;object-fit:contain;margin-inline-start:auto}.account-drawer>header span{font-weight:900}
#accountContent{padding:24px 18px 34px}
.account-welcome{padding:20px;border-radius:23px;background:linear-gradient(135deg,#eaf1e7,#f6f0e3);margin-bottom:18px}
.account-welcome small{color:var(--muted)}.account-welcome h2{font-size:25px;margin:5px 0}.account-welcome p{direction:ltr;text-align:right;margin:0;color:var(--green);font-weight:800}
[dir=ltr] .account-welcome p{text-align:left}
.account-menu{display:grid;gap:9px}.account-menu>button{min-height:62px;border:1px solid var(--line);background:#fff;border-radius:17px;padding:12px 15px;display:flex;align-items:center;gap:12px;text-align:start;color:var(--ink);font-weight:900}
.account-menu>button svg,.page-title svg{width:24px;height:24px;fill:none;stroke:var(--green);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.account-menu>button:after{content:"‹";margin-inline-start:auto;font-size:24px;color:#9ba59f}
[dir=ltr] .account-menu>button:after{content:"›"}
.account-menu .logout{margin-top:18px;color:#b52b26;background:#fff6f5;border-color:#f0d4d2}.account-menu .logout svg{stroke:#b52b26}.account-menu .logout:after{display:none}
.drawer-page-head{display:flex;align-items:center;gap:12px;margin-bottom:20px}.drawer-page-head h2{font-size:24px;margin:0}.drawer-page-head .primary{width:auto;margin-inline-start:auto;min-height:44px}
.profile-form,.address-form{display:grid;gap:14px}.profile-form label,.address-form label{display:grid;gap:7px;font-size:12px;font-weight:900}
.profile-form input,.address-form input,.address-form textarea{width:100%;border:1px solid var(--line);border-radius:15px;padding:13px;outline:0;background:#fff}.address-form textarea{min-height:115px;resize:vertical}
.profile-phone{display:flex;align-items:center;gap:8px}.profile-phone input{direction:ltr}.profile-phone button{flex:0 0 auto;min-height:50px}
.empty-state{text-align:center;border:1px dashed #cbd4ce;background:#fafbf9;border-radius:22px;padding:42px 20px;color:var(--muted)}.empty-state svg{width:52px;height:52px;fill:none;stroke:#9aae9f;stroke-width:1.5}.empty-state h3{color:var(--ink);margin:12px 0 4px}
.address-list,.order-list{display:grid;gap:11px}.address-card,.order-card{border:1px solid var(--line);background:#fff;border-radius:18px;padding:15px}
.address-card.selected{border-color:var(--green);background:#f1f7f3}.address-card h3,.order-card h3{margin:0 0 5px;font-size:14px}.address-card p,.order-card p{margin:0;color:var(--muted);font-size:11px;line-height:1.9}.address-card strong{display:inline-block;margin-top:7px;color:var(--green);font-size:12px}
.card-actions{display:flex;gap:7px;margin-top:12px}.card-actions button{border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px 12px;font-size:11px;font-weight:900}.card-actions .delete{color:#b52b26}
.area-picker{position:relative}.area-results{max-height:260px;overflow:auto;border:1px solid var(--line);border-radius:15px;background:#fff;margin-top:6px}.area-results button{width:100%;border:0;border-bottom:1px solid #eef0ec;background:#fff;padding:12px;display:flex;justify-content:space-between;gap:10px;text-align:start}.area-results button:hover,.area-results button.selected{background:#edf5f0}.area-results b{color:var(--green);white-space:nowrap}.area-name{display:flex;align-items:center;gap:7px}.area-name i{width:19px;height:19px;display:grid;place-items:center;border-radius:50%;background:var(--green);color:#fff;font-style:normal;font-size:11px}
.order-card-head{display:flex;align-items:start;justify-content:space-between;gap:10px}.order-number{direction:ltr;color:var(--green);font-size:16px}.paid-badge{background:#e7f4ec;color:#24704c;padding:5px 9px;border-radius:999px;font-size:9px;font-weight:900}.order-total{display:flex;justify-content:space-between;border-top:1px dashed var(--line);margin-top:10px;padding-top:10px;font-size:12px}.order-card .primary{margin-top:12px;min-height:44px}

.checkout-addresses{display:grid;gap:10px}.checkout-address{width:100%;text-align:start;display:flex;gap:11px;border:1px solid var(--line);background:#fff;border-radius:17px;padding:14px;color:var(--ink)}.checkout-address.selected{border-color:var(--green);background:#f1f7f3}.checkout-address .radio{margin-top:2px}.checkout-address div{display:grid;gap:3px}.checkout-address strong{font-size:13px}.checkout-address small{font-size:10px;color:var(--muted);line-height:1.8}
.add-address-button{width:100%;min-height:52px;border:1px dashed var(--green);background:#f5faf7;color:var(--green);border-radius:16px;font-weight:900;margin-top:10px}
.confirmation-card{display:grid;gap:18px}.confirmation-heading,.price-summary-head,.detail-section-title{display:flex;align-items:center;gap:11px}.confirmation-heading small,.price-summary-head small,.detail-section-title small{display:block;color:var(--muted);font-size:9px;margin-bottom:2px}.confirmation-heading b,.price-summary-head b,.detail-section-title b{display:block;font-size:12px}.detail-title-icon{width:40px;height:40px;border-radius:13px;background:#edf5f0;color:var(--green);display:grid;place-items:center;flex:0 0 auto}.detail-title-icon svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.customer-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px}.summary-box{min-width:0;display:flex;align-items:flex-start;gap:12px;border:1px solid #e2e7e3;border-radius:18px;padding:15px;background:#fff;box-shadow:0 8px 25px #153a2b08}.summary-box.full{grid-column:1/-1}.summary-box>span:last-child{min-width:0}.summary-box small{display:block;color:var(--muted);font-size:9px;margin-bottom:5px}.summary-box strong{display:block;font-size:12px;line-height:1.8;overflow-wrap:anywhere}.summary-icon{width:36px;height:36px;border-radius:11px;background:#f1f6f2;color:var(--green);display:grid;place-items:center;flex:0 0 auto}.summary-icon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.summary-box .phone{direction:ltr;text-align:right}
[dir=ltr] .summary-box .phone{text-align:left}
.price-summary{border:1px solid #dfe6e1;border-radius:20px;overflow:hidden;box-shadow:0 12px 34px #153a2b0a}.price-summary-head{padding:14px 16px;background:linear-gradient(135deg,#f7f3e9,#eef5f0);border-bottom:1px solid #e3e8e4}.price-row{display:flex;justify-content:space-between;gap:12px;padding:13px 16px;border-bottom:1px solid #eef0ec;font-size:11px}.price-row.total-row{background:#174a37;color:#fff;font-size:16px;font-weight:900;border:0;padding-block:16px}.products-toggle{width:100%;border:0;background:#fff;color:var(--ink);align-items:center}.products-toggle .arrow{display:inline-grid;place-items:center;width:23px;height:23px;border-radius:8px;background:#edf4ef;transition:.2s;font-size:17px}.products-toggle.open .arrow{transform:rotate(90deg)}[dir=rtl] .products-toggle.open .arrow{transform:rotate(-90deg)}
.confirmation-products{display:grid;background:#fbfcfa}.confirmation-product{display:grid;grid-template-columns:45px 1fr auto;align-items:center;gap:9px;padding:9px 14px;border-bottom:1px solid #eef0ec}.confirmation-product img{width:45px;height:45px;border-radius:10px;object-fit:cover}.confirmation-product span{font-size:10px}.confirmation-product b{font-size:10px;color:var(--green)}
.pay-now{min-height:58px;font-size:16px;background:var(--gold);color:var(--ink);display:flex;align-items:center;justify-content:center;gap:13px}.pay-now:hover{background:#e4b344}.knet-mark{width:49px;height:37px;display:grid;place-items:center;overflow:hidden;border-radius:5px;flex:0 0 auto}.knet-mark img{display:block;width:100%;height:100%;object-fit:cover}.delivery-time-lines{display:grid!important;gap:3px}.delivery-time-lines span{display:block}.delivery-time-lines span:first-child{color:var(--green);font-weight:900}

@media(max-width:900px){.account-trigger span,.header-cart>span{display:none}.account-trigger,.header-cart{width:46px;height:46px;padding:0;justify-content:center}.header-cart b{position:absolute;top:1px;right:0;width:20px;height:20px;font-size:8px}.header-cart{position:relative}.brand strong{font-size:15px}}
@media(max-width:760px){
  .auth-panel{border-radius:27px 27px 0 0;padding:31px 20px 25px}.auth-modal{place-items:end center;padding:0}
  .auth-brand h2{font-size:21px}.account-drawer{width:100%}
  .customer-summary{grid-template-columns:1fr 1fr}.summary-box.full{grid-column:auto}.summary-box{padding:12px;gap:9px}.summary-icon{width:32px;height:32px}.summary-box strong{font-size:11px}
  .drawer-page-head{align-items:flex-start}.drawer-page-head h2{font-size:20px}
}

.steps{grid-template-columns:repeat(4,1fr)}
.steps:before{left:11%;right:11%}
.checkout-address .radio,.time-choice .radio{display:grid;place-items:center;color:#fff;font-size:12px;font-weight:900}
.checkout-address.selected .radio,.time-choice.selected .radio{border-color:var(--green);background:var(--green)}
.delivery-time-panel{display:grid;gap:11px}
.time-choice{width:100%;display:flex;align-items:center;gap:12px;text-align:start;border:1px solid var(--line);border-radius:18px;padding:16px;background:#fff;color:var(--ink)}
.time-choice.selected{border-color:var(--green);background:#f1f7f3;box-shadow:0 0 0 3px #2d6a4f0c}
.time-choice:disabled,.time-choice.disabled{opacity:.46;cursor:not-allowed;background:#f1f2f0;border-color:#d9ddda}
.time-choice>span:last-child{display:grid;gap:4px}.time-choice strong{font-size:14px}.time-choice small{font-size:10px;color:var(--muted);line-height:1.7}
.time-warning{margin:-2px 6px 2px;color:#bd2d2d;font-size:10px;font-weight:800;line-height:1.8}
.time-fields{display:grid;grid-template-columns:1.5fr repeat(3,1fr);grid-template-areas:"date period minute hour";gap:9px;border:1px solid var(--line);border-radius:18px;padding:14px;background:#fafbf9}
.time-fields label{display:grid;gap:6px;font-size:10px;font-weight:900}.time-fields input,.time-fields select{width:100%;min-height:50px;border:1px solid var(--line);border-radius:13px;background:#fff;padding:9px;color:var(--ink);outline:0}
.success-delivery-time{display:grid;gap:5px;width:min(420px,100%);margin:4px 0 18px;padding:14px 16px;border-radius:16px;background:#eef5f0}.success-delivery-time small{color:var(--muted)}.success-delivery-time strong{font-size:13px}
.drawer-layer.order-detail-mode .account-drawer{width:min(860px,96vw)}.drawer-layer.order-detail-mode #accountContent{padding-inline:28px}
.order-detail{display:grid;gap:16px}.order-detail-hero{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;padding:20px 22px;border-radius:22px;background:radial-gradient(circle at 8% 20%,#dca83e2b,transparent 32%),linear-gradient(135deg,#e7f0e9,#f7f1e5)}.order-detail-hero:after{content:"";position:absolute;width:130px;height:130px;border:28px solid #ffffff66;border-radius:50%;inset-inline-end:-47px;bottom:-72px}.order-detail-brand{display:flex!important;align-items:center;gap:13px}.order-detail-brand img{width:54px;height:54px;object-fit:contain;background:#fff;border-radius:16px;padding:6px;box-shadow:0 10px 28px #174a3717}.order-detail-hero div{display:grid;gap:3px}.order-detail-hero small{color:var(--muted);font-size:9px}.order-detail-hero strong{direction:ltr;font-size:22px;color:var(--green)}.order-detail-hero p{margin:0;color:var(--muted);font-size:9px}.order-detail-hero .paid-badge{position:relative;z-index:1;background:#fff;color:var(--green);box-shadow:0 7px 22px #174a3714;padding:8px 13px}
.order-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.order-detail-grid>div{min-width:0;display:flex;align-items:flex-start;gap:11px;border:1px solid #e2e7e3;border-radius:16px;padding:13px;background:#fff}.order-detail-grid>div>span:last-child{min-width:0}.detail-item-icon{width:34px;height:34px;border-radius:11px;background:#f1f6f2;color:var(--green);display:grid;place-items:center;flex:0 0 auto}.detail-item-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.order-detail-grid small{display:block;color:var(--muted);font-size:8px;margin-bottom:4px}.order-detail-grid strong{display:block;font-size:10px;line-height:1.8;overflow-wrap:anywhere}.order-detail-grid .phone{direction:ltr;text-align:right}
.order-detail-body{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(210px,.75fr);gap:12px;align-items:start}.order-detail-items{display:grid;border:1px solid #e2e7e3;border-radius:18px;overflow:hidden;background:#fff}.order-detail-items article{display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:11px;padding:12px 14px;border-bottom:1px solid #eef0ec}.order-detail-items article:last-child{border-bottom:0}.order-detail-items article>i{width:28px;height:28px;border-radius:9px;background:#f2f5f1;color:var(--green);display:grid;place-items:center;font-size:9px;font-style:normal;font-weight:900}.order-detail-items span{display:grid;gap:4px}.order-detail-items b{font-size:10px}.order-detail-items small{font-size:8px;color:var(--muted)}.order-detail-items strong{font-size:10px;color:var(--green);white-space:nowrap}
.order-detail-totals{display:grid;gap:10px;padding:16px;border-radius:18px;background:#f2f5f1}.order-detail-totals span,.order-detail-totals strong{display:flex;justify-content:space-between;gap:15px}.order-detail-totals span{font-size:9px;color:var(--muted)}.order-detail-totals>strong{border-top:1px dashed #cbd4ce;padding-top:10px;font-size:13px}.order-detail-totals>small{display:flex;align-items:center;gap:7px;margin-top:2px;padding-top:10px;border-top:1px solid #dfe6e1;color:var(--green);font-size:8px;font-weight:800}.order-detail-totals>small svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8}
.download-invoice-button{min-height:56px}.download-invoice-button:disabled{opacity:.65;cursor:wait}

@media(max-width:760px){
  .steps span{font-size:8px;text-align:center}.steps i{width:38px;height:38px}.steps:before{top:18px}
  .time-fields{grid-template-columns:1fr 1fr 1fr;grid-template-areas:"date date date" "period minute hour"}
  .time-date{grid-area:date}.time-period{grid-area:period}.time-minute{grid-area:minute}.time-hour{grid-area:hour}
  .drawer-layer.order-detail-mode #accountContent{padding-inline:16px}.order-detail-grid{grid-template-columns:1fr 1fr}.order-detail-body{grid-template-columns:1fr}.order-detail-hero{padding:16px}.order-detail-brand img{width:47px;height:47px}
}

@media(max-width:430px){
  .customer-summary,.order-detail-grid{grid-template-columns:1fr}
}

.invoice{width:794px;min-height:1123px;padding:0 48px 38px;background:#fff;color:#17372b;font-family:"Noto Kufi Arabic",Arial,sans-serif;overflow:hidden}.invoice-topline{height:10px;margin-inline:-48px;background:linear-gradient(90deg,#173f30 0 72%,#dca83e 72%)}.invoice-header{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:34px 0 22px;border-bottom:1px solid #dfe5e1}.invoice-brand{display:flex;align-items:center;gap:15px}.invoice-brand img{width:74px;height:74px;object-fit:contain}.invoice-brand h1{font-size:21px;line-height:1.45;margin:0}.invoice-brand p{font-size:9px;color:#64756d;margin:4px 0 0}.invoice-title{text-align:end;display:grid;gap:4px}.invoice-title span{font-size:10px;color:#718078;letter-spacing:.08em}.invoice-title strong{direction:ltr;font-size:21px;color:#1e684a}.invoice-title small{font-size:9px;color:#718078}.invoice-company-box{display:grid;gap:4px;width:48%;margin:16px 0 0 auto;padding:12px 14px;border:1px solid #d7e5dd;border-radius:12px;background:#f5faf7;color:#52665d;font-size:7px;line-height:1.8}.invoice-company-box>b{color:#173f30;font-size:8px}.invoice-company-box strong{color:#1e684a;font-size:8px}.invoice-parties{display:grid;grid-template-columns:1fr 1.35fr .85fr;gap:10px;padding:22px 0}.invoice-parties>div{border:1px solid #dfe5e1;border-radius:13px;padding:13px;background:#fbfcfb}.invoice-parties span,.invoice-note span{display:block;color:#839088;font-size:7px;margin-bottom:6px}.invoice-parties h3{font-size:9px;line-height:1.8;margin:0;overflow-wrap:anywhere}.invoice-parties p{font-size:7px;line-height:1.8;color:#718078;margin:5px 0 0}.invoice-parties .invoice-payment{background:#edf5f0;border-color:#d7e6dd}.invoice-parties .invoice-payment h3{color:#26704e}.invoice-phone{direction:ltr;text-align:right}.invoice[dir=ltr] .invoice-phone{text-align:left}.invoice-items{width:100%;border-collapse:separate;border-spacing:0;border:1px solid #dfe5e1;border-radius:14px;overflow:hidden}.invoice-items th{background:#173f30;color:#fff;font-size:8px;font-weight:700;padding:11px 9px;text-align:start}.invoice-items td{font-size:8px;padding:11px 9px;border-bottom:1px solid #e9eeeb;color:#496057}.invoice-items tbody tr:last-child td{border-bottom:0}.invoice-items th:first-child,.invoice-items td:first-child{width:35px;text-align:center}.invoice-items th:nth-child(n+3),.invoice-items td:nth-child(n+3){text-align:center;white-space:nowrap}.invoice-items td:nth-child(2){color:#183b2e}.invoice-items td:nth-child(2) small{display:block;margin-top:3px;color:#718078;font-size:6.5px}.invoice-bottom{display:grid;grid-template-columns:1.25fr .75fr;gap:18px;align-items:start;margin-top:20px}.invoice-note{padding:16px;border-radius:14px;background:#f8f5ee}.invoice-note p{font-size:8px;line-height:1.8;margin:0 0 6px}.invoice-note small{font-size:6.5px;color:#849088}.invoice-totals{display:grid;gap:0;margin:0;border:1px solid #dfe5e1;border-radius:14px;overflow:hidden}.invoice-totals>*{display:flex;justify-content:space-between;gap:14px;padding:10px 12px;font-size:8px;border-bottom:1px solid #e8edea}.invoice-totals>*:last-child{border:0}.invoice-totals strong{background:#173f30;color:#fff;font-size:11px}.invoice footer{display:flex;align-items:center;gap:11px;margin-top:32px;padding-top:16px;border-top:1px solid #dfe5e1;text-align:start}.invoice footer img{width:34px;height:34px;object-fit:contain}.invoice footer div{display:grid;gap:3px}.invoice footer b{font-size:9px}.invoice footer small{font-size:7px;color:#718078}.invoice footer>span{direction:ltr;margin-inline-start:auto;color:#1e684a;font-size:8px;font-weight:800}
