@layer components{:root{--cl-path-color:var(--sq-brand,#0e4c5c);--cl-path-width:1.5px;--cl-path-glow-color:var(--sq-action,#f4791f);--cl-path-glow-width:0px;--cl-path-dash-gap:8px;--cl-path-dash-length:4px;--cl-station-dot-size:8px;--cl-station-dot-border:2px;--cl-station-dot-bg:var(--sq-paper,#fff);--cl-station-dot-active-bg:var(--cl-path-color);--cl-station-dot-completed-bg:var(--cl-path-glow-color);--cl-seed-container-size:clamp(200px, 35vw, 320px);--cl-seed-image-size:100%;--cl-seed-border-radius:var(--sq-radius-lg,24px);--cl-seed-shadow:var(--sq-shadow-md,0 4px 16px #00000014);--cl-seed-transition-duration:.5s;--cl-seed-transition-easing:var(--sq-easing-spring,cubic-bezier(.34, 1.56, .64, 1));--cl-seed-product-bg:var(--sq-paper,#fff);--cl-seed-customer-glow:#f4791f40;--cl-seed-customer-ring:var(--sq-action,#f4791f);--cl-seed-order-bg:var(--sq-paper,#fff);--cl-seed-order-border:var(--sq-brand,#0e4c5c);--cl-seed-payment-badge-bg:var(--sq-success,#059669);--cl-seed-delivery-box-bg:#f8f5f0;--cl-seed-delivery-stamp-border:var(--sq-brand,#0e4c5c);--cl-seed-return-bg:var(--sq-paper,#fff);--cl-micro-badge-size:24px;--cl-micro-transition:.2s var(--sq-easing-standard,cubic-bezier(.4, 0, .2, 1));--cl-duration-breath:1.2s;--cl-duration-transform:.8s;--cl-duration-quick:.4s;--cl-duration-reset:.4s;--cl-duration-auto-cycle:10.6s;--cl-duration-auto-pause:2s;--cl-easing-breath:cubic-bezier(.4, 0, .2, 1);--cl-easing-transform:cubic-bezier(.34, 1.56, .64, 1);--cl-easing-path:cubic-bezier(.25, .46, .45, .94);--cl-breakpoint-mobile:640px;--cl-breakpoint-tablet:1024px;--cl-breakpoint-desktop:1280px}@media (prefers-reduced-motion:reduce){:root{--cl-duration-breath:.01ms;--cl-duration-transform:.01ms;--cl-duration-quick:.01ms;--cl-duration-reset:.01ms;--cl-duration-auto-cycle:.01ms;--cl-seed-transition-duration:.01ms}.commerce-loop *,.commerce-loop :before,.commerce-loop :after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.commerce-loop--mobile .loop-station{opacity:1!important;visibility:visible!important}.loop-path{stroke-dashoffset:0!important}}[dir=rtl] .commerce-loop,.commerce-loop[dir=rtl]{--cl-path-direction:rtl}[dir=ltr] .commerce-loop,.commerce-loop[dir=ltr]{--cl-path-direction:ltr}.commerce-loop{--cl-size:macro;gap:var(--cl-gap,clamp(24px, 4vw, 48px));padding:var(--cl-padding,clamp(32px, 5vw, 64px));max-width:var(--cl-max-width,1200px);direction:rtl;flex-direction:column;margin:0 auto;display:flex;position:relative}.commerce-loop--macro{--cl-size:macro}.commerce-loop--interactive{--cl-size:interactive}.commerce-loop--micro{--cl-size:micro}.commerce-loop--mobile{--cl-path-orientation:vertical;--cl-station-height:auto;--cl-gap:0}.loop-path-container{pointer-events:none;z-index:0;position:absolute;inset:0;overflow:visible}.loop-path-svg{width:100%;height:100%;display:block}.loop-path-line{fill:none;stroke:var(--cl-path-color);stroke-width:var(--cl-path-width);stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:var(--cl-path-dash-length) var(--cl-path-dash-gap);stroke-dashoffset:var(--cl-path-total-length,1000);transition:stroke-dashoffset var(--cl-duration-auto-cycle) var(--cl-easing-path), stroke var(--cl-duration-quick) var(--cl-easing-standard), filter var(--cl-duration-quick) var(--cl-easing-standard);filter:drop-shadow(0 0 var(--cl-path-glow-width) var(--cl-path-glow-color))}.loop-path-line--animated{animation:cl-path-draw var(--cl-duration-auto-cycle) var(--cl-easing-path) forwards}@keyframes cl-path-draw{0%{stroke-dashoffset:var(--cl-path-total-length,1000)}to{stroke-dashoffset:0}}.loop-stations{gap:var(--cl-gap);z-index:1;flex-direction:column;display:flex;position:relative}.commerce-loop--mobile .loop-stations{flex-direction:column}.commerce-loop[style*=horizontal] .loop-stations,.commerce-loop:not(.commerce-loop--mobile) .loop-stations{flex-flow:wrap;justify-content:space-between;align-items:flex-start}@media (max-width:640px){.commerce-loop:not(.commerce-loop--micro) .loop-stations{flex-direction:column}}.loop-station{text-align:center;opacity:0;min-width:0;animation:cl-station-reveal var(--cl-entrance-duration,.6s) var(--cl-easing-entrance,cubic-bezier(.16, 1, .3, 1)) forwards;animation-delay:calc(var(--cl-station-index,0) * var(--cl-stagger-delay,80ms));flex-direction:column;flex:1;align-items:center;display:flex;position:relative;transform:translateY(20px)}.loop-station--revealed{opacity:1;transform:translateY(0)}.loop-station__dot{width:var(--cl-station-dot-size);height:var(--cl-station-dot-size);border:var(--cl-station-dot-border) solid var(--cl-path-color);background:var(--cl-station-dot-bg);z-index:2;transition:background-color var(--cl-duration-quick) var(--cl-easing-standard), border-color var(--cl-duration-quick) var(--cl-easing-standard), box-shadow var(--cl-duration-quick) var(--cl-easing-standard);border-radius:50%;flex-shrink:0;position:relative}.loop-station--active .loop-station__dot{background:var(--cl-station-dot-active-bg);border-color:var(--cl-station-dot-active-bg);box-shadow:0 0 0 4px #0e4c5c33}.loop-station--completed .loop-station__dot{background:var(--cl-station-dot-completed-bg);border-color:var(--cl-station-dot-completed-bg)}.loop-station__label{font-size:var(--cl-title-font-size,clamp(1.5rem, 3vw, 2.25rem));color:var(--cl-path-color);font-weight:800;font-family:var(--font-display,"Cairo", sans-serif);letter-spacing:-.02em;margin-top:8px;margin-bottom:4px}.loop-station__title{font-size:var(--cl-desc-font-size,clamp(1rem, 1.5vw, 1.25rem));color:var(--sq-ink,#1a1a2e);margin:0 0 4px;font-weight:700;line-height:1.4}.loop-station__description{font-size:calc(var(--cl-desc-font-size,1rem) * .85);color:var(--sq-muted,#6b7280);max-width:280px;margin:0;line-height:1.6}.loop-traveler{width:var(--cl-seed-container-size,clamp(200px, 35vw, 320px));height:var(--cl-seed-container-size,clamp(200px, 35vw, 320px));pointer-events:none;z-index:10;transition:transform var(--cl-seed-transition-duration) var(--cl-seed-transition-easing), opacity var(--cl-duration-quick) var(--cl-easing-standard);will-change:transform, opacity;position:absolute;top:0;left:0}.loop-traveler__inner{border-radius:var(--cl-seed-border-radius);background:var(--cl-seed-bg,var(--cl-seed-product-bg));width:100%;height:100%;box-shadow:var(--cl-seed-shadow);flex-direction:column;display:flex;position:relative;overflow:hidden}.cl-seed-product{flex-direction:column;height:100%;display:flex}.cl-seed-image-wrap{border-radius:var(--cl-seed-border-radius) var(--cl-seed-border-radius) 0 0;flex:1;position:relative;overflow:hidden}.cl-seed-image{object-fit:cover;width:100%;height:100%;transition:transform var(--cl-duration-transform) var(--cl-easing-transform)}.cl-seed-product:hover .cl-seed-image{transform:scale(1.03)}.cl-seed-info{background:var(--sq-paper,#fff);flex-direction:column;gap:8px;padding:16px;display:flex}.cl-seed-category{color:var(--sq-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.75rem;font-weight:600}.cl-seed-name{color:var(--sq-ink);margin:0;font-size:1.125rem;font-weight:800;line-height:1.3}.cl-seed-price{align-items:baseline;gap:4px;margin-top:4px;display:flex}.cl-seed-amount{color:var(--cl-path-color);font-variant-numeric:tabular-nums;font-size:1.5rem;font-weight:900}.cl-seed-currency{color:var(--sq-muted);font-size:.875rem;font-weight:600}.cl-seed-cta{background:var(--cl-path-glow-color,var(--sq-action));color:#fff;border-radius:var(--sq-radius-md,12px);cursor:pointer;transition:transform .15s var(--cl-easing-standard), box-shadow .15s var(--cl-easing-standard);border:none;justify-content:center;align-items:center;gap:8px;margin-top:8px;padding:12px 20px;font-size:.875rem;font-weight:700;display:inline-flex}.cl-seed-cta:hover{transform:translateY(-2px);box-shadow:0 8px 24px #f4791f59}.cl-seed-cta:active{transform:translateY(0)scale(.98)}.cl-seed-arrow{stroke:currentColor;stroke-width:2.5px;fill:none;width:18px;height:18px}.cl-seed-customer .cl-seed-image-wrap{position:relative}.cl-seed-selection-ring{border-radius:calc(var(--cl-seed-border-radius) + 4px);pointer-events:none;transition:box-shadow var(--cl-duration-transform) var(--cl-easing-transform), opacity var(--cl-duration-quick) var(--cl-easing-standard);position:absolute;inset:-4px}.cl-seed-check-badge{background:var(--sq-action);color:#fff;transform-origin:50%;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;display:flex;position:absolute;top:8px;left:8px;box-shadow:0 2px 8px #0003}.cl-seed-check-badge svg{stroke-width:3px;width:16px;height:16px}.cl-seed-glow-aura{border-radius:calc(var(--cl-seed-border-radius) + 12px);background:radial-gradient(circle at center, var(--cl-seed-customer-glow), transparent 70%);pointer-events:none;position:absolute;inset:-12px}.cl-seed-stage-label{color:var(--sq-action);text-transform:uppercase;letter-spacing:.05em;font-size:.875rem;font-weight:700}.cl-seed-order .cl-seed-image-wrap{border:2px solid var(--cl-seed-order-border);transition:clip-path var(--cl-duration-transform) var(--cl-easing-transform), border-color var(--cl-duration-transform) var(--cl-easing-transform)}.cl-seed-morphing{transition:clip-path var(--cl-duration-transform) var(--cl-easing-transform), border-color var(--cl-duration-transform) var(--cl-easing-transform)}.cl-seed-order-overlay{pointer-events:none;flex-direction:column;justify-content:space-between;padding:16px;display:flex;position:absolute;inset:0}.cl-seed-order-header{justify-content:space-between;align-items:center;display:flex}.cl-seed-order-badge{color:var(--sq-action);text-transform:uppercase;letter-spacing:.05em;background:#f4791f26;border-radius:999px;padding:4px 10px;font-size:.7rem;font-weight:800}.cl-seed-order-number{color:var(--sq-ink);font-variant-numeric:tabular-nums;font-size:.875rem;font-weight:800;font-family:var(--font-mono,"JetBrains Mono", monospace)}.cl-seed-whatsapp-icon{color:#fff;background:#25d366;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;display:flex;box-shadow:0 2px 8px #25d3664d}.cl-seed-whatsapp-icon svg{width:20px;height:20px}.cl-seed-payment .cl-seed-image-wrap{border:2px solid var(--cl-seed-order-border)}.cl-seed-payment-badge{transform:translate(-50%, -50%) scale(var(--cl-badge-scale,1));background:var(--cl-seed-payment-badge-bg);color:#fff;pointer-events:none;z-index:5;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:72px;height:72px;display:flex;position:absolute;top:50%;left:50%;box-shadow:0 8px 32px #05966966}.cl-seed-payment-icon svg{width:28px;height:28px}.cl-seed-payment-check svg{stroke-width:3.5px;width:20px;height:20px}.cl-seed-delivery .cl-seed-delivery-box{background:var(--cl-seed-delivery-box-bg);border:1px solid var(--cl-seed-delivery-stamp-border);flex-direction:column;justify-content:center;align-items:center;gap:16px;width:100%;height:100%;padding:20px;display:flex;position:relative;overflow:hidden}.cl-seed-delivery-stamp{aspect-ratio:1;border:2px dashed var(--cl-seed-delivery-stamp-border);background:#fff;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:8px;width:80%;padding:12px;display:flex;position:relative}.cl-seed-stamp-image{object-fit:cover;border-radius:8px;width:60px;height:60px}.cl-seed-stamp-info{text-align:center;flex-direction:column;align-items:center;gap:2px;display:flex}.cl-seed-stamp-info span:first-child{color:var(--sq-ink);font-size:.875rem;font-weight:700}.cl-seed-stamp-info span:last-child{color:var(--cl-path-color);font-size:.875rem;font-weight:800}.cl-seed-delivery-info{text-align:center;flex-direction:column;gap:10px;width:100%;display:flex}.cl-seed-courier,.cl-seed-governorate{color:var(--sq-ink);background:#fff;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:8px 16px;font-size:.875rem;font-weight:600;display:inline-flex;box-shadow:0 2px 8px #0000000f}.cl-seed-courier svg,.cl-seed-governorate svg{width:18px;height:18px;color:var(--cl-path-color)}.cl-seed-return{position:relative;overflow:visible}.cl-seed-delivery-fade{transition:opacity var(--cl-duration-transform) var(--cl-easing-transform);position:absolute;inset:0}.cl-seed-return-content{flex-direction:column;justify-content:center;align-items:center;gap:16px;height:100%;padding:20px;display:flex}.cl-seed-return-customer{text-align:center;flex-direction:column;align-items:center;gap:12px;display:flex}.cl-seed-customer-avatar{background:linear-gradient(135deg, var(--sq-brand), var(--cl-path-glow-color));color:#fff;border-radius:50%;justify-content:center;align-items:center;width:72px;height:72px;font-size:1.5rem;font-weight:800;display:flex;box-shadow:0 8px 24px #0e4c5c4d}.cl-seed-return-text{flex-direction:column;gap:4px;display:flex}.cl-seed-return-name{color:var(--sq-ink);font-size:1.125rem;font-weight:800}.cl-seed-return-action{color:var(--sq-action);font-size:1rem;font-weight:600}.cl-seed-cycle-arrow{width:48px;height:48px;color:var(--cl-path-color);animation:cl-cycle-arrow-spin 3s var(--cl-easing-path) infinite}@keyframes cl-cycle-arrow-spin{0%,to{transform:rotate(0)}50%{transform:rotate(180deg)}}.cl-seed-payoff{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:24px;display:flex}.cl-seed-payoff-text{color:var(--sq-ink);max-width:300px;margin:0;font-size:1.25rem;font-weight:700;line-height:1.5}.cl-seed-cycle-indicator{width:48px;height:48px;color:var(--cl-path-color);opacity:.6}.loop-station--micro{text-align:right;background:var(--sq-paper);border-radius:var(--sq-radius-md);border:1px solid var(--sq-border,#e5e7eb);flex-direction:row;align-items:center;gap:12px;padding:8px 12px}.loop-station--micro .loop-station__dot{width:10px;height:10px}.loop-station--micro .loop-station__label,.loop-station--micro .loop-station__title{font-size:.75rem}.loop-station--micro .loop-station__description{display:none}.loop-station:focus-visible,.loop-traveler:focus-visible{box-shadow:0 0 0 3px var(--sq-focus,#0e4c5c), var(--cl-seed-shadow);border-radius:var(--sq-radius-md);outline:none}.loop-scroll-hint{color:var(--sq-muted);flex-direction:column;align-items:center;gap:8px;padding:20px;font-size:.875rem;animation:2s ease-in-out infinite cl-scroll-hint;display:flex}.loop-scroll-hint svg{width:24px;height:24px}@keyframes cl-scroll-hint{0%,to{opacity:.6;transform:translateY(0)}50%{opacity:1;transform:translateY(6px)}}}@media (max-width:640px){.commerce-loop.commerce-loop--mobile{--cl-mobile-station-height:240px;--cl-seed-container-size:clamp(180px, 58vw, 230px);width:100%;margin:0;display:block;position:relative;overflow:clip;height:1440px!important;min-height:1440px!important;padding:0!important}.commerce-loop.commerce-loop--mobile .loop-path-container{pointer-events:none;z-index:0;width:100%;height:100%;position:absolute;inset:0}.commerce-loop.commerce-loop--mobile .loop-path-svg{width:100%;height:100%;display:block;overflow:visible}.commerce-loop.commerce-loop--mobile .loop-stations{z-index:2;width:100%;height:100%;margin:0;padding:0;display:block;position:absolute;inset:0}.commerce-loop.commerce-loop--mobile .loop-station{box-sizing:border-box;text-align:center;background:var(--sq-paper,#fff);border-radius:var(--sq-radius-lg,24px);width:min(88vw,360px);min-width:0;max-width:360px;height:auto;box-shadow:0 0 0 12px var(--sq-paper,#fff);opacity:1;z-index:2;flex-direction:column;justify-content:center;align-items:center;margin:0;padding:18px 20px;display:flex;min-height:0!important;position:absolute!important;left:50%!important;transform:translate(-50%,-50%)!important}.commerce-loop.commerce-loop--mobile .loop-station:first-child{top:8.33333%!important}.commerce-loop.commerce-loop--mobile .loop-station:nth-child(2){top:25%!important}.commerce-loop.commerce-loop--mobile .loop-station:nth-child(3){top:41.6667%!important}.commerce-loop.commerce-loop--mobile .loop-station:nth-child(4){top:58.3333%!important}.commerce-loop.commerce-loop--mobile .loop-station:nth-child(5){top:75%!important}.commerce-loop.commerce-loop--mobile .loop-station:nth-child(6){top:91.6667%!important}.commerce-loop.commerce-loop--mobile .loop-station--return{z-index:2;width:min(88vw,360px);max-width:360px;height:auto;padding:18px 20px;min-height:0!important;position:absolute!important;top:94%!important;left:50%!important;transform:translate(-50%,-50%)!important}.commerce-loop.commerce-loop--mobile .loop-traveler{width:var(--cl-seed-container-size);height:var(--cl-seed-container-size);pointer-events:none;z-index:10;will-change:top, opacity;transition:top var(--cl-seed-transition-duration) var(--cl-seed-transition-easing), opacity var(--cl-duration-quick) var(--cl-easing-standard);margin:0!important;position:absolute!important;left:50%!important;transform:translate(-50%,-50%)!important}.commerce-loop.commerce-loop--mobile .loop-traveler__inner{transform-origin:50%;will-change:transform, opacity;width:100%;height:100%;overflow:visible}.commerce-loop.commerce-loop--mobile .cl-seed-image,.commerce-loop.commerce-loop--mobile .cl-seed-image-wrap{max-width:100%}.commerce-loop.commerce-loop--mobile .loop-station__label{margin-top:0;margin-bottom:6px;font-size:clamp(1.15rem,5vw,1.6rem);line-height:1.25}.commerce-loop.commerce-loop--mobile .loop-station__title{max-width:320px;font-size:clamp(.98rem,3.7vw,1.2rem);line-height:1.45}.commerce-loop.commerce-loop--mobile .loop-station__description{max-width:320px;font-size:clamp(.82rem,3vw,.98rem);line-height:1.55}}@media (min-width:641px){.commerce-loop .loop-path-container{pointer-events:none;z-index:0;position:absolute;inset:0}.commerce-loop .loop-stations{z-index:1;position:relative}.commerce-loop .loop-traveler{pointer-events:none;z-index:10;will-change:transform, opacity;margin:0;position:absolute!important}.commerce-loop .loop-traveler__inner{transform-origin:50%;will-change:transform, opacity}}@media (prefers-reduced-motion:reduce){.commerce-loop .loop-traveler,.commerce-loop .loop-traveler__inner{transition-duration:.01ms!important;animation:none!important}.commerce-loop.commerce-loop--mobile .loop-traveler{transition:none!important;position:absolute!important}.commerce-loop.commerce-loop--mobile .loop-traveler__inner{transition:none!important}}
@layer components{@keyframes cl-seed-select{0%{box-shadow:var(--cl-seed-shadow);transform:translateY(0)scale(1)}30%{box-shadow:0 12px 32px var(--cl-seed-customer-glow);transform:translateY(-8px)scale(1.02)}60%{transform:translateY(-4px)scale(1.01)}to{box-shadow:0 0 0 3px var(--cl-seed-customer-ring), var(--cl-seed-shadow);transform:translateY(0)scale(1)}}@keyframes cl-seed-to-order{0%{clip-path:inset(0 round var(--cl-seed-border-radius));border-color:var(--cl-seed-customer-ring)}40%{clip-path:inset(2px round calc(var(--cl-seed-border-radius) - 2px));border-color:var(--cl-seed-order-border)}70%{clip-path:inset(0 round var(--cl-seed-border-radius));border-color:var(--cl-seed-order-border)}to{clip-path:inset(0 round var(--cl-seed-border-radius));border-color:var(--cl-seed-order-border)}}@keyframes cl-seed-payment-badge{0%{opacity:0;transform:scale(.6)translateY(8px)}50%{opacity:1;transform:scale(1.15)translateY(-2px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes cl-seed-to-delivery{0%{border-radius:var(--cl-seed-border-radius);transform:scale(1)rotate(0)}30%{border-radius:calc(var(--cl-seed-border-radius) * .6);transform:scale(.95)rotate(-1deg)}60%{border-radius:calc(var(--cl-seed-border-radius) * .4);transform:scale(1.02)rotate(.5deg)}to{border-radius:calc(var(--cl-seed-border-radius) * .3);transform:scale(1)rotate(0)}}@keyframes cl-seed-to-return{0%{opacity:1;transform:scale(1)}40%{opacity:.6;transform:scale(.85)}70%{opacity:0;transform:scale(.7)}71%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}@keyframes cl-seed-reset{0%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes cl-path-draw{0%{stroke-dashoffset:var(--cl-path-total-length,1000)}to{stroke-dashoffset:0}}@keyframes cl-station-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.04)}}@keyframes cl-glow-pulse{0%,to{--cl-path-glow-width:0px;filter:drop-shadow(0 0 #0000)}50%{--cl-path-glow-width:4px;filter:drop-shadow(0 0 8px var(--cl-path-glow-color))}}@keyframes cl-auto-cycle{0%{}9.4%{}17%{}21.7%{}29.2%{}33.9%{}39.6%{}43.4%{}49.1%{}53.8%{}59.4%{}66%{}to{}}@keyframes cl-station-reveal{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes cl-seed-entrance{0%{opacity:0;transform:scale(.9)translateY(16px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes cl-micro-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}@keyframes cl-micro-slide-in{0%{opacity:0;transform:translate(-8px)}to{opacity:1;transform:translate(0)}}@keyframes cl-micro-status-change{0%{background-color:var(--cl-micro-from,transparent)}50%{background-color:var(--cl-micro-to,var(--sq-action))}to{background-color:var(--cl-micro-to,var(--sq-action))}}}
