.stat-card{background:var(--background);border:1px solid rgba(114,114,114,.1);border-radius:.8rem;padding:1.2rem 1.6rem;text-align:left;transition:all .2s ease;display:flex;flex-direction:column;justify-content:space-between;gap:.4rem;background:#fff;box-shadow:0 2px 8px #0000001a;min-width:16rem}.stat-card-header{display:flex;align-items:center;gap:.4rem}.stat-icon{font-size:1.4rem}.stat-title{font-size:1rem;font-weight:600}.stat-value-container{display:flex;justify-content:space-between;align-items:flex-end}.stat-value{font-size:1.6rem;font-weight:700;color:var(--text-color)}.stat-trend{font-size:.8rem;font-weight:500;display:flex;align-items:center;gap:.2rem;justify-content:end}.stat-trend.up{color:green}.stat-trend.down{color:red}.modal-wrapper{position:fixed;top:0;left:0;width:100%;height:100%;padding:0 1rem;background-color:#000c;display:flex;flex-direction:column;justify-content:center;align-items:center}.modal-wrapper .modal{background-color:#fff;border-radius:.8rem;display:flex;flex-direction:column;justify-content:center;align-items:center}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:1rem;gap:2rem;width:100%}.modal-title{display:flex;flex-direction:column;justify-content:center;align-items:start}.modal-title h2{font-size:1.4rem;font-weight:600}.modal-title p{font-size:1rem;color:var(--text-color-sec)}.modal-header button{background:transparent;font-size:1.6rem;width:2.4rem;height:2.4rem;border-radius:.8rem;border:none;color:var(--text-color);display:flex;justify-content:center;align-items:center}.modal-body{padding:1rem;width:100%;max-height:70vh;overflow-y:auto}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.8rem}.divider{width:100%;height:1px;background-color:var(--text-color-sec);color:var(--text-color-sec);margin:.8rem 0}.user-info h3{font-size:1.2rem;font-weight:600;margin-bottom:.4rem}@media (max-width: 768px){.grid{grid-template-columns:repeat(1,1fr)}}:root{--background: #fffbf7;--primary-blue: #2563eb;--border-color: #3b82f6;--text-color: #222222;--text-color-sec: #666}*{box-sizing:border-box;margin:0;padding:0}html{background-color:var(--background);color:var(--text-color);font-family:Inter,Helvetica,sans-serif}.main-container{width:100%;display:grid;place-items:center}.dashboard-wrapper{width:100%;height:100%;display:grid;place-items:center;gap:1rem;max-width:1500px}.filters{display:flex;justify-content:space-between;align-items:center;width:100%}.filters h3{font-size:1.2rem;font-weight:600;color:var(--text-color);width:100%}.filter-group{display:flex;gap:1rem;padding:1rem 0;width:100%}.user-listing-wrapper{width:100%;width:80%;overflow-x:auto}.table{background:#fff;box-shadow:0 2px 8px #0000001a;border-radius:.8rem;border-collapse:collapse;width:100%}input,select{border:1px solid var(--border-color);border-radius:.8rem;color:var(--text-color);font-size:1rem;padding:.4rem .8rem}.filtered-wrapper{display:flex;justify-content:center;align-items:center;gap:.4rem;width:fit-content;text-wrap:nowrap;min-height:2rem;border:1px solid var(--border-color);border-radius:.8rem;padding:0 .8rem;color:var(--text-color)}.filtered-wrapper input,.filtered-wrapper label{width:fit-content}input::placeholder{color:var(--text-color);opacity:.8}.table-header th{text-align:left;padding:.8rem;background-color:#f0f4ff;color:var(--text-color);font-size:1rem;border-bottom:1px solid #e5e7eb;text-wrap:nowrap}.table-body td{padding:.8rem;font-size:1rem;border-bottom:1px solid #f3f4f6}.table-body tr:hover{background-color:#f9fafb}button{background-color:var(--primary-blue);border:none;color:#fff;padding:.6rem 1.2rem;border-radius:.6rem;font-size:1rem;cursor:pointer}button:disabled{background-color:#93c5fd;cursor:not-allowed}.pagination{display:flex;gap:.4rem;padding:1rem;justify-content:center;align-items:center}.pagination-dots{padding:0rem 2rem;font-size:1.6rem;color:var(--primary-blue)}.user-card{padding:.8rem;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.user-name{font-size:1rem;font-weight:700;color:var(--text-color)}.user-email{font-size:.8rem;color:var(--text-color-sec)}.status-card{background-color:var(--background);border-radius:.4rem;padding:.3rem .2rem;display:flex;justify-content:center;align-items:center;font-size:.8rem;width:4rem}.status-card.active{background-color:var(--primary-blue);color:#fff}.status-card.expired{background-color:red;color:#fff}.dashboard-container{display:flex;flex-direction:column;width:100%;width:80%;gap:1rem}.dashboard-container h1{font-size:1.6rem;font-weight:700;color:var(--text-color);width:100%;padding-top:1rem}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.chart-wrapper{border-radius:.8rem}.chart-wrapper h3{font-size:1.2rem;font-weight:600;color:var(--text-color);width:100%;padding:1rem 0}.chart{background:#fff;padding:1rem;border-radius:.8rem;box-shadow:0 2px 8px #0000001a}.no-data{width:100%;height:100%;font-size:1.2rem;color:var(--text-color);height:80vh}.name-header{cursor:pointer;display:flex;gap:.4rem;align-items:center}.table-wrapper{min-height:80vh}@media (max-width: 1024px){.dashboard-container{width:100%;padding:0 1rem}.user-listing-wrapper{width:100%;padding:0 1rem;overflow-x:auto}.filters{flex-direction:column}.filter-group{flex-wrap:wrap;gap:.4rem}.table-wrapper{width:100%;overflow-x:auto}.stat-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 768px){.stat-grid{grid-template-columns:repeat(1,1fr)}.user-card{padding:.2rem}.filter-group>*{width:100%}.pagination{width:100%;flex-wrap:wrap;padding:1rem 0;gap:.2rem;border-radius:.4rem}.pagination button{padding:.4rem .6rem}.pagination-dots{padding:.2rem}}