@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&family=Sarabun:wght@300;400;500;600;700&display=swap";:root{--sans:"Outfit", "Sarabun", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;font-family:var(--sans);color:#f1f5f9;background-color:#0b0f19}*{box-sizing:border-box;margin:0;padding:0}body{background-color:#0b0f19;min-height:100vh;margin:0;padding:0}#root{width:100%;min-height:100vh}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#0f172a}::-webkit-scrollbar-thumb{background:#334155;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#475569}.login-page{background:radial-gradient(circle at 100% 0,#f9731626,#0000 40%),radial-gradient(circle at 0 100%,#06b6d41f,#0000 40%),#070a13;justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.login-card{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);text-align:center;background:#0f172ab3;border:1px solid #ffffff14;border-radius:24px;width:100%;max-width:440px;padding:40px;box-shadow:0 20px 40px #0006}.login-logo{background:linear-gradient(135deg,#f97316,#fb923c);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:8px;font-size:3rem;font-weight:800}.login-title{color:#f1f5f9;margin-bottom:8px;font-size:1.5rem;font-weight:700}.login-subtitle{color:#94a3b8;margin-bottom:32px;font-size:.875rem}.input-group{text-align:left;margin-bottom:20px}.input-label{color:#cbd5e1;margin-bottom:8px;font-size:.875rem;font-weight:500;display:block}.input-wrapper{position:relative}.input-field{color:#f8fafc;background:#0f172a99;border:1px solid #ffffff1a;border-radius:12px;width:100%;padding:12px 16px;font-family:inherit;font-size:.95rem;transition:all .25s}.input-field:focus{background:#0f172ae6;border-color:#f97316;outline:none;box-shadow:0 0 0 3px #f9731633}.input-field-with-btn{gap:8px;display:flex}.btn-primary{color:#fff;cursor:pointer;background:linear-gradient(135deg,#f97316,#ea580c);border:none;border-radius:12px;width:100%;padding:12px 24px;font-size:1rem;font-weight:600;transition:all .25s;box-shadow:0 4px 12px #f973164d}.btn-primary:hover{background:linear-gradient(135deg,#fb923c,#f97316);transform:translateY(-2px);box-shadow:0 6px 16px #f9731666}.btn-primary:active{transform:translateY(0)}.btn-secondary{color:#e2e8f0;cursor:pointer;background:#33415599;border:1px solid #ffffff14;border-radius:12px;padding:12px 20px;font-size:.95rem;font-weight:500;transition:all .25s}.btn-secondary:hover{color:#fff;background:#475569cc}.btn-action-icon{color:#94a3b8;cursor:pointer;background:#0f172a99;border:1px solid #ffffff14;border-radius:8px;justify-content:center;align-items:center;padding:8px;transition:all .2s;display:inline-flex}.btn-action-icon:hover{color:#f1f5f9;background:#33415599}.btn-status-active{color:#10b981;cursor:pointer;background:#10b9811a;border:1px solid #10b98133;border-radius:8px;padding:6px 12px;font-size:.825rem;font-weight:600;transition:all .2s}.btn-status-active:hover{background:#10b98133}.btn-status-inactive{color:#ef4444;cursor:pointer;background:#ef44441a;border:1px solid #ef444433;border-radius:8px;padding:6px 12px;font-size:.825rem;font-weight:600;transition:all .2s}.btn-status-inactive:hover{background:#ef444433}.error-message{color:#fca5a5;text-align:left;background:#ef44441a;border-left:4px solid #ef4444;border-radius:8px;margin-bottom:20px;padding:12px;font-size:.875rem}.success-message{color:#a7f3d0;text-align:left;background:#10b9811a;border-left:4px solid #10b981;border-radius:8px;margin-bottom:20px;padding:12px;font-size:.875rem}.dashboard-layout{min-height:100vh;display:flex}.sidebar{background:#090d16;border-right:1px solid #ffffff0d;flex-direction:column;width:280px;padding:30px 24px;display:flex}.sidebar-logo{align-items:center;gap:12px;margin-bottom:40px;display:flex}.sidebar-logo-text{color:#f1f5f9;letter-spacing:-.5px;font-size:1.4rem;font-weight:800}.sidebar-logo-sub{color:#f97316}.sidebar-menu{flex-direction:column;flex-grow:1;gap:8px;display:flex}.menu-item{color:#94a3b8;cursor:pointer;border-radius:12px;align-items:center;gap:12px;padding:12px 16px;font-weight:500;text-decoration:none;transition:all .2s;display:flex}.menu-item:hover,.menu-item.active{color:#f97316;background:#f9731614}.sidebar-user{border-top:1px solid #ffffff0d;margin-top:auto;padding-top:20px}.user-info{flex-direction:column;gap:4px;margin-bottom:12px;display:flex}.user-name{color:#cbd5e1;font-size:.95rem;font-weight:600}.user-role{color:#64748b;text-transform:uppercase;letter-spacing:.5px;font-size:.8rem}.btn-logout{color:#f87171;cursor:pointer;background:0 0;border:1px solid #ef444433;border-radius:10px;justify-content:center;align-items:center;gap:8px;width:100%;padding:10px;font-weight:500;transition:all .2s;display:flex}.btn-logout:hover{color:#ef4444;background:#ef44441a}.main-content{background:#0f131f;flex-grow:1;max-height:100vh;padding:40px;overflow-y:auto}.content-header{justify-content:space-between;align-items:center;margin-bottom:32px;display:flex}.content-title{color:#f8fafc;font-size:2rem;font-weight:700}.summary-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;margin-bottom:32px;display:grid}.summary-card{background:#0f172a80;border:1px solid #ffffff0d;border-radius:20px;align-items:center;gap:20px;padding:24px;display:flex}.card-icon{border-radius:16px;justify-content:center;align-items:center;width:54px;height:54px;font-size:1.5rem;display:flex}.icon-blue{color:#3b82f6;background:#3b82f61a}.icon-green{color:#10b981;background:#10b9811a}.icon-yellow{color:#f59e0b;background:#f59e0b1a}.icon-red{color:#ef4444;background:#ef44441a}.card-info{flex-direction:column;gap:4px;display:flex}.card-label{color:#94a3b8;font-size:.875rem;font-weight:500}.card-value{color:#f8fafc;font-size:1.75rem;font-weight:700}.section-card{background:#0f172a66;border:1px solid #ffffff0d;border-radius:24px;padding:30px;box-shadow:0 10px 30px #0003}.table-header-actions{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.search-input-wrapper{width:100%;max-width:320px;position:relative}.search-input{color:#e2e8f0;background:#0f172a99;border:1px solid #ffffff14;border-radius:10px;width:100%;padding:10px 16px 10px 40px;font-size:.9rem}.search-input:focus{border-color:#f97316;outline:none}.search-icon{color:#64748b;pointer-events:none;position:absolute;top:50%;left:14px;transform:translateY(-50%)}.table-wrapper{overflow-x:auto}.shops-table{border-collapse:collapse;text-align:left;width:100%}.shops-table th{color:#94a3b8;border-bottom:1px solid #ffffff0f;padding:16px 20px;font-size:.875rem;font-weight:600}.shops-table td{color:#cbd5e1;border-bottom:1px solid #ffffff0a;padding:18px 20px;font-size:.95rem}.shops-table tr:hover td{background:#ffffff03}.shop-code-cell{color:#e2e8f0;background:#ffffff0d;border-radius:6px;align-items:center;gap:8px;padding:4px 8px;font-family:ui-monospace,monospace;font-size:.85rem;display:inline-flex}.btn-copy{color:#64748b;cursor:pointer;background:0 0;border:none;transition:color .2s;display:flex}.btn-copy:hover{color:#cbd5e1}.badge{letter-spacing:.2px;border-radius:9999px;align-items:center;padding:4px 10px;font-size:.775rem;font-weight:600;display:inline-flex}.badge-active{color:#34d399;background:#10b9811a;border:1px solid #10b98133}.badge-suspended{color:#94a3b8;background:#64748b1a;border:1px solid #64748b33}.badge-expired{color:#f87171;background:#ef44441a;border:1px solid #ef444433}.actions-cell{align-items:center;gap:8px;display:flex}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1000;background:#070a13d9;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal-card{background:#0f172a;border:1px solid #ffffff14;border-radius:24px;width:100%;max-width:520px;animation:.3s cubic-bezier(.16,1,.3,1) modalEnter;overflow:hidden;box-shadow:0 25px 50px -12px #00000080}@keyframes modalEnter{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.modal-header{border-bottom:1px solid #ffffff0d;justify-content:space-between;align-items:center;padding:24px 30px;display:flex}.modal-title{color:#f8fafc;font-size:1.25rem;font-weight:700}.btn-close{color:#64748b;cursor:pointer;background:0 0;border:none;transition:color .2s}.btn-close:hover{color:#94a3b8}.modal-body{padding:30px}.modal-footer{background:#0f172a66;border-top:1px solid #ffffff0d;justify-content:flex-end;gap:12px;padding:20px 30px;display:flex}.select-field{color:#f8fafc;cursor:pointer;appearance:none;background:#0f172a99 url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") right 16px center/16px no-repeat;border:1px solid #ffffff1a;border-radius:12px;width:100%;padding:12px 40px 12px 16px;font-family:inherit;font-size:.95rem}.select-field:focus{border-color:#f97316;outline:none}.btn-randomize{color:#f97316;cursor:pointer;white-space:nowrap;background:#f973161a;border:1px solid #f9731633;border-radius:12px;padding:12px 16px;font-size:.9rem;font-weight:600;transition:all .2s}.btn-randomize:hover{background:#f973162e}.shops-grid{grid-template-columns:1fr;gap:20px;margin-top:16px;display:grid}@media (width>=640px){.shops-grid{grid-template-columns:repeat(2,1fr)}}@media (width>=1024px){.shops-grid{grid-template-columns:repeat(3,1fr)}}@media (width>=1440px){.shops-grid{grid-template-columns:repeat(4,1fr)}}.btn-copy-card-header{color:#f97316;cursor:pointer;background:#f973161a;border:1px solid #f9731633;border-radius:8px;justify-content:center;align-items:center;padding:8px;transition:all .2s;display:inline-flex}.btn-copy-card-header:hover{color:#fb923c;background:#f9731633;transform:scale(1.05)}.shop-card{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0f172a66;border:1px solid #ffffff0d;border-radius:20px;flex-direction:column;gap:16px;padding:24px;transition:all .25s cubic-bezier(.4,0,.2,1);display:flex;box-shadow:0 8px 24px #00000040}.shop-card:hover{border-color:#f973164d;transform:translateY(-4px);box-shadow:0 12px 32px #f9731626}.shop-card-header{border-bottom:1px solid #ffffff0d;justify-content:space-between;align-items:center;padding-bottom:12px;display:flex}.shop-card-title{color:#f8fafc;font-size:1.15rem;font-weight:700}.shop-card-body{flex-direction:column;gap:10px;font-size:.9rem;display:flex}.shop-card-row{justify-content:space-between;align-items:center;display:flex}.shop-card-label{color:#64748b;font-weight:500}.shop-card-value{color:#e2e8f0;font-weight:600}.shop-card-actions{flex-wrap:wrap;gap:8px;margin-top:8px;display:flex}.shop-card-actions button{border-radius:10px;flex:1;min-width:calc(50% - 4px);padding:10px;font-size:.85rem}.bottom-nav{z-index:1000;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#090d16;border-top:1px solid #ffffff0f;justify-content:space-around;align-items:center;width:100%;height:68px;padding:0 16px;display:none;position:fixed;bottom:0;left:0;box-shadow:0 -10px 30px #00000080}.bottom-nav-item{color:#94a3b8;cursor:pointer;background:0 0;border:none;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:4px;height:100%;font-size:.725rem;font-weight:600;transition:all .2s;display:flex}.bottom-nav-item svg{width:20px;height:20px}.bottom-nav-item:hover,.bottom-nav-item.active{color:#f97316}@media (width<=768px){.sidebar{display:none!important}.bottom-nav{display:flex}.dashboard-layout{flex-direction:column;padding-bottom:74px}.main-content{padding:24px 16px!important}.content-header{flex-direction:column;align-items:stretch;gap:16px;margin-bottom:24px}.content-header .btn-primary{width:100%!important}}