html,body,#root{margin:0;min-height:100%}body{background:var(--ds-page)}.demo{margin:8px 0 20px}.demo-tabs{display:flex;gap:8px;margin-bottom:12px}.demo-tabs button{flex:1;min-height:44px;border-radius:12px;border:1px solid var(--ds-hairline);background:#fff;color:var(--ds-ink-2);font:inherit;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px}.demo-tabs button.on{background:var(--ds-ink);color:#fff;border-color:var(--ds-ink)}.demo-tabs .pill{background:#ff6b35;color:#fff;border-radius:999px;min-width:20px;height:20px;font-size:12px;display:inline-flex;align-items:center;justify-content:center;padding:0 5px}.phone{background:#14100d;border-radius:24px;overflow:hidden;display:flex;flex-direction:column;height:min(680px,78vh);box-shadow:0 12px 32px #14100d40;font-family:-apple-system,Segoe UI,Tahoma,Noto Kufi Arabic,sans-serif}.chat-head{display:flex;align-items:center;gap:10px;padding:12px 14px;background:#1e1815;border-bottom:1px solid #2c2420}.chat-head .avatar{width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid #ff6b35}.chat-head .who{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}.chat-head .who b{color:#fff;font-size:15px}.chat-head .status{color:#9fe870;font-size:12px;display:flex;align-items:center;gap:5px}.chat-head .status i{width:7px;height:7px;border-radius:50%;background:#9fe870;display:inline-block}.chat-head .trial{background:#3a2f28;color:#ffb37c;font-size:11px;border-radius:999px;padding:4px 10px;white-space:nowrap}.chat-body{flex:1;overflow-y:auto;padding:14px 12px 10px;display:flex;flex-direction:column;gap:8px}.daymark{align-self:center;background:#2c2420;color:#c9b8a8;font-size:11px;border-radius:8px;padding:6px 10px;text-align:center;max-width:92%}.msg{max-width:82%;padding:9px 12px;border-radius:14px;font-size:14px;line-height:1.7;animation:pop .25s ease}.msg p{margin:0}.msg p+p{margin-top:6px}.msg.bot{align-self:flex-start;background:#26201c;color:#f5efe9;border-start-start-radius:4px}.msg.user{align-self:flex-end;background:#ff6b35;color:#fff;border-start-end-radius:4px}.msg .mini{font-size:11.5px;opacity:.75}@keyframes pop{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.dots{display:inline-flex;gap:4px;padding:4px 2px}.dots i{width:7px;height:7px;border-radius:50%;background:#8a7c72;animation:blink 1.2s infinite}.dots i:nth-child(2){animation-delay:.2s}.dots i:nth-child(3){animation-delay:.4s}@keyframes blink{0%,60%,to{opacity:.35}30%{opacity:1}}.chips{display:flex;flex-wrap:wrap;gap:7px;padding:2px 0 4px;animation:pop .25s ease}.chips button{min-height:40px;border-radius:999px;border:1.5px solid #ff6b35;background:transparent;color:#ffb37c;font:inherit;font-size:13px;font-weight:600;padding:8px 14px;cursor:pointer}.chips button:active{background:#ff6b35;color:#fff}.msg.items-row{max-width:100%;background:transparent;padding:2px 0}.items-scroll{display:flex;gap:10px;overflow-x:auto;padding:4px 2px 8px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}.icard{scroll-snap-align:start;flex:0 0 168px;background:#26201c;border-radius:16px;overflow:hidden;display:flex;flex-direction:column}.icard img{width:100%;height:110px;object-fit:cover;display:block}.icard .ibody{padding:9px 10px 10px;display:flex;flex-direction:column;gap:5px;flex:1}.icard .ibody b{color:#fff;font-size:13.5px;line-height:1.4}.icard .ibody p{color:#b7a99e;font-size:11px;line-height:1.5;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.icard .price{color:#ff9d5c;font-weight:700;font-size:14px}.icard .acts{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:auto}.icard .qty{color:#9fe870;font-size:11px;font-weight:600}.icard .add,.icard .combo{border:none;border-radius:999px;font:inherit;font-size:12px;font-weight:700;min-height:36px;padding:7px 12px;cursor:pointer}.icard .add{background:#ff6b35;color:#fff;flex:1}.icard .combo{background:#3a2f28;color:#ffb37c}.msg.summary{width:100%;max-width:100%;background:#201a16;border:1px solid #3a2f28}.sum-head{font-weight:700;color:#fff;margin-bottom:8px}.sum-line,.sum-total{display:flex;justify-content:space-between;gap:10px;padding:5px 0;font-size:13.5px;color:#e8ded5}.sum-total{border-top:1px dashed #4a3d33;margin-top:6px;padding-top:8px;color:#fff;font-weight:700}.sum-meta{margin-top:8px;padding-top:8px;border-top:1px dashed #4a3d33;color:#c9b8a8;font-size:12.5px}.msg.order-ok{background:#14312a;border:1px solid #1f5245}.msg.order-ok .ok-head{color:#9fe870;font-weight:700;margin-bottom:4px}.cartbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 10px 8px;padding:12px 14px;border:none;border-radius:14px;background:#ff6b35;color:#fff;font:inherit;font-weight:600;font-size:14px;cursor:pointer;box-shadow:0 6px 18px #ff6b3559}.cartbar .go{background:#00000038;border-radius:999px;padding:5px 12px;font-size:13px}.chat-foot{display:flex;gap:8px;padding:10px;background:#1e1815;border-top:1px solid #2c2420}.chat-foot input{flex:1;min-height:44px;border-radius:999px;border:1px solid #3a2f28;background:#26201c;color:#fff;font:inherit;font-size:14px;padding:10px 16px;outline:none}.chat-foot input::placeholder{color:#8a7c72}.chat-foot .send{width:44px;height:44px;border-radius:50%;border:none;background:#ff6b35;color:#fff;font-size:16px;cursor:pointer;transform:scaleX(-1)}.owner-body{flex:1;overflow-y:auto;padding:14px 12px;display:flex;flex-direction:column;gap:10px}.stats{display:flex;gap:8px}.stats>div{flex:1;background:#26201c;border-radius:14px;padding:10px;text-align:center;display:flex;flex-direction:column;gap:2px}.stats b{color:#ff9d5c;font-size:16px}.stats span{color:#b7a99e;font-size:11px}.ocard{background:#26201c;border-radius:16px;padding:12px;display:flex;flex-direction:column;gap:4px}.ohead{display:flex;justify-content:space-between;color:#fff;font-size:13.5px;margin-bottom:4px}.ohead span{color:#8a7c72;font-size:12px}.oline{display:flex;justify-content:space-between;gap:8px;color:#e8ded5;font-size:13px}.oline.tot{border-top:1px dashed #4a3d33;padding-top:6px;margin-top:4px;color:#fff;font-weight:700}.ometa{color:#c9b8a8;font-size:12px;margin:6px 0}.ostatus{min-height:40px;border-radius:10px;border:none;font:inherit;font-size:13px;font-weight:700;cursor:pointer;color:#14100d}.ostatus.s0{background:#ffd166}.ostatus.s1{background:#ff9d5c}.ostatus.s2{background:#9fe870}.ostatus.s3{background:#3a2f28;color:#9fe870;cursor:default}.empty{text-align:center;color:#c9b8a8;padding:30px 16px;display:flex;flex-direction:column;gap:10px;align-items:center}.empty .mini{font-size:12px;opacity:.8}.owner-note{color:#8a7c72;font-size:11.5px;text-align:center;line-height:1.7}.file-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--ds-ink);color:#fff;border:none;border-radius:12px;min-height:44px;padding:0 18px;font:inherit;font-weight:600;cursor:pointer}.file-button.is-compact{min-height:36px;padding:0 14px;font-size:13px;border-radius:10px}.wa-send{display:flex;align-items:center;justify-content:center;gap:8px;background:#25d366;color:#0b3d20!important;border-radius:12px;min-height:46px;font-weight:700;font-size:15px;text-decoration:none;margin:10px 0 6px}