:root{--primary: #111827;--primary-hover: #000000;--accent: #4F46E5;--accent-light: #EEF2FF;--secondary: #3B82F6;--success: #10B981;--success-light: #ECFDF5;--warning: #F59E0B;--danger: #EF4444;--danger-light: #FEF2F2;--bg-light: #F9FAFB;--bg-grey: #F3F4F6;--text-dark: #1F2937;--text-muted: #6B7280;--border: #E5E7EB;--border-light: #F3F4F6;--white: #ffffff;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .07);--shadow: 0 4px 6px -1px rgba(0, 0, 0, .07), 0 2px 4px -1px rgba(0, 0, 0, .04);--shadow-lg: 0 10px 25px -5px rgba(0, 0, 0, .1);--radius-sm: 6px;--radius: 10px;--radius-lg: 16px;--radius-xl: 20px}*,*:before,*:after{box-sizing:border-box}html{overflow-x:hidden;font-size:16px}body{margin:0;font-family:Inter,system-ui,-apple-system,sans-serif;background-color:var(--bg-light);color:var(--text-dark);overflow-x:hidden;-webkit-font-smoothing:antialiased}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-1{gap:.5rem}.gap-2{gap:1rem}.gap-3{gap:1.5rem}.flex-1{flex:1}.w-full{width:100%}.text-sm{font-size:.875rem}.text-xs{font-size:.75rem}.font-semibold{font-weight:600}.font-bold{font-weight:700}.text-muted{color:var(--text-muted)}.text-success{color:var(--success)}.text-danger{color:var(--danger)}.rounded{border-radius:var(--radius)}.rounded-lg{border-radius:var(--radius-lg)}.bg-white{background:#fff}.border{border:1px solid var(--border)}.page-container{max-width:1400px;margin:0 auto}.btn,button.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.6rem 1.1rem;border-radius:var(--radius);font-weight:600;font-size:.9rem;cursor:pointer;border:none;transition:all .2s;white-space:nowrap}.btn-primary{background:var(--success);color:#fff}.btn-primary:hover{background:#059669;box-shadow:0 4px 12px #10b9814d}.btn-secondary{background:#fff;border:1px solid var(--border);color:#374151}.btn-secondary:hover{background:var(--bg-light)}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover{background:#dc2626}.btn-secondary-full{background:#fff;border:1px solid var(--border);color:#374151;width:100%;padding:.75rem}.btn-confirm-print{background:#111827;color:#fff;border:none;padding:.875rem 1.5rem;border-radius:var(--radius);font-weight:700;cursor:pointer;display:flex;align-items:center;gap:.5rem}.btn-confirm-print:hover{background:#000}.card{background:#fff;border-radius:var(--radius-lg);border:1px solid var(--border);box-shadow:var(--shadow-sm)}.badge{display:inline-flex;align-items:center;padding:.2rem .65rem;border-radius:99px;font-size:.75rem;font-weight:600}.badge-success{background:var(--success-light);color:#065f46}.badge-warning{background:#fef3c7;color:#92400e}.badge-danger{background:var(--danger-light);color:#991b1b}.badge-info{background:#dbeafe;color:#1e40af}.edit-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0000008c;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1200;padding:1rem}.edit-modal-card{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);max-height:92vh;display:flex;flex-direction:column;animation:zoomIn .2s ease-out;width:100%}@keyframes zoomIn{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}.modal-title-row{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 1.5rem;border-bottom:1px solid var(--border)}.modal-title-row h2{font-size:1.15rem;font-weight:700;color:#111827;margin:0}.close-modal-btn{background:none;border:none;cursor:pointer;color:#9ca3af;display:flex;padding:4px;border-radius:50%;transition:background .2s}.close-modal-btn:hover{background:var(--bg-grey);color:#111827}.modal-body{padding:1.5rem;overflow-y:auto;flex:1}.modal-actions{display:flex;gap:.75rem;justify-content:flex-end;padding:1rem 1.5rem;border-top:1px solid var(--border);background:#f9fafb;border-radius:0 0 var(--radius-lg) var(--radius-lg)}.form-group{margin-bottom:1.1rem}.form-group label{display:block;font-size:.875rem;font-weight:600;color:#374151;margin-bottom:.4rem}.form-group input,.form-group select,.form-group textarea{width:100%;padding:.7rem .9rem;border:1px solid #D1D5DB;border-radius:var(--radius);font-size:.95rem;outline:none;transition:border-color .2s;background:#fff;color:var(--text-dark);box-sizing:border-box}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px #4f46e51a}.table-card{background:#fff;border-radius:var(--radius-lg);border:1px solid var(--border);overflow:hidden;box-shadow:var(--shadow-sm)}.data-table{width:100%;border-collapse:collapse;font-size:.9rem}.data-table th{background:#f9fafb;padding:.9rem 1rem;text-align:left;font-weight:600;color:var(--text-muted);border-bottom:1px solid var(--border);font-size:.8rem;text-transform:uppercase;letter-spacing:.03em}.data-table td{padding:.85rem 1rem;border-bottom:1px solid var(--border-light);color:var(--text-dark);vertical-align:middle}.data-table tr:hover td{background:#f9fafb}.data-table tr:last-child td{border-bottom:none}.page-header{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:1.75rem}.page-title{font-size:1.5rem;font-weight:700;color:#111827;margin:0 0 .3rem}.page-subtitle{color:var(--text-muted);margin:0;font-size:.95rem}.header-buttons{display:flex;gap:.75rem}.control-bar{display:flex;gap:.75rem;margin-bottom:1.5rem;flex-wrap:wrap}.search-wrapper{flex:1;min-width:200px;position:relative}.search-icon{position:absolute;left:.85rem;top:50%;transform:translateY(-50%);color:#9ca3af}.search-wrapper input{width:100%;padding:.7rem 1rem .7rem 2.5rem;border:1px solid var(--border);border-radius:var(--radius);font-size:.95rem;outline:none;transition:all .2s}.search-wrapper input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #4f46e514}.empty-state{text-align:center;padding:4rem 2rem;color:var(--text-muted)}.empty-state p{margin-top:.75rem;font-size:1rem}.status-badge{padding:.25rem .75rem;border-radius:99px;font-size:.75rem;font-weight:600;white-space:nowrap}.status-badge.success{background:#def7ec;color:#03543f}.status-badge.warning{background:#fff8e1;color:#92400e}.status-badge.danger{background:#fee2e2;color:#991b1b}.status-badge.info{background:#dbeafe;color:#1e40af}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.animate-in{animation:fadeIn .35s ease-out}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#9ca3af}@media(max-width:480px){.page-header{flex-direction:column;align-items:flex-start;gap:1rem;margin-bottom:1.25rem}.header-buttons{width:100%;flex-wrap:wrap}.header-buttons .btn{flex:1;min-width:120px;font-size:.82rem;padding:.65rem .75rem}.control-bar{flex-direction:column}.search-wrapper{min-width:unset}.modal-actions{flex-direction:column}.modal-actions button{width:100%;justify-content:center}.page-title{font-size:1.25rem}}@media(max-width:768px){.page-header{flex-direction:column;align-items:flex-start;gap:.75rem}.header-buttons,.control-bar{flex-wrap:wrap}.responsive-card-table thead{display:none}.responsive-card-table tbody tr{display:block;margin-bottom:1rem;background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:1rem;box-shadow:var(--shadow-sm)}.responsive-card-table td{display:flex;justify-content:space-between;align-items:center;padding:.6rem 0;border-bottom:1px solid var(--border-light);font-size:.875rem}.responsive-card-table td:last-child{border-bottom:none}.responsive-card-table td:before{content:attr(data-label);font-weight:600;font-size:.78rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.03em;flex-shrink:0;margin-right:1rem}}.app-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh}.login-container{min-height:100vh;width:100%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at top right,#e0f2fe,#f0f9ff,#fff);position:relative;overflow:hidden}.login-container:before{content:"";position:absolute;width:600px;height:600px;background:linear-gradient(135deg,#10b981,#3b82f6);border-radius:50%;top:-150px;right:-100px;opacity:.1;filter:blur(80px);z-index:0}.login-container:after{content:"";position:absolute;width:500px;height:500px;background:linear-gradient(135deg,#f59e0b,#ef4444);border-radius:50%;bottom:-100px;left:-100px;opacity:.08;filter:blur(80px);z-index:0}.login-card{background:#ffffffd9;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.6);padding:3rem;border-radius:24px;width:100%;max-width:440px;box-shadow:0 20px 40px -8px #0000001a,0 12px 20px -8px #0000000a,0 0 0 1px #ffffff80;z-index:1;animation:slideUp .6s cubic-bezier(.16,1,.3,1)}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.login-header{text-align:center;margin-bottom:2.5rem}.brand-logo{width:80px;height:80px;background:linear-gradient(135deg,#111827,#374151);border-radius:20px;display:flex;align-items:center;justify-content:center;margin:0 auto 1.5rem;color:#fff;box-shadow:0 10px 25px -5px #11182766;transition:transform .5s cubic-bezier(.34,1.56,.64,1),box-shadow .3s;cursor:pointer}.brand-logo:hover{transform:rotate(360deg) scale(1.1);box-shadow:0 15px 35px -5px #11182780}.logo-icon{transition:transform .3s}.login-header h1{font-size:1.75rem;font-weight:700;color:#111827;margin:0 0 .5rem;letter-spacing:-.025em}.login-header p{color:#6b7280;font-size:.95rem;margin:0}.form-group{margin-bottom:1.25rem}.form-group label{display:block;font-size:.875rem;font-weight:500;color:#374151;margin-bottom:.5rem}.input-wrapper{position:relative;display:flex;align-items:center}.input-wrapper svg{position:absolute;left:1rem;color:#9ca3af;pointer-events:none;transition:color .2s;z-index:1}.input-wrapper input{width:100%;padding:.875rem 1rem .875rem 3rem;border:1px solid #E5E7EB;border-radius:12px;font-size:1rem;background:#fff;transition:all .2s;outline:none}.input-wrapper input::placeholder{color:#9ca3af}.input-wrapper input:focus{background:#fff;border-color:#111827;box-shadow:0 0 0 4px #11182714}.input-wrapper:focus-within svg{color:#111827}.form-footer{display:flex;justify-content:flex-end;margin-bottom:1.5rem}.forgot-password{font-size:.875rem;color:#3b82f6;text-decoration:none;font-weight:500}.login-btn{width:100%;padding:.875rem;background:linear-gradient(135deg,#111827,#374151);color:#fff;border:none;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:transform .1s,box-shadow .2s}.login-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #00000026}.login-btn:active{transform:translateY(0)}.login-btn:disabled{opacity:.7;cursor:not-allowed}.error-alert{background:#fef2f2;border:1px solid #FCA5A5;color:#b91c1c;padding:.75rem;border-radius:8px;font-size:.875rem;margin-bottom:1rem;text-align:center}.login-meta{margin-top:2rem;text-align:center;border-top:1px solid #E5E7EB;padding-top:1.5rem}.login-meta p{font-size:.75rem;color:#9ca3af;text-transform:uppercase;letter-spacing:.05em;margin:0}@media(max-width:480px){.login-card{padding:2rem 1.5rem;border-radius:12px;max-width:90%}.brand-logo{width:64px;height:64px;border-radius:16px}.login-header h1{font-size:1.5rem}}.login-divider{display:flex;align-items:center;text-align:center;margin:1.5rem 0;color:#9ca3af;font-size:.75rem;font-weight:600}.login-divider:before,.login-divider:after{content:"";flex:1;border-bottom:1px solid #E5E7EB}.login-divider:before{margin-right:1rem}.login-divider:after{margin-left:1rem}.google-login-btn{width:100%;padding:.875rem;background:#fff;color:#374151;border:1px solid #E5E7EB;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.75rem;transition:all .2s}.google-login-btn:hover{background:#f9fafb;border-color:#d1d5db;box-shadow:0 4px 6px -1px #0000000d}.google-login-btn img{width:20px;height:20px}.shop-selection-container{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(135deg,#f9fafb,#f3f4f6);padding:2rem}.shop-selection-header{text-align:center;margin-bottom:3rem;padding:0 1rem;animation:fadeInDown .6s ease-out}.shop-selection-header h1{font-size:2.5rem;color:#111827;margin-bottom:.5rem;letter-spacing:-.025em}.shop-selection-header p{color:#6b7280;font-size:1.1rem}.shops-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;max-width:1200px;width:100%}.shop-card{background:#fff;padding:2.5rem 2rem;border-radius:16px;border:1px solid #E5E7EB;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;text-align:center;box-shadow:0 4px 6px -1px #0000000d}.shop-card:hover{transform:translateY(-8px);box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;border-color:#3b82f6}.shop-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:#e5e7eb;transition:background .3s}.shop-card:hover:before{background:#3b82f6}.shop-icon-wrapper{width:80px;height:80px;background:#f3f4f6;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:1.5rem;color:#4b5563;transition:all .3s}.shop-card:hover .shop-icon-wrapper{background:#eff6ff;color:#3b82f6;transform:scale(1.1)}.shop-name{font-size:1.5rem;font-weight:700;color:#111827;margin-bottom:.5rem}.shop-role{font-size:.9rem;color:#6b7280;font-weight:500;text-transform:uppercase;letter-spacing:.05em;margin-bottom:1.5rem}.shop-stats{display:flex;gap:1.5rem;font-size:.85rem;color:#4b5563;opacity:.8}.stat-item{display:flex;align-items:center;gap:.25rem}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@media(max-width:1024px){.shops-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.shops-grid{grid-template-columns:1fr}.shop-selection-container{padding:3rem 1rem 1rem;justify-content:flex-start}.shop-selection-header h1{font-size:1.75rem}.shop-selection-header p{font-size:1rem}.shop-card{padding:1.5rem 1rem}}.layout-container{display:flex;height:100vh;background-color:#f3f4f6;overflow:hidden}.sidebar{width:240px;background:#111827;display:flex;flex-direction:column;transition:width .3s cubic-bezier(.4,0,.2,1),transform .3s cubic-bezier(.4,0,.2,1);z-index:50;flex-shrink:0}.sidebar.closed{width:0;overflow:hidden}.sidebar-header{height:60px;display:flex;align-items:center;justify-content:space-between;padding:0 1.25rem;border-bottom:1px solid rgba(255,255,255,.08);flex-shrink:0}.logo-text{font-weight:700;font-size:1.1rem;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-nav{flex:1;padding:1rem .75rem;overflow-y:auto}.nav-group{margin-bottom:1.25rem}.group-label{font-size:.68rem;font-weight:600;color:#ffffff59;text-transform:uppercase;letter-spacing:.08em;margin-bottom:.4rem;padding-left:.75rem}.nav-item{display:flex;align-items:center;gap:.75rem;padding:.65rem .75rem;border-radius:8px;color:#ffffffa6;text-decoration:none;font-weight:500;font-size:.9rem;transition:all .18s;margin-bottom:2px}.nav-item:hover{background:#ffffff14;color:#fff}.nav-item.active{background:#ffffff1f;color:#fff}.nav-item.active svg{color:#10b981}.sidebar-footer{padding:.85rem 1rem;border-top:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:space-between;gap:.5rem}.user-info{display:flex;align-items:center;gap:.65rem;overflow:hidden}.avatar{width:34px;height:34px;background:#374151;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem;color:#fff;flex-shrink:0}.user-details{display:flex;flex-direction:column;overflow:hidden}.user-details .name{font-size:.85rem;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-details .role{font-size:.72rem;color:#ffffff80;text-transform:capitalize}.logout-btn{background:none;border:none;padding:.4rem;color:#fff6;cursor:pointer;border-radius:6px;transition:all .2s}.logout-btn:hover{background:#ffffff1a;color:#ef4444}.mobile-toggle{display:none;background:#ffffff14;border:none;cursor:pointer;padding:.4rem;border-radius:50%;color:#fff}.main-content{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}.top-bar{height:60px;background:#fff;border-bottom:1px solid #E5E7EB;display:flex;align-items:center;justify-content:space-between;padding:0 1.25rem;flex-shrink:0;box-shadow:0 1px 3px #0000000a}.sidebar-toggle{background:none;border:none;cursor:pointer;color:#4b5563;padding:.4rem;margin-left:-.4rem;border-radius:6px}.sidebar-toggle:hover{background:#f3f4f6}.header-actions{display:flex;align-items:center;gap:.75rem}.icon-btn{background:none;border:none;position:relative;cursor:pointer;color:#6b7280;padding:.4rem;border-radius:50%;transition:background .2s}.icon-btn:hover{background:#f3f4f6;color:#111827}.badge{position:absolute;top:3px;right:3px;background:#ef4444;color:#fff;font-size:.6rem;font-weight:700;min-width:15px;height:15px;border-radius:8px;display:flex;align-items:center;justify-content:center;border:2px solid white}.content-wrapper{flex:1;padding:1.5rem;overflow-y:auto;overflow-x:hidden}.notification-dropdown{position:absolute;top:56px;right:0;width:320px;max-width:calc(100vw - 1.5rem);background:#fff;border-radius:12px;box-shadow:0 10px 25px -5px #0000001f;border:1px solid #E5E7EB;z-index:1100;overflow:hidden;animation:slideDown .2s ease-out}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.notif-header{background:#f9fafb;padding:.75rem 1rem;border-bottom:1px solid #E5E7EB;font-weight:600;font-size:.9rem;color:#374151;display:flex;justify-content:space-between;align-items:center}.notif-list{max-height:320px;overflow-y:auto}.notif-item{padding:.75rem 1rem;border-bottom:1px solid #F3F4F6;display:flex;gap:.75rem;align-items:flex-start;transition:background .1s}.notif-item:hover{background:#f9fafb}.notif-item:last-child{border-bottom:none}.notif-icon{background:#fee2e2;color:#991b1b;padding:6px;border-radius:50%;flex-shrink:0}.notif-content{flex:1}.notif-title{font-size:.85rem;font-weight:600;color:#1f2937;margin-bottom:2px}.notif-msg{font-size:.78rem;color:#6b7280;line-height:1.3}.notif-time{font-size:.68rem;color:#9ca3af;margin-top:4px;display:block}.empty-notif{padding:2rem;text-align:center;color:#9ca3af;font-size:.9rem}.sidebar-overlay{display:none}@media(max-width:768px){.layout-container{flex-direction:column;overflow:hidden}.sidebar{position:fixed;height:100%;top:0;left:0;box-shadow:0 0 25px #0003;width:260px!important;transform:translate(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1);z-index:1000;overflow-y:auto}.sidebar.open{transform:translate(0)}.sidebar.closed{transform:translate(-100%);width:260px!important;overflow:visible}.sidebar-overlay{display:block;position:fixed;top:0;left:0;right:0;bottom:0;background:#00000073;z-index:999}.mobile-toggle{display:flex;align-items:center;justify-content:center}.main-content{width:100%;height:100vh}.top-bar{padding:0 1rem}.content-wrapper{padding:1rem}}@media(max-width:480px){.content-wrapper{padding:.75rem}.notification-dropdown{right:-.5rem;width:calc(100vw - 1rem)}}