@import"https://fonts.googleapis.com/css2?family=SF+Pro+Display:wght@400;500;600&display=swap";:root{--primary-color: #6B46C1;--background-color: #F3F4F6;--card-background: #FFFFFF;--text-primary: #1F2937;--text-secondary: #6B7280}.app-container{font-family:SF Pro Display,-apple-system,BlinkMacSystemFont,sans-serif;max-width:430px;margin:0 auto;background:var(--background-color);min-height:100vh;padding:20px}.header{margin-bottom:24px}.user-info h1{color:var(--primary-color);font-size:24px;margin-bottom:8px}.user-details{display:flex;justify-content:space-between;align-items:center}.status-button{background:var(--primary-color);color:#fff;border:none;padding:8px 16px;border-radius:20px;font-size:14px}.stats-container{background:var(--card-background);border-radius:16px;padding:20px;margin-bottom:24px;box-shadow:0 1px 3px #0000001a}.quick-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}.stat-card{text-align:center}.stat-card .number{font-size:24px;font-weight:600;color:var(--primary-color)}.stat-card .label{font-size:12px;color:var(--text-secondary)}.time-filter{display:flex;gap:12px;margin-bottom:24px}.time-filter button{background:var(--card-background);border:none;padding:8px 16px;border-radius:20px;color:var(--text-secondary)}.time-filter button.active{background:var(--primary-color);color:#fff}.appointment-cards{background:var(--card-background);border-radius:16px;padding:16px}.appointment-card{display:flex;align-items:center;gap:16px;padding:16px;border-radius:12px;background:var(--background-color)}.avatar{width:48px;height:48px;border-radius:24px;display:flex;justify-content:center;align-items:center;font-size:24px}.appointment-info h3{margin:0;font-size:16px}.incall-tag{background:#6b46c11a;color:var(--primary-color);padding:4px 8px;border-radius:12px;font-size:12px}.status{font-size:12px}.status.confirmed{color:#10b981}.bottom-nav{position:fixed;bottom:0;left:0;right:0;background:var(--card-background);display:flex;justify-content:space-around;padding:16px;box-shadow:0 -1px 3px #0000001a}.bottom-nav button{border:none;background:none;display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--text-secondary)}.bottom-nav button .icon{font-size:24px}.bottom-nav button span{font-size:12px}