@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&family=Inter:wght@400;500;600&display=swap";@import "https://fonts.googleapis.com/css2?family=Tajawal:wght@300;400;500;700;800&family=Outfit:wght@300;400;600;700&display=swap";body{margin:0;padding:0}#root{width:100%;min-height:100vh;margin:0;padding:0}:root{--bg-dark:#f0f2f5;--bg-surface:#fff;--bg-card:#fff;--bg-card-hover:#f8faff;--border:#0000000f;--border-strong:#0000001f;--text-primary:#1e293b;--text-secondary:#64748b;--text-muted:#94a3b8;--accent:#4f46e5;--accent-dim:#4f46e514;--accent-glow:#4f46e526;--success:#10b981;--warning:#f59e0b;--font-arabic:"Tajawal", sans-serif;--font-display:"Outfit", sans-serif;--radius-sm:8px;--radius-md:16px;--radius-lg:24px;--radius-xl:32px;--shadow-card:0 12px 40px #00000014;--shadow-glow:0 0 30px #4f46e51a}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-dark);color:var(--text-primary);font-family:var(--font-arabic);-webkit-font-smoothing:antialiased;background-image:radial-gradient(at 0 0,#4f46e50d 0,#0000 50%),radial-gradient(at 100% 100%,#10b9810d 0,#0000 50%);overflow:hidden}.app-container{direction:rtl;flex-direction:column;height:100vh;display:flex;overflow:hidden}.header{background:var(--bg-surface);border-bottom:1px solid var(--border);z-index:100;justify-content:space-between;align-items:center;height:60px;padding:0 1.5rem;display:flex;box-shadow:0 2px 10px #00000005}.logo-container{align-items:center;gap:8px;display:flex}.logo-icon{background:linear-gradient(135deg, var(--accent), #818cf8);width:32px;height:32px;box-shadow:0 4px 15px var(--accent-glow);border-radius:10px;justify-content:center;align-items:center;display:flex}.logo-text{font-family:var(--font-display);color:var(--text-primary);letter-spacing:-.5px;font-size:1.15rem;font-weight:800}.logo-text span{color:var(--accent)}.nav-links{background:#f1f5f9;border-radius:12px;gap:.3rem;padding:3px;display:flex}.nav-btn{color:var(--text-secondary);font-family:var(--font-arabic);cursor:pointer;background:0 0;border:none;border-radius:8px;padding:.4rem 1rem;font-size:.82rem;font-weight:600;transition:all .2s cubic-bezier(.4,0,.2,1)}.nav-btn.active{background:var(--bg-surface);color:var(--accent);box-shadow:0 2px 8px #0000000d}.header-badge{background:var(--accent-dim);color:var(--accent);border:1px solid #4f46e51a;border-radius:999px;padding:.3rem .8rem;font-size:.75rem;font-weight:700}.main-content{flex:1;gap:.75rem;height:calc(100vh - 60px);padding:.75rem;display:flex;overflow:hidden}.sidebar{background:var(--bg-surface);border-radius:var(--radius-md);border:1px solid var(--border);width:260px;box-shadow:var(--shadow-card);flex-direction:column;transition:all .4s cubic-bezier(.16,1,.3,1);display:flex;overflow:hidden}.sidebar.collapsed{width:64px}.sidebar.collapsed .sidebar-title-row h2,.sidebar.collapsed .search-container,.sidebar.collapsed .cat-btn span,.sidebar.collapsed .store-info,.sidebar.collapsed .store-indicator{display:none}.sidebar.collapsed .sidebar-header,.sidebar.collapsed .category-filter,.sidebar.collapsed .stores-list{align-items:center;padding:.5rem}.sidebar.collapsed .cat-btn,.sidebar.collapsed .store-card{justify-content:center;padding:.5rem}.sidebar.collapsed .store-img{width:32px;height:32px}.menu-toggle-btn{color:var(--accent);cursor:pointer;background:#f1f5f9;border:none;border-radius:8px;justify-content:center;align-items:center;margin-left:5px;padding:5px;transition:all .2s;display:flex}.sidebar-header{border-bottom:1px solid var(--border);padding:.85rem}.sidebar-title-row{color:var(--text-primary);justify-content:space-between;align-items:center;gap:8px;margin-bottom:.5rem;display:flex}.sidebar-header h2{font-size:1rem;font-weight:800}.search-container{position:relative}.search-input{border:1px solid var(--border);width:100%;color:var(--text-primary);font-family:var(--font-arabic);background:#f8fafc;border-radius:10px;padding:.4rem 2.2rem .4rem 1rem;font-size:.82rem;transition:all .3s}.search-input:focus{border-color:var(--accent);background:#fff;outline:none}.search-icon{opacity:.4;font-size:.75rem;position:absolute;top:50%;right:.8rem;transform:translateY(-50%)}.category-filter{border-bottom:1px solid var(--border);scrollbar-width:thin;scrollbar-color:var(--accent) transparent;-webkit-overflow-scrolling:touch;gap:.5rem;width:100%;padding:.6rem .85rem;display:flex;overflow:auto hidden;flex-wrap:nowrap!important}.category-filter::-webkit-scrollbar{height:3px}.category-filter::-webkit-scrollbar-thumb{background:var(--accent);border-radius:10px}.cat-btn{white-space:nowrap;color:var(--text-secondary);cursor:pointer;background:#f1f5f9;border:1px solid #0000;border-radius:8px;flex-shrink:0;align-items:center;gap:6px;padding:.3rem .75rem;font-size:.72rem;font-weight:600;transition:all .2s;display:flex}.cat-btn.active{background:var(--accent);color:#fff}.stores-list{flex-direction:column;flex:1;gap:.4rem;padding:.6rem;display:flex;overflow-y:auto}.stores-list::-webkit-scrollbar{width:4px}.stores-list::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:10px}.store-card{background:var(--bg-surface);border:1px solid var(--border);cursor:pointer;border-radius:10px;align-items:center;gap:.75rem;padding:.6rem;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.store-card:hover{border-color:var(--accent);transform:translateY(-1px);box-shadow:0 4px 12px #00000008}.store-card.selected{background:var(--accent-dim);border-color:var(--accent)}.store-img{object-fit:cover;border:1px solid var(--border);background:#f1f5f9;border-radius:8px;width:40px;height:40px}.store-info{flex:1}.store-name{margin-bottom:1px;font-size:.88rem;font-weight:700}.store-cat{color:var(--text-secondary);font-size:.72rem}.store-indicator{border-radius:4px;width:3px;height:18px;transition:all .3s}.map-section{background:var(--bg-surface);border-radius:var(--radius-md);border:1px solid var(--border);box-shadow:var(--shadow-card);flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.map-toolbar{border-bottom:1px solid var(--border);background:#fcfcfd;justify-content:space-between;align-items:center;padding:.75rem 1rem;display:flex}.map-toolbar-title{align-items:center;gap:8px;font-size:.95rem;font-weight:800;display:flex}.floor-badge{background:var(--text-primary);color:#fff;border-radius:5px;padding:1px 6px;font-size:.6rem}.map-hint{color:var(--text-secondary);font-size:.75rem;font-weight:500}.svg-wrapper{cursor:grab;background:#f8fafc;flex:1;position:relative;overflow:hidden}.svg-wrapper:active{cursor:grabbing}.svg-inner-container svg{width:100%;height:100%;display:block}.details-panel{background:var(--bg-surface);border-radius:var(--radius-md);border:1px solid var(--border);z-index:50;width:280px;padding:1rem;animation:.4s cubic-bezier(.16,1,.3,1) slideIn;position:absolute;bottom:1rem;right:1rem;box-shadow:0 15px 35px #0000001f}@keyframes slideIn{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.details-header{justify-content:space-between;align-items:flex-start;margin-bottom:.75rem;display:flex}.details-title h3{font-size:1.1rem;font-weight:800}.details-title p{color:var(--accent);font-size:.75rem;font-weight:700}.close-btn{cursor:pointer;width:24px;height:24px;color:var(--text-secondary);background:#f1f5f9;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:.9rem;transition:all .2s;display:flex}.close-btn:hover{color:var(--text-primary);background:#e2e8f0}.details-img{object-fit:contain;border:1px solid var(--border);border-radius:10px;width:100%;height:120px;margin-bottom:.75rem}.location-desc{color:var(--text-secondary);margin-bottom:1rem;font-size:.82rem;line-height:1.5}.action-btn{background:var(--accent);color:#fff;width:100%;font-family:var(--font-arabic);cursor:pointer;border:none;border-radius:10px;justify-content:center;align-items:center;gap:8px;padding:.7rem;font-size:.85rem;font-weight:700;transition:all .3s;display:flex}.store-polygon{fill:#fff;fill-opacity:.1;stroke:#cbd5e1;stroke-width:.5px;transition:all .3s}.store-polygon:hover{fill:var(--accent-dim);stroke:var(--accent);fill-opacity:.5}.route-path{filter:drop-shadow(0 0 6px var(--accent-glow))}.flowing-arrow{animation:1.5s ease-in-out infinite arrow-flow}@keyframes arrow-flow{0%,to{opacity:.4}50%{opacity:1}}.ripple{transform-origin:50%;animation:2s ease-out infinite ripple-pulse}@keyframes ripple-pulse{0%{opacity:.8;transform:scale(.5)}to{opacity:0;transform:scale(2.5)}}.ambient-glow{display:none}