/* Light Professional Theme - nxMesh Dashboard */ * { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } body { background-color: #f5f5f5; margin: 0; padding: 0; } #root { width: 100%; height: 100vh; margin: 0; padding: 0; } /* Header Styles */ .ant-layout-header { background: #ffffff !important; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06); } /* Sidebar Styles */ .ant-layout-sider { background: #fafafa !important; } .ant-menu { background: #fafafa !important; } .ant-menu-item, .ant-menu-submenu-title { color: #333 !important; transition: all 0.3s ease; } .ant-menu-item-selected { background-color: #e6f7ff !important; color: #1890ff !important; } .ant-menu-item:hover, .ant-menu-submenu-title:hover { color: #1890ff !important; } /* Content Area */ .ant-layout-content { background: #f5f5f5; } /* Card Styles */ .ant-card { border-color: #f0f0f0; border-radius: 6px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03); transition: all 0.3s ease; } .ant-card:hover { box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08); } .ant-card-head { border-bottom: 1px solid #f0f0f0; background: #fafafa; } /* Statistic Styles */ .ant-statistic-title { color: #666; font-size: 14px; margin-bottom: 8px; } .ant-statistic-content { color: #1890ff; font-weight: 600; font-size: 28px; } /* Button Styles */ .ant-btn-primary { background-color: #1890ff; border-color: #1890ff; transition: all 0.3s ease; } .ant-btn-primary:hover { background-color: #0050b3; border-color: #0050b3; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(24, 144, 255, 0.3); } /* Input Styles */ .ant-input { border-radius: 4px; border-color: #d9d9d9; } .ant-input:hover { border-color: #1890ff; } .ant-input-focused { border-color: #1890ff; box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.1); } /* Badge Styles */ .ant-badge-success { color: #52c41a; } .ant-badge-processing { color: #1890ff; } /* Typography */ h1, h2, h3, h4, h5, h6 { color: #333; font-weight: 600; } p { color: #666; line-height: 1.6; } /* Responsive Design */ @media (max-width: 768px) { .ant-layout-sider { width: 100% !important; max-width: 100% !important; } .ant-layout-content { padding: 16px !important; } .ant-card { margin-bottom: 12px; } }