:root{--sh-bg-primary:#fff;--sh-bg-secondary:#f8fafc;--sh-bg-tertiary:#f1f5f9;--sh-text-primary:#1e293b;--sh-text-secondary:#64748b;--sh-text-muted:#94a3b8;--sh-border:#e2e8f0;--sh-border-light:#f1f5f9;--sh-brand:#2563eb;--sh-brand-dark:#1d4ed8;--sh-brand-light:#eef2ff;--sh-success:#10b981;--sh-success-light:#d1fae5;--sh-warning:#f59e0b;--sh-warning-light:#fff4e5;--sh-danger:#ef4444;--sh-danger-light:#fee2e2;--sh-info:#3b82f6;--sh-info-light:#e0f2fe;--sh-purple:#7e22ce;--sh-purple-light:#f3e8ff;--sh-shadow:#0000000d;--sh-shadow-md:#0000001a;--sh-shadow-lg:#00000026;--sh-skeleton-bg:#e2e8f0;--sh-skeleton-gradient:#f1f5f9}@media (prefers-color-scheme:dark){:root{--sh-bg-primary:#1e293b;--sh-bg-secondary:#0f172a;--sh-bg-tertiary:#334155;--sh-text-primary:#f1f5f9;--sh-text-secondary:#cbd5e1;--sh-text-muted:#94a3b8;--sh-border:#334155;--sh-border-light:#1e293b;--sh-brand:#3b82f6;--sh-brand-dark:#2563eb;--sh-brand-light:#1e3a5f;--sh-success:#34d399;--sh-success-light:#064e3b;--sh-warning:#fbbf24;--sh-warning-light:#78350f;--sh-danger:#f87171;--sh-danger-light:#7f1d1d;--sh-info:#60a5fa;--sh-info-light:#1e3a5f;--sh-purple:#a855f7;--sh-purple-light:#4c1d95;--sh-shadow:#0003;--sh-shadow-md:#0000004d;--sh-shadow-lg:#0006;--sh-skeleton-bg:#334155;--sh-skeleton-gradient:#475569}}.dark-mode{--sh-bg-primary:#1e293b;--sh-bg-secondary:#0f172a;--sh-bg-tertiary:#334155;--sh-text-primary:#f1f5f9;--sh-text-secondary:#cbd5e1;--sh-text-muted:#94a3b8;--sh-border:#334155;--sh-border-light:#1e293b;--sh-brand:#3b82f6;--sh-brand-dark:#2563eb;--sh-brand-light:#1e3a5f;--sh-success:#34d399;--sh-success-light:#064e3b;--sh-warning:#fbbf24;--sh-warning-light:#78350f;--sh-danger:#f87171;--sh-danger-light:#7f1d1d;--sh-info:#60a5fa;--sh-info-light:#1e3a5f;--sh-purple:#a855f7;--sh-purple-light:#4c1d95;--sh-shadow:#0003;--sh-shadow-md:#0000004d;--sh-shadow-lg:#0006;--sh-skeleton-bg:#334155;--sh-skeleton-gradient:#475569}.light-mode{--sh-bg-primary:#fff;--sh-bg-secondary:#f8fafc;--sh-bg-tertiary:#f1f5f9;--sh-text-primary:#1e293b;--sh-text-secondary:#64748b;--sh-text-muted:#94a3b8;--sh-border:#e2e8f0;--sh-border-light:#f1f5f9;--sh-brand:#2563eb;--sh-brand-dark:#1d4ed8;--sh-brand-light:#eef2ff;--sh-success:#10b981;--sh-success-light:#d1fae5;--sh-warning:#f59e0b;--sh-warning-light:#fff4e5;--sh-danger:#ef4444;--sh-danger-light:#fee2e2;--sh-info:#3b82f6;--sh-info-light:#e0f2fe;--sh-purple:#7e22ce;--sh-purple-light:#f3e8ff;--sh-shadow:#0000000d;--sh-shadow-md:#0000001a;--sh-shadow-lg:#00000026;--sh-skeleton-bg:#e2e8f0;--sh-skeleton-gradient:#f1f5f9}.store-homepage{background:var(--sh-bg-secondary);min-height:100vh}.notification-bell{margin-right:1rem;display:inline-block;position:relative}.bell-button{cursor:pointer;color:var(--sh-text-secondary);background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;padding:.6rem;font-size:1.3rem;transition:all .3s;display:flex;position:relative}.bell-button:hover{background:var(--sh-bg-tertiary);color:var(--sh-brand);transform:scale(1.05)}.bell-button:active{transform:scale(.95)}.notification-badge{background:var(--sh-danger);color:#fff;z-index:10;border-radius:999px;justify-content:center;align-items:center;min-width:18px;height:18px;padding:0 4px;font-size:.7rem;font-weight:600;animation:.5s bounce;display:flex;position:absolute;top:-2px;right:-2px}.notification-toast{background:var(--sh-bg-primary);box-shadow:var(--sh-shadow-lg);z-index:1000;cursor:pointer;border-left:4px solid var(--sh-brand);border-radius:12px;align-items:flex-start;gap:.75rem;min-width:300px;max-width:400px;padding:1rem;animation:.3s slideInRight;display:flex;position:fixed;top:80px;right:20px}.notification-toast:hover{box-shadow:var(--sh-shadow-lg);transform:translate(-5px)}.notification-icon{flex-shrink:0;font-size:1.8rem}.notification-content{flex:1}.notification-content h4{color:var(--sh-text-primary);margin:0 0 4px;font-size:.95rem;font-weight:600}.notification-content p{color:var(--sh-text-secondary);margin:0;font-size:.85rem}.notification-content span{color:var(--sh-brand);margin-top:4px;font-size:.7rem;display:inline-block}.notification-toast .close-icon{cursor:pointer;color:var(--sh-text-muted);background:0 0;border:none;flex-shrink:0;padding:.25rem;font-size:1.2rem;transition:all .2s}.notification-toast .close-icon:hover{color:var(--sh-text-primary);background:var(--sh-bg-tertiary);border-radius:50%}.notification-dropdown{background:var(--sh-bg-primary);width:380px;max-width:calc(100vw - 40px);max-height:500px;box-shadow:var(--sh-shadow-lg);z-index:1000;border-radius:12px;animation:.2s dropdownFadeIn;position:absolute;top:calc(100% + 10px);right:0;overflow:hidden}.notification-dropdown:before{content:"";background:var(--sh-bg-primary);border-top:1px solid var(--sh-border);border-left:1px solid var(--sh-border);width:16px;height:16px;position:absolute;top:-8px;right:15px;transform:rotate(45deg);box-shadow:-2px -2px 5px #00000005}.notification-header{border-bottom:1px solid var(--sh-border);background:var(--sh-bg-primary);z-index:5;justify-content:space-between;align-items:center;padding:1rem;display:flex;position:sticky;top:0}.notification-header h4{color:var(--sh-text-primary);margin:0;font-size:1rem;font-weight:600}.mark-all-read{color:var(--sh-brand);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:.25rem .5rem;font-size:.8rem;transition:background .2s}.mark-all-read:hover{background:var(--sh-bg-tertiary)}.notification-list{max-height:400px;overflow-y:auto}.notification-item{border-bottom:1px solid var(--sh-border);cursor:pointer;align-items:center;gap:.75rem;padding:.75rem 1rem;transition:background .2s;display:flex}.notification-item:hover{background:var(--sh-bg-tertiary)}.notification-item.unread{background:var(--sh-brand-light)}.notification-item.unread:hover{background:var(--sh-info-light)}.notification-item-icon{flex-shrink:0;font-size:1.5rem}.notification-item-content{flex:1}.notification-item-title{color:var(--sh-text-primary);margin-bottom:2px;font-size:.9rem;font-weight:600}.notification-item-message{color:var(--sh-text-secondary);margin-bottom:2px;font-size:.8rem}.notification-item-time{color:var(--sh-text-muted);font-size:.7rem;display:inline-block}.notification-empty{text-align:center;color:var(--sh-text-secondary);padding:2rem;font-size:.9rem}@keyframes bounce{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}@keyframes slideInRight{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}@keyframes dropdownFadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.menu-toggle{cursor:pointer;color:var(--sh-text-primary);background:0 0;border:none;border-radius:8px;padding:.25rem 0;font-size:1.5rem;display:none}.menu-toggle:hover{background:var(--sh-bg-tertiary)}.logo h1{color:var(--sh-brand);margin:0;font-size:1.5rem;font-weight:700}.header-nav{gap:1.5rem;display:flex}.nav-link{color:var(--sh-text-secondary);border-bottom:2px solid #0000;padding:.5rem 0;font-weight:500;text-decoration:none;transition:all .2s}.nav-link:hover{color:var(--sh-brand)}.nav-link.active{color:var(--sh-brand);border-bottom-color:var(--sh-brand)}.header-right{align-items:center;gap:1rem;display:flex}.icon-button{cursor:pointer;color:var(--sh-text-secondary);background:0 0;border:none;border-radius:8px;padding:.5rem;font-size:1.2rem;position:relative}.icon-button:hover{background:var(--sh-bg-tertiary);color:var(--sh-brand)}.user-button{background:var(--sh-bg-tertiary);border:1px solid var(--sh-border);cursor:pointer;border-radius:8px;align-items:center;gap:.5rem;padding:.5rem;display:flex}.user-avatar{font-size:1.1rem}.user-name{color:var(--sh-text-primary);font-size:.9rem;font-weight:500}.dropdown-arrow{color:var(--sh-text-secondary);font-size:.8rem}.store-layout{height:calc(100vh - 140px);display:flex}.store-sidebar{background:var(--sh-bg-secondary);border-right:1px solid var(--sh-border);flex-direction:column;justify-content:space-between;width:260px;height:calc(100vh - 140px);transition:width .3s;display:flex;position:sticky;top:0}.sidebar-nav{padding:1.5rem 0}.sidebar-item{color:var(--sh-text-secondary);align-items:center;gap:1rem;padding:.75rem 1.5rem;text-decoration:none;transition:all .2s;display:flex;position:relative}.sidebar-item:hover{background:var(--sh-bg-tertiary);color:var(--sh-brand)}.sidebar-item.active{background:var(--sh-brand-light);color:var(--sh-brand);border-left:3px solid var(--sh-brand)}.item-icon{min-width:24px;font-size:1.2rem}.item-label{color:inherit;flex:1;font-size:.95rem;font-weight:500}.item-badge{background:var(--sh-brand-light);color:var(--sh-brand);border-radius:999px;padding:.2rem .5rem;font-size:.75rem;font-weight:600}.sidebar-footer{border-top:1px solid var(--sh-border);justify-content:center;align-items:center;padding:1rem 1.5rem;display:flex}.store-main{background:var(--sh-bg-secondary);flex:1;padding:1rem;overflow-y:auto}.page-header{justify-content:space-between;align-items:center;margin-bottom:.5rem;display:flex}.page-info{flex-direction:column;align-items:flex-start;gap:.25rem;display:flex}.store-page-title{color:var(--sh-text-primary);font-size:2rem;font-weight:600}.page-subtitle{color:var(--sh-text-secondary);margin:0}.page-actions{justify-content:center;align-items:center;gap:.75rem;padding:1rem 0;display:flex}.primary-btn{background:var(--sh-brand);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:.5rem 1rem;font-weight:500;transition:all .2s}.primary-btn:hover{background:var(--sh-brand-dark);transform:translateY(-1px)}.header-actions{gap:.75rem;display:flex}.dashboard-stats{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin-bottom:1rem;display:grid}.stat-card{background:var(--sh-bg-primary);border:1px solid var(--sh-border);text-align:center;border-radius:10px;flex-direction:column;justify-content:space-between;align-items:center;padding:.75rem;transition:transform .2s,box-shadow .2s;display:flex}.stat-card.clickable{cursor:pointer}.stat-card:hover{box-shadow:var(--sh-shadow-md);transform:translateY(-2px)}.stat-header{color:var(--sh-text-secondary);justify-content:center;align-items:center;margin-bottom:.5rem;display:flex}.stat-icon{font-size:1.5rem}.trend-badge{border-radius:999px;padding:.25rem .5rem;font-size:.75rem}.trend-badge.trend-up{background:var(--sh-success-light);color:var(--sh-success)}.trend-badge.trend-down{background:var(--sh-danger-light);color:var(--sh-danger)}.stat-title{color:var(--sh-text-secondary);margin:0 0 .25rem;font-size:.875rem}.stat-value{color:var(--sh-text-primary);margin:0;font-size:1.5rem;font-weight:600}.dashboard-orders{background:var(--sh-bg-primary);border:1px solid var(--sh-border);border-radius:10px;margin-bottom:2rem;padding:1rem}.section-header{justify-content:space-between;align-items:center;margin-bottom:1.5rem;display:flex}.section-header h2{color:var(--sh-text-primary);margin:0;font-size:1.1rem}.view-all-btn{color:var(--sh-brand);cursor:pointer;background:0 0;border:none;font-size:.875rem;font-weight:500;text-decoration:none}.view-all-btn:hover{text-decoration:underline}.order-row{border:1px solid var(--sh-border);border-radius:8px;flex-direction:column;gap:.5rem;margin-bottom:.5rem;padding:.75rem;transition:background .2s;display:flex}.order-row:hover{background:var(--sh-bg-tertiary)}.order-row-info-header{flex-direction:row;justify-content:center;align-items:center;gap:1rem;width:100%;display:flex}.order-row-info-header h2{color:var(--sh-brand);margin:0;font-size:.9rem}.order-row-info{flex-direction:row;justify-content:space-between;align-items:center;gap:1rem;width:100%;display:flex}.order-id{color:var(--sh-text-primary);font-weight:600}.order-date{color:var(--sh-text-secondary);font-size:.75rem}.order-customer{flex-direction:column;display:flex}.customer-name{color:var(--sh-text-primary);font-weight:500}.order-items{color:var(--sh-text-secondary);font-size:.75rem}.status{text-transform:capitalize;border-radius:999px;width:fit-content;padding:.25rem .75rem;font-size:.75rem;font-weight:500}.status-pending{background:var(--sh-warning-light);color:var(--sh-warning)}.status-processing{background:var(--sh-info-light);color:var(--sh-info)}.status-delivered{background:var(--sh-success-light);color:var(--sh-success)}.status-dispatched{background:var(--sh-info-light);color:var(--sh-info)}.status-cancelled,.status-refunded{background:var(--sh-danger-light);color:var(--sh-danger)}.status-picked_up{background:var(--sh-success-light);color:var(--sh-success)}.status-confirmed{background:var(--sh-purple-light);color:var(--sh-purple)}.payment-status{border-radius:999px;padding:.2rem .5rem;font-size:.7rem;font-weight:500;display:inline-block}.payment-status.paid{background:var(--sh-success-light);color:var(--sh-success)}.payment-status.pending{background:var(--sh-warning-light);color:var(--sh-warning)}.payment-status.failed{background:var(--sh-danger-light);color:var(--sh-danger)}.payment-status.refunded{background:var(--sh-brand-light);color:var(--sh-brand)}.order-total{color:var(--sh-text-primary);font-weight:600}.order-actions{justify-content:flex-end;gap:.5rem;display:flex}.action-btn{border:1px solid var(--sh-border);cursor:pointer;color:var(--sh-text-secondary);background:0 0;border-radius:8px;padding:.25rem .5rem;transition:all .2s}.action-btn:hover{background:var(--sh-bg-tertiary);border-color:var(--sh-brand);color:var(--sh-brand)}.quick-add{background:var(--sh-brand);color:#fff;cursor:pointer;border:none;border-radius:8px;width:100%;margin-top:.5rem;padding:.5rem 1rem;font-size:.8rem;font-weight:500;transition:background .2s}.quick-add:hover{background:var(--sh-brand-dark)}.orders-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem;display:grid}.skeleton{background:linear-gradient(90deg, var(--sh-skeleton-bg) 25%, var(--sh-skeleton-gradient) 50%, var(--sh-skeleton-bg) 75%);background-size:200% 100%;border-radius:8px;animation:1.5s ease-in-out infinite skeleton-pulse}@keyframes skeleton-pulse{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton-title{border-radius:4px;width:60%;height:24px;margin-bottom:12px}.skeleton-text{border-radius:4px;width:80%;height:16px;margin-bottom:8px}.skeleton-button{border-radius:8px;width:100px;height:36px;margin-top:12px}.loading-more{text-align:center;grid-column:1/-1;padding:2rem}.loading-spinner{border:3px solid var(--sh-border);border-top:3px solid var(--sh-brand);border-radius:50%;width:40px;height:40px;margin:0 auto 1rem;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.load-more-trigger{grid-column:1/-1;height:20px;margin:1rem 0}.end-of-orders{text-align:center;color:var(--sh-text-muted);grid-column:1/-1;padding:2rem;font-size:.9rem}.no-orders{text-align:center;background:var(--sh-bg-primary);color:var(--sh-text-secondary);border-radius:8px;grid-column:1/-1;padding:3rem}@media (max-width:768px){.menu-toggle{display:block}.page-info{flex-direction:column;justify-content:center;align-items:center;gap:.75rem;display:flex}.page-actions{justify-content:center;align-items:center;gap:.75rem;width:100%;padding:1rem 0;display:flex}.header-nav{display:none}.store-sidebar{z-index:90;height:calc(100vh - 60px);transition:left .3s;position:fixed;top:60px;bottom:0;left:-260px}.sidebar-collapsed .store-sidebar{left:0}.store-main{padding:1rem}.page-header{flex-direction:column;justify-content:center;align-items:center;gap:1rem}.orders-grid{grid-template-columns:1fr}.notification-dropdown{z-index:1001;border-radius:0;width:100%;max-width:100%;max-height:calc(100vh - 60px);margin-top:0;animation:.3s slideUp;position:fixed;inset:60px 0 0}.notification-dropdown:before{display:none}.notification-toast{z-index:1002;min-width:auto;max-width:calc(100% - 40px);padding:.75rem;position:fixed;inset:auto 20px 20px}}@keyframes slideUp{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@media (max-width:480px){.page-actions{justify-content:center;align-items:center;gap:.75rem;width:100%;padding:1rem 0;display:flex}.page-header{flex-direction:column;justify-content:center;align-items:center;gap:1rem}.store-main{padding:.5rem}.stat-value{font-size:1.2rem}.store-page-title{font-size:1.5rem}.dashboard-stats{grid-template-columns:repeat(2,1fr)}.notification-bell{margin-right:.25rem}.bell-button{width:32px;height:32px;padding:.4rem;font-size:1rem}.notification-badge{min-width:14px;height:14px;font-size:.55rem;top:-5px;right:-5px}}