/* Admin Panel Layout */ .admin-panel-body { min-height: 100vh; background: var(--background); padding: 2rem 1rem; display: flex; justify-content: center; } .admin-panel-container { max-width: 1200px; width: 100%; margin: 0 auto; padding: 0 1rem; } .admin-panel-title { font-size: 2rem; font-weight: 600; color: var(--text-primary); text-align: center; margin-bottom: 2rem; } /* Tabs */ .admin-tabs { display: flex; gap: 0.5rem; border-bottom: 2px solid var(--border); margin-bottom: 2rem; } .admin-tab { padding: 0.75rem 1.5rem; background: none; border: none; border-bottom: 3px solid transparent; color: var(--text-secondary); font-size: 1rem; font-weight: 500; cursor: pointer; transition: all 0.2s; } .admin-tab:hover { color: var(--text-primary); background: var(--card-hover); } .admin-tab.active { color: var(--primary); border-bottom-color: var(--primary); } /* Content Area */ .admin-content { animation: fadeIn 0.3s ease-in; } @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } } /* Users Section */ .users-section { max-width: 800px; margin: 0 auto; display: flex; flex-direction: column; gap: 1rem; } /* Responsive */ @media (max-width: 768px) { .admin-panel-body { padding: 1rem 0.75rem; } .admin-panel-title { font-size: 1.75rem; } .admin-tab { padding: 0.65rem 1rem; font-size: 0.9rem; } } @media (max-width: 480px) { .admin-panel-body { padding: 1rem 0.5rem; } .admin-panel-title { font-size: 1.5rem; } .admin-tab { padding: 0.5rem 0.75rem; font-size: 0.85rem; } }